@charset "utf-8";

@import url("lib/animated.css");
@import url("lib/jquery-ui-1.10.4.custom.min.css");
@import url("lib/swiper.css");
@import url("lib/perfect-scrollbar.css");


/* ==============================
 * layout
 * ============================== */
html,body{height:100%;}
body{min-width:1240px; font-size:13px;}
body.hidden{overflow:hidden;}

#skipNav{position:absolute; left:0; top:0; width:100%; z-index:9999;}
#skipNav a {overflow:hidden; display:block; width:1px; height:1px; margin-bottom:-1px; color:#444; font-size:0; text-decoration:none;}
#skipNav a:active, #skipNav a:focus,#skipNav a:target, #skipNav a:hover{ width:100%; height:auto; padding:5px 0; background:#303030; font-size:14px; text-align:center; color:#fff;}

#headerWrap {min-width:1240px;}
#header { position:relative; z-index:10; width:1100px; height:130px; margin:0 auto;}
#header .logo { float:left;}
#header .logo a { display:block; margin-top:37px; width:146px; height:48px; font-size:0; background:url('../images/common/logo_s.png') no-repeat;}

#header #gnb { position:relative; float:right;}
#header #gnb .topLink { position:absolute; top:15px; right:0;}
#header #gnb .topLink li { float:left; margin-left:10px;}
#header #gnb .topLink li a { font-size:14px; color:#666;}
#header #gnb .gnb { padding:65px 134px 0 0;}
#header #gnb .gnb > li { position:relative; float:left; min-width:130px; height:65px; padding:0 40px;}
#header #gnb .gnb > li > a { display:block; height:100%; font-size:20px; color:#222; text-align:center;}
#header #gnb .gnb > li:after { content:''; display:block; position:absolute; bottom:0; left:50%; width:0; height:3px; background:#f96f00; transition:all .3s ease;}
#header #gnb .gnb > li:hover > a,
#header #gnb .gnb > li.on > a { color:#f56b02;}
#header #gnb .gnb > li:hover:after { left:0; width:100%;}
#header #gnb .gnb > li.on:after { left:0; width:0;}
#header #gnb .subBox { display:none; position:absolute; top:110px; left:0; right:0;}
#header #gnb .subBox li { margin-bottom:10px;}
#header #gnb .subBox li a { display:block; font-size:15px; color:#222; text-align:center;}
#header #gnb .subBox li a:hover { color:#f56b02;}
.subBg { display:none; position:absolute; top:130px; left:0; right:0; z-index:5; height:300px; border:1px solid #ccc; background:#fff; min-width:1240px;}

#header .btnAll { display:block; position:absolute; top:52px; right:0; width:56px; height:56px; border:1px solid #222; font-size:0;}
#header .btnAll span { position:absolute; top:50%; left:50%; width:20px; height:1px; margin-left:-10px; background:#222;  transition:all .3s ease;}
#header .btnAll span:before { content:""; display:block; position:absolute; top:6px; width:20px; height:1px; background:#222; transition:all .3s ease; }
#header .btnAll span:after { content:""; display:block; position:absolute; top:-6px; width:20px; height:1px; background:#222; transition:all .3s ease; }

#header .btnAll.on { border-color:#fff;}
#header .btnAll.on span { background:none; }
#header .btnAll.on span:before { top:50%; transform:rotate(45deg); background:#fff;}
#header .btnAll.on span:after { top:50%; transform:rotate(-45deg); background:#fff;}

#header .btnTopSearch { display:block; position:absolute; top:60px; right:77px; width:45px; height:43px; font-size:0;}
#header .btnTopSearch:after { content:''; display:block; position:absolute; top:50%; left:50%; width:21px; height:21px; background:url('../images/common/spr.png') no-repeat -81px -5px; transform:translate(-50%, -50%);}
#header .searchBox { display:none; position:absolute; top:130px; left:-70px; right:-70px; padding:32px 0; border:1px solid #ebebeb; text-align:center; background:#f8f8f8;}
#header .searchBox .search { display:inline-block; border-bottom:2px solid #222; padding-bottom:4px;}
#header .searchBox input { width:400px; padding:10px 0; border:0; background:none;}
#header .searchBox .btnSearch { display:inline-block; width:31px; height:30px; font-size:0; background:url('../images/common/spr.png') no-repeat -115px -34px; }
#header .searchBox .btnSearchClose { display:block; position:absolute; top:50%; right:84px; width:28px; height:28px; margin-top:-14px; font-size:0; background:url('../images/common/spr.png') no-repeat -155px -36px; }

.allWrap { display:none; position:absolute; top:0; left:0; right:0; z-index:50; background:#1b1d20; background:rgba(27,29,32,0.9); min-width:1240px;}
.allWrap .allBox { overflow:hidden; width:1100px; margin:225px auto 0;}
.allWrap .allBox > div { margin-left:-48px;}
.allWrap .allBox .box { float:left; width:239px; margin-left:48px;}
.allWrap .allBox .box h2 { padding-bottom:14px; margin-bottom:14px; border-bottom:2px solid #f56b02; font-size:24px; color:#fff;}
.allWrap .allBox .box ul { height:320px;}
.allWrap .allBox .box li { margin-bottom:10px;}
.allWrap .allBox .box li a { display:block; padding:5px 0; font-size:16px; color:#ffffff; transition:all .2s ease; }
.allWrap .allBox .box li a:hover { padding:5px; color:#222; font-weight:500; background:#fff;}

.allWrap .btnAllClose { display:block; position:absolute; top:52px; left:50%; width:56px; height:56px; margin-left:494px; border:1px solid #fff; font-size:0; }
.allWrap .btnAllClose span {position:absolute; top:50%; left:50%; width:20px; height:1px; margin-left:-10px; background:none;}
.allWrap .btnAllClose span:before { content:""; display:block; position:absolute; top:50%; width:20px; height:1px; background:#fff; transform:rotate(45deg);}
.allWrap .btnAllClose span:after { content:""; display:block; position:absolute; top:50%; width:20px; height:1px; background:#fff; transform:rotate(-45deg);}


#footerWrap { color:#e8e8e8; font-weight:300; background:#666666;}
#footerWrap a { color:#e8e8e8;}
#footerWrap .footerMenu { display:table; width:1100px;}
#footerWrap .footerMenu li { display:table-cell; min-width:200px; font-size:20px;}
#footerWrap .footerMenu li a { position:relative; display:block; height:116px; padding-left:87px; line-height:116px;}
#footerWrap .footerMenu li a:before { content:''; display:block; position:absolute; top:28px; left:0; width:65px; height:65px; background:url('../images/common/spr.png') no-repeat;}
#footerWrap .footerMenu .menu1 a:before { background-position:0 -134px;}
#footerWrap .footerMenu .menu2 a:before { background-position:-67px -134px;}
#footerWrap .footerMenu .menu3 a:before { background-position:-134px -135px;}
#footerWrap .footerMenu .menu4 a:before { background-position:-201px -135px;}
#footerWrap .footer { border-top:1px solid #575757;}
#footerWrap .footer .inner { position:relative; padding:35px 0 50px 145px;}
#footerWrap .footer .footerLogo { display:block; position:absolute; top:35px; left:0; width:100px; height:52px; font-size:0; background:url('../images/common/logo_f.gif') no-repeat;}
#footerWrap .footer .link {}
#footerWrap .footer .link li { float:left; margin-right:20px; font-size:16px;}
#footerWrap .footer .familySite { position:absolute; top:28px; right:0; width:202px; height:40px; border:1px solid #888888;}
#footerWrap .footer .familySite > a { display:block; height:40px; padding:0 15px; line-height:40px; text-transform:uppercase;}
#footerWrap .footer .familySite > a:after { content:''; display:block; position:absolute; top:17px; right:18px; width:13px; height:7px; background:url('../images/common/spr.png') no-repeat -61px -49px; transition: all .3s ease;}
#footerWrap .footer .familySite.on > a:after { transform:rotate(180deg);}
#footerWrap .footer .familySite ul { display:none; position:absolute; bottom:39px; left:-1px; right:-1px; background:#fff;}
#footerWrap .footer .familySite li + li { border-top:1px solid #e5e5e5;}
#footerWrap .footer .familySite li a { display:block; height:35px; padding:0 15px; line-height:35px; color:#222;}
#footerWrap .footer .familySite li a:hover { color:#f56b02; background:#fafafa; }
#footerWrap .footer .footerText { margin:10px 0; font-size:12px;}
#footerWrap .footer .copy { font-size:12px;}
#footerWrap .footer .footerMark { position: absolute; left: 570px; top: 68px;}


@media screen and (max-width: 1214px){
#container { min-height:1000px;}
}

@media screen and (max-width:800px){
}

@media screen and (max-width:640px){
}

