@charset "UTF-8";

/* reset */
html,body,div,p,ul,li,dl,dt,dd,em,i,span,a,img,input,h1,h2,h3,h4,h5{margin:0;padding:0;}
a,img,input{border:none;}
body{-webkit-tap-highlight-color:rgba(0,0,0,0);}
a{text-decoration:none;}
ul,li{list-style:none;}
input{-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;background:none;outline:none;border:none;}
select{appearance:none;-moz-appearance:none;-webkit-appearance:none;border:none;outline:none;background:none;}
a,img{-webkit-touch-callout:none;}
em,i{list-style:none;font-style:normal;}
html,body{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-text-size-adjust:none!important;-webkit-text-size-adjust:100%!important;}

/* reset end */
html{font-size:50px;font-size:13.33333333vw;}
@media (max-width:1024px){
  html,body{max-width:1024px;}
}
.hide{position:absolute;width:0;height:0;overflow:hidden;opacity:0;visibility:hidden;font-size:0;color:transparent;text-indent:-9999em;}
.t-pc{display:none!important;}

/*字体包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");}
.m-br{display:block;}
.bold{font-family:"NotoSans-Bold";}
.en{font-family:"ProjectDType";}
.en .bold{font-family:"PROJECTDTYPECURVE";}
.ar,.ar input,.ar select{direction:rtl;}
@font-face{font-family:'SourceHanSansCN';src:url("../fonts/SourceHanSansCN.otf");}
.en .language li {
  font-family: SourceHanSansCN;
}
body{font-family:"NotoSans-Medium";}

.wrapper {
  width: 100%;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background-color: #101719;
}
#loading-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}
.loader {
  border: .16rem solid #e2e2e2;
  border-top: .16rem solid #0FE195;
  border-radius: 50%;
  width: 1.2rem;
  height: 1.2rem;
  animation: spin 2s linear infinite;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
#loading-overlay.hidden {
  display: none;
}
.part {
  width: 100%;
  position: relative;
}
.p1{
  height: 14.4rem;
  background:url(../images/m/bg1.jpg) 0/100% 100% no-repeat;
}
.p2{
  height: 9rem;
  background:url(../images/m/bg2.jpg) 0/100% 100% no-repeat;
}
.p3{
  height: 31rem;
  background:url(../images/m/bg3.jpg) 0/100% 100% no-repeat;
}
.p4{
/*  min-height: 29.36rem;*/
  background:url(../images/m/bg4.jpg) 0/100% 100% no-repeat;
  overflow: hidden;
}


