@charset "UTF-8";

/* 所有的宽、高、行高、字体大小通通为rem单位  计算方法为设计图相应尺寸/192 */
.wrapper {
  width: 100%;
  opacity: 0.01;
  background: #000 url("../img/bg.jpg?pcv=20200901") no-repeat center top/100%
    auto;
}

/* 头部 start */
.header {
  width: 100%;
  height: 0.572916666666667rem;
  /* 110/192 */
}

.header-main {
  width: 6.2864583rem;
  height: 100%;
}

.logo {
  width: 258px;
  height: 100%;
}

.logo > img {
  width: 258px;
  height: 80px;
  display: block;
}

/* 头部导航 */
.menu {
  padding: 0.1927083333333333rem 0.26041667rem 0.135416667rem 0;
}

.menu > a {
  display: block;
  float: left;
  color: #f4ebd5;
  margin: 0 0.16041667rem;
}

.menu > a > span {
  display: block;
  line-height: 0.151041667rem;
  font-size: 0.09375rem;
  text-align: center;
}

.menu > a > em {
  display: block;
  line-height: 0.09375rem;
  font-size: 0.0625rem;
  text-align: center;
}

.menu > a:hover {
  color: #eecc30;
}

/* banner  start */
.banner {
  position: relative;
  width: 100%;
  height: 4.90625rem;
}

.person {
  position: absolute;
  width: 5.4010416667rem;
  height: 4.7083333rem;
  top: -0.145833rem;
  left: 0.09375rem;
  z-index: 10;
}

.slogan {
  position: absolute;
  top: 0.84375rem;
  right: 1.9270833rem;
  z-index: 13;
  width: 2.97395833rem;
  height: 1.53125rem;
}

.download-wrap {
  position: absolute;
  top: 2.9166667rem;
  right: 2.3541666666666677rem;
  z-index: 13;
  width: 1.90104166667rem;
  height: 0.276041667rem;
}

.download-wrap > a {
  display: block;
  width: 0.921875rem;
  height: 100%;
}

.download-wrap > a > img {
  display: block;
  width: 100%;
}

/* 主体部分 start */
.main-section {
  width: 100%;
}

.content {
  width: 6.2864583rem;
}

/* 第一部分 start */
.sectionOne {
  position: relative;
  width: 100%;
  height: 0.66145833rem;
  margin-bottom: 0.1614583rem;
}

.sectionOne-main {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2.338541667rem;
  z-index: 12;
}

/* 手机扫码下载 */
.erweima {
  position: relative;
  width: 1.5625rem;
  height: 1.84375rem;
  margin-right: 0.015625rem;
  padding-top: 0.49479167rem;
  background: url("../img/ewm-bg.png?pcv=20200901") no-repeat center top/100%
    100%;
}

#qrcode {
  margin: 0 auto;
  position: relative;
  z-index: 10;
  width: 0.916667rem;
  height: 0.916667rem;
}

#qrcode img {
  display: block;
  width: 100%;
  height: 100%;
}

.libao {
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -0.71354167rem;
  width: 1.427083rem;
  height: 1.13020833rem;
  z-index: 9;
}

/* 活动图 */
.lunbo {
  width: 3.09375rem;
  height: 2.16666667rem;
  margin-top: 0.16666667rem;
  background: #f4f7fc;
}

/* 活动-轮播 */
.lunbo .swiper-container,
.lunbo .swiper-slide {
  width: 100% !important;
  height: 1.5rem;
}

.lunbo .swiper-slide > a,
.lunbo .swiper-slide > a > img {
  display: block;
  width: 100%;
  height: 100%;
}

/* 活动-资讯 */
.zixun-list {
  margin: 0.036458333333333rem auto 0;
  width: 2.96875rem;
  height: 0.5625rem;
  overflow: hidden;
}

.zixun-list > li {
  width: 100%;
  height: 0.145833333333333rem;
}

.zixun-list > li > a {
  display: block;
  width: 100%;
  height: 100%;
  line-height: 0.145833333333333rem;
  color: #181105;
  font-size: 0.072916666666667rem;
}

