﻿



/* 通用样式 */

p {

  margin: 0;

}





input,

textarea {

  border: none;

  outline: none;

  background-color: transparent;

}



img {

  vertical-align: middle;

}



.p1920 {

  width: 1920px;

  position: relative;

  left: 50%;

  margin-left: -960px;

}



.wd1200 {

  width: 1200px;

  margin: 0 auto;

}



.bw {

  width: 100%;

}



.clearfix::after {

  content: '';

  display: block;

  height: 0;

  clear: both;

  overflow: hidden;

  visibility: hidden;

}



.clearboth {

  height: 0px;

  line-height: 0px;

  overflow: hidden;

  clear: both;

  font-size: 0px;

}



.fl {

  float: left;

}



.fr {

  float: right;

}



.dfc {

  display: flex;

  justify-content: space-between;

  align-items: center;

}



.ovimg,

.ibw,

.miw,

.iml,

.imgbig {

  overflow: hidden;

}



.imgbig img {

  -webkit-transition: all ease .5s;

  -moz-transition: all ease .5s;

  -ms-transition: all ease .5s;

  -o-transition: all ease .5s;

  transition: all ease .5s;

}



.imgbig:hover img {

  -webkit-transform: scale(1.2, 1.2);

  -moz-transform: scale(1.2, 1.2);

  -ms-transform: scale(1.2, 1.2);

  -o-transform: scale(1.2, 1.2);

  transform: scale(1.2, 1.2);

}



.ovimg img {

  width: 100%;

  min-height: 100%;

}



.ibw img {

  width: 100%;

  height: auto;

}



.miw img {

  max-width: 100%;

  max-height: 100%;

}



.iml {

  text-align: center;

}



.iml img {

  transform: translateY(-2px);

  vertical-align: middle;

}



.bgmax {

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center top;

}



.bgmin {

  background-repeat: no-repeat;

  background-size: contain;

  background-position: center top;

}



.fh {

  overflow: hidden;

  white-space: nowrap;

  text-overflow: ellipsis;

}



/**/

.flexed {

  display: flex;

  justify-content: space-between;

  flex-wrap: nowrap;

  display: -webkit-flex;

}



.w1600{

    max-width: 1630px;

    margin: 0 auto;

    padding-left: 15px;

    padding-right: 15px;

}



/* head */

.head-bg{

  padding: 30px 3.64583333333333%;

  position: absolute;

  left: 0;

  right: 0;

  width: 100%;

  z-index: 99;

}



.head-index{

  align-items: center;

}



.head-index .logo{

  width: 27%;

}



.head-index .logo img{

  max-width: 100%;

}



.head-index .headr{

  align-items: center;

  width: 65.65%;

}



.head-index .headr .tnav{

  width: 77%;

}



.head-index .headr .ttel{

  

}



.head-index .headr .ttel p{

  display: flex;

  align-items: center;

  font-size: 24px;

  font-family: "Arial";

  color: #fff;

  font-weight: 600;

}



.head-index .headr .ttel p img{

  max-width: 100%;

  margin-right: 5px;

}



@media(max-width: 1280px){

  .head-index .headr{

    width: 60%;

  }

}



@media(max-width: 1024px){

  .head-index .headr .ttel p{

    font-size: 20px;

  }

}



/* banner */

.bannerSwiper{

  overflow: hidden;

  width: 100%;

  position: relative;

}



.bannerSwiper img{

  width: 100%;

}



.bjian{

  position: absolute;

  left: 0;

  bottom: 0;

  background: #002854;

  width: 407px;

  padding: 42px 70px;

  z-index: 99;

  display: flex;

  align-items: center;

  justify-content: space-between;

}



.bjian img{

  max-width: 100%;

}



.bjian .bnext{

  display: flex;

  align-items: center;

  outline: none;

  color: #fff;

  font-size: 16px;

  font-weight: 600;

}



