@charset "utf-8";

*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
} 



/* float celar クラスなし */
*:after {
display:block;
clear:both;
} 

element {zoom:1;} /* clearfix IE6, 7 */
element:after {content:"";} /* clearfix */

.cfix{zoom:1;} 
.cfix:after {content:"";}

body{
margin:0;
padding:0;
font-family:"メイリオ", "Meiryo","游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  sans-serif;
font-weight:500;
color: #2c343b;
width:100%;
background:#fff;
/*background:#F9F9F7;*/

}



#wrap{
position:relative;
overflow:hidden;
width:100%;

}


#wrap {zoom:1;} 
#wrap:after {content:"";}





/*-------------------------------- */
header .logo {
overflow:hidden;
}


header h1{
padding-top:30px;
border-bottom:1px solid #fff;
line-height:120%;
}

header h1 a{
border-bottom:2px solid #fff;
display:inline-block;
padding:0 1em 0 0.3em;
position:relative;
top:0px;
}


header .sitecopy {
padding-top:1.5em;
font-size:160%;color:#fff;
text-shadow: 1px 1px 3px #000;}



@media only screen and (min-width: 1170px) { /*pc*/
header .logo {
width:1100px;
margin:0 auto;

}

header .sitecopy {
padding-left:2em;
}

}

@media only screen and (max-width: 1169px) { /*pc*/
header .logo {
width:100%;
}

header .sitecopy {
padding-left:1em;
}



}


@media only screen and (max-width: 767px) {/*sp*/
header .logo {
width:100%;
}

header h1{
text-align:center;
}

header h1 img{
width:100%;
height:auto;
max-width:100%;
}

header .sitecopy {
padding-left:1em;
font-size:120%;
}


}

#gnavi{
text-align:center;
margin: 2.5em auto 3em;
}


#gnavi li{
display:inline-block;
margin:0 5px;
position:relative;
}

#gnavi li a{
text-decoration:none;
color:#000;
display:block;
padding-top:50px;

}

#gnavi li:hover a{
text-decoration:none;
color:#cc0000;
}


#gnavi li:nth-of-type(1) a:before{
width:52px;
height:40px;
background:url(img/cateimg_sekou.png) 0 0 no-repeat;
content:"";
position:absolute;
top:0;
left:50%;
transform: translateX(-50%);
transition:0.5s ease;
}

#gnavi li:nth-of-type(1) a:hover:before{
background:url(img/cateimg_sekou.png) 0 -40px no-repeat;
position:absolute;
top:-2px;
left:50%;
}


#gnavi li:nth-of-type(2) a:before{
width:61px;
height:40px;
background:url(img/cateimg_nagare.png) 0 0 no-repeat;
content:"";
position:absolute;
top:0;
left:50%;
transform: translateX(-50%);
transition:0.5s ease;
}

#gnavi li:nth-of-type(2) a:hover:before{
background:url(img/cateimg_nagare.png) 0 -40px no-repeat;
position:absolute;
top:-2px;
left:50%;

}

#gnavi li:nth-of-type(3) a:before{
width:34px;
height:40px;
background:url(img/cateimg_profile.png) 0 0 no-repeat;
content:"";
position:absolute;
top:0;
left:50%;
transform: translateX(-50%);
transition:0.5s ease;
}

#gnavi li:nth-of-type(3) a:hover:before{
background:url(img/cateimg_profile.png) 0 -40px no-repeat;
position:absolute;
top:-2px;
left:50%;

}


#gnavi li:nth-of-type(4) a:before{
width:39px;
height:40px;
background:url(img/cateimg_rireki.png) 0 0 no-repeat;
content:"";
position:absolute;
top:0;
left:50%;
transform: translateX(-50%);
transition:0.5s ease;
}

#gnavi li:nth-of-type(4) a:hover:before{
background:url(img/cateimg_rireki.png) 0 -40px no-repeat;
position:absolute;
top:-2px;
left:50%;

}



#gnavi li:nth-of-type(5) a:before{
width:51px;
height:40px;
background:url(img/cateimg_contact.png) 0 0 no-repeat;
content:"";
position:absolute;
top:0;
left:50%;
transform: translateX(-50%);
transition:0.5s ease;
}

#gnavi li:nth-of-type(5) a:hover:before{
background:url(img/cateimg_contact.png) 0 -40px no-repeat;
position:absolute;
top:-2px;
left:50%;

}


#gnavi ul{
display:-webkit-box;
display:flex;
flex-flow: row nowrap;
justify-content:center;
width:100%;
max-width:1100px;
}

#gnavi li{
flex: 0 1 20%;
}



@media only screen and (min-width: 1170px) { /*pc*/

#gnavi ul li:first-child {
margin-left:50px;

}

#gnavi ul li:last-child {
margin-right:50px;

}
}

