@charset "UTF-8";
/* base 
-----------------------------------*/
html {
font-size:100%;
}
body {
color:#666;
text-align:center;
font-family:Raleway, "Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
line-height:1.25;
}
*, *::before, *::after {
box-sizing:border-box;
}

@media screen and (max-width: 999px) {
#container {
width: 100%;
position:relative;
}
}
@media screen and (min-width: 1000px) {
#container {
width: 1000px;
margin: 0 auto;
position:relative;
}
}

section table   { width: 100%; }
section th, section td  { padding: 10px; border: 1px solid #ddd; }
section th  {
background: #f4f4f4;
}
 
 
/*----------------------------------------------------
.standard
----------------------------------------------------*/
td,th {
font-size:0.85rem;
line-height:125%;
}
.standard th  {
width: 30%;
text-align: left;
}

@media only screen and (max-width:480px){
.standard {
margin: 0;
}
.standard th,
.standard td{
width: 100%;
display: block;
border-top: none;
}
.standard tr:first-child th {
border-top: 1px solid #ddd;
}
}
p {
margin:20px 0 30px 0;
font-size:0.85rem;
line-height:125%;
color:#666;
}

#heiretsu dl:after {
content: "";
display: block;
clear: both;
height: 0;
}

#heiretsu dt {
clear: left;
float: left;
width: 20%;
font-size:0.85em;
padding:0.5em 0;
margin:0;
text-align: right;
border-bottom:#CCC dotted 1px;
}

#heiretsu dt:after {
content: "：";
}

#heiretsu dd {
float: left;
width:60%;
padding:0.5em 0 0.5em 3em;
margin:0;
font-size:0.85em;
text-align:left;
border-bottom:#CCC dotted 1px;
}



@media screen and (max-width: 999px) {
p {
margin:20px 5px 30px 5px;
font-size:0.85rem;
line-height:125%;
}
#heiretsu dl {
position:relative;
}

#heiretsu dt {
clear:both;
float:none;
width:100%;
border-bottom:none;
text-align:left;
padding:0.5em;
}
#heiretsu dd {
clear:both;
float:none;
width:100%;
padding:0.5em;
margin:0 0 10px 0;
}
}


a {
color:#28c;
text-decoration:none;
}
a:hover {
color:#09d;
}
a,
button,
img {
outline:none;
}
a:hover img{
opacity:0.5;
-moz-opacity:0.5;
filter:alpha(opacity = 50);
}

nav ul {
list-style:none;
margin:0;
padding:0;
}
hr {
height:0px;
border:1px solid #ddd;
border-width:1px 0 0;
margin:auto;
}


/*構造
-------------------------------------------------*/
.center-box {
text-align:left;
background:#FFF;
overflow:hidden;
border-right:#f2f2f2 1px solid;
border-bottom:#f2f2f2 1px solid;
}
.center-box img {
max-width:100%;
height:auto;
}

@media only screen and (min-width:961px){
.white-text-center {
clear:both;
padding:20px 30px;
margin:5px 0;
background:#fafafa;
color:#333;
overflow:hidden;
line-height:1.5;
}
.white-text-center img {
float:left;
margin:0 20px 20px 0;
max-width:100%;
height:auto;
}
.black-text-center {
clear:both;
padding:20px 30px;
margin:5px 0;
background:#fafafa;
color:#333;
overflow:hidden;
line-height:1.5;
}
.black-text-center img {
float:left;
margin:0 20px 20px 0;
max-width:100%;
height:auto;
}
.green-text-left {
clear:both;
padding:20px 30px;
margin:5px 0;
background:#6C3;
color:#333;
overflow:hidden;
line-height:1.5;
}
.center-box {
width:1000px;
margin:5px auto;
padding:20px 30px;
}
}
@media only screen and (max-width:960px){
.white-text-center {
padding:20px 30px;
background:#fafafa;
}
.black-text-center {
padding:20px 30px;
background:#fafafa;
}
.green-text-left {
padding:20px 30px;
background:#6C3;
}
.center-box {
width:100%;
padding:0;
margin:5px auto;
}

.black-text-center img {
float:none;
clear:both;
margin:5px;
max-width:100%;
height:auto;
}
.white-text-center img {
float:none;
clear:both;
margin:5px;
max-width:100%;
height:auto;
}
}


