@charset "utf-8";

@import url(../fonts/iconfont.css);/*icon*/

/* CSS Document */
html, body {font-size: 1.4rem;margin: 0;padding: 0;text-decoration: none; width:100%; height: 100%;  font-family: "sourcehansans"; -webkit-text-size-adjust: 100%;}
html{font-size: 62.5%;}
body{ position: relative; overflow-x:hidden; transition-property:all;}
a {	color: #666666;text-decoration: none;outline:none;  star:expression(this.onFocus=this.blur());}
a:hover, a:active { color:#014099;}
* { margin: 0;padding: 0;list-style: none;outline:none;box-sizing:border-box; font-family:'sourcehansans'; }
table {	border-collapse: collapse;}
ul, li {list-style: none;border: 0 none;padding: 0;margin:0;}
form {margin: 0;}
img {border: 0 none;text-align-last: center;vertical-align: middle;_azimuth:expression(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "images/blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true);}
center {text-align: left;	color: #999;height: 50px;}
#clear, .clear {clear: both;float: none!important;background: none;width: 0 !important;	height: 0 !important;margin:0 !important;padding:0 !important;}
#noData, .noData {color: #ccc;font-size: 14px;text-align: left;padding: 50px 0;}
.fl-left, .fl{ float:left;}
.fl-right, .fr{ float:right;}
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.mob{display:none;}
.hide{display: none;}
.wrap{ width: 86%; max-width: 1460px;margin: 0 auto;}
.searHeight{font-style: normal; color: #ff9900; text-decoration: underline;}
::-webkit-scrollbar {width:8px;height: 1px;}
::-webkit-scrollbar-thumb {-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); background:#333;}
::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);border-radius: 10px;background: #ededed;}

/*
head*/

#head { position:fixed; z-index:999; left: 50%; top:0; margin-left: -50%; width:100%; height:120px; transition: all .35s;}
#head .wrap{ max-width:1460px; width: 86%; margin:0 auto;}
#head .logo{ position: relative;z-index: 6; width:20%;text-align: left;  padding: 45px 0; transition: all .35s;}
#head .logo img{display: none; width: auto; height: 30px;}
#head .logo img.logo_white{display: block;}
#head .menu{ width: 60%; }
#head .menu>.click{ display:none;}
#head .menu>.navbox{position: relative;z-index: 99;}
#head .menu>.navbox>ul{margin: 0 auto;}
#head .menu>.navbox>ul>li{display: inline-block; position: relative; float: left; padding: 30px 0; text-align: center; width: 15%; }
#head .menu>.navbox>ul>li:after{ position: absolute;z-index: 1;left:50%; margin-left: -1px; width: 2px;height: 3px; opacity: 0; background: #f08200;content: ''; transition: all .35s;}
#head .menu>.navbox>ul>li.active:after{ margin-left: -50%; width: 100%;opacity: 1; }
#head .menu>.navbox>ul>li>a{ position: relative;z-index: 8; display:block;font-size: 1.6rem; color: #fff; line-height: 60px; transition: all .35s;}
#head .menu>.navbox>ul>li>a:hover, #head .menu>.navbox>ul>li.active>a{ color: #f08200!important; }
#head .menu>.navbox>ul>li>div{display: none; position: absolute;left: 50%; top:0; margin-left: -80px; padding-top: 100px; text-align: center; width: 160px;  transition: all .35s;}
#head .menu>.navbox>ul>li>div>a{display: block; box-sizing: border-box; font-size: 1.5rem;color:rgba(255,255,255,.7);padding: 6px 0;transition: all .35s;}
#head .menu>.navbox>ul>li>div>a:hover{ background: #f08200;  color: #fff;}
#head .menu>.navbox>ul>li.active>div{top:0; padding-top: 130px; }
#head .menu>.navbg{ display: none; position:absolute;z-index: 1; width: 100%;height: 300px; top:120px;left:0;  background: rgba(1,64,153,.5); box-shadow: 0 1px 4px rgba(0,0,0,.1);}


#head .search{ position: relative;z-index: 99; width: 160px;padding: 42px 0;}
#head .search>form{width:100%; height:36px; border-bottom:1px solid rgba(255,255,255,.6);}
#head .search input[type="text"]{ background: none; outline: medium;float:left;height:36px;line-height:36px;width:80%; padding-left: 5px; border:none; font-size:1.4rem;color:#777;box-sizing:border-box;overflow:hidden;}
#head .search input::-webkit-input-placeholder{ color:rgba(255,255,255,1);}
#head .search button{ position:relative;float:right;width:20%;height:36px; text-align: center; background: none; border:none;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#head .search button>i{ font-size: 2.4rem; color: rgba(255,255,255,1); transition: all .35s;}

#head .lang{ position: relative;z-index: 99;padding: 42px 0; margin-left: 35px;}
#head .lang>a{ position: relative; box-sizing: border-box; height: 36px; line-height: 36px; font-size: 1.4rem; font-family: Arial; color: rgba(255,255,255,1); font-weight: bold; display: block; transition: all .35s;}
#head .lang>a>i{font-size: 2.2rem; font-weight: 200;float: left; margin-right: 2px; }
#head .lang>div{display: none; position: absolute; top: 80px; left: -20px; width: 100px; background: rgba(1,64,153,1); padding:15px  20px; text-align: left;box-shadow: 2px 3px 4px rgba(0,0,0,.3); transition: all .35s;}
#head .lang>div:after{ position: absolute;  z-index: 3; left: 50%;top: -10px; margin-left: -8px;width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 10px solid rgba(1,64,153,1);content: '';}
#head .lang>div>a{display: block;font-size: 1.4rem; color: rgba(255,255,255,.6);padding: 5px 0; transition: all .35s;}
#head .lang:hover div{display: block;}
#head .lang>div>a:hover{color: rgba(255,255,255,1)}

#head:hover, #head.active{background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.1); }
#head:hover .menu>.navbox>ul>li>a, #head.active .menu>.navbox>ul>li>a{color: #444;}
#head:hover .logo img, #head.active .logo img{display: block;}
#head:hover .logo img.logo_white, #head.active .logo img.logo_white{display: none;}
#head:hover .search>form, #head.active .search>form{  border-bottom:1px solid rgba(0,0,0,.2);}
#head:hover .search input::-webkit-input-placeholder, #head.active .search input::-webkit-input-placeholder{ color:rgba(142,142,142,1);}
#head:hover .search button>i, #head.active .search button>i{ color: rgba(0,0,0,1);}
#head:hover .lang>a,#head.active .lang>a{color: #333;}
#head:hover .lang>a:after,#head.active .lang>a:after{ background-position: 0 -18px;}



/*
#head:hover{ background: rgba(1,64,153,.9); box-shadow: 0 1px 4px rgba(0,0,0,.1); }
#head.visited{background: none; box-shadow: none;}
#head.active{ background: rgba(1,64,153,.9); box-shadow: 0 1px 4px rgba(0,0,0,.1); }

*/


/* end*/

/* menu-mob */

#menu-mob{display: none; position: fixed; z-index: 990; left: 0;top: 120px; width: 100%; padding: 10px 0; background: rgba(1,64,153,.93); transition: all .35s;}
#menu-mob .menu>ul{margin: 0 auto;}
#menu-mob .menu>ul>li{ position: relative; display: block; border-bottom: 1px solid rgba(0,0,0,.1);}
#menu-mob .menu>ul>li>a{ position: relative; display: block;padding: 20px 7%;text-align: left;font-size: 1.6rem; font-weight: 600; color:rgba(255,255,255,1); transition: all .35s;}
#menu-mob .menu>ul>li>a:after{position: absolute;z-index: 1; right: 7%;top: 50%; margin-top: -15px; width: 30px;height: 30px; line-height: 30px; text-align: center; font-family: iconfont; font-size: 2rem; color: rgba(255,255,255,.4); content: '\e697'; transition: all .35s;}
#menu-mob .menu>ul>li>div{display: none; text-align: left;padding: 0 8%; padding-bottom: 20px;}
#menu-mob .menu>ul>li>div>a{display: block; padding: 5px 16px; font-size: 1.4rem; color: rgba(255,255,255,.9); border-left: 1px solid rgba(255,255,255,.2);}
#menu-mob .menu>ul>li.active>a:after{transform: rotate(180deg);}

#menu-mob .search{ display: none; position: relative;z-index: 99; width: 86%;padding: 20px 0; margin: 0 auto;}
#menu-mob .search>form{width:100%; height:36px; border:1px solid rgba(255,255,255,.6); background: rgba(255,255,255,.1); margin: 0 auto;}
#menu-mob .search input[type="text"]{ background: none; outline: medium;float:left;height:36px;line-height:36px;width:85%; padding-left: 20px; border:none; font-size:1.4rem;color:#fff;box-sizing:border-box;overflow:hidden;}
#menu-mob .search input::-webkit-input-placeholder{ color:rgba(255,255,255,.4);}
#menu-mob .search button{ position:relative;float:right;width:15%;height:36px; text-align: center; background: none; border:none;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#menu-mob .search button>i{ font-size: 2.4rem; color: rgba(255,255,255,1); transition: all .35s;}

#menu-mob .lang{ display: none; text-align: center; margin: 0 auto; padding:20px 0 50px 0;}
#menu-mob .lang>a{display: inline-block; position: relative; font-size: 1.4rem; padding: 0 20px; margin: 0; border-right: 1px solid rgba(255,255,255,.5); color: rgba(255,255,255,.8);transition: all .35s;}
#menu-mob .lang>a:last-child{border: 0;}

/* end*/




/* banner */

#banner{position:fixed; z-index:1; left: 0;top: 0; background:#fff; height:auto; overflow:hidden;  transition:all .35s;}
#banner>.inside{margin: 0 auto;}
#banner>.inside>.box{position: absolute;z-index: 99; left: 20%; top: 40%; text-align: left;}
#banner>.inside>.box>h3{ position: relative; padding: 20px 0; font-size: 5rem; font-weight: normal; color: rgba(255,255,255,1); background-image:-webkit-linear-gradient(right bottom,#ffffff,#3aa9ff); -webkit-background-clip:text; -webkit-text-fill-color:transparent;}
#banner>.inside>.box>h3:after{ position: absolute;z-index: 2; left: -20px; bottom: 0; width: 120px;height:3px; background: rgba(1,64,153,1); background:linear-gradient(to right bottom,#3aa9ff,#0061ac); content: '';}
#banner>.inside>.bg{ position: relative; text-align: center;}
#banner>.inside>.bg>img{width: 100%;height: auto;}

/* end*/



/* path */

#path{ position: relative;z-index: 2; width: 100%; margin: 0 auto; margin-top: -40px; box-sizing: border-box; padding: 0 7%; font-size: 1.5rem; color: #fff; text-align: right;}
#path>.wrap{position: relative;z-index: 8; margin: 0 auto; padding-bottom: 20px;}
#path a{display: inline-block; margin: 0 5px; color: #fff; transition: all .35s;}
#path a:first-child{padding-left: 26px; background: url("../img/ico_home.png") no-repeat; background-position: 0 50%; background-size: 22px auto;}
#path a:hover{ text-decoration: underline;}
#path.active{ position: fixed; z-index: 90; top: 120px; background: rgba(1,64,153,.8);margin-top: 0; }
#path.active>.wrap{text-align: left;padding: 10px 0;}


/* end*/



/* navpart */
#navpart{ position: relative;z-index: 90; background: #fff; margin: 0 auto; border-bottom: 1px solid #ddd; }
#navpart ul{margin: 0 auto;white-space: nowrap; text-align: center;}
#navpart ul>li{ position: relative; display:inline-block; vertical-align:top; box-sizing: border-box;}
#navpart ul>li:after{position: absolute;z-index: 1; right: 0;top: 50%; margin-top: -10px; width: 1px;height: 20px; background: #ddd; content: '';}
#navpart ul>li:last-child:after{display: none;}
#navpart ul>li>a{ position: relative;z-index: 50; display: block; box-sizing: border-box; height: 50px; line-height: 50px;  padding: 0 80px; font-size: 1.6rem; color: #333;transition: all .35s;}
#navpart ul>li>a:after{display: none; position: absolute;z-index: 2;left: 0;bottom: -1px;width: 100%;height: 3px; background: rgba(1,64,153,1);content: ''; transition: all .35s; }
#navpart ul>li>a.active{color: rgba(1,64,153,1);}
#navpart ul>li>a.active:after{display: block;}
#navpart ul>li:hover a{ color: rgba(1,64,153,1);}

#navpart .pgwMenu { position: relative; text-align: center; padding: 0;margin: 0; height: 50px; }
#navpart .pgwMenu ul { list-style: none; white-space: nowrap;}
#navpart .pgwMenu .pm-links{display: inline-block;vertical-align:top;}
#navpart .pgwMenu .pm-dropDown{ display: none;position: relative; width: 100%;margin: 0 auto; vertical-align:top; }
#navpart .pgwMenu .pm-dropDown>a{position: relative; display: block; color: rgba(255,255,255,1); font-size: 1.6rem; background: rgba(1,64,153,1); box-shadow: 1px 2px 3px rgba(0,0,0,.1); height: 50px; line-height: 50px; padding: 0 30px; text-decoration: none;}
#navpart .pgwMenu .pm-dropDown>a>i{margin-right: 5px; font-size: 1.8rem;}
#navpart .pgwMenu .pm-links.mob{ position: absolute;z-index: 9; left: 0; width: 100%; background: rgba(255,255,255,1); }
#navpart .pgwMenu .pm-links.mob>li{ display:block!important; padding: 0;margin: 0; border-bottom: 1px solid #eee; }
#navpart .pgwMenu .pm-links.mob>li>a{display: block;}
#navpart .pgwMenu .pm-links.mob>li>a:hover{color: rgba(1,64,153,1);}

#navpart .pgwMenu .pm-viewMore{ display: none;position: relative;vertical-align:top; }
#navpart .pgwMenu .pm-viewMore>a{position: relative; display: inline-block; color: rgba(255,255,255,1); font-size: 1.4rem; background: rgba(1,64,153,1); height: 50px; line-height: 50px; padding: 0 30px; text-decoration: none;}
#navpart .pgwMenu .pm-viewMore>a>i{margin-left: 5px;opacity: .6;}
#navpart .pgwMenu .pm-viewMore>ul{ position: absolute;z-index: 3; right: 0;background: rgba(1,64,153,1);  }
#navpart .pgwMenu .pm-viewMore>ul>li{ display:block!important; padding: 0;margin: 0; border-bottom: 1px solid #eee; }
#navpart .pgwMenu .pm-viewMore>ul>li:after{display: none!important;}
#navpart .pgwMenu .pm-viewMore>ul>li>a{display: block; color: rgba(255,255,255,1); transition: all .35s;}
#navpart .pgwMenu .pm-viewMore>ul>li>a:hover{color: rgba(255,255,255,.8);}




/* end*/



/* title */

#title{position: relative;z-index: 4; background: #fff;margin: 0 auto; padding: 80px 0; }
#title>h3{ font-size: 2.4rem; font-weight: 700; color: #333; text-align: center;}



/* end*/



/*foot */
#foot{ position: relative;z-index: 3; width:100%; margin:0 auto; padding:60px 0; background:rgba(1,64,153,1) url("../img/foot_bg.jpg") no-repeat; background-size: cover; background-position: -20% 20%;}

#foot .wrap{  width: 86%;margin: 0 auto; max-width: inherit;}
#foot .navbox{ position: relative; padding: 30px 0;}
#foot .navbox>.nav{width: 60%; text-align: left;}
#foot .navbox>.nav>ul{padding: 0;}
#foot .navbox>.nav>ul>li{display: block;float: left; text-align: left; box-sizing: border-box;  padding-right: 60px;}
#foot .navbox>.nav>ul>li:last-child{padding-right: 0;}
#foot .navbox>.nav>ul>li>a{display: block; font-weight: bold; font-size: 1.6rem; color:rgba(255,255,255,1);}
#foot .navbox>.nav>ul>li>div{padding: 10px 0;}
#foot .navbox>.nav>ul>li>div>a{display: block;font-size: 1.4rem;color: rgba(255,255,255,.6);padding: 5px 0; transition: all .35s; }
#foot .navbox>.nav>ul>li>div>a:hover{color: rgba(255,255,255,.8);}
#foot .navbox>.box{width: 40%; text-align: right;}
#foot .navbox>.box>.box_t{ text-align:left;}
#foot .navbox>.box>.box_t>.logo{width: 30%;}
#foot .navbox>.box>.box_t>.logo>img{width: 100%;height: auto;}
#foot .navbox>.box>.box_t>.contact{ width: 70%; text-align: right; box-sizing: border-box;padding-left: 20px;}
#foot .navbox>.box>.box_t>.contact>div{ position: relative;  display: block; margin-left: 30px; font-size: 1.4rem; float: right; color: rgba(255,255,255,1);}
#foot .navbox>.box>.box_t>.contact>div p>i{ display: inline-block;  vertical-align: top; width: 18px;height: 18px;  font-size: 2rem; margin-right: 6px;}
#foot .navbox>.box>.box_t>.contact>div p>span{display: inline-block;}
#foot .navbox>.box>.box_t>.contact>div p>em{display: block;  font-style: normal;}
/*
#foot .navbox>.box>.box_t>.contact>p.tel:after{ background: url("../img/ico_tel.png") no-repeat; background-size: 100% auto; background-position: 50% 50%;}
#foot .navbox>.box>.box_t>.contact>p.mail:after{ background: url("../img/ico_mail.png") no-repeat; background-size: 100% auto; background-position: 50% 50%;}
*/

#foot .navbox>.box>.box_b{text-align: left; padding-top: 40px;}
#foot .navbox>.box>.box_b>.search{ width: 50%; box-sizing: border-box; padding-left: 10px;}
#foot .navbox>.box>.box_b>.search>form{width:100%; height:50px;}
#foot .navbox>.box>.box_b>.search input[type="text"]{outline: medium;float:left;height:50px;line-height:50px;width:80%; padding:0 5%; border:1px solid rgba(255,255,255,.6); background:rgba(255,255,255,.1); font-size:1.4rem;color:#777;box-sizing:border-box;overflow:hidden;}
#foot .navbox>.box>.box_b>.search input::-webkit-input-placeholder{ color:rgba(255,255,255,1);}
#foot .navbox>.box>.box_b>.search button{ position: relative;	float:right;width:20%;height:50px;border:none; opacity:.8;background: rgba(255,255,255,.6) ;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#foot .navbox>.box>.box_b>.search button:after{position: absolute;z-index: 2; top: 50%; left: 50%; margin-top: -12px; margin-left: -12px; width: 24px;height: 24px; font-family: iconfont; font-size: 2.8rem; color: rgba(0,98,170,1); content: '\eafe';}

#foot .navbox>.box>.box_b>.qrcode{ float: right; text-align: right;}
#foot .navbox>.box>.box_b>.qrcode>img{width: 100px; height: auto;}


#foot .copy{text-align: left;  padding: 20px 0; font-size: 1.4rem; color:rgba(255,255,255,.8);border-top: 1px solid rgba(255,255,255,.1);}
#foot .copy>a{display: inline-block; color: rgba(255,255,255,.8); transition: all .35s;}
#foot .copy>a:hover{ text-decoration: underline}
#foot .copy>.share{float: right;}
#foot .copy>.share .bshare-custom{display:inline-block;}
#foot .copy>.share .bshare-custom a{ padding:0;margin:0 6px!important; border-radius:100%; width:36px; height:36px; opacity:1; transition:all .35s;}
#foot .copy>.share .bshare-custom .bshare-sinaminiblog{ background:rgba(255,255,255,.2) url("../img/ico_weibo.png") no-repeat; background-size:20px auto;background-position:center center;}
#foot .copy>.share .bshare-custom .bshare-weixin{ background:rgba(255,255,255,.2) url("../img/ico_weixin.png") no-repeat; background-size:20px auto!important;background-position:center center;}
#foot .copy>.share .bshare-more{background:rgba(255,255,255,.2) url("../img/ico_share.png") no-repeat; padding:0 !important; margin:0 !important; background-size:20px auto!important;background-position:center center;}
#foot .copy>.share .bshare-custom a:hover{ opacity:1; transform: translateY(-3px);}
#foot .gotop{position: fixed;z-index: 999; right: 30px;bottom: 30px;}
#foot .gotop>a{display: block;width: 50px;height: 50px; background:rgba(0,0,0,.2) url("../img/ico_gotop.png") no-repeat; background-position: 50% 50%; background-size: 70% auto; transition: all .35s;}

/* end*/


#loadmore{margin: 0 auto; padding: 50px 0 100px 0;}
#loadmore>.loadmore{margin: 0 auto;text-align: center;}
#loadmore>.loadmore>a{display: inline-block; border: 2px solid #ddd; border-radius: 50px; padding: 10px 80px; font-size: 1.6rem; transition: all .35s;}
#loadmore>.loadmore>a:hover{background: rgba(1,64,153,1);border: 2px solid rgba(1,64,153,1); color: #fff; box-shadow: 2px 3px 20px rgba(0,0,0,.4); }
#loadmore>.loading{margin:50px 0; height:46px; text-align:center; line-height:47px; display:none;}
#loadmore>.loading>div{width:12px; height:12px; background-color:#f08200; border-radius:100%; display:inline-block; animation:bouncedelay 1.4s infinite ease-in-out; animation-fill-mode:both; margin:0 3px;}
#loadmore>.loading .bounce1{animation-delay:-0.32s;}
#loadmore>.loading .bounce2{animation-delay:-0.16s;}

@keyframes bouncedelay{
    0%, 80%, 100%{transform:scale(0.0);}
    40%{transform:scale(1.0);}
}

@media only screen and (max-width: 1600px){


    #foot .navbox>.nav>ul>li{ padding-right: 50px;}


}




@media only screen and (max-width: 1460px){


    #head .menu{ width: 56%; }

    #foot .navbox>.nav>ul>li{ padding-right: 40px;}
    #foot .navbox>.box>.box_t>.contact{text-align: right;}
    #foot .navbox>.box>.box_t>.contact>div{ padding: 3px 0; float: none; margin-left: 0; text-align: right;}
    #foot .navbox>.box>.box_t>.contact>div p>i{ position: relative;left: 0;top: 0;}
    #foot .navbox>.box>.box_t>.contact>div p>span{display: inline-block;vertical-align: top;}

}

@media only screen and (max-width: 1380px){

    #foot .navbox>.box{width: 36%; }
    #foot .navbox>.nav>ul>li{ padding-right: 30px;}

}
@media only screen and (max-width: 1280px){

    #head .menu{ width: 50%; }
    #head .menu>.navbox>ul>li>a{font-size: 15px;}


    #banner>.inside>.box>h3{ font-size: 4rem;}


    #title{padding: 50px 0; }
    #title>h3{ font-size: 2rem;}



    #foot{ background-position: 0 0;}
    #foot .navbox>.box{width: 100%;float: none; padding-bottom: 20px;}
    #foot .navbox>.box>.box_t>.logo{width: 18%;}
    #foot .navbox>.box>.box_t>.contact{ width: 70%; text-align: left; box-sizing: border-box;padding-left: 20px;}

    #foot .navbox>.box>.box_b{padding: 20px 0;}
    #foot .navbox>.box>.box_b>.search{ width: 42%; padding-left: 0; }
    #foot .navbox>.box>.box_b>.search>form{height:40px;}
    #foot .navbox>.box>.box_b>.search input[type="text"]{height:40px;line-height:40px;}
    #foot .navbox>.box>.box_b>.search button{ height:40px;}

    #foot .navbox>.box>.box_b>.qrcode{ position: relative;}

    #foot .navbox>.nav{width: 100%; float: none;}
    #foot .navbox>.nav>ul>li{ width: 16.66%; padding-right: 0;}


}


@media only screen and (max-width: 1200px){

    #head .menu{float: none; position: absolute;z-index: 5; right:0; top: 0; width: 100%; height: 100%; }
    #head .menu>.click{ display:block; position:absolute; right:7%;top: 50%; margin-top: -10px; width: 28px;height: 20px; cursor:pointer; }
    #head .menu>.click>span { position: relative; display:block; margin-top:10px;}
    #head .menu>.click>span,#head .menu>.click>span:after,#head .menu>.click>span:before { display: block;width:28px;height: 3px;background: rgba(255,255,255,1);transition-duration: .4s;-webkit-transition-property: background-color,-webkit-transform;-moz-transition-property: background-color,-moz-transform; -o-transition-property: background-color,-o-transform; transition-property: background-color,transform;}
    #head .menu>.click>span:after,.menu>.click>span:before { position: absolute; content: "";}
    #head .menu>.click>span:before {top: -8px;}
    #head .menu>.click>span:after {top: 8px;}
    #head .menu>.click.active span { background-color: transparent!important;}
    #head .menu>.click.active span:after,#head .menu>.click.active span:before {background-color:rgba(0,0,0,1);}
    #head .menu>.click.active span:before {-webkit-transform: translateY(8px)rotate(45deg);-moz-transform: translateY(8px)rotate(45deg);transform: translateY(8px)rotate(45deg);-ms-transform: translateY(8px)rotate(45deg);}
    #head .menu>.click.active span:after {-webkit-transform: translateY(-8px)rotate(-45deg);-moz-transform: translateY(-8px)rotate(-45deg);transform: translateY(-8px)rotate(-45deg);-ms-transform: translateY(-8px)rotate(-45deg);}
    #head:hover .menu>.click>span,#head:hover .menu>.click>span:after,#head:hover .menu>.click>span:before, #head.active .menu>.click>span,#head.active .menu>.click>span:after,#head.active .menu>.click>span:before{ background: rgba(0,0,0,1);}

    #head .menu>.navbox{display: none;}

    #head .lang{ margin-right: 60px;}
    #banner>.inside>.box>h3{ font-size: 3.6rem;}


}

@media only screen and (max-width: 860px){

    #head .search{display: none;}
    #head .lang{display: none;}
    #menu-mob .search{display: block;}
    #menu-mob .lang{display: block;}


    #banner>.inside>.box>h3{ font-size: 3rem;}

    #path{display: none;}


    #foot .navbox>.nav{display: none;}
    #foot .navbox>.box>.box_t>.logo{width: 24%;}
    #foot .navbox>.box>.box_b>.search{ width: 60%;}


}
@media only screen and (max-width: 640px){

    #head { height:70px;}
    #head .logo{padding: 25px 0; }
    #head .logo img{height: 20px;}


    #menu-mob{top: 70px;}
    #menu-mob .menu>ul>li>a{ font-size: 1.5rem;}
    #menu-mob .menu>ul>li>a:after{font-size: 1.6rem; }



    #banner>.inside>.box{ display: none; bottom: 10px;top: auto;}
    #banner>.inside>.box>h3{ font-size: 1.6rem;}
    #banner>.inside>.box>h3:after{ width: 90px;height:2px; bottom: 10px;}

    #title{padding: 30px 0; }

    #foot{padding: 20px 0;}
    #foot .navbox>.box{height: auto; padding-bottom: 50px;}
    #foot .navbox>.box>.box_t>.logo{width: 40%; float: none;}
    #foot .navbox>.box>.box_t>.contact{ position: absolute;z-index: 3; bottom: 0; float: none; width: 100%; height: 200px; padding: 0; padding-top: 100px;}
    #foot .navbox>.box>.box_t>.contact>div{ padding: 3px 0; float: none; margin-left: 0; text-align: left; vertical-align: top; }
    #foot .navbox>.box>.box_t>.contact>div p>em{ display: block;}
    #foot .navbox>.box>.box_b{padding: 30px 0;}
    #foot .navbox>.box>.box_b>.search{ width: 100%; float: none;}
    #foot .navbox>.box>.box_b>.qrcode{ display:none;}



    #foot .copy{ margin-top: 40px; font-size: 1.3rem; padding-bottom: 0; }
    #foot .copy>a{display: block;}

}