.bjian .bnext img{

  margin-right: 30px;

}



.bjian .bprev{

  display: flex;

  align-items: center;

  outline: none;

  color: #fff;

  font-size: 16px;

  font-weight: 600;

}



.bjian .bprev img{

  margin-left: 30px;

}



/* about */

.ab-index{

  margin-top: 8.07291666666667vw;

}



.abl{

  width: 15.5%;

}



.put{

  font-weight: 600;

}



.put .put1{

  color: #111111;

  font-size: 48px;

  position: relative;

}





.put .put2{

  color: #111111;

  font-size: 24px;

  font-family: "Arial";

  margin-top: 1vw;

}



.amore{

  border: 1px solid #999999;

  width: 180px;

  height: 54px;

  margin-top: 7.29166666666667vw;

}



.amore a{

  display: block;

  text-align: center;

  color: #111111;

  font-size: 16px;

  line-height: 52px;

}



.amore a span{

  color: #0070c2;

}



.abr{

  width: calc(100% - 28.125%);

}



.abr p{

  color: #666666;

  font-size: 16px;

  line-height: 32px;

  margin-bottom: 1.5625vw;

  text-align: justify;

}



.abimg{

  margin-left: 0px;

}



.abimg .w1600{

  display: flex;

  justify-content: flex-end;

}



.aimg1{

  margin-top: -130px;

}



.aimg1 img{

  width: 100%;

}



.abpic{

  width: 73.75%;

  position: relative;

  z-index: 99;

}



.ablist li{

  background: #fff;

  border-radius: 12px;

  box-shadow: 0px 2px 8.46px 0.54px rgba(19, 47, 67, 0.12);

  width: 17.5%;

  padding: 35px 40px;

  transition: 0.5s;

}



.ablist li .w1{

  color: #111111;

  font-size: 24px;

  font-weight: 600;

  margin-bottom: 1vw;

}



.ablist li .w2{

  color: #cccccc;

  font-size: 16px;

  font-weight: 600;

  opacity: 0.4;

  line-height: 24px;

}



.ablist li .img{

  margin-top: 3.64583333333333vw;

}



.ablist li .img img{

  max-width: 100%;

  

}



.ablist li .img img.imga{



}



.ablist li .img img.imgb{

  display: none;

}



.ablist li:hover{

  background: #0070c2;

  box-shadow: 0px 2px 14.1px 0.9px rgba(19, 47, 67, 0.4);

  transform: translateY(-25px);

}



.ablist li:hover .w1{

  color: #fff;

}



.ablist li:hover .img img.imga{

  display: none;

}



.ablist li:hover .img img.imgb{

  display: block;

  transform: rotate(180deg);

}





@media(max-width: 1280px){

  .put .put1{

    font-size: 40px;

  }

  .ablist li{

    padding: 25px 22px;

  }

}



@media(max-width: 1024px){

  .put .put1{

    font-size: 34px;

  }

}



@media(max-width: 780px){

  .ab-index{

    margin-top: 40px;

    flex-wrap: wrap;

  }

  .abl{

    width: 100%;

  }

  .put .put1{

    font-size: 24px;

  }

  .put .put2{

    font-size: 18px;

  }

  .amore{

    width: 120px;

    height: 40px;

    margin-top: 10px;

  }

  .amore a{

    font-size: 14px;

    line-height: 38px;

  }

  .abr{

    width: 100%;

    margin-top: 20px;

  }

  .abr p{

    font-size: 14px;

    line-height: 26px;

  }

  .aimg1{

    margin-top: 20px;

  }

  .abimg{

    margin-left: 0;

    margin-top: 20px;

  }

  

  .abimg .w1600{

    justify-content: space-between;

  }

  .abpic{

    width: 100%;

  }

  .ablist{

    flex-wrap: wrap;

  }

  .ablist li{

    width: 49%;

    padding: 10px;

    margin-bottom: 2%;

  }

  .ablist li .w1{

    font-size: 16px;

  }

  .ablist li .w2{

    font-size: 14px;

  }

  .ablist li .img img{

    max-width: 30px;

    width: 100%;

  }

}



