/*相同标题*/
.home-common-title .see-more {
    display: flex;
    align-items: center;
    color: #999999;
}

.home-common-title h3 {
    font-size: 20px;
    font-weight: bold;
    color: #333333;
}

.see-more .icon-youjiantou {
    width: 15px;
    height: 15px;
    margin-left: 4px;
}

/*相同标题结束*/

.container-content {
    display: flex;
}

.home_left {
    width: 70%;
}

.slide {
    width: 100% !important;
    /*height: 434px !important;*/
    position: relative;
}

.slider-bot {
    width: 100%;
    height: 70px;
    display: flex;
    padding: 30px 20px 14px 20px;
    justify-content: space-between;
    align-items: center;
    color: #ffffff;
    font-size: 18px;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.7));
    position: absolute;
    left: 0;
    bottom: 0;
}

.slider-dot {
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-description {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #ffffff;
}

.slider-dot-item {
    width: 52px;
    height: 4px;
    background-color: #ffffff;
    opacity: 0.5;
    margin-left: 5px;
}

.slider-dot-actice {
    background-color: #D0191E;
    opacity: 1;
}

/*右侧*/
.home_right {
    width: calc(30% - 32px);
    margin-left: 32px;
}

/*专题*/
.special-top {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    color: #ffffff;
}

.top-normal {
    width: 20px;
    height: 20px;
    background-color: rgba(0, 0, 0, 0.5);
}

.top-one {
    background-color: #EC5757;
    width: 49px;
    height: 21px;
}

.top-two {
    background-color: #EC9557;
    width: 49px;
    height: 21px;
}

.top-three {
    background-color: #5797EC;
    width: 49px;
    height: 21px;
}

.special-item {
    width: 100%;
}

.special-item .special-img {
    width: 28.8%;
}

.special-item img {
    width: 100%;
    height: 70px;
    object-fit: cover; /* 关键属性：裁剪填充，保持比例 */
    object-position: center; /* 裁剪时居中显示 */
}

.special-item:first-child {
    /*margin-top: 12px;*/
}

.special-item:not(:first-child) {
    margin-top: 20px;
}

.special-item .special-right {
    flex: 1;
    margin-left: 12px;
}

.special-text {
    width: 100%;
    font-size: 14px;
}

.special-time {
    font-size: 12px;
}

/*数据资讯每一项*/
.data-item {
    width: 100%;
}

.data-item:first-child {
    /*margin-top: 12px;*/
}

.data-item:not(:first-child) {
    margin-top: 20px;
}

.data-item .data-item-img {
    width: 28.8%;
}

.data-item-img img {
    width: 100%;
    height: 70px;
    object-fit: cover; /* 关键属性：裁剪填充，保持比例 */
    object-position: center; /* 裁剪时居中显示 */
}

/*推荐资讯*/
.suggest-resources {
    display: grid;
    grid-template-columns: 26.5% calc(73.5% - 32px);
    gap: 24px 32px;
}

.suggest-small-item:first-child {
    margin-bottom: 24px;
}

.suggest-left {
    width: 26.5%;
}

.suggest-small-img {
    height: 158px;
    object-fit: cover; /* 长边裁剪 */
    object-position: center; /* 裁剪居中 */
}


.suggest-right {
    width: calc(73.5% - 32px);
}

.suggest-big-img {
    /*grid-column: 2; !* 关键修正：放在第2列（右侧区域） *!*/
    height: 418px;
    object-fit: cover; /* 长边裁剪 */
    object-position: center; /* 裁剪居中 */
}

/*.suggest-small-item{*/
/*    width: 26.5%;*/
/*    margin-right: 32px;*/
/*}*/
.suggest-big-item {
    grid-column: 2;
    grid-row: 1 / span 2;
}

.suggest-small-item, .suggest-big-item {
    /*display: contents;*/
}

/*最新资讯*/
.new-resources-item:first-child {
    margin-top: 24px;
}

.new-resources-item:not(:first-child) {
    margin-top: 32px;
}

.new-resources-img {
    /*width: 31.5%;*/
    width: 20vw;
    height: 188px;
}

.new-resources-right {
    width: calc(68.5% - 24px);
}

.home-swiper {
    height: 434px !important;
    object-fit: cover;
    object-position: center;
}

/*.sidebar-div{*/
/*    display: flex;*/
/*    justify-content: space-between;*/
/*    align-items: center;*/
/*}*/
@media screen and (max-width: 850px) {
    .home_left {
        width: 100%;
    }

    .container-content {
        display: flex;
        flex-wrap: wrap-reverse;
    }

    .home-swiper {
        width: 100%;
        height: 200px !important;
        object-fit: cover;
        object-position: center;
    }
    .bx-viewport {
         height: 200px !important;
    }

    .slider-bot {
        height: 50px;
        padding: 20px;
    }

    .home_right {
        width: 100%;
        margin-left: 0;
        display: none;
    }

    .new-resources-img {
        width: 100%;
        height: 135px;
    }

    .suggest-small-img {
        margin-top: 2%;
    }

    .live-item-big-img {
        height: 200px;
    }

    .sidebar {
        padding: 10px;
        display: flex;
        justify-content: center;

        .div {
            display: block;
        }
    }
    .box-left{
        display: flex;
        justify-content: space-between;
    }
    .bottom-width{
        width: 20px !important;
    }

    .suggest-big-img {
        margin-top: 2%;
        height: 158px;
    }

    .footer-logo {
        margin-top: 0;
    }

    .footer-right {
        display: none;
    }

    .home-common-title h3 {
        font-size: 14px;
    }

    .home-common {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;

        div {
            &:first-child {
                font-size: 12px;
            }

            &:last-child {
                font-size: 10px;
            }
        }
    }

    .new-resources-item:not(:first-child) {
        margin-top: 24px;
    }

    .suggest-resources {
        display: flex;
    }
    .suggest-small-item:nth-child(1) {
        .title {
            font-size: 14px;
        }

        .title1 {
            font-size: 12px;
        }

        .title2 {
            font-size: 10px;
        }
    }
    .slider-bot{
        font-size: 14px;
    }
    /*.suggest-big-item,*/
    /*.suggest-small-item {*/
    /*    width: 100% !important; !* 覆盖PC端宽度设置 *!*/
    /*    margin-bottom: 16px;*/
    /*}*/
    /* 第二、三个元素并排 */
    .suggest-big-item:nth-child(2) {
        width: 43% !important;
        display: inline-block;
        vertical-align: top;

        .title {
            font-size: 12px;
        }

        .title1 {
            font-size: 11px;
        }

        .title2 {
            font-size: 9px;
        }
    }

    .suggest-small-item:nth-child(3) {
        width: 43% !important;
        display: inline-block;
        vertical-align: top;

        .title {
            font-size: 12px;
        }

        .title1 {
            font-size: 11px;
        }

        .title2 {
            font-size: 9px;
        }
    }

    .suggest-small-item:nth-child(2) {
        margin-right: 18px;
    }

    .bottom-height {
        height: 30px !important;
    }

    p {
        font-size: 10px;
    }

    .footer a {
        font-size: 10px;
    }
}

@media screen and (max-width: 960px) {

}