.page_content{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:hidden;
}
.page_content>ul{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:300%;
}
.page_content>ul>li{
	width:100%;
}
.page_content>ul>li>div{
	width:100%;
	height:100%;
}
.page_content>ul>li>div>div{
	opacity:0 !important;
}
/* 固定音乐转盘以及下拉箭头 */
.page_content_fixed a{
	position:fixed;
	z-index:999;
	display:block;
	width:0.68rem;
	height:0.68rem;
	background:rgba(0,0,0,.4);
	border-radius:50%;
	top:0.22rem;
	right:0.3rem;
	transition:all .3s ease;
	transform-origin:center center;
	animation:rot 2s .2s linear infinite;
}
.page_content_fixed a i{
	display:block;
	width:0.25rem;
	height:0.31rem;
	margin:0.175rem auto;
	background:url(../img/spr_qxqp.png)no-repeat -0.20rem -0.64rem;
	background-size:5.2rem 8.6rem;
}
.page_content_fixed span{
	display:block;
	width:0.4rem;
	height:0.23rem;
	background:url(../img/spr_qxqp.png)no-repeat -0.20rem -0.96rem;
	background-size:5.2rem 8.6rem;
	position:fixed;
	z-index:999;
	bottom:0.77rem;
	left:50%;
	margin-left:-0.2rem;
	animation:spa .7s ease infinite alternate;
}
/* 旋转 */
@keyframes rot{
	from{
		transform:rotate(0);
	}
	to{
		transform:rotate(360deg);
	}
}
/* 小箭头动画 */
@keyframes spa{
	from{
		opacity: 0;
		transform:translateY(-0.05rem);
	}
	to{
		opacity: 1;
		transform:translateY(0.06rem);
	}
}
/* 从上到下 */
@keyframes bottom{
	from{
		opacity: 0;
		transform:translateY(-1rem);
	}
	to{
		opacity: 1;
		transform:translateY(0);
	}
}
/* 从下到上 */
@keyframes top{
	from{
		opacity:0;
		transform:translateY(1rem);
	}
	to{
		opacity:1;
		transform:translateY(0);
	}
}
/* 从左到右 */
@keyframes right{
	from{
		opacity: 0;
		transform:translateX(-1rem);
	}
	to{
		opacity: 1;
		transform:translateX(0);
	}
}
/* 从右到左 */
@keyframes left{
	from{
		opacity: 0;
		transform:translateX(1rem);
	}
	to{
		opacity: 1;
		transform:translateX(0);
	}
}
/* 从小到大（旋转） */
@keyframes sca{
	from{
		opacity: 0;
		transform:scale(0.2) rotate(0);
	}
	to{
		opacity: 1;
		transform:scale(1) rotate(360deg);
	}
}
/* .page_content>ul>li:nth-child(1)>div{
	background:#666;
}
.page_content>ul>li:nth-child(2)>div{
	background:#999;
}
.page_content>ul>li:nth-child(3)>div{
	background:#000;
} */
/* 第一张 */
.one{
	padding-top:1.12rem;
	background:url(../img/one_bg.png)no-repeat;
	background-size:cover;
	box-sizing: border-box;
}
.one .one_logo{
	width:2.67rem;
	margin:0 auto;
	text-align:center;
}
.one_logo.on{
	animation:bottom .7s .7s ease both;
}
.one_logo img{
	display:block;
	width:100%;
	height:0.53rem;
}
.one_logo span{
	color:#fff;
	font-size:0.24rem;
	line-height:1.3;
}
.one_pro{
	width:3.6rem;
	height:6.2rem;
	margin:0 auto;
	margin-top:0.82rem;
}
.one_pro.on{
	animation:sca 1s 1s ease both;
}
.one_pro img{
	width:100%;
	height:100%;
}
.one_text{
	text-align:center;
	margin-top:0.6rem;
}
.one_text.on{
	animation:top .7s 1.3s ease both;
}
.one_text span{
	color:#fff;
	font-size:0.34rem;
	line-height:1.3;
	font-weight:bold;
}
.one_text p{
	color:#fff;
	font-size:0.22rem;
	line-height:1.3;
}
/* 第二张 */
.two{
	padding-top:0.4rem;
	background:url(../img/two_bg.png)no-repeat;
	background-size:cover;
	box-sizing: border-box;
}
.two img{
	width:100%;
	height:auto;
}
.two_top{
	width:3.9rem;
	height:0.4rem;
	margin-left:0.3rem;
}
.two_top.on{
	animation:right .8s .5s ease both;
}
.two_text{
	width:100%;
	margin-top:1.2rem;
}
.two_text.on{
	animation:left .8s .8s ease both;
}
.two_img{
	width:6.25rem;
	margin:0.8rem auto;
}
.two_img.on{
	animation:sca 1.2s 1s ease both;
}
/* 第三张 */
.three{
	padding-top:0.4rem;
	box-sizing: border-box;
}
.three img{
	width:100%;
	height:auto;
}
.three_top{
	width:3.9rem;
	height:0.4rem;
	margin-left:0.3rem;
}
.three_top.on{
	animation:right .8s .5s ease both;
}
.three_pro{
	width:5.2rem;
	height:5.2rem;
	margin:0 auto;
	margin-top:1rem;
	position:relative;
}
.three_pro.on{
	animation:sca .8s .8s ease both;
}
.three_pro.on .three_pro_di img:nth-child(2){
	animation:z_sca 10s 1.8s linear infinite;
}
.three_pro.on .three_pro_zhon{
	animation:f_sca 10s 1.8s linear infinite;
}
.three_pro .three_pro_di{
	width:100%;
	height:100%;
	position:relative;
	z-index:1;	
}
.three_pro_di img:nth-child(1){
	width:4.9rem;
	height:4.9rem;
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-2.45rem;
	margin-left:-2.45rem;
}
.three_pro_zhon{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
}
.three_pro_zhon i:nth-child(1){
	display:block;
	width:0.87rem;
	height:0.87rem;
	position:absolute;
	top:1.47rem;
	left:-0.3rem;
	background:url(../img/spr_qxqp.png)no-repeat -0.2rem -4rem;
	background-size:5.2rem 8.6rem;
}
.three_pro_zhon i:nth-child(2){
	display:block;
	width:1.56rem;
	height:1.56rem;
	position:absolute;
	top:2.8rem;
	right:-0.35rem;
	background:url(../img/spr_qxqp.png)no-repeat -0.2rem -1.2rem;
	background-size:5.2rem 8.6rem;
}
.three_pro_zhon i:nth-child(3){
	display:block;
	width:1.2rem;
	height:1.2rem;
	position:absolute;
	bottom:-0.35rem;
	left:2.78rem;
	background:url(../img/spr_qxqp.png)no-repeat -0.2rem -2.79rem;
	background-size:5.2rem 8.6rem;
}
.three_pro_top{
	width:100%;
	height:100%;
	position:absolute;
	z-index:3;
	top:0;
	left:0;
}
.three_pro_top img:nth-child(1){
	width:1.8rem;
	height:1.8rem;
	position:absolute;
	top:-0.5rem;
	left:-0.07rem;
}
.three_pro_top img:nth-child(2){
	width:2.6rem;
	height:2.6rem;
	position:absolute;
	bottom:-0.21rem;
	left:-0.25rem;
}
@keyframes f_sca{
	from{
		transform:rotate(0);
	}
	to{
		transform:rotate(360deg);
	}
}
@keyframes z_sca{
	from{
		transform:rotate(0);
	}
	to{
		transform:rotate(-360deg);
	}
}
.three_text{
	width:6.5rem;
	margin:0 auto;
	margin-top:0.8rem;
	position:relative;
}
.three_text img{
	position:absolute;
	width:4rem;
	height:1.23rem;
	top:-0.05rem;
	left:-0.26rem;
}
.three_text.on{
	animation:top .8s 1.2s ease both;
}
.three_text span{
	color:#404040;
	font-size:0.32rem;
	line-height:0.45rem;
	font-weight:bold;
}
.three_text i{
	color:#247581;
	font-style:normal;
}
.three_text p{
	color:#646464;
	font-size:0.2rem;
	margin-top:0.40rem;
	line-height:0.40rem;
}
/* 第四张 */
.four{
	padding-top:0.4rem;
	box-sizing: border-box;
	position:relative;
	background:url(../img/four_bg.png)no-repeat;
	background-size:cover;
	transform:perspective(500px) rotatey(0deg);
    transform-style:preserve-3d;
}
.four img{
	width:100%;
	height:auto;
}
.four_top{
	width:3.9rem;
	height:0.4rem;
	margin-left:0.3rem;
}
.four_top.on{
	animation:right .8s .5s ease both;
}
.four_img{
	float:left;
	position:relative;
	width:4.19rem;
	height:9rem;
	margin-top:1.08rem;
}
.four_img.on{
	animation:right .8s 1s ease both;
}
.four_img img:nth-child(1){
	width:4rem;
	height:8.6rem;
	position:absolute;
	top:50%;
	margin-top:-4.3rem;
	left:0;
}
.four_text{
	height:9rem;
	position:absolute;
	right:0.3rem;
	margin-top:1.08rem;
	transform-origin:100% 100%;
}
.four_text img{
	width:5.4rem !important;
	height:7.38rem !important;
	margin-top:0.3rem;
}
.four_text.on{
	animation:four_text 1s 1s ease both;
}
@keyframes four_text{
	from{
		opacity:0;
		transform:rotateY(45deg);
	}
	to{
		opacity:1;
		transform:rotateY(0deg);
	}
}
/* 第五张 */
.five{
	padding-top:0.4rem;
	box-sizing:border-box;
	background:url(../img/five_bg.png)no-repeat;
	background-size:100% 100%;
	transform:perspective(500px) rotatey(0deg);
	transform-style:preserve-3d;
}
.five .five_top{
	width:3.9rem;
	height:0.4rem;
	margin-left:0.3rem;
}
.five .five_top img{
	width:100%;
	height:auto;
}
.five_top.on{
	animation:right .8s .5s ease both;
}
.five_img{
	width:4.28rem;
	height:5.36rem;
	margin:1.6rem auto;
	transform-origin:bottom;
}
.five_img.on{
	animation:five_pro .8s .8s ease both;
}
.five_img.on img{
	animation:five_img 1s 2s ease infinite alternate;
}
.five_img img{
	width:100%;
	height:100%;
}
@keyframes five_img{
	from{
		transform:scale(1);
	}
	to{
		transform:scale(1.1);
	}
}
@keyframes five_pro{
	from{
		opacity:0;
		transform:rotateX(-80deg);
	}
	to{
		opacity:1;
		transform:rotateX(0deg);
	}
}