/* 产品 */

.probg{

  background: url(../image/bc17f8f56c145ff9a192dd375eb09f5ab1f6dc17.jpg) no-repeat bottom center;

  background-size: 100% auto;

  padding-bottom: 6.77083333333333vw;

}



.pro-index{

  margin-top: 5.72916666666667vw;

}



.pro-wrap{

  margin-top: 3.125vw;

  position: relative;

}



.tab-con { position: relative; }

.tab-con .tab-main { position: absolute; left: 0; top: 0; z-index: 9; right: 0;}

.tab-con .tab-main { opacity: 0; visibility: hidden; transition: all .5s ease; }

.tab-con .tab-main.active { position: static; opacity: 1; visibility: visible;  }



.ptab{

  position: absolute;

  z-index: 99;

  right: 0;

  top: 0;

  box-shadow: 0px 2px 23.5px 1.5px rgba(22, 55, 80, 0.07);

  width: 23.5625%;

  padding: 0 3.38541666666667vw 2.08333333333333vw 2.08333333333333vw;

}



.psort li{

  border-bottom: 1px solid #cccccc;

  padding: 1.5625vw 0;

  background: url(../image/5f3bb9358968ff646cd436d89dee7cb9e8424737.png) no-repeat right center;

  position: relative;

}



.psort li::before{

  content: '';

  position: absolute;

  left: 0;

  bottom: -1px;

  width: 0;

  height: 1px;

  background: #f78e1e;

  transition: 0.5s;

}



.psort li a{

  display: flex;

  align-items: center;

  color: #666666;

  font-size: 18px;

}



.psort li a span{

  width: 6px;

  height: 6px;

  background: #66a9da;

  margin-right: 15px;

}



.psort li.active{

  background: url(../image/9e515cde68746dcff67c12bb216f0e88e14fc8c0.png) no-repeat right center;

}



.psort li.active::before{

  width: 70px;

}



.psort li.active a{

  color: #0070c2;

}



.psort li.active a span{

  background: #f78e1e;

}



.proSwiper{

  overflow: hidden;

  width: 100%;

}



.proSwiper .swiper-slide a{

  display: flex;

}



.proSwiper .swiper-slide a .wwl{

  writing-mode: vertical-lr;/*从左向右 从右向左是 writing-mode: vertical-rl;*/  

  writing-mode: tb-lr;/*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*/  

  word-wrap: break-word;

  color: #111111;

  font-size: 16px;

  text-transform: uppercase;

  font-weight: 600;

  margin-top: 88px;

  width: 34px;

}



.proSwiper .swiper-slide a .wwr{

  width: calc(100% - 34px);

  position: relative;

}



.proSwiper .swiper-slide a .wwr .img1{

  width: 43.7%;

}



.proSwiper .swiper-slide a .wwr .img1 img{

  width: 100%;

}



.proSwiper .swiper-slide a .wwr .wz{

  width: 61.6%;

  background: #fff;

  position: absolute;

  z-index: 99;

  bottom: 0;

  right: 0;

  padding: 3.125vw 0;

  padding-left: 7.29166666666667vw;

}



.proSwiper .swiper-slide a .wwr .wz .wz1{

  color: #111111;

  font-size: 54px;

  font-weight: 600;

  margin-top: 1.5625vw;

  margin-bottom: 1.5625vw;

}



.proSwiper .swiper-slide a .wwr .wz .wz2{

  color: #111111;

  font-size: 18px;

  line-height: 2.5;

}



.proSwiper .swiper-slide a .wwr .wz .wz3{

  border: 1px solid #111111;

  width: 180px;

  height: 52px;

  line-height: 50px;

  text-align: center;

  color: #111111;

  font-size: 16px;

  margin-top: 2vw;

}



