@charset "UTF-8";
body,
dl,
dd,
ul,
ol,
h1,
h2,
h3,
h4,
h5,
h6,
p,
form {
  margin: 0;
}

body,
button,
input,
select,
textarea {
  font-size: 0.24px;
  line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
}

em,
b {
  font-style: normal;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

img {
  vertical-align: middle;
  border: 0;
  padding: 0;
  margin: 0;
}

button,
input,
select,
textarea {
  font-size: 100%;
  outline: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th,
ul,
ol {
  padding: 0;
}

ul,
ol,
dl {
  list-style: none;
}

.gray {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: ' ';
  clear: both;
  height: 0;
}

.clearfix {
  *zoom: 1;
}

html {
  height: 100%;
  overflow: hidden;
  font-size: calc(100vh / 1080);
}

body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #13233a;
  position: relative;
  font: 12px / 1.5 '\5FAE\8F6F\96C5\9ED1',
 tahoma,
 '\5b8b\4f53',
 '\9ED1\4F53',
 sans-serif;
}

* {
  box-sizing: border-box;
}

img {
  object-fit: contain;
}

.btn {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* footer */
#afooter {
  text-align: center;
  line-height: 20rem;
  color: #cccccc;
  background-color: #000;
  padding: 20rem 0;
}

#afooter a {
  color: #cccccc;
}

.nav {
  width: 1897px;
  height: 585px;
  margin: 0 auto;
  position: relative;
  z-index: 5;
  display: flex;
  flex-direction: row;
  justify-content: center;
  transition: height 0.15s linear;
}

.dnfact_nav {
  width: 1500px !important;
}

._act_nav {
  width: 1350px !important;
}

._act_nav li {
  width: 135px !important;
}

._act_btn {
  width: 150px !important;
}

.top-wrap {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

#topNavWrap {
  height: 180px;
}

#topNavWrap .top-mask {
  background-size: 100% !important;
}

.top-wrap .nav {
  width: 1400px !important;
  padding: 0 150px;
}

#topNavWrap .top-link {
  height: 110px !important;
}

#topNavWrap .nav-bg {
  width: 1400px !important;
}

.wrap,
.dnfact_navbg,
.ost,
#afooter,
body {
  overflow-x: hidden;
}

.wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: jsy;
}

.swiper_box_home {
  width: 100%;
  height: 100%;
}

.btn {
  font-family: font1;
}

@font-face {
  font-family: font1;
  src: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/hzst.ttf);
}

@font-face {
  font-family: ks;
  src: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/ks.ttf);
}

@font-face {
  font-family: jsy;
  src: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/jsy.TTF);
}

@font-face {
  font-family: sxt;
  src: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/sxz.woff2);
}

.slide_box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  left: -100rem;
  z-index: 999;
  gap: 10rem;
  transition: all 0.3s linear;
  opacity: 0;
  pointer-events: none;
  outline: none;
  border: none;
}

.slide_box.active {
  left: 60rem;
  opacity: 1;
  pointer-events: auto;
}

.slide_box::after {
  content: '';
  position: absolute;
  left: -60rem;
  top: 50%;
  transform: translateY(-50%);
  width: 335rem !important;
  height: 832rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/slide_bg2.png) center center no-repeat !important;
  background-size: cover !important;
  pointer-events: none;
}

.slide_box a {
  font-size: 25rem;
  height: 60rem;
  line-height: 50rem;
  color: #3948f9;
  position: relative;
  z-index: 2;
  padding-left: 20rem;
  z-index: 2;
}

.slide_box a:first-child::before {
  display: none;
}

.slide_box a::before {
  content: '';
  position: absolute;
  left: -23rem;
  top: -20rem;
  height: 30rem;
  width: 1rem;
  background-color: #3948f9;
}

.slide_box a::after {
  content: '';
  position: absolute;
  left: -34rem;
  top: 50%;
  transform: translateY(-50%);
  width: 23rem;
  height: 18rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/slide_icon1.png) center center no-repeat;
  background-size: contain;
}

.slide_box a:hover, .slide_box a.active {
  padding-left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 202.8rem;
  height: 60rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/slide_item_bg.png) center center no-repeat;
  background-size: 100% 100%;
}

.slide_box a:hover::after, .slide_box a.active::after {
  content: '';
  width: 23rem;
  height: 24rem;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/slide_icon2.png);
}

#_overlay_ {
  height: 100vh !important;
}

.part {
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg0.jpg) center center no-repeat;
  background-size: cover;
}

.part.part1 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg1.jpg);
  z-index: 2;
}

.part.part1 > div {
  z-index: 2;
}

.part.part1 .logo {
  position: absolute;
  top: 40rem;
  left: 40rem;
  z-index: 2;
}

.part.part2 {
  background: transparent;
}

.part.part2 .bg2_box {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  pointer-events: none;
}

.part.part2 .bg2_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none;
}

.part.part2 .bg2_box:first-child {
  display: block;
}

.part.part2 .p1_icon3 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_icon.png);
}

.part.part3 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg3.jpg);
  padding-bottom: 0;
  padding-right: 50rem;
}

.part.part4 {
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg4.jpg) right center no-repeat;
  background-size: cover;
}

.part.part5 {
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg5.jpg) right center no-repeat;
  background-size: cover;
}

.part.part6 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg6.jpg);
  padding-bottom: 150rem;
}

.part.part7 {
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg7.jpg) right center no-repeat;
  background-size: cover;
}

.part.part8 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg8.jpg);
}

.part.part9 {
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg9.jpg) right center no-repeat;
  background-size: cover;
}

.btn_bg1 {
  width: 434rem;
  height: 83rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_bg1.png) center top no-repeat;
  background-size: contain;
  font-size: 46rem;
  color: #fff;
}

.logo {
  width: 320.4rem;
  height: 63.6rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/logo.png) center top no-repeat;
  background-size: contain;
  z-index: 99;
}

.btn_gw {
  width: 177rem;
  height: 54rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_gw.png) center top no-repeat;
  background-size: contain;
  margin-left: 5rem;
  position: absolute;
  top: 20rem;
  right: 20rem;
}

.login_box {
  position: absolute;
  top: 20rem;
  right: 210rem;
  z-index: 2;
  font-size: 18rem;
  color: #0a6ef3;
  text-shadow: 0 0 10rem #fff,
 0 0 10rem #fff,
 0 0 10rem #fff,
 0 0 10rem #fff;
}

.login_box a {
  color: #0a6ef3;
  text-decoration: none;
}

.p1_icon3 {
  width: 60rem;
  height: 43rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p1_icon3.png) center top no-repeat;
  background-size: contain;
  animation: scroll-line 2s ease-in-out infinite;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 10rem;
}

@keyframes scroll-line {
  0%,
  100% {
    transform: translateY(0) translateX(-50%);
    opacity: 0.5;
  }
  50% {
    transform: translateY(-30rem) translateX(-50%);
    opacity: 1;
  }
}

.part1 {
  padding-bottom: 100rem;
  justify-content: end;
}

.part1 .video_kv {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  pointer-events: none;
}

.part1 .video_kv video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.part1 .kv_tit {
  width: 859rem;
  height: 400rem;
  margin-bottom: -40rem;
  position: relative;
  padding-right: 40rem;
}

.part1 .kv_tit img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.part1 .p1_btn {
  width: 397rem;
  height: 101rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p1_btn.png) center top no-repeat;
  background-size: contain;
  margin: 10rem auto;
}

.part1 .tip {
  font-size: 19rem;
  color: #fff;
  text-align: center;
  letter-spacing: 2rem;
}

.part2 {
  /* 静止状态下，仅主卡active hover放大 */
}

.part2 .p2_syz {
  width: 89rem;
  height: 84rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_syz.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: 55%;
  left: 500rem;
  transform: translateY(-50%);
}

.part2 .p2_xyz {
  width: 89rem;
  height: 84rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_xyz.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: 55%;
  right: 500rem;
  transform: translateY(-50%);
}

.part2 .p2_btn1 {
  width: 116rem;
  height: 42rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn1.png) center top no-repeat;
  background-size: contain;
  font-size: 18rem;
  color: #fff;
}

.part2 .p2_btn2 {
  width: 486rem;
  height: 105rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn2.png) center top no-repeat;
  background-size: contain;
}

.part2 .p2_btn {
  width: 331rem;
  height: 93rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
  color: #fff;
  margin-top: 25rem;
}

.part2 .p2_tit {
  width: 1122rem;
  height: 236rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_tit.png) center top no-repeat;
  background-size: contain;
  margin: -40rem auto -20rem;
  position: relative;
}

