body dl dd div p{margin:0;padding:0;}
body{margin: 0 auto;width: 100%;height: 100%;top:0;bottom:0;position: absolute;}
ul li{list-style-type:none;}
a {text-decoration:none;opacity: 0;}
a:link{color:#000;}
a:visited{color:#000;}

.loading{position:absolute;width:100%;height:100%;background:url('../images/p0.jpg') no-repeat;background-size:100% 100%;}
.load_val{width:100%;}
.loading_line{top: 39%;width: 40%;height: 6px;position: absolute;left: 30%;border-radius: 6px;background: #663333;}
.loading_line_blank{width:0%;height:100%;border-radius: 6px;background: #cc9966;}
.loading_img{position:absolute;width:100%;height:100%;}
.body{width: 100%;height: 100%;position: absolute;}
.swiper-container{position:absolute;width:100%;height:100%;opacity: 0}
.swiper-wrapper{height: 100%;}
.swiper-slide{position:relative;overflow:hidden}
.swiper-slide *{position:absolute;opacity:0}


#s0{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p1.jpg') no-repeat 0 0;background-size:100% 100%;}
#s0 .w0{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p0.1.png?4') no-repeat 0 0;background-size:100% 100%;}
#s0 .w1{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p0.2.png?4') no-repeat 0 0;background-size:100% 100%;}
#s0 .w2{position: absolute;width: 100%;height:100%;top:4%;left:0%;background:url('../images/p0.3.png?4') no-repeat 0 0;background-size:100% 100%;}
#s0 .w3{opacity: 0;position: absolute;width: 10%;height: 8%;top: 87%;left: 46%;background:url('../images/hand.png?4') no-repeat 0 0;background-size:100% 100%;}
#s0 .click{position: absolute;width: 40%;height: 7%;top: 84%;left: 30%;}
#s0.ani .w0{
        animation:fadeIn 1s .5s linear both;
        -moz-animation:fadeIn 1s .5s linear both;
        -webkit-animation:fadeIn 1s .5s linear both;
        -o-animation:fadeIn 1s .5s linear both
}
#s0.ani .w1{
        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
}
#s0.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
}
#s0.ani .w3{
        animation:fadeIn 1.5s 3.5s linear infinite;
        -moz-animation:fadeIn 1.5s 3.5s linear infinite;
        -webkit-animation:fadeIn 1.5s 3.5s linear infinite;
        -o-animation:fadeIn 1.5s 3.5s linear infinite
}
#s1{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p2.jpg') no-repeat 0 0;background-size:100% 100%;overflow-x: scroll;}
#s1 .w0{position: absolute;width: 312.8%;height:51.5%;top:2%;left:2%;background:url('../images/p2.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a0{position: absolute;width: 7.1%;
    height: 23.3%;
    top: 19%;
    left: 4%;background:url('../images/p2.12.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a1{position: absolute;width: 10.1%;
    height: 36.3%;
    top: 40%;
    left: 8%;background:url('../images/p2.2.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a2{position: absolute;width: 10%;
    height: 20%;
    top: 24%;
    left: 16%;background:url('../images/p2.8.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a3{position: absolute;width: 8.3%;
    height: 26%;
    top: 43%;
    left: 25%;background:url('../images/p2.11.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a4{position: absolute;width: 11%;
    height: 37%;
    top: 17%;
    left: 34%;background:url('../images/p2.4.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a5{position: absolute;width: 11%;
    height: 29%;
    top: 53%;
    left: 33%;background:url('../images/p2.1.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a6{position: absolute;width: 6%;
    height: 35%;
    top: 32%;
    left: 45%;background:url('../images/p2.9.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a7{position: absolute;width: 12%;
    height: 35%;
    top: 24%;
    left: 53%;background:url('../images/p2.7.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a8{position: absolute;width: 10%;
    height: 36%;
    top: 51%;
    left: 72.5%;background:url('../images/p2.3.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a9{position: absolute;width: 12%;
    height: 35%;
    top: 19%;
    left: 67%;background:url('../images/p2.5.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a10{position: absolute;width: 9.5%;
    height: 23%;
    top: 58%;
    left: 59%;background:url('../images/p2.10.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .a11{position: absolute;width: 14.4%;
    height: 36%;
    top: 35%;
    left: 81%;background:url('../images/p2.6.png?4') no-repeat 0 0;background-size:100% 100%;}

#s1 .w0 .b0{display: none;position: absolute;width: 3%;height: 13%;top: 23%;left: 6.5%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b1{display: none;position: absolute;width: 3%;height: 13%;top: 54%;left: 11%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b2{display: none;position: absolute;width: 3%;height: 13%;top: 26%;left: 20%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b3{display: none;position: absolute;width: 3%;height: 13%;top: 48%;left: 28%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b4{display: none;position: absolute;width: 3%;height: 13%;top: 28%;left: 37.5%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b5{display: none;position: absolute;width: 3%;height: 13%;top: 60%;left: 37%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b6{display: none;position: absolute;width: 3%;height: 13%;top: 43%;left: 46%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b7{display: none;position: absolute;width: 3%;height: 13%;top: 35%;left: 57%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b8{display: none;position: absolute;width: 3%;height: 13%;top: 60%;left: 76%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b9{display: none;position: absolute;width: 3%;height: 13%;top: 30%;left: 72%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b10{display: none;position: absolute;width: 3%;height: 13%;top: 60%;left: 62.5%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w0 .b11{display: none;position: absolute;width: 3%;height: 13%;top: 47%;left: 86.5%;background:url('../images/p2.13.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w1{position: fixed;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p2.15.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w2{opacity: 0;position: absolute;width: 10%;height: 6%;top: 41%;left: 86%;background:url('../images/p2.14.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .w3{display: none;position: fixed;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p2.24.png?4') no-repeat 0 0;background-size:100% 100%;}
#s1 .c1{position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c2{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c3{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c4{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c5{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c6{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c7{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1 .c8{display: none;position: fixed;width: 26%;height: 5%;top: 93%;left: 38%;}
#s1.ani .w1{
        animation:fadeIn 1s .5s linear both;
        -moz-animation:fadeIn 1s .5s linear both;
        -webkit-animation:fadeIn 1s .5s linear both;
        -o-animation:fadeIn 1s .5s linear both
}
.animate{
        animation:animate 3s .5s linear both;
        -moz-animation:animate 3s .5s linear both;
        -webkit-animation:animate 3s .5s linear both;
        -o-animation:animate 3s .5s linear both
}

#c1{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;}
#c1 .c1{position: absolute;width: 26%;height: 5%;top: 93%;left: 38%;}
#s2{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p3.jpg') no-repeat 0 0;background-size:100% 100%;}
#s2 .w0{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p3.1.png?4') no-repeat 0 0;background-size:100% 100%;}
#s2 .w1{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p3.2.png?4') no-repeat 0 0;background-size:100% 100%;}
#s2 .w2{position: absolute;font-family: 微软雅黑;font-size: 20px;text-align: center;width: 9%;height: 4%;top: 15%;left: 42%;color:#cc3333;font-weight: bold;}
#s2 .click1{position: absolute;width: 40%;height: 7%;top: 52%;left: 30%;}
#s2 .click2{position: absolute;width: 40%;height: 7%;top: 62%;left: 30%;}
/* #s2 .w3{opacity: 0;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/hand.png?4') no-repeat 0 0;background-size:100% 100%;} */
#s2.ani .w0{
        animation:fadeIn 1s .5s linear both;
        -moz-animation:fadeIn 1s .5s linear both;
        -webkit-animation:fadeIn 1s .5s linear both;
        -o-animation:fadeIn 1s .5s linear both
}
#s2.ani .w1{
        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
}
#s2.ani .w2{
        animation:fadeIn 1s .5s linear both;
        -moz-animation:fadeIn 1s .5s linear both;
        -webkit-animation:fadeIn 1s .5s linear both;
        -o-animation:fadeIn 1s .5s linear both
}
#s2.ani .w3{
        animation:fadeIn 1.5s 3.5s linear infinite;
        -moz-animation:fadeIn 1.5s 3.5s linear infinite;
        -webkit-animation:fadeIn 1.5s 3.5s linear infinite;
        -o-animation:fadeIn 1.5s 3.5s linear infinite
}
#s3{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p4.jpg') no-repeat 0 0;background-size:100% 100%;}
#s3 .w0{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p4.1.png?4') no-repeat 0 0;background-size:100% 100%;}
#s3 .w1{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p4.2.png?4') no-repeat 0 0;background-size:100% 100%;}
#s3 .w2{position: absolute;width: 100%;height:100%;top:6%;left:0%;background:url('../images/p4.3.png?4') no-repeat 0 0;background-size:100% 100%;}
#s3 .click3{position: absolute;width: 40%;height: 7%;top: 64%;left: 30%;}
#s3.ani .w0{
        animation:fadeInLeft 1s .5s linear both;
        -moz-animation:fadeInLeft 1s .5s linear both;
        -webkit-animation:fadeInLeft 1s .5s linear both;
        -o-animation:fadeInLeft 1s .5s linear both
}
#s3.ani .w1{
        animation:fadeInRight 1s 2s linear both;
        -moz-animation:fadeInRight 1s 2s linear both;
        -webkit-animation:fadeInRight 1s 2s linear both;
        -o-animation:fadeInRight 1s 2s linear both
}
#s3.ani .w2{
        animation:fadeIn 1s 3s linear both;
        -moz-animation:fadeIn 1s 3s linear both;
        -webkit-animation:fadeIn 1s 3s linear both;
        -o-animation:fadeIn 1s 3s linear both
}
#s4{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p5.jpg') no-repeat 0 0;background-size:100% 100%;}
#s4 .w0{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p5.1.png?4') no-repeat 0 0;background-size:100% 100%;}
#s4 .w1{position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p5.2.png?4') no-repeat 0 0;background-size:100% 100%;}
#s4 .w2{position: absolute;width: 100%;height:100%;top:6%;left:0%;background:url('../images/p5.3.png?4') no-repeat 0 0;background-size:100% 100%;}
#s4 .w3{display: none;position: absolute;width: 100%;height:100%;top:0%;left:0%;background:url('../images/p5.4.png?4') no-repeat 0 0;background-size:100% 100%;}
#s4 .w3 .close{position: absolute;width: 11%;height: 7%;top: 88%;left: 44%;}
#s4 .click4{position: absolute;width: 40%;height: 7%;top: 74%;left: 51%;}
#s4 .click5{position: absolute;width: 40%;height: 7%;top: 74%;left: 9%;}
#s4 .click4 a{position: absolute;width: 100%;height: 100%;top:0%;left: 0%;}
#s4.ani .w0{
        animation:fadeIn 1s .5s linear both;
        -moz-animation:fadeIn 1s .5s linear both;
        -webkit-animation:fadeIn 1s .5s linear both;
        -o-animation:fadeIn 1s .5s linear both
}
#s4.ani .w1{
        animation:fadeInLeft 1s 1.5s linear both;
        -moz-animation:fadeInLeft 1s 1.5s linear both;
        -webkit-animation:fadeInLeft 1s 1.5s linear both;
        -o-animation:fadeInLeft 1s 1.5s linear both
}
#s4.ani .w2{
        animation:fadeIn 1s 3s linear both;
        -moz-animation:fadeIn 1s 3s linear both;
        -webkit-animation:fadeIn 1s 3s linear both;
        -o-animation:fadeIn 1s 3s linear both
}

