#pinContainer {width: 100%;padding-top: 60px;-webkit-perspective: 1000;perspective: 1000;}
#pinContainer .scrollmagic_box {width: 100%;height: 70vh;/* height: 34.2vw; */background: url(../images/zshz_box1_bj.jpg) no-repeat center center;background-size: cover;margin: 0 auto;margin-bottom: 2vw;position: relative;overflow: hidden;border-radius: 20px;}
#pinContainer .scrollmagic_box .textItem {position: relative;z-index: 200;}
#pinContainer .scrollmagic_box .textBox {position: relative;color: white;padding: 3vw 0vw 3vw 7vw;width: 45%;height: 70vh;display: flex;align-items: center;}
#pinContainer .scrollmagic_box .textBox>div{padding-bottom: 2vw;}
#pinContainer .scrollmagic_box .textBox .num {font-size: 30px;font-weight: bold;}
#pinContainer .scrollmagic_box .textBox .num span {font-size: 80px;}
#pinContainer .scrollmagic_box .textBox .title{font-size: 50px;font-weight: bold;}
#pinContainer .scrollmagic_box .textBox .desc{margin-top: 2vw;}
#pinContainer .scrollmagic_box .textBox .desc p{font-size: 20px;color: #fff;line-height: 2;text-align: justify;}
#pinContainer .scrollmagic_box .itemBox {width: 100%;height: 100%;position: absolute;top: 0;display: inline-block;white-space: nowrap;left: 51.3%;}
#pinContainer .scrollmagic_box .itemBox .item {width: 28.5vw;position: relative;margin: 0 1.5vw;opacity: 0;border-radius: 50%;height: 100%;display: inline-flex;align-items: center;justify-content: center;}
#pinContainer .scrollmagic_box .itemBox .item:nth-child(1){opacity: 1;}
#pinContainer .scrollmagic_box .itemBox .item img {width: 100%;}



#box-2{background: url(../images/zshz_box2_bj.jpg) no-repeat center center;background-size: cover;}
#box-2 .ftitle .img{width: 38%;margin: 50px auto 35px auto;max-width: 562px;}
#box-2 .box1{margin-top: -10px;}
#box-2 .box li{width: 400px!important;}
#box-2 .box li>div{padding: 16px;}
#box-2 .box li .img{border-radius: 10px;overflow: hidden;-webkit-transform: translate3d(0, 0, 0);}


#box-3{background: url(../images/zshz_box3_bj.jpg) no-repeat center center;background-size: cover;}
#box-3 .block01,#box-3 .block02{position: relative;overflow: hidden;}
#box-3 .block01{margin-top: 75px;}
#box-3 .block01 .box1{width: calc(98% - 30px);margin: auto;position: relative;overflow: hidden;}
#box-3 .block01 .box1 li>div{padding: 0 14px;}
#box-3 .block01 .box1 li p{text-align: center;border: 1px solid #E72423;border-radius: 30px;color: #E72423;font-size: 22px;padding: 12px 10px;cursor: pointer;}
#box-3 .block01 .box1 li.swiper-slide-thumb-active p,#box-3 .block01 .box1 li p:hover{background: #E72423;color: #fff;}
#box-3 .block01 .swiper-button-prev,#box-3 .block01 .swiper-button-next{width: 15px;height: 25px;top: 30%;margin: 0;}
#box-3 .block01 .swiper-button-prev{content: '';background: url(../images/zshz_box3_jt1.png) no-repeat center center;background-size: contain;left: 0;}
#box-3 .block01 .swiper-button-next{content: '';background: url(../images/zshz_box3_jt2.png) no-repeat center center;background-size: contain;right: 0;}

#box-3 .block02{margin: 48px -10px 0 -10px;}
#box-3 .block02 li{padding: 0 10px;height: auto;}
#box-3 .block02 li>div{background: url(../images/zshz_box3_box.jpg) repeat center center;background-size: auto;height: 100%;}
#box-3 .block02 .left,#box-3 .block02 .right{width: 50%;}
#box-3 .block02 .left{position: relative;min-height: 400px;}
#box-3 .block02 .left,#box-3 .block02 .left .img,#box-3 .block02 .left .img img{height: 100%;}
#box-3 .block02 .left .num{position: absolute;right: 7%;bottom: 6.5%;width: 15%;max-width: 100px;}
#box-3 .block02 .left .num img{width: 100%;}
#box-3 .block02 .right{padding: 3% 6% 7% 6%;}
#box-3 .block02 .right .img{max-width: 175px;width: 35%;}
#box-3 .block02 .ftitle{font-size: 18px;color: #fff;font-weight: bold;margin: 10px 0 50px 0;}
#box-3 .block02 .desc p{font-size: 22px;color: #fff;line-height: 1.6;}


