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.jpg');background-size:100% 100%;z-index: 99}
.load_val{width:100%;}
.loading_line{top:45%;width:60%;height:3px;position:absolute;left:20%;background:#a10e16;}
.loading_line_blank{width:0%;height:100%;background:#fedb4c;}
a{opacity:0}


/* 音乐开关*/
#switch-music{z-index:9999999;position:absolute;bottom: 5px;left: 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(0deg)}
    100%{transform: rotate(360deg)}
}
@-webkit-keyframes music{
    0%{transform: rotate(0deg); -webkit-transform: rotate(0deg)}
    100%{transform: rotate(360deg); -webkit-transform: rotate(360deg)}
}
.pof{position: fixed; z-index:9999}
/*音乐结束*/
.swiper-container{position:absolute;width:100%;height:100%}
.swiper-slide{position:relative;overflow:hidden}
.swiper-slide *{position:absolute;opacity:0}
.bg,.bg *{opacity:1}
.layer{width:100%;height:100%;opacity:1}
.layer div{border-radius:100%}


#s0{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/8/p0.0.jpg?1") no-repeat 0 0;background-size:198% 100%;}
#s0 .w0{width: 198%;height: 100%;top:0;left:0;background:url("../images/8/p0.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s0.ani .w0{
    -webkit-animation:25s 0.5s scroll_s0  linear both infinite;
    -moz-animation:25s 0.5s scroll_s0  linear both infinite;
    -o-animation:25s 0.5s scroll_s0  linear both infinite;
    animation:25s 0.5s scroll_s0 linear both infinite;
}
#s0 .w1{width: 100%;height: 100%;top:0;left:0;background:url("../images/8/p0.1.png?1") no-repeat 0 0;background-size:100% 100%;}
#s0.ani .w1{
    -webkit-animation:1.5s  fadeIn  linear both ;
    -moz-animation:1.5s  fadeIn  linear both;
    -o-animation:1.5s  fadeIn  linear both;
    animation:1.5s  fadeIn linear both ;
}



#s1{width: 100%;height: 100%;margin: 0 auto;background:url("../images/8/p1.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s1 .w0,#s1 .w1,#s1 .w3{width: 100%;height: 100%;position:absolute;top:0;left:0;opacity: 1}
#s1 .w00{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.0.1.png?1") no-repeat 0 0;background-size:100% 100%;display: none;opacity: 0}
#s1 .w01{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.0.2.png?1") no-repeat 0 0;background-size:100% 100%;display: none;opacity: 0}
#s1 .w02{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.0.3.png?1") no-repeat 0 0;background-size:100% 100%;display: none;opacity: 0}

#s1 .w10{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s1 .w11{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.2.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s1 .w12{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.3.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s1 .error,#s1 .right{width: 14%;height:5.3%;position:absolute;;opacity: 1}
#s1 .w3_bg{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p1.4.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s1 .w31,#s1 .w32,#s1 .w33{top:73.7%}
#s1 .w34,#s1 .w35,#s1 .w36{top:80.5%}
#s1 .w37,#s1 .w38,#s1 .w39{top:87.2%}

#s1 .w31,#s1 .w34,#s1 .w37{left:20.3%}
#s1 .w32,#s1 .w35,#s1 .w38{left:36.3%}
#s1 .w33,#s1 .w36,#s1 .w39{left:53.3%}
#s1 .w00.ani,#s1 .w01.ani,#s1 .w02.ani{
    -webkit-animation:2s  fadeIn2  linear both ;
    -moz-animation:2s  fadeIn2  linear both;
    -o-animation:2s  fadeIn2  linear both;
    animation:2s  fadeIn2 linear both ;

}


#s2{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/8/p2.0.jpg?1") no-repeat 0 0;background-size:294% 100%;}
#s2 .w0{width:294%;height: 100%;top:0;left:0;background:url("../images/8/p2.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s2 .w1{width: 100%;height: 100%;top:0;left:0;background:url("../images/8/p2.1.png?1") no-repeat 0 0;background-size:100% 100%;}
#s2.ani .w0{
    -webkit-animation:40s 0.5s scroll_s2  linear both infinite;
    -moz-animation:40s 0.5s scroll_s2  linear both infinite;
    -o-animation:40s 0.5s scroll_s2  linear both infinite;
    animation:40s 0.5s scroll_s2 linear both infinite;
}
#s2.ani .w1{
    -webkit-animation:1.5s  fadeIn  linear both ;
    -moz-animation:1.5s  fadeIn  linear both;
    -o-animation:1.5s  fadeIn  linear both;
    animation:1.5s  fadeIn linear both ;
}


#s3{width: 100%;height: 100%;margin: 0 auto;background:url("../images/8/p3.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s3 .w0{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p3.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
#s3.ani .w0{
    -webkit-animation:1.5s 0.5s fadeIn  linear both ;
    -moz-animation:1.5s 0.5s fadeIn  linear both;
    -o-animation:1.5s 0.5s fadeIn  linear both;
    animation:1.5s 0.5s fadeIn linear both ;
}

