.page-main{
    width: 100%;
    height: 206.45vw;
    background: url(/static/web/images/index/bg.jpg) no-repeat center top;
    background-size: cover;
    overflow: hidden;
}
.swiper-button{
    width: 5.52vw;
    height: 4.32vw;
    padding: 0;
    margin: 0 !important;
}
.swiper-button:after{
    display: none !important;
}
.swiper-button.swiper-button-next{
    background: url(/static/web/images/index/lb-l1.png) no-repeat;
    background-size: 100% 100%;
}
.swiper-button.swiper-button-prev{
    background: url(/static/web/images/index/lb-r1.png) no-repeat;
    background-size: 100% 100%;
}
.swiper-button.swiper-button-next:hover{
    background: url(/static/web/images/index/lb-l2.png) no-repeat;
    background-size: 100% 100%;
}
.swiper-button.swiper-button-prev:hover{
    background: url(/static/web/images/index/lb-r2.png) no-repeat;
    background-size: 100% 100%;
}
/** top **/
.top{
    height: 48.7vw;
}
.down-box{
    /* width: 49.53vw; */
    width: 37.7vw;
    height: 11.98vw;
    background: url(/static/web/images/index/box1.png) no-repeat;
    background-size: 100% 100%;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2.08vw;
    padding: 1.72vw 0 0 3.38vw;
}
.down-box .z-down{
    padding-top: 0.2vw;
}
.down-box .z-down a{
    width: 10.42vw;
    margin-bottom: 0.57vw;
}
.down-box a:hover{
    -webkit-filter: brightness(1.2);
    filter: brightness(1.2);
}
.down-box .qrcode{
    width: 8.18vw;
    height: 8.49vw;
    background: url(/static/web/images/index/qbg.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 1.04vw;
}
.down-box .qrcode .qrcode-img{
    background-color: #fff;
    width: 7.5vw;
    height: 7.5vw;
    margin: .26vw auto 0;
    padding: .2vw;
    overflow: hidden;
}
.down-box .qrcode .qrcode-img img, .down-box .qrcode .qrcode-img canvas{
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}   
.down-box .pay{
    width: 14.43vw;
    right: -.26vw;
    top: -.78vw;
    display: none;
}

/** official-news **/
.official-news{
    height: 48.33vw;
}
.official-news .news-box{
    width: 77.44vw;
    height: 30.83vw;
    background: url(/static/web/images/index/box2.png) no-repeat;
    background-size: 100% 100%;
    left: 50%;
    transform: translateX(-50%);
    bottom: 6.35vw;
    padding: 4.32vw 2.76vw 0 4.22vw;
}
.news-k{
    background: url(/static/web/images/index/k.png) no-repeat center center;
    background-size: 100% 100%;
    z-index: 3;
    width: 32.9vw;
    height: 21.3vw;
    top: 3.68vw;
    left: 3.94vw;
}
.news-left{
    width: 32.29vw;
    height: 23.75vw;
    overflow: hidden;
    margin: 0 !important;
}
.news-left .swiper-slide{
    height: 20vw;
    overflow: hidden;
}
.news-left .swiper-slide a{
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.news-left .swiper-slide img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.news-left .swiper-pagination{
    bottom: 0 !important;
}
.news-left .swiper-pagination-bullet{
    width: 1.93vw;
    height: 2.7vw;
    background: url(/static/web/images/index/lb1.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 .72vw !important;
    opacity: 1 !important;
}
.news-left .swiper-pagination-bullet-active{
    background: url(/static/web/images/index/lb2.png) no-repeat;
    background-size: 100% 100%;
}
.news-nav{
    width: 35.93vw;
    margin-top: .65vw;
}
.news-nav-item{
    width: 10.36vw;
    height: 3.18vw;
    cursor: pointer;
}
.news-nav-item:nth-child(1){
    background: url(/static/web/images/index/n1-1.png) no-repeat;
    background-size: 100% 100%;
}
.news-nav-item:nth-child(1):hover,.news-nav-item:nth-child(1).active{
    background: url(/static/web/images/index/n1-2.png) no-repeat;
    background-size: 100% 100%;
}
.news-nav-item:nth-child(2){
    background: url(/static/web/images/index/n2-1.png) no-repeat;
    background-size: 100% 100%;
}
.news-nav-item:nth-child(2):hover,.news-nav-item:nth-child(2).active{
    background: url(/static/web/images/index/n2-2.png) no-repeat;
    background-size: 100% 100%;
}
.news-nav-item:nth-child(3){
    background: url(/static/web/images/index/n3-1.png) no-repeat;
    background-size: 100% 100%;
}
.news-nav-item:nth-child(3):hover,.news-nav-item:nth-child(3).active{
    background: url(/static/web/images/index/n3-2.png) no-repeat;
    background-size: 100% 100%;
}

.news-content{
    width: 34.375vw;
    height: 16.67vw;
    overflow: hidden;
}
.news-item{
    margin-top: 0.94vw;
    height: 3.13vw; 
    font-size: 1.35vw;
    color: #d6c296;
    position: relative;
}
.news-item .news-time{
    padding:0 .94vw 0 1.2vw;
}
.news-item::after{
    content: '';
    position: absolute;
    height: 0.12vw;
    width: 100%;
    bottom: 0;
    left: 0;
    background-image: linear-gradient(to right, rgba(155, 147, 121, 0.3), rgba(155, 147, 121, 1), rgba(155, 147, 121, 0.3));
}
.news-more{
    width: 7.76vw;
    height: 1.82vw;
    background: url(/static/web/images/index/more.png) no-repeat;
    background-size: 100% 100%;
    bottom: 3.2vw;
    right: 4.16vw;
}
.news-more:hover{
    background: url(/static/web/images/index/more2.png) no-repeat;
    background-size: 100% 100%;
}

/** card-role **/
.card-role{
    height: 48.59vw;
}
.card-box{
    height: 42.7vw;
}
.card-box .card-img{
    width: 69.89vw;
    margin: 0 auto;
}
.card-box .swiper-button{
    top: 16.2vw !important;
}
.card-box .swiper-button-next{
    right: 10.9vw;
}
.card-box .swiper-button-prev{
    left: 10.9vw;
}
.card-box .swiper-pagination{
    display: none;
}

/** game-feature **/
.game-feature{
    height: 48.54vw;
}
.feature-bg{
    width: 21.4vw;
    left: 50%;
    transform: translateX(-50.4%);
    top: 7vw;
}
.feature-box{
    height: 32.7vw;
    margin-top: 13.64vw;
}
.feature-box .swiper-slide{
    width: 48.7vw;
    height: 27.6vw;
    opacity: 0;
}
.feature-box .swiper-slide.swiper-slide-prev,
.feature-box .swiper-slide.swiper-slide-next{
    -webkit-filter: brightness(.6);
    filter: brightness(.6);
    opacity: 0.9;
}
.feature-box .swiper-slide.swiper-slide-active{
    opacity: 1;
}
.feature-box .swiper-button{
    top: 8.33vw !important;
}
.feature-box .swiper-button-next{
    right: 4.9vw;
}
.feature-box .swiper-button-prev{
    left: 4.9vw;
}
.feature-box .swiper-pagination, .card-box .swiper-pagination{
    bottom: 0 !important;
}
.feature-box .swiper-pagination-bullet, .card-box .swiper-pagination-bullet{
    width: 2.55vw;
    height: 3.64vw;
    background: url(/static/web/images/index/lb3.png) no-repeat;
    background-size: 100% 100%;
    margin: 0 .78vw !important;
    opacity: 1 !important;
}
.feature-box .swiper-pagination-bullet-active, .card-box .swiper-pagination-bullet-active{
    background: url(/static/web/images/index/lb4.png) no-repeat;
    background-size: 100% 100%;
}

/** gift_win **/
.pop_win .pwin_box{
    top: -100%;
}
.p-btn{
    width: 12.97vw;
}
.pwin_exit{
    width: 3.44vw;
    height: 3.44vw;
    cursor: pointer;
}
#gift_win .pwin_box{
    width: 55.156vw;
    height: 35.94vw;
    background: url(/static/web/images/index/gift-bg.png) no-repeat;
    background-size: 100% 100%;
}
#gift_win .pwin_exit{
    top: 1.35vw;
    right: 0.78vw;
}
#gift_win .gift-code{
    width: 21.56vw;
    height: 6.77vw;
    right: 4.84vw;
    top: 16.4vw;
    color: #FFF;
    font-size: 1.56vw;
    font-weight: bold;
    letter-spacing: 0.03vw;
}
#gift_win .p-btn{
    top: 26.35vw;
    right: 9.22vw;
}
/** login_win **/
#login_win .pwin_box{
    width: 54.74vw;
    height: 36.46vw;
    background: url(/static/web/images/index/login-bg.png) no-repeat;
    background-size: 100% 100%;
}
#login_win .pwin_exit{
    top: 1.3vw;
    right: 0.47vw;
}
.login-form{
    padding: 11.2vw 3.59vw 0 26.98vw;
}
.login-form .login-input{
    width: 19.27vw;
    height: 3.02vw;
    background: url(/static/web/images/index/iput.png) no-repeat;
    background-size: 100% 100%;
    margin-left: 3.7vw;
    margin-bottom: 0.92vw;
    padding: 0 .73vw;
}
.login-form .login-input input{
    width: 100%;
    height: 100%;
    background: transparent;
    border: none;
    outline: none;
    color: #faedd4;
    font-size: 1.25vw;
}
.login-form .cancel-btn{
    width: 9.22vw;
}
.login-form .other-login{
    margin-top: 4.27vw;
    padding:0 0.2vw 0 0.73vw;
}
.login-form .other-login-item{
    width: 10.52vw;
    cursor: pointer;
}
.login-form .psw-type{
    background: url(/static/web/images/index/icon1.png) no-repeat center center;
    background-size: 1.46vw 1.25vw;
    width: 1.875vw;
    margin-left: .8vw;
}
.login-form .psw-type.active{
    background: url(/static/web/images/index/icon2.png) no-repeat center center;
    background-size: 1.46vw 1.25vw;
}
.remember{
    margin: 0.26vw 0 1.04vw ;
    height: 1.35vw;
}
.remember .checkbox{
    width: 1.35vw;
    height: 1.35vw;
    margin-left: 3.8vw;
    cursor: pointer;
}
.remember .checkbox.active::after{
    content: "✓";
    font-size: .85vw;
    color: #faedd4;
    font-weight: bold;
}
.m-down, .m-code{
    display: none;
}

