body{ position: relative; -webkit-text-size-adjust: 100%; font-family: "Microsoft YaHei", Arial, sans-serif, Helvetica; 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; font-size: inherit; font-family: inherit; 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;}
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);}
html{overflow-x: hidden;}
html, body{background: #1d1d1d;}
body{ min-width: 19.2rem; opacity: 0;}
.viewM{ display: none!important;}
.grecaptcha-badge{ opacity: 0;}
/* header */
.header{position:fixed;top:0;left:0;min-width:19.2rem;width:100%;height:1.18rem;background:#1d1d1d url(https://nte.perfectworld.com/public/images/cover240718/header.png) no-repeat right top;background-size:6.64rem 1.44rem;z-index:4}
.logo{top:50%;left:1.7rem;transform:translate(0,-50%);height:0.85rem}
.headerNav{top:50%;left:4.8rem; transform: translate(0, -50%); display:flex}
.headerNav::before{content:"";position:absolute;top:50%;left:0;width:103%;height:1.18rem;transform:translate(0,-50%);background:#1d1d1d;z-index:1}
.headerNav a{position:relative;width:2.41rem;height:.4rem;z-index:3}
.headerNav a:hover{background-position:0 -0.4rem!important;}
.headerNav a.active{background-position:0 -0.8rem!important;}
.headerNavCity{top:0;left:0;width:3.02rem;height:1.15rem}
.city_shadow_box,.city_shadow_box2{width:inherit;height:inherit;left:-0.4rem;top:-0.37rem;display:none}
.city_shadow_box2{left:-0.37rem;top:-0.35rem}
.city_shadow_box .city_shadow1{width:3.02rem;height:1.15rem;background:url(https://nte.perfectworld.com/public/images/cover240718/city_shadow1.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.city_shadow_box .city_shadow2{width:3.02rem;height:1.15rem;background:url(https://nte.perfectworld.com/public/images/cover240718/city_shadow2.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.city_shadow_box .city_shadow3{width:3.02rem;height:1.15rem;background:url(https://nte.perfectworld.com/public/images/cover240718/city_shadow3.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.city_shadow_box .city_shadow4{width:3.02rem;height:1.15rem;background:url(https://nte.perfectworld.com/public/images/cover240718/city_shadow4.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.headerNavCity .city_shadow_box2 .city_shadow1{width:3.02rem;height:1.15rem;background:url(https://test.wanmei.com/nte/250513main/public/images/main250513/shadow1.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.headerNavCity .city_shadow_box2 .city_shadow2{width:3.02rem;height:1.15rem;background:url(https://test.wanmei.com/nte/250513main/public/images/main250513/shadow2.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.headerNavCity .city_shadow_box2 .city_shadow3{width:3.02rem;height:1.15rem;background:url(https://test.wanmei.com/nte/250513main/public/images/main250513/shadow3.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.headerNavCity .city_shadow_box2 .city_shadow4{width:3.02rem;height:1.15rem;background:url(https://test.wanmei.com/nte/250513main/public/images/main250513/shadow4.png) no-repeat;background-size:100% 100%;position:absolute;top:0;left:0}
.on .city_shadow_box,.on .city_shadow_box2{display:block}
.on .city_shadow1{animation:city_shadow 1s ease 0s forwards}
.on .city_shadow2{animation:city_shadow 1s ease 0.1s forwards}
.on .city_shadow3{animation:city_shadow 1s ease 0.2s forwards}
.on .city_shadow4{animation:city_shadow 1s ease 0.3s forwards}
.on .city_shadow_box2 .city_shadow1{animation:city_shadow .6s ease 0s forwards}
.on .city_shadow_box2 .city_shadow2{animation:city_shadow .7s ease 0.1s forwards}
.on .city_shadow_box2 .city_shadow3{animation:city_shadow .8s ease 0.1s forwards}
.on .city_shadow_box2 .city_shadow4{animation:city_shadow 1s ease 0.1s forwards}
@keyframes city_shadow{
0%{top:0rem}
50%{top:1rem}
100%{top:0.9rem}
}
.headerRight{ top: 0; right: 0; height: 100%; display: flex; align-items: center;}
.headerYYBtn{ width: 1.84rem; height: .66rem;}
.headerYYBtn:hover{ background-position: 0 100%;}
.language{ margin-left: .3rem;width:1.84rem;height:.66rem;}
.languageActive{top:0;left:0;width:100%;height:100%; line-height: .66rem; text-indent: .1rem; cursor:pointer;z-index:1;border:.02rem solid #858585;border-radius:.08rem; font-size: .2rem; color: #FFF;}
.languageActive::after{content:"";position:absolute;top:50%;right:.19rem;transform:translate(0,-50%);width:.17rem;height:.16rem;background:url(https://nte.perfectworld.com/public/images/cover240718/languageArrow.png) no-repeat 0 0;background-size:100% auto;}
.chooseLanguage{top:0;left:0;width:100%;border-radius:.08rem;padding-top:.66rem;background:#303030;display:none;}
.chooseLanguage a{text-align: center; display:block;float:none;margin:0 auto;width:1.71rem;height:.49rem;border-bottom:.01rem solid #606060; font-size: .25rem; color: #FFF;}
.chooseLanguage a:hover{ color: #7cecfc;}
.loginStatus{ margin-left: .3rem;width:0.69rem;min-height:0.69rem;cursor:pointer; display: none;}
.loginIcon{display:block;width:0.69rem;height:0.69rem;background:url(https://nte.perfectworld.com/public/images/cover240718/loginIcon.png) no-repeat 0 0;background-size:100% auto;}
.loginAfter{ top: .75rem; width:1.85rem;height:.91rem;box-sizing:border-box;border-radius:.05rem;border-top:.1rem solid #7cecfc;background:#1d1d1d;display:none;}
.loginStatus:hover .loginAfter{display:block;}
.loginStatus:hover .loginAfter::before{ content: ""; position: absolute; top: -0.2rem; left: 0; width: 100%; height: .1rem;}
.loginUid{margin:.12rem 0;font-size:.16rem;color:#FFF;text-align:center;}
.logOut{display:block;margin:0 auto;width:1.52rem;height:.24rem; line-height: .24rem; background: #3c3c3c; border-radius: .12rem; text-align: center; font-size: .16rem; color: #FFF;}
.bgMusic{ margin: 0 .3rem; width:0.69rem; height:0.69rem; background:url(https://nte.perfectworld.com/public/images/cover240718/bgMusicSwitch.png) no-repeat 0 0;background-size:auto 100%}
.bgMusic.off{background-position:100% 0;}
/* 弹出框 */
.pop{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .8); z-index: 10; display: none;}
.popCont{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 7.6rem;}
/* è§’è‰²ä»‹ç» */
.page_role{
position: relative;
background: url(https://nte.perfectworld.com/public/images/cover240718/page_bg.jpg) no-repeat center center;
background-size: cover;
/*height: 960px;*/
overflow: hidden;
}
.roleSwiper{ height: 100%;}
.roleSlideBg{ width: 100%; height: 100%;}
.role_character_sign{ top: 0; left: 3.27rem; width: .88rem; height: .68rem;}
.role_character_sign1{ background: url(https://nte.perfectworld.com/public/images/cover240718/role_character_sign1.png) no-repeat 0 0; background-size: 100% auto;}
.role_character_sign2{ background: url(https://nte.perfectworld.com/public/images/cover240718/role_character_sign2.png) no-repeat 0 0; background-size: 100% auto;}
.role_character_sign3{ background: url(https://nte.perfectworld.com/public/images/cover240718/role_character_sign3.png) no-repeat 0 0; background-size: 100% auto;}
.factions{ bottom: 0.5rem; right: 2.03rem; width: 1.24rem; height: 1.21rem; display: none;}
.factions1{ background: url(https://nte.perfectworld.com/public/images/cover240718/factions1.png) no-repeat 0 0; background-size: 100% auto;}
.factions2{ background: url(https://nte.perfectworld.com/public/images/cover240718/factions2.png) no-repeat 0 0; background-size: 100% auto;}
.role_name{ top: 50%; left: 3.06rem; margin-top: -1.26rem;}
.role1_name{ width: 3.79rem;}
.role2_name{ width: 5.75rem;}
.role3_name{ width: 3.76rem;}
.role_lines{ bottom: 51%; left: 3rem;}
.roleInfo{z-index: 1; top: 50%; left: 0; margin-top: 0.3rem; width: 11.6rem; height: .01rem; background: #636363;}
.roleDesSwitch{ top: 50%; left: 2.51rem; transform: translate(0, -50%); width: .37rem; height: .37rem; background: url(https://nte.perfectworld.com/public/images/cover240718/roleDesSwitch.png) no-repeat 0 0; background-size: 100% auto;}
.roleDes{ top: .1rem; left: 3.02rem; width: 8.5rem; line-height: .25rem; font-size: .2rem; color: #afafaf; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; overflow: hidden;}
.open .roleDesSwitch{ background-position: 0 -0.37rem; z-index: 1;}
.open .roleDes{overflow-y: hidden; top: 50%; margin: -1.6rem 0 0 -0.33rem; box-sizing: border-box; padding: 0 .4rem; display: flex; flex-wrap: wrap; align-content: center; width: 8.91rem; height: 3.5rem; background: #212121; border: .02rem solid #4b4949;}
.open .roleDes p{ width: 100%;}
.role_pagination_box{
position: absolute;
bottom: -0.01rem;
left: 50%;
margin-left: -12.8rem;
width: 25.6rem;
height: 1.98rem;
background: url(https://nte.perfectworld.com/public/images/character250513/pagination_bg.png) no-repeat;
background-size: 100% auto;
z-index: 1;
/* cursor: pointer;*/
}
.role_swiper_pagination{
top: 0.6rem;
left: 50%;
transform: translate(-50%, 0);
width: 8rem;
cursor: pointer;
}
.cv{
position: absolute;
width: 3.42rem;
height: 1.18rem;
left: 3rem;
top: 50%;
margin-top: -2rem;
cursor: pointer;
display: none;
}
.cv_tag{
position: absolute;
width: 0.58rem;
height: 0.58rem;
left: 0;
bottom: 0;
background: url(https://nte.perfectworld.com/public/images/character250513/cv_tag.png);
background-size: 100% auto;
}
.cv_tag:hover{
background: url(https://nte.perfectworld.com/public/images/character250513/cv_tag_on.png);
background-size: 100% auto;
}
.cv_tag.on{
background: url(https://nte.perfectworld.com/public/images/character250513/cv_tag_on.png);
background-size: 100% auto;
}
.cv_name{ position: absolute; left: 0.7rem; top: 0.76rem;}
.role1_slide .cv_name {
width: 1.13rem;
height: 0.23rem;
background: url(https://nte.perfectworld.com/public/images/character250513/mint_cv.png);
background-size: 100% auto;
}
.role2_slide .cv_name {
width: 1.13rem;
height: 0.23rem;
background: url(https://nte.perfectworld.com/public/images/character250513/mint_cv.png);
background-size: 100% auto;
}
.role3_slide .cv_name {
width: 1.13rem;
height: 0.23rem;
background: url(https://nte.perfectworld.com/public/images/character250513/mint_cv.png);
background-size: 100% auto;
}
.roleSwiper .home_btn{
width: 2.37rem;
height: 0.64rem;
background: url(https://nte.perfectworld.com/public/images/character250513/home_btn.png) no-repeat;
background-size: 100% auto;
position: absolute;
top: 50%;
margin-top: 2rem;
left: 3rem;
}
.role_swiper_pagination .swiper-slide{ width: 2.41rem; height: 1.14rem; margin: 0 .12rem!important;}
.role_bullet1{ background: url(https://nte.perfectworld.com/public/images/character250513/role_bullet1.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet2{ background: url(https://nte.perfectworld.com/public/images/character250513/role_bullet2.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet3{ background: url(https://nte.perfectworld.com/public/images/character250513/role_bullet3.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet4{ background: url(https://nte.perfectworld.com/public/images/character250513/role_bullet4.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet5{ background: url(https://nte.perfectworld.com/public/images/character250513/role_bullet5.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet6{ background: url(../images/character250513/role_bullet6.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet7{ background: url(../images/character250513/role_bullet7.png) no-repeat 0 0; background-size: 100% auto;}
.role_bullet8{ background: url(../images/character250513/role_bullet8.png) no-repeat 0 0; background-size: 100% auto;}
.role_swiper_pagination .swiper-slide-active{ background-position: 0 -1.14rem;}
.role_pagination_prev, .role_pagination_next{
width: 0.6rem;
height: 0.58rem;
position: absolute;
top: 1.2rem;
}
.swiper-button-next:after, .swiper-button-prev:after{display: none !important;}
.role_pagination_prev{
left: 6rem;
background: url(https://nte.perfectworld.com/public/images/character250513/role_pagination_prev.png) no-repeat 0 0;
background-size: 100% auto;
}
.role_pagination_prev:hover{
background: url(https://nte.perfectworld.com/public/images/character250513/role_pagination_prev_on.png) no-repeat 0 0;
background-size: 100% auto;
}
.role_pagination_next{
right: 6rem;
background: url(https://nte.perfectworld.com/public/images/character250513/role_pagination_next.png) no-repeat 0 0;
background-size: 100% auto;
}
.role_pagination_next:hover{
background: url(https://nte.perfectworld.com/public/images/character250513/role_pagination_next_on.png) no-repeat 0 0;
background-size: 100% auto;
}
.guide_nextPage{ top: 50%; right: 0.3rem; margin-top: -1.3rem; width: .32rem; height: 3.59rem; background: url(https://nte.perfectworld.com/public/images/cover240718/guide_nextPage.png) no-repeat 0 0; background-size: 100% auto; z-index: 2;}
.guide_city{ bottom: 0.5rem; right: .4rem; width: 3.25rem; height: 1.03rem; background: url(https://nte.perfectworld.com/cn/images/cover240718/guide_city.png) no-repeat 0 0; background-size: 100% auto; z-index: 2;}
.rolePageIcon{ bottom: 0.5rem; right: 0.59rem; height: 1.21rem; z-index: 2; display: none;}