#s4{width: 100%;height: 100%;margin: 0 auto;background:url("../images/8/p4.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s4 .w0{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/8/p4.1.png?1") no-repeat 0 0;background-size:147% 100%;opacity: 1}
#s4 .w00{width:147%;height: 100%;top:0;left:0;background:url("../images/8/p4.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s4.ani .w00{
    -webkit-animation:20s 0.5s scroll_s4  linear both infinite;
    -moz-animation:20s 0.5s scroll_s4  linear both infinite;
    -o-animation:20s 0.5s scroll_s4  linear both infinite;
    animation:20s 0.5s scroll_s4 linear both infinite;
}

#s5{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/8/p5.0.jpg?1") no-repeat 0 0;background-size:269% 100%;}
#s5 .w0{width: 269%;height: 100%;top:0;left:0;background:url("../images/8/p5.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s5 .w1{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p5.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
#s5.ani .w0{
    -webkit-animation:40s 1s scroll_s5  linear both infinite;
    -moz-animation:40s 1s scroll_s5 linear both infinite;
    -o-animation:40s 1s scroll_s5  linear both infinite;
    animation:40s 1s scroll_s5 linear both infinite;
}
#s5.ani .w1{
    -webkit-animation:1s 0.5s fadeIn  linear both ;
    -moz-animation:1s 0.5s fadeIn  linear both;
    -o-animation:1s 0.5s fadeIn  linear both;
    animation:1s 0.5s fadeIn linear both ;
}

#s6{width: 100%;height: 100%;margin: 0 auto;background:url("../images/8/p6.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s6 .w0{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p6.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0}
#s6.ani .w0{
    -webkit-animation:1s 0.5s fadeIn  linear both ;
    -moz-animation:1s 0.5s fadeIn  linear both;
    -o-animation:1s 0.5s fadeIn  linear both;
    animation:1s 0.5s fadeIn linear both ;
}

#s7{width: 100%;height: 100%;margin: 0 auto;background:url("../images/8/p7.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s7 .w0{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/8/p7.1.png?1") no-repeat 0 0;background-size:174% 100%;opacity: 1}
#s7 .w00{width:174%;height: 100%;top:0;left:0;background:url("../images/8/p7.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s7.ani .w00{
    -webkit-animation:20s 0.5s scroll_s4  linear both infinite;
    -moz-animation:20s 0.5s scroll_s4  linear both infinite;
    -o-animation:20s 0.5s scroll_s4  linear both infinite;
    animation:20s 0.5s scroll_s4 linear both infinite;
}

#s8{width: 100%;height: 100%;margin: 0 auto;overflow: hidden;background:url("../images/8/p8.0.jpg?1") no-repeat 0 0;background-size:100% 100%;}
#s8 .w0{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p8.1.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 1}
#s8 .w1{width: 100%;height: 100%;position:absolute;top:0;left:0;background:url("../images/8/p8.2.png?1") no-repeat 0 0;background-size:100% 100%;opacity: 0;}
#s8 .click1{top:75%;left:19%;width:17%;height:16%;}
#s8 .click2{top:74%;left:61%;width:19%;height:17%;}
#s8.ani .w0{
    -webkit-animation:1.2s 0.5s fadeIn  linear both ;
    -moz-animation:1.2s 0.5s fadeIn  linear both;
    -o-animation:1.2s 0.5s fadeIn  linear both;
    animation:1.2s 0.5s fadeIn linear both ;
}

#s8.ani .w1{
    -webkit-animation:1s 1.3s fadeTop   both ;
    -moz-animation:1s 1.3s fadeTop   both ;
    -o-animation:1s 1.3s fadeTop   both ;
    animation:1s 1.3s fadeTop  both ;
}

.arrow{position: absolute;top:98%;left:45%;width: 10%;height: 5%;background:url("../images/7/arrow.png?1") no-repeat 0 0;background-size:100% 100%;}
#s0.ani .arrow,#s1.ani .arrow,#s2.ani .arrow,#s3.ani .arrow,#s4.ani .arrow,#s5.ani .arrow,#s6.ani .arrow,#s7.ani .arrow{
    animation:1s 0.5s arrow infinite both ;
    -webkit-animation:1s 0.5s arrow infinite both;
    -o-animation:1s 0.5s arrow infinite both;
    -moz-animation:1s 0.5s  arrow infinite both;
}

@keyframes arrow{
    0%{top: 98%;opacity: 0}
    100%{top:92%;opacity: 1}
}
@-webkit-keyframes arrow{
    0%{top: 98%;opacity: 0}
    100%{top:92%;opacity: 1}
}
@-o-keyframes arrow{
    0%{top: 98%;opacity: 0}
    100%{top:92%;opacity: 1}
}
@-moz-keyframes arrow{
    0%{top: 98%;opacity: 0}
    100%{top:92%;opacity: 1}
}




