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;}

.zwHeader{ height: 100px;}
.zw{ margin-top: -100px; padding-top: 100px;}

.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; left: 0; width: 100%; z-index: 100; color: #fff; transition: all .2s; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; }
header .con{ padding: 0 5vw;}
header .con .icon02{ display: none;}
 
.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%); }


.oneNav{ line-height:100px; white-space: nowrap; display: block; padding: 0  1.3vw; font-size: 18px;  }
.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{ position: relative;}
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;text-align: center;min-width:150px; width: auto;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); border-bottom-left-radius:5px;border-bottom-right-radius:5px;}
nav  li dl dd{white-space: nowrap;height:50px;line-height:50px;border-bottom:1px solid #eee;transition:all .36s ease;-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{ padding: 0 20px;  font-size:14px; color:#333!important; 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{background:var(--color)}
nav  li dl dd:hover a{color:#fff!important;}
/* 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: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{ 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;}


.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:hover,.searBtn:hover{ color: var(--color);}
/* .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; }
.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%); }

 */
.idxBanImg{ width: 100%;  height: 100vh; object-fit: cover; min-height: 360px;}
.banLeft,.banRight{ position: absolute; z-index: 10;top: 0;}
.banLeft{ left: 0;  width: 4vw;}
.banRight{ right: 0; width: 29vw;}
.idxBan::after{ display: block; content: ''; width: 100%; height: 10vw; position: absolute; left: 0; top: 0; background:linear-gradient(to bottom,rgba(0,0,0,.5),transparent); z-index: 10; }
.idxBan .swiper-slide::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2;} 

/*.idxBan .swiper-slide::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; background:rgba(0,0,0,.25);} */


.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%); }
.idxBan .text .text-miao{  -webkit-text-stroke: 1px rgba(255,255,255,.25);text-stroke: 1px rgba(255,255,255,.25);color: transparent;}
 .ScroolBox{ position: absolute; width: 2.5vw; left: 50%; z-index: 25; transform: translateX(-50%) ; bottom: 6%; -webkit-transform: translateX(-50%) ; -moz-transform: translateX(-50%) ; -ms-transform: translateX(-50%) ; -o-transform: translateX(-50%) ; }