#box-4{background: url(../images/zshz_box4_bj.jpg) no-repeat center center;background-size: cover;}
#box-4 .container {max-width: 1660px;}
#box-4 .block01{position: relative;margin-top: 65px;}
#box-4 .block01 .box{width: calc(93% - 115px);overflow: hidden;margin: auto;}
#box-4 .box1{position: relative;margin: 0 -58px;}
#box-4 .box1 li{padding: 0 58px;position: relative;}
#box-4 .box1 li:not(:first-child)::before,#box-4 .box1 li:not(:first-child)::after{content: '';width: 31px;height: 31px;background: url(../images/zshz_box4_jt3.jpg) no-repeat center center;background-size: contain;position: absolute;top: 46%;-webkit-animation: fadeTb 1.6s ease infinite; }
#box-4 .box1 li::before{left: -5px;-webkit-animation-delay: 0.5s!important;}
#box-4 .box1 li::after{left: -26px;}
#box-4 .box1 li>div{background: rgba(255,255,255,0.95);border-radius: 10px;padding: 55px 20px;text-align: center;position: relative;}
#box-4 .box1 li .tb{width: 68%;margin: auto;}
#box-4 .box1 li .tb img{transition: 0.5s;}
#box-4 .box1 li>div:hover .tb img{transform: scale(1.1);}
#box-4 .box1 li .title{font-size: 43px;color: #E72423;font-weight: bold;margin: 17px 0;}
#box-4 .box1 li .ftitle{width: 42%;margin:0 auto 28px auto;}
#box-4 .box1 li .desc p{font-size: 18px;color: #333;}
#box-4 .swiper-pagination{margin-top: 48px;}
#box-4 .swiper-button-prev,#box-4 .swiper-button-next{width: 63px;height: 63px;top: 42%;}
#box-4 .swiper-button-prev {background: url(../images/zshz_box4_jt.png) no-repeat center center;background-size: contain;left: 0px;}
#box-4 .swiper-button-next {background: url(../images/zshz_box4_jt1.png) no-repeat center center;background-size: contain;right: 0px;}
@keyframes fadeTb{
	0%, 100% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}



@media (min-width:1500px) and (max-width:1800px){
	#pinContainer .scrollmagic_box .itemBox{margin-left: 3vw;}
	#pinContainer .scrollmagic_box .itemBox .item{transform: scale(0.9);}
}
@media (min-width:1199px) and (max-width:1500px){
	#pinContainer .scrollmagic_box .textBox .num {font-size: 24px;}
	#pinContainer .scrollmagic_box .textBox .num span {font-size: 68px;}
	#pinContainer .scrollmagic_box .textBox .title{font-size: 42px;}
	#pinContainer .scrollmagic_box .textBox .desc p{font-size: 18px;}
	#pinContainer .scrollmagic_box .itemBox {left: 55.3%;}
	#pinContainer .scrollmagic_box .itemBox .item {width: 32.5vw;transform: scale(0.9);}
	
	#box-2 .box li{width: 330px!important;}
	#box-3 .block01 .box1 li>div{padding: 0 12px;}
	#box-3 .block01 .box1 li p{padding: 10px 10px;}
}
@media (min-width:1199px) and (max-width:1380px){
	#box-4 .block01 .box {width: calc(93% - 95px);}
	#box-4 .box1{position: relative;margin: 0 -48px;}
	#box-4 .box1 li{padding: 0 48px;position: relative;}
	#box-4 .box1 li:not(:first-child)::before, #box-4 .box1 li:not(:first-child)::after{width: 26px;height: 26px;}
	#box-4 .box1 li::before {left: -2px;}
	#box-4 .box1 li::after {left: -22px;}
	#box-4 .swiper-button-prev, #box-4 .swiper-button-next {width: 58px;height: 58px;}
}

