body{ position: relative; -webkit-text-size-adjust: 100%; font-family: "Microsoft YaHei", Arial, sans-serif; font-size: .16rem;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, span, a { margin: 0; padding: 0; vertical-align: baseline;}
ul, ol { list-style: none;}
a { text-decoration: none; color: inherit; cursor: pointer; outline: none;}
a:hover{ text-decoration:none;}
img { border: 0; object-fit: cover;}
video{ object-fit: cover; }
table { border-collapse: collapse;}
area{ outline:none; }
input, textarea, select{ -webkit-appearance: none; outline: none; resize: none; border-radius: 0;}
input::-ms-clear{ display:none;}
input[type="text"], input[type="password"] { -webkit-appearance: none; -moz-appearance: none; appearance: none;}
button { border: none; background: none; cursor: pointer; font-size: inherit; white-space: nowrap;}
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0;}
button:disabled{ cursor: default;}
.cf:after {content:"";display:block;height:0;clear:both;} 
.cf {zoom:1;}
.fl{ float: left; }
.fr{ float: right; }
.rel{ position: relative;}
.abs{ position: absolute;}
.auto{left: 50%; -webkit-transform:translate(-50%,0); -moz-transform:translate(-50%,0); -ms-transform:translate(-50%,0); -o-transform:translate(-50%,0); transform:translate(-50%,0);}

.viewPc{ display: none!important;}

