﻿@charset "utf-8";
/* public */
html,body,form,ol,ul,li,div,p,dl,dt,dd,h1,h2,h3,h4,h5,h6,table,th,td,font,em,ins,span,a{margin:0; padding:0; outline: none;}
h1,h2,h3,h4,h5,h6,button,input,select,textarea{font-size:100%;font-weight:normal}
html{_filter:expression(document.execCommand("BackgroundImageCache",false,true));}
ul,li,div,dl,dt,dd{list-style:none;}
span,a,strong,div{-webkit-appearance:none;-webkit-tap-highlight-color:transparent;}
a{text-decoration:none;}
a{blr:expression(this.onFocus=this.blur());outline:none;}
img{border:0;}
font,em{font-style:normal; font-family:\5b8b\4f53;}
label{vertical-align:middle; font-family:tahoma;}
textarea,input{resize:none; outline:none;}
select{-webkit-appearance:none; outline: none; resize:none; border-radius:0;}
ins{float:right; text-decoration:none; font-weight:normal;}
.pub_wsp{word-wrap:break-word; word-break:break-all;}
.pub_abso{vertical-align:middle;}
.pub_clr{clear:both;font-size:0;height:0;line-height:0;overflow:hidden;}
.pub_ani{-webkit-transition:0.4s;-moz-transition:0.4s;-ms-transition:0.4s;-o-transition:0.4s;transition:0.4s;}
.pub_yh{font-family:"Microsoft YaHei";}
.pub_btn{display: block; overflow: hidden; text-indent: -999rem; cursor: pointer; margin: 0 auto;}
.pub_btn:hover{background-position: 0 bottom;}
.pub_le{float: left}
.pub_lr{float: right;}
.pub_ib{text-align: center; display: table; word-spacing:-1em;}
.pub_text1{display: block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.pub_text2{overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.pub_table{border-collapse: collapse; width: 100%;}
.none{display:none;}
*:not(input):not(textarea){user-select:none;}
body{background:#000; font-family:"Microsoft YaHei",Verdana,Geneva,sans-serif,\5b8b\4f53;}
body,html{width: 100%; overflow-x: hidden;}
body{background: url(../images/y_m.png) repeat-y 0 0; background-size: 100% auto;}
#content{width:100%; display: none; background:url(../images/bgm.jpg) no-repeat center 0; background-size: 100% auto;}
.header{height: 10.3rem; position: relative; background:url(../images/bgmicon.png) no-repeat center 0; background-size: 100% auto;}

.logo{display: block; position: absolute; left: .2rem; top: .2rem; width: .75rem; height: .66rem; background: url(../images/logo.png) no-repeat 0 0; background-size: 100% auto; z-index: 100;}

.nav{width: 4rem; height: .8rem; position: absolute; right: .25rem; top: .12rem; z-index: 100; display: flex; justify-content: right;}
.nav .btn{cursor: pointer; width: .51rem; height: .5rem; background-repeat: no-repeat; background-position: 0 0; background-size: 100% auto; margin-left: .2rem; position: relative; display: block;}
.nav .home{background-image: url(../images/nav_home.png);}
.nav .rule{background-image: url(../images/nav_rule.png);}
.nav .share{background-image: url(../images/nav_share.png); width: .5rem;}
.nav .lang{background-image: url(../images/nav_lang.png);}
.nav .out{background-image: url(../images/nav_logout.png);}
.btnClick{display: block; width: 100%; height: 100%;}
.langShow{width: 1.09rem; height: 1.33rem; background: url(../images/langShow.png) no-repeat 0 0; background-size: 100% auto; position: absolute; right: 0; top: .52rem; display: none;}
.langShow span{display: block; height: .16rem;}
.langShow a{display: block; width: .98rem; height: .36rem; line-height: .36rem; text-align: center; font-size: .2rem; color: #FFF; border-bottom: .01rem solid #4d4d4d; margin: 0 auto;}
.langShow a:last-child{border: 0 none;}
.langShow a.on,.langShow a:hover{color: #7cecfc;}

.loginBefore,.loginAfter{display: none;}
.TwitchloginAfter{display: none;}
.bindAfter{display: none;}


.logoutCont{width: 1.2rem; height: 0.6rem; background: #1d1d1d; border-radius: 0.1rem; overflow: hidden; position: absolute; right: 0; top: .62rem; display: none;}
.logoutTop{height: .08rem; background: #7cecfc;}
.logoutUser{height: .26rem; text-align: center; line-height: .26rem; color: #FFF; font-size: .12rem;}
.logoutBtns{display: block; cursor: pointer; width: 1rem; height: .2rem; line-height: .2rem; background: #3c3c3c; border-radius: .2rem; font-size: .14rem; color: #FFF; margin: 0 auto; text-align: center;}

.slogan{height: 2.8rem; position: absolute; left: .06rem;}
.bind_user{display: block; cursor: pointer; width: 2.08rem; height: .85rem; position: absolute; left: 1.42rem;}
.bind_online{display: block; cursor: pointer; width: 2.06rem; height: 1.13rem; position: absolute; left: 3.75rem;}


.bindCont{height: 10.86rem; background: url(../images/lineIcon_m.png) no-repeat 0 bottom; background-size: 100% auto;}
.bindTitle{height: 2.1rem;}
.stepCont{width: 4.9rem; height: 7.9rem; margin: 0 auto; overflow: hidden;}
.swiper{width: 100%; height: 100%;}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: 0;}
.swiper-pagination-bullet{width: .45rem; height: .44rem; border-radius: 0; background: url(../images/on.png) no-repeat 0 0; background-size: auto .44rem; opacity: 1;}
.swiper-pagination-bullet-active{opacity: 1; background-position: right 0;}
.steplist{width: 4.9rem; height: 7.01rem;}

.stepBtns{padding: 5.4rem 0 .1rem 0;}
.stepBtns a{display: block; width: 3.3rem; height: .71rem; margin: 0 auto; cursor: pointer; background-size: 100% auto; background-position: 0 0; background-repeat: no-repeat;}
.stepIcon{display: block; width: 3.39rem; height: 3.25rem; background-size: 100% auto; background-position: 0 0; background-repeat: no-repeat; margin: 0 auto;}
.stepIcon.i1{background-image: url(../images/step_icon1.png);}
.stepIcon.i2{background-image: url(../images/step_icon2.png);}
.stepIcon.i3{background-image: url(../images/step_icon3.png);}
.loginFont{text-align: center; font-size: .3rem; color: #a8a8a8;}

.quesCont{background: url(../images/lineIcon2_m.png) no-repeat 0 bottom; background-size: 100% auto; padding-bottom: .9rem;}
.quesTitle{height: 1.9rem;}

.queslist{width: 19.3rem; margin: 0 auto;}
.listli{padding-bottom: .5rem;}
.listli:last-child{padding-bottom: 0;}

.listTitle{display: block; height: .76rem; width: 100%; position: relative; cursor: pointer;}
.listbg1{background: url(../images/listbg1.png) no-repeat .78rem 0; background-size: 5.24rem auto;}
.listbg2{background: url(../images/listbg2.png) no-repeat .78rem 0; background-size: 6.42rem auto;}
.listTitle span.icon{background: url(../images/textIcon.png) no-repeat 0 0; background-size: .92rem auto; width: .36rem; height: .36rem; position: absolute; left: .34rem; top: .16rem;}
.listTitle span.num{width: .89rem; height: .59rem; position: absolute; left: .8rem; top: .07rem;}
.listTitle span.num1{background: url(../images/num1.png) no-repeat 0 0; background-size: 100% auto;}
.listTitle span.num2{background: url(../images/num2.png) no-repeat 0 0; background-size: 100% auto;}
.listTitle span.num3{background: url(../images/num3.png) no-repeat 0 0; background-size: 100% auto;}
.listTitle span.num4{background: url(../images/num4.png) no-repeat 0 0; background-size: 100% auto;}
.listTitle span.num5{background: url(../images/num5.png) no-repeat 0 0; background-size: 100% auto;}
.listTitle span.num6{background: url(../images/num6.png) no-repeat 0 0; background-size: 100% auto;}
.listTitle span.title{display: block; padding-left:1.7rem; font-size: .26rem; color: #FFF; font-weight: bold; line-height: .76rem;}
.listTitle.on span.icon{background-position: right 0;}
.listli a,.listli a:hover{color: #5bfefd; text-decoration: underline;}

.listShow{width: 6.47rem; height: 2.39rem; background: url(../images/descbg.png) no-repeat 0 0; background-size: 100% auto; margin-left: .78rem; display: none;}
.listShow p{padding: .3rem .3rem 0 .3rem; font-size: .18rem; color: #FFF; line-height: .24rem;}


.followCont{background: url(../images/lineIcon3_m.png) no-repeat 0 bottom; background-size: 100% auto; padding-bottom: 1rem;}
.followTitle{height: 2.46rem;}

.followIcon{display: flex; justify-content: center; padding: 0 0 .5rem 0;}
.followIcon a{display: block; width: .54rem; height: .54rem; margin: 0 .06rem; background-size: 100% auto; background-position: 0 0; background-repeat: no-repeat;}
.followIcon a.icon_1{background-image: url(../images/icon_1.png);}
.followIcon a.icon_2{background-image: url(../images/icon_2.png);}
.followIcon a.icon_3{background-image: url(../images/icon_3.png);}
.followIcon a.icon_4{background-image: url(../images/icon_4.png);}
.followIcon a.icon_5{background-image: url(../images/icon_5.png);}
.followIcon a.icon_6{background-image: url(../images/icon_6.png);}
.followIcon a.icon_7{background-image: url(../images/icon_7.png);}
.followIcon a.icon_8{background-image: url(../images/icon_8.png);}
.followIcon a.icon_9{background-image: url(../images/icon_9.png);}
.followIcon a.icon_10{background-image: url(../images/icon_10.png);}

.followTips{text-align: center; color: #FFF; font-size: .24rem; line-height: .3rem; font-weight: bold;}


.popFiex{width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: rgba(0,0,0,0.8); z-index: 100; display: none;}
.popWrap{position: fixed; left: 50%; top: 50%; -webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);}
.pop1{width: 6.83rem; height: 7.09rem; background: url(../images/pop1.png) no-repeat 0 0; background-size: 100% auto;}
.pop2{width: 6.83rem; height: 6.27rem; background: url(../images/pop2.png) no-repeat 0 0; background-size: 100% auto;}
.closeBtn{display: block; width: .5rem; height: .5rem; background: url(https://nte.perfectworld.com/public/images/main250513/pop/popClose.png) no-repeat 0 0; background-size: 100% auto; cursor: pointer; position: absolute; right: .26rem; top: .22rem;}

.serverCont{padding: 1.2rem 0 0 0; height: 2.1rem;}
.serverlist{height: .94rem;}
.serverlist span{float: left; width: 2.7rem; height: .64rem; line-height: .64rem; font-size: .38rem; font-weight: bold; color: #FFF; text-align: right; text-shadow:0 0 .3rem rgba(1,115,255,1); margin-right: .1rem;}
.serverlist div{float: left; width: 4rem; padding-top: .08rem;}
.serverlist select{display: block; width: 3.7rem; height: .5rem; background: #020a1b; color: #FFF; border: .02rem solid #5d97f2; font-size: .18rem; outline: none; padding: 0 .1rem;}

.popBindTitle{height: 3.1rem;}
.bindInput{height: 2.7rem;}
.bindInput div{width: 5.2rem; height: .54rem; line-height: .54rem; padding: 0 0 0 .4rem; font-size: .24rem; color: #828282; background: #1d1d1d; margin: 0 auto; margin-bottom: .22rem; border-radius: .54rem;}


.popTitleCont{padding-top: 1.2rem;}
.popTitle{height: .85rem; margin-bottom: .26rem;}

.ruleScroll{width: 6rem; height: 3.3rem; margin: 0 auto; overflow: hidden; overflow-y:auto; color: #1b1b1b; font-size: .24rem; line-height: .36rem;}
.ruleScroll p{margin-bottom: .2rem;}
.ruleScroll::-webkit-scrollbar{width:.06rem;height:.06rem;background-color:rgba(0,0,0,0);}
.ruleScroll::-webkit-scrollbar-track{border-radius:.06rem;background-color:#cbcbcb;}/*底*/
.ruleScroll::-webkit-scrollbar-thumb{border-radius:.06rem;background-color:#0e0e0f;}/*面*/
.ruleScroll::-webkit-scrollbar-thumb:hover{background-color:rgba(143,143,148,1);}
.ruleScroll::-webkit-scrollbar-thumb:active{background-color:rgba(106,106,112,1);}
.ruleScroll::-webkit-scrollbar-track-piece{margin:0;}

.shareImg{height: 4.15rem;}
.imgStyle{background: #5192f3; border-radius: .1rem; width: 6.34rem; padding: .1rem; margin: 0 auto;}
.shareImg img{display: block; width: 6.3rem; border-radius: .1rem; border: .02rem solid #0173ff; background: #151e48;}
.shareCont{display: flex; justify-content: center; height: 1.55rem;}
.shareCont a{display: block; width: 1.15rem; height: 1.15rem; cursor: pointer; margin: 0 .2rem;}
.shareCont a.share_fb{background: url(../images/share_fb.png) no-repeat 0 0; background-size: 100% auto;}
/*.shareCont a.share_x{background: url(../images/share_x.png) no-repeat 0 0; background-size: 100% auto;}*/
.sharelink{width: 5.6rem; height: .62rem; line-height: .58rem; margin: 0 auto; background: #0b213d; border-radius: .1rem; overflow: hidden;}
.sharelink span{float: left; width: 4rem; height: .62rem; color: #36b1f7; font-size: .26rem; margin-left: .1rem; text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}

.msgDiv{height: 2.6rem;}
.msg{height: 2.6rem; display: flex; justify-content: center; align-items: center; font-size: .46rem; line-height: .75rem; color: #141414; font-weight: bold; padding: 1.5rem .1rem 0 .2rem; text-align: center; margin-bottom: 1.87rem;}
.msg span{font-size: .5rem;}

.enterBtns{display: flex; justify-content: center;}
.enterBtns a{width: 2.5rem; height: .58rem; line-height: .58rem; background: #2e2e2e; border: .02rem solid #FFF; display: block; margin: 0 .15rem; cursor: pointer; font-size: .4rem; font-weight: bold; border-radius: .58rem; text-align: center;}
.enterBtns a.btn_cancel{background: #2e2e2e; color: #dddddd;}
.enterBtns a.btn_enter{background: #c3c2c2; color: #141414;}
.enterBtns a.btn_enter.on{background: #7cecfc;}
.enterBtns a.btn_online2{width: 4rem; height: .62rem;}


.index_cn .slogan{background: url(../images/cn/slogan.png) no-repeat 0 0; background-size: 100% auto; width: 7.3rem; top: 7rem;}
.index_cn .bindTitle{background: url(../images/cn/tit_bind.png) no-repeat center; background-size: 5.17rem auto;}
.index_cn .quesTitle{background: url(../images/cn/tit_ques.png) no-repeat center; background-size: 6.98rem auto;}
.index_cn .followTitle{background: url(../images/cn/tit_follow.png) no-repeat center; background-size: 5.1rem auto;}

.index_cn .bind_user{background: url(../images/cn/bind_user.png) no-repeat 0 0; background-size: 100% auto; top: 1.56rem;}
.index_cn .bind_online{background: url(../images/cn/bind_online.png) no-repeat 0 0; background-size: 100% auto; top: 1.17rem;}

.index_cn .steplist.step1{background: url(../images/cn/step1.png) no-repeat 0 0; background-size: 100% auto;}
.index_cn .steplist.step2{background: url(../images/cn/step2.png) no-repeat 0 0; background-size: 100% auto;}
.index_cn .steplist.step3{background: url(../images/cn/step3.png) no-repeat 0 0; background-size: 100% auto;}

.index_cn .btn_login{background-image: url(../images/cn/btn_login.png);}
.index_cn .btn_logout{background-image: url(../images/cn/btn_logout.png);}
.index_cn .btn_login2{background-image: url(../images/cn/btn_login2.png);}
.index_cn .btn_logout2{background-image: url(../images/cn/btn_logout2.png);}
.index_cn .btn_bind{background-image: url(../images/cn/btn_bind.png);}
.index_cn .btn_unbind{background-image: url(../images/cn/btn_unbind.png); cursor: default;}

.index_cn .pt1{background: url(../images/cn/pt1.png) no-repeat center 1.45rem; background-size: 3.47rem auto;}
.index_cn .pt2{background: url(../images/cn/pt2.png) no-repeat center 1.85rem; background-size: 3.42rem auto; height: 5.8rem;}
.index_cn .popTitle{background: url(../images/cn/ruleTitle.png) no-repeat center bottom; background-size: 4rem auto;}
.index_cn .btn_online2{background: url(../images/cn/btn_online2.png) no-repeat center bottom; background-size: 100% auto;}



.index_en .slogan{background: url(../images/en/slogan.png) no-repeat 0 0; background-size: 100% auto; width: 7.3rem; top: 6.36rem;}
.index_en .bindTitle{background: url(../images/en/tit_bind.png) no-repeat center; background-size: 7rem auto;}
.index_en .quesTitle{background: url(../images/en/tit_ques.png) no-repeat center; background-size: 7.2rem auto;}
.index_en .followTitle{background: url(../images/en/tit_follow.png) no-repeat center; background-size: 5.4rem auto;}

.index_en .bind_user{background: url(../images/en/bind_user.png) no-repeat 0 0; background-size: 100% auto; top: 2.44rem;}
.index_en .bind_online{background: url(../images/en/bind_online.png) no-repeat 0 0; background-size: 100% auto; top: 2.05rem;}

.index_en .steplist.step1{background: url(../images/en/step1.png) no-repeat 0 0; background-size: 100% auto;}
.index_en .steplist.step2{background: url(../images/en/step2.png) no-repeat 0 0; background-size: 100% auto;}
.index_en .steplist.step3{background: url(../images/en/step3.png) no-repeat 0 0; background-size: 100% auto;}

.index_en .btn_login{background-image: url(../images/en/btn_login.png);}
.index_en .btn_logout{background-image: url(../images/en/btn_logout.png);}
.index_en .btn_login2{background-image: url(../images/en/btn_login2.png);}
.index_en .btn_logout2{background-image: url(../images/en/btn_logout2.png);}
.index_en .btn_bind{background-image: url(../images/en/btn_bind.png);}
.index_en .btn_unbind{background-image: url(../images/en/btn_unbind.png); cursor: default;}

.index_en .listTitle span.title{display: block; padding-left:1.7rem; font-size: .20rem; color: #FFF; font-weight: bold; display: flex; align-items: center; line-height: .2rem; height: .76rem;}

.index_en .pt1{background: url(../images/en/pt1.png) no-repeat center 1.45rem; background-size: 5.54rem auto;}
.index_en .pt2{background: url(../images/en/pt2.png) no-repeat center 1.85rem; background-size: 4.54rem auto; height: 5.8rem;}
.index_en .popTitle{background: url(../images/en/ruleTitle.png) no-repeat center bottom; background-size: 4rem auto;}
.index_en .btn_online2{background: url(../images/en/btn_online2.png) no-repeat center bottom; background-size: 100% auto;}


.index_jp .slogan{background: url(../images/jp/slogan.png) no-repeat 0 0; background-size: 100% auto; width: 7.3rem; top: 6.8rem;}
.index_jp .bindTitle{background: url(../images/jp/tit_bind.png) no-repeat center; background-size: 7rem auto;}
.index_jp .quesTitle{background: url(../images/jp/tit_ques.png) no-repeat center; background-size: 7.2rem auto;}
.index_jp .followTitle{background: url(../images/jp/tit_follow.png) no-repeat center; background-size: 5.4rem auto;}

.index_jp .bind_user{background: url(../images/jp/bind_user.png) no-repeat 0 0; background-size: 100% auto; top: 1.95rem;}
.index_jp .bind_online{background: url(../images/jp/bind_online.png) no-repeat 0 0; background-size: 100% auto; top: 1.57rem;}

.index_jp .steplist.step1{background: url(../images/jp/step1.png) no-repeat 0 0; background-size: 100% auto;}
.index_jp .steplist.step2{background: url(../images/jp/step2.png) no-repeat 0 0; background-size: 100% auto;}
.index_jp .steplist.step3{background: url(../images/jp/step3.png) no-repeat 0 0; background-size: 100% auto;}

.index_jp .btn_login{background-image: url(../images/jp/btn_login.png);}
.index_jp .btn_logout{background-image: url(../images/jp/btn_logout.png);}
.index_jp .btn_login2{background-image: url(../images/jp/btn_login2.png);}
.index_jp .btn_logout2{background-image: url(../images/jp/btn_logout2.png);}
.index_jp .btn_bind{background-image: url(../images/jp/btn_bind.png);}
.index_jp .btn_unbind{background-image: url(../images/jp/btn_unbind.png); cursor: default;}

.index_jp .listTitle span.title{display: block; padding-left:1.7rem; font-size: .20rem; color: #FFF; font-weight: bold; display: flex; align-items: center; line-height: .20rem; height: .76rem;}

.index_jp .pt1{background: url(../images/jp/pt1.png) no-repeat center 1.45rem; background-size: 5.54rem auto;}
.index_jp .pt2{background: url(../images/jp/pt2.png) no-repeat center 1.85rem; background-size: 4.54rem auto; height: 5.8rem;}
.index_jp .popTitle{background: url(../images/jp/ruleTitle.png) no-repeat center bottom; background-size: 4rem auto;}
.index_jp .btn_online2{background: url(../images/jp/btn_online2.png) no-repeat center bottom; background-size: 100% auto;}

.moveBtns{
  -webkit-animation: moveBtns .8s alternate infinite linear;
  animation: moveBtns .8s alternate infinite linear;
}
@-webkit-keyframes moveBtns{
  0%{-webkit-transform:scale(1);}
  100%{-webkit-transform:scale(.95);}
}
@keyframes moveBtns{
  0%{transform: scale(1);}
  100%{transform:scale(.95);}
}

.otherPlatform{display:flex;}
.otherPlatform a{position:relative;margin:0 0.09rem;width:0.66rem;height:0.66rem;background:url(https://nte.perfectworld.com/public/images/cover240718/otherPlatform.png) no-repeat;background-position-y:0;background-size:auto 200%; text-indent: -999rem;}
.otherPlatform .platform_twitter{background-position-x:0;}
.otherPlatform .platform_facebook{background-position-x:-0.84rem;}
.otherPlatform .platform_youtube{background-position-x:-1.68rem;}
.otherPlatform .platform_discord{background-position-x:-2.52rem;}
.otherPlatform .platform_reddit{background-position-x:-3.37rem;}
.otherPlatform .platform_ins{background-position-x:-4.2rem;}
.otherPlatform .platform_tiktok{background-position-x:-5.04rem;}
.otherPlatform .platform_line{background-position-x:-5.88rem;}
.otherPlatform .platform_naver{background-position-x:-6.72rem;}
.otherPlatform .platform_talk{background-position-x:-7.56rem;}
.otherPlatform a:hover{background-position-y:-0.66rem;}
.otherPlatform .code{position:absolute;bottom:100%;left:50%;transform:translate(-50%,0);display:none;}
.otherPlatform a:hover .code{display:block;}
.otherPlatform .code div{margin-bottom:0.1rem;border-radius:0.05rem;padding:0.1rem;background:#FFF;}
.otherPlatform .code img{display:block;width:1.2rem;height:1.2rem;}

.zh-Hans .pop_regSuccess_tit {
        width: 5.87rem;
        height: 1.21rem;
        background: url(../images/cn_pop_regSuccess_tit.png) no-repeat 0 0;
        background-size: 100% auto
}
.en .pop_regSuccess_tit {
        width: 5.87rem;
        height: 1.41rem;
        background: url(../images/en_pop_regSuccess_tit.png) no-repeat 0 0;
        background-size: 100% auto
}
.ja .pop_regSuccess_tit {
        width: 6.3rem;
        height: 1.22rem;
        background: url(../images/jp_pop_regSuccess_tit.png) no-repeat 0 0;
        background-size: 100% auto
}