
.banner{width: 100%;height: 430px;background: url(../img/aboutBg.png) no-repeat;
	background-size: 100% 100%;position: relative;overflow: hidden;}
.banner img{position: absolute;width:9%;}
.banner .img1{left: 20%;top: 0px;
			opacity: 0;
			-webkit-transform: translate(200px,-200px);
			-moz-transform: translate(200px,-200px);
			-ms-transform: translate(200px,-200px);
			transform: translate(200px,-200px);
			-webkit-animation: img1 0.3s 0.5s ease-in forwards;
			-moz-animation: img1 0.3s 0.5s ease-in forwards;
			-ms-animation: img1 0.3s 0.5s ease-in forwards;
			animation: img1 0.3s 0.5s ease-in forwards;
			}

.banner .img2{left: 10%;top:300px;width: 7%;
				opacity: 0;
			-webkit-transform: translate(300px,-300px);
			-moz-transform: translate(300px,-300px);
			-ms-transform: translate(300px,-300px);
			transform: translate(300px,-300px);
			-webkit-animation: img1 0.3s 0.8s ease-in forwards;
			-moz-animation: img1 0.3s 0.8s ease-in forwards;
			-ms-animation: img1 0.3s 0.8s ease-in forwards;
			animation: img1 0.3s 0.8s ease-in forwards;}



.banner .img3{right: 20%;top: 0px;
		opacity: 0;
		-webkit-transform: translate(200px,-200px);
			-moz-transform: translate(200px,-200px);
			-ms-transform: translate(200px,-200px);
			transform: translate(200px,-200px);
		-webkit-animation: img1 0.2s 1s ease-in forwards;
		-moz-animation: img1 0.2s 1s ease-in forwards;
		-ms-animation: img1 0.2s 1s ease-in forwards;
		animation: img1 0.2s 1s ease-in forwards;
	}
.banner .img4{right: 10%;top: 0px;
		opacity: 0;
		-webkit-transform: translate(200px,-200px);
			-moz-transform: translate(200px,-200px);
			-ms-transform: translate(200px,-200px);
			transform: translate(200px,-200px);
		-webkit-animation: img1 0.2s 1.2s ease-in forwards;
		-ms-animation: img1 0.2s 1.2s ease-in forwards;
		-moz-animation: img1 0.2s 1.2s ease-in forwards;
		animation: img1 0.2s 1.2s ease-in forwards;
	}
.banner .img5{right: 27%;top: 150px;
		opacity: 0;
		-webkit-transform: translate(300px,-300px);
			-moz-transform: translate(300px,-300px);
			-ms-transform: translate(300px,-300px);
			transform: translate(300px,-300px);
		-webkit-animation: img1 0.3s 1.3s ease-in forwards;
		-ms-animation: img1 0.3s 1.3s ease-in forwards;
		-moz-animation: img1 0.3s 1.3s ease-in forwards;
		animation: img1 0.3s 1.3s ease-in forwards;
	}
.banner .img6{width:5%;right: 20%;top: 250px;
		opacity: 0;
		-webkit-transform: translate(300px,-300px);
			-moz-transform: translate(300px,-300px);
			-ms-transform: translate(300px,-300px);
			transform: translate(300px,-300px);
		-webkit-animation: img1 0.3s 1.5s ease-in forwards;
		-moz-animation: img1 0.3s 1.5s ease-in forwards;
		-ms-animation: img1 0.3s 1.5s ease-in forwards;
		animation: img1 0.3s 1.5s ease-in forwards;
	}
@-webkit-keyframes img1{
	from{-webkit-transform: translate(300px,-300px);opacity: 0;}
	to{-webkit-transform: translate(0,0);opacity: 1;}
}	
@-moz-keyframes img1{
	from{-moz-transform: translate(300px,-300px);opacity: 0;}
	to{-moz-transform: translate(0,0);opacity: 1;}
}
@-ms-keyframes img1{
	from{-ms-transform: translate(300px,-300px);opacity: 0;}
	to{-ms-transform: translate(0,0);opacity: 1;}
}
@keyframes img1{
	from{transform: translate(300px,-300px);opacity: 0;}
	to{transform: translate(0,0);opacity: 1;}
}

