@charset "utf-8";
/* CSS Document */
html,body {height: 100%;}
body {margin: 0;padding: 0;overflow: hidden;}
ul,li,p{list-style: none;padding: 0;margin: 0;}
#bg {position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;}
#bg canvas {position:absolute;top:0;left:0;width:100%;height:100%;}
.pa{position: absolute;}
.wave{width:20px;height:20px;position: absolute;}

.fm{width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: 99;background: url("../img/fm-bg.jpg") no-repeat;background-size:100% 100%;}
.fm img:nth-child(1){width: 100%;bottom: 0; animation-duration:1s;animation-delay:0.1s;}
.fm img:nth-child(2){width: 100%;top: 0; animation-duration:1s;animation-delay:0.6s;}
.fm img:nth-child(3){width: 88%;margin: auto;left: 0;right: 0;top: 0;bottom: 0; animation-duration:1s;animation-delay:0.4s;}
.fm img:nth-child(6){width: 22%;left:20px;top:3%;animation-duration:1s;animation-delay:0.5s;}
.fmbtn{width:34%;left:50%;bottom:15%;margin-left:-17vw; animation-duration:1s;animation-delay:0.8s;}
.fm p{width: 100%; line-height:3vw;font-size:3vw;text-align:center;color: #fff;position: absolute;bottom: 5%;}
.fm .fmbt{width:88%;position: absolute;margin: auto;left: 0;right: 0;top: 0;bottom: 0;background: url("../img/fm-btbg.png") no-repeat center;background-size:100% auto;animation-duration:2s;}

.fmbt .wave{animation-delay:3s;bottom:-8%;left:50%;width:40px;height:40px;margin-left: -18px;}

.m-play{width:12%;position: absolute;top:3%;right:2%;animation:turn 2s linear infinite;z-index:1000;}
@keyframes turn{
  0%{-webkit-transform:rotate(0deg);}
  25%{-webkit-transform:rotate(90deg);}
  50%{-webkit-transform:rotate(180deg);}
  75%{-webkit-transform:rotate(270deg);}
  100%{-webkit-transform:rotate(360deg);}
}
.m-pause{display: none;width:12%;position: absolute;top:3%;right:2%;z-index:1000;}
.back{width:20%;height:10%;background-size: cover; position: absolute;left: 50%;margin-left: -14%; bottom:0;z-index: 99;outline: none;}
.back img{width:35%;position: absolute;right: 15%;bottom:20%;}

.swiper{width: 100%;height:100%;display: none;}
.parallax-bg-bb {position: absolute;left: 0;top: 0;width:1000%;height: 100%;background: url("../img/bb.jpg") repeat-x;background-size:auto 100%;}
.parallax-bg-zz {position: absolute;left: 0;top: 0;width:1000%;height: 100%;background: url("../img/zz.png") no-repeat;background-size:auto 100%;}
.parallax-bg-qq {position: absolute;left: 0;top: 0;width:1000%;height: 100%;background: url("../img/qq.png") repeat-x;background-size:auto 100%;}
.swiper-slide ul{margin-top:14.2vh;height:86vh;overflow: hidden; position: relative;}
.swiper-slide ul li{position: absolute;}
.swiper-slide ul li img{width: 100%;}
.swiper-slide ul li .wave{left:50%;margin-left: -10px;bottom:20%;}
.jf{width: 57%;height: 20%;background: url("../img/jfbb.png") no-repeat;z-index: 999;background-size:100% auto;top:10px;left:10px;box-sizing: border-box;padding-left: 40%;padding-top:3.7%; font-size:8.4vw;font-weight: bold;color:#FFDE26;}

.p01 ul li:nth-child(1){width:22%;top:-19vh;left:15%;}
.p01 ul li:nth-child(2){width:36%;top:-10vh;left:55%;}
.p02 ul li:nth-child(1){width:40%;top:-20vh;left:10%;}
.p02 ul li:nth-child(2){width:26%;top:-16vh;left:65%;}
.p03 ul li:nth-child(1){width:46%;top:-12vh;left:12%;}
.p03 ul li:nth-child(2){width:30%;top:-15vh;left:65%;}
.p04 ul li:nth-child(1){width:22%;top:-16vh;left:15%;}
.p04 ul li:nth-child(2){width:40%;top:-6vh;left:55%;}
.p05 ul li:nth-child(1){width:40%;top:-20vh;left:10%;}
.p05 ul li:nth-child(2){width:30%;top:-10vh;left:60%;}
.p06 ul li:nth-child(1){width:46%;top:-18vh;left:10%;}
.p06 ul li:nth-child(2){width:22%;top:-12vh;left:65%;}
.p07 ul li:nth-child(1){width:34%;top:-24vh;left:10%;}
.p07 ul li:nth-child(2){width:44%;top:-11vh;left:50%;}
.p08 ul li:nth-child(1){width:30%;top:-20vh;left:10%;}
.p08 ul li:nth-child(2){width:44%;top:-6vh;left:50%;}
.p09 ul li:nth-child(1){width:36%;top:-20vh;left:10%;}
.p09 ul li:nth-child(2){width:22%;top:-11vh;left:60%;}
.p10 ul li:nth-child(1){width:44%;top:-20vh;left:5%;}
.p10 ul li:nth-child(2){width:26%;top:-6vh;left:54%;}
.p11 ul li:nth-child(1){width:46%;top:-12vh;left:12%;}
.p11 ul li:nth-child(2){width:22%;top:-16vh;left:65%;}
.p12 ul li:nth-child(1){width:34%;top:-24vh;left:10%;}
.p12 ul li:nth-child(2){width:44%;top:-11vh;left:50%;}
.gx{width:100%;height: 100%;position: absolute;left: 0;top: 0;z-index:9999;display: none;background: rgba(0,0,0,0.5)}
.gx img{position: absolute; width: 80%;margin: auto;top: 0;bottom: 0;left: 0;right: 0;}
.yh{width:100%;height: 100%;position: absolute;left: 0;top: 0;z-index:9999;display: none;background: rgba(0,0,0,0.5)}
.yh img{position: absolute; width: 80%;margin: auto;top: 0;bottom: 0;left: 0;right: 0;}
.yh p{width:100%;height: 60px;font-size:60px;font-weight: bold;color: #fff;position: absolute;margin:auto;top:-240px;bottom: 0;left: 0;right: 0;text-align: center;z-index: 2;}
.mk{width: 100%;height: 100%;position: absolute;left: 0;top: 0; background:url("../img/mk.png") no-repeat center;background-size:80% auto;z-index:9999;display: none;}
.close{width:50px;height: 50px;position:fixed;top:3%;right:3%;z-index: 99;background: url("../img/close.png");background-size: cover;}
.mk div{width:60%;height: 60%;padding-top:80px; box-sizing: border-box;position: absolute;margin: auto;left: 0;top: 0;right: 0;bottom: 0;text-align: center;font-size:20px;color:#F1DFCA;}
.mk div span{font-size: 16px;color: #FFBF00;line-height:30px;padding-top: 20px;}
.mk div p{margin-bottom: 20px;}
.mk div ul li{height: 60px;line-height: 60px;font-size: 18px;}


.gzbtn{display: block;width:24%;position: absolute;right:7px;bottom:7px;z-index:999;}
.gz{width: 100%;height: 100%; background: url("../img/gz.png") no-repeat rgba(0,0,0,0.3) center;background-size:80% auto;top: 0;left: 0; z-index:9999;display: none;}
.gz div{position: absolute;width:60%;height:56%;margin: auto;left: 0;top: 0;right: 0;bottom: 0;font-size:3.4vw;line-height:4vh;color: #FFEFBF;}
.gz div p{font-size:6vw;color: #FFE599;text-align: center;line-height:8vh;}
.right,.wrong{width: 40%;position: absolute;margin: auto;left: 0;right: 0;top: 0;bottom: 0;z-index:9999;display: none;}
.back-fm{display: block; width:10%;right:2%;top: 45%;z-index: 99;display: none}


.kl{width: 100%;height: 100%;background: rgba(0,0,0,0.5);position: absolute;left: 0;top: 0;z-index: 99;display: none;}
.kl img{height: 80%;position: absolute;left: 0;top:-10%;right: 0;bottom: 0;margin: auto;display: none;}
.kl p{font-size:14px;color: #fff;text-align: center;position: absolute;width: 100%;bottom:2%;}
.kl a{display: block;width:30%;height: 10%;background: url("../img/b-btn.png") no-repeat center;background-size: 100% auto; position: absolute;bottom:4%;left: 50%;margin-left: -15vw;}

.animatecommon{animation-timing-function:liner;animation-iteration-count:infinite;animation-play-state:running;animation-direction:normal;-webkit-animation-duration:1s;-webkit-animation-timing-function:liner;-webkit-animation-iteration-count:infinite;-webkit-animation-play-state:running;-webkit-animation-direction:normal;}
.radiation{width:50%;height:50%;border-radius:50%;background:#FFC64B;position:absolute;top:50%;left:50%;margin-left:-25%;margin-top:-25%;z-index:2;animation-name:radiation;-webkit-animation-name:radiation;opacity: 0.5}
.target{width:100%;height:100%;border-radius:50%;background:#FFC64B;position:absolute;top:0;left:0;animation-name:location;-webkit-animation-name:location;opacity: 0.5}

@keyframes location {0%{transform:scale(1);-webkit-transform:scale(1);}100% {transform:scale(2);-webkit-transform:scale(2);filter:alpha(opacity=0);opacity:0;}}
@-webkit-keyframes location {0%{transform:scale(1);-webkit-transform:scale(1);}100%{transform:scale(2);-webkit-transform:scale(2);filter:alpha(opacity=0);opacity:0;}}
@keyframes radiation {0%{transform:scale(2);-webkit-transform:scale(2);filter:alpha(opacity=0); opacity: 0;background:#fff}100% {transform:scale(1);-webkit-transform:scale(1);filter:alpha(opacity=60); opacity:0.6;background: #fff}}
@-webkit-keyframes radiation {0%{transform:scale(2);-webkit-transform:scale(2);filter:alpha(opacity=0); opacity: 0;background:#fff}100% {transform:scale(1);-webkit-transform:scale(1);filter:alpha(opacity=60); opacity:0.6;background: #fff}}