.ScroolIcon{ animation: ani-svg 1s linear 0s alternate infinite; -webkit-animation: ani-svg 1s linear 0s alternate infinite; }
.idxBan .button{ position: absolute; right: 5vw; bottom: 6%; z-index: 20;}
.idxBan .button div{ background: rgba(255,255,255,.3);}.idxBan .button div:hover{ background: #fff;}


.idxAbout{ padding-bottom: 24vw;}
.idxAboutImg{ position: absolute; left: 0; bottom: 0;}

.idxTit h2{-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;background-image: linear-gradient(to bottom, rgba(0,0,0,.2), rgba(0,0,0,.01));}
.idxTit h1{ margin-top: -.4em;}

.idxMore{ padding: 5px;}
.idxMore::after{ display: block; content: ''; position: absolute; width: 50px; height: 50px; border-radius: 40px; top: 5px; right: 5px; background: #fff; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; -webkit-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; }
.idxMore .round{ width: 50px; height: 50px;}
.idxMore:hover{ color: var(--color); box-shadow: 0 0 15px rgba(0, 0, 0, .1);}
.idxMore:hover::after{ width: 100%; right: 0; top: 0; height: 100%;}

.idxMorew::after{ background: var(--color);}
.idxMorew:hover{ color: #fff;}

.numUl .Shu i{ position: absolute; left: calc(100% + 15px); top: 0; font-size: .5em;}
.numUl li:nth-child(-n+2){ margin-top: 0;}

 
.idxAboutPlay{ width: 7.3vw; height: 7.3vw; min-height: 50px; min-width: 50px; box-shadow: 0 0 rgba(40,60,145, 0.1),0 0 0 15px rgba(40,60,145, 0.1),0 0 0 30px rgba(40,60,145, 0.1); animation-play-state: running;animation: ripple-wave 1s linear infinite; -webkit-animation: ripple-wave 1s linear infinite; }
.idxAboutPlay::after{ display: block; content: ''; animation: xunzhuan infinite 15s linear; width: 80%; height: 80%; position: absolute; left: 10%; top: 10%; background: url(../images/Brandvideo.png) no-repeat center center / 100% 100%; -webkit-animation: xunzhuan infinite 15s linear; }
.idxIndex{ margin-top: -5vw; background: url(../images/idxIndexBg.png) no-repeat center top  / 100% auto;}
.inlogo{ display: block; overflow: hidden;  }
.inlogo .la{ overflow: visible;white-space: nowrap; height: 100px;    margin-bottom: 20px;position: relative;}
.inlogo .la dl{ -webkit-animation: kf-client-wall-1 50s linear 0s infinite forwards; -moz-animation: kf-client-wall-1 50s linear 0s infinite forwards; -ms-animation: kf-client-wall-1 50s linear 0s infinite forwards; -o-animation: kf-client-wall-1 50s linear 0s infinite forwards; animation: kf-client-wall-1 50s linear 0s infinite forwards;    position: absolute; top:0; left:0; height: 100%;}
.inlogo .la dl dd{ position: relative; height: 100%; margin: 0 5px; overflow: hidden; border-radius: 6px; display: inline-block;}
.inlogo .la dl dd img{ display: block;width: auto;height: 100%;}
@keyframes kf-client-wall-1 { 0% { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } 100% { -webkit-transform: translate(-33.333%, 0); -moz-transform: translate(-33.333%, 0); -ms-transform: translate(-33.333%, 0); -o-transform: translate(-33.333%, 0); transform: translate(-33.333%, 0); } }
.inlogo .gd2 dl{    -webkit-animation: kf-client-wall-2 50s linear 0s infinite forwards; -moz-animation: kf-client-wall-2 50s linear 0s infinite forwards; -ms-animation: kf-client-wall-2 50s linear 0s infinite forwards; -o-animation: kf-client-wall-2 50s linear 0s infinite forwards; animation: kf-client-wall-2 50s linear 0s infinite forwards; position: absolute; top:0; left:0; height: 100%;}
@keyframes kf-client-wall-2 { 0% { -webkit-transform: translate(-33.333%, 0); -moz-transform: translate(-33.333%, 0); -ms-transform: translate(-33.333%, 0); -o-transform: translate(-33.333%, 0); transform: translate(-33.333%, 0); } 100% { -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } }

.idxPro{ background: url(../images/idxProBg.png) no-repeat center top / cover;}
.idxProTab li.on{ background: var(--color); color: #fff;}
.idxPro .slide-c .img{ width: 100%; height: 0; padding-bottom: 110%;}
.idxPro .slide-c .img .more{ position: absolute; bottom: 8%; left: 50%; z-index: 10; transform: translateX(-50%) translateY(-2vw); -webkit-transform: translateX(-50%) translateY(-2vw); -moz-transform: translateX(-50%) translateY(-2vw); -ms-transform: translateX(-50%) translateY(-2vw); -o-transform: translateX(-50%) translateY(-2vw); } 

@media screen and (min-width:900px) { 
        .idxPro .slide-c li:hover .bigImg{ width: 100%; height:90% ; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }

        .idxPro .slide-c li:hover  .more{ opacity: 1; transform: translateX(-50%) translateY(0); -webkit-transform: translateX(-50%) translateY(0); -moz-transform: translateX(-50%) translateY(0); -ms-transform: translateX(-50%) translateY(0); -o-transform: translateX(-50%) translateY(0); }

}


.honorRight .button .btn,.honorRight .button .btn .border-right { border-color: var(--color);}
 
.honorRight   .button .btn div{  width:98px ;}
.honorRight   .button .btn div:hover{ background: var(--color); color: #fff;} 
.honorRight   .button .pagination{ position: relative; left: auto; top: auto; width: 320px; height: 3px; background: #d6d6d6}

.idxPro .button .btn,.idxPro .button .btn .border-right { border-color: var(--color);}
 
.idxPro   .button .btn div{  width:98px ;}
.idxPro   .button .btn div:hover{ background: var(--color); color: #fff;}

.idxPro .button .btn div:hover img,.honorRight .button .btn div:hover img{ filter: grayscale(100%) brightness(500%); -webkit-filter: grayscale(100%) brightness(500%); }

.radius45{ border-radius: 48px; -webkit-border-radius: 48px; -moz-border-radius: 48px; -ms-border-radius: 48px; -o-border-radius: 48px; }
.idxPro   .button .pagination{ position: relative; left: auto; top: auto; width: 320px; height: 3px; background: #d6d6d6}

.idxVideoCon{ height: 100vh;}
.idxVideoCon{-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;-webkit-mask-position:center center;
        position:sticky;top:0;width:100%;height:100vh;z-index:10;}
.about_video_ht{width:100%;height:150vh;}
/* .videoBox{ height: 100vh; } */
.about_video_ht {width: 100%;height: 150vh;}
.idxVideoTit{ position: absolute; left: 0; z-index: 5; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }

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

.idxYsTab li.on{ background: var(--color); color: #fff;}
.idxYs .slide-ys .img{ width: 100%; height: 0; padding-bottom:65.8%;}
.idxYs .slide-ys .img .more{ position: absolute; right: 0; bottom: 0; z-index: 10; width: 5em; height: 5em;}
.idxYs .slide-ys .img .more::after{ display: block; content: ''; transform: scale(.2); border-radius: 50%; opacity: 0; transition: all .36s; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:var(--color) ; -webkit-transform: scale(.2); -moz-transform: scale(.2); -ms-transform: scale(.2); -o-transform: scale(.2); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.idxYs .slide-ys .img:hover .more::after{ transform: scale(1.2); opacity: 1; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); }
.idxYs .slide-ys .img:hover .more{ color: #fff;}
.idxYs .button .btn,.idxYs .button .btn .border-right { border-color: var(--color);}
.idxYs .button .btn div{  width:98px ;}
.idxYs .button .btn div:hover{ background: var(--color); color: #fff;} 
.idxYs .button .btn div:hover img{ filter: grayscale(100%) brightness(500%); -webkit-filter: grayscale(100%) brightness(500%); }
.idxYs .button .pagination{ position: relative; left: auto; top: auto; width: 320px; height: 3px; background: #d6d6d6}

.zwMessage{ height: 11.5vw;}
.idxMessage { margin-top: -11.4vw;}
.idxMessage .inner{ border-radius: 50px  ; -webkit-border-radius: 50px  ; -moz-border-radius: 50px  ; -ms-border-radius: 50px  ; -o-border-radius: 50px  ; }
.idxMessage::after{ display: block; content: ''; width: 100%; height: calc(100% - 11.4vw); border-top: 10px solid #283c91; position: absolute; left: 0; bottom: 0; background: #1b1a1a; }
.idxMessage input::-webkit-input-placeholder,.idxMessage  textarea::-webkit-input-placeholder {color:rgba(255,255,255,.75);}
.idxMessage input:-moz-placeholder,.idxMessage  textarea:-moz-placeholder {color:rgba(255,255,255,.75);}
.idxMessage input::-moz-placeholder,.idxMessage  textarea::-moz-placeholder {color:rgba(255,255,255,.75);}
.idxMessage input:-ms-input-placeholder,.idxMessage  textarea:-ms-input-placeholder {color: rgba(255,255,255,.75);}

.idxFoot{ background: #1b1a1a; color: #fff;}
.footNav dt::after{display: block; content: ''; width: 100%; height: 50%; position: absolute; left: 0; bottom: 0; background:var(--color)}
.footNav dd{ color: rgba(255, 255, 255, .4);}
.idxFoot a:hover{ color :rgba(255, 255, 255, .85);}

.ewmBox .img{ background: url(../images/ewmBg.png) no-repeat center center / 100% 100%; width: 6.8vw; padding: 8px;}

 
.neiBan::before{ display: block; content: ''; width: 100%; height: 10vw; position: absolute; left: 0; top: 0; background:linear-gradient(to bottom,rgba(0,0,0,.5),transparent); z-index: 10; }
.neiBan::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; background:rgba(0,0,0,.25);} 
.neiBanImg{ width: 100%; max-height: 100vh; min-height: 260px; object-fit: cover;}
.neiBanBot{ position: absolute; bottom: -6vw; left: 0; z-index: 20;}
.zwNeiBan{ height: 6vw;}.w63{ width: 63%;}
.neiBan .text{position: absolute;  left: 0; top: 40%; z-index: 15;}
.neiBan .text .line{ width: 1.1em; height: 5px;}
.neiBan i.line{ width: 1em; height: 2px;}

.aboutTop{background: url(../images/aboutTopBg.jpg) no-repeat center bottom #fff ; background-size: 100% auto;}
.birNum{ display: grid; grid-gap: 16px; grid-template-columns: repeat(2,1fr);}
li {min-width:0}
.birNum li{ background: rgba(255, 255, 255, .8);}
.birNum .Shu i{ position: absolute; left: calc(100% + 10px); top: 0; font-size: .5em;}
.biref .idxAboutPlay{ position: absolute; z-index: 10; 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%); }
.w42{ width: 42%;}
.aboutTopIcon{ width: 24.7vw; position: absolute; top: 20%; left: 0;}

.history{ background: url(../images/historyBg.jpg) no-repeat center center / cover; background-attachment: fixed;}
.history::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:rgba(18,39,122,.9) }
.history .idxTit h2{-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;background-image: linear-gradient(to bottom, rgba(255,255,255,.2), rgba(255,255,255,.01));}
.historySwiper .swiper-slide{ height: auto;}
.historySwiper .swiper-slide .img{ width: 100%; height: 0; padding-bottom:0;}
.historySwiper .swiper-slide-active{ opacity: 1;}
.historySwiper .swiper-slide-active .img{ padding-bottom: 63%;}

.Overview{ background: url(../images/OverviewBg.jpg) no-repeat center center / cover;}
.w58{ width: 58%;}
.OverviewRight{ background: url(../images/OverviewrrRightBg.jpg) no-repeat center center / cover;
        display: grid; grid-gap: 3vw; grid-template-columns: repeat(3,1fr);}

.mission{ background: url(../images/missionBg.jpg) no-repeat center center / cover;}
.mission::after{ display: block; content: ''; width: 100%; height: 13vw; background: url(../images/missionAfterBg.jpg) no-repeat center center / cover; position: absolute; bottom: 0; left: 0;}
.missionLine{ width: 2em; height: 4px;}
.missionUl{display: grid; grid-gap: 1vw; grid-template-columns: repeat(4,1fr);}
.missionIcon{ position: absolute; width: 71%; 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%); }
.line-height9{ line-height: .9;}
.missionUl li .line{ width: 1.1em; height: 3px;}
.missionUl li:hover{ box-shadow: 0 0   15px rgba(0, 0, 0, .15); transform: translateY(-1vw); -webkit-transform: translateY(-1vw); -moz-transform: translateY(-1vw); -ms-transform: translateY(-1vw); -o-transform: translateY(-1vw); }
.missionUl li:hover .line{ width: 3em;}

.Honors{ background: url(../images/HonorsBg.jpg) no-repeat   bottom right / cover;}
.honorLeft{ width: 22%;}
.honorRight{ width: 75%;}
.honorLeft li + li{ margin-top:2vw ;}
.honorSwiper .img{ width: 100%; height: 0; padding-bottom: 120%;}
.honorRight .iconfont{ position: absolute; top: 50%; z-index: 10; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.honorRight .prev{ left: 31%;}
.honorRight .next{ right: 31%;}
.honorRight .iconfont:hover{ color: var(--color);}

.proLeft{ width: 24%;}
.proRight{ width: 76%; }
.proNav li::after{ display: block; content: ''; width:30%; height: 100%; opacity: 0; position: absolute; left: 0; top: 0; background:var(--color) }
.proNav li.on::after{ width: 100%; opacity: 1;}
.proNav li.on,.proNav li.on a:hover{ color: #fff !important;}
 
.prolsit{ display: grid; grid-gap: 2.4vw; grid-template-columns: repeat(3,1fr);}
.prolsit li .img{ width: 100%; height: 0; padding-bottom:92%;}
.proDetail{ background: url(../images/proDetailBg.jpg) no-repeat center bottom / 100% auto;}

.bg-ee{ background: #eee;}

.proLeftSwiper .img{ width: 100%; height: 0; padding-bottom: 100%;}
.W-105{ width: 105PX;}
.W-150-133{ width: calc(100% - 130PX);}
.proRightSwiper{ height: 560px;}
.proRightSwiper .swiper-slide{ border:2px solid transparent;}
.proRightSwiper .swiper-slide-thumb-active{ border-color: var(--color);}
.proRightSwiper .img{ width: 100%; height: 100%;  }
/* .proDetailRight .button{ position: absolute; left: 0; bottom: 0; width: 100%; z-index: 15;} */
.proDetailRight .button .iconfont:hover{ color: var(--color);}
 
.equipmentSwiper .swiper-slide .img{ width: 100%; height: 0; padding-bottom: 65.8%;}
.equipment .button .btn,.equipment .button .btn .border-right { border-color: var(--color);}
.equipment   .button .btn div{  width:98px ;}
.equipment   .button .btn div:hover{ background: var(--color); color: #fff;}
.equipment   .button .btn div:hover img{ filter: grayscale(100%) brightness(500%); -webkit-filter: grayscale(100%) brightness(500%); }
.equipment   .button .pagination{ position: relative; left: auto; top: auto; width: 320px; height: 3px; background: #d6d6d6}

.w38{ width: 38%;}
.objectCrice{ padding: 20px; width: 112px;  height: 112px;}
.objectCrice::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:url(../images/heshunheshunheshunheshunheshun.png) no-repeat center center / 100% 100% ;animation: rotate2 12s linear infinite;}

.content{ background: url(../images/contentBg.jpg) no-repeat center top / cover;}
.contentUl{ display: grid;grid-gap: 10px;grid-template-columns: repeat(5,1fr);}
.contentUl li{backdrop-filter: blur(10px); background: rgba(255, 255, 255, .8);}
.contentUl li:hover{ transform: translateY(-1vw); -webkit-transform: translateY(-1vw); -moz-transform: translateY(-1vw); -ms-transform: translateY(-1vw); -o-transform: translateY(-1vw); }

.newslist{ display: grid;grid-gap: 3.3vw;grid-template-columns: repeat(3,1fr);}
.newslist li .img{ width: 100%; height: 0; padding-bottom: 65%;}
.newslist li .desc{ height: 4em;}
.newslist li:hover .more{ letter-spacing: 2px;}

.newsLeft{ width: 65%;}
.newsRight{ width: 31%;}
.newsRight .tit::after{ height: 1em; width: 6px; background: var(--color); display: block; content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.newsRightUl{ position: sticky; right: 0; top: 15px;}
.newsRightUl a .img{ width: 185px; height: 115px;}
.newsRightUl a .img img{ width: 100%; height: 100%; object-fit: cover;}
.newsRightUl a .text{ width: calc(100% - 204px);}
.newsRightUl 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); }

.mapBox{ height: 70vh;}
.messages{ background: url(../images/messagesBg.png) no-repeat right bottom #fff; background-size:  100% auto;}
.contactBox .ewmBox .img{   background: url(../images/ewmBg-color.png) no-repeat center center / 100% 100%; }

 
.searchbot  ul a{    border-bottom: 1px solid #e5e5e5;}
.searchbot  ul a:last-child{ border-bottom: none;}
.searchbot  ul a:hover{ color: var(--color);}
.searchbot ul a span{ width: 80%; word-break:break-all;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}

.searchbigBox{   box-shadow: 0 0 10px rgba(0, 0, 0, .15); position: relative; z-index: 5;}
.serviceback {width: 160px;line-height: 50px; display: block;perspective: 500;-webkit-perspective: 500; }
.serviceback .w {position: relative;-webkit-transition: all 0.25s;-o-transition: all 0.25s;transition: all 0.25s;-webkit-transform-style: preserve-3d;        transform-style: preserve-3d;pointer-events: none;}
.serviceback .f { background: rgba(1, 102, 179, .1);padding: 0 30px; color: #333; } 
.serviceback .t {position: absolute;background-color: var(--color);width: 100%;height: 100%;padding: 0 30px;left: 0;color: #fff;top: -50px;-webkit-transform-origin: center bottom;    -ms-transform-origin: center bottom;        transform-origin: center bottom;-webkit-transform: rotateX(90deg);        transform: rotateX(90deg);-webkit-backface-visibility: hidden;        backface-visibility: hidden;}
.serviceback:hover .w {-webkit-transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);        transform: translateY(25px) translateZ(-25px) rotate3d(1, 0, 0, -90deg);}
 
.searchbigBox .input{ line-height: 50px; width: 72%; padding: 0 25px; color: #000; border: 1px solid #e5e5e5;}
.searchbigBox button{ line-height: 50px; width: 14%;}



.online_q {position: fixed;right: 3px;bottom: 10%;z-index: 9999;transition:.5s;-webkit-transition:.5s;}

.online_q .btn2{width:55px; height:55px; cursor:pointer; position:relative; margin-bottom:5px; }

.online_q .btn-top{ padding:0; transition:.5s; overflow:hidden; -webkit-transition:.5s; -moz-transition:.5s; -ms-transition:.5s; -o-transition:.5s; }

.online_q .btn-top span{ background: #ff602a !important;}

.online_q .btn2 a{  font-size:12px; color:#fff;}

.online_q .btn2 span{display:block; float:left; text-align: center; width:55px; height:55px; line-height: 55px; position:relative; z-index:999; overflow:hidden; transition:.3s; -webkit-transition:.3s; background: #014590; }

.online_q .btn2:hover span{ background: #ff602a; }

.online_q .open.pic{ position:absolute; background:#ddd; width:100px; height:100px; right:80px; top:50%; margin-top:-50px; text-align:right; opacity:0; transition: .6s; -webkit-transition: .6s; visibility:hidden;}

.online_q .open.pic img{ width:80px; height:80px; margin-top:10px; margin-right:10px;}

.online_q .btn2:hover .open.pic{ opacity:1; right:4.5rem;visibility:visible;}

.online_q .open.phone{ display:inline-block; height:55px; line-height:55px; z-index:0; background:#eee; color:#ff602a; font-family:arial; font-size:18px; transition:width 0s; -webkit-transition:width 0s; text-align:center;  width:150px;}

.online_q .btn2:hover .open.phone{transition:.5s; -webkit-transition:.5s; opacity:1; visibility:visible;}

.btn-tel a{ display:block; width:55px; white-space:nowrap; position:absolute; right:0;transition:.5s; -webkit-transition:.5s; overflow:hidden;}

.btn-tel:hover a{ width:205px;}

.online_q .btn-02.btn-tel:hover span{ background:url(../images/piaofu_tel.png) center no-repeat #fff; border:2px solid #037ccf;}

.online_q .open.pic:before{ content:""; display:block; width:0; height:0; border:10px solid transparent; border-left:10px solid #ddd; position:absolute; right:-15px; top:50%; margin-top:-10px;}

#gotop.hide{height:0; overflow:hidden; display:block !important;}

  @keyframes aitf {
        0% { background-position: 0% 50%; }
        100% { background-position: 100% 50%; }
    } 
            .missionTitles{
                 filter: drop-shadow(0 5px 5px rgba(0,0,0,0.2));
                 background: url(../images/idxPartnerNumBg.jpg) no-repeat center center var(--blue);
                 -webkit-background-clip: text;
                 background-clip: text;
                 color:transparent;
                 animation: aitf 25s linear infinite;
                 -webkit-filter: drop-shadow(0 5px 5px rgba(0,0,0,0.2));
                 -webkit-animation: aitf 25s linear infinite;
}

.plist{ display: grid; grid-gap: 20px; grid-template-columns: repeat(3,1fr);}
.plist li .text{ position: absolute; left: 0; top: 0; z-index: 5;}
.plist li .float{ position: absolute; right:  0; bottom: 0; z-index: 5;}
.plist li:hover .float{ background: var(--orange); color: #fff; transform: translateX(-8px);}
.plist li:hover  { box-shadow: 0 0 15px rgba(40, 60 ,145, .2);}