.zixun-list > li > a > span {
  display: block;
}

.listName {
  float: left;
}

.listTitle {
  float: left;
  max-width: 2.239583333333333rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.listTime {
  float: right;
  padding: 0 0.04rem;
}

.zixun-list > li > a:hover {
  color: #d81010;
}

/* 注册 pc电脑端下载 */
.lunbo-right {
  width: 1.5625rem;
  height: 2.16666667rem;
  margin-top: 0.16666667rem;
}

.pc-download {
  background: url("../img/erweima.png?pcv=20200901") no-repeat center top/100%
    100%;
  width: 100%;
  display: block;
  height: 0.828125rem;
  position: relative;
}

.pc-download > img {
  display: block;
  width: 100%;
}

#qrcodegai {
  margin: 0 auto;
  position: absolute;
  z-index: 10;
  width: 0.6rem;
  height: 0.6rem;
  left: 0.10rem;
  top: 0.115rem;
}

#qrcodegai img {
  display: block;
  width: 100%;
  height: 100%;
}
/* 注册 */
.zhuce {
  width: 1.291667rem;
  height: 1.046875rem;
  padding: 0.1041667rem 0.13541667rem 0.13541667rem;
  margin-top: 0.052083rem;
  background: url("../img/zhuce-bg.png?pcv=20200901") no-repeat center
    center/100% 100%;
}

.div-wrap {
  width: 100%;
  height: 0.166667rem;
  margin-bottom: 0.020833rem;
}

.div-wrap > span {
  padding-right: 0.0677083rem;
  width: 0.307291667rem;
  height: 100%;
  background: #fff;
  color: #707070;
  font-size: 0.0625rem;
  line-height: 0.166667rem;
  font-family: "宋体";
  float: left;
  text-align: right;
  margin-right: 1px;
}

.div-wrap > span > img {
  display: block;
  height: 0.0625rem;
}

.username,
.password,
.confirm {
  background: #fff;
  border: none;
  width: 0.82291667rem;
  height: 100%;
  padding-left: 0.085541667rem;
}

.username > input,
.password > input,
.confirm > input {
  line-height: 0.166667rem;
  color: #d81010;
  font-size: 0.0625rem;
  font-family: "宋体";
  background: none;
  border: none;
  width: 100%;
}

.div-wrap > div > input:-ms-input-placeholder {
  color: #d81010;
}

.div-wrap > div > input::-ms-input-placeholder {
  color: #d81010;
}

.div-wrap > div > input::-webkit-input-placeholder {
  color: #d81010;
}

.div-wrap > div > input:-moz-placeholder {
  color: #d81010;
}

.div-wrap > div > input::-moz-placeholder {
  color: #d81010;
}

.div-wrap > div > input::placeholder {
  color: #d81010;
}

/* 勾选同意协议 */
.checkout-con {
  width: 100%;
  height: 0.182291667rem;
}

.checkout-con > em {
  width: 0.05729167rem;
  height: 0.05729167rem;
  margin-right: 0.026041667rem;
  display: block;
  position: relative;
  border: 1px solid #333;
  background: #fff;
}

.checkout-con > em::after {
  display: block;
  content: "";
  width: 0.05729167rem;
  height: 0.05729167rem;
  position: absolute;
  top: 0;
  left: 0;
}

.checkout-con > em.active::after {
  background: url("../img/gou.png?pcv=20200901") no-repeat center center/100%
    100%;
}

.checkout-con > span {
  height: 0.182291667rem;
}

.checkout-con > span > img {
  height: 0.0625rem;
  display: block;
}

/* 注册按钮 */
.register {
  width: 1.03125rem;
  height: 0.302083rem;
}

.register > img {
  width: 100%;
  display: block;
}

/* 第一部分 end */
/* 角色介绍  start */
.role-intro {
  width: 100%;
  height: 2.71875rem;
}

/* 角色 */
.role-main {
  position: relative;
  width: 4.21875rem;
  height: 2.2552083rem;
  padding: 0.333333rem 0.24479rem 0.140625rem;
  background: url("../img/role-bg.png?pcv=20200901") no-repeat center top/100%
    100%;
}

