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/loading.jpg?1');background-size:100% 100%;z-index: 99}
.load_anime{position:absolute;top:0;left:0;width:100%;height:100%;background:url('../images/loading.1.png?1');background-size:100% 100%;}
.load_val{width:100%;}
.loading_line{position:absolute;top:0;left:-41%;width:100%;height:100%;background:url('../images/loading.2.png?1');background-size:100% 100%;opacity: 0}
/*.loading_line_blank{width:0%;height:100%;background:#ff9d79;}*/
.loading_mask{width:29.46%;height:6.54%;position:absolute;top:70.16%;left:0;background:url('../images/loading.3.jpg?1');background-size:100% 100%;}
a{opacity:1}
/*loading*/

/*音乐*/
.music_blk{z-index:999;position:fixed;right:10px;top: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;
}


#center{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;}
.s0{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;}
.s0 .xx{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/p0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
.s0 .bg0{width: 100%;height: 100%;position:absolute;top:0;left:0;margin: 0 auto;overflow: hidden;background:url("../images/p0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
.s0 .bg1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p0.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
.s0 .bg2{width: 29.2%;height: 10.56%;position: absolute;top:20.62%;left:8.32%;background:url("../images/p0.2.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
.s0 .bg3{width: 21.73%;height: 9.37%;position: absolute;top:25.66%;left:66.32%;background:url("../images/p0.3.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
/*.s0 .bg4{width: 16.62%;height: 7.9%;position: absolute;top:77.66%;left:73.32%;background:url("../images/p0.4.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}*/
.s0 .s0_click1{width: 100%;height: 100%;position: absolute;top:15%;left:18%;background:url("../images/p0.4.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
/*.c1{width: 100%;height: 100%;position:absolute;top:0;left:0;}*/
.s0.ani .bg0{
    -webkit-animation:2s 2s s0_bg0 linear both;
    -o-animation:2s 2s s0_bg0 linear both;
    -moz-animation:2s 2s  s0_bg0 linear both;
    animation:2s 2s s0_bg0 linear both;
}

/*.s0.ani .bg1{*/
    /*-webkit-animation:8s 5.5s s0_bg0 linear both;*/
    /*-o-animation:8s 5.5s s0_bg0 linear both;*/
    /*-moz-animation:8s 5.5s  s0_bg0 linear both;*/
    /*animation:8s 5.5s s0_bg0 linear both;*/
/*}*/

.s0.ani .bg2{
    -webkit-animation:15s s0_bg2 linear infinite;
    -o-animation:15s  s0_bg2 linear infinite;
    -moz-animation:15s s0_bg2 linear infinite;
    animation:15s s0_bg2 linear infinite ;
}
.s0.ani .bg3{
    -webkit-animation:15s s0_bg2 linear infinite;
    -o-animation:15s s0_bg2 linear infinite;
    -moz-animation:15s  s0_bg2 linear infinite;
    animation:15s s0_bg2 linear infinite ;
}
.s0.ani .s0_click1{
    -webkit-animation:1.5s 4.5s  Out1 linear infinite;
    -o-animation:1.5s 4.5s  Out1 linear infinite;
    -moz-animation:1.5s 4.5s Out1 linear infinite;
    animation:1.5s 4.5s Out1 linear infinite ;
}

.s1{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/p1.jpg?1") no-repeat 0 0;background-size:300% 100%;}
.s1 .bg{width: 300%;height: 100%;top:0;left:0;background:url("../images/p1.jpg?1") no-repeat 0 0;background-size:100% 100%;position: absolute}
.s1 .bg0{width: 6.45%;height: 45.38%;position: absolute;top:16.66%;left:15.32%;background:url("../images/p1.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg1{width: 7.08%;height: 33.18%;position: absolute;top:6.25%;left:26.32%;background:url("../images/p1.2.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg2{width: 8.45%;height: 38.24%;position: absolute;top:33.77%;left:50.86%;background:url("../images/p1.3.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg3{width: 10.08%;height: 38.8%;position: absolute;top:53.2%;left:60.5%;background:url("../images/p1.4.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg4{width: 30.98%;height: 15%;position: absolute;top:47.9%;left:67.47%;background:url("../images/p1.5.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg5{width: 15%;height: 18.7%;position: absolute;top:11.9%;left:84.3%;background:url("../images/p1.7.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
.s1 .s1_click1{width: 20.16%;height: 16.6%;position: absolute;top:74.16%;left:74%;background:url("../images/p1.6.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .add{width: 10.95%;height: 41.22%;position: absolute;top:40.92%;left:34.86%;background:url("../images/add.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1.ani .bg{
    -webkit-animation:20s 2s s1_bg linear both;
    -o-animation:20s 2s s1_bg linear both;
    -moz-animation:20s 2s  s1_bg linear both;
    animation:20s 2s s1_bg linear both;
}

.s1.ani .bg0{
    -webkit-animation:0.5s 0.1s s1_bg0 linear both;
    -o-animation:0.5s 0.1s s1_bg0 linear both;
    -moz-animation:0.5s 0.1s  s1_bg0 linear both;
    animation:0.5s 0.1s s1_bg0 linear both ;
}

.s1.ani .bg1{
    -webkit-animation:1s 2.2s Out linear both;
    -o-animation:1s 2.2s Out linear both;
    -moz-animation:1s 2.2s  Out linear both;
    animation:1s 2.2s Out linear both ;
}
.s1.ani .add{
    -webkit-animation:1s 5.1s Out linear both;
    -o-animation:1s 5.1s Out linear both;
    -moz-animation:1s 5.1s  Out linear both;
    animation:1s 5.1s Out linear both ;
}


.s1.ani .bg2{
    -webkit-animation:1s 8s Out linear both;
    -o-animation:1s 8s Out linear both;
    -moz-animation:1s 8s  Out linear both;
    animation:1s 8s Out linear both ;
}

.s1.ani .bg3{
    -webkit-animation:9s 13s Out11 linear both;
    -o-animation:9s 13s Out11 linear both;
    -moz-animation:9s 13s  Out11 linear both;
    animation:9s 13s Out11 linear both ;
}
.s1.ani .bg4{
    -webkit-animation:1s 15s Out linear both;
    -o-animation:1s 15s Out linear both;
    -moz-animation:1s 15s  Out linear both;
    animation:1s 15s Out linear both ;
}
.s1.ani .bg5{
    -webkit-animation:5s 16s s1_bg5  linear infinite;
    -o-animation:5s 16s s1_bg5 linear infinite;
    -moz-animation:5s 16s  s1_bg5 linear infinite;
    animation:5s 16s s1_bg5 linear infinite ;
}

.s1.ani .s1_click1{
    -webkit-animation:1.5s 20s Out1 linear infinite;
    -o-animation:1.5s 20s Out1 linear infinite;
    -moz-animation:1.5s 20s  Out1 linear infinite;
    animation:1.5s 20s Out1 linear infinite ;
}
#ss{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;}
#s0{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;background:url("../images/p2.jpg?1") no-repeat 0 0;background-size:100% 100%;position: relative}
.s0_0{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
#s1{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;background:url("../images/p3.jpg?1") no-repeat 0 0;background-size:100% 100%;position: relative}
#s2{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;background:url("../images/p4.jpg?1") no-repeat 0 0;background-size:100% 100%;}
.arrow{position:absolute;width: 11%;height: 6%;opacity:0;background:url("../images/arrow.png?1") no-repeat 0 0;background-size:100% 100%;top:92%;left:45%}
#s0.ani .s0_0{
    -webkit-animation:0.6s 0.2s Out linear both;
    -o-animation:0.6s 0.2s Out linear both;
    -moz-animation:0.6s 0.2s  Out linear both;
    animation:0.6s 0.2s Out linear both ;
}

#s0.ani .arrow,#s1.ani .arrow{
    -webkit-animation:0.8s 1s arrow linear infinite;
    animation:0.8s 1s arrow linear infinite ;
}
@-webkit-keyframes Out111{
    0%{opacity: 0}
    100%{opacity:1}
}
@-o-keyframes Out111{
    0%{opacity: 0}
    100%{opacity:1}
}
@-moz-keyframes Out111{
    0%{opacity: 0}
    100%{opacity:1}
}
@keyframes Out111{
    0%{opacity: 0}
    100%{opacity:1 }
}

@-webkit-keyframes shake{
    0%{opacity: 1}
    20%{opacity:0}
    40%{opacity: 1}
    60%{opacity:0}
    80%{opacity:1}
    100%{opacity: 0}
}
@-o-keyframes shake{
    0%{opacity: 1}
    20%{opacity:0}
    40%{opacity: 1}
    60%{opacity:0}
    80%{opacity:1}
    100%{opacity: 0}
}
@-moz-keyframes shake{
    0%{opacity: 1}
    20%{opacity:0}
    40%{opacity: 1}
    60%{opacity:0}
    80%{opacity:1}
    100%{opacity: 0}
}
@keyframes shake{
    0%{opacity: 1}
    20%{opacity:0}
    40%{opacity: 1}
    60%{opacity:0}
    80%{opacity:1}
    100%{opacity: 0}
}



@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}
}

@keyframes Out11 {     /*逐渐显示*/
    0% {  opacity: 0;  }
    20% {  opacity: 1;  }
    90% {  opacity: 1;  }
    100% {  opacity: 0;  }
}
@-webkit-keyframes Out11 {     /*逐渐显示*/
    0% {  opacity: 0;  }
    20% {  opacity: 1;  }
    90% {  opacity: 1;  }
    100% {  opacity: 0;  }
}
@-moz-keyframes Out11 { /*逐渐显示*/
    0% {  opacity: 0;  }
    20% {  opacity: 1;  }
    90% {  opacity: 1;  }
    100% {  opacity: 0;  }
}
@-o-keyframes Out11 {     /*逐渐显示*/
    0% {  opacity: 0;  }
    20% {  opacity: 1;  }
    90% {  opacity: 1;  }
    100% {  opacity: 0;  }
}


@-webkit-keyframes arrow {
    0% {-webkit-transform:translate3d(0,0,0);opacity: 0}
    100% {-webkit-transform:translate3d(0,-30%,0);opacity: 1}

}
@keyframes arrow {
    0% {transform:translate3d(0,0,0);opacity: 0}
    100% {transform:translate3d(0,-30%,0);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);
  }
}



@-webkit-keyframes s1_bg {
    0% { -webkit-transform:translate3d(0,0,0); }
    100% { -webkit-transform:translate3d(-66.7%,0,0); }
}
@keyframes s1_bg {
    0% { transform:translate3d(0,0,0)}
    100% {transform:translate3d(-66.7%,0,0);}
}

@-webkit-keyframes s1_bg0 {
    0% { -webkit-transform:scale(0.01); opacity: 1}
    100% {-webkit-transform:scale(1);opacity: 1 }
}
@keyframes s1_bg0 {
    0% {transform:scale(0.01);opacity: 1}
    100% {transform:scale(1) ; opacity: 1}
}

@-webkit-keyframes Out1{
    0%{opacity: 0}
    50%{opacity:1}
    100%{opacity:0}
}
@-o-keyframes Out1{
    0%{opacity: 0}
    50%{opacity:1}
    100%{opacity:0}
}
@-moz-keyframes Out1{
    0%{opacity: 0}
    50%{opacity:1}
    100%{opacity:0}
}
@keyframes Out1{
    0%{opacity: 0}
    50%{opacity:1}
    100%{opacity:0}
}

@-webkit-keyframes s0_bg0 {
    0% {-webkit-transform-origin:36.6% 64.74%;-webkit-transform:scale(1); opacity: 1}
    /*70% {-webkit-transform-origin:41.6% 61.74%;-webkit-transform:scale(2); opacity: 1}*/
    100% {-webkit-transform-origin:36.6% 64.74%;-webkit-transform:scale(2.5);opacity: 1}
}

@keyframes s0_bg0 {
    0% {transform-origin:36.6% 64.74%;transform:scale(1);opacity: 1}
    /*70% {transform-origin:41.6% 61.74%;transform:scale(2); opacity: 1}*/
    100% {transform-origin:36.6% 64.74%;transform:scale(2.5) ; opacity: 1}
}

@-webkit-keyframes s0_bg2 {
    0% {-webkit-transform:translate3d(0,0,0);}
    50% {-webkit-transform:translate3d(40%,0,0);}
    100% {-webkit-transform:translate3d(0,0,0); }
}
@keyframes s0_bg2 {
    0% {transform:translate3d(0,0,0);}
    50% {transform:translate3d(40%,0,0);}
    100% {transform:translate3d(0,0,0);}
}


@-webkit-keyframes s1_bg5 {
    0% { -webkit-transform:translate3d(0,0,0) ; }
    50% { -webkit-transform:translate3d(0,100%,0) ;}
    100% { -webkit-transform:translate3d(0,0,0);}
}
@keyframes s1_bg5 {
    0% {transform:translate3d(0,0,0);}
    50% {transform:translate3d(0,100%,0);}
    100% {transform:translate3d(0,0,0);}
}
@-webkit-keyframes yy3 {
    0% { -webkit-transform:translate3d(0,0,0) ; }
    50% { -webkit-transform:translate3d(0,-15%,0) ;}
    100% { -webkit-transform:translate3d(0,0,0);}
}
@keyframes yy3 {
    0% {transform:translate3d(0,0,0);}
    50% {transform:translate3d(0,-15%,0);}
    100% {transform:translate3d(0,0,0);}
}
@-webkit-keyframes gl1 {
    0% { -webkit-transform:translate3d(0,5%,0) ; }
    100% { -webkit-transform:translate3d(0,0,0);}
}
@keyframes gl1 {
    0% {transform:translate3d(0,5%,0);}
    100% {transform:translate3d(0,0,0);}
}
@-webkit-keyframes gl2 {
    0% { -webkit-transform-origin:bottom left ;-webkit-transform:scale(0.01);}
    100% { -webkit-transform-origin:bottom left ;-webkit-transform:scale(1); }
}
@keyframes gl2 {
    0% {transform-origin:bottom left ;transform:scale(0.01);}
    100% {transform-origin:bottom left ;transform:scale(1);}
}