@keyframes fadeTop {
    0% {  top:20%  }
    100% { top:0 ;opacity: 1 }
}
@-webkit-keyframes fadeTop {
    0% {  top:20%  }
    100% { top:0 ;opacity: 1 }
}
@-moz-keyframes fadeTop {
    0% {  top:20%  }
    100% { top:0 ;opacity: 1 }
}
@-o-keyframes fadeTop {
    0% {  top:20%  }
    100% { top:0 ;opacity: 1 }
}


@-webkit-keyframes bubble{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:none;transform:none}
}
@keyframes bubble{
    0%{opacity:0;-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}
    100%{opacity:1;-webkit-transform:none;transform:none}
}

@keyframes fadeIn {     /*逐渐显示*/
    0% {  opacity: 0;  }
    100% {  opacity: 1;  }
}
@-webkit-keyframes fadeIn {     /*逐渐显示*/
    0% {  opacity: 0;  }
    100% {  opacity: 1;  }
}
@-moz-keyframes fadeIn {     /*逐渐显示*/
    0% {  opacity: 0;  }
    100% {  opacity: 1;  }
}
@-o-keyframes fadeIn {     /*逐渐显示*/
    0% {  opacity: 0;  }
    100% {opacity: 1;}
}



@keyframes fadeIn2 {     /*逐渐显示*/
    0% {  opacity: 0;  }
   35% {  opacity: 1;  }
    70% {  opacity: 0;  }
    100% {  opacity: 1;  }
}
@-webkit-keyframes fadeIn2 {     /*逐渐显示*/
    0% {  opacity: 0;  }
    35% {  opacity: 1;  }
    70% {  opacity: 0;  }
    100% {  opacity: 1;  }
}
@-moz-keyframes fadeIn2 { /*逐渐显示*/
    0% {  opacity: 0;  }
    35% {  opacity: 1;  }
    70% {  opacity: 0;  }
    100% {  opacity: 1;  }
}
@-o-keyframes fadeIn2 {     /*逐渐显示*/
    0% {  opacity: 0;  }
    35% {  opacity: 1;  }
    70% {  opacity: 0;  }
    100% {  opacity: 1;  }
}



@keyframes scroll_s0   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-98%;}
    100%{opacity:1;left:0;}
}
@-webkit-keyframes scroll_s0   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-98%;}
    100%{opacity:1;left:0;}
}
@-moz-keyframes scroll_s0   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-98%;}
    100%{opacity:1;left:0;}
}
@-o-keyframes scroll_s0   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-98%;}
    100%{opacity:1;left:0;}
}




@keyframes scroll_s2   /*背景图左侧移动*/
{
    0%{opacity:1;left:-194%;}
    50%{opacity:1;left:0;}
    100%{opacity:1;left:-194%;}
}
@-webkit-keyframes scroll_s2   /*背景图左侧移动*/
{
    0%{opacity:1;left:-194%;}
    50%{opacity:1;left:0;}
    100%{opacity:1;left:-194%;}
}
@-o-keyframes scroll_s2   /*背景图左侧移动*/
{
    0%{opacity:1;left:-194%;}
    50%{opacity:1;left:0;}
    100%{opacity:1;left:-194%;}
}
@-moz-keyframes scroll_s2   /*背景图左侧移动*/
{
    0%{opacity:1;left:-194%;}
    50%{opacity:1;left:0;}
    100%{opacity:1;left:-194%;}
}


@keyframes scroll_s4   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-47%;}
    100%{opacity:1;left:0;}
}
@-webkit-keyframes scroll_s4   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-47%;}
    100%{opacity:1;left:0;}
}
@-moz-keyframes scroll_s4   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-47%;}
    100%{opacity:1;left:0;}
}
@-o-keyframes scroll_s4   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-47%;}
    100%{opacity:1;left:0;}
}




@keyframes scroll_s5  /*背景图左侧移动*/
{
    0%{opacity:1;left:0}
    50%{opacity:1;left:-169%;}
    100%{opacity:1;left:0}
}
@-webkit-keyframes scroll_s5   /*背景图左侧移动*/
{
    0%{opacity:1;left:0}
    50%{opacity:1;left:-169%;}
    100%{opacity:1;left:0}
}
@-o-keyframes scroll_s5   /*背景图左侧移动*/
{
    0%{opacity:1;left:0}
    50%{opacity:1;left:-169%;}
    100%{opacity:1;left:0}
}
@-moz-keyframes scroll_s5  /*背景图左侧移动*/
{
    0%{opacity:1;left:0}
    50%{opacity:1;left:-169%;}
    100%{opacity:1;left:0}
}

@keyframes scroll_s7  /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-74%;}
    100%{opacity:1;left:0;}
}
@-webkit-keyframes scroll_s7   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-74%;}
    100%{opacity:1;left:0;}
}
@-o-keyframes scroll_s7   /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-74%;}
    100%{opacity:1;left:0;}
}
@-moz-keyframes scroll_s7  /*背景图左侧移动*/
{
    0%{opacity:1;left:0;}
    50%{opacity:1;left:-74%;}
    100%{opacity:1;left:0;}
}