@charset "UTF-8";
@import url('base.css');

/* top */
header{position: fixed;z-index: 100;left: 0;width: 100%;color: #fff;background-color: rgba(0,0,0,0.6);transition: all 0.5s ease-in-out;}
header.on{background-color: rgba(0,0,0,0.4);}
header a{color: #fff;}header a:hover{color: #ffcc00;}
header .logo{transition: all 0.5s;display: none;}
header .logo img{height: 0.73rem;}
header .logo2 img{height: 0.32rem;}
header .ver{font-size: var(--font-size18);transition: all 0.5s;font-weight: var(--lighter);}
header .top{position: relative;z-index: 101;}
body:not(.homecss) .top{line-height: 0.6rem;height: 0.6rem;}
body:not(.homecss) .ver{position: absolute;left: 0;top: 0;}
body:not(.homecss) .logo2{position: absolute;left: 50%;top: 0;margin-left:-1rem;text-align: center;width: 2rem;height:0.6rem;transition: all 0.5s;display: flex;align-items: center;justify-content: center;}
body:not(.homecss) .logo2 a{line-height: normal;}
body:not(.homecss) .open-menu{position: absolute;right: 0;top: 50%;margin-top: -0.135rem;}


.open-menu{cursor: pointer;border-radius: 5px;margin-left:0.24rem;z-index:10000;width:0.25rem;overflow: hidden;transition: all 0.5s;}
.open-menu i{display: block;width:0.25rem;height:1px;background:transparent;position: relative;-webkit-transition: all 200ms cubic-bezier(.4,0,0,1);-o-transition: all 200ms cubic-bezier(.4,0,0,1);transition: all 200ms cubic-bezier(.4,0,0,1);margin:0.06rem 0;}
.open-menu i::before{content:"";display: block;width:100%;height:100%;background: #fff;position: absolute;left:0;top:0;}
.open-menu i:nth-child(1):before {
	animation: load_start_end1 2s ease-in-out infinite
}
.open-menu i:nth-child(2):before {
	animation: load_start_end1 2s ease-in-out 0.125s infinite
}
.open-menu i:nth-child(3):before{
	animation: load_start_end1 2s ease-in-out 0.25s infinite
}
@keyframes load_start_end1 {
	0% {
		opacity: 1;
		transform: translateX(0%)
	}

	23.5% {
		opacity: 1;
		transform: translateX(100%)
	}

	24.5% {
		opacity: 0;
		transform: translateX(100%)
	}

	25.5% {
		opacity: 0;
		transform: translateX(-100%)
	}

	26.5% {
		opacity: 1;
		transform: translateX(-100%)
	}

	50% {
		opacity: 1;
		transform: translateX(0%)
	}

	100% {
		opacity: 1;
		transform: translateX(0%)
	}
}
.open-menu:hover i::before{animation: none;}

menu{position: absolute;width: 100%;height: 100vh;left: 0;top: 0;z-index: 100;opacity: 0;pointer-events: none;transition: all 0.5s;}
menu:After{position: absolute;content: "";width: 100%;height: 100%;background-color: rgba(0,0,0,0.65);left: 0;top: 0;backdrop-filter: blur(5px);}
menu:before{
 position: absolute;content: "";left: 0;top: 0;width: 100%;height: 100%;transition: all 0.8s ease-in-out;opacity: 0;
 background: rgba(0, 0, 0, 0.1);
 backdrop-filter: blur(10px);
}
menu ul{height: 100vh;position: relative;z-index: 10;}
menu ul li{width:25%;height: 100vh;text-align: center;display: flex;align-items: center;justify-content: center;position: relative;opacity: 0;transition-property: all;    transition-duration: 0.5s;transform: translateY(-10%);}
menu ul li a{font-size: 0.24rem;color: #999;transition: all 0.5s;display: block;line-height: 5;width: 100%;}
menu ul li:hover a{color: #fff;}


/* animation */
menu ul li:last-child:hover::after{right: auto;left: -1px;}
menu ul li:hover::after {
  position: absolute;
  content: "";
  top: 50%;
  right: -1px;
  width: 1px; /* height: 138px; */
  height: 15vh;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(rgba(255, 255, 255, 0)),
    color-stop(75%, #dddddd),
    to(#dddddd)
  );
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    #dddddd 75%,
    #dddddd 100%
  );
  -webkit-animation: run 05s 0s infinite;
  animation: run 05s 0s infinite;
  animation-timing-function: ease;
  animation-delay: 0s;
  animation-fill-mode: none;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
  animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);
}
menu ul li::after{left: auto;right: -1px;}
@keyframes run {
  0% {
    top: -50%;
  }
  100% {
    top: 110%;
  }
}
@-webkit-keyframes run {
  0% {
    top: -50%;
  }
  100% {
    top: 110%;
  }
}

body.menu-show menu{opacity: 1;pointer-events: auto;}
body.menu-show menu li{opacity: 1;transform: translateY(0);}
body.menu-show menu li:nth-child(1),body.menu-show menu li:nth-child(1):before{transition-delay: 0.2s;}
body.menu-show menu li:nth-child(2),body.menu-show menu li:nth-child(2):before{transition-delay: 0.4s;}
body.menu-show menu li:nth-child(3),body.menu-show menu li:nth-child(3):before{transition-delay: 0.6s;}
body.menu-show menu li:nth-child(4),body.menu-show menu li:nth-child(4):before{transition-delay: 0.8s;}
body.menu-show menu li:nth-child(5),body.menu-show menu li:nth-child(5):before{transition-delay: 1s;}
body.menu-show .open-menu i::before{display: none;}
body.menu-show .open-menu i{background: #fff;}
body.menu-show .open-menu i:nth-child(2) {background: transparent;}
body.menu-show .open-menu i:nth-child(1) {transform: rotate(-45deg) translate(-0.05rem, 0.05rem);width: 0.25rem;}
body.menu-show .open-menu i:nth-child(3) {transform: rotate(45deg) translate(-0.05rem, -0.05rem);width: 0.25rem;} 
body.menu-show menu:before{opacity: 1;}
body.menu-show header .logo{opacity: 0;}
body.menu-show header .ver{opacity: 0;}
body.menu-show header .logo2{opacity: 0;}

@media(min-width:769px){
menu ul li:not(:last-child):before{border-right: 1px solid rgba(255,255,255,0.5);height: 0;transition-property: all;transition-duration: 0.5s;content: "";position: absolute;top: 0;right: 0;}
body.menu-show menu li:before{height: 100%;border-right: 1px solid rgba(255,255,255,0.12);}
}
@media(max-width:768px){
 header menu ul{flex-direction: column;justify-content: center;}
 header menu ul li{width: 100%;height: auto;}
 menu ul li:not(:first-child):before{border-bottom: 1px solid rgba(255, 255, 255, 0.12);width: 100%;height: 1px;border-right: 0;content: "";position: absolute;top: 0;right: 0;}
 menu ul li:hover::after{display: none;}
}


/* bottom */
footer{text-align: center;padding: 0.17rem;font-size: var(--font-size12);border-top: 1px solid rgba(187,187,187,0.1);color: #bbbbbb;font-weight: var(--lighter);}
footer a{color: #bbbbbb;}footer a:hover{color: #333;}
.bottomBox{position: absolute;left: 0;bottom: 0;width: 100%;z-index: 10;}

/* logo过度动画 s */
#logo-loading{position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 10;background: #fff url(../images/loading-bg.jpg);display: flex;align-items: center;justify-content: center;}
#logo-loading figure{position: relative;}
#logo-loading img{height: 1.88rem;transition: all 0.8s ease-in-out;}
#logo-loading, #mainbox {transition: opacity 2s ease-in-out;opacity: 0;}
#logo-loading.out{pointer-events: none;}
#logo-loading.out img{transform: scale(0.5);opacity: 0;}
.visible {opacity: 1 !important;}
/* logo过度动画 end */

/* home */
.homecss{overflow: hidden;}
.homecss footer{border-top: 1px solid rgba(255,255,255,0.06);color: rgba(255,255,255,0.5);position: absolute;left: 0;bottom: -100%;width: 100%;z-index: 10;transition: all 2.5s ease-in-out;}
.homecss footer a{color: rgba(255,255,255,0.5);}.homecss footer a:hover{color: rgba(255,255,255,1);}
.homecss header{top: -100%;transition: all 2.5s ease-in-out;background-color: transparent;}
.homecss .top{height: 0.91rem;}
.homecss .logo{display: block;}
.homecss .logo2{display: none;}

#mainbox.visible header{top: 0;}
#mainbox.visible footer{bottom: 0;}

.home-ban{height: 100vh;}
.home-ban .isPic{padding-top: 100vh;}
.home-ban .isPic .wap{display: none;}
.home-ban .isPic img{
 -webkit-transition: all 1.5s cubic-bezier(0.7, 0, 0.3, 1);
  transition: all 1.5s cubic-bezier(0.7, 0, 0.3, 1);
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}
.home-ban .slick-current .isPic img{-webkit-transform: scale(1); transform: scale(1);}
.home-ban .slick-arrow{display: none !important;}
@media(max-width:1024px){
  .home-ban .isPic .wap{display: block;}
  .home-ban .isPic .pc{display: none;}
}
@media(max-width:768px){
  #logo-loading img{height: 1.2rem;}
  header .logo img{height: 0.6rem;}
}

/* about */
.titHead{padding-bottom: 0.48rem;}
.titHead h2{line-height: 1;font-size: var(--font-size48);margin: 0;}

.activebg { animation-delay: 1s; animation: fadeInfilter 1.5s ease both;position: fixed;min-width:100%;height: 100%;background-attachment: fixed;background-position: center 0;background-repeat: no-repeat;background-size: cover;left: 0;top: 0;opacity: 0 !important;transition: all 0.8s ease;}
.pagebg1 { opacity: 1 !important;}
.activebg.show {opacity: 1 !important;z-index: 2;}

.fullbg .activebg{height: 115%;}

.section{overflow: hidden;position: relative;background: url(../images/loading-bg.jpg);}
.section.active hgroup h2{animation:fadeInUpSmall 2s .3s ease both;-webkit-animation:fadeInUpSmall 2s .3s ease both;-moz-animation:fadeInUpSmall 2s .3s ease both;}
.section.active .text p:nth-child(1){animation:fadeInUpSmall 2s .5s ease both;-webkit-animation:fadeInUpSmall 2s .5s ease both;-moz-animation:fadeInUpSmall 2s .5s ease both;}
.section.active .text p:nth-child(2){animation:fadeInUpSmall 2s .7s ease both;-webkit-animation:fadeInUpSmall 2s .7s ease both;-moz-animation:fadeInUpSmall 2s .7s ease both;}
.section.active .text p:nth-child(3){animation:fadeInUpSmall 2s .9s ease both;-webkit-animation:fadeInUpSmall 2s .9s ease both;-moz-animation:fadeInUpSmall 2s .9s ease both;}
.section.active .text p:nth-child(4){animation:fadeInUpSmall 2s .9s ease both;-webkit-animation:fadeInUpSmall 2s .9s ease both;-moz-animation:fadeInUpSmall 2s .9s ease both;}
.section.active .text p:nth-child(5){animation:fadeInUpSmall 2s .9s ease both;-webkit-animation:fadeInUpSmall 2s .9s ease both;-moz-animation:fadeInUpSmall 2s .9s ease both;}
.section.active .bottomBox{animation:fadeInUp 1s .5s ease both;-webkit-animation:fadeInUp 1s .5s ease both;-moz-animation:fadeInUp 1s .5s ease both;}

.fp-tableCell{vertical-align: middle;}
.contentBox{height: 100vh;display: flex;align-items: center;justify-content: center;flex-direction: column;}

.text {font-size: var(--font-size18);text-align: justify;font-weight: var(--lighter);}
.text p{margin-top: 0;}
.text p:last-child{margin-bottom: 0;}

.numList li{flex: 1;text-align: center;position: relative;}
.numList li:not(:last-child):after{top: 0.36rem;right: 0;width: 1px;content: "";position: absolute;background-color: #000000;height: calc(100% - 0.51rem);}
.numList .num{line-height: 2.16rem;display: inline-block;position: relative;}
.numList .num span{font-size:2rem;font-weight: bold;}
.numList .num span i{font-style:normal;}
.numList .num sup{font-size:0.72rem;line-height: 1.5;position: absolute;left: 100%;top: 0;width: 0.8rem;height: 50%;overflow: hidden;text-align: left;}
.numList p{margin: 0;font-size:var(--font-size30);}

.about-page1{background-image: none;}
.about-page1:after{background-color: rgba(0,0,0,0.7);left: 0;top: 0;width: 100%;height: 100%;content: "";position: absolute;z-index: 0;}
.about-page1{color: #fff;}
.about-page1 .auto-inner{max-width: 10.34rem;}
.about-page1 .logo {width: 31.91%;position: relative;}
.about-page1 .logo:after{right: 0;top: 0;width: 1px;height: 0;content: '';position: absolute;background-color: rgba(255,255,255,1);transition: height 0.5s ease ;}
.about-page1 .logo img{height: 2rem;}
.about-page1 .content {width: 53.38%;}
.about-page1 .content .logo{display: none;}
.about-page1 .logo:after{animation-name: line100; animation-duration: 1000ms; animation-timing-function: linear;animation-fill-mode: forwards; animation-play-state: running; animation-delay: 0ms;background-color: rgba(255,255,255,0.35);}
.about-page1.active .logo img{animation:fadeInRightSmall 0.5s .3s ease both;-webkit-animation:fadeInRightSmall 0.5s .3s ease both;-moz-animation:fadeInRightSmall 0.5s .3s ease both;}
@keyframes line100{
	0%{height:0;}
	100%{height: calc(100% - 0.06rem);}
}
.about-page1.active hgroup h2{animation:fadeInUpSmall 1s .3s ease both;-webkit-animation:fadeInUpSmall 1s .3s ease both;-moz-animation:fadeInUpSmall 1s .3s ease both;}
.about-page1.active .text p:nth-child(1){animation:fadeInUpSmall 1s .5s ease both;-webkit-animation:fadeInUpSmall 1s .5s ease both;-moz-animation:fadeInUpSmall 1s .5s ease both;}
.about-page1.active .text p:nth-child(2){animation:fadeInUpSmall 1s .7s ease both;-webkit-animation:fadeInUpSmall 1s .7s ease both;-moz-animation:fadeInUpSmall 1s .7s ease both;}
.about-page1.active .text p:nth-child(3){animation:fadeInUpSmall 1s .9s ease both;-webkit-animation:fadeInUpSmall 1s .9s ease both;-moz-animation:fadeInUpSmall 1s .9s ease both;}

@media(max-width:768px){
  .fullbg .activebg{height: 125%;}
  .titHead h2{font-size: var(--font-size38);}
  .about-page1 .logo{width: 26%;}
  .about-page1 .logo img{height: 1.2rem;}
  .about-page1 .content{width: 62%;}
  .numList .item{flex: none;width: 50%;}
  .numList .num span{font-size: 1rem;}
}
@media(max-width:480px){
  .about-page1 .logo{width: 100%;text-align: center;border-right: 0;padding-bottom: 0.25rem;display: none;}
  .about-page1 .logo:after{display: none;}
  .about-page1 .logo img{height: 0.6rem;}
  .about-page1 .content .titHead{text-align: center;}
  .about-page1 .content{width: 100%;}
  .about-page1 .content .logo{display: block;}
  .text{height: 50vh;overflow-y: auto;overflow-x: hidden;}
  .numList .num{line-height: 1.4rem;}
  .numList .num span{font-size: 0.65rem;}
  .numList .num sup{font-size: 0.32rem;line-height: 2.58;top: 0.08rem;}
  .numList p{font-size: var(--font-size20);}
}

/* page2 */
.about-page2{color: #000000;}
.about-page2 .auto-inner{max-width: 16rem;width: 94%;}
.about-page2.active .item:nth-child(1){animation:fadeInRightSmall 2s .5s ease both;-webkit-animation:fadeInRightSmall 2s .5s ease both;-moz-animation:fadeInRightSmall 2s .5s ease both;}
.about-page2.active .item:nth-child(2){animation:fadeInLeftSmall 2s .65s ease both;-webkit-animation:fadeInLeftSmall 2s .65s ease both;-moz-animation:fadeInLeftSmall 2s .65s ease both;}
.about-page2.active .item:nth-child(3){animation:fadeInLeftSmall 2s .8s ease both;-webkit-animation:fadeInLeftSmall 2s .8s ease both;-moz-animation:fadeInLeftSmall 2s .8s ease both;}

.about-page3 .titHead h2{color: #333;}
.about-page3 .text{color: #000000;}

.about-page4 {color: #fff;background-image: none;}
.about-page4 .auto-inner{max-width: 16rem;width: 94%;}
.about-page4 .isBg:after{background-color: rgba(0,0,0,0);left: 0;top: 0;width: 100%;height: 100%;content: "";position: absolute;z-index: 2;transition: all 0.8s;}
.about-page4 .numList li:not(:last-child):after{background-color: rgba(255,255,255,0.46);}
.about-page4.active .item:nth-child(1){animation:fadeInRightSmall 1s .5s ease both;-webkit-animation:fadeInRightSmall 1s .5s ease both;-moz-animation:fadeInRightSmall 1s .5s ease both;}
.about-page4.active .item:nth-child(2){animation:fadeInLeftSmall 1s .65s ease both;-webkit-animation:fadeInLeftSmall 1s .65s ease both;-moz-animation:fadeInLeftSmall 1s .65s ease both;}
.about-page4.active .item:nth-child(3){animation:fadeInLeftSmall 1s .8s ease both;-webkit-animation:fadeInLeftSmall 1s .8s ease both;-moz-animation:fadeInLeftSmall 1s .8s ease both;}
.about-page4.active .isBg:after{background-color: rgba(0,0,0,0.6);}


/* 服务 */
.section.blankbg{background-image: none;}
.team-page.active hgroup h2{animation:fadeInUpSmall 2s .3s ease both;-webkit-animation:fadeInUpSmall 2s .3s ease both;-moz-animation:fadeInUpSmall 2s .3s ease both;}
.team-page.active .text p:nth-child(1){animation:fadeInUpSmall 2s .5s ease both;-webkit-animation:fadeInUpSmall 2s .5s ease both;-moz-animation:fadeInUpSmall 2s .5s ease both;}
.team-page.active .text p:nth-child(2){animation:fadeInUpSmall 2s .7s ease both;-webkit-animation:fadeInUpSmall 2s .7s ease both;-moz-animation:fadeInUpSmall 2s .7s ease both;}
.team-page.active .text p:nth-child(3){animation:fadeInUpSmall 2s .9s ease both;-webkit-animation:fadeInUpSmall 2s .9s ease both;-moz-animation:fadeInUpSmall 2s .9s ease both;}
.team-page.active .text p:nth-child(4){animation:fadeInUpSmall 2s .9s ease both;-webkit-animation:fadeInUpSmall 2s .9s ease both;-moz-animation:fadeInUpSmall 2s .9s ease both;}
.team-page.active .text p:nth-child(5){animation:fadeInUpSmall 2s .9s ease both;-webkit-animation:fadeInUpSmall 2s .9s ease both;-moz-animation:fadeInUpSmall 2s .9s ease both;}

/* 联系 */
.pageBan{padding-top: 100vh;position: relative;overflow: hidden;}
.pageBan span{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-position: center center;background-size: cover;}

.contact-page{font-weight: var(--lighter);font-size: var(--font-size16);}
.contact-page .title{padding-bottom: 0.3rem;}
.contact-page .title h2{line-height: 0.69rem;font-size: var(--font-size30);color: #000000;display: inline-block;position: relative;border-bottom: 1px solid #000000;margin: 0;}
.contact-page .title h2:after{position: absolute;left: 0;bottom: -1px;height: 1px;width: 0;transition: all 0.5s ease-in-out;content: "";background-color: rgba(0,0,0,0.2);}
.contact-page .item:not(:last-child){padding-bottom: 0.25rem;min-height: 2.34rem;}
.contact-page .item .tab{margin-bottom: 0.2rem;font-size: var(--font-size22);color: #000000;}
.contact-page .item .tab span{cursor: pointer;color: #767676;}
.contact-page .item .tab span:not(:last-child){margin-right: 0.4rem;}
.contact-page .item .tab span.on{color: #000000;font-weight: bold;}
.contact-page .item .con{display: none;}
.contact-page .item p{margin: 0 0 0.14rem;color: #333333;}
.contact-page .item p:last-child{margin-bottom: 0;}

.contact-page .contact{width: 45%;}
.contact-page .message{width: 48%;}
.contact-page form{margin-top: 0.09rem;}
.contact-page .formItem{padding-bottom: 0.2rem;position: relative;}
.contact-page .formItem .text{width: 100%;height: 0.5rem;padding: 0 0.18rem;background-color: #fff;border: 1px solid #e6e6e6;}
.contact-page .formItem textarea.text{height: 1.2rem;padding-top: 0.1rem;padding-bottom: 0.1rem;}
.contact-page .formItem label{color: #999999;position: absolute;left: 0.18rem;top: 0;line-height: 0.5rem;transition: all 0.5s;}
.contact-page .formItem label i{font-style: normal;margin-left: 0.12rem;}
.contact-page .formItem.on label{color: #fff;background-color: #000;line-height: 0.28rem;top:-0.28rem;padding:0 0.1rem;box-shadow: 0 0 10px rgba(0,0,0,0.1);}

.contact-page .formItem .tip{padding: 0 0 0 0.19rem;}
.contact-page .formItem .text:focus{border-color: #bebebe;box-shadow: 0 0 12px rgba(0,0,0,0.15);}

.contact-page.active .contact{animation:fadeInRightSmall 2s .5s ease both;-webkit-animation:fadeInRightSmall 2s .5s ease both;-moz-animation:fadeInRightSmall 2s .5s ease both;}
.contact-page.active .message{animation:fadeInLeftSmall 2s .5s ease both;-webkit-animation:fadeInLeftSmall 2s .5s ease both;-moz-animation:fadeInLeftSmall 2s .5s ease both;}

button.btn{border: 1px solid #000;width: 1.5rem;height: 0.5rem;background-color: #fff;font-size: var(--font-size18);font-weight: var(--lighter);position: relative;overflow: hidden;cursor: pointer;}
button.btn:After{left: 33%;top: 33%;width: 33%;height: 33%;background-color: #000;transition: all 0.5s ease-in-out;position: absolute;content: "";opacity: 0;}
button.btn span{position: relative;z-index:1;}
button.btn:hover{color: #fff;}
button.btn:hover:after{width: calc(100% + 2px);height: calc(100% + 2px);left: 0;top: 0;opacity: 1;}
button.btn.white{background-color: rgba(255,255,255,0.27);color: #fff;border:0;}
button.btn.white:after{background-color: #fff;}
button.btn.white:hover{color: #000;}

@media(max-width:768px){
  .overScroll{max-height: 80vh;overflow-y: auto;overflow-x: hidden;}
  .contact-page .contact{width: 100%;}
  .contact-page .message{width: 100%;}
  .contact-page .item:not(:last-child){min-height: auto;}
  .contact-page.active .contact{padding-bottom: 0.25rem;}
}
@media(max-width:480px){
  .contact-page .item .tab{display: flex;justify-content: space-between;}
  .contact-page .item .tab span:not(:last-child){margin-right: 0;}
}


/* 项目 */
.product-page{height: 100vh;position: relative;overflow: hidden;}
.product-page .slider-thumbs{width: 22.91%;background-color: rgba(0,0,0,0.5);height: 5.65rem;padding: 0.4rem 0;border-right: 2px solid #525252;overflow: hidden;}
.product-page .slider-thumbs .slick-list{overflow-y: auto;height: 4.81rem !important;}
.product-page .slider-thumbs .slick-track{transform: translate3d(0px, 0, 0px) !important;}
.product-page .slider-thumbs .item{cursor: pointer;line-height: 0.37rem;padding: 0 0.2rem 0 0.5rem;color: rgba(255,255,255,0.3);}
.product-page .slider-thumbs .item.slick-current{color: rgba(255,255,255,1);font-weight: bold;}
.product-page .slider-thumbs .item:hover{color: rgba(255,255,255,1);}

.product-page .slider-info{width: calc(100% - 22.91%);position: relative;overflow: hidden;height: 5.65rem;}
.product-page .slider-info .isPic{padding-top: 5.65rem;background-color: rgba(0, 0, 0, 0.5);}
.product-page .slider-info .isPic img{object-fit: contain;}
.product-page .slider-info  img.lazy{width: 0.32rem;height: 0.32rem;}

.product-page .slider-bg{width: 100%;height: 100vh;position: absolute;left: 0;top: 0;}
.product-page .slider-bg .isPic:after{width: 100%;height: 100vh;position: absolute;left: 0;top: 0;content: "";background-color: rgba(0,0,0,0.8);}
.product-page .slider-bg .isPic{padding-top: 100vh;}
.product-page .slick-dots{bottom: 0.2rem;}

.isForm{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 10;color: #fff;text-align: center;display: none;}
.isForm .inner{display: flex;align-items: center;justify-content: center;position: absolute;left: 0;top: 0;width: 100%;height: 100%;flex-direction: column;}
.isForm .tip{margin-bottom: 0.36rem;text-align: center;}
.isForm form{text-align: left;display: inline-block;width: 5.2rem;font-weight: var(--lighter);}
.isForm .formItem{padding-bottom: 0.2rem;position: relative;}
.isForm .formItem .text{width: 100%;height: 0.5rem;padding: 0 0.18rem;background-color: rgba(255,255,255,0.27);border: 0;}
.isForm .formItem .text:focus{background-color: #fff;}
.isForm .formItem label{color: #fff;position: absolute;left: 0.18rem;top: 0;line-height: 0.5rem;transition: all 0.5s;}
.isForm .formItem label i{font-style: normal;margin-left: 0.12rem;}
.isForm .formItem.on label{color: #fff;background-color: #000;line-height: 0.28rem;top:-0.28rem;padding:0 0.1rem;box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.formshow .isPic img{filter: blur(20px);}
.formshow .isPic:before{position: absolute;left: auto;top: 0;width: 100%;height: 100%;background: url(../images/formbg.png) no-repeat center center/cover;content: "";z-index: 1;}

@media(max-width:768px){
  .product-page .slider-thumbs{width: 100%;height: 2.6rem;margin-bottom: 0.2rem;padding: 0.2rem 0;}
  .product-page .slider-thumbs .slick-list{height: 2.2rem !important;}
  .product-page .slider-thumbs .item{padding-left: 0.3rem;}
  .product-page .slider-info{width: 100%;height:4rem;}
  .product-page .slider-info .isPic{padding-top: 4rem;}
  .isForm .tip{width: 86%;margin: 0px auto 0.25rem;}
  .isForm form{width: 86%;}
  .isForm .formItem .text{height: 0.4rem;}
  .isForm .formItem label{line-height: 0.4rem;}
  button.btn{height: 0.35rem;}
}
@media(max-width:480px){
  .product-page .slider-info{height:3.2rem;}
  .product-page .slider-info .isPic{padding-top: 3.2rem;}
}

/* 团队 */
.service-page{color: #fff;background: url(../images/servicebg.jpg);}
.service-page .title{padding-bottom: 0.35rem;}
.service-page .title h2{font-size: var(--font-size50);margin: 0;}
.service-page .title .desc {margin-top: 0.1rem;font-size: var(--font-size16);max-height: 7.5em;overflow-y: auto;}
.service-page .title .desc p{margin: 0;color: rgba(255,255,255,0.7);}
.service-page.one .fp-tableCell{vertical-align:bottom;}

.service-page .leader{position: relative;flex-wrap: nowrap;transition: all 0.8s ease-in-out;}
.service-page .leader .slider {visibility: hidden;height: 7.1rem;opacity: 0;transition: opacity 0.5s ease-in-out;}
.service-page .leader .slider.slick-initialized { visibility: visible;}
.service-page .leader:after{position: absolute;left: 50%;top: 0;height: 100%;content: "";width: 1px;background-color: rgba(255,255,255,0.1);}
.service-page .leader .item{position: relative;z-index: 1;width: 7.1rem;transition: all 0.8s ease-in-out;overflow: hidden;}
.service-page .leader .item:nth-child(2){flex-direction: row-reverse;}

.service-page .leader .head{position: relative;cursor: pointer;width: 5rem;margin: 0px auto;}
.service-page .leader .head .info{position: absolute;bottom: 0;width: 100%;left: 0;z-index: 2;}
.service-page .leader .head .name{background-color: rgba(0,0,0,0.6);padding: 0.2rem 0.4rem;transition: all 0.5s ease-in-out;}
.service-page .leader .head .name h3{margin: 0;font-size: var(--font-size26);}
.service-page .leader .head .name p{margin: 0;font-size: var(--font-size18);font-weight:var(--lighter);line-height: 1.5;}
.service-page .leader .head .txt{background-color: rgba(0,0,0,0.6);padding: 0.2rem 0.4rem;color: rgba(rgba(255,255,255,0.5));font-weight:var(--lighter);display: none;font-size: var(--font-size16);}
.service-page .leader .head .txt p{margin: 0;}
.service-page .leader .head .scroll{max-height: 2.1rem;overflow-y: auto;}

.service-page .leader .head .isPic{padding-top: 7.1rem;}
.service-page .leader .showContent{width: 0;position: relative;opacity: 0;transition: all 0.8s ease-in-out;flex-shrink: 0;}
.service-page .leader .showContent .isPic{padding-top: 7.1rem;}
.service-page .leader .slick-dots{bottom: 0.2rem;}
.service-page .leader .slick-dots li button{background-color: rgba(255,255,255,0.65);}
.service-page .leader .back{background-color: rgba(0,0,0,0.3);color: #fff;display: flex;align-items: center;justify-content: center;position:absolute;line-height: 0.4rem;width: 1.05rem;top: 0.4rem;right: 0;z-index: 10;border-radius: 0.4rem;font-weight:var(--lighter);cursor: pointer;font-size: var(--font-size16);opacity: 0;transition: all 1s 0.8s ease-in-out;}
.service-page .leader .back:after{transition: all 0.5s ease-in-out;left: 33%;top: 33%;width: 33%;height: 33%;background-color: #000;position: absolute;content: "";opacity: 0;border-radius: 0.4rem;}
.service-page .leader .back:hover:after{left: 0;top: 0;width: 100%;height: 100%;opacity: 1;}
.service-page .leader .back span{position: relative;z-index: 1;display: flex;align-items: center;justify-content: center;}
.service-page .leader .back span:before{width: 0.18rem;height: 0.16rem;margin-right: 0.09rem;content: "";background: url(../images/back.svg) no-repeat center center/contain;display: inline-block;}

/* 点击切换后的样式 */
.service-page .leader.autoOn{margin-right: -5.45rem;justify-content: flex-start;}
.service-page .leader.autoOn:after{display: none;}
.service-page .leader.autoOn .item.on .showContent{width: calc(100% - 5rem);opacity: 1;}
.service-page .leader.autoOn .item.on .back{right: 0.87rem; opacity: 1;}
.service-page .leader.autoOn .item.on .head .name{background-color: transparent;}
.service-page .leader.autoOn .item.on .head .txt{display: block;}
.service-page .leader .item.on {width: 100%;}
.service-page .leader .item.on .slider.fade-in {opacity: 1;}
.service-page .leader .slider-container {flex-grow: 1;display: flex;align-items: center;justify-content: center;}
.service-page .leader.autoOn2{margin-left: -5.45rem;margin-right: 0;}

.service-page .list{margin-top: 0rem;}
.service-page .list .item{vertical-align: top;/*border:0.03rem solid #fff;*/position: relative;overflow: hidden;}
.service-page .list .info{position: absolute;left: 0;bottom: -100%;width: 100%;z-index: 10;background-color: rgba(0,0,0,0.7);color: #fff;padding: 0rem 0.15rem;opacity: 0;transition: all 0.5s ease-in-out;}
.service-page .list .info h3{font-size: var(--font-size20);margin: 0;}
.service-page .list .info p{margin: 0;font-size: var(--font-size16);font-weight: var(--lighter);}
.service-page .list .item:hover .info{bottom: 0rem;opacity: 1;}
.service-page .list .slick-slide div{overflow: hidden;}
.service-page .list .slick-slide .isPic:after{width: 0.03rem;left: 0;top: 0;height: 100%;content: "";background-color: #fff;position: absolute;z-index: 1;}
.service-page .list .slick-current .isPic:after{display: none;}
.service-page .list .isPic{padding-top: 100%;cursor: pointer;filter: grayscale(100%);transition: filter 0.5s ease;}
.service-page .list .item:hover .isPic{filter: grayscale(0%);}
.service-page .list .slick-slide > div:nth-child(1) .isPic:before{width: 100%;left: 0;bottom: 0;height: 0.03rem;content: "";background-color: #fff;position: absolute;z-index: 1;}
.service-page .list .slick-prev{left: -0.55rem;}
.service-page .list .slick-prev:hover{left: -0.55rem;}
.service-page .list .slick-next{right: -0.55rem;}
.service-page .list .slick-next:hover{right: -0.55rem;}

.service-page.active .leader .item{animation:zoomInSmall 2s .7s ease both;-webkit-animation:zoomInSmall 2s .7s ease both;-moz-animation:zoomInSmall 2s .7s ease both;}

.service-page.active .title h2{animation:fadeInUpSmall 2s .5s ease both;-webkit-animation:fadeInUpSmall 2s .5s ease both;-moz-animation:fadeInUpSmall 2s .5s ease both;}
.service-page.active .title .desc{animation:fadeInUpSmall 2s .6s ease both;-webkit-animation:fadeInUpSmall 2s .6s ease both;-moz-animation:fadeInUpSmall 2s .6s ease both;}
.service-page.active .list .item{animation:zoomInSmall 2s .7s ease both;-webkit-animation:zoomInSmall 2s .7s ease both;-moz-animation:zoomInSmall 2s .7s ease both;}

@media(min-width:1921px){
  .service-page.one .fp-tableCell{vertical-align:middle;}
}
@media(max-width:1366px){
  .service-page .leader .item{width: 6.39rem;}
  .service-page .leader .head{width: 4.5rem;}
  .service-page .leader .head .isPic{padding-top: 6.39rem;}
  .service-page .leader .showContent .isPic{padding-top: 6.39rem;}
  .service-page .leader .slider{height: 6.39rem;}
}
@media(max-width:1024px){
   .service-page.one .fp-tableCell{vertical-align:middle;}
}
@media(max-width:768px){
  .service-page .leader .showContent{position: absolute;transition: all 0s;}
  .service-page .leader .item{width: 4.26rem;transition: all 0s;}
  .service-page .leader .head{width: 3rem;}
  .service-page .leader .head .isPic{padding-top: 4.26rem;}
  .service-page .leader .showContent .isPic{padding-top: 3rem;}
  .service-page .leader .slider{height: 3rem;}
  .service-page .leader .head .txt{padding: 0.2rem;}
  .service-page .leader .head .name{padding: 0.2rem;}
  .service-page .title h2{font-size: var(--font-size38);}
  .service-page .leader{align-items: flex-end;}
  .service-page .leader.autoOn{margin-right: -3.1rem;}
  .service-page .leader.autoOn .item.on .showContent{width: calc(100% - 0rem);}
  .service-page .leader.autoOn .item.on .showContent{position: relative;}
  .service-page .leader.autoOn .item.on .head{width: 100%;margin-top: 0.2rem;}
  .service-page .leader.autoOn .item.on .head .isPic{width: 40%;}
  .service-page .leader.autoOn .item.on .head .info{width: 60%;left: 40%;}
  .service-page .leader.autoOn .item.on .head .scroll{max-height: 1.5rem;}

  .service-page .leader.autoOn2{margin-left: -3.1rem;margin-right: 0;}

  .service-page .title .desc{max-height: 1.9rem;overflow-y: auto;}
}
@media(max-width:480px){
  .service-page .leader.autoOn{margin-right: -2rem;}
  .service-page .leader.autoOn2{margin-left: -2rem;margin-right: 0;}
  .service-page .leader .item{width: 2.8rem;}
  .service-page .leader .head{width: 2rem;}
  .service-page .leader .head .isPic{padding-top: 2.8rem;}
  .service-page .leader .head .name h3{font-size: var(--font-size22);}

  .service-page .list .info h3{font-size: var(--font-size18);}
}
@media screen and (min-width:769px) and (max-width:1366px){
	.service-page .title h2{font-size:0.3rem;}
	.service-page .title {padding-bottom: 0.2rem;}
	.service-page .list .isPic{padding-top: 92%;}
}
footer a:hover {
	color: #bbbbbb;
}
.product-page .slider-info .isPic {
    background-color: rgba(153, 153, 153, 0.5);
}