/*页面默认*/
*{margin: 0;padding: 0}
a{opacity:1}
html,body{margin: 0 auto;width: 100%;height: 100%;top:0;bottom:0;position: absolute;}

/*加载页面*/
.loading{position:absolute;width:100%;height:100%;background:url('../images/loading.jpg') no-repeat;background-size:100% 100%;z-index: 99;}
.loading_img{position: absolute;left:28%;top:18%;width: 42%;height:30%;opacity: 0;}
.load_wave{
    position:absolute;top:52%;left:33%;width: 35.26%;height:5px;background-color: #0b5bcc;
}
.load_val{
    position:absolute;top:0;left:0;width: 0;height:100%;background-color: #ff3d00;
}


/*音乐*/
.music_blk{z-index:999;position:fixed;bottom:35px;left:10px;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;
}
@-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);}
}

.bg0{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;position: absolute;top:0;left:0;background:url("../images/p0.jpg") no-repeat 0 0;background-size:100% 100%;}
.bg0 .w0{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p0.1.png') no-repeat 0 0;background-size:100% 100%;}
.bg0 .w1{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p0.2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg0 .w2{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p0.3.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg0 .w2 .btn0{position: absolute;top:73%;left:34%;width: 39%;height:9%;}

.bg0.ani .w1{
    animation:fadeIn 1.6s 0s linear both;
    -moz-animation:fadeIn 1.6s 0s linear both;
    -webkit-animation:fadeIn 1.6s 0s linear both;
    -o-animation:fadeIn 1.6s 0s linear both
}

.bg0.ani .w2{
    animation:fadeInOut1 1.6s .5s linear infinite;
    -moz-animation:fadeInOut1 1.6s .5s linear infinite;
    -webkit-animation:fadeInOut1 1.6s .5s linear infinite;
    -o-animation:fadeInOut1 1.6s .5s linear infinite
}

.bg1{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;position: absolute;top:0;left:0;}
.bg1 .w0{position: absolute;top:49%;left:0;width: 100%;height:100%;background:url('../images/map.jpg') no-repeat 56% -277%;background-attachment:fixed;background-size:340% 118%;}
.bg1 .w1{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-1.png') no-repeat 0 0;background-size:100% 100%;}
.bg1 .w2{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .w3{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-5.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .w4{position: absolute;top:85%;left:34%;width: 4%;height:7%;background:url('../images/p1.3.png') no-repeat 0 0;background-size:100% 100%;}
.bg1 .w5{position: absolute;top:67%;left:3%;width: 51.2%;height:19.1%;background:url('../images/p1.2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .w6{position: absolute;top:52%;left:69%;width: 26%;height:12%;background:url('../images/p1.1.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .w7{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-6.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .w8{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-7.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .btn0{position: absolute;top:22%;left:67%;width: 25%;height:10%;}
.bg1 .w9{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-3.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg1 .w10{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p1-4.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}

.bg1.ani .w5{
    animation:fadeIn 1.5s  linear both;
    -moz-animation:fadeIn 1.5s  linear both;
    -webkit-animation:fadeIn 1.5s  linear both;
    -o-animation:fadeIn 1.5s  linear both
}
.bg1.ani .w6{
    animation:fadeInOut1 1.5s 1s linear infinite;
    -moz-animation:fadeInOut1 1.5s 1s linear infinite;
    -webkit-animation:fadeInOut1 1.5s 1s linear infinite;
    -o-animation:fadeInOut1 1.5s 1s linear infinite
}
.bg1.ani1 .w2,.bg1.ani1 .w3{
    animation:fadeIn 1.5s .5s linear both;
    -moz-animation:fadeIn 1.5s .5s linear both;
    -webkit-animation:fadeIn 1.5s .5s linear both;
    -o-animation:fadeIn 1.5s .5s linear both
}
.bg1.ani1 .w7{
    animation:fadeInUp 1s  linear both;
    -moz-animation:fadeInUp 1s  linear both;
    -webkit-animation:fadeInUp 1s  linear both;
    -o-animation:fadeInUp 1s  linear both
}
.bg1.ani1 .w8{
    animation:fadeInOut1 1.5s 1s linear infinite;
    -moz-animation:fadeInOut1 1.5s 1s linear infinite;
    -webkit-animation:fadeInOut1 1.5s 1s linear infinite;
    -o-animation:fadeInOut1 1.5s 1s linear infinite
}
.bg1.ani2 .w9{
    animation:fadeInOut 2s  linear both;
    -moz-animation:fadeInOut 2s  linear both;
    -webkit-animation:fadeInOut 2s  linear both;
    -o-animation:fadeInOut 2s  linear both
}
.bg1.ani2 .w10{
    animation:fadeIn 1s 1s linear both;
    -moz-animation:fadeIn 1s 1s linear both;
    -webkit-animation:fadeIn 1s 1s linear both;
    -o-animation:fadeIn 1.5s 1s linear both
}
.bg1.ani2 .w3{
    animation:fadeOut 1s 1.3s linear both;
    -moz-animation:fadeOut 1s 1.3s linear both;
    -webkit-animation:fadeOut 1s 1.3s linear both;
    -o-animation:fadeOut 1s 1.3s linear both
}
.bg1.ani3 .w10{
    animation:fadeOutRight 1.5s  linear both;
    -moz-animation:fadeOutRight 1.5s  linear both;
    -webkit-animation:fadeOutRight 1.5s  linear both;
    -o-animation:fadeOutRight 1.5s  linear both
}

.bg2{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;position: absolute;top:0;left:0;}
.bg2 .w0{position: absolute;top:49%;left:0;width: 100%;height:100%;background:url('../images/map.jpg') no-repeat 84% -129%;background-attachment:fixed;background-size:340% 118%;}
.bg2 .w1{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p2-1.png') no-repeat 0 0;background-size:100% 100%;}
.bg2 .w2{position: absolute;top:84%;left:33%;width: 4%;height:7%;background:url('../images/p1.3.png') no-repeat 0 0;background-size:100% 100%;}
.bg2 .w3{position: absolute;top:69%;left:7%;width: 42.6%;height:16%;background:url('../images/p2.1.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg2 .w4{position: absolute;top:54.5%;left:46%;width: 26%;height:12%;background:url('../images/p2.2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg2 .w5{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p2-2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg2 .w6{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p2-3.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg2 .w7{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p2-4.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg2 .btn0{position: absolute;top:21%;left:68%;width: 25%;height:12%;}
.bg2 .w8{position: absolute;top:37.5%;left:38%;width: 22.5%;height:25%;background:url('../images/p2-5.png') no-repeat 0 0;background-size:100% 100%;display: none;}

.bg2.ani .w3{
    animation:fadeIn 1.5s  linear both;
    -moz-animation:fadeIn 1.5s  linear both;
    -webkit-animation:fadeIn 1.5s  linear both;
    -o-animation:fadeIn 1.5s  linear both
}
.bg2.ani .w4{
    animation:fadeInOut1 2s 1s linear infinite;
    -moz-animation:fadeInOut1 2s 1s linear infinite;
    -webkit-animation:fadeInOut1 2s 1s linear infinite;
    -o-animation:fadeInOut1 2s 1s linear infinite
}
.bg2.ani1 .w5{
    animation:fadeIn 1s  linear both;
    -moz-animation:fadeIn 1s  linear both;
    -webkit-animation:fadeIn 1s  linear both;
    -o-animation:fadeIn 1s  linear both
}
.bg2.ani1 .w6{
    animation:fadeInUp 1s 0.6s linear both;
    -moz-animation:fadeInUp 1s 0.6s linear both;
    -webkit-animation:fadeInUp 1s 0.6s linear both;
    -o-animation:fadeInUp 1s 0.6s linear both
}
.bg2.ani1 .w7{
    animation:fadeInOut1 2s 2s linear infinite;
    -moz-animation:fadeInOut1 2s 2s linear infinite;
    -webkit-animation:fadeInOut1 2s 2s linear infinite;
    -o-animation:fadeInOut1 2s 2s linear infinite
}
.bg2.ani2 .w8{
    animation:fadeInUp 1s .1s linear both;
    -moz-animation:fadeInUp 1s .1s linear both;
    -webkit-animation:fadeInUp 1s .1s linear both;
    -o-animation:fadeInUp 1s .1s linear both
}

.bg3{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;position: absolute;top:0;left:0;}
.bg3 .w0{position: absolute;top:49%;left:0;width: 100%;height:100%;background:url('../images/map.jpg') no-repeat 29% -14%;background-attachment:fixed;background-size:340% 118%;}
.bg3 .w1{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p3-1.png') no-repeat 0 0;background-size:100% 100%;}
.bg3 .w2{position: absolute;top:77%;left:43%;width: 4%;height:7%;background:url('../images/p3.3.png') no-repeat 0 0;background-size:100% 100%;}
.bg3 .w3{position: absolute;top:60%;left:30%;width: 49%;height:18%;background:url('../images/p3.1.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg3 .w4{position: absolute;top:86%;left:9%;width: 26%;height:12%;background:url('../images/p3.2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg3 .w5{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;}
.bg3 .w6{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p3-6.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg3 .w7{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p3-4.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg3 .w8{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p3-5.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg3 .btn0{position: absolute;top:16%;left:68%;width: 25%;height:12%;}
.bg3 .w9{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p3-3.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}

.bg3.ani .w3{
    animation:fadeIn 1.5s 0s linear both;
    -moz-animation:fadeIn 1.5s 0s linear both;
    -webkit-animation:fadeIn 1.5s 0s linear both;
    -o-animation:fadeIn 1.5s 0s linear both
}
.bg3.ani .w4{
    animation:fadeInOut1 2s 1.5s linear infinite;
    -moz-animation:fadeInOut1 2s 1.5s linear infinite;
    -webkit-animation:fadeInOut1 2s 1.5s linear infinite;
    -o-animation:fadeInOut1 2s 1.5s linear infinite
}
.bg3.ani1 .w5{
    animation:fadeIn 1.5s 0s linear both;
    -moz-animation:fadeIn 1.5s 0s linear both;
    -webkit-animation:fadeIn 1.5s 0s linear both;
    -o-animation:fadeIn 1.5s 0s linear both
}
.bg3.ani1 .w6{
    animation:fadeIn 1.5s 0.5s linear both;
    -moz-animation:fadeIn 1.5s 0.5s linear both;
    -webkit-animation:fadeIn 1.5s 0.5s linear both;
    -o-animation:fadeIn 1.5s 0.5s linear both
}
.bg3.ani1 .w7{
    animation:fadeInUp 2s 1s linear both;
    -moz-animation:fadeInUp 2s 1s linear both;
    -webkit-animation:fadeInUp 2s 1s linear both;
    -o-animation:fadeInUp 2s 1s linear both
}
.bg3.ani1 .w8{
    animation:fadeInOut1 2s 4s linear infinite;
    -moz-animation:fadeInOut1 2s 4s linear infinite;
    -webkit-animation:fadeInOut1 2s 4s linear infinite;
    -o-animation:fadeInOut1 2s 4s linear infinite
}
.bg3.ani1 .w9{
    animation:fadeIn 1.5s 3s linear both;
    -moz-animation:fadeIn 1.5s 3s linear both;
    -webkit-animation:fadeIn 1.5s 3s linear both;
    -o-animation:fadeIn 1.5s 3s linear both
}
.bg3.ani2 .w6{
    animation:fadeOutRight1 1.5s 0s linear both;
    -moz-animation:fadeOutRight1 1.5s 0s linear both;
    -webkit-animation:fadeOutRight1 1.5s 0s linear both;
    -o-animation:fadeOutRight1 1.5s 0s linear both
}

.bg4{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;position: absolute;top:0;left:0;}
.bg4 .w0{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/map.jpg') no-repeat 24% 1%;background-attachment:fixed;background-size:340% 118%;}
.bg4 .w1{position: absolute;top:60%;left:53%;width: 4%;height:7%;background:url('../images/p3.3.png') no-repeat 0 0;background-size:100% 100%;}
.bg4 .w2{position: absolute;top:43%;left:40%;width: 49%;height:18%;background:url('../images/p4.3.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg4 .w3{position: absolute;top:79%;left:7%;width: 26%;height:12%;background:url('../images/p4.1.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg4 .w4{position: absolute;top:0%;left:0%;width: 100%;height:100%;background:url('../images/p4.2.png?1') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg4 .fc{position: absolute;top:0%;left:0%;width: 100%;height:100%;background:url('../images/fc.png') no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.bg4 .fc1{position: absolute;top:0%;left:0%;width: 100%;height:100%;background:url('../images/fc1.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg4 .fc2{position: absolute;top:0%;left:0%;width: 100%;height:100%;background:url('../images/fc2.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg4 .fc3{position: absolute;top:0%;left:0%;width: 100%;height:100%;background:url('../images/fc3.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}
.bg4 .fc4{position: absolute;top:0%;left:0%;width: 100%;height:100%;background:url('../images/fc4.png') no-repeat 0 0;background-size:100% 100%;opacity: 0;}

.bg4.ani .fc1{
    animation:fadeIn 1.5s 0s linear both;
    -moz-animation:fadeIn 1.5s 0s linear both;
    -webkit-animation:fadeIn 1.5s 0s linear both;
    -o-animation:fadeIn 1.5s 0s linear both
}
.bg4.ani .fc2{
    animation:fadeIn 1.5s 1.5s linear both;
    -moz-animation:fadeIn 1.5s 1.5s linear both;
    -webkit-animation:fadeIn 1.5s 1.5s linear both;
    -o-animation:fadeIn 1.5s 1.5s linear both
}
.bg4.ani .fc3{
    animation:fadeIn 1.5s 3s linear both;
    -moz-animation:fadeIn 1.5s 3s linear both;
    -webkit-animation:fadeIn 1.5s 3s linear both;
    -o-animation:fadeIn 1.5s 3s linear both
}
.bg4.ani .fc4{
    animation:fadeIn 1.5s 4s linear both;
    -moz-animation:fadeIn 1.5s 4s linear both;
    -webkit-animation:fadeIn 1.5s 4s linear both;
    -o-animation:fadeIn 1.5s 4s linear both
}

.bg4.ani1 .w1{
    animation:fadeIn 1.5s 0s linear both;
    -moz-animation:fadeIn 1.5s 0s linear both;
    -webkit-animation:fadeIn 1.5s 0s linear both;
    -o-animation:fadeIn 1.5s 0s linear both
}
.bg4.ani1 .w2{
    animation:fadeIn 1s 1.5s linear both;
    -moz-animation:fadeIn 1s 1.5s linear both;
    -webkit-animation:fadeIn 1s 1.5s linear both;
    -o-animation:fadeIn 1s 1.5s linear both
}
.bg4.ani1 .w4{
    animation:fadeIn 1.5s 2.5s linear both;
    -moz-animation:fadeIn 1.5s 2.5s linear both;
    -webkit-animation:fadeIn 1.5s 2.5s linear both;
    -o-animation:fadeIn 1.5s 2.5s linear both
}
.bg4.ani1 .w3{
    animation:fadeInOut1 2s 3.5s linear infinite;
    -moz-animation:fadeInOut1 2s 3.5s linear infinite;
    -webkit-animation:fadeInOut1 2s 3.5s linear infinite;
    -o-animation:fadeInOut1 2s 3.5s linear infinite
}

.bg5{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;position: absolute;top:0;left:0;background:url("../images/p5.1.jpg") no-repeat 0 0;background-size:100% 100%;}
.bg5 .w0{position: absolute;top:17%;left:-98%;background:url('../images/background.png') no-repeat 0 0;background-size:100% 100%;margin: 0 auto;overflow: hidden;}
.bg5 .btn0{position: absolute;top:90%;left:45%;width: 12%;height:7%;background:url('../images/btn.png') no-repeat 0 0;background-size:100% 100%;opacity: 1;}
.bg5 .btn1{position: absolute;top:32%;left:38%;width: 26%;height:8%;}
.bg5 .btn2{position: absolute;top:40%;left:26%;width: 51%;height:6%;display: none;}
.bg5 .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%;display: none;}
.bg5 .w2{position: absolute;top:21%;left:41%;width: 24%;height:13%;display: none;}
.bg5 .w2 img{width: 100%;}
.bg5 .w3{position: absolute;top:0;left:0;width: 100%;height:100%;background:url('../images/p5.3.png') no-repeat 0 0;background-size:100% 100%;display: none;}

.bg5 .btn0{
    animation:fadeInOut 1.5s 0s linear infinite;
    -moz-animation:fadeInOut 1.5s 0s linear infinite;
    -webkit-animation:fadeInOut 1.5s 0s linear infinite;
    -o-animation:fadeInOut 1.5s 0s linear infinite
}

.bg5.ani .w0{
    animation:rotateBg1 1s 0s linear both;
    -moz-animation:rotateBg1 1s 0s linear both;
    -webkit-animation:rotateBg1 1s 0s linear both;
    -o-animation:rotateBg1 1s 0s linear both
}

.bg5.ani1 .w0{
    animation:rotateBg2 1s 0s linear both;
    -moz-animation:rotateBg2 1s 0s linear both;
    -webkit-animation:rotateBg2 1s 0s linear both;
    -o-animation:rotateBg2 1s 0s linear both
}

.bg5.ani2 .w0{
    animation:rotateBg3 1s 0s linear both;
    -moz-animation:rotateBg3 1s 0s linear both;
    -webkit-animation:rotateBg3 1s 0s linear both;
    -o-animation:rotateBg3 1s 0s linear both
}

.bg5.ani3 .w0{
    animation:rotateBg4 1s 0s linear both;
    -moz-animation:rotateBg4 1s 0s linear both;
    -webkit-animation:rotateBg4 1s 0s linear both;
    -o-animation:rotateBg4 1s 0s linear both
}

@-webkit-keyframes rotateBg1 {
    0% {-webkit-transform: rotate(0);transform: rotate(0);-webkit-transform-origin:50% 49%;transform-origin:50% 49%;}
    100% {-webkit-transform: rotate(-77deg);transform: rotate(-77deg);-webkit-transform-origin:50% 49%;transform-origin:50% 49%;}
}
@keyframes rotateBg1 {
    0% {-webkit-transform: rotate(0);transform: rotate(0);-webkit-transform-origin:50% 49%;transform-origin:50% 49%;}
    100% {-webkit-transform: rotate(-77deg);transform: rotate(-77deg);-webkit-transform-origin:50% 49%;transform-origin:50% 49%;}
}

@-webkit-keyframes rotateBg2 {
    0% {-webkit-transform: rotate(-77deg);transform: rotate(-77deg);-webkit-transform-origin:50% 49%;transform-origin:50% 49%;}
    100% {-webkit-transform: rotate(-149deg);transform: rotate(-149deg);-webkit-transform-origin:52% 49%;transform-origin:52% 49%;}
}
@keyframes rotateBg2 {
    0% {-webkit-transform: rotate(-77deg);transform: rotate(-77deg);-webkit-transform-origin:50% 49%;transform-origin:50% 49%;}
    100% {-webkit-transform: rotate(-149deg);transform: rotate(-149deg);-webkit-transform-origin:52% 49%;transform-origin:52% 49%;}
}

@-webkit-keyframes rotateBg3 {
    0% {-webkit-transform: rotate(-149deg);transform: rotate(-149deg);-webkit-transform-origin:52% 49%;transform-origin:52% 49%;}
    100% {-webkit-transform: rotate(-210deg);transform: rotate(-210deg);-webkit-transform-origin:50.5% 49%;transform-origin:50.5% 49%;}
}
@keyframes rotateBg3 {
    0% {-webkit-transform: rotate(-149deg);transform: rotate(-149deg);-webkit-transform-origin:52% 49%;transform-origin:52% 49%;}
    100% {-webkit-transform: rotate(-210deg);transform: rotate(-210deg);-webkit-transform-origin:50.5% 49%;transform-origin:50.5% 49%;}
}

@-webkit-keyframes rotateBg4 {
    0% {-webkit-transform: rotate(-210deg);transform: rotate(-210deg);-webkit-transform-origin:50.5% 49%;transform-origin:50.5% 49%;}
    100% {-webkit-transform: rotate(-274deg);transform: rotate(-274deg);-webkit-transform-origin:52% 49%;transform-origin:52% 49%;}
}
@keyframes rotateBg4 {
    0% {-webkit-transform: rotate(-210deg);transform: rotate(-210deg);-webkit-transform-origin:50.5% 49%;transform-origin:50.5% 49%;}
    100% {-webkit-transform: rotate(-274deg);transform: rotate(-274deg);-webkit-transform-origin:52% 49%;transform-origin:52% 49%;}
}



@-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;}}

@-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;}}

@keyframes fadeInLeft1
{0%{opacity:0;-webkit-transform:translate3d(-40%,0,0);transform:translate3d(-40%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInLeft1 /* Firefox */
{0%{opacity:0;-webkit-transform:translate3d(-40%,0,0);transform:translate3d(-40%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-webkit-keyframes fadeInLeft1 /* Safari 和 Chrome */
{0%{opacity:0;-webkit-transform:translate3d(-40%,0,0);transform:translate3d(-40%,0,0)}100%{opacity:1;-webkit-transform:none;transform:none}} 

@keyframes fadeInLeft2
{0%{opacity:0;-webkit-transform:translate3d(-40%,-20%,0);transform:translate3d(-40%,-20%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInLeft2 /* Firefox */
{0%{opacity:0;-webkit-transform:translate3d(-40%,-20%,0);transform:translate3d(-40%,-20%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-webkit-keyframes fadeInLeft2 /* Safari 和 Chrome */
{0%{opacity:0;-webkit-transform:translate3d(-40%,-20%,0);transform:translate3d(-40%,-20%,0)}100%{opacity:1;-webkit-transform:none;transform:none}} 

@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}}

@-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 fadeInOut1 {0% {opacity: 0;} 30% {opacity: 1;} 70% {opacity: 1;} 100% {opacity: 0;}}
@-moz-keyframes fadeInOut1 {0% {opacity: 0;} 30% {opacity: 1;} 70% {opacity: 1;} 100% {opacity: 0;}}
@keyframes fadeInOut1 {0% {opacity: 0;} 30% {opacity: 1;} 70% {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}}

@keyframes fadeOutRight
{0%{opacity:1;-webkit-transform:none;transform:none;}100%{opacity:1;-webkit-transform:translate3d(75%,22%,0);transform:translate3d(75%,22%,0);}}
@-moz-keyframes fadeOutRight /* Firefox */
{0%{opacity:1;-webkit-transform:none;transform:none;}100%{opacity:1;-webkit-transform:translate3d(75%,22%,0);transform:translate3d(75%,22%,0);}}
@-webkit-keyframes fadeOutRight /* Safari 和 Chrome */
{0%{opacity:1;-webkit-transform:none;transform:none;}100%{opacity:1;-webkit-transform:translate3d(75%,22%,0);transform:translate3d(75%,22%,0);}}

@keyframes fadeOutRight1
{0%{opacity:1;-webkit-transform:none;transform:none;}100%{opacity:1;-webkit-transform:translate3d(96%,28%,0);transform:translate3d(96%,28%,0);}}
@-moz-keyframes fadeOutRight1 /* Firefox */
{0%{opacity:1;-webkit-transform:none;transform:none;}100%{opacity:1;-webkit-transform:translate3d(96%,28%,0);transform:translate3d(96%,28%,0);}}
@-webkit-keyframes fadeOutRight1 /* Safari 和 Chrome */
{0%{opacity:1;-webkit-transform:none;transform:none;}100%{opacity:1;-webkit-transform:translate3d(96%,28%,0);transform:translate3d(96%,28%,0);}}

@-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 swing {
    20% {
    -webkit-transform:rotate(15deg);
    transform:rotate(15deg)
}
40% {
    -webkit-transform:rotate(-10deg);
    transform:rotate(-10deg)
}
60% {
    -webkit-transform:rotate(5deg);
    transform:rotate(5deg)
}
80% {
    -webkit-transform:rotate(-5deg);
    transform:rotate(-5deg)
}
100% {
    -webkit-transform:rotate(0deg);
    transform:rotate(0deg)
}
}
@keyframes swing {
    20% {
    -webkit-transform:rotate(15deg);
    -ms-transform:rotate(15deg);
    transform:rotate(15deg)
}
40% {
    -webkit-transform:rotate(-10deg);
    -ms-transform:rotate(-10deg);
    transform:rotate(-10deg)
}
60% {
    -webkit-transform:rotate(5deg);
    -ms-transform:rotate(5deg);
    transform:rotate(5deg)
}
80% {
    -webkit-transform:rotate(-5deg);
    -ms-transform:rotate(-5deg);
    transform:rotate(-5deg)
}
100% {
    -webkit-transform:rotate(0deg);
    -ms-transform:rotate(0deg);
    transform:rotate(0deg)
}
}
