/*PC端*/
@media (min-width: 768px) {
    .main {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .banner {
        width: 100%;
        position: relative;
        /* 确保图片遮罩效果正确显示 */
        overflow: hidden;
    }

    .banner img {
        width: 100%;
        height: 35rem;
        opacity: 0.85;
        transition: opacity 0.5s ease;
        
        /* 添加底部渐变透明效果 */
        -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
        mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    }


    .navbar-brand {
        display: block !important;
    }

    .navbar-brand2 {
        display: none !important;
    }

    .navbar-dark .navbar-nav .nav-link {
        color: #333 !important;
    }

    .area_titles .banner_item .banner_item_img {
        display: flex;
        align-items: center;
        justify-content: center;
        flex:40% 0 0;
    }

    .area_titles .banner_item .banner_item_info {
        width: 100%;
        flex:60% 0 0;
    }

    .area_titles .banner_item .banner_item_info .item_title {
        font-size: 1.4rem;
        font-weight: 600;
        display: flex;
        align-items: baseline;
        color: #333;
    }

    .area_titles .banner_item .banner_item_info .item_title img {
        width: 2rem;
        margin-right: 0.5rem;

    }

    .area_titles .banner_item .banner_item_info .item_desc {
        padding-left: 2rem;
        font-size: 0.9rem;
        color: #333;

        display: -webkit-box;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;

    }

    .area_titles .banner_item .banner_item_info .item_dot_right {
        text-align: right;
        margin-top: 2rem;
    }

    .area_titles .banner_item .banner_item_info .item_dot_right img {
        width: 2rem;
    }

    .carousel-inner {
        width: 80%;
    }

    .carousel-control-prev i {
        font-size: 2rem;
        color: #000;
    }

    .carousel-control-next i {
        font-size: 2rem;
        color: #000;
    }

    .carousel-control-prev {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        z-index: 10;
    }

    .carousel-control-next {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        z-index: 10;
    }

    /* 核心叠加效果样式 */
    .text-overlay {
        position: relative;
        display: inline-block;
        text-align: center;
        padding: 60px 40px;
    }

    /* 背景英文文字 */
    .text-overlay::before {
        content: "Industry News";
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 5rem;
        font-weight: 900;
        color: #cccccc;
        opacity: 0.2;
        white-space: nowrap;
        z-index: 1;
    }

    /* 前景中文文字 */
    .text-overlay span {
        position: relative;
        font-size: 2rem;
        font-weight: 700;
        color: #000000;
        z-index: 2;
    }

    .area_titles .banner_item {
        height: 12rem;
    }

}

/*移动端*/
@media (max-width: 767px) {
    .main {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .banner {
        width: 100%;
        position: relative;
        display: none !important;
    }

    .banner img {
        width: 100%;
        height: 12rem;
    }

    .navbar-brand {
        display: none !important;
    }

    .navbar-brand2 {
        display: block !important;
    }

    .navbar-brand2 img {
        width: 100px;
    }

    .area_titles .banner_item .banner_item_img {
        display: flex;
        align-items: center;
    }

    .area_titles .banner_item .banner_item_info {
        padding-left: 0.5rem;
        width: 100%;
    }

    .area_titles .banner_item .banner_item_info .item_title {
        font-size: 0.9rem;
        font-weight: 600;
        display: flex;
        align-items: baseline;
        color: #333;
    }

    .area_titles .banner_item .banner_item_info .item_title img {
        width: 1rem;
        margin-right: 0.5rem;

    }

    .area_titles .banner_item .banner_item_info .item_desc {
        padding-left: 1rem;
        font-size: 0.8rem;
        color: #333;

        display: -webkit-box;
        -webkit-line-clamp: 5;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;

    }

    .area_titles .banner_item .banner_item_info .item_dot_right {
        text-align: right;
        margin-top: 1rem;
    }

    .area_titles .banner_item .banner_item_info .item_dot_right img {
        width: 1rem;
    }

    .carousel-inner {
        width: 70%;


    }

    .carousel-control-prev i {
        font-size: 2rem;
        color: #000;
    }

    .carousel-control-next i {
        font-size: 2rem;
        color: #000;
    }

    .carousel-control-prev {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        z-index: 10;
    }

    .carousel-control-next {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        z-index: 10;
    }




}

.banner .company_info {
    position: absolute;
    left: 3rem;
    bottom: 10rem;
    width: 50%;
    color: #FFF;
}

.banner .company_info .name_en {
    font-size: 0.6rem;
}

.banner .company_info .name_cn {
    font-size: 2rem;
    font-weight: 600;
}

.banner .company_info .desc {
    font-size: 0.8rem;
    width: 45%;
}

.area_recommend {
    display: flex;
    flex-direction: column;
    margin-top: 2rem;
    justify-content: center;
}

.area_recommend .area_header {
    display: flex;
    justify-content: center;
    font-size: 2rem;
}

.area_recommend .area_tabs {
    display: flex;
    gap: 2rem;
    justify-content: center;
    margin-top: 2rem;
}

.area_recommend .area_tabs span {
    padding: 0.4rem 1rem 0.4rem 1rem;
    color: #333;
}

.area_recommend .area_tabs .tab_active span {
    background-color: #000;
    color: #FFF !important;
    border-radius: 0.8rem;

}

.area_titles .banner_item {
    display: flex;
}

.carousel-inner {
    margin: 0 auto;
    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    padding-top: 2rem;
    padding-bottom: 2rem;
    border-radius: 1rem;
    padding-left: 2rem;
    padding-right: 2rem;
    margin-top: 2rem;
}


.area_titles {
    /*display: grid;*/
    grid-template-columns: auto 1fr auto;
}

.carousel-control-prev {
    grid-column: 1 / 2;
}

.carousel slide {
    grid-column: 2 / 3;
}

.carousel-control-next {
    grid-column: 3 / 4;
}

.area_idea {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin-top: 2rem;
    padding: 1rem 0rem 1rem 0rem;

}

.area_idea .area_header {}

.area_idea .area_header .category_titles {
    display: flex;

}

.area_idea .area_header .category_titles .category_title {
    margin-right: 2rem;
    font-size: 1.2rem;
    font-weight: 500;
    margin-bottom: 1rem;
}

.area_idea .area_header .category_titles .current {
    border-bottom: 2px solid #333;
}

.area_idea .category_content {
    display: flex;
    margin-top: 1rem;
}

.area_idea .category_content .category_name {
    font-size: 1rem;
    font-weight: 600;

}

.area_idea .category_content .category_items {
    display: flex;
    font-size: 0.9rem;
    flex-wrap: wrap;
}

.area_idea .category_content .category_items .category_item {
    margin-right: 1.2rem;
    align-items: center;
    margin-bottom: 1rem;
}

.area_idea .idea_items {
    display: flex;
    flex-wrap: wrap;
}

.area_idea .idea_items .area_item {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}

.area_idea .idea_items .area_item .item img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;

}
#paginationCode {
    display: flex;
    justify-content: center;
}
.area_idea .idea_items .area_item .item .p_title {
    font-size: 0.9rem;
    color: #333;
    margin-top: 0.5rem;

    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.area_idea .idea_items .area_item .item .p_desc {
    font-size: 0.8rem;
    color: #666;
    margin-top: 0.5rem;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* 限制为两行 */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;

}

.area_idea .idea_items .area_item .item .p_date {
    font-size: 0.8rem;
    color: #666;
    width: 100%;
    text-align: right;
}

.area_idea .area_header .category_action {
    display: flex;
    justify-content: end;
}

.area_idea .area_header .category_action .btn_action {
    margin-left: 3rem;
    font-size: 1rem;
}

.area_idea .area_header .category_action .current {}

.area_idea .area_header .category_action .current span {
    color: #FFF;
    background-color: #000;
    border-radius: 1rem;
    padding: 0.4rem 0.6rem 0.4rem 0.6rem;
}

.area_titles .banner_item .banner_item_img img {
    width: 60%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 1rem;
}

.area_idea .area_titles {}