/* CSS Document */

/*Reset*/
* {
	vertical-align: baseline;
	font-weight: inherit;
	font-family: inherit;
	font-style: inherit;
	padding: 0;
	margin: 0;
	border: none;
}

body {
	font-family: STXihei, Microsoft YaHei, SimSun, Arial;
	font-size: 62.5%;
}

ol,
ul {
	list-style: none;
}

img {
	border: none;
	text-decoration: none;
	display: block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: normal;
	font-size: 12px;
}

a {
	text-decoration: none;
}

a img,
:link img,
:visited img {
	border: 0px;
}

.clear {
	clear: both;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

* html .clearfix {
	height: 1%;
}

*+html .clearfix {
	min-height: 1%;
}

/*basic*/
.fl {
	float: left;
}

.fr {
	float: right;
}

img {
	width: 100%;
}

/*main*/
html {
	height: 100%;
	width: 100%;
	-webkit-text-size-adjust: 100%;
	-webkit-overflow-scrolling: touch
}

body {
	position: relative;
	height: 100%;
	width: 100%;
	background: #dedede;
	overflow: hidden;
}

canvas {
	display: block;
	width: 100%;
}

.swiper-container {
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: none;
}

.swiper-slide {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	/*display:-webkit-box;
	-webkit-box-pack:center;
	-webkit-box-align:center;*/
}

/*音乐控件*/
#music {
	width: 80px;
	height: 80px;
	position: absolute;
	top: 1%;
	right: 1%;
	z-index: 9999;
}

#control {
	width: 44px;
	height: 44px;
	margin: 18px 18px;
	background: url(../images/music-off.png) no-repeat;
	background-size: 100% 100%;
}

#control-after {
	width: 80px;
	height: 80px;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/music-on.gif) no-repeat;
	background-size: 100% 100%;
}

.picZhuan {
	transform-origin: 50% 50%;
	animation: zhuan 4s infinite linear;
	-webkit-animation: zhuan 4s infinite linear;
}