.part2 .p2_tit .p2_rules {
  width: 26rem;
  height: 26rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_rules.png) center center no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 205rem;
  left: 840rem;
}

.part2 .p2_btn_see {
  width: 436rem;
  height: 140rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn_see.png) center top no-repeat;
  background-size: contain;
  display: flex;
  padding-top: 10rem;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: #303fed;
}

.part2 .p2_btn_see span {
  font-size: 16rem;
  color: #636464;
}

.part2 .p2_btn_see em {
  display: flex;
  justify-content: center;
  font-size: 16rem;
  text-align: center;
  color: #303fed;
}

.part2 .p2_btn_see b {
  position: relative;
  width: fit-content;
  font-size: 24rem;
}

.part2 .p2_btn_see b::after {
  content: '';
  position: absolute;
  right: -75rem;
  top: 42%;
  transform: translateY(-50%);
  width: 68rem;
  height: 22rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn_icon.png) center center no-repeat;
  background-size: 100% 100%;
}

.part2 .p2_btn_see b::before {
  content: '';
  position: absolute;
  left: -75rem;
  top: 42%;
  transform: translateY(-50%) scaleX(-1);
  width: 68rem;
  height: 22rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn_icon.png) center center no-repeat;
  background-size: 100% 100%;
}

.part2 .card_box .card.hover:hover {
  transform: translate3d(0rem, 200rem, 315rem) scale(0.98) rotateX(0deg) rotateY(0deg) !important;
  /* 你可以改放大倍数 */
  transition: transform 0.3s ease !important;
}

.part2 .card_box {
  position: relative;
  width: 100%;
  height: 580rem;
  margin: 60rem auto;
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 2000rem;
  perspective-origin: 50% 42%;
  transform-style: preserve-3d;
}

.part2 .card_box .number {
  opacity: 1;
  position: absolute;
  left: 50%;
  top: 60%;
  transform: translate(-50%, -50%);
  z-index: 4000;
  pointer-events: none;
  font-size: 300rem;
  font-weight: 700;
  color: #d7ecfe;
  letter-spacing: 0.04em;
  -webkit-text-stroke: 3rem #fff;
  white-space: nowrap;
  font-family: ks;
}

.part2 .card_box .card {
  position: absolute;
  left: 48.5%;
  top: 6%;
  width: 398.4rem;
  height: 616.8rem;
  margin-left: -166rem;
  margin-top: -257rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card_suo.png) center center no-repeat;
  background-size: 100% 100%;
  transform-style: preserve-3d;
  transform-origin: 50% 92%;
  cursor: pointer;
  transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.55s ease, z-index 0s linear;
  -webkit-tap-highlight-color: transparent;
  border-radius: 16rem;
}

.part2 .card_box .card .time {
  position: absolute;
  left: 50%;
  top: 67%;
  transform: translate(-50%, -50%);
  font-size: 18rem;
  color: #faf3e7;
}

.part2 .card_box .card.card1.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card1.png);
}

.part2 .card_box .card.card1.on .time {
  display: none;
}

.part2 .card_box .card.card1.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card2.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card2.png);
}

.part2 .card_box .card.card2.on .time {
  display: none;
}

.part2 .card_box .card.card2.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card3.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card3.png);
}

.part2 .card_box .card.card3.on .time {
  display: none;
}

.part2 .card_box .card.card3.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card4.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card4.png);
}

.part2 .card_box .card.card4.on .time {
  display: none;
}

.part2 .card_box .card.card4.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card5.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card5.png);
}

.part2 .card_box .card.card5.on .time {
  display: none;
}

.part2 .card_box .card.card5.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card6.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card6.png);
}

.part2 .card_box .card.card6.on .time {
  display: none;
}

.part2 .card_box .card.card6.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card7.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card7.png);
}

.part2 .card_box .card.card7.on .time {
  display: none;
}

.part2 .card_box .card.card7.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card8.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card8.png);
}

.part2 .card_box .card.card8.on .time {
  display: none;
}

.part2 .card_box .card.card8.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card9.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card9.png);
}

.part2 .card_box .card.card9.on .time {
  display: none;
}

.part2 .card_box .card.card9.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card10.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card10.png);
}

.part2 .card_box .card.card10.on .time {
  display: none;
}

.part2 .card_box .card.card10.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card11.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card11.png);
}

.part2 .card_box .card.card11.on .time {
  display: none;
}

.part2 .card_box .card.card11.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card12.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card12.png);
}

.part2 .card_box .card.card12.on .time {
  display: none;
}

.part2 .card_box .card.card12.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card13.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card13.png);
}

.part2 .card_box .card.card13.on .time {
  display: none;
}

.part2 .card_box .card.card13.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card14.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card14.png);
}

.part2 .card_box .card.card14.on .time {
  display: none;
}

.part2 .card_box .card.card14.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card15.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card15.png);
}

.part2 .card_box .card.card15.on .time {
  display: none;
}

.part2 .card_box .card.card15.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card16.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card16.png);
}

.part2 .card_box .card.card16.on .time {
  display: none;
}

.part2 .card_box .card.card16.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card17.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card17.png);
}

.part2 .card_box .card.card17.on .time {
  display: none;
}

.part2 .card_box .card.card17.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.card18.on {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card18.png);
}

.part2 .card_box .card.card18.on .time {
  display: none;
}

.part2 .card_box .card.card18.on::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 150rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon1.png) center center no-repeat;
  background-size: contain;
  z-index: 3;
}

.part2 .card_box .card.back {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card0.png) !important;
}

.part2 .card_box .card.back::before {
  display: none;
}

.part2 .card_box .card.active {
  animation: card-active-float 1.6s ease-in-out infinite;
}

.part2 .card_box .card.active::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 48%;
  transform: translate(-50%, -50%);
  width: 398.4rem;
  height: 616.8rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card_active.png) center center no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.part2 .card_box .card.black::after {
  content: '';
  position: absolute;
  left: 50%;
  top: -15rem;
  transform: translateX(-50%);
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card_black.png) center center no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
  width: 100%;
  height: 100%;
}

.part2 .card_box .card.red::before {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 81rem;
  width: 139rem;
  height: 13rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card_red_icon2.png) center center no-repeat !important;
  background-size: contain;
  z-index: 3;
}

@keyframes redhx {
  0% {
    transform: scale(0.9);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(0.9);
  }
}

.part2 .btn_box {
  align-items: start;
  margin-top: 10rem;
  gap: 100rem;
}

.part2 .btn_box .p2_prop {
  position: relative;
  padding-bottom: 50rem;
  gap: 35rem;
}

.part2 .btn_box .p2_prop .p2_prop_bg1 {
  width: 486rem;
  height: 104rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_prop_bg1.png) center center no-repeat;
  background-size: 100% 100%;
  gap: 0 10rem;
}

.part2 .btn_box .p2_prop .p2_prop1 {
  position: relative;
  gap: 0 10rem;
}

.part2 .btn_box .p2_prop .p2_prop1 .img_box {
  width: 48rem;
  height: 45rem;
  border: 2rem solid #6d79fb;
  overflow: hidden;
  position: relative;
}

.part2 .btn_box .p2_prop .p2_prop1 .img_box img {
  width: 450%;
  object-fit: contain;
  position: absolute;
  left: 43%;
  top: 3%;
  transform: translate(-50%, -50%);
}

.part2 .btn_box .p2_prop .p2_prop2 {
  position: relative;
  gap: 0 10rem;
}

.part2 .btn_box .p2_prop .p2_prop2 .img_box {
  width: 115rem;
  height: 35rem;
  border: 2rem solid #6d79fb;
  overflow: hidden;
  position: relative;
  background-color: #000;
  margin: 0 auto;
}

.part2 .btn_box .p2_prop .p2_prop2 .img_box img {
  width: 100%;
  object-fit: contain;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.part2 .btn_box .p2_prop .p2_prop2 .p2_btn1 {
  width: 121rem;
  height: 35rem;
  font-size: 18rem;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_btn4.png);
  background-size: 100% 100%;
}

.part2 .btn_box .p2_prop .text {
  font-size: 14rem;
  color: #54597f;
  text-align: center;
  line-height: 1;
}

.part2 .btn_box .p2_prop .tip {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 50rem;
  text-align: center;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p2_prop_tip.png) center center no-repeat;
  background-size: contain;
  bottom: 0;
  font-size: 18rem;
  color: #54597f;
}

/** 主卡轻微上下浮动（与 JS transform 并行，仅改 margin-top） */
@keyframes card-active-float {
  0%,
  100% {
    margin-top: -244.5rem;
  }
  50% {
    margin-top: -262.5rem;
  }
}