@media only screen and (max-width:640px){
.white-text-center {
padding:10px 5px;
}
.black-text-center {
padding:10px 5px 1px 5px;
}
.green-text-left {
padding:10px 5px;
}
.center-box {
width:100%;
}
}


@media only screen and (max-width:480px){
.white-text-center {
padding:10px 5px;
}
.black-text-center {
padding:10px 5px 0px 5px;
overflow:hidden
}
.green-text-left {
padding:10px 5px;
}
.center-box {
width:100%;
}
}


/* パーツ
-----------------------------------*/
#pageTop{
background:#999999;
border-radius:5px;
color:#FFF;
padding:20px;
position:fixed;
bottom:20px;
right:20px;
z-index:1;
}
#pageTop:hover{
background:#cccccc;
}

.b-ghost {
display:inline-block;
width:30%;
margin:10px 0;
padding:10px;
border-radius:4px;
color:#fff;
font-size:0.85rem;
text-decoration:none;
letter-spacing:1px;
border:1px solid #fff;
background-color:#6C3;
}
.b-ghost a {
color:#FFF;
}
.b-ghost:hover {
opacity:0.9;
}
.btn-center {
text-align:center;
margin:0 auto;
}
@media only screen and (max-width:480px){
.b-ghost {
width:90%;
}
}


/*　タイトル装飾
-----------------------------------*/
.heading {
position:relative;
display:inline-block;
margin:10px 0 5px;
padding-bottom:15px;
letter-spacing:2px;
font-size:2rem;
line-height:1.5;
}
.heading::before,
.heading::after {
content:'';
position:absolute;
right:0;
bottom:0;
left:0;
border-bottom:1px solid #9C0;
}
.heading::before {
bottom:5px;
}


h1.heading {
position:relative;
display:inline-block;
margin:20px 0 5px;
padding-bottom:10px;
letter-spacing:2px;
font-size:1.4rem;
color:#9C0;
font-weight:normal;
}
h1.heading a {
color:#9C0;
}
h1.heading a:hover {
color:#ccc;
}
h2 {
margin:10px 5px 5px 5px;
padding-bottom:10px;
letter-spacing:2px;
font-size:1.4rem;
color:#9C0;
font-weight:normal;
}
h2 a {
color:#9C0;
}
h2 a:hover {
color:#ccc;
}
h2.heading {
position:relative;
display:inline-block;
margin:10px 0 5px;
padding-bottom:10px;
letter-spacing:2px;
font-size:1.4rem;
color:#9C0;
font-weight:normal;
}
h2.heading a {
color:#9C0;
}
h2.heading a:hover {
color:#ccc;
}
p.catch {
font-size:1.0rem;
font-weight:bold;
color:#F90;
}

.text-large {
font-size:1.2rem;
font-weight:bold;
color:#090;
}




/* header
-----------------------------------*/
.header {
margin:5px 0;
padding:0;
background:#fff;
overflow:hidden;
text-align:left;
}
.logo {
float:left;
}
.logo h1 {
margin:0;
padding:0;
line-height:100%;
}

.search-box {
float:right;
margin:10px 20px 0 0;
overflow:hidden;
}

.header-icon img {
max-width:100%;
height:auto;
}
.header-icon {
float:left;
margin:0;
}
.header-icon ul {
position:relative;
margin:0;
padding:0;
}
.header-icon li {
float:left;
margin:0 2px;
padding:0;
list-style:none;
}

.search {
float:left;
margin:0px 5px;
}

.search dd {
text-align:justify;
text-justify:inter-ideograph;
}

.search {
font-family:verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
font-size:75%;
line-height:150%;
}

#searchform {
width:200px;
height:24px;
background:url(../img/base/input.gif) left top no-repeat; 
display:block;
position:relative;
}
#keywords {
width:156px;
position:absolute;
top:3px;
left:12px;
border:1px solid #FFF;
}
#searchBtn{
position:absolute;
top:3px;
left:174px;
}

@media only screen and (max-width:480px){
.header img {
max-width:100%;
height:auto;
}
.logo {
float:none;
width:90%;
margin:0 auto;
}
.search-box {
float:none;
clear:both;
width:90%;
margin:0 auto;
}
}






