html,body,.wrapper,.page-box{width: 100%; height: 100%; position: relative;}
html,body { min-width: 1200px; max-width: 3840px; overflow-x: auto; margin: 0 auto;}

.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box;}
.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}
.swiper-invisible-blank-slide{visibility:hidden}
.swiper-container-vertical>.swiper-wrapper {-webkit-box-orient: vertical;-moz-box-orient: vertical;-ms-flex-direction: column;-webkit-flex-direction: column;flex-direction: column;}


.wrapper,.wrapper *{box-sizing: border-box;}
.wrapper{font-size: 12px;}


.page-box>.swiper-wrapper{ transition-timing-function: cubic-bezier(1,0,.2,1);}


.btn-comm-hover{position: relative;}
.btn-comm-hover span{position: relative; z-index: 2;}
.btn-comm-hover i,.btn-comm-hover em{position: absolute; left: 0; top: 0;  transition: .3s ease-out opacity; z-index: 1;}
.btn-comm-hover em,.btn-comm-hover:hover i{opacity: 0;}
.btn-comm-hover:hover em{opacity: 1;}






@keyframes bounceInleft {
	0% {opacity: 0;transform: translateX(-2rem);}
	100% { opacity: 1; transform: translateX(0);}
}

@keyframes bounceInright{
	0% {opacity: 0;transform: translateX(2rem);}
	100% { opacity: 1; transform: translateX(0);}
}

@keyframes bounceInbot {
	0% {opacity: 0;transform: translateY(2rem);}
	100% { opacity: 1; transform: translateX(0);}
}

@keyframes bounceIntop {
	0% {opacity: 0;transform: translateY(-2rem);}
	100% { opacity: 1; transform: translateX(0);}
}

@keyframes scale {
    0%{transform: scale(1.5);opacity: 0;}
    80%{transform: scale(0.9);opacity: 1;}
    100%{transform: scale(1);opacity: 1;}
}

@-webkit-keyframes scaleAnim{  
   0%{ -webkit-transform:scale(1,1);}
   50%{ -webkit-transform:scale(1.2,1.2);}
   100%{ -webkit-transform:scale(1,1);}  
 }
@keyframes scaleAnim{  
   0%{ transform:scale(1,1);}
   50%{ transform:scale(1.2,1.2);}
   100%{ transform:scale(1,1);}  
 }

@-webkit-keyframes move{50%{-webkit-transform:translate3d(0,-.1rem,0)}}
@keyframes move{50%{transform:translate3d(0,-.1rem,0)}}



/*渠道按钮*/
.footer-btn-box{position: absolute; bottom: .44rem; left: .6rem; z-index: 9; display: none;}