.p3_btn {
  width: 377rem;
  height: 93rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_btn.png) center top no-repeat;
  background-size: contain;
  font-size: 24rem;
  color: #fff;
}

.p3_btn.active .p3_suo {
  display: none;
}

.p3_btn .p3_suo {
  width: 21.6rem;
  height: 24.3rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_suo.png) center top no-repeat;
  background-size: contain;
  display: flex;
  margin-right: 10rem;
}

.part3 .p3_tit {
  width: 900rem;
  height: 157rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_tit.png) center top no-repeat;
  background-size: contain;
  margin-top: 25rem;
}

.part3 .p3_ch_tit {
  width: 340rem;
  height: 27rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_ch_tit.png) center top no-repeat;
  background-size: contain;
}

.part3 .p_con {
  position: relative;
  z-index: 2;
}

.part3 .p_con .p3_bg {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.part3 .p_con .prop {
  margin-top: 20rem;
  position: relative;
  width: 262rem;
  height: 238rem;
}

.part3 .p_con .prop::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 280rem;
  height: 255rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_img_icon.png) center center no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.part3 .p_con .prop > div {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  border: 2rem solid #f2d799;
}

.part3 .p_con .prop img {
  position: absolute;
  left: 50%;
  top: 45%;
  transform: translate(-50%, -50%);
  width: 100%;
  object-fit: contain;
}

.part3 .p_con .prop_name {
  font-size: 24rem;
  color: #303fed;
  margin-top: 50rem;
}

.part3 .p_con .rulse {
  margin-top: 15rem;
}

.part3 .p_con .rulse .rulse_tit {
  width: 131rem;
  height: 22rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_tit_s.png) center top no-repeat;
  background-size: contain;
  margin: 0 auto;
  margin-top: 20rem;
  margin-bottom: 10rem;
}

.part3 .p_con .rulse p {
  font-size: 18rem;
  color: #2d3048;
  padding-left: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 5rem 0;
  text-align: center;
}

.part3 .p_con .rulse p .p3_1 {
  width: 22rem;
  height: 22rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_1.png) center top no-repeat;
  background-size: contain;
  display: inline-block;
  vertical-align: middle;
  margin-right: 5rem;
}

.part3 .p_con .rulse p .p3_2 {
  width: 22rem;
  height: 22rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_2.png) center top no-repeat;
  background-size: contain;
  display: inline-block;
  vertical-align: middle;
  margin-right: 5rem;
}

.part3 .p_con .tip {
  font-size: 16rem;
  color: #424561;
  margin-top: 10rem;
  text-align: center;
}

.part3 .btn_box {
  margin-top: 5rem;
}

.part3 .btn_box a {
  letter-spacing: 5rem;
}

.part3 .p3_cos {
  width: 1180rem;
  height: 921rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_cos.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  right: 0;
  pointer-events: none;
}

.part4 * {
  position: relative;
  z-index: 2;
}

.part4 .p4_tit {
  width: 824rem;
  height: 236rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_tit.png) center top no-repeat;
  background-size: contain;
  margin-top: -90rem;
}

.part4 .card_con {
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 0 20rem;
  margin-top: 20rem;
}

.part4 .card_con .card {
  transition: all 0.3s ease-in-out;
}

.part4 .card_con .card:hover {
  transform: scale(1.05);
}

.part4 .card_con .card .card_img {
  width: 253rem;
  height: 478rem;
}

.part4 .card_con .card .card_img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.part4 .card_con .card .card_tit1 {
  width: 100%;
  height: 74rem;
  margin-top: 20rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_tit1.png) left center no-repeat;
  background-size: contain;
}

.part4 .card_con .card .card_tit2 {
  width: 100%;
  height: 74rem;
  margin-top: 20rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_tit2.png) left center no-repeat;
  background-size: contain;
}

.part4 .card_con .card .card_tit3 {
  width: 100%;
  height: 74rem;
  margin-top: 20rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_tit3.png) left center no-repeat;
  background-size: contain;
}

.part4 .card_con .card .card_tit4 {
  width: 100%;
  height: 74rem;
  margin-top: 20rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_tit4.png) left center no-repeat;
  background-size: contain;
}

.part4 .card_con .card .card_desc {
  height: 83rem;
  font-size: 16rem;
  color: #282828;
  padding: 0 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.part4 .card_con .card:nth-child(2n) {
  margin-top: 60rem;
}

.part4 .card_con .p4_btn {
  width: 350rem;
  height: 59rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_btn.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
  color: #fff;
}

.part4 .p4_cos {
  width: 888rem;
  height: 954rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p4_cos.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  right: 0;
  pointer-events: none;
  z-index: 1;
}

.p1_slide_btn {
  width: 46rem;
  height: 88rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p1_slide_btn.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 20rem;
  transform: translateY(-50%);
  z-index: 2;
}

.part5 * {
  position: relative;
  z-index: 2;
}

.part5 .p5_tit {
  width: 1000rem;
  height: 236rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_tit.png) center top no-repeat;
  background-size: contain;
  margin: -40rem auto;
}

.part5 .p_con {
  width: 1200rem;
  height: 500rem;
  margin: 0 auto;
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-top: 80rem;
}

.part5 .p_con .con_box {
  width: 810rem;
  height: 508rem;
  background-color: #18181b;
}

.part5 .p_con .con_box::after {
  content: '';
  width: 831rem;
  height: 530rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_video_icon2.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50.1%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 2;
}

.part5 .p_con .con_box .iframe_box {
  width: 100%;
  height: 100%;
}

.part5 .p_con .con_box .iframe_box iframe,
.part5 .p_con .con_box .iframe_box video {
  width: 100%;
  height: 100%;
  border: none;
}

.part5 .p_con .con_box .btn_box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.part5 .p_con .con_box .btn_box .text {
  font-size: 24rem;
  color: #2c3bec;
  margin: 10rem 0;
  text-align: center;
}

.part5 .p_con .con_box .btn_box .time {
  font-size: 20rem;
  text-align: center;
  display: flex;
  align-items: end;
  justify-content: center;
  margin-top: 30rem;
  line-height: 1;
  background: linear-gradient(to bottom, #f4dca8, #fdf9f1);
  /* 从上红到下蓝 */
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.part5 .p_con .con_box .btn_box .time span {
  font-size: 91rem;
  font-family: ks;
  line-height: 0.8;
  background: linear-gradient(to bottom, #f4dca8, #fdf9f1);
  /* 从上红到下蓝 */
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.part5 .p_con .con_box .p5_play {
  width: 84rem;
  height: 84rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_play.png) center top no-repeat;
  background-size: contain;
  margin: 0 auto;
}

.part5 .p_con .r {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 5rem;
}

.part5 .p_con .r .img_box {
  position: relative;
  width: 374rem;
}

.part5 .p_con .r .img_box img {
  width: 374rem;
  object-fit: contain;
}

.part5 .p_con .r .img_box .text_box {
  width: 100%;
  position: absolute;
  top: 42%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 2;
}

.part5 .p_con .r .img_box .text_box .tit {
  font-size: 20rem;
  color: #3a49f9;
  margin-bottom: 10rem;
}

.part5 .p_con .r .img_box .text_box .tit span {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 15rem;
  color: #353535;
  position: relative;
}

.part5 .p_con .r .img_box .text_box .tit span .p5_icon {
  width: 18rem;
  height: 18rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_icon.png) center top no-repeat;
  background-size: contain;
  margin-left: 5rem;
}

.part5 .p_con .r .img_box .text_box .img_box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30rem;
}

.part5 .p_con .r .img_box .text_box .img_box > div {
  border: 1rem solid #3a49f9;
}

.part5 .p_con .r .img_box .text_box .img_box .gif_box {
  width: 123rem;
  height: 113rem;
  position: relative;
  overflow: hidden;
}

.part5 .p_con .r .img_box .text_box .img_box .gif_box img {
  width: 200%;
  object-fit: contain;
  position: absolute;
  top: 5%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.part5 .p_con .r .img_box .text_box .name {
  font-size: 15rem;
  height: 30rem;
  line-height: 30rem;
  color: #3a49f9;
  text-align: center;
  border-top: 1rem solid #3a49f9;
}

.part5 .p_con .r .img_box .text_box .desc {
  font-size: 18rem;
  color: #f4dca7;
}

.part5 .p_con .r .img_box .btn_box {
  position: absolute;
  bottom: 35rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 10rem;
}

.part5 .p_con .r .r_b {
  width: 373rem;
  height: 200rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_btn1.png) center top no-repeat;
  background-size: 100% 100%;
  flex-direction: column;
  padding: 10rem;
}

.part5 .p_con .r .r_b .p5_tit3 {
  width: 100%;
  height: 61rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_tit3.png) center top no-repeat;
  background-size: contain;
}

