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;}
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0;}
h1.wm-public{height:0; line-height:0; font-size:0;}
.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);}

#wrapper{ min-width: 19.2rem; display: none;}

.header{ position: fixed; top: 0; left: 0; width: 100%; height: .99rem; background: #000; z-index: 2;}
.headerCont{ width: 15.5rem; height: 100%; margin: 0 auto; display: flex; justify-content: space-between; align-items: center;}
.logo{ height: .72rem;}
.headerRight{ display: flex; align-items: center;}
.website, .register{ height: .42rem; margin-right: .2rem;}
.website{ width: 2.37rem; background: url(../images/website.png) no-repeat 0 0; background-size: 100% auto;}
.register{ width: 2.78rem; background: url(../images/register.png) no-repeat 0 0; background-size: 100% auto;}
.website:hover, .register:hover{ background-position-y: 100%;}
.language{ display: flex; justify-content: space-between; align-items: center; width: 1.06rem;}
.language button{ width: .34rem; height: .34rem;}
.language .en{ background: url(../images/en.png) no-repeat 0 100%; background-size: 100% auto;}
.language .jp{ background: url(../images/jp.png) no-repeat 0 100%; background-size: 100% auto;}
.language .active{ background-position-y: 0;}
.language::after{ content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: .02rem; height: .39rem; overflow: hidden; background: #FFF;}

.box1{ height: 12.14rem; background: url(../images/box1.jpg) no-repeat center; background-size: auto 100%;}
.box1Register{ top: 6.8rem; right: 50%; margin-right: 2.24rem; width: 4.68rem; height: 1.7rem; background: url(../images/box1Register.png) no-repeat 0 0; background-size: 100% auto;}
.box1Register:hover{ background-position-y: bottom;}

.box2{ height: 7.94rem; background: url(../images/box2.jpg) no-repeat center; background-size: auto 100%;}
.box2-more-btn{ top: 6.53rem; width: 3.42rem; height: .66rem; background: url(../images/box2-more-btn.png) no-repeat 0 0; background-size: 100% auto;}
.box2-more-btn:hover{ background-position-y: 100%;}
.box2-more-btn.btn1{ right: 50%; margin-right: 4.13rem;}
.box2-more-btn.btn2{ left: 50%; transform: translateX(-50%);}
.box2-more-btn.btn3{ left: 50%; margin-left: 4.13rem;}

.box3{ height: 13.92rem; background: url(../images/box3.jpg) no-repeat center; background-size: auto 100%;;}

.box4{ height: 9.33rem; background: url(../images/box4.jpg) no-repeat center; background-size: auto 100%;;}

.box5{ height: 5.35rem; background: url(../images/box5.jpg) no-repeat center; background-size: auto 100%;;}
.box5-cont{ top: 0; width: 15.99rem; height: 3.22rem; background: url(../images/box5-cont.png) no-repeat 0 0; background-size: 100% auto; display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; padding: 0 .6rem 0 .55rem;}
.other-platform{ display: flex;}
.other-platform a{ margin: 0 .1rem; width: 1.11rem; height: 1.11rem; background: url(../images/other-platform.png) no-repeat; background-position-y: 0; background-size: auto 200%;}
.other-platform .platform-twitter{ background-position-x: 0;}
.other-platform .platform-youtube{ background-position-x: -1.32rem;}
.other-platform .platform-discord{ background-position-x: -2.65rem;}
.other-platform .platform-tiktok{ background-position-x: -3.98rem;}
.other-platform a:hover{ background-position-y: 100%;}
.box5Register{ width: 5.16rem; height: 2.33rem; background: url(../images/box5Register.png) no-repeat 0 0; background-size: 100% auto;}
.box5Register:hover{ background-position-y: 100%;}
.tv{ width: 3.45rem; height: 2.57rem; background: url(../images/tv.png) no-repeat 0 0; background-size: 100% auto; display: flex; justify-content: center; align-items: center;}
.tv div{ margin-left: -0.05rem; width: 2.56rem; height: 1.76rem; background: url(https://nte.perfectworld.com/resources/png/20250819/11442ee8362a4b96453a941b514ee3fc8b9a.png) no-repeat; background-size: 100% auto; background-position-x: 0;}
.tv div[pic="1"]{ background-position-y: 0;}
.tv div[pic="2"]{ background-position-y: -1.76rem;}
.tv div[pic="3"]{ background-position-y: -3.52rem;}
.tv div[pic="4"]{ background-position-y: -5.28rem;}
.tv div[pic="5"]{ background-position-y: -7.04rem;}
.tv div[pic="6"]{ background-position-y: -8.8rem;}
.tv div[pic="7"]{ background-position-y: -10.56rem;}
.tv div[pic="8"]{ background-position-y: -12.32rem;}

.popDetailsCont{ width: 6.88rem; height: 8rem; background: url(../images/popDetailsCont.png) no-repeat 0 0; background-size: 100% auto;}
.popDetailsCont .popClose{ top: -0.16rem; right: -0.16rem; width: .62rem; height: .62rem; background: url(../images/popClose.png) no-repeat 0 0; background-size: 100% auto;}
.pop_details_tit{ top: -0.27rem; height: 1.1rem;}
.pop-details-cont{ top: 1.7rem; left: .03rem; width: 6.5rem; height: 6.05rem; overflow-x: hidden; overflow-y: auto;}
.pop-details-cont img{ width: 6.32rem;}
.pop-details-cont::-webkit-scrollbar{ width: .2rem; background: #454545; border-radius: .1rem; }
.pop-details-cont::-webkit-scrollbar-thumb{ background: #ff4295; border-radius: .1rem; }