@media (min-width:767px) and (max-width:1199px){
	#pinContainer .scrollmagic_box .textBox{width: 48%;}
	#pinContainer .scrollmagic_box .textBox .num {font-size: 22px;}
	#pinContainer .scrollmagic_box .textBox .num span {font-size: 62px;}
	#pinContainer .scrollmagic_box .textBox .title{font-size: 36px;}
	#pinContainer .scrollmagic_box .textBox .desc p{font-size: 16px;}
	#pinContainer .scrollmagic_box .itemBox {left: 55.3%;}
	#pinContainer .scrollmagic_box .itemBox .item {width: 32.5vw;}
	
	#box-2 .ftitle .img{width: 44%;max-width: 365px;margin: 40px auto 35px auto;}
	#box-2 .box li{width: 260px!important;}
	#box-2 .box li>div{padding: 12px;}
	
	#box-3 .block01 .box1 li>div{padding: 0 9px;}
	#box-3 .block01 .box1 li p{padding: 8px 10px;font-size: 18px;}
	#box-3 .block01 .swiper-button-prev, #box-3 .block01 .swiper-button-next {width: 13px;top: 24%;}
	
	#box-3 .block02 .right {padding: 6% 5% 8% 5%;}
	#box-3 .block02 .right .img{width: 40%;max-width: 150px;}
	#box-3 .block02 .ftitle{font-size: 16px;margin: 10px 0 40px 0;}
	#box-3 .block02 .desc p {font-size: 18px;}
	
	#box-4 .block01 .box {width: calc(95% - 95px);}
	#box-4 .box1{position: relative;margin: 0 -38px;}
	#box-4 .box1 li{padding: 0 38px;position: relative;}
	#box-4 .box1 li>div{padding: 45px 20px;}
	#box-4 .box1 li .tb {width: 58%;}
	#box-4 .box1 li .title{font-size: 28px;margin: 10px 0;}
	#box-4 .box1 li .ftitle {width: 45%;margin: 0 auto 20px auto;}
	#box-4 .box1 li .desc p {font-size: 14px;}
	#box-4 .box1 li:not(:first-child)::before, #box-4 .box1 li:not(:first-child)::after{width: 23px;height: 23px;}
	#box-4 .box1 li::before {left: -2px;}
	#box-4 .box1 li::after {left: -16px;}
	#box-4 .swiper-button-prev, #box-4 .swiper-button-next {width: 48px;height: 48px;}
	
}
@media (max-width:850px){
	#pinContainer .scrollmagic_box{height: 83vh;}
	#pinContainer .scrollmagic_box .textItem{height: 36vh;overflow: hidden;}
	#pinContainer .scrollmagic_box .textBox{width: 100%;padding:5vw 7vw;height: 38vh;text-align: center;}
	/* #pinContainer .scrollmagic_box .textBox .desc p{text-align: center;} */
	#pinContainer .scrollmagic_box .itemBox{left: 0;top: 0;position: relative;height: auto;}
	#pinContainer .scrollmagic_box .itemBox .item{width: 100%;}
	#pinContainer .scrollmagic_box .itemBox .item img{width: 42vh;margin: auto;}
}
@media (max-width:767px){
	#pinContainer{margin-top: -35px;}
	#pinContainer .scrollmagic_box .textItem{height: 43vh;}
	#pinContainer .scrollmagic_box .textBox{padding:0px 25px 0px 25px;height: 45vh;}
	#pinContainer .scrollmagic_box .textBox>div {padding-bottom: 4vw;}
	#pinContainer .scrollmagic_box .textBox .num {font-size: 18px;}
	#pinContainer .scrollmagic_box .textBox .num span {font-size: 48px;}
	#pinContainer .scrollmagic_box .textBox .title{font-size: 26px;}
	#pinContainer .scrollmagic_box .textBox .desc p{font-size: 15px;line-height: 1.6;}
	#pinContainer .scrollmagic_box .itemBox .item{margin: 0;}
	#pinContainer .scrollmagic_box .itemBox .item img{width: 37vh;}
	
	#box-2 .ftitle .img{width: 62%;margin: 35px auto 30px auto;}
	#box-2 .box li{width: 160px!important;}
	#box-2 .box li .img{border-radius: 5px;}
	#box-2 .box li>div{padding: 6px;}
	
	#box-3 .block01 {margin-top: 40px;}
	#box-3 .block01 .box1{width: calc(97% - 30px);}
	#box-3 .block01 .box1 li>div{padding: 0 9px;}
	#box-3 .block01 .box1 li p{padding: 8px 10px;font-size: 16px;}
	#box-3 .block01 .swiper-button-prev, #box-3 .block01 .swiper-button-next {width: 12px;top: 21%;}
	
	#box-3 .block02 {margin: 40px -10px 0 -10px;}
	#box-3 .block02 .left, #box-3 .block02 .right{width: 100%;}
	#box-3 .block02 .left{min-height: auto;}
	#box-3 .block02 li>div{height: auto;flex-direction: column-reverse;}
	#box-3 .block02 .right {padding: 45px 25px 55px 25px;}
	#box-3 .block02 .right .img{width: 40%;max-width: 120px;}
	#box-3 .block02 .ftitle{font-size: 15px;margin: 10px 0 30px 0;}
	#box-3 .block02 .desc p {font-size: 15px;min-height: 72px;}
	
	#box-4 .block01{margin-top: 45px;}
	#box-4 .block01 .box {width: 100%;}
	#box-4 .box1{position: relative;margin: 0 0;}
	#box-4 .box1 li{padding: 0 15px;position: relative;}
	#box-4 .box1 li:not(:first-child)::before, #box-4 .box1 li:not(:first-child)::after,#box-4 .swiper-button-prev, #box-4 .swiper-button-next{display: none}
	#box-4 .box1 li>div{padding: 45px 20px;}
	#box-4 .box1 li .tb {width: 53%;}
	#box-4 .box1 li .title{font-size: 32px;margin: 10px 0;}
	#box-4 .box1 li .ftitle {width: 37%;margin: 0 auto 20px auto;}
	#box-4 .box1 li .desc p {font-size: 16px;}
	
}
@media (max-width:350px){
	#pinContainer .scrollmagic_box .textBox .num {font-size: 16px;}
	#pinContainer .scrollmagic_box .textBox .num span {font-size: 42px;}
	#pinContainer .scrollmagic_box .textBox .title{font-size: 22px;}
	#pinContainer .scrollmagic_box .textBox .desc p{font-size: 13px;line-height: 1.5;}
}