.banner .img7{width:15%;right: 30%;top: 130px;
				opacity: 0;
				-webkit-transform: translate(-500px,-100px) rotate(360deg) scale(0);
				-moz-transform: translate(-500px,-100px) rotate(360deg) scale(0);
				-ms-transform: translate(-500px,-100px) rotate(360deg) scale(0);
				transform: translate(-500px,-100px) rotate(360deg) scale(0);
				-webkit-animation: img7 0.5s 1.7s forwards;
				-moz-animation: img7 0.5s 1.7s forwards;
				-ms-animation: img7 0.5s 1.7s forwards;
				animation: img7 0.5s 1.7s forwards;
				
				}
@-webkit-keyframes img7{
	from{-webkit-transform: translate(-500px,-100px) rotate(360deg) scale(0);opacity: 0;}
	to{-webkit-transform: translate(0px,0px) rotate(0deg) scale(1);opacity: 1;}
}
@-moz-keyframes img7{
	from{-moz-transform: translate(-500px,-100px) rotate(360deg) scale(0);opacity: 0;}
	to{-moz-transform: translate(0px,0px) rotate(0deg) scale(1);opacity: 1;}
}
@-ms-keyframes img7{
	from{-ms-transform: translate(-500px,-100px) rotate(360deg) scale(0);opacity: 0;}
	to{-ms-transform: translate(0px,0px) rotate(0deg) scale(1);opacity: 1;}
}
@keyframes img7{
	from{transform: translate(-500px,-100px) rotate(360deg) scale(0);opacity: 0;}
	to{transform: translate(0px,0px) rotate(0deg) scale(1);opacity: 1;}
}

.banner .word{position: absolute;width: 35%;height: 200px;
left: 19%;top: 150px;color: #fff;
	font-family: "微软雅黑";}
.coOrange{color: #ffca36;}
.op8{opacity: 0.8;}
.f50{font-size: 50px;}
.banner .w1{height: 0;overflow: hidden;
			-webkit-animation: w1 0.5s 2s forwards;
			-moz-animation: w1 0.5s 2s forwards;
			-ms-animation: w1 0.5s 2s forwards;
			animation: w1 0.5s 2s forwards;
			}
@-webkit-keyframes w1{
	from{height: 0;}
	to{height: 70px;}
}
@-ms-keyframes w1{
	from{height: 0;}
	to{height: 70px;}
}
@-moz-keyframes w1{
	from{height: 0;}
	to{height: 70px;}
}
@keyframes w1{
	from{height: 0;}
	to{height: 70px;}
}
.banner .w2{width: 0;overflow: hidden;
			height: 30px;
			-webkit-animation: w2 0.5s 2.5s forwards;
			-moz-animation: w2 0.5s 2.5s forwards;
			-ms-animation: w2 0.5s 2.5s forwards;
			animation: w2 0.5s 2.5s forwards;}

@-webkit-keyframes w2{
	from{width: 0;}
	to{width: 100%;}
}
@-moz-keyframes w2{
	from{width: 0;}
	to{width: 100%;}
}
@-ms-keyframes w2{
	from{width: 0;}
	to{width: 100%;}
}
@keyframes w2{
	from{width: 0;}
	to{width: 100%;}
}
.banner .w3{opacity: 0;
			-webkit-animation: w3 0.5s 3s forwards;
			-moz-animation: w3 0.5s 3s forwards;
			-ms-animation: w3 0.5s 3s forwards;
			animation: w3 0.5s 3s forwards;
			}

@-webkit-keyframes w3{
	from{opacity: 0;}
	to{opacity: 1;}
}
@-moz-keyframes w3{
	from{opacity: 0;}
	to{opacity: 1;}
}
@-ms-keyframes w3{
	from{opacity: 0;}
	to{opacity: 1;}
}
@keyframes w3{
	from{opacity: 0;}
	to{opacity: 1;}
}
.banner .w4{width: 0;overflow: hidden;
			height: 40px;
			-webkit-animation: w2 0.5s 3.5s forwards;
			-moz-animation: w2 0.5s 3.5s forwards;
			-ms-animation: w2 0.5s 3.5s forwards;
			animation: w2 0.5s 3.5s forwards;}


.banner .star1{width: 1.5%;top: 70px;left: 27%;
		opacity: 0;
		-webkit-animation: star 5s 2s 2 forwards;
		-moz-animation: star 5s 2s 2 forwards;
		-ms-animation: star 5s 2s 2 forwards;
		animation: star 5s 2s 2 forwards;}
.banner .star2{width: 2%;top: 115px;left: 30%;
			opacity: 0;
			-webkit-animation: star 6s 3s 2 forwards;
			-moz-animation: star 6s 3s 2 forwards;
			-ms-animation: star 6s 3s 2 forwards;
			animation: star 6s 3s 2 forwards;}
.banner .star3{width: 2.5%;top: 120px;left: 35%;opacity: 0;
			-webkit-animation: star 4s 4s 2 forwards;
			-moz-animation: star 4s 4s 2 forwards;
			-ms-animation: star 4s 4s 2 forwards;
			animation: star 4s 4s 2 forwards;}
.banner .star4{width: 1%;top: 80px;left: 40%;opacity: 0;
		-webkit-animation: star 8s 5s 2 forwards;
		-ms-animation: star 8s 5s 2 forwards;
		-moz-animation: star 8s 5s 2 forwards;
		animation: star 8s 5s 2 forwards;}

@-webkit-keyframes star{
	0%{opacity: 0;}
	20%{opacity: 1;}
	40%{opacity: 0;}
	60%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 1;}
}
@-moz-keyframes star{
	0%{opacity: 0;}
	20%{opacity: 1;}
	40%{opacity: 0;}
	60%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 1;}
}
@-ms-keyframes star{
	0%{opacity: 0;}
	20%{opacity: 1;}
	40%{opacity: 0;}
	60%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 1;}
}
@keyframes star{
	0%{opacity: 0;}
	20%{opacity: 1;}
	40%{opacity: 0;}
	60%{opacity: 1;}
	80%{opacity: 0;}
	100%{opacity: 1;}
}



































