.product-line {position: relative;height: 100vh;overflow: hidden;}
.product-swiper {height: 100%;}
.pro-slide {overflow: hidden; position: relative;}
@media (max-width:1200px){
.product-line {height: 80vh;}
}
.pro-slide.swiper-slide-active figure img {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-webkit-transition: 5s linear;
-o-transition: 5s linear;
-moz-transition: 5s linear;
transition: 5s linear;
}
.pro-slide.swiper-slide-active .product-pg img {
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
.pro-slide.swiper-slide-active .pro-text h4 {
opacity: 1;
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-ms-transform: translateY(0px);
-o-transform: translateY(0px);
transform: translateY(0px);
-webkit-transition-delay: 0.3s;
-moz-transition-delay: 0.3s;
-o-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.pro-slide.swiper-slide-active .pro-text strong,
.pro-slide.swiper-slide-active .pro-text p,
.pro-slide.swiper-slide-active .pro-text span {
-webkit-clip-path: inset(0 0 0 0);
clip-path: inset(0 0 0 0);
-webkit-transition-delay: 0.5s;
-moz-transition-delay: 0.5s;
-o-transition-delay: 0.5s;
transition-delay: 0.5s;
}
.pro-slide.swiper-slide-active .pro-text p {
-webkit-transition-delay: 0.75s;
-moz-transition-delay: 0.75s;
-o-transition-delay: 0.75s;
transition-delay: 0.75s;
}
.pro-slide.swiper-slide-active .pro-text span {
-webkit-transition-delay: 1s;
-moz-transition-delay: 1s;
-o-transition-delay: 1s;
transition-delay: 1s;
}
.pro-slide a {
display: block;
}
.pro-slide figure {
display: block;
line-height: 1;
overflow: hidden;
}
.pro-slide figure .pcimg{display: block;}
.pro-slide figure .telimg{display: none;}
@media screen and (max-width: 1200px) {
  .pro-slide figure .pcimg{display: none;}
.pro-slide figure .telimg{display: block;}  
}
.pro-slide figure img { 
display: block;
position: relative;
-webkit-transform: scale(1.15);
-moz-transform: scale(1.15);
-ms-transform: scale(1.15);
-o-transform: scale(1.15);
transform: scale(1.15);
-webkit-transition: 1.8s 1s;
-o-transition: 1.8s 1s;
-moz-transition: 1.8s 1s;
transition: 1.8s 1s;
}
.pro-text {position: absolute;width: 90%;left: 8%;top: 45%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);}
.pro-text h4 {
display: block;
position: relative; z-index: 2;
padding-bottom: 72px;
line-height: 1;
color: #fff;
font-size: 3.7rem;
opacity: 0;
-webkit-transform: translateY(-50px);
-moz-transform: translateY(-50px);
-ms-transform: translateY(-50px);
-o-transform: translateY(-50px);
transform: translateY(-50px);
-webkit-transition: 0.58s;
-o-transition: 0.58s;
-moz-transition: 0.58s;
transition: 0.58s;
}
.pro-text h4:before {
position: absolute;
left: 0;
bottom: 0;
content: "";
width: 46px;
height: 2px;
background: #fff;
}
.pro-text i{position: absolute;left:0;top:-12%;font-style:normal;font-size: 8rem;color: #fff;text-transform: uppercase;opacity:0.1;z-index: 1;font-family: neutra_text_tf;}
.pro-text strong {
display: block;
margin-top: 35px;
margin-bottom: 40px;
line-height: 1.2;
color: #fff;
font-size: 2rem;
-webkit-clip-path: inset(0 100% 0 0);
clip-path: inset(0 100% 0 0);
-webkit-transition: -webkit-clip-path 1s;
transition: -webkit-clip-path 1s;
-o-transition: clip-path 1s;
-moz-transition: clip-path 1s;
transition: clip-path 1s;
transition: clip-path 1s, -webkit-clip-path 1s;
}
.pro-text p {
color: #fff;
font-size: 1.2rem;line-height: 1.6;
width: 52%;
overflow: hidden;
display: -webkit-box;
display: -ms-box;
display: -ms-flexbox;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
-webkit-clip-path: inset(0 100% 0 0);
clip-path: inset(0 100% 0 0);
-webkit-transition: -webkit-clip-path 1s;
transition: -webkit-clip-path 1s;
-o-transition: clip-path 1s;
-moz-transition: clip-path 1s;
transition: clip-path 1s;
transition: clip-path 1s, -webkit-clip-path 1s;
}
.pro-text p b {
font-weight: bold;
}
.pro-text span {
position: relative;
z-index: 3;
margin-top: 42px; padding:0 50px 0 0;
display: inline-block;
color: #fff;
font-size: 16px;
-webkit-clip-path: inset(0 100% 0 0);
clip-path: inset(0 100% 0 0);
-webkit-transition: -webkit-clip-path 0.5s;
transition: -webkit-clip-path 0.5s;
-o-transition: clip-path 0.5s;
-moz-transition: clip-path 0.5s;
transition: clip-path 0.5s;
transition: clip-path 0.5s, -webkit-clip-path 0.5s;
}
.pro-text span:before {
content: "";
width: 33px;
height: 16px;
background:url(../sichuan/jiantou.png);
position: absolute;
right: 0;
bottom: 0;
transition: 0.3s;
z-index: -1;
}
.pro-text span:hover,
.pro-text span.active {
color: #fff;
}
.pro-text span:hover:before,
.pro-text span.active:before {
right: 5px;
}
.product-pg {
position: absolute;
right: 14.58%;
top: 7%;
height: 100%;
}
.product-pg img {
display: block;
height: 79%;
width: auto;
-webkit-transition: 2s;
-o-transition: 2s;
-moz-transition: 2s;
transition: 2s;
opacity: 0;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.product-tab-btn {
position: absolute;
left: 0;
bottom: 66px;
z-index: 10;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 7.8%;
width: 100%;
border-top: 1px dashed rgba(255, 255, 255, 0.4);
}
.product-tab-list {
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
position: relative;
}
.product-tab-list li {
position: relative;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1; margin:-78px 0 0 0
}
.product-tab-list li .product-wr img{display: block;width:52px;margin:  0 auto 33px auto;}
.product-tab-list li:hover i:before,
.product-tab-list li.active i:before {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}

.product-tab-list li .product-wr {
display: inline-block;
}

@media (max-width: 1200px) {
.product-tab-list li{width: 33.3%;}
}
.product-tab-list li.active:before {
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
-ms-transform: scaleX(1);
-o-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-ms-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
-webkit-transition: 2s 1.5s linear transform;
-o-transition: 2s 1.5s linear transform;
-moz-transition: 2s 1.5s linear transform;
transition: 2s 1.5s linear transform;
}


.product-tab-list li:last-child {
-webkit-flex: none;
-moz-box-flex: 0;
-ms-flex: none;
flex: none;
}
.product-tab-list li:last-child:before {
width: 14vw;
left: 17px;
}
.product-tab-list li:before {
position: absolute;
left: 33px;
top: 77px;
content: "";
width: 100%;
height: 1px;
background: #fff;
-webkit-transform: scaleX(0);
-moz-transform: scaleX(0);
-ms-transform: scaleX(0);
-o-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right center;
-moz-transform-origin: right center;
-ms-transform-origin: right center;
-o-transform-origin: right center;
transform-origin: right center;
-webkit-transition: 2s 0s linear transform;
-o-transition: 2s 0s linear transform;
-moz-transition: 2s 0s linear transform;
transition: 2s 0s linear transform;
}
.product-tab-list li i {
display: block;
position: relative;
margin: auto;
margin-top: -4px;
width: 8px;
height: 8px;
background: #fff;
border-radius: 50%;
}
.product-tab-list li i:before {
position: absolute;
left: 50%;
top: 50%;
margin-left: -8px;
margin-top: -8px;
content: "";
width: 16px;
height: 16px;
background: rgba(255, 255, 255, 0.2);
border-radius: 50%;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
-webkit-transition: 0.45s cubic-bezier(0.86, 0, 0.07, 1);
-o-transition: 0.45s cubic-bezier(0.86, 0, 0.07, 1);
-moz-transition: 0.45s cubic-bezier(0.86, 0, 0.07, 1);
transition: 0.45s cubic-bezier(0.86, 0, 0.07, 1);
}
.product-tab-list li span {
display: block;
text-align: center;
margin-top: 20px;
line-height: 1;
color: #fff;
font-size:1.4rem; transition: 0.5s;
}
.product-tab-list li.active span{font-weight: bold; font-size: 1.4rem;}
.pro-numble {position: absolute;left: 8%;top: 140px;line-height: 1;display: -webkit-flex;display: -moz-box;display: -ms-flexbox;display: flex;color: #fff;font-size: 1.8rem;z-index: 10;
-webkit-align-items: flex-end;-moz-box-align: end;-ms-flex-align: end;align-items: center;}
.pro-numble b {position: relative;margin-right: 14px;font-size: 2.8rem;font-weight: normal; font-family: 'aven';}
.pro-numble span {margin-left: 4px;}
@media only screen and (max-width:1800px){ 
.product-tab-btn{padding: 0 5.5%;}
.pro-numble{ left: 5.5%;}
.product-pg { right: 6%;}
.pro-text{ left: 5.5%;}
.pro-text h4{font-size: 3rem;}
}
@media only screen and (max-width:1650px){ 
.pro-text strong{}
}
@media only screen and (max-width:1440px){ 
.pro-text h4{font-size: .28rem;}

.pro-text h4{ padding-bottom: 40px;}
.pro-text strong{    margin-top: 30px; margin-bottom: 30px;font-size: 32px;}
.pro-text span{  font-size: 15px;}
.pro-text p{font-size: 20px;}
}
@media only screen and (max-width:1200px){ 

.product-tab-list li .product-wr img{width:51px;}
.pro-numble{top: 70px;}
.product-tab-list li.active span{font-size: 16px;}
.pro-text p{    width: 100%;font-size:16px;}
.pro-text i{font-size:36px;}
.pro-text h4{ padding-bottom: 30px;font-size: 0.24rem;}
.pro-text strong{    margin-top: 20px;font-size:23px;}
.product-pg {
height: 60%;
top: auto;
bottom: 5%;
}
.pro-text {
left: 3%;
right: 3%;
bottom: auto;
top: 160px;
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
-ms-transform: translateY(0px);
-o-transform: translateY(0px);
transform: translateY(0px);
}

.product-tab-list li span{font-size: 16px;}
.product-tab-btn{    padding: 0 1.5%;}
}