.part5 .p_con .r .r_b p {
  font-size: 18rem;
  color: #353535;
  text-align: center;
}

.part5 .p_con .r .r_b .p5_btn1 {
  width: 202rem;
  height: 53rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p3_btn.png) center top no-repeat;
  background-size: contain;
  font-size: 20rem;
  color: #fff;
}

.card_ani {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.7);
  display: none;
}

.card_ani canvas {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.part6 * {
  position: relative;
  z-index: 2;
}

.part6 .p6_tit {
  width: 1000rem;
  height: 236rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p6_tit.png) center top no-repeat;
  background-size: contain;
  margin: -40rem auto;
}

.part6 .p6_tit1 {
  width: 200rem;
  height: 74rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p6_tit1.png) center top no-repeat;
  background-size: contain;
}

.part6 .p6_tit2 {
  width: 200rem;
  height: 74rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p6_tit2.png) center top no-repeat;
  background-size: contain;
}

.part6 .p_con {
  margin: 0 auto;
  margin-top: 90rem;
  display: flex;
  gap: 20rem 20rem;
}

.part6 .p_con .p6_card {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20rem 20rem;
}

.part6 .p_con .p6_card .con {
  width: 410rem;
  padding: 0 10rem;
}

.part6 .p_con .p6_card .img_box {
  width: 561rem;
  height: 467rem;
}

.part6 .p_con .p6_card .img_box img {
  width: 100%;
  object-fit: contain;
}

.part6 .p_con .p6_card .tit {
  font-size: 46rem;
  color: #2434ca;
  margin-left: -15rem;
}

.part6 .p_con .p6_card .desc {
  font-size: 18rem;
  color: #494c67;
  height: 120rem;
}

.part6 .p_con .p6_card .btn_box {
  justify-content: start;
}

.part6 .p_con .p6_card .p6_btn {
  width: 193rem;
  height: 52rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p6_btn.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
  font-weight: 600;
  color: #fff;
}

.part6 .p6_cos {
  width: 1486rem;
  height: 1080rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_cos.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -20rem;
  right: 0;
  pointer-events: none;
  z-index: 1;
}

.part6 .p_tip {
  font-size: 18rem;
  color: #494c67;
}

.part7 * {
  position: relative;
  z-index: 2;
}

.part7 .p7_tit {
  width: 1000rem;
  height: 236rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p7_tit.png) center top no-repeat;
  background-size: contain;
  margin: -40rem auto;
}

.part7 .p_con {
  margin: 0 auto;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-top: 30rem;
}

.part7 .p_con .p7_tab_box {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14rem;
  flex-wrap: wrap;
  width: 1100rem;
}

.part7 .p_con .p7_tab_box a:first-child {
  margin-left: 50rem;
}

.part7 .p_con .p7_tab_box a:nth-child(4) {
  margin-right: 50rem;
}

.part7 .p_con .p7_tab_box a {
  width: 204rem;
  height: 63rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_tab.png) center top no-repeat;
  background-size: contain;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10rem;
  font-size: 18rem;
  color: #474b5d;
}

.part7 .p_con .p7_tab_box a.active, .part7 .p_con .p7_tab_box a:hover {
  height: 65rem;
  color: #fff;
  margin: -1rem 0;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_tab_active.png);
}

.part7 .p_con .p7_tab_box a.active:first-child, .part7 .p_con .p7_tab_box a:hover:first-child {
  margin-left: 50rem;
}

.part7 .p_con .p7_tab_box a.active:nth-child(4), .part7 .p_con .p7_tab_box a:hover:nth-child(4) {
  margin-right: 50rem;
}

.part7 .p_con .p7_tab_con {
  z-index: 23;
  margin-top: 30rem;
}

.part7 .p_con .p7_tab_con a {
  display: none;
}

.part7 .p_con .p7_tab_con a.active {
  display: block;
}

.part7 .p_con .p7_tab_con a img {
  width: 992rem;
  height: 539rem;
  object-fit: contain;
}

.part7 .p5_cos {
  width: 1486rem;
  height: 1080rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_cos.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -20rem;
  right: 0;
  pointer-events: none;
  z-index: 1;
}

.part8 * {
  position: relative;
  z-index: 2;
}

.part8 .p5_cos {
  width: 1486rem;
  height: 1080rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_cos.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -20rem;
  right: 0;
  pointer-events: none;
  z-index: 1;
}

.part8 .p8_tit {
  width: 700rem;
  height: 62rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p8_tit.png) center top no-repeat;
  background-size: contain;
}

.part8 .p8_rules {
  width: 1120rem;
  height: calc(100vh - 62rem - 100rem);
  max-height: 850rem;
  overflow: hidden;
  overflow-y: auto;
  margin-top: 30rem;
  padding-right: 10rem;
}

.part8 .p8_rules::-webkit-scrollbar {
  width: 5rem;
  background: rgba(0, 0, 0, 0.2);
}

.part8 .p8_rules::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.5);
}

.part8 .p8_rules p {
  font-size: 18rem;
  color: #fff;
  text-align: left;
  margin-top: 10rem;
}

.part8 .p8_rules p em {
  margin-left: 30rem;
}

.part8 .p8_rules p a {
  color: #ffb135;
  text-decoration: underline;
}

.part8 .p8_rules p b {
  color: #ffb135;
}

.part8 .p8_rules table {
  width: 1030rem;
  margin: 10rem auto;
  border: 1rem solid #fff;
  border-collapse: collapse;
}

.part8 .p8_rules table th {
  font-size: 18rem;
  color: #424fad;
  background-color: #fff;
  text-align: center;
  padding: 5rem;
  font-size: 18rem;
  border: 1rem solid #526eea;
}

.part8 .p8_rules table td {
  background-color: #424fad;
  text-align: center;
  color: #fff;
  padding: 5rem;
  font-size: 18rem;
  border: 1rem solid #526eea;
}

.part9 .p9_tit {
  width: 900rem;
  height: 236rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p9_tit.png) center top no-repeat;
  background-size: contain;
}

.part9 .p9_tip {
  width: 764rem;
  height: 41rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p9_tip.png) center top no-repeat;
  background-size: contain;
  margin: 0 auto;
}

.part9 .p9_btn1 {
  width: 208rem;
  height: 55rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p9_btn1.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
}

.part9 .p9_video_box {
  margin-top: 30rem;
  gap: 10rem;
  padding-right: 400rem;
  flex-direction: column;
}

.part9 .tip {
  font-size: 23rem;
  color: #2537c6;
  text-align: center;
  margin-top: 20rem;
  padding-right: 400rem;
}

.part9 .video_box {
  width: 815rem;
  height: 481rem;
  background-color: #050824;
  position: relative;
}

.part9 .video_box::after {
  content: '';
  width: 832rem;
  height: 499rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p9_video_icon.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 3;
}

.part9 .video_box .p9_play {
  width: 84rem;
  height: 84rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p5_play.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 4;
}

.part9 .iframe_box {
  width: 100%;
  height: 100%;
}

.part9 .iframe_box iframe,
.part9 .iframe_box video, .part9 .iframe_box > div {
  width: 99%;
  height: 99%;
  border: none;
}

.part9 .img_box {
  width: 372rem;
  height: 499rem;
}

.part9 .img_box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.part10 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  padding-bottom: 100rem;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg10.jpg);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
}

.part10 > * {
  z-index: 2;
}

.part10 .part10_video_box {
  width: 100%;
  height: 100%;
  position: absolute;
  pointer-events: none;
  top: 0;
  left: 0;
  z-index: 1;
}

.part10 .part10_video_box canvas,
.part10 .part10_video_box img,
.part10 .part10_video_box video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.part10.active {
  opacity: 1;
  pointer-events: auto;
}

.part10 .p0_btn_bg {
  width: 273rem;
  height: 67rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_btn_bg.png) center center no-repeat;
  background-size: contain;
  font-size: 27rem;
  color: #fff;
  letter-spacing: 5rem;
  line-height: 1;
  flex-wrap: wrap;
  padding: 15rem;
  position: relative;
}

.part10 .p0_btn_bg span {
  font-size: 12rem;
  font-family: kz;
  letter-spacing: normal;
}

.part10 .p0_btn_bg.active {
  color: #1f1f1f;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_btn_bg2.png);
}

.part10 .p0_btn_bg.gray {
  filter: grayscale(1);
  color: #fff;
  -webkit-filter: grayscale(1);
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_btn_bg.png) center center no-repeat;
  background-size: contain;
}