#app{ height: 13.33rem; background: url(../images/bg1.jpg) no-repeat center top / 25.6rem auto;}
.logo{ top: .2rem; left: .2rem; width: 1.03rem; height: .92rem; background: url(https://nte.perfectworld.com/public/m/images/main260402/logo.png) no-repeat 0 0 / 100% auto;}
.slogan{ top: 8.7rem;}
.bg1 .slogan,
.bg2 .slogan,
.bg3 .slogan,
.bg4 .slogan,
.bg5 .slogan{ top: 8.1rem;}
.indexBtns{ top: 10.2rem; width: 6.36rem; display: flex; flex-wrap: wrap;}
.indexBtns-2{ top: 10.2rem; width: 6.36rem; display: flex; flex-wrap: wrap;}
.indexBtns > a, .indexBtns > button{ position: relative; width: 3.02rem; height: .91rem; margin: 0 .08rem .16rem .08rem;}
.indexBtns-2 > a, .indexBtns-2 > button{ position: relative; width: 3.02rem; height: .91rem; margin: 0 .08rem .16rem .08rem;}
.indexBtns > a::after, .indexBtns > button::after{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.indexBtns-2 > a::after, .indexBtns-2 > button::after{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.steamDownBtn,
.steamDownBtn-2{ background: url(../images/steamDownBtn.png) no-repeat 0 0 / 100% auto;}
.ps5DownBtn{ background: url(../images/ps5DownBtn.png) no-repeat 0 0 / 100% auto;}
.appStoreDownBtn{ background: url(../images/appStoreDownBtn.png) no-repeat 0 0 / 100% auto;}
.googlePlayDownBtn{ background: url(../images/googlePlayDownBtn.png) no-repeat 0 0 / 100% auto;}










/********************************************** de **********************************************/
.html-de .bg1 .slogan,
.html-de .bg2 .slogan,
.html-de .bg3 .slogan,
.html-de .bg4 .slogan,
.html-de .bg5 .slogan{ width: 6.9rem; height: 1.6rem; background: url(../images/slogan1_de.png) no-repeat 0 0 / 100% auto;}
.html-de .slogan{ width: 7.1rem; height: 1.18rem; background: url(../images/slogan_de.png) no-repeat 0 0 / 100% auto;}
.html-de .steamDownBtn::after,
.html-de .steamDownBtn-2::after{background: url(../images/steamDownTxt-de.png) no-repeat 0 0 / 100% auto}
.html-de .ps5DownBtn::after{background: url(../images/ps5DownBtnTxt-de.png) no-repeat 0 0 / 100% auto}
.html-de .appStoreDownBtn::after{background: url(../images/appStoreDownBtnTxt-de.png) no-repeat 0 0 / 100% auto}
.html-de .googlePlayDownBtn::after{background: url(../images/googlePlayDownBtnTxt-de.png) no-repeat 0 0 / 100% auto}



/********************************************** en **********************************************/
.html-en .bg1 .slogan,
.html-en .bg2 .slogan,
.html-en .bg3 .slogan,
.html-en .bg4 .slogan,
.html-en .bg5 .slogan{ width: 6.52rem; height: 1.88rem; background: url(../images/slogan1_en.png) no-repeat 0 0 / 100% auto;}
.html-en .slogan{ width: 7.15rem; height: 1.28rem; background: url(../images/slogan_en.png) no-repeat 0 0 / 100% auto;}
.html-en .steamDownBtn::after,
.html-en .steamDownBtn-2::after{background: url(../images/steamDownTxt-en.png) no-repeat 0 0 / 100% auto}
.html-en .ps5DownBtn::after{background: url(../images/ps5DownBtnTxt-en.png) no-repeat 0 0 / 100% auto}
.html-en .appStoreDownBtn::after{background: url(../images/appStoreDownBtnTxt-en.png) no-repeat 0 0 / 100% auto}
.html-en .googlePlayDownBtn::after{background: url(../images/googlePlayDownBtnTxt-en.png) no-repeat 0 0 / 100% auto}




/********************************************** fr **********************************************/
.html-fr .bg1 .slogan,
.html-fr .bg2 .slogan,
.html-fr .bg3 .slogan,
.html-fr .bg4 .slogan,
.html-fr .bg5 .slogan{ width: 6.78rem; height: 1.75rem; background: url(../images/slogan1_fr.png) no-repeat 0 0 / 100% auto;}
.html-fr .slogan{ width: 7.1rem; height: 1.18rem; background: url(../images/slogan_fr.png) no-repeat 0 0 / 100% auto;}
.html-fr .steamDownBtn::after,
.html-fr .steamDownBtn-2::after{background: url(../images/steamDownTxt-fr.png) no-repeat 0 0 / 100% auto}
.html-fr .ps5DownBtn::after{background: url(../images/ps5DownBtnTxt-fr.png) no-repeat 0 0 / 100% auto}
.html-fr .appStoreDownBtn::after{background: url(../images/appStoreDownBtnTxt-fr.png) no-repeat 0 0 / 100% auto}
.html-fr .googlePlayDownBtn::after{background: url(../images/googlePlayDownBtnTxt-fr.png) no-repeat 0 0 / 100% auto}





/********************************************** jp **********************************************/
.html-jp .bg1 .slogan,
.html-jp .bg2 .slogan,
.html-jp .bg3 .slogan,
.html-jp .bg4 .slogan,
.html-jp .bg5 .slogan{ width: 6.52rem; height: 1.87rem; background: url(../images/slogan1_jp.png) no-repeat 0 0 / 100% auto;}
.html-jp .slogan{ width: 7.15rem; height: 1.28rem; background: url(../images/slogan_jp.png) no-repeat 0 0 / 100% auto;}
.html-jp .steamDownBtn::after,
.html-jp .steamDownBtn-2::after{background: url(../images/steamDownTxt-jp.png) no-repeat 0 0 / 100% auto}
.html-jp .ps5DownBtn::after{background: url(../images/ps5DownBtnTxt-jp.png) no-repeat 0 0 / 100% auto}
.html-jp .appStoreDownBtn::after{background: url(../images/appStoreDownBtnTxt-jp.png) no-repeat 0 0 / 100% auto}
.html-jp .googlePlayDownBtn::after{background: url(../images/googlePlayDownBtnTxt-jp.png) no-repeat 0 0 / 100% auto}





/********************************************** kr **********************************************/
.html-kr .bg1 .slogan,
.html-kr .bg2 .slogan,
.html-kr .bg3 .slogan,
.html-kr .bg4 .slogan,
.html-kr .bg5 .slogan{ width: 6.66rem; height: 1.89rem; background: url(../images/slogan1_kr.png) no-repeat 0 0 / 100% auto;}
.html-kr .logo{ width: 1.32rem; height: 1.08rem; background: url(../images/logo_kr.png) no-repeat 0 0 / 100% auto;}
.html-kr .slogan{ width: 7.15rem; height: 1.28rem; background: url(../images/slogan_kr.png) no-repeat 0 0 / 100% auto;}
.html-kr .steamDownBtn::after,
.html-kr .steamDownBtn-2::after{background: url(../images/steamDownTxt-kr.png) no-repeat 0 0 / 100% auto}
.html-kr .ps5DownBtn::after{background: url(../images/ps5DownBtnTxt-kr.png) no-repeat 0 0 / 100% auto}
.html-kr .appStoreDownBtn::after{background: url(../images/appStoreDownBtnTxt-kr.png) no-repeat 0 0 / 100% auto}
.html-kr .googlePlayDownBtn::after{background: url(../images/googlePlayDownBtnTxt-kr.png) no-repeat 0 0 / 100% auto}





/********************************************** ru **********************************************/
.html-ru .bg1 .slogan,
.html-ru .bg2 .slogan,
.html-ru .bg3 .slogan,
.html-ru .bg4 .slogan,
.html-ru .bg5 .slogan{ width: 6.54rem; height: 1.68rem; background: url(../images/slogan1_ru.png) no-repeat 0 0 / 100% auto;}
.html-ru .slogan{ width: 7.1rem; height: 1.18rem; background: url(../images/slogan_ru.png) no-repeat 0 0 / 100% auto;}
.html-ru .steamDownBtn::after,
.html-ru .steamDownBtn-2::after{background: url(../images/steamDownTxt-ru.png) no-repeat 0 0 / 100% auto}
.html-ru .ps5DownBtn::after{background: url(../images/ps5DownBtnTxt-ru.png) no-repeat 0 0 / 100% auto}
.html-ru .appStoreDownBtn::after{background: url(../images/appStoreDownBtnTxt-ru.png) no-repeat 0 0 / 100% auto}
.html-ru .googlePlayDownBtn::after{background: url(../images/googlePlayDownBtnTxt-ru.png) no-repeat 0 0 / 100% auto}