.role-tab {
  width: 0.5052rem;
  height: 1.828125rem;
  position: absolute;
  top: 0.4166667rem;
  left: 0.24479rem;
  z-index: 10;
  padding: 0.1354rem 0 0.114583rem;
  background: url("../img/role-list-bg.png?pcv=20200901") no-repeat center
    top/0.0729166666666667rem 100%;
}

.role-tab > li {
  width: 100%;
  height: 0.5052rem;
  margin: 0.052rem 0;
  cursor: pointer;
}

.role-tab > li > img {
  display: block;
  width: 100%;
  height: 100%;
}

.role-tab > li > img.active {
  display: none;
}

.role-tab > li.active > img.normal,
.role-tab > li:hover > img.normal {
  display: none;
}

.role-tab > li.active > img.active,
.role-tab > li:hover > img.active {
  display: block;
}

.role-details {
  position: absolute;
  top: 0.33333rem;
  right: 0.24479rem;
  width: 3.645833rem;
  height: 2.2552083rem;
}

.role-details > img {
  max-width: 100%;
  display: block;
}

/* 登录领奖励 */
.login-gifts {
  width: 1.3125rem;
  height: 2.08333rem;
  padding: 0.36979rem 0.125rem 0.21875rem;
  margin-top: 0.046875rem;
  background: url("../img/login-gifts.png?pcv=20200901") no-repeat center
    center/100% 100%;
}

.gift-list {
  width: 100%;
}

.gift-list > li {
  padding-bottom: 0.01rem;
  background: url("../img/line.png?pcv=20200901") no-repeat center bottom/100%
    0.01rem;
}

.gift-list > li:nth-child(1) {
  height: 0.578125rem;
}

.gift-list > li:nth-child(2) {
  height: 0.64583rem;
}

.gift-list > li:nth-child(3) {
  height: 0.526rem;
}

.gift-list > li:last-child {
  background: none;
}

.gift-list > li:nth-child(1) > img {
  height: 0.515625rem;
}

.gift-list > li:nth-child(2) > img {
  height: 0.510416666666667rem;
}

.gift-list > li:nth-child(3) > img {
  height: 0.375rem;
}

.lingqu {
  width: 1.03125rem;
  height: 0.3rem;
  margin: 0 auto;
  display: block;
}

.lingqu > img {
  display: block;
  width: 100%;
}

/* 角色介绍  end */
/* 游戏截图  start */
.jietu {
  width: 100%;
  height: 4.04166667rem;
  padding-top: 0.15625rem;
}

.jietu-title,
.huishou-title {
  display: block;
  height: 0.3489583rem;
  margin: 0 auto 0.2229rem;
  margin-top:0.2rem; 
  position: relative;
  z-index: 10;
}

.jietu-swiper {
  width: 100%;
  height: 2.828125rem;
}

.jietu-swiper .swiper-container {
  width: 100%;
  height: 100%;
}

.jietu-swiper .swiper-slide {
  width: 4.145833333333333rem !important;
  height: 2.828125rem !important;
}

.jietu-swiper .swiper-container-3d .swiper-slide-shadow-left,
.jietu-swiper .swiper-container-3d .swiper-slide-shadow-right {
  display: none;
}

.jietu-swiper .swiper-slide-active {
  width: 3.947916666666667rem !important;
  height: 2.630208333333333rem !important;
  padding: 0.098958333333333rem;
  background: url("../img/jietu-bg.png?pcv=20200902") no-repeat center
    center/100% 100%;
}

.jietu-swiper .swiper-slide > img {
  display: block;
  width: 100%;
  height: 100%;
}

.p1 {
  line-height: 0.21875rem;
  text-align: center;
  width: 100%;
  color: #f3ddb4;
  font-size: 0.125rem;
  margin-top: 0.02rem;
}

.p2 {
  line-height: 0.1614583rem;
  text-align: center;
  width: 100%;
  color: #f3ddb4;
  font-size: 0.0729rem;
}