.part10 .prop {
  position: relative;
  width: 336rem;
  height: 232rem;
}

.part10 .prop img {
  width: 336rem;
  object-fit: contain;
}

.part10 .prop .img_box {
  position: absolute;
  bottom: 32rem;
  left: 2rem;
  width: 158rem;
  height: 62rem;
  overflow: hidden;
}

.part10 .prop .img_box img {
  width: 100%;
  object-fit: contain;
  position: absolute;
  top: 21%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.part10 .prop .img_box2 {
  left: auto;
  right: 3rem;
}

.part10 .p0_tit {
  width: 594rem;
  height: 96rem;
  margin: 0 auto 0;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_tit.png) center top no-repeat;
  background-size: contain;
  position: relative;
}

.part10 .p0_btn1 {
  width: 91rem;
  height: 115rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_btn1.png) center center no-repeat;
  background-size: contain;
  font-size: 18rem;
  color: #fff;
}

.part10 .p0_btn2 {
  width: 91rem;
  height: 115rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_btn2.png) center center no-repeat;
  background-size: contain;
  font-size: 18rem;
  color: #fff;
}

.part10 .p0_btn3 {
  width: 91rem;
  height: 115rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_btn3.png) center center no-repeat;
  background-size: contain;
  font-size: 18rem;
  color: #fff;
}

.part10 .p0_bg {
  width: 403rem;
  height: 615rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p0_bg.png) center top no-repeat;
  background-size: contain;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 30rem;
  gap: 10rem;
  position: relative;
}

.part10 .p0_bg .inp_box {
  display: flex;
  align-items: center;
  justify-content: center;
}

.part10 .p0_bg .inp_box input {
  padding: 0 10rem;
}

.part10 .p0_bg .inp_box2 {
  gap: 0 5rem;
}

.part10 .p0_bg .inp_box2 input {
  width: 155rem;
}

.part10 .p0_bg input {
  background: none;
  border: 1rem solid #303fed;
  font-size: 20rem;
  color: #676ca1;
  width: 272rem;
  height: 43rem;
  background-color: #fff;
  border-radius: 8rem;
}

.part10 .p0_bg input:placeholder {
  color: #676ca1;
}

.part10 .p0_bg .btn_yzm {
  border: 1rem solid #cbaa5d;
  width: 113rem;
  height: 43rem;
  font-size: 20rem;
  background-color: #f2d799;
  color: #383a55;
  border-radius: 8rem;
  font-family: kz;
}

.part10 .p0_bg .label {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 1rem;
  font-size: 16rem;
  color: #fff;
}

.part10 .p0_bg .label input {
  width: 15rem;
  height: 15rem;
  border: 1rem solid #303fed;
  margin: 0;
  margin-top: -1rem;
  margin-right: 5rem;
}

.part10 .p0_bg .label a {
  color: #fff;
  text-decoration: underline;
}

.part10 .p0_btn_box {
  position: relative;
  width: 450rem;
  height: 580rem;
  margin: 0 50rem;
}

.part10 .p0_btn_box a {
  display: block;
  animation: p0_btn_move 1.5s infinite;
}

.part10 .p0_btn_box .p0_btn1 {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.part10 .p0_btn_box .p0_btn2 {
  position: absolute;
  right: 0;
  top: 30%;
  transform: translateY(-50%);
}

.part10 .p0_btn_box .p0_btn3 {
  position: absolute;
  right: 0;
  top: 80%;
  transform: translateY(-50%);
}

@keyframes p0_btn_move {
  0% {
    transform: scale(1) translateY(-50%);
  }
  50% {
    transform: scale(1.1) translateY(-50%);
  }
  100% {
    transform: scale(1) translateY(-50%);
  }
}

.part10 .p0_tip {
  width: 383rem;
  margin: 0 auto;
  margin-top: 30rem;
  font-size: 16rem;
  color: #fff;
  text-align: center;
  position: relative;
}

.part10 .p0_tip a {
  color: #fff;
  text-decoration: underline;
}

.part10 .btn_back {
  width: 196rem;
  height: 63rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_back.png) center center no-repeat;
  background-size: contain;
  position: absolute;
  top: 30rem;
  left: 30rem;
}

.part11 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/bg11.jpg);
}

.part11 .p11_tit {
  width: 836rem;
  height: 236rem;
  margin: 0 auto 0;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p11_tit.png) center top no-repeat;
  background-size: contain;
  position: relative;
  margin-bottom: 30rem;
}

.part11 .tit11_1 {
  width: 250rem;
  height: 116rem;
  margin: 0 auto 0;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/tit11_1.png) center top no-repeat;
  background-size: contain;
  position: relative;
}

.part11 .tit11_2 {
  width: 250rem;
  height: 116rem;
  margin: 0 auto 0;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/tit11_2.png) center top no-repeat;
  background-size: contain;
  position: relative;
}

.part11 .tit11_3 {
  width: 250rem;
  height: 116rem;
  margin: 0 auto 0;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/tit11_3.png) center top no-repeat;
  background-size: contain;
  position: relative;
}

.part11 .p_con {
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 20rem;
}

.part11 .p_con .item {
  width: 359rem;
  height: 579rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/p11_bg.png) center top no-repeat;
  background-size: contain;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: start;
  gap: 10rem;
  padding: 40rem 0;
  text-align: center;
}

.part11 .p_con .text, .part11 .p_con .tip {
  font-size: 22rem;
  color: #373847;
  padding: 0 30rem;
  line-height: 1.2;
  transform: scaleY(20rem);
}

.part11 .p_con .text span, .part11 .p_con .tip span {
  color: #3d4bfc;
}

.part11 .p_con .text {
  padding-top: 20rem;
  height: 142rem;
}

.part11 .p_con .ewm_box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 158rem;
  height: 158rem;
  background-color: #f2f2f2;
  border: 1rem solid #3d4bfc;
}

.part11 .p_con .ewm_box img {
  width: 135rem;
  height: 135rem;
  object-fit: contain;
}

.section-foot {
  height: auto !important;
}

.dia_btn_bg {
  width: 205rem;
  height: 50rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn_bg.png) center center no-repeat;
  background-size: contain;
  font-size: 18rem;
  color: #fff;
  font-family: font1;
}

.dia_btn_bg.active {
  filter: grayscale(1);
  -webkit-filter: grayscale(1);
}

.dia {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  z-index: 9;
}

.dia .dia_close {
  width: 64rem;
  height: 64rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_close.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: -30rem;
  right: -70rem;
}

.dia_tit2 {
  width: 405rem;
  height: 85rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit2.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
  font-size: 0;
}

.dia_tit3 {
  width: 405rem;
  height: 85rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit3.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
  font-size: 0;
}

.dia_tit4 {
  width: 510rem;
  height: 85rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit4.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
  font-size: 0;
}

.dia_tit5 {
  width: 546rem;
  height: 85rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit5.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
  font-size: 0;
}

.dia_tit6 {
  width: 554rem;
  height: 85rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit6.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
  font-size: 0;
}

.pop1 {
  width: 704rem;
  min-height: 400rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_bg1.png) center top no-repeat;
  background-size: 100% 100%;
  padding: 30rem 20rem;
}

.pop1 .dia_tit {
  color: #303fed;
  margin-top: 30rem;
  text-align: center;
  font-size: 30rem;
  position: relative;
  width: fit-content;
  margin: 0 auto;
}

.pop1 .dia_tit::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -25rem;
  width: 17rem;
  height: 32rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit_icon1.png) center top no-repeat;
  background-size: contain;
}

.pop1 .dia_tit::before {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -25rem;
  width: 17rem;
  height: 32rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit_icon2.png) center top no-repeat;
  background-size: contain;
}

.pop1 .dl_box {
  gap: 20rem;
  margin-top: 30rem;
}

.pop1 .dl_box a {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10rem;
  width: 159rem;
  height: 155rem;
  border-radius: 16rem;
}

.pop1 .dl_box a.active, .pop1 .dl_box a:hover {
  border: 1rem solid #303fed;
}

.pop1 .dl_box a img {
  height: 80rem;
  object-fit: contain;
}

.pop1 .dl_box a span {
  font-size: 20rem;
  color: #303fed;
  text-align: center;
}

.pop1 .dl_tip {
  text-align: center;
  font-size: 18rem;
  color: #000000;
  margin-top: 30rem;
}

.pop1 .dl_tip a {
  color: #3a48f9;
}

