*{margin: 0;padding: 0}
html,body{margin: 0 auto;width: 100%;height: 100%;top:0;bottom:0;position: absolute;overflow: hidden}
.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%;z-index: 99}

/*.loading1{position:absolute;width:120px;height:120px;background:url('../images/img1/loading1.png');background-size:100% 100%;top:25%;left:25%;*/
    /*-webkit-animation:rotate 1.2s linear infinite;*/
    /*animation:rotate 1.2s linear infinite;*/
/*}*/
/*.loading11{*/
    /*position:absolute;top:49%;left:33%;width: 35.26%;height:4px;background-color: #d4d2d1;transform: rotate(90deg);-webkit-transform: rotate(90deg);*/
/*}*/
/*.loading11_1{*/
     /*position:absolute;top:0;left:0;width: 0;height:100%;background-color: #777878;*/
 /*}*/


a{opacity:1}
/*loading*/

/*音乐*/
.music_blk{z-index:999;position:fixed;bottom:5px;left:5px;}
.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;
}

.bg0{width: 100%;height: 100%;position:absolute;left:0;top:0;background:url('../images/p0.jpg') no-repeat 0 0;background-size:100% 100%;}
.bg0_1{position: absolute;width: 100%;height:100%;left:0;top:0;background:url('../images/p0.1.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg0_click{position: absolute;width: 16.54%;height:30.58%;left:14%;top:36%;background:url('../images/p0_click.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg0.ani .bg0_1{
    -webkit-animation:0.6s 0.1s Out linear both;
    animation:0.6s 0.1s Out linear both;
}
.bg0.ani .bg0_click{
    -webkit-animation:1s 0.8s Out linear both;
    animation:1s 0.8s Out linear both;
}

#fuceng{
    background:url('../images/mask1.jpg') no-repeat 0 0;background-size:100% 100%;
}
.canvas_div{
    width: 100%;height:100%;position:absolute;top:0;left:0;display: none;
}
.over{
    position: absolute;
    top: 86%;
    left: 85%;
    width: 13%;
    height: 12%;
}
.explain1{
    position: absolute;width:100%;height:100%;left:0;top:0;background:url('../images/p1.1.png') no-repeat 0 0;background-size:100% 100%;
}
.explain1_click{
    width:13% ;height:20%;position: absolute;top:36%;left:16%
}

.Game_over{
    position: absolute;width:100%;height:100%;left:0;top:0;background:url('../images/p1.3.png') no-repeat 0 0;background-size:100% 100%;display: none;
}
.Game_true{
    position: absolute;width:10%;height:18%;left:34%;top:32%;
}
.Game_again{
    position: absolute;width:10%;height:17%;left:34%;top:53%;
}


.Game_score{
    position: absolute;width:100%;height:100%;left:0;top:0;background:url('../images/p1.4.png') no-repeat 0 0;background-size:100% 100%;display: none;
}
.score_div{
    position: absolute;    width: 100%;  height: 100%;  left: 0;  top: 0;
}
.score_div div{
   position: absolute;top:0;left:0;width: 100%;height:100%;display: none;
}
.score_div div:nth-of-type(1){
    background:url('../images/xin1.png') no-repeat 0 0;background-size:100% 100%;
}
.score_div div:nth-of-type(2){
    background:url('../images/xin2.png') no-repeat 0 0;background-size:100% 100%;
}
.score_div div:nth-of-type(3){
    background:url('../images/xin3.png') no-repeat 0 0;background-size:100% 100%;
}
.score_div div:nth-of-type(4){
     background:url('../images/xin4.png') no-repeat 0 0;background-size:100% 100%;
 }

.Game_score_click{
    position: absolute;width: 10%; height: 25%;  left: 10%;  top: 39%;
}



.bg2{width: 100%;height: 100%;position:absolute;left:0;top:0;background:url('../images/p2.jpg') no-repeat 0 0;background-size:100% 100%;display:none}
.bg2_1{position: absolute;width: 100%;height:100%;left:0;top:0;opacity: 0}
.bg2_more{position: absolute;width: 10.54%;  height: 19.58%;  left: 11%;  top: 31%;}
.bg2_share{position: absolute;width: 10.54%;  height: 19.58%;  left: 11%;  top: 52%;}
.bg2.ani .bg2_1{
    -webkit-animation:0.6s 0.1s Out linear both;
    animation:0.6s 0.1s Out linear both;
}

.share{
    width: 100%;height: 100%;position:absolute;left:0;top:0;background:url('../images/share.png') no-repeat 0 0;background-size:100% 100%;display:none
}














@-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 hand {
    0% {-webkit-transform:translate3d(0,0,0);}
    100% {-webkit-transform:translate3d(0,60%,0);}
}
@keyframes hand {
    0% {transform:translate3d(0,0,0);}
    100% {transform:translate3d(0,60%,0);}
}



@-webkit-keyframes loading12 {
    0% {-webkit-transform:translate3d(0,0,0);}
    100% {-webkit-transform:translate3d(5%,0,0);}
}

@keyframes loading12 {
    0% {transform:translate3d(0,0,0);}
    100% {transform:translate3d(5%,0,0);}
}
@-webkit-keyframes s3_0 {
    0% {-webkit-transform:translate3d(0,0,0);opacity: 0}
    100% {-webkit-transform:translate3d(0,5%,0);opacity: 1}
}
@keyframes s3_0 {
    0% {transform:translate3d(0,0,0);opacity: 0}
    100% {transform:translate3d(0,5%,0);opacity: 1}
}



@-webkit-keyframes bg0_1 {
    0% {-webkit-transform:translate3d(0,0,0);opacity: 1}
    100% {-webkit-transform:translate3d(0,10%,0);opacity: 0}
}
@keyframes bg0_1 {
    0% {transform:translate3d(0,0,0);opacity: 1}
    100% {transform:translate3d(0,10%,0);opacity: 0}
}

@-webkit-keyframes bg0_4_1 {
    0% {-webkit-transform:translate3d(0,0,0);opacity: 0}
    100% {-webkit-transform:translate3d(4%,1%,0);opacity: 1}
}
@keyframes bg0_4_1 {
    0% {transform:translate3d(0,0,0);opacity: 0}
    100% {transform:translate3d(4%,1%,0);opacity: 1}
}


@-webkit-keyframes bg0_3 {
    0% {-webkit-transform: scale(2);opacity: 0}
    10% {-webkit-transform: scale(1);opacity: 1;}
    85%{-webkit-transform: scale(1);opacity: 1;}
    100%{-webkit-transform: scale(1);opacity: 0;}
}
@keyframes bg0_3 {
    0% {transform: scale(2);opacity: 0}
    10% {transform: scale(1);opacity: 1}
    85%{-webkit-transform: scale(1);opacity: 1;}
    100%{-webkit-transform: scale(1);opacity: 0;}
}


@-webkit-keyframes bg0_4 {
    0% {-webkit-transform: scale(1.5);opacity: 0}
    100%{-webkit-transform: scale(1);opacity: 1;}
}
@keyframes bg0_4 {
    0% {transform: scale(1.5);opacity: 0}
    100%{-webkit-transform: scale(1);opacity: 1;}
}





.arrow.ani{
    -webkit-animation:arrow1 1s linear infinite;
    animation:arrow1 1s linear infinite;
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes rotate {
    0% {transform: rotate(0)}
    100% {transform: rotate(360deg);}
}

@keyframes Out{
    0%{opacity:0}
    100%{opacity:1}
}
@-webkit-keyframes Out{
    0%{opacity: 0}
    100%{opacity:1}
}
@keyframes Out1{
    0%{opacity:1}
    100%{opacity:0}
}
@-webkit-keyframes Out1{
    0%{opacity: 1}
    100%{opacity:0}
}


@-webkit-keyframes s5_0 {
    0% {  opacity: 0;  }
    15% {  opacity: 1;  }
    50% {  opacity: 1;  }
    65%{opacity: 0; }
    100% {  opacity:0;  }
}

@keyframes s5_0 {
    0% {  opacity: 0;  }
    15% {  opacity: 1;  }
    50% {  opacity: 1;  }
    65%{opacity: 0; }
    100% {  opacity:0;  }
}

@-webkit-keyframes s5_1 {
    0% {  opacity: 0;  }
    15% {  opacity: 1;  }
    50% {  opacity: 1;  }
    65%{opacity: 0; }
    100% {  opacity:0;  }
}
@keyframes s5_1 {
    0% {  opacity: 0;  }
    15% {  opacity: 1;  }
    50% {  opacity: 1;  }
    65%{opacity: 0; }
    100% {  opacity:0;  }
}


@-webkit-keyframes shake{
    0%{opacity: 0}
    25%{opacity:1}
    50%{opacity: 0}
    75%{opacity:1}
    100%{opacity: 0}
}


@keyframes shake{
    0%{opacity: 0}
    25%{opacity:1}
    50%{opacity: 0}
    75%{opacity:1}
    100%{opacity: 0}
}


@-webkit-keyframes  bounceIn{

    0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}
    20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}
    40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}
    60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}
    80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}
    100%{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
}
@keyframes bounceIn{
    0%{transform:scale3d(.3,.3,.3);opacity:0;}
    20%{transform:scale3d(1.1,1.1,1.1);}
    40%{transform:scale3d(.9,.9,.9);}
    60%{transform:scale3d(1.03,1.03,1.03);opacity:1}
    80%{transform:scale3d(.97,.97,.97)}
    100%{transform:scale3d(1,1,1);opacity:1;}
}
@-webkit-keyframes loading0 {
    0% {-webkit-transform:translate3d(0,0,0);}
    100% {-webkit-transform:translate3d(400%,0,0);}

}
@keyframes loading0 {
    0% {transform:translate3d(0,0,0);}
    100% {transform:translate3d(400%,0,0);}
}