@charset "UTF-8";
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

ul,
li {
  list-style: none;
}

a {
  text-decoration: none;
}

i {
  font-style: normal;
}


/*字体包CDN分离路径*/
/*@font-face{font-family:'Saira-Regular';src:url("../fonts/Saira-Regular.ttf");}
@font-face{font-family:'Saira-Bold';src:url("../fonts/Saira-Bold.otf");}*/


body {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

a:focus, input:focus, p:focus, div:focus {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body,
html {
  width: 100%;
  background: #000;
}
.wrapper{
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}
.part1{
  width: 19.2rem;
  height: 10rem;
  overflow: hidden;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/part1.jpg) center center no-repeat;
  background-size: cover;
  position: relative;
  margin: 0 auto;
}
.logo{
  display: block;
  width: 6.27rem;
  height: .67rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/logo.png) center center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .34rem;
  left: .5rem;
}
.slogan{
  display: block;
  width: 11.78rem;
  height: 1.73rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/slogan.png) center center no-repeat;
  background-size: 100%;
  margin: 4.3rem auto 0;
}
.logined{
  width: 100%;
  text-align: center;
  font-size: .2rem;
  color: #ffffff;
  line-height: .3rem;
  position: absolute;
  left: 0;
  top: 6.95rem;
}
.logined a{
  font-size: .2rem;
  color: #ffffff;
  line-height: .3rem;
}
.btn-order{
  display: block;
  width: 3.11rem;
  height: .79rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-order.png) center center no-repeat;
  background-size: 100%;
  margin: .05rem auto 0;
}
.btn-ordered{
  display: block;
  width: 3.11rem;
  height: .79rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-ordered.png) center center no-repeat;
  background-size: 100%;
  margin: .05rem auto 0;
  pointer-events: none;
}
.btn-order.btn-ordered{
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-ordered.png) center center no-repeat;
  background-size: 100%;
  pointer-events: none;
}
.gift-list{
  width: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: .45rem auto 0;
}
.gift-list.gift-all{
  height: 2.26rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/gift-all.png) top center no-repeat;
  background-size: auto 100%;
}
.gift-list .gift{
  width: 2.5rem;
  height: 100%;
  overflow: hidden;
  margin: 0;
}

.gift-list .gift.gift-cfm{
  width: 3.2rem;
  height: 2.59rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/gift-cfm.png) center center no-repeat;
  background-size: 100%;
  box-sizing: border-box;
  padding-top: .3rem;
}
.gift-list.gift-all .gift.gift-cfm{
  width: 2.5rem;
  height: 100%;
  background: none;
  padding: 0;
}
.gift-list .gift.gift-cf{
  width: 3.2rem;
  height: 2.59rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/gift-cf.png) center center no-repeat;
  background-size: 100%;
  box-sizing: border-box;
  padding-top: .3rem;
}
.gift-list.gift-all .gift.gift-cf{
  width: 2.5rem;
  height: 100%;
  background: none;
  padding: 0;
}
.gift-list .gift.gift-cfhd{
  width: 3.2rem;
  height: 2.59rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/gift-cfhd.png) center center no-repeat;
  background-size: 100%;
  box-sizing: border-box;
  padding-top: .3rem;
}
.gift-list.gift-all .gift.gift-cfhd{
  width: 2.5rem;
  height: 100%;
  background: none;
  padding: 0;
}

.gift-list .gift p{
  font-size: .2rem;
  color: #fff;
  line-height: .34rem;
  text-align: center;
}
.gift-list .gift .btn-collect{
  display: block;
  width: 1.23rem;
  height: .37rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-collect.png) center center no-repeat;
  background-size: 100%;
  margin: 1.6rem auto 0;
}
.gift-list .gift .btn-collected{
  display: block;
  width: 1.23rem;
  height: .37rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-collected.png) center center no-repeat;
  background-size: 100%;
  margin: 1.6rem auto 0;
}
.home{
  display: block;
  width: 1.79rem;
  height: .53rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/home.png) center center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .15rem;
  right: .15rem;
}
.rule{
  display: block;
  width: 1.79rem;
  height: .53rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/rule.png) center center no-repeat;
  background-size: 100%;
  position: absolute;
  top: .15rem;
  right: 1.98rem;
}

