html {
    color: #0F1433;
    background: #F6F7FF;
    overflow-y: auto;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

    html * {
        outline: none;
        -webkit-tap-highlight-color: rgba(0,0,0,0)
    }

body, html {
    height: 100%
}

article, aside, blockquote, body, button, code, dd, details, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, input, legend, li, menu, nav, ol, p, pre, section, td, textarea, th, ul {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

input, select, textarea {
    font-size: 100%
}

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

fieldset, img {
    border: none
}

address, caption, cite, code, dfn, em, th, var {
    font-style: normal;
    font-weight: 500
}

ol, ul {
    list-style: none
}

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

q:after, q:before {
    content: ''
}

a {
    text-decoration: none
}

button {
    border: none
}

button, html input[type='button'], input[type='reset'], input[type='submit'] {
    -webkit-appearance: button;
    text-transform: none;
    outline: none
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
    color: #999
}

input::-webkit-inner-spin-button {
    -webkit-appearance: none
}

input::-webkit-outer-spin-button {
    -webkit-appearance: none
}

textarea {
    vertical-align: top
}

button, input {
    line-height: normal
}

select {
    margin: 0;
    outline: 0
}

input.fixAKeyboard:focus, textarea.fixAndroidKeyboard:focus {
    -webkit-tap-highlight-color: rgba(255,255,255,0);
    -webkit-user-modify: read-write-plaintext-only
}

button, input[type=button], input[type=checkbox], input[type=reset], input[type=submit], label {
    cursor: pointer;
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none
}

input[type=submit] {
    -moz-user-modify: read-plaintext-only;
    -ms-user-modify: read-plaintext-only;
    -o-user-modify: read-plaintext-only;
    -webkit-user-modify: read-plaintext-only
}

input[type='search']::-webkit-search-cancel-button, input[type='search']::-webkit-search-decoration {
    -webkit-appearance: none
}

input[type='search'] {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-appearance: textfield
}

body {
    font-size: .24rem;
    line-height: .28rem;
    width: 100%;
    max-width: 7.5rem;
    min-width: 3.2rem;
    margin: 0 auto;
    height: fit-content
}

a {
    display: block
}

.indexBg {
    background-color: #f7f7f7FF
}

.icon {
    display: block;
    background: url("../img/icon.png") no-repeat;
    background-size: 3.56rem 2.99rem
}

.hide {
    display: none
}

header {
    padding: .17rem 0 .23rem 0;
    background-color: #ffa500;
}

    header .headerTop {
        padding: 0 .32rem 0 .3rem;
        display: flex;
        align-items: center;
        justify-content: space-between
    }

        header .headerTop .logoBox {
            width: 2.64rem;
            height: 1rem
        }

            header .headerTop .logoBox img {
                width: 100%;
                height: 100%;
                object-fit: cover
            }

        header .headerTop .searchBox {
            width: 3.5rem;
            height: .6rem;
            position: relative
        }

            header .headerTop .searchBox input {
                width: 100%;
                height: 100%;
                text-indent: .3rem;
                border-radius: .3rem;
                outline: 0;
                border: 0;
                background-color: #f2f2f2FF
            }

                header .headerTop .searchBox input::placeholder {
                    font-size: .24rem;
                    color: #999999;
                    text-indent: .3rem
                }

            header .headerTop .searchBox .icon {
                width: .35rem;
                height: .35rem;
                position: absolute;
                top: .12rem;
                right: .24rem;
                background-position: -1.48rem -1.79rem
            }

    header nav {
        padding: 0 .36rem 0 .33rem;
        margin-top: .1rem
    }

        header nav ul {
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(6, auto)
        }

            header nav ul li a {
                font-size: .34rem;
                line-height: .42rem;
                color: #444450
            }

            header nav ul .current a {
                color: white
            }

.pageWrap {
    padding: .31rem .6rem .4rem .6rem;
    display: flex;
    align-items: center;
    justify-content: space-between
}

    .pageWrap a {
        width: .58rem;
        height: .58rem;
        text-align: center;
        line-height: .58rem;
        background-color: #ecebeeFF;
        font-size: .26rem;
        color: #94979bFF;
        border-radius: .06rem
    }

        .pageWrap a:first-child {
            width: .96rem
        }

        .pageWrap a:last-child {
            width: .97rem;
            text-align: center
        }

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

        .pageWrap .leftIcon .icon {
            width: .14rem;
            height: .24rem;
            background-position: -0.44rem -2.65rem
        }

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

        .pageWrap .rightIcon .icon {
            width: .14rem;
            height: .24rem;
            background-position: -0.1rem -2.65rem
        }

    .pageWrap .current {
        color: white;
        background-color: #ffa500
    }

.indexWrap .imgOne {
    padding: 0 .3rem;
    margin-top: .21rem
}

    .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide {
        width: 100% !important;
        height: 2.92rem !important;
        position: relative;
        border-radius: .03rem
    }

        .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide img {
            width: 100%;
            height: 100%;
            border-radius: .03rem
        }

        .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            background-color: #00000031;
            pointer-events: none;
            display: flex;
            flex-direction: column;
            justify-content: flex-end;
            border-radius: .03rem
        }

            .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont {
                padding: 0 .2rem;
                margin-bottom: .19rem
            }

                .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont .maskImg {
                    width: .64rem;
                    height: .64rem;
                    border-radius: .2rem;
                    box-sizing: content-box;
                    border: .02rem solid #fdc82a8a
                }

                    .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont .maskImg img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .2rem
                    }

                .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont .txtBox {
                    width: 100%;
                    margin-top: .21rem;
                    display: flex;
                    align-items: center;
                    justify-content: space-between
                }

                    .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont .txtBox .txtBoxL .txtOne {
                        font-weight: bold;
                        font-size: .28rem;
                        line-height: .28rem;
                        color: #FFFFFF
                    }

                    .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont .txtBox .txtBoxL .txtTwo {
                        margin-top: .08rem;
                        font-size: .18rem;
                        color: #FFFFFF;
                        line-height: .18rem;
                        opacity: .9;
                        text-shadow: 1px 0 #bab7b7
                    }

                    .indexWrap .imgOne .indexSwiper .swiper-wrapper .swiper-slide .mask .maskContont .txtBox .button {
                        width: 1.24rem;
                        height: .5rem;
                        font-size: .24rem;
                        color: white;
                        text-align: center;
                        line-height: .5rem;
                        border-radius: .25rem;
                        background-color: #ffa500
                    }

.indexWrap .classification {
    margin-top: .21rem;
    padding: 0 .3rem
}

    .indexWrap .classification .calssBox {
        padding: .23rem .35rem .28rem .35rem;
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-template-columns: repeat(4, auto);
        background-color: white;
        border-radius: .03rem
    }

        .indexWrap .classification .calssBox li a {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center
        }

            .indexWrap .classification .calssBox li a .iconBox {
                height: .66rem;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .indexWrap .classification .calssBox li a .iconBox .icon {
                    width: .6rem;
                    height: .66rem;
                    background-position: -1.98rem -0.1rem
                }

            .indexWrap .classification .calssBox li a .text {
                margin-top: .14rem;
                text-align: center;
                font-size: .26rem;
                line-height: .26rem;
                color: #999999
            }

        .indexWrap .classification .calssBox li:nth-child(2) a .iconBox .icon {
            width: .73rem;
            height: .6rem;
            background-position: -1.05rem -0.1rem
        }

        .indexWrap .classification .calssBox li:nth-child(3) a .iconBox .icon {
            width: .78rem;
            height: .54rem;
            background-position: -0.1rem -1.05rem
        }

        .indexWrap .classification .calssBox li:nth-child(4) a .iconBox .icon {
            width: .53rem;
            height: .66rem;
            background-position: -0.1rem -1.79rem
        }

.indexWrap .imgTwo {
    margin-top: .2rem;
    padding: 0 .3rem
}

    .indexWrap .imgTwo .imgTwoBox {
        width: 100%;
        height: 2.08rem;
        border-radius: .03rem
    }

        .indexWrap .imgTwo .imgTwoBox img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: .03rem
        }