.section1{width: 80%;min-height: 100px;padding: 100px 0;margin: 0 auto;overflow: hidden;}
.section1 .p1{width: 25%;height: 100px;margin: 0 auto;}
.section1 .p1 img{width:15%;float: left;}
.section1 .p1 span{display:block;width:80%;float: left;margin-left: 5%;}
.section1 .p1 span p:nth-of-type(1){font-size: 35px;font-weight: 900;}
.section1 .p1 span p:nth-of-type(2){color:#999;}
.section1 .p2{font-size: 30px;font-weight: 900;}

.section1 .p2 span{color: #106ab1;padding-right: 10px;line-height: 100px;}
.section1 .p2 em{font-size: 14px;font-weight: 100;color: #999;}
.section1 .p3{font-size: 14px;line-height: 30px;text-indent: 28px;}
.section1 .left{width: 45%;float: left;padding-left: 30px;color: #7c7c7c;}
.section1 .left p{font-size: 14px;line-height: 50px;}
.section1 .right{width: 50%;float: left;height: 300px;}
#allmap{width:100%;height:300px;}

.section1 .le{width: 500px;height: 480px;float: left;
				position: relative;}

.section1 .le div{position: absolute;width: 170px;height: 182px;background:url(../img/beforeBtn.png) no-repeat;
				text-align: center;color: #999;
				font-size: 25px;font-weight: 900;overflow: hidden;}
.section1 .le div.on{background: url(../img/afterBtn.png) no-repeat;}
.section1 .le .div1{left: 177px;top: 150px;background: none;}

.section1 .le .div2{left: 96px;top: 7px;}
.section1 .le .div3{left: 263px;top: 7px;}
.section1 .le .div4{left: 348px;top: 150px;}
.section1 .le .div5{left: 263px;top: 293px;}
.section1 .le .div6{left: 96px;top: 293px;}
.section1 .le .div7{left: 14px;top: 150px;}
.section1 .ri{width: 40%;float: left;overflow: hidden;margin-left: 5%;
				line-height: 30px;font-size: 12px;}
.pp1{display: none;}
.pp2{display: none;}
.pp3{display: none;}
.pp4{display: none;}
.pp5{display: none;}