/* 装备回收  start */
.huishou {
  padding-top: 0.003125rem;
  width: 100%;
  height: 4.015625rem;
  position: relative;
}

.zhuangbei-list {
  width: 6.25rem;
  height: 2.71354rem;
  position: relative;
  margin: 0.364583rem auto 0;
  z-index: 10;
}

.zhuangbei-list > li {
  position: absolute;
  width: 1.5625rem;
  height: 1.302rem;
}

.zhuangbei-list > li > img {
  display: block;
  width: 100%;
  height: 100%;
}

.zhuangbei-list > li:nth-child(1) {
  top: 0;
  left: 0;
}

.zhuangbei-list > li:nth-child(2) {
  bottom: 0;
  left: 0;
}

.zhuangbei-list > li:nth-child(3) {
  top: 0;
  right: 0;
}

.zhuangbei-list > li:nth-child(4) {
  bottom: 0;
  right: 0;
}

.huishou-btn {
  display: block;
  position: absolute;
  bottom: 0.21354rem;
  left: 2.49479rem;
  width: 1.421875rem;
  height: 0.453125rem;
  z-index: 12;
}

.huishou-btn > img {
  display: block;
  width: 100%;
  height: 100%;
}

.huishou-tips {
  bottom: 0.166666666666667rem;
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 12;
}

.p3 {
  line-height: 0.213541666666667rem;
  text-align: center;
  width: 100%;
  color: #f3ddb4;
  font-size: 0.125rem;
}

.p4 {
  line-height: 0.171875rem;
  text-align: center;
  width: 100%;
  color: #f3ddb4;
  font-size: 0.0729rem;
}

.huishou-img {
  display: block;
  width: 4.927rem;
  height: 3.84375rem;
  position: absolute;
  left: 0.3229rem;
  bottom: 0;
  z-index: 9;
}

/* 下载 注册 版本号 */
.btn-main {
  padding-top: 0.145833333333333rem;
  width: 100%;
  height: 1.291666666666667rem;
}

.banbenhao {
  width: 100%;
  height: 0.442708333333333rem;
  text-align: center;
  color: #f3ddb4;
  font-size: 0.125rem;
  line-height: 0.442708333333333rem;
}

.btn-wrapper {
  height: 0.453125rem;
  width: 100%;
}

.btn-wrapper > a {
  width: 1.421875rem;
  height: 100%;
  margin: 0 0.052083333333333rem;
}

.btn-wrapper > a > img {
  width: 100%;
  display: block;
}

/* 底部 */
.footer {
  padding: 0.2083333333333333rem;
  background: #000;
}

.footer-main {
  width: 6.25rem;
}

.p-bottom,
.copyRight {
  width: 100%;
  line-height: 0.19375rem;
  text-align: center;
  color: #858585;
  font-size: 0.0729166666666667rem;
}

.p-bottom > span {
  position: relative;
  padding: 0 0.114583333333333rem;
}

.p-bottom > span:after,
.p-bottom > span:after,
.p-bottom > span after {
  position: absolute;
  top: 50%;
  right: 0;
  width: 2px;
  height: 0.104166666666667rem;
  margin-top: -0.052083333333333rem;
  display: block;
  content: "";
  background: #858585;
}

.p-bottom > span:last-child::after,
.p-bottom > span:last-child:after,
.p-bottom > span:last-child after {
  display: none;
}

/* 返回顶部按钮 */
.return-top {
  display: none;
  position: fixed;
  bottom: 0.954rem;
  right: 0.697916666666667rem;
  width: 0.27rem;
  height: 0.27rem;
  z-index: 48;
}

.return-top > img {
  display: block;
  width: 100%;
}

/* 注册弹框 */
.zhuce-pop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 50;
  background: rgba(0, 0, 0, 0.8);
  display: none;
}

.zhuce-pop-main {
  width: 2.427083333333333rem;
  height: 1.96875rem;
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 0.203125rem 0.260416666666667rem 0.260416666666667rem;
  margin: -1.213541666666667rem 0 0 -1.473958333333333rem;
  z-index: 51;
  background: url("../img/zhuce-bg.png?pcv=20200904") no-repeat center
    center/100% 100%;
}

