body{  font-size: 16px;   }
.main{ width: 83%; margin: 0  auto; }

.App { opacity: 0; visibility: hidden; -webkit-transition: opacity 2s; transition: opacity 2s; }
.App.flag { opacity: 1; visibility: visible; }

.ptb-70{ padding: 70px 0;}
header{ position: fixed; top: 0; left: 0; z-index: 100; width: 100%; border-bottom: 1px solid rgba(255, 255, 255, 0.25); color: #fff; transition: all .5s; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; }
header>div{ position: relative; z-index: 5;}
.logo { align-items: center;}
.logo img{ height: 67%;}
nav{ width: 45vw; font-size: 16px;}
nav a{ line-height: 99px; } nav a.on{ color: #0572a9;}




.topsearch{ display: none;}
.topsearch.show{ display: flex; align-items: center;}
.topsearchClose{ display: none;}
.topsearchClose.show{ display: flex; align-items: center;}


.h_nav{ height: 60px; width: 60px; background-color:#0572a9; padding: 18px 8px ;    align-items: flex-end; display: none;}

.h_nav .burger{ width: 100%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;       }
  .h_nav .burger:first-child{ animation: long 2s linear infinite;  }
  .h_nav .burger:nth-of-type(2){  width: 50%;}
  .h_nav .burger:nth-of-type(3){ animation: long 3s linear infinite}

  .h_nav.close .burger:first-child{ display: none;}
    .h_nav.close .burger:nth-of-type(3){ display: none;}
 
    .h_nav.close .burger:nth-of-type(2) {    position: relative;    z-index: 1; width: 80%;}
    .h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      content: '';   
         position: absolute;      top: 0;      left: 0;      width: 100%;      height: 100%;      background: #fff;      opacity: 0;      z-index: 1;}
    .h_nav.close .burger:nth-of-type(2) {    background: transparent;    transform: rotate(-180deg); }
    .h_nav.close .burger:nth-of-type(2):before, .h_nav.close .burger:nth-of-type(2):after {      opacity: 1;      transition: all .3s; }
.h_nav.close .burger:nth-of-type(2):before {     transform: rotate(45deg); }   .h_nav .burger:nth-of-type(2):after {     transform: rotate(-45deg); }


.toplanguage{
     position: absolute ;
     transition: all .36s;
     padding: 15px;
     background-color: #fff;
     top: 80px;
     right: 50%;
     width: 70px;  margin-right: -35px;
     -webkit-transition: all .36s;
     -moz-transition: all .36s;
     -ms-transition: all .36s;
     -o-transition: all .36s;
     visibility: hidden;
     opacity: 0;
     transform: translateY(20px) ;
     -webkit-transform: translateY(20px) ;
     -moz-transform: translateY(20px) ;
     -ms-transform: translateY(20px) ;
     -o-transform: translateY(20px) ;
   }
   
   .toplanguage::after{
    content: "";
    position: absolute;
    border-width: 0 9px 9px;
    border-style: solid;
    border-color: transparent transparent #fff;
    top: -9px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
   }
   .toplanguage a{ display:  block; padding: 8px 0; text-align: center; border-bottom: 1px solid #e5e5e5; color: #333;}
   .toplanguage a:hover{ color: #ffae00;}
   .language:hover .toplanguage{ visibility: visible;opacity: 1;filter: alpha(opacity=100);transform: none;-ms-transform: none;-o-transform: none;-webkit-transform: none;-moz-transform: none }
   .searchbox{ position: fixed; top: 110px ; right: 8.5%; z-index: 100; display: none;}
   .searchbox .text{ width: 500px; padding:20px 25px;}
   .searchbox .submit{ padding:20px 35px; background: url(../images/search-w.png) no-repeat center center #0572a9; }


header::before{ width: 100%; height: 0; z-index: 1; position: absolute; top: 0; left: 0; background-color: #fff; display: block; content: ''; transition:all .36s ; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
header.bg::before{height: 100%;}
header.bg{ color: #333; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);}
header.bg nav a{ line-height: 80px;}


nav li ,nav li dl{ position: relative;}


nav li dl {position: absolute;text-align: center;width: auto; z-index: 9999; color: #333; background: #fff;top:95px;left: 50%; 
     -webkit-box-shadow: 0 13px 10px 0px rgba(151, 150, 150, 0.22);box-shadow: 0 13px 10px 0px rgba(151, 150, 150, 0.22);border-bottom-left-radius: 5px;border-bottom-right-radius: 5px;}
	 

	 
	 
     /* nav  li dl:before {content: "";position: absolute;border-width: 0 9px 9px;border-style: solid;border-color: transparent transparent #fff;top: -9px;left: 50%;margin-left: -9px} */
nav  li dl dd {height: 50px; transition: all .36s ease;border-bottom: 1px solid rgba(0, 0, 0, 0.08); -ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease}
nav  li dl dd:last-child {border-bottom: 0}
nav  li dl dd a {  white-space: nowrap;  color: #333; line-height: 50px !important; transition: all .36s ease; padding: 0 15px; -ms-transition: all .36s ease;-o-transition: all .36s ease;-webkit-transition: all .36s ease;-moz-transition: all .36s ease;display: block}
nav  li dl dd:hover {background: #0572a9}
nav  li dl dd:hover a {  color: #fff;}
nav  dl {visibility: hidden;opacity: 0;filter: alpha(opacity=0);transform: translateX(-50%) translateY(20px);-ms-transform:translateX(-50%)  translateY(20px);-o-transform:translateX(-50%) translateY(20px);
    -webkit-transform:translateX(-50%)  translateY(20px);-moz-transform:translateX(-50%)  translateY(20px);transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease}
nav  li:hover dl {visibility: visible;opacity: 1;filter: alpha(opacity=100);transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%)}

header.bg nav li dl{ top:85px}

header.bgaa nav li dl dl {position: absolute;text-align: center;width: auto; z-index: 9999; color: #333; background: #fff;top:0px;left: 150%; } 


header.bgaa nav li dl dl {visibility: hidden;opacity: 0;filter: alpha(opacity=0);transform: translateX(-50%) translateY(20px);-ms-transform:translateX(-50%)  translateY(20px);-o-transform:translateX(-50%) translateY(20px);
    -webkit-transform:translateX(-50%)  translateY(20px);-moz-transform:translateX(-50%)  translateY(20px);transition: all .5s ease;-ms-transition: all .5s ease;-o-transition: all .5s ease;-webkit-transition: all .5s ease;-moz-transition: all .5s ease}
header.bgaa nav li dd:hover dl {visibility: visible;opacity: 1;filter: alpha(opacity=100);transform: translateX(-50%);-ms-transform: translateX(-50%);-o-transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%)}


header.bgaa nav li dl dl dd a {color: #333;}
header.bgaa nav li dl dl dd:hover a {  color: #fff;}





.banner{ width: 100%; height: 100vh;}
.banner  img{width: 100%; height: 100vh; object-fit: cover;}
.banner .swiper-pagination{ width: auto; bottom: 8vh; left:45%;}
.banner .swiper-pagination-bullet{ background-color: #fff; margin: 0 !important; margin-right: 32px !important; opacity: 1; position: relative;}
.banner .swiper-pagination-bullet::after{
     width: 30px;
     height: 30px;
     border: 1px solid #5fb663;
     border-radius: 50%;
     display: block;
     content: '';
     position: absolute;
     top: -12px;
     left: -12px;
     -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     -ms-border-radius: 50%;
     -o-border-radius: 50%;
     transform: scale(0);
     -webkit-transform: scale(0);
     -moz-transform: scale(0);
     -ms-transform: scale(0);
     -o-transform: scale(0);
     transition:all .36s ;
     -webkit-transition:all .36s ;
     -moz-transition:all .36s ;
     -ms-transition:all .36s ;
     -o-transition:all .36s ;
}
.banner .swiper-pagination-bullet.swiper-pagination-bullet-active{ background-color: #5fb663;}
.banner .swiper-pagination-bullet.swiper-pagination-bullet-active::after{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }

.about>div{ position: relative; z-index: 5;}
#wonder {
     position: absolute;
     width: 100%;
     height: 100%;
     left: 0;
     top: 0;
     z-index: 2;
     
   }
.indextilte a:hover{ color: #ffae00;}
.about .con .pic{ width: 56%;}
.about .con .pic img{ width: 100%; height: 100%; object-fit: cover;}
.about .con .pic .play{ position: absolute; bottom: 0; right: -150px; width: 150px; height: 150px;}.about .con .pic .play span{ font-size:30px;}
.about .con .txt{ width: 44%;}

.aboutnum .DIN{ line-height: 1;}
.border-bottom{ border-bottom: 1px solid #e5e5e5;}
.aboutnum li{ width: 20%;}
.aboutnum li img{ width: 12%;}
.aboutnum li .right{ width: 88%;}

.product{ background: url(../images/productbg.jpg) no-repeat center center; background-size:cover;}
.indproUl{display: grid; grid-gap: 20px; grid-template-columns: repeat(4,1fr);}

.indproUl li{ margin-top:-10px;}
.indproUl li  .img {width: 100%;}
.indproUl li  .img img{ width: 100%; height: 100%; object-fit: cover; transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }


.indproUl li .txt{
     position: absolute;
     bottom: 0;
     left: 0;
   
     width: 100%;
     height: 100%;
     align-items: flex-end;
     justify-content: space-between;
     transition: all .36s;
     -webkit-transition: all .36s;
     -moz-transition: all .36s;
     -ms-transition: all .36s;
     -o-transition: all .36s;
}

.indproUl li .txt .icon{ width: 50px; height: 50px; opacity: 0; transform: translateX(50px); -webkit-transform: translateX(50px); -moz-transform: translateX(50px); -ms-transform: translateX(50px); -o-transform: translateX(50px); }
.indproUl li .txt::before{ transition: all .36s; z-index: 1; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; display: block; content: ''; /*background-image: linear-gradient(to top,rgba(255,255,255,0.5),transparent); */-webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.indproUl li .txt>div{ position: relative;  z-index: 5; }
.indproUl li:hover .txt::before{ height: 0;}
 
.indproUl li:hover .txt .icon{ transform:  translateX(0); opacity: 1; }

.indproUl li:hover{ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);}
/* .indproUl li  .more{
     position: absolute;
     bottom:-15%;
     left: 0;
     width: 100%;
     height: 15%;
    
} */ 
/* 
.indproUl li:hover{ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);}
.indproUl li:hover .txt { background: rgba(255,255,255,0.1);  bottom: 15%; height: 85%;}
 
.indproUl li:hover   .img img{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.indproUl li:hover   .more{   bottom: 0; } */

.indproUl li:hover .txt {  }
 
.indproUl li:hover .img img{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }

/*
.indproUl li:first-child{grid-column-start: 1;grid-column-end: 3; grid-row-start: 1;grid-row-end: 2;}
.indproUl li:nth-child(2){grid-column-start: 3;grid-column-end:5; grid-row-start: 1;grid-row-end: 2;}
*/

 

 



.earth{ background: url(../images/earthbg.jpg) no-repeat center bottom; background-size: cover;  padding: 150px 0;     background-attachment: fixed; position: relative;}
.earth .txt { position: relative; z-index: 5;}
.earth .txt .more{ width: 130px; height: 130px;}
.earth .txt .more:hover{ transform: scale(0.8); -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); }
 .earth .img{ position: absolute; right: 20px; top: 195px; z-index: 1;}   
.dot{ position: absolute;} 
.dot .dot_circle{display:block; width:10px; height:10px; background:#fff; position:relative; z-index:3; border-radius:50%;}
.dot:after,.dot:before{content: "";
     position: absolute;
     border-radius: 50%;
     top: 50%;
     left: 50%;
     z-index: 1;}
.dot::before {width:24px; height:24px; background:transparent; background:rgba(255,255,255,0.6); margin-top:-12px; margin-left:-12px; -webkit-animation:warn 2s linear 0.4s infinite; 
     -moz-animation:warn 2s linear 0.4s infinite; animation:warn 2s linear 0.4s infinite; opacity:0;}
.dot::after {width:44px; height:44px;background:transparent; /*background:#7e9ec3;*/ background:rgba(255,255,255,0.4); margin-left:-22px; margin-top:-22px; 
     -webkit-animation:warn 2s linear 0s infinite; -moz-animation:warn 2s linear 0s infinite; animation:warn 2s linear 0s infinite; opacity:0;}
     .dot2{ position: absolute;}
.dot2 .dot_circle{display:block; width:7px; height:7px; background:#fff; position:relative; z-index:3; border-radius:50%;}
.dot2:after,.dot2:before{content: "";
          position: absolute;
          border-radius: 50%;
          top: 50%;
          left: 50%;
          z-index: 1;}
     .dot2::before {width:18px; height:18px; background:transparent; background:rgba(255,255,255,0.6); margin-top:-9px; margin-left:-9px; -webkit-animation:warn 2s linear 0.4s infinite; 
          -moz-animation:warn 2s linear 0.4s infinite; animation:warn 2s linear 0.4s infinite; opacity:0;}
     .dot2::after {width:28px; height:28px;background:transparent; /*background:#7e9ec3;*/ background:rgba(255,255,255,0.4); margin-left:-14px; margin-top:-14px; 
          -webkit-animation:warn 2s linear 0s infinite; -moz-animation:warn 2s linear 0s infinite; animation:warn 2s linear 0s infinite; opacity:0;}
.qizi{ position: absolute; top: 25%; right: 17.5%;animation: ani-svg 1s linear 0s alternate infinite;}
 

.new{ background: url(../images/newsbg.png) no-repeat center top; background-size: 100% auto;}
.newBtn>div{ width: 65px; height: 65px; border: 1px solid #0572a9; color: #0572a9;}
.newBtn>div:hover{ background-color: #0572a9; color: #fff;}
.new .indextilte{ align-items: flex-end;} 

.new .left .img .newsimg{ width: 100%; height: 540px; object-fit: cover;}
.new .left .img .txt{ justify-content: flex-end; width: 100%; height: 100%; position: absolute;  bottom: 0 ; left: 0; background: rgba(0, 0, 0, 0.3);}
.new .left .img .txt .line{ width: 100%; height: 1px; background-color: rgba(255, 255, 255, .24);}
.new .left .img .txt .line::after{ width: 0; height: 100%; background-color: #fff; transition:all .3s ; display: block; content: '';
   -webkit-transition:all .3s ; -moz-transition:all .3s ; -ms-transition:all .3s ; -o-transition:all .3s ; }
.new .left .img:hover .txt .line::after{ width: 100%;}
.new .left .img:hover  .newsimg{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.new .left .img:hover { box-shadow:  0 0 10px rgba(0, 91, 172, 0.4);}
.new .swiper-slide .img img{ height: 270px; object-fit: cover;}
.new .swiper-slide .txt>div{ position: relative; z-index: 5;}
.new .swiper-slide .txt::before{ width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; background-color: #fff; display: block; content: ''; z-index: 1; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
/* .new .swiper-slide .txt:hover::before{ height: 120%;} */
/*.new .swiper-slide:hover .txt{ transform: translateY(-20px); -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -o-transform: translateY(-20px); }
*/.new .swiper-slide:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.new .swiper-slide:hover .f20{ color:#005bac; }
footer{ background-color: #343434; color: #fff;}
footer .top { border-bottom: 1px solid rgba(255, 255, 255, .24);}
footer .top .right{ width: 67%;}
.dis-flex-start{ display: flex; align-items: flex-start;}
.ewmImg{  width: 200px;}
footer .bottom{border-top: 1px solid rgba(255, 255, 255, .24); line-height: 50px;}



.page-aside {
	position: fixed;
	right: -6px;
	bottom: 180px;
	transform: translateX(100%);
	z-index: 25;
	opacity: 0;
	transition: transform .3s, opacity .3s
}

.page-aside.show {
	transform: translateX(0);
	opacity: 1
}

.page-aside .img {
	max-width: 100%
}

.page-aside-item {
	width: 54px;
	text-align: center;
	height: 50px;
	position: relative;
	z-index: 1;
	cursor: pointer;
	display: block;
	background-color: rgba(0, 0, 0, .5);
	margin: 4px 0;
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
	padding-right: 6px;
	transition: transform .3s;
	display: flex;
	align-items: center;
	justify-content: center
}

.page-aside-item .icon {
	width: 24px
}

#toolbar{ position: fixed; bottom: 0; left: 0; width: 100%; z-index: 90; display: none;}
#toolbar a {
    width: 25%;
   padding: 10px 0;
    text-align: center;
   color: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column;
}
#toolbar img{ height: 20px; margin-bottom:5px;}


div.video-play{position:fixed;top:0;bottom:0;right:0;left:0;width:100vw;height:100vh;z-index:10001;display:none}
div.video-bg{position:absolute;top:0;bottom:0;width:100%;z-index:1001;background:#0b0b0b;opacity:.8}
div.video-wrap{z-index:1002;position:fixed;top:52%;left:50%;-webkit-transform:translate3d(-50%, -52%, 0);transform:translate3d(-50%, -52%, 0);width:1000px;height:570px;  }

div.video-wrap video{width:100%;height:auto}
div.close-btn{cursor: pointer; transition: all .36s;
 
 text-align: center;
 line-height: 40px;
 z-index: 9999;
 position: absolute;
 background: #000;
 border: 2px solid #fff;
 width: 50px;
 height: 50px;
 border-radius: 50%; opacity: 0.5;
 right: -20px;
 top: -25px;}
 div.close-btn:hover{ transform: rotate(180deg); opacity: 1;}

 .neiBan,.newinfoPge{ margin-top: 80px;}
 .neiBan .txt{ position: absolute; height: 100%; top: 0; left:8.5% ; width: 83%; justify-content: center; padding-bottom: ;}
 .neiBan .txt .line{ width:80px; height: 4px; background-color: #fff;}
 .neiBan .txt>div{ animation: topFloat 1.2s; -webkit-animation: topFloat 1.2s; }
 .menuSub{  margin-top: -45px; z-index: 10; position: relative;   }
 .menuSub .main{box-shadow: 5px 0 20px rgba(0, 0, 0, .1); border-radius: 45px;}
 .menuSub a{ flex: 1; height: 90px; line-height: 90px;}
 .menuSub a.on{ color: #fff; background-color: #0572a9;border-radius: 45px;}
 .menuSub a:hover{ color: #0572a9;}
 .menuSub a.on:hover{ color: #fff;}
 .companyProfile{ background-image: linear-gradient(to top,#e7effb,#fff);}
 .companyProfile .bg{ width: 24%; height: 100%; object-fit: cover; position: absolute; top: 0; right: 0; z-index: 3;}
 .companyProfile .main{ position: relative; z-index: 5;}
 .companyProfile .txt{ width: 50%;}
 .companyProfile .img{ width: 43%; border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; }
 .companyProfile .img img{ width: 100%;  }

 .culture{ background: url(../images/bg2.png) no-repeat center top; height:950px; }
 .culture .bg{ position: absolute; left: 0; top: 0; z-index: 5; width: 27%;}
 .culture .con{ width: 450px; height: 450px;  margin: 170px auto 0;  }
 .culture .con ul li{ background: url(../images/bg3.png) no-repeat left top; background-size: auto 100%; height: 207px; position: absolute; z-index: 10;
 display: flex;  flex-direction: column; justify-content: center; padding-left: 60px;} 
 .culture .con ul li:nth-child(1){top: -80px; left: 60%;}
 .culture .con ul li:nth-child(2){top:100px; right: 80%;text-align: right; padding-right: 60px; padding-left: 0; 
     background: url(../images/bg5.png) no-repeat right center; background-size: auto 100%;}
 .culture .con ul li:nth-child(3){bottom: -90px; left: 50%; } 
 .cultureLogo{ width: 42%; animation: fudong 4s linear infinite; -webkit-animation: fudong 4s linear infinite; opacity: .7;}
 @keyframes fudong {
  0%{ transform: translateY(8px);   -webkit-transform: translateY(8px); -moz-transform: translateY(8px); -ms-transform: translateY(8px); -o-transform: translateY(8px); }
  50%{ transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }
  100%{ transform: translateY(8px);  -webkit-transform: translateY(8px); -moz-transform: translateY(8px); -ms-transform: translateY(8px); -o-transform: translateY(8px); } 
} 
.history{background-image: linear-gradient(to right,#e8effb,#ffffff);}
.history .swiper-container{ background: url(../images/line.png) repeat-x left top 150px;}
.history .swiper-slide{   cursor: pointer; 
        }
    /* display: flex;    justify-content: center; */
     /*  */
.history .swiper-slide .txt{ padding: 0 20px; line-height: 2; width: 100%;}
.history .swiper-slide .txt .NUM{ height: 100px;}
.history .swiper-slide .img{ display: none; min-height: 350px; text-align: left;}
.history .swiper-slide .img img{ width: 100%; height: 120px; object-fit: cover;}
.history .swiper-slide .yuan{ margin: 40px auto; width: 20px; height: 20px; border-radius: 50%; background-color: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, .2); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.history .swiper-slide .yuan i{ width: 10px; height: 10px; border-radius: 50%; background-color: #555; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }

/* .history .swiper-slide.swiper-slide-active{ width: 40%;} */
.history .swiper-slide.swiper-slide-active .txt{ display: none !important;}
.history .swiper-slide.swiper-slide-active .img{ display: block; width: 100%;}
.history .swiper-slide.swiper-slide-active .txt{ width: 50%; display: flex; flex-direction: column-reverse;  justify-content: flex-end;}
.history .swiper-slide.swiper-slide-active .txt .NUM{ color: #0572a9; filter: drop-shadow(10px 10px 10px rgba(19,108,201,.2)); -webkit-filter: drop-shadow(10px 10px 10px rgba(19,108,201,.2)); }
.history .swiper-slide.swiper-slide-active .txt .line-clamp2{ height: 100px;
    display: flex;
    align-items: flex-end;
    justify-content: center;}
.history .swiper-slide.swiper-slide-active .yuan i{ background-color: #0572a9;}
.bg-ddd{ background-color: #dddddd;}
.historyBtn{ width: 230px; height: 60px; letter-spacing: 2px; cursor: pointer;}

.story{ background: url(../images/storybg.jpg) no-repeat center center ; background-size: cover;background-attachment: fixed; position: relative;}
.story .img{ width: 30%;}
.story .txt{ width: 70%;}
 
.story .txt .con{ max-height: 540px; overflow-y: scroll;   }
.story .txt .con::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 5px;}
.story .txt .con::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #0572a9; width: 5px; }
.story .txt .con::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: #f3f3f3; width: 5px; }

.story .img .line{ background-color: #fff; width: 30px; height: 3px; margin-bottom: 100px;}
.honor{ background: url(../images/honorbg.jpg) no-repeat center center; background-size: cover;}
.honor .swiper-container{background: url(../images/honort.png) no-repeat left bottom; padding-bottom: 150px;}
.honor .swiper-wrapper{ align-items: flex-end; }
.honor .swiper-slide{ position: relative; cursor: pointer;}
.honor .swiper-slide::after{
     width: 100%;
     height: 100%;
     display: block;
     content: '';
     display: flex;
     align-items: center;
     justify-content: center;
     background:url(../images/honorjia.png) no-repeat center center rgba(0, 0, 0, .2);
     top: 0;
     left: 0;
     position: absolute;
     z-index: 5;
     opacity: 0;
     transition: all .36s;
     -webkit-transition: all .36s;
     -moz-transition: all .36s;
     -ms-transition: all .36s;
     -o-transition: all .36s;
}
.honor .swiper-slide:hover::after{ opacity: 1;}
.rpagination{align-items: flex-end; }
.honor  .swiper-pagination{ width: 33.3%; height: 3px; position: relative; } 
.swiper-pagination-num { width: 33.3%;}
.zahnwei{ margin-top: -80px; padding-top: 80px;}

.proBg{ background: url(../images/probg.jpg) no-repeat top center; background-size: cover;}
.proTj { box-shadow: 0 0 20px rgba(0, 0, 0, .1);}
.proTj .img{ width: 45%;}
.proTj .txt{ width: 50%;}
.prolist{display: grid; grid-gap: 55px 60px; grid-template-columns: repeat(2,1fr);}
.prolist li { background: url(../images/bg6.jpg) no-repeat center center ; background-size: cover;} 
.prolist li::after{ width: 100%; height: 100%; background-color: #fff; display: block; content: ''; position: absolute;
      z-index: 2; top: 0;   transition:all .36s ; right:  0; -webkit-transition:all .36s ; -moz-transition:all .5s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.prolist li .img{ width: 45%; position: relative; z-index: 5;}
.prolist li .txt{ width: 50%; position: relative; z-index: 5;}
.prolist li .txt span{ width: 50%; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; height: 50px; overflow: hidden; }
.prolist li:hover::after{ width: 0}
.prolist li:hover{ box-shadow: 0 0 20px rgba(0, 0, 0, .1); }
.light{ position: absolute; left: -100%; top: 0; width: 100%; height: 100%; transform: skewx(-25deg);transition: 1s;
	background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));}
.prolist li span:hover .light { left: 100%; transition: 1s;}
.proTop{ background: url(../images/bg7.jpg) no-repeat center center; background-size: cover; margin-top: 80px;} 
.proTop .img{ width: 53%;}
.proTop .txt{ width: 43%;}
.proTop .img .left{ width: 15.7%;  }
.proTop .img .left .swiper-slide{height: calc((100% - 60px) / 4); }
.proTop .img .left  img{ width:100% ; border: 1px solid #0572a9; object-fit: cover;}
.proTop .img .left .swiper-container{ width: 100%; height: 560px;}
.proTop .img .right{ width: 81.2%;}
.proTop .img .right .swiper-slide img{max-width:100% ;}
.proTop .img .right .btn{ width:70px; height: 70px; cursor: pointer; z-index: 10; background: rgba(255, 255, 255, .8); border-radius: 50%; top: 50%; margin-top: -35px; position: absolute; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.proTop .img .right .btn.prev{ left: 2%;}
.proTop .img .right .btn.next{ right: 2%;}
.proTop .img .right .btn:hover{background-color: #0572a9;}
.proTop .img .right .btn:hover .iconfont{ color: #fff;}
.proInfoTit{ background-color: #f2f2f2; } 
.proInfoTit span{ line-height: 80px; width: 20%;}

.scienceOne{ margin-top: -45px; }
/* .scienceOne::before{ position: absolute; width: 55%; bottom: 0; left: 0; height: 50%; background-color: #f2f6fd; display: block; content: ''; z-index: 1;} 
margin-left: 8.5%; 
*/
.scienceOne .main{ position: relative;z-index: 10;}
.scienceOne .left{ width: 55%;}
.scienceOne .left .bg{background-color: #f2f6fd;padding-left: 8.5vw;}
.scienceOne .left .top{  padding-left: 8.5vw; padding-right: 5vw;}
.scienceOne .right{ background: url(../images/bg8.jpg) no-repeat right top; background-size: cover; width: 45%; padding-right: 8.5vw; padding-left: 70px;
 justify-content: center;
}
.scienceOne .right ul{width: 100%;}
.scienceOne .right ul li{ width: 33.3%;}
.scienceOne .right ul li .line{ width: 100%; height: 1px; background: rgba(255, 255, 255, .24); position: relative; }
.scienceOne .right ul li .line span{ height: 2px; background-color: #fff; width: 20%; position: absolute; left: 0; bottom: 0px; }
.patenttxt{font-weight: bold;   -webkit-text-stroke: 1px  rgba(255,255,255,.8); color: transparent; font-size: 88px; width: 100%; }

.college{  border-radius: 8px; overflow: hidden; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.college .left{ width: 33.7%; background: url(../images/collegeleft.jpg) no-repeat center center ;background-size: cover; }
.college .right{width: 66.3%; background: url(../images/collegeright.jpg) no-repeat center center; background-size: cover; padding: 150px 100px; }
.college .right::after{ width: 41px; position: absolute; top: 50px; left: 50px; display: block; content: ''; background: url(../images/yin.png) no-repeat center center; background-size: 100% 100%; height: 34px;}
.college .right::before{
    width: 41px;
    position: absolute;
    bottom: 50px;
    right: 50px;
    display: block;
    content: '';
    background: url(../images/yin.png) no-repeat center center;
    background-size: 100% 100%;
    transform:rotate(180deg) ;
    height: 34px;
    -webkit-transform:rotate(180deg) ;
    -moz-transform:rotate(180deg) ;
    -ms-transform:rotate(180deg) ;
    -o-transform:rotate(180deg) ;
}
.projectsUl{display: grid; grid-gap: 70px; grid-template-columns: repeat(2,1fr);}
.projectsUl li{ box-shadow: 0 0 20px rgba(0, 0, 0, .25); position: relative; overflow: hidden;perspective: 300px; -webkit-perspective: 300px;}
.projectsUl li .f40{ margin-top: -40px;}
.projectsUl li  figure{ width: 125px; height: 125px ; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%;
 position: relative; } 
.projectsUl li  figure img{ width:45%;filter: grayscale(100%) brightness(500%);}
.projectsUl li figure i:before { content: ''; position: absolute; left: 0; top: 0;  border: 1px solid #fff; width: 100%;height: 100%;  border-radius: 50%;  opacity: 0}
.projectsUl li figure i:after {content: '';position: absolute; left: 0;top: 0;border: 1px solid #fff; width: 100%; height: 100%; border-radius: 50%;opacity: 0}
.projectsUl li:hover figure  i:before { animation: serv_one_border .9s 0s ease 1; }
.projectsUl li:hover figure i:after { animation: serv_one_border 1.5s 0s ease 1; -webkit-animation: serv_one_border 1.5s 0s ease 1; }
 

.projectsUl li:before{content: "";width: 110%;height: 100%;position: absolute;left: -5%;top: 0;z-index: -1;opacity: 0;visibility: hidden;transform-origin: top center 0;
     transition: 0.54s;transform: rotateX(-60deg);-webkit-transform: rotateX(-60deg);-moz-transform: rotateX(-60deg);
     background: -webkit-linear-gradient(130deg, #599fde, #0260b3); }
.projectsUl li:hover:before{ opacity: 1; visibility: visible; transform: rotateX(0deg); -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); color:#fff;}
.projectsUl li:hover{ color: #fff;}
.projectsUl li:hover .color-blue2{ color: #fff;}
.projectsUl li:hover figure{ background-color: #fff;}
.projectsUl li:hover figure img{ filter: grayscale(0%) brightness(100%); -webkit-filter: grayscale(0%) brightness(100%); }

.newswiper .swiper-slide{ border-radius: 30px;}
.newswiper .swiper-slide .img{ border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; }
.newswiper .swiper-slide .img img{  width: 100%; height: 570px; object-fit: cover;}
.newswiper .swiper-slide .txt .line{ width: 0; margin-right: 10px; height: 2px; background-color: #0572a9; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.newswiper .swiper-slide:hover .line{ width: 50px;}

.newswiper .swiper-slide .tit span{
     /*text-decoration: underline;
     */background-image: linear-gradient(currentColor 0, currentColor 0);
     background-image: linear-gradient(currentColor 0 0);
     background-position: 0 calc(100% - 1px);
     background-size: 0 1px;
     background-repeat: no-repeat;
     transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -webkit-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -moz-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -ms-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -o-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
   }
    
   
.newswiper .swiper-slide:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}
.newswiper .next,.newswiper .prev{ width: 76px; height: 76px; border-radius: 50%; background-color: #fff; position: absolute; top: 50%; transform: translateY(-50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);
z-index: 10;}
.newswiper .next{ right: -100px;}
.newswiper .prev{ left: -100px;}
.newswiper .next:hover,.newswiper .prev:hover{ color: #fff; background-color: #0572a9;}
.newslist li{ width: 22%; margin-right:4% ; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; }
.newslist li:nth-child(4n){ margin-right: 0;}
.newslist li .line{ width: 100%; height: 1px; background-color: #e6e6e6; margin: 30px 0;}
.newslist li .img {border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px;}
.newslist li .img img{ width: 100%; object-fit: cover;  }
.newslist li a{ transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.newslist li:hover a{ background-color:transparent ; box-shadow: 0 0 20px rgba(0, 0, 0, .18);}
.newslist li:hover .wenzi{ color: #0572a9;}

.newslist li .tit span{
     background-image: linear-gradient(currentColor 0, currentColor 0);
     background-image: linear-gradient(currentColor 0 0);
     background-position: 0 calc(100% - 1px);
     background-size: 0 1px;
	
     background-repeat: no-repeat;
     transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -webkit-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -moz-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -ms-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
     -o-transition: 400ms cubic-bezier(0.645, 0.045, 0.355, 1), background-position 0s 400ms cubic-bezier(0.645, 0.045, 0.355, 1), color 0ms;
   }
    
   
.newslist li:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}
.newslist li:hover  .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.newslist li   .wenzi em{ width: 0; margin-right: 10px; height: 1px; background-color: #0572a9; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.newslist li:hover .wenzi em{ width: 28px;}

.newsleft{ width: 65%;}
.newsleft img { margin-bottom: 10px;}
.newsright{ width: 32%;}
.newsright .tit{ border-left:3px solid #0572a9; line-height: 1; padding-left: 25px;}
.newsright .item img{ width: 37%; height: 115px; object-fit: cover;}
.fzUl li { transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; width: 31%; }
.fzUl li::after{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, .3); z-index: 10; display: block; content: '';}
.fzUl li .txt{ position: absolute; bottom: 0; left: 0; z-index: 12; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.fzUl li:hover .txt{ transform: translateY(-20px); -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -o-transform: translateY(-20px); }
.fzUl li:hover::after{ background: rgba(0, 0, 0, .5);}
.fzUl li  .line{ width: 0; background-color: #fff; height: 2px; margin-top: 15px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.fzUl li:hover .line{ width: 100%;}
.fzUl li:hover{ box-shadow: 0 0 20px rgba(0, 0, 0, .18);transform: translateY(-20px);}

.joinCon{ background: url(../images/joinbg.jpg) no-repeat center top; background-size: 100% auto;}

.joinConshaixuan .select{ border: 1px solid rgba(255, 255, 255, 0.4); color:rgba(255, 255, 255, 1);  width: 26%; padding: 0 15px;  }
.joinConshaixuan .select  select{height: 60px; line-height: 60px;}
.joinConshaixuan  .null-txt {color:rgba(255, 255, 255, 1); width: 100%;  }
.joinConshaixuan .select::after {
    content: "";
    position: absolute;
    top: 50%;
    transform:translateY(-50%) ;
    right: 25px;
    width: 0;
    height: 0;
    border-top: 6px solid #fff;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    opacity: .6;
    -webkit-transform:translateY(-50%) ;
    -moz-transform:translateY(-50%) ;
    -ms-transform:translateY(-50%) ;
    -o-transform:translateY(-50%) ;
}
.joinConshaixuan .select  select option{ color: #333;}
.joinConshaixuan .input{ border: 1px solid rgba(255, 255, 255, 0.4); color:rgba(255, 255, 255, 1);  width: 26%; padding: 0 15px;}
.joinConshaixuan .input input{ height: 60px; line-height: 60px;}
.joinConshaixuan .input input::-webkit-input-placeholder  {color:#fff;}
.joinConshaixuan .input input:-moz-placeholder  {color:#fff;}
.joinConshaixuan .input input::-moz-placeholder  {color:#fff;}
.joinConshaixuan .input input:-ms-input-placeholder {color: #fff;}
.joinConshaixuan  .button{ height: 60px; width: 15%; border: 1px solid #0572a9;}

.joinlistUl{display: grid; grid-gap: 60px; grid-template-columns: repeat(2,1fr)}
.joinlistUl a{ border: 1px solid #e5e5e5;}
.joinlistUl a img.userimg{ width: 160px; height: 160px; object-fit: cover; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.joinlistUl a .txt .more{ width: 150px; height: 45px; border: 1px solid #737373; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.joinlistUl a:hover .more{ background-color: #0572a9; color: #fff;}
.g5boxaa .txt{ width: calc(100% - 180px);}


.joinlistUl a .bar{position: absolute;background-color: #0572a9;transition: background-color 0.2s, top 1s cubic-bezier(0.630, 0, 0.355, 1), left 1s cubic-bezier(0.630, 0, 0.355, 1), bottom 1s cubic-bezier(0.630, 0, 0.355, 1), right 1s cubic-bezier(0.630, 0, 0.355, 1);}
.joinlistUl a .bar.top {left: -1px;right: 100%;height: 1px;top: -1px;}
.joinlistUl a .bar.left {top: 100%;bottom: -1px;width: 1px;left: -1px;}
.joinlistUl a .bar.right {top: -1px;bottom: 100%;width: 1px;right: 0px;}
.joinlistUl a .bar.bottom {left: 100%;right: -1px;height: 1px;bottom: 0px;}
.joinlistUl a .ball {position: absolute;width: 10px;height: 10px; background: #fff;  border:1px solid #0572a9; border-radius: 100%;transition: background-color 0.2s, top 1s cubic-bezier(0.630, 0, 0.355, 1), left 1s cubic-bezier(0.630, 0, 0.355, 1), bottom 1s cubic-bezier(0.630, 0, 0.355, 1), right 1s cubic-bezier(0.630, 0, 0.355, 1);opacity: 0; z-index: 333;}
.joinlistUl a .ball.tl {top: 100%;left: -3px;}
.joinlistUl a .ball.tr {top: -3px;right: 100%;}
.joinlistUl a .ball.bl {bottom: -3px;left: 100%;}
.joinlistUl a .ball.br {bottom: 100%;right: -3px;}
.joinlistUl a:hover .bar.top{ right: -1px;}
.joinlistUl a:hover .bar.left{ top: -1px}
.joinlistUl a:hover .bar.right{ bottom: -1px;}
.joinlistUl a:hover .bar.bottom{left: -1px;}
.joinlistUl a:hover .ball.tl{ top: -5px;}
.joinlistUl a:hover .ball.tr{right: -5px;}
.joinlistUl a:hover .ball.bl{left: -5px;}
.joinlistUl a:hover .ball.br{bottom: -5px;}
.joinlistUl a:hover .ball{ opacity: 1;}

 /*弹窗*/
 .g5liebiao{ width:100%; margin:0 -8px; margin-top:50px; }
 .g5abt h2{ display:inline-block; color:#555555;  font-size:22px; width: 265px;  overflow: hidden; }
 .g5listita a{ width:170px; height:45px; line-height: 45px; display:block; background:#fff; margin-top:20px; position:absolute; bottom:10px; left:15px; }
 .g5listita a p{ color:#3c276e; padding-left: 35px; line-height: 45px; }
 .g5listita a p::after{ position:absolute; content:""; width:7px; height:13px; background:url(../images/sanjiaoa.png) no-repeat center; right: 56px; top:50%; transform: translateY(-50%); background-size: cover; color:#3c276e; }
 .g5tan{ width:100%; height:100%; background:rgba(0,0,0,0.5); position:fixed; top:0; left:0; z-index: 9999; display:none; }
 .tancoiii{margin-top: 20px;padding: 0 0 15px; border-bottom: 1px solid #eeeeee;}
 
 
 .tancoiii h4{ font-weight: bold; font-size: 18px;}
 .tancoiii p{  color:#666666; font-size:14px;   }
 
 .tancon{ max-width:1200px; width: 65%; position:absolute;  padding:0 73px 0; background:#fff; top:50%; left:50%; transform: translate(-50%,-50%); box-sizing: border-box; }
 .g5lianjie{ width:100%; height:52px;  margin-top:20px; margin-bottom: 20px; }
 .g5lianjie p{ display:block; width:100%; height:100%;   color:#274fa1;  font-family: "微软雅黑"; font-weight: bold; font-size:16px; }
 
 .tanright{ width:58px; height:58px; position:absolute; top: 10px;    right: 10px; cursor: pointer; }
 .tanright img{ width:100%; }
 
 .tancoiiiab{ color:#333333;  font-size:20px;  font-weight: bold; }
 .tancoiii2{ color:#666666; font-size:14px;  line-height: 35px; }
 .tancoiiiab .t1{display: inline-block; width: 24%; color: #666666; font-size: 14px;}
 .tancoiiiab .t1 b{display: block; color: #333333; font-size: 18px; margin-top: 10px;}
 
 .rc-popscroll{ max-height: 450px; overflow-y: scroll;  padding-right: 60px;margin-top: 30px;}
 .rc-popscroll::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 5px;}
 .rc-popscroll::-webkit-scrollbar-thumb {/*滚动条里面小方块*/  background: #0572a9; width: 5px; }
 .rc-popscroll::-webkit-scrollbar-track {/*滚动条里面轨道*/  background: #f2f5f9; width: 5px; }
 
 
 .job-description .swiper-container {
     width: 100%;
     height: 300PX;}
 
 .job-description .swiper-container .swiper-slide {
     height: auto;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;}
 
 .g5lianjie ul{ font-size: 16px; color: #000; font-weight:initial;}
 .g5lianjie ul li{    line-height: 30px;}
 .indAbout .bottom li:last-child:after{ display: none;}

 .contactTop{ margin-top: -100px; position: relative; z-index: 10;}
 .contactTop .left{  background: url(../images/contacttopbg.jpg) no-repeat center center; width: 40%;}
 .contactTop .left dl{ display: flex; align-items: center; line-height: 80px;}
 .contactTop .left dl dt{ margin-right: 30px;}
 .contactTop .left .icon a{ border: 1px solid rgba(255, 255, 255, .24); display: flex; align-items: center; justify-content: center; width: 70px; height: 70px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
 .contactTop .left .icon a img{ opacity: 0.6; width: 50%;}
 .contactTop .left .icon a img.ewmImg{ max-width: 100px; opacity: 1; width: 100px; position: absolute; bottom: -110px;
      display: none;
     left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); }
     .contactTop .left .icon a:hover img.ewmImg{ display: block;}
     .contactTop .right{ width: 60%;}
 .contactTop .left .icon a:hover img{ opacity: 1;}
 .contactTop .right .input{ border-bottom: 1px solid #333; width: 100%; padding: 20px 0;  }
 .contactTop .right input::-webkit-input-placeholder  {color:#333;}
 .contactTop .right input:-moz-placeholder  {color:#333;}
 .contactTop .right input::-moz-placeholder  {color:#333;}
 .contactTop .right input:-ms-input-placeholder {color: #333;}
 .contactTop .right .button{ height: 60px; border-radius: 30px; width: 40%; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; 
overflow: hidden;}
.contactTop .right .button:hover{ opacity: 0.8;}

 

 .contactBot li{ width: 31.5%; position: relative;  box-shadow: 0 0 10px rgba(0, 0, 0, .1);
     overflow: hidden; -webkit-perspective: 300px; perspective: 300px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
 .contactBot li .line{ width: 26px; height: 3px; background-color: #0572a9;}
 .contactBot li figure{ border-radius: 50%; background-color: #fff; position: relative; width: 90px; height: 90px; border-radius: 50%; border: 10px solid rgba(245, 245, 245, .8); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
 .contactBot li figure img{ width: 40%; filter: grayscale(100%) ; -webkit-filter: grayscale(100%) ; }
 .contactBot li figure i:before { content: ''; position: absolute; left: 0; top: 0;  border: 1px solid #fff; width: 100%;height: 100%;  border-radius: 50%;  opacity: 0}
.contactBot li figure i:after {content: '';position: absolute; left: 0;top: 0;border: 1px solid #fff; width: 100%; height: 100%; border-radius: 50%;opacity: 0}
.contactBot li:hover figure  i:before { animation: serv_one_border .9s 0s ease 1; }
.contactBot li:hover figure i:after { animation: serv_one_border 1.5s 0s ease 1; -webkit-animation: serv_one_border 1.5s 0s ease 1; }

.contactBot li:before{content: "";width: 110%;height: 100%;position: absolute;left: -5%;top: 0;z-index: -1;opacity: 0;visibility: hidden;transform-origin: top center 0;
     transition: 0.54s;transform: rotateX(-60deg);-webkit-transform: rotateX(-60deg);-moz-transform: rotateX(-60deg);
     background:  linear-gradient(to bottom, #0572a9, #5da9f9); }
.contactBot li:hover:before{ opacity: 1; visibility: visible; transform: rotateX(0deg); -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); color:#fff;}
.contactBot li:hover { color: #fff;}
.contactBot li:hover .line{ background-color: #fff;}
.contactBot li:hover  figure{border: 10px solid #3987d7; }
.contactBot li:hover  figure img{ filter: grayscale(0%) ; -webkit-filter: grayscale(0%) ; }

.newsPage{  border-top: 2px solid #3987d7; border-bottom: 2px solid #3987d7;}
.newsPage a{ width: 40%;}
.mainbox .newsTit .left{ width: 76%; line-height: 1.6;}
.page{display:inherit;width:100%;text-align: center;padding:30px 0px;clear:both;}
.page a,.page span{padding: 0 14px;height: 38px;line-height: 36px;display:inline-block;border: 1px solid #dddddd;margin:0 2px;color: #4f4f4f;font-size: 14px;transition:0.36s;}
.page .current{background: #0572a9;color:#fff !important;border: 1px solid #0869ac;}
.page a:hover{background: #0572a9;color:#fff !important;text-decoration:none;border: 1px solid #0869ac;}
.page a:hover font{ color:#4f4f4f;}
.page a.u_bnt{ transition: all 1s;-moz-transition: all 1s; /* Firefox 4 */-webkit-transition: all 1s; /* Safari 和 Chrome */-o-transition: all 1s; /* Opera */}