.dia_btn_bg1 {
  width: 176rem;
  height: 53rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn_bg1.png) center top no-repeat;
  background-size: contain;
  font-size: 25rem;
  color: #fff;
  letter-spacing: 10rem;
  text-align: center;
}

.dia_btn_bg2 {
  width: 276rem;
  height: 67rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn_bg2.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
  color: #fff;
}

.pop2 .label {
  width: fit-content;
  position: relative;
  max-width: 425rem;
  font-size: 18rem;
  color: #1b191c;
  margin: 0 auto;
  margin-top: 20rem;
}

.pop2 .label a {
  position: absolute;
  top: 5rem;
  left: -30rem;
  width: 20rem;
  height: 20rem;
  border: 1rem solid #303fed;
  border-radius: 50%;
}

.pop2 .label a.active::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 12rem;
  height: 12rem;
  background-color: #303fed;
}

.pop2 .select_box .item {
  border-radius: 8rem;
  width: 407rem;
  height: 53rem;
  border: 1rem solid #303fed;
  position: relative;
  margin: 20rem auto;
}

.pop2 .select_box .item::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20rem;
  width: 21rem;
  height: 10rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/input_icon.png) center top no-repeat;
  background-size: contain;
}

.pop2 .select_box .item select {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: none;
  outline: none;
  font-size: 20rem;
  color: #1b191c;
  padding: 0 16rem;
  appearance: none;
}

.pop2 .btn_box {
  gap: 0 20rem;
  margin-top: 30rem;
}

.pop3 {
  padding-bottom: 60rem;
}

.pop3 .tips {
  width: 407rem;
  height: 53rem;
  background-color: #ffdd8d;
  border: 1rem solid #ffb135;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2e2e2f;
  font-size: 20rem;
  border-radius: 6rem;
  margin: 10rem auto 20rem;
}

.pop3 h3 {
  font-size: 18rem;
  color: #7076b1;
  text-align: center;
  margin: 10rem auto;
}

.pop3 .phone-desc {
  font-size: 16rem;
  color: #676ca1;
  text-align: center;
  margin-bottom: 10rem;
}

.pop3 .phone-form {
  display: flex;
  flex-direction: column;
  gap: 20rem;
  width: 407rem;
  margin: 0 auto;
}

.pop3 input::placeholder {
  color: #1b191c;
}

.pop3 .phone-input {
  width: 407rem;
  height: 53rem;
  font-size: 20rem;
  color: #1b191c;
  border: 1rem solid #303fed;
  border-radius: 6rem;
  background-color: transparent;
  text-align: center;
}

.pop3 .code-row {
  display: grid;
  grid-template-columns: 1fr auto;
}

.pop3 .code-row .code-input-sm {
  width: 187rem;
  height: 53rem;
  font-size: 20rem;
  color: #1b191c;
  border: 1rem solid #303fed;
  border-radius: 6rem;
  background-color: transparent;
  padding: 0 20rem;
}

.pop3 .code-row .send-code-btn {
  font-size: 20rem;
  color: #fff;
  width: 211rem;
  height: 53rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/yzm_btn_bg.png) center top no-repeat;
  background-size: contain;
  border: 0 solid #000;
  cursor: pointer;
}

.pop3 .phone-agree {
  display: flex;
  align-items: flex-start;
  gap: 8rem;
  margin-top: 6rem;
  text-align: left;
  cursor: pointer;
  user-select: none;
  width: 425rem;
  margin: 0 auto;
}

.pop3 .phone-agree input[type='checkbox'] {
  flex-shrink: 0;
  width: 20rem;
  height: 20rem;
  border-radius: 50%;
  border: 1rem solid #303fed;
}

.pop3 .phone-agree .phone-agree-text {
  font-size: 16rem;
  color: #676ca1;
}

.pop3 .phone-agree .phone-agree-text b {
  color: #1b68fd;
}

.pop3 .phone-submit {
  display: block;
  margin: 0 auto;
  border: 0 solid #000;
  cursor: pointer;
}

.pop3 .phone-tip {
  font-size: 16rem;
  color: #676ca1;
  text-align: center;
  margin-top: 5rem;
}

.pop_card .card_ani {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 236rem;
  height: 489rem;
  perspective: 1000rem;
}

.pop_card .card_ani > div {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card1.png) center top no-repeat;
  background-size: contain;
}

.pop_card .card_ani > div.card1 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card1.png);
}

.pop_card .card_ani > div.card2 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card2.png);
}

.pop_card .card_ani > div.card3 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card3.png);
}

.pop_card .card_ani > div.card4 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card4.png);
}

.pop_card .card_ani > div.card5 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card5.png);
}

.pop_card .card_ani > div.card6 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card6.png);
}

.pop_card .card_ani > div.card7 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card7.png);
}

.pop_card .card_ani > div.card8 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card8.png);
}

.pop_card .card_ani > div.card9 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card9.png);
}

.pop_card .card_ani > div.card10 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card10.png);
}

.pop_card .card_ani > div.card11 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card11.png);
}

.pop_card .card_ani > div.card12 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card12.png);
}

.pop_card .card_ani > div.card13 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card13.png);
}

.pop_card .card_ani > div.card14 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card14.png);
}

.pop_card .card_ani > div.card15 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card15.png);
}

.pop_card .card_ani > div.card16 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card16.png);
}

.pop_card .card_ani > div.card17 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card17.png);
}

.pop_card .card_ani > div.card18 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/card/card18.png);
}

.pop_card .card_info {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
  width: 1114rem;
  height: 631rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_bg2.png) center top no-repeat;
  background-size: contain;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 20rem;
}

.pop_card .card_info .card_img {
  width: 598rem;
  height: 100%;
  position: relative;
}

.pop_card .card_info .card_img img {
  width: 598rem;
  height: 549rem;
  object-fit: contain;
  position: absolute;
  left: 50%;
  top: 49%;
  transform: translate(-50%, -50%);
}

.pop_card .card_info .card_img .day {
  position: absolute;
  left: 50%;
  top: 65rem;
  transform: translateX(-50%);
  font-size: 20rem;
  line-height: 1;
  color: #fff;
  border-radius: 20rem;
  padding: 0 20rem;
  font-family: ks;
  z-index: 2;
}

.pop_card .card_info .card_img .time {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 50rem;
  transform: translateX(-50%);
  font-size: 89rem;
  color: #fff;
  font-family: ks;
}

.pop_card .card_info .info {
  width: 440rem;
  max-height: 600rem;
  overflow-y: auto;
  padding-right: 10rem;
  position: relative;
  z-index: 2;
}

.pop_card .card_info .info::-webkit-scrollbar {
  width: 5rem;
  border-radius: 5rem;
  height: 0;
  background-color: transparent;
}

.pop_card .card_info .info::-webkit-scrollbar-thumb {
  background-color: #303fed;
  border-radius: 5rem;
}

.pop_card .card_info .info .name {
  width: fit-content;
  font-size: 51rem;
  color: #303fed;
  position: relative;
  line-height: 1;
  font-weight: 600;
}

.pop_card .card_info .info .name::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -269rem;
  width: 259rem;
  height: 10rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/cos_name_icon.png) center top no-repeat;
  background-size: contain;
}

.pop_card .card_info .info .date {
  font-size: 30rem;
  color: #303fed;
  margin-top: 20rem;
  line-height: 1;
}

.pop_card .card_info .info .tit {
  color: #fff;
  margin-top: 10rem;
  text-align: center;
  font-size: 18rem;
  position: relative;
  width: fit-content;
  padding: 5rem 30rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  background-color: #303fed;
  border-radius: 13rem;
}

.pop_card .card_info .info .tit::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 10rem;
  width: 9rem;
  height: 9rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/cos_tit_icon.png) center top no-repeat;
  background-size: contain;
}

.pop_card .card_info .info .tit::before {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 10rem;
  width: 9rem;
  height: 9rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/cos_tit_icon.png) center top no-repeat;
  background-size: contain;
}

.pop_card .card_info .info .btn_box {
  justify-content: start;
  margin: 10rem 0;
}

.pop_card .card_info .info .desc {
  font-size: 16rem;
  color: #424561;
  text-align: left;
  margin-top: 5rem;
}

.pop_card .card_info .info .desc b {
  color: #303fed;
  font-weight: 600;
}

.pop_card .card_info .info .zb_box {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-top: 10rem;
  gap: 20rem;
}

.pop_card .card_info .info .zb_box .zb_icon {
  width: 86rem;
  height: 86rem;
  background-color: #282828;
  border: 1rem solid #2b3aeb;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pop_card .card_info .info .zb_box .zb_icon img {
  width: 95%;
  height: 95%;
  object-fit: contain;
}

