@charset "utf-8";
@font-face {
    font-family:dincondbold;
    src: url("../font/dincondbold.otf");
}
@font-face {
    font-family:dincondregular;
    src: url("../font/dincondregular.otf");
}
@font-face {
    font-family:markpro;
    src: url("../font/markpro.otf");
}
@font-face {
    font-family:markorolight;
    src: url("../font/markorolight.otf");
}
@font-face {
    font-family:dincondmedium;
    src: url("../font/dincondmedium.otf");
}
* { padding: 0; margin: 0; outline: 0; text-decoration: none; list-style: none;color: #333;}
html,body{font-size: 14px;font-family:"Microsoft YaHei";}
input,textarea{ border:none; font-family:"Microsoft YaHei";}
img { border: none; }
h1,h2,h3,h4,h5{font-weight: normal;}
table{width: 100%;border-collapse: collapse;}
audio,canvas,video{ display: inline-block; *display: inline; *zoom: 1;}
a{color: #333;;}
.fl{ float: left;}
.fr{float: right;}
.clear:after{ content: ''; display: table; clear: both; }
p{line-height: 1.6em;}
.img100 img{vertical-align: bottom;width: 100%;}
.middle-box{display: table; height: 100%;  width:100%; margin:0 auto; position:relative; table-layout: fixed;}
.middle-inner{display: table-cell; vertical-align:middle; *position:absolute; *top:50%; *left:50%; width:100%;}
.pc-show{display: block;}
.wap-show{display: none;}
.position-full{position: absolute;top:0;left: 0;width: 100%;height: 100%;}
.relative{position: relative;}
.text-center{text-align: center;}
.overhide{overflow: hidden;}
.w1200{width: 1200px;max-width: 92%;margin: 0 auto;}
body{padding-top: 89px;transition: all .4s;}
.padding-tb90{padding: 90px 0;}
.bgfff{background: #fff;}
.bgf9{background: #f9f9f9;}



/*header s*/
.header{background: #fff;position: fixed;top:0;left: 0;z-index: 999;width: 100%;height: 89px;box-shadow:0 1px 2px #ddd;}
.header{position: fixed;z-index: 999;width: 100%;left: 0;top:0;height: 100px;/*border-bottom: 1px solid #81868a;*/ background: #f2f2f2;transition: all .4s;}
.logo{position: absolute;left: 0;top:50%;transform: translateY(-50%);}
.logo img{display: block;height: 30px;}
.nav-box{margin-right: 300px;}
.nav li{float: left;position: relative;}
.nav-yi{display: inline-block;line-height: 100px;padding: 0 30px;transition: all .4s;}
.nav-er{position: absolute;padding-top: 1px; width: 140px;left: 50%;margin-left: -70px;box-shadow: 0 4px 4px 1px rgba(0, 0, 0, 0.21);opacity: 0;margin-top: 20px;transition: all .4s;pointer-events: none;}
.nav li:hover .nav-er{opacity: 1;margin-top: 0;pointer-events: auto;}
.nav-er a{display: block;background: #f2f2f2;text-align: center;line-height: 44px;}
.nav-er a:hover{background: #c71306;color: #fff;}
.nav li.active .nav-yi{color: #c71306;}
.nav li:hover .nav-yi{color: #c71306;}
.header-area{position: absolute;right: 0;top:50%;height: 20px;line-height: 20px;margin-top: -10px;font-size: 0;}
.header-line{padding: 0 30px;position: relative;}
.header-line:before{content: '';left: 0;height: 14px;top:50%;margin-top: -7px;border-left: 1px solid #cfcfcf;position: absolute;}
.header-line,.share{display: inline-block;vertical-align: middle;font-size: 14px;}
.header-line span{font-size: 16px;color: #c71306;font-family: dincondmedium;display: inline-block;vertical-align: middle;margin-top: -2px;}
.share{font-size: 0;}
.share a{display: inline-block;vertical-align: middle;width: 20px;height: 20px;background-color: #d9d9d9;border-radius: 100%;font-size: 14px;margin-left: 8px;}
.share a:nth-child(1){margin-left: 0;}
.share a.weibo{background-image: url("../images/weibo.jpg");}
.share a.weixin{background-image: url("../images/weixin.jpg");}
.share a.qq{background-image: url("../images/qq.jpg");}
.menu-handler{width: 30px; height: 32px; cursor: pointer; position: absolute;right:4%;top:14px; transition: all 0s cubic-bezier(0.445, 0.145, 0.355, 1); -webkit-transition: all 0s cubic-bezier(0.445, 0.145, 0.355, 1); -moz-transition: all 0s cubic-bezier(0.445, 0.145, 0.355, 1); display: none; }
.menu-handler .burger{height: 2px; background: #0c2043; display: block;width: 20px; position: absolute; z-index: 5; left: 5px; transform-origin: center; -webkit-transform-origin: center; -moz-transform-origin: center;-o-transform-origin: center; -ms-transform-origin: center;border-radius: 2px;-webkit-border-radius: 2px;top: 8px;}
.menu-handler .burger-2{top: 15px; }
.menu-handler .burger-3{top: 22px;}
.menu-handler.active .burger-1{top:15px; -moz-transform: rotate(225deg); -webkit-transform: rotate(225deg); -o-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg); }
.menu-handler.active .burger-2{-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); filter: alpha(opacity=0); opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; -webkit-opacity: 0; }
.menu-handler.active .burger-3{top: 15px; -moz-transform: rotate(-225deg); -webkit-transform: rotate(-225deg); -o-transform: rotate(-225deg); -ms-transform: rotate(-225deg); transform: rotate(-225deg); }
body.active{padding-top: 80px;}
body.active .header{height: 80px;}
body.active .nav-yi{line-height: 80px;}
/*header e*/
/*footer s*/
.footer-top{background: #0c2043;position: relative;}
.footer-top:before{content: '';position: absolute;top:50%;border-top: 1px solid rgba(255,255,255,.1); left: 0;width: 100%;}
.footer-bot{background: #111;}
.footer-top{padding: 70px 0;}
.footer-top ul{display: flex;justify-content: space-between;text-align: center;}
.footer-top li p{color: #344b74;transition: all .4s;}
.footer-top li span{color: #344b74;display: block;font-size: 12px;font-family: markorolight;text-transform: uppercase;transition: all .4s;}
.footer-top li strong{color: #344b74;display: block;font-size: 27px;font-family: markpromedium;text-transform: uppercase;transition: all .4s;}
.footer-top li .i{display: block;width: 100%;border-top: 1px solid #fff;margin: 18px 0;opacity: 0;transition: all .4s;}
.footer-top li:hover p{color: #fff;}
.footer-top li:hover span{color: #fff;}
.footer-top li:hover strong{color: #fff;}
.footer-top li:hover .i{opacity: .5;}
.footer-bot{padding: 16px 0;}
.footer-bot a,
.footer-bot p{color: rgba(255,255,255,.2);font-size: 12px;}
/*footer e*/
/*index*/
.banner-top{margin-bottom: 8%;}
.banner-top h2{color: #fff;font-size: 50px;letter-spacing: 4px;margin-bottom: 5px;text-indent: 4px;}
.banner-top h3{color: #fff;font-size: 25px;letter-spacing: 6px;text-indent: 6px;}
.gitied{font-size: 0;text-align: center;width: 1000px;max-width: 100%;margin:0 auto 8%;}
.gitied li{display: inline-block;font-size: 14px;width: 25%;}
.gitied span{font-size: 60px;color: #c71306;font-family: dincondbold;}
.gitied p{font-size: 16px;color: rgba(255,255,255,.7);margin-top: 10px;}
.gitied i{font-size: 16px;color: #fff;font-style: normal;margin-left: 10px;}
.gitied em{font-size: 60px;color: #c71306;font-family: dincondbold;font-style: normal;}
.banner-bot{position: absolute;bottom:50px;width: 100%;left: 0;z-index: 9;}
.bannerNum-left{position: absolute;left: 0;bottom:0;}
.bannerNum-left div{display: inline-block;line-height: 1em;color: rgba(255,255,255,.5);font-size: 16px;font-family: dincondregular;}
.bannerNum-left .cur{font-size: 36px;color: #fff;}
.mouse{width: 16px;height: 30px;border:2px solid #fff;border-radius: 20px;position: absolute;left: 50%;margin-left: -10px;z-index: 9;bottom:0;}
.mouse:before{content: '';position: absolute;width: 4px;height: 4px;border-radius: 100%;background: #fff;left: 50%;margin-left: -2px;top:5px;}
.bannerDot{position: absolute;right: 0;bottom:0;}
.swiperdot .swiper-pagination-bullet{opacity: 1;background: #fff;margin: 0 7px;}
.swiperdot .swiper-pagination-bullet-active{background: #c71306;}
.bannerDot .swiper-pagination-bullet:last-child{margin-right: 0;}
.bannerBtn div{position: absolute;cursor: pointer;width: 52px;height: 52px;overflow: hidden;border-radius: 100%;top:50%;margin-top: -26px;z-index: 9;opacity: 0.5;transition: all .4s;}
.bannerBtn1{left: -60px;background: url("../images/bannerleft.png") no-repeat center;background-size: cover;}
.bannerBtn2{right: -60px;background: url("../images/bannerright.png") no-repeat center;background-size: cover;}
.bannerBtn div:hover{opacity: 1;}
.banner:hover .bannerBtn1{left: 50px;}
.banner:hover .bannerBtn2{right: 50px;}
.padding60{padding: 60px;}
.about-left{position: absolute;width: 62.5%;height: 100%;top:0;}
.about-img{width: 37.5%;}
.title36{margin-bottom: 30px;}
.title36 h2{font-size: 36px;color: #999;font-family: dincondbold;position:relative;}
.title36 h2:before{content: '';position: absolute;right: 100%;width: 70px;top:50%;border-top: 1px solid #ddd;margin-right: 8px;}
.title36 p{color: #333;font-size: 16px;}
.about-warp{padding: 13px 50px;}
.about-warp h3{font-size: 22px;font-weight: bold;color: #c71306;line-height: 1em;margin-bottom: 30px;}
.about-des p{color: #666;}
.dltj{position: absolute;left: 10%;top:12%;}
.dltj p{font-size: 16px;font-weight: bold;color: #fff;margin: 5px 0;}
.dltj span{display: block;font-family: dincondregular;text-transform: uppercase; color: #fff;}
.product-top{padding: 40px 0;}
.product-top .title36{margin-bottom: 0;margin-left: 60px;}
.product-control{position: absolute;right: 0;top:50%;margin-top: -20px;}
.product-control a{line-height: 40px;padding: 0 20px;display: inline-block;transition: all .4s;}
.product-control a.active{background: #c71306;color: #fff;}
.product-control a:hover{background: #c71306;color: #fff;}
.wlwcps{display: none;}
.wlwcps.active{display: block;}
.wlwcps a{display: block;position: relative;overflow: hidden;}
.wlwcps h3{position: absolute;bottom:0;left: 0;width: 100%;box-sizing: border-box;padding: 15px;text-align: center;font-size: 14px;color: #fff;
    /*background:-webkit-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,.8));*/
    /*background:-moz-linear-gradient(rgba(255,255,255,0),rgba(0,0,0,.8));*/
    background: rgba(0,0,0,.5);
    transition: all .4s;}
.wlwcps .swiper-slide{background: #fff;}
.wlwcps-con{background: rgba(0,0,0,.7);top:100%;transition: all .4s;}
.wlwcps-warp{padding: 0 15px;}
.wlwcps-warp h4{text-align: center;color: #fff;font-size: 15px;font-weight: bold;margin-bottom: 12px;}
.wlwcps-warp p{color: #fff;font-size: 13px;}
.wlwcps a:hover .wlwcps-con{top:0;}
.wlwcps a:hover h3{opacity: 0;height: 100px;}
.pageStyle{margin-top: 50px;}
.pageStyle .swiper-pagination-bullet{width: 10px;height: 10px;opacity: 1;background: #dedede;margin: 0 10px;}
.pageStyle .swiper-pagination-bullet-active{background: #c71306;}
.sgblsx{padding: 80px 0;}
.sgblsx h2{font-size: 20px;color: #fff;}
.sgblsx h3{font-size: 12px;color: rgba(255,255,255,.3);font-family: markpro;text-transform: uppercase;letter-spacing: normal !important;margin: 20px 0;}
.sgblsx span{color: rgba(255,255,255,.5);display: inline-block;}
.sgblsx p{color: rgba(255,255,255,.5);}
.sgblsx span:nth-child(1){margin-right: 10px;}
.ermbox{position: fixed;z-index: 9999;top:0;left: 0;width: 100%;height: 100%;display: none;}
.ermwarp{position: absolute;top:50%;left: 50%;margin: -131px 0 0 -139px;padding: 10px;background: #fff;width: 242px;height: 277px;border:1px solid #d8d8d8;}
#erm{width: 185px;height: 185px;margin: 15px auto;}
.erlgh span{font-size: 12px;font-weight: bold;text-align: left;line-height: 16px;height: 16px;position: relative;color: #000;}
.ermwarp_close{width: 16px;height: 16px;position: absolute;right: 0;top: 0;color: #999;text-decoration: none;font-size: 16px;}
.erlgh_footer{font-size: 12px;text-align: left;line-height: 22px;color: #666;}


.prodcut-box{position: fixed;left: 0;top:0;height: 100%;width: 100%;background: rgba(0,0,0,.5);z-index:9999;display: none;}
.pd-con{background: #fff;width: 800px;position: absolute;top:50%;left: 50%;transform: translate(-50%,-50%);border-radius: 8px;max-width: 92%;}
.pd-warp{padding: 80px 30px 60px;}
.pd-warp p{font-size: 20px;color: #000;text-align: center;}
.pd-warp a{font-size: 14px;color: #fff;background: #c71305;display: block;width: 120px;text-align: center;line-height: 44px;margin: 35px auto 0;}
.gb{position: absolute;width: 19px;height: 20px;background: url("../images/gb.png") no-repeat center;background-size: cover;right: 30px;top:25px;cursor: pointer;}



.share a{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


.banner-top h3,.sgblsx h3{animation-delay: 300ms !important;}
.gitied,.sgblsx p{animation-delay: 600ms !important;}
.slideInUp,.swiper-slide-active .banner-top h2,.swiper-slide-active .banner-top h3,.swiper-slide-active .gitied{
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
@-webkit-keyframes slideInUp {
    0%{opacity: 0;  filter: alpha(opacity=0); -webkit-transform: translateY(80px);  transform: translateY(80px);}
    100%{opacity: 1;filter: alpha(opacity=1);-webkit-transform: translateY(0);transform: translateY(0);}
}
@keyframes slideInUp {
    0%{opacity: 0;  filter: alpha(opacity=0); -webkit-transform: translateY(80px);  transform: translateY(80px);}
    100%{opacity: 1;filter: alpha(opacity=1);-webkit-transform: translateY(0);transform: translateY(0);}
}