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/p1.jpg?2') 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: 110%;}
.loading_line{width:60%;height:3px;position:absolute;left:20%;background:#cc8f56;}
.loading_line_blank{width:0%;height:100%;background:#5e3404;}
.lightning{position:absolute;width:100%;height:37%;top:14%;background:url('../images/p1.2.png');background-size: 100% 100%;
		animation: lightning 1s infinite;
		-moz-animation: lightning 1s infinite;
		-webkit-animation: lightning 1s infinite;
		-o-animation: lightning 1s infinite;}

.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;}

.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/p1.jpg?2');background-size: 100% 100%;}
#p0.active .w0{background: url('../images/p1.3.png?2') no-repeat;background-size:100% 100%;top:62%;width: 100%;height: 17%;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;}



#p1 .w0{overflow: hidden;width: 100%;height: 100%;opacity:1;}
.nohave1{background:url('../images/p2.2.jpg?2') no-repeat 0% 0%;background-size: 100% 100%;opacity:1;width: 300%;height: 100%;}

#p2{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p2.active .w0{background: url('../images/p1.4.png?2') no-repeat;background-size:100% 100%;top:38%;width: 100%;height: 14%;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;}

#p3 .w0{overflow: hidden;width: 100%;height: 100%;opacity:1;}
.have1{background:url('../images/p2.1.jpg?2') no-repeat 0% 0%;background-size: 100% 100%;opacity:1;width: 300%;height: 100%;}
.electric{background:url('../images/p2.2.png?2') no-repeat 0% 0%;background-size:100% 100%;top:38%;left: 44%;z-index: 10;width: 13%;height: 25%;animation: lightning 1s infinite;
		-moz-animation: lightning 1s infinite;
		-webkit-animation: lightning 1s infinite;
		-o-animation: lightning 1s infinite;}

#p4{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p4.active .w0{background: url('../images/p2.3.png?2') no-repeat;background-size:100% 100%;top:32%;width: 100%;height: 30%;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;}



#p5{background-image:url('../images/p3.1.jpg?2');background-size: 100% 100%;}
#p5.active .w0{background: url('../images/P3.7.png?2') no-repeat;background-size:100% 100%;top:22%;width: 100%;height: 6%;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;}
#p5.active .w1{background: url('../images/p3.2.png?2') no-repeat;background-size:100% 100%;top:37%;width: 100%;height: 27%;animation: lightning 1s infinite;
		-moz-animation: lightning 1s infinite;
		-webkit-animation: lightning 1s infinite;
		-o-animation: lightning 1s infinite;}

#p6{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p6.active .w0{background: url('../images/p1.4.png?2') no-repeat;background-size:100% 100%;top:38%;width: 100%;height: 14%;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;}

#p7{background-image:url('../images/p3.4.jpg?2');background-size: 100% 100%;}
#p7.active .w0{background: url('../images/p3.8.png?2') no-repeat;background-size:100% 100%;top:20%;width: 100%;height: 6%;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;}
#p7.active .w1{background: url('../images/p3.5.png?2') no-repeat;background-size:100% 100%;top:37%;left:54%;width: 4.2%;height: 4.6%;animation: lightning 1s infinite;
		-moz-animation: lightning 1s infinite;
		-webkit-animation: lightning 1s infinite;
		-o-animation: lightning 1s infinite;}

#p8{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p8.active .w0{background: url('../images/p3.6.png?2') no-repeat;background-size:100% 100%;top:32%;width: 100%;height: 30%;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;}

#p9{background-image:url('../images/p4.2.jpg?2');background-size: 100% 100%;}
#p9.active .w0{background: url('../images/p4.6.png?2') no-repeat;background-size:100% 100%;top:14%;width: 100%;height: 15%;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;}
#p9.active .w1{background: url('../images/p4_2.png') no-repeat;background-size:100% 100%;top:0%;width: 100%;height: 100%;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;}

#p10{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p10.active .w0{background: url('../images/p1.4.png?2') no-repeat;background-size:100% 100%;top:38%;width: 100%;height: 14%;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;}


#p11{background-image:url('../images/p4.1.jpg?2');background-size: 100% 100%;}
#p11.active .w0{background: url('../images/p4.5.png?2') no-repeat;background-size:100% 100%;top:14%;width: 100%;height: 15%;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;}
#p11.active .w1{background: url('../images/p4_1.png') no-repeat;background-size:100% 100%;top:0%;width: 100%;height: 100%;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;}

#p12{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p12.active .w0{background: url('../images/p4.4.png?2') no-repeat;background-size:100% 100%;top:30%;width: 100%;height: 30%;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;}
#p12.active .w1{background-image:url('../images/dz.jpg?2');background-size: 100% 100%;width:84%;height:25%;left:8%;top:24%;animation: fadeIn 1s ease both;-moz-animation: fadeIn 1s ease;-webkit-animation: fadeIn 1s ease both;-o-animation:fadeIn 1s ease both;}

#p13{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p13.active .w0{background: url('../images/p5.1.png?2') no-repeat;background-size:100% 100%;top:35%;width: 100%;height: 17%;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;}

#p14{background-image:url('../images/p6.jpg?2');background-size: 100% 100%;}
#p14.active .w0{background: url('../images/p5.4.png?2') no-repeat;background-size:100% 100%;top:12%;width: 100%;height: 23%;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;}
#p14.active .w1{background: url('../images/p5.2.png?2') no-repeat;background-size:100% 100%;top:31%;left:46%;width: 30%;height: 10%;opacity:1;animation: disk 5s infinite;
		-moz-animation: disk 5s infinite;
		-webkit-animation: disk 5s infinite;
		-o-animation: disk 5s infinite;}

#p15{background-image:url('../images/p7.jpg?2');background-size: 100% 100%;}
#p15.active .w0{background: url('../images/p6.3.png?2') no-repeat;background-size:100% 100%;top:12%;width: 100%;height: 20%;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;}
#p15.active .w1{background: url('../images/p6.2.png?2') no-repeat;background-size:100% 100%;top:36%;left:30%;width: 36%;height: 15%;opacity:1;
		animation: wave 3s infinite;
		-moz-animation: wave 3s infinite;
		-webkit-animation: wave 3s infinite;
		-o-animation: wave 3s infinite;}

#p16{background-image:url('../images/p8.jpg?2');background-size: 100% 100%;}
#p16.active .w0{background: url('../images/p7.2.png?2') no-repeat;background-size:100% 100%;top:8%;width: 100%;height: 25%;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;}
#p17{background-image:url('../images/p9.jpg?2');background-size: 100% 100%;}
#p17.active .w0{background: url('../images/p8.3.png?2') no-repeat;background-size:100% 100%;top:60%;width: 100%;height: 24%;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;}
#p17.active .w1{background: url('../images/p8.2.png?2') no-repeat;background-size:100% 100%;top:14%;width: 100%;height: 42%;animation: fadeIn 3s ease both;-moz-animation: fadeIn 3s ease;-webkit-animation: fadeIn 3s ease both;-o-animation:fadeIn 3s ease both;}
#p18{background-image:url('../images/last.jpg?2');background-size: 100% 100%;}
#p18 .w0{width:32%;height:8%;left:35%;top:63%;}
#p18 .w1{width:32%;height:8%;left:35%;top:74%;}
.select{height:100%;}
.about{position:absolute;width:100%;height:100%;background:url('../images/about.png?2');background-size:100% 100%;z-index:20;display:none;}

.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 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}}


@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%;}
}