.pop_card .card_info .info .zb_box .zb_name {
  font-size: 16rem;
  color: #2b3aeb;
  text-align: center;
}

.pop_card .btn_box {
  gap: 0 60rem;
}

.pop_card .btn_box .dia_btn_bg {
  width: 272rem;
  height: 67rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn_bg.png) center top no-repeat;
  background-size: contain;
  font-size: 33rem;
  letter-spacing: 9rem;
}

.pop_card .btn_box .hy_prop {
  width: 222rem;
  height: 65rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/hy_prop.png) center top no-repeat;
  background-size: contain;
  display: flex;
  align-items: center;
  justify-content: start;
  padding-left: 8rem;
  gap: 0 10rem;
}

.pop_card .btn_box .hy_prop .prop {
  width: 48rem;
  height: 48rem;
  background-color: #000;
  overflow: hidden;
  position: relative;
}

.pop_card .btn_box .hy_prop .prop img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.pop_card .btn_box .hy_prop .prop img.gif {
  width: 400%;
  height: 400%;
  top: 18%;
  left: 45%;
}

.pop_card .btn_box .hy_prop .time {
  font-size: 24rem;
  color: #fff;
  font-weight: 600;
  font-family: ks;
  transform: scaleY(2);
}

@keyframes flipCard {
  0% {
    transform: rotateY(0deg);
  }
  90% {
    transform: rotateY(360deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}

.btn_wdxz {
  width: 152rem;
  height: 48rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_wdxz.png) center top no-repeat;
  background-size: contain;
}

.btn_yyxqd {
  width: 152rem;
  height: 48rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_yyxqd.png) center top no-repeat;
  background-size: contain;
}

.btn_wdxz2 {
  width: 152rem;
  height: 48rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_wdxz2.png) center top no-repeat;
  background-size: contain;
}

.btn_yyxqd2 {
  width: 152rem;
  height: 48rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_yyxqd2.png) center top no-repeat;
  background-size: contain;
}

.pop_hy .qjf_img {
  width: 1024rem;
  height: 589rem;
  object-fit: contain;
  margin: 0 auto;
  display: block;
  position: absolute;
}

.pop_hy #qjf_box {
  width: 1034rem;
  height: 646rem;
  padding-top: 1rem;
  padding-right: 5rem;
}

.pop_hy .qjf_box_con {
  width: 945rem;
  height: 533rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/qjf_img.jpg) center top no-repeat;
  background-size: contain;
  margin: 40rem auto 80rem;
  display: block;
  position: relative;
  z-index: 2;
}

.pop_hy .qjf_box_con .name_date {
  width: 100%;
  height: 60rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10rem;
  font-size: 24rem;
  color: #1f303f;
  position: absolute;
  bottom: -54rem;
  left: 0;
  font-family: sxt;
  z-index: 3;
}

.pop_hy .qjf_box_con .name_date .date {
  position: relative;
}

.pop_hy .qjf_box_con .name_date .date::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateX(-50%);
  left: -40rem;
  width: 50rem;
  height: 1rem;
  background-color: #1f303f;
}

.pop_hy .qjf_box_con .hy_ani {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.pop_hy .qjf_box_con .hy_ani canvas {
  width: 100%;
  height: 100%;
}

.pop_hy .qjf_box_con::before {
  content: '';
  position: absolute;
  top: 53%;
  transform: translate(-50%, -50%);
  left: 50.5%;
  width: 1024rem;
  height: 636rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/hy_icon2.png) center top no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 2;
}

.pop_hy .qjf_box_con::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
  width: 100%;
  height: 100%;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/hy_icon.png) center top no-repeat;
  background-size: contain;
  pointer-events: none;
  z-index: 3;
}

.pop_hy .qjf_box_con .qjf_box {
  width: 261rem;
  height: 316rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/hy_img_bg.png) center top no-repeat;
  background-size: contain;
  margin: 0 auto;
  display: block;
  position: relative;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
  z-index: 2;
}

.pop_hy .qjf_box_con .qjf_box.active {
  animation: qjf_scale 1.5s ease-in-out forwards;
}

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

.pop_hy .qjf_box_con img {
  width: 410rem;
  height: 501rem;
  object-fit: contain;
  position: absolute;
  top: 25%;
  left: 44%;
  z-index: 2;
  transform: translate(-50%, -50%) rotate(-7deg);
}

.pop_hy .qjf_tit {
  width: 350rem;
  height: 38rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/qjf_tit.png) center top no-repeat;
  background-size: contain;
  margin: 10rem auto;
}

.pop_hy .qjf_tit2 {
  width: 700rem;
  height: 38rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/qjf_tit2.png) center top no-repeat;
  background-size: contain;
  margin: 10rem auto;
}

.pop_hy .btn_box {
  gap: 0 30rem;
}

.pop_hy .dia_btn1 {
  width: 243rem;
  height: 68rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn1.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
  width: 344rem;
  height: 87rem;
}

.pop_hy .dia_btn2 {
  width: 243rem;
  height: 68rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn2.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
}

.pop_hy .dia_btn3 {
  width: 243rem;
  height: 68rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn3.png) center top no-repeat;
  background-size: contain;
  font-size: 0;
}

.pop_hy .dia_btn3.active {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_btn3_active.png);
}

.btn_yzm.gray,
.send-code-btn.gray {
  pointer-events: none;
}

.pop5 .dia_close {
  top: -30rem;
  right: -90rem;
}

.pop5 .dia_video {
  width: 900rem;
  height: 500rem;
  position: relative;
  background-color: #242424;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pop5 .dia_video::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
  width: 925rem;
  height: 525rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/p0_video_icon.png) center top no-repeat;
  background-size: contain;
  pointer-events: none;
}

.pop5 .dia_video video,
.pop5 .dia_video > div {
  width: 98%;
  height: 98%;
  object-fit: contain;
}

.pop6 {
  width: 925rem;
  height: 525rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_bg5.png) center top no-repeat;
  background-size: 100% 100%;
  padding: 20rem;
}

.pop6 .dia_video {
  justify-content: start;
  background: none;
}

.pop6 .dia_video::after {
  display: none;
}

.pop6 .story_tit {
  width: 809rem;
  height: 79rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/story_tit.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
}

.pop6 .story_tit.story_tit2 {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/story_tit2.png);
}

.pop6 .story_con {
  width: 94%;
  font-size: 18rem;
  color: #3f4551;
  max-height: 380rem;
  overflow-y: auto;
  margin-top: 20rem;
}

.pop6 .story_con::-webkit-scrollbar {
  width: 10rem;
  height: 10rem;
  background-color: rgba(185, 185, 185, 0.1);
  border-radius: 10rem;
}

.pop6 .story_con::-webkit-scrollbar-thumb {
  background-color: rgba(32, 32, 32, 0.5);
  border-radius: 10rem;
}

.pop6 .story_con p {
  margin: 5rem 0;
  padding: 0 30rem;
}

.pop6 .story_con h2 {
  padding: 0 60rem;
  position: relative;
  font-size: 30rem;
  color: #3b4af9;
  font-weight: 600;
  margin-top: 30rem;
}

.pop6 .story_con h2::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 28rem;
  width: 23rem;
  height: 24rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/slide_icon1.png) center top no-repeat;
  background-size: contain;
}

.pop6 .story_con h2:first-child {
  margin-top: 0;
}

.pop6 .skill_tit {
  width: 701rem;
  height: 67rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/skill_tit.png) center top no-repeat;
  background-size: contain;
}

.pop6 table {
  border-collapse: collapse;
  width: 808rem;
  height: 340rem;
  margin: 0 auto;
  margin-top: 20rem;
}

.pop6 table th {
  background-color: #fde7bb;
  color: #242424;
  padding: 5rem;
  height: 50rem;
  border: 1rem solid #d4a679;
}

.pop6 table td {
  color: #fff;
  padding: 5rem;
  text-align: center;
  border: 1rem solid #d4a679;
}

