.mobile_navbar,
.menus, .mobile_button {
  display: none; }

.fadein_login {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  left: 0;
  top: 0;
  display: none;
  z-index: 1001;
  background: rgba(0, 0, 0, 0.6); }
  .fadein_login .login_box {
    width: 8.76rem;
    height: 8.13rem;
    background-size: 100% 100%;
    position: relative;
    padding: 2.78rem 1.2rem 0 1.14rem;
    background-image: url(https://cdn.18youxi.vip/uploads/20260821/28fc8a7c2802b56891626e9720aa86ea.png); }
    .fadein_login .login_box .close {
      width: .46rem;
      position: absolute;
      right: 0;
      top: .8rem;
      cursor: pointer;
      z-index: 9;
      transition: all .3s; }
      .fadein_login .login_box .close:hover {
        transform: rotate(180deg); }
    .fadein_login .login_box .title {
      width: 3.66rem;
      position: absolute;
      left: 50%;
      margin-left: -1.83rem;
      top: 1.04rem; }
    .fadein_login .login_box form {
      width: 100%;
      font-size: 12px; }
      .fadein_login .login_box form input[type='text'] {
        width: 100%;
        height: .88rem;
        border-radius: .18rem;
        border: .04rem solid #D45801;
        padding-left: .35rem;
        font-size: .24rem;
        color: #8B8B8B;
        margin-bottom: .28rem;
        font-family: pf;
        background: #FFF1CE; }
        .fadein_login .login_box form input[type='text']::placeholder {
          font-family: pf; }
      .fadein_login .login_box form .sms_field {
        width: 100%;
        display: flex;
        align-items: center;
        gap: .12rem;
        margin-bottom: .28rem; }
        .fadein_login .login_box form .sms_field input[type='text'] {
          flex: 1;
          min-width: 0;
          width: auto;
          margin-bottom: 0; }
        .fadein_login .login_box form .sms_field .send_code {
          flex: 0 0 1.42rem;
          height: .88rem;
          padding: 0 .08rem;
          border: .02rem solid #D45801;
          border-radius: .14rem;
          background: #D45801;
          color: #FFF1CE;
          font-size: .16rem;
          font-family: pf;
          cursor: pointer;
          transition: all .2s; }
          .fadein_login .login_box form .sms_field .send_code:hover {
            background: #F07818; }
          .fadein_login .login_box form .sms_field .send_code:disabled {
            background: #B7A18A;
            border-color: #B7A18A;
            cursor: not-allowed; }
      .fadein_login .login_box form input[type="submit"] {
        width: 2.82rem;
        height: 1.12rem;
        margin: 0 auto;
        border: none;
        background: none;
        outline: none;
        display: block;
        background-image: url(/static/images/loginbtn.png);
        background-size: 100% 100%;
        cursor: pointer;
        margin-top: .14rem; }
      .fadein_login .login_box form .xy {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: .12rem;
        font-size: .2rem;
        cursor: pointer;
        color: #5E5E5E; }
        .fadein_login .login_box form .xy.active div {
          background-image: url(/static/images/dots.png); }
        .fadein_login .login_box form .xy div {
          width: .2rem;
          height: .2rem;
          background-image: url(/static/images/dot.png);
          background-size: 100% 100%;
          margin-right: .1rem; }
      .fadein_login .login_box form .type {
        display: flex;
        justify-content: space-around; }
        .fadein_login .login_box form .type div {
          cursor: pointer;
          display: flex;
          align-items: center;
          height: .48rem;
          font-size: .32rem;
          color: #000000;
          font-family: pf;
          font-weight: bold; }
          .fadein_login .login_box form .type div.check::before {
            background-image: url(/static/images/dots.png); }
          .fadein_login .login_box form .type div::before {
            content: '';
            width: .2rem;
            height: .2rem;
            background-image: url(/static/images/dot.png);
            background-size: 100% 100%;
            margin-right: .1rem; }

.content {
  width: 100%;
  overflow: hidden;
  min-height: 100vh; }
  .content header {
    width: 100%;
    height: .6rem;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(10px);
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    position: fixed;
    left: 0;
    top: 0;
    transition: all .3s;
    z-index: 1000;
    justify-content: space-between;
    padding: 0 .53rem 0 .18rem; }
    .content header.on {
      box-shadow: 0 0.1rem 0.1rem rgba(0, 0, 0, 0.06); }
    .content header .logo {
      width: 1.23rem; }
      .content header .logo img {
        display: block;
        width: 100%; }
    .content header .nav {
      height: 100%;
      display: flex;
      align-items: center; }
      .content header .nav ul {
        height: 100%;
        display: flex; }
        .content header .nav ul li {
          height: 100%;
          position: relative; }
          .content header .nav ul li::after {
            content: '';
            width: 0;
            border-radius: .1rem;
            height: .04rem;
            background: #FF6A00;
            transition: all .3s;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            bottom: .04rem; }
          .content header .nav ul li.active::after {
            width: .16rem;
            bottom: .1rem; }
          .content header .nav ul li.active a {
            color: #FF6A00;
            font-weight: bold; }
          .content header .nav ul li:hover::after {
            width: .16rem;
            bottom: .1rem; }
          .content header .nav ul li:hover a {
            color: #FF6A00;
            font-weight: bold; }
          .content header .nav ul li a {
            font-size: .16rem;
            height: 100%;
            display: flex;
            align-items: center;
            padding: 0 .22rem;
            font-family: pf;
            color: #000000; }
      .content header .nav .login {
        height: 100%;
        margin-left: .12rem; }
        .content header .nav .login a {
          height: 100%;
          display: block; }
          .content header .nav .login a img {
            width: auto;
            height: 100%; }
  .content .fadein_link {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1001;
    display: none;
    background: rgba(0, 0, 0, 0.6); }
    .content .fadein_link .link_box {
      width: 5.5rem;
      height: 2.13rem;
      background-size: 100% 100%;
      position: relative;
      padding: .24rem 0 0 0;
      background-image: url(/static/images/linkbg.png); }
      .content .fadein_link .link_box .close {
        width: .32rem;
        position: absolute;
        right: .22rem;
        top: .12rem;
        cursor: pointer;
        z-index: 9;
        transition: all .3s; }
        .content .fadein_link .link_box .close:hover {
          transform: rotate(180deg); }
      .content .fadein_link .link_box p {
        text-align: center;
        font-size: .2rem;
        color: #994000;
        font-weight: bold; }
      .content .fadein_link .link_box span {
        display: block;
        text-align: center;
        margin-top: .24rem;
        font-size: .2rem;
        color: #000000; }
      .content .fadein_link .link_box .copys {
        width: 1.78rem;
        margin: 0 auto;
        margin-top: .24rem;
        cursor: pointer; }
        .content .fadein_link .link_box .copys img {
          width: 100%;
          display: block; }
  .content .image_preview {
    width: 100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1002;
    background: rgba(0, 0, 0, 0.78);
    padding: .3rem;
    box-sizing: border-box; }
    .content .image_preview .image_preview_box {
      max-width: 100%;
      max-height: 100%;
      position: relative; }
    .content .image_preview .image_preview_img {
      display: block;
      max-width: 90vw;
      max-height: 88vh;
      min-width: 50vw;
      object-fit: contain;
      box-shadow: 0 0.08rem 0.3rem rgba(0, 0, 0, 0.45); }
    .content .image_preview .image_preview_close {
      width: .38rem;
      height: .38rem;
      position: absolute;
      right: -.18rem;
      top: -.18rem;
      z-index: 2;
      cursor: pointer;
      transition: transform .3s; }
      .content .image_preview .image_preview_close:hover {
        transform: rotate(180deg); }
      .content .image_preview .image_preview_close img {
        width: 100%;
        display: block; }
  .content .message_box {
    position: fixed;
    right: .26rem;
    top: 1.66rem;
    z-index: 1000; }
    .content .message_box .message_label {
      width: 2.95rem;
      height: 1.3rem;
      background-image: url(/static/images/message.png);
      background-size: 100% 100%;
      margin-bottom: -.16rem;
      padding-left: .34rem;
      position: relative;
      display: flex;
      padding-bottom: .1rem;
      align-items: center;
      display: none; }
      .content .message_box .message_label .close {
        width: .2rem;
        cursor: pointer;
        position: absolute;
        right: .32rem;
        top: .3rem; }
      .content .message_box .message_label .icon {
        width: .55rem; }
        .content .message_box .message_label .icon img {
          width: 100%; }
      .content .message_box .message_label .info {
        padding-left: .12rem; }
        .content .message_box .message_label .info p {
          font-size: .2rem;
          color: #994000;
          font-weight: bold; }
        .content .message_box .message_label .info .d {
          display: flex;
          align-items: center;
          margin-top: .06rem; }
          .content .message_box .message_label .info .d span {
            font-size: .16rem;
            color: #5E5E5E; }
          .content .message_box .message_label .info .d img {
            width: .16rem;
            cursor: pointer;
            margin-left: .06rem; }
  .content .main_content {
    width: 100%;
    background-image: url(/static/images/banner.png);
    background-size: 100%;
    background-repeat: no-repeat;
    position: relative;
    padding: 4.72rem 0 0 0; }
    .content .main_content .bg1 {
      width: 100%;
      position: absolute;
      left: 0;
      top: 6rem; }
    .content .main_content .content_title {
      width: 8.14rem;
      display: block;
      margin: 0 auto; }
    .content .main_content .count {
      width: 4.95rem;
      height: 1.23rem;
      background-image: url(/static/images/tbg.png);
      background-size: 100% 100%;
      margin: 0 auto;
      display: flex;
      align-items: baseline;
      padding-top: .32rem;
      margin-top: -.22rem;
      justify-content: center; }
      .content .main_content .count p {
        font-size: .24rem;
        color: #fff;
        display: flex;
        font-weight: bold;
        align-items: baseline;
        margin: 0 .075rem; }
        .content .main_content .count p span {
          font-size: .32rem;
          font-weight: bold;
          margin: 0 .04rem; }
  .content .main_home {
    position: relative;
    overflow: hidden; }
    .content .main_home::after {
      content: '';
      width: 100%;
      height: 27.14rem;
      background-image: url(https://cdn.18youxi.vip/uploads/20260821/227b1e5908c8f958a04cafaa5cab9f51.png);
      background-size: 100% 100%;
      z-index: 1;
      position: absolute;
      left: 0;
      top: -1.06rem; }
  .content .main_reward {
    width: 12rem;
    height: 3.85rem;
    background-image: url(https://cdn.18youxi.vip/uploads/20260821/59219c93a5afdfd717d31c8a120cd3a0.png);
    background-size: 100% 100%;
    margin: 0 auto;
    position: relative;
    z-index: 9; }
    .content .main_reward .reward {
      width: .88rem;
      position: absolute;
      left: .28rem;
      top: -.22rem;
      z-index: 9;
      animation: reward-float 3.2s ease-in-out infinite;
      will-change: transform; }
    .content .main_reward .reward_top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: .1rem .16rem;
      padding-left: 2.42rem; }
      .content .main_reward .reward_top .btn {
        width: 1.77rem;
        margin-top: .16rem;
        margin-left: -.66rem;
        position: relative; }
        .content .main_reward .reward_top .btn .fire-sparks {
          position: absolute;
          left: -.18rem;
          right: -.18rem;
          top: -.82rem;
          bottom: .1rem;
          overflow: visible;
          pointer-events: none;
          z-index: 3; }
        .content .main_reward .reward_top .btn .fire-spark {
          position: absolute;
          left: 50%;
          bottom: .02rem;
          width: .022rem;
          height: .022rem;
          border-radius: 50% 50% 45% 45%;
          background: #FFF3A6;
          box-shadow: 0 0 0.06rem rgba(255, 173, 32, 0.95);
          opacity: 0;
          box-shadow: 0 0 .04rem 2px #ff3200cc;
          background-color: #ffdc82;
          transform: translate3d(0, 0, 0) rotate(20deg) scale(0.55);
          animation: fire-spark-rise 2.2s ease-out infinite;
          will-change: transform, opacity; }
        .content .main_reward .reward_top .btn .fire-spark:nth-child(3n) {
          width: .022rem;
          height: .022rem;
          background: #FF8A18; }
        .content .main_reward .reward_top .btn .fire-spark:nth-child(4n) {
          width: .022rem;
          height: .022rem;
          background: #FFE477; }
        .content .main_reward .reward_top .btn .s1 {
          margin-left: -.7rem;
          animation-delay: -.15s;
          --spark-x: -.18rem;
          --spark-y: -.62rem;
          --spark-r: -28deg; }
        .content .main_reward .reward_top .btn .s2 {
          margin-left: -.52rem;
          animation-delay: -.9s;
          --spark-x: .1rem;
          --spark-y: -.78rem;
          --spark-r: 18deg; }
        .content .main_reward .reward_top .btn .s3 {
          margin-left: -.36rem;
          animation-delay: -.46s;
          --spark-x: -.08rem;
          --spark-y: -.46rem;
          --spark-r: 32deg; }
        .content .main_reward .reward_top .btn .s4 {
          margin-left: -.2rem;
          animation-delay: -1.38s;
          --spark-x: .2rem;
          --spark-y: -.7rem;
          --spark-r: -18deg; }
        .content .main_reward .reward_top .btn .s5 {
          margin-left: -.05rem;
          animation-delay: -.68s;
          --spark-x: -.12rem;
          --spark-y: -.92rem;
          --spark-r: 12deg; }
        .content .main_reward .reward_top .btn .s6 {
          margin-left: .1rem;
          animation-delay: -1.8s;
          --spark-x: .24rem;
          --spark-y: -.54rem;
          --spark-r: 35deg; }
        .content .main_reward .reward_top .btn .s7 {
          margin-left: .24rem;
          animation-delay: -.22s;
          --spark-x: -.16rem;
          --spark-y: -.74rem;
          --spark-r: -22deg; }
        .content .main_reward .reward_top .btn .s8 {
          margin-left: .38rem;
          animation-delay: -1.1s;
          --spark-x: .12rem;
          --spark-y: -1.02rem;
          --spark-r: 24deg; }
        .content .main_reward .reward_top .btn .s9 {
          margin-left: .52rem;
          animation-delay: -.58s;
          --spark-x: .2rem;
          --spark-y: -.5rem;
          --spark-r: -34deg; }
        .content .main_reward .reward_top .btn .s10 {
          margin-left: -.62rem;
          animation-delay: -1.62s;
          --spark-x: -.24rem;
          --spark-y: -.86rem;
          --spark-r: 20deg; }
        .content .main_reward .reward_top .btn .s11 {
          margin-left: -.28rem;
          animation-delay: -.34s;
          --spark-x: .08rem;
          --spark-y: -.66rem;
          --spark-r: -30deg; }
        .content .main_reward .reward_top .btn .s12 {
          margin-left: .02rem;
          animation-delay: -1.26s;
          --spark-x: -.18rem;
          --spark-y: -1.08rem;
          --spark-r: 30deg; }
        .content .main_reward .reward_top .btn .s13 {
          margin-left: .28rem;
          animation-delay: -.78s;
          --spark-x: .22rem;
          --spark-y: -.82rem;
          --spark-r: -12deg; }
        .content .main_reward .reward_top .btn .s14 {
          margin-left: .46rem;
          animation-delay: -1.94s;
          --spark-x: -.06rem;
          --spark-y: -.58rem;
          --spark-r: 28deg; }
        .content .main_reward .reward_top .btn .s15 {
          margin-left: .64rem;
          animation-delay: -1.02s;
          --spark-x: .16rem;
          --spark-y: -.94rem;
          --spark-r: -24deg; }
        .content .main_reward .reward_top .btn img {
          display: block;
          width: 100%;
          position: relative;
          z-index: 1; }
    .content .main_reward .reward_box {
      width: 100%;
      margin-top: .3rem;
      padding: 0 .16rem;
      display: flex;
      justify-content: space-between; }
      .content .main_reward .reward_box .reward_item {
        width: 3.78rem;
        height: 1.97rem;
        background-image: url(/static/images/bg2.png);
        background-size: 100% 100%;
        position: relative;
        padding: .06rem .18rem 0 .18rem; }
        .content .main_reward .reward_box .reward_item .title {
          text-align: center;
          font-size: .24rem;
          font-weight: bold;
          color: #FF6A00; }
        .content .main_reward .reward_box .reward_item .desc {
          display: block;
          text-align: center;
          line-height: 1.2;
          font-size: .16rem;
          color: #626262; }
        .content .main_reward .reward_box .reward_item .list {
          display: flex;
          justify-content: space-between;
          margin-top: -.04rem; }
          .content .main_reward .reward_box .reward_item .list .prop_label {
            padding-bottom: .1rem; }
            .content .main_reward .reward_box .reward_item .list .prop_label .prop_icon {
              width: .88rem;
              height: .88rem; }
        .content .main_reward .reward_box .reward_item .bottom_tip {
          display: flex;
          align-items: center;
          justify-content: space-between;
          margin-top: -.02rem; }
          .content .main_reward .reward_box .reward_item .bottom_tip .btn {
            width: .88rem;
            height: .46rem;
            background-image: url(/static/images/btn4.png);
            background-size: 100% 100%; }
            .content .main_reward .reward_box .reward_item .bottom_tip .btn.w {
              background-image: url(/static/images/btn3.png); }
            .content .main_reward .reward_box .reward_item .bottom_tip .btn a {
              width: 100%;
              height: 100%;
              display: block; }
          .content .main_reward .reward_box .reward_item .bottom_tip p {
            font-size: .14rem;
            color: #000;
            display: flex;
            align-items: center; }
            .content .main_reward .reward_box .reward_item .bottom_tip p span {
              color: #FF6A00; }
            .content .main_reward .reward_box .reward_item .bottom_tip p em {
              color: #FF6A00; }
  .content .main_news {
    width: 12rem;
    height: 4.36rem;
    margin: 0 auto;
    margin-top: .58rem;
    position: relative;
    z-index: 9;
    display: flex; }
    .content .main_news .news_slide {
      width: 7.22rem;
      height: 100%;
      overflow: hidden;
      position: relative; }
      .content .main_news .news_slide .newsMySwiper {
        width: 100%;
        height: 100%;
        overflow: hidden; }
        .content .main_news .news_slide .newsMySwiper .swiper-slide {
          width: 100%;
          height: 100%;
          overflow: hidden; }
          .content .main_news .news_slide .newsMySwiper .swiper-slide img {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover; }
        .content .main_news .news_slide .newsMySwiper .swiper-pagination-bullet {
          width: .2rem;
          height: .06rem;
          border-radius: .1rem; }
        .content .main_news .news_slide .newsMySwiper .swiper-pagination-bullet-active {
          background: #FF6A00; }
    .content .main_news .news_grow {
      width: calc(100% - 7.22rem);
      height: 100%;
      background-image: url(/static/images/bg1.png);
      background-size: 100% 100%; }
      .content .main_news .news_grow .news_fade {
        width: 100%;
        height: calc(100% - .58rem); }
        .content .main_news .news_grow .news_fade .news_item {
          width: 100%;
          display: none;
          padding: 0 .18rem; }
          .content .main_news .news_grow .news_fade .news_item .label {
            width: 100%;
            height: .65rem;
            position: relative;
            border-bottom: 1px dashed #C4C4C4; }
            .content .main_news .news_grow .news_fade .news_item .label::after {
              content: '';
              width: 0%;
              border-bottom: 1px dashed #FF6A00;
              position: absolute;
              left: 0;
              bottom: 0;
              z-index: 9;
              transition: all .6s; }
            .content .main_news .news_grow .news_fade .news_item .label:hover a p,
            .content .main_news .news_grow .news_fade .news_item .label:hover a span {
              color: #FF6A00; }
            .content .main_news .news_grow .news_fade .news_item .label a {
              display: flex;
              align-items: center;
              justify-content: space-between;
              height: 100%;
              width: 100%;
              padding-top: .24rem;
              box-sizing: border-box; }
              .content .main_news .news_grow .news_fade .news_item .label a p {
                font-size: .16rem;
                color: #5E5E5E;
                max-width: 4rem;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                transition: all .2s; }
              .content .main_news .news_grow .news_fade .news_item .label a span {
                font-size: .16rem;
                color: #5E5E5E; }
      .content .main_news .news_grow .tabbar {
        width: 100%;
        height: .58rem;
        display: flex;
        position: relative;
        background-image: url(/static/images/line.png);
        background-size: 4.4rem;
        background-repeat: no-repeat;
        background-position: bottom center;
        padding-right: .4rem; }
        .content .main_news .news_grow .tabbar div {
          flex: 1;
          height: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: .2rem;
          text-align: center;
          position: relative;
          cursor: pointer;
          transition: all .2s;
          font-weight: bold;
          color: #626262; }
          .content .main_news .news_grow .tabbar div::after {
            content: '';
            width: 0rem;
            height: .055rem;
            background: #FF6A00;
            border-radius: .2rem;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            bottom: .025rem;
            transition: all .3s; }
          .content .main_news .news_grow .tabbar div.active::after {
            width: .2rem; }
          .content .main_news .news_grow .tabbar div.active {
            color: #000; }
        .content .main_news .news_grow .tabbar .more {
          width: .35rem;
          position: absolute;
          right: .15rem;
          top: 50%;
          z-index: 9;
          transform: translateY(-50%); }
          .content .main_news .news_grow .tabbar .more img {
            width: 100%;
            display: block; }
  .content .main_news_more {
    width: 12rem;
    margin: 0 auto;
    flex-wrap: wrap;
    margin-top: .3rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .04rem;
    position: relative;
    z-index: 9; }
    .content .main_news_more .label {
      height: 1.77rem;
      background-image: url(/static/images/border.png);
      background-size: 100% 100%;
      transition: all .36s;
      overflow: hidden; }
      .content .main_news_more .label:hover {
        transform: translateY(-0.06rem) scale(0.98);
        box-shadow: 0 0.1rem 0.1rem rgba(0, 0, 0, 0.24); }
      .content .main_news_more .label a {
        width: 100%;
        height: 100%;
        display: block;
        transition: all .3s;
        transform-origin: center center;
        padding: .01rem;
        box-sizing: border-box; }
        .content .main_news_more .label a img {
          width: 100%;
          height: 100%;
          display: block;
          object-fit: cover; }
  .content .main_role {
    width: 12rem;
    margin: 0 auto;
    position: relative;
    z-index: 9;
    padding: .66rem 0 0 0; }
    .content .main_role .role_box {
      width: 100%;
      position: relative;
      height: 7.04rem;
      margin-top: .3rem; }
      .content .main_role .role_box .swiper-container {
        width: 100%;
        overflow: hidden;
        height: 100%; }
        .content .main_role .role_box .swiper-container .swiper-slide {
          transition: 300ms;
          display: flex;
          align-items: center;
          justify-content: center;
          transform: scale(0.7); }
          .content .main_role .role_box .swiper-container .swiper-slide.swiper-slide-active .item::after {
            opacity: 0; }
          .content .main_role .role_box .swiper-container .swiper-slide.swiper-slide-active .item .user {
            transform: translate(0%, -50%) scale(1); }
          .content .main_role .role_box .swiper-container .swiper-slide .item {
            width: 5.2rem;
            height: 5.1rem;
            position: relative; }
            .content .main_role .role_box .swiper-container .swiper-slide .item::after {
              content: '';
              width: 100%;
              height: 106%;
              background: rgba(0, 0, 0, 0.4);
              position: absolute;
              left: 0;
              top: 0;
              border-radius: .12rem; }
            .content .main_role .role_box .swiper-container .swiper-slide .item .dz {
              width: 100%; }
            .content .main_role .role_box .swiper-container .swiper-slide .item .user {
              max-height: 100%;
              position: absolute;
              top: 50%;
              transform: translate(0%, -50%) scale(0.66);
              transform-origin: center;
              transition: all .6s;
              right: 0; }
        .content .main_role .role_box .swiper-container .swiper-slide-active, .content .main_role .role_box .swiper-container .swiper-slide-duplicate-active {
          transform: scale(1); }
      .content .main_role .role_box .btn {
        width: 1.26rem;
        cursor: pointer;
        position: absolute;
        z-index: 9;
        opacity: 0.6;
        transition: all .2s;
        transform: translateY(-50%);
        top: 50%; }
        .content .main_role .role_box .btn:hover {
          opacity: 1; }
        .content .main_role .role_box .btn.prev {
          left: -1.26rem; }
        .content .main_role .role_box .btn.next {
          right: -1.26rem; }
  .content .main_scene {
    width: 12rem;
    margin: 0 auto;
    padding: .7rem 0 1.14rem 0;
    position: relative;
    z-index: 9; }
    .content .main_scene .scene_box {
      width: 100%;
      margin-top: .38rem;
      flex-wrap: wrap;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: .12rem; }
      .content .main_scene .scene_box .label {
        height: 3.22rem;
        overflow: hidden;
        position: relative; }
        .content .main_scene .scene_box .label img {
          width: 100%;
          height: 100%;
          display: block;
          object-fit: cover;
          cursor: zoom-in; }

@keyframes reward-float {
  0%, 100% {
    transform: translateY(0); }
  50% {
    transform: translateY(-0.12rem); } }
@keyframes fire-spark-rise {
  0% {
    opacity: 0;
    transform: translate3d(0, 0.04rem, 0) rotate(20deg) scale(0.45); }
  12% {
    opacity: 1; }
  58% {
    opacity: .9; }
  100% {
    opacity: 0;
    transform: translate3d(var(--spark-x), var(--spark-y), 0) rotate(var(--spark-r)) scale(1.05); } }
.public_title {
  width: 6.24rem;
  height: 1.15rem;
  background-image: url(/static/images/titlebg.png);
  background-size: 100% 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: .06rem; }
  .public_title p {
    font-size: .4rem;
    font-weight: bold;
    background-image: linear-gradient(#FF6A00 0%, #994000 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent; }

.prop_label {
  position: relative;
  padding-bottom: .06rem; }
  .prop_label .prop_icon {
    width: 1.08rem;
    height: 1.08rem;
    background-image: url(/static/images/btn6.png);
    background-size: 100% 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; }
    .prop_label .prop_icon::after {
      content: '';
      position: absolute;
      pointer-events: none;
      top: -20%;
      left: -75%;
      width: 55%;
      height: 140%;
      background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.2) 35%, rgba(255, 255, 255, 0.98) 50%, rgba(255, 255, 255, 0.2) 65%, transparent 100%);
      transform: skewX(-18deg);
      z-index: 4;
      animation: prop-label-shine 2.8s ease-in-out infinite; }
    .prop_label .prop_icon img {
      display: block;
      max-width: 70%;
      max-height: 70%;
      position: relative;
      z-index: 3; }
  .prop_label p {
    text-align: center;
    font-size: .15rem;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    color: #000000;
    font-weight: bold; }

@keyframes prop-label-shine {
  0%, 18% {
    transform: translateX(0) skewX(-18deg);
    opacity: 0; }
  30% {
    opacity: 1; }
  58%, 100% {
    transform: translateX(350%) skewX(-18deg);
    opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .prop_label .prop_icon::after,
  .main_reward .reward,
  .main_reward .reward_top .btn .fire-spark,
  .mobile_button .fire-spark {
    animation: none; } }
footer {
  width: 100%;
  overflow: hidden;
  background: #312E34;
  padding: 0 0 .26rem 2rem; }
  footer .footer_copyright {
    display: flex;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: .2rem; }
    footer .footer_copyright span {
      font-size: .14rem;
      display: block;
      min-width: 6rem;
      font-family: pf;
      color: #DBDBDB; }
    footer .footer_copyright div {
      overflow: hidden; }
      footer .footer_copyright div p {
        font-size: .14rem;
        color: #8B8B8B;
        font-family: pf;
        padding: .06rem 0; }
  footer .footer_info {
    display: flex;
    align-items: flex-start;
    padding: .42rem 0 .4rem 0; }
    footer .footer_info .footer_left {
      min-width: 6rem; }
      footer .footer_info .footer_left img {
        display: block;
        width: 2.66rem;
        margin-bottom: .12rem; }
      footer .footer_info .footer_left p {
        font-size: .14rem;
        font-family: pf;
        color: #8B8B8B;
        line-height: 1.6; }
    footer .footer_info .footer_nav {
      padding-top: .18rem;
      display: flex;
      align-items: flex-start;
      overflow: hidden; }
      footer .footer_info .footer_nav .item {
        overflow: hidden;
        margin-right: 1.68rem; }
        footer .footer_info .footer_nav .item p {
          font-size: .2rem;
          font-family: pf;
          color: #fff; }
        footer .footer_info .footer_nav .item a {
          display: block;
          font-size: .16rem;
          font-family: pf;
          margin-top: .14rem;
          color: #8B8B8B;
          transition: all .2s; }
          footer .footer_info .footer_nav .item a:hover {
            color: #FF6A00; }

.left_share {
  width: 2.32rem;
  height: 4.2rem;
  background-image: url(/static/images/sharebg.png);
  background-size: 100% 100%;
  position: fixed;
  left: .5rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 999;
  padding: .4rem 0 0 0; }
  .left_share .code {
    display: block;
    width: 1.48rem;
    margin: 0 auto; }
  .left_share p {
    text-align: center;
    font-size: .18rem;
    margin-bottom: .16rem;
    font-weight: bold;
    color: #000000;
    margin-top: .06rem; }
  .left_share a {
    display: flex;
    align-items: center;
    width: 1.58rem;
    height: .47rem;
    margin: 0 auto;
    background-image: url(/static/images/bg3.png);
    background-size: 100% 100%;
    margin-bottom: .09rem;
    padding-left: .2rem;
    box-sizing: border-box;
    font-size: .18rem;
    color: #000000; }
    .left_share a img {
      width: .32rem;
      margin-right: .088rem; }

.my_gift {
  width: 1.77rem;
  position: absolute;
  z-index: 999;
  top: 1.02rem;
  right: .9rem; }
  .my_gift img {
    width: 100%;
    display: block; }

.content header .nav .login,
.my_gift,
.content .main_reward .reward_top .btn,
.content .main_reward .reward_box .reward_item .bottom_tip .btn,
.left_share a {
  cursor: pointer;
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
  transform-origin: center center; }
  .content header .nav .login:hover,
  .my_gift:hover,
  .content .main_reward .reward_top .btn:hover,
  .content .main_reward .reward_box .reward_item .bottom_tip .btn:hover,
  .left_share a:hover {
    transform: translateY(-0.01rem) scale(1.02);
    filter: brightness(1.12) saturate(1.08); }
  .content header .nav .login:active,
  .my_gift:active,
  .content .main_reward .reward_top .btn:active,
  .content .main_reward .reward_box .reward_item .bottom_tip .btn:active,
  .left_share a:active {
    transform: translateY(0) scale(0.98); }

.main_page {
  width: 100%;
  position: relative; }
  .main_page::after {
    content: '';
    width: 100%;
    height: calc(100% - 8rem);
    background-image: url(https://cdn.18youxi.vip/uploads/20260821/9068078ed2675a0b7e0b666c2b7c8392.png);
    background-size: cover;
    position: absolute;
    background-position: bottom center;
    left: 0;
    top: 8rem;
    z-index: 4; }
  .main_page .video-area {
    width: 100%;
    display: block;
    height: 11rem;
    position: relative;
    z-index: 3; }
    .main_page .video-area video {
      height: 100%;
      width: 100%; }
  .main_page .main_page_content {
    width: 100%;
    margin-top: -5rem;
    position: relative;
    z-index: 9;
    overflow: hidden;
    padding-top: 1.4rem;
    padding-bottom: 1.12rem; }
    .main_page .main_page_content::after {
      content: '';
      width: 100%;
      height: 3rem;
      background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.9) 30%, rgba(255, 255, 255, 0.96) 50%, white 66%, rgba(255, 255, 255, 0) 100%);
      background-size: 100%;
      position: absolute;
      left: 0;
      top: 0;
      z-index: 2; }
    .main_page .main_page_content .w1200 {
      width: 12rem;
      margin: 0 auto;
      position: relative;
      z-index: 9; }
      .main_page .main_page_content .w1200 .data_list {
        width: 100%;
        overflow: hidden; }
        .main_page .main_page_content .w1200 .data_list .data_item {
          width: 100%;
          margin-top: .36rem; }
          .main_page .main_page_content .w1200 .data_list .data_item .head {
            font-size: .24rem;
            font-weight: bold;
            color: #FF6A00;
            letter-spacing: .02rem;
            padding: .2rem 0;
            border-bottom: 1px dashed #D9D9D9; }
          .main_page .main_page_content .w1200 .data_list .data_item .listBox {
            display: flex;
            align-items: flex-start;
            padding: .28rem 0 0 0; }
            .main_page .main_page_content .w1200 .data_list .data_item .listBox .name {
              width: 1rem;
              height: .35rem;
              background-image: url(/static/images/title1.png);
              background-size: 100% 100%;
              display: flex;
              align-items: center;
              justify-content: center;
              font-size: .14rem;
              color: #FFD1B1;
              font-weight: bold;
              padding-bottom: .04rem;
              letter-spacing: .01rem; }
            .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow {
              width: calc(100% - 1rem);
              flex-wrap: wrap;
              display: grid;
              grid-template-columns: repeat(4, 1fr);
              gap: .1rem; }
              .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow a {
                display: block;
                font-size: .16rem;
                color: #5E5E5E;
                font-weight: bold;
                box-sizing: border-box;
                position: relative;
                letter-spacing: .01rem;
                line-height: 2;
                transition: all .3s;
                padding-left: .32rem; }
                .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow a:hover {
                  padding-left: .4rem;
                  color: #FF6A00; }
                  .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow a:hover::after {
                    transform: translateY(-50%) rotate(-45deg); }
                .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow a::after {
                  content: '';
                  width: .06rem;
                  height: .06rem;
                  background: #D45801;
                  position: absolute;
                  left: .18rem;
                  top: 50%;
                  transform: translateY(-50%) rotate(45deg);
                  z-index: 9;
                  transition: all .3s; }

.main_info {
  width: 100%;
  padding: .9rem 0; }
  .main_info .main_info_text {
    width: 100%;
    padding: .24rem 0; }
    .main_info .main_info_text p {
      font-size: .18rem;
      line-height: 1.8;
      color: #626262; }
      .main_info .main_info_text p.t {
        font-weight: bold;
        color: #FF6A00;
        margin-bottom: .06rem; }
    .main_info .main_info_text div {
      padding: .16rem 0; }
  .main_info .main_info_title {
    width: 100%;
    padding-bottom: .22rem;
    border-bottom: 1px dashed #D9D9D9; }
    .main_info .main_info_title p {
      font-size: .36rem;
      color: #000000;
      text-align: center;
      font-weight: bold; }
    .main_info .main_info_title .info_desc {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: .32rem; }
      .main_info .main_info_title .info_desc .date {
        display: flex;
        align-items: center;
        font-size: .16rem;
        color: #707070; }
        .main_info .main_info_title .info_desc .date img {
          width: .24rem;
          margin-right: .06rem; }
      .main_info .main_info_title .info_desc .log {
        overflow: hidden; }
        .main_info .main_info_title .info_desc .log a {
          display: flex;
          align-items: center;
          font-size: .16rem;
          color: #707070;
          font-weight: bold; }
          .main_info .main_info_title .info_desc .log a img {
            display: block;
            height: .25rem;
            width: auto;
            margin-right: .1rem; }

.public_head {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #FFA200;
  justify-content: space-between;
  padding: .2rem .06rem;
  position: relative;
  width: 100%; }
  .public_head::after {
    content: '';
    width: .06rem;
    height: .06rem;
    background: #FFA200;
    position: absolute;
    bottom: -.03rem;
    left: 0;
    z-index: 9;
    transform: rotate(45deg); }
  .public_head::before {
    content: '';
    width: .06rem;
    height: .06rem;
    background: #FFA200;
    position: absolute;
    bottom: -.03rem;
    right: 0;
    z-index: 9;
    transform: rotate(45deg); }
  .public_head .now {
    font-size: .18rem;
    font-weight: bold;
    color: #312E34; }
  .public_head ul {
    display: flex;
    align-items: center; }
    .public_head ul li {
      position: relative;
      font-size: .18rem;
      font-weight: bold;
      transition: all .2s;
      color: #312E34;
      padding: 0 .01rem; }
      .public_head ul li:last-child a {
        color: #FF6A00; }
      .public_head ul li a {
        display: block;
        font-size: .18rem;
        font-weight: bold;
        transition: all .3s;
        color: #312E34; }
        .public_head ul li a:hover {
          color: #FF6A00; }

.game-info-page .main_page_content {
  padding-bottom: 1.3rem; }
.game-info-page .game-intro {
  width: 100%;
  color: #312E34; }
  .game-info-page .game-intro .section-heading {
    position: relative;
    text-align: center;
    padding-bottom: .28rem;
    margin-bottom: .36rem; }
    .game-info-page .game-intro .section-heading::after {
      content: '';
      position: absolute;
      left: 50%;
      bottom: 0;
      width: .66rem;
      height: .03rem;
      transform: translateX(-50%);
      background: #D45801; }
    .game-info-page .game-intro .section-heading span {
      display: block;
      margin-bottom: .08rem;
      font-size: .12rem;
      color: #B17A4F;
      letter-spacing: .03rem; }
    .game-info-page .game-intro .section-heading h1,
    .game-info-page .game-intro .section-heading h2 {
      font-size: .36rem;
      line-height: 1.25;
      color: #2F2722;
      font-weight: bold;
      letter-spacing: .04rem; }
.game-info-page .game-overview {
  position: relative;
  padding: .62rem .92rem .66rem;
  background: rgba(255, 255, 255, 0.56); }
  .game-info-page .game-overview::before {
    left: 0; }
  .game-info-page .game-overview::after {
    right: 0; }
  .game-info-page .game-overview > p {
    max-width: 9.4rem;
    margin: 0 auto;
    font-size: .2rem;
    line-height: 2;
    text-align: center;
    color: #5E514A;
    font-weight: bold; }
.game-info-page .story-background .story-chapter {
  position: relative;
  padding: .46rem .56rem .5rem 1.2rem;
  margin-top: .28rem;
  background-image: url(/static/images/bg2.png);
  background-image: url(/static/images/linkbg.png);
  background-size: 100% 100%; }
  .game-info-page .story-background .story-chapter h3 {
    display: flex;
    align-items: center;
    margin-bottom: .22rem;
    font-family: dh, pf;
    font-size: .26rem;
    color: #312E34;
    font-weight: bold;
    letter-spacing: .02rem; }
    .game-info-page .story-background .story-chapter h3 span {
      display: flex;
      align-items: center;
      justify-content: center;
      width: .48rem;
      height: .48rem;
      margin-right: .16rem;
      border: 1px solid #D45801;
      color: #D45801;
      font-size: .2rem;
      letter-spacing: 0; }
  .game-info-page .story-background .story-chapter p {
    font-size: .17rem;
    line-height: 2.05;
    color: #625952;
    text-align: justify;
    text-indent: 2em; }
.game-info-page .story-arc {
  position: relative;
  padding-top: .82rem; }
  .game-info-page .story-arc::before {
    content: '';
    position: absolute;
    left: .39rem;
    top: 1.1rem;
    bottom: .5rem;
    width: 1px;
    background: linear-gradient(#D45801, rgba(212, 88, 1, 0.08)); }
  .game-info-page .story-arc .arc-item {
    position: relative;
    display: grid;
    grid-template-columns: .8rem 1fr;
    gap: .34rem;
    padding-bottom: .46rem; }
    .game-info-page .story-arc .arc-item .arc-mark {
      position: relative;
      z-index: 2;
      display: flex;
      align-items: center;
      justify-content: center;
      width: .8rem;
      height: .8rem;
      border: 1px solid rgba(212, 88, 1, 0.55);
      background: #FFF9F2;
      color: #D45801;
      font-family: dh, pf;
      font-size: .34rem;
      font-weight: bold;
      box-shadow: inset 0 0 0 0.07rem #fff, inset 0 0 0 0.08rem rgba(212, 88, 1, 0.18); }
    .game-info-page .story-arc .arc-item .arc-copy {
      padding: .06rem .4rem .36rem 0;
      border-bottom: 1px dashed #D9CFC7; }
      .game-info-page .story-arc .arc-item .arc-copy h3 {
        margin-bottom: .12rem;
        font-size: .22rem;
        line-height: 1.5;
        color: #332A25;
        font-weight: bold;
        letter-spacing: .02rem; }
      .game-info-page .story-arc .arc-item .arc-copy p {
        font-size: .17rem;
        line-height: 2;
        color: #625952;
        text-align: justify; }

.main_contact {
  overflow: hidden;
  padding: .6rem 0; }
  .main_contact .t {
    text-align: center;
    font-size: .3rem;
    font-weight: bold;
    color: #000; }
  .main_contact .d {
    text-align: center;
    font-size: .16rem;
    color: #666;
    margin-top: .2rem; }
  .main_contact .code {
    width: 1.6rem;
    margin: 0 auto;
    margin-top: .2rem; }
    .main_contact .code img {
      width: 100%; }
  .main_contact .font {
    overflow: hidden;
    margin-top: .2rem; }
    .main_contact .font p {
      font-size: .18rem;
      color: #000;
      text-align: center;
      font-weight: bold; }
    .main_contact .font span {
      display: block;
      text-align: center;
      font-size: .16rem;
      color: #666;
      margin-top: .1rem; }

@media (max-width: 1000px) {
.fadein_login .login_box .close{
    top:-100px;right:10px;
    width:.8rem;
}
  .content header {
    height: 1rem;
    padding: 0 .3rem; }

  .content header .nav ul {
    display: none; }

  .content header .logo {
    width: 1.4rem; }

  .content header .nav .login {
    height: 80%; }

  .left_share {
    display: none; }

  .content .message_box {
    display: none; }

  .content .main_content {
    background-size: auto 4.6rem;
    background-position: top center;
    padding-top: 4.6rem; }

  .content .main_content .count {
    position: relative;
    z-index: 9;
    margin-top: 0; }

  .content .main_content .bg1 {
    top: 4.06rem; }

  .content .main_content .content_title {
    width: 5.46rem; }

  .content .main_reward {
    width: 6.9rem;
    background: linear-gradient(90deg, #FEFDFC, #FAF1E3);
    border-radius: .16rem;
    height: auto; }

  .content .main_reward .reward_top {
    padding: .3rem;
    /*padding-left: 1rem;*/
    flex-wrap: wrap; }

  .content .main_reward .reward {
    left: 0rem;
    top: -.2rem; }

  .content .main_reward .reward_top {
    padding-left: 1rem;
    padding-bottom: .5rem; }

  .prop_label p {
    font-size: .22rem; }

  .content .main_reward .reward_top .btn {
    width: 100%;
    margin-top: .2rem; }

  .content .main_reward .reward_top .btn img {
    width: 2.8rem;
    margin: 0 auto; }

  .prop_label p {
    white-space: nowrap; }

  .prop_label .prop_icon {
    width: 1.46rem;
    height: 1.46rem; }

  .content .main_reward .reward_top .btn {
    display: none; }

  .my_gift {
    width: 1.6rem;
    right: .3rem;
    position: fixed;
    top: 3.8rem; }

  .prop_label {
    padding-bottom: .2rem; }

  .content .main_reward .reward_box {
    display: block;
    overflow: hidden;
    margin: 0; }

  .content .main_home {
    margin-top: .4rem; }

  .content .main_reward .reward_box .reward_item {
    width: 94%;
    margin: 0 auto;
    height: 3.2rem;
    padding: .3rem;
    padding-bottom: 0;
    margin-bottom: .2rem; }

  .content .main_reward .reward_box .reward_item .bottom_tip {
    margin-top: .1rem; }

  .content .main_reward .reward_box .reward_item .title {
    font-size: .28rem;
    letter-spacing: .02rem; }

  .content .main_reward .reward_box .reward_item .desc {
    font-size: .22rem;
    line-height: 1.8; }

  .content .main_reward .reward_box .reward_item .list .prop_label .prop_icon {
    width: 1.2rem;
    height: 1.2rem; }

  .content .main_reward .reward_box .reward_item .list .prop_label {
    padding-bottom: .2rem; }

  .content .main_reward .reward_box .reward_item .bottom_tip .btn {
    width: 1.2rem;
    height: .6rem; }

  .content .main_reward .reward_box .reward_item .bottom_tip p {
    font-size: .22rem; }

  .content .main_news {
    width: 6.9rem;
    margin: 0 auto;
    height: auto;
    display: block; }

  .content .main_news .news_slide {
    width: 100%; }

  .content .main_news .news_grow {
    width: 100%;
    padding: .2rem;
    padding-top: 0; }

  .content .main_news .news_grow .tabbar div {
    font-size: .26rem; }

  .content .main_news .news_grow .tabbar {
    height: .88rem;
    background-size: 100%; }

  .content .main_news .news_grow .tabbar .more {
    width: .46rem;
    right: 0; }

  .content .main_news .news_grow .tabbar div::after {
    bottom: .04rem;
    height: .06rem; }

  .content .main_news .news_grow .tabbar div.active::after {
    width: .36rem; }

  .content .main_news .news_grow .news_fade .news_item .label a p {
    font-size: .26rem;
    max-width: 5.6rem; }

  .content .main_news .news_grow .news_fade .news_item {
    padding: .2rem 0; }

  .content .main_news .news_grow .news_fade .news_item .label {
    height: .68rem; }

  .content .main_news .news_grow .news_fade .news_item .label a {
    padding: 0; }

  .content .main_news .news_grow .news_fade .news_item .label a span {
    font-size: .26rem; }

  .content .main_news_more {
    width: 6.9rem;
    margin-top: .3rem;
    grid-template-columns: repeat(2, 1fr);
    gap: .2rem; }

  .content .main_news_more .label {
    height: 2.2rem; }

  .content .main_role {
    width: 6.9rem;
    margin: 0 auto; }

  .content .main_scene {
    width: 6.9rem;
    margin: 0 auto; }

  .public_title {
    width: 4.6rem;
    height: .8rem; }

  .public_title p {
    font-size: .32rem; }

  footer {
    padding: .3rem; }

  footer .footer_info {
    display: block; }

  footer .footer_info .footer_left {
    min-width: auto;
    width: 100%; }

  footer .footer_info .footer_left img {
    margin: 0 auto;
    margin-bottom: .2rem; }

  footer .footer_info .footer_left p {
    text-align: center;
    font-size: .22rem;
    line-height: 2; }

  footer .footer_info .footer_nav {
    margin-top: .3rem;
    justify-content: space-around; }

  footer .footer_info .footer_nav .item p {
    font-size: .24rem; }

  footer .footer_info .footer_nav .item a {
    font-size: .22rem; }

  footer .footer_info .footer_nav .item {
    margin: 0; }

  footer .footer_copyright {
    display: block;
    padding: .3rem 0; }

  footer .footer_copyright span {
    min-width: auto;
    text-align: center;
    font-size: .22rem;
    margin-bottom: .3rem; }

  footer .footer_copyright div p {
    font-size: .2rem;
    text-align: center; }

  .content .main_home::after {
    height: 104%;
    background-size: cover; }

  .content .main_role .role_box {
    height: 5rem; }

  .content .main_scene .scene_box {
    margin-top: .46rem; }

  .w1200 {
    width: 100% !important; }

  .main_page .main_page_content .w1200 {
    padding: 0 .3rem; }

  .public_head .now {
    font-size: .26rem; }

  .public_head ul li {
    font-size: .24rem; }

  .public_head ul li a {
    font-size: .24rem; }

  .main_page .main_page_content {
    padding-top: 1rem; }

  .public_head::after, .public_head::before {
    width: .1rem;
    height: .1rem;
    bottom: -.05rem; }

  .main_page .main_page_content .w1200 .data_list .data_item .head {
    font-size: .28rem; }

  .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow {
    width: 100%;
    margin-top: .3rem;
    grid-template-columns: repeat(3, 1fr); }

  .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow a {
    font-size: .24rem; }

  .main_page .main_page_content .w1200 .data_list .data_item .listBox .grow a::after {
    width: .1rem;
    height: .1rem;
    top: .18rem;
    transform: translate(0) rotate(45deg);
    left: .1rem; }

  .main_page .main_page_content .w1200 .data_list .data_item .listBox .name {
    width: 2.6rem;
    height: .8rem;
    margin: 0 auto;
    font-size: .26rem; }

  .main_page .main_page_content .w1200 .data_list .data_item .listBox {
    display: block; }

  .main_info .main_info_title .info_desc .log a img {
    height: .38rem; }

  .main_info .main_info_title .info_desc .log a {
    font-size: .24rem; }

  .main_info .main_info_title .info_desc .date {
    font-size: .24rem; }

  .main_info .main_info_title .info_desc .date img {
    width: .3rem; }

  .main_info .main_info_text p {
    font-size: .26rem; }

  .public_head .now {
    font-size: .26rem !important; }

  .game-info-page .game-overview > p {
    max-width: 100%;
    font-size: .26rem; }

  .game-info-page .story-background .story-chapter {
    padding: .3rem .5rem; }

  .game-info-page .story-background .story-chapter p {
    font-size: .22rem; }

  .game-info-page .story-arc .arc-item .arc-copy h3 {
    font-size: .28rem; }

  .game-info-page .story-arc .arc-item .arc-copy p {
    font-size: .24rem; }

  .mobile_navbar {
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    z-index: 1010;
    left: 0;
    top: 0;
    display: none;
    padding-top: 1rem; }

  .header {
    z-index: 1011; }

  .mobile_navbar .box {
    width: 100%;
    position: absolute;
    left: 0;
    top: 100%;
    overflow: auto;
    height: 100%;
    background: #1A1A1A;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); }

  .mobile_navbar .box ul {
    overflow: hidden;
    padding: 0 .3rem; }

  .mobile_navbar .box ul li {
    overflow: hidden;
    width: 100%;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2); }

  .mobile_navbar .box ul li > a {
    display: flex;
    align-items: center;
    height: 100%;
    height: .9rem;
    font-size: .28rem;
    color: #fff;
    opacity: 0.8;
    justify-content: space-between; }

  .mobile_navbar .box ul li > a.on img {
    transform: rotate(90deg); }

  .mobile_navbar .box ul li > a img {
    transition: all .2s; }

  .childer {
    overflow: hidden;
    padding-left: .3rem;
    display: none; }

  .childer a {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ECECEC;
    height: 100%;
    height: .9rem;
    padding-left: .5rem;
    font-size: .26rem;
    color: #333; }

  .childer a:last-child {
    border: none; }

  .mobile_navbar .box > img {
    width: .4rem;
    margin: .3rem;
    float: right; }

  .mobile_navbar .box ul li div {
    display: none; }

  .mobile_navbar .box ul li div a {
    display: flex;
    align-items: center;
    height: 1rem;
    padding-left: .6rem;
    color: #9D9EA5;
    font-size: .28rem; }

  .menus {
    width: .56rem;
    height: .56rem;
    background-image: url(/static/images/menu.png);
    transition: all .3s;
    background-size: 100% 100%;
    margin-left: .2rem;
    display: block; }
    .menus.on {
      background-image: url(/static/images/closew.png); }

  .content header {
    z-index: 1011; }
    .content header.on {
      background: rgba(255, 255, 255, 0.9); }

  .header .link {
    display: none; }

  header {
    padding: 0 0.3rem; }

  .mobile_navbar .box {
    background-image: url(https://cdn.18youxi.vip/uploads/20260821/9068078ed2675a0b7e0b666c2b7c8392.png);
    background-size: cover; }

  .mobile_navbar .box ul li > a {
    color: #000; }

  .mobile_navbar .box ul li {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06); }

  .main_contact .t {
    font-size: .36rem; }

  .main_contact .d {
    font-size: .24rem;
    line-height: 1.66; }

  .main_contact .code {
    width: 2.2rem; }

  .main_contact .font p {
    font-size: .24rem; }

  .main_contact .font span {
    font-size: .22rem; }

  .content .main_role .role_box .swiper-container .swiper-slide {
    align-items: flex-start; }

  .content .main_role .role_box .swiper-container .swiper-slide .item {
    width: 3.4rem;
    height: 100%; }

  .content .main_role .role_box .swiper-container .swiper-slide .item .user {
    top: auto;
    bottom: 0;
    transform: translate(0%, 0%) scale(1); }

  .content .main_role .role_box .swiper-container .swiper-slide.swiper-slide-active .item .user {
    top: auto;
    bottom: 0;
    transform: translate(0%, 0%) scale(1); }

  .content .main_role .role_box .btn.prev {
    left: .2rem; }

  .content .main_role .role_box .btn.next {
    right: .2rem; }

  .content .main_reward .reward_top .btn {
    margin: 0 auto;
    margin-top: .2rem; }

  .mobile_button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
    left: 0;
    z-index: 99;
    bottom: 0rem;
    padding: .3rem; }
    .mobile_button .fire-sparks {
      position: absolute;
      left: -1.35rem;
      right: -1.35rem;
      top: -2.55rem;
      bottom: .7rem;
      overflow: visible;
      pointer-events: none;
      z-index: 3; }
    .mobile_button .fire-spark {
      position: absolute;
      left: 50%;
      bottom: .02rem;
      width: .022rem;
      height: .022rem;
      border-radius: 50% 50% 45% 45%;
      background: #FFF3A6;
      box-shadow: 0 0 0.06rem rgba(255, 173, 32, 0.95);
      opacity: 0;
      box-shadow: 0 0 .04rem 2px #ff3200cc;
      background-color: #ffdc82;
      transform: translate3d(0, 0, 0) rotate(20deg) scale(0.55);
      animation: fire-spark-rise 2.2s ease-out infinite; }
    .mobile_button .fire-spark:nth-child(3n) {
      width: .022rem;
      height: .022rem;
      background: #FF8A18; }
    .mobile_button .fire-spark:nth-child(4n) {
      width: .022rem;
      height: .022rem;
      background: #FFE477; }
    .mobile_button .s1 {
      margin-left: -1.05rem;
      animation-delay: -.15s;
      --spark-x: -.42rem;
      --spark-y: -1.02rem;
      --spark-r: -28deg; }
    .mobile_button .s2 {
      margin-left: -.78rem;
      animation-delay: -.9s;
      --spark-x: .24rem;
      --spark-y: -1.28rem;
      --spark-r: 18deg; }
    .mobile_button .s3 {
      margin-left: -.54rem;
      animation-delay: -.46s;
      --spark-x: -.2rem;
      --spark-y: -.76rem;
      --spark-r: 32deg; }
    .mobile_button .s4 {
      margin-left: -.3rem;
      animation-delay: -1.38s;
      --spark-x: .48rem;
      --spark-y: -1.12rem;
      --spark-r: -18deg; }
    .mobile_button .s5 {
      margin-left: -.08rem;
      animation-delay: -.68s;
      --spark-x: -.3rem;
      --spark-y: -1.48rem;
      --spark-r: 12deg; }
    .mobile_button .s6 {
      margin-left: .16rem;
      animation-delay: -1.8s;
      --spark-x: .58rem;
      --spark-y: -.86rem;
      --spark-r: 35deg; }
    .mobile_button .s7 {
      margin-left: .38rem;
      animation-delay: -.22s;
      --spark-x: -.38rem;
      --spark-y: -1.18rem;
      --spark-r: -22deg; }
    .mobile_button .s8 {
      margin-left: .62rem;
      animation-delay: -1.1s;
      --spark-x: .3rem;
      --spark-y: -1.64rem;
      --spark-r: 24deg; }
    .mobile_button .s9 {
      margin-left: .86rem;
      animation-delay: -.58s;
      --spark-x: .5rem;
      --spark-y: -.8rem;
      --spark-r: -34deg; }
    .mobile_button .s10 {
      margin-left: -.92rem;
      animation-delay: -1.62s;
      --spark-x: -.56rem;
      --spark-y: -1.38rem;
      --spark-r: 20deg; }
    .mobile_button .s11 {
      margin-left: -.42rem;
      animation-delay: -.34s;
      --spark-x: .2rem;
      --spark-y: -1.06rem;
      --spark-r: -30deg; }
    .mobile_button .s12 {
      margin-left: .02rem;
      animation-delay: -1.26s;
      --spark-x: -.42rem;
      --spark-y: -1.72rem;
      --spark-r: 30deg; }
    .mobile_button .s13 {
      margin-left: .5rem;
      animation-delay: -.78s;
      --spark-x: .54rem;
      --spark-y: -1.32rem;
      --spark-r: -12deg; }
    .mobile_button .s14 {
      margin-left: .78rem;
      animation-delay: -1.94s;
      --spark-x: -.16rem;
      --spark-y: -.94rem;
      --spark-r: 28deg; }
    .mobile_button .s15 {
      margin-left: 1.02rem;
      animation-delay: -1.02s;
      --spark-x: .4rem;
      --spark-y: -1.52rem;
      --spark-r: -24deg; }
    .mobile_button .btn {
      width: 60%;
      height: 1.46rem;
      background-image: url(/static/images/mbtn.png);
      background-size: 100% 100%;
      display: flex;
      align-items: center;
      margin: 0 .2rem;
      justify-content: center;
      font-size: .28rem;
      color: #fff; }
      .mobile_button .btn a {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: .28rem;
        padding-bottom: .14rem;
        font-weight: bold;
        color: #fff; }

  .content .main_reward .reward_box .reward_item {
    display: flex;
    align-items: center; }

  .content .main_reward .reward_box .reward_item .bottom_tip {
    display: block; }

  .content .main_reward .reward_box .reward_item {
    width: 100%;
    background: none;
    height: auto;
    justify-content: space-between;
    padding: .1rem 0; }

  .content .main_reward .reward {
    width: 1.2rem; }

  .content .main_reward .reward_top {
    padding-left: 1.8rem; }

  .content .main_reward .reward_box .reward_item .bottom_tip p {
    font-size: .2rem; }

  .content .main_reward .reward_box .reward_item .bottom_tip .btn {
    margin: 0 auto; }

  .content .main_reward .reward_box .reward_item .title {
    font-size: .24rem; }

  .content .main_reward .reward_box .reward_item .desc {
    font-size: .16rem; }

  .prop_label p {
    font-size: .18rem; }

  .content .main_reward .reward_box .reward_item .list .prop_label .prop_icon {
    width: 1rem;
    height: 1rem; } }

/*# sourceMappingURL=css.css.map */