.proSwiper .swiper-pagination{

  bottom: 30px;

  left: 75px;

  text-align: left;

}



.proSwiper .swiper-pagination-bullet{

  border-radius: 0;

  background: #0070c2;

}



.proSwiper .swiper-pagination-bullet-active{

  

}



.proSwiper .ind_fy_box{

  position: relative;

  display: inline-block;

  width: 12%;

}



.proSwiper .lb_pagination_box span:before{content: '0';}

.proSwiper .ind_fy_box span.on{

  color: #111111;

  font-size: 42px;

  font-weight: 600;

  line-height: 1;

}

.proSwiper .ind_fy_box span.xian{

  color: #111111;

  opacity: 0.4;

  font-size: 20px;

  font-weight: 600;

  position: absolute;

  right: 30%;

}

.proSwiper .ind_fy_box span.xian:before{

  content: '';

}

.proSwiper .ind_fy_box span.sum{

  color: #111111;

  font-size: 20px;

  font-weight: 600;

  opacity: 0.4;

  position: absolute;

  right: 0;

}



@media(max-width: 1280px){

  .proSwiper .swiper-slide a .wwr .wz{

    padding-left: 40px;

  }

  .proSwiper .swiper-slide a .wwr .wz .wz1{

    font-size: 40px;

  }

}



@media(max-width: 780px){

  .probg{

    background: #f1f6fa;

  }

  .pro-index{

    margin-top: 40px;

  }

  .ptab{

    position: relative;

    width: 100%;

    

  }

  .psort{

    display: flex;

    flex-wrap: wrap;

    justify-content: space-between;

  }

  .psort li{

    padding: 10px 0;

    width: 48%;

  }

  .psort li a{

    font-size: 14px;

  }

  .proSwiper .swiper-slide a{

    flex-wrap: wrap;

    margin-top: 20px;

  }

  

  .proSwiper{

    position: relative;

  }

  .proSwiper .swiper-pagination{

    bottom: 0;

    left: 10px;

    top: 55%;

  }

  .proSwiper .ind_fy_box{

    width: 20%;

  }

  .proSwiper .ind_fy_box span.on{

    font-size: 20px;

  }

  .proSwiper .ind_fy_box span.xian{

    font-size: 14px;

    right: 34%;

  }

  .proSwiper .ind_fy_box span.sum{

    font-size: 14px;

  }

  .proSwiper .swiper-slide a .wwl{

    width: 100%;

    writing-mode:initial;

    margin-top: 0;

  }

  .proSwiper .swiper-slide a .wwr{

    width: 100%;

    flex-wrap: wrap;

  }

  .proSwiper .swiper-slide a .wwr .img1{

    width: 100%;

  }

  .proSwiper .swiper-slide a .wwr .wz{

    width: 100%;

    position: relative;

    padding: 5px 10px;

    margin-top: 10px;

  }

  .proSwiper .swiper-slide a .wwr .wz .wz1{

    font-size: 16px;

  }

  .proSwiper .swiper-slide a .wwr .wz .wz2{

    font-size: 13px;

    line-height: 24px;

  }

  .proSwiper .swiper-slide a .wwr .wz .wz3{

    width: 120px;

    height: 40px;

    line-height: 38px;

    font-size: 14px;

  }

}



/* 新闻 */

.news-bg{

  background: url(../picture/news_bg.jpg) no-repeat top center;

  background-size: 100% 100%;

  padding-top: 6.25vw;

  padding-bottom: 6.25vw;

}



.news-index{



}



.news-index .newsl{

  width: 52.5%;

}





.nlist1{



}



.nlist1 li{

  border-bottom: 1px solid #fff;

  padding: 1.58vw 0;

}



.nlist1 li a{

  display: flex;

  align-items: center;

}