/*版权信息按钮*/
.btn-copy{right: .6rem; position: absolute; bottom: .44rem; z-index: 9; padding-right: .36rem; font-size: .2rem; line-height: .54rem; color: #363636; transition: .3s ease color; height: .54rem;}
.btn-copy i,.btn-copy em{position: absolute; right: 0; top: .155rem; left: auto;}
.btn-copy:hover{color: #222;}
.isblack .btn-copy{color: #b3b3b3;}
.isblack .btn-copy:hover{color: #fff;}
.isblack .correct.btn-copy{color: #363636;}
.isblack .correct.btn-copy:hover{color: #222;}

/*底部*/
.copygirht_details{position: absolute; left: 0; bottom: 0; z-index: 99; width: 100%; transform: translateY(230px);}
.copygirht_details.show{transform: translateY(0);}



.mouse-scroll {
	width: .24rem;
	height: .12rem;
	position: absolute;
	left: 50%;
	margin-left: -.12rem;
	bottom: 1rem;
	z-index: 9;
	opacity: .6;
}


.scroll-arrows
{
  display: block;
  width: .05rem;
  height: .05rem;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  border-right: .02rem solid #000;
  border-bottom: .02rem solid #000;
  margin: 0 0 .03rem .04rem;
  width: .16rem;
  height: .16rem;
}


.unu
{
  margin-top: .01rem;
}

.unu, .doi, .trei
{
    -webkit-animation: mouse-scroll 1s infinite;
    -moz-animation: mouse-scroll 1s infinite;
    animation: mouse-scroll 1s infinite;
  
}

.unu
{
  -webkit-animation-delay: .1s;
  -moz-animation-delay: .1s;
  -webkit-animation-direction: alternate;
  
  animation-direction: alternate;
  animation-delay: alternate;
}

.doi
{
  -webkit-animation-delay: .2s;
  -moz-animation-delay: .2s;
  -webkit-animation-direction: alternate;
  
  animation-delay: .2s;
  animation-direction: alternate;
  
  margin-top: -.06rem;
}

.trei
{
  -webkit-animation-delay: .3s;
  -moz-animation-delay: .3s;
  -webkit-animation-direction: alternate;
  
  animation-delay: .3s;
  animation-direction: alternate;
  
  
  margin-top: -.06rem;
}

.sam-mouse {
  height: .42rem;
  width: .24rem;
  border-radius: .14rem;
  transform: none;
  border: .02rem solid #000;
  top: 1.7rem;
}


.wheel {
  height: .05rem;
  width: .02rem;
  display: block;
  margin: .05rem auto;
  background: #000;
  position: relative;
  
  height: .04rem;
  width: .04rem;
  border: .02rem solid #000;
  -webkit-border-radius: .08rem;
          border-radius: .08rem;
}

.isblack .scroll-arrows{border-right: .02rem solid #fff; border-bottom: .02rem solid #fff;}
.isblack .sam-mouse{border: .02rem solid #fff;}
.isblack .wheel{background: #fff; border: .02rem solid #fff;}

.wheel {
  -webkit-animation: mouse-wheel 0.6s linear infinite;
  -moz-animation: mouse-wheel 0.6s linear infinite;
  animation: mouse-wheel 0.6s linear infinite;
}

@-webkit-keyframes mouse-wheel{
   0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
  }
}
@-moz-keyframes mouse-wheel {
  50%{top:.04rem}
}
@-o-keyframes mouse-wheel {

    50%{top:.04rem}
}
@keyframes mouse-wheel {

   50%{top:.04rem}
}

@-webkit-keyframes mouse-scroll {

  0%   { opacity: 0;}
  50%  { opacity: .5;}
  100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}

@keyframes fadeInDown1 {
    0% {
        opacity: 0;
        transform: translate3d(0,100px,0)
    }

    100% {
        opacity: 1;
        transform: translate3d(0,0,0)
    }
}
@keyframes fadeIn1 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@keyframes fadeOut1 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}
@-webkit-keyframes mouse-move {
  0% { transform: translate3d(0, 0, 0);}
  50% { transform: translate3d(0, 10px, 0);}
  100% { transform: translate3d(0, 0, 0);}
}
@keyframes mouse-move {
  0% { transform: translate3d(0, 0, 0) rotate(45deg);}
  50% { transform: translate3d(0, 10px, 0) rotate(45deg);}
  100% { transform: translate3d(0, 0, 0) rotate(45deg);}
}
.fadeanim { animation: fadeInDown1 .4s .2s ease-out both;}
.fadeanim1 { animation-delay: 0s; animation-duration: .1s;}
.comm-scroll::-webkit-scrollbar {
  width: .1rem;
  height: .1rem; 
  background-color: transparent;
}
.comm-scroll::-webkit-scrollbar-button { 
  width: 0; 
  height: 0; 
}
.comm-scroll::-webkit-scrollbar-corner { 
  display: block; 
}
.comm-scroll::-webkit-scrollbar-thumb { 
  background-clip: padding-box;
  background-color: #353535; 
  border-radius: 4px; 
}

.wrapper.inside-page { padding-top: 1.2rem;}
  

/* 主体部分 S */
/* 精灵图 S */
.spr{ background-image:url(//game.gtimg.cn/images/gp/cp/a20250618enemies/spr.png); background-repeat:no-repeat; background-size:11.25rem 2.45rem;}
.spr.btn-gsz{ width:1.88rem; height:0.61rem; background-position:78.22839% 80.43478%;}
.spr.btn-more{ width:1.93rem; height:0.62rem; background-position:78.96996% 42.62295%;}
.spr.btn-more2{ width:1.93rem; height:0.62rem; background-position:45.49356% 74.31694%;}
.spr.i-arr{ width:0.1rem; height:0.19rem; background-position:98.56502% 3.9823%;}
.spr.i-arr2{ width:0.1rem; height:0.19rem; background-position:98.56502% 3.9823%;}
.spr.i-next{ width:1rem; height:1rem; background-position:96.68293% 6.2069%;}
.spr.i-prev{ width:1rem; height:1rem; background-position:60.97561% 93.7931%;}
.spr.i-star{ width:4.07rem; height:1.92rem; background-position:1.25348% 16.98113%;}
.spr.name-ct{ width:3.04rem; height:1.19rem; background-position:51.64434% 7.14286%;}
.spr.name-sy{ width:1.79rem; height:0.61rem; background-position:99.04863% 63.58696%;}
.spr.name-tz{ width:2.47rem; height:0.61rem; background-position:83.82688% 4.8913%;}
.spr.txt-l{ width:0.26rem; height:0.3rem; background-position:84.53139% 86.51163%;}
.spr.txt-r{ width:0.4rem; height:0.3rem; background-position:86.35945% 36.27907%;}
/* 精灵图 E */
@font-face {
  font-family:fontTen;
  src: url(//game.gtimg.cn/images/gp/cp/a20250618enemies/font/TencentBold.ttf);
}
.ften { font-family: fontTen;}

@-webkit-keyframes bounceInleft {
	0% {opacity: 0;transform: translatex(-200px);}
	100% {transform: translateY(0);opacity: 1;}
}
@keyframes bounceInleft {
	0% {opacity: 0;transform: translateX(-200px);}
	100% {transform: translateY(0);opacity: 1;}
}
@-webkit-keyframes bounceInright {
	0% {opacity: 0;transform: translatex(200px);}
	100% {transform: translateY(0);opacity: 1;}
}
@keyframes bounceInright {
	0% {opacity: 0;transform: translateX(200px);}
	100% {transform: translateY(0);opacity: 1;}
}

.show_m { display: none;}
.title { position: absolute; top: 50%; left: 0.39rem; width: 4.72rem; height: 1.14rem; margin-top: -5.54rem; font-size: 0; z-index: 99;}
.title i { display: block;}

.camp-swiper { width: 100%; height: 100%; background: #000; }

.btn-gsz { display: flex; justify-content: space-evenly; align-items: center; font-size: .22rem; line-height: .3rem; color: #fff; padding: 0 .2rem; position: fixed; top: 1.6rem; right: .58rem; z-index: 99; }
.btn-gsz i.spr { transition: all .3s; }
.btn-gsz:hover i.spr { margin-left: .1rem; }

.part-title { width: 14.84rem; height: 3.53rem; background: url(//game.gtimg.cn/images/gp/cp/a20250618enemies/title.png) no-repeat 0 0/100%; position: absolute; left: 50%; bottom: .4rem; margin-left: -7.42rem; }

.name-box { width: 3.1rem; height: auto; position: absolute; }
.name-box p.spr { font-size: .22rem; line-height: .6rem; color: #2c4353; text-align: center; font-weight: bold; font-style: italic; padding-left: .44rem; margin: 0 auto; }
.name-box .ften { font-size: .28rem; line-height: .4rem; color: #fff; font-style: italic; display: flex; justify-content: center; align-items: center; margin-top: .02rem; }
.name-box a.spr { display: flex; justify-content: space-evenly; align-items: center; font-size: .22rem; line-height: .3rem; color: #fff; padding: .04rem .3rem 0; margin: .2rem auto 0; }
.name-box a.spr i.spr { transition: all .3s; }
.name-box a.spr:hover i.spr { margin-left: .1rem; }

.part1 { width: 100%; height: 100%; overflow: hidden; background: url(//game.gtimg.cn/images/gp/cp/a20250618enemies/bg1.jpg) no-repeat 50% 50%/cover; position: relative;}
.part1 .name-box.tz { top: 50%; left: 50%; margin: -1rem 0 0 0; }
.part1 .name-box.sy { top: .98rem; left: 50%; margin-left: 3rem; }

.part2 { width: 100%; height: 100%; overflow: hidden; background: url(//game.gtimg.cn/images/gp/cp/a20250618enemies/bg2.jpg) no-repeat 50% 50%/cover; position: relative; }
.part2 .name-box.ct { top: 50%; left: 50%; margin: -3.5rem 0 0 1.66rem; }
.part2 .name-box p.spr { color: #267cc0; padding: .22rem 0 0 .4rem; }
.part2 .name-box .ften { margin-top: -.34rem; }
.part2 .name-box i.i-star { position: absolute; top: -.24rem; left: 50%; margin-left: -2rem; z-index: 2; pointer-events: none; }

.camp-switch { width: 95%; height: 0; position: absolute; top: 50%; left: 2.5%; }
.camp-switch a { width: 1rem; height: 1rem; position: absolute; top: 50%; margin-top: -.5rem; z-index: 5; }
.camp-switch a.btn-prev { left: 0; }
.camp-switch a.btn-next { right: 0; }
.camp-switch a i.spr { display: block; }
.camp-switch a.swiper-button-disabled { display: none; }

/* 主体部分 E * /
/*  */
.event-head-arrow { display: none;}
.mob-foot { display: none;}
/* 弹窗 S */
.pop_layer { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.96); z-index: 99;}
.pop_comm { position: fixed !important; left: 50%; top: 50%; -webkit-transform:translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 99;}
.comm_pop { display: none; position: relative; outline: none;}

.pop_close { position: absolute; right: -1.48rem; top: 0; z-index: 5; transition: all .3s; width: .54rem; height: .62rem;}
.pop_close em { position: absolute; left: 0; top: 0; z-index: 1; transition: .3s ease-in-out;}
.pop_close em.pop-close-icon { opacity: 1;}
.pop_close em.pop-close-icon.hover { opacity: 0;}
.pop_close:hover em.pop-close-icon { opacity: 0;}
.pop_close:hover em.pop-close-icon.hover { opacity: 1;}

.event-spr-pc{ background-image:url(//game.gtimg.cn/images/gp/cp/a20241029dzc/event-spr-pc.png); background-repeat:no-repeat; background-size:1.2rem 0.7rem;}
.event-spr-pc.pop-close-icon.hover{ width:0.56rem; height:0.64rem; background-position:4.6875% 50%;}
.event-spr-pc.pop-close-icon{ width:0.56rem; height:0.64rem; background-position:95.3125% 50%;}
/*视频弹窗*/
.pop_video { outline: none; position: relative; display: none; width: 10.8rem; height: 6.67rem; -webkit-transform: none; transform: none; margin: -3.33rem 0 0 -5.4rem;}
.pop_close { position: absolute; right: -1.48rem; top: 0; z-index: 5; transition: all .3s; width: .54rem; height: .62rem;}
.pop_close em { position: absolute; left: 0; top: 0; z-index: 1; transition: .3s ease-in-out;}
.pop_close em.pop-close-icon { opacity: 1;}
.pop_close em.pop-close-icon.hover { opacity: 0;}
.pop_close:hover em.pop-close-icon { opacity: 0;}
.pop_close:hover em.pop-close-icon.hover { opacity: 1;}
.pop_video_cont { width: 10.8rem; height: 6.67rem; text-align: center; clear: both; background: #000;}
#popVideoCon { width: 100%; height: 100%;}
#popVideoCon video { width: 100%; height: 100%;}

.pop-role { width: 100%; height: 100%; display: none; position: relative; outline: none; background-color: #111112;}
.pop-role .pop_close { right: 1rem; top: 16%;}
.pop-role-scroll { width: 100%; height: 100%; overflow-y: auto; padding-top: 2.2rem;}
.pop-role-scroll .comm-tit { width: 13.9rem; margin: 0 auto;}
.pop-role-scroll h5 { color: #fff; font-size: .3rem; line-height: .5rem; text-align: center; width: 11.9rem; margin: 0 auto;}
.pop-role-text { width: 11.9rem; margin: .66rem auto 0;}
.pop-role-text p { text-align: justify; color: #dededd; font-size: .26rem; line-height: .46rem; margin-bottom: .22rem; min-height: .2rem;}
.pop-role-text p b {font-weight: bold;}
.comm-scroll::-webkit-scrollbar {
  width: .1rem;
  height: .1rem; 
  background-color: transparent;
}
.comm-scroll::-webkit-scrollbar-button { 
  width: 0; 
  height: 0; 
}
.comm-scroll::-webkit-scrollbar-corner { 
  display: block; 
}
.comm-scroll::-webkit-scrollbar-thumb { 
  background-clip: padding-box;
  background-color: #353535; 
  border-radius: 4px; 
}
/*首屏色调-黑白文字*/
.wrapper.black .tag-black { display: block;}
.wrapper.black .tag-white { display: none;}
.wrapper.white .tag-black { display: none;}
.wrapper.white .tag-white { display: block;}
.wrapper.white .comm-scroll::-webkit-scrollbar-thumb { background-color: #fff;}
.wrapper.white .role-info-slogan p { color: #fff;}
.wrapper.white .role-info-text1 li { color: #a0a0a0;}
.wrapper.white .role-info-text1 li span { color: #919191;}
.wrapper.white .role-info-text2 p { color: #919191;}
.wrapper.black .role-info-audio { background-color: #212121; border: .02rem solid #212121;}
.wrapper.white .role-info-audio { background-color: #222222; border: .02rem solid #3c3c3d;}
.wrapper.black .role-info-audio:hover { background-color: #424242;}
.wrapper.white .role-info-audio:hover { background-color: #424242;}
.inside-page .copygirht_details .copyright_close { display: block;}
.gp-loadingbox{display: block;}