html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,input,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;-webkit-background-origin:content-box;background-origin:content-box;}section,header,footer,nav{display:block;margin:0;padding:0}body{line-height:1}blockquote,q{quotes:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}img{border:0;font-size:0}a{text-decoration:none;}
.cf:before,.cf:after{content:"";display:table}.cf:after{clear:both}.cf{*zoom:1}
html{
	-webkit-text-size-adjust:none;
}
html,body{
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
body{
	text-align:justify;
	font-family:"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",arial,Helvetica,sans-serif;
}
#mContent{
	position: relative;
	height: 100%;
}
.swiper-container,
.swiper-wrapper,
.swiper-slide{
	position: relative;
	width: 100%;
	height: 100%;
}
.page1{
	background: url(../images/page1_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page2{
	background: url(../images/page2_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page3{
	background: url(../images/page3_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page4{
	background: url(../images/page4_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page5{
	background: url(../images/page5_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page6{
	background: url(../images/page6_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page7{
	background: url(../images/page7_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.page8{
	background: url(../images/page8_bg.jpg) top center no-repeat;
	background-size: 100% 100%;
}
.logo{
	position: absolute;
	background: url(../images/logo.png) top center no-repeat;
	background-size: contain;
	width: 48%;
	height: 5%;
	top: 3%;
	left: 4%;
}
.page1_img1{
	position: absolute;
	background: url(../images/page1_img1.png) top center no-repeat;
	background-size: contain;
	width: 66%;
	height: 50%;
	top: 6%;
	left: 22%;
}
.rolling_box{
	position: absolute;
	width: 60%;
	height: 10%;
	top: 48%;
	left: 20%;
	overflow: hidden;
}
.rolling_box .txt1_box,
.rolling_box .txt2_box{
	position: absolute;
	width: 100%;
	height: 100%;
}
.rolling_box .txt1_box{
	top: 0%;
}
.rolling_box .txt2_box{
	top: 100%;
}
.rolling_box .txt1_box p,
.rolling_box .txt2_box p{
	text-align: center;
	height: 33%;
	color: red;
	font-weight: bold;
}
.page1_img2{
	position: absolute;
	background: url(../images/page1_img2.png) top center no-repeat;
	background-size: contain;
	width: 76%;
	height: 39%;
	bottom: 0%;
	left: 12%;
}
.logo2{
	position: absolute;
	background: url(../images/logo2.png) top center no-repeat;
	background-size: contain;
	width: 18%;
	height: 15%;
	top: 3%;
	right: 3%;
}
.page2_img1,
.page3_img1,
.page4_img1{
	position: absolute;
	background: url(../images/page2_img1.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 15.5%;
	top: 13%;
}
.red{
	color: #fe0103;
	font-weight: bold;
}
.page2_ul{
	position: relative;
	width:  80%;
	top: 32%;
	left: 22%;
}
.page2_ul li{
	margin-bottom: 1.6%;
	color: #fe0103;
}
.page2_ul li p{
	color: #000;
	letter-spacing: -0.2px;
}
.page2_img2{
	position: absolute;
	background: url(../images/page2_img2.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 50%;
	bottom: 5%;
}
.page3_img1{
	background: url(../images/page3_img1.png) top center no-repeat;
	background-size: contain;
}
.page3_ul{
	position: relative;
	width:  60%;
	top: 30%;
	left: 27%;
}
.listNone{
	list-style-type: none;
}
.page3_ul li{
	color: #fe0103;
}
.page3_ul li p{
	color: #000;
	letter-spacing: -0.2px;
}
.page3_img2{
	position: absolute;
	background: url(../images/page3_img2.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 36%;
	bottom: 2%;
}
.page3_img3{
	position: absolute;
	background: url(../images/page3_img3.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 30%;
	top: 57%;
	left: 5.5%;
	transform-origin: 45% 0%;
	-webkit-transform-origin: 45% 0%;
}
.img3_ani{
	animation: page3_img3 1.7s ease infinite;
	-webkit-animation: page3_img3 1.7s ease infinite;
	animation-direction: alternate;
	-webkit-animation-direction: alternate;
}
@keyframes page3_img3{
	0%{transform: rotateZ(-5deg);}
	100%{transform: rotateZ(5deg);}
}
@-webkit-keyframes page3_img3{
	0%{-webkit-transform: rotateZ(-5deg);}
	100%{-webkit-transform: rotateZ(5deg);}
}


.page4_img1{
	background: url(../images/page4_img1.png) top center no-repeat;
	background-size: contain;
}
.page4_txt{
	position: absolute;
	width: 56%;
	top: 30%;
	left: 22%;
	letter-spacing: -0.3px;
}
.page4_img2{
	position: absolute;
	background: url(../images/page4_img2.png) top center no-repeat;
	background-size: contain;
	width: 36%;
	height: 4%;
	top: 44.5%;
	left: 32%;
}
.page4_img3{
	position: absolute;
	background: url(../images/page4_img3.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 50%;
	bottom: 0%;
}
.page5_img1,
.page5_img2{
	position: absolute;
	background: url(../images/page5_img1.png) top center no-repeat;
	background-size: contain;
	width: 55%;
	height: 8%;
	top: 13%;
	left: 22.5%;
}
.page5_img2{
	background: url(../images/page5_img2.png) top center no-repeat;
	background-size: contain;
	top: 26%;
}
.page5_txt1,
.page5_txt2,
.page5_txt3,
.page5_txt4,
.page5_txt5{
	position: absolute;
	text-align: left;
	width: 100%;
	top: 19%;
	left: 24%;
}
.page5_txt3{
	top: 22%;
}
.page5_txt2{
	top: 32%;
	left: 21.5%;
}
.page5_txt4{
	top: 35%;
	left: 21.5%;
}
.page5_txt5{
	top: 38%;
	left: 21.5%;
}


.page5_img3{
	position: absolute;
	background: url(../images/page5_img3.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 43%;
	bottom: 7%;
}
.page5_img4{
	position: absolute;
	background: url(../images/page5_img4.png) top center no-repeat;
	background-size: contain;
	width: 24%;
	height: 24%;
	top: 41%;
	left: 9%;
}
.page5_img5{
	position: absolute;
	background: url(../images/page5_img5.png) top center no-repeat;
	background-size: contain;
	width: 36%;
	height: 36%;
	top: 42%;
	right: 3%;
}



.page6_img1,
.page6_img2,
.page6_img3{
	position: absolute;
	background: url(../images/page6_img1.png) top center no-repeat;
	background-size: contain;
	width: 55%;
	height: 8%;
	top: 13%;
	left: 22.5%;
}
.page6_img2{
	background: url(../images/page6_img2.png) top center no-repeat;
	background-size: contain;
	top: 25.5%;
}
.page6_img3{
	background: url(../images/page6_img3.png) top center no-repeat;
	background-size: contain;
	top: 41.5%;
}
.page6_txt1,
.page6_txt1_2,
.page6_txt2,
.page6_txt3,
.page6_txt3_2{
	position: absolute;
	width: 100%;
	top: 22%;
	left: 23%;
}
.page6_txt1_2{
	top: 19%;
}
.page6_txt2{
	top: 31.5%;
}
.page6_txt2 p{
	margin-bottom: 2%;
}
.page6_txt3{
	top: 47%;
}
.page6_txt3_2{
	top: 50%;
}
.page6_img4{
	position: absolute;
	background: url(../images/page6_img4.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 41%;
	bottom: 3%;
}
.page7_img1{
	position: absolute;
	background: url(../images/page7_img1.png) top center no-repeat;
	background-size: contain;
	width: 55%;
	height: 30%;
	top: 13%;
	left: 22.5%;
}
.page7 .ph0{
	position: relative;
	width:  58%;
	top: 38%;
	left: 14.5%;
}
.page7_ul{
	position: relative;
	width:  70%;
	top: 39%;
	left: 19%;
}
.page7_ul li{
	color: #fe0103;
}
.page7_ul li p{
	color: #000;
	letter-spacing: -0.7px;

}
.page7_img2{
	position: absolute;
	background: url(../images/page7_img2.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 35%;
	bottom: 3%;
}
.page7_img3{
	position: absolute;
	background: url(../images/page7_img3.png) top center no-repeat;
	background-size: contain;
	width: 12%;
	height: 12%;
	top: 63%;
	left: 8%;
}
.page7_img4{
	position: absolute;
	background: url(../images/page7_img4.png) top center no-repeat;
	background-size: contain;
	width: 13%;
	height: 13%;
	top: 57%;
	right: 6%;
}
.ph1,
.ph2{
	position: relative;
	width:  58%;
	margin-top: 2%;
	left: -6%;
}
.ph2{
	margin-top: -2%;
}

.page8_img1{
	position: absolute;
	background: url(../images/page8_img1.png) top center no-repeat;
	background-size: contain;
	width: 100%;
	height: 11%;
	top: 13%;
}
.page8_img2{
	position: absolute;
	background: url(../images/page8_img2.png) top center no-repeat;
	background-size: contain;
	width: 42%;
	height: 28%;
	top: 32%;
	left: 29%;
}
.page8_img3{
	position: absolute;
	background: url(../images/page8_img3.png) top center no-repeat;
	background-size: contain;
	width: 65%;
	height: 35%;
	bottom: 0;
	right: 0;
}
.page_down{
	position: absolute;
	background: url(../images/page_down.png) top center no-repeat;
	background-size: contain;
	width: 10%;
	height: 6%;
	top: 95%;
	left: 45%;
	animation: page_down 3s ease infinite;
	-webkit-animation: page_down 3s ease infinite;
}
@keyframes page_down{
	0%{opacity: 0;}
	50%{opacity: 1; transform: translate3d(0,-40%,0);}
	100%{opacity: 0; transform: translate3d(0,-80%,0);}
}
@-webkit-keyframes page_down{
	0%{opacity: 0;}
	50%{opacity: 1; -webkit-transform: translate3d(0,-40%,0);}
	100%{opacity: 0; -webkit-transform: translate3d(0,-80%,0);}
}
.music_btn{
	position: absolute;
	display: block;
	width: 8%;
	right: 23%;
	top: 3%;
}

.music_btn span{
 	display: block;
  	width: 100%;
  	height: 100%;
 	background:url(../images/musicBtn.png) center center no-repeat;
 	background-size: 100% 100%;
}

.music_anim{
    animation: music_a 2s linear infinite;
    -webkit-animation: music_a 2s linear infinite;
}

@keyframes music_a{
	from { transform:rotate(0deg); }
	to { transform:rotate(360deg); }
}
@-webkit-keyframes music_a{
	from{ -webkit-transform:rotate(0deg); }
	to{ -webkit-transform:rotate(360deg); }
}
@-moz-keyframes music_a{
	from{ transform:rotate(0deg); }
	to{ transform:rotate(360deg); }
}

@-o-keyframes music_a{
	from{ transform:rotate(0deg); }
	to{ transform:rotate(360deg); }
}