@charset "utf-8";
html,body{ overflow: hidden; width: 100%; height: 100%;}
body{ margin: 0; padding: 0; box-sizing: border-box; font-size: 14px; font-family: "Microsoft Yahei",Arial, Helvetica, sans-serif; -webkit-text-size-adjust: none}
div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,form,input,select,textarea,table,td{ margin: 0; padding: 0;}
h1,h2,h3,h4,h5,h6{ font-size: 100%; font-weight: normal;}
*{ outline: none;}
img{ border: 0;}
ol,ul{ list-style: none;}
a{ font-family: "Microsoft Yahei",Arial, Helvetica, sans-serif; text-decoration: none;outline: none; cursor: pointer;}
a:hover{ text-decoration: none;}
.mhxzxTopbar{ left: 50%!important; margin-left: -375px;}

.wrap{ position: relative; overflow: hidden; width: 750px; height: 100%; margin: 0 auto;}
.icon-guild{ position: absolute; left: 50%; bottom: 30px; z-index: 50; width: 59px; height: 57px; margin-left: -30px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/icon-guild.png) no-repeat;  animation: key-guild 1s infinite alternate;}
@keyframes key-guild{
    0%{ transform: translate3d(0,0,0);}
    100%{ transform: translate3d(0,20px,0);}
}
/* page */
.page-swiper{ position: relative; overflow: hidden; width: 750px; height: 100%;}
.page-swiper .swiper-slide{ position: relative; overflow: hidden; width: 100%; height: 100%;}
/* section-home */
#section-home{ background: url(https://mhxzx.wanmei.com/m/images/cover251230/section-home-bg.jpg) no-repeat center top #27277d;}
.time-info{ position: absolute; left: 0; top: 101px;}
.logo{ position: absolute; right: 7px; top: 108px; width: 292px; height: 53px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/logo.png) no-repeat;}
/* login */
.login-box{ position: absolute; right: 8px; top: 166px; width: 480px; height: 32px; font-size: 26px; line-height: 32px; color: #fff; text-align: right;}
.btn-login,.btn-logout{ cursor: pointer;}
.logout{ display: none;}
.btn-play{ position: absolute; left: 50%; top: 660px; transform: translate3d(-50%,0,0); width: 120px; height: 105px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-play.png) no-repeat; cursor: pointer;}
.btn-full{ position: absolute; left: 623px; top: 672px; width: 111px; height: 129px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-full.png) no-repeat;}
.age-tip{ position: absolute; left: 31px; top: 1087px; width: 76px;}
.btn-download-home{ position: absolute; left: 50%; top: 1070px; transform: translate3d(-50%,0,0); width: 504px; height: 137px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-download.png) no-repeat;}
/* float-yy-head */
.float-yy-head{ position: absolute; left: 6px; top: 470px; width: 198px; height: 303px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/float-yy-head.png) no-repeat;}
.float-yy-head .new-sv-name,.float-yy-head .new-sv-time{ position: absolute; left: 22px; width: 132px; height: 30px; line-height: 30px; color: transparent; text-align: center;  background: linear-gradient(to bottom, #f4e1c6, #ffffff); background-clip: text; -webkit-background-clip: text;}
.float-yy-head .new-sv-name{ top: 178px; font-size: 22px; font-weight: bold;}
.float-yy-head .new-sv-time{ top: 238px; font-size: 19px;}
.float-yy-head .btn-yy-link{ position: absolute; left: 4px; bottom: -14px; width: 169px; height: 44px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-yy-float.png) no-repeat;}
/* section-welfare */
#section-welfare{ background: url(https://mhxzx.wanmei.com/m/images/cover251230/section-welfare-bg.jpg) no-repeat center top #27277d;}
.welfare-yy{ position: relative; width: 750px; height: 445px; margin-top: 159px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/welfare-yy.png) no-repeat center top;}
.welfare-yy .new-sv-name,.welfare-yy .new-sv-time{ position: absolute; overflow: hidden; width: 100%; color: transparent; text-align: center;  background: linear-gradient(to bottom, #f4e1c6, #ffffff); background-clip: text; -webkit-background-clip: text;}
.welfare-yy .new-sv-name{ left: 0; top: 34px; width: 100%; height: 98px; font-size: 55px; font-weight: bold; line-height: 98px;}
.welfare-yy .new-sv-time{ left: 366px; top: 132px; width: 148px; height: 48px; font-size: 28px; line-height: 48px;}
.new-server-gift{ position: absolute; left: 50%; transform: translate3d(-50%,0,0); bottom: 65px;}
.welfare-yy .btn-yy-do{ position: absolute; left: 50%; transform: translate3d(-50%,0,0); bottom: -38px; width: 299px; height: 77px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-yy-welfare.png) no-repeat; cursor: pointer;}

.title-welfare{ display: block; height: 302px; margin: 10px auto 0;}
.welfare-cont{ display: flex; position: relative; z-index: 2; width: 100%; height: 291px; margin-top: -53px; justify-content: center;}
.welfare-item{ position: relative; width: 218px; height: 291px; margin: 0 3px;}
.icon-star{ position: absolute; background: url(https://mhxzx.wanmei.com/images/cover251230/icon-star.png) no-repeat; background-size: 100% auto;}
.icon-star1{ right: -10px; top: -10px; width: 29px; height: 29px;}
.icon-star2{ left: -3px; top: 33px; width: 13px; height: 13px;}
.icon-star3{ left: 15px; bottom: -3px; width: 16px; height: 16px;}
.icon-star4{ right: -2px; top: 91px; width: 10px; height: 10px;}

.welfare-event1{ z-index: 3; background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-event1.png) no-repeat; background-size: 100% auto;}
.welfare-event1 a,.welfare-event2 a{ display: block; position: relative; width: 100%; height: 100%;}
.welfare-item-t{ position: absolute; left: 60px; top: 9px; overflow: hidden; width: 98px; height: 24px; font-size: 16px; line-height: 24px; color: #a3bdfc; text-align: center;}
.welfare-item-info1,.welfare-item-info2{ position: absolute; left: 0; width: 100%; text-align: center;}
.welfare-item-info1{ top: 212px; font-size: 22px; line-height: 26px; font-weight: bold; color: #fff;}
.welfare-item-info2{ top: 248px; font-size: 16px; line-height: 18px; color: #e1c382;}

.welfare-event2{ z-index: 2; background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-event2.png) no-repeat; background-size: 100% auto;}
.welfare-event2 .welfare-item-t{ color: #b1afff;}

.welfare-shequn{ background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-shequn.png) no-repeat; background-size: 100% auto;}
.welfare-shequn .welfare-item-t{ color: #b6b6dc;}
.welfare-sq-list{ position: absolute; left: 50%; transform: translate3d(-50%,0,0); top: 50px; width: 198px; height: 5px;}
.welfare-sq-list li{ float: left; width: 95px; height: 113px; margin: 0 2px;}
.welfare-sq-list li a{ display: block; width: 77px; height: 77px; margin: 0 auto;}
.welfare-sq-weixin{ background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-sq-weixin.png) no-repeat; background-size: 100% auto;}
.welfare-sq-gonglue{ background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-sq-gonglue.png) no-repeat; background-size: 100% auto;}
.welfare-sq-zhendi{ background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-sq-zhendi.png) no-repeat; background-size: 100% auto;}
.welfare-sq-more{ background: url(https://mhxzx.wanmei.com/images/cover251230/welfare-sq-more.png) no-repeat; background-size: 100% auto;}
.sq-title{ width: 95px; height: 20px; margin-top: 6px; font-size: 14px; line-height: 20px; color: #c5c7ff; text-align: center; background: url(https://mhxzx.wanmei.com/images/cover251230/sq-title-point1.png) no-repeat center center; background-size: 100% auto;}
.welfare-sq-list li:nth-child(2) .sq-title{ background: url(https://mhxzx.wanmei.com/images/cover251230/sq-title-point2.png) no-repeat center center; background-size: 100% auto;}
/* section-role */
#section-role{ z-index: -1; background: url(https://mhxzx.wanmei.com/m/images/cover251230/section-role-bg.jpg) no-repeat center top #27277d;}
/* nav */
.nav-container{ position: absolute; left: -20px; top: -526px; z-index: 6; width: 790px; height: 790px;}
.circle-out{ position: absolute; left: -24px; top: -24px; width: 838px; height: 838px; background: url(https://mhxzx.wanmei.com/images/cover251230/quan-out.png) no-repeat; background-size: 100% auto;}
.nav-container .circle,.nav-items-container{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.nav-container .circle{ background: url(https://mhxzx.wanmei.com/images/cover251230/quan.png) no-repeat; background-size: 100% auto;}
.nav-item{ position: absolute; z-index: 10; width: 111px; height: 111px; border-radius: 50%; cursor: pointer; transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); transform: translate(-50%, -50%); opacity: 1; }
.nav-item.active{ z-index: 20; width: 166px; height: 166px; transform: translate(-50%, -50%);}
.role-nav-tiandaofu{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-tiandaofu.png) no-repeat; background-size: 100% auto;}
.role-nav-tiandaofu.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-tiandaofu-on.png) no-repeat; background-size: 100% auto;}
.role-nav-wanlinggong{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-wanlinggong.png) no-repeat; background-size: 100% auto;}
.role-nav-wanlinggong.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-wanlinggong-on.png) no-repeat; background-size: 100% auto;}
.role-nav-qingyun{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-qingyun.png) no-repeat; background-size: 100% auto;}
.role-nav-qingyun.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-qingyun-on.png) no-repeat; background-size: 100% auto;}
.role-nav-longzu{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-longzu.png) no-repeat; background-size: 100% auto;}
.role-nav-longzu.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-longzu-on.png) no-repeat; background-size: 100% auto;}
.role-nav-guidao{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-guidao.png) no-repeat; background-size: 100% auto;}
.role-nav-guidao.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-guidao-on.png) no-repeat; background-size: 100% auto;}
.role-nav-fenxiang{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-fenxiang.png) no-repeat; background-size: 100% auto;}
.role-nav-fenxiang.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-fenxiang-on.png) no-repeat; background-size: 100% auto;}
.role-nav-guiwang{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-guiwang.png) no-repeat; background-size: 100% auto;}
.role-nav-guiwang.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-guiwang-on.png) no-repeat; background-size: 100% auto;}
.role-nav-tianyin{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-tianyin.png) no-repeat; background-size: 100% auto;}
.role-nav-tianyin.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-tianyin-on.png) no-repeat; background-size: 100% auto;}
.role-nav-hehuan{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-hehuan.png) no-repeat; background-size: 100% auto;}
.role-nav-hehuan.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-hehuan-on.png) no-repeat; background-size: 100% auto;}
.role-nav-nanjiang{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-nanjiang.png) no-repeat; background-size: 100% auto;}
.role-nav-nanjiang.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-nanjiang-on.png) no-repeat; background-size: 100% auto;}
.role-nav-changsheng{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-changsheng.png) no-repeat; background-size: 100% auto;}
.role-nav-changsheng.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-changsheng-on.png) no-repeat; background-size: 100% auto;}
.role-nav-wandu{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-wandu.png) no-repeat; background-size: 100% auto;}
.role-nav-wandu.active{ background: url(https://mhxzx.wanmei.com/images/cover251230/role/nav-wandu-on.png) no-repeat; background-size: 100% auto;}

.role-swiper,.role-swiper .swiper-slide{ position: relative; width: 100%; height: 100%; max-height: 1334px;}
.role-swiper .swiper-slide img{ position: absolute;}
.role-img{ right: 0; bottom: 0;}
.role-info{ left: 46px; top: 356px;}
.role-radar{ left: 12px; top: 840px; height: 295px;}

.role-swiper .swiper-slide-active .role-info,.role-swiper .swiper-slide-active .role-radar{ animation: fadeInL .5s;}
.role-swiper .swiper-slide-active .role-img{animation: fadeInR .5s;}
@keyframes fadeInL{
    0%{ opacity: 0; transform: translateX(-160px)}
    100%{ opacity: 1; transform: translateX(0)}
}
@keyframes fadeInR{
    0%{ opacity: 0.6; transform: translateX(100px)}
    100%{ opacity: 1; transform: translateX(0)}
}
.tiandaofu-role2,.tiandaofu-info2,.tiandaofu-title2,#tiandaofu-skill2{ display: none;}
.qingyun-role2,.qingyun-info2,.qingyun-title2,#qingyun-skill2{ display: none;}
/* tab */
.role-tab{ position: absolute; right: 0; top: 834px; width: 83px; height: 344px;}
#tiandaofu-tab{ background: url(https://mhxzx.wanmei.com/m/images/cover251230/role/tiandaofu-tab.png) no-repeat;}
#qingyun-tab{ background: url(https://mhxzx.wanmei.com/m/images/cover251230/role/qingyun-tab.png) no-repeat; ;}
.role-tab.tab-bg1{ background-position: 0 0!important;}
.role-tab.tab-bg2{ background-position: -83px 0!important;}
.role-tab span{ display: block; width: 100%; height: 50%; cursor: pointer;}
.role-tab span.on{ cursor: default;}

.role-bot-gai{ position: absolute; left: 0; top: 1190px; z-index: 6; width: 750px; height: 144px; background: url(https://mhxzx.wanmei.com/m/images/cover251230/role-bot-gai.png) no-repeat;}
/* section-feature */
#section-feature{ background: url(https://mhxzx.wanmei.com/m/images/cover251230/section-feature-bg.jpg) no-repeat center top #27277d;}
.title-feature{ display: block; height: 302px; margin: 74px auto 0;}
.feature-cont{ position: relative; z-index: 2; width: 719px; height: 851px; margin: -70px auto 0; background: url(https://mhxzx.wanmei.com/m/images/cover251230/feature-img-bg.png) no-repeat center top;}
.feature-swiper{ position: absolute; left: 50%; top: 23px; width: 449px; height: 800px; margin-left: -225px;}
.feature-swiper .swiper-slide,.feature-swiper .swiper-slide img,.img-line{ width: 100%; height: 100%;}
.img-line{ position: absolute; left: 0; top: 0; background: url(https://mhxzx.wanmei.com/m/images/cover251230/img-line.png) no-repeat;}
.btn-prev-feature,.btn-next-feature{ position: absolute; top: 360px; width: 111px; height: 109px; cursor: pointer;}
.btn-prev-feature{ left: 0; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-prev.png) no-repeat;}
.btn-next-feature{ right: 0; background: url(https://mhxzx.wanmei.com/m/images/cover251230/btn-next.png) no-repeat;}
/* foot */
#wmgameFooterInsert{ position: absolute; left: 0; bottom: 0; z-index: 51; width: 100%; height: 220px; background-color: #282a2c; transform: translate3d(0,220px,0); transition: transform 0.3s;}
#wmgameFooterInsert.on{ transform: translate3d(0,0,0);}
/* pop */
.pop-fixed{ display: none; position: fixed; left: 50%; transform: translate3d(-50%,0,0); top: 0; z-index: 101; width: 750px; height: 100%; background-color: rgba(0,0,0,.8);}
/* pop-video */
.pop-v-cont{ position: absolute; left: 0; top: 50%; width: 750px; height: 422px; margin-top: -211px;}
.close-video{ position: absolute; left: 50%; transform: translate3d(-50%,0,0); top: 406px; z-index: 5; width: 88px; height: 88px; background: url(https://mhxzx.wanmei.com/m/images/cover250125/close.png) no-repeat;}
.pop-v-cont video{ width: 100%;}
/* pop-sq-ewm */
.pop-sq-bg{ position: absolute; left: 50%; top: 50%; transform: translate3d(-50%,-50%,0); width: 477px; height: 270px; background: url(https://mhxzx.wanmei.com/images/cover251230/guanzhu-pop-bg.png);}
.icon-close{ position: absolute; right: -22px; top: -25px; z-index: 2; width: 54px; height: 54px; background: url(https://mhxzx.wanmei.com/images/cover251230/icon-close.png) no-repeat; cursor: pointer;}
.guanzhu-pop-ewm{ position: absolute; left: 27px; top: 48px; width: 170px; height: 171px; padding: 14px; box-sizing: border-box; background: url(https://mhxzx.wanmei.com/images/cover251230/guanzhu-pop-ewm.png) no-repeat; }
.guanzhu-pop-ewm img{ display: block; width: 142px; height: 142px;}
.guanzhu-pop-text{ display: flex; position: absolute; left: 210px; top: 48px; width: 250px; height: 171px; color: #b4b4e2; align-items: center; justify-content: center; text-align: center;}