*{margin: 0;padding: 0}
html,body{margin: 0 auto;width: 100%;height: 100%;top:0;bottom:0;position: absolute;}

/*loading*/
.loading{position:absolute;width:100%;height:100%;background:url('../images/loading.jpg') no-repeat;background-size:100% 100%;z-index: 99;}
.load_wave{
    position:absolute;top:38%;left:33%;width: 35.26%;height:7px;background-color: #ffffff;border-radius:40px;-moz-border-radius:40px;
}
.load_val{
    position:absolute;top:0;left:0;width: 0;height:100%;background-color: #033174;border-radius:40px;-moz-border-radius:40px;
}

/*音乐*/
.music_blk{z-index:999;position:fixed;top: 10px;right: 40px;display: none}
.music{width:30px;height:30px;background:url('../images/music_on.png') no-repeat;background-size:100% 100%;position: absolute}
.music_on{
    -webkit-animation:rotate 1.2s linear infinite;
    animation:rotate 1.2s linear infinite;
}
@keyframes rotate{
    0%{
         -webkit-transform:rotateZ(0deg);
        transform:rotateZ(0deg);
      }
    100%{
        -webkit-transform:rotateZ(360deg);
        transform:rotateZ(360deg);
      }
}
@-webkit-keyframes rotate{
    0%{
         -webkit-transform:rotateZ(0deg);
        transform:rotateZ(0deg);
      }
    100%{
        -webkit-transform:rotateZ(360deg);
        transform:rotateZ(360deg);
    }
}

.section0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p1.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section0 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p1.1.png") no-repeat 0 0;background-size:100% 100%;}
.section0 .w1{position: absolute;bottom:5%;left:32%;width: 37.7%;height: 6.5%;background:url("../images/p1.2.png") no-repeat 0 0;background-size:100% 100%;}
.section0 .btn0{position: absolute;bottom:5%;left:32%;width: 37.7%;height: 6.5%;}


.section1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p2.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section1 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p2.1.png") no-repeat 0 0;background-size:100% 100%;}
.section1 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p2.2.png") no-repeat 0 0;background-size:100% 100%;}
.section1 .btn0{position: absolute;top:89%;left:35%;width: 27%;height: 7%;}


