* {
    margin: 0;
    padding: 0;
}

#app {
    width: 10rem;
    margin: 0 auto 1.6rem;
}

.container {
    margin: auto;
    height: auto;
    position: relative;
    background: linear-gradient(180deg, #ffffff 1%, #f8f8f8 10%);
}

    .container .box_img {
        width: 10rem;
        height: 2.8rem;
    }

        .container .box_img img {
            width: 10rem;
            height: 2.8rem;
        }

    .container .box_content {
        width: 10rem;
        height: auto;
        position: relative;
    }

        .container .box_content .bg_head {
            background-color: #FEFDFF;
            position: absolute;
            width: 10rem;
            height: 0.29333333rem;
            top: -0.29333333rem;
            left: 0;
            z-index: 1;
            border-radius: 0.42666667rem 0.42666667rem 0px 0px;
        }

        .container .box_content .box_list {
            margin: 0.21333333rem auto 0;
            width: 9.36rem;
            display: flex;
            flex-wrap: wrap;
            align-items: flex-start;
            justify-content: flex-start;
        }

            .container .box_content .box_list .item_hot {
                margin: 0 0.10666667rem 0.2rem 0;
                display: inline-block;
                padding: 0 0.17333333rem;
                height: 0.56rem;
                background: #f8f8f8;
                border-radius: 0.28rem;
                font-size: 0.26666667rem;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #666666;
                line-height: 0.56rem;
                display: flex;
                justify-content: center;
                align-items: center;
                align-content: center;
            }

                .container .box_content .box_list .item_hot img {
                    width: 0.5333333rem;
                    height: auto;
                    /* margin: 0 0.09333333rem 0 0; */
                }

                .container .box_content .box_list .item_hot p {
                    display: inline-block;
                }

            .container .box_content .box_list .active {
                background: #ffe9ed;
                color: #f12a53;
            }

        .container .box_content .box_nav {
            display: flex;
            justify-content: space-around;
            align-content: center;
            flex-wrap: wrap;
            width: 9.36rem;
            margin: 0.23333333rem auto 0;
        }

            .container .box_content .box_nav .box_item {
                display: flex;
                justify-content: center;
                align-content: space-around;
                flex-wrap: wrap;
                width: 1.33333333rem;
                height: 1.88rem;
                text-decoration: none;
            }

                .container .box_content .box_nav .box_item img {
                    width: 1.33333333rem;
                    height: 1.33333333rem;
                    border-radius: 50%;
                    background: linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
                }

                .container .box_content .box_nav .box_item p {
                    width: 100%;
                    height: 0.44rem;
                    font-size: 0.32rem;
                    font-family: PingFangSC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #303133;
                    line-height: 0.44rem;
                }

        .container .box_content .box_swiper {
            margin: 0.49333333rem auto 0;
            width: 9.36rem;
            height: 3.46666667rem;
            /* box-shadow: 0px 0.21333333rem 0.32rem 0px rgba(184, 180, 180, 0.24);*/
            border-radius: 0.13333333rem;
            overflow:hidden;
        }
        .ft-box_swiper {
            box-shadow:none!important;
        }
        .container .box_content .box_swiper .swiper_dot {
            width: 100%;
            height: 100%;
        }

                .container .box_content .box_swiper .swiper_dot .swiper-box {
                    width: 100%;
                    height: 100%;
                }

                    .container .box_content .box_swiper .swiper_dot .swiper-box .box-swiper-item {
                        width: 100%;
                        height: 100%;
                    }

                        .container .box_content .box_swiper .swiper_dot .swiper-box .box-swiper-item .swiper-item {
                            width: 100%;
                            height: 100%;
                        }

                            .container .box_content .box_swiper .swiper_dot .swiper-box .box-swiper-item .swiper-item img {
                                width: 100%;
                                height: 100%;
                            }

        .container .box_content .box_part {
            text-align: center;
        }

            .container .box_content .box_part .title {
                font-size: 0.42666667rem;
                font-family: PingFangSC-Semibold, PingFang SC;
                font-weight: 600;
                color: #c7904a;
                line-height: 1.33333333rem;
                margin: 0.2rem auto 0.2rem;
                text-align: center;
                position: relative;
                display: inline-block;
            }

                .container .box_content .box_part .title:before {
                    position: absolute;
                    content: '';
                    background-size: 100% 100%;
                    background-image: url(../static/img/title_img_right.png);
                    width: 1.85333333rem;
                    height: 0.21333333rem;
                    top: 0.55rem;
                    left: -2.13333333rem;
                }

                .container .box_content .box_part .title:after {
                    content: '';
                    background-image: url(../static/img/title_img_left.png);
                    background-size: 100% 100%;
                    position: absolute;
                    width: 1.85333333rem;
                    height: 0.21333333rem;
                    top: 0.55rem;
                    right: -2.13333333rem;
                }

            .container .box_content .box_part .list_word {
                margin: 0rem auto 0;
                width: 9.36rem;
                border-radius: 0.13333333rem;
                display: flex;
                align-content: space-around;
                justify-content: flex-start;
                flex-wrap: wrap;
            }

                .container .box_content .box_part .list_word .item_word {
                    display: flex;
                    align-items: center;
                    align-content: center;
                    justify-content: center;
                    flex-wrap: wrap;
                    width: 1.73333333rem;
                    margin: 0.25rem 0.06666667rem 0.25rem 0.06666667rem;
                    text-decoration: none;
                }

                    .container .box_content .box_part .list_word .item_word img {
                        width: 0.96rem;
                        height: 0.96rem;
                    }

                    .container .box_content .box_part .list_word .item_word p {
                        width: 100%;
                        height: 0.44rem;
                        font-size: 0.32rem;
                        font-family: PingFangSC-Regular, PingFang SC;
                        font-weight: 400;
                        color: #303133;
                        line-height: 0.44rem;
                    }



        .container .box_content .box_btn {
            width: 9.36rem;
            height: 0.85333333rem;
            background: #FFFFFF;
            border-radius: 0.13333333rem;
            display: flex;
            justify-content: center;
            flex-wrap: nowrap;
            align-items: center;
            align-content: center;
            margin: auto;
        }

            .container .box_content .box_btn p {
                font-size: 0.32rem;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #999999;
            }

            .container .box_content .box_btn img {
                width: auto;
                height: 0.26666667rem;
            }