@charset "utf-8";
/* CSS Document */
*, *:before, *:after{box-sizing: border-box;}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, ul, ol, li, dl, dd{margin:0;padding:0;}
body{max-width: 1920px;margin: 0 auto;font-size: 12px;font-family: Arial, sans-serif;color: #666;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
h1, h2, h3, h4, h5, h6{font-weight: normal;font-size: inherit;}
a{color: #999;text-decoration: none;outline: none;}
a, img{-webkit-touch-callout: none;}
img{border: none;}
ul, ol{list-style: none;}
i, em{font-style: normal;}
table{border-collapse: collapse;}
input, button, select, textarea, optgroup{font: inherit;color: inherit;outline:none;}
input[type="text"], input[type="password"], input[type="search"], button, textarea{border: 1px solid #ccc;}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button{height:auto}
textarea{resize: none;}
legend{padding:0;border:0}
textarea{resize: none;}
table{border-collapse: collapse;}
td,th{padding:0}
@keyframes progress {
   0%   { border-right: 10px solid white;} 
   100%   {border-right: 0px solid white;} 
}
.rect-712 {padding-bottom: 71.2%;}
*[class*="rect-"]{position: relative;display: block; width: 100%;height: 0;overflow: hidden;}
*[class*="rect-"] ._full{position: absolute;left: 0;top:0;width: 100%;height: 100%;
*height: auto;}
.rect-50{padding-bottom: 50%;}
.rect-5625{padding-bottom: 56.25%;}
.rect-60{padding-bottom: 60%;}
.rect-618{padding-bottom: 61.8%;}
.rect-70{padding-bottom: 70%;}
.rect-75{padding-bottom: 75%;}
.rect-80{padding-bottom: 80%;}
.rect-90{padding-bottom: 90%;}
.rect-100{padding-bottom: 100%;}
.rect-64{padding-bottom: 64%;}
.rect-97{padding-bottom: 97%;}
.rect-443{padding-bottom: 44.3%;}
.rect-114{padding-bottom: 114%;}
.rect-102{padding-bottom: 102%;}
.rect-9150{padding-bottom: 91.5%;}
.rect-120{padding-bottom: 120%;}
.rect-130{padding-bottom: 130%;}
.f-cb {zoom: 1; }
.f-cb:after {display: block;height: 0;clear: both;visibility: hidden;overflow: hidden;  content: "."; }
.fix { *zoom: 1; *clear: both;}
.fix:before, .fix:after { display: table; clear: both; content: '';}
/****************************** Global Style ******************************/
.fl{float: left;}
.fr{float: right;}
.tac{text-align: center;}
.tar{text-align: right;}
.mr0{margin-right: 0 !important;}
.bd0{border-width: 0 !important;}
.center{margin-left: auto;margin-right: auto;}
.rps{display: block;max-width: 100%;}
.upload img{max-width: 100%;}
.container{max-width: 1240px;margin: 0 auto;}
.container-body{overflow: hidden;}
.container, .wrapper, .box{position: relative;}
.container:after, .wrapper:after, .box:after, .clearfix:after{content: "";display: block;clear: both;}
.ms{display: none !important;}
.f5{background: #f5f5f5;}
.f0{ background:#F0F0F0;}

@media screen and (max-width: 1365px) and (min-width:0px) {
.container{max-width: 98%;margin: 0 auto;}

}
@media (max-width:1920px){
.hide_pc{display: none!important;}
}
.visible-lg,.visible-md,.visible-sm,.visible-xs {display: none!important}
@media (max-width:991px){
.hide_mobile{display: none!important;}
}

/****************************** Icon Sprite ******************************/
header .right .search:after,
footer ul li:before,
.floater a:after,
.banner-index .arrow,
.index-product .recommend a .mask:after,
.index-product .more a:after,
.product .search .box a,
.product .list .wrapper a .mask:after,
.product-detail .picture .arrow,
.product-detail .text .name a:before,
.product-detail .consult .close,
.product-detail .recommend .list a .mask:after,
.about-profile .picture .arrow,
.about-news .top ul li span:before,
.about-news .list li .text span:before,
.about-news .list li .detail,
.about-detection .number li:before,
.about-detection .video .arrow,
.about-news-detail .attr .bdsharebuttonbox a,
.about-contact .top li h3:before,
.about-contact .bottom li span a:before{background:none;background-image: url(../images/icon.png);background-repeat: no-repeat;}



header,
header .nav,
header .nav .subnav a:after,
header .nav .subnav,
header .right,
.floater,
.banner-index .arrow,
.index-product .series li a img,
.index-product .recommend a .mask,
.index-product .recommend a h3,
.index-product .more a,
.index-product ol li,
.index-product ol li i,
.index-product ol li .name,
.product .list .wrapper a .mask,
.product .list .pagination .box a,
.product-detail .recommend .category a,
.product-detail .recommend .list a .mask,
.about-category a:after,
.about-profile .picture .arrow,
.about-news .list li,
.about-news-detail .jump .back,
.about-detection .video .arrow{-webkit-transition: all .3s;transition: all .3s;}



/****************************** Common Part ******************************/
header{position: fixed;top: 0;left: 0;z-index: 10;width: 100%;height: 90px;background: #fff;box-shadow: 0 1px 5px rgba(50, 50, 50, .2);}
header .logo{float: left;width: 280px;height: 50px;margin: 20px 0;background: url(../images/logo.png) no-repeat 0 / contain;-webkit-transition: background-image .3s;transition: background-image .3s;}

header .box-nav,
header .mobile-search{display: none;}
header .nav{position: absolute;top: 40px;left: 32%;z-index: 1;  }
header .nav li{position: relative;float: left;padding: 0 15px; }
header .nav li > a{display: block;line-height: 30px;font-size: 15px;color: #222; text-transform:uppercase; font-family:Arial, Helvetica, sans-serif;}
header .nav li.active > a,
header .nav li > a:hover{color: #E50112 !important;}
header .nav .subnav{position: absolute;top: 30px;left: 50%;height: 90px;margin-left: -680px;padding-top: 30px;text-align: center;clip: rect(0 1400px 0 0);width: 1400px; font-family:Arial, Helvetica, sans-serif;}
header .nav .subnav.active{clip: rect(0 1400px 90px 0);}
header .nav .subnav a{position: relative;display: inline-block;line-height: 48px;margin: 0 5px;font-size: 12px;color: #fff;font-family:Arial, Helvetica, sans-serif;}
header .nav .subnav a:after{content: "";position: absolute;top: 100%;right: 50%;left: 50%;width: 0;border-bottom: 2px solid #b60005;}
header .nav .subnav a:hover:after{right: 0;left: 0;width: 100%;}
header .subnav-background{position: absolute;top: 100%;left: 0;width: 100%;height: 60px;background: rgba(1,63,153,.75);border-top: 1px solid #e5e5e5;box-shadow: 0 1px 5px rgba(50, 50, 50, .2);clip: rect(0 1920px 0 0);}
header .subnav-background.active{clip: rect(0 1920px 70px 0);}

header .right{position: absolute;top: 45px;right: 0;}
header .right a{float: left;line-height: 20px;font-size: 14px;color: #888;}
header .right a:first-child:hover{color: #b60005;}
header .right em{float: left;height: 10px;margin: 5px 15px;border-right: 1px solid #333;}
header .right .search{position: relative;float: left;line-height: 20px;cursor: pointer;font-size: 16px;}
header .right .search:after{content: "";display: inline-block;width: 16px;height: 16px;margin-left: 7px;vertical-align: middle;background-position: -67px -17px;}
header .search-box{position: absolute;top: 100%;left: 0;width: 100%;height: 90px;padding-top: 14px;background: #fff;clip: rect(0 1920px 0 0);border-top: 1px solid #999;}   
header .search-box .container:after{content: "";display: block;border-bottom: 1px solid #e5e5e5;}
header .search-box .soubd{width:90%;line-height: 24px;padding: 10px 0;background: none;border: none;font-size: 16px;color: #333;letter-spacing: 1px;}
header .search-box .submit{position: absolute;top: 0px;right: 0;width: 10%;height: 45px; font-size:16PX;}
header .search-box .close{position: absolute;right: -50px;bottom: 6px;width: 22px;height: 22px;background-position: -564px -14px;}
header .search-box.active{box-shadow: 0 1px 5px rgba(50, 50, 50, .2);clip: rect(0 1920px 100px 0);border-color: #e5e5e5;}

header.dark{background: rgba(255, 255, 255, 1);box-shadow: none;}
header.dark .logo{background-image: url(../images/logo-light.png);}
header.dark .nav li > a,
header.dark .nav .subnav a{color: #000;}          
header.dark .subnav-background{background: rgba(255, 255, 255,1);}
header.dark .subnav-background.active{border-top-color: #999;}
header.dark .right a{color: #000;}
header.dark .right .search:after{background-position: -17px -17px;}
header.dark .right em{border-color: #000;}
header.dark .search-box{background: #000;}
header.dark .search-box .container:after{border-color: #000;}
header.dark .search-box input{color: #fff;}
header.dark .search-box .submit{background-position: -114px -14px;}
header.dark .search-box .close{background-position: -514px -14px;}

header.active{height: 70px;}
header.active .logo{margin: 10px 0;}
header.active .nav{top: 20px;}
header.active .right{top: 25px;}
header.active .nav .subnav{padding-top: 30px;}
header + .placeholder{height: 90px;}

/* PC */
@media (max-width: 1200px){
.container{margin-right: 20px;margin-left: 20px;}
header .nav{position: absolute;top: 40px;left: 26%;z-index: 1;  }
header .nav li{padding: 0 10px;}
header .nav .subnav a{margin: 0 22px;}
header .search-box .container:after,
header .search-box input{width: calc(100% - 60px);}
header .search-box .submit{right: 60px;}
header .search-box .close{right: 0;}
.floater{display: none;}

}

@media (max-width: 1024px){
header .nav li{padding: 0 10px;}
header .nav .subnav a{margin: 0 18px;}
header.active{height: 50px;}
}


/* Pad */
@media (max-width: 800px){
.mh{display: none !important;}
.ms{display: block !important;}
.container{margin-right: 3%;margin-left: 3%;}
[animation-name]{visibility: visible !important;}


/****************************** Icon Sprite ******************************/
header .right .show-nav,
header .box-nav .close,
header .box-nav .mobile-search a,
.product .search .box a:after{background: none;background-image: url(../images/icon.png);background-repeat: no-repeat;background-size: 300px 300px;}


/****************************** Common ******************************/
header{height: auto;background: #fff;box-shadow: 0 1px 5px rgba(50, 50, 50, .2);}
header .logo{width: 48.6vw;margin: 10px 0;background-image: url(../images/logo.png);height: 8vw;}
header .right{top: 50%;right: 0;margin-top: -16px;}
header .right em,
header .right .search{display: none;}
header .right .lang{width: 32px;height: 32px;line-height: 32px;font-size: 20px;color: #333;text-align: center;letter-spacing: 2px;}
header .right .show-nav{float: left;width: 32px;height: 32px;margin-left: 20px;background-position: -109px -110px;}
header.dark .right .show-nav{background-position: -59px -110px;}

header .nav{display: none;}
header .box-nav{position: fixed;top: 0;left: 0;display: block;width: 100%;height: 100%;padding-left: 24%;background: rgba(0, 0, 0, .6);-webkit-transition: all .5s;transition: all .5s;clip: rect(0 800px 0 0);z-index: 10; z-index:99999;}
header .box-nav.active{clip: rect(0 800px 1200px 0);}
header .box-nav:before{content: "";position: absolute;top: 0;right: 0;width: 76%;height: 100%;background-color: #fff;}
header .box-nav .close-rect{position: absolute;top: 0;left: 0;width: 24%;height: 100%;}
header .box-nav .close{position: absolute;top: 30px;left: 12%;width: 35px;height: 35px;margin-left: -17px;background-position: -7px -107px;}
header .box-nav .mobile-search{position: relative;z-index: 1;display: none;margin: 30px 8%;padding: 10px;overflow: hidden;background: #e5e5e5;border-radius: 3px;}
header .box-nav .mobile-search .sbd{float: left;width: calc(90% - 24px);line-height: 24px;background: none;border: none;font-size: 15px;color: #333;letter-spacing: 1px;}
header .box-nav .mobile-search a{float: right;width: 24px;height: 24px;background-position: -213px -113px;}
header .box-nav ul{position: relative;z-index: 1;height: calc(100% - 104px);overflow: scroll;}
header .box-nav ul li > a{position: relative;display: block;line-height: 80px;padding: 0 8%;border-bottom: 1px solid #e5e5e5;font-size: 24px;color: #333;}
header .box-nav ul li:nth-child(2) > a:after,
header .box-nav ul li:nth-child(3) > a:after,
header .box-nav ul li:nth-child(4) > a:after,
header .box-nav ul li:nth-child(5) > a:after,
header .box-nav ul li:nth-child(7) > a:after{content: "";position: absolute;top: 50%;right: 5%;width: 20px;height: 20px;margin-top: -10px;border-right: 1px solid #666;border-bottom: 1px solid #666;-webkit-transition: all .5s;transition: all .5s;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
header .box-nav ul li.unfold > a:after{-webkit-transform: rotate(45deg);transform: rotate(45deg);}
header .box-nav ul li.active > a{color: #b60005;}
header .box-nav .subnav{height: 0;overflow: hidden;-webkit-transition: all .3s;transition: all .3s;}
header .box-nav .subnav a{display: block;line-height: 60px;margin-left: 8%;border-bottom: 1px solid #e5e5e5;font-size: 20px;color: #666;}
header .box-nav a:active{color: #b60005;}
header + .placeholder{height: calc(7.52vw + 24px);}

}


/* Mobile */
@media (max-width: 480px){
header .right .lang{font-size: 18px;}
header .box-nav.active{clip: rect(0 800px 800px 0);}
header .box-nav .close{top: 20px;}
header .box-nav .mobile-search{margin: 20px 8% 10px;}
header .box-nav ul li > a{line-height: 50px;font-size: 16px;}
header .box-nav ul li:nth-child(2) > a:after,
header .box-nav ul li:nth-child(3) > a:after,
header .box-nav ul li:nth-child(4) > a:after,
header .box-nav ul li:nth-child(5) > a:after,
header .box-nav ul li:nth-child(7) > a:after{width: 12px;height: 12px;margin-top: -6px;}
header .box-nav .subnav a{line-height: 40px;font-size: 14px;}
}



/****************************** CSS3 Animation ******************************/
[animation-name]{
visibility: hidden;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}

@-webkit-keyframes fadeInLeft50 {
from {
opacity: 0;
-webkit-transform: translate3d(-50px, 0, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInLeft50 {
from {
opacity: 0;
transform: translate3d(-50px, 0, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInRight50 {
from {
opacity: 0;
-webkit-transform: translate3d(50px, 0, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInRight50 {
from {
opacity: 0;
transform: translate3d(50px, 0, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInUp50 {
from {
opacity: 0;
-webkit-transform: translate3d(0, 50px, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInUp50 {
from {
opacity: 0;
transform: translate3d(0, 50px, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInDown50 {
from {
opacity: 0;
-webkit-transform: translate3d(0, -50px, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInDown50 {
from {
opacity: 0;
transform: translate3d(0, -50px, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInLeft100 {
from {
opacity: 0;
-webkit-transform: translate3d(-100px, 0, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInLeft100 {
from {
opacity: 0;
transform: translate3d(-100px, 0, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInRight100 {
from {
opacity: 0;
-webkit-transform: translate3d(100px, 0, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInRight100 {
from {
opacity: 0;
transform: translate3d(100px, 0, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInUp100 {
from {
opacity: 0;
-webkit-transform: translate3d(0, 100px, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInUp100 {
from {
opacity: 0;
transform: translate3d(0, 100px, 0);
}

to {
opacity: 1;
transform: none;
}
}

@-webkit-keyframes fadeInDown100 {
from {
opacity: 0;
-webkit-transform: translate3d(0, -100px, 0);
}

to {
opacity: 1;
-webkit-transform: none;
}
}
@keyframes fadeInDown100 {
from {
opacity: 0;
transform: translate3d(0, -100px, 0);
}

to {
opacity: 1;
transform: none;
}
}
.footer_pc {background:#005BAC;overflow:hidden;padding:60px 0;}
.footer-main {overflow:hidden;}
.footer-main li {position:relative;width:11.5%;padding-right:15px;margin-right:30px;}
.footer-main li:after {position:absolute;width:1px;height:225px;background:#4786c1;right:0;top:0;content:"";}
.footer-main li h2 { font-size:16px;line-height:18px; text-transform:uppercase;color:#f5f5f5;margin-bottom:20px;}
.footer-main li p a {font-size:13px;color:#f5f5f5;opacity:0.85;display:block;}
.footer-main li p a:hover {font-size:13px;color:#fff;opacity:0.95;display:block;}
.footer-main li:nth-child(2) {position:relative;width:26%;padding-right:26px;}
.footer-main li p {line-height:18px;margin-bottom:12px;}
.footer-main li.last {width:28%;padding-right:0px;margin-right:0}
.footer-main li.last {color:#f5f5f5;line-height:18px;font-size:14px}
.footer-main li.last strong {font-size:28px;font-weight:normal;margin-bottom:10px;display:block;line-height:52px}
.footer-main li.last h3 {font-size:20px; line-height:28px; text-transform:uppercase;font-weight:normal;margin-bottom:4px;background:url(../images/tel.png) no-repeat left center;padding-left:28px;}
.footer-main li.last .contact1 { font-size:14px;font-weight:normal;margin-bottom:10px; height:24px; line-height:24px;background:url(../images/phone.png) no-repeat left center;padding-left:28px;}
.footer-main li.last .contact2 { font-size:14px;font-weight:normal;margin-bottom:10px; height:24px; line-height:24px;background:url(../images/email.png) no-repeat left center;padding-left:28px;}
.footer-main li.last .contact3 { font-size:14px;font-weight:normal;margin-bottom:10px; height:24px; line-height:24px;background:url(../images/fax.png) no-repeat left center;padding-left:28px;}
.footer-main li.last a {color:#f5f5f5;font-family:"Arial";}
.footer-main li.last:after {background:none}
.footer_bottom { background:#292929;color:#808080;font-size:14px;line-height:50px; height:50px;}
.footer_bottom p {display:inline;width: 100%}
.footer_bottom a {color:#808080;display: inline-block;}
@media screen and (max-width: 1024px) and (min-width:0px) {
.footer_pc {background:#292929;overflow:hidden;padding:5px 0;}
.footer-main { display:none; }
.footer_bottom .fl{ float:none;text-align:center;}
.footer_bottom .fr{ float:none;text-align:center;}
.footer_bottom { background:#292929;color:#808080;font-size:14px;line-height:25px; height:50px;}

}

/*分页*/
.page_box{width:100%;padding:20px 0;}
.page_box .page_l{width:100%;text-align:left;}
.page_box span{display:inline-block;background-color:#C0C0C0;padding: 10px 20px;color:#333;vertical-align:middle;}
.page_box a{display:inline-block;background-color:#004488;padding: 10px 20px;color:#fff;vertical-align:middle;}
.page_box a:hover,.page_box span a.cur{background-color:#004488;color:#fff;}
.page_box .now_page{background:none;border:1px solid #e4eef5;box-sizing:border-box;}
.page_box .now_page:hover{background:none;border:1px solid #e4eef5;color:#666;}
.page_box .page_r a{padding:18px 14%;}
@media only screen and (max-width: 760px) {
.page_box .page_l{width: 100%;margin-bottom: 10px;}
.page_box .page_r{width: 100%;text-align: left;}
.page_box span{padding:5px 10px;}
.page_box a{padding:5px 10px;}
.page_box .page_r a {padding: 5px 10px; }
}

.page_list{border-top: 1px dashed #d3d3d3;margin-top: 16px;padding-top: 10px;margin-bottom: 30px;}
.page_list li{line-height: 24px;color: #333;}
.page_list li a{color: #333;}
.page_list li a:hover{color: #E50112;}
.page_list .return{float: right;font-size: 14px;color: #E50112;border: 1px solid #E50112;line-height: 38px;padding: 0 20px;margin-top: 6px;}

@media screen and (max-width: 1024px) and (min-width:0px) {
.page_list .return{float: left;font-size: 14px;color: #E50112;border: 1px solid #E50112;line-height: 38px;padding: 0 20px;margin-top: 6px;}
.page_list ul{ width:100%;}
}