@charset "UTF-8";
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

ul,
li {
  list-style: none;
}

a {
  text-decoration: none;
}

i {
  font-style: normal;
}


/*字体包CDN分离路径*/
@font-face{font-family:'PROJECTDTYPECURVE';src:url("../fonts/PROJECTDTYPECURVE-BOLD.TTF");}
@font-face{font-family:'ProjectDType';src:url("../fonts/ProjectDType-Medium.ttf");}

@font-face{font-family:'NotoSans-Medium';src:url("../fonts/NotoSans-Medium.ttf");}
@font-face{font-family:'NotoSans-Bold';src:url("../fonts/NotoSans-Bold.ttf");}

body, html {
  height: 100%;
  overflow: hidden;
  background: #000;
  -webkit-overflow-scrolling: touch;
  font-family: 'NotoSans-Medium';
}

body {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a:focus, input:focus, p:focus, div:focus {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

input, select {
  font-family: "NotoSans-Medium";
}

.lang-ar, .lang-ar input, .lang-ar select {
  direction: rtl;
}
.bold{
  font-family: "NotoSans-Bold";
}
.lang-en{
  font-family: "ProjectDType";
}
.lang-en .bold{
  font-family: "PROJECTDTYPECURVE";
}


body,
html {
  height: 100%;
  overflow: hidden;
  background: #000;
  -webkit-overflow-scrolling: touch;
}
.wrapper{
  width: 100%;
  height: 100%;
  position: relative;
}
.part1 {
  width: 100vw;
  height: 100vh;
  background: url(../images/bg1.jpg) center center no-repeat;
  background-size: cover;
  position: relative;
}
.cloud{
  width: 100vw;
  height: 4.59rem;
  overflow: hidden;
  position: absolute;
  top: .2rem;
  left: 0;
  background: url(../images/cloud.png) top left repeat;
  background-size: 21.54rem 4.59rem;
}
.content{
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top:0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: all .8s; 
}
.content.current{
  z-index: 2;
  opacity: 1;
}

.logo{
  display: block;
  width: 1.44rem;
  height: .76rem;
  background: url(../images/logo.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .3rem;
  left: .8rem;
  cursor: initial;
}
.slogan{
  display: block;
  width: 6.62rem;
  height: 1.32rem;
  background: url(../images/slogan_en.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: 1.08rem;
  left: 50%;
  margin-left: -3.11rem;
}
.lang-en .slogan{
  background: url(../images/slogan_en.png) top center no-repeat;
  background-size: 100%;
}
.lang-zh .slogan{
  background: url(../images/slogan_zh.png) top center no-repeat;
  background-size: 100%;
}
.lang-fr .slogan{
  background: url(../images/slogan_fr.png) top center no-repeat;
  background-size: 100%;
}
.lang-es .slogan{
  background: url(../images/slogan_es.png) top center no-repeat;
  background-size: 100%;
}
.lang-ru .slogan{
  background: url(../images/slogan_ru.png) top center no-repeat;
  background-size: 100%;
}
.lang-de .slogan{
  background: url(../images/slogan_de.png) top center no-repeat;
  background-size: 100%;
}
.lang-ar .slogan{
  background: url(../images/slogan_ar.png) top center no-repeat;
  background-size: 100%;
}
.lang-tw .slogan{
  background: url(../images/slogan_tw.png) top center no-repeat;
  background-size: 100%;
}
.lang-hk .slogan{
  background: url(../images/slogan_tw.png) top center no-repeat;
  background-size: 100%;
}
.lang-th .slogan{
  background: url(../images/slogan_en.png) top center no-repeat;
  background-size: 100%;
}
.lang-vi .slogan{
  background: url(../images/slogan_vi.png) top center no-repeat;
  background-size: 100%;
}
.lang-id .slogan{
  background: url(../images/slogan_id.png) top center no-repeat;
  background-size: 100%;
}
.lang-pt .slogan{
  background: url(../images/slogan_pt.png) top center no-repeat;
  background-size: 100%;
}
.lang-ko .slogan{
  background: url(../images/slogan_ko.png) top center no-repeat;
  background-size: 100%;
}
.lang-ja .slogan{
  background: url(../images/slogan_ja.png) top center no-repeat;
  background-size: 100%;
}
.lang-tr .slogan{
  background: url(../images/slogan_tr.png) top center no-repeat;
  background-size: 100%;
}
.lang-ms .slogan{
  background: url(../images/slogan_ms.png) top center no-repeat;
  background-size: 100%;
}

.time{
  width: 10rem;
  height: .32rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 2.5rem;
  left: 50%;
  margin-left: -5rem;
}
.time span{
  font-size: .24rem;
  color: #ffffff;
  font-weight: bold;
  text-shadow:0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000;
}
.time .rule{
  display: block;
  width: .31rem;
  height: .3rem;
  background: url(../images/rule.png) top center no-repeat;
  background-size: 100%;
  margin: 0 .1rem;
}
.plane{
  width: 6.1rem;
  height: 1.97rem;
  background: url(../images/npc.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: 3.35rem;
  left: 50%;
  margin-left: -3.95rem;
}
.btnlist{
  width: 100%;
  height: 2.03rem;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  bottom: .3rem;
}
.btnlist .btn-rank{
  display: block;
  width: 2.52rem;
  height: .87rem;
  background: url(../images/btn_rank.png) center center no-repeat;
  background-size: auto 100%;
  text-align: center;
  line-height: .86rem;
  font-size: .2rem;
  color: #fff;
  transition: all .4s;
}
.btnlist .btn-rank:hover{
  transform: scale(1.05);
}
.btnlist .btn-mission{
  display: block;
  width: 2.52rem;
  height: .87rem;
  background: url(../images/btn_mission.png) center center no-repeat;
  background-size: auto 100%;
  text-align: center;
  line-height: .86rem;
  font-size: .2rem;
  color: #000;
  transition: all .4s;
}
.btnlist .btn-mission:hover{
  transform: scale(1.05);
}
.btnlist .btn-start{
  display: block;
  width: 1.91rem;
  height: 2.03rem;
  background: url(../images/btn_start.png) top center no-repeat;
  background-size: 100%;
  margin: 0 .1rem;
  text-align: center;
  line-height: 2.03rem;
  font-size: .36rem;
  color: #000;
  transition: all .4s;
}
.btnlist .btn-start:hover{
  transform: scale(1.05);
}
.lang-fr .btnlist .btn-start{
  font-size: .32rem;
}
.lang-ja .btnlist .btn-start{
  font-size: .32rem;
}


/*.rewardstips{
  width: 100%;
  position: absolute;
  top: 7.1rem;
  text-align: center;
  line-height: .28rem;
  font-size: .26rem; 
  font-weight: bold;
  color: #fff;
  text-shadow:0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000,0 0 2px #000;
}*/

.chance{
  width: 1.87rem;
  height: .62rem;
  background: url(../images/icon4.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: 1.22rem;
  right: .4rem;
}
.chance span{
  display: block;
  width: .86rem;
  height: .34rem;
  line-height: .34rem;
  text-align: center;
  font-size: .22rem;
  color: #fff;
  font-weight: bold;
  position: absolute;
  top: .2rem;
  left: .5rem;
}
.chance a{
  display: block;
  width: .51rem;
  height: .51rem;
  position: absolute;
  right: 0;
  top: .07rem;
}
.miles{
  width: 2.11rem;
  height: .71rem;
  background: url(../images/icon5.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: 1.15rem;
  right: 2.6rem;
}
.miles span{
  display: block;
  width: 1.3rem;
  height: .34rem;
  line-height: .34rem;
  text-align: center;
  font-size: .22rem;
  color: #fff;
  font-weight: bold;
  position: absolute;
  top: .26rem;
  left: .58rem;
}
.rewards-box{
  width: 3.16rem;
  height: 4.6rem;
  background: url(../images/rewards_bg.png) top center no-repeat;
  background-size: 100%;
  /*overflow: hidden;*/
  position: absolute;
  top: 50%;
  left: .3rem;
  transform: translateY(-50%);
}
.rewards-box .rewardstitle{
  width: 100%;
  line-height: .26rem;
  margin-top: .18rem;
  text-align: center;
  font-size: .22rem;
  color: #0ff796;
  margin-top: .4rem;
}
.lang-de .rewards-box .rewardstitle{
  font-size: .18rem;
}
.rewards-box .flytimes{
  width: 100%;
  line-height: .26rem;
  margin-top: .05rem;
  text-align: center;
  font-size: .22rem;
  color: #0ff796;
}
.lang-de .rewards-box .flytimes{
  font-size: .2rem;
}
.rewardslist{
  width: 100%;
  /*overflow: hidden;*/
  position: relative;
  margin: .2rem auto 0;
}
.rewardslist .reward{
  width: 100%;
  height: .52rem;
  /*overflow: hidden;*/
  margin: 0 auto .5rem;
  position: relative;
}
.rewardslist .reward .counts{
  display: block;
  width: .8rem;
  height: .52rem;
  overflow: hidden; 
  position: absolute;
  top: 0;
  left: 0;
  text-align: right;
  line-height: .52rem;
  font-size: .18rem; 
  color: #c5dbdb;
}
.rewardslist .reward .prizebox{
  width: 1.8rem;
  height: .52rem;
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.lang-ar .rewardslist .reward .prizebox{
  justify-content: flex-end;
}
.rewardslist .reward .prizebox .prize{
  width: .52rem;
  /*overflow: hidden;*/
  margin: 0 .01rem;
  position: relative;
  cursor: pointer;
}
.prize-tips{
  width: 3.77rem;
  height: .98rem;
  background: url(../images/prize_tips.png) center center no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: -1rem;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
}
.prize-tips.on{
  display: flex;
}
.prize-tips p{
  text-align: center;
  font-size: .22rem;
  color: #c1d7d7;
  line-height: .3rem;
  padding: 0 .1rem;
}
.rewardslist .reward .prizebox img{
  display: block;
  width: 100%;
  height: auto;
}
.rewards-box .btn-collect{
  display: block;
  width: 1.8rem;
  height: .58rem;
  text-align: center;
  line-height: .58rem;
  font-size: .22rem;
  color: #0a201a;
  position: absolute;
  left: 50%;
  margin-left: -.9rem;
  bottom: .15rem;
  background: url(../images/btn_collect.png) top center no-repeat;
  background-size: 100%; 
  transition: all .4s;
}
.rewards-box .btn-collect:hover{
  transform: scale(1.05);
}
.rewards-box .btn-collected{
  display: block;
  width: 1.8rem;
  height: .58rem;
  text-align: center;
  line-height: .58rem;
  font-size: .22rem;
  color: #0a201a;
  margin: -.4rem auto 0;
  background: url(../images/btn_collected.png) top center no-repeat;
  background-size: 100%; 
}
.rewards-box .btn-go{
  display: block;
  width: 1.8rem;
  height: .58rem;
  text-align: center;
  line-height: .58rem;
  font-size: .22rem;
  color: #0a201a;
  margin: -.4rem auto 0;
  background: url(../images/btn_collected.png) top center no-repeat;
  background-size: 100%; 
}
.rewards-box a{
  position: relative;
}
.rewards-box a.red:after{
  display: block;
  content: "";
  width: .18rem;
  height: .18rem;
  box-sizing: border-box;
  border-radius: 50%;
  border: solid 1px #4d0202;
  background: #eb3528;
  position: absolute;
  top: -.02rem;
  right: -.02rem;
}

.progressbar{
  width: .27rem;
  height: 2.2rem;
  background: url(../images/bar.png) top center no-repeat;
  background-size: 100%;
  overflow: hidden;
  position: absolute;
  top: .23rem;
  left: .98rem;
}
.progressbar i{
  display: block;
  width: .27rem;
  height: 0;
  background: url(../images/bar1.png) top center no-repeat;
  background-size: 100% auto;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
}

.dialog{
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background: rgba(0,0,0,.8);
  display: none;
}
.pop{
  width: 12.62rem;
  height: 6.12rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%,-50%,0);
  -ms-transform: translate3d(-50%,-50%,0);
  -webkit-transform: translate3d(-50%,-50%,0);
  -o-transform: translate3d(-50%,-50%,0);
  -moz-transform: translate3d(-50%,-50%,0);
  background: url(../images/pop.png) top center no-repeat;
  background-size: 100%;
}
.pop .close{
  display: block;
  width: .8rem;
  height: .7rem;
  position: absolute;
  top: 0;
  right: .2rem;
}
.pop .poptitle{
  text-align: center;
}
.pop .poptitle span{
  font-size: .36rem;
  color: #0ff796;
  text-align: center;
  line-height: 1rem;
  position: relative;
  padding: 0 .8rem;
}
.pop .poptitle span:before{
  display: block;
  content: "";
  width: .22rem;
  height: .36rem;
  background: url(../images/icon12.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -.18rem;
}
.pop .poptitle span:after{
  display: block;
  content: "";
  width: .22rem;
  height: .36rem;
  background: url(../images/icon13.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -.18rem;
}
.pop1 .warn{
  width: 100%;
  text-align: center;
  font-size: .3rem;
  line-height: .4rem;
  color: #fff;
  padding: 0 .6rem;
  position: absolute;
  top: 48%;
  left: 50%;
  transform: translate3d(-50%,-50%,0);
  -ms-transform: translate3d(-50%,-50%,0);
  -webkit-transform: translate3d(-50%,-50%,0);
  -o-transform: translate3d(-50%,-50%,0);
  -moz-transform: translate3d(-50%,-50%,0);
}

.pop2 .prizebox{
  width: 92%;
  height: 2.6rem;
  overflow: hidden;
  margin: .6rem auto 0;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pop2 .prizebox div{
  width: 3.1rem;
  margin: 0 .1rem;
  overflow: hidden;
  height: 2.6rem;
  position: relative;
}
.pop2 .prizebox img{
  display: block;
  width: 1.5rem;
  height: auto;
  margin: 0 auto;
}
.pop2 .prizename{
  text-align: center;
  font-size: .22rem;
  color: #ffffff;
  line-height: .24rem;
  margin-top: .1rem;
}
.pop2 .btn-certain{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_certain.png) top center no-repeat;
  background-size: 100%;
  margin: .3rem auto 0;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
}

.pop3 .rule-box{
  width: 10.8rem;
  height: 4.1rem;
  overflow-x: hidden;
  overflow-y: auto;
  margin: 0.2rem auto 0;
}
.pop3 .rule-box p{
  font-size: .2rem;
  line-height: .3rem;
  color: #ffffff;
  padding-right: .1rem;
  margin-bottom: .2rem;
}


.pop4 .mission-list{
  width: 11rem;
  overflow-x: hidden;
  overflow-y: auto;
  height: 4.5rem;
  margin: .1rem auto 0;
}
.pop4 .mission-list li{
  width: 11rem;
  height: 1.16rem;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  border-bottom: solid 1px #3f515c;
}
.pop4 .mission-list li .mission-name{
  width: 6.3rem;
  height: auto;
}
.pop4 .mission-list li .mission-name p{
  font-size: .24rem;
  color: #fff;
  line-height: .28rem;
}
.pop4 .mission-list li .mission-name div{
  width: 6.3rem;
  display: flex;
  justify-content: left;
  align-items: center;
  margin-top: .1rem;
}
.pop4 .mission-list li .mission-name div i{
  display: block;
  width: .22rem;
  height: .29rem;
  background: url(../images/icon1.png) top center no-repeat;
  background-size: 100%; 
}
.pop4 .mission-list li .mission-name div span{
  font-size: .24rem;
  color: #0ff796;
  padding: 0 .05rem;
}
.pop4 .mission-list li .nums{
  display: block;
  width: 1.5rem;
  text-align: center;
  font-size: .3rem;
  color: #fff;
  padding: 0 .2rem;
}
.pop4 .mission-list li a{
  display: block;
  width: 1.8rem;
  height: .58rem;
  text-align: center;
  line-height: .58rem;
  font-size: .24rem;
  color: #0a201a;
  margin: 0 .3rem;
  position: relative;
}
.pop4 .mission-list li .btn-go{
  background: url(../images/btn_go.png) top center no-repeat;
  background-size: 100%; 
}
.pop4 .mission-list li .btn-collect{
  background: url(../images/btn_go.png) top center no-repeat;
  background-size: 100%; 
}
.pop4 .mission-list li .btn-collected{
  background: url(../images/btn_collected.png) top center no-repeat;
  background-size: 100%; 
}
.pop4 .mission-list li a.red:after{
  display: block;
  content: "";
  width: .18rem;
  height: .18rem;
  box-sizing: border-box;
  border-radius: 50%;
  border: solid 1px #4d0202;
  background: #eb3528;
  position: absolute;
  top: -.02rem;
  right: -.02rem;
}

.pop5{
  background: url(../images/pop1.png) top center no-repeat;
  background-size: 100%; 
}
.pop5 .ranktitle{
  width: 11rem;
  margin: .1rem auto 0;
  overflow: hidden;
}
.pop5 .ranktitle span{
  display: block;
  width: 25%;
  float: left;
  text-align: center;
  font-size: .18rem;
  color: #0ff796;
  line-height: .3rem;
}
.pop5 .ranklist{
  width: 11rem;
  height: 2.8rem;
  overflow-x: hidden;
  overflow-y: auto;
  margin: .1rem auto 0;
}
.pop5 .ranklist li{
  width: 100%;
  height: .7rem;
  overflow: hidden;
  position: relative;
  margin: 0 auto;
}
.pop5 .ranklist li .tab{
  width: 25%;
  height: 100%;
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.pop5 .ranklist li .tab1 span{
  display: block;
  width: .6rem;
  height: .42rem;
  background: url(../images/rank4.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .42rem;
  font-size: .24rem;
  color: #11181a;
}
.pop5 .ranklist li:nth-child(1) .tab1 span{
  width: .54rem;
  height: .41rem;
  background: url(../images/rank1.png) top center no-repeat;
  background-size: 100%;
  line-height: .5rem;
}
.pop5 .ranklist li:nth-child(2) .tab1 span{
  width: .54rem;
  height: .41rem;
  background: url(../images/rank2.png) top center no-repeat;
  background-size: 100%;
  line-height: .5rem;
}
.pop5 .ranklist li:nth-child(3) .tab1 span{
  width: .54rem;
  height: .41rem;
  background: url(../images/rank3.png) top center no-repeat;
  background-size: 100%;
  line-height: .5rem;
}
.pop5 .ranklist li .tab p{
  font-size: .18rem;
  line-height: .24rem;
  color: #fff;
  text-align: center;
  box-sizing: border-box;
  padding: 0 .1rem;
}
.pop5 .ranklist li .tab .prizebox{
  display: inline-block;
  width: .6rem;
  height: auto;
  margin: 0 .05rem;
  position: relative;
}
.pop5 .ranklist li .tab .prizebox img{
  display: block;
  width: 100%;
  height: auto;
}

.pop5 .myrank{
  width: 11rem;
  height: 1rem;
  overflow: hidden;
  margin: .2rem auto 0;
}
.pop5 .myrank .tab{
  width: 25%;
  height: 100%;
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.pop5 .myrank .tab span{
  text-align: center;
  line-height: .24rem;
  font-size: .18rem;
  color: #fff;
}
.pop5 .myrank .tab1{
  flex-direction: column;
}
.pop5 .myrank .tab1 span{
  font-size: .3rem;
  color: #0ff796;
  padding-top: .1rem;
}
.pop5 .myrank .tab p{
  font-size: .18rem;
  line-height: .24rem;
  color: #fff;
  text-align: center;
  box-sizing: border-box;
  padding: 0 .1rem;
}
.pop5 .myrank .prizebox{
  display: inline-block;
  width: .6rem;
  height: auto;
  margin: 0 .05rem;
  position: relative;
}
.pop5 .myrank .tab .prizebox img{
  display: block;
  width: 100%;
  height: auto;
}
#pop5 .tab4 a{
  display: block;
  width: 1.8rem;
  height: .58rem;
  text-align: center;
  line-height: .58rem;
  font-size: .24rem;
  color: #000;
}
#pop5 .tab4 a.btn-collect{
  background: url(../images/btn_collect.png) top center no-repeat;
  background-size: 100%;
}
#pop5 .tab4 a.btn-collected{
  background: url(../images/btn_collected.png) top center no-repeat;
  background-size: 100%;
}

#pop6 .ranktitle span{
  display: block;
  width: 20%;
}
#pop6 .ranklist li .tab{
  width: 20%;
  height: 100%;
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
#pop6 .tab a{
  display: block;
  width: 1.8rem;
  height: .58rem;
  text-align: center;
  line-height: .58rem;
  font-size: .24rem;
  color: #000;
}
#pop6 .tab a.btn-collect{
  background: url(../images/btn_collect.png) top center no-repeat;
  background-size: 100%;
}
#pop6 .tab a.btn-collected{
  background: url(../images/btn_collected.png) top center no-repeat;
  background-size: 100%;
}
#pop6 .myrank .tab{
  width: 20%;
  height: 100%;
  float: left;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.pop7 .tips{
  width: 100%;
  text-align: center;
  font-size: .3rem;
  line-height: .4rem;
  color: #fff;
  padding: 0 .6rem;
  margin-top: 1.5rem;
  margin-bottom: 1.2rem;
}
.pop7 .btn-certain{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_certain.png) top center no-repeat;
  background-size: 100%;
  margin: .6rem auto 0;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
}

.pop10 .tips{
  width: 100%;
  text-align: center;
  font-size: .3rem;
  line-height: .4rem;
  color: #fff;
  padding: 0 .6rem;
  margin-top: 1rem;
}
.pop10 .tips1{
  width: 100%;
  text-align: center;
  font-size: .3rem;
  line-height: .4rem;
  color: #0ff796;
  padding: 0 .6rem;
  margin-top: .2rem;
}
.pop10 .btn-certain{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_certain.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
  position: absolute;
  bottom: 1rem;
  left: 2.6rem;
}
.pop10 .btn-continue{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_continue.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
  position: absolute;
  bottom: 1rem;
  right: 2.6rem;
}
.pop11 .intro{
  width: 11rem;
  overflow: hidden;
  margin: .5rem auto 0;
}
.pop11 .intro p{
  width: 10.5rem;
  margin: 0 auto;
  font-size: .24rem;
  color: #ffffff;
  line-height: .4rem;
  margin-bottom: .2rem;
  position: relative;
}
.pop11 .intro p:after{
  display: block;
  content: "";
  width: .18rem;
  height: .18rem;
  background: url(../images/icon2.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .08rem;
  left: -.25rem;
}
.pop11 .gametips{
  width: 100%;
  font-size: .3rem;
  color: #0ff796;
  text-align: center;
  margin-top: .3rem;
}
.pop12{
  background: url(../images/pop2.png) top center no-repeat;
  background-size: 100%;
}
.pop12 .tips1{
  width: 100%;
  text-align: center;
  line-height: .4rem;
  font-size: .3rem;
  color: #fff;
  box-sizing: border-box;
  padding: 0 .6rem;
  margin-top: 1.5rem;
}
.pop12 .tips2{
  width: 4.55rem;
  height: .78rem;
  text-align: center;
  line-height: .78rem;
  font-size: .24rem;
  color: #f5d574;
  position: absolute;
  top: 2.7rem;
  left: 6.7rem;
}
.pop12 .tips3{
  width: 70%;
  font-size: .24rem;
  line-height: .4rem;
  color: #fff;
  position: absolute;
  top: 6.2rem;
  left: 15%;
  text-align: center;
}
.pop12 .btn-certain{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_certain.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
  position: absolute;
  bottom: 1rem;
  left: 2.6rem;
}
.pop12 .play-again{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_continue.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
  position: absolute;
  bottom: 1rem;
  right: 2.6rem;
}
.pop13{
  background: url(../images/pop2.png) top center no-repeat;
  background-size: 100%;
}
.pop13 .tips1{
  width: 100%;
  text-align: center;
  line-height: .4rem;
  font-size: .3rem;
  color: #fff;
  box-sizing: border-box;
  padding: 0 .6rem;
  margin-top: 1.5rem;
}
.pop13 .tips2{
  width: 4.55rem;
  height: .78rem;
  text-align: center;
  line-height: .78rem;
  font-size: .24rem;
  color: #f5d574;
  position: absolute;
  top: 2.7rem;
  left: 6.7rem;
}
.pop13 .btn-certain{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_certain.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
  position: absolute;
  bottom: 1rem;
  left: 2.6rem;
}
.pop13 .play-again{
  display: block;
  width: 2.99rem;
  height: .95rem;
  background: url(../images/btn_continue.png) top center no-repeat;
  background-size: 100%;
  text-align: center;
  line-height: .95rem;
  font-size: .3rem;
  color: #0a201a;
  position: absolute;
  bottom: 1rem;
  right: 2.6rem;
}
.pop14 .login-platform{
  width: 100%;
  height: 4rem;
  overflow: hidden;
  margin: .6rem auto 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.pop14 .login-platform .platform{
  width: 2.5rem;
  height: 100%;
  overflow: hidden;
  margin: 0 .25rem;
}
.pop14 .login-platform .platform a{
  display: block;
  width: 2.18rem;
  height: 2.15rem;
  overflow: hidden;
  margin: 0 auto;
}
.pop14 .login-platform .platform a img{
  display: block;
  width: 100%;
  height: auto;
}
.pop14 .login-platform .platform p{
  text-align: center;
  font-size: .24rem;
  color: #ffffff;
  line-height: .34rem;
  margin-top: .06rem;
}
.pop14 .login-platform .platform p span{
  color: #0ff796;
}

.back{
  display: block;
  width: .7rem;
  height: .58rem;
  background: url(../images/back.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .4rem;
  left: 1rem;
  z-index: 10;
}
.points{
  width: 2.11rem;
  height: .71rem;
  background: url(../images/icon5.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .4rem;
  right: .5rem;
  z-index: 10;
}
.points span{
  display: block;
  width: 1.3rem;
  height: .34rem;
  line-height: .34rem;
  text-align: center;
  font-size: .22rem;
  color: #fff;
  font-weight: bold;
  position: absolute;
  top: .26rem;
  left: .58rem;
}

.enemy-type1 {
  width: 165px; 
  height: 1000px;
  background: url(../images/pipe1.png) no-repeat;
  background-size: 100% auto;
  background-position: bottom center;
  position: absolute;
  top: 0;
  pointer-events: none;
}
.enemy-type2 {
  width: 165px; 
  height: 1000px;
  background: url(../images/pipe2.png) no-repeat;
  background-size: 100% auto;
  background-position: top center;
  position: absolute;
  bottom: 0;
  pointer-events: none;
}
.enemy-type3 {
  width: 201px; 
  height: 1000px;
  background: url(../images/pipe3.png) repeat;
  background-size: 100% auto;
  background-position: top center;
  position: absolute;
  bottom: 0;
  pointer-events: none;
}
.enemy-type4 {
  width: 201px; 
  height: 1000px;
  background: url(../images/pipe4.png) repeat;
  background-size: 100% auto;
  background-position: bottom center;
  position: absolute;
  top: 0;
  pointer-events: none;
}
.enemy-type5 {
  width: 130px; 
  height: 1000px;
  background: url(../images/pipe5.png) no-repeat;
  background-size: 100% auto;
  background-position: bottom center;
  position: absolute;
  top: 0;
  pointer-events: none;
}
.enemy-type6 {
  width: 130px; 
  height: 1000px;
  background: url(../images/pipe6.png) no-repeat;
  background-size: 100% auto;
  background-position: top center;
  position: absolute;
  bottom: 0;
  pointer-events: none;
}
.mclass .enemy-type1 {
  width: 1.65rem;
  height: 10rem;
}
.mclass .enemy-type2 {
  width: 1.65rem;
  height: 10rem;
}
.mclass .enemy-type3 {
  width: 2.01rem;
  height: 10rem;
}
.mclass .enemy-type4 {
  width: 2.01rem;
  height: 10rem;
}
.mclass .enemy-type5 {
  width: 1.3rem;
  height: 10rem;
}
.mclass .enemy-type6 {
  width: 1.3rem;
  height: 10rem;
}

.gameContent{
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top:0;
  left: 0;
  z-index: 1;
  opacity: 0;
  transition: all .8s; 
}
.gameContent.current{
  z-index: 2;
  opacity: 1;
}
/*.npc{
  width: 1.1rem;
  height: .75rem;
  background: url(../images/npc.png) center center no-repeat;
  background-size: 100%;
  position: absolute;
  top: 3.2rem;
  left: 50%;
  margin-left: -.6rem;
  z-index: 2;
}*/
.npc{
  width: 198px;
  height: 64px;
  background: url(../images/npc.png) center center no-repeat;
  background-size: 100%;
  position: absolute;
  top: 50%;
  left: 25%;
  z-index: 2;
  pointer-events: none;
}
.mclass .npc{
  width: 1.98rem;
  height: .64rem;
  /*left: 5rem;*/
}


.scrollbar::-webkit-scrollbar {
    width: .08rem;
    height: .2rem;
    background-color: rgba(0, 0, 0, 0);
}
.scrollbar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 20%);
    border-radius: .2rem;
    background-color: rgba(0, 0, 0, 0);
    border: none;
}
.scrollbar::-webkit-scrollbar-thumb {
    height: .2rem;
    border-radius: .12rem;
    -webkit-box-shadow: none;
    background-color: #bfdff3;
    box-shadow: none;
}

.language-box{
  width: 1.8rem;
  height: .4rem;
  background: url(../images/btn_get.png) top center no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: .55rem;
  right: .4rem;
  z-index: 19;
}
.language-box .select-language{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.8rem;
  height: .4rem;
}
.language-box .select-language i{
  display: block;
  width: .25rem;
  height: .25rem;
  background: url(../images/lang_drop.png) top center no-repeat;
  background-size: 100%;
  margin: 0 .05rem;
}
.language-box .select-language span{
  font-size: .14rem;
  color: #ffffff;
}
.language-box .language-choose-list{
  width: 1.8rem;
  height: 0;
  overflow: hidden;
  background: rgba(0,0,0,.95);
  position: absolute;
  top: .4rem;
  left: 0;
  transition: all .8s;
}
.language-box .language-choose-list.on{
  height: 6.8rem;
}
.language-box .language-choose-list ul li{
  width: 100%;
  height: .4rem;
  text-align: center;
  line-height: .4rem;
  font-size: .12rem;
  color: #a6a6a6;
  cursor: pointer;
}
.language-box .language-choose-list ul li.on{
  color: #fff;
}

.login {
  text-align: right;
  font-size: .24rem;
  position: absolute;
  right: 2.4rem;
  top: .55rem;
  color: #000000;
  line-height: .4rem;
}

.login a {
  color: #000000;
  text-decoration: underline;
}



.task-tel{
  display: none;
}
.task-vk{
  display: none;
}
.task-naver{
  display: none;
}

.lang-ru .task-x{
  display: none;
}
.lang-ru .task-discord{
  display: none;
}
.lang-ru .task-youtube{
  display: none;
}
.lang-ru .task-facebook{
  display: none;
}
.lang-ru .task-ins{
  display: none;
}
.lang-ru .task-tel{
  display: block;
}
.lang-ru .task-vk{
  display: block;
}


.lang-ko .task-discord{
  display: none;
}
.lang-ko .task-youtube{
  display: none;
}
.lang-ko .task-naver{
  display: block;
}

.lang-ja .task-facebook{
  display: none;
}
.lang-ja .task-ins{
  display: none;
}

/*m*/
.mclass .slogan{
  top: .58rem;
}
.mclass .time{
  top: 1.9rem;
}
.mclass .plane{
  top: 2.8rem;
}
.mclass .btnlist{
  bottom: 1.2rem;
}