.indexWrap .recommend {
    margin-top: .2rem;
    padding: 0 .3rem
}

    .indexWrap .recommend .recommendBox {
        background: linear-gradient(to bottom, #fffbebFF 50%, white 50%)
    }

        .indexWrap .recommend .recommendBox .titleBox {
            padding: .26rem .2rem 0 .19rem;
            display: grid;
            justify-content: space-between;
            grid-template-columns: repeat(2, auto)
        }

            .indexWrap .recommend .recommendBox .titleBox .title {
                font-weight: bold;
                font-size: .36rem;
                line-height: .36rem;
                color: #FDC82A
            }

            .indexWrap .recommend .recommendBox .titleBox .more {
                font-size: .2rem;
                color: #FDC82A;
                line-height: .2rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .indexWrap .recommend .recommendBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: 0;
                    background-color: #fdc82aFF
                }

        .indexWrap .recommend .recommendBox .cloumList {
            padding: 0 .2rem;
            margin-top: .26rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .indexWrap .recommend .recommendBox .cloumList li a {
                display: block
            }

                .indexWrap .recommend .recommendBox .cloumList li a .imgBox {
                    width: 1.28rem;
                    height: 1.28rem;
                    border-radius: .3rem
                }

                    .indexWrap .recommend .recommendBox .cloumList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .3rem
                    }

                .indexWrap .recommend .recommendBox .cloumList li a .name {
                    text-align: center;
                    font-size: .24rem;
                    color: #333333;
                    line-height: .24rem;
                    margin-top: .14rem
                }

                .indexWrap .recommend .recommendBox .cloumList li a .button {
                    width: 1.24rem;
                    height: .5rem;
                    font-size: .24rem;
                    text-align: center;
                    color: #FFFFFF;
                    margin-top: .16rem;
                    line-height: .5rem;
                    border-radius: .25rem;
                    background-color: #fdc82aFF
                }

.indexWrap .recommendWrap {
    margin-top: .2rem;
    padding: 0 .3rem
}

    .indexWrap .recommendWrap .recommendBox {
        padding-bottom: .41rem;
        background: linear-gradient(180deg, #FFFBEB 0%, #FFFBEB 1.42rem, #fff 1.43rem, #fff 100%);
        border-radius: .03rem
    }

        .indexWrap .recommendWrap .recommendBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .recommendWrap .recommendBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .recommendWrap .recommendBox .titleBox .filterTitle .title {
                    color: #FDC82A;
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    margin-top: .25rem
                }

            .indexWrap .recommendWrap .recommendBox .titleBox .more {
                font-size: .2rem;
                height: .2rem;
                color: #FDC82A;
                line-height: .2rem;
                margin-top: .26rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .indexWrap .recommendWrap .recommendBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #FDC82A
                }

        .indexWrap .recommendWrap .recommendBox .cloumList {
            padding: 0 .2rem;
            margin-top: .26rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .indexWrap .recommendWrap .recommendBox .cloumList li a .imgBox {
                width: 1.28rem;
                height: 1.28rem;
                border-radius: .3rem
            }

                .indexWrap .recommendWrap .recommendBox .cloumList li a .imgBox img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: .3rem
                }

            .indexWrap .recommendWrap .recommendBox .cloumList li a .name {
                width: 100%;
                text-align: center;
                font-size: .24rem;
                color: #333333;
                line-height: .24rem;
                margin-top: .14rem;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap
            }

            .indexWrap .recommendWrap .recommendBox .cloumList li a .button {
                width: 1.24rem;
                height: .5rem;
                font-size: .24rem;
                text-align: center;
                color: #FFFFFF;
                margin-top: .16rem;
                line-height: .5rem;
                border-radius: .25rem;
                background-color: #fdc82aFF
            }

.indexWrap .recentUpdates {
    padding: 0 .3rem;
    margin-top: .1rem
}

    .indexWrap .recentUpdates .recentUpdatesBox {
        background: linear-gradient(180deg, #f5fdfcFF 0%, #f5fdfcFF 1.42rem, #fff 1.43rem, #fff 100%);
        padding-bottom: .51rem;
        border-radius: .03rem;
        position: relative
    }

        .indexWrap .recentUpdates .recentUpdatesBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .recentUpdates .recentUpdatesBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .recentUpdates .recentUpdatesBox .titleBox .filterTitle .title {
                    color: #ffa500;
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    margin-top: .25rem
                }

                .indexWrap .recentUpdates .recentUpdatesBox .titleBox .filterTitle .filter {
                    width: 2rem;
                    height: .44rem;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    padding: .03rem .05rem;
                    border-radius: .22rem;
                    margin-top: .2rem;
                    margin-left: .79rem;
                    border: .01rem solid #ffa500
                }

                    .indexWrap .recentUpdates .recentUpdatesBox .titleBox .filterTitle .filter li p {
                        width: .95rem;
                        height: .38rem;
                        text-align: center;
                        font-weight: bold;
                        font-size: .18rem;
                        color: #ffa500;
                        line-height: .38rem;
                        border-radius: .19rem
                    }

                    .indexWrap .recentUpdates .recentUpdatesBox .titleBox .filterTitle .filter li.active p {
                        color: white;
                        background-color: #ffa500
                    }

        .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox {
            padding: 0 0 0 .2rem
        }

            .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .more {
                width: 1.13rem;
                font-size: .2rem;
                height: .2rem;
                color: #ffa500;
                line-height: .2rem;
                position: relative;
                top: -0.34rem;
                right: -5.2rem;
                display: flex;
                justify-content: center
            }

                .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #ffa500
                }

            .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide {
                width: 5.8rem !important
            }

                .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card {
                    margin-top: .4rem;
                    display: flex;
                    align-items: center;
                    justify-content: space-between
                }

                    .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg {
                        display: flex
                    }

                        .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .imgBox {
                            width: 1.2rem;
                            height: 1.2rem;
                            border-radius: .26rem
                        }

                            .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .imgBox img {
                                width: 100%;
                                height: 100%;
                                border-radius: .26rem
                            }

                        .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox {
                            margin-left: .22rem
                        }

                            .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .name {
                                font-size: .26rem;
                                color: #000000;
                                line-height: .24rem;
                                margin-top: .04rem
                            }

                            .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .size {
                                margin-top: .11rem;
                                font-size: .2rem;
                                color: #9F9FA4;
                                line-height: .4rem
                            }

                                .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .size span {
                                    font-size: .2rem;
                                    color: #9F9FA4;
                                    line-height: .4rem
                                }

                                    .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .size span:nth-child(2) {
                                        margin: 0 .06rem
                                    }

                            .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .time {
                                font-size: .2rem;
                                color: #9F9FA4;
                                line-height: .4rem
                            }

                    .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .button {
                        width: 1.24rem;
                        height: .5rem;
                        font-size: .24rem;
                        text-align: center;
                        color: white;
                        line-height: .5rem;
                        background: #ffa500;
                        border-radius: .25rem
                    }

                    .indexWrap .recentUpdates .recentUpdatesBox .tabsCont .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card:first-child {
                        margin-top: .35rem
                    }

.indexWrap .gameEncyclope {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .indexWrap .gameEncyclope .gameEncyclopeBox {
        background: linear-gradient(180deg, #fdf5f4FF 0%, #fdf5f4FF 1.42rem, #fff 1.43rem, #fff 100%);
        border-radius: .03rem
    }

        .indexWrap .gameEncyclope .gameEncyclopeBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .gameEncyclope .gameEncyclopeBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .gameEncyclope .gameEncyclopeBox .titleBox .filterTitle .title {
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    color: #ffa500;
                    margin-top: .25rem
                }

            .indexWrap .gameEncyclope .gameEncyclopeBox .titleBox .more {
                font-size: .2rem;
                height: .2rem;
                color: #ffa500;
                line-height: .2rem;
                margin-top: .26rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .indexWrap .gameEncyclope .gameEncyclopeBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #ffa500
                }

        .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList {
            padding: .31rem .21rem .48rem .21rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList li a {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center
            }

                .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList li a .imgBox {
                    width: 1.28rem;
                    height: 1.28rem;
                    border-radius: .3rem
                }

                    .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .3rem
                    }

                .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList li a .name {
                    width: 100%;
                    text-align: center;
                    font-size: .24rem;
                    line-height: .24rem;
                    color: #333333;
                    margin-top: .15rem;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap
                }

                .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList li a .button {
                    width: 1.24rem;
                    height: .5rem;
                    margin-top: .15rem;
                    text-align: center;
                    line-height: .5rem;
                    font-size: .24rem;
                    color: #ffa500;
                    border-radius: .27rem;
                    background-color: #e5f7fdFF
                }

            .indexWrap .gameEncyclope .gameEncyclopeBox .cloumList li:nth-child(n+5) {
                margin-top: .29rem
            }

.indexWrap .hotTopics {
    margin-top: .2rem;
    padding: 0 .3rem
}

    .indexWrap .hotTopics .hotTopicsBox {
        background: linear-gradient(180deg, #f7f3ffFF 0%, #f7f3ffFF 1.42rem, #fff 1.43rem, #fff 100%);
        border-radius: .03rem;
        position: relative
    }

        .indexWrap .hotTopics .hotTopicsBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .hotTopics .hotTopicsBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .hotTopics .hotTopicsBox .titleBox .filterTitle .title {
                    color: #ffa500;
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    margin-top: .24rem
                }

                .indexWrap .hotTopics .hotTopicsBox .titleBox .filterTitle .filter {
                    width: 2rem;
                    height: .44rem;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    padding: .03rem .05rem;
                    border-radius: .22rem;
                    margin-top: .2rem;
                    margin-left: .79rem;
                    border: .01rem solid #ffa500
                }

                    .indexWrap .hotTopics .hotTopicsBox .titleBox .filterTitle .filter li p {
                        width: .95rem;
                        height: .38rem;
                        text-align: center;
                        font-weight: bold;
                        font-size: .18rem;
                        color: #ffa500;
                        line-height: .38rem;
                        border-radius: .19rem
                    }

                    .indexWrap .hotTopics .hotTopicsBox .titleBox .filterTitle .filter li.active p {
                        color: white;
                        background-color: #ffa500
                    }

        .indexWrap .hotTopics .hotTopicsBox .more {
            width: 1.13rem;
            font-size: .2rem;
            height: .2rem;
            color: #ffa500;
            line-height: .2rem;
            position: relative;
            top: -0.34rem;
            right: -5.2rem;
            display: flex;
            justify-content: center
        }

            .indexWrap .hotTopics .hotTopicsBox .more::after {
                content: "";
                width: 100%;
                height: .02rem;
                position: absolute;
                bottom: -0.11rem;
                background-color: #ffa500
            }

        .indexWrap .hotTopics .hotTopicsBox .hotTopicsList {
            margin-top: .26rem;
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL {
                width: 4.24rem
            }

                .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox {
                    width: 4.24rem;
                    height: 1.84rem;
                    position: relative;
                    border-radius: .03rem
                }

                    .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                    .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox .mask {
                        width: 100%;
                        height: 100%;
                        position: absolute;
                        top: 0;
                        left: 0;
                        background-color: rgba(0,0,0,0.192);
                        pointer-events: none;
                        display: flex;
                        align-items: center;
                        justify-content: center
                    }

                        .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox .mask .maskContont {
                            width: 100%
                        }

                            .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox .mask .maskContont .name {
                                width: 100%;
                                text-align: center;
                                font-size: .24rem;
                                line-height: .24rem;
                                color: #FFFFFF
                            }

                            .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox .mask .maskContont .time {
                                display: flex;
                                align-items: center;
                                justify-content: center;
                                margin-top: .11rem
                            }

                                .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox .mask .maskContont .time p {
                                    height: .18rem;
                                    font-size: .18rem;
                                    color: #ffffffa8;
                                    line-height: .18rem
                                }

                                    .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox .mask .maskContont .time p:nth-child(2) {
                                        width: .04rem;
                                        height: .03rem;
                                        border-radius: 50%;
                                        margin: 0 .08rem;
                                        background-color: #ffffffa8
                                    }

                    .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsL .imgBox:nth-child(2) {
                        margin-top: .15rem
                    }

            .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR {
                width: 2.11rem;
                height: 3.84rem;
                border-radius: .03rem;
                overflow: hidden;
                position: relative
            }

                .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .imgBox {
                    width: 100%;
                    height: 100%;
                    border-radius: .03rem;
                    position: relative
                }

                    .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .mask {
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: 0;
                    left: 0;
                    background-color: rgba(0,0,0,0.192);
                    pointer-events: none;
                    display: flex;
                    align-items: center;
                    justify-content: center
                }

                    .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .mask .maskContont {
                        width: 100%
                    }

                        .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .mask .maskContont .name {
                            width: 100%;
                            text-align: center;
                            font-size: .24rem;
                            line-height: .24rem;
                            color: #FFFFFF
                        }

                        .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .mask .maskContont .time {
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            margin-top: .11rem
                        }

                            .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .mask .maskContont .time p {
                                height: .18rem;
                                font-size: .18rem;
                                color: #ffffffa8;
                                line-height: .18rem
                            }

                                .indexWrap .hotTopics .hotTopicsBox .hotTopicsList .hotTopicsR .mask .maskContont .time p:nth-child(2) {
                                    width: .04rem;
                                    height: .03rem;
                                    border-radius: 50%;
                                    margin: 0 .08rem;
                                    background-color: #ffffffa8
                                }

        .indexWrap .hotTopics .hotTopicsBox .tabList {
            padding: .09rem .2rem .41rem .2rem;
            display: flex;
            align-items: center;
            flex-wrap: wrap
        }

            .indexWrap .hotTopics .hotTopicsBox .tabList li {
                padding: .12rem .2rem;
                margin-top: .22rem;
                margin-left: .1rem;
                border-radius: .22rem;
                display: flex;
                align-items: center;
                justify-content: center;
                background-color: #f9f9f9FF
            }

                .indexWrap .hotTopics .hotTopicsBox .tabList li a {
                    display: flex;
                    align-items: center
                }

                    .indexWrap .hotTopics .hotTopicsBox .tabList li a .icon {
                        width: .18rem;
                        height: .2rem;
                        background-position: -2.78rem -2.06rem
                    }

                    .indexWrap .hotTopics .hotTopicsBox .tabList li a i {
                        width: .18rem;
                        height: .2rem
                    }

                    .indexWrap .hotTopics .hotTopicsBox .tabList li a p {
                        padding-left: .1rem;
                        font-size: .24rem;
                        color: #838383;
                        line-height: .24rem
                    }

                .indexWrap .hotTopics .hotTopicsBox .tabList li:nth-child(1) {
                    margin-left: 0
                }

.indexWrap .application {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .indexWrap .application .applicationBox {
        background: linear-gradient(180deg, #f5f8ffFF 0%, #f5f8ffFF 1.42rem, #fff 1.43rem, #fff 100%);
        border-radius: .03rem
    }

        .indexWrap .application .applicationBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .application .applicationBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .application .applicationBox .titleBox .filterTitle .title {
                    color: #648feeFF;
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    margin-top: .24rem
                }

            .indexWrap .application .applicationBox .titleBox .more {
                font-size: .2rem;
                height: .2rem;
                color: #648feeFF;
                line-height: .2rem;
                margin-top: .26rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .indexWrap .application .applicationBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #648feeFF
                }

        .indexWrap .application .applicationBox .cloumList {
            padding: .31rem .21rem .48rem .21rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .indexWrap .application .applicationBox .cloumList li a {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center
            }

                .indexWrap .application .applicationBox .cloumList li a .imgBox {
                    width: 1.28rem;
                    height: 1.28rem;
                    border-radius: .3rem
                }

                    .indexWrap .application .applicationBox .cloumList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .3rem
                    }

                .indexWrap .application .applicationBox .cloumList li a .name {
                    width: 100%;
                    text-align: center;
                    font-size: .24rem;
                    line-height: .24rem;
                    color: #333333;
                    margin-top: .15rem;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap
                }

                .indexWrap .application .applicationBox .cloumList li a .button {
                    width: 1.24rem;
                    height: .5rem;
                    margin-top: .15rem;
                    text-align: center;
                    line-height: .5rem;
                    font-size: .24rem;
                    color: #ffa500;
                    border-radius: .27rem;
                    background-color: #e5f7fdFF
                }

            .indexWrap .application .applicationBox .cloumList li:nth-child(n+5) {
                margin-top: .29rem
            }

.indexWrap .rankings {
    padding: 0 .3rem;
    margin-top: .18rem
}

    .indexWrap .rankings .rankingsBox {
        background: linear-gradient(180deg, #fffbebFF 0%, #fffbebFF 1.65rem, #f7f7f7FF 1.65rem, #f7f7f7FF 100%);
        border-radius: .03rem
    }

        .indexWrap .rankings .rankingsBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .rankings .rankingsBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .rankings .rankingsBox .titleBox .filterTitle .title {
                    color: #fdc82aFF;
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    margin-top: .25rem
                }

            .indexWrap .rankings .rankingsBox .titleBox .more {
                font-size: .2rem;
                height: .2rem;
                color: #fdc82aFF;
                line-height: .2rem;
                margin-top: .26rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .indexWrap .rankings .rankingsBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #fdc82aFF
                }

        .indexWrap .rankings .rankingsBox .filterSwiper {
            margin-top: .27rem;
            padding: 0 0 0 .2rem
        }

            .indexWrap .rankings .rankingsBox .filterSwiper .swiper-wrapper {
                display: flex;
                align-items: center
            }

                .indexWrap .rankings .rankingsBox .filterSwiper .swiper-wrapper .swiper-slide {
                    width: auto !important;
                    margin-left: .2rem
                }

                    .indexWrap .rankings .rankingsBox .filterSwiper .swiper-wrapper .swiper-slide span {
                        display: block;
                        height: .56rem;
                        padding: 0 .34rem;
                        line-height: .56rem;
                        border: 1px solid #fef1c4FF;
                        font-size: .24rem;
                        color: #999999;
                        border-radius: .28rem;
                        cursor: pointer;
                        box-sizing: border-box;
                        background-color: #fffdf5FF
                    }

                    .indexWrap .rankings .rankingsBox .filterSwiper .swiper-wrapper .swiper-slide.active span {
                        border: 0;
                        color: #FFFFFF;
                        background-color: #fdc82aFF
                    }

                .indexWrap .rankings .rankingsBox .filterSwiper .swiper-wrapper li:first-child {
                    margin-left: 0
                }

        .indexWrap .rankings .rankingsBox .rankingsList {
            margin-top: .07rem
        }

            .indexWrap .rankings .rankingsBox .rankingsList li {
                margin-top: .1rem;
                padding: .3rem .2rem .3rem .37rem;
                background-color: white
            }

                .indexWrap .rankings .rankingsBox .rankingsList li a {
                    display: flex;
                    align-items: center;
                    justify-content: space-between
                }

                    .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox {
                        display: flex
                    }

                        .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .iconBox {
                            width: .31rem;
                            height: .34rem;
                            font-weight: bold;
                            font-size: .34rem;
                            color: #CCCCCC;
                            line-height: .34rem;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            margin-top: .43rem;
                            font-style: italic
                        }

                            .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .iconBox .icon {
                                width: .26rem;
                                height: .31rem;
                                background-position: -2.78rem -1.11rem
                            }

                        .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .imgbox {
                            width: 1.2rem;
                            height: 1.2rem;
                            margin-left: .38rem;
                            border-radius: .28rem
                        }

                            .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .imgbox img {
                                width: 100%;
                                height: 100%;
                                object-fit: cover;
                                border-radius: .28rem
                            }

                        .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .textBox {
                            margin-left: .26rem
                        }

                            .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .textBox .name {
                                font-size: .28rem;
                                color: #000000;
                                line-height: .28rem;
                                margin-top: .06rem
                            }

                            .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .textBox .size {
                                font-size: .22rem;
                                color: #999999;
                                line-height: .22rem;
                                margin-top: .18rem
                            }

                            .indexWrap .rankings .rankingsBox .rankingsList li a .txtImgBox .textBox .time {
                                font-size: .22rem;
                                color: #999999;
                                line-height: .22rem;
                                margin-top: .19rem
                            }

                    .indexWrap .rankings .rankingsBox .rankingsList li a .button {
                        width: 1.24rem;
                        height: .5rem;
                        text-align: center;
                        color: #ffffffFF;
                        line-height: .5rem;
                        border-radius: .25rem;
                        background-color: #ffa500
                    }

                .indexWrap .rankings .rankingsBox .rankingsList li:nth-child(1) {
                    margin: 0;
                    margin-top: .15rem
                }

                .indexWrap .rankings .rankingsBox .rankingsList li:nth-child(2) a .txtImgBox .iconBox .icon {
                    width: .31rem;
                    height: .31rem;
                    background-position: -2.03rem -1.79rem
                }

                .indexWrap .rankings .rankingsBox .rankingsList li:nth-child(3) a .txtImgBox .iconBox .icon {
                    width: .31rem;
                    height: .31rem;
                    background-position: -2.78rem -0.1rem
                }

.indexWrap .article {
    padding: 0 .3rem;
    margin-top: .21rem
}

    .indexWrap .article .articleBox {
        background: linear-gradient(180deg, #fbf9efFF 0%, #fbf9efFF 1.42rem, #fff 1.43rem, #fff 100%);
        border-radius: .03rem
    }

        .indexWrap .article .articleBox .titleBox {
            padding: 0 .2rem;
            display: flex;
            justify-content: space-between
        }

            .indexWrap .article .articleBox .titleBox .filterTitle {
                display: flex
            }

                .indexWrap .article .articleBox .titleBox .filterTitle .title {
                    color: #e0c859FF;
                    font-weight: bold;
                    font-size: .36rem;
                    line-height: .36rem;
                    margin-top: .24rem
                }

            .indexWrap .article .articleBox .titleBox .more {
                font-size: .2rem;
                height: .2rem;
                color: #e0c859FF;
                line-height: .2rem;
                margin-top: .25rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .indexWrap .article .articleBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #e0c859FF
                }

        .indexWrap .article .articleBox .articleList {
            margin-top: .03rem;
            padding: 0 .2rem .49rem .19rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(2, 3.17rem)
        }

            .indexWrap .article .articleBox .articleList li {
                margin-top: .28rem
            }

                .indexWrap .article .articleBox .articleList li a .imgBox {
                    width: 3.17rem;
                    height: 1.78rem;
                    border-radius: .03rem
                }

                    .indexWrap .article .articleBox .articleList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                .indexWrap .article .articleBox .articleList li a .name {
                    font-size: .24rem;
                    color: #333333;
                    line-height: .32rem;
                    margin-top: .06rem
                }

                .indexWrap .article .articleBox .articleList li a .time {
                    display: flex;
                    align-items: center;
                    font-size: .18rem;
                    color: #999999;
                    line-height: .18rem;
                    margin-top: .21rem
                }

                    .indexWrap .article .articleBox .articleList li a .time p:nth-child(2) {
                        width: .04rem;
                        height: .03rem;
                        border-radius: 50%;
                        margin: 0 .08rem;
                        background-color: #999999FF
                    }

.indexWrap .friendshipLink {
    margin-top: .42rem;
    background-color: #ffa500;
    padding: 0 .3rem
}

    .indexWrap .friendshipLink .title {
        font-weight: bold;
        font-size: .24rem;
        color: #FFFFFF;
        line-height: .24rem;
        padding-top: .31rem
    }

    .indexWrap .friendshipLink .friendsList {
        padding: .11rem 0 .3rem 0;
        border-bottom: .01rem solid #33bff3;
        display: flex;
        flex-wrap: wrap;
        align-items: center
    }

        .indexWrap .friendshipLink .friendsList li {
            margin-top: .2rem;
            font-size: .2rem;
            line-height: .2rem;
            color: #b8e1f9FF
        }

            .indexWrap .friendshipLink .friendsList li a {
                font-size: .2rem;
                line-height: .2rem;
                color: #b8e1f9FF
            }

        .indexWrap .friendshipLink .friendsList .space {
            padding: 0 .11rem 0 .1rem;
            font-size: .2rem;
            line-height: .2rem;
            color: #d4edfbFF
        }

.navigation {
    padding: .24rem .24rem .26rem .27rem;
    display: flex;
    align-items: center
}

    .navigation .icon {
        width: .17rem;
        height: .2rem;
        background-position: -3.29rem -0.1rem
    }

    .navigation .txtBox {
        padding-left: .1rem;
        display: flex;
        align-items: center
    }

        .navigation .txtBox li {
            font-size: .2rem;
            color: #999999;
            line-height: .2rem
        }

            .navigation .txtBox li a {
                font-size: .2rem;
                color: #999999;
                line-height: .2rem
            }

        .navigation .txtBox .space {
            padding: 0 .1rem
        }

.gameWrap .gameClassification {
    padding: 0 .3rem
}

    .gameWrap .gameClassification .gameClassificationBox {
        background: linear-gradient(180deg, #fdf5f4FF 0%, #fdf5f4FF .86rem, #fff .87rem, #fff 100%);
        border-radius: .03rem
    }

        .gameWrap .gameClassification .gameClassificationBox .titleBox {
            padding: .28rem 0 0 .2rem;
            display: flex;
            align-items: flex-end
        }

            .gameWrap .gameClassification .gameClassificationBox .titleBox .title {
                font-weight: bold;
                font-size: .32rem;
                color: #333333;
                line-height: .32rem
            }

            .gameWrap .gameClassification .gameClassificationBox .titleBox .numBox span {
                font-size: .2rem;
                line-height: .2rem;
                color: #666666
            }

                .gameWrap .gameClassification .gameClassificationBox .titleBox .numBox span:nth-child(1) {
                    padding: 0 .05rem 0 .08rem;
                    color: #cfcfcf
                }

                .gameWrap .gameClassification .gameClassificationBox .titleBox .numBox span:nth-child(3) {
                    padding: 0 .07rem;
                    font-weight: bold;
                    color: #ff6633
                }

        .gameWrap .gameClassification .gameClassificationBox .gameClassListBox {
            padding: .26rem .19rem .3rem .21rem
        }

            .gameWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList {
                height: 2.58rem;
                display: grid;
                align-items: center;
                justify-content: space-between;
                grid-template-columns: repeat(3, 2.05rem);
                overflow: hidden
            }

                .gameWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList li a {
                    height: .62rem;
                    text-align: center;
                    line-height: .62rem;
                    font-size: .3rem;
                    color: #666666;
                    border: .01rem solid #ffd7c8FF;
                    border-radius: .31rem;
                    margin-top: .2rem
                }

                .gameWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList li.active a {
                    color: white;
                    background-color: #ffa500
                }

                .gameWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList .openMore a {
                    color: #ffa500
                }

.gameWrap .cloumBox {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .gameWrap .cloumBox .cloumList li {
        margin-top: .1rem
    }

        .gameWrap .cloumBox .cloumList li a {
            padding: .3rem .21rem .31rem .3rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            background-color: white;
            border-radius: .03rem
        }

            .gameWrap .cloumBox .cloumList li a .textImg {
                display: flex;
                flex: 1;
                overflow: hidden
            }

                .gameWrap .cloumBox .cloumList li a .textImg .imgBox {
                    width: 1.2rem;
                    height: 1.2rem;
                    border-radius: .28rem
                }

                    .gameWrap .cloumBox .cloumList li a .textImg .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .28rem
                    }

                .gameWrap .cloumBox .cloumList li a .textImg .textBox {
                    margin-left: .27rem;
                    flex: 1;
                    overflow: hidden
                }

                    .gameWrap .cloumBox .cloumList li a .textImg .textBox .name {
                        width: 100%;
                        overflow: hidden;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                        font-size: .28rem;
                        color: #000000;
                        line-height: .28rem;
                        margin-top: .07rem
                    }

                    .gameWrap .cloumBox .cloumList li a .textImg .textBox .size {
                        margin-top: .19rem;
                        line-height: .22rem
                    }

                        .gameWrap .cloumBox .cloumList li a .textImg .textBox .size span {
                            font-size: .22rem;
                            color: #999999;
                            line-height: .22rem
                        }

                    .gameWrap .cloumBox .cloumList li a .textImg .textBox .time {
                        margin-top: .19rem;
                        font-size: .22rem;
                        color: #999999;
                        line-height: .22rem
                    }

            .gameWrap .cloumBox .cloumList li a .button {
                width: 1.24rem;
                height: .5rem;
                text-align: center;
                font-size: .24rem;
                color: #FFFFFF;
                line-height: .5rem;
                border-radius: .25rem;
                background-color: #ffa500
            }

.applicationWrap .gameClassification {
    padding: 0 .3rem
}

    .applicationWrap .gameClassification .gameClassificationBox {
        background: linear-gradient(180deg, #f5f8fdFF 0%, #f5f8fdFF .86rem, #fff .87rem, #fff 100%);
        border-radius: .03rem
    }

        .applicationWrap .gameClassification .gameClassificationBox .titleBox {
            padding: .28rem 0 0 .2rem;
            display: flex;
            align-items: flex-end
        }

            .applicationWrap .gameClassification .gameClassificationBox .titleBox .title {
                font-weight: bold;
                font-size: .32rem;
                color: #333333;
                line-height: .32rem
            }

            .applicationWrap .gameClassification .gameClassificationBox .titleBox .numBox span {
                font-size: .2rem;
                line-height: .2rem;
                color: #666666
            }

                .applicationWrap .gameClassification .gameClassificationBox .titleBox .numBox span:nth-child(1) {
                    padding: 0 .05rem 0 .08rem;
                    color: #cfcfcf
                }

                .applicationWrap .gameClassification .gameClassificationBox .titleBox .numBox span:nth-child(3) {
                    padding: 0 .07rem;
                    font-weight: bold;
                    color: #ff6633
                }

        .applicationWrap .gameClassification .gameClassificationBox .gameClassListBox {
            padding: .26rem .19rem .3rem .21rem
        }

            .applicationWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList {
                height: 2.58rem;
                display: grid;
                align-items: center;
                justify-content: space-between;
                grid-template-columns: repeat(3, 2.05rem);
                overflow: hidden
            }

                .applicationWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList li a {
                    height: .62rem;
                    text-align: center;
                    line-height: .62rem;
                    font-size: .3rem;
                    color: #666666;
                    border: .01rem solid #cfdcf8FF;
                    border-radius: .31rem;
                    margin-top: .2rem
                }

                .applicationWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList li.active a {
                    color: white;
                    background-color: #648feeFF
                }

                .applicationWrap .gameClassification .gameClassificationBox .gameClassListBox .gameClassList .openMore a {
                    color: #648feeFF
                }

.applicationWrap .cloumBox {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .applicationWrap .cloumBox .cloumList li {
        margin-top: .1rem
    }

        .applicationWrap .cloumBox .cloumList li a {
            padding: .3rem .21rem .31rem .3rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            background-color: white;
            border-radius: .03rem
        }

            .applicationWrap .cloumBox .cloumList li a .textImg {
                display: flex;
                flex: 1;
                overflow: hidden
            }

                .applicationWrap .cloumBox .cloumList li a .textImg .imgBox {
                    width: 1.2rem;
                    height: 1.2rem;
                    border-radius: .28rem
                }

                    .applicationWrap .cloumBox .cloumList li a .textImg .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .28rem
                    }

                .applicationWrap .cloumBox .cloumList li a .textImg .textBox {
                    margin-left: .27rem;
                    flex: 1;
                    overflow: hidden
                }

                    .applicationWrap .cloumBox .cloumList li a .textImg .textBox .name {
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        font-size: .28rem;
                        color: #000000;
                        line-height: .28rem;
                        margin-top: .07rem
                    }

                    .applicationWrap .cloumBox .cloumList li a .textImg .textBox .size {
                        margin-top: .19rem;
                        line-height: .22rem
                    }

                        .applicationWrap .cloumBox .cloumList li a .textImg .textBox .size span {
                            font-size: .22rem;
                            color: #999999;
                            line-height: .22rem
                        }

                    .applicationWrap .cloumBox .cloumList li a .textImg .textBox .time {
                        margin-top: .19rem;
                        font-size: .22rem;
                        color: #999999;
                        line-height: .22rem
                    }

            .applicationWrap .cloumBox .cloumList li a .button {
                width: 1.24rem;
                height: .5rem;
                text-align: center;
                font-size: .24rem;
                color: #FFFFFF;
                line-height: .5rem;
                border-radius: .25rem;
                background-color: #ffa500
            }

.specialWrap .specialSwiperBox {
    padding: 0 0 0 .3rem;
    overflow: hidden
}

    .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide {
        width: 6.5rem !important;
        height: 3.45rem !important;
        border-radius: .03rem;
        margin: 0
    }

        .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox {
            width: 100%;
            height: 100%;
            border-radius: .03rem;
            position: relative
        }

            .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                border-radius: .03rem
            }

            .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask {
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                pointer-events: none;
                border-radius: .03rem;
                background-color: rgba(0,0,0,0.205)
            }

                .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont {
                    padding: .3rem .3rem 0 .3rem
                }

                    .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .titleBox .title {
                        width: 1.02rem;
                        height: .32rem;
                        font-size: .18rem;
                        color: #ffffffFF;
                        text-align: center;
                        line-height: .32rem;
                        background-color: #ffa500;
                        border-radius: .06rem
                    }

                    .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .name {
                        margin-top: .36rem;
                        font-weight: bold;
                        font-size: .24rem;
                        line-height: .24rem;
                        color: #FFFFFF
                    }

                    .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .numBox {
                        padding-left: .01rem;
                        margin-top: .16rem;
                        display: flex;
                        align-items: center
                    }

                        .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .numBox p {
                            font-size: .18rem;
                            color: #c9d3daFF;
                            line-height: .18rem
                        }

                            .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .numBox p:nth-child(2) {
                                margin: 0 .08rem;
                                width: .04rem;
                                height: .03rem;
                                background-color: #c9d3daFF;
                                border-radius: 50%
                            }

                    .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .text {
                        margin-top: .13rem;
                        color: #c9d3daFF;
                        font-size: .18rem;
                        line-height: .24rem;
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;
                        overflow: hidden;
                        text-overflow: ellipsis
                    }

                    .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .arrow {
                        width: .58rem;
                        height: .58rem;
                        margin-top: .45rem;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        background-color: #ffffffFF;
                        border-radius: .06rem
                    }

                        .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide .imgBox .mask .maskContont .arrow .icon {
                            width: .18rem;
                            height: .12rem;
                            background-position: -1.54rem -2.65rem
                        }

        .specialWrap .specialSwiperBox .specialSwiper .swiper-wrapper .swiper-slide:nth-child(1) {
            margin-left: 0
        }

.specialWrap .filterWrap {
    padding: .35rem .3rem 0 .3rem
}

    .specialWrap .filterWrap .filterList {
        display: flex;
        align-items: center;
        padding-bottom: .05rem
    }

        .specialWrap .filterWrap .filterList li {
            margin-left: .16rem
        }

            .specialWrap .filterWrap .filterList li a {
                padding: .18rem .26rem .18rem .26rem;
                font-size: .26rem;
                color: #999999FF;
                line-height: .26rem;
                background-color: #ffffffFF;
                border-radius: .31rem
            }

            .specialWrap .filterWrap .filterList li.active a {
                font-weight: bold;
                font-size: .26rem;
                color: white;
                background-color: #ffa500
            }

            .specialWrap .filterWrap .filterList li:nth-child(1) {
                margin-left: 0
            }

    .specialWrap .filterWrap .tabsCont .cloumList {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-template-columns: repeat(2, 3.36rem)
    }

        .specialWrap .filterWrap .tabsCont .cloumList li {
            margin-top: .2rem
        }

            .specialWrap .filterWrap .tabsCont .cloumList li a {
                padding: .2rem .23rem .29rem .2rem;
                background-color: white;
                border-radius: .03rem
            }

                .specialWrap .filterWrap .tabsCont .cloumList li a .imgBox {
                    width: 2.93rem;
                    height: 1.83rem;
                    border-radius: .03rem
                }

                    .specialWrap .filterWrap .tabsCont .cloumList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                .specialWrap .filterWrap .tabsCont .cloumList li a .name {
                    margin-top: .14rem;
                    text-align: left;
                    font-size: .24rem;
                    color: #323232;
                    line-height: .24rem
                }

                .specialWrap .filterWrap .tabsCont .cloumList li a .time {
                    margin-top: .15rem;
                    display: flex;
                    align-items: center
                }

                    .specialWrap .filterWrap .tabsCont .cloumList li a .time p {
                        font-size: .18rem;
                        color: #bcbcbcFF;
                        line-height: .18rem
                    }

                        .specialWrap .filterWrap .tabsCont .cloumList li a .time p:nth-child(2) {
                            width: .04rem;
                            height: .03rem;
                            margin: 0 .06rem;
                            background-color: #bcbcbcFF;
                            border-radius: 50%
                        }

.strategyGuideWrap .stryGeSwiperBox {
    padding: 0 .3rem;
    overflow: hidden
}

    .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-wrapper .swiper-slide {
        width: 6.9rem !important;
        height: 2.7rem !important;
        border-radius: .03rem
    }

        .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-wrapper .swiper-slide .imgBox {
            width: 100%;
            height: 100%;
            position: relative;
            border-radius: .03rem !important
        }

            .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-wrapper .swiper-slide .imgBox img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                border-radius: .03rem
            }

            .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-wrapper .swiper-slide .imgBox .mask {
                width: 100%;
                height: 1.21rem;
                position: absolute;
                bottom: 0;
                left: 0;
                pointer-events: none;
                padding: .73rem 0 0 .19rem;
                color: #ffffffFF;
                font-size: .24rem;
                line-height: .24rem;
                border-radius: .03rem;
                background: linear-gradient(to bottom, rgba(0,0,0,0.021), rgba(0,0,0,0.9))
            }

    .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-pagination {
        width: auto;
        left: auto;
        bottom: .2rem;
        right: .2rem !important
    }

    .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-pagination-bullet {
        width: .21rem;
        height: .08rem;
        background-color: #888f86FF;
        border-radius: .03rem;
        opacity: 1
    }

    .strategyGuideWrap .stryGeSwiperBox .stryGeSwiper .swiper-pagination-bullet-active {
        width: .34rem;
        height: .08rem;
        background-color: #ffa500;
        border-radius: .03rem
    }

.strategyGuideWrap .filterWrap {
    padding: .35rem .3rem 0 .3rem
}

    .strategyGuideWrap .filterWrap .filterList {
        display: flex;
        align-items: center;
        padding-bottom: .15rem
    }

        .strategyGuideWrap .filterWrap .filterList li {
            margin-left: .16rem
        }

            .strategyGuideWrap .filterWrap .filterList li a {
                padding: .18rem .26rem .18rem .26rem;
                font-size: .26rem;
                color: #999999FF;
                line-height: .26rem;
                background-color: #ffffffFF;
                border-radius: .31rem
            }

            .strategyGuideWrap .filterWrap .filterList li.active a {
                font-weight: bold;
                font-size: .26rem;
                color: white;
                background-color: #ffa500
            }

            .strategyGuideWrap .filterWrap .filterList li:nth-child(1) {
                margin-left: 0
            }

    .strategyGuideWrap .filterWrap .cloumList li {
        margin-top: .1rem
    }

        .strategyGuideWrap .filterWrap .cloumList li a {
            padding: .22rem .28rem .2rem .19rem;
            background-color: white;
            display: flex;
            border-radius: .03rem
        }

            .strategyGuideWrap .filterWrap .cloumList li a .imgBox {
                width: 2.37rem;
                height: 1.42rem;
                border-radius: .03rem
            }

                .strategyGuideWrap .filterWrap .cloumList li a .imgBox img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: .03rem
                }

            .strategyGuideWrap .filterWrap .cloumList li a .txtBox {
                flex: 1;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                padding-left: .2rem;
                overflow: hidden
            }

                .strategyGuideWrap .filterWrap .cloumList li a .txtBox .name {
                    font-size: .28rem;
                    color: #000000;
                    line-height: .36rem;
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    text-overflow: ellipsis
                }

                .strategyGuideWrap .filterWrap .cloumList li a .txtBox .time {
                    padding-bottom: .05rem;
                    display: flex;
                    align-items: center
                }

                    .strategyGuideWrap .filterWrap .cloumList li a .txtBox .time p {
                        font-size: .18rem;
                        color: #a2a2a2FF;
                        line-height: .18rem
                    }

                        .strategyGuideWrap .filterWrap .cloumList li a .txtBox .time p:nth-child(2) {
                            width: .03rem;
                            height: .03rem;
                            border-radius: 50%;
                            margin: 0 .06rem;
                            background-color: #a2a2a2FF
                        }

.strategyGuideWrap .hotNews {
    padding: 0 .37rem 0 .23rem
}

    .strategyGuideWrap .hotNews .hotNewsBox {
        background: linear-gradient(180deg, #fbf9ef 0%, #fbf9ef .86rem, #fff .87rem, #fff 100%);
        border-radius: .03rem
    }

        .strategyGuideWrap .hotNews .hotNewsBox .titleBox {
            padding: .28rem .19rem 0 .2rem;
            display: grid;
            justify-content: space-between;
            grid-template-columns: repeat(2, auto)
        }

            .strategyGuideWrap .hotNews .hotNewsBox .titleBox .title {
                font-weight: bold;
                font-size: .32rem;
                line-height: .32rem;
                color: #e3cf72FF
            }

        .strategyGuideWrap .hotNews .hotNewsBox .cloumList {
            padding: .47rem .18rem .28rem .21rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(2, 3.17rem)
        }

            .strategyGuideWrap .hotNews .hotNewsBox .cloumList li a .imgBox {
                width: 3.17rem;
                height: 1.78rem;
                border-radius: .03rem
            }

                .strategyGuideWrap .hotNews .hotNewsBox .cloumList li a .imgBox img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: .03rem
                }

            .strategyGuideWrap .hotNews .hotNewsBox .cloumList li a .name {
                margin-top: .06rem;
                font-size: .24rem;
                color: #333333;
                line-height: .32rem;
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                text-overflow: ellipsis
            }

            .strategyGuideWrap .hotNews .hotNewsBox .cloumList li a .time {
                margin-top: .18rem;
                display: flex;
                align-items: center
            }

                .strategyGuideWrap .hotNews .hotNewsBox .cloumList li a .time p {
                    font-size: .18rem;
                    color: #999999FF;
                    line-height: .18rem
                }

                    .strategyGuideWrap .hotNews .hotNewsBox .cloumList li a .time p:nth-child(2) {
                        width: .03rem;
                        height: .03rem;
                        border-radius: 50%;
                        margin: 0 .06rem;
                        background-color: #999999FF
                    }

        .strategyGuideWrap .hotNews .hotNewsBox .txtBox {
            padding: 0 .2rem;
            padding-bottom: .41rem
        }

            .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList {
                border-top: .01rem solid #ececec
            }

                .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList li {
                    margin-top: .42rem
                }

                    .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList li a {
                        display: flex;
                        align-items: center
                    }

                        .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList li a .circle {
                            width: .06rem;
                            height: .06rem;
                            background-color: #b2adadFF;
                            border-radius: 50%
                        }

                        .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList li a .text {
                            margin-left: .13rem;
                            flex: 1;
                            color: #000000FF;
                            font-size: .24rem;
                            line-height: .24rem;
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis
                        }

                        .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList li a .time {
                            margin-left: .41rem;
                            font-size: .22rem;
                            line-height: .22rem;
                            color: #ccccccFF
                        }

                    .strategyGuideWrap .hotNews .hotNewsBox .txtBox .txtList li:nth-child(1) {
                        margin-top: .32rem
                    }

.strategyGuideWrap .hotGame {
    padding: 0 .37rem 0 .23rem;
    margin: .21rem 0 .4rem 0
}

    .strategyGuideWrap .hotGame .hotGameBox {
        background: linear-gradient(180deg, #fdf5f4FF 0%, #fdf5f4FF .86rem, #fff .87rem, #fff 100%);
        border-radius: .03rem
    }

        .strategyGuideWrap .hotGame .hotGameBox .titleBox {
            padding: .28rem .19rem 0 .2rem;
            display: grid;
            justify-content: space-between;
            grid-template-columns: repeat(2, auto)
        }

            .strategyGuideWrap .hotGame .hotGameBox .titleBox .title {
                font-weight: bold;
                font-size: .32rem;
                line-height: .32rem;
                color: #ffa500
            }

            .strategyGuideWrap .hotGame .hotGameBox .titleBox .more {
                font-size: .2rem;
                color: #ffa500;
                line-height: .2rem;
                position: relative;
                display: flex;
                justify-content: center
            }

                .strategyGuideWrap .hotGame .hotGameBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: 0;
                    background-color: #ffa500
                }

        .strategyGuideWrap .hotGame .hotGameBox .cloumList {
            padding: .2rem .19rem .43rem .22rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .strategyGuideWrap .hotGame .hotGameBox .cloumList li {
                margin-top: .29rem
            }

                .strategyGuideWrap .hotGame .hotGameBox .cloumList li a {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center
                }

                    .strategyGuideWrap .hotGame .hotGameBox .cloumList li a .imgBox {
                        width: 1.28rem;
                        height: 1.28rem;
                        border-radius: .3rem
                    }

                        .strategyGuideWrap .hotGame .hotGameBox .cloumList li a .imgBox img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            border-radius: .3rem
                        }

                    .strategyGuideWrap .hotGame .hotGameBox .cloumList li a .name {
                        width: 100%;
                        margin-top: .15rem;
                        text-align: center;
                        font-size: .24rem;
                        color: #333333;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                        line-height: .24rem
                    }

                    .strategyGuideWrap .hotGame .hotGameBox .cloumList li a .button {
                        width: 1.24rem;
                        height: .5rem;
                        margin-top: .15rem;
                        color: #ffa500;
                        font-size: .24rem;
                        text-align: center;
                        line-height: .5rem;
                        background-color: #e5f7fdFF;
                        border-radius: .25rem
                    }

.rankingWrap .rankingBox .filterSwiperBox {
    padding-left: .3rem;
    overflow: hidden
}

    .rankingWrap .rankingBox .filterSwiperBox .filterSwiper .swiper-wrapper .swiper-slide {
        width: 1.4rem !important;
        height: .56rem !important;
        font-size: .24rem;
        color: #999999;
        text-align: center;
        line-height: .56rem;
        border-radius: .28rem;
        background-color: #fbfbfbFF;
        border: 1px solid #f9e9bbFF;
        margin-left: .2rem
    }

        .rankingWrap .rankingBox .filterSwiperBox .filterSwiper .swiper-wrapper .swiper-slide:nth-child(1) {
            margin-left: 0
        }

    .rankingWrap .rankingBox .filterSwiperBox .filterSwiper .swiper-wrapper .current {
        color: white;
        background-color: #fdc82aFF
    }

.rankingWrap .rankingBox .rakingList {
    padding: .16rem .3rem 0 .3rem;
    margin-bottom: .4rem
}

    .rankingWrap .rankingBox .rakingList li {
        background-color: white;
        margin-top: .1rem;
        border-radius: .03rem
    }

        .rankingWrap .rankingBox .rakingList li a {
            padding: .31rem .2rem .32rem .34rem;
            display: flex;
            align-items: center;
            justify-content: space-between
        }

            .rankingWrap .rankingBox .rakingList li a .txtImg {
                display: flex;
                align-items: center
            }

                .rankingWrap .rankingBox .rakingList li a .txtImg .iconBox {
                    width: .34rem;
                    height: .34rem;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    font-weight: bold;
                    font-size: .34rem;
                    line-height: .34rem;
                    color: #CCCCCC;
                    font-style: italic
                }

                    .rankingWrap .rankingBox .rakingList li a .txtImg .iconBox .icon {
                        width: .26rem;
                        height: .31rem;
                        background-position: -2.78rem -1.11rem
                    }

                .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox {
                    display: flex
                }

                    .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .imgBox {
                        width: 1.2rem;
                        height: 1.2rem;
                        border-radius: .28rem;
                        margin-left: .36rem
                    }

                        .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .imgBox img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            border-radius: .28rem
                        }

                    .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .textBox {
                        margin-left: .26rem
                    }

                        .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .textBox .name {
                            font-size: .28rem;
                            color: #000000;
                            line-height: .28rem;
                            margin-top: .06rem
                        }

                        .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .textBox .size {
                            margin-top: .15rem
                        }

                            .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .textBox .size span {
                                font-size: .22rem;
                                color: #999999;
                                line-height: .22rem
                            }

                                .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .textBox .size span:nth-child(2) {
                                    padding: 0 .07rem
                                }

                        .rankingWrap .rankingBox .rakingList li a .txtImg .txtImgBox .textBox .time {
                            margin-top: .18rem;
                            font-size: .22rem;
                            color: #999999;
                            line-height: .22rem
                        }

            .rankingWrap .rankingBox .rakingList li a .button {
                width: 1.24rem;
                height: .5rem;
                text-align: center;
                font-size: .24rem;
                color: #FFFFFF;
                line-height: .5rem;
                background-color: #ffa500;
                border-radius: .25rem
            }

    .rankingWrap .rankingBox .rakingList .current {
        border-radius: .03rem
    }

        .rankingWrap .rankingBox .rakingList .current a {
            padding: 0;
            height: 2.1rem;
            position: relative
        }

            .rankingWrap .rankingBox .rakingList .current a .bgImg {
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                border-radius: .03rem
            }

                .rankingWrap .rankingBox .rakingList .current a .bgImg img {
                    width: 100%;
                    height: 100%;
                    border-radius: .03rem
                }

                .rankingWrap .rankingBox .rakingList .current a .bgImg .mask {
                    width: 100%;
                    height: 100%;
                    padding: .5rem .2rem .4rem .34rem;
                    position: absolute;
                    top: 0;
                    left: 0;
                    display: flex;
                    align-items: center;
                    border-radius: .03rem;
                    justify-content: space-between;
                    background-color: white
                }

                    .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg {
                        display: flex;
                        align-items: center
                    }

                        .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .iconBox {
                            width: .34rem;
                            height: .34rem;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            font-weight: bold;
                            font-size: .34rem;
                            line-height: .34rem;
                            color: #CCCCCC;
                            font-style: italic
                        }

                            .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .iconBox .icon {
                                width: .26rem;
                                height: .31rem;
                                background-position: -2.78rem -1.11rem
                            }

                        .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox {
                            display: flex
                        }

                            .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .imgBox {
                                width: 1.2rem;
                                height: 1.2rem;
                                border-radius: .28rem;
                                margin-left: .36rem
                            }

                                .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .imgBox img {
                                    width: 100%;
                                    height: 100%;
                                    object-fit: cover;
                                    border-radius: .28rem
                                }

                            .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .textBox {
                                margin-left: .26rem
                            }

                                .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .textBox .name {
                                    font-size: .28rem;
                                    color: #000000;
                                    line-height: .28rem;
                                    margin-top: .06rem
                                }

                                .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .textBox .size {
                                    margin-top: .15rem
                                }

                                    .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .textBox .size span {
                                        font-size: .22rem;
                                        color: #999999;
                                        line-height: .22rem
                                    }

                                        .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .textBox .size span:nth-child(2) {
                                            padding: 0 .07rem
                                        }

                                .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .txtImg .txtImgBox .textBox .time {
                                    margin-top: .18rem;
                                    font-size: .22rem;
                                    color: #999999;
                                    line-height: .22rem
                                }

                    .rankingWrap .rankingBox .rakingList .current a .bgImg .mask .button {
                        width: 1.24rem;
                        height: .5rem;
                        text-align: center;
                        font-size: .24rem;
                        color: #FFFFFF;
                        line-height: .5rem;
                        background-color: #ffa500;
                        border-radius: .25rem
                    }

            .rankingWrap .rankingBox .rakingList .current a .goldMedalBox {
                position: absolute;
                top: 0;
                left: .31rem
            }

                .rankingWrap .rankingBox .rakingList .current a .goldMedalBox .icon {
                    width: .45rem;
                    height: .55rem;
                    top: 0;
                    background-position: -0.83rem -1.79rem
                }

    .rankingWrap .rankingBox .rakingList li:nth-child(2) a .txtImg .iconBox .icon {
        width: .31rem;
        height: .31rem;
        background-position: -2.03rem -1.79rem
    }

    .rankingWrap .rankingBox .rakingList li:nth-child(3) a .txtImg .iconBox .icon {
        width: .31rem;
        height: .31rem;
        background-position: -2.78rem -0.1rem
    }

.detailWrap .detailTop {
    position: relative
}

    .detailWrap .detailTop .detailTopBg {
        width: 100%;
        height: 4.35rem;
        overflow: hidden
    }

        .detailWrap .detailTop .detailTopBg img {
            width: 100%;
            height: 100%;
            display: block;
            filter: blur(.2rem)
        }

    .detailWrap .detailTop .detailTopContont {
        width: 100%
    }

        .detailWrap .detailTop .detailTopContont .yuYue {
            padding: 0 .3rem
        }

            .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox {
                background-color: #f5fcffd5;
                overflow: hidden;
                border-radius: .03rem;
                padding-bottom: .3rem;
                position: relative
            }

                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg {
                    display: flex;
                    margin-top: .3rem;
                    padding: 0 .2rem
                }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .imgBox {
                        width: 1.4rem;
                        height: 1.4rem;
                        border-radius: .3rem
                    }

                        .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .imgBox img {
                            width: 100%;
                            height: 100%;
                            border-radius: .3rem
                        }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox {
                        margin-left: .19rem
                    }

                        .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox h1 {
                            margin-top: .09rem;
                            font-size: .34rem;
                            color: #15282D;
                            line-height: .34rem
                        }

                        .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .edition {
                            margin-top: .19rem;
                            display: flex;
                            align-items: center;
                            line-height: .24rem
                        }

                            .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .edition span {
                                display: block;
                                font-size: .24rem;
                                line-height: .24rem;
                                color: #999999FF
                            }

                                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .edition span:nth-child(2), .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .edition span:nth-child(5) {
                                    margin-left: .16rem
                                }

                                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .edition span:nth-child(3) {
                                    margin: 0 .11rem
                                }

                        .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .time {
                            margin-top: .21rem;
                            display: flex;
                            align-items: center
                        }

                            .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .time span {
                                display: block;
                                font-size: .24rem;
                                line-height: .24rem;
                                color: #999999FF
                            }

                                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .time span:nth-child(2) {
                                    margin-left: .12rem
                                }

                                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .textImg .textBox .time span:nth-child(3) {
                                    margin-left: .08rem
                                }

                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox {
                    margin-top: .3rem;
                    padding: 0 .21rem 0 .19rem;
                    display: flex;
                    align-items: center;
                    justify-content: center
                }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox .button {
                        flex: 1;
                        height: .75rem;
                        font-size: .32rem;
                        color: #FFFFFF;
                        text-align: center;
                        line-height: .75rem;
                        border-radius: .38rem;
                        background-color: #fdc82aFF
                    }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox .storage {
                        width: 48%;
                        height: .75rem;
                        text-align: center;
                        border-radius: .38rem;
                        margin-left: .2rem;
                        background-color: #0ec760
                    }

                        .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox .storage p {
                            color: white;
                            font-size: .28rem;
                            margin-top: .15rem;
                            line-height: .18rem
                        }

                            .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox .storage p:nth-child(2) {
                                font-size: .16rem;
                                line-height: .16rem;
                                color: rgba(255,255,255,0.7)
                            }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox .zw {
                        background-color: #d6d8d9
                    }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .buttonBox .mf {
                        background-color: #ffa500
                    }

                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .topic {
                    margin-top: .2rem;
                    padding: 0 .17rem 0 .31rem;
                    font-size: .24rem;
                    color: #FDC82A;
                    line-height: .3rem;
                    text-decoration-line: underline;
                    text-decoration-color: #f6f9e9;
                    text-underline-position: under;
                    text-decoration-thickness: .1rem;
                    text-underline-offset: -0.1rem;
                    opacity: .75
                }

                .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .lableBox {
                    width: .91rem;
                    height: 1.36rem;
                    position: absolute;
                    top: 0;
                    right: .2rem;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    background: url(../img/biaoqian.png) no-repeat;
                    background-size: 100% 100%
                }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .lableBox .icon {
                        width: .3rem;
                        height: .3rem;
                        margin-top: .13rem;
                        background-position: -2.78rem -0.61rem
                    }

                    .detailWrap .detailTop .detailTopContont .yuYue .yuYueBox .lableBox .num {
                        margin-top: .11rem;
                        font-size: .38rem;
                        color: #999999;
                        line-height: .38rem
                    }

.detailWrap .anchorPoint {
    padding: 0 .3rem
}

    .detailWrap .anchorPoint .anchorPointList {
        display: flex;
        align-items: flex-end;
        padding: .25rem 0 .22rem 0;
        border-bottom: .01rem solid #e9e9e9FF
    }

        .detailWrap .anchorPoint .anchorPointList li a {
            width: .95rem;
            text-align: center;
            font-size: .28rem;
            color: #666666;
            line-height: .28rem;
            margin-left: .4rem
        }

        .detailWrap .anchorPoint .anchorPointList li:nth-child(1) a {
            margin-left: 0
        }

        .detailWrap .anchorPoint .anchorPointList .current a {
            font-weight: bold;
            font-size: .34rem;
            color: #ffa500;
            line-height: .34rem;
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative
        }

            .detailWrap .anchorPoint .anchorPointList .current a::after {
                content: '';
                width: 100%;
                height: .04rem;
                position: absolute;
                bottom: -0.22rem;
                background-color: #ffa500
            }

.detailWrap .detaiSwiperBox {
    padding: 0 0 0 .3rem;
    margin-top: .21rem;
    overflow: hidden
}

    .detailWrap .detaiSwiperBox .detaiSwiper .swiper-wrapper .swiper-slide {
        width: auto;
        max-width: 5.94rem !important;
        height: 3.36rem !important;
        border-radius: .03rem;
        margin-left: .17rem
    }

    .detailWrap .detaiSwiperBox .detaiSwiper .swiper-wrapper .videoBox {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative
    }

        .detailWrap .detaiSwiperBox .detaiSwiper .swiper-wrapper .videoBox video {
            width: 100% !important;
            height: 100% !important;
            border-radius: .03rem;
            object-fit: fill
        }

        .detailWrap .detaiSwiperBox .detaiSwiper .swiper-wrapper .videoBox .icon {
            width: .75rem;
            height: .75rem;
            position: absolute;
            cursor: pointer;
            background-position: -0.1rem -0.1rem
        }

    .detailWrap .detaiSwiperBox .detaiSwiper .swiper-wrapper img {
        width: auto;
        height: 100%;
        object-fit: contain;
        border-radius: .03rem
    }

    .detailWrap .detaiSwiperBox .detaiSwiper .swiper-wrapper .swiper-slide:nth-child(1) {
        margin-left: 0
    }

.detailWrap .briefIntroduction {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .detailWrap .briefIntroduction .briefIntroductionBox {
        background-color: white;
        padding: 0 .2rem;
        border-radius: .03rem;
        overflow: hidden
    }

        .detailWrap .briefIntroduction .briefIntroductionBox .txt h3 {
            font-weight: bold;
            font-size: .3rem;
            color: #000000;
            line-height: .3rem;
            margin-top: .29rem
        }

        .detailWrap .briefIntroduction .briefIntroductionBox .txt p {
            margin-top: .15rem;
            color: #333333FF;
            font-size: .24rem;
            line-height: .44rem
        }

        .detailWrap .briefIntroduction .briefIntroductionBox .txt img {
            max-width: 100%;
            height: auto;
            display: block;
            margin-top: .2rem;
            margin: auto
        }

        .detailWrap .briefIntroduction .briefIntroductionBox .txt a {
            display: inline-block
        }

        .detailWrap .briefIntroduction .briefIntroductionBox .versionAdvantage .title {
            padding-left: .25rem;
            margin: .2rem 0;
            font-weight: bold;
            font-size: .28rem;
            line-height: .28rem;
            color: #ffa500;
            position: relative;
            display: flex;
            align-items: center
        }

            .detailWrap .briefIntroduction .briefIntroductionBox .versionAdvantage .title::after {
                content: "";
                width: 24px;
                height: 24px;
                position: absolute;
                left: 0;
                background: url(../img/blueStar.png) no-repeat;
                background-size: 100% 100%
            }

        .detailWrap .briefIntroduction .briefIntroductionBox .versionAdvantage .text {
            font-size: .24rem;
            color: #333333;
            line-height: .44rem
        }

        .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation {
            margin-top: .42rem
        }

            .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .titleBox {
                display: flex;
                align-items: center;
                justify-content: space-between
            }

                .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .titleBox .title {
                    font-weight: bold;
                    font-size: .3rem;
                    color: #000000;
                    line-height: .3rem
                }

                .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .titleBox .more {
                    font-size: .2rem;
                    color: #CCCCCC;
                    line-height: .2rem;
                    position: relative;
                    display: flex;
                    align-items: center;
                    justify-content: center
                }

                    .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .titleBox .more::after {
                        content: "";
                        width: 100%;
                        height: .02rem;
                        position: absolute;
                        bottom: -0.03rem;
                        background-color: #CCCCCC
                    }

            .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .textBox {
                margin-top: .22rem;
                font-size: .22rem;
                color: #CCCCCC;
                line-height: .22rem
            }

            .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .textBoxTwo {
                display: flex;
                align-items: center;
                margin-top: .19rem
            }

                .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .textBoxTwo span {
                    display: block;
                    font-size: .22rem;
                    color: #333333;
                    line-height: .22rem
                }

                    .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .textBoxTwo span:nth-child(2) {
                        padding-left: .27rem
                    }

            .detailWrap .briefIntroduction .briefIntroductionBox .updateInformation .textBoxThree {
                margin-top: .1rem;
                font-size: .22rem;
                color: #333333;
                line-height: .44rem
            }

        .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation {
            margin-top: .37rem
        }

            .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .titleBox {
                display: flex;
                align-items: center;
                justify-content: space-between
            }

                .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .titleBox .title {
                    font-weight: bold;
                    font-size: .3rem;
                    color: #000000;
                    line-height: .3rem
                }

                .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .titleBox .status {
                    width: .88rem;
                    height: .34rem;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    background-color: #feeee9FF;
                    border-radius: .06rem
                }

                    .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .titleBox .status .icon {
                        width: .16rem;
                        height: .2rem;
                        background-position: -3.28rem -0.5rem
                    }

                    .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .titleBox .status .statusText {
                        padding-left: .07rem;
                        font-size: .2rem;
                        color: #FF6C37;
                        line-height: .2rem
                    }

            .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .informationList {
                margin-top: .14rem
            }

                .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .informationList li {
                    padding: .23rem 0 .2rem 0;
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    border-bottom: .01rem solid #ecf0f1FF
                }

                    .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .informationList li .textL {
                        font-size: .24rem;
                        line-height: .24rem;
                        color: #999999
                    }

                    .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .informationList li .textR {
                        font-size: .24rem;
                        color: #1F1F1F;
                        line-height: .24rem
                    }

                    .detailWrap .briefIntroduction .briefIntroductionBox .gameInformation .informationList li .yellowColor {
                        color: #FDD567FF;
                        cursor: pointer
                    }

        .detailWrap .briefIntroduction .briefIntroductionBox .laleList {
            margin: .3rem 0;
            display: flex;
            align-items: center
        }

            .detailWrap .briefIntroduction .briefIntroductionBox .laleList li a {
                padding: .12rem .14rem .11rem .13rem;
                font-size: .18rem;
                color: #666666;
                line-height: .18rem;
                background-color: #f9f9f9FF;
                border-radius: .2rem;
                margin-left: .06rem
            }

            .detailWrap .briefIntroduction .briefIntroductionBox .laleList li:first-child {
                margin-left: 0
            }

            .detailWrap .briefIntroduction .briefIntroductionBox .laleList .current a {
                padding: 0;
                width: .42rem;
                height: .42rem;
                font-size: .24rem;
                color: #40BFF3;
                text-align: center;
                line-height: .42rem;
                border-radius: 50%;
                background-color: #e7f6fbFF
            }

.detailWrap .relatedVersions {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .detailWrap .relatedVersions .relatedVersionsBox {
        padding: 0 .2rem;
        background-color: white;
        border-radius: .03rem;
        overflow: hidden
    }

        .detailWrap .relatedVersions .relatedVersionsBox .title {
            margin-top: .28rem;
            font-weight: bold;
            font-size: .3rem;
            color: #000000;
            line-height: .3rem
        }

        .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList {
            margin: .25rem 0 .3rem 0
        }

            .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a {
                padding: .19rem .19rem .17rem .17rem;
                display: flex;
                align-items: center;
                justify-content: space-between;
                background-color: #ebf9feFF
            }

                .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg {
                    display: flex
                }

                    .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .imgBox {
                        width: .72rem;
                        height: .72rem;
                        border-radius: .1rem
                    }

                        .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .imgBox img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            border-radius: .1rem
                        }

                    .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .textBox {
                        margin-left: .18rem
                    }

                        .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .textBox .name {
                            font-size: .24rem;
                            color: #333333;
                            line-height: .24rem;
                            margin-top: .08rem
                        }

                        .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .textBox .size {
                            display: flex;
                            align-items: center;
                            margin-top: .14rem
                        }

                            .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .textBox .size span {
                                display: block;
                                font-size: .2rem;
                                color: #949494;
                                line-height: .2rem
                            }

                                .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .textImg .textBox .size span:nth-child(3) {
                                    margin: 0 .11rem
                                }

                .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li a .button {
                    width: 1.24rem;
                    height: .5rem;
                    text-align: center;
                    line-height: .45rem;
                    color: #ffa500;
                    font-size: .24rem;
                    border-radius: .25rem;
                    background-color: #ebf9feFF;
                    border: .02rem solid #75d4f7FF
                }

            .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li:nth-child(2) a {
                background-color: white
            }

                .detailWrap .relatedVersions .relatedVersionsBox .relatedVersionsList li:nth-child(2) a .button {
                    background-color: white
                }

.detailWrap .recommend {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .detailWrap .recommend .recommendBox {
        padding: 0 .2rem;
        background-color: white;
        border-radius: .03rem;
        overflow: hidden;
        padding-bottom: .38rem
    }

        .detailWrap .recommend .recommendBox .titleBox {
            display: flex;
            justify-content: space-between
        }

            .detailWrap .recommend .recommendBox .titleBox .title {
                margin-top: .27rem;
                font-weight: bold;
                font-size: .3rem;
                color: #000000;
                line-height: .3rem
            }

            .detailWrap .recommend .recommendBox .titleBox .more {
                margin-top: .1rem;
                font-size: .2rem;
                color: #ccccccFF;
                line-height: .2rem;
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .detailWrap .recommend .recommendBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: 0rem;
                    background-color: #ccccccFF
                }

        .detailWrap .recommend .recommendBox .recommendList {
            padding-top: .03rem;
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .detailWrap .recommend .recommendBox .recommendList li {
                margin-top: .29rem
            }

                .detailWrap .recommend .recommendBox .recommendList li a {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center
                }

                    .detailWrap .recommend .recommendBox .recommendList li a .imgbox {
                        width: 1.28rem;
                        height: 1.28rem;
                        border-radius: .3rem
                    }

                        .detailWrap .recommend .recommendBox .recommendList li a .imgbox img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            border-radius: .3rem
                        }

                    .detailWrap .recommend .recommendBox .recommendList li a .name {
                        width: 100%;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                        overflow: hidden;
                        text-align: center;
                        font-size: .24rem;
                        color: #333333;
                        line-height: .24rem;
                        margin-top: .15rem
                    }

                    .detailWrap .recommend .recommendBox .recommendList li a .button {
                        width: 1.24rem;
                        height: .5rem;
                        text-align: center;
                        line-height: .5rem;
                        font-size: .24rem;
                        color: #ffa500;
                        background-color: #e5f7fdFF;
                        border-radius: .25rem;
                        margin-top: .15rem
                    }

.detailWrap .relatedTopics {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .detailWrap .relatedTopics .relatedTopicsBox {
        padding: 0 .2rem;
        background-color: white;
        border-radius: .03rem;
        overflow: hidden
    }

        .detailWrap .relatedTopics .relatedTopicsBox .titleBox {
            display: flex;
            justify-content: space-between
        }

            .detailWrap .relatedTopics .relatedTopicsBox .titleBox .title {
                margin-top: .27rem;
                font-weight: bold;
                font-size: .3rem;
                color: #000000;
                line-height: .3rem
            }

            .detailWrap .relatedTopics .relatedTopicsBox .titleBox .more {
                margin-top: .1rem;
                font-size: .2rem;
                color: #ccccccFF;
                line-height: .2rem;
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .detailWrap .relatedTopics .relatedTopicsBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: 0rem;
                    background-color: #ccccccFF
                }

        .detailWrap .relatedTopics .relatedTopicsBox .filter {
            margin-top: .22rem;
            display: flex;
            align-items: center
        }

            .detailWrap .relatedTopics .relatedTopicsBox .filter li {
                margin-left: .15rem
            }

                .detailWrap .relatedTopics .relatedTopicsBox .filter li a {
                    padding: .13rem .18rem .13rem .2rem;
                    font-size: .24rem;
                    color: #999999;
                    line-height: .24rem;
                    background-color: #f7f7f7FF;
                    border-radius: .27rem
                }

                .detailWrap .relatedTopics .relatedTopicsBox .filter li.active a {
                    color: white;
                    background-color: #ffa500
                }

                .detailWrap .relatedTopics .relatedTopicsBox .filter li:nth-child(1) {
                    margin-left: 0
                }

    .detailWrap .relatedTopics .topicsImg {
        width: 6.5rem;
        height: 3.45rem;
        padding: 0 .2rem;
        padding-top: .2rem;
        border-radius: .03rem;
        background-color: white
    }

        .detailWrap .relatedTopics .topicsImg .imgBox {
            width: 100%;
            height: 100%;
            border-radius: .03rem;
            position: relative
        }

            .detailWrap .relatedTopics .topicsImg .imgBox img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                border-radius: .03rem
            }

            .detailWrap .relatedTopics .topicsImg .imgBox .mask {
                width: 100%;
                height: 100%;
                position: absolute;
                top: 0;
                left: 0;
                pointer-events: none;
                border-radius: .03rem;
                background-color: rgba(0,0,0,0.205)
            }

                .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont {
                    padding: .3rem .51rem 0 .3rem
                }

                    .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .titleBoxs .titles {
                        width: 1.02rem;
                        height: .32rem;
                        font-size: .18rem;
                        text-align: center;
                        color: #ffffffFF;
                        line-height: .32rem;
                        background-color: #fdc82aFF;
                        border-radius: .06rem
                    }

                    .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .name {
                        margin-top: .36rem;
                        font-weight: bold;
                        font-size: .24rem;
                        line-height: .24rem;
                        color: #FFFFFF
                    }

                    .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .numBox {
                        padding-left: .01rem;
                        margin-top: .16rem;
                        display: flex;
                        align-items: center
                    }

                        .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .numBox p {
                            font-size: .18rem;
                            color: #c9d3daFF;
                            line-height: .18rem
                        }

                            .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .numBox p:nth-child(2) {
                                margin: 0 .08rem;
                                width: .04rem;
                                height: .03rem;
                                background-color: #c9d3daFF;
                                border-radius: 50%
                            }

                    .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .text {
                        margin-top: .13rem;
                        color: #c9d3daFF;
                        font-size: .18rem;
                        line-height: .24rem;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        display: -webkit-box;
                        -webkit-line-clamp: 2;
                        -webkit-box-orient: vertical
                    }

                    .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .arrow {
                        width: .58rem;
                        height: .58rem;
                        margin-top: .45rem;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        background-color: #ffffffFF;
                        border-radius: .06rem
                    }

                        .detailWrap .relatedTopics .topicsImg .imgBox .mask .maskContont .arrow .icon {
                            width: .18rem;
                            height: .12rem;
                            background-position: -1.54rem -2.65rem
                        }

    .detailWrap .relatedTopics .swiperBox {
        padding: .3rem 0 .47rem .2rem;
        overflow: hidden;
        background-color: white
    }

        .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide {
            width: 5.8rem !important
        }

            .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card {
                margin-top: .4rem;
                display: flex;
                align-items: center;
                justify-content: space-between
            }

                .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg {
                    display: flex
                }

                    .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .imgBox {
                        width: 1.2rem;
                        height: 1.2rem;
                        border-radius: .26rem
                    }

                        .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .imgBox img {
                            width: 100%;
                            height: 100%;
                            border-radius: .26rem
                        }

                    .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox {
                        margin-left: .22rem
                    }

                        .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .name {
                            font-size: .26rem;
                            color: #000000;
                            line-height: .24rem;
                            margin-top: .04rem
                        }

                        .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .size {
                            margin-top: .11rem;
                            font-size: .2rem;
                            color: #9F9FA4;
                            line-height: .4rem
                        }

                            .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .size span {
                                font-size: .2rem;
                                color: #9F9FA4;
                                line-height: .4rem
                            }

                                .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .size span:nth-child(2) {
                                    margin: 0 .06rem
                                }

                        .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .textImg .textBox .time {
                            font-size: .2rem;
                            color: #9F9FA4;
                            line-height: .4rem
                        }

                .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card .button {
                    width: 1.24rem;
                    height: .5rem;
                    font-size: .24rem;
                    text-align: center;
                    color: #ffa500;
                    line-height: .5rem;
                    background: #e5f7fdFF;
                    border-radius: .25rem
                }

                .detailWrap .relatedTopics .swiperBox .recentUpdatesSwiper .swiper-wrapper .swiper-slide .card:first-child {
                    margin-top: 0
                }

.detailWrap .strategyInformation {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .detailWrap .strategyInformation .strategyInformationBox {
        padding: 0 .2rem;
        background-color: white;
        border-radius: .03rem;
        overflow: hidden;
        padding-bottom: .4rem
    }

        .detailWrap .strategyInformation .strategyInformationBox .titleBox {
            display: flex;
            justify-content: space-between
        }

            .detailWrap .strategyInformation .strategyInformationBox .titleBox .title {
                margin-top: .27rem;
                font-weight: bold;
                font-size: .3rem;
                color: #000000;
                line-height: .3rem
            }

            .detailWrap .strategyInformation .strategyInformationBox .titleBox .more {
                margin-top: .1rem;
                font-size: .2rem;
                color: #ccccccFF;
                line-height: .2rem;
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .detailWrap .strategyInformation .strategyInformationBox .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: 0rem;
                    background-color: #ccccccFF
                }

        .detailWrap .strategyInformation .strategyInformationBox .strInforList {
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(2, 3.17rem)
        }

            .detailWrap .strategyInformation .strategyInformationBox .strInforList li {
                margin-top: .25rem
            }

                .detailWrap .strategyInformation .strategyInformationBox .strInforList li a .imgBox {
                    width: 3.17rem;
                    height: 1.78rem;
                    border-radius: .03rem
                }

                    .detailWrap .strategyInformation .strategyInformationBox .strInforList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                .detailWrap .strategyInformation .strategyInformationBox .strInforList li a .name {
                    margin-top: .05rem;
                    font-size: .24rem;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    color: #333333;
                    line-height: .32rem
                }

                .detailWrap .strategyInformation .strategyInformationBox .strInforList li a .time {
                    margin-top: .18rem;
                    display: flex;
                    align-items: center
                }

                    .detailWrap .strategyInformation .strategyInformationBox .strInforList li a .time p {
                        font-size: .18rem;
                        color: #999999;
                        line-height: .18rem
                    }

                        .detailWrap .strategyInformation .strategyInformationBox .strInforList li a .time p:nth-child(2) {
                            width: .03rem;
                            height: .03rem;
                            border-radius: 50%;
                            margin: 0 .06rem;
                            background-color: #999999
                        }

.detailWrap .userReviews {
    padding: 0 .3rem;
    margin-top: .2rem;
    overflow: hidden
}

    .detailWrap .userReviews .userReviewsBox {
        padding: .31rem 0 .33rem 0;
        background-color: white;
        border-radius: .03rem
    }

        .detailWrap .userReviews .userReviewsBox .title {
            padding: 0 0 0 .2rem;
            font-size: .32rem;
            color: #272727;
            line-height: .32rem
        }

        .detailWrap .userReviews .userReviewsBox .filterSwiperBox {
            margin-top: .36rem;
            padding-left: .2rem;
            overflow: hidden
        }

            .detailWrap .userReviews .userReviewsBox .filterSwiperBox .filterSwiper .swiper-wrapper {
                display: flex;
                align-items: center
            }

                .detailWrap .userReviews .userReviewsBox .filterSwiperBox .filterSwiper .swiper-wrapper .swiper-slide {
                    width: auto
                }

                    .detailWrap .userReviews .userReviewsBox .filterSwiperBox .filterSwiper .swiper-wrapper .swiper-slide a {
                        padding: .21rem .36rem .19rem .37rem;
                        font-size: .26rem;
                        color: #999999;
                        line-height: .26rem;
                        margin-left: .14rem;
                        background-color: #f8f8faFF;
                        border-radius: .3rem
                    }

                    .detailWrap .userReviews .userReviewsBox .filterSwiperBox .filterSwiper .swiper-wrapper .swiper-slide.current a {
                        color: white;
                        background-color: #ffa500
                    }

                    .detailWrap .userReviews .userReviewsBox .filterSwiperBox .filterSwiper .swiper-wrapper .swiper-slide:first-child a {
                        margin-left: 0
                    }

        .detailWrap .userReviews .userReviewsBox .scoreBox {
            display: flex;
            justify-content: space-between;
            margin-top: .41rem;
            padding: 0 .2rem 0 .55rem
        }

            .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxL .num {
                font-size: .82rem;
                color: #28282C;
                line-height: .82rem
            }

            .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxL .comment {
                margin-top: .15rem;
                font-size: .24rem;
                color: #999999;
                line-height: .24rem
            }

            .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li {
                display: flex;
                align-items: center;
                margin-top: .1rem
            }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap {
                    width: .9rem;
                    display: flex;
                    justify-content: flex-end;
                    margin-right: .14rem
                }

                    .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type="range"] {
                        -webkit-appearance: none;
                        width: .9rem;
                        margin: 0;
                        outline: 0
                    }

                    .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type="range" i]::-webkit-slider-runnable-track {
                        background: #FCBC14;
                        height: .18rem;
                        -webkit-mask: url(../img/smallStar.png);
                        -webkit-mask-size: .18rem;
                        -webkit-mask-repeat: repeat-x
                    }

                    .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type="range" i]::-webkit-slider-thumb {
                        -webkit-appearance: none;
                        width: 0;
                        height: 100%;
                        box-shadow: 999px 0 0 999px #B5B5B5
                    }

                    .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type=range] {
                        -webkit-mask: url(../img/smallStar.png);
                        -webkit-mask-size: .18rem;
                        -webkit-mask-repeat: repeat-x;
                        height: .18rem
                    }

                        .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type=range]::-moz-range-track {
                            background: #B5B5B5;
                            height: inherit
                        }

                        .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type=range]::-moz-range-progress {
                            background: #FCBC14;
                            height: inherit
                        }

                        .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .statWrap input[type=range]::-moz-range-thumb {
                            width: 0;
                            opacity: 0
                        }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .scoreBg {
                    width: 2.64rem;
                    height: .08rem;
                    position: relative;
                    border-radius: .04rem;
                    background-color: #dfdfdfFF
                }

                    .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li .scoreBg .scoreBgActive {
                        width: 30%;
                        height: 100%;
                        position: absolute;
                        top: 0;
                        left: 0;
                        border-radius: .04rem;
                        background-color: #b5b5b5FF
                    }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(1) {
                    margin-top: 0
                }

                    .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(1) .scoreBg .scoreBgActive {
                        width: 80%
                    }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(2) .scoreBg .scoreBgActive {
                    width: 40%
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(2) .statWrap input[type="range"] {
                    width: .72rem
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(3) .scoreBg .scoreBgActive {
                    width: 30%
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(3) .statWrap input[type="range"] {
                    width: .54rem
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(4) .scoreBg .scoreBgActive {
                    width: 25%
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(4) .statWrap input[type="range"] {
                    width: .36rem
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(5) .scoreBg .scoreBgActive {
                    width: 20%
                }

                .detailWrap .userReviews .userReviewsBox .scoreBox .scoreBoxR li:nth-child(5) .statWrap input[type="range"] {
                    width: .18rem
                }

        .detailWrap .userReviews .userReviewsBox .release {
            margin-top: .4rem;
            padding: 0 .2rem
        }

            .detailWrap .userReviews .userReviewsBox .release .releaseBox {
                height: 2.28rem;
                border: .01rem solid #e7e7e7FF;
                border-radius: .1rem;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center
            }

                .detailWrap .userReviews .userReviewsBox .release .releaseBox .releaseTop {
                    display: flex;
                    align-items: center
                }

                    .detailWrap .userReviews .userReviewsBox .release .releaseBox .releaseTop .icon {
                        width: .58rem;
                        height: .59rem;
                        background-position: -1.98rem -0.96rem
                    }

                    .detailWrap .userReviews .userReviewsBox .release .releaseBox .releaseTop .texts {
                        margin-left: .14rem;
                        font-size: .24rem;
                        color: #999999;
                        line-height: .24rem
                    }

                .detailWrap .userReviews .userReviewsBox .release .releaseBox .releasebtom {
                    display: flex;
                    align-items: center;
                    margin-top: .2rem
                }

                    .detailWrap .userReviews .userReviewsBox .release .releaseBox .releasebtom .icon {
                        width: .38rem;
                        height: .39rem;
                        margin-left: .23rem;
                        background-position: -1.08rem -1.05rem
                    }

                        .detailWrap .userReviews .userReviewsBox .release .releaseBox .releasebtom .icon:first-child {
                            margin-left: 0
                        }

.detailWrap .allEvaluate {
    padding: 0 .3rem;
    margin-top: .2rem;
    margin-bottom: .43rem
}

    .detailWrap .allEvaluate .allEvaluateBox {
        padding: 0 .2rem;
        padding-bottom: .61rem;
        background-color: white;
        border-radius: .03rem;
        overflow: hidden
    }

        .detailWrap .allEvaluate .allEvaluateBox .allTextBox {
            margin-top: .36rem;
            display: flex;
            align-items: flex-end;
            justify-content: space-between
        }

            .detailWrap .allEvaluate .allEvaluateBox .allTextBox .title {
                font-size: .32rem;
                color: #333333;
                line-height: .32rem
            }

            .detailWrap .allEvaluate .allEvaluateBox .allTextBox .filter {
                display: flex
            }

                .detailWrap .allEvaluate .allEvaluateBox .allTextBox .filter li a {
                    color: #666666FF;
                    font-size: .24rem;
                    line-height: .24rem
                }

                .detailWrap .allEvaluate .allEvaluateBox .allTextBox .filter li.active a {
                    color: #ffa500
                }

                .detailWrap .allEvaluate .allEvaluateBox .allTextBox .filter .space {
                    padding: 0 .29rem;
                    color: #e0e0e0FF;
                    font-size: .2rem;
                    line-height: .2rem
                }

        .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li {
            margin-top: .44rem
        }

            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox {
                display: flex
            }

                .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .headPortrait {
                    width: .74rem;
                    height: .74rem;
                    border-radius: 50%
                }

                    .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .headPortrait img {
                        width: 100%;
                        height: 100%;
                        border-radius: 50%
                    }

                .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox {
                    flex: 1;
                    padding-left: .32rem
                }

                    .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .name {
                        font-size: .28rem;
                        color: #333333;
                        line-height: .28rem
                    }

                    .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox {
                        margin-top: .21rem;
                        display: flex;
                        align-items: flex-end;
                        justify-content: space-between
                    }

                        .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap {
                            width: 1.2rem;
                            display: flex;
                            justify-content: flex-end
                        }

                            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type="range"] {
                                -webkit-appearance: none;
                                width: 1.2rem;
                                margin: 0;
                                outline: 0
                            }

                            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type="range" i]::-webkit-slider-runnable-track {
                                background: #FCBC14;
                                height: .24rem;
                                -webkit-mask: url(../img/centerStar.png);
                                -webkit-mask-size: .24rem;
                                -webkit-mask-repeat: repeat-x
                            }

                            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type="range" i]::-webkit-slider-thumb {
                                -webkit-appearance: none;
                                width: 0;
                                height: 100%;
                                box-shadow: 999px 0 0 999px #B5B5B5
                            }

                            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type=range] {
                                -webkit-mask: url(../img/centerStar.png);
                                -webkit-mask-size: .24rem;
                                -webkit-mask-repeat: repeat-x;
                                height: .24rem
                            }

                                .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type=range]::-moz-range-track {
                                    background: #B5B5B5;
                                    height: inherit
                                }

                                .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type=range]::-moz-range-progress {
                                    background: #FCBC14;
                                    height: inherit
                                }

                                .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .statWrap input[type=range]::-moz-range-thumb {
                                    width: 0;
                                    opacity: 0
                                }

                        .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .topBox .textBox .timeBox .time {
                            font-size: .24rem;
                            color: #999999;
                            line-height: .24rem
                        }

            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .commentText {
                margin-top: .16rem;
                font-size: .24rem;
                color: #333333;
                line-height: .42rem
            }

            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .mobile {
                padding: .28rem 0 .24rem 0;
                font-size: .2rem;
                line-height: .2rem;
                color: #CCCCCC;
                border-bottom: .01rem solid #ecececFF
            }

            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .mobilees {
                border-bottom: .01rem dashed #ecececFF
            }

            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .commentList li {
                margin: 0;
                padding: 0;
                margin-top: .2rem;
                margin-bottom: .18rem
            }

                .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .commentList li span {
                    line-height: .42rem
                }

                    .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .commentList li span:nth-child(1) {
                        font-weight: bold;
                        font-size: .24rem;
                        color: #333333
                    }

                    .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .commentList li span:nth-child(2) {
                        font-size: .24rem;
                        color: #333333
                    }

            .detailWrap .allEvaluate .allEvaluateBox .allEvaluatList li .reply {
                font-size: .2rem;
                color: #73c9f5FF;
                line-height: .2rem
            }

        .detailWrap .allEvaluate .allEvaluateBox .checkMore {
            width: 6.5rem;
            height: .66rem;
            margin-top: .5rem;
            color: #CCCCCCFF;
            font-size: .26rem;
            text-align: center;
            line-height: .66rem;
            background-color: #fafafaFF;
            border-radius: .33rem
        }

.specialDetailWrap .specDetailTop {
    padding: 0 .3rem
}

    .specialDetailWrap .specDetailTop .specDetailTopContont {
        width: 6.9rem;
        position: relative;
        border-radius: .03rem;
        overflow: hidden
    }

        .specialDetailWrap .specDetailTop .specDetailTopContont .imgBox {
            width: 100%
        }

            .specialDetailWrap .specDetailTop .specDetailTopContont .imgBox img {
                width: 100%;
                height: 100%;
                object-fit: fill
            }

        .specialDetailWrap .specDetailTop .specDetailTopContont .imgBoxTwo {
            width: 100%
        }

            .specialDetailWrap .specDetailTop .specDetailTopContont .imgBoxTwo img {
                width: 100%;
                height: 100%;
                object-fit: fill;
                filter: blur(.15rem)
            }

        .specialDetailWrap .specDetailTop .specDetailTopContont .mask {
            width: 100%;
            position: absolute;
            bottom: 0;
            padding: 0 .2rem
        }

            .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont {
                width: 100%;
                height: 100%;
                background: linear-gradient(180deg, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0.5) .5rem, white .5rem, white 100%);
                border-radius: .03rem;
                overflow: hidden
            }

                .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .status {
                    width: 1.02rem;
                    height: .32rem;
                    margin: .18rem 0 0 .2rem;
                    color: white;
                    font-size: .18rem;
                    text-align: center;
                    line-height: .32rem;
                    background-color: #fdc82aFF;
                    border-radius: .06rem
                }

                .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont h1 {
                    font-weight: bold;
                    font-size: .28rem;
                    color: #333333;
                    line-height: .24rem;
                    margin: .28rem 0 0 .19rem
                }

                .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .timeBox {
                    display: flex;
                    margin: .18rem 0 0 .2rem
                }

                    .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .timeBox p {
                        font-size: .18rem;
                        line-height: .18rem;
                        color: #bcbcbcFF
                    }

                .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .textBox {
                    padding: .16rem .19rem 0 .19rem;
                    font-size: .18rem;
                    color: #333333;
                    line-height: .32rem
                }

                .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .lableList {
                    display: flex;
                    align-items: center;
                    flex-wrap: wrap;
                    padding: 0 .2rem;
                    margin-top: .2rem;
                    padding-bottom: .2rem
                }

                    .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .lableList li {
                        margin-top: .15rem
                    }

                        .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .lableList li a {
                            padding: .08rem .17rem .06rem .15rem;
                            margin-left: .15rem;
                            font-size: .18rem;
                            color: #666666;
                            line-height: .18rem;
                            border-radius: .06rem;
                            background-color: #ebeceeFF
                        }

                        .specialDetailWrap .specDetailTop .specDetailTopContont .mask .maskContont .lableList li:first-child a {
                            margin-left: 0
                        }

.specialDetailWrap .premiumGames {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .specialDetailWrap .premiumGames .premiumGamesContont .titleBox {
        padding: 0 .2rem;
        display: flex;
        justify-content: space-between;
        background-color: white
    }

        .specialDetailWrap .premiumGames .premiumGamesContont .titleBox .title {
            font-weight: bold;
            font-size: .3rem;
            color: #000000;
            line-height: .4rem;
            margin-top: .23rem
        }

        .specialDetailWrap .premiumGames .premiumGamesContont .titleBox .more {
            margin-top: .24rem;
            color: #ccccccFF;
            font-size: .2rem;
            height: .2rem;
            line-height: .2rem;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center
        }

            .specialDetailWrap .premiumGames .premiumGamesContont .titleBox .more::after {
                content: "";
                width: 100%;
                height: .02rem;
                position: absolute;
                bottom: -0.11rem;
                background-color: #ccccccFF;
                border-radius: .01rem
            }

    .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li {
        margin-top: .1rem
    }

        .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a {
            padding: .3rem .21rem .3rem .3rem;
            background-color: white;
            display: flex;
            align-items: center;
            justify-content: space-between
        }

            .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox {
                display: flex
            }

                .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .imgBox {
                    width: 1.2rem;
                    height: 1.2rem;
                    border-radius: .28rem
                }

                    .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .28rem
                    }

                .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .textBox {
                    margin-left: .26rem
                }

                    .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .textBox .name {
                        margin-top: .06rem;
                        font-size: .28rem;
                        color: #000000;
                        line-height: .24rem
                    }

                    .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .textBox .size {
                        margin-top: .09rem;
                        line-height: .4rem
                    }

                        .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .textBox .size span {
                            font-size: .22rem;
                            color: #999999;
                            line-height: .4rem
                        }

                            .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .textBox .size span:nth-child(2) {
                                padding: 0 .06rem
                            }

                    .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .txtImgBox .textBox .time {
                        margin-top: .01rem;
                        font-size: .22rem;
                        color: #999999;
                        line-height: .4rem
                    }

            .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li a .button {
                width: 1.24rem;
                height: .5rem;
                font-size: .24rem;
                color: #FFFFFF;
                text-align: center;
                line-height: .5rem;
                background-color: #ffa500;
                border-radius: .25rem
            }

        .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li:first-child {
            margin-top: 0
        }

            .specialDetailWrap .premiumGames .premiumGamesContont .premiumGamesList li:first-child a {
                padding-top: .26rem
            }

.specialDetailWrap .selectedRecom {
    padding: 0 .3rem;
    margin-top: .2rem
}

    .specialDetailWrap .selectedRecom .selectedRecomContont .titleBox {
        padding: 0 .2rem;
        display: flex;
        justify-content: space-between;
        background-color: white
    }

        .specialDetailWrap .selectedRecom .selectedRecomContont .titleBox .title {
            font-weight: bold;
            font-size: .3rem;
            color: #000000;
            line-height: .4rem;
            margin-top: .23rem
        }

        .specialDetailWrap .selectedRecom .selectedRecomContont .titleBox .more {
            margin-top: .24rem;
            color: #ccccccFF;
            font-size: .2rem;
            height: .2rem;
            line-height: .2rem;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center
        }

            .specialDetailWrap .selectedRecom .selectedRecomContont .titleBox .more::after {
                content: "";
                width: 100%;
                height: .02rem;
                position: absolute;
                bottom: -0.11rem;
                background-color: #ccccccFF;
                border-radius: .01rem
            }

    .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox {
        padding: 0 0 .41rem .2rem;
        background-color: white;
        border-radius: .03rem
    }

        .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide {
            width: 5.81rem !important
        }

            .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox {
                width: 100%;
                margin-top: .4rem;
                display: flex;
                align-items: center;
                justify-content: space-between
            }

                .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg {
                    display: flex
                }

                    .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .imgBox {
                        width: 1.2rem;
                        height: 1.2rem;
                        border-radius: .26rem
                    }

                        .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .imgBox img {
                            width: 100%;
                            height: 100%;
                            border-radius: .26rem
                        }

                    .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .textBox {
                        margin-left: .21rem
                    }

                        .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .textBox .name {
                            margin-top: .04rem;
                            font-size: .26rem;
                            color: #000000;
                            line-height: .24rem
                        }

                        .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .textBox .size {
                            margin-top: .11rem;
                            line-height: .4rem
                        }

                            .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .textBox .size span {
                                font-size: .2rem;
                                color: #999999;
                                line-height: .4rem
                            }

                                .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .textBox .size span:nth-child(2) {
                                    padding: 0 .06rem
                                }

                        .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .textImg .textBox .time {
                            font-size: .2rem;
                            color: #999999;
                            line-height: .4rem
                        }

                .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox .button {
                    width: 1.24rem;
                    height: .5rem;
                    font-size: .24rem;
                    color: #ffa500;
                    text-align: center;
                    line-height: .5rem;
                    background-color: #e5f7fdFF;
                    border-radius: .25rem
                }

                .specialDetailWrap .selectedRecom .selectedRecomContont .recommendSwiperBox .recommendSwiper .swiper-wrapper .swiper-slide .cardBox:first-child {
                    margin-top: .25rem
                }

.specialDetailWrap .hotTopics {
    padding: 0 .3rem
}

    .specialDetailWrap .hotTopics .hotTopicsConcont .titleBox {
        padding: 0 .2rem;
        display: flex;
        justify-content: space-between
    }

        .specialDetailWrap .hotTopics .hotTopicsConcont .titleBox .title {
            font-weight: bold;
            font-size: .3rem;
            color: #000000;
            line-height: .4rem;
            margin-top: .27rem
        }

        .specialDetailWrap .hotTopics .hotTopicsConcont .titleBox .more {
            margin-top: .28rem;
            color: #ccccccFF;
            font-size: .2rem;
            height: .2rem;
            line-height: .2rem;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center
        }

            .specialDetailWrap .hotTopics .hotTopicsConcont .titleBox .more::after {
                content: "";
                width: 100%;
                height: .02rem;
                position: absolute;
                bottom: -0.11rem;
                background-color: #ccccccFF;
                border-radius: .01rem
            }

    .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-template-columns: repeat(2, 3.36rem)
    }

        .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li {
            margin-top: .2rem;
            background-color: white;
            border-radius: .03rem
        }

            .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a {
                padding: .2rem .2rem .29rem .2rem
            }

                .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a .imgBox {
                    width: 2.93rem;
                    height: 1.83rem;
                    border-radius: .03rem
                }

                    .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a .name {
                    height: .24rem;
                    margin-top: .12rem;
                    font-size: .24rem;
                    color: #323232;
                    line-height: .28rem
                }

                .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a .time {
                    margin-top: .11rem;
                    line-height: .28rem;
                    display: flex;
                    align-items: center
                }

                    .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a .time p {
                        font-size: .18rem;
                        color: #bcbcbc;
                        line-height: .28rem
                    }

                        .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li a .time p:nth-child(2) {
                            width: .03rem;
                            height: .03rem;
                            margin: 0 .07rem;
                            background-color: #cccccc
                        }

            .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li:nth-child(1), .specialDetailWrap .hotTopics .hotTopicsConcont .hotTopicsList li:nth-child(2) {
                margin-top: .19rem
            }

.specialDetailWrap .lable {
    padding: 0 .3rem;
    padding-bottom: .4rem
}

    .specialDetailWrap .lable .lableContont .lableList {
        display: flex;
        align-items: center;
        flex-wrap: wrap
    }

        .specialDetailWrap .lable .lableContont .lableList li {
            padding: .12rem .2rem;
            margin-top: .22rem;
            margin-left: .22rem;
            border-radius: .22rem;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #ffffffFF
        }

            .specialDetailWrap .lable .lableContont .lableList li a {
                display: flex;
                align-items: center
            }

                .specialDetailWrap .lable .lableContont .lableList li a .icon {
                    width: .18rem;
                    height: .2rem;
                    background-position: -2.78rem -2.06rem
                }

                .specialDetailWrap .lable .lableContont .lableList li a i {
                    width: .18rem;
                    height: .2rem
                }

                .specialDetailWrap .lable .lableContont .lableList li a p {
                    padding-left: .1rem;
                    font-size: .24rem;
                    color: #838383;
                    line-height: .24rem
                }

            .specialDetailWrap .lable .lableContont .lableList li:nth-child(1) {
                margin-left: 0
            }

.guideDetailWrap .topTitleBox {
    padding: 0 .3rem;
    background-color: #f0fafeFF
}

    .guideDetailWrap .topTitleBox .topTitle {
        padding: .33rem 0 0 0
    }

        .guideDetailWrap .topTitleBox .topTitle h1 {
            font-weight: bold;
            font-size: .38rem;
            color: #000000;
            line-height: .48rem
        }

        .guideDetailWrap .topTitleBox .topTitle .time {
            line-height: .3rem;
            margin-top: .15rem;
            padding-bottom: .12rem
        }

            .guideDetailWrap .topTitleBox .topTitle .time span {
                font-size: .18rem;
                color: #999999;
                line-height: .3rem
            }

                .guideDetailWrap .topTitleBox .topTitle .time span:nth-child(2) {
                    margin-left: .22rem
                }

.guideDetailWrap .guideDetailTop {
    padding: 0 .3rem;
    overflow: hidden
}

    .guideDetailWrap .guideDetailTop .guideDetailTopContont {
        padding: 0 .2rem;
        background-color: white;
        overflow: hidden;
        border-radius: .03rem
    }

        .guideDetailWrap .guideDetailTop .guideDetailTopContont .txt {
            margin-top: .24rem;
            overflow: hidden
        }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .txt p {
                margin-bottom: .21rem;
                font-size: .24rem;
                color: #333333;
                line-height: .42rem
            }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .txt img {
                display: block;
                margin: .1rem 0 .2rem 0;
                width: 6.51rem;
                height: auto
            }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .txt h3 {
                font-weight: bold;
                font-size: .28rem;
                line-height: .48rem;
                color: #333333;
                margin-bottom: .08rem
            }

        .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail {
            margin-top: .33rem;
            padding: .2rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            background-color: #f9f9f9FF
        }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg {
                display: flex
            }

                .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .imgBox {
                    width: 1.1rem;
                    height: 1.1rem;
                    border-radius: .2rem
                }

                    .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .2rem
                    }

                .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .textBox {
                    margin-left: .19rem
                }

                    .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .textBox .name {
                        margin-top: .02rem;
                        font-size: .26rem;
                        color: #000000;
                        line-height: .4rem
                    }

                    .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .textBox .size {
                        font-size: .2rem;
                        color: #666666;
                        line-height: .2rem;
                        margin-top: .1rem
                    }

                        .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .textBox .size span {
                            font-size: .2rem;
                            color: #666666;
                            line-height: .2rem
                        }

                    .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .textImg .textBox .time {
                        margin-top: .12rem;
                        font-size: .2rem;
                        line-height: .2rem;
                        color: #666666
                    }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .thumbnail .button {
                width: 1.24rem;
                height: .5rem;
                font-size: .24rem;
                color: white;
                text-align: center;
                line-height: .5rem;
                border-radius: .25rem;
                background-color: #ffa500
            }

        .guideDetailWrap .guideDetailTop .guideDetailTopContont .copyBox {
            padding: .21rem 0 .31rem 0;
            display: flex;
            align-items: center
        }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .copyBox .copy {
                width: 1.78rem;
                height: .38rem;
                display: flex;
                align-items: center;
                justify-content: center;
                border: .01rem solid #ffd47fFF;
                border-radius: .06rem
            }

                .guideDetailWrap .guideDetailTop .guideDetailTopContont .copyBox .copy .icon {
                    width: .18rem;
                    height: .18rem;
                    background-position: -1.16rem -2.65rem
                }

                .guideDetailWrap .guideDetailTop .guideDetailTopContont .copyBox .copy .copyText {
                    padding-left: .07rem;
                    font-size: .22rem;
                    line-height: .22rem;
                    color: #FFA900
                }

            .guideDetailWrap .guideDetailTop .guideDetailTopContont .copyBox .waringText {
                padding-left: .13rem;
                height: .22rem;
                font-size: .22rem;
                color: #8F8F8F;
                line-height: .22rem
            }

.guideDetailWrap .recommend {
    padding: 0 .3rem;
    margin-top: .2rem;
    overflow: hidden
}

    .guideDetailWrap .recommend .recommendContont {
        padding: 0 .2rem;
        background-color: white;
        border-radius: .03rem;
        padding-bottom: .38rem
    }

        .guideDetailWrap .recommend .recommendContont .titleBox {
            display: flex;
            justify-content: space-between
        }

            .guideDetailWrap .recommend .recommendContont .titleBox .title {
                font-weight: bold;
                font-size: .3rem;
                color: #000000;
                line-height: .4rem;
                margin-top: .23rem
            }

            .guideDetailWrap .recommend .recommendContont .titleBox .more {
                margin-top: .24rem;
                color: #ccccccFF;
                font-size: .2rem;
                height: .2rem;
                line-height: .4rem;
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .guideDetailWrap .recommend .recommendContont .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #ccccccFF;
                    border-radius: .01rem
                }

        .guideDetailWrap .recommend .recommendContont .recommendList {
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(4, 1.28rem)
        }

            .guideDetailWrap .recommend .recommendContont .recommendList li {
                margin-top: .29rem
            }

                .guideDetailWrap .recommend .recommendContont .recommendList li a {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center
                }

                    .guideDetailWrap .recommend .recommendContont .recommendList li a .imgBox {
                        width: 1.28rem;
                        height: 1.28rem;
                        border-radius: .3rem
                    }

                        .guideDetailWrap .recommend .recommendContont .recommendList li a .imgBox img {
                            width: 100%;
                            height: 100%;
                            object-fit: cover;
                            border-radius: .3rem
                        }

                    .guideDetailWrap .recommend .recommendContont .recommendList li a .name {
                        width: 100%;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        text-align: center;
                        font-size: .24rem;
                        color: #333333;
                        line-height: .36rem;
                        margin-top: .09rem
                    }

                    .guideDetailWrap .recommend .recommendContont .recommendList li a .button {
                        width: 1.24rem;
                        height: .5rem;
                        margin-top: .1rem;
                        text-align: center;
                        color: #ffa500;
                        line-height: .5rem;
                        border-radius: .25rem;
                        background-color: #e5f7fdFF
                    }

                .guideDetailWrap .recommend .recommendContont .recommendList li:nth-child(1), .guideDetailWrap .recommend .recommendContont .recommendList li:nth-child(2), .guideDetailWrap .recommend .recommendContont .recommendList li:nth-child(3), .guideDetailWrap .recommend .recommendContont .recommendList li:nth-child(4) {
                    margin-top: .31rem
                }

.guideDetailWrap .strategy {
    padding: 0 .3rem;
    margin-top: .2rem;
    overflow: hidden
}

    .guideDetailWrap .strategy .strategyContont {
        padding: 0 .2rem;
        background-color: white;
        border-radius: .03rem;
        padding-bottom: .4rem
    }

        .guideDetailWrap .strategy .strategyContont .titleBox {
            display: flex;
            justify-content: space-between
        }

            .guideDetailWrap .strategy .strategyContont .titleBox .title {
                font-weight: bold;
                font-size: .3rem;
                color: #000000;
                line-height: .4rem;
                margin-top: .23rem
            }

            .guideDetailWrap .strategy .strategyContont .titleBox .more {
                margin-top: .24rem;
                color: #ccccccFF;
                font-size: .2rem;
                height: .2rem;
                line-height: .4rem;
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center
            }

                .guideDetailWrap .strategy .strategyContont .titleBox .more::after {
                    content: "";
                    width: 100%;
                    height: .02rem;
                    position: absolute;
                    bottom: -0.11rem;
                    background-color: #ccccccFF;
                    border-radius: .01rem
                }

        .guideDetailWrap .strategy .strategyContont .strategyList {
            display: grid;
            align-items: center;
            justify-content: space-between;
            grid-template-columns: repeat(2, 3.17rem)
        }

            .guideDetailWrap .strategy .strategyContont .strategyList li {
                margin-top: .28rem
            }

                .guideDetailWrap .strategy .strategyContont .strategyList li a .imgBox {
                    width: 3.17rem;
                    height: 1.78rem;
                    border-radius: .03rem
                }

                    .guideDetailWrap .strategy .strategyContont .strategyList li a .imgBox img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border-radius: .03rem
                    }

                .guideDetailWrap .strategy .strategyContont .strategyList li a .name {
                    margin-top: .06rem;
                    font-size: .24rem;
                    color: #333333;
                    line-height: .32rem
                }

                .guideDetailWrap .strategy .strategyContont .strategyList li a .size {
                    display: flex;
                    line-height: .18rem;
                    align-items: center;
                    margin-top: .17rem
                }

                    .guideDetailWrap .strategy .strategyContont .strategyList li a .size p {
                        height: .18rem;
                        font-size: .18rem;
                        color: #999999;
                        line-height: .18rem
                    }

                        .guideDetailWrap .strategy .strategyContont .strategyList li a .size p:nth-child(2) {
                            width: .04rem;
                            height: .04rem;
                            border-radius: 50%;
                            margin: 0 .06rem;
                            background-color: #999999
                        }

                .guideDetailWrap .strategy .strategyContont .strategyList li:nth-child(1), .guideDetailWrap .strategy .strategyContont .strategyList li:nth-child(2) {
                    margin-top: .2rem
                }

.guideDetailWrap .mb {
    margin-bottom: .4rem
}

.noPageBox {
    width: 100%;
    display: flex;
    flex-direction: column;
    background-color: #f4f5f7
}

    .noPageBox .noPageWrap .noPageContont {
        padding-top: 1.88rem;
        padding-bottom: 4.41rem;
        display: flex;
        flex-direction: column;
        align-items: center
    }

        .noPageBox .noPageWrap .noPageContont .imgBox {
            width: 5rem
        }

            .noPageBox .noPageWrap .noPageContont .imgBox img {
                width: 100%;
                height: auto;
                object-fit: cover
            }

        .noPageBox .noPageWrap .noPageContont a {
            margin-top: .2rem;
            width: 2.04rem;
            height: .64rem;
            color: white;
            font-size: .26rem;
            text-align: center;
            line-height: .64rem;
            background-color: #ffa500;
            border-radius: .12rem
        }

footer {
    background-color: #ffa500
}

    footer p {
        text-align: center;
        color: #ffffffFF;
        font-size: .22rem;
        line-height: .22rem;
        padding-top: .31rem
    }

        footer p:nth-child(2) {
            padding-top: .13rem;
            padding-bottom: .44rem
        }