body{margin:0;padding:0;font-family:"Microsoft YaHei";}

.tips_blk{z-index:99999999999;position:absolute;left:50%;bottom:10px;width:130px;height: 20px;margin-left:-65px;text-align:center;}
.tips_blk p{z-index:99999999999;font-size:10px;color:#FFF;}
.tips_blk_hide p{z-index:99999999999;display:none;}
.music_blk{z-index:99999999999;position:absolute;left:10px;bottom:10px;}
.music{display:block;width:23px;height:23px;background:url('../images/music.png') no-repeat;background-size:23px 23px;}
.music_on{-webkit-animation:music 1.2s linear infinite;animation:music 1.2s linear infinite;}
.loading{position:absolute;width:100%;height:100%;background:url('../images/loading.jpg') no-repeat;background-size: 100% 100%;z-index: 10;}
.suggest{position:fixed;bottom:0;width:100%;text-align:center;color:white;font-size:12px;}
.load_val{width:100%;}
.load_wave{margin-top: 80%;}
.loading_line{width:60%;height:3px;position:absolute;left:20%;background:#cc8f56;}
.loading_line_blank{width:0%;height:100%;background:#5e3404;}

.coypright{position:fixed;bottom:8%;width:100%;text-align:center;color:#5e3404;font-size:16px;}

.swiper-container{position:absolute;width:100%;height:100%}
.swiper-slide{position:relative;overflow:hidden}
.swiper-slide *{position:absolute;opacity:0;}
.swiper-slide section{position:absolute;width:100%;height:100%;display:none;background-size:100% 100%;}
section div{width:100%;height:100%;}
.up {
    margin: auto;
    left: 0;
    right: 2px;
    bottom: 2.8%;
    width: 29px;
    height: 14px;
    opacity:1;
	animation: arrow 1s infinite;
		-moz-animation: arrow 1s infinite;
		-webkit-animation: arrow 1s infinite;
		-o-animation: arrow 1s infinite;
}
.up *{opacity:1;}



#p0{background-image:url('../images/p0.jpg');background-size: 100% 100%;}
#p0 .w0{background-image:url('../images/p0.1.png');background-size: 100% 100%;}
#p0.active .w0{-webkit-animation:coin 1s both;}
#p1{background-image:url('../images/p1.jpg');background-size: 100% 100%;}
#p1 .w0{background-image:url('../images/p1.1.png');background-size: 100% 100%;}
#p1 .w1{background-image:url('../images/p1.2.png');background-size: 100% 100%;}
#p1 .w2{background-image:url('../images/p1.3.png');background-size: 100% 100%;}
#p1 .w3{background-image:url('../images/p1.4.png');background-size: 100% 100%;}
#p1 .w4{background-image:url('../images/p1.5.png');background-size: 100% 100%;}
#p1 .w5{background-image:url('../images/p1.6.png');background-size: 100% 100%;}
#p1 .w6{background-image:url('../images/p1.7.png');background-size: 100% 100%;}
#p1 .w7{background-image:url('../images/p1.8.png');background-size: 100% 100%;}
#p1 .w8{width:70%;height:13%;bottom:20%;left:15%;}
#p1.active .w0{-webkit-animation:fadePop 2s 1s both;}
#p1.active .w1{-webkit-animation:fadePop 3s 3s both;}
#p1.active .w2{-webkit-animation:fadePop 2s 6s both;}
#p1.active .w3{-webkit-animation:fadePop 5s 8s both;}
#p1.active .w4{-webkit-animation:fadeIn 1s 13s both;}
#p1.active .w5{-webkit-animation:fadeIn 1s 14s both;}
#p1.active .w6{-webkit-animation:fadeIn 1s 15s both;}
#p1.active .w7{-webkit-animation:fadeIn 1s 16s both;}


.q{background-image:url('../images/p2.jpg');background-size: 100% 100%;position:absolute;width:100%;height:100%;z-index:9;display:none;text-align:justify;}
.q .title{width:64%;height:25%;top:24%;position:absolute;left:18%;line-height:1.6;}
.q .option{position:absolute;width:100%;height:7%;z-index:9;text-align:center;line-height:2.8;font-size:14px;}
.a{top:60%;background-image:url('../images/p2.1.png');background-size: 100% 100%;}
.b{top:70%;background-image:url('../images/p2.2.png');background-size: 100% 100%;}
.c{top:80%;background-image:url('../images/p2.3.png');background-size: 100% 100%;}
.right{position:absolute;width:100%;height:100%;background-image:url('../images/p3.jpg');background-size: 100% 100%;display:none;z-index:10;}
.error{position:absolute;width:100%;height:100%;background-image:url('../images/p4.jpg');background-size: 100% 100%;display:none;z-index:10;}
.t{position:absolute;width:66%;height:42%;left:19%;top:23%;}
.n{position:absolute;width:70%;height:12%;left:15%;bottom:15%;}

#q16{background-image:url('../images/p5.jpg');background-size: 100% 100%;position:absolute;width:100%;height:100%;z-index:9;display:none;}
#q16 .w1{background-image:url('../images/p5.1.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;display:none;}
#q16 .w2{background-image:url('../images/p5.2.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;display:none;}
#q16 .w3{background-image:url('../images/p5.3.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;z-index:20;}
#q16 .w4{background-image:url('../images/p5.10.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;z-index:20;}
#q16 .w5{background-image:url('../images/p5.5.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;z-index:20;}
#q16 .w6{background-image:url('../images/p5.6.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;display:none;z-index:40;}
#q16 .w7{background-image:url('../images/p5.7.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;display:none;}
#q16 .w8{background-image:url('../images/p5.8.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;display:none;}
#q16 .w9{background-image:url('../images/p5.9.png');background-size: 100% 100%;position:absolute;width:100%;height:100%;z-index:20;}
#q16 .w10{position:absolute;width:20%;height:15%;z-index:20;bottom:12%;left:20%;}
#q16 .w11{position:absolute;width:100%;height:100%;z-index:50;display:none;}
.rr{position:absolute;top:13%;left:49%;}
.replay,.go{position:absolute;top:45%;left:15%;width:70%;height:10%;z-index:30;}
.desc{position:absolute;top:60%;left:15%;width:70%;height:10%;z-index:30;}
.close{position:absolute;top:70%;left:42%;width:16%;height:10%;}
.link{position:absolute;bottom:15%;left:42%;width:40%;height:10%;z-index:30;}

.active .fadeIn{opacity:0;animation: fadeIn 1s 1s ease both;-moz-animation: fadeIn 1s 1s ease;-webkit-animation: fadeIn 1s 1s ease both;-o-animation:fadeIn 1s 1s ease both;}
.active .fadeInUp{opacity:0;animation: fadeInUp 1s 1s ease both;-moz-animation: fadeInUp 1s 1s ease;-webkit-animation: fadeInUp 1s 1s ease both;-o-animation:fadeInUp 1s 1s ease both;}
.active .fadeInDown{opacity:0;animation: fadeInDown 1s 1s ease both;-moz-animation: fadeInDown 1s 1s ease;-webkit-animation: fadeInDown 1s 1s ease both;-o-animation:fadeInDown 1s 1s ease both;}
.active .fadeInLeft{opacity:0;animation: fadeInLeft 1s 1s ease both;-moz-animation: fadeInLeft 1s 1s ease;-webkit-animation: fadeInLeft 1s 1s ease both;-o-animation:fadeInLeft 1s 1s ease both;}
.active .fadeInRight{opacity:0;animation: fadeInRight 1s 1s ease both;-moz-animation: fadeInRight 1s 1s ease;-webkit-animation: fadeInRight 1s 1s ease both;-o-animation:fadeInRight 1s 1s ease both;}

@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}


@-webkit-keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
@-moz-keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}
@keyframes fadeIn{0%{opacity:0;}100%{opacity:1;}}

@-webkit-keyframes fadePop{0%{opacity:0;}2%{opacity:1;}98%{opacity:1;}100%{opacity:0;}}
@-moz-keyframes fadePop{0%{opacity:0;}2%{opacity:1;}98%{opacity:1;}100%{opacity:0;}}
@keyframes fadePop{0%{opacity:0;}2%{opacity:1;}98%{opacity:1;}100%{opacity:0;}}

@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes coin{
0%{opacity:0;-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
100%{opacity:1;-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}
@keyframes coin{
0%{opacity:0;-webkit-transform:perspective(400px) rotate3d(0,1,0,-360deg);transform:perspective(400px) rotate3d(0,1,0,-360deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
40%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
50%{-webkit-transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);transform:perspective(400px) translate3d(0,0,150px) rotate3d(0,1,0,-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95);transform:perspective(400px) scale3d(.95,.95,.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}
100%{opacity:1;-webkit-transform:perspective(400px);transform:perspective(400px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}

@keyframes lightning {
	0%{opacity:0;}
	15%{opacity:1;}
	30%{opacity:0;}
	45%{opacity:1;}
	80%{opacity:0;}
	100%{opacity:0;}
}
@-webkit-keyframes lightning {
	0%{opacity:0;}
	15%{opacity:1;}
	30%{opacity:0;}
	45%{opacity:1;}
	80%{opacity:0;}
	100%{opacity:0;}
}

@keyframes disk {
	0%{top:-10%;left:46%;}
	30%{top:41%;left:46%;}
	50%{top:41%;left:46%;}
	65%{top:35%;left:46%;}
	80%{top:-10%;left:-30%;}
	100%{top:-10%;left:46%;}
}
@-webkit-keyframes disk {
	0%{top:-10%;left:46%;}
	30%{top:41%;left:46%;}
	50%{top:41%;left:46%;}
	65%{top:35%;left:46%;}
	80%{top:-10%;left:-30%;}
	100%{top:-10%;left:46%;}
}

@keyframes wave {
	0%{background-image:url('../images/w1.png');}
	20%{background-image:url('../images/w2.png');}
	40%{background-image:url('../images/w3.png');}
	60%{background-image:url('../images/w4.png');}
	80%{background-image:url('../images/w5.png');}
	100%{background-image:url('../images/w1.png');}
}
@-webkit-keyframes wave {
	0%{background-image:url('../images/w1.png');}
	20%{background-image:url('../images/w2.png');}
	40%{background-image:url('../images/w3.png');}
	60%{background-image:url('../images/w4.png');}
	80%{background-image:url('../images/w5.png');}
	100%{background-image:url('../images/w1.png');}
}

@keyframes music{
	0%{transform: rotate(0)}
	100%{transform: rotate(360deg)}
}
@-webkit-keyframes music{
	0%{transform: rotate(0); -webkit-transform: rotate(0)}
	100%{transform: rotate(360deg); -webkit-transform: rotate(360deg)}
}

@keyframes arrow{
	0%{bottom: 3%;}
	10%{bottom: 3%;}
	95%{bottom: 5%;}
	0%{bottom: 3%;}
}
@-webkit-keyframes arrow{
	0%{bottom: 3%;}
	10%{bottom: 3%;}
	95%{bottom: 5%;}
	0%{bottom: 3%;}
}