@media screen and (orientation: portrait) {
    .down-box{
        display: none;
    }
    .swiper-button {
        width: 9.814vw;
        height: 7.685vw;
    }
    .page-main{
        height: auto;
        background: url(/static/web/images/index/m/bg.jpg?v=1.0.1) no-repeat center top;
        background-size: 100% 529.17vw;
    }
    .top{
        height: 177.315vw;
    }
    .m-down{
        width: 74.81vw;
        left: 50%;
        transform: translateX(-50%);
        bottom: .3vw;
        display: block;
    }
    .m-code{
        display: block;
        width: 67.96vw;
        height: 11.39vw;
        background: url(/static/web/images/index/m/code.png) no-repeat;
        background-size: 100% 100%;
        left: 50%;
        transform: translateX(-50%);
        bottom: 32.8vw;
        padding-left: 20.65vw;
    }
    .m-code .gift-code{
        width: 42.04vw;
        height: 100%;
        font-size: 3.4vw;
        font-weight: bold;
        letter-spacing: 0.03vw;
        color: #fff;
    }   
    .official-news{
        height: 152.87vw;
    }
    .official-news .news-box{
        width: 97.4vw;
        height: 132.04vw;
        background: url(/static/web/images/index/m/k.png) no-repeat;
        background-size: 100% 100%;
        left: 1.3vw;
        transform: translateX(0);
        bottom: 6.2vw;
        padding: 9.35vw 0 7.28vw 0;
        flex-direction: column;
        align-items: center;
        justify-content: start;
    }
    .news-k{
        background: url(/static/web/images/index/k.png) no-repeat center center;
        background-size: 100% 100%;
        z-index: 3;
        width: 80.28vw;
        height: 44.35vw;
        top: 7.87vw;
        left: 50%;
        transform: translateX(-50%);
    }
    .news-left{
        width: 78.88vw;
        height: 41.48vw;
        overflow: hidden;
        margin: 0 !important;
    }
    .news-left .swiper-slide{
        height: 100%;
    }
    .news-left .swiper-pagination{
        display: none;
    }
    .news-nav{
        width: 82.4vw;
        margin-top: 6.3vw;
    }
    .news-nav-item{
        width: 23.98vw;
        height: 7.314vw;
    }
    .news-content{
        width: 79.44vw;
        height: 52.78vw;
        margin-top: 0.74vw;
    }
    .news-item{
        margin-top: 0;
        height: 10.37vw; 
        font-size: 3.148vw;
        padding-top: 4.26vw;
        align-items: center;
    }
    .news-item .news-time{
        padding:0 2.04vw 0 3.2vw;
    }
    .news-item::after{
        height: 0.37vw;
    }
    .news-more{
        width: 20.46vw;
        height: 4.81vw;
        bottom: 6vw;
        right: 6.9vw;
    }
    .card-role{
        height: 112.5vw;
    }
    .card-box{
        height: 88.7vw;
        margin-bottom: 11.11vw;
    }
    .card-box .swiper-wrapper{
        height: 75.926vw;
    }
    .card-box .swiper-slide{
        justify-content: center;
    }
    .card-box .card-img{
        width: 120% !important;
        margin-left: -10%;
    }
    .card-box .swiper-button{
        top: 41.3vw !important;
    }
    .card-box .swiper-button-next{
        right: 3.7vw;
    }
    .card-box .swiper-button-prev{
        left: 3.7vw;
    }
    .card-box .swiper-pagination{
        bottom: 0 !important;
        display: block;
    }
    .card-box .swiper-pagination-bullet, .feature-box .swiper-pagination-bullet{
        width: 5.65vw;
        height: 8.15vw;
        margin: 0 1.94vw !important;
    }
    .game-feature{
        height: 86.48vw;
        justify-content: start !important;
    }
    .feature-bg{
        display: none;
    }
    .feature-box{
        height: 61.667vw;
        margin-top: 16.39vw;
    }
    .feature-box .swiper-wrapper{
        height: 49.63vw;
    }
    .feature-box .swiper-slide{
        width: 100%;
        height: 100%;
        opacity: 0;
        align-items: center;
        text-align: center;
    }
    .feature-box .swiper-slide img{
        width: 92.04vw !important;
        margin: 0 auto;
    }
    .feature-box .swiper-slide.swiper-slide-active{
        opacity: 1;
    }
    .feature-box .swiper-button{
        display: none;
    }
}