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.gif');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: 16%;height: 9%;position: absolute;top:38%;left:53%;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:3s 3s s0_bg0 linear both;
    -o-animation:3s 3s s0_bg0 linear both;
    -moz-animation:3s 3s  s0_bg0 linear both;
    animation:3s 3s 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:4.5s 5s  Out1 linear infinite;
    -o-animation:4.5s 5s  Out1 linear infinite;
    -moz-animation:4.5s 5s Out1 linear infinite;
    animation:4.5s 5s Out1 linear infinite ;
}

.s1{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/p1.jpg") no-repeat 0 0;background-size:300% 100%;}
.s1 .bg{width: 300%;height: 100%;top:0;left:0;background:url("../images/p1.jpg") no-repeat 0 0;background-size:100% 100%;position: absolute}
.s1 .bg0{width: 9.5%;height: 37%;position: absolute;top:41%;left:20.5%;background:url("../images/p1.1.png") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg1{width: 11%;height: 38%;position: absolute;top:41.25%;left:34%;background:url("../images/p1.2.png") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg2{width: 11%;height: 35%;position: absolute;top:30.77%;left:48.86%;background:url("../images/p1.3.png") 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") no-repeat 0 0;background-size:100% 100%;opacity: 0}
.s1 .bg4{width: 27.98%;height: 10.71%;position: absolute;top:52.9%;left:70.37%;background:url("../images/p1.5.png") 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") 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") 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") 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 ;
}



.s2{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/p2.jpg?1") no-repeat 0 0;background-size:100% 100%;}
.s2 .bg0{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%;}
/*.s2 .bg1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p1.2.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}*/
.s2 .mask1{width: 100%;height: 100%;position: absolute;top:0;left:0;opacity: 1;}
.mask1_1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.5.png?1") no-repeat 0 0;background-size:100% 100%;display: block}
/*.cb1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.6.png?1") no-repeat 0 0;background-size:100% 100%;}*/
.mask1_1.ani .cb1{
    -webkit-animation:1s 0.2s Out11  linear infinite;
    -moz-animation:1s 0.2s Out11  linear infinite;
    -o-animation:1s 0.2s Out11  linear  infinite;
    animation:1s 0.2s Out11 linear infinite;
}
.mask1_2{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.7.png?1") no-repeat 0 0;background-size:100% 100%;display: none}
/*.js1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.8.png?1") no-repeat 0 0;background-size:100% 100%;}*/
.mask1_2.ani .js1{
    -webkit-animation:1s 0.2s Out11  linear infinite;
    -moz-animation:1s 0.2s Out11  linear infinite;
    -o-animation:1s 0.2s Out11  linear  infinite;
    animation:1s 0.2s Out11 linear infinite;
}
.mask1_3{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.9.png?1") no-repeat 0 0;background-size:100% 100%;display: none}
/*.yy1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.10.png?1") no-repeat 0 0;background-size:100% 100%;}
.yy2{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.11.png?1") no-repeat 0 0;background-size:100% 100%;}
.yy3{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.12.png?1") no-repeat 0 0;background-size:100% 100%;}*/
.mask1_3.ani .yy1{
    -webkit-animation:1s 0.2s Out11  linear infinite;
    -moz-animation:1s 0.2s Out11  linear infinite;
    -o-animation:1s 0.2s Out11  linear  infinite;
    animation:1s 0.2s Out11 linear infinite;
}
.mask1_3 .yy3{
    -webkit-animation:2s 0.1s 2.73  linear infinite;
    -moz-animation:2s 0.1s yy3  linear infinite;
    -o-animation:2s 0.1s yy3  linear  infinite;
    animation:2s 0.1s yy3 linear infinite;
}
.mask1_4{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.13.png?1") no-repeat 0 0;background-size:100% 100%;display: none}
/*.gl1{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p2.14.png?1") no-repeat 0 0;background-size:100% 100%;}
.gl2{width: 11.83%;height: 9.22%;position: absolute;top:42.26%;left:26.08%;background:url("../images/p2.15.png?1") no-repeat 0 0;background-size:100% 100%;}*/
.mask1_4.ani .gl1{
    -webkit-animation:0.5s 0.2s gl1  linear both;
    -moz-animation:0.5s 0.2s gl1  linear both;
    -o-animation:0.5s 0.2s gl1  linear  both;
    animation:0.5s 0.2s gl1 linear both;
}
.mask1_4 .gl2{
    -webkit-animation:1s 0.8s gl2  linear both;
    -moz-animation:1s 0.8s gl2  linear both;
    -o-animation:1s 0.8s gl2  linear  both;
    animation:1s 0.8s gl2 linear both;
}
.s2 .hand1{width: 16.6%;height:11.6%;position: absolute;top:31%;left:87%;background:url("../images/hand1.png?1") no-repeat 0 0;background-size:100% 100%;}
.s2 .s2_click_left{width: 14%;height: 9%;position: absolute;top:27.5%;left:2%;background-color:#b00000;opacity: 0}
.s2 .s2_click_right{width: 14%;height: 9%;position: absolute;top:27.5%;right:2%;background-color:#b00000;opacity: 0}
.s2 .s2_click1{width: 40%;height: 9%;position: absolute;top:83%;left:10%;background-color:#333;opacity: 0}
.s2 .s2_click2{width: 40%;height: 9%;position: absolute;top:83%;left:51%;background-color:#333;opacity: 0}
.s2 .daiyu{width: 100%;height: 100%;position: absolute;top:0;left:0;background:url("../images/p3.jpg?1") no-repeat 0 0;background-size:100% 100%;display: none}
.s2.ani .hand1{
    -webkit-animation:4s 0.3s shake  linear both;
    -moz-animation:4s 0.3s shake  linear both;
    -o-animation:4s 0.3s shake  linear  both;
    animation:4s 0.3s shake linear both;
}



.s3{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/cb/p5.jpg") no-repeat 0 0;background-size:100% 100%;}
.bg0000{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/cb/p5.1.png") no-repeat 0 0;background-size:100% 100%;}
.s3 .bg0{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/cb/p5.1.png") no-repeat 0 0;background-size:100% 100%;}
.s4 .bg0{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/yy/p6.1.png") no-repeat 0 0;background-size:100% 100%;}
.s5 .bg0{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/js/p7.1.png") no-repeat 0 0;background-size:100% 100%;}
.s6 .bg0{width: 100%;height: 100%;opacity:1;position: absolute;top:0;left:0;background:url("../images/gl/p8.1.png") no-repeat 0 0;background-size:100% 100%;}

.click_left{width: 22%;height: 14%;position: absolute;top:47.5%;left:0;background-color:#b00000;opacity: 0}
.click_right{width: 22%;height: 14%;position: absolute;top:47.5%;right:0;background-color:#b00000;opacity: 0}
.click1{width: 46%;height: 10%;position: absolute;top:88%;left:4%;background-color:#b00000;opacity: 0}
.click2{width: 46%;height: 10%;position: absolute;top:88%;left:51%;background-color:#b00000;opacity: 0}
.s4{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/yy/p6.jpg") no-repeat 0 0;background-size:100% 100%;}
.s5{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/js/p7.jpg") no-repeat 0 0;background-size:100% 100%;}
.s6{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/gl/p8.jpg") no-repeat 0 0;background-size:100% 100%;}
.s7{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;opacity:1;position: absolute;top:0;left:0;background:url("../images/p4.jpg?1") no-repeat 0 0;background-size:100% 100%;}
.hand2{display: none;width: 16.6%;height:11.6%;position: absolute;top:49%;left:88%;background:url("../images/hand1.png") no-repeat 0 0;background-size:100% 100%;
    -webkit-animation:4s 0.3s shake  linear both;
    -moz-animation:4s 0.3s shake  linear both;
    -o-animation:4s 0.3s shake  linear  both;
    animation:4s 0.3s shake linear both;
}


@-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 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:21.6% 70.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:21.6% 70.74%;-webkit-transform:scale(1.7);opacity: 1}
}

@keyframes s0_bg0 {
    0% {transform-origin:21.6% 70.74%;transform:scale(1);opacity: 1}
    /*70% {transform-origin:41.6% 61.74%;transform:scale(2); opacity: 1}*/
    100% {transform-origin:21.6% 70.74%;transform:scale(1.7) ; 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);}
}