body{font-size: 16px; overflow-x: hidden;} 
.inner{ width:84vw;   margin: 0 auto;  }
.pl-inner{ padding-left: 8vw;}
.pr-inner{ padding-right: 8vw;}
.ml-inner{ margin-left:8vw;}
.mr-inner{ margin-right: 8vw;}

.w46{ width: 46%;}
.zwHeader{ height: 90px;}
.zw{ margin-top: -90px; padding-top: 90px;}

.h-50{ height: 50px;}.w-50{ width: 50px; }
.h-60{ height: 60px;}.w-60{ width: 60px;}
.w-70{ width: 70px;} .h-70{ height: 70px;}


header{ position: fixed; top: 0; width: 100%; left: 0; z-index: 100; color: #fff;}
header .icon02{ display: none;}
.logoImg{ height:52px;}
.oneNav{ line-height:90px; white-space: nowrap; display: block; padding: 0  1.3vw;  }
.oneNav span { position: relative;}
.oneNav span::after{ width: 100%; height: 2px; display: block; content: ''; background:var(--color); transition: all .36s; transform:scale(0,1) ; position: absolute; left: 0; bottom: -10px; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; -webkit-transform:scale(0,1) ; -moz-transform:scale(0,1) ; -ms-transform:scale(0,1) ; -o-transform:scale(0,1) ; }
 
/* nav li.on .oneNav span ,nav li:hover .oneNav span { color: var(--color);} */
nav li.on .oneNav span::after,nav li:hover .oneNav span::after{ transform: scale(1,1); -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); }
nav:hover > li:not(:hover) .oneNav{ color: #333; }
nav:hover > li:not(:hover) .oneNav  span::after{ transform:scale(0,1) ;  }
nav  li dl{position: absolute;  width: 100%;top:100%;left: 0; background:#086882;   -webkit-box-shadow:0 13px 42px 11px rgba(0,0,0,.15);box-shadow:0 13px 42px 11px rgba(0,0,0,.15); 
display:flex; align-items: center; justify-content: center;

}
nav  li dl dd{white-space: nowrap;height:4em;line-height:4em;   }
 
nav  li dl dd a{ padding: 0 1vw;  color: #fff;  font-weight: normal!important; transition:all .36s ease;-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 a{color: var(--color);}
/* nav  li dl:before{content:"";position:absolute;border-width:0 9px 9px;border-style:solid;border-color:transparent transparent #f6f1e1;top:-9px;left:50%;margin-left:-9px} */
nav  li dl{ pointer-events: none; visibility:hidden; opacity:0; filter:alpha(opacity=0); transform: translateY(20px); -ms-transform: translateY(20px); -o-transform: translateY(20px); -webkit-transform: translateY(20px); -moz-transform: 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{ pointer-events: auto; visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateY(0); -ms-transform:translateY(0); -o-transform:translateY(0); -webkit-transform:translateY(0); -moz-transform:translateY(0); }
 

nav li.pro dl{ background: #e7e8eb; padding-bottom: 2vw; }

/* nav li.pro dl{  max-height: calc(100vh - 90px); overflow-y: scroll;}
nav li.pro dl::-webkit-scrollbar {width: 3px;}
nav li.pro dl::-webkit-scrollbar-thumb {border-radius: 3px; background: #d4d4d4; width: 3px; }
nav li.pro dl::-webkit-scrollbar-track {border-radius: 3px; background: #f6f6f6; width: 3px; } */

nav li.pro dl .line{ height: 1px; background: #d3d4d6;}
nav li.pro dl .items{ display: grid; grid-gap: 10px 1vw; grid-template-columns: repeat(6,1fr);}
nav li.pro dl .items .item {min-width:0; padding: 0;}
nav li.pro dl .items .item img{ height: 88px; width: 88px;}

.h_nav{ height: 60px; width: 60px;  padding: 18px  15px   ;    align-items: flex-end; display: flex;}
.h_nav .burger{ width: 100%;  height: 2px ; background: #333;  transition: .8s; display:inline-block;       }
header.scroll .h_nav .burger,header:hover .h_nav .burger{ background: #333;}
.h_nav .burger:nth-of-type(2){  width:66%;}
  /* .h_nav .burger:first-child{ animation: long 2s linear infinite; -webkit-animation: long 2s linear infinite; }

.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: #333;      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); }

.nav{  padding-bottom: 60px; width: 100%; height:  130vh ; transition:all .6s ; transform: translateX(100%);  background: #fff; position: fixed; top: 60px; right: 0; flex-direction: column; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; }
.nav.show{ transform:translateX(0) ;  -webkit-transform:translateX(0) ; -moz-transform:translateX(0) ; -ms-transform:translateX(0) ; -o-transform:translateX(0) ; }
.nav li.go-child{ border-top: 1px solid rgba(0, 0, 0, 0.15); position: relative;}
.nav li.go-child>a{ line-height: 60px; padding: 0 20px; font-size: 16px;}
.h_nav.close{align-items: center; justify-content: center;}
.erji{ width: 60px; height: 60px; position: absolute; right: 0 ; top: 0; display: flex; align-items: center; justify-content: center; font-size: 30px; z-index: 10;
 background: url(../images/jia.png) no-repeat center center; background-size: 40% auto;}
 .nav li.go-child.on .erji{ background: url(../images/jian.png) no-repeat center center; background-size: 40% auto;}
.nav-down li a{ line-height: 50px; border-top: 1px solid rgba(0, 0, 0, 0.15); display: block; padding-left: 25px; font-size: 14px; opacity: 0.8; }
.nav{   overflow-y: scroll;   }
.nav::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 1px;}
.nav::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #fff; width: 1px; }
.nav::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: #efefef; width: 1px; }

 
.lanBtn dl{ line-height: 40px; position:absolute;text-align: center;  width:100px;  top:100%;left: 50%; background:#fff;   -webkit-box-shadow:0 13px 42px 11px rgba(0,0,0,.15);box-shadow:0 13px 42px 11px rgba(0,0,0,.15); }
.lanBtn dl a{ display: block; border-bottom: 1px solid #e5e5e5;}
.lanBtn dl a:hover{ background: var(--color); color: #fff;}
.lanBtn dl{pointer-events: none;  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; }


@media screen and (min-width:900px) { 

  .lanBtn:hover dl{ pointer-events: auto;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%); }

}
@media screen and (max-width:900px) {
  .lanBtn.show dl{ pointer-events: auto;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::before{ display: block;  content: ''; width: 100%; height: 1px; position: absolute; right: 0; bottom: 0; background:rgba(255, 255, 255, 0.1) ; transition:all .5s ; -webkit-transition:all .5s ; -moz-transition:all .5s ; -ms-transition:all .5s ; -o-transition:all .5s ; }
header.scroll::before,header:hover::before{ height: 100%; background: #fff;}
header.scroll{ box-shadow: 0 0 15px rgba(0, 0, 0, .15);}
header.scroll ,header:hover {  color: #333;}
header.scroll  .icon01,header:hover .icon01{ display: none;}
header.scroll  .icon02,header:hover .icon02{ display: block;}

.searchBox{ background :  var(--color); z-index: 15; transform: translateY(-105%); transition:all .6s ; -webkit-transition:all .6s ; -moz-transition:all .6s ; -ms-transition:all .6s ; -o-transition:all .6s ; -webkit-transform: translateY(-105%); -moz-transform: translateY(-105%); -ms-transform: translateY(-105%); -o-transform: translateY(-105%); }
.searchBox .form{ width: calc(100% - 80px);}
.searchBox .keys{ width: 80%; background: url(../images/search-w.png) no-repeat left center; }
.searchBox .submit{ width: 90px; height: 40px; border: 1px solid #fff;}
.searchBox input::-webkit-input-placeholder  {color:rgba(255, 255, 255, .65);}
.searchBox input:-moz-placeholder {color:rgba(255, 255, 255, .65);;}
.searchBox input::-moz-placeholder {color:rgba(255, 255, 255, .65);;}
.searchBox input:-ms-input-placeholder  {color: rgba(255, 255, 255, .65);;}
.searchBox.show{ transform: translateY(0%); -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); }




.idxBanImg{ width: 100%; height: 100vh; min-height: 360px; object-fit: cover;}

.idxBan .text{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 10; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }

.idxAbout{ background: url(../images/idxAboutBg.jpg) no-repeat center bottom / 100% auto;}
.idxAboutLeft{ position: sticky; left: 0; top: 2vw;}
.idxTit span{ margin-left: -.7em;}
.idxTitIcon{ height: 1.5em; ;}
.line-height1-3{ line-height: 1.3;}

.numUl .Shu svg{ filter: drop-shadow(400px 0 0 var(--color)); transform: translateX(-400px); -webkit-filter: drop-shadow(400px 0 0 var(--color)); -webkit-transform: translateX(-400px); -moz-transform: translateX(-400px); -ms-transform: translateX(-400px); -o-transform: translateX(-400px); }

 

.idxProList{ width: 90%; max-width: 1400px;}
.idxProList li{ position: sticky; left: 0; top: 2vw; background: url(../images/idxProListBg.jpg) no-repeat center center / cover;}
.idxProList .img{ width: 100%; height: 0; padding-bottom: 95%;}
.idxProList li .desc{ height: 8.5em;}
.idxProLogo{ position: absolute;  right: 0; bottom: 0;}

.idxObjectImg{ width: 100%; height: 75vh; object-fit: cover;}
.idxObjectSwiper::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:rgba(0,0,0,.6); z-index: 5; }
.idxObjectText{ position: absolute; left: 50%; transform: translateX(-50%) ; top: 20%; z-index: 10; -webkit-transform: translateX(-50%) ; -moz-transform: translateX(-50%) ; -ms-transform: translateX(-50%) ; -o-transform: translateX(-50%) ; }
.idxObjectText li{ display: none; animation: rightFloat .63s; -webkit-animation: rightFloat .63s; }
.idxObjectText li.on{ display: block;}
.idxObjectText li .more::before{ transition: all .36s; display: block; content: ''; width: 100%; height: 1px; background: rgba(255, 255, 255, .25); position: absolute; left: 0; top: 0; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.idxObjectText li .more::after{ transition: all .36s; display: block; content: ''; width: 100%; height: 1px; background: rgba(255, 255, 255, .25); position: absolute; right: 0; bottom: 0;}
.idxObjectText li .more:hover::before,.idxObjectText li .more:hover::after{ width: 0;}
.idxObjectText li .more:hover .icon-add-bold:before {
  content: "\e66f";
}

.idxObjectTab { position: absolute; left: 50%; transform: translateX(-50%) ; bottom: 10%; z-index: 10; -webkit-transform: translateX(-50%) ; -moz-transform: translateX(-50%) ; -ms-transform: translateX(-50%) ; -o-transform: translateX(-50%) ; }
.idxObjectTab li{ width: 18%;}
.idxObjectTab li.on::before{ display: block; content: ''; width: 100%; height: 0; transition: all .36s; position: absolute; left: 0; bottom: 0; background: linear-gradient(to bottom,transparent,rgba(14,173,216,.3)); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.idxObjectTab li.on::before{ height: 60%;}


.newItem .img{ width: 100%; padding-bottom: 70%; height: 0;}
.newItem .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;
  }
.newItem:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}
.newItem:hover .more{ background: var(--color); color: #fff; padding-left: 15px; padding-right: 15px;}
.newItem:hover .img{ box-shadow: 0 0 15px rgba(0,0,0,0.15);}
.idxNews .pagination{ height: 4px;    position: relative;background-color: #eef2f9;}
.linka a:hover{ color: var(--color);}
.mySwiperBtn{ border-style: dashed;}
.mySwiperBtn:hover{ background: var(--color); color: #fff; border-style: solid; border-color: var(--color);}

footer{ background: url(../images/footBg.jpg) no-repeat center center / cover;}
footer a:hover{ color: rgba(255, 255, 255, .8);}
footer a:hover img{ opacity: .8;}
.w38{ width: 38%;}
.ewmBox{ width: 100px;}
.outLink a + a{ margin-left: 1vw;}

.foottopLine{ background: rgba(255, 255, 255, .1);  width: 1px;}

.neiBanImg{ width: 100%; max-height: 100vh; min-height: 260px; object-fit: cover;}
.neiBan .text{ position: absolute; left: 50%; top: 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%); }
.neiBan .desc{ position: absolute; left: 50%; transform:translateX(-50%) ; bottom: 7%; -webkit-transform:translateX(-50%) ; -moz-transform:translateX(-50%) ; -ms-transform:translateX(-50%) ; -o-transform:translateX(-50%) ; }

.birefBtn{ position: absolute;right: 10%; bottom:35%; width: 4.2%;}
.birefBtn .pic{ background:linear-gradient(to right,#00defd,#00b4e2);  }
.birefBtn .pic::before{ display: block; content: ''; width: 86%; height: 86%; top: 7%; left: 7%; position: absolute; border: 1px solid #fff; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.birefBtn .pic::after{animation: yuan 10s infinite linear;-webkit-animation: yuan 10s infinite linear; display: block; content: ''; width:134%; height: 134%; top: -17%; left: -17%; position: absolute; background: url(../images/watchthevidedo.png) no-repeat center center / 100% 100%;}

#biref,#Global,#History,#Awards,#Culture,#ability{ scroll-margin-top: 100px;}

.GlobalLine{background:linear-gradient(to right,#00b4e2,#00defd); height: 3px;}
.GlobalUl{ display: grid; grid-gap:  1.5vw ; grid-template-columns: repeat(4,1fr);}
.GlobalUl li{aspect-ratio: 1 / 1;}

.tuoziList{display: grid; grid-gap:  1.5vw ; grid-template-columns: repeat(1,1fr);}
.tuoziList li{ overflow: hidden;}
.tuoziList li:hover{ background: #fff; box-shadow: 0 0 18px rgba(0,0,0,.08); transform: translateY(-4px); -webkit-transform: translateY(-4px); -moz-transform: translateY(-4px); -ms-transform: translateY(-4px); -o-transform: translateY(-4px);}
.tuoziList li:hover .touziThumb img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05);}
.tuoziList li:hover .touziText h2{ color: var(--color);}
.touziItem{ padding: 30px;}
.touziThumb{ width: 32%; min-height: 190px; background: #fff; overflow: hidden; border: 1px solid #eee;}
.touziThumb img{ max-width: 82%; max-height: 82%; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s;}
.touziText{ width: 64%;}
.touziDesc{ max-height: 180px; overflow-y: auto; padding-right: 15px;}
.touziDesc img{ max-width: 100%; height: auto;}
.touziDesc::-webkit-scrollbar {width: 3px;}
.touziDesc::-webkit-scrollbar-thumb {background: var(--color); width: 3px;}
.touziDesc::-webkit-scrollbar-track {background: #f6f6f6; width: 3px;}

 .bg-f7{ background: #f7f8fc;}
.yjSwiper .swiper-slide{ height: auto;}
.yjSwiper .swiper-slide::after{ display: block; content: ''; width: 99%; height: 82%; position: absolute; left: 0; bottom: 0; border: 1px solid var(--color); }

 .ssSwiper  .swiper-slide { height: auto;}
 .ssSwiper  .swiper-slide .img{ aspect-ratio: 1 / .6;}
    .jobSs .pagination{ position: absolute; bottom: 2vw; left: 0; z-index: 10;}
    .jobSs .pagination .swiper-pagination-bullet{ background: #fff; opacity: .6;}
    .jobSs .pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ opacity: 1; }

  /* 中间文字样式 */
.css-ring {width: 100%;height: 100%;border-radius: 50%;background: conic-gradient(#2ba9e0 0% 0%, #f2f2f2 0% 100%);position: relative;display: flex;justify-content: center;align-items: center;}
/* 内部白色遮罩，形成环形 */
.css-ring::before {content: "";position: absolute;width:66%; /* 调整此值改变环的粗细 */height:  66%;background-color: #ffffff; /* 假设页面背景为白色，或者透明 */border-radius: 50%;}
.css-ring .text {position: relative;z-index: 1; ;}
.css-ring .percent{ display: none; position: absolute; left: 10%; top: 12%; z-index: 2; color: var(--color); font-family: Arial, sans-serif; font-size: 13px; font-weight: 700; line-height: 1; pointer-events: none;}

      
.Global .img{  position: absolute; left: 28%; top: 5%; }
.globalMapLines{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; overflow: visible;}
.global-line{ fill: none; stroke-width: .18; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: 0;}
.Global.is-animated .global-line{ animation: globalLineShoot 2.8s ease-out infinite;}
.Global.is-animated .global-line:nth-child(2){ animation-delay: .35s;}
.Global.is-animated .global-line:nth-child(3){ animation-delay: .7s;}
.Global.is-animated .global-line:nth-child(4){ animation-delay: 1.05s;}
.mapImgUl{ position: static; margin: 0; padding: 0; list-style: none;}
.mapImgUl li{ width: 1.2%;aspect-ratio: 1 / 1; position: absolute; z-index: 3;}
.mapImgUl li:after,.mapImgUl li:before{content:""; position:absolute; border-radius:50%; top:50%; left:50%; z-index:1;}
.mapImgUl li .dot_circle{display:block; width:100%; height:100%;  position:relative; z-index:3; border-radius:50%;}
.mapImgUl li:before {width:130%; height:130%; background:transparent; background:rgba(14,173,216,0.3); margin-top:-75%; margin-left:-75%; -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;}
.mapImgUl li:after {width:200%; height:200%;background:transparent; /*background:#7e9ec3;*/ background:rgba(14,173,216,0.2); margin-left:-100%; margin-top:-100%; -webkit-animation:warn 2s linear 0s infinite; -moz-animation:warn 2s linear 0s infinite; animation:warn 2s linear 0s infinite; opacity:0;}
/* .idxGlobalUl li:nth-child(1) .dot_circle{background-color: #f00404;}
.idxGlobalUl li:nth-child(1)::before{ background:rgba(240,4,4,0.3);}
.idxGlobalUl li:nth-child(1)::after{background:rgba(240,4,4,0.2);} */

.mapImgUl li:nth-child(1){ top: 23.2%;left:15.1%;}/* north america*/
.mapImgUl li:nth-child(2){ top:28.5%;left: 53.4%;}/*EUROPE */
.mapImgUl li:nth-child(3){ top:37.1%;left: 84.2%;}/*KOREA */
.mapImgUl li:nth-child(4){ top:  35.8%;left: 87.8%;}/*japan */
.mapImgUl li:nth-child(5){ top:  38.2%;left: 79.4%;}/*CHINA */
.mapImgUl li:nth-child(5)::before{ background: rgba(255, 255, 255, .3);}
.mapImgUl li:nth-child(5)::after{ background: rgba(255, 255, 255, .2);}

@keyframes globalLineShoot{
  0%{ stroke-dashoffset: 1; opacity: 0;}
  12%{ opacity: .95;}
  58%{ stroke-dashoffset: 0; opacity: .95;}
  78%{ stroke-dashoffset: 0; opacity: 0;}
  100%{ stroke-dashoffset: 1; opacity: 0;}
}

.History{ background: url(../images/HistoryBg.jpg) no-repeat center center / cover; background-attachment: fixed;}
.historySwiper .swiper-slide{ height: auto; cursor: pointer;}
.historySwiper .swiper-slide .desc{ height: 10em;}
.historyLineWrap{ position: relative; display: block; width: 94%; overflow: visible; line-height: 0;}
.historySwiperLine{  width: 100%; display: block; opacity: 1; transition: opacity .3s ease;}
.historyLineWrap::after{ content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 100%; background: url(../images/historySwiperLine-h.png) no-repeat center center / 100% 100%; opacity: 0; transform: translateY(-50%) scaleX(.62) scaleY(1); transform-origin: left center; transition: opacity .45s ease, transform .45s ease; pointer-events: none;}
.historySwiper .swiper-slide-active .historySwiperLine{ opacity: 0;}
.historySwiper .swiper-slide-active .historyLineWrap::after{ opacity: 1; transform: translateY(-50%) scaleX(1.02) scaleY(1.28);}
.historySwiper .swiper-slide-active .desc,.historySwiper .swiper-slide-active .Shu{ opacity: 1;}
.History button:hover{ background: var(--color); color: #fff; box-shadow: 0 0 15px rgba(255, 255, 255, .2);}

.AwardsSwiper{ height: 650px;}
.AwardsSwiper .swiper-slide .img{ width: 100%; aspect-ratio: 1 / .68;}
.AwardsSwiper .swiper-slide{ background: #f7f8fc; height: calc((100% - 40px)/2);}
 .myPagination .swiper-pagination-bullet{  margin: 0 6px;}
.Culture{ background: url(../images/CultureBg.jpg) no-repeat center center / cover; background-attachment: fixed;}
.cultureUl li{ padding:7.2vw 0 6.7vw 0; flex: 1;}

.cultureUl li .top::after{ display: block; content: ''; width: 3px; height: 2vw; position: absolute; left: 0;  bottom: calc(100% + 20px); min-height: 32px; max-height: 45px; background:#fff }
.cultureUl li .top .tit{ width: 2em;}
.cultureUl li button{   width: 3vw; height: 3vw; min-width: 40px; min-height: 40px; background: url(../images/culTureIcon+.png) no-repeat center center / 100% 100%;}
.cultureUl li .bottom{ margin-top: 15vw;}
.cultureUl li:nth-child(2) .top .tit{ width: 3em;}
.cultureUl li::after{ display: block; content: ''; width:0; opacity: 1; transition: all .36s; height: 100%; position: absolute; left: 0; top: 0; background:linear-gradient(to bottom,rgba(14,173,216,.9),rgba(14,173,216,.32)); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.cultureUl li.on::after{ width: 100%; opacity: 1;}
.cultureUl li.on .top{ transform: translateY(-2vw); -webkit-transform: translateY(-2vw); -moz-transform: translateY(-2vw); -ms-transform: translateY(-2vw); -o-transform: translateY(-2vw); }
.cultureUl li.on .bottom{ transform: translateY(2vw); -webkit-transform: translateY(2vw); -moz-transform: translateY(2vw); -ms-transform: translateY(2vw); -o-transform: translateY(2vw); }

.cultureLeftUl li{ display: none; animation: rightFloat .3s; -webkit-animation: rightFloat .3s; }
.cultureLeftUl li.on{ display: block;}

.ability button{ position: absolute; z-index: 10; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.ability button.prev{ left: 0;}
.ability button.next{ right: 0;}
.ability button:hover{ background: var(--color); color: #fff;}
.abilitySwiper .swiper-slide{ height: auto;}
.abilitySwiper .swiper-slide .img{aspect-ratio: 1 / .55;}
.abilityUl li.on{ border-color: var(--color);}



.proLeft{  width: 23%;}
.proLeft .proclassName{background:linear-gradient(to bottom,#0578c0,#2aa7df);}
.proRight{ width: 72%;}
.proClass{ position: sticky; top: 0; left: 0; width: 100%;}
.proClass li.on{ color: var(--color);}
.proClass li:last-child{ border-bottom: none;}
.proclassName.on .iconfont{ transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); }

.prolist{ display: grid; grid-gap: 1.5vw; grid-template-columns: repeat(3,1fr);}
.prolist li{ border-top-right-radius: 0; border-bottom-left-radius: 0;}
.prolist li .img{ width: 100%; aspect-ratio: 1 / .8;}
.prolist li::after{ display: block; content: ''; transition: all .36s; width: 100%; height:0; opacity: 0; position: absolute; left: 0; top: 0; background:linear-gradient(to bottom,#0578c0,#2aa7df); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.prolist li:hover::after{ height: 100%; opacity: 1;}
.prolist li:hover{ color: #fff; box-shadow: 0 0 15px rgba(14,173,216,.15); transform: translateY(-.5vw); -webkit-transform: translateY(-.5vw); -moz-transform: translateY(-.5vw); -ms-transform: translateY(-.5vw); -o-transform: translateY(-.5vw); }
.prolist li:hover .icon{filter: grayscale(100%) brightness(500%);}

.proDetial{ background: url(../images/proDetailBg.jpg) no-repeat center center / cover;}
.proDetial .button:hover{ background: #0d92ba;}
.proDetialRight .img{ aspect-ratio: 1 / .8;}

.proDetialCon{ height: 90vh;}
.proDetialCon .infoImg table{ width: 100%;  box-shadow: 0  0 15px rgba(0, 0, 0, .1);  }
.proDetialCon .infoImg table td{ padding: 1em; text-align: center; border-bottom: 1px solid #e5e5e5; line-height: 2;}
.proDetialCon .infoImg table tbody tr:first-child  { background:linear-gradient(to right,#066bf0,#3bd8f6);  font-size:1.3em ; height: 4em;  line-height: 4em; }
.proDetialCon .infoImg table tbody tr:first-child td{color: #fff; }
.proDetialCon .infoImg table tbody tr td:first-child{ background: #f2f2f2;}
.proDetialCon .infoImg table tbody tr:first-child td:first-child{background: #cce1fe; color: #333;}
.proDetialCon .infoImg table tbody tr:last-child td { border-bottom: none !important;}

.proDetialConchicun::after{ display: block; content: ''; min-height: 20vw; max-height: 240px; width: 100%; height:16%; position: absolute; left: 0; top: 0; background:var(--color) }
.proDetialConchicunUl{ display: grid; grid-gap:3vw; grid-template-columns: repeat(3,1fr);}

.proDetailYs{ background: url(../images/proDetailYsBg.jpg) no-repeat center center / cover; background-attachment: fixed;}
  .proDetailYs::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: url(../images/proDetailYsBgTop.png) no-repeat center center / cover }
     .proDetailYs li .font120{  transform: translateX(1vw); }
 .proDetailYs li::after{ display: block; content: ''; width: 2px; height:100%; position: absolute; left: 0; top: 0; background:var(--color); opacity: .5; }
  
  
/*.proDetailYs li{ padding: 8vw 0 9vw 0;}*/
/*.proDetailYs li::after{ display: block; content: ''; width:2px; height: 100%; position: absolute; right: 0; top: 0; background:linear-gradient(to top,var(--color),#2ba9e0); opacity: .6; }*/
/*.f10{ font-size: 10px;}*/
/*.proDetailYs li .f10{ position: absolute; left: 50%; transform: translateX(-50%) ; bottom: 5%; -webkit-transform: translateX(-50%) ; -moz-transform: translateX(-50%) ; -ms-transform: translateX(-50%) ; -o-transform: translateX(-50%) ; }*/
/*.proDetailYs li .float{ background: url(../images/proDetailYsBg01.png) no-repeat center center / 100% 100%; height: 0; opacity: 0; }*/
/*.proDetailYs li:hover .hover{ opacity: 0;}*/
/*.proDetailYs li:hover .float{ height: 100%; opacity: 1;}*/

.Comments{ background:url(../images/CommentsBg.jpg) no-repeat center center / cover;}

.bg-jian{background:linear-gradient(to right,#066bf0,#3bd8f6);}

.proDetialConPop{ width: 100%; height: 100%; position: absolute; z-index: 20; left: 0; top: 0; background: url(../images/proDetialConPopBg.png) no-repeat center center / 100% 100%;    backdrop-filter: blur(5px); }

.pop{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 100; display: none;}
.pop .bg{background: rgba(0, 0, 0, .8); backdrop-filter: blur(5px);}
.pop .con{ position: absolute; left: 50%; top: 50%; z-index: 10; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.infoFormPop .con{ max-width: 670px; width: 90%;}
.infoFormPop .con .line{ width: 2em; height: 3px;}
.infoFormPopTip{ position: absolute;  right: 0; top: -10%;}

.Rigor{ background: url(../images/RigorBg.jpg) no-repeat center center / cover;}
.w42{ width: 42%;}
.Rigor .subTit{ background: url(../images/RigorsubBg.png) no-repeat center center / 100% 100%;}
.Quality{ background: url(../images/QualityBg.jpg) no-repeat center center / cover;}

.QualityUl li .round{ width: 8.3vw; height: 8.3vw; background: url(../images/QualityRound.png) no-repeat center center / 100% 100%}
.QualityUl  .line{ height: 8.3vw;}

.commitment{ background: url(../images/commitmentBg.jpg) no-repeat bottom center / cover;}
.commitmentUl li{ background:linear-gradient(130deg,rgba(255,255,255,.25),transparent);}

.QualityUl .line img{ width: 3vw; min-width: 22px; max-width:60px ;}

.newslist li .icon { width: 13%;}

.newslistIcon{ transition: all 0s; -webkit-transition: all 0s; -moz-transition: all 0s; -ms-transition: all 0s; -o-transition: all 0s; }
.newslist li .right{ width:87% ;}
.newslist li .right .img{ aspect-ratio: 1 / .6;}
.newslist li .right .desc{ height: 4em;}
.newslist li:hover{ background: #fff;}
.newslist li:hover .icon{color: #fff; background: url(../images/newslistBg.jpg) no-repeat center center / cover;}
.newslist li:hover .icon .newslistIcon{ filter: grayscale(100%) brightness(500%); -webkit-filter: grayscale(100%) brightness(500%); }

.neiBanDetail{ width: 100%; height: 40vh;}
.newsPage .line-clamp{ max-width: 68%;}

.detailNewlist{display: grid; grid-gap:3vw; grid-template-columns: repeat(3,1fr);}
.detailNewlist li  .img{ aspect-ratio: 1 / .6;}
.detailNewlist li  .iconfont{ transform: scale(.75); -webkit-transform: scale(.75); -moz-transform: scale(.75); -ms-transform: scale(.75); -o-transform: scale(.75); }
.detailNewlist li   .more{   padding: 2px 0;}
.detailNewlist li:hover  .more{ background: var(--color); color: #fff; padding: 2px 15px;}

.contactType .item .tit .font100{ position: absolute; top: 50%; transform: translateY(-50%); left: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.contactType .item:hover{ box-shadow: 0 0 15px rgba(0, 0, 0, .1);}
.mapBox{ height: 33vw; max-height: 650px; min-height: 300px;}

.joblist li{ border-bottom: 1px #333 dashed;}
.joblist li .top .close{ display: none;}
.joblist li .bottom {  display: none;}
.joblist li.on .close{ display: block;}
.joblist li.on .open{ display: none;}

.joblist li.on .icon-xiajiantou{ transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); }
 
 
.idxCustomerUl li{
  animation: warn 8s infinite alternate;
  transition: all .33s;
  overflow: hidden;
  box-shadow: 0 0 15px rgba(0,0,0,.05);
  width: 8.8vw;
  aspect-ratio: 1;
  position: absolute;
  -webkit-transition: all .33s;
  -moz-transition: all .33s;
  -ms-transition: all .33s;
  -o-transition: all .33s;
  -webkit-animation: warn 8s infinite alternate;
}
.idxCustomerUl li img{ max-width: 90%; max-height: 90%;}
/* .idxCustomerUl li:nth-child(n+9){ transform:scale(.86) ; -webkit-transform:scale(.86) ; -moz-transform:scale(.86) ; -ms-transform:scale(.86) ; -o-transform:scale(.86) ; }
.idxCustomer .title{background: -webkit-linear-gradient(left, #228a55, #10bd65);-webkit-background-clip: text; -webkit-text-fill-color: transparent;}
 */

.idxCustomerUl li:nth-child(1){top: 12% ; left:3.8% ;}
.idxCustomerUl li:nth-child(2){ top: 35.8% ; left:1.23% ;   }
.idxCustomerUl li:nth-child(3){ top: 14.3% ; left:17% ; animation: warn 67ss infinite alternate; -webkit-animation: warn 67ss infinite alternate; }
.idxCustomerUl li:nth-child(4){ top:31% ; left:16.5% ; animation: warn 5s infinite alternate; -webkit-animation: warn 5s infinite alternate; }
.idxCustomerUl li:nth-child(5){ top: 45.2%; left: 9.5%; animation: warn 5s infinite alternate; -webkit-animation: warn 5s infinite alternate; }
.idxCustomerUl li:nth-child(6){ top:69.2% ; left: 7.5%; animation: warn 5s infinite alternate; -webkit-animation: warn 5s infinite alternate; }
.idxCustomerUl li:nth-child(7){ top:65% ; left: 19%; animation: warn 7s infinite alternate; -webkit-animation: warn 7s infinite alternate; }
.idxCustomerUl li:nth-child(8){ top:60% ; left: 29%; animation: warn 6s infinite alternate; -webkit-animation: warn 6s infinite alternate; }
.idxCustomerUl li:nth-child(9){ top: 42% ; left:89.2%; animation: warn 6s infinite alternate; -webkit-animation: warn 6s infinite alternate; }
.idxCustomerUl li:nth-child(10){ top:45.2% ; left: 22%; animation: warn 7s infinite alternate; -webkit-animation: warn 7s infinite alternate; }
.idxCustomerUl li:nth-child(11){ top: 22.8%  ; left:28.3% ; animation: warn 6s infinite alternate; -webkit-animation: warn 6s infinite alternate; }
.idxCustomerUl li:nth-child(12){ top: 21% ; left:67% ; animation: warn 5s infinite alternate; -webkit-animation: warn 5s infinite alternate; }
.idxCustomerUl li:nth-child(13){ top: 45% ; left: 64%; animation: warn 7s infinite alternate; -webkit-animation: warn 7s infinite alternate; }
.idxCustomerUl li:nth-child(14){ top: 62% ; left:72% ; animation: warn 6s infinite alternate; -webkit-animation: warn 6s infinite alternate; }
.idxCustomerUl li:nth-child(15){ top: 38%; left:72.2% ; animation: warn 8s infinite alternate; -webkit-animation: warn 8s infinite alternate; }
.idxCustomerUl li:nth-child(16){ top: 12% ; left: 76%; animation: warn 7s infinite alternate; -webkit-animation: warn 7s infinite alternate; }
.idxCustomerUl li:nth-child(17){ top: 27% ; left: 83% ; animation: warn8s infinite alternate; -webkit-animation: warn8s infinite alternate; }
.idxCustomerUl li:nth-child(18){ top:  10%; left:86.5% ; animation: warn 5s infinite alternate; -webkit-animation: warn 5s infinite alternate; }
.idxCustomerUl li:nth-child(19){ top: 70% ; left: 86.2%; animation: warn 5s infinite alternate; -webkit-animation: warn 5s infinite alternate; }
.idxCustomerUl li:nth-child(20){ top: 50% ; left: 80.1% ; animation: warn 7s infinite alternate; -webkit-animation: warn 7s infinite alternate; }

/* .idxCustomerUl li:hover{ transform: scale(.9); box-shadow: 0 0 15px rgba(14,173,216,.15); -webkit-transform: scale(.9); -moz-transform: scale(.9); -ms-transform: scale(.9); -o-transform: scale(.9); } */
/* .idxCustomer{ background-image: linear-gradient(to top,#dfedfd,#fff);} */
.idxCustomer .con{ position: absolute; left: 50%; top: 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%); }



.ewmImg{ width: 8vw; max-width: 140px; min-width: 90px;}
.page-right{ position: fixed; right: 1rem; top: 50%; z-index: 200; filter: drop-shadow(0 0 5px rgba(0,0,0,0.15)); -webkit-filter: drop-shadow(0 0 5px rgba(0,0,0,0.15)); }
.page-right li .rightIcon{ height:28%;}
.page-right li .icon .icon02{ display: none;}
.page-right li:hover .icon  { background: var(--color); color: #fff;}
.page-right li:hover .icon .icon02{ display: block;}
.page-right li:hover .icon .icon01{ display: none;}
.page-right li .float{ display: none; min-height: 100%; animation: rightBody.3s; position: absolute; right: calc(100% + 5px); top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-animation: rightBody.3s; }
.page-right li:hover .float{ display: flex;}
.page-right li.btn-top{   transform: translateX(2vw); opacity: 0; -webkit-transform: translateX(2vw); -moz-transform: translateX(2vw); -ms-transform: translateX(2vw); -o-transform: translateX(2vw); }
.page-right li.btn-top.show{ transform: translateX(0); opacity: 1; -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); }



.industryList li:first-child{ margin-top: 0;}
.w90{ width: 90%;}

.industryList li .text{ position: absolute; background: rgba(255, 255, 255, .65); top: 50%; transform: translateY(-50%); right: 0; z-index: 5; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.industryList li .text .line{ width: 2em; height: 3px;}
.industryList li:hover .text .line{ width: 5em;}
.industryList li:nth-child(2n) a{ flex-direction: row-reverse;}
.industryList li:nth-child(2n) .text{ right: auto; left: 0;}

.solutionsOne{ background: url(../images/solutionsOneBg.jpg) no-repeat center center / cover;}
.w56{ width: 56%;}
.solutionsOneRight .round{ width: 60%;aspect-ratio: 1/1;  position: absolute;top:23.5%; right:12%;}

.solutionsTwo{ margin-top: -7vw;}
.solutionsTwo .inner{ background: url(../images/solutionsTwoBg.jpg) no-repeat center center / cover;}
.solutionsTwo .inner .img{aspect-ratio: 1/.6;}
.solutionsTwo .inner .line{ width: 2.6em; height: 5px;}

.journeyOne::after{ display: block; content: ''; width: 100%; height: 20%; position: absolute; left: 0; bottom:  0; background:var(--color) }
.journeyTwoUl{ display: grid; grid-gap: 3vw; grid-template-columns: repeat(2,1fr);}

.journeyThere{ background: url(../images/journeyThereBg.jpg) no-repeat center center / cover;}
.journeyFourUl{ display: grid; grid-gap: 1.5vw; grid-template-columns: repeat(4,1fr);}
.journeyFourUl li {background:linear-gradient(to bottom,#f0f5fc,transparent); border-width: 3px;}
.journeyFourUl li .img{ margin-top: -.5em;}
.journeyFourUl li:hover{ transform: translateY(-1vw); -webkit-transform: translateY(-1vw); -moz-transform: translateY(-1vw); -ms-transform: translateY(-1vw); -o-transform: translateY(-1vw); }
