html {
    --bg-color-1: #fff;
    --bg-color-2: #17171a;
    --bg-color-3: #f9f9f9;
    --bg-color-4: #f6f6f6;
    --bg-color-5: #eee;
    --color-primary: #ffd21a;
    --color-error: #ea6527;
    --color-footer: #f6f6f6;
    --text-color-markedness: #ea6527;
    --text-color-1: #222;
    --text-color-2: #999;
    --text-color-3: #ccc;
    --text-color-4: #eee;
    --text-color-6: #666;
    --text-color-7: #fff;
    --text-color-8: #333;
    --text-color-9: #949494;
    --text-color-10: #17171a;
    --radius-8: 8px;
    --radius-12: 12px;
    --btn-border-common: 1px solid #ccc;
    --btn-border-eee: 1px solid #eee;
    --btn-border-222: 1px solid #222;
    --btn-border-ccc: 1px solid #ccc;
    --width-center: 1200px
}

#swiper1 {
    height: 270px
}

.my-active-slide {
    margin-right: 14px
}

.swiper-card-item-tag-warp {
    width: 183px
}

.swiper-item, .swiper-slide {
    height: 270px;
    width: 400px
}

.swiper-item, .swiper-slide img{
    width: 392px
}

.swiper-banner-last, .swiper-banner-next {
    height: 80px;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 30px
}

.swiper-banner-next {
    border-radius: 12px 0 0 12px
}
.banner-footer {
    width: 100%;
    height: 25px;
    background:rgba(0,0,0,0.5);
    border-radius: 0px 0px 8px 8px;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: 0;
    font-weight: 400;
    font-size: 13px;
    color: #FFFFFF;
    line-height: 25px;
}

.home-class-icon {
    background-image: url(../../43edddafc1cf0b314995.png);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: #222;
    font-size: 14px;
    font-weight: 700;
    height: 47px;
    margin-right: 10px;
    width: 65px
}

    .home-class-icon > span {
        display: block;
        line-height: 14px;
        margin-right: 6px;
        text-align: center
    }

.home-class-ls {
    margin-top: 15px
}

    .home-class-ls > li > a {
        color: #222;
        display: block;
        height: 100%;
        text-align: center;
        width:42px;
        height:19px;
        font-size:13px;
        line-height:19px;
    }

    .home-class-ls > .act > a {
        color: #222
    }

    .home-class-ls > li:hover > a {
        color: #222;
        background-image: url(',,/../../../assets/images/classify-li-act-bg.png');
        background-repeat:no-repeat;
        background-position:center;
        background-size:100% 100%;
    }

.home-class-more {
    color: #666;
    font-size: 13px
}

    .home-class-more > img {
        height: 15px;
        margin-right: 4px;
        margin-top: 2px;
        width: 15px
    }

.swiper-card-item {
    height: 320px;
    width: 183px
}

.jp-card-wrap {
    height: 377px;
    padding-top: 12px
}

    .jp-card-wrap .jp-next {
        height: 244px;
        top: 58px;
        width: 52px
    }

      
    .jp-card-wrap .swiper-card-item {
        margin-right: 20px;
    }
        .jp-card-wrap .swiper-card-item:last-child {
            margin-right: 0;
        }

        .swiper-card-item-img {
        height: 244px;
        margin-bottom: 8px;
        width: 183px
    }

.card-item-title {
    color: #222;
    font-size: 14px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 4px
}

.card-item-text-wrap {
    color: #999;
    font-size: 13px;
    margin-bottom: 4px;
    overflow: hidden;
    width: 183px
}

    .card-item-text-wrap a {
        width: 143px
    }

.card-item-state {
    margin-right: 2px
}

.fast-wrap {
    height: 300px
}

.hot-nav {
    height: 26px
}

.more {
    margin-top: 5px
}

    .more img {
        margin-top: 3px
    }

.hot-nav-ls {
    color: #999;
    font-size: 12px;
    height: 26px;
    line-height: 16px;
    margin-top: 1px
}

    .hot-nav-ls > .nav-item {
        background-image: url(../../1fd761afbab78d850ef5.png);
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: 100% 100%;
        height: 24px;
        line-height: 24px;
        margin-right: 12px;
        padding-left: 16px;
        width: 104px
    }

        .hot-nav-ls > .nav-item.act {
            background-image: url(../../7b8364b35317e58883b3.png);
            color: #222
        }

        .hot-nav-ls > .nav-item:hover {
            background-image: url(../../7b8364b35317e58883b3.png);
            color: #222
        }

