@charset "utf-8";
.inner{max-width: 1246px; margin: 0 auto; position: relative; width: 100%;}
.clearfix:after{content: ""; display: block; clear: both;}
.t_left{text-align: left !important;}
header{padding: 20px 0; background: #002956;}
header h1{display: inline-block; margin-right: 70px; vertical-align: middle;}
header h1 img{width: 235px;}
header ul{display: inline-block; vertical-align: middle; width: 100%; max-width: 772px;}
header ul li{display: inline-block; width: 140px; text-align: center;}
header ul li a{color: #fff; font-size: 20px; font-weight: 600; }
header ul li a span{display: block; font-size: 12px; color: #fff; margin-top: 5px;}
header .utill{float: right;}
header .utill span{display: block; color: #fff; font-size: 12px; margin-top: 4px;}
header .utill .login{margin-right: 20px;}
header .utill > a{vertical-align: middle;}
header .sitemap{display: inline-block;}
header .menuBtn{display: none;}
header .closeBtn{display: none;}

.sub_navi{padding: 10px 0; background: #F8F8F8; margin-bottom: 80px;}
.sub_navi a{padding-left: 22px; background: url(/resources/homepage/images/sub/ico_home.png) no-repeat left center;}
.sub_navi span:first-of-type, .sub_navi span:nth-of-type(3), .sub_navi span:nth-of-type(5){margin: 0 10px; display: inline-block;}
.sub_navi span, .sub_navi a{font-size: 13px; color: #414141; vertical-align: middle; font-weight: 600; line-height: 30px;}
@media all and (max-width:767px){
    .sub_navi{margin-bottom: 30px;}
}
 
.content{min-height: 70vh;}
.content h3{font-size: 30px; font-weight: 600; margin-bottom: 30px;}

footer{padding: 20px 0 36px 0;}
.familySite{margin-bottom: 20px; display: flex; align-items: center; }
.familySite h5{display: inline-block; vertical-align: middle; width: 138px; margin-right: 40px; line-height: 86px; position: relative;}
.familySite h5 a{display: block; width: 20px; height: 20px; border: 1px solid #8c8c8c; background: url(/resources/homepage/images/comm/family_more.png)#F8F8F8 no-repeat center / 6px 6px; position: absolute; right: 0; top: 33px;}
.familySite .fs-container{display: flex; vertical-align: middle; max-width: 900px; width: 100%; justify-content: space-between; margin-right: 40px;}
.familySite ul li{display: inline-block;text-align: center;}
.familySite ul li img{width: 100%;}
.familySite .control{display: inline-block; vertical-align: middle; width: 64px; height: 20px; display: flex; justify-content: center; align-items: center; }
.familySite .control a{width: 20px; height: 20px; border: 1px solid #8c8c8c; background: #f8f8f8; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.familySite .control a:first-child{margin-right: 10px;}
.familySite .control a img{width: 5px; height: auto;}
.ftCon h1{display: inline-block; vertical-align: top; margin-right: 36px;}
.ftCon h1 img{width: 126px;}
.ftCon div{display: inline-block; vertical-align: top; width: calc(100% - 126px - 40px);}
.ftCon a,  .ftCon span{font-size: 14px; line-height: 1.5; color: #444;}
.ftCon p{font-size: 13px; line-height: 1.5; color: #444;}
.ftCon span{color: #777; font-size: 13px; line-height: 1.5;} 

@media all and (max-width:1300px){
    .inner{padding: 0 12px;}
}

@media all and (max-width:1200px){
    header ul{max-width: 580px;}
}
@media all and (max-width:1000px){
    #wrap.open{overflow-y: hidden; height: 100vh; }
    header ul{position: absolute; left: 0; top: 0; max-width: unset; height: 100vh; background-color: #fff; z-index: 2; padding: 50px; display: none;}
    header ul.on{display: block;}
    header .inner{position: unset;}
    header ul li{display: block; padding: 50px 0; border-bottom: 1px solid #ddd; width: 100%;}
    header ul li a{display: block;}
    header ul li a, header ul li a span{color: #000;}
    header .closeBtn{position: absolute; right: 20px; top: 20px; display: none; z-index: 2; cursor: pointer;}
    header .sitemap{display: none;}
    header .menuBtn{display: inline-block;}
}
@media all and (max-width:767px){
    .familySite{display: block;}
    .familySite .control{position: absolute; right: 12px; top: 33px;}
    .ftCon h1{display: block; width: 100%; text-align: center; margin-bottom: 12px;}
    .ftCon div{display: block; width: 100%; text-align: center;}
}
@media all and (max-width:500px){
    header h1{margin-right: 0;}
    header h1 img{width: 200px;}
}