.closeZhuce {
  position: absolute;
  top: -35px;
  right: 0;
  width: 35px;
  height: 35px;
  z-index: 52;
  display: block;
}

.closeZhuce > img {
  display: block;
  width: 100%;
  height: 100%;
}

.zhuce-pop-main .div-wrap {
  width: 100%;
  height: 0.3125rem;
  margin-bottom: 0.041666666666667rem;
}

.zhuce-pop-main .div-wrap > span {
  padding-right: 0.114583333333333rem;
  width: 0.5625rem;
  height: 100%;
  background: #fff;
  color: #707070;
  font-size: 0.0625rem;
  line-height: 0.166667rem;
  font-family: "宋体";
  float: left;
  text-align: right;
  margin-right: 1px;
}

.zhuce-pop-main .div-wrap > span > img {
  display: block;
  height: 0.105416666666667rem;
}

.zhuce-pop-main .username,
.zhuce-pop-main .password,
.zhuce-pop-main .confirm {
  background: #fff;
  border: none;
  width: 1.541666666666667rem;
  height: 100%;
  padding-left: 0.15625rem;
}

.zhuce-pop-main .username > input,
.zhuce-pop-main .password > input,
.zhuce-pop-main .confirm > input {
  line-height: 0.3125rem;
  color: #d81010;
  font-size: 0.114583333333333rem;
  font-family: "微软雅黑";
  background: none;
  border: none;
  width: 100%;
}

.zhuce-pop-main .div-wrap > div > input:-ms-input-placeholder {
  color: #d81010;
}

.zhuce-pop-main .div-wrap > div > input::-ms-input-placeholder {
  color: #d81010;
}

.zhuce-pop-main .div-wrap > div > input::-webkit-input-placeholder {
  color: #d81010;
}

.zhuce-pop-main .div-wrap > div > input:-moz-placeholder {
  color: #d81010;
}

.zhuce-pop-main .div-wrap > div > input::-moz-placeholder {
  color: #d81010;
}

.zhuce-pop-main .div-wrap > div > input::placeholder {
  color: #d81010;
}

/* 勾选同意协议 */
.zhuce-pop-main .checkout-con {
  width: 100%;
  height: 0.333333333333333rem;
}

.zhuce-pop-main .checkout-con > em {
  width: 0.125rem;
  height: 0.125rem;
  margin-right: 0.046041667rem;
  display: block;
  position: relative;
  border: 1px solid #333;
  background: #fff;
}

.zhuce-pop-main .checkout-con > em::after {
  display: block;
  content: "";
  width: 0.125rem;
  height: 0.125rem;
  position: absolute;
  top: 0;
  left: 0;
}

.zhuce-pop-main .checkout-con > em.active::after {
  background: url("../img/gou1.png?pcv=20200901") no-repeat center center/100%
    100%;
}

.zhuce-pop-main .checkout-con > span {
  height: 0.333333333333333rem;
}

.zhuce-pop-main .checkout-con > span > img {
  height: 0.135416666666667rem;
  display: block;
}

/* 注册按钮 */
.zhuce-pop-main .register {
  width: 1.647916666666667rem;
  height: 0.572916666666667rem;
}

.zhuce-pop-main .register > img {
  width: 100%;
  display: block;
}

/* 视频弹框 */
.videoPop {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 50;
  background: rgba(0, 0, 0, 0.8);
  display: none;
}

.videoMain {
  width: 4.166666666666667rem;
  height: 2.604166666666667rem;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -1.302083333333333rem 0 0 -2.083333333333333rem;
  z-index: 51;
}

.closeVideo {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 52;
  width: 0.260416666666667rem;
  height: 0.260416666666667rem;
}

.closeVideo > img {
  display: block;
  width: 100%;
  height: 100%;
}

.videoCon {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2.348958333333333rem;
  z-index: 52;
  background: #fff;
}

.videoCon > video {
  display: block;
  width: 100%;
  height: 100%;
  -webkit-object-fit: fill;
  -moz-object-fit: fill;
  -o-object-fit: fill;
  object-fit: fill;
}

