@charset "utf-8";
.cpnav{ background-color: #abd9f3; float: left; width: 100%; }
.cpfl{ float: left; width: 88%; overflow:hidden;}
.cpfl li{  padding: 0 20px 20px; background-color: #fff; height:100%;}
.cpfl li .top{ padding-top:60px;   transition: 0.9s ease; text-align:center;}
.cpfl li h2{ position: relative; }
.cpfl li h2::before{ content: '';position: absolute; left:45%; width:27px; height: 3px; background-color: #838383; top: -4px;}
.cpfl li span{ font-family: impact; color: #e4e6e7; margin-bottom: 10px; display: block; }
.cpfl li p{ color: #717171; }
.cp_icon{ padding: 15px 0;    transition: 0.9s;}
.cpfl li:nth-of-type(2n){ background-color: #f1f1f1;}



 
.cpfl li:hover .top {    padding-top:45px; padding-bottom:15px;}
.cpfl li:hover .bottom {    padding-bottom:20px;}
.cpfl li :hover .cp_icon {    transform: scale(1.1);}

.cp_tit {float: left; position: relative; width: 12%; padding: 60px 20px 20px; text-align: center;}
.cp_tit h3{ position: relative;}
.cp_tit strong{font-family: impact; font-weight: 400; display: block;  color: #f9fdff; font-size: 28px; font-weight: 400; }
.cp_tit b{ color: #00a9e7; position: absolute; left: 0; top: 15px; z-index: 1; font-weight: 700; font-size: 22px; width: 100%; text-align: center;}
.cp_tit img{ width:45%; margin: 50px 0 40px;}
.cp_tit span{color: #00a9e7; background-color: #fff; padding: 3px 10px; border-radius: 30px; display: inline-block; }

.index2{ background:  center center; height: 68vh; background-size: cover; padding: 88px 0;}
.kr{ width: 40%; padding-left: 50px; color: #fff;}
/*.kr h3{ background-color: rgba(255,255,255,0.72); color: #00a9e7; padding: 5px 25px; margin-top: 45px; font-weight: 700; display:inline-block; margin-bottom: 35px;}
.kr p{ color: #fff; line-height: 52px; font-size: 22px;}
.kr b{ background-color: #e40007;  color: #fff; width: 42px; height: 42px; font-size: 24px; line-height: 42px; display:inline-block; text-align: center; border-radius: 50px;}*/
.kr ul{ margin-top:6vh;}
.kr li{ margin-bottom:40px; font-size:18px; line-height:180%; text-align:center;}
.kr li span{ display:block;}
.kr li span b{  color:#e40007; margin-right:5px; font-size:42px;font-family: impact; font-weight:400;}
.in_nav{margin:20px 0 30px;float:left;width:100%;position:relative;text-align: center;}
.in_nav:before{ content:''; position:absolute; left:50%; width:80%; height:1px;  background-color:#aaa; left:10%; top:30px;}
.in_nav h3{ font-size: 42px; background-color:#fff;display:inline-block; padding:0 15px; color: #e4e6e7; text-align: center; height: 60px; line-height: 60px; position: relative; font-weight: 700;}
.in_nav span{ position: absolute; z-index: 1; left: 50%; margin-left: -88px; color: #02aae7; font-size: 32px; font-weight: 700; letter-spacing: 1px;}
.in_nav p{ text-align:center; color:#848484;font-size: 18px; letter-spacing: 1px;}

.cp_nav li{ padding: 13px; margin-bottom: 5px; background-color: #f1f1f1; text-align: center; border-right: 3px solid #fff; line-height: 200%; border-bottom: 2px solid #f1f1f1;}
.cp_nav li:hover,.cp_nav .on{ background-color: #e8f0f4; border-bottom: 2px solid #00a9e7;}
.cp_nav li a span{ font-size:16px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis; height:32px; display:block;}
.cp_nav li:hover a span,.cp_nav .on a span{ color: #e40007; font-weight: 700;}
 
 .cplist ul{ height:540px;}
 .cplist li{ float:left; width:calc(25% - 24px);    margin: 12px;overflow: hidden; }
 .cplist li .cp-img{ height: 248px; width: 100%; overflow: hidden;   float: left; }
  .cplist li .cp-img img{transition: all .3s linear;}
 .cplist li:hover .cp-img img{  transform: scale(1.05); }
 .cplist li h3{  height:52px; line-height:48px; color:#00a9e7;  font-weight:400;  word-break:keep-all; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;  text-align: center;float: left; width: 100%; padding: 0 10px;}
 .cplist li:hover h3{ font-weight: 700; background-color: #efefef; border-bottom: 2px solid #7fa8bf;}

 .clfw li{ position: relative; cursor: pointer;   text-align: center; height: 100%;  } 
 .clfw li .fw_img{   float: left; width: 100%; background-color: #020731;}
.clfw li .fw_img img{ opacity: 0.4;}
.clfw li .fw_tit{ position: absolute;  float: left; width: 100%; top: 45%;   }
.clfw li .fw_tit h3{ color: #fff; font-size: 24px; z-index: 2; position: relative; top: 45%;}
.clfw li .fw_tit h3::before{ width:40px; height: 5px; background-color: #00a9e7; position: absolute; left: 45%;  top:40px; content: '';}
.fw_hover{ position: absolute; background-color: #00a9e7;height: 100%; padding: 50px; color: #fff; z-index: 3; display: none;   transition: 0.9s;} 
 
.fw_hover strong{ width: 68px; margin-top: 5vh; padding: 10px; height: 68px; border-radius: 50%; background-color: #fff; display:inline-block; margin-bottom: 30px;}
.fw_hover p{ line-height: 28px;}
.fw_hover h2{ font-size: 16px; width: 40%; height: 38px; line-height: 35px; border: 1px solid #fff; position: absolute; bottom:70px; left: 30%;  }

.clfw li:hover .fw_hover{ display: block;}

.about{ background:  center bottom no-repeat; background-size:contain; padding: 30px 0 70px;}
.about .fl { padding:0 45px;}
.about .fl h3{ color: #00a9e7; margin-top: 20px; display: block; margin-bottom: 20px; font-weight: 700; }
.about .fl p{ line-height: 32px; text-indent: 2em;}
.about .fr{ position:relative;}
 
 
 .box {
    position:absolute;
    display: inline-block;
    width: 10rem;
    height: 10rem;
    line-height: 10rem;
    vertical-align: middle; top:30%; left:42%;
}


.box01 {
    display: inline-block;
    width: 10rem;
    height: 10rem;
    line-height: 10rem;
    border-radius: 50%;
    vertical-align: middle;
}

.box01 span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 50%;
    background-color: #e0e0e0;
    -webkit-transform: scale(0.4);
    -moz-transform: scale(0.4);
    -ms-transform: scale(0.4);
    transform: scale(0.4);
    -webkit-animation: circlescale1 4s linear infinite;
    -moz-animation: circlescale1 4s linear infinite;
    -ms-animation: circlescale1 4s linear infinite;
    animation: circlescale1 4s linear infinite;
}

.box01 span:nth-of-type(2) {
    animation-delay: 1s;
}

.box01 span:nth-of-type(3) {
    animation-delay: 2s;
}

.box01 span:nth-of-type(4) {
    animation-delay: 3s;
}

@keyframes circlescale1 {
    0% {
        opacity: 1;
        -webkit-transform: scale(0.4);
        -moz-transform: scale(0.4);
        -ms-transform: scale(0.4);
        transform: scale(0.4);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

.box02 {
    display: inline-block;
    width: 5rem;
    height: 5rem;
    line-height: 5rem;
    vertical-align: middle;
    position: relative;
    border-radius: 50%;
    overflow: hidden;
    background: #e2e2e2;left: 40px;
    top: -4px;
}


/* 焦点图 */
.cpbimg { float:left; position: relative; width: 42%;  height:46vh;/* margin-bottom:10px; */ overflow: hidden;  text-align: left; background:#fff; overflow:hidden;  zoom:1;}
.cpbimg .pic li { width: 100%; height:50vh; display: block; }
.cpbimg .txt-bg { position: absolute; bottom: 0; z-index: 1; height: 42px; width:100%;  background: #333; filter: alpha(opacity=40); opacity: 0.4; overflow: hidden; }
.cpbimg .txt { position: absolute; bottom: 0; z-index: 2; height: 42px; width:100%; overflow: hidden;  color:#fff; background: rgba(0,0,0,0.2);}
.cpbimg .txt li{ height:42px; line-height:42px; position:absolute; bottom:-42px;}
.cpbimg .txt li a{ display: block; color: white; padding: 0 0 0 10px; font-size: 16px;   text-decoration: none; }
.cpbimg .num { position: absolute; z-index: 3; bottom: 12px; right: 8px; }
.cpbimg .num li{ float: left; position: relative; width: 8px; height: 8px;  overflow: hidden; text-align: center; margin-right: 6px; cursor: pointer; border-radius: 4px;background:#fff;   }
.focusbox .num li span { position: absolute; z-index: 2; display: block; color: white; width: 100%; height: 100%; top: 0; left: 0; text-decoration: none; }
.cpbimg .num li span { z-index: 1; background: #00a9e7; filter: alpha(opacity=50); opacity: 0.5; }
.cpbimg .num li.on,.focusbox .num li:hover{ background:#00a9e7;   } 

.xw-c{ float: left; width: 26%;  text-align: left; padding: 0 1%;}
.xw-c li{ background-color: #ededed; padding: 10px 15px; height: 22vh; text-align: left;}
.xw-c li:first-child{ margin-bottom:2vh;}
.xw-c li h4{ line-height: 42px; color: #333; font-weight: 700;}
.xw-c li p{ color: #5d5d5d;   margin-bottom: 5px;display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.xw-c li h5{ float: left; width: 100%; text-align: right; background: url(/uploads/image/phimages/more3.png) center right no-repeat ; margin-top:10px; padding-top:5px; border-top: 1px solid #a8a8a8; background-size: 20px; }
.xw-c li:hover{ background-color: #00a9e7; }
.xw-c li:hover p{ border-bottom: 1px solid #8cd8f4;}
.xw-c li:hover h4,.xw-c li:hover p,.xw-c li:hover h5 span{color: #fff;} 
.xw-c li:hover h5{background: url(/uploads/image/phimages/more1.png) center right no-repeat ;}
.xw-c li h5 span{ float: left; color: #999;}
.xw-c li h5 span i{ font-weight: 700; font-size: 24px; display: block; text-align: left;}

.xw-r{ float: left; width: 32%;}
.xw-r li{background-color: #ededed; height:calc(11vh - 7px) ; margin-bottom: 15px; padding: 7px 15px;}
.xw-r li h5 span{ float: left; width: 18%; color: #999; height:calc(11vh - 21px) ;border-right: 1px solid #a8a8a8; text-align: left;  }
.xw-r li h5 span i{ font-weight: 700; font-size: 24px; display: block; text-align: left;}
.xw-r li h5 strong{ text-align: left; padding-left: 20px; font-size: 15px; line-height: 32px; float: left; width: 80%; line-height: 26px; padding-bottom: 18px;}
.xw-r li strong{ background: url(/uploads/image/phimages/more2.png) 20px bottom no-repeat; background-size: 20px;}
.xw-r li:last-child{ margin-bottom: 0;}

.sbanner{ height: 388px; background-repeat: no-repeat; background-position: center center;;}
.snav{ text-align: right; position: relative; height: 90px; line-height: 90px; background-color: #f1f1f1; color: #848484;}
.snav span{ float: left; position: absolute; width: 172px; height: 136px; background-color: #00a9e7; color: #fff; bottom: 0; text-align: left; font-size: 22px; font-weight: 700; padding: 0 20px; min-width: 120px; line-height: 28px; left: 0; padding-top: 37px;}
.snav span b{ font-weight: 400; display: block;font-size: 15px;}
.snav h2{ float: left; margin-left: 182px;  line-height: 90px;font-size: 17px;font-weight: bold;}
.snav h2 a{ margin: 0 15px; position: relative; color: #343434;}
.snav h2 a:hover,.snav h2 a.selon{ color: #00a9e7; font-weight: 700;   }
.snav01{height: 48px; line-height: 48px; padding:0 12px; margin-top:7px; }
.snav h2 a:hover::before,.snav h2 a.selon::before{position: absolute; content: ""; width: 50%; height: 2px; background-color: #00a9e7; left: 25%; bottom: -5px;}
.snav h3{ margin-left:20px;  float:left;}
.snav h3 a{background-color:#e40007; color:#fff; font-size:14px; letter-spacing:1px; border-radius:28px; padding:10px 15px; transition: all .3s linear;}
.snav h3 a:hover{ color:#fff;background-color:#00a9e7;}
.cp_fl li{   line-height: 60px; border-bottom: 1px solid #f0f0f0;}
.cp_fl li span{ display:inline-block;   width: 168px; font-size: 16px; font-weight: 700;}
.cp_fl li span a{background-color: #abd9f3;color: #fff; width:100%; text-align:center;font-size: 16px; border-radius:3px;line-height: 38px;height: 38px;transition: all .3s linear;}
.cp_fl li span a:hover{background-color: #00a9e7;color: #ffe400;}
.cp_fl li a{ padding: 0 9px; margin: 0 10px;  line-height: 32px; display: inline-block;font-size: 16px; height: 32px;transition: all .3s linear;}
.cp_fl li > a:hover,.cp_fl li > a.selon{ background-color: #00a9e7; color: #fff;}
.snav > a{ color: #727272;}

.seabg{ height: 68px; line-height: 68px; text-align: right; background-color: #f1f1f1;}
.seabg span{ float: left; font-size: 16px;font-weight: bold;}
.seabg span a{ margin: 0 6px;}
.sel_txt{ background-color: #fff; border: 1px solid #dedede; height:32px; line-height: 32px; padding: 0 7px; width: 270px;}
.seabt{ background-color: #00132b; color: #fff; width: 68px; height: 30px; line-height: 30px; border: none;}

.cp_bimg{ padding-right: 55px; height: 470px;}
.lxfs{ font-size: 17px; line-height: 37px;}
.lxfs li span{  font-weight: bold;}


.cpr{ position: relative; }
.car-bo{  padding:5px 0;  line-height:32px;font-size:14px; display:inline-block; width:100%;   }
.car-bo h3{float:left; font-weight:400; margin-left:15px; }
.car-bo span{float:left;margin-right:20px; list-style-type:none; color:#2ac258;background:url(/uploads/image/phimages/go.png) no-repeat 0px 10px;padding-left:20px}	
 
.cp_zx {position:absolute;bottom: 53px; background:url(/uploads/image/phimages/tel1.jpg) left 4px no-repeat; padding-left:55px;}
.cp_zx span{width: 320px;  font-size: 18px; line-height:34px; }
.cp_zx span b{ color: #d00;font-size: 32px;display: block;font-weight: 700;}
.cp_zx p{ height: 45px;line-height: 45px;font-size: 16px;}
.cp_zx img{width:168px;  /* margin-bottom:15px; *//* margin-left: 92px; */position: absolute;left: 420px;top: -128px;}

.cpr h5{ float:left; width:100%; margin-top:82px;}
.cpr h5 a{ background-color: #00a9e7; color:#fff; font-size:18px; display:inline-block; margin-right:15px; text-align:center; height:42px; line-height:42px; width:175px;}
.cpr h5 a:hover,.cpr h5 .selon{background-color: #fff; border:1px solid #00a9e7; color:#00a9e7; }
.cpr h5 .selon:hover{background-color: #00a9e7; color:#fff; }

.tjnew{  padding:0 20px; margin-top: 25px;}
.tjnew li{ float:left; width:100%; padding-bottom:15px; margin-bottom:15px; border-bottom:1px dashed #ccc; position: relative; }
.tjnew li .xwimg{ float:left; width:240px; height:168px;   margin-right:20px;  padding:3px; border:0px solid #ccc;-moz-box-shadow:0px 0px 6px #ededed; -webkit-box-shadow:0px 0px 6px #ededed; box-shadow:0px 0px 6px #ededed;}
.tjnew li h3{ height:45px; line-height:45px;  font-size: 12px; color: #666;  font-weight:100; text-align: right; }
.tjnew li h3 a{ float: left;  font-weight:700; font-size:18px;}
.tjnew li p{ line-height:24px; color:#777; font-size:16px;}
.tjnew li span{ font-size: 14px;  color: #686868; line-height:32px; }
 
.tjnew li h5{ float:right;right:0; width:calc(100% - 260px); position: absolute; bottom: 20px;} 
.tjnew li h5 a{ background-color: #dcf6ff; color:#00a9e7; font-size:15px; height:32px; display:inline-block; line-height:32px; padding:0 17px; transition: all .3s linear;}
.tjnew li h5 a:hover{background-color: #00a9e7; color:#fff;}

.arc_title{ height:52px; line-height:52px; font-size:24px;  font-weight:700;  text-align: center; }
.arc_name{ height:34px;text-align: center;  line-height:24px; font-weight: 100;  font-size:13px; color:#666; border-bottom: 1px solid #dedede;  }


.fy{ text-align: right; border-top: 1px solid #dedede; height: 32px; line-height: 32px; font-size: 15px; color: #686868; margin-bottom: 15px;}
.fy a,.kyword a{color: #686868;}
.fy span{ float: left;} 

.article{ display: inline-block; width: 100%;  font-size: 14px; line-height: 180%; padding: 0 25px; }
.article table {border-top:1px solid #dedede; border-right:1px solid #dedede;}
.article table tr td{ border-bottom: 1px solid #dedede; border-left: 1px solid #dedede; padding: 8px 5px; font-size: 14px;}

.zbsear{ margin-left: 192px; float: left;}

.zbxx table{ border-left: 1px solid #eee;border-top: 1px solid #eee;}
.zbxx table tr th{ font-weight: 700; padding: 12px 0; background-color: #fafafa;}
.zbxx table tr td,.zbxx table tr th{ border-right: 1px solid #eee;border-bottom: 1px solid #eee; color: #727272;    padding: 12px 10px;}
.zbxx table tr td p{ max-width: 120px;display: -webkit-box;  -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;}
.zbxx table tr td a{ background-color: #00a9e7; color: #fff; font-size: 13px; padding: 3px 7px; margin: 3px 5px;  }
.zbxx table tr td a:hover{ background-color: #d30012; color: #fff;}
.zbxx table tr:nth-of-type(2n 1){ background-color: #f5f7fa;}
.zbxx table tr:hover td{ background-color: #f8f8f8; color: #00a9e7;}


#mask-kk{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; background: #666; opacity: 0.5; display: none;  }
.popup-kk{  position: absolute; left: 25%;  max-width: 50%; height: 80vh; overflow-y: auto; background: #fff;  z-index: 1000; display: none;  border-radius:5px; padding-bottom: 10px; }
 
.popup-kk h3{ text-align: right; height: 42px; line-height: 42px; border-bottom: 1px solid #d1d2d4; padding: 0 15px;}
.popup-kk h3 span{ float: left; font-size: 16px;}
.close {  position: absolute;  top: 8px;  right: 10px; cursor:pointer; font-size: 24px; height: 26px; width: 26px; line-height: 24px; font-weight: 400; border-radius: 50%; text-align: center; background-color: #00132b;  color: #fff;}

.fw_tel{ width: 310px; height: 188px;}
.fw_tel p{ color: #e40007; font-weight: 700; margin-top: 30px;}

.scplist{ border: 1px solid #dedede; padding: 5px 15px;}
.scplist li{padding: 8px 0;  width: 100%;}
.scplist li img { vertical-align: top;    width: 100%;}
.scplist li h3{font:normal 16px/32px "microsoft yahei",helvetica,tahoma,sans-serif;color:#606977;  overflow:hidden}
.scplist li h3 a{display:inline;color:#141823}
.scplist li h3 a:hover{color:#e94615;} 

.sl_tit{ height: 48px; line-height: 48px; background-color: #00a9e7; color: #fff; padding: 0 12px;}

.cpl{ padding-right: 30px;} 
.product-title { width:100%; float:left; text-align: center;  padding:10px 0 10px;  background: #383842; color:#fff; margin-bottom: 15px; }
.product-title h3{ margin:0;padding:0;  margin-bottom:10px;  line-height:32px;   font-size:28px; font-weight: 700; letter-spacing: 4px; }
.product-title .en{ color:#fff; font-size:16px; line-height: 20px;  display: inline-block;  position: relative; }
.product-title .en span{  padding:0 20px; position: relative; display: inline-block; background: #383842; text-transform:uppercase; z-index: 9999;  min-width: 240px; text-align: center;  }
.product-title .en:after{  display: inline-block; position: absolute; width:calc(100%   256px); left:-128px; top:6px;  height:1px; background: #fff;  content:'';  z-index: 999;  }
.product-title .en:before{ display: inline-block;  position: absolute;
  width:calc(100%   176px);  left:-88px;  bottom:6px;  height:1px;  background: #fff; content:'';  z-index: 999;  }
   
.cpxx .wli-2 li{padding: 8px; height: 388px;}
@media (max-width: 1280px) {
.snav h2{ font-size: 15px; }
.fw_hover{ padding:30px;}
.fw_hover strong{margin-top:20px;}
.fw_hover h2{ bottom:10px;}
.fw_hover p{ line-height:24px;}
}