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; left: 0; top: 0; width: 100%;z-index: 100;}
header .con{  padding: 0 4vw;  }
.f10{ font-size: 11px;}

.maxInner{ width: 92vw; margin: 0 auto;}

.oneNav{ line-height:100px; white-space: nowrap; display: block;   font-size: 18px;  }
.oneNav span { position: relative;}
.oneNav span::after{ width: 100%; height: 2px; display: block; content: ''; background:#fff; 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; margin-left: 3vw;}
/* 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%); }
 


.h_nav{ height: 60px; width: 60px; background-color:var(--color); padding: 18px 8px ;    align-items: flex-end; display: flex;}
.h_nav .burger{ width: 100%;  height: 1px ; background: #fff;  transition: .8s; display:inline-block;       }
.h_nav .burger:first-child{ animation: long 2s linear infinite; -webkit-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); }
.h_nav.close{align-items: center; justify-content: center;}


.neiBan .con{ padding: 0 4vw;}
.neiBanImg{width: 100%; min-height: 260px;  max-height: calc(100vh - 100px); object-fit: cover;}
.neiBan::after{ display: block; content: ''; width: 100%; height: 90%; position: absolute; left: 0; top: 0; background:var(--color) }
/* .neiBan .img::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:rgba(0,0,0,.25) } */
.neiBan .text{ position: absolute; 
  

  
  left: 50%; top: 50%; transform: translate(-50%,-50%);z-index: 15; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.neiBan .ScroolBox{ position: absolute; left: 50%; width: 2.6vw; min-width: 25px; z-index: 10; transform: translateX(-50%) ; bottom: 5%; -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 { padding-left: 4vw; }
.idxBan .swiper-container{border-top-left-radius: 2vw;}
/*  max-height: calc(100vh - 100px); */
.idxBanImg{ width: 100%; min-height: 260px;  object-fit: cover;}
/* .idxBan .swiper-slide::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:rgba(0,0,0,.3) } */

.idxBan .text{ position: absolute; left: 4vw; top: 42%;
 
    z-index: 15;  }

.idxMore .round{ transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); }
.idxMore:hover .round{ transform: rotate(0); -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); }
.idxMore:hover .left{ letter-spacing: 1px;}
.idxBan .button{ position: absolute; right: 0; bottom: 8%; z-index: 15;}
.swiBtn:hover{ background: var(--color); color: #fff;}

.idxBan .text { text-shadow: 2px 2px 0 #00419d, 4px 4px 0 #023f95, 6px 6px 0 #023175;}

.idxPro{ background: url(../images/idxProBg.jpg) no-repeat center center / cover;}
.kuai{ width: 12px; height: 13px; transform: skewX(-10deg); -webkit-transform: skewX(-10deg); -moz-transform: skewX(-10deg); -ms-transform: skewX(-10deg); -o-transform: skewX(-10deg); }

.w42{ width: 42%;}.w28{ width: 28%;}
.idxProSwiper .swiper-slide .img{ width: 100%;height: 0; padding-bottom:78.2% ;}
.idxProSwiper .swiper-slide .text .desc div + div{ margin-top: 1em;}

.idxProSwiper .idxMore{ position: absolute; left: 0; bottom: 8%;}
.idxProSwiper .swiper-wrapper{ align-self: flex-end;}
.idxProSwiper .swiper-slide{ height: auto; padding-left: 1px;}
.idxProSwiper .swiper-slide .text{ display: none;}
.idxProSwiper .swiper-slide-active { align-items: center;}
.idxProSwiper .swiper-slide-active .right{ width: 50%;}
.idxProSwiper .swiper-slide-active .text{ display: block;}

/* .idxPro .button{ position: absolute; left: 79%; z-index: 15; bottom: 70%;} */

.idxObj{ background: url(../images/idxObjBg.jpg) no-repeat center center / cover; background-attachment: fixed;}
.idxObj::after{ display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background:rgba(0,65,157,.85) }
.idxObjSwiper .swiper-slide .img{ width: 100%;height: 0; padding-bottom:65% ;}
.idxObjSwiper .swiper-slide .img .address{ border-bottom-right-radius: 1vw; position: absolute; left: 0; top: 0; z-index: 15;}
.idxObjSwiper .swiper-slide .img .more{ width: 5em; height: 5em; position: absolute; right: 0; bottom: 0; z-index: 15;}
.idxObj .button .prev,.idxObj .button .next{ width: 100px;}
/* .idxObj .button .icon { filter: grayscale(100%); transition:all 0s ; -webkit-transition:all 0s ; -moz-transition:all 0s ; -ms-transition:all 0s ; -o-transition:all 0s ; } */
.idxObj .button .prev:hover,.idxObj .button .next:hover{ background: var(--color);}
.idxObj .button .prev:hover .icon,.idxObj .button .next:hover .icon{filter: grayscale(100%) brightness(500%); }
.idxObj .pagination{ width: 30vw; height: 5px; background: rgba(255, 255, 255, .5); position: relative; left: auto; right: auto; top: auto; bottom: auto;}
.idxObj .pagination .swiper-pagination-progressbar-fill{ background: #fff;}
.idxObjSwiper .swiper-slide .img:hover .address,.idxObjSwiper .swiper-slide .img:hover .more{ background: var(--color); color: #fff;}
.idxObjSwiper .swiper-slide .img:hover  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); }

.idxAbout{ background: url(../images/idxAboutBg.png) no-repeat center bottom / 100% auto;}
.idxAboutImg{ width: 100%;height: 0; padding-bottom:75% ;}
.idxAbout .right::after{ display: block; content: ''; width: 100%; height: 115%; position: absolute; left: 15%; bottom: 0; background:url(../images/idxAboutrRight.png) no-repeat center center / 100% 100% }

.numUl li{ width: 18.7%;}
.numUl li:nth-child(2n-1){ margin-top: 5vw;}

.idxYS{ background: url(../images/idxYSBg.jpg) no-repeat center center / cover;}
.idxYSImg{ position: absolute; left: 0; top: 30%; bottom: 0; max-width: 70%; height: 70%; object-fit: cover; }

.idxYSUl{ display: grid; grid-gap: 2vw; grid-template-columns: repeat(3,1fr);}
li {min-width:0}
.idxYSUl li.on{ 
  clip-path: polygon(
     0 0,                   
     calc(100% - 4vw) 0,   
     100% 4vw,           
     100% 100%,            
     0 100%              
 ); 

}
.idxYSUl li.on::after {
     display: block; 
     content: '';
     position: absolute;
     top: 0;
     right: 0;
    background: var(--color);

    width: 5vw; height: 5vw;
    -webkit-clip-path:polygon(0 0,100% 0 ,100% 100%);
    
}
/* 
.horiz-gallery-wrapper{ background: url(../images/idxYSBg.jpg) no-repeat center center / cover;}

.idxYSUl{ margin-top: 20vw;}
.idxYSUl li{ width: 26.6vw;}
.idxYSUl li.on{ 
     clip-path: polygon(
        0 0,                   
        calc(100% - 4vw) 0,   
        100% 4vw,           
        100% 100%,            
        0 100%              
    ); 

}
  .idxYSUl li.on::after {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        right: 0;
       background: var(--color);

       width: 5vw; height: 5vw;
       -webkit-clip-path:polygon(0 0,100% 0 ,100% 100%);
       
}

.container-fluid {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
    margin-right: auto;
    margin-left: auto;
  }

.horiz-gallery-strip,
.horiz-gallery-wrapper {  will-change: transform; } */

footer{ background: url(../images/footerBg.png) no-repeat center bottom #083a7f; background-size: 83% auto; color: rgba(255, 255, 255, .6);}
.footerForm .keys{ background: rgba(255, 255, 255, .1);}
.footKuai{ width: 9px; height: 9px;}
footer a:hover{ color: rgba(255, 255, 255, .8);}

.ewmBox .img{ background: url(../images/ewmBg.png) no-repeat center center / 100% 100%;}
.ewmEwm{ width: 110px;}

.brief .more{ width:4.6vw ; height: 4.6vw; min-width: 50px; min-height: 50px;}
.brief .more::after{ display: block; content: ''; width: 76%; height: 76%; border-radius: 50%; position: absolute; left: 12%; top: 12%; border: 1px dashed rgba(255, 255, 255, .5); z-index: 10 ; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }

.briefImg{ margin-top: -10vw;}
.honors{ background: url(../images/honorBg.jpg) no-repeat center bottom / 100% auto;}

.honorSwiper .img{ background: url(../images/honorIconBg.png) no-repeat center bottom / 100% auto; height:350px; padding-bottom: 80px;}
.honorSwiper .swiper-wrapper .swiper-slide:nth-child(2n){ padding-top: 70px;}
.honorSwiper .title img{ flex-shrink: 0;}
.honors .pagination{ height: 5px; background: rgba(0,65,157,.12); position: relative; left: auto; bottom: auto; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; }




.proClassUl{ position: sticky; left: 0; top: 3vw;}
.proClassUl .bottom {width: 100%; margin: 0 auto; border-radius: 15px;}
.proClassUl .icon-arrow-right-bold{ font-size: 1em;}
.proClassUl li .bottom{ padding-top: 35px; margin-top: -30px; display: none;}
.proClassUl li .bottom .on{ color: var(--color);}

.proClassUl li.on .top{ background: var(--color); color: #fff;}
.proClassUl li.on .top .icon-arrow-right-bold::before{content: "\e689";}
.proClassUl li i{color: #888888; opacity: 0.5; font-size: 14px;}
.proClassUl li.on i{color: #fff;  opacity: 1;}
.proTitle{ background: url(../images/proTitleBg.jpg) no-repeat center center / cover;}
.wapProTitle.on .icon-arrow-double-right{ transform:rotate(90deg) ; -webkit-transform:rotate(90deg) ; -moz-transform:rotate(90deg) ; -ms-transform:rotate(90deg) ; -o-transform:rotate(90deg) ; } 

.prolist li .img{ width: 100%; height: 0; padding-bottom: 78.2%;}
.prolist li .text .desc{ height: 9em;}
@media screen and (min-width:900px) { .prolist li:first-child{ margin-top: 0;}}


.proTop::after{ display: block; content: ''; width: 100%; height:75vh; position: absolute; left: 0; top: 0; background:var(--color) }
.proinfoSwiper .img{width: 100%; height: 0; padding-bottom: 72%;}
.proinfoSwiper .swiBtn{ 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%) ; }
.proinfoSwiper .swiBtn.prev{ left: 0;}
.proinfoSwiper .swiBtn.next{ right: 0;}

.proinfoSwiperBox .mypagination{ position: absolute; left: 0; right: 0; bottom: 10px; z-index: 10;}
.proinfoSwiperBox .mypagination .swiper-pagination-bullet{ width: 6px; height: 6px; margin: 0 2px; background: #fff; opacity: 1;}
.proinfoSwiperBox .mypagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ background: var(--color);}

.proinfoDesc  .bottom span{ white-space: nowrap;}
.proinfoDesc  .bottom span + span{ margin-left: 2em;}

.tjproSwiper .img{ width: 100%; height: 0; padding-bottom: 78%;}
.w58{ width: 58%;}
.tjpro .button .prev,.tjpro .button .next{ width: 100px;}
/* .idxObj .button .icon { filter: grayscale(100%); transition:all 0s ; -webkit-transition:all 0s ; -moz-transition:all 0s ; -ms-transition:all 0s ; -o-transition:all 0s ; } */
.tjpro .button .prev:hover,.tjpro .button .next:hover{ background: var(--color);}
.tjpro .button .prev:hover .icon,.tjpro .button .next:hover .icon{filter: grayscale(100%) brightness(500%); }
.tjpro .pagination{ width: 30vw; height: 5px; background: #d8d8d8; position: relative; left: auto; right: auto; top: auto; bottom: auto;}
.tjpro .pagination .swiper-pagination-progressbar-fill{ background: var(--color);}

.projectlist li:nth-child(2n){ float: right;}
.projectlist li:nth-child(2){ margin-top: 10vw;}
.projectlist li .img{ width: 100%; height: 0; padding-bottom: 65.8%;}
.projectlist li .img .address{ border-bottom-right-radius: 1vw; position: absolute; left: 0; top: 0; z-index: 15;}
.projectlist li .img .more{ width: 5em; height: 5em; position: absolute; right: 0; bottom: 0; z-index: 15;}
.projectlist li:hover  .img .address,.projectlist li:hover  .img .more{ background: var(--color); color: #fff;}

.w56{ width: 56%;}
.mapBox{ width: 100%; height: 42vw; border-bottom: 5px solid var(--color);}

.messages input::-webkit-input-placeholder,.messages  textarea::-webkit-input-placeholder {color:#999;}
.messages input:-moz-placeholder,.messages  textarea:-moz-placeholder {color:#999;}
.messages input::-moz-placeholder,.messages  textarea::-moz-placeholder {color:#999;}
.messages input:-ms-input-placeholder,.messages  textarea:-ms-input-placeholder {color: #999;}

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

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

.pop{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 222; display: none;}
.pop .bg{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; background: rgba(0, 0, 0, .56);}
.pop .con{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 20; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }

.lyPop .con{ width: 90%; max-width: 1200px; }
.lyPop .icon-add-circle{ display: inline-block; transform: rotate(45deg); position: absolute; right: 0; top: 0;}
.lyPop .icon-add-circle:hover{ color: var(--red); transform: rotate(225deg);}

.slide-nav {
  position: fixed;
  right: 13px;
  top: 50%;
  z-index: 11;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s
}

.slide-nav.cur {
}

.slide-nav .icon {
  overflow: hidden;
  padding:20px;
  display: block;
}

.slide-nav .icon img {
  -webkit-transition: none;
  -o-transition: none;
  transition: none
}

.slide-nav ul {
  background-color: #fff;
  -webkit-box-shadow: 0px 3px 25px 0px rgba(148, 148, 148, 0.4);
  box-shadow: 0px 3px 25px 0px rgba(148, 148, 148, 0.4)
}

.slide-nav ul li {
  text-align: center;
  cursor: pointer;
  position: relative;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s
}

.slide-nav ul li .popup {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 68px;
  background-color: #fff;
  border-radius: 5px;
  overflow: hidden;
  -webkit-box-shadow: 0px 3px 25px 0px rgba(148, 148, 148, 0.4);
  box-shadow: 0px 3px 25px 0px rgba(148, 148, 148, 0.4);
  display: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
}

.slide-nav ul li .popup .tel {
  color: #00419d;
  font-size: 18px;
  ;
  line-height: 1.5;
  padding: 20px;
  width: 250px;
  font-family: "InterR";
  text-align: left;
}

.slide-nav ul li .popup .tel span {
  font-size: 18px;
  font-family: "albbMedium";
}

.slide-nav ul li .popup .ewm {
  width: 160px;
  padding: 10px;
  border-radius: 10px;
  overflow: hidden;
  font-family: "albbMedium";
  font-size:18px;
  color: #00419d;
}

.slide-nav ul li:hover .icon {
  background-color: #00419d
}

.slide-nav ul li:hover .icon img {
  -webkit-filter: invert(1) brightness(1000%);
  filter: invert(1) brightness(1000%)
}

.slide-nav ul li:hover .popup {
  opacity: 1
}

.slide-nav .backTop { display: none;
  background-color: #fff;
  -webkit-box-shadow: 0px 3px 25px 0px rgba(148, 148, 148, 0.4);
  box-shadow: 0px 3px 25px 0px rgba(148, 148, 148, 0.4);
  margin: 12px 0 0;
  cursor: pointer
}
.slide-nav.cur .backTop{ display: block;}