keyframes animate
{
        0%{opacity: 1;left:86%;}
        33%{opacity: 1;left:80%;}
        66%{opacity: 1;left:86%;}
        99%{opacity: 1;left:80%;}
        100%{opacity: 0;left:80%;}
}

@-moz-keyframes animate /* Firefox */
{
        0%{opacity: 1;left:86%;}
        33%{opacity: 1;left:80%;}
        66%{opacity: 1;left:86%;}
        99%{opacity: 1;left:80%;}
        100%{opacity: 0;left:80%;}
}

@-webkit-keyframes animate /* Safari 和 Chrome */
{
        0%{opacity: 1;left:86%;}
        33%{opacity: 1;left:80%;}
        66%{opacity: 1;left:86%;}
        99%{opacity: 1;left:80%;}
        100%{opacity: 0;left:80%;}
}


@keyframes arrow
{0%{opacity: 0;left:93%;}90%{opacity: 1;left:91%;}100%{opacity: 1;left:93%;}}
@-moz-keyframes arrow /* Firefox */
{0%{opacity: 0;left:93%;}90%{opacity: 1;left:91%;}100%{opacity: 1;left:93%;}}
@-webkit-keyframes arrow /* Safari 和 Chrome */
{0%{opacity: 0;left:93%;}90%{opacity: 1;left:91%;}100%{opacity: 1;left:93%;}}

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