.nlist1 li .nw1{

  font-size: 18px;

  color: #ffffff;

  width: 86.9%;

}



.nlist1 li .nw2{

  width: calc(100% - 86.9%);

  font-size: 14px;

  color: #ffffff;

  align-items: center;

  justify-content: space-between;

}



.news-index .newsr{

  width: calc(100% - 68.5625%);

}



.nut .put1{

  color: #fff;

}







.nut .put2{

  color: #fff;

}



.nut .put3{

  color: #fff;

  font-size: 16px;

  line-height: 30px;

  font-weight: 500;

  margin-top: 2vw;

}



.nut .put4{

  border: 1px solid #fff;

  width: 180px;

  height: 54px;

  margin-top: 3.64583333333333vw;

}



.nut .put4 a{

  display: block;

  line-height: 52px;

  color: #fff;

  text-align: center;

  font-size: 16px;

  font-weight: 500;

}



@media(max-width: 780px){

  .news-bg{

    margin-top: 40px;

    padding: 40px 0;

  }

  .news-index{

    flex-wrap: wrap;

    flex-direction: column-reverse;

  }

  .news-index .newsl{

    width: 100%;

  }

  .nlist1 li{

    padding: 20px 0;

  }

  .nlist1 li .nw1{

    font-size: 14px;

    width: 68.9%;

    white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

  }

  .nlist1 li .nw2{

    font-size: 12px;

    width: calc(100% - 68.9%);

  }

  .news-index .newsr{

    width: 100%;

  }

  .nut .put3{

    font-size: 14px;

    line-height: 24px;

  }

  .nut .put4{

    width: 120px;

    height: 40px;

  }

  .nut .put4 a{

    line-height: 38px;

    font-size: 14px;

  }

}



/* 行业应用 */

.hhyy-bg{

  background: #fff;

  /*margin-left: 20px;

  margin-top: -14.84375vw;

  padding-bottom: 5.72916666666667vw;*/

	padding-bottom: 5.72916666666667vw;

  position: relative;

}



.hhyy-index{



}



.hhyy-index .hhyy-left{

  width: 58.125%;

  display: flex;

    justify-content: flex-end;

    flex-direction: column;

}



.hyt .put1::before{

  background: url(../image/e2ab91cc588ec770f97d27599937c7c389d0d17f.png) no-repeat top center;

}



.hyt .put2{

  text-transform: uppercase;

  font-size: 16px;

  margin-top: 0.5vw;

}



.hyw{

  font-weight: 500;

  color: #111111;

  font-size: 16px;

  line-height: 30px;

  margin-top: 2vw;

}



.hylist1{

  margin-top: 2.60416666666667vw;

  width: 91.4%;

}



.hylist1 li{

  text-align: center;

}



.hylist1 li .img1{

  border: 1px solid #0070c2;

  width: 82px;

  height: 82px;

}



.hylist1 li .img1 img{

  max-width: 100%;

}



.hylist1 li .img1 img.imgb{

  display: none;

}



.hylist1 li .wz{

  color: #111111;

  font-size: 16px;

  margin-top: 1vw;

}



.hylist1 li:hover .img1{

  background: #0070c2;

}



.hylist1 li:hover .img1 img.imga{

  display: none;

}



.hylist1 li:hover .img1 img.imgb{

  display: block;

}



.hhyy-index .hhyy-right{

  width: calc(100% - 64.375%);

	margin-top: 70px;

}



.hhyy-index .hhyy-right img{

  width: 100%;

}



.hhyy-img{

  margin-top: -15.10416666666667vw;

}



.hhyy-img img{

  width: 100%;

}



