.e5z-animate0{
	opacity: 0;
	filter: alpha(opacity=0);
	transform: scale(2) translatex(60%);
	transition: transform 0.8s cubic-bezier(0.42, 0, 1, 0.68),opacity 1s;
}
.animate .e5z-animate0 {
    opacity: 1;
    filter: alpha(opacity=100);
    transform: scale(1) translatex(0);
}
.box1{
	height: 100vh;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	position: relative;
}
.box1 .img{
	position: absolute;
	width: 66.927%;
	left: 50%;
	bottom: 5.263%;
	margin-left: -33.4635%;
}
.box1 .img img{
	width: 100%;
}
.box1 .pro-banner-txts{
	position: absolute;
	left: 0;
	top: 40%;
	width: 100%;
	transition: all .8s 1.5s;
}
.box1.animate .pro-banner-txts{
	top: 8%;
}
.box1 .banner-txts{
	width: 295px;
	height: 85px;
	margin: 0 auto;
	position: relative;
}
.box1 .banner-txts img{
	height: 100%;
	width: auto;
	position: absolute;
	top: 0;
}
.box1 .banner-txts .pro-cn1{
	left: 0;
}
.box1 .banner-txts .pro-cn2{
	left: 24.4%;
}
.box1 .banner-txts .pro-cn3{
	left: 49.49%;
}
.box1 .banner-txts .pro-cn4{
	left: 75.9322%;
}
.box1 .pro-con{
	text-align: center;
	margin-top: 16px;
}
.box8{
	height: 100vh;
	position: relative;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	position: relative;
}
.box8 .img{
	position: absolute;
	width: 57.76%;
	left: 11.458%;
	bottom: 0;
}
.box8 .img img{
	width: 100%;
}

.box8 .mask{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: ;
}
.box8 .text{
	position: absolute;
	right: 16.67%;
	top: 37.8947%;
	text-align: center;
}
.box8 .text .pro-tit{
	color: #fff;
}
.box8 .text .pro-con{
	opacity: .7;
	filter: alpha(opacity=70);
}
.box9{
	height: 100vh;
	position: relative;
}

.box9 .img{
	float: right;
	height: 100vh;
	margin-right: 8.854%;
}
.box9 .img img{
	height: 100%;
	width: auto;
}
.box9 .text{
	position: absolute;
	left: 16.67%;
	top: 50%;
	text-align: center;
	transform: translatey(-50%);
}
.box9 .text .pro-tit{
	color: #000;
}
.box9 .text .pro-con{
	color: #8b704c;
}
.box10 .img{
	height: 100vh;
	float: left;
}
.box10 .img img{
	height: 100%;
}
.box10 .text{
	position: absolute;
	right: 16.67%;
	top: 27.368%;
	text-align: right;
}
.box10 .text .pro-tit{
	color: #000;
}
.box10 .text .pro-con{
	color: #8b704c;
}
.box11{
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	height: 100vh;
	position: relative;
}
.box11 .img{
	float: right;
	height: 100vh;
	margin-right: 3.125%;
}
.box11 .img img{
	height: 100%;
	width: auto;
}
.box11 .mask{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 63.157%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-image: ;
}
.box11 .text{
	position: absolute;
	left: 16.67%;
	top: 32.63%;
}
.box11 .text .pro-tit{
	color: #000;
}
.box11 .text .pro-con{
	color: #8b704c;
}

@media (max-width: 1600px){
	.box9 .text{
		left: 5%;
	}
	.box9 .img{
		margin-right: 0;
	}
	.box10 .text{
		right: 5%;
	}

	.box11 .text{
		left: 5%;
	}
}
@media (max-width: 1200px){
	.box1{
		height: 50vh;
	}
	.box8{
		height: 50vh;
	}
	.box9{
		height: 50vh;
	}
	.box9 .img{
		height: 50vh;
	}
	.box9 .text{
		left: 5%;
	}
	.box10 .img{
		height: 50vh;
	}
	.box10 .text{
		right: 5%;
	}
	.box11{
		height: 50vh;
	}
	.box11 .img{
		height: 50vh;
	}
	.box11 .text{
		left: 5%;
	}
}
@media (max-width: 992px){

}
@media (max-width: 480px){
	.box1{
		height: 70vh;
	}
	.box1 .img{
		width: 90%;
		margin-left: -45%;
	}
	.box1 .banner-txts{
		transform: scale(.5);
	}
	.box1 .pro-con{
		margin-top: -10px;
	}
	.box8{
		height: 70vh;
	}
	.box8 .text{
		right: 0;
		width: 100%;
		top: 10%;
	}
	.box8 .img{
		width: 90%;
		margin-left: -45%;
		left: 50%;
	}
	.box9{
		height: auto;
		padding-bottom: 30px;
	}
	.box9 .img{
		height: auto;
		width: 100%;
		float: none;
	}
	.box9 .img img{
		width: 100%;
		height: auto;
	}
	.box9 .text{
		position: static;
		transform: translatey(0);
		margin-top: 30px;
	}
	.box10{
		padding-bottom: 30px;
	}
	.box10 .img,
	.box10 .img img{
		height: auto;
		width: 100%;
	}
	.box10 .img{
		float: none;
	}
	.box10 .text{
		position: static;
		margin-top: 30px;
		text-align: center;
	}
	.box11{
		padding-bottom: 30px;
		height: auto;
	}
	.box11 .img,
	.box11 .img img{
		width: 100%;
		height: auto;
	}
	.box11 .img{
		float: none;
	}
	.box11 .text{
		position: static;
		margin-top: 30px;
		text-align: center;
	}
}