html,body{margin: 0 auto;width: 100%;height: 100%;top:0;bottom:0;position: absolute;}
.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;}
.loading{position:absolute;width:100%;height:100%;background:url('../images/p0.jpg?1');background-size:100% 100%;z-index: 99}
.load_val{width:100%;}
.loading_line{position:absolute;width:60.38%;height:8px;top:49.1%;left:20.77%;background:#422a0e;border-radius: 4px;}
.loading_line_blank{width:0%;height:100%;background:#faf222;border-radius:4px;}
a{opacity:1}
/*loading*/

/*音乐*/
.music_blk{z-index:999;position:fixed;bottom:10px;left:10px;}
.music{display:block;width:30px;height:30px;background:url('../images/music_on.png') no-repeat;background-size:100% 100%;}
.music_on{
    -webkit-animation:rotate 1.2s linear infinite;
    animation:rotate 1.2s linear infinite;
}



.start{position:absolute;width:100%;height:100%;background:url('../images/p0.1.png?1');background-size:100% 100%;display: none}
.start_click{position: absolute;top:81%;left:30%;width: 42%;height:10%}
#center{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/bg.jpg?1") no-repeat 0 0;background-size:100% 100%;}
.s1,.s2,.s3,.s4,.s5,.s6,.s7{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/bg.jpg?1") no-repeat 0 0;background-size:100% 100%;display: none}
.s1 .bg1{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p1.1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s2 .bg1{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p2.1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s3 .bg1{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p3.1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s4 .bg1{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p4.1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s5 .bg1{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p5.1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s6 .bg1{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p6.1.png?1") no-repeat 0 0;background-size:100% 100%;}






.s1 .bg3{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p1.2.png?1") no-repeat 0 0;background-size:100% 100%;}
.s2 .bg3{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p2.2.png?1") no-repeat 0 0;background-size:100% 100%;}
.s3 .bg3{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p3.2.png?1") no-repeat 0 0;background-size:100% 100%;}
.s4 .bg3{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p4.2.png?1") no-repeat 0 0;background-size:100% 100%;}
.s5 .bg3{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p5.2.png?1") no-repeat 0 0;background-size:100% 100%;}
.s6 .bg3{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p6.2.png?1") no-repeat 0 0;background-size:100% 100%;}


.bg2{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/p1.3.png?1") no-repeat 0 0;background-size:100% 100%;}
.bg4{width: 35.74%;height: 5.5%;opacity:0;position: absolute;top:83.6%;left:32.1%;background:url("../images/p1.4.png?1") no-repeat 0 0;background-size:100% 100%;}
.bg5{width:47.8%;height:7.4%;opacity:1;position: absolute;top:65.9%;left:26.08%;background:url("../images/p1.5.png?1") no-repeat 0 0;background-size:100% 100%;display:none;}
.bg1_2{display:none;width: 97.1%;height: 33.78%;opacity:1;position: absolute;top:14.58%;left:1.45%;background:url("../images/p1.gif?1") no-repeat 0 0;background-size:100% 100%;display:none}

.end{background:url("../images/end.png?1") no-repeat 0 0;background-size:100% 100%;}
.s7_w0{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p7.1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s7_w1{width: 100%;height: 100%;opacity:0;position: absolute;top:0;left:0;background:url("../images/p7.2.png?1") no-repeat 0 0;background-size:100% 100%;}
.s7_click{position: absolute;top:76%;left:30%;width: 42%;height:10%}
.s1.ani .bg3,.s2.ani .bg3,.s3.ani .bg3,.s4.ani .bg3,.s5.ani .bg3,.s6.ani .bg3,.s7.ani .s7_w0{
    -webkit-animation:1.5s Out  both;
    -o-animation:1.5s Out  both;
    -moz-animation:1.5s Out  both;
    animation:1.5s Out  both ;
}
.s1.ani .bg4,.s2.ani .bg4,.s3.ani .bg4,.s4.ani .bg4,.s5.ani .bg4,.s6.ani .bg4,.s7.ani .s7_w1{
    -webkit-animation:1.5s 0.5s Out  both;
    -o-animation:1.5s 0.5s Out  both;
    -moz-animation:1.5s 0.5s  Out  both;
    animation:1.5s 0.5s Out  both ;
}


@keyframes Out{

    0%{opacity:0}
    100%{opacity:1}
}
@-webkit-keyframes Out{
    0%{opacity: 0}
    100%{opacity:1}
}
@-o-keyframes Out{
    0%{opacity: 0}
    100%{opacity:1}

}
@-moz-keyframes Out{
    0%{opacity: 0}
    100%{opacity:1}

}

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

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

@keyframes rotate {
  0 {
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
  }

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