/* 登录领取礼包弹框 */
.login-lingqu-pop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  z-index: 51;
  display: none;
}

.login-lingqu-main {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 0.854166666666667rem 0.333333333333333rem 0.416666666666667rem;
  margin: -1.66927rem 0 0 -2.4296875rem;
  width: 4.1927rem;
  height: 2.072916666666667rem;
  z-index: 52;
  background: url("../img/lingqu-pop-bg.png?pcv=20200908") no-repeat center
    top/100% 100%;
}

.close-lingqu {
  position: absolute;
  top: 0.234375rem;
  right: 0.151rem;
  width: 0.27rem;
  height: 0.229rem;
  z-index: 52;
}

.libao-code-wrap {
  height: 0.28125rem;
  width: 100%;
}

.lbm-wenzi {
  width: 0.703125rem;
  height: 100%;
}

.lbm-wenzi > img {
  display: block;
  width: 0.463541666666667rem;
}

.code-con {
  width: 2.286458333333333rem;
  border-radius: 0.125rem;
  height: 0.25rem;
  background: #b59d7e;
  color: #fff;
  font-size: 0.15625rem;
  line-height: 0.25rem;
  text-align: center;
  margin-right: 0.15625rem;
}

.code-copy {
  display: block;
  width: 0.807291666666667rem;
  height: 100%;
}

.code-copy > img {
  display: block;
  width: 100%;
}

.lingqu-tips {
  width: 100%;
  text-align: center;
  line-height: 0.302rem;
  color: #f73b28;
  font-size: 0.09375rem;
}

.libao-list {
  margin: 0.21875rem auto 0;
  width: 100%;
  height: 1.26rem;
}

.libao-list > li {
  height: 100%;
  float: left;
  width: 0.859375rem;
  margin: 0 0.088541666666667rem 0 0.1rem;
}

.libao-list > li > img {
  display: block;
  width: 100%;
}

.libao-list > li.li-img1 {
  width: 1.015625rem;
  margin: 0 0.015625rem 0 0;
}

/* 友情链接 */
.friendLink {
  width: 100%;
  height: 0.520833333333333rem;
  background: url("../img/friendlink-bg.jpg?pcv=20200915") no-repeat center
    center/100% 100%;
}

.friendLink-main {
  width: 6.25rem;
  height: 100%;
  line-height: 0.520833333333333rem;
}

.friendLink-title {
  width: 0.75rem;
  text-align: center;
  font-size: 0.09375rem;
  color: #a9814e;
}

.friendLink-swiper {
  width: 5.28125rem;
  margin-left: 0.21875rem;
}

.friendLink-swiper .swiper-container {
  width: 100%;
  height: 100%;
}

.friendLink-swiper .swiper-slide {
  text-align: center;
}

.friendLink-swiper .swiper-slide a {
  font-size: 0.09375rem;
  color: #535353;
  display: block;
}

.friendLink-swiper .swiper-slide a:hover {
  color: #a9814e;
}

/*媒体查询 */
@media screen and (max-width: 1400px) {
  .div-wrap > div > input {
    font-size: 9.96px;
    transform: scale(0.83);
    margin-left: -0.084274598393574rem;
    width: 0.991465863453815rem;
  }
}

@media screen and (max-width: 1366px) {
  .div-wrap > div > input {
    font-size: 9.96px;
    transform: scale(0.83);
    margin-left: -0.084274598393574rem;
    width: 0.991465863453815rem;
  }
}

@media screen and (max-width: 1280px) {
  .div-wrap > div > input {
    font-size: 9.36px;
    transform: scale(0.76);
    margin-left: -0.129934210526316rem;
    width: 1.082785087719298rem;
  }
}

@media screen and (max-width: 1190px) {
  .username,
  .password,
  .confirm {
    padding-left: 0.083541667rem;
  }
}

@media screen and (max-width: 980px) {
  .div-wrap > div > input {
    font-size: 7.2px;
    transform: scale(0.6);
    line-height: 0.277777777777778rem;
    height: 0.277777777777778rem;
  }
}