/*p1*/
.nav{
  display: none;
}
.nav-m {
  width: auto;
  height: .56rem;
  float: right;
}
.nav_box{
  width: 7rem;
  height: .56rem;
  position: absolute;
  top: .28rem;
  left: .25rem;
}
.nav_box .logo {
  display: block;
  background: url(../images/m/logo.png) 0 0/100% 100% no-repeat;
  width: 1.05rem;
  height: .56rem;
  position: absolute;
  top: 0;
  left: 0;
}
.btn-slide{
  display: none;
  opacity: 0;
  pointer-events: none;
}
.btn-slide{
  width: 0.4rem;
  height: 0.3rem;
  position: fixed;
  left: 0.25rem;
  top: 0.4rem;
  z-index: 9;
}
.btn-slide .top_list_content {
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s;
}
.btn-slide .top_list_content i {
  display: block;
  position: relative;
  background: url(../images/m_row_icon.png) center center / 100% no-repeat;
  width: .08rem;
  height: .16rem;
  left: 2rem;
  top: -.34rem;
}
.ar .btn-slide .top_list_content i{
  left: -.2rem;
}
.btn-slide.on .top_list_content{
  opacity: 1;
  visibility: visible;
}
.top_list_content {
  position: absolute;
  top: 0.6rem;
  left: 0;
  width: auto;
  min-width: 1.87rem;
}
.top_list_content .top_list_tab_name {
  display: block;
  font-size: 0.16rem;
  width: 2.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.52rem;
  padding: 0 0.05rem;
  overflow: hidden;
  z-index: 99;
  background-color: rgb(22 32 39 / 40%);
  border: 0.01rem solid #7c7b7b;
  border-bottom: 0.01rem solid #e2e2e2;
  color: #e2e2e2;
  line-height: .26rem;
}
.fr .top_list_content .top_list_tab_name,
.ru .top_list_content .top_list_tab_name{
  line-height: .18rem;
  text-align: center;
}
.top_list_content .top_list {
  opacity: 0;
  visibility: hidden;
  width: 100%;
  position: absolute;
  top: 0;
  left: 2.28rem;
  transition: all 0.5s;
}
.ar .top_list_content .top_list{
  left: 2rem;
}
.top_list_content.on .top_list{
  opacity: 1;
  visibility: visible;
}
.top_list_content .top_list a {
  position: relative;
  font-size: 0.16rem;
  width: 1.87rem;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.52rem;
  padding: 0 0.05rem;
  overflow: hidden;
  z-index: 99;
  background-color: rgb(22 32 39 / 40%);
  border: 0.01rem solid #7c7b7b;
  border-bottom: 0.01rem solid #e2e2e2;
  color: #e2e2e2;
  margin-bottom: .1rem;
  opacity: 0 !important;
  visibility: hidden !important;
}
.top_list_content.on .top_list a{
  opacity: 1 !important;
  visibility: visible !important;
}
.top_list_content.on .top_list a span{
  text-align: center;
  font-size: .14rem;
  line-height: .18rem;
}
.btn-slide a{
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s;
}
.btn-slide.on a{
  opacity: 1;
  visibility: visible;
}
.draw:before {content: "";top: -0.12rem;}
.draw:after {content: "";top: 0.12rem;}
.draw {top: 50%;margin-top: -1px;left: 0.44rem;}
.draw, .draw:before, .draw:after {width: 0.48rem;height: 0.04rem;background: #e2e2e2;position: absolute;left: 0;transition: all .5s;transform-style: preserve-3d;-webkit-backface-visibility: hidden;}
.on .draw:before {top: 0;transform: rotate(45deg);background: #e2e2e2;}
.on .draw:after {top: 0;transform: rotate(-45deg);background: #e2e2e2;}
.on .draw {background: transparent;}
.service ,.center,.security,.access,.twitch{
  position: absolute;
  top: 0.6rem;
  left: 0;
  font-size: 0.16rem;
  width: 2.2rem;
  /* min-width: 1.87rem; */
  display: flex;
  justify-content: center;
  align-items: center;
  height: 0.52rem;
  padding: 0 0.05rem;
  overflow: hidden;
  z-index: 99;
  background-color: rgb(22 32 39 / 40%);
  border: 0.01rem solid #7c7b7b;
  border-bottom: 0.01rem solid #e2e2e2;
  color: #e2e2e2;
}
.service:hover,.center:hover,.security:hover,.access:hover{
  background-color: rgb(75 83 88 / 80%);
  border-bottom: 0.01rem solid #0ff89b;
}
.service span,.center span,.security span,.access span{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  line-height: 0.24rem;
}
.service i{
  background: url(../images/service_icon.png) no-repeat center/100%;
  width: 0.3rem;
  height: 0.3rem;
  margin-left: 0.1rem;
}
.service::after,.center::after,.security::after,.access::after{
  display: none;
}
.center{
  top: 1.9rem;
}
.security{
  top: 1.25rem;
}
.access{
  top: 2.55rem;
}
.twitch{
  top: 3.2rem;
}
.language {
  position: relative;
  height: .56rem;
  float: right;
}
.language.pc{
  display: none;
}
.language:before {
  content: "";
  position: absolute;
  width: .41rem;
  height: .42rem;
  top: 50%;
  margin-top: -.21rem;
  left: .18rem;
  background: url(../images/lang_icon.png) center center / 100% 100% no-repeat;
}
.language:after {
  content: "";
  position: absolute;
  width: .22rem;
  height: .17rem;
  top: 50%;
  margin-top: -.085rem;
  right: 0;
  opacity: 1;
  background: url(../images/m/row_icon.png) center center / 100% 100% no-repeat;
}
.language p {
  height: .56rem;
  line-height: .56rem;
  color: #e5e5e5;
  font-size: .18rem;
  padding: 0 .3rem 0 .66rem;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.language_list {
  position: absolute;
  right: 0;
  width: 1.92rem;
  border: 1px rgba(255, 255, 255, .6) solid;
  border-bottom: none;
  max-height: 0;
  transition: max-height .5s, opacity .5s;
  pointer-events: none;
  opacity: 0;
  overflow: hidden;
}
.ar .language_list {
  right: unset;
  left: -.5rem;
}
.language.on .language_list {
  max-height: 10rem;
  pointer-events: all;
  opacity: 1;
}
.language_list li {
  width: 100%;
  height: .38rem;
  font-size: .2rem;
  color: #a6a6a6;
  line-height: .38rem;
  text-align: center;
  border-bottom: 1px rgba(255, 255, 255, .6) solid;
  background-color: rgba(16, 16, 16, .77);
}
.language_list li.on {
  background-color: rgba(127, 135, 135, .6);
  color: #0ff796;
}
.ar .language_list li{
  direction: ltr;
}
.ar .language_list li:nth-child(6){
  direction: rtl;
}

.logo{
  display: block;
  width: 2.97rem;
  height: .64rem;
  background:url(../images/logo.png) 0/100% 100% no-repeat;
  position: absolute;
  top: .26rem;
  left: .34rem;
}
.login-box {
  width: 3.6rem;
  height: .56rem;
  justify-content: flex-end;
  display: -webkit-box;
  display: -ms-flexbox;
  align-items: center;
  display: flex;
  float: right;
  position: relative;
  margin: 0 .24rem 0 0;
}
.ar .login-box{
  justify-content: flex-start;
}
.btn-login {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 0.28rem;
  line-height: 0.28rem;
  font-size: 0.22rem;
  color: #e2e2e2;
  position: relative;
}
.login-box:before{
  display: block;
  content: "";
  width: .02rem;
  height: .32rem;
  background: rgba(255, 255, 255, 0.3);
  position: absolute;
  right: -.24rem;
  top: 50%;
  margin-top: -.16rem;
}
.btn-login:after {
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  background: #e2e2e2;
  position: absolute;
  left: 0;
  bottom: 0;
}
.login-content {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 0.3rem;
  font-size: 0.22rem;
  text-align: right;
}
.btn-adress {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 0.3rem;
  font-size: 0.22rem;
  color: #0ff796;
  text-decoration: underline;
  margin-left: 0.05rem;
}
.txt-nickname {
  display: inline-block;
  color: #ebebeb;
}
.btn-logout {
  display: inline-block;
  text-decoration: underline;
  color: #0ff796;
  margin-left: 0.05rem;
}
.p1_video{
  display: block;
  width: 6.55rem;
  height: 1.71rem;
  background: url(../images/p1_video1.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 7.02rem;
  left: 50%;
  margin-left: -3.275rem;
}
.btn_play{
  display: block;
  width: 1.1rem;
  height: 1.1rem;
  background: url(../images/p1_video2.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: .3rem;
  left: 50%;
  margin-left: -.55rem;
}
.slogan{
  display: block;
  width: 100%;
  height: 1.2rem;
  background:url(../images/m/slogan_en.png) center 0/6.9rem 1.2rem no-repeat;
  position: absolute;
  top: 7.96rem;
  left: 0;
}
.zh-tw .slogan{background:url(../images/m/slogan_tw.png) center 0/6.9rem 1.2rem no-repeat;}
.zh-hk .slogan{background:url(../images/m/slogan_hk.png) center 0/6.9rem 1.2rem no-repeat;}
.en .slogan{background:url(../images/m/slogan_en.png) center 0/6.9rem 1.2rem no-repeat;}
.fr .slogan{background:url(../images/m/slogan_fr.png) center 0/6.9rem 1.2rem no-repeat;}
.es .slogan{background:url(../images/m/slogan_es.png) center 0/6.9rem 1.2rem no-repeat;}
.es-latam .slogan{background:url(../images/m/slogan_es-latam.png) center 0/6.9rem 1.2rem no-repeat;}
.ru .slogan{background:url(../images/m/slogan_ru.png) center 0/6.9rem 1.2rem no-repeat;}
.de .slogan{background:url(../images/m/slogan_de.png) center 0/6.9rem 1.2rem no-repeat;}
.ar .slogan{background:url(../images/m/slogan_ar.png) center 0/6.9rem 1.2rem no-repeat;}
.th .slogan{background:url(../images/m/slogan_th.png) center 0/6.9rem 1.2rem no-repeat;}
.vi .slogan{background:url(../images/m/slogan_vi.png) center 0/6.9rem 1.2rem no-repeat;}
.id .slogan{background:url(../images/m/slogan_id.png) center 0/6.9rem 1.2rem no-repeat;}
.pt .slogan{background:url(../images/m/slogan_pt.png) center 0/6.9rem 1.2rem no-repeat;}
.pt-br .slogan{background:url(../images/m/slogan_pt-br.png) center 0/6.9rem 1.2rem no-repeat;}
.ko .slogan{background:url(../images/m/slogan_ko.png) center 0/6.9rem 1.2rem no-repeat;}
.ja .slogan{background:url(../images/m/slogan_ja.png) center 0/6.9rem 1.2rem no-repeat;}
.tr .slogan{background:url(../images/m/slogan_tr.png) center 0/6.9rem 1.2rem no-repeat;}
.ms .slogan{background:url(../images/m/slogan_ms.png) center 0/6.9rem 1.2rem no-repeat;}
.zh .slogan{background:url(../images/m/slogan_zh.png) center 0/6.9rem 1.2rem no-repeat;}
.p1_botton{
  display: block;
  width: 100%;
  height: .77rem;
  position: absolute;
  top: 9.8rem;
  left: 0;
  text-align: center;
  font-size: 0;
}
.p1_botton a{
  display: inline-block;
  width: 3.36rem;
  height: .66rem;
  line-height: .66rem;
  background: url(../images/p1_botton.png) 0 0/100% 100% no-repeat;
  font-size: .22rem;
  color: #000;
  margin: 0 .1rem;
}
.p1_tips{
  display: block;
  width: 6.8rem;
  position: absolute;
  top: 11rem;
  left: .35rem;
  font-size: .24rem;
  line-height: .4rem;
  color: #f1f1f1;
  opacity: .6;
  text-align: center;
}

/*p2*/
.p2_title:after,
.p3_title:after{
  display: block;
  content: '';
  width: .02rem;
  height: .68rem;
  background: url(../images/m/icon.png) 0/100% 100% no-repeat;
  position: absolute;
  top: -.68rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.p4_title:after{
  display: block;
  content: '';
  width: .02rem;
  height: .68rem;
  background: url(../images/m/icon.png) 0/100% 100% no-repeat;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.p2_title{
  display: block;
  width: 100%;
  height: 2.1rem;
  background: url(../images/m/p2_title_en.png)  center 0/6.9rem 2.1rem no-repeat;
  position: absolute;
  top: -.3rem;
  left: 0;
}
.zh-tw .p2_title{background:url(../images/m/p2_title_tw.png) center 0/6.9rem 2.1rem no-repeat;}
.zh-hk .p2_title{background:url(../images/m/p2_title_hk.png) center 0/6.9rem 2.1rem no-repeat;}
.en .p2_title{background:url(../images/m/p2_title_en.png) center 0/6.9rem 2.1rem no-repeat;}
.fr .p2_title{background:url(../images/m/p2_title_fr.png) center 0/6.9rem 2.1rem no-repeat;}
.es .p2_title{background:url(../images/m/p2_title_es.png) center 0/6.9rem 2.1rem no-repeat;}
.es-latam .p2_title{background:url(../images/m/p2_title_es-latam.png) center 0/6.9rem 2.1rem no-repeat;}
.ru .p2_title{background:url(../images/m/p2_title_ru.png) center 0/6.9rem 2.1rem no-repeat;}
.de .p2_title{background:url(../images/m/p2_title_de.png) center 0/6.9rem 2.1rem no-repeat;}
.ar .p2_title{background:url(../images/m/p2_title_ar.png) center 0/6.9rem 2.1rem no-repeat;}
.th .p2_title{background:url(../images/m/p2_title_th.png) center 0/6.9rem 2.1rem no-repeat;}
.vi .p2_title{background:url(../images/m/p2_title_vi.png) center 0/6.9rem 2.1rem no-repeat;}
.id .p2_title{background:url(../images/m/p2_title_id.png) center 0/6.9rem 2.1rem no-repeat;}
.pt .p2_title{background:url(../images/m/p2_title_pt.png) center 0/6.9rem 2.1rem no-repeat;}
.pt-br .p2_title{background:url(../images/m/p2_title_pt-br.png) center 0/6.9rem 2.1rem no-repeat;}
.ko .p2_title{background:url(../images/m/p2_title_ko.png) center 0/6.9rem 2.1rem no-repeat;}
.ja .p2_title{background:url(../images/m/p2_title_ja.png) center 0/6.9rem 2.1rem no-repeat;}
.tr .p2_title{background:url(../images/m/p2_title_tr.png) center 0/6.9rem 2.1rem no-repeat;}
.ms .p2_title{background:url(../images/m/p2_title_ms.png) center 0/6.9rem 2.1rem no-repeat;}
.zh .p2_title{background:url(../images/m/p2_title_zh.png) center 0/6.9rem 2.1rem no-repeat;}
.p2_confirm{
  display: block;
  width: 4.09rem;
  height: .79rem;
  background: url(../images/p2_confirm.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 7.4rem;
  left: 50%;
  margin-left: -2.05rem;
  color: #d8c17d;
  font-size: .26rem;
  text-align: center;
  line-height: .8rem;
}
.p2_confirm.out{
  background: url(../images/p2_confirm1.png) 0 0/100% 100% no-repeat;
  color: #afada6;
  pointer-events: none;
}
.p2_record{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.27rem;
  height: .44rem;
  background: url(../images/p2_record.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 2.32rem;
  left: .36rem;
  color: #e5e5e5;
  font-size: .16rem;
  text-align: center;
  line-height: 1;
  box-sizing: border-box;
  padding: 0 .1rem;
}
/*.p2_record:after{
  display: block;
  content: '';
  width: .08rem;
  height: .16rem;
  background: url(../images/m_row_icon.png) 0 0/100% 100% no-repeat;
  margin: 0 .1rem;
}*/
.p2_draws{
  display: block;
  width: 90%;
  font-size: .2rem;
  color: #c0c0c0;
  line-height: .2rem;
  text-align: center;
  position: absolute;
  top: 8.4rem;
  left: 5%;
}
.p2_draws span{
  color: #baa66b;
}
.p2_tips{
  display: block;
  width: 96%;
  font-size: .18rem;
  color: #c0c0c0;
  line-height: .2rem;
  text-align: center;
  position: absolute;
  top: 8.7rem;
  left: 2%;
}
.p2_tips span{
  color: #baa66b;
}
.p2_list{
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
  justify-content: space-around;
  width: 94%;
  height: 3.86rem;
  position: absolute;
  top: 2.9rem;
  left: 3%;
}
.p2_list li{
  display: block;
  width: 2.04rem;
  height: 1.75rem;
  background: url(../images/m/p2_list.png) 0 0/100% 100% no-repeat;
  position: relative;
}
.p2_list li img{
  display: block;
  width: 100%;
  margin-top: 10%;
}
.p2_list li p{
  display: flex;
  width: 2.02rem;
  height: .38rem;
  position: absolute;
  bottom: .03rem;
  left: .03rem;
  font-size: .14rem;
  line-height: .18rem;
  color: #e2e2e2;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.fr .p2_list li p,
.ru .p2_list li p,
.de .p2_list li p,
.pt .p2_list li p,
.pt-br .p2_list li p{
  width: 2.02rem;
  left: .03rem;
  font-size: .12rem;
  line-height: .14rem;
}

/*p3*/
.p3_title{
  display: block;
  width: 100%;
  height: 2.1rem;
  background: url(../images/m/p3_title_en.png)  center 0/6.9rem 2.1rem no-repeat;
  position: absolute;
  top: 1rem;
  left: 0;
}
.zh-tw .p3_title{background:url(../images/m/p3_title_tw.png) center 0/6.9rem 2.1rem no-repeat;}
.zh-hk .p3_title{background:url(../images/m/p3_title_hk.png) center 0/6.9rem 2.1rem no-repeat;}
.en .p3_title{background:url(../images/m/p3_title_en.png) center 0/6.9rem 2.1rem no-repeat;}
.fr .p3_title{background:url(../images/m/p3_title_fr.png) center 0/6.9rem 2.1rem no-repeat;}
.es .p3_title{background:url(../images/m/p3_title_es.png) center 0/6.9rem 2.1rem no-repeat;}
.es-latam .p3_title{background:url(../images/m/p3_title_es-latam.png) center 0/6.9rem 2.1rem no-repeat;}
.ru .p3_title{background:url(../images/m/p3_title_ru.png) center 0/6.9rem 2.1rem no-repeat;}
.de .p3_title{background:url(../images/m/p3_title_de.png) center 0/6.9rem 2.1rem no-repeat;}
.ar .p3_title{background:url(../images/m/p3_title_ar.png) center 0/6.9rem 2.1rem no-repeat;}
.th .p3_title{background:url(../images/m/p3_title_th.png) center 0/6.9rem 2.1rem no-repeat;}
.vi .p3_title{background:url(../images/m/p3_title_vi.png) center 0/6.9rem 2.1rem no-repeat;}
.id .p3_title{background:url(../images/m/p3_title_id.png) center 0/6.9rem 2.1rem no-repeat;}
.pt .p3_title{background:url(../images/m/p3_title_pt.png) center 0/6.9rem 2.1rem no-repeat;}
.pt-br .p3_title{background:url(../images/m/p3_title_pt-br.png) center 0/6.9rem 2.1rem no-repeat;}
.ko .p3_title{background:url(../images/m/p3_title_ko.png) center 0/6.9rem 2.1rem no-repeat;}
.ja .p3_title{background:url(../images/m/p3_title_ja.png) center 0/6.9rem 2.1rem no-repeat;}
.tr .p3_title{background:url(../images/m/p3_title_tr.png) center 0/6.9rem 2.1rem no-repeat;}
.ms .p3_title{background:url(../images/m/p3_title_ms.png) center 0/6.9rem 2.1rem no-repeat;}
.zh .p3_title{background:url(../images/m/p3_title_zh.png) center 0/6.9rem 2.1rem no-repeat;}
.p3_team{
  display: block;
  min-width: 4.5rem;
  max-width: 100%;
  height: .56rem;
  background: url(../images/p3_team.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 2.64rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  word-break: break-word;
  padding: 0 .2rem;
  font-size: .3rem;
  line-height: .56rem;
  color: #e2e2e2;
  text-align: center;
}
.p3_select{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: auto;
  min-width: 1.68rem;
  height: .45rem;
  background: url(../images/p3_select.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 3.52rem;
  right: .24rem;
  font-size: .18rem;
  line-height: .45rem;
  color: #e2e2e2;
  box-sizing: border-box;
  padding: 0 .46rem 0 .1rem;
  cursor: pointer;
}
.ar .p3_select{
  padding: 0 .1rem 0 .46rem;
}
.p3_select span:nth-child(2){
  margin-left: .1rem;
}
.ar .p3_select span:nth-child(2){
  margin-left: 0;
  margin-right: .1rem;
}
.p3_select.act{
  background: url(../images/p3_select.png) 0 0/100% 100% no-repeat;
}
.p3_select.act:after{
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  top: 48%;
}
.p3_select:after{
  display: block;
  content: '';
  width: .25rem;
  height: .18rem;
  background: url(../images/lang_drop2.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 52%;
  right: .06rem;
  margin-top: -.09rem;
}
.ar .p3_select:after{
  left: .06rem;
  right: initial;
}
.p3_ul{
  display: block;
  width: 1.68rem;
  height: 0;
  background: #000;
  position: absolute;
  overflow: hidden;
  top: 4rem;
  right: .24rem;
  transition: all .8s;
  z-index: 3;
}
.p3_ul.act{
  height: .9rem;
}
.p3_ul li{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: .45rem;
  text-align: center;
  line-height: .2rem;
  font-size: .16rem;
  color: #a6a6a6;
  cursor: pointer;
  font-family: "NotoSans-Medium";
  position: relative;
  box-sizing: border-box;
  padding-left: .2rem;
}
.ar .p3_ul li{
  padding-right: initial;
  padding-left: .2rem;
}
.p3_ul li:after{
  display: block;
  content: '<';
  width: .2rem;
  line-height: .45rem;
  position: absolute;
  top: 0;
  left: 0;
}
.ar .p3_ul li:after{
  right: initial;
  left: 0;
  content: '>';
}
.p3_opt0{
  display: block;
  width: 1.68rem;
  height: 0;
  background: #000;
  position: absolute;
  overflow: hidden;
  top: 4rem;
  right: 1.92rem;
  opacity: 0;
  -webkit-transition: all .8s;
  transition: all .8s;
  z-index: 3;
}
.p3_opt0.act{
  opacity: 1;
  height: 2.25rem;
}
.p3_opt0 li{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: .45rem;
  text-align: center;
  line-height: .2rem;
  font-size: .16rem;
  color: #a6a6a6;
  cursor: pointer;
  font-family: "NotoSans-Medium";
}
.p3_opt1{
  display: block;
  width: 1.68rem;
  height: 0;
  background: #000;
  position: absolute;
  overflow: hidden;
  top: 4rem;
  right: 1.92rem;
  opacity: 0;
  -webkit-transition: all .8s;
  transition: all .8s;
  z-index: 3;
}
.p3_opt1.act{
  opacity: 1;
  height: 2.25rem;
}
.p3_opt1 li{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: .45rem;
  text-align: center;
  line-height: .2rem;
  font-size: .16rem;
  color: #a6a6a6;
  cursor: pointer;
  font-family: "NotoSans-Medium";
}
.p3_list{
  display: none;
  width: 100%;
  height: 8.5rem;
  text-align: center;
  font-size: 0;
  position: absolute;
  top: 4.3rem;
  left: 0;
}
.p3_list.act{
  display: block;
}
.p3_list li{
  display: inline-block;
  width: 2.26rem;
  height: 4.25rem;
  background: url(../images/m/p3_list.png) 0 0/2.26rem 3.45rem no-repeat;
  margin: 0 .07rem .2rem;
  position: relative;
}
.p3_list li .p3_img{
  display: block;
  width: 100%;
  height: 2.22rem;
  overflow: hidden;
}
.p3_list li img{
  display: block;
  width: 150%;
  margin: 15% 0 0 -25%;
}
.ar .p3_list li img{
  margin: 12% -25% 0 0;
}
.p3_list li .p3_name{
  display: block;
  width: 2.22rem;
  height: 1.14rem;
  margin: 0 auto;
  font-size: .22rem;
  line-height: .26rem;
  color: #e2e2e2;
  text-align: center;
  position: relative;
}
.p3_list li .p3_name p{
  display: block;
  width: 96%;
  position: absolute;
  top: 50%;
  left: 2%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.p3_list li .p3_name p span{
  color: #11d485;
  margin: 0 .05rem;
}
.p3_list li a{
  display: block;
  width: 2.22rem;
  height: .44rem;
  background: url(../images/p3_receive1.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 3.6rem;
  left: .02rem;
  font-size: .2rem;
  color: #e2e2e2;
  text-align: center;
  line-height: .44rem;
  pointer-events: none;
}
.p3_list li a.act{
  background: url(../images/p3_receive2.png) 0 0/100% 100% no-repeat;
  color: #d8c17d;
  pointer-events: auto;
}
.p3_list li a.end{
  color: rgba(255, 255, 255, .6);
}
.p3_reward.act{
  display: block;
}
.p3_reward{
  display: none;
  width: 7.5rem;
  height: 4.62rem;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 0.54rem;
  outline: none;
  border: none;
  position: absolute;
  top: -3.42rem;
  left: 50%;
  margin-left: -3.75rem;
  background: url("../images/pop.png") 0 0/100% 100% no-repeat;
  z-index: 2;
}
.p3_list1 .p3_reward{
  height: 6rem;
  top: -4.8rem;
  background: url("../images/m_pop2.png") 0 0/100% 100% no-repeat;
}
.p3_reward:after{
  display: block;
  content: '';
  position: absolute;
  top: -0.5rem;
  right: .2rem;
  width: 0.58rem;
  height: 0.58rem;
  background: url("../images/close.png") 0 0/100% 100% no-repeat;
}
.p3_list li:nth-child(1) .p3_reward{
  left: -.22rem;
  margin-left: 0;
}
.ar .p3_list li:nth-child(1) .p3_reward{
  left: -5.02rem;
}
.p3_list li:nth-child(3) .p3_reward{
  left: -5.02rem;
  margin-left: 0;
}
.ar .p3_list li:nth-child(3) .p3_reward{
  left: -.22rem;
}
.p3_list li:nth-child(4) .p3_reward{
  left: -1.42rem;
  margin-left: 0;
}
.ar .p3_list li:nth-child(4) .p3_reward{
  left: -3.82rem;
}
.p3_list li:nth-child(5) .p3_reward{
  left: -3.82rem;
  margin-left: 0;
}
.ar .p3_list li:nth-child(5) .p3_reward{
  left: -1.42rem;
}
.p3_reward a{
  cursor: pointer;
  position: absolute;
  top: -0.5rem;
  right: .2rem;
  width: 0.58rem;
  height: 0.58rem;
  background: url("../images/close.png") 0 0/100% 100% no-repeat;
}
.p3_reward ul{
  display: block;
  width: 100%;
  height: 1.76rem;
  font-size: 0;
  text-align: center;
}
.p3_reward ul li{
  display: inline-block;
  width: 2.09rem;
  height: 1.76rem;
  background: url("../images/pop_reward.png") 0 0/100% 100% no-repeat;
  margin: 0 .1rem .1rem;
  overflow: hidden;
  position: relative;
}
.p3_reward ul li p{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 2.02rem;
  height: .42rem;
  position: absolute;
  top: 1.31rem;
  left: .03rem;
  font-size: .12rem;
  line-height: .14rem;
  color: #e2e2e2;
}
.p3_reward ul li img{
  display: block;
  width: 130%;
  margin: 2% 0 0 -15%;
}
.ar .p3_reward ul li img{
  margin: 2% -15% 0 0;
}
.ms .p3_reward ul li p{
  font-size: .14rem;
  line-height: .18rem;
  width: 2rem;
  left: .04rem;
}
.p3_list li .p3_reward_text{
  display: flex;
  width: 5.4rem;
  height: 1.38rem;
  margin: .1rem auto 0;
  font-size: .36rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
  position: relative;
  bottom: 0;
  left: 0;
}
.p3_tips{
  display: block;
  width: 7.1rem;
  position: absolute;
  top: 13.34rem;
  left: .2rem;
  font-size: .22rem;
  line-height: .22rem;
  color: #e2e2e2;
  text-align: center;
}
.p3_have{
  display: block;
  width: 6.2rem;
  position: absolute;
  top: 15.1rem;
  left: .65rem;
  font-size: .32rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
}
.p3_have span{
  color: #0ff796;
}
.p3_entrance{
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  line-height: 0.3rem;
  font-size: 0.18rem;
  color: #e2e2e2;
  position: absolute;
  bottom: .4rem;
  right: .26rem;
}
.p3_entrance:after {
  display: block;
  content: "";
  width: 100%;
  height: 2px;
  background: #e2e2e2;
  position: absolute;
  left: 0;
  bottom: 0;
}
.p3_time{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-content: center;
  width: 7.1rem;
  height: 1.1rem;
  position: absolute;
  top: 16.3rem;
  left: .2rem;
  font-size: .2rem;
  line-height: .34rem;
  color: #e2e2e2;
}
.p3_time p{
  display: flex;
  width: 100%;
  justify-content: center;
  text-align: center;
}
.p3_time p:nth-child(1){
  margin-bottom: .1rem;
}
.p3_tab{
  display: block;
  width: 6.9rem;
  height: .86rem;
  position: absolute;
  top: 17.7rem;
  left: 50%;
  margin-left: -3.45rem;
}
.p3_tab a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 33.33%;
  height: .86rem;
  background: url(../images/p3_tab1.png) 0 0/100% 100% no-repeat;
  float: left;
  color: #616568;
  text-align: center;
  line-height: .22rem;
  font-size: .2rem;
  box-sizing: border-box;
  padding: 0 1%;
}
.p3_tab a.act{
  background: url(../images/p3_tab2.png) 0 0/100% 100% no-repeat;
  color: #fefefe;
}
.p3_page{
  display: block;
  width: 6.9rem;
  height: .74rem;
  position: absolute;
  top: 18.56rem;
  left: 50%;
  margin-left: -3.45rem;
}
.p3_page a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  height: .74rem;
  background: url(../images/p3_tab1.png) 0 0/100% 100% no-repeat;
  float: left;
  color: #616568;
  text-align: center;
  line-height: .22rem;
  font-size: .2rem;
  box-sizing: border-box;
  padding: 0 1%;
}
.p3_page a.act{
  background: url(../images/p3_tab2.png) 0 0/100% 100% no-repeat;
  color: #fefefe;
}
.p3_show,.p3_page_show{
  display: none;
}
.p3_show.act,.p3_page_show.act{
  display: block;
}
.p3_stage{
  display: flex;
  justify-content: space-evenly;
  width: 6.9rem;
  height: .72rem;
  background: url(../images/p3_stage1.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 18.56rem;
  left: 50%;
  margin-left: -3.45rem;
}
.p3_stage a{
  display: block;
  width: 2.8rem;
  height: .72rem;
  line-height: .72rem;
  font-size: .2rem;
  color: #616668;
  text-align: center;
  position: relative;
}
.p3_stage a.act{
  background: url(../images/p3_stage2.png) 0 0/100% 100% no-repeat;
}
.p3_show2 .p3_stage{
  background: url(../images/p3_stage3.png) 0 0/100% 100% no-repeat;
}
.p3_show2 .p3_stage a,
.p3_show2 .p3_stage a.act{
  background: none;
}
.p3_show3 .p3_stage{
  background: url(../images/p3_stage3.png) 0 0/100% 100% no-repeat;
}
.p3_show3 .p3_stage a:after{
  display: block;
  content: '';
  width: 1px;
  height: .32rem;
  background-color: rgba(255, 255, 255, .3);
  position: absolute;
  top: 50%;
  right: -1px;
  margin-top: -.16rem;
}
.p3_show3 .p3_stage a:last-child:after{
  display: none;
}
.p3_rank{
  display: none;
  width: 6.93rem;
  height: 10.22rem;
  background: url(../images/m/p3_rank.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: 19.3rem;
  left: 50%;
  margin-left: -3.465rem;
  overflow: hidden;
}
.p3_rank.act{
  display: block;
}
.p3_show.out .p3_rank{
  background: url(../images/m/p3_rank1.png) 0 0/100% 100% no-repeat;
}
.p3_show.out .rank_list,
.p3_show.out .p3_bottom{
  display: none;
}
.p3_view{
  display: none;
  width: 6.93rem;
  height: 10.22rem;
  position: absolute;
  top: 19.3rem;
  left: 50%;
  margin-left: -3.465rem;
  font-size: .2rem;
  color: #e2e2e2;
  opacity: .5;
  z-index: 2;
}
.p3_show.out .p3_view{
  display: flex;
  align-items: center;
  justify-content: center;
}
.p3_top{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 6.9rem;
  height: 1.06rem;
  position: absolute;
  top: 19.3rem;
  left: 50%;
  margin-left: -3.45rem;
  z-index: 2;
}
.p3_top p{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 1.1rem;
  color: #616668;
  font-size: .18rem;
  line-height: .22rem;
  text-align: center;
}
.p3_top p:nth-child(2){
  width: 4.4rem;
}
.p3_top p:nth-child(3){
  width: 1.3rem;
}
.p3_rule{
  display: block;
  width: .26rem;
  height: .26rem;
  background: url(../images/p3_rule.png) 0 0/100% 100% no-repeat;
  margin: 0 .05rem;
  position: relative;
}
.p3_rule i{
  display: none;
  width: 4.36rem;
  height: 1.13rem;
  background: url(../images/hover.png) 0 0/100% 100% no-repeat;
  position: absolute;
  top: -1.13rem;
  right: 0;
  font-style: initial;
  color: #e2e2e2;
  font-size: .16rem;
  line-height: .2rem;
  box-sizing: border-box;
  padding: .1rem .2rem 0 .6rem;
}
.ar .p3_rule i{
  left: 0;
  right: initial;
}
.p3_rule.act i{
  display: flex;
  align-items: center;
}
.p3_rule i:after{
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
}
.rank_list{
  display: block;
  width: 6.92rem;
  height: 8.1rem;
  margin: 1.1rem auto 0;
  overflow: hidden;
}
.rank_list::-webkit-scrollbar {
  width: .04rem;
  background-color: rgba(0, 0, 0, .2);
  border-radius: .02rem;
}
.rank_list::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
  background-color: rgba(0, 0, 0, .2);
  border-radius: .02rem;
}
.rank_list::-webkit-scrollbar-thumb {
  -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
  background-color: rgba(255, 255, 255, .6);
  border-radius: .02rem;
}
.rank_list li{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: .81rem;
  box-sizing: border-box;
  border-bottom: .01rem solid rgba(100, 100, 100, .3);
}
.rank_list li:last-child{
  border: none;
}
.rank_list li p.bold{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 1rem;
  color: #e2e2e2;
  font-size: .18rem;
  line-height: .22rem;
  word-break: break-word;
  text-overflow: ellipsis;
  text-align: center;
}
.rank_list li p.bold:nth-child(3){
  width: 1rem;
  margin: 0 .05rem;
  font-size: .16rem;
  line-height: .2rem;
}
.p3_show3 .rank_list li p.bold:nth-child(3){
  width: 1.4rem;
}
.team_list{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 4.7rem;
  height: .81rem;
}
.p3_show3 .team_list{
  width: 4.3rem;
  justify-content: center;
}
.team_list ol{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.16rem;
  height: .81rem;
  margin: 0;
  padding: 0;
}
.p3_show3 .team_list ol{
  width: 100%;
}
.team_list ol img{
  display: block;
  width: .34rem;
  border: .01rem solid #616668;
  border-radius: .01rem;
}
.team_list ol p{
  display: -webkit-box;
  width: .86rem;
  line-height: .18rem;
  color: #e2e2e2;
  font-size: .14rem;
  margin: 0 .04rem;
  max-height: .8rem;
  word-break: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.p3_show3 .team_list ol p{
  width: 2rem;
}
.p3_bottom{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 6.92rem;
  height: 1.02rem;
  margin: 0 auto;
  position: relative;
}
.p3_bottom .bold{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.2rem;
  color: #e2e2e2;
  font-size: .2rem;
  line-height: .22rem;
  word-break: break-word;
  text-overflow: ellipsis;
  text-align: center;
}
.p3_bottom .bold:nth-child(2){
  height: .4rem;
  margin-top: .36rem;
}
.p3_bottom .bold:nth-child(3){
  position: relative;
  top: -.38rem;
  left: -.1rem;
}
.ar .p3_bottom .bold:nth-child(3){
  left: 0;
}
.p3_bottom .p3_my{
  width: 1rem;
  height: .66rem;
  line-height: .2rem;
  font-size: .16rem;
  color: #616668;
  position: absolute;
  top: 0;
  left: .08rem;
  text-align: center;
}
.ar .p3_bottom .p3_my{
  left: initial;
  right: .18rem;
  margin-top: .4rem;
}
.p3_boxtext{
  display: none;
}
.p3_bottom.out .bold,
.p3_bottom.out .team_list{
  display: none;
}
.p3_bottom.out .p3_boxtext{
  display: flex;
  width: 100%;
  height: 100%;
  font-size: .2rem;
  line-height: .22rem;
  color: #e2e2e2;
  box-sizing: border-box;
  padding: 0 .2rem;
  align-items: center;
  justify-content: center;
  text-align: center;
  opacity: .5;
}

/*p4*/
.p4_title{
  display: block;
  width: 100%;
  height: 1.1rem;
  background: url(../images/m/p4_title_en.png)  center 0/6.9rem 1.1rem no-repeat;
  margin: .8rem auto .4rem;
}
.zh-tw .p4_title{background:url(../images/m/p4_title_tw.png) center 0/6.9rem 1.1rem no-repeat;}
.zh-hk .p4_title{background:url(../images/m/p4_title_hk.png) center 0/6.9rem 1.1rem no-repeat;}
.en .p4_title{background:url(../images/m/p4_title_en.png) center 0/6.9rem 1.1rem no-repeat;}
.fr .p4_title{background:url(../images/m/p4_title_fr.png) center 0/6.9rem 1.1rem no-repeat;}
.es .p4_title{background:url(../images/m/p4_title_es.png) center 0/6.9rem 1.1rem no-repeat;}
.es-latam .p4_title{background:url(../images/m/p4_title_es-latam.png) center 0/6.9rem 1.1rem no-repeat;}
.ru .p4_title{background:url(../images/m/p4_title_ru.png) center 0/6.9rem 1.1rem no-repeat;}
.de .p4_title{background:url(../images/m/p4_title_de.png) center 0/6.9rem 1.1rem no-repeat;}
.ar .p4_title{background:url(../images/m/p4_title_ar.png) center 0/6.9rem 1.1rem no-repeat;}
.th .p4_title{background:url(../images/m/p4_title_th.png) center 0/6.9rem 1.1rem no-repeat;}
.vi .p4_title{background:url(../images/m/p4_title_vi.png) center 0/6.9rem 1.1rem no-repeat;}
.id .p4_title{background:url(../images/m/p4_title_id.png) center 0/6.9rem 1.1rem no-repeat;}
.pt .p4_title{background:url(../images/m/p4_title_pt.png) center 0/6.9rem 1.1rem no-repeat;}
.pt-br .p4_title{background:url(../images/m/p4_title_pt-br.png) center 0/6.9rem 1.1rem no-repeat;}
.ko .p4_title{background:url(../images/m/p4_title_ko.png) center 0/6.9rem 1.1rem no-repeat;}
.ja .p4_title{background:url(../images/m/p4_title_ja.png) center 0/6.9rem 1.1rem no-repeat;}
.tr .p4_title{background:url(../images/m/p4_title_tr.png) center 0/6.9rem 1.1rem no-repeat;}
.ms .p4_title{background:url(../images/m/p4_title_ms.png) center 0/6.9rem 1.1rem no-repeat;}
.zh .p4_title{background:url(../images/m/p4_title_zh.png) center 0/6.9rem 1.1rem no-repeat;}
.p4_rule{
  display: block;
  width: 6.9rem;
  margin: 0 auto 1rem;
}
.p4_rule p{
  display: block;
  width: 100%;
  font-size: .22rem;
  line-height: .36rem;
  color: #e2e2e2;
}
.p4_rule p.on{
  font-size: .18rem;
}
.p4_rule span{
  display: block;
  width: 100%;
  font-size: .18rem;
  line-height: .36rem;
  color: #a2a2a2;
}
.p4_rule span.br{
  margin-bottom: .46rem;
}
.p4_rule span.on{
  color: #e2e2e2;
}
.p4_list{
  display: block;
  width: 4.76rem;
  height: 4.26rem;
  border: .01rem solid #595755;
  box-sizing: border-box;
  margin: .2rem 0 .2rem;
}
.p4_list li{
  display: block;
  width: 100%;
  height: .6rem;
  border-bottom: .01rem solid #595755;
}
.p4_list li p{
  color: rgba(255, 255, 255, .6);
  font-size: .16rem;
  line-height: .24rem;
  text-align: center;
}
.p4_list li:nth-child(1){
  height: .52rem;
  background-color: #2b261c;
}
.p4_list li:nth-child(1) p{
  color: #e2e2e2;
}
.p4_list li:last-child{
  border-bottom: none;
}
.p4_list li p:nth-child(1){
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.14rem;
  height: 100%;
  float: left;
  border-right: .01rem solid #595755;
}
.p4_list li p:nth-child(2){
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.56rem;
  height: 100%;
  float: left;
/*  border-right: .01rem solid #595755;*/
}
.p4_list li p:nth-child(3){
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.51rem;
  height: 100%;
  float: left;
}











/* pop */
.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 {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: none;
  padding-top: 0.54rem;
  outline: none;
  border: none;
  position: absolute;
  top: 50%;
  left: 50%;
}
.pop_title {
  font-size: 0.38rem;
  color: #0ff796;
  line-height: 0.6rem;
  height: 0.6rem;
  text-align: center;
}
.pop_close {
  cursor: pointer;
  position: absolute;
  top: -0.5rem;
  right: .2rem;
  width: 0.58rem;
  height: 0.58rem;
  background: url("../images/close.png") 0 0/100% 100% no-repeat;
}
.pop {
  width: 7.5rem;
  height: 4.62rem;
  margin-left: -3.75rem;
  margin-top: -2.31rem;
  background: url("../images/pop.png") 0 0/100% 100% no-repeat;
}
#vindex-play {
  width: 7.1rem;
  height: 4.04rem;
  margin-left: -3.55rem;
  margin-top: -2rem;
  border: 0.03rem solid #0bde85;
  display: none;
  outline: none;
  padding: 0;
}
#vindex-play .pop_con {
  padding: 0;
  width: 100%;
  height: 100%;
}
#vindex-play .pop_close{
  top: -.62rem;
  right: 0;
}
.pop_text{
  display: flex;
  width: 5.4rem;
  height: 2.8rem;
  margin: 0 auto;
  font-size: .26rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.pop_confirm{
  display: block;
  width: 3.18rem;
  height: .62rem;
  background: url("../images/pop_confirm.png") 0 0/100% 100% no-repeat;
  margin: 0 auto;
  line-height: .62rem;
  text-align: center;
  font-size: .26rem;
  color: #d8c17d;
}
.login_text{
  display: flex;
  width: 5.4rem;
  height: .92rem;
  margin: .26rem auto 0;
  font-size: .26rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.login_sel{
  display: flex;
  justify-content: center;
  width: 100%;
  height: 1.66rem;
  text-align: center;
}
.login_sel a{
  display: block;
  width: 1.7rem;
  height: 1.66rem;
  margin: 0 .3rem;
  position: relative;
}
.login_level{
  background: url("../images/pop_login.png") left 0/3.99rem 1.66rem no-repeat;
}
.login_garena{
  background: url("../images/pop_login.png") right 0/3.99rem 1.66rem no-repeat;
}
.login_sel a p{
  display: block;
  width: 2.5rem;
  line-height: .2rem;
  font-size: .2rem;
  color: #e2e2e2;
  text-align: center;
  position: absolute;
  top: 1.74rem;
  left: 50%;
  margin-left: -1.25rem;
}
.login_sel a span{
  display: block;
  width: 2.5rem;
  line-height: .24rem;
  font-size: .2rem;
  color: #f55f5f;
  text-align: center;
  position: absolute;
  top: 2.08rem;
  left: 50%;
  margin-left: -1.25rem;
}
.copy_text{
  display: flex;
  width: 5.4rem;
  height: 1.7rem;
  margin: 0 auto;
  font-size: .26rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.pop_link{
  display: block;
  width: 5.61rem;
  height: .56rem;
  margin: 0 auto .58rem;
  background: url("../images/pop_link.png") 0 0/100% 100% no-repeat;
  font-size: .2rem;
  line-height: .56rem;
  text-align: center;
  color: #e2e2e2;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
  padding: 0 .1rem;
}
.copy_tips{
  opacity: 0;
  pointer-events: none;
  width: 90%;
  line-height: .6rem;
  position: absolute;
  top: 50%;
  left: 5%;
  background-color: rgba(0, 0, 0, .9);
  color: #e2e2e2;
  font-size: .2rem;
  text-align: center;
  z-index: 2;
}
.copy_tips.act{
  opacity: 1;
  top: 40%;
  -webkit-transition: opacity 1s,top 1s;
  transition: opacity 1s,top 1s;
}
.btn_copy{
  display: block;
  width: 3.18rem;
  height: .62rem;
  background: url("../images/pop_confirm.png") 0 0/100% 100% no-repeat;
  margin: 0 auto;
  line-height: .62rem;
  text-align: center;
  font-size: .26rem;
  color: #d8c17d;
}
.pop.pop_get {
  height: 7.3rem;
  margin-top: -3.65rem;
  background: url("../images/m_pop2.png") 0 0/100% 100% no-repeat;
}
.get_text{
  display: flex;
  width: 5.4rem;
  height: 1.2rem;
  margin: 0 auto;
  font-size: .36rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.pop.pop_get ul{
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  width: 78%;
  height: 3.82rem;
  margin: 0 auto;
  text-align: center;
  position: relative;
  overflow: hidden;
  font-size: 0;
}

.pop.pop_get .get{
  display: inline-block;
  width: 2.09rem;
  height: 1.76rem;
  background: url(../images/pop_reward.png) 0 0 / 100% 100% no-repeat;
  margin: .08rem;
  overflow: hidden;
  position: relative;
}
.pop.pop_get .get img{
  display: block;
  width: 130%;
  margin: 2% 0 0 -15%;
}
.pop.pop_get .get p{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.02rem;
  height: .42rem;
  position: absolute;
  top: 1.31rem;
  left: .03rem;
  font-size: .14rem;
  line-height: .16rem;
  color: #e2e2e2;
}
.btn_get{
  display: block;
  width: 3.18rem;
  height: .62rem;
  background: url("../images/pop_confirm.png") 0 0/100% 100% no-repeat;
  margin: .26rem auto .2rem;
  line-height: .62rem;
  text-align: center;
  font-size: .26rem;
  color: #d8c17d;
}
.get_tips{
  display: block;
  width: 6.8rem;
  margin: 0 auto;
  font-size: .2rem;
  color: #e2e2e2;
  line-height: .26rem;
  text-align: center;
}
.ar .pop_reward ul li img,
.ar .pop.pop_get .get img{
  position: relative;
  left: 15%;
}
.reward_text{
  display: flex;
  width: 5.4rem;
  height: 1.38rem;
  margin: .1rem auto 0;
  font-size: .36rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.pop_reward ul{
  display: block;
  width: 100%;
  height: 1.76rem;
  font-size: 0;
  text-align: center;
}
.pop_reward ul li{
  display: inline-block;
  width: 2.09rem;
  height: 1.76rem;
  background: url("../images/pop_reward.png") 0 0/100% 100% no-repeat;
  margin: 0 .25rem;
  overflow: hidden;
  position: relative;
}
.pop_reward ul li p{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: .42rem;
  position: absolute;
  top: 1.31rem;
  left: .04rem;
  font-size: .14rem;
  line-height: .18rem;
  color: #e2e2e2;
}
.de .pop_reward ul li p{
  font-size: .12rem;
  line-height: .14rem;
}
.pop_reward ul li img{
  display: block;
  width: 130%;
  margin: 2% 0 0 -15%;
}
.ar .pop_reward ul li img{
  margin: 2% -15% 0 0;
}
.pop.pop_record {
  height: 5.82rem;
  margin-top: -2.91rem;
  background: url("../images/pop_record.png") 0 0/100% 100% no-repeat;
}
.record_text{
  display: flex;
  width: 6.4rem;
  height: 1.08rem;
  margin: 0 auto;
  font-size: .36rem;
  line-height: .48rem;
  color: #e2e2e2;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.record_top{
  display: block;
  width: 6.4rem;
  height: .56rem;
  text-align: center;
  font-size: 0;
  margin: 0 auto;
  position: relative;
  left: .08rem;
}
.record_top span{
  display: block;
  width: 49.3%;
  line-height: .56rem;
  float: left;
  font-size: .2rem;
  color: #e2e2e2;
}
.record_list{
  display: block;
  width: 6.4rem;
  height: 3.12rem;
  text-align: center;
  font-size: 0;
  margin: .2rem auto;
  position: relative;
  left: .08rem;
  overflow: hidden;
  overflow-y: auto;
}
.record_list::-webkit-scrollbar {
  width: .04rem;
  background-color: rgba(0, 0, 0, 0);
}
.record_list::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
  background-color: rgba(0, 0, 0, 0);
}
.record_list::-webkit-scrollbar-thumb {
  -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
  background-color: #e8d3c6;
}
.record_list li{
  display: flex;
  align-items: center;
  width: 100%;
  height: .52rem;
  float: left;
  position: relative;
  font-size: .2rem;
  line-height: 1.2;
  color: #a2a2a2;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
}
.record_list li:last-child{
  border: none;
}
.record_list li span{
  display: block;
  width: 49.3%;
}
.record_list li span:nth-child(1){
  text-align: left;
}


/*footer*/
.footer {
  width: 100%;
  overflow: hidden;
  background: url(../images/footer.jpg) top center no-repeat;
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  box-sizing: border-box;
  padding: .4rem .6rem;
  text-align: center;
  position: relative;
}
.footer p {
  font-size: .24rem;
  color: rgba(235, 235, 235, .3);
  line-height: .5rem;
  word-break: break-word;
}
.tw .footer p {
  word-break: keep-all;
}
.ko .footer p {
  word-break: keep-all;
}
.ja .footer p {
  word-break: keep-all;
}
.footer p a {
  color: rgba(235, 235, 235, .3);
  display: inline-block;
}
.footer p span {
  padding: 0 .05rem;
}
.footer p .ja_btn{display: none;}
.ja .footer p .ja_btn{display: inline-block;}
.agecategories {
  display: none;
  background: url(../images/agecategories.png) center center / contain no-repeat;
  width: 2.48rem;
  height: 1.1rem;
  position: absolute;
  bottom: .1rem;
  right: -.66rem;
  transform: scale(.4);
}
.en .agecategories {
  display: inline-block;
}
.ar .agecategories_link,
.zh-tw .agecategories_link,
.zh-hk .agecategories_link,
.ja .agecategories_link,
.tr .agecategories_link{
  display: none;
}
.zh-tw .rule_link,
.zh-hk .rule_link,
.ja .rule_link,
.ko .rule_link,
.tr .rule_link {
  display: none;
}