.pop7 .dia-img {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 579.6rem;
  height: 862.2rem;
  background: url(//game.gtimg.cn/images/dnf/cp/a20260530eighteen/mobile/dia-958.png) no-repeat center/cover;
}

.pop7 .dia-img .swiper {
  width: 532.8rem;
  height: 804.6rem;
}

.pop7 .dia-img .swiper .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.pop7 .dia-img .swiper .swiper-slide p {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 40rem;
  font-size: 18rem;
  color: #fdfeff;
  line-height: 1;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  left: 0;
  bottom: 0;
}

.pop7 .dia-img .swiper .swiper-zoom-container {
  display: flex;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  overflow-y: auto;
}

.pop7 .dia-img .swiper .swiper-zoom-container::-webkit-scrollbar {
  width: 5rem;
}

.pop7 .dia-img .swiper .swiper-zoom-container::-webkit-scrollbar-track {
  background-color: #eaeaea;
}

.pop7 .dia-img .swiper .swiper-zoom-container::-webkit-scrollbar-thumb {
  background-color: #ee7042;
}

.pop7 .dia-img .swiper .swiper-zoom-container img {
  width: 100%;
  height: auto;
  max-height: 10000000rem;
}

.pop7 .dia-img-btn {
  display: none;
  justify-content: center;
  padding: 20rem 0 0;
}

.pop7 .dia-img-btn a {
  display: flex;
  width: 70rem;
  height: 70rem;
  margin: 0 15rem;
}

.pop7 .dia-img-btn img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pop7 .dia_con {
  width: 705rem;
  height: 649rem;
  position: relative;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/long_img_bg.png) center top no-repeat;
  background-size: contain;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 2rem;
  padding-bottom: 2rem;
}

.pop7 .dia_con .img_box {
  width: 652rem;
  height: 590rem;
  padding-right: 10rem;
  border: 2rem solid #f2d799;
  overflow-x: auto;
  /* 允许横向滚动 */
  overflow-y: auto;
  /* 禁止纵向滚动 */
}

.pop7 .dia_con .img_box::-webkit-scrollbar {
  width: 10rem;
  height: 10rem;
  background-color: rgba(255, 255, 255, 0.1);
}

.pop7 .dia_con .img_box::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.3);
}

.pop7 .dia_con .img_box img {
  width: 630rem;
  height: auto;
  object-fit: contain;
  display: block;
}

.pop7 .btn_box {
  gap: 0 20rem;
  margin-top: 10rem;
}

.pop7 .btn_big {
  width: 60rem;
  height: 59rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/btn_big.png) center top no-repeat;
  background-size: contain;
}

.pop7 .btn_sm {
  width: 60rem;
  height: 59rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/btn_sm.png) center top no-repeat;
  background-size: contain;
}

.pop7 .btn_re {
  width: 60rem;
  height: 59rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/btn_re.png) center top no-repeat;
  background-size: contain;
}

.pop8 {
  width: 904rem;
  min-height: 551rem;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_bg4.png);
  background-size: 100% 100%;
  padding: 30rem 50rem;
}

.pop8 .dia_tit1 {
  width: 553rem;
  height: 98rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_tit1.png) center center no-repeat;
  background-size: contain;
  margin: 0 auto;
  font-size: 0;
}

.pop8 .dia_con {
  width: 100%;
  height: 400rem;
  max-height: 850rem;
  overflow: hidden;
  overflow-y: auto;
  margin-top: 10rem;
  padding-right: 10rem;
}

.pop8 .dia_con::-webkit-scrollbar {
  width: 5rem;
  background: rgba(0, 0, 0, 0.2);
}

.pop8 .dia_con::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.5);
}

.pop8 .dia_con h4 {
  font-size: 20rem;
  color: #3948f9;
  margin-top: 10rem;
  font-weight: normal;
}

.pop8 .dia_con p {
  font-size: 18rem;
  color: #3948f9;
  text-align: left;
  margin-top: 8rem;
}

.pop8 .dia_con p em {
  margin-left: 30rem;
}

.pop8 .dia_con p a {
  text-decoration: underline;
  color: #eb376f;
}

.pop8 .dia_con p b {
  color: #3948f9;
  font-weight: normal;
}

.pop8 .dia_con table {
  width: 100%;
  margin: 10rem auto;
  border-collapse: collapse;
}

.pop8 .dia_con table th {
  font-size: 18rem;
  color: #fff;
  background-color: #3948f9;
  text-align: center;
  padding: 5rem;
  font-size: 18rem;
  border: 1rem solid #717cff;
}

.pop8 .dia_con table td {
  min-width: 140rem;
  text-align: center;
  color: #676ca1;
  padding: 5rem;
  font-size: 18rem;
  border: 1rem solid #717cff;
}

.pop9 {
  width: 904rem;
  min-height: 551rem;
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/dia/dia_bg4.png);
  background-size: 100% 100%;
  padding: 50rem;
}

.pop9 .p8_rules {
  width: 100%;
  height: 400rem;
  max-height: 850rem;
  overflow: hidden;
  overflow-y: auto;
  margin-top: 10rem;
  padding-right: 10rem;
}

.pop9 .p8_rules::-webkit-scrollbar {
  width: 5rem;
  background: rgba(0, 0, 0, 0.2);
}

.pop9 .p8_rules::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.5);
}

.pop9 .p8_rules p {
  font-size: 18rem;
  color: #3948f9;
  text-align: left;
  margin-top: 10rem;
}

.pop9 .p8_rules p em {
  margin-left: 30rem;
}

.pop9 .p8_rules p a {
  text-decoration: underline;
  color: #3948f9;
}

.pop9 .p8_rules p b {
  color: #3948f9;
  font-weight: normal;
}

.pop9 .p8_rules table {
  width: 100%;
  margin: 10rem auto;
  border-collapse: collapse;
}

.pop9 .p8_rules table th {
  font-size: 18rem;
  color: #fff;
  background-color: #3948f9;
  text-align: center;
  padding: 5rem;
  font-size: 18rem;
  border: 1rem solid #717cff;
}

.pop9 .p8_rules table td {
  min-width: 140rem;
  text-align: center;
  color: #676ca1;
  padding: 5rem;
  font-size: 18rem;
  border: 1rem solid #717cff;
}

.pop10 .table_box {
  width: 520rem;
  margin: 0 auto;
}

.pop10 .table_box table {
  width: 100%;
  margin: 10rem auto;
  border-collapse: collapse;
}

.pop10 .table_box table th {
  font-size: 20rem;
  color: #fff;
  background-color: #3948f9;
  text-align: center;
  padding: 5rem 10rem;
  font-weight: normal;
  border: 1rem solid #5664fc;
}

.pop10 .table_box table td {
  text-align: center;
  color: #3948f9;
  font-size: 18rem;
  border: 1rem solid #5664fc;
  padding: 5rem 10rem;
}

.pop10 .page_btn {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 20rem;
}

.pop10 .page_btn a {
  font-size: 20rem;
  color: #3948f9;
}

.pop10 .page_btn div {
  font-size: 20rem;
  color: #3948f9;
}

.share-loading {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(0, 0, 0, 0.7);
  color: white;
  padding: 10rem 20rem;
  border-radius: 4rem;
  z-index: 9999999;
}

.share-loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
  background: conic-gradient(from 0deg, #feffff 0%, #3b3b3b 100%);
  border-radius: 50%;
  mask: radial-gradient(transparent 8px, #000 8.5px);
  animation: loading 0.8s linear infinite;
}

@keyframes loading {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

.milo-qConnectLogin {
  z-index: 99999 !important;
}

#milo-dialog {
  z-index: 99999 !important;
}

.gj_box {
  position: fixed;
  right: 0;
  top: 30%;
  transition: all 0.3s ease-in-out;
  z-index: 9;
}

.gj_box.open {
  right: -307rem;
}

.gj_box.open .gj_btn {
  background-image: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/gj_btn2.png);
}

.gj_box.open .gj_img {
  opacity: 0;
  transition: all 0.3s ease-in-out;
}

.gj_box .gj_img {
  width: 327rem;
  height: 474rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/gj_img.png) center top no-repeat;
  background-size: contain;
  display: flex;
  justify-content: center;
  align-items: end;
  padding-bottom: 15rem;
}

.gj_box .gj_btn {
  width: 30rem;
  height: 85rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/gj_btn.png) center top no-repeat;
  background-size: contain;
  position: absolute;
  top: 20rem;
  left: -10rem;
  z-index: 2;
}

.gj_box .btn_box a {
  margin-bottom: 10rem;
}

.btn_wgxz {
  width: 152rem;
  height: 48rem;
  background: url(https://game.gtimg.cn/images/dnf/cp/a20260530eighteen/btn_wgxz.png) center top no-repeat;
  background-size: contain;
  display: block;
}

.part5 .p_con .r .img_box .text_box {
  top: 36%;
}

.part5 .p_con .r .img_box .btn_box {
  position: absolute;
  bottom: 19rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display: block;
  /* display: flex; */
  /* justify-content: center; */
  /* align-items: center; */
  gap: 0 10rem;
}

.gj_gx {
  position: absolute;
  top: -32rem;
  left: -25rem;
  z-index: 2;
  width: 366rem;
  height: 261rem;
}