html,body,div,p,ul,li,dl,dt,dd,em,i,span,a,img,input,h1,h2,h3,h4,h5 {margin:0;padding:0}
    a,img,input {border:none;}
    body{font: 14px/1.75 -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;}
    a {text-decoration:none;}
    ul,li{list-style: none}
    html{font-size:100px;}
    img{
        pointer-events:none;
        display: block;
    }
    *{
        outline:none;
        -webkit-tap-highlight-color:transparent;
        -webkit-focus-ring-color:transparent;
        -webkit-user-select:none;
        user-select:none;
    }
    input, textarea{
        -webkit-user-select: text;
        user-select: text;
    }
    *, :after, :before {
        box-sizing: border-box;
    }
    body::-webkit-scrollbar {
        display: none;
    }
    body{
        scrollbar-width: none; /* firefox */
        -ms-overflow-style: none; /* IE 10+ */
    }

    body,
    html {
        width: 100%;
        height: 100%;
        overflow: hidden;
        box-sizing: border-box;
    }

    @font-face {
        font-family: "SourceHanSerifCN-Bold";
        src: url('https://game.gtimg.cn/images/kazan/cp/a20251201subscribe/fonts/SourceHanSerifCN-Bold.ttf');
    }
    @font-face {
        font-family: "SourceHanSerifCN-Heavy";
        src: url('https://game.gtimg.cn/images/kazan/cp/a20251201subscribe/fonts/SourceHanSerifCN-Heavy.ttf');
    }
    @font-face {
        font-family: "SourceHanSerifCN-Light";
        src: url('https://game.gtimg.cn/images/kazan/cp/a20251201subscribe/fonts/SourceHanSerifCN-Light.ttf');
    }
    @font-face {
        font-family: "SourceHanSerifCN-Medium";
        src: url('https://game.gtimg.cn/images/kazan/cp/a20251201subscribe/fonts/SourceHanSerifCN-Medium.ttf');
    }
    @font-face {
        font-family: "SourceHanSerifCN-Regular";
        src: url('https://game.gtimg.cn/images/kazan/cp/a20251201subscribe/fonts/SourceHanSerifCN-Regular.ttf');
    }
    @font-face {
        font-family: "SourceHanSerifCN-SemiBold";
        src: url('https://game.gtimg.cn/images/kazan/cp/a20251201subscribe/fonts/SourceHanSerifCN-SemiBold.ttf');
    }
    .gray-dom{
        filter: grayscale(100%);
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);
    }
    .hide-scroll-bar{
        overflow-y: scroll;
        overflow-x: hidden;
        white-space: nowrap;
    }
    .hide-scroll-bar::-webkit-scrollbar {
        display: none; /* Chrome Safari */
    }

    .row-box{
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    .column-box{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .container,.page-swiper {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: relative;
    }
    .swiper-slide{
        overflow: hidden;
    }
    .swiper-slide .swiper-page{
        /*transform: scale(0.9) translateX(3.75rem);*/
        opacity:0;
        transition: all 1000ms;
    }
    .ani-slide .swiper-page{
        /*transform: scale(1) translateX(0rem);*/
        opacity:1;
    }
    .swiper-page{
        z-index: 5;
        width: 100%;
        height: 100%;
        position: absolute;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }
    .rp {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }
    .page {
        z-index: 5;
        width: 100%;
        height: 100%;
        position: absolute;
        overflow: hidden;
    }
    .page-scroll{
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 5;
        overflow-x: hidden;
        overflow-y: scroll;
    }
    .page-scroll::-webkit-scrollbar {
        display: none; /* Chrome Safari */
    }
    .page-scroll .page{
        top: 0;
        margin-top: 0;
    }
    .page-content{
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 2;
        top: 0;
        left: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .bg {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 0;
        overflow: hidden;
    }
    .bg-mask-blur{
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: blur(0.50rem);
        position: absolute;
        left: 0;
        top: 0;
        z-index: 0;
    }
    .bg-img{
        width: 100%;
        height: 100%;
        display: block;
        pointer-events: none;
        -o-object-fit: cover;
        object-fit: cover;
        position: absolute;
        z-index: 0;
    }
    .bg-mask{
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        z-index: 10;
        top: 0;
        left: 0;
        opacity: 0.65;
        pointer-events: none;
        -o-object-fit: fill;
        object-fit: fill;
    }
    .scroll-view {
        width: 100%;
        height: 100%;
        padding: 0.10rem;
        box-sizing: border-box;
        overflow: scroll;
        position: absolute;
    }
    /* 设置滚动条的样式 */
    .scroll-view::-webkit-scrollbar {
        width: 0.00rem;
        height: 0.00rem;
        background: #333333;
    }

    /* 滚动槽 */
    .scroll-view::-webkit-scrollbar-track {
        background: #AEAEAE;
    }

    /* 滚动条滑块 */
    .scroll-view::-webkit-scrollbar-thumb {
        background: #333333;
    }

    .scroll-view::-webkit-scrollbar-thumb:window-inactive {
        background: #333333;
    }
    /*  用户登录  */
    .header-login {
        color: #dbdbdb;
        font-size: 0.20rem;
        line-height: 0.30rem;
        font-family: "SourceHanSerifCN-Regular";
        position: absolute;
        z-index: 8;
        right: 4.34rem;
        top: 0.56rem;
    }
    .login-wrap{
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
    }
    .header-login .user-avatar,.header-login .userAvatar{
        width: 0.50rem;
        height: 0.50rem;
        border-radius: 50%;
        object-fit: cover;
        position: relative;
    }
    .header-login .user-avatar{
        background: #ffffff;
        margin-right: 0.12rem;
    }
    .header-login .icon-qq,.header-login .icon-wx{
        width: 0.25rem;
        height: 0.25rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/icon-qq-logo.png') no-repeat center / 100% 100%;
        position: absolute;
        right: -0.06rem;
        top: -0.06rem;
    }
    .header-login .icon-wx{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/icon-wx-logo.png') no-repeat center / 100% 100%;
    }
    .header-login a{
        display: inline-block;
        height: 0.30rem;
        color: #dbdbdb;
        margin-left: 0.15rem;
        white-space: nowrap;
        cursor: pointer;
    }
    .header-login span,.header-login a{
        user-select: all;
    }
    .logo{
        width: 1.26rem;
        height: 1.10rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/logo.png') no-repeat center / 100% 100%;
        position: absolute;
        left: 0.41rem;
        top: 0.23rem;
        z-index: 2;
    }
    .btn-home{
        width: 4.81rem;
        height: 0.93rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_home.png') no-repeat center / 100% 100%;
        display: block;
        position: absolute;
        left: 0.00rem;
        top: 2.11rem;
        z-index: 20;
    }
    .btn-help{
        width: 1.68rem;
        height: 0.98rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_help.png') no-repeat center / 100% 100%;
        display: block;
        position: absolute;
        left: 0.00rem;
        bottom: 0.00rem;
        z-index: 20;
    }
    .link-box{
        width: 1.00rem;
        height: 3.00rem;
        justify-content: space-between;
        padding: 0 0.10rem 0.60rem;
        position: absolute;
        right: 0.00rem;
        bottom: 0.00rem;
        z-index: 20;
    }
    .link-box .link-title{
        width: 0.37rem;
        height: 0.66rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/link_tit.png') no-repeat center / 100% 100%;
    }
    .link-box .link-bili{
        width: 0.30rem;
        height: 0.28rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/link_bili.png') no-repeat center / 100% 100%;
    }
    .link-box .link-wx{
        width: 0.35rem;
        height: 0.28rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/link_wx.png') no-repeat center / 100% 100%;
    }
    .link-box .link-wx::after {
        display: block;content: '';width: 257px;height: 257px;background-image: url(//game.gtimg.cn/images/kazan/act/a20241207index/sph.png);position: absolute;left: -280px;bottom: 0;z-index: 9;display: none;
    }
    .link-box .link-wx:hover::after {
        display: block;
    }
    .link-box .link-dnf{
        width: 0.36rem;
        height: 0.23rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/link_dnf.png') no-repeat center / 100% 100%;
    }
    .link-box .link-dnf::after {
        display: block;content: '';width: 257px;height: 257px;background-image: url(//game.gtimg.cn/images/kazan/act/a20241207index/xzs.png);position: absolute;left: -280px;bottom: 0;z-index: 9;display: none;
    }
    .link-box .link-dnf:hover::after {
        display: block;
    }
    .bottom-nav{
        width: 2.10rem;
        height: 4.21rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_nav_box.png') no-repeat center / 100% 100%;
        position: fixed;
        left: 0.00rem;
        top: 50%;
        margin-top: -2.105rem;
        z-index: 50;
    }
    .bottom-nav .btn-go-test{
        width: 1.38rem;
        height: 1.38rem;
        position: absolute;
        left: 0.46rem;
        margin-top: 0.535rem;
    }
    .bottom-nav .btn-go-test.active{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_test_on.png') no-repeat center / 100% 100%;
    }
    .bottom-nav .btn-go-draw{
        width: 1.38rem;
        height: 1.38rem;
        position: absolute;
        left: 0.46rem;
        margin-top: 2.365rem;
    }
    .bottom-nav .btn-go-draw.active{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_draw_on.png') no-repeat center / 100% 100%;
    }
    /*  0 主页  */
    .page .subscribe-box{
        width: 3.44rem;
        height: 0.67rem;
        position: absolute;
        right: 0.46rem;
        top: 0.46rem;
        z-index: 2;
    }
    .page .btn-subscribe,.page .btn-subscribe-off{
        width: 3.44rem;
        height: 0.67rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_subscribe.png') no-repeat center / 100% 100%;
        display: block;
    }
    .page .btn-subscribe-off{
        height: 0.66rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_subscribe_off.png') no-repeat center / 100% 100%;
    }
    .page .btn-wegame{
        width: 3.20rem;
        height: 0.93rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_wegame.png') no-repeat center / 100% 100%;
        position: absolute;
        left: 2.25rem;
        top: 0.40rem;
        z-index: 2;
    }
    .home-page .auto-content{
        width: 100%;
        height: 80%;
        justify-content: space-between;
    }
    .page .rule-btn-box{
        width: 1.31rem;
        height: 0.26rem;
        margin-top: 0.25rem;
    }
    .page .btn-rule{
        width: 1.31rem;
        height: 0.26rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/btn_rule.png') no-repeat center / 100% 100%;
    }
    .home-page .slogan{
        width: 6.72rem;
        height: 1.49rem;
        display: block;
    }
    .page .btn-test{
        width: 6.18rem;
        height: 1.13rem;
        display: block;
    }
    .page .btn-test .hover{
        content: '';
        display: block;
        width: 5.97rem;
        height: 0.83rem;
        position: absolute;
        left: 0.19rem;
        top: 0.17rem;
        z-index: 0;
    }
    .page .btn-test .img{
        width: 6.18rem;
        height: 1.13rem;
        position: absolute;
        z-index: 1;
    }
    .page .btn-test-report{
        width: 6.18rem;
        height: 1.13rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/home/btn_test_report.png') no-repeat center / 100% 100%;
        display: block;
    }
    .home-page .rule-btn-box{
        margin-top: 2.20rem;
    }
    /* ---------任务抽奖页-------- */
    .task-page .auto-content{
        width: 14.40rem;
        height: auto;
        margin-top: 0.90rem;
    }
    .task-page .title-img{
        width: 15.19rem;
        height: 1.49rem;
        display: block;
        margin-top: 0.30rem;
    }
    .task-page .draw-count{
        width: 100%;
        height: 0.30rem;
        line-height: 0.30rem;
        text-align: center;
        color: #ffffff;
        font-size: 0.20rem;
        font-family: SourceHanSerifCN-Light;
        margin-top: 0.16rem;
    }
    .task-page .draw-extend{
        width: 100%;
        height: 0.75rem;
        margin-top: 0.20rem;
    }
    .task-page .btn-address{
        width: 1.58rem;
        height: 0.41rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_address.png') no-repeat center / 100% 100%;
    }
    .task-page .btn-record{
        width: 0.98rem;
        height: 0.40rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_record.png') no-repeat center / 0.98rem 0.27rem;
    }
    .task-page .text-tips{
        width: 100%;
        height: 0.30rem;
        line-height: 0.30rem;
        text-align: left;
        color: #b4b4b4;
        font-size: 0.20rem;
        font-family: SourceHanSerifCN-Medium;
        margin-top: 0.00rem;
    }
    .task-page .draw-box{
        width: 5.99rem;
        height: 4.97rem;
        margin-top: 0.12rem;
    }
    .task-page .lottery-box,.task-page .lottery-box .lottery-bg{
        width: 5.99rem;
        height: 4.97rem;
        position: absolute;
        z-index: 2;
    }
    .task-page .lotterycontent_hover{
        background-size: 100% 100%;
        background-repeat:no-repeat;
        opacity: 0.7;
    }
    .task-page .btn-draw{
        width: 1.78rem;
        height: 1.40rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_draw.png') no-repeat center / 100% 100%;
        cursor: pointer;
        display: block;
        position: absolute;
        z-index: 12;
        margin-top: 1.80rem;
        margin-left: 2.08rem;
    }
    .task-page .btn-draw.disabled {
        filter: grayscale(100%);
    }
    .task-page .tit-task{
        width: 3.75rem;
        height: 0.30rem;
        display: block;
    }
    .task-page .rule-btn-box{
        width: 100%;
        height: 0.50rem;
        margin-top: 0.15rem;
    }
    .task-page .btn-refresh{
        width: 1.04rem;
        height: 0.50rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_refresh.png') no-repeat center / 100% 100%;
        cursor: pointer;
        display: block;
    }
    .task-page .task-box{
        width: 6.92rem;
        margin-top: 0.20rem;
        position: relative;
    }
    .task-box .task-list{
        width: 6.92rem;
    }
    .task-page .task-box .task-item{
        width: 100%;
        height: 0.84rem;
        margin-bottom: 0.10rem;
        position: relative;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    .task-page .task-box .task-item:after{
        content: '';
        display: block;
        width: 6.92rem;
        height: 0.01rem;
        position: absolute;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/task_line.png') no-repeat center / 100% 100%;
        bottom: -0.04rem;
    }
    .task-page .task-box .task-item:last-child:after{
        content: '';
        display: none;
    }
    .task-page .task-box .info{
        max-width: 4.55rem;
        line-height: 0.30rem;
        text-align: left;
    }
    .task-page .task-box .title{
        color: #ffffff;
        font-size: 0.24rem;
        font-family: SourceHanSerifCN-SemiBold;
    }
    .task-page .task-box .desc{
        color: #6f6e6e;
        font-size: 0.20rem;
        font-family: SourceHanSerifCN-Light;
    }
    .task-box .task-btn {
        width: 2.52rem;
        height: 0.50rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .task-box .task-btn:after{
        content: '';
        display: block;
        width: 2.52rem;
        height: 0.50rem;
        position: absolute;
    }
    .task-box .btn-received:after{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_finished.png') no-repeat center / 100% 100%;
    }
    .task-box .btn-receive:after{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_recive.png') no-repeat center / 100% 100%;
    }
    .task-box .btn-unfinished:after{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/draw/btn_recive.png') no-repeat center / 100% 100%;
    }
    .share-plane{
        width: 4.63rem;
        height: 2.17rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/share_panel.png') no-repeat center / 100% 100%;
        position: absolute;
    }
    .task-box .share-plane{
        left: 6.92rem;
        top: 1.25rem;
    }
    /* ---------答题页面1-------- */
    .fight-page .tit-img{
        width: auto;
        height: 0.41rem;
        display: block;
        margin-top: 0.15rem;
    }
    .fight-page .text-info{
        text-align: center;
        line-height: 0.36rem;
        font-size: 0.24rem;
        color: #ffffff;
        font-family: SourceHanSerifCN-SemiBold;
        margin-top: 0.60rem;
    }
    .fight-page .auto-content{
        width: 14.88rem;
        height: auto;
        margin-top: 0.90rem;
    }
    .fight-page .question-img-box{
    }
    .fight-page .question-img-box .question-tit{
        height: 0.50rem;
        line-height: 0.50rem;
        text-align: left;
        font-size: 0.35rem;
        color: #ffffff;
        font-family: SourceHanSerifCN-SemiBold;
    }
    .fight-page .question-img-box .question-img{
        width: 9.88rem;
        height: 5.63rem;
        object-fit: contain;
        margin-top: 0.20rem;
    }
    .fight-page .auto-content .column-box{
        position: relative;
    }
    .fight-page .answer-swiper{
        margin-top: 0.70rem;
        position: relative;
    }
    .fight-page .answer-swiper,.fight-page .swiper-slide{
        width: 4.50rem;
        height: 5.63rem;
        position: relative;
        overflow: hidden;
    }
    .fight-page .swiper-slide .answer-img{
        width: 2.89rem;
        height: 3.85rem;
        position: absolute;
        left: 0.84rem;
        top: 0.71rem;
    }
    .fight-page .swiper-slide .answer1{
        width: 4.16rem;
        height: 3.85rem;
        left: 0.82rem;
        top: 0.71rem;
    }
    .fight-page .swiper-slide .answer2{
        width: 2.87rem;
        height: 4.06rem;
        left: 0.84rem;
        top: 0.71rem;
    }
    .fight-page .swiper-slide .answer3{
        width: 4.76rem;
        height: 3.85rem;
        left: 0.42rem;
        top: 0.71rem;
    }
    .default-button-prev,.default-button-next,.default-img-prev,.default-img-next  {
        width: 1.62rem;
        height: 3.90rem;
        position: absolute;
        left: 0.00rem;
        transform: translateY(-50%);
        top: 2.68rem;
        z-index: 1;
        cursor: pointer;
    }
    .default-button-next,.default-img-next {
        left: unset;
        right: 0.00rem;
    }
    .default-img-prev{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_prev.png') no-repeat center / 100% 100%;
        z-index: 1;
    }
    .default-img-next{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_next.png') no-repeat center / 100% 100%;
        z-index: 1;
    }
    .default-button-prev>a {
        width: 100%;
        height: 100%;
        position: absolute;
    }
    .default-button-next>a {
        width: 100%;
        height: 100%;
        position: absolute;
    }
    .answer-button-prev,.answer-button-next,.answer-img-prev,.answer-img-next  {
        left: 50%;
        right: unset;
        transform: translateX(-50%);
        top: -2.20rem;
        z-index: 1;
        cursor: pointer;
    }
    .answer-button-next,.answer-img-next {
        top: unset;
        bottom: -2.20rem;
    }
    /*.default-button-prev>a {*/
    /*    background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_prev.png') no-repeat center / 100% 100%;*/
    /*}*/
    /*.default-button-next>a {*/
    /*    background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_next.png') no-repeat center / 100% 100%;*/
    /*}*/
    /*.default-button-prev:hover a {*/
    /*    background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_prev.png') no-repeat center / 100% 100%;*/
    /*}*/
    /*.default-button-next:hover a {*/
    /*    background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_next.png') no-repeat center / 100% 100%;*/
    /*}*/

    .fight-page .btn-match{
        width: 5.97rem;
        height: 0.83rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/btn_match.png') no-repeat center / 100% 100%;
        cursor: pointer;
        margin-top: 0.80rem;
    }
    /* ---------答题页面2-------- */
    .fight-page .tit-img2{
        width: 5.34rem;
        height: 0.42rem;
        display: block;
        position: absolute;
        top: 2.29rem;
        margin-left: -2.00rem;
    }
    .fight-page .answer-box{
        width: 9.96rem;
        height: 100%;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/question_box.png') no-repeat center right / 100% 100%;
        padding: 0.80rem 0.20rem;
        position: fixed;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .answer-box .answer-title{
        width: 6.80rem;
        text-align: left;
        line-height: 0.36rem;
        font-size: 0.24rem;
        color: #000000;
        font-family: SourceHanSerifCN-SemiBold;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        justify-content: flex-start;
    }
    .answer-box .answer-title .text{
        flex: 1;
    }
    .answer-box .option-list{
        width: 4.34rem;
        margin-top: 0.30rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .answer-box .option-item{
        width: 4.34rem;
        height: 0.69rem;
        text-align: center;
        line-height: 0.24rem;
        font-size: 0.20rem;
        color: #000000;
        font-family: SourceHanSerifCN-SemiBold;
        margin: 0.10rem auto;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/option.png') no-repeat center / 4.34rem 0.69rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .answer-box .option-item:hover{
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/fight/option_hover.png') no-repeat center / 4.34rem 0.67rem;
    }

    /* ---------分享函-------- */
    .poster-page .auto-content{
        width: 25.60rem;
        height: 14.40rem;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .poster-page .poster-content{
        width: 25.60rem;
        height: 14.40rem;
        position: relative;
    }
    .dom2img-result{
        width: 25.60rem;
        height: 14.40rem;
        position: absolute;
        z-index: 15;
        overflow: hidden;
        opacity: 0;
        user-select: all;
        pointer-events: all;
    }
    .poster-page .share-text-tips{
        width: 100%;
        text-align: center;
        font-size: 0.22rem;
        line-height: 0.36rem;
        color: #dbdbdb;
        text-shadow: 0.01rem 0.01rem #000000, -0.01rem 0.01rem #000000, 0.01rem -0.01rem #000000, -0.01rem -0.01rem #000000;
        font-family: SourceHanSerifCN-SemiBold;
        position: absolute;
        top: 10.68rem;
        z-index: 5;
    }
    .poster-page .poster-content .info-box{
        width: 13.40rem;
        height: 6.30rem;
        position: absolute;
        padding: 0 0.20rem;
        left: 6.66rem;
        top: 4.36rem;
        z-index: 2;
    }
    .poster-page .poster-content .column-box{
        align-items: flex-start;
    }
    .poster-page .title{
        width: 100%;
        text-align: left;
        font-size: 0.26rem;
        line-height: 0.36rem;
        color: #000000;
        font-family: SourceHanSerifCN-SemiBold;
    }
    .poster-page .text{
        width: 100%;
        text-align: left;
        font-size: 0.62rem;
        line-height: 0.68rem;
        color: #7d0000;
        font-family: SourceHanSerifCN-Heavy;
    }
    .poster-page .character-box{
        width: 6.80rem;
        height: 1.99rem;
    }
    .poster-page .character-box .title{
        font-family: SourceHanSerifCN-Bold;
    }
    .poster-page .character-box .nick{
        font-size: 0.32rem;
        color: #7d0000;
    }
    .poster-page .compatibility-box{
        width: 2.80rem;
        height: 1.99rem;
    }
    .poster-page .compatibility-box .star-list{
        width: 2.00rem;
        height: 0.60rem;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
    .star-list .star-black{
        width: 0.31rem;
        height: 0.31rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/star_black.png') no-repeat center /  100% 100%;
    }
    .star-list .star-red{
        width: 0.31rem;
        height: 0.31rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/star_red.png') no-repeat center /  100% 100%;
    }
    .poster-page .weapon-box{
        width: 2.80rem;
        height: 1.99rem;
    }
    .poster-page .desc-box{
        width: 2.62rem;
        height: 3.20rem;
        position: absolute;
        left: 3.5rem;
        top: 2.50rem;
        justify-content: flex-start;
    }
    .poster-page .desc{
        width: 100%;
        display: inline-block;
        text-align: left;
        font-size: 0.21rem;
        line-height: 0.35rem;
        color: #000000;
        font-family: SourceHanSerifCN-SemiBold;
        margin-top: 0.20rem;
    }
    .poster-page .desc-box .text-marks1{
        width: 0.35rem;
        height: 0.24rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/text_marks1.png') no-repeat center /  100% 100%;
        display: inline-block;
        margin-left: -0.20rem;
        margin-right: 0.10rem;
    }
    .poster-page .desc-box .text-marks2{
        width: 0.34rem;
        height: 0.24rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/text_marks2.png') no-repeat center /  100% 100%;
        display: inline-block;
        margin-left: 0.10rem;
        margin-right: -0.20rem;
    }
    .poster-page .summary-box{
        width: 3.96rem;
        height: 1.10rem;
        position: absolute;
        left: 7.00rem;
        top: 4.85rem;
    }
    .poster-page .summary-box .text{
       font-size: 0.40rem;
        white-space:nowrap;
    }
    .poster-page .role-img{
        width: 5.91rem;
        height: 3.83rem;
        position: absolute;
        left: 6.845rem;
        top: 0.31rem;
        z-index: 2;
    }
    .poster-page .code-box{
        width: 1.53rem;
        height: 1.54rem;
        position: absolute;
        left: 11.16rem;
        top: 4.37rem;
        z-index: 2;
    }
    .poster-page .code-box .code, .poster-page .code-box img, .poster-page .code-box canvas{
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }
    .poster-page .btn-list{
        width: 7.61rem;
        height: 0.80rem;
        position: fixed;
        z-index: 20;
        bottom: 1.22rem;
    }
    .poster-page .btn-weapon{
        width: 3.35rem;
        height: 0.80rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/btn_weapon.png') no-repeat center /  100% 100%;
    }
    .poster-page .btn-share{
        width: 3.35rem;
        height: 0.80rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/btn_share.png') no-repeat center /  100% 100%;
    }
    .poster-page .btn-go-test{
        width: 5.97rem;
        height: 0.83rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/share/btn_test.png') no-repeat center /  100% 100%;
    }
    /* 武器展示 */
    .weapon-page .tit-img{
        width: auto;
        height: 0.41rem;
        display: block;
        margin-top: 0.96rem;
    }
    .weapon-page .weapon-swiper{
        margin-top: 0.00rem;
        position: relative;
    }
    .weapon-page .weapon-swiper,.weapon-page .swiper-slide{
        width: 25.60rem;
        height: 8.80rem;
        position: relative;
        overflow: visible;
    }
   .weapon-page .swiper-slide{
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
    }
    .weapon-button-prev,.weapon-button-next,.weapon-img-prev,.weapon-img-next  {
        width: 2.50rem;
        height: 0.91rem;
        position: absolute;
        left: 2.50rem;
        transform: translateY(-50%);
        top: 2.68rem;
        z-index: 1;
        cursor: pointer;
    }
    .weapon-button-next,.weapon-img-next {
        left: unset;
        right: 2.50rem;
    }
    .weapon-img-prev{
        width: 3.11rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/m/fight/btn_prev.png') no-repeat center / 100% 100%;
        z-index: 1;
    }
    .weapon-img-next{
        width: 3.12rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/m/fight/btn_next.png') no-repeat center / 100% 100%;
        z-index: 1;
    }
    .weapon-button-prev>a {
        width: 100%;
        height: 100%;
        position: absolute;
    }
    .weapon-button-next>a {
        width: 100%;
        height: 100%;
        position: absolute;
    }
    .weapon-button-prev,.weapon-button-next{
        width: 2.50rem;
    }
   .weapon-page .weapon-box{
       width: 15.24rem;
       height: 6.42rem;
       background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/weapon/weapon_bg.png') no-repeat center /  100% 100%;
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
   }
    .weapon-box .weapon-img{
        width: 15.03rem;
        height: 6.27rem;
        object-fit: cover;
    }
    .weapon-box .weapon-mask{
        width: 15.25rem;
        height: 6.43rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/weapon/weapon_mask.png') no-repeat center /  100% 100%;
        position: absolute;
        z-index: 1;
    }
    .weapon-box .btn-play{
        width: 0.92rem;
        height: 0.92rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/weapon/btn_play.png') no-repeat center /  100% 100%;
        position: absolute;
        z-index: 2;
    }
    .weapon-page .weapon-desc{
        width: 15.24rem;
        height: 2.00rem;
        margin-top: 0.30rem;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }
    .weapon-page .weapon-line{
        width: 5.49rem;
        height: 0.01rem;
        margin: 0.16rem 0;
    }
    .weapon-page .weapon-desc .name{
        width: 100%;
        text-align: left;
        font-size: 0.54rem;
        line-height: 0.60rem;
        color: #ffffff;
        font-family: SourceHanSerifCN-Heavy;
    }
    .weapon-page .weapon-desc .desc{
        width: 100%;
        text-align: left;
        font-size: 0.22rem;
        line-height: 0.30rem;
        color: #ffffff;
        font-family: SourceHanSerifCN-SemiBold;
    }
    .weapon-page .btn-back-share{
        width: 5.97rem;
        height: 0.83rem;
        background: url('//game.gtimg.cn/images/kazan/cp/a20251201subscribe/web/weapon/btn_back_share.png') no-repeat center /  100% 100%;
    }
    /*动画*/
    .fast-show {
        animation-timing-function: linear;
        animation-duration: 0.5s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: fastShow; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @keyframes fastShow {
        0% {
            opacity: 0;
        }
        80% {
            opacity: 0.4;
        }
        100% {
            opacity: 1;
        }
    }
    .slow-show {
        animation-timing-function: linear;
        animation-duration: 1.5s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: slowShow; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @keyframes slowShow {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 1;
        }
    }
    .move-form-left{
        animation-timing-function: linear;
        animation-duration: 0.8s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: formLeft; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @-webkit-keyframes formLeft {
        0% {
            transform: translateX(-18rem)
        }

        30% {
            transform: translateX(-.2rem)
        }

        to {
            transform: translateX(0)
        }
    }
    .move-form-right {
        animation-timing-function: linear;
        animation-duration: 0.8s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: formRight; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @-webkit-keyframes formRight {
        0% {
            transform: translateX(18rem)
        }

        30% {
            transform: translateX(.2rem)
        }

        to {
            transform: translateX(0)
        }
    }
    .move-form-top {
        animation-timing-function: linear;
        animation-duration: 0.8s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: mformTop; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @-webkit-keyframes mformTop {
        0% {
            transform: translateY(-0.6rem)
        }

        30% {
            transform: translateY(-.1rem)
        }

        to {
            transform: translateY(0)
        }
    }
    .move-form-bottom {
        animation-timing-function: linear;
        animation-duration: 0.8s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: formBottom; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @-webkit-keyframes formBottom {
        0% {
            transform: translateY(0.6rem)
        }

        30% {
            transform: translateY(.1rem)
        }

        to {
            transform: translateY(0)
        }
    }
    .monster-jump {
        animation-timing-function: linear;
        animation-duration: 0.8s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: monsterJump; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }

    @keyframes monsterJump {
        0%, 100% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-0.15rem);
        }
    }

    .twinkle-ani {
        animation-timing-function: linear;
        animation-duration: 3.5s; /*动画持续的时间长*/
        animation-iteration-count: infinite; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: twinkleAni; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @keyframes twinkleAni {
        0% {
            opacity: 0.1;
        }
        50% {
            opacity: 1;
        }
        100% {
            opacity: 0.1;
        }
    }
    .turning-hide {
        animation-timing-function: linear;
        animation-duration: 0.5s; /*动画持续的时间长*/
        animation-iteration-count: 1; /*动画循环播放的次数为1 infinite为无限次*/
        animation-name: turningHide; /*动画名称，需要跟@keyframes定义的名称一致*/
        animation-fill-mode: both; /*动画会同时遵循向前和向后的规则，从而在两个方向上扩展动画属性。*/
    }
    @keyframes turningHide {
        0% {
            opacity: 1;
        }
        100% {
            opacity: 0.1;
        }
    }