/* トップナビゲーション
-----------------------------------*/
.topnav-container {
clear:both;
position:relative;
background:#fff;
margin:0 auto;
z-index:1;
}
ul#topnav {
clear:both;
overflow:hidden;
margin:0 auto;
padding:0;
border-left:#fff solid 1px;
}

ul#topnav ul {
margin:0;
padding:0;
}
ul#topnav li{
display:block;
float:left;
width:14.28%;
margin:0;
padding:0;
font-size:0.8rem;
border-right:#e9e9e9 solid 1px;
}
ul#topnav li a{
display:block;
padding:10px 0;
color:#333;
text-align:center;
text-decoration:none;
}
ul#topnav li a:hover{
background:#fafafa;
}
#toggle{ 
 display:none;
}


#pageTop{
background:#DDD;
border-radius:5px;
color:#FFF;
padding:20px;
position:fixed;
bottom:20px;
right:20px;
z-index:1;
}
#pageTop:hover{
background:#EEE;
} 


@media only screen and (min-width:961px){
}
@media only screen and (max-width:960px){
ul#topnav{
clear:both;
width:100%;
border-radius:0;
}

ul#topnav li{
width:33%;
border-right:1px solid #ffffff;
border-bottom:1px solid #ffffff;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
}

ul#topnav li:nth-child(3n){border-right:0;width:34%;}

ul#topnav li a{
width:100%;
border:0;
}

ul#topnav li:first-child a,ul#topnav li:last-child a{width:100%;}


}


@media only screen and (max-width:640px){
ul#topnavli{
width:33%;
border-bottom:1px solid #fff;
}

}


@media only screen and (max-width:480px){
ul#topnav {
display:none;
}
ul#topnavli{
width:100%;
}
#toggle{
display:block;
position:relative;
width:100%;
background:#222;
}
#toggle a{
display:block;
position:relative;
padding:12px 0 10px;
border-bottom:1px solid #444;
color:#fff;
text-align:center;
text-decoration:none;
}
#toggle:before{
display:block;
content:"";
position:absolute;
top:50%;
left:10px;
width:20px;
height:20px;
margin-top:-10px;
background:#fff;
}
#toggle a:before, #toggle a:after{
display:block;
content:"";
position:absolute;
top:50%;
left:10px;
width:20px;
height:4px;
background:#222;
}
#toggle a:before{
margin-top:-6px;
}
#toggle a:after{
margin-top:2px;
}

ul#topnav li{
width:100%;

}
ul#topnav li:nth-child(3n){
width:100%;
}
ul#topnav li:nth-child(2n),ul#topnav li:nth-child(6n){border-right:0;}



}




/* footer
-----------------------------------*/
.fnav-container {
clear:both;
position:relative;
background:#fff;
margin:0 auto;
z-index:1;
}
ul#fnav {
clear:both;
overflow:hidden;
margin:0 auto;
padding:0;
}

ul#fnav ul {
margin:0;
padding:0;
}
ul#fnav li{
display:block;
float:left;
margin:0 10px;
padding:0;
font-size:0.8rem;
}
ul#fnav li a{
display:block;
padding:5px 0;
color:#fff;
text-align:center;
text-decoration:none;
}
ul#fnav li a:hover{
color:#e9e9e9;
}

footer {
padding:18px 5px 70px 5px;
overflow:hidden;
}
address {
margin:10px 0;
font-style:normal;
font-size:0.7rem;
letter-spacing:0.1rem;
line-height:150%;
}
.com {
font-size:1.0rem;
}
p.copy {
font-size:0.7rem;
letter-spacing:0.2rem
}


/* 分割
-----------------------------------*/
.pgno {
clear:both;
width:50%;
margin:50px auto 20px auto;
overflow:hidden;
}
.pgno:after {
content:"";
display:block;
clear:both;
height:1px;
overflow:hidden;
}

/*\*/
* html .pgno {
height:1em;
overflow:visible;
}
/**/
.current_page {
padding:5px 10px;
border:#999999 solid 1px;
}
a.link_page {
padding:5px 10px;
border:#999999 solid 1px;
}
.pgno p {
line-height:200%;
}
@media only screen and (max-width:640px){
.pgno {
width:90%;
}
}