@media only screen and (max-width: 1169px) { /*pc*/


}


@media only screen and (min-width: 768px) {
#gnavi ul{
display:-webkit-box;
display:flex;
flex-flow: row nowrap;
justify-content:space-around;
width:100%;
max-width:1100px;
margin:0 auto;
}




}


@media only screen and (max-width: 500px) { /*sp*/

#gnavi{
text-align:center;
margin: 1em auto 1em;
}

#gnavi ul{
flex-flow: row wrap;
}

#gnavi li{
flex: 0 1 100%;
/*white-space:nowrap;*/
}
#gnavi li{
border-bottom:1px solid #ccc;
margin-top:10px;

}

#togglemenu dt{
display:block;
cursor:pointer;
}

#togglemenu dt{
celar:both;
border:1px solid #79796A;
color:#444;
background:#3D8FA7;
padding:10px 20px 10px 20px;
border-radius: 10px; 
-webkit-border-radius: 10px;  
-moz-border-radius: 10px;
margin:0 10px 1em;
/*background:url(img/ic_01.png) 15px center no-repeat;*/
text-decoration:none;
color:#fff;
}

#togglemenu dt{
-moz-transition: 0.3s ease;
-webkit-transition:  0.3s ease;
-o-transition:  0.3s ease;
-ms-transition:  0.3s ease;
transition: 0.3s ease;
}

#togglemenu dt:hover{
padding:10px 20px 10px 20px;

background-color:#3D8FA7;
color:#fff;
}



#togglemenu dd{
display:none;

}

}





#togglemenu dd{
margin:0;
}

@media only screen and (min-width: 500px) {


#togglemenu dt{
display:none;

}
#togglemenu dd{
display:block;
}


}



article{
width:100%;
margin:0 auto;
background:#fff;
border-bottom:1px solid #fff;

}

@media only screen and (min-width: 1170px) { /*pc*/

article{
max-width:1150px;
}

}

article {zoom:1;} 
article:after {content:"";} 






footer{
width:100%;
padding:0;
margin:0px auto;
overflow:hidden;

}

@media only screen and (min-width: 1170px) { /*pc*/
footer{
max-width:1150px;
}
}


.footnavi{
width:100%;
padding-bottom:1.5em;
background:url(img/footer_bg.png) top center no-repeat;
padding-top:50px;

}
.footnavi{zoom:1;} 
.footnavi:after {content:"";}

.footnavi dt{
padding:0 0 0 2em;
font-weight:bold;
margin:0;
}

.footnavi dd{
margin:0 0 0 1em;}

.footnavi ul{
margin:0;
}
.footnavi li{
padding:0 0 0 2em;
list-style-type:none;

}

.footnavi a{
display:block;
text-decoration:none!important;
color:#333!important;
padding:1em 1em 1em 0;
}

.footnavi a:hover{
text-decoration:underline!important;
color:#cc0000!important;
}


.footnavi_item,
ul.footnavi_item {
margin-top:1em;
margin-bottom:0;
}


.foot_nav4{
font-weight:bold;
}
.foot_nav5{
font-weight:bold;
}

@media only screen and (min-width: 1170px) { /*pc 1170*/

.footnavi dt{
border-bottom:1px solid #aaa;
}

.footnavi dd{
margin:0.5em 0 0 1em;}


.footnavi{
line-height:110%;

}

.foot_nav1{
margin-left:50px;
width:20%;
}
.foot_nav2{
width:20%;
}
.foot_nav3{
width:23%;
}
.foot_nav4{
width:15%;
}

.foot_nav4 li{
border-bottom:1px solid #aaa;
line-height:200%;
}

.foot_nav5{
}


}

@media only screen and (min-width: 768px){ /*pc 1170*/

.footnavi{
display: flex;
display: -webkit-flex;
justify-content: space-between ;
flex-flow: row wrap;
align-content: space-between;
font-size:90%;}

.footnavi_item {
margin-bottom:1em;
}

.footnavi a{
padding:0.5em 0.5em 0.5em 0;
}

}





@media only screen and (max-width: 767px) {/*sp*/

.footnavi_item,
ul.footnavi_item {
margin-top:0em;
margin-bottom:0;
}

.foot_nav1{
/*border-top:1px solid #ccc;*/
}
.foot_nav2{
border-top:1px solid #ccc;
}
.foot_nav3{
border-top:1px solid #ccc;
}
.foot_nav4{
border-top:1px solid #ccc;
}
.foot_nav5{
border-top:1px solid #ccc;
}

.footnavi dd li{
border-top:1px solid #EEEEEE;
}
.foot_nav4 li{
border-top:1px solid #EEEEEE;
}
.foot_nav4 li:first-child{
border-top:none;
}


}


small{
display:block;
width:100%;
text-align:center;
padding:1.2em;
background:#427084;
color:#fff;}