/* 向左下 */
@-webkit-keyframes fadeInLB{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@-moz-keyframes fadeInLB{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}
@keyframes fadeInLB{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}100%{opacity:1;-webkit-transform:none;transform:none}}


/* 音乐开关*/
#switch-music{z-index:9999999;position:absolute;top: 5px;right: 5px; width:30px; height:30px;}
#switch-music img{max-width: 100%;}
#switch-music.show{display:block; z-index:999;}
#switch-music .tips{color: rgba(255,255,255,.75); z-index:999; top: 15px; right: 100px; width: 30px; text-align: right; opacity: 0;}
#switch-music .tips.on{opacity: 1; right: 100px; z-index:999;}
#switch-music div:nth-child(2){display:none; z-index:999;}
#switch-music.on div:nth-child(2){display:block; animation: music 1s linear infinite; -webkit-animation: music 1s linear infinite; z-index:999;}
@keyframes music{
  0%{transform: rotate(0)}
  100%{transform: rotate(360deg)}
}
@-webkit-keyframes music{
  0%{transform: rotate(0); -webkit-transform: rotate(0)}
  100%{transform: rotate(360deg); -webkit-transform: rotate(360deg)}
}
.pof{position: fixed; z-index:9999}
@-webkit-keyframes bubble /* Safari 和 Chrome */
{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:none;transform:none}
}