.section2{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section2 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.1.png") no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.section2 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.2.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section2 .w2{position: absolute;top:66%;left:49%;width: 1.5%;height: 7.4%;background:url("../images/p3.3.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section2 .w3{position: absolute;top:64%;left:74%;width: 15.9%;height: 4.5%;background:url("../images/p3.4.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section2 .w4{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.5.png") no-repeat 0 0;background-size:100% 100%;display: none;}
.section2 .select{position: absolute;top:26.5%;left:16%;width: 23.2%;height: 6.3%;background:url("../images/select.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section2 .confirm{position: absolute;top:84%;left:36%;width: 29.6%;height: 7%;background:url("../images/confirm.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section2 .hand{position: absolute;top:69%;left:69%;width: 12.9%;height: 5.7%;background:url("../images/hand.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section2 .result{position: absolute;top: 37%;left: 3%;width: 19%;display: none;}
.section2 .btn0{position: absolute;top:65%;left:27%;width: 13%;height: 9%;}
.section2 .btn1{position: absolute;top:63%;left:42%;width: 17%;height: 5%;}
.section2 .btn2{position: absolute;top:65%;left:60%;width: 13%;height: 9%;}
.section2 .btnNext{position: absolute;top: 61%;left: 38%;width: 23%;height: 6%;display: none;z-index: 99;}

.section2 .select1{
    transform:rotate(-64deg);transform-origin:50% 100%;
    -ms-transform:rotate(-64deg);-ms-transform-origin:50% 100%;
    -moz-transform:rotate(-64deg);-moz-transform-origin:50% 100%;
    -webkit-transform:rotate(-64deg);-webkit-transform-origin:50% 100%;
    -o-transform:rotate(-64deg);-o-transform-origin:50% 100%;
}
.section2 .select2{
    transform:rotate(0deg);transform-origin:50% 100%;
    -ms-transform:rotate(0deg);-ms-transform-origin:50% 100%;
    -moz-transform:rotate(0deg);-moz-transform-origin:50% 100%;
    -webkit-transform:rotate(0deg);-webkit-transform-origin:50% 100%;
    -o-transform:rotate(0deg);-o-transform-origin:50% 100%;
}
.section2 .select3{
    transform:rotate(64deg);transform-origin:50% 100%;
    -ms-transform:rotate(64deg);-ms-transform-origin:50% 100%;
    -moz-transform:rotate(64deg);-moz-transform-origin:50% 100%;
    -webkit-transform:rotate(64deg);-webkit-transform-origin:50% 100%;
    -o-transform:rotate(64deg);-o-transform-origin:50% 100%;
}

.section2.ani .w0{
    animation:fadeOut 1s 2s linear both;
    -moz-animation:fadeOut 1s 2s linear both;
    -webkit-animation:fadeOut 1s 2s linear both;
    -o-animation:fadeOut 1s 2s linear both
}
.section2.ani .w1{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}
.section2.ani .w2{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}
.section2.ani .w3{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}
.section2.ani .hand{
    animation:twinkle 2s 2.5s linear infinite;
    -moz-animation:twinkle 2s 2.5s linear infinite;
    -webkit-animation:twinkle 2s 2.5s linear infinite;
    -o-animation:twinkle 2s 2.5s linear infinite
}
.section2 .confirm, .section2 .select{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}

.section3{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section3 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p4.1.png") no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.section3 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p4.2.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section3 .w2{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p4.3.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section3 .w3{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p4.4.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section3 .w4{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p4.5.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section3 .w5{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p4.6.png") no-repeat 0 0;background-size:100% 100%;display: none;}
.section3 .confirm{position: absolute;top:84%;left:36%;width: 29.6%;height: 7%;background:url("../images/confirm.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section3 .result{position: absolute;top: 49%;left: 3%;width: 19%;display: none;}
.section3 .select{position: absolute;top:0;left:0;width: 100%;height: 100%;display: none;}
.section3 .btn0{position: absolute;top:29%;left:19%;width: 27%;height: 6%;}
.section3 .btn1{position: absolute;top:29%;left:53%;width: 27%;height: 6%;}
.section3 .btn2{position: absolute;top:40%;left:36%;width: 27%;height: 6%;}
.section3 .btnNext{position: absolute;top: 73%;left: 38%;width: 23%;height: 6%;display: none;z-index: 99;}

.section3.ani .w0{
    animation:fadeOut 1s 2s linear both;
    -moz-animation:fadeOut 1s 2s linear both;
    -webkit-animation:fadeOut 1s 2s linear both;
    -o-animation:fadeOut 1s 2s linear both
}
.section3.ani .w1,.section3.ani .w2,.section3.ani .w3,.section3.ani .w4,.section3 .confirm{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}

.section4{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section4 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p5.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.section4 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p5.2.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section4 .w2{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p5.3.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section4 .w3{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p5.4.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section4 .w4{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p5.5.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section4 .w5{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p5.6.png") no-repeat 0 0;background-size:100% 100%;display: none;}
.section4 .confirm{position: absolute;top:84%;left:36%;width: 29.6%;height: 7%;background:url("../images/confirm.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section4 .result{position: absolute;top: 49%;left: 3%;width: 19%;display: none;}
.section4 .select{position: absolute;top:0;left:0;width: 100%;height: 100%;display: none;}
.section4 .btn0{position: absolute;top:29%;left:19%;width: 27%;height: 6%;}
.section4 .btn1{position: absolute;top:29%;left:53%;width: 27%;height: 6%;}
.section4 .btn2{position: absolute;top:40%;left:36%;width: 27%;height: 6%;}
.section4 .btnNext{position: absolute;top: 73%;left: 38%;width: 23%;height: 6%;display: none;z-index: 99;}

.section4.ani .w0{
    animation:fadeOut 1s 2s linear both;
    -moz-animation:fadeOut 1s 2s linear both;
    -webkit-animation:fadeOut 1s 2s linear both;
    -o-animation:fadeOut 1s 2s linear both
}
.section4 .w1,.section4 .w2,.section4 .w3,.section4 .w4,.section4 .confirm{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}


.section5{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section5 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p6.1.png") no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.section5 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p6.2.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section5 .w2{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p6.3.png") no-repeat 0 0;background-size:100% 100%;display: none;}
.section5 .confirm{position: absolute;top:84%;left:36%;width: 29.6%;height: 7%;background:url("../images/confirm.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section5 .result{position: absolute;top: 49%;left: 3%;width: 19%;display: none;}
.section5 .select{position: absolute;width: 34%;top: 27%;left: 1%;display: none;}
.section5 .btn0{position: absolute;top:28%;left:3%;width: 30%;height: 10%;}
.section5 .btn1{position: absolute;top:30%;left:35%;width: 30%;height: 10%;}
.section5 .btn2{position: absolute;top:33%;left:67%;width: 30%;height: 10%;}
.section5 .btnNext{position: absolute;top: 73%;left: 38%;width: 23%;height: 6%;display: none;z-index: 99;}

.section5.ani .w0{
    animation:fadeOut 1s 2s linear both;
    -moz-animation:fadeOut 1s 2s linear both;
    -webkit-animation:fadeOut 1s 2s linear both;
    -o-animation:fadeOut 1s 2s linear both
}
.section5 .w1,.section5 .confirm{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}


.section6{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p3.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section6 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p7.1.png") no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.section6 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p7.2.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section6 .w2{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p7.3.png") no-repeat 0 0;background-size:100% 100%;display: none;}
/*.section6 .rockerD1{position: absolute;top:65.5%;left:38.5%;width: 5%;opacity: 0;}
.section6 .rockerD2{position: absolute;top:65.5%;left:80.5%;width: 5%;opacity: 0;}
.section6 .rockerD3{position: absolute;top:76%;left:38.5%;width: 5%;opacity: 0;}
.section6 .rockerD4{position: absolute;top:76%;left:80.5%;width: 5%;opacity: 0;}
.section6 .rockerU1{position: absolute;top:60.5%;left:38.5%;width: 5%;opacity: 0;}
.section6 .rockerU2{position: absolute;top:60.5%;left:80.5%;width: 5%;opacity: 0;}
.section6 .rockerU3{position: absolute;top:71%;left:38.5%;width: 5%;opacity: 0;}
.section6 .rockerU4{position: absolute;top:71%;left:80.5%;width: 5%;opacity: 0;}*/
.section6 .rockerD1{position: absolute;top:65.5%;left:38.5%;width: 5%;display: none;}
.section6 .rockerD2{position: absolute;top:65.5%;left:80.5%;width: 5%;display: none;}
.section6 .rockerD3{position: absolute;top:76%;left:38.5%;width: 5%;display: none;}
.section6 .rockerD4{position: absolute;top:76%;left:80.5%;width: 5%;display: none;}
.section6 .rockerU1{position: absolute;top:60.5%;left:38.5%;width: 5%;display: none;}
.section6 .rockerU2{position: absolute;top:60.5%;left:80.5%;width: 5%;display: none;}
.section6 .rockerU3{position: absolute;top:71%;left:38.5%;width: 5%;display: none;}
.section6 .rockerU4{position: absolute;top:71%;left:80.5%;width: 5%;display: none;}


.section6 .btn0{position: absolute;top:60.5%;left:36.5%;width: 9%;height: 10%}
.section6 .btn1{position: absolute;top:60.5%;left:78.5%;width: 9%;height: 10%}
.section6 .btn2{position: absolute;top:71.5%;left:36.5%;width: 9%;height: 10%}
.section6 .btn3{position: absolute;top:71.5%;left:78.5%;width: 9%;height: 10%}
.section6 .confirm{position: absolute;top:84%;left:36%;width: 29.6%;height: 7%;background:url("../images/confirm.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.section6 .result{position: absolute;top: 32%;left: 3%;width: 19%;display: none;}
.section6 .btnNext{position: absolute;top: 56%;left: 38%;width: 23%;height: 6%;display: none;z-index: 99;}
.section6 .hand{position: absolute;top:66%;left:87%;width: 12.9%;height: 5.7%;background:url("../images/hand.png") no-repeat 0 0;background-size:100% 100%;opacity: 0;}

.section6.ani .w0{
    animation:fadeOut 1s 2s linear both;
    -moz-animation:fadeOut 1s 2s linear both;
    -webkit-animation:fadeOut 1s 2s linear both;
    -o-animation:fadeOut 1s 2s linear both
}
/* .section6 .rockerD1,.section6 .rockerD2,.section6 .rockerD3,.section6 .rockerD4, */
.section6 .w1,.section6 .confirm{
    animation:fadeIn 1s 2.5s linear both;
    -moz-animation:fadeIn 1s 2.5s linear both;
    -webkit-animation:fadeIn 1s 2.5s linear both;
    -o-animation:fadeIn 1s 2.5s linear both
}
.section6.ani .hand{
    animation:twinkle 2s 2.5s linear infinite;
    -moz-animation:twinkle 2s 2.5s linear infinite;
    -webkit-animation:twinkle 2s 2.5s linear infinite;
    -o-animation:twinkle 2s 2.5s linear infinite
}


.section7{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p8.jpg") no-repeat 0 0;background-size:100% 100%;display: none;}
.section7 .w0{position: absolute;top:0;left:0;width: 100%;height: 100%;}
.section7 .w1{position: absolute;top:0;left:0;width: 100%;height: 100%;background:url("../images/p8.2.png") no-repeat 0 0;background-size:100% 100%;}


/*twinkle*/
@-webkit-keyframes twinkle {0%{opacity: 0;} 40%{opacity: 1;} 60%{opacity: 1;} 100%{opacity: 0;}}
@-moz-keyframes twinkle {0%{opacity: 0;} 40%{opacity: 1;} 60%{opacity: 1;} 100%{opacity: 0;}}
@keyframes twinkle {0%{opacity: 0;} 40%{opacity: 1;} 60%{opacity: 1;} 100%{opacity: 0;}}

@-webkit-keyframes fadeIn1 {0% {opacity: 0;} 25% {opacity: 1;} 100% {opacity: 1;}}
@-moz-keyframes fadeIn1 {0% {opacity: 0;} 25% {opacity: 1;} 100% {opacity: 1;}}
@keyframes fadeIn1 {0% {opacity: 0;} 25% {opacity: 1;} 100% {opacity: 1;}}

@-webkit-keyframes fadeIn2 {0% {opacity: 0;} 50% {opacity: 1;} 100% {opacity: 1;}}
@-moz-keyframes fadeIn2 {0% {opacity: 0;} 50% {opacity: 1;} 100% {opacity: 1;}}
@keyframes fadeIn2 {0% {opacity: 0;} 50% {opacity: 1;} 100% {opacity: 1;}}

@-webkit-keyframes fadeIn3 {0% {opacity: 0;} 75% {opacity: 1;} 100% {opacity: 1;}}
@-moz-keyframes fadeIn3 {0% {opacity: 0;} 75% {opacity: 1;} 100% {opacity: 1;}}
@keyframes fadeIn3 {0% {opacity: 0;} 75% {opacity: 1;} 100% {opacity: 1;}}

@keyframes fade{ 0%{ opacity:1; } 32%{ opacity:1;} 33%{ opacity:0; } 100%{ opacity:0; } }

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

@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 /* Firefox */
{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 /* Safari 和 Chrome */
{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}}
@-moz-keyframes fadeInLeft /* Firefox */
{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-webkit-keyframes fadeInLeft /* Safari 和 Chrome */
{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}

@-webkit-keyframes fadeInOut {0% {opacity: 0;}50% {opacity: 1;}100% {opacity: 0;}}
@-moz-keyframes fadeInOut {0% {opacity: 0;}50% {opacity: 1;}100% {opacity: 0;}}
@keyframes fadeInOut {0% {opacity: 0;}50% {opacity: 1;}100% {opacity: 0;}}

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

@keyframes fadeInRight1
{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:0.7;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInRight1 /* Firefox */
{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:0.7;-webkit-transform:none;transform:none}}
@-webkit-keyframes fadeInRight1 /* Safari 和 Chrome */
{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}100%{opacity:0.7;-webkit-transform:none;transform:none}}

@keyframes fadeInRight2
{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)} 80%{opacity: 0} 100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInRight1 /* Firefox */
{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)} 80%{opacity: 0} 100%{opacity:1;-webkit-transform:none;transform:none}}
@-webkit-keyframes fadeInRight1 /* Safari 和 Chrome */
{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)} 80%{opacity: 0} 100%{opacity:1;-webkit-transform:none;transform:none}}


@-webkit-keyframes wobble {
    0% {
    -webkit-transform:translateX(0%);
    transform:translateX(0%)
}
15% {
    -webkit-transform:translateX(-25%) rotate(-5deg);
    transform:translateX(-25%) rotate(-5deg)
}
30% {
    -webkit-transform:translateX(20%) rotate(3deg);
    transform:translateX(20%) rotate(3deg)
}
45% {
    -webkit-transform:translateX(-15%) rotate(-3deg);
    transform:translateX(-15%) rotate(-3deg)
}
60% {
    -webkit-transform:translateX(10%) rotate(2deg);
    transform:translateX(10%) rotate(2deg)
}
75% {
    -webkit-transform:translateX(-5%) rotate(-1deg);
    transform:translateX(-5%) rotate(-1deg)
}
100% {
    -webkit-transform:translateX(0%);
    transform:translateX(0%);
    opacity: 1
}
}
@keyframes wobble {
    0% {
    -webkit-transform:translateX(0%);
    -ms-transform:translateX(0%);
    transform:translateX(0%)
}
15% {
    -webkit-transform:translateX(-25%) rotate(-5deg);
    -ms-transform:translateX(-25%) rotate(-5deg);
    transform:translateX(-25%) rotate(-5deg)
}
30% {
    -webkit-transform:translateX(20%) rotate(3deg);
    -ms-transform:translateX(20%) rotate(3deg);
    transform:translateX(20%) rotate(3deg)
}
45% {
    -webkit-transform:translateX(-15%) rotate(-3deg);
    -ms-transform:translateX(-15%) rotate(-3deg);
    transform:translateX(-15%) rotate(-3deg)
}
60% {
    -webkit-transform:translateX(10%) rotate(2deg);
    -ms-transform:translateX(10%) rotate(2deg);
    transform:translateX(10%) rotate(2deg)
}
75% {
    -webkit-transform:translateX(-5%) rotate(-1deg);
    -ms-transform:translateX(-5%) rotate(-1deg);
    transform:translateX(-5%) rotate(-1deg)
}
100% {
    -webkit-transform:translateX(0%);
    -ms-transform:translateX(0%);
    transform:translateX(0%);
    opacity: 1;
}
}

/* 放大显示(向左) */
@-webkit-keyframes zoomInRight {0% {opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@-moz-keyframes zoomInRight {0% {opacity:0;-moz-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-moz-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-moz-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-moz-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@keyframes zoomInRight {0% {opacity:0;transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}

/* 放大显示(向下) */
@-webkit-keyframes zoomInDown {0% {opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@-moz-keyframes zoomInDown {0% {opacity:0;-moz-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-moz-animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;-moz-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-moz-animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}
@keyframes zoomInDown {0% {opacity:0;transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);animation-timing-function:cubic-bezier(0.55,.055,.675,.19)}
60% {opacity:1;transform:scale3d(.475,.475,.475) translate3d(0,60px,0);animation-timing-function:cubic-bezier(0.175,.885,.32,1)}
100% {opacity:1}
}

@-webkit-keyframes shake{
    0%,40%,80%,100%{-webkit-transform:translateX(0);transform:translateX(0)}
    20%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}
    60%{-webkit-transform:translateX(10px);transform:translateX(10px)}
}

@keyframes shake{
    0%,40%,80%,100%{-webkit-transform:translateX(0);transform:translateX(0)}
    20%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}
    60%{-webkit-transform:translateX(10px);transform:translateX(10px)}
}

@keyframes fadeOutLeft
{0%{opacity:1;}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);}}
@-moz-keyframes fadeOutLeft /* Firefox */
{0%{opacity:1;}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);}}
@-webkit-keyframes fadeOutLeft /* Safari 和 Chrome */
{0%{opacity:1;}100%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);}}

@keyframes fadeOutRight
{0%{opacity:1;}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);}}
@-moz-keyframes fadeOutRight /* Firefox */
{0%{opacity:1;}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);}}
@-webkit-keyframes fadeOutRight /* Safari 和 Chrome */
{0%{opacity:1;}100%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);}}

@-webkit-keyframes fadeOut {0% {opacity: 1;}100% {opacity: 0;}}
@-moz-keyframes fadeOut {0% {opacity: 1;}100% {opacity: 0;}}
@keyframes fadeOut {0% {opacity: 1;}100% {opacity: 0;}}