@media(max-width: 780px){

  .hhyy-bg{

    margin-top: 40px;

    margin-left: 0;

  }

  .hhyy-index{

    flex-wrap: wrap;

  }

  .hhyy-index .hhyy-left{

    width: 100%;

  }

  .hyw{

    font-size: 14px;

    line-height: 24px;

  }

  .hylist1{

    width: 100%;

    margin-top: 20px;

    flex-wrap: wrap;

  }

  .hylist1 li{

    width: 32%;

    text-align: center;

    margin-bottom: 10px;

  }

  .hylist1 li .img1{

    margin: 0 auto;

  }

  .hylist1 li .wz{

    font-size: 14px;

    margin-top: 10px;

  }

  .hhyy-index .hhyy-right{

    width: 100%;

    margin-top: 20px;

  }

}



/* 底部 */

.foot-bg{

  background:#002854;

  padding: 2.60416666666667vw 0;

}



.foot1-index{

  align-items: center;

}

.foot1-index .flogo{

  width: 25%;

}



.foot1-index .flogo p img{

  max-width: 100%;

}



.foot1-index .fnavlist li{

  margin-left: 2.60416666666667vw;

}



.foot1-index .fnavlist li a{

  display: block;

  color: #fff;

  font-size: 16px;

}

.f-share{

  margin-top: 1vw;

  float: right;

}

.f-share .social-share .social-share-icon{

  width: 40px;

  height: 40px;

  border:none;

  border-radius: 50%;

  margin:0 12px 0 0;

}

.f-share .social-share .social-share-icon:before{

    display: none;

}

.f-share .social-share .icon-qq{

    background: url(../image/4cc193ef211a8d84c3879529fe1652707f35c8ae.png) no-repeat center #081629;

}

.f-share .social-share .icon-qq:hover{

   background: url(../image/711823d2472fe398c5a2ede042214d7c8b2db2a4.png) no-repeat center #081629; 

}

.f-share .social-share .icon-weibo{

    background: url(../image/a7cbbe6fbe22286e4b0e3b258644aa0e31dfcdd4.png) no-repeat center #081629;

}

.f-share .social-share .icon-weibo:hover{

    background: url(../image/561a0276175a5df81784b00a687d7a02cb75d605.png) no-repeat center #081629;

}

.f-share .social-share .icon-wechat{

    background: url(../image/2862db9eb0bc06b5fc3d17d5977dfab20d6e937d.png) no-repeat center #081629;

}

.f-share .social-share .icon-wechat:hover{

    background: url(../image/5c73459ae105d054c83891c20947179b6c29742f.png) no-repeat center #081629;

}



.foot1-index2{

  margin-top: 1vw;

}



.foot1-index2 .flx p{

  font-size: 16px;

  color: rgba(255,255,255,.4);

  margin-bottom: 1vw;

}

.foot1-index2 .flx p em{

   font-style: normal;

}


.foot1-index2 .flx p:nth-of-type(2) strong{

  color: #fff;

  font-size: 24px;

  font-family: "Arial";

}



.foot1-index2 .cop{

  width: 50%;

  font-size: 16px;

  color: rgba(255,255,255,.4);

  text-align: right;

  padding-top: 30px;

	line-height: 40px;

}



.foot1-index2 .cop a{

  font-size: 16px;

  color: rgba(255,255,255,.4);

}



.c-link{

  color: rgba(255,255,255,.4);

}



.c-link a{

  color: rgba(255,255,255,.4);

}



@media(max-width: 780px){

  .foot-bg{

    padding: 20px 0;

  }

  .foot1-index{

    flex-wrap: wrap;

  }

  .flogo{

    text-align: center;

    width: 100%;

  }

  .f-share{

    text-align: center;

    float: none;

    margin-top: 20px;

  }

  .foot1-index2{

    margin-top: 20px;

    flex-wrap: wrap;

  }

  .foot1-index2 .flx p{

    font-size: 14px;

    margin-bottom: 5px;

  }

  .foot1-index2 .cop{

    width: 100%;

    margin-top: 20px;

    text-align: left;

    font-size: 14px;

  }

  .foot1-index2 .cop a{

    font-size: 14px;

  }

}