.home-hot-wrap {
    background-color: #ccc;
    height: 368px;
    padding-top: 4px
}

.home-update-wrap {
    min-height: 708px
}

    .home-update-wrap .swiper-card-item {
        font-size: 12px;
        margin-bottom: 24px;
        width: 191px;
        padding:4px;
        transition:0.3s
    }

        .home-update-wrap .swiper-card-item:hover {
            background: #FFFFFF;
            box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.2);
            border-radius: 8px 8px 8px 8px;
        }

    .home-update-wrap .card-item-title {
        font-size: 14px;
        line-height: 18px;
        margin-bottom: 8px
    }

    .home-update-wrap .new-tip {
        margin-right: 8px
    }

.home-rise .swiper-card-item:not(:last-child) {
    margin-right: 20px
}

.home-rise .swiper-card-item {
    font-size: 12px
}

.home-rise .card-item-title {
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 8px
}

.home-rise .new-tip {
    margin-right: 8px
}

.home-hot-card-wrap {
    height: 368px
}

.home-hot {
    width: 1210px;
    height: 434px;
    padding-right: 10px
}

.home-hot-item-wrap {
    height: 100%;
    width: 392px;
    margin-right:12px;
}
    .home-hot-item-wrap:last-child {
        margin-right: 0px;
    }

    .home-hot-item {
        color: #999;
        font-size: 13px;
        height: 80px;
        margin-bottom: 12px;
        width: 100%;
        transition:0.3s
    }

        .home-hot-item:hover {
            background: #FFFFFF;
            box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.2);
            border-radius: 8px 8px 8px 8px;
        }

    .home-hot-item .home-hot-item-img {
        height: 80px;
        margin-right: 16px;
        width: 60px
    }

    .home-hot-item h3 {
        font-size: 14px;
        margin-bottom: 4px
    }

    .home-hot-item > .hot-one {
        margin-right: 12px;
        width: 25px
    }

    .home-hot-item > .hot-num {
        color: #ccc;
        font-family: D-DIN;
        font-size: 24px;
        font-weight: 700;
        height: 20px;
        line-height: 20px;
        margin-right: 12px;
        width: 25px
    }

.home-hot-item-text {
    width: 278px
}

.more-wrap {
    height: 26px
}

.home-class {
    height: 47px
}

.home-classify-wrap .home-classify-nav a {
    color: #999;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px
}

.home-classify-wrap .home-classify-nav-item {
    background-color: #f9f9f9;
    border: 1px solid #eee;
    height: 24px;
    width: 56px
}

    .home-classify-wrap .home-classify-nav-item + .home-classify-nav-item {
        margin-left: 12px
    }

    .home-classify-wrap .home-classify-nav-item:hover {
        background-color: #ffd21a;
        color: #222
    }

.home-classify-swiper-card {
    background: linear-gradient(219deg,#fff8da,#fff);
    border: 1px solid #eee;
    border-radius: 12px;
    height: 494px;
    width: 590px
}

    .home-classify-swiper-card .swiper-wrap {
        height: 236px;
        margin-left: 16px;
        overflow: hidden;
        padding-top: 15px;
        width: 616px
    }

        .home-classify-swiper-card .swiper-wrap .swiper {
            height: 221px
        }

    .home-classify-swiper-card .my-active-slide {
        height: 221px;
        width: 166px !important
    }

        .home-classify-swiper-card .my-active-slide .swiper-item, .home-classify-swiper-card .swiper-item-wrap {
            height: 221px;
            width: 166px
        }

    .home-classify-swiper-card .swiper-item {
        background-color: #eee;
        height: 186px;
        width: 140px
    }

.home-classify-text-wrap {
    font-size: 13px;
    padding: 0 16px
}

.home-classify-text-title {
    margin-bottom: 8px
}

.home-classify-btn {
    font-size: 18px;
    height: 48px;
    width: 152px
}

.classify-btn-text {
    line-height: 48px;
    margin-left: 40px
}

.classify-tag-wrap {
    height: 17px
}

.classify-info-wrap {
    height: 68px
}

.home-classify-wrap .swiper-card-item {
    height: auto;
    width: 132px
}

.home-classify-wrap .swiper-card-item-img {
    height: 176px;
    width: 132px
}