@keyframes zhuan {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-webkit-keyframes zhuan {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/*音乐控件*/



/*#webShow{
	width: 750px;
	height: 1334px;
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -664px;
	z-index: 11;
	overflow: hidden;
	display: none;
}*/
.webShow2 {
	width: 100%;
	height: 100%;
	position: absolute;
	background-size: 100% 100%;
	left: 0;
	z-index: 111;
	overflow: hidden;


}

.webShow1 {
	width: 750px;
	height: 1334px;
	margin-left: -375px;
	position: absolute;
	background-size: 100% 100%;
	top: 0px;
	left: 50%;
	z-index: 111;
	transform-origin: top;
	transform: scale(1);
	overflow: hidden;
}

/* 进度条 */
.loading {
	display: block;
	width: 750px;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 99;
	background: #82f9d5;
	background-size: 100% 100%;
	overflow: hidden;
}

.loadtip {
	width: 498px;
	height: 266px;
	margin-top: -300px;
	text-align: center;
	position: absolute;
	left: 120px;
	top: 50%;
}

.jz_1 {
	margin-top: -470px;
	width: 714px;
	height: 653px;
	background: url(../images/jz_1.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 22px;
}

.jz_2 {
	margin-top: -75px;
	width: 504px;
	height: 362px;
	background: url(../images/jz_2.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 122px;
}

.loadingNum {
	width: 575px;
	height: 46px;
	text-align: center;
	top: 176px;
	left: 40px;
	font-size: 46px;
	font-weight: bold;
	position: absolute;
	top: 176px;
	left: 40px;
}

.fm_btn1 {
	position: absolute;
	width: 256px;
	height: 256px;
	top: 71px;
	left: 199px;
	background: url(../images/fm_btn1.png) no-repeat 0px 0px;
	display: none;
	animation: tada 1s infinite;


}

.jz_yz {
	width: 192px;
	height: 361px;
	background: url(../images/jz_yz.png) no-repeat 0px 0px;
	position: absolute;
	top: 0px;
	left: 0px;
	background-size: 100%;
}

.jz_b {
	width: 122px;
	height: 271px;
	background: url(../images/jz_b.png) no-repeat 0px 0px;
	position: absolute;
	top: -1px;
	left: -35px;
	background-size: 100%;
	transform-origin: 100% 0%;
	transform: rotate(-5deg);
	animation: jz_b 5s 0.3s infinite linear;
}

@keyframes jz_b {
	0% {
		transform: rotate(-5deg);
	}

	50% {
		transform: rotate(3deg);
	}

	100% {
		transform: rotate(-5deg);
	}
}

.jz_zis {
	width: 650px;
	height: 417px;
	position: absolute;
	top: 37px;
	left: 33px;
	border: 1px solid;
}

.jz_zi {
	position: absolute;
	width: 575px;
	height: 46px;
	top: 176px;
	left: 40px;
}

.jz_zi1 {
	background: url(../images/jz_zi1.png) no-repeat center center;
	opacity: 0;
	transform: scale(0.5);
}

.jz_zi2 {
	background: url(../images/jz_zi2.png) no-repeat center center;
	opacity: 0;
	transform: scale(0.5);
}

.jz_zi3 {
	background: url(../images/jz_zi3.png) no-repeat center center;
	opacity: 0;
	/*transform: scale(0.5);*/
}

.jz_zi4 {
	background: url(../images/jz_zi4.png) no-repeat center center;
	opacity: 0;
	/*transform: scale(0.5);*/
}

.jz_zi5 {
	background: url(../images/jz_zi5.png) no-repeat center center;
	opacity: 0;
	/*transform: scale(0.5);*/
}

.jz_zi6 {
	background: url(../images/jz_zi6.png) no-repeat center center;
	opacity: 0;
	transform: scale(0.5);
}

.jz_zi7 {
	background: url(../images/jz_zi7.png) no-repeat center center;
	opacity: 0;
	transform: scale(0.5);
}

.jz_zi8 {
	background: url(../images/jz_zi8.png) no-repeat center center;
	opacity: 0;
	transform: scale(0.5);
}



/* 进度条 */

.fm {
	width: 100%;
	height: 100%;
	position: absolute;
	background: #8f8f8f;
	background-size: 100% 100%;
	overflow: hidden;
}

.fm_bg {
	width: 100%;
	height: 81.8%;
	position: absolute;
	background: url(../images/fm_bg.png) no-repeat 0px 0px;
	top: 0px;
	left: 0px;
}

.fm_bt {
	margin-top: -605px;
	width: 681px;
	height: 338px;
	background: url(../images/fm_bt.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 35px;
	animation: bounceIn 1s 0s forwards;
	display: none;
}

.fm_mz {
	width: 121px;
	height: 109px;
	background: url(../images/fm_mz.png) no-repeat 0px 0px;
	position: absolute;
	top: -10px;
	left: 417px;
	animation: tada 1s 0s infinite linear;
}

.fm_tz {
	margin-top: 401px;
	width: 750px;
	height: 69px;
	background: url(../images/fm_tz.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 0px;
}

.fm_1 {
	margin-top: -117px;
	width: 644px;
	height: 566px;
	background: url(../images/fm_1.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 15px;
	background-size: 100%;
}

.fm_fs_1 {
	width: 157px;
	height: 267px;
	background: url(../images/fm_fs_1.png) no-repeat 0px 0px;
	position: absolute;
	top: 282px;
	left: 557px;
	background-size: 100%;
}

.fm_fs_2 {
	width: 184px;
	height: 184px;
	background: url(../images/fm_fs_2.png) no-repeat 0px 0px;
	position: absolute;
	top: -110px;
	left: -20px;
	background-size: 100%;
	transform-origin: 48.5% 51.5%;
	animation: fm_fs_2 1s infinite linear;
}

@keyframes fm_fs_2 {
	0% {
		transform: rotate(0deg);
	}

	0% {
		transform: rotate(-360deg);
	}

}

.fm_fs_3 {
	width: 208px;
	height: 208px;
	background: url(../images/fm_fs_3.png) no-repeat 0px 0px;
	position: absolute;
	top: -119px;
	left: -36px;
	background-size: 100%;
}

.fm_ren1 {
	margin-top: -150px;
	width: 406px;
	height: 714px;
	position: absolute;
	top: 50%;
	left: 0px;
	display: none;
}

.fm_rens1 {
	width: 406px;
	height: 714px;
	background: url(../images/fm_ren1.png) no-repeat 0px 0px;
	position: absolute;
	top: 0px;
	left: 0px;
	opacity: 0;
	animation: bounceIn 1s forwards;
}

.fm_zi1 {
	width: 435px;
	height: 284px;
	background: url(../images/fm_zi1.png) no-repeat 0px 0px;
	position: absolute;
	top: 400px;
	left: 294px;
	opacity: 0;
	animation: bounceIn 1s 0.5s forwards;
}

.fm_ren2 {
	width: 422px;
	height: 653px;
	position: absolute;
	bottom: 0px;
	right: 0px;
	display: none;
	/*animation: fadeInRight  1s 0s forwards;*/
}

.fm_rens2 {
	width: 422px;
	height: 653px;
	background: url(../images/fm_ren2.png) no-repeat 0px 0px;
	position: absolute;
	bottom: 0px;
	right: 0px;
	opacity: 0;
	animation: bounceIn 1s 0s forwards;
}

.fm_zi2 {
	width: 562px;
	height: 562px;
	position: absolute;
	top: 73px;
	left: -317px;
}

.fm_zi21 {
	width: 416px;
	height: 367px;
	background: url(../images/fm_zi21.png) no-repeat 0px 0px;
	position: absolute;
	opacity: 0;
	animation: fm_zi21 0.5s 0.5s forwards;
}

.fm_zi22 {
	width: 562px;
	height: 190px;
	background: url(../images/fm_zi22.png) no-repeat 0px 0px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	opacity: 0;
	animation: fm_zi22 0.5s 0.5s forwards;
}

@keyframes fm_zi21 {
	0% {
		opacity: 0;
		transform: rotate(20deg);
		top: -200px;
		left: -100px;
	}

	100% {
		opacity: 1;
		transform: rotate(0deg);
		top: 0px;
		left: 120px;
	}
}

@keyframes fm_zi22 {
	0% {
		opacity: 0;
		transform: rotate(10deg);
		bottom: 0px;
		left: -250px;
	}

	100% {
		opacity: 1;
		transform: rotate(0deg);
		bottom: 0px;
		left: 0px;
	}
}

.fm_ren3 {
	width: 750px;
	height: 653px;
	/*background: url(../images/fm_ren3.png) no-repeat 0px 0px;*/
	position: absolute;
	bottom: 20px;
	right: 0px;
	display: none;
}

.fm_rens3 {
	width: 750px;
	height: 653px;
	background: url(../images/fm_ren3.png) no-repeat 0px 0px;
	position: absolute;
	bottom: 0px;
	right: 0px;
	/*display: none;*/
	opacity: 0;
	animation: bounceIn 1s 0.5s forwards;
}

.fm_zi3 {
	width: 750px;
	height: 230px;
	background: url(../images/fm_zi3.png) no-repeat 0px 0px;
	position: absolute;
	top: 154px;
	left: 0px;
	animation: bounceIn 1s 0s forwards;
}





.fm_an {
	margin-top: 550px;
	width: 202px;
	height: 89px;
	background: url(../images/fm_an.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 514px;
	display: none;
	animation: jello 1s 0s infinite;


}

.all {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	display: none;
	overflow-y: scroll;
}

.p1 {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	background: #acd598;
	overflow: hidden;
}

.p1_bt {
	margin-top: -639px;
	width: 446px;
	height: 60px;
	background: url(../images/p1_bt.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 155px;
}

.sw1_1 {
	margin-top: 399px;
	width: 422px;
	height: 138px;
	background: url(../images/sw1_1.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 167px;
}

.sw1_2 {
	margin-top: 575px;
	width: 409px;
	height: 48px;
	background: url(../images/sw1_2.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 170px;
}

.sw1_9 {
	margin-top: 434px;
	width: 485px;
	height: 121px;
	background: url(../images/sw1_9.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 131px;
	display: none;
}

.sw1_3 {
	width: 27px;
	height: 38px;
	background: url(../images/sw1_3.png) no-repeat 0px 0px;
	position: absolute;
	top: 6px;
}

.sw1_31 {
	left: 20px;
	animation: sw1_31 2s infinite linear;
	opacity: 0;
}

.sw1_32 {
	left: 53px;
	animation: sw1_32 2s infinite linear;
	opacity: 0;


}

.sw1_33 {
	left: 86px;
	animation: sw1_33 2s infinite linear;
	opacity: 0;


}

.sw1_34 {
	right: 86px;
	animation: sw1_34 2s infinite linear;
	opacity: 0;


}

.sw1_35 {
	right: 53px;
	animation: sw1_35 2s infinite linear;
	opacity: 0;


}

.sw1_36 {
	right: 20px;
	animation: sw1_36 2s infinite linear;
	opacity: 0;


}

@keyframes sw1_31 {
	0% {
		opacity: 0;
	}

	15% {
		opacity: 0;
	}

	30% {
		opacity: 0;
	}

	45% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	85% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes sw1_32 {
	0% {
		opacity: 0;
	}

	15% {
		opacity: 0;
	}

	30% {
		opacity: 0;
	}

	45% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	85% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@keyframes sw1_33 {
	0% {
		opacity: 0;
	}

	15% {
		opacity: 0;
	}

	30% {
		opacity: 0;
	}

	45% {
		opacity: 0;
	}

	70% {
		opacity: 1;
	}

	85% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@keyframes sw1_34 {
	0% {
		opacity: 0;
	}

	15% {
		opacity: 0;
	}

	30% {
		opacity: 0;
	}

	45% {
		opacity: 1;
	}

	70% {
		opacity: 0;
	}

	85% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@keyframes sw1_35 {
	0% {
		opacity: 0;
	}

	15% {
		opacity: 0;
	}

	30% {
		opacity: 1;
	}

	45% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	85% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}

@keyframes sw1_36 {
	0% {
		opacity: 0;
	}

	15% {
		opacity: 1;
	}

	30% {
		opacity: 0;
	}

	45% {
		opacity: 0;
	}

	70% {
		opacity: 0;
	}

	85% {
		opacity: 0;
	}

	100% {
		opacity: 0;
	}
}


.swiper1 {
	margin-top: -567px;
	position: relative;
	width: 731px;
	height: 941px;
	z-index: 1;
	top: 50%;
}

.sw1_p1 {
	width: 731px;
	height: 941px;
	background: url(../images/sw1_5.png) no-repeat 0px 0px;
}

.sw1_4 {
	width: 339px;
	height: 299px;
	background: url(../images/sw1_4.png) no-repeat 0px 0px;
	position: absolute;
	top: 618px;
	left: 394px;
}

.sw1_p2 {
	width: 731px;
	height: 941px;
	background: url(../images/sw1_6.png) no-repeat 0px 0px;
}

.xx1 {
	width: 104px;
	height: 176px;
	background: url(../images/xx1.png) no-repeat 0px 0px;
	position: absolute;
	top: 390px;
	right: 0px;
	animation: xx 1s 0.2s infinite alternate;

}

.xx2 {
	width: 110px;
	height: 176px;
	background: url(../images/xx2.png) no-repeat 0px 0px;
	position: absolute;
	top: 598px;
	left: 0px;
	animation: xx 1s 0.5s infinite alternate;

}

.xx3 {
	width: 204px;
	height: 176px;
	background: url(../images/xx3.png) no-repeat 0px 0px;
	position: absolute;
	top: 305px;
	left: 30px;
	animation: xx 1s 0.7s infinite alternate;

}

.xx4 {
	width: 363px;
	height: 312px;
	background: url(../images/xx4.png) no-repeat 0px 0px;
	position: absolute;
	top: 371px;
	left: 208px;
	animation: xx 1s infinite alternate;
}

@keyframes xx {
	0% {
		opacity: 0.7;
	}

	100% {
		opacity: 1;
	}

}

.sw1_71 {
	width: 715px;
	height: 267px;
	background: url(../images/sw1_71.png) no-repeat 0px 0px;
	position: absolute;
	top: 15px;
	left: 10px;
}

.sw1_8 {
	width: 723px;
	height: 519px;
	background: url(../images/sw1_8.png) no-repeat 0px 0px;
	position: absolute;
	bottom: 0px;
	left: 0px;
}

.hb1 {
	width: 750px;
	height: 6550px;
	background: url(../images/hb12.jpg) no-repeat 0px 0px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 99;
	display: none;
}

.back1 {
	width: 202px;
	height: 89px;
	background: url(../images/fm_an.png) no-repeat 0px 0px;
	position: absolute;
	bottom: 20px;
	right: 15px;
	animation: tada 1s infinite;
}

.p2 {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	background: #88abda;
	overflow: hidden;

	display: none;
}

.p2_bt {
	margin-top: -639px;
	width: 446px;
	height: 60px;
	background: url(../images/p2_bt.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 155px;

}

.swiper2 {
	margin-top: -567px;
	position: relative;
	width: 731px;
	height: 941px;
	z-index: 1;
	top: 50%;
}

.sw2_p1 {
	background: url(../images/sw2_bg.png) no-repeat 0px 0px;
}

.sw2_1 {
	width: 621px;
	height: 418px;
	background: url(../images/sw2_1.png) no-repeat 0px 0px;
	position: absolute;
	top: 512px;
	left: 92px;
}

.sw2_2 {
	width: 730px;
	height: 907px;
	background: url(../images/sw2_2.png) no-repeat 0px 0px;
	position: absolute;
	top: 20px;
	left: -9px;
}






.sw2_31 {
	margin-top: 399px;
	width: 468px;
	height: 138px;
	background: url(../images/sw2_32.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 141px;
}

.sw2_4 {
	margin-top: 575px;
	width: 409px;
	height: 48px;
	background: url(../images/sw2_4.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 170px;
}

.sw2_5 {
	margin-top: 434px;
	width: 485px;
	height: 121px;
	background: url(../images/sw2_5.png) no-repeat 0px 0px;
	position: absolute;
	top: 50%;
	left: 131px;
	display: none;
}

.sw1_3 {
	width: 27px;
	height: 38px;
	background: url(../images/sw1_3.png) no-repeat 0px 0px;
	position: absolute;
	top: 6px;
}

.hb22 {
	width: 750px;
	height: 3408px;
	background: url(../images/hb22.jpg) no-repeat 0px 0px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 99;
	display: none;
}

.back2 {
	width: 202px;
	height: 89px;
	background: url(../images/fm_an.png) no-repeat 0px 0px;
	position: absolute;
	bottom: 20px;
	right: 15px;
	animation: tada 1s infinite;
}




.wy {
	width: 100%;
	height: 100%;
	position: relative;
	background: #8f8f8f;
	background-size: 100% 100%;
	display: none;
}

.wy_bg {
	width: 100%;
	height: 81.8%;
	position: absolute;
	background: url(../images/fm_bg.png) no-repeat 0px 0px;
	top: 0px;
	left: 0px;
}

.fd_zi11 {
	margin-top: -587px;
	width: 389px;
	height: 389px;
	position: absolute;
	background: url(../images/fd_zi11.png) no-repeat 0px 0px;
	top: 50%;
	left: 178px;
	animation: fadeInDown 1s linear forwards;
}

.re {
	margin-top: 495px;
	width: 252px;
	height: 51px;
	position: absolute;
	background: url(../images/re.png) no-repeat 0px 0px;
	top: 50%;
	left: 76px;
}

.fx {
	margin-top: 495px;
	width: 252px;
	height: 51px;
	position: absolute;
	background: url(../images/fx.png) no-repeat 0px 0px;
	top: 50%;
	right: 76px;
}

.lhcp {
	width: 488px;
	height: 28px;
	position: absolute;
	background: url(../images/lhcp.png) no-repeat 0px 0px;
	bottom: 48px;
	left: 148px;
}

.sharetips {
	position: fixed;
	background: url(../images/sharetips.png) no-repeat center 0px;
	background-size: cover;
	width: 750px;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 200;
	display: none;
}

.hand {
	margin-top: 290px;
	width: 82px;
	height: 91px;
	position: absolute;
	background: url(../images/shou.png) no-repeat 0px 0px;
	background-size: 100%;
	top: 50%;
	left: 323px;
	transform-origin: 50% 100%;
	animation: hand1 2s infinite linear;
	z-index: 2;
}

@keyframes hand1 {
	0% {
		opacity: 0;
		transform: rotate(45deg);
	}

	50% {
		opacity: 1;
		transform: rotate(15deg);
	}

	100% {
		opacity: 0;
		transform: rotate(-15deg);
	}

}

.down {

	width: 73px;
	height: 55px;
	position: fixed;
	background: url(../images/down.png) no-repeat 0px 0px;
	background-size: 100%;
	bottom: 50px;
	left: 338px;
	animation: down 2s infinite;

}

@keyframes down {
	0% {
		opacity: 0;
		transform: translateY(0px);
	}

	100% {
		opacity: 1;
		transform: translateY(30px);
	}

}

.zhi {
	width: 49px;
	height: 59px;
	position: absolute;
	background: url(../images/zhi.png) no-repeat 0px 0px;
	background-size: 100%;
	bottom: -25px;
	left: 432px;
	animation: pulse 1s infinite;
}