#afooter{
  text-align: center;
  font-size: .18rem;
  line-height: .3rem;
  color: #fff;
  padding: .25rem 0;
}
#afooter a{
  text-align: center;
  font-size: .18rem;
  line-height: .3rem;
  color: #fff;
}

.dialog{
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background: rgba(0,0,0,.8);
  display: none;
}
.pop{
  width: 5.63rem;
  height: 3.38rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%,-50%,0);
  -ms-transform: translate3d(-50%,-50%,0);
  -webkit-transform: translate3d(-50%,-50%,0);
  -o-transform: translate3d(-50%,-50%,0);
  -moz-transform: translate3d(-50%,-50%,0);
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/pop.png) top center no-repeat;
  background-size: 100%;
}
.pop .close{
  display: block;
  width: .32rem;
  height: .33rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/close.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  top: -.3rem;
  right: -.3rem;
}
.pop .warn{
  width: 100%;
  text-align: center;
  font-size: .3rem;
  line-height: .44rem;
  color: #fff;
  padding: 0 .5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%,-50%,0);
  -ms-transform: translate3d(-50%,-50%,0);
  -webkit-transform: translate3d(-50%,-50%,0);
  -o-transform: translate3d(-50%,-50%,0);
  -moz-transform: translate3d(-50%,-50%,0);
  font-weight: bold;
}
.pop3{
  width: 5.44rem;
  height: 4.42rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/pop3.png) top center no-repeat;
  background-size: 100%;  
}
#pop4{
  width: 5.44rem;
  height: 5.09rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/pop4.png) top center no-repeat;
  background-size: 100%;  
}
.pop3 .agree{
  width: 4.6rem;
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 1.15rem auto 0;
}
.pop3 .agree a{
  display: block;
  width: .18rem;
  height: .18rem;
  background: #230000;
  position: relative;
}
.pop3 .agree a.on:after{
  display: block;
  content: "";
  width: .10rem;
  height: .10rem;
  background: #ffe691;
  position: absolute;
  top: .04rem;
  left: .04rem;
}
.pop3 .agree p{
  width: 4.32rem;
  font-size: .18rem;
  line-height: .26rem;
  color: #ffffff;
}
.pop3 .line{
  width: 3.9rem;
  height: .34rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: .26rem auto 0;
}
.pop3 .line1{
  margin: 1.25rem auto 0;
}
#pop4 .line1{
  margin: .26rem auto 0;
}
.pop3 .line span{
  display: block;
  width: 1rem;
  font-size: .24rem;
  color: #ffffff;
  line-height: .34rem;
  text-align: right;
}
.pop3 .line div{
  width: 2.92rem;
  height: .34rem;
  background: #230000;
  position: relative;
  cursor: pointer;
}
.pop3 .line div:after{
  display: block;
  content: "";
  width: .21rem;
  height: .13rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/icon1.png) top center no-repeat;
  background-size: 100%;
  position: absolute;
  right: .13rem;
  top: .11rem;
}
.pop3 .line div p{
  width: 100%;
  font-size: .16rem;
  color: #868686;
  line-height: .34rem;
  text-indent: .2rem;
}
.pop3 .line div ul{
  width: 100%;
  overflow: hidden;
  position: absolute;
  top: .34rem;
  left: 0;
  z-index: 2;
  display: none;
}
.pop3 .line div ul.open{
  display: block;
}
.pop3 .line div ul li{
  width: 100%;
  text-align: center;
  height: .34rem;
  font-size: .2rem;
  color: #fff;
  border-bottom: solid .01rem #868686;
  background: rgba(0,0,0,1);
  transition: all .4s;
}
.pop3 .line div ul li:hover{
  background: rgba(0,0,0,.8);
}
.pop3 .btnlist{
  width: 100%;
  overflow: hidden;
  margin: .42rem auto 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pop3 .btnlist a{
  display: block;
  width: 1.76rem;
  height: .59rem;
  margin: 0 .05rem;
}
.pop3 .btnlist .btn-cancel{
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-cancel.png) top center no-repeat;
  background-size: 100%;
}
.pop3 .btnlist .btn-commit{
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/btn-certain.png) top center no-repeat;
  background-size: 100%;
}
.pop5{
  width: 7.93rem;
  height: 5.49rem;
  background: url(//game.gtimg.cn/images/crossfire/cp/a20260728reservation/pop5.png) top center no-repeat;
  background-size: 100%;  
}
.pop5 .rule-box{
  width: 6.7rem;
  height: 3.8rem;
  overflow-x: hidden;
  overflow-y: auto;
  margin: 1.1rem auto 0;
}
.pop5 .rule-box p{
  font-size: .2rem;
  color: #fff;
  line-height: .32rem;
}
.pop5 .rule-box p.rt{
  margin-top: .2rem;
}

/* 选择区服弹窗 START */
.pop12{width:470.67px;font-size:18.67px}
.pop12 .dia-conarea{width:470.67px;background:#fff;border-radius:6.67px;padding-bottom:13.33px}
.pop12 .dia-close{position:absolute;top:0;font-size:33.33px;color:#fff;background:0 0;top:-1.33px;right:-4px;line-height:33.33px}
.pop12 .dia-close:hover{color:red}
.pop12 .area{background:#2196f3;height:40px;width:100%;border-top-left-radius:6.67px;border-top-right-radius:6.67px}
.pop12 .area p{font-size:21.33px;color:#fff;line-height:40px;text-indent:13.33px}
.pop12 .regional{margin:13.33px 0 0 20px;border:1.33px solid silver;width:90%;height:37.33px;position:relative}
.pop12 .regional::after{content:"";width:26.67px;height:26.67px;position:absolute;right:16px;background:url(//game.gtimg.cn/images/actdaoju/act/a20211029cfdhs/down1.png);background-size:100% 100%;top:5.33px}
.pop12 .area-name{font-size:16px;line-height:37.33px;text-indent:5.33px}
.pop12 .regional-m,.pop12 .regional-m2{position:absolute;width:100%;height:26.67px;top:37.33px;left:-1.33px;background:#fff;height:400px;max-height:266.67px;overflow-y:scroll;border:1.33px solid silver;z-index:10;display:none}
.pop12 .regional-m span,.pop12 .regional-m2 span{display:block;margin-top:2.67px}
.pop12 .regional-m span:hover,.pop12 .regional-m2 span:hover{background:#2196f3}
.pop12 .areabtn-con{width:100%;height:40px;margin:13.33px 20px}
.pop12 .areabtn1,.pop12 .areabtn2{width:200px;height:40px;background:#2196f3;border-radius:4px;display:inline-block}
.pop12 .areabtn1 a,.pop12 .areabtn2 a{display:inline-block;width:100%;height:100%;color:#fff;font-size:18.67px;line-height:40px;text-align:center}
.pop12 .areabtn1{_margin-left:24px;background:#2196f3}
.pop12 .areabtn1:hover{background:#1e8ae2}
.pop12 .areabtn2{margin-left:21.33px;background:#a7a6a4}
.pop12 .areabtn2:hover{background:#979695}
.pop12 .regional2{margin:13.33px 0 0 20px;border:1.33px solid silver;width:90%;height:37.33px;position:relative}
.pop12 .regional2::after{content:"";width:26.67px;height:26.67px;position:absolute;right:16px;background:url(//game.gtimg.cn/images/actdaoju/act/a20211029cfdhs/down1.png);background-size:100% 100%;top:5.33px}
.pop12 .area-name2{font-size:16px;line-height:37.33px;text-indent:5.33px}
.pop12 .rolename{margin-top:13.33px;width:90%;height:37.33px;position:relative;color:red;text-align:left;margin-left:26.67px}

/* 选择区服弹窗 END */
/* 让下拉菜单可以滚动 */
.pop12 .regional-m,
.pop12 .regional-m2 {
    max-height: 266.67px;
    overflow-y: auto;
    display: none; /* 默认隐藏 */
    position: absolute;
    top: 37.33px;
    left: -1.33px;
    width: 100%;
    background: #fff;
    border: 1.33px solid silver;
    z-index: 10;
}
.pop12 .regional-m span,
.pop12 .regional-m2 span {
    display: block;
    padding: 4px 10px;
    cursor: pointer;
    font-size: 14px;
    line-height: 30px;
    border-bottom: 1px solid #eee;
}
.pop12 .regional-m span:hover,
.pop12 .regional-m2 span:hover {
    background: #2196f3;
    color: #fff;
}

/* CFM 平台选择弹窗 - 下拉样式 */
.pop_cfm_platform {
    width: 470.67px;
    font-size: 18.67px;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    display: none;
    background: #fff;
    border-radius: 6.67px;
    padding-bottom: 13.33px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
}
.pop_cfm_platform .cfm-dia-close {
    position: absolute;
    top: -1.33px;
    right: -4px;
    font-size: 33.33px;
    color: #fff;
    line-height: 33.33px;
    cursor: pointer;
}
.pop_cfm_platform .cfm-dia-close:hover { color: red; }
.pop_cfm_platform .cfm-area {
    background: #2196f3;
    height: 40px;
    width: 100%;
    border-top-left-radius: 6.67px;
    border-top-right-radius: 6.67px;
}
.pop_cfm_platform .cfm-area p {
    font-size: 21.33px;
    color: #fff;
    line-height: 40px;
    text-indent: 13.33px;
}
.pop_cfm_platform .cfm-area-con {
    padding: 13.33px 20px;
}

/* 下拉选择框 */
.pop_cfm_platform .cfm-regional {
    border: 1.33px solid silver;
    width: 100%;
    height: 37.33px;
    position: relative;
    cursor: pointer;
}
.pop_cfm_platform .cfm-regional::after {
    content: "";
    width: 26.67px;
    height: 26.67px;
    position: absolute;
    right: 16px;
    background: url(//game.gtimg.cn/images/actdaoju/act/a20211029cfdhs/down1.png);
    background-size: 100% 100%;
    top: 5.33px;
}
.pop_cfm_platform .cfm-area-name {
    font-size: 16px;
    line-height: 37.33px;
    text-indent: 5.33px;
}

/* 下拉菜单 */
.pop_cfm_platform .cfm-regional-m {
    position: absolute;
    width: 100%;
    top: 37.33px;
    left: -1.33px;
    background: #fff;
    max-height: 120px;
    overflow-y: auto;
    border: 1.33px solid silver;
    z-index: 10;
    display: none;
}
.pop_cfm_platform .cfm-regional-m span {
    display: block;
    padding: 4px 10px;
    cursor: pointer;
    font-size: 14px;
    line-height: 30px;
    border-bottom: 1px solid #eee;
}
.pop_cfm_platform .cfm-regional-m span:hover {
    background: #2196f3;
    color: #fff;
}

.pop_cfm_platform .cfm-areabtn-con {
    display: flex;
    justify-content: space-between;
    margin-top: 13.33px;
}
.pop_cfm_platform .cfm-areabtn1,
.pop_cfm_platform .cfm-areabtn2 {
    width: 200px;
    height: 40px;
    background: #2196f3;
    border-radius: 4px;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
}
.pop_cfm_platform .cfm-areabtn1 a,
.pop_cfm_platform .cfm-areabtn2 a {
    display: block;
    color: #fff;
    font-size: 18.67px;
    text-decoration: none;
}
.pop_cfm_platform .cfm-areabtn2 {
    background: #a7a6a4;
}
.pop_cfm_platform .cfm-areabtn1:hover { background: #1e8ae2; }
.pop_cfm_platform .cfm-areabtn2:hover { background: #979695; }
/* 第二个下拉框与第一个样式一致，只需确保 .cfm-regional-area 和 .cfm-regional-m-area 继承样式 */
/* 如果第二个下拉框需要与第一个有间距，可添加 margin-top */
.pop_cfm_platform .cfm-regional-area {
    margin-top: 10px;
}
/* CFM 平台选择弹窗 - 统一字体大小 */
.pop_cfm_platform .cfm-area-name,
.pop_cfm_platform .cfm-area-name2 {
    font-size: 16px;
    line-height: 37.33px;
    text-indent: 5.33px;
}





.scrollbar::-webkit-scrollbar {
  width: .06rem;
  height: .06rem;
  background-color: rgba(0, 0, 0, 0);
}
.scrollbar::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 20%);
  border-radius: .1rem;
  background-color: rgba(0, 0, 0, 0);
  border: none;
}
.scrollbar::-webkit-scrollbar-thumb {
  height: .04rem;
  border-radius: .04rem;
  -webkit-box-shadow: none;
  background-color: #e6ffff;
  box-shadow: none;
}