body{font-size: 16px;} 
.z_page_swiper{ height: 100vh;overflow: hidden;}
.w80{ width: 84%; margin: 0 auto;}
 
.z_slide{ overflow: hidden;}
.footer {height: auto;overflow: initial;}

.z_kdc_bar{ position: fixed; z-index: 100; right: 40px !important; top: 50%; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; 
 }
.z_kdc_bar .swiper-pagination-bullet{ width: 14px; height: 14px; margin: 10px 0 !important; opacity: 1; transform: scale(0.8); transition: all .36s; background-color: rgba(255, 255, 255, .5); border: 3px solid transparent; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.z_kdc_bar .swiper-pagination-bullet.swiper-pagination-bullet-active{ border: 3px solid #fff; background-color: transparent; opacity: 1; transform:scale(1); -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); }

.linka a:hover{  color: #00696c;} 
header{ padding: 0 50px; background-color: #fff; position: fixed; z-index: 100; top: 0; width: 100%; box-shadow: 0 0 10px rgba(0, 0, 0, .15);}
.logo{ width: 10.3vw;}
nav{  width: 57vw;}
nav li.on .OneNav{ color: #00696c;}
nav li{ flex: 1; text-align: center; position: relative;}
.OneNav{ font-size: 18px; line-height: 90px; height: 90px; width: 100%; display: inline-block; position: relative;}
.OneNav::after{ width: 1px; height: 18px; position: absolute; right: 0; top: 50%;transform:translateY(-50%) ; background-color: #ddd; display: block; content: '';}
nav li:last-child .OneNav::after{ display: none;}

nav  li dl{position:absolute;text-align: center;  width: 660px;top:90px ;   left: 50%; background:#fff;   box-shadow:0 5px 10px rgba(0,0,0,.1);
    border-bottom-left-radius:5px;border-bottom-right-radius:5px;
 }
 nav  li dl dd{white-space: nowrap; line-height:50px;   }
 
 nav  li dl dd a{ padding: 0 10px; width: 100%;    border-bottom: 1px solid #eee; 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 a:last-child{ border-bottom: none;}
 nav  li dl dd a:hover{ background-color: #00696c; 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{ visibility:hidden; opacity:0; filter:alpha(opacity=0); transform:translateX(-50%) translateY(20px); -ms-transform:translateX(-50%) translateY(20px); -o-transform:translateX(-50%) translateY(20px); -webkit-transform:translateX(-50%) translateY(20px); -moz-transform:translateX(-50%) translateY(20px); transition:all .5s ease; -ms-transition:all .5s ease; -o-transition:all .5s ease; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; }
 nav  li:hover dl{ visibility:visible; opacity:1; filter:alpha(opacity=100); transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); }
 /* nav  li>a:hover:after{top:0} */
 nav  li>a:hover span{transform:translateY(-100%);-ms-transform:translateY(-100%);-o-transform:translateY(-100%);-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%)}



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


 .nav{ color: #fff !important; width: 100%; height: calc(100vh - 60px) ; transition:all .6s ; transform: translateX(100%); background-color: #000; 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(255, 255, 255, 0.25); position: relative;}
 .nav li.go-child>a{ line-height: 60px; padding: 0 20px; font-size: 16px;}
 
 .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(255, 255, 255, 0.25); display: block; padding-left: 25px; font-size: 14px; opacity: 0.8; }

 
.z_banner{ width: 100%;position: relative; overflow: hidden;}
.z_banner:hover .z_wave{ transform: translate(-50%,0);}
.z_banner .bd li{ width: 100%; height: 100vh; overflow: hidden;}
.z_banner .picBox{position:relative;overflow:hidden; width: 100%; height: 100vh;}
.imgbg{ width: 100%; height: 100%; transition: all 1s; background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; }
  
.z_banner_num{ z-index: 10; position: absolute; bottom: 60px !important;}
.z_banner_num .swiper-pagination-bullet{ position: relative; width: 30px; height: 30px; border: 2px solid transparent; background-color: transparent; opacity: 1; margin: 0 8px !important; }
.z_banner_num .swiper-pagination-bullet::after{ display: block; content: ''; width:20%; position: absolute; left:40%; top: 40%; border-radius: 50%; background-color: #fff; height: 20%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.z_banner_num .swiper-pagination-bullet.swiper-pagination-bullet-active{border-color: #fff;} 
.yyImg { position: absolute; top: 0; left: 0; z-index: 1;}
.yyImg .img{ display: none; transition: all .36s; animation: scaleIn 2s forwards cubic-bezier(0.4, 0, 0.49, 0.93); -webkit-animation: scaleIn 2s forwards cubic-bezier(0.4, 0, 0.49, 0.93); }
.yyImg .img.on{ display: block;}
.yyImg .img span{ position: absolute; top: 0; left: 0; background: rgba(0,105,108,.2); width: 100%; height: 100%;z-index: 10;}
.yyImg .img img{ width: 100%; height: 100%; object-fit: cover;}

 
.idxApplication .title .txt{ border-left: 4px solid #fff;}
.idxApplication .desc{ padding: 6vh 0;}
#idxApplicationSwiper{ z-index: 10;}

.idxMore{ width: 200px; height: 60px; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; }
.idxMore span{ border: 1px dashed #fff; width: 24px; height: 24px; border-radius: 50%; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.idxMore span::after{ transition:all .36s ; content: "\ea66"; display: block; font-family: "iconfont" !important; font-size: 20px; position: absolute; left: 15px; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.idxMore:hover span::after{ left: -10px;}
.idxMore:hover{ box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);}

#idxApplicationSwiper .swiper-slide-active{ background-color: #00696c;}
.idxApplicationUl{ margin-top: 7vh;}
.yyItem{ width: calc((100% - 100px) / 6); border: 1px solid rgba(255, 255, 255, .5);}
 
.ApplicationUl li{ display: none; animation: topFloat .5s; -webkit-animation: topFloat .5s; }
.ApplicationUl li.on{display: block;} 
@keyframes topFloat {
    from {
        transform: translateY(20px);
        opacity: 0;
        -webkit-transform: translateY(20px);
        -moz-transform: translateY(20px);
        -ms-transform: translateY(20px);
        -o-transform: translateY(20px);
}

    to {
        transform: translateY(0);
        opacity: 1;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
}
}


.yyItem:before{
    content: '';
    padding-top: 100%;
    box-sizing: border-box;
    display: block;
    width: 0;  
}

.yyItem .con{
    position:absolute;
    height:100%;
    width:100%;
    left: 0;
    top: 0;   z-index: 10;      
 }
 .yyItem::after{ transition: all .36s; transform: scale(0.8); opacity: 0; display: block; content: ''; position:absolute; height:100%; width:100%; left: 0; top: 0; z-index: 5; background:  url(../images/yyItemBg.jpg) no-repeat center center; background-size: cover; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; -webkit-transform: scale(0.8); -moz-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8);
}
.yyItem:hover::after,.yyItem.on::after{ transform: scale(1); opacity: 1; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.yyItem:hover,.yyItem.on{ border-color: transparent;}

.idxPartner{ background: url(../images/partnerBg.jpg) no-repeat center center; background-size: cover;}
.idxPartnerLeft{ width:83% ; }
.idxPartnerRight{ width: 17%; background: url(../images/idxPartnerRightBg.jpg) no-repeat bottom right; background-size: cover;}
.partnerTit{ width: 24%; position: absolute; right: 25%; bottom: 7.4vh;}

.idxPartnerLeft{   padding-left: 8vw; padding-right: 5vw; height:100vh;}
.idxPartnerLeft .line{  width: 1px; height: 110px; background-color: #ddd;}
.idxPartnerLeft .num{ font-size: 110px;}
.partnerItem{width: calc(20% - 1px); margin-right: 1px; background: rgba(255, 255, 255, .4); margin-bottom: 1px; position: relative;}
.partnerItem:hover{  }
.partnerItem:before{
    content: '';
    padding-top: 100%;
    box-sizing: border-box;
    display: block;
    width: 0;  
}
#partnerSwiper .swiper-slide{}
.partnerItem .con{
    position:absolute;
    height:100%;
    width:100%;
    left: 0;
    top: 0;   z-index: 10;      
 }
 .partnerItem img{ max-width: 90%; max-height: 90%;}

 .lastPartnerItem{ position: absolute; right: 0; bottom: 0; z-index: 10; background-color: #fff;}
 .lastPartnerItem a:hover{ color: #00696c;}

 .idxAbout{ background:url(../images/aboutBg.jpg) no-repeat center center; background-size: cover;  }
 .idxAbout .top .txt{ width: 31.2vw;}

 .aboutMore{ display: inline-flex; padding: 10px 0;  }
.aboutMore span{ border: 1px dashed #fff; width: 24px; height: 24px; border-radius: 50%; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.aboutMore span::after{ transition:all .36s ; content: "\ea66"; display: block; font-family: "iconfont" !important; font-size: 20px; position: absolute; left: 15px; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.aboutMore:hover { padding: 10px  35px;}
.aboutMore:hover span::after{ left: -10px;}
.aboutMore:hover{ box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);}
.aboutPlay img{ animation: rotate 10s linear infinite; transition: ease 1s; -webkit-animation: rotate 10s linear infinite; }
.idxAbout .bot{ margin-top: 11vh; width: 75%;}
.idxAbout .bot li{ width: 31.6%; border-radius: 10px;}
.idxAbout .bot li img{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; }
.idxAbout .bot li:hover{ transform: scale(0.92); box-shadow: 0 0 10px rgba(0,105,108,.2); -webkit-transform: scale(0.92); -moz-transform: scale(0.92); -ms-transform: scale(0.92); -o-transform: scale(0.92); }

.idxNews{ background: url(../images/newsBg.jpg) no-repeat center center; background-size: cover;}
 
.idxNews .title .txt{border-left: 4px solid #00696c;}


.newClass li.on{ text-decoration: underline; color: #00696c;}
.newslist li{ width: 31.25%; margin-right: 3.125%;}
.newslist li:nth-child(3n){ margin-right: 0;}
.newslist li .img img{ width: 100%; height: 380px; object-fit: cover;}
.newslist li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.newslist li:hover { color: #00696c;}
.newslist li  .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;
  }
.newslist li:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}

.headerPadding{ padding-top:90px;}
footer{ background: url(../images/footBg.jpg) no-repeat center center; background-size: cover;}
footer .top{ border-bottom: 1px solid rgba(255, 255, 255, .12);}

footer .center{ border-bottom: 1px solid rgba(255, 255, 255, .12);}
footer .center .left{ width: 72.5%;}
footer .center .right{ border-left: 1px solid rgba(255, 255, 255, .12); width:27.5% ; padding-left: 6%;}
footer .center .left dl{ margin-right: 10%;}footer .center .left dl:last-child{ margin-right: 0;}
footer .center .left dd{ color: rgba(255, 255, 255, .4);}
.linkFriend a{ color: rgba(255, 255, 255, .4); margin-left: 20px;white-space: nowrap;}
footer .bot{ color: rgba(255, 255, 255, .4);}
footer a:hover{ color: #fff;}

.neiBan{ margin-top: 90px;}
.neiImg{ width: 100%; min-height: 220px; object-fit: cover; max-height: calc(100vh - 170px);}
.neiBan .txt{  position: absolute; top: 0;left: 8vw;   z-index: 5;}

.subnav   a{ display: block; position: relative;  line-height: 90px; margin-right: 5vw;}
.subnav   a::after{ width: 100%; height: 3px; background-color: #00696c; position: absolute; left: 0; bottom: -1px; display: block; content: '' ; transition: all .36s; transform:scale(0,1) ; -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) ; }
.subnav   a.on{ color: #00696c; font-weight: bold;}
.subnav   a:hover::after,.subnav   a.on::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); }


.introduce{ background: url(../images/introduceBg.jpg) no-repeat center center; background-size: cover;}
.introduce .txt{ width:56% ; padding: 30px;}
.introduce .img{ width: 44%; height: 480px;}
.introduce .paly{
	z-index: 20;
	width: 100px;
	cursor: pointer;
	background: #fff;
	border-radius: 50%;
	height: 100px;
	position: absolute;
	left: 50%;
	margin-left: -50px; margin-top: -50px;
	top: 50%;
	box-shadow: 0 0 rgba(255, 255, 255, 0.1),0 0 0 15px rgba(255, 255, 255, 0.1),0 0 0 30px rgba(255, 255, 255, 0.1);
	animation: ripple-wave1 1s linear infinite;
	animation-play-state: running;
	opacity: 1;
	visibility: visible;
	transform: scale(1);
	transform: scale(0.8);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
}
#slideVideo{ width: 100%;  height: 100%;}
.introduce  .scoll{ max-height:420px; overflow-y: scroll;    }
.introduce  .scoll::-webkit-scrollbar {/*滚动条整体样式*/    /*高宽分别对应横竖滚动条的尺寸*/  width: 3px;}
.introduce  .scoll::-webkit-scrollbar-thumb {/*滚动条里面小方块*/border-radius: 3px; background: #00696c; width: 3px; }
.introduce  .scoll::-webkit-scrollbar-track {/*滚动条里面轨道*/border-radius: 3px; background: rgba(0,105,108,.05); width: 3px; }

.zhanwei{ padding-top: 90px; margin-top: -90px;}
.history{ background: url(../images/historyBg.jpg) no-repeat center center; background-size: cover;} 
.history-top{ margin: 100px 0;}
.history-top .years{ font-size: 100px;} 
.history-thumbs .yuan{ width: 40px; height: 40px;}
.history-thumbs .yuan i{ display: block; width:20%  ; height: 20%;}
.history-thumbs .yuan::after{ width: 100%; transform: scale(0); transition: all .36s; height: 100%; position: absolute; left: 0%; top: 0%; background-color: rgba(255, 255, 255, .4); display: block; content: ''; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.history-thumbs  .swiper-slide-thumb-active .yuan::after{ transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); }
.historyBot::after{ width: 100%; height: 1px; position: absolute; left: 0; top: 20px; background: rgba(255, 255, 255, 0.25); z-index: 1; display: block; content: '';}

.history  .next,.history .prev{ border: 1px solid rgba(255, 255, 255, .4); position: absolute; z-index: 20; top: 50%; width: 60px; height: 60px; margin-top: -30px;}
.history .prev{ left: 0;}
.history  .next{ right: 0;}
.history  .next:hover,.history .prev:hover{ background-color: #00696c;}
.history .next.swiper-button-disabled,.history .prev.swiper-button-disabled{ display: none ;}

.honor{ background: url(../images/honorBg.jpg) no-repeat center center; background-size: cover;}
.honor  .next,.honor .prev{ border: 1px solid rgba(255, 255, 255, .4); position: absolute; z-index: 20; top: 50%; width: 60px; height: 60px; margin-top: -30px;}
.honor .prev{ left: -100px;}
.honor  .next{ right: -100px;}
.honor  .next:hover,.history .prev:hover{ background-color: #00696c; color: #fff;}
.honor .swiper-button-disabled{ display: none ;}

.honor .swiper-slide{ background: url(../images/award1.png) no-repeat center top -8% #222222; background-size: 40% auto; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; } 
.honor .swiper-slide{ width: 100%;}

.culture{ background: url(../images/cultureBg.jpg) no-repeat center bottom #fff; background-size: 100% auto;}


.page-capability .page-about-content {width: 100%;}
.page-capability {padding: 7% 0 1% 0;overflow: hidden;background:url('../images/cultureBg.jpg') center no-repeat;background-size: cover;}
.capability-content {padding: 3% 0;overflow: hidden;}
.capability-content-bottom {padding: 4% 0;overflow: hidden;position: relative;}
.capability-content-bottom-swiper {width: 50%;margin: auto;}
.capability-item {position: relative;border: 1px dashed #ccc;border-radius: 100%;opacity: 0;background-position: center; background-repeat: no-repeat;}
.capability-item::before{content: '';width: 70%;height:70%;position: absolute;left: 50%;top:50%;transform: translate(-50%,-50%);background: #f0f1f2;border-radius: 100%;}
.capability-item .text{width: 50%;position: absolute;left: 25%;top: 50%;z-index: 11;color: #fff;text-align: center;transform: translateY(-50%);}
.capability-item .text .icon-1{width: 50px;height: 50px;margin: auto;position: relative;}
.capability-item .text .icon-1 img{filter: invert(100%);}
.capability-item .text .title-1{ font-weight: bold; }
.capability-item .text .text-2{  }
.capability-item .text .num-3{font-size: 24px;opacity: .2;font-family: 'Montserrat-Bold';}
.capability-item .img{border-radius: 100%;background-color: #f0f1f2;width: 60%;margin: 20%;z-index: 1;}
.capability-item .img img {opacity: .5;}
.capability-content-bottom-swiper .swiper-wrapper .swiper-slide-active .capability-item{background-size: 85%;opacity: 1;z-index: 11;}
.capability-content-bottom-swiper .swiper-wrapper  .swiper-slide:nth-child(1).swiper-slide-active .capability-item{ background-image: url('../images/capability1.png');}
.capability-content-bottom-swiper .swiper-wrapper  .swiper-slide:nth-child(2).swiper-slide-active .capability-item{ background-image: url('../images/capability2.png');}
.capability-content-bottom-swiper .swiper-wrapper  .swiper-slide:nth-child(3).swiper-slide-active .capability-item{ background-image: url('../images/capability3.png');}
.capability-content-bottom-swiper  .swiper-wrapper .swiper-slide:nth-child(4).swiper-slide-active .capability-item{ background-image: url('../images/capability4.png');}
.capability-nav {position:absolute;left: 25%;top: 0;width: 50%;height: 100%;z-index: 11;}
.capability-nav li{  position: absolute;}
.capability-nav li a{ overflow: hidden;}
.capability-nav li i{width: 60px;height: 60px;background: #e6e6e6;border-radius: 100%;  position: relative;
display: flex; align-items: center; justify-content: center;}
 
.capability-nav li span{ position:absolute ; left: 80px; top: 50% ; transform:translateY(-50%) ; -webkit-transform:translateY(-50%) ; -moz-transform:translateY(-50%) ; -ms-transform:translateY(-50%) ; -o-transform:translateY(-50%) ; }
.capability-nav li:nth-child(1) {  right: 14%; top: 15%;}
.capability-nav li:nth-child(2) { right: 14%;bottom: 15%;}
.capability-nav li:nth-child(3) {left: 14%;bottom: 15%;}
.capability-nav li:nth-child(4) {left: 14%;top: 15%;  }
.capability-nav li:nth-child(3) span {  left: auto; right: 80px;}
.capability-nav li:nth-child(4) span { left: auto; right: 80px;}
.capability-nav li.cur span{opacity: 1;}
.capability-nav li.cur i {background: #00696c;}
.capability-nav li.cur i img {opacity: 1;filter: invert(100%);}
.img-block {display: block;width: 100%;height: auto;}
.cultureImg img  {max-width: 100%;max-height:100%;margin: auto;padding: 0;border: 0;width: 100%;height: auto;border: none;}

.ysTit .line{ width: 25px; height: 4px;}
.technologyUl li{  width: 31%; margin-right: 3.5%; }
.technologyUl li:nth-child(3n){ margin-right: 0;}
.technologyUl li:hover{ box-shadow: 0 0 15px rgba(0,105,108,.3); transform: scale(0.9); -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); }

#embodimentSwiper  .swiper-slide{ padding: 100px 0;}
#embodimentSwiper  .swiper-slide:nth-child(2n) .embodimentItem{ margin-top: 80px;}
.Embodiment{ background: url(../images/embodimentBg.jpg) no-repeat center center; background-size: cover;}
.embodimentItem{background: url(../images/embodimentItemBg.png) no-repeat center top;  padding-top: 80px;  }
.embodimentItem .DIN{ width: 100px; height: 100px; position: absolute; left: 50%; margin-left: -50px; top: -45px; transition:all .36s ; -webkit-transition:all .36s ; -moz-transition:all .36s ; -ms-transition:all .36s ; -o-transition:all .36s ; }
.embodimentItem:hover .DIN{ background-color: #00696c; color: #fff; transform: scale(0.9); -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); }
.embodimentItem:hover{ box-shadow:0px 10px 10px 5px  rgba(0,105,108,.3);}

.Service{ background: url(../images/serviceBg.jpg) no-repeat center center; background-size: cover;background-attachment: fixed; position: relative;}
.serviceItem{ border: 1px solid #fff;}

.serviceItem:before{
    content: '';
    padding-top: 100%;
    box-sizing: border-box;
    display: block;
    width: 0;  
}

.serviceItem .con{
    position:absolute;
    height:100%;
    width:100%;
    left: 0;
    top: 0;   z-index: 10;      
 }
.serviceItem .pic{ width: 93px; height: 93px; }
.serviceItem .pic::after{ width: 100%; height: 100%; transition: all .36s; position: absolute; left: 0; top: 0; display: block; content: ''; background: url(../images/serviceItemIcon.png) no-repeat center center; background-size: 100% 100%; z-index: 1; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.serviceItem .pic .z5{ height: 34.4%;}
.serviceItem:hover .pic::after{ transform: rotate(90deg) scale(1.1); -webkit-transform: rotate(90deg) scale(1.1); -moz-transform: rotate(90deg) scale(1.1); -ms-transform: rotate(90deg) scale(1.1); -o-transform: rotate(90deg) scale(1.1); }


.processCon{ 
    background: url(../images/serveLine.png) no-repeat center left; background-size: 100% auto;   height: 600px; }
.processCon ul li{ position: absolute; text-align: center; width: 220PX; transition: all .36s; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.processCon ul li .info{ transition: all .36s; -webkit-transition: all .36s; height: 160px; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
 
.processCon ul li:hover .info{ box-shadow: 0 0 10px rgba(0,105 ,96, 0.3); transform: translateY(-15px); -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); }
.processCon ul li .sanBOt::after{ width: 0; height: 0; 
			border-top:14px solid #fff ;
            border-right:14px solid transparent ;
            border-bottom:14px solid transparent ;
            border-left:14px solid transparent ; line-height: 0;
			font-size: 0; display: block; content: ''; position: absolute; bottom: -28px; left: 50%; margin-left: -14px;}
.processCon ul li .sanTOp::after{ width: 0; height: 0; 
				border-top:14px solid transparent ;
				border-right:14px solid transparent ;
				border-bottom:14px solid #fff ;
				border-left:14px solid transparent ; line-height: 0;
				font-size: 0; display: block; content: ''; position: absolute; top: -28px; left: 50%; margin-left: -14px;}
.processCon ul li:nth-child(1){left: 10vw;top: 24%;}
.processCon ul li:nth-child(2){left: 19vw;top: 49%;}
.processCon ul li:nth-child(3){ left: 28%;top:18%;}
.processCon ul li:nth-child(4){left: 37.5vw;top: 57%;}
.processCon ul li:nth-child(5){left: 47vw;top: 16%;}
.processCon ul li:nth-child(6){left:60vw;top: 20.5%;}
.processCon ul li:nth-child(7){left:70vw;;top:-9%;}
.processCon ul li:nth-child(8){left:  82vw;top: 31%;}

.applyBan .txt{left: 0; padding-top: 10%;}
.applySubnav{ position: absolute; left: 0;  width: 100%;   bottom: 12%; z-index: 50;}
.applySubnav a{ transition: all .36s; display: flex; align-items: center; justify-content: center; height: 70px; border: 1px dashed #fff; margin: 0 12px; padding: 0 42px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; -webkit-transition: all .36s; -moz-transition: all .36s; -ms-transition: all .36s; -o-transition: all .36s; }
.applySubnav a.on{ background-color: #00696c; color: #fff; border: 1px solid #00696c;}
.applySubnav a:hover{ box-shadow: 0 0 10px rgba(0,105 ,96, 0.3); transform:translateY(-5px) ; border: 1px solid #00696c; background-color: #00696c; color: #fff; -webkit-transform:translateY(-5px) ; -moz-transform:translateY(-5px) ; -ms-transform:translateY(-5px) ; -o-transform:translateY(-5px) ; }
.bg-fa{ background-color: #fafafa;}
.applyOne .pic{ width: 42%;}
.applyOne .pic img{ width: 100%; height: 100%; object-fit: cover;}
.applyOne .pic .text-miao{ font-size: 140px; position: absolute; left:90%; line-height: 1; top: 0; z-index: -1; transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; }
 
.applyOne:hover .pic .text-miao{ left: 50%;}
.applyOne .txt{ width: 58%; }
.applyOne .txt .info{ padding-right: 8vw; height: calc(100% - 140px); margin-top: 140px;  }


.applyTwo .txt{  }
.applyTwo .txt .line{ width: 40px; height: 4px;}


.applyThere{ flex-direction: row-reverse;}
.applyThere .pic .text-miao{  right:100%;left: auto;   }
.applyThere:hover .pic .text-miao{ right: 50%;left: auto; }
.applyThere .txt .info{ padding-left: 8vw; padding-right: 50px;}
.schemeCon{ width: 80%; }

#CooperativeSwiper  { height: 300px; }
#CooperativeSwiper .swiper-slide{height: calc((100% - 25px) / 2);   padding-right: 1px;  }
.cooperItem img{max-width: 100%; max-height: 100%;}
/* 
.CooperativeUl li{ width: calc((100% - 101px) / 5); margin-right: 25px; margin-bottom: 25px; height: 115px;}
.CooperativeUl li img{ max-width: 100%;  max-height: 100%;}
.CooperativeUl li:nth-child(5n){ margin-right: 0;}
.CooperativeUl li:hover{ box-shadow: 0 0 0 10px #00696c; transform: scale(.9); -webkit-transform: scale(.9); -moz-transform: scale(.9); -ms-transform: scale(.9); -o-transform: scale(.9); } */
.Cooperative  .next,.Cooperative  .prev{ z-index: 20; width: 60px; height: 60px; position: absolute; top: 50%; margin-top: -40px;}
.Cooperative  .prev{ left:2vw;}
.Cooperative  .next{right: 2vw;}
.Cooperative  .next:hover,.Cooperative  .prev:hover{ background-color: #00696c; color: #fff;}
.Cooperative .swiper-button-disabled{  cursor: no-drop;}
#CooperativeSwiper .swiper-slide:hover .cooperItem{ box-shadow: 0 0 0 10px #00696c; transform: scale(.9); -webkit-transform: scale(.9); -moz-transform: scale(.9); -ms-transform: scale(.9); -o-transform: scale(.9); }

.caselist li{ width: 31.5%; margin-right:2.75% ; }
.caselist li:nth-child(3n){ margin-right: 0;}
.caselist li img{ border-radius: 10px 10px 0 0; -webkit-border-radius: 10px 10px 0 0; -moz-border-radius: 10px 10px 0 0; -ms-border-radius: 10px 10px 0 0; -o-border-radius: 10px 10px 0 0; }

.caselist li:hover .img>img{ transform:scale(1.1) ; -webkit-transform:scale(1.1) ; -moz-transform:scale(1.1) ; -ms-transform:scale(1.1) ; -o-transform:scale(1.1) ; }
.caselist li:hover{ color: #00696c; box-shadow: 0 0 10px rgba(0,0,0,.15); transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
.caselist .logo-div{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 33;}
.caselist .logo-topdiv{ position: absolute; top: 0; height: 0; bottom: 50%; background: #00696c; right: 0; left: 0; transition: all 1s; opacity: 0.8;}
.caselist .logo-bottomdiv{ position: absolute;  height: 0; bottom: 0; background:#00696c; right: 0; left: 0; transition: all 1s; opacity: 0.8;}
.caselist .logo-div img{ display: block; margin: 0 auto; top: 50%; left: 50%; transform: translate(-50%,-50%); position: absolute; z-index: 33; transition: all 0.6s; 
opacity: 0; width:45%;}
.caselist li:hover .logo-topdiv,.caselist li:hover .logo-bottomdiv{ height: 50%;}
.caselist li:hover .logo-div img{ opacity: 1; transition-delay: 0.4s;}

.newslistUl li{ width: calc((100% - 2px)/ 3);}
.newslistUl li .img img{ height: 390px; width: 100%; object-fit: cover;}
.newslistUl li:nth-child(3n){ border-right: none;}
.newslistUl li  .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;
  }
.newslistUl li:hover .tit span{  background-position: 100% calc(100% - 1px);  background-size: 100% 1px}
.newslistUl li:hover{  color: #00696c;}
.newslistUl li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }



.newsLeft{ width: 71%;}
.newsRight{ width: 25%; border-left: 1px solid #e5e2f0;}
.newsInfo img{   margin: 5px auto;}
.newsRightPage a{ display: block;}
.newsRightPage a:last-child{ margin-top:25px;}
.newsRightPage a:hover{ color: #00696c;}
.tjlist .txt{ width: calc(100% - 120px);}
.tjlist .img img{ object-fit: cover; width: 100px; height: 80px;}
.tjlist li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); }
.tjlist li:hover { color: #00696c; border-color: #00696c;}

.joblist dt{ background-color: rgba(0,105 ,96, 0.1);}
.jobIcon{ background: url(../images/jia.png) no-repeat center center #00696c; width: 60px; height: 60px; background-size: 50% auto; }
.joblist  .btn{ width: 200px; height: 58px;}
.joblist dd{ border-bottom: 2px solid #00696c; display: none; }
.joblist dl.on .jobIcon{ background: url(../images/jian.png) no-repeat center center #00696c;  background-size: 50% auto;}

.popup{ position: fixed; top: 0; left: 0; z-index: 99999;background:rgba(0, 0, 0, 0.5) none repeat scroll 0 0 !important;filter:Alpha(opacity=50); background:#000; width: 100%; height: 100%; display: none; font-size: 16px;}
.popup-table-type{ display: table;  text-align: center; width: 100%; height: 100%;}
.popup-table-cell{ display: table-cell; vertical-align: middle; height: 100%; width: 100%;}
.popup-container{ box-shadow: 0 0 10px 10px rgba(0,0,0,0.11);width: 90%; max-width: 1100px; margin:auto; padding: 0; position: relative; display: inline-block; border-radius: 10px;}
.popup-container .map{border-radius: 15px; overflow: hidden; max-width: 100%;}
.popup-container .map .con{position: absolute; bottom: 0; left: 0; width: 100%; z-index: 6; background: #fff; color: #333; padding: 15px 20px; text-align: left;}
.popup-container .map .con .h3{font-size: 20px; font-weight: bold;}
.popup-container .map .con .p{font-size: 16px;}
.popup .closed{ position: absolute;top: -30px; right: -30px; cursor: pointer; background: #000; border-radius: 100%; padding: 10px;}
.popup .closed:before{ content: "×"; font-family: "宋体"; font-size: 30px; color: #fff; line-height: 30px; }
@media (max-width:640px) {
    .popup .closed{ right: 0;}
}

.inputbox{ position:relative; line-height:44px;}
.inputbox label{ position:absolute; left:0; padding: 0 10px; color:#bfbfbf; z-index: 0; font-size: 16px;}
.inputbox .text{ width:100%;  line-height:44px;height:44px; padding:0 10px;border-radius:3px; border:1px solid #e4e4e4; background:none; position: relative; z-index: 2; font-size: 16px;transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;
}
.inputbox .text:focus{ border-color:#00696c;}

.jobpopup .popup-container{background:none;box-shadow:none; max-width: 720px;}
.jobpopup .popup-con{border-radius: 10px; overflow: inherit; background: #fff;padding-bottom: 62px;}
.jobpopup .closed{top: 2%; right: 8%; background: none;  z-index: 205;}
.jobpopup .closed:before{color: #333;}
.jobformbox{ display: none;}
.jobform .form-tit{ border-bottom: 1px solid #eee; color: #333; font-size: 24px; text-align: left; padding: 18px 10%;}
.jobform form{padding: 3% 10% 0% 10%;}
.jobform .item{text-align: left; margin-bottom: 15px;}
.jobform .item2 .selectbox{width: 48%;float: left;}
.jobform .item2 .selectbox:last-child{float: right;}
.jobform .selectbox select{display: block; background: #f9f9f9; height: 55px; padding: 10px; line-height: 30px; width: 100%; border: none; color: #999; font-size: 16px;}
.jobform .name{color: #333; font-size: 18px;}
.jobform .inputbox { position: relative; cursor: text; width: 100%; height: 50px; padding: 10px; line-height: 30px; font-size: 16px; background: #f9f9f9;}
.jobform .inputbox span.tit { position: absolute; color: #999; top: 10px; left: 10px;}
.jobform .inputbox input.text ,.jobform .inputbox select.text{ border: none; background: none; display: block; width: 100%; height: 30px; font-size: 16px;padding:0;}
.jobform .file-filestyle{ line-height: 30px; font-size: 16px; }
.jobform .file-filestyle input.text { border: none; background: none; display: block; width: 100%; height: 30px; font-size: 16px;}
.jobform .file-filestyle span.tit { color: #333; display:block; margin-bottom:15px; }
.jobform .file-filestyle .filebtn{position:relative; width: 85px; height: 80px; border:2px solid #ededed; display:inline-block; font-size:0; text-align: center; line-height: 50px; cursor: pointer;}
.jobform .file-filestyle .filebtn::before,
.jobform .file-filestyle .filebtn::after{ position:absolute; content:''; background:#ededed;}
.jobform .file-filestyle .filebtn::before{ left:20%; width:60%; height:3px; top:50%; margin-top:-1px;}
.jobform .file-filestyle .filebtn::after{ left:50%; margin-left:-1px; width:3px; top:20%; height:60%;}
.jobform .btns{padding-top: 0; text-align: center;position: absolute;bottom: -45px;left: 50%;margin-left: -85px;margin-left: -50px;}
.jobform .btn{display: inline-block; background: #00696c; font-size: 16px; color: #fff; width: 170px; height: 50px; text-align: center; line-height: 50px; border-radius: 55px; border: none; cursor: pointer;}
@media (max-width:640px) {
    .jobform .form-tit{font-size: 20px;}
    .jobform .name,.jobform .inputbox,.jobform .file-filestyle{font-size: 14px;}
    .jobform .inputbox input.text{font-size: 14px;}
    .jobform .inputbox span.tit,.jobform .file-filestyle span.tit{top: 5px;}
    .jobform .inputbox{padding: 5px 10px; line-height: 20px; height: 42px;line-height: 32px;}
    .jobform .file-filestyle{padding: 0 10px; line-height: 20px; height: 30px;}
    .jobform .file-filestyle .filebtn{line-height: 90px;width: 50px;height: 50px;}
    .jobform .btn{font-size:14px; width: 110px;height: 34px;line-height: 34px;border-radius: 30px;}
	.jobform .btns {
	    padding-top: 0;
	    text-align: center;
	    position: absolute;
	    bottom: -45px;
	    left: 50%;
	    margin-left: -50px;
	}
}

.jobform{
	position: relative;
}
 

.contactBox{ background: url(../images/contactBg.jpg) no-repeat center bottom; background-size:100% auto;}
.contactStyle .map{  height: 500px; }
.contactGbookinput{ width: 30%;}





.side_bar {

    background-color: rgb(255 255 255/ 0.95);border-radius: 5px;box-shadow: 0 0  10px 0 rgba(0, 0, 0, .15);position: fixed;right: 10px;top: 50%;width: 70px;z-index: 100
  
  }
  
  .side_bar>ul>li {height: 70px;border-bottom: 1px solid #e5e5e5;}
  
  .side_bar>ul>li a span {font-size: 12px;line-height: 2}
  
    .messageJump  { animation: messageJump .5s linear infinite; -webkit-animation: messageJump .5s linear infinite; }
  
  
  
  .side_bar>ul>li.side_bar_phone {position: relative}
  
  
  
  .side_bar>ul>li.side_bar_phone .box {
  
      -webkit-box-align: center;
  
      -ms-flex-align: center;
  
      -webkit-align-items: center;
  
      align-items: center;
  
      display: -webkit-box;
  
      display: -webkit-flex;
  
      display: -ms-flexbox;
  
      display: flex;
  
      left: 0;
  
      opacity: 0;
  
      pointer-events: none;
  
      position: absolute;
  
      top: 50%;
  
      -webkit-transform: translate(-100%, -50%);
  
      -ms-transform: translate(-100%, -50%);
  
      transform: translate(-100%, -50%);
  
      -webkit-transition: all .5s;
  
      transition: all .5s;
  
      visibility: hidden;
  
      z-index: 20
  
  }
  
  
  
  @media (max-width:1180px) {
  
      .side_bar>ul>li.side_bar_phone .box {
  
          display: none !important
  
      }
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box:after {
  
      border: 10px dashed transparent;
  
      border-left: 10px solid #fff;
  
      border-right: none;
  
      content: "";
  
      cursor: pointer;
  
      font-size: 0;
  
      height: 0;
  
      line-height: 0;
  
      overflow: hidden;
  
      -webkit-transform: translateX(-1px);
  
      -ms-transform: translateX(-1px);
  
      transform: translateX(-1px);
  
      width: 0
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner {
  
      background-color: rgb(255 255 255/ 1);
  
      border-radius: 5px;
  
      box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
  
      font-family: Manrope;
  
      font-weight: 700;
  
      padding: 15px
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner,
  
  .side_bar>ul>li.side_bar_phone .box_inner .icon {
  
      -webkit-box-align: center;
  
      -ms-flex-align: center;
  
      --tw-bg-opacity: 1;
  
      -webkit-align-items: center;
  
      align-items: center;
  
      display: -webkit-box;
  
      display: -webkit-flex;
  
      display: -ms-flexbox;
  
      display: flex
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner .icon {
  
      -ms-flex-negative: 0;
  
      -webkit-box-pack: center;
  
      -ms-flex-pack: center;
  
      background-color: rgb(243 245 247/ 1);
  
      border-radius: 9999px;
  
      -webkit-flex-shrink: 0;
  
      flex-shrink: 0;
  
      height:42px;
  
      -webkit-justify-content: center;
  
      justify-content: center;
  
      margin-right: 10px;
  
      width:42px
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner .icon svg {
  
      
  
      color: rgb(170 169 175/ 1);
  
      height: 40%;
  
      width: 40%
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner p {
  
      white-space: nowrap
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner p span {
  
      
  
      color: rgb(255 0 0/ 1);
  
      display: block;
  
      font-size: var(--20px)
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone .box_inner p em {
  
      
  
      color: rgb(148 148 148/ 1);
  
      font-size: 14px;
  
      font-style: normal
  
  }
  
  
  
  .side_bar>ul>li.side_bar_phone:hover .box {
  
      opacity: 1;
  
      pointer-events: auto;
  
      visibility: visible
  
  }
  
  
  
  .side_bar>ul>li.side_bar_wechat {
  
      position: relative
  
  }
  
  
  
  .side_bar>ul>li.side_bar_wechat .box {
  
      -webkit-box-align: center;
  
      -ms-flex-align: center;
  
      -webkit-align-items: center;
  
      align-items: center;
  
      display: -webkit-box;
  
      display: -webkit-flex;
  
      display: -ms-flexbox;
  
      display: flex;
  
      left: 0;
  
      opacity: 0;
  
      pointer-events: none;
  
      position: absolute;
  
      top: 50%;
  
      -webkit-transform: translate(-100%, -50%);
  
      -ms-transform: translate(-100%, -50%);
  
      transform: translate(-100%, -50%);
  
      -webkit-transition: all .5s;
  
      transition: all .5s;
  
      visibility: hidden;
  
      width: 120px;
  
      z-index: 20
  
  }
  
  
  
  @media (max-width:1180px) {
  
      .side_bar>ul>li.side_bar_wechat .box {
  
          -webkit-box-orient: vertical;
  
          -webkit-box-direction: normal;
  
          -webkit-box-pack: center;
  
          -ms-flex-pack: center;
  
          bottom: 54px;
  
          -webkit-flex-direction: column;
  
          -ms-flex-direction: column;
  
          flex-direction: column;
  
          -webkit-justify-content: center;
  
          justify-content: center;
  
          left: 50%;
  
          top: auto;
  
          -webkit-transform: translate(-50%);
  
          -ms-transform: translate(-50%);
  
          transform: translate(-50%)
  
      }
  
  }
  
  
  
  .side_bar>ul>li.side_bar_wechat .box:after {
  
      content: ""
  
  }
  
  
  
  @media (max-width:1180px) {
  
      .side_bar>ul>li.side_bar_wechat .box:after {
  
          border: 10px dashed transparent;
  
          border-bottom: none;
  
          border-top: 10px solid #fff;
  
          cursor: pointer;
  
          font-size: 0;
  
          height: 0;
  
          line-height: 0;
  
          overflow: hidden;
  
          -webkit-transform: translateY(-1px);
  
          -ms-transform: translateY(-1px);
  
          transform: translateY(-1px);
  
          width: 0
  
      }
  
  }
  
  
  
  @media (min-width:1180px) {
  
      .side_bar>ul>li.side_bar_wechat .box:after {
  
          border: 10px dashed transparent;
  
          border-left: 10px solid #fff;
  
          border-right: none;
  
          cursor: pointer;
  
          font-size: 0;
  
          height: 0;
  
          line-height: 0;
  
          overflow: hidden;
  
          -webkit-transform: translateX(-1px);
  
          -ms-transform: translateX(-1px);
  
          transform: translateX(-1px);
  
          width: 0
  
      }
  
  }
  
  
  
  .side_bar>ul>li.side_bar_wechat .box p {
  
      background-color: #fff;
  
      border-radius: 5px;
  
      box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
  
      padding: 5px
  
  }
  
  
  
  .side_bar>ul>li.side_bar_wechat .box p span {
  
      display: block;
  
      font-size: 12px;
  
      text-align: center;
  
      white-space: nowrap
  
  }
  
  
  
  .side_bar>ul>li.side_bar_wechat:hover .box {
  
      opacity: 1;
  
      pointer-events: auto;
  
      visibility: visible
  
  }
  
  
  
  @media (min-width:968px) {
  
      .side_bar>ul>li.side_bar_backtotop {
  
          display: none
  
      }
  
  }
  
   
  
  
  
  @media screen and (max-width:1440px) {
  
          .side_bar{ width: 60px; right: 0;}
  
          .side_bar>ul>li{ height: 60px;}
  
          .side_bar>ul>li a{ height: 60px; }
  
      }
  
      
  
      
  
  @keyframes  messageJump {
  
      0% {
  
          -webkit-transform: translateY(0);
  
          transform: translateY(0)
  
      }
  
  
  
      25% {
  
          -webkit-transform: translateY(-5px);
  
          transform: translateY(-5px)
  
      }
  
  
  
      50% {
  
          -webkit-transform: translateY(5px) scale(1.1, .9);
  
          transform: translateY(5px) scale(1.1, .9)
  
      }
  
  
  
      75% {
  
          ransform: translateY(-5px)
  
      }
  
  
  
      to {
  
          -webkit-transform: translateY(0);
  
          transform: translateY(0)
  
      }
  
  }