body{ font-size: 16px;}
.w90{ width: 90%; margin: 0 auto;}
header{ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); background-color: #fff;  position: fixed; top: 0; left: 0; width: 100%; z-index: 100;}
/* */
nav{ font-size: 18px;}
nav li{  padding: 0 30px; }
nav a.oneNav{ line-height: 90px; position: relative; display: block;}
nav li .nav2{display: none; z-index: 5; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1); border-top: 1px solid #e5e5e5; background-color: #fff; position: absolute; top: 90px; line-height: 70px; font-size: 16px;   width: 100%; left: 0; color: #333;}
nav li.on .nav2{  display: block; z-index: 1;}
.nav2 a::before{ width: 100%; height: 2px; background: #0097da; display: block; content: ''; position: absolute; bottom: 0; left: 0; transform: scale(0,1); transition: all .36s; -webkit-transform: scale(0,1); -moz-transform: scale(0,1); -ms-transform: scale(0,1); -o-transform: scale(0,1); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.nav2 a{ margin: 0 25px; position: relative;}
.nav2 a:hover,.nav2 a.on{ color: #0097da;}
nav li.on a.oneNav,nav li:hover a.oneNav{ color: #0097da;}
.nav2 a.on::before{ transform: scale(1,1); -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); }
.banner{   width: 100%; overflow: hidden; margin-top: 90px;}
 /* .banImg{ width: 100%; height: calc(100vh - 100px); object-fit: cover;}   */

.anniuBtn{ width: 30px; height: 30px;}
.banner .swiper-slide  .txt{ position: absolute;   z-index: 5; width: 100%; left: 0; top: 0; height: 100%;   justify-content: center;display: flex;flex-direction: column; padding-left: 5vw;}
.banner .swiper-wrapper .swiper-slide  .more{ display: none;}
.banner  .swiper-pagination-bullet{width: 24px;height: 4px; border-radius: 2px; margin: 0 6px;}

.wapbanner .anniuBtn{ width: 16px !important; height: 16px !important;}
.wapbanner .swiper-slide  .txt{ position: absolute;   z-index: 5; width: 100%; left: 0; top: 0; height: 100%;  align-items: center;justify-content: center;display: flex;flex-direction: column;  }
.wapbanner .swiper-wrapper .swiper-slide  .more{ display: none;}
.wapbanner .swiper-wrapper .swiper-slide.slide1 .more{ display: flex; align-items: center; justify-content: center;}
 
.wapbanner  .swiper-pagination-bullet{width: 24px;height: 4px; border-radius: 2px; margin: 0 6px;}
.wapbanner .swiper-wrapper .swiper-slide  .f40{ font-size: 14px;}

@media screen and (max-width:750px) {.banner{ margin-top:60px}}



.hidden{ overflow: hidden;}
.idx-More{  width: 180px; height: 50px;  border-radius:25px ; -webkit-border-radius:25px ; -moz-border-radius:25px ; -ms-border-radius:25px ; -o-border-radius:25px ; }
.light{ position: absolute; left: -100%; top: 0; width: 100%; height: 100%; transform: skewx(-25deg);background-image: -webkit-linear-gradient(0deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));}
.light-tri:hover .light{ left: 100%; transition: 1s;}
.idx-More{ box-shadow: 0 0 10px rgba(0,151,218,0.3);}
.idx-pro .con{padding-left: 5vw;}
#proSwiper{ width: 100%;}
#proSwiper .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) ; }
#proSwiper .swiper-slide:hover { color: #0097da;}
.ljgd,.ljzx{ display: flex; align-items: center; transition: all .36s; justify-content: center; font-size: 14px; border: 1px solid #e5e5e5; width: 120px; height: 44px; border-radius: 22px; -webkit-border-radius: 22px; -moz-border-radius: 22px; -ms-border-radius: 22px; -o-border-radius: 22px; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.ljgd{ background-color: #a8aeba; border-color: #a8aeba; color: #fff;}
.ljgd:hover{box-shadow: 0 0 10px rgba(0,151,218,0.3); background-color: #0097da; border-color: #0097da; transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
.ljzx:hover{ box-shadow: 0 0 10px rgba(0,151,218,0.3);background-color: #0097da; border-color: #0097da; color: #fff; transform: translateY(-10px); }

.proBtn{ width: 80px; height: 80px; border-radius: 50%; position: absolute; top: 50%;right: 9.5%; z-index: 10; transform: translateY(-50%); box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); -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%); }
.proBtn div{ width: 50%; cursor: pointer; }
.proBtn div:hover { background-color: #0097da; color: #fff;}

.idxAbout{background: url(../images/bg1.jpg) no-repeat center center; background-size: cover;    background-attachment: fixed; position: relative;}
.playBtn{z-index: 5;width: 100px;height: 100px;border-radius: 50%;background-color: rgba(255, 255, 255, 0.5);-webkit-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;-o-border-radius: 50%;
 box-shadow: 0 0 rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1),0 0 0 65px rgba(255, 255, 255, 0.1);animation: ripple-wave1 1s linear infinite;animation-play-state: running;opacity: 1;visibility: visible;-webkit-animation: ripple-wave1 1s linear infinite;}
 
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;}

.idxYsUl li{  width: 24%;    height: 540px;}
.idxYsUl li.on{ width: 50%;}
.idxYsUl li .txt{ width: 100%;height: 540px;}
.idxYsUl li .img  { width: 0; height: 540px; transition: all .6s; -webkit-transition: all .6s; -moz-transition: all .6s; -ms-transition: all .6s; -o-transition: all .6s; }
.idxYsUl li .img img{ width: 100%; height: 100%; object-fit: cover;}
.idxYsUl li.on .txt{ width: 50%;}
.idxYsUl li.on .img{ width: 50%;}
.idxYsUl li .txt{ padding: 60px 40px 70px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
.idxYsUl li .txt img{height: 70px;}
.idxYsUl li .txt .line{ width: 20%; height: 3px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.idxYsUl li:hover   { color: #0097da;}
.idxYsUl li:hover  .txt .line{ background-color: #0097da; width: 80%;} 
.idxYsUl li:hover:hover .txt img{animation: jello 1.2s;}

#ysSwiper {box-shadow: 0 0 10px rgba(0, 0, 0, .15);}
#ysSwiper .swiper-slide .txt{ padding: 20px 10px; }
#ysSwiper .swiper-slide .txt .line{ width: 20%; height: 3px; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
#ysSwiper .swiper-slide .txt img{ height: 50px;}
#ysSwiper .swiper-slide .img img{ width: 100%; height: 100%; object-fit: cover;}

.w62-5{ width: 62.5%;}
.idxNews .left li .img{ width: 35%;  }
.idxNews .left li .img img{ width: 100%; height: 240px; object-fit: cover;}
.idxNews .left li .txt{ width: 60%;}
.newsmore  span{ display: inline-block; margin-left: 15px; border: 1px dashed #0097da; width: 24px; position: relative; height: 24px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.newsmore span .iconfont{ position: absolute; left: 80%; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.idxNews .left li { padding-bottom: 54px; margin-bottom: 54px; border-bottom: 1px solid #e5e5e5;}
.idxNews .left li:last-child{ border-bottom: none;}
a:hover .newsmore span .iconfont{ left: -8px;}
.idxNews .left li:hover{ color: #0097da;}
.linetit 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;}
a:hover .linetit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}

.idxNews .left 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); }
.idxNews .right{ width: 30%;}
.idxNews .right .img img{ width: 100%; height: 325px; object-fit: cover;}
.idxNews .right  a:hover { color: #0097da;}
.idxNews .right a: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); }

footer{ background: #0d1519; color: rgba(255, 255, 255, 0.3);}
.footLine{ width: 50px; background: rgba(255, 255, 255, 0.15); height: 3px;}
.footNav{ width: 55%;}
.footNav dt{ color: #fff; margin-bottom: 15px;}.footNav dd{ line-height: 3; color: rgba(255, 255, 255, 0.5);}
footer a:hover{ color: #fff;}
footer .top{ border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
footer .bottom{ padding: 25px 0;}
.footEwm{ width: 140px;}

.page-aside { position: fixed; right: -6px; bottom: 180px; transform: translateX(100%); z-index: 25; opacity: 0; transition: transform .3s, opacity .3s; -webkit-transition: transform .3s, opacity .3s; -moz-transition: transform .3s, opacity .3s; -ms-transition: transform .3s, opacity .3s; -o-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;}

.h_nav{ height: 60px; width: 60px; background-color:#0097da; 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; -webkit-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); }
.erji{position: absolute;height: 60px;width: 60px;z-index: 10;color: #333;font-size: 28px;line-height: 60px;text-align: center;right: 0;top: 0;display: none;}
.wapbanner{ margin-top: 60px;}
.wapbanner .swiper-slide img{ width: 100%; }
/* height: 320px; object-fit: cover; */

.w80{ width: 80%; margin: 0 auto;}
.neiBan{ margin-top: 90px; position: relative;}
.neiBan .txt{ position: absolute; left: 0; top: 0; z-index: 5;}
.border-bottom{ border-bottom: 1px solid #e5e5e5;}
.introduction .img{ padding-right:5%;}
.introductionlogo{ opacity: 0.1; margin-top: -40px;   }
.introduction .img .f34{ padding-left: 12%; margin-top: 95px;}
.introduction .img .f34::before{ color: #0097da; content: ""; width: 40px; height: 39px; background: url(../images/dou.png) no-repeat center center;  background-size: 100% 100%;
     display: block;  position: absolute; top: 0; left: 0;  }
.culture li{ width: 32%; overflow: hidden;}
.culture li .txt{ position: absolute; top: 0; left: 0; z-index: 5; padding-top: 150px;}
.culture li .txt img{ height: 80px;}
.culture li .line{ width: 15%; height: 2px; background-color: #fff;}
.culture li:hover{ border-radius: 20px; box-shadow: 0 0 10px rgba(0,0,0,0.5); transform: translateY(-20px); -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -o-transform: translateY(-20px); }
.culture li:hover .txt{ padding-top: 0; background-color: rgba(0, 0, 0, .15);}
.culture li:hover .txt .line{ width: 50%;}

.mission{ background: url(../images/missionBg.jpg) no-repeat center center; background-size: cover;  background-attachment: fixed; position: relative; padding: 150px 0;}
.missionBtn{ width: 200px; height: 50px; border-radius: 25px; margin: 95px auto 0; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px;
box-shadow: 0 0 10px rgba(255, 255, 255, 0.3); }
.missionBtn span{ position: relative; z-index: 5;}
.missionBtn::before{ display: block; content: ''; transition:all .36s ; background-color: #0097da; width: 100%; height: 0; position: absolute; left: 0; bottom: 0; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.missionBtn:hover{ color: #fff; transform: translateY(-20px); -webkit-transform: translateY(-20px); -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -o-transform: translateY(-20px); }
.missionBtn:hover::before{ height: 100%;}
#historySwiper .swiper-slide .txt{ justify-content: center; padding: 0 50px;}
#historySwiper .swiper-slide .txt .f18{ position: relative; z-index: 10;}
#historySwiper .swiper-slide .txt .f240{ font-size: 240px; color: rgba(0,0,0,0.05);z-index: 2; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
#historyyearsSwiper .swiper-slide{ align-items: center; cursor: pointer;}
#historyyearsSwiper .swiper-slide i{ margin-top: 10px; width: 28px; height: 28px; background: url(../images/historyIcon1.png) no-repeat center center;   display: inline-block;}
#historyyearsSwiper{ background: url(../images/line.png) no-repeat left bottom 14px;}
#historyyearsSwiper .swiper-slide-thumb-active span,#historyyearsSwiper .swiper-slide-active span{ color: #0097da; transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); }
#historyyearsSwiper .swiper-slide-thumb-active i,#historyyearsSwiper .swiper-slide-active i{  background: url(../images/historyIcon.png) no-repeat center center;}
.history .next,.history .prev{ background-color: #fff; z-index: 5; position: absolute; bottom: -10px; width: 50px; height: 50px; border-radius: 50%; border: 1px solid #e5e5e5; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.history .next{ right: -25px;}
.history .prev{ left: -25px;}
.history .next:hover,.history .prev:hover{ background-color: #0097da; color: #fff;}

.honor{ background: url(../images/bg2.jpg) no-repeat center center; background-size: cover;}
.honorTab li{ cursor: pointer; padding: 12px 50px; border-radius: 50px; background-color: #fff; margin: 0 20px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; }
.honorTab li.on{ color: #fff; background-color: #0097da;}

.honor .swiper-container .img{ width: 100%; height: 360px; cursor: pointer; }
.honor .swiper-container .img img{ max-height: 100%;  max-height: 100%; object-fit: cover;border:6px solid #333;border-style:inset;}
.honorLeft,.honorRight{
  width: 70px;
  height: 70px;
  border: 1px solid #ddd;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  transition:all .36s ;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  cursor: pointer;
  -webkit-transition:all .36s ;
  -moz-transition:all .36s ;
  -ms-transition:all .36s ;
  -o-transition:all .36s ;
}
.honorLeft{ left: -100px;}
.honorRight{ right: -100px;}
.honorLeft:hover,.honorRight:hover{ background-color: #0097da; color: #fff;}
.honorTabCon figure{ display: none;}
.honorTabCon figure.on{ display: block;}

.caseList 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); }
.caseList li { box-shadow: 0 0 10px rgba(0, 0, 0, .15); margin-bottom: 40px;}
.caseList li  .line{ width: 15%; height: 2px;}
.caseList li .more{ width: 200px; height: 50px;}
.caseList li .more span{ display: inline-block; margin-left: 15px; border: 1px dashed #ababab; width: 24px; position: relative; height: 24px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.caseList li .more span .iconfont{ position: absolute; left: 80%; top: 50%; transform: translateY(-50%); color:#ababab; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.caseList li:hover .more  span .iconfont{ left: -8px;}
.caseList li:hover .more{ background-color: #0097da; color: #fff;}
.caseList li:hover .more span{ border-color: #fff;}
.caseList li:hover .more .iconfont{ color: #fff;}
.caseList li:hover .more{ box-shadow: 0  0 0 10px rgba(0,151,218,0.3);}
.caseinfotOne{ align-items: flex-start;}
.caseinfotOne .img .con{ width: 77.6%; height: 56%; background-color: #000; position: absolute;left:11.2% ; z-index: 5; top: 11.6%;}
.caseinfotOne .img .con .suo{ width: 100%; height: 100%; object-fit: cover; opacity: 0.8;}
.caseBtn{ width: 75px; height:75px; position: absolute; top: 55%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); } 
.caseBtn::before{ width: 130%; height: 130%; position: absolute; top: -15%; left:-15%; background-color: rgba(255, 255, 255, 0.5); display: block; transform: scale(0,0); transition:all .36s ; content: ''; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; -webkit-transform: scale(0,0); -moz-transform: scale(0,0); -ms-transform: scale(0,0); -o-transform: scale(0,0); -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.caseBtn:hover::before{ transform: scale(1,1); -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); }
.caseinfotOne .f18{ border-bottom: 2px solid #0097da;}
.broder{ border: 1px solid #e5e5e5;}
.casepage .broder{ margin-right: 10px; width: 50px; height: 50px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.casepage  .back{ height: 50px; width: 150px; border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px; }
.casepage  .next  .broder{ margin-right: 0; margin-left: 10px;}
.casepage a.next{ justify-content: flex-end;}
 
.casepage a.next,.casepage a.prev{width: 38%; }
.casepage a:hover .broder{ background-color: #0097da ; color: #fff;}
.caseGbook input{ width: 21.3%; height: 60px; line-height: 60px; padding: 0 15px;}
.caseGbook input:nth-child(3){ width: 41.3%}
.caseGbook input:nth-child(4){ width: 12%;}
.ideaul li{ width: 20%; height: 600px; background-color: #000; position: relative; overflow: hidden; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.ideaul li>img{ width: 100%; height: 100%; object-fit: cover; opacity: 0.8;}
.ideaul li .txt{ position: absolute; top: 50px; left: 0; text-align: center; width: 100%;}
.ideaul li .txt .f20{padding: 45px 0; position: relative;}
.ideaul li .txt .f20::after{ width: 1px; height: 40px;  display: block; content: ''; background-color: rgba(255, 255, 255, 0.3); position: absolute; bottom: 0; left: 50%;}
.ideaul li .txt .f20::before{ width: 1px; height: 40px;  display: block; content: ''; background-color: rgba(255, 255, 255, 0.3); position: absolute; top: 0; left: 50%;}
.ideaul li .desc{ width: 100%; background-image: linear-gradient(to bottom,transparent,rgba(0,151,218,0.9)); position: absolute; bottom: 0; left: 0; transform:translateY(100%) ; -webkit-transform:translateY(100%) ; -moz-transform:translateY(100%) ; -ms-transform:translateY(100%) ; -o-transform:translateY(100%) ; }
.ideaul li:hover{ width: 40%;}
/* .card-grid:hover > .card:not(:hover) { width: 15%;} */
.card-grid:hover > .card:not(:hover) img{ opacity: 0.5  }
  
 
.ideaul li:hover .desc{ transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }
.problem dl{ margin-bottom: 30px;}
 
.problem dl dd{ display: none;}
.border-top{ border-top: 1px solid #e5e5e5;}
.problem dl dt>div:nth-child(1){ width: calc(100% - 32px); }
.problem dt .jia{ width: 22px; height: 22px; display: inline-block;  background: url(../images/jia2.png)no-repeat center center; background-size: 100% auto; cursor: pointer;}
.problem dt .jian{ width: 22px; height: 22px; display: inline-block; background: url(../images/jian2.png)no-repeat center center; background-size: 100% auto; cursor: pointer;}
.problem dl.on dt{ background-color: #f5f5f5;}



#ideaSwiper .swiper-slide>img{ opacity: 0.8; width: 100%; height: 300px; object-fit: cover;}
#ideaSwiper .swiper-slide .txt{ position: absolute; top: 50px; left: 0; text-align: center; width: 100%;}
#ideaSwiper .swiper-slide .txt .f20{ font-size: 20px;  position: relative; display: inline-block; padding: 0 45px;}
#ideaSwiper .swiper-slide .txt .f20::after{ width: 40px; height: 1px;  display: block; content: ''; background-color: rgba(255, 255, 255, 0.3); position: absolute; left: 0; top: 50%;}
#ideaSwiper .swiper-slide .txt .f20::before{ width: 40px; height: 1px;  display: block; content: ''; background-color: rgba(255, 255, 255, 0.3); position: absolute; right: 0; top: 50%;}
#ideaSwiper .swiper-slide  .desc{ width: 100%; background-image: linear-gradient(to bottom,transparent,rgba(0,151,218,0.9)); position: absolute; bottom: 0; left: 0;  }

.downUl li:first-child{ border-top: 1px solid #e5e5e5;}
.downUl li{ border-bottom: 1px solid #e5e5e5;  padding: 35px 0;}
.downUl li .btn{ border: 1px solid #aaa; padding: 6px 15px; overflow: hidden; position: relative; border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px; -ms-border-radius: 25px; -o-border-radius: 25px; }
.downUl li .btn::before{ width: 100%; height: 0; z-index: -1; position: absolute; transition: all .36s; left: 0; bottom: 0; background-color: #0097da; display: block; content: ''; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.downUl li:hover{ color: #0097da;}
.downUl li:hover .btn{  color: #fff; border-color: #0097da;}
.downUl li:hover .btn:before{ height: 100%;}
.line-height1{ line-height: 1.2;}


.contactMessage .input{ height: 50PX; line-height: 50PX; width: 49%;}
.inputName{ background: url(../images/input_name.png) no-repeat center left 12px; padding-left: 40px;  background-size: auto 16px;}
.inputTel{ background: url(../images/input_tel.png) no-repeat center left 12px; padding-left: 40px;  background-size: auto 16px;}

.contactMessage .textarea{ width: 100%; background: url(../images/input_con.png) no-repeat left 12px top 16px;  background-size: auto 16px;padding-left: 40px;line-height: 50PX;}
.contactMessage .button{ line-height: 50px;} 

 
.jobtit{ background-color: #0097da;  line-height: 70px; text-align: center;}
.jobtop span:nth-child(1){width:30%;}
.jobtop span:nth-child(2){width: 20%;}
.jobtop span:nth-child(3){width: 20%;}
.jobtop span:nth-child(4){width: 20%;}
.jobtop span:nth-child(5){width: 10%;} 

.joblist li{ border: 1px solid #e5e5e5;  border-top: none;  }
 
.joblist dt{ line-height: 70px; text-align: center;}
.joblist dt .jia{ width: 22px; height: 22px; display: inline-block; background: url(../images/jia2.png)no-repeat center center; background-size: cover; cursor: pointer;}
.joblist dt .jian{ width: 22px; height: 22px; display: inline-block; background: url(../images/jian2.png)no-repeat center center; background-size: cover; cursor: pointer;}
.joblist dd { border-top: 1px solid #e5e5e5; padding-bottom: 20px; display: none;}
/* .joblist dd .item{ padding-top: 20px;}
.joblist dd .left{ width: 25%;} */
.giveTo{
    background-color: #0097da;
    color: #fff;
    display: inline-block;
    padding: 8px 25px;
    
    margin-top: 20px;
    /* margin-left: 50px; */
 
    transition: all .36s;
    -webkit-transition: all .36s;
    -moz-transition: all .36s;
    -ms-transition: all .36s;
    -o-transition: all .36s;
}
.giveTo:hover{ color: #fff; box-shadow: 0 0 10px rgba(0, 104, 183,.25); transform:  translateY(-10px); -webkit-transform:  translateY(-10px); -moz-transform:  translateY(-10px); -ms-transform:  translateY(-10px); -o-transform:  translateY(-10px); } 

 
.popup{ position: fixed; top: 0; left: 0; z-index: 99999;background:rgba(0, 0, 0, 0.5) none repeat scroll 0 0 !important;filter:Alpha(opacity=50); background:#000; width: 100%; height: 100%; display: none; font-size: 16px;}
.popup-table-type{ display: table;  text-align: center; width: 100%; height: 100%;}
.popup-table-cell{ display: table-cell; vertical-align: middle; height: 100%; width: 100%;}
.popup-container{ box-shadow: 0 0 10px 10px rgba(0,0,0,0.11);width: 90%; max-width: 1100px; margin:auto; padding: 0; position: relative; display: inline-block; border-radius: 10px;}
.popup-container .map{border-radius: 15px; overflow: hidden; max-width: 100%;}
.popup-container .map .con{position: absolute; bottom: 0; left: 0; width: 100%; z-index: 6; background: #fff; color: #333; padding: 15px 20px; text-align: left;}
.popup-container .map .con .h3{font-size: 20px; font-weight: bold;}
.popup-container .map .con .p{font-size: 16px;}
.popup .closed{ position: absolute;top: -30px; right: -30px; cursor: pointer; background: #000; border-radius: 100%; padding: 10px;}
.popup .closed:before{ content: "×"; font-family: "宋体"; font-size: 30px; color: #fff; line-height: 30px; }
@media (max-width:640px) {
    .popup .closed{ right: 0;}
}

.inputbox{ position:relative; line-height:44px;}
.inputbox label{ position:absolute; left:0; padding: 0 10px; color:#bfbfbf; z-index: 0; font-size: 16px;}
.inputbox .text{ width:100%;  line-height:44px;height:44px; padding:0 10px;border-radius:3px; border:1px solid #e4e4e4; background:none; position: relative; z-index: 2; font-size: 16px;transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;
}
.inputbox .text:focus{ border-color:#0097da;}

.jobpopup .popup-container{background:none;box-shadow:none; max-width: 720px;}
.jobpopup .popup-con{border-radius: 10px; overflow: inherit; background: #fff;padding-bottom: 62px;}
.jobpopup .closed{top: 2%; right: 8%; background: none; z-index: 85;}
.jobpopup .closed:before{color: #333;}
.jobformbox{ display: none;}
.jobform .form-tit{ border-bottom: 1px solid #eee; color: #333; font-size: 24px; text-align: left; padding: 18px 10%;}
.jobform form{padding: 3% 10% 0% 10%;}
.jobform .item{text-align: left; margin-bottom: 15px;}
.jobform .item2 .selectbox{width: 48%;float: left;}
.jobform .item2 .selectbox:last-child{float: right;}
.jobform .selectbox select{display: block; background: #f9f9f9; height: 55px; padding: 10px; line-height: 30px; width: 100%; border: none; color: #999; font-size: 16px;}
.jobform .name{color: #333; font-size: 18px;}
.jobform .inputbox { position: relative; cursor: text; width: 100%; height: 50px; padding: 10px; line-height: 30px; font-size: 16px; background: #f9f9f9;}
.jobform .inputbox span.tit { position: absolute; color: #999; top: 10px; left: 10px;}
.jobform .inputbox input.text ,.jobform .inputbox select.text{ border: none; background: none; display: block; width: 100%; height: 30px; font-size: 16px;padding:0;}
.jobform .file-filestyle{ line-height: 30px; font-size: 16px; }
.jobform .file-filestyle input.text { border: none; background: none; display: block; width: 100%; height: 30px; font-size: 16px;}
.jobform .file-filestyle span.tit { color: #333; display:block; margin-bottom:15px; }
.jobform .file-filestyle .filebtn{position:relative; width: 85px; height: 80px; border:2px solid #ededed; display:inline-block; font-size:0; text-align: center; line-height: 50px; cursor: pointer;}
.jobform .file-filestyle .filebtn::before,
.jobform .file-filestyle .filebtn::after{ position:absolute; content:''; background:#ededed;}
.jobform .file-filestyle .filebtn::before{ left:20%; width:60%; height:3px; top:50%; margin-top:-1px;}
.jobform .file-filestyle .filebtn::after{ left:50%; margin-left:-1px; width:3px; top:20%; height:60%;}
.jobform .btns{padding-top: 0; text-align: center;position: absolute;bottom: -45px;left: 50%;margin-left: -85px;margin-left: -50px;}
.jobform .btn{display: inline-block; background: #0097da; font-size: 16px; color: #fff; width: 170px; height: 50px; text-align: center; line-height: 50px; border-radius: 55px; border: none; cursor: pointer;}
@media (max-width:640px) {
    .jobform .form-tit{font-size: 20px;}
    .jobform .name,.jobform .inputbox,.jobform .file-filestyle{font-size: 14px;}
    .jobform .inputbox input.text{font-size: 14px;}
    .jobform .inputbox span.tit,.jobform .file-filestyle span.tit{top: 5px;}
    .jobform .inputbox{padding: 5px 10px; line-height: 20px; height: 42px;line-height: 32px;}
    .jobform .file-filestyle{padding: 0 10px; line-height: 20px; height: 30px;}
    .jobform .file-filestyle .filebtn{line-height: 90px;width: 50px;height: 50px;}
    .jobform .btn{font-size:14px; width: 110px;height: 34px;line-height: 34px;border-radius: 30px;}
	.jobform .btns {
	    padding-top: 0;
	    text-align: center;
	    position: absolute;
	    bottom: -45px;
	    left: 50%;
	    margin-left: -50px;
	}
}

.jobform{
	position: relative;
} 

.joblist  li.on dt{ background-color: #f5f5f5;}
.messageImg{ width: 100%; height: 100%; object-fit: cover;}
.border{ border: 1px solid #e5e5e5;}


.serachTop .input {
	width: 85%;
	height: 76px;
	 
	padding-left: 70px;
	background: url(../images/searchbg.png) no-repeat left 20px center #f7f8f9;
 
}

.serachTop .submit {
	width: 15.6%;
	height: 76px; 
	color: #fff;
} 
.searchList li::after {
  position: absolute;
  content: '';
  left: 0;
 
  bottom: 0;
  height: 1px;
  background: #0097da;
  transition: all 0.5s;
  width: 0;
} 
.searchList li:hover{ color: #0097da; }
.searchList li:hover::after{ width: 100%;}

.wapHeader{ display: none;}

.zhanwei{ padding-top: 120px; margin-top: -120px;}

/*添加*/


.w70{ width: 80%; margin: 0 auto; max-width: 1500px;}
/* .neiBan{ margin-top: 90px; height: calc(100% - 90vh); overflow: hidden;}
.neiBanImg{ width: 100%; height: 100%; object-fit: cover;  animation: bgscale 5s forwards cubic-bezier(0.4, 0, 0.49, 0.93);}

.neiBan .txt{  position: absolute; width: 100%; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%);  text-align: center; }
.neiBan .txt>div{ animation: topFloat 1.2s; -webkit-animation: topFloat 1.2s; }
.neiBan .line{ width: 55px; height: 4px; background-color: #5f5f5f;}
.neiBan .line.bg-white{ background-color: #fff;} */

.f-40{font-size: 40px;}

.f-18{font-size: 18px;}

.n-main{background: #f5f5f5; padding: 4% 0; box-sizing: border-box;}
.n-product-list .item{background: #ffffff; width: 48%; margin-bottom: 4%; overflow: hidden; height: 660px; box-shadow: 0 0 10px rgba(0, 0, 0, .15);} 
.n-product-list .item:hover{ box-shadow: 0 0 20px rgba(0, 0, 0, .25);}
.n-product-list .item .img{padding: 3%; height: 530px; box-sizing: border-box; -webkit-transition: all 250ms ease-out 0s;
transition: all 250ms ease-out 0s;
}
.n-product-list .item .img img{display: block; margin: 0 auto;  max-width: 100%; max-height: 100%; object-fit: cover;}
.n-product-list .item .text{ padding: 2% 6% 8%; box-sizing: border-box; transition: all 0.6s;}
.n-product-list .item .text .t1{font-size: 30px; font-weight: bold;}
.n-product-list .item .text .t2{font-size: 18px; margin-top: 10px;}
.n-product-list .item .text .hide { padding: 6% 6%;  box-sizing: border-box; margin-top: 20px; position: absolute; bottom: 0; left: 0; width: 100%;
  -webkit-transition: all 250ms ease-out 0s;
transition: all 250ms ease-out 0s;
display: none;
top: 50%;
-webkit-transform: translateY(-20%);
transform: translateY(-20%);}
.n-product-list .item .text .hide p{ line-height: 2; color: #666666; font-size: 15px;}
.n-product-list .item .text .hide p span{display:inline-block; width: 6px; height: 6px; background: #119bdb; vertical-align: middle; border-radius: 50%; margin-right: 8px;}
.n-product-list .item .text .hide .more{padding: 25px 0 0; border-top: 1px solid #219fdd; margin-top: 25px;}
.n-product-list .item .text .hide .more a{color: #219fdd;}
.n-product-list .item .text .hide .more .iconfont{color: #219fdd; font-weight: bold;}
.n-product-list .item:hover .text{-webkit-transition: all .3s ease-out .2s,-webkit-transform .5s ease .2s;
transition: all .3s ease-out .2s,-webkit-transform .5s ease .2s;
transition: all .3s ease-out .2s,transform .5s ease .2s;
transition: all .3s ease-out .2s,transform .5s ease .2s,-webkit-transform .5s ease .2s;
opacity: 1;
visibility: visible;
-webkit-transform: translateY(-55%);
transform: translateY(-55%); padding: 2% 6% 16%;}
.n-product-list .item:hover .text .hide{	-webkit-transition: all .3s ease-out .2s,-webkit-transform .5s ease .2s;
transition: all .3s ease-out .2s,-webkit-transform .5s ease .2s;
transition: all .3s ease-out .2s,transform .5s ease .2s;
transition: all .3s ease-out .2s,transform .5s ease .2s,-webkit-transform .5s ease .2s;
display: block;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);}

.n-product-list .item:hover .img{
-webkit-transform: scale(0.7);
-moz-transform: scale(0.7);
-ms-transform: scale(0.7);
-o-transform: scale(0.7);
margin-top: -10%;

	
}

.inner{width: 80%; margin: 0 auto;}
.proInfoTop{margin-top: 160px; padding-bottom: 55px; background: url(../images/des-bg1.jpg) no-repeat; background-size: cover;}
.location{padding: 50px 0; box-sizing: border-box;}
.proinfoCon .txt .h1{font-size: 40px;}
.proinfoCon .txt .h2{font-size: 18px; color: #666666;}
.proinfoCon .img{width: 60%;}
.proinfoCon .txt{width: 40%;}


.proinfoCon .more a{ padding: 18px 35px; box-sizing: border-box;border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px;  white-space: nowrap;}
.proinfoCon .more a:first-child{ border: 1px solid #d8d8d8;}
.proInfoLeft{  width: 65%; padding-bottom: 40px;}
.proInfoRight{ width: 30%;}
.proInfoLeft .title{  font-size: 36px; padding: 50px 0;}
.proInfoLeft .title span{ border-left: 4px solid #0097da; height: 40px; display: inline-block; }
.proInfoRight .title{   padding: 50px 0; font-size: 36px;}
.rigthUl .img{ width: 35%;  }
.rigthUl .img img{  max-width: 100%;  max-height: 100%; object-fit: cover; vertical-align: middle;}
.rigthUl .txt{  width: 55%; padding: 20px 0;}
.proInfoRight .rigthUl li{border: 1px solid #e5e5e5; padding: 30px; box-sizing: border-box; transition: all 0.6s;}
.proInfoRight .rigthUl li:hover{ box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);}
.proInfoRight .rigthUl li:hover .txt .f30{ color: #0097da;}


.artLink {
	margin-top: 50px;
	padding: 45px 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 16px;
	color: #666666;
	border-top: 1px solid rgb(230, 230, 230);
}

.artLink a {
	font-size: 15px;
	color: #666666;
	width: 40%;
	
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s;
}

.artLink a:hover {
	color: #0291dd;
}

.artLink a p {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	word-break: break-all;
	flex: 1;
	font-size: 15px;
}

.artLink a:nth-child(2) {
	margin: 0 15px;
	background: #0097da;
	color: #ffffff;
	border-radius: 35px;
	width: 110px;
	
	padding: 10px 0;
	text-align: center;
}

.artLink a:nth-child(1) p {
	width: 94%;
}

.artLink a:nth-child(3) p {
	width: 94%; text-align: right;
}

.link1 span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 45px;
	height: 45px;
	
	border-radius: 50%;
	border: 1px solid #d8d8d8;
	
	
}


.Newmain{padding: 50px 0; box-sizing: border-box;}
.newslist li{border: 1px solid #eaeaea;}
.newslist  li a .icon{ border: 1px solid #333; width: 35px; height: 35px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.newslist li a .icon span{ font-size: 20px; color: #333;}
.newslist  li .img img{ object-fit: cover; width: 100%; height: 320px;}
.newslist li:hover { color: #0097da;}
.newslist li:hover a .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:hover a .icon{ background-color: #0097da; border-color: #bd171b; transform: translateX(-20px) rotate(45deg); -webkit-transform: translateX(-20px) rotate(45deg); -moz-transform: translateX(-20px) rotate(45deg); -ms-transform: translateX(-20px) rotate(45deg); -o-transform: translateX(-20px) rotate(45deg); }.indexNews .swiper-slide a:hover .icon span{ color: #fff;}
.newslist li:hover{ transform: translateY(-10px); -webkit-transform: translatey(-10px); -moz-transform: translatey(-10px); -ms-transform: translatey(-10px); -o-transform: translatey(-10px); }
.newslist  li{ width: 32%; margin-right:2%;}.newslist  li:nth-child(3n){ margin-right: 0;}
.pic::before {content: "";width: 100%;height: 100%;position: absolute;z-index: 1;left: 0px;}
a:hover .pic::before { animation: gradient-rectangle 1s ; animation-delay: 0s; -webkit-animation-timing-function: cubic-bezier(0, 0, 0.18, 0.96); -webkit-animation:; }


.Newmain-des{width: 80%; margin: 0 auto;}
.Newmain-des .title{padding: 40px 0; border-bottom: 1px solid #e5e5e5; text-align: center;} 
.Newmain-des .title .t1{ color: #000000; margin-bottom: 20px; font-size: 36px; font-weight: bold;} 
.Newmain-des .title .t2{ color: #666666; font-size: 14px;} 
.Newmain-des .info{padding: 30px 0;}
.Newmain-des .info p{line-height: 2.5; color: #555; font-size: 16px; margin-bottom: 20px;}
.Newmain-des .info img{display: block; max-width: 100%;}

.Newmain-des-tj{background: #f9f9f9; padding: 50px 0;}
.Newmain-des-tj .title {text-align: center;color: #000000; padding: 20px 0; font-size: 40px; margin-bottom: 50px;}

.Newmain-des-tj .newslist li{border: none; }
.Newmain-des-tj .newslist li .txt {padding: 30px 0;}



.proTop .img{ width: 55%;}
.proTop .txt{ width: 43%;}
.proTop .img .left{ width: 15.7%;  }
.proTop .img .left .swiper-slide{height: calc((100% - 60px) / 4); background-color: #fff; }
.proTop .img .left  .swiper-slide-thumb-active{ border: 1px solid #0097da;}
.proTop .img .left  img{ width:100% ; height:100% ; object-fit: cover;}
.proTop .img .left .swiper-container{ width: 100%; height: 500px;}
.proTop .img .right{ width: 81.2%; height: 500px;}
.proTop .img .right .swiper-slide img{ max-width:100% ;  max-height: 100%; object-fit: cover;}
.proTop .img .right .swiper-container{height: 500px; border: 1px solid #dddddd;}
.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: #0097da;}
.proTop .img .right .btn:hover .iconfont{ color: #fff;}
.proInfoTit{ background-color: #f2f2f2; } 
.proInfoTit span{ line-height: 80px; width: 20%;}


.Des-sec2{padding: 10px 0 50px;}
.Destitle{text-align: center; font-size: 44px; color: #333333; padding: 40px 0;}
.Des-sec2-list{width: 70%; margin: 0 auto;}
.Des-sec2-list .left{width: 30%;}
.Des-sec2-list .left .item{margin: 80px 0;}
.Des-sec2-list .left .item .txt{text-align: right; width: 65%;}
.Des-sec2-list .left .item .ico{margin: 0 20px;}
.Des-sec2-list .left .item .txt .t2{margin-top: 15px; color: #666666;}
.Des-sec2-list .right .item .txt{text-align: left;}
.mobsec2-list{display: none;}

.Des-sec3{padding: 10px 0 70px; background: url(../images/des-bg2.jpg) no-repeat; background-size: cover;}
.Des-sec3-list .item{background: #ffffff; cursor: pointer; border-radius: 120px; padding-top: 100px; box-sizing: border-box; height: 425px;
 box-sizing: border-box; width: 18%; max-width: 250px; text-align: center; box-shadow: 0 0 10px rgba(0, 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;}
.Des-sec3-list .item .ico{background: #ffffff; width: 100px; height:100px; margin: 0 auto 45px; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.Des-sec3-list .item .txt .t1{  color: #666666;}
.Des-sec3-list .item .txt .t2{ margin-top: 20px; color: #333333;}

.Des-sec3-list .item::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  transform-origin: top center 0;
  transition: 0.54s;
  background: #0291dd; transform: translateY(-200px); }
  
.Des-sec3-list .item:hover:before{ opacity: 1; visibility: visible; transform: rotateX(0deg); -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); color:#fff;}
.Des-sec3-list .item:hover .txt .t1{ color: #fff;}
.Des-sec3-list .item:hover .txt .t2{ color: #fff;}
.Des-sec3-list .item:hover .line{ background-color: #fff;}
.Des-sec3-list .item:hover figure{border: 10px solid #3987d7; }
.Des-sec3-list .item:hover figure img{ filter: grayscale(0%) ; -webkit-filter: grayscale(0%) ; }



.Des-sec4{padding-bottom: 40px;}
.Des-sec4 .img{margin-bottom:20px;}
.Des-sec4 .img img{display: block; margin: 0 auto; max-width: 100%;}


.Des-sec5{background: #f5f5f5; padding-bottom: 40px; padding-top: 20px;}
.Des-sec5 .rigthUl li{width: 48%; background: #ffffff; padding: 40px; box-sizing: border-box; transition: all 0.6s;}
.Des-sec5 .rigthUl li a{ align-items: baseline;}
.Des-sec5 .rigthUl li a .opacity8{margin-top: 30px;}
.Des-sec5 .rigthUl .txt{padding: 0;}
.Des-sec5 .rigthUl li .f30{transition: all 0.6s;}
.Des-sec5 .rigthUl li:hover{transform: translateY(10px);}
.Des-sec5 .rigthUl li:hover .f30{color: #0093db;}