@media screen and (max-width: 2800px) {
    body {
        margin: 0;
        font-family: 'Segoe UI', Arial, sans-serif;
        background: #fff;
    }

    .topbar {
        width: 96%;
        height: 90px;
        background: #f5f7fa;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 2%;
        font-size: 0.98rem;
        color: #333;
    }

    .topbar-left {
        display: flex;
        align-items: center;
    }

    .topbar-logo {
        width: 40%;
        height: auto;
        margin-right: 8px;
    }

    .topbar-right {
        display: flex;
        align-items: center;
        padding-right: 5%;
    }

    .topbar-link {
        color: #7f7f7f;
        text-decoration: none;
        margin: 0 4px;
    }

    .topbar-link:hover {
        color: #333;
    }

    .topbar-divider {
        margin: 0 6px;
        color: #bbb;
    }

    .topbar-service {
        color: #222;
        font-weight: 500;
    }

    .navbar {
        display: flex;
        align-items: center;
        background: #fff;
        height: 64px;
        padding: 0 10%;
    }
    .navbar .navbar_box{
        width: 80%;
        display: flex;
    }

    .navbar__menu {
        flex: 1;
        display: flex;
        justify-content: center;
    }

    .navbar__menu a {
        margin: 0 12px;
        color: #333;
        text-decoration: none;
        font-weight: 500;
    }

    .navbar__menu a:hover {
        color: #409EFF;
    }

    .navbar__right {
        display: flex;
        align-items: center;
    }

    .navbar__search {
        border: 3px solid #0c6edc;
        padding: 4px 12px;
        margin-right: 16px;
    }

    .navbar__search_btn {
        color: #ffffff;
        text-decoration: none;
        font-weight: 500;
        background: #0067da;
        padding: 4px 12px;
        border-radius: 4px;
    }

    .banner {
        position: relative;
        height: 440px;
        overflow: hidden;
    }

    .banner-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .news-section {
        padding: 32px 0;
        background-color: #f7fafd;
    }

    .news-carousel {
        width: 100%;
        height: 468px;
    }

    .news-carousel .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 8px;
    }

    .news-container {
        display: flex;
        gap: 40px;
        align-items: flex-start;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 40px;
    }

    .news-left {
        width: 700px;
        height: 468px;
        overflow: hidden;
        border-radius: 8px;
    }

    .news-main-img {
        width: 100%;
        height: 100%;
        border-radius: 8px;
        display: block;
    }

    .news-right {
        flex: 1;
    }

    .news-title-group {
        display: flex;
        gap: 20px;
        font-size: 1.2rem;
        font-weight: bold;
        margin-bottom: 16px;
    }

    .title-item {
        cursor: pointer;
        padding: 6px 12px;
        border-bottom: 2px solid transparent;
        transition: color 0.3s, border-color 0.3s;
    }

    .title-item.active {
        color: #409EFF;
        border-color: #409EFF;
    }

    .news-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }


    .news-list li {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 10px 0;
        border-bottom: 1px solid #eee;
        cursor: pointer;
    }

    .news-list li a {
        text-decoration: none;
    }

    .news-date {
        display: inline-block;
        width: 48px;
        text-align: center;
        background: #409EFF;
        color: #fff;
        border-radius: 8px;
        margin-right: 16px;
        padding: 4px 0;
        font-size: 0.8rem;
        line-height: 1.2;
    }

    .news-title {
        font-weight: 500;
        color: #222;
    }

    .expert-team-section {
        background: #fff;
        padding: 40px 0 24px 0;
        text-align: center;
    }

    .section-title {
        position: relative;
        display: inline-block;
        padding: 10px 30px; /* 根据图片大小调整 */
        background-image: url('../img17/assets/title-bg.png');
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        font-size: 24px;
        color: #000000;
        z-index: 1;
    }

    .experts {
        display: flex;
        justify-content: center;
        gap: 5px;
        margin-bottom: 16px;
    }

    .expert-card {
        background: #fff;
        padding: 18px 24px;
        width: 280px;
        box-shadow: 0 2px 8px #f0f1f2;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        overflow: hidden;
    }

    /* .gradient-card{background:linear-gradient(180deg,#1e90ff 0%,#409eff 100%);color:#fff;} */
    .expert-info {
        width: 269px;
        height: 351px; /* 根据需要调整高度 */
        background-size: cover; /* 背景图片覆盖整个区域 */
        background-position: center; /* 背景图片居中 */
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        color: white; /* 确保文字可见 */
        padding: 10px;
        transition: transform 0.3s;
    }

    .expert-info:hover {
        transform: scale(1.08);
        z-index: 2;
    }

    .expert-name {
        font-weight: 600;
        font-size: 2rem;
    }

    .expert-title {
        color: #e0e0e0;
        font-size: 0.95rem;
    }

    .more-btn {
        margin-top: 12px;
        color: #409EFF;
        cursor: pointer;
        font-weight: 500;
    }

    .honor-section {
        background: #fff;
        padding: 40px 0 24px 0;
        text-align: center;
    }

    .honor-carousel-box {
        display: flex;
        margin: 0 auto;
        align-items: flex-start;
        max-width: 1300px;
    }

    .honor-carousel {
        width: auto;
        height: 500px;
        gap: 20px;
    }

    .honor-slide {
        display: flex;
        align-items: center;
    }

    .honor-card {
        width: 1200px;
        height: 500px;
        display: flex;
        align-items: center;
        justify-content: space-around;
        padding: 20px;
        background-color: #fff;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
        overflow: hidden;
    }

    .honor-left {
        flex: 1;
        max-width: 664px;
    }

    .honor-left img {
        width: 100%;
        height: auto;
        object-fit: cover;
        border-radius: 8px;
        box-shadow: 0 2px 8px #f0f1f2;
    }

    .honor-right {
        flex: 1;
        padding-left: 24px;
    }

    .honor-title {
        font-weight: 600;
        font-size: 1.1rem;
        margin-bottom: 8px;
    }

    .honor-desc {
        color: #888;
        font-size: 0.95rem;
        margin-bottom: 12px;
    }

    .honor-detail-btn {
        display: inline-block;
        padding: 6px 18px;
        color: #656565;
        border-radius: 20px;
        text-decoration: none;
        transition: background 0.2s;
    }

    .honor-detail-btn:hover {
        color: #000000;
    }

    .quick-links-section {
        background: #fff;
        padding: 24px 0 12px 0;
        text-align: center;
    }

    .quick-link-list {
        display: flex;
        justify-content: center;
    }

    .quick-link-item {
        width: 210px;
        height: 165px;
        display: flex;
        flex-direction: column;
        align-items: center;
        cursor: pointer;
        transition: transform 0.3s;
        background-size: cover; /* 背景图片覆盖整个区域 */
        background-position: center; /* 背景图片居中 */
        color: white; /* 确保文字可见 */
        justify-content: center;
    }

    .quick-link-item:hover {
        transform: scale(1.08);
        z-index: 2;
    }

    .quick-link-icon {
        width: auto;
        height: auto;
        object-fit: cover;
        margin-bottom: 8px;
        box-shadow: 0 2px 8px #f0f1f2;
    }

    .quick-link-title {
        font-size: 1.5rem;
        font-weight: 500;
    }

    .exam-section {
        background: #fff;
        padding: 40px 0 24px 0;
        text-align: center;
    }

    /* 列表区域 */
    .exam-columns {
        display: flex;
        justify-content: space-between;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 40px;
        gap: 30px;
    }

    /* 每个栏目 */
    .exam-column {
        flex: 1;
        min-width: 300px;
        max-width: 341px;
        background: #f7f9fb;
    }

    /* 招考动态标题 */
    .exam-col-title {
        position: relative;
        padding-bottom: 24px; /* 预留背景图空间 */
        font-size: 1.1rem;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .exam-col-title-text {
        float: left;
    }

    .title-bg-img {
        display: block;
        width: auto;
        height: auto;
        margin-bottom: 15px;
    }

    /* 更多链接 */
    .more-link {
        float: right;
        color: #409EFF;
        text-decoration: none;
        font-size: 0.95rem;
        transition: color 0.2s;
    }

    .more-link:hover {
        color: #1e90ff;
    }

    /* 招考动态列表 */
    .exam-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .exam-list li {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 5px 0;
    }

    .exam-item {
        display: inline-block;
        color: inherit;
        text-decoration: none;
        text-align: left;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        flex: 1;
        padding-left: 24px; /* 留出圆点空间 */
        position: relative;
    }

    .exam-item::before {
        content: '';
        position: absolute;
        left: 8px;
        top: 50%;
        transform: translateY(-50%);
        width: 6px;
        height: 6px;
        background-color: #409EFF; /* 蓝色圆点 */
        border-radius: 50%;
    }

    .exam-item:hover {
        color: #409EFF; /* 可选：悬停变色 */
    }

    .exam-item:last-child {
        border-bottom: none;
    }

    .exam-item-title {
        color: #222;
    }

    /* 时间样式 */
    .exam-item-date {
        margin-left: 12px;
        color: #888;
        font-size: 0.9rem;
    }

    .footer {
        position: relative;
        background: #002140;
        color: #fff;
        padding: 32px 0 16px 0;
        font-size: 0.98rem;
    }

    .footer-bg {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        opacity: 0.15;
    }

    .footer-bg img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .footer-main {
        position: relative;
        z-index: 1;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 40px;
    }

    .footer-info {
        line-height: 2;
    }

    .footer-qr {
        text-align: center;
    }

    .footer-qr img {
        width: 100px;
        height: 100px;
        margin-bottom: 8px;
        background: #fff;
        border-radius: 8px;
    }

    @media (max-width: 1100px) {
        .experts, .quick-link-list, .exam-columns {
            flex-direction: column;
            align-items: center;
        }

        .honor-carousel {
            width: 100%;
        }

        .honor-slide {
            flex-direction: column;
            align-items: center;
        }
    }
    @media (max-width: 768px) {
        .navbar, .footer-main {
            flex-direction: column;
            align-items: center;
        }

        .banner {
            height: 180px;
        }

        .banner-img {
            height: 180px;
        }

        .news-section {
            flex-direction: column;
            gap: 20px;
        }

        .honor-carousel-box {
            flex-direction: column;
        }

        .honor-carousel {
            width: 100%;
        }

        .honor-left img {
            width: 100%;
            height: auto;
        }

        .exam-columns {
            flex-direction: column;
            gap: 20px;
        }

        .experts {
            flex-direction: column;
            gap: 20px;
        }

        .quick-link-list {
            flex-direction: column;
            gap: 20px;
        }
    }
    .hiddd {
        display: none;
    }
}

/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------移动端------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
/*--------------------------------------------------------------------*/
@media screen and (max-width: 960px){
    body {
        width: 100%;
        margin: 0;
        font-family: 'Segoe UI', Arial, sans-serif;
        background: #fff;
    }
        
    .topbar {
        width: 100%;
        height: 90px;
        background: #f5f7fa;
        align-items: center;
        justify-content: space-between;
        padding: 0;
        font-size: 0.98rem;
        color: #333;
        display: block;
    }

    .topbar-left {
        width: 100%;
        align-items: center;
    }

    .topbar-logo {
        width: 100%;
        height: auto;
        display: block;
    }

    .topbar-right {
        display: flex;
        align-items: center;
        padding-right: 5%;
        justify-content: flex-end;
    }

    .topbar-link {
        color: #7f7f7f;
        text-decoration: none;
        margin: 0 4px;
    }

    .topbar-link:hover {
        color: #333;
    }

    .topbar-divider {
        margin: 0 6px;
        color: #bbb;
    }

    .topbar-service {
        color: #222;
        font-weight: 500;
    }

    .navbar {
        display: block;
        background: #fff;
        height: 64px;
    }

    .navbar .navbar_box{
        width: 100%;
        display: block;
    }
    .navbar__menu {
        display: block;
        width: 100%;
        height: 30px;
        white-space: nowrap;
        overflow-x: scroll;
        overflow-y: hidden;
    }

    .navbar__menu a {
        display: inline-block;
        margin: 0 12px;
        color: #333;
        text-decoration: none;
        font-weight: 500;
    }

    .navbar__menu a:hover {
        color: #409EFF;
    }

    .navbar__right {
        display: flex;
        align-items: center;
    }

    .navbar__search {
        border: 3px solid #0c6edc;
        padding: 4px 12px;
        margin-right: 16px;
    }

    .navbar__search_btn {
        color: #ffffff;
        text-decoration: none;
        font-weight: 500;
        background: #0067da;
        padding: 4px 12px;
        border-radius: 4px;
    }

    .banner {
        position: relative;
        height: 440px;
        overflow: hidden;
    }

    .banner-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .news-section {
        padding: 32px 0;
        background-color: #f7fafd;
    }

    .news-carousel {
        width: 100%;
        height: 468px;
    }

    .news-carousel .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 8px;
    }

    .news-container {
        display: block;
        gap: 40px;
        align-items: flex-start;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 40px;
    }

    .news-left {
        width: 100%;
        height: auto;
        overflow: hidden;
        border-radius: 8px;
    }

    .news-main-img {
        width: 100%;
        height: 100%;
        border-radius: 8px;
        display: block;
    }

    .news-right {
        flex: 1;
    }

    .news-title-group {
        display: flex;
        gap: 20px;
        font-size: 1.2rem;
        font-weight: bold;
        margin-bottom: 16px;
    }

    .title-item {
        cursor: pointer;
        padding: 6px 12px;
        border-bottom: 2px solid transparent;
        transition: color 0.3s, border-color 0.3s;
    }

    .title-item.active {
        color: #409EFF;
        border-color: #409EFF;
    }

    .news-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }


    .news-list li {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 10px 0;
        border-bottom: 1px solid #eee;
        cursor: pointer;
    }

    .news-list li a {
        text-decoration: none;
    }

    .news-date {
        display: inline-block;
        width: 48px;
        text-align: center;
        background: #409EFF;
        color: #fff;
        border-radius: 8px;
        margin-right: 16px;
        padding: 4px 0;
        font-size: 0.8rem;
        line-height: 1.2;
    }

    .news-title {
        font-weight: 500;
        color: #222;
    }

    .expert-team-section {
        background: #fff;
        padding: 40px 0 24px 0;
        text-align: center;
    }

    .section-title {
        position: relative;
        display: inline-block;
        padding: 10px 30px; /* 根据图片大小调整 */
        background-image: url('../img17/assets/title-bg.png');
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        font-size: 24px;
        color: #000000;
        z-index: 1;
    }

    .experts {
        display: flex;
        justify-content: center;
        gap: 5px;
        margin-bottom: 16px;
    }

    .expert-card {
        background: #fff;
        padding: 18px 24px;
        width: 280px;
        box-shadow: 0 2px 8px #f0f1f2;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
        overflow: hidden;
    }

    /* .gradient-card{background:linear-gradient(180deg,#1e90ff 0%,#409eff 100%);color:#fff;} */
    .expert-info {
        width: 269px;
        height: 351px; /* 根据需要调整高度 */
        background-size: cover; /* 背景图片覆盖整个区域 */
        background-position: center; /* 背景图片居中 */
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        color: white; /* 确保文字可见 */
        padding: 10px;
        transition: transform 0.3s;
    }

    .expert-info:hover {
        transform: scale(1.08);
        z-index: 2;
    }

    .expert-name {
        font-weight: 600;
        font-size: 2rem;
    }

    .expert-title {
        color: #e0e0e0;
        font-size: 0.95rem;
    }

    .more-btn {
        margin-top: 12px;
        color: #409EFF;
        cursor: pointer;
        font-weight: 500;
    }

    .honor-section {
        background: #fff;
        padding: 40px 0 24px 0;
        text-align: center;
    }

    .honor-carousel-box {
        display: flex;
        margin: 0 auto;
        align-items: flex-start;
        width: 100%;
    }

    .honor-carousel {
        width: auto;
        height: 500px;
        gap: 20px;
    }

    .honor-slide {
        display: flex;
        align-items: center;
    }

    .honor-card {
        width: 92%;
        height: auto;
        display: block;
        align-items: center;
        justify-content: space-around;
        padding: 4%;
        background-color: #fff;
        border-radius: 12px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
        overflow: hidden;
    }

    .honor-left {
        flex: 1;
        max-width: 664px;
    }

    .honor-left img {
        width: 100%;
        height: auto;
        object-fit: cover;
        border-radius: 8px;
        box-shadow: 0 2px 8px #f0f1f2;
    }

    .honor-right {
        flex: 1;
        padding-left: 24px;
    }

    .honor-title {
        font-weight: 600;
        font-size: 1.1rem;
        margin-bottom: 8px;
    }

    .honor-desc {
        color: #888;
        font-size: 0.95rem;
        margin-bottom: 12px;
    }

    .honor-detail-btn {
        display: inline-block;
        padding: 6px 18px;
        color: #656565;
        border-radius: 20px;
        text-decoration: none;
        transition: background 0.2s;
    }

    .honor-detail-btn:hover {
        color: #000000;
    }

    .quick-links-section {
        background: #fff;
        padding: 24px 0 12px 0;
        text-align: center;
    }

    .quick-link-list {
        display: flex;
        justify-content: center;
    }

    .quick-link-item {
        width: 210px;
        height: 165px;
        display: flex;
        flex-direction: column;
        align-items: center;
        cursor: pointer;
        transition: transform 0.3s;
        background-size: cover; /* 背景图片覆盖整个区域 */
        background-position: center; /* 背景图片居中 */
        color: white; /* 确保文字可见 */
        justify-content: center;
    }

    .quick-link-item:hover {
        transform: scale(1.08);
        z-index: 2;
    }

    .quick-link-icon {
        width: auto;
        height: auto;
        object-fit: cover;
        margin-bottom: 8px;
        box-shadow: 0 2px 8px #f0f1f2;
    }

    .quick-link-title {
        font-size: 1.5rem;
        font-weight: 500;
    }

    .exam-section {
        background: #fff;
        padding: 40px 0 24px 0;
        text-align: center;
    }

    /* 列表区域 */
    .exam-columns {
        display: flex;
        justify-content: space-between;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 40px;
        gap: 30px;
    }

    /* 每个栏目 */
    .exam-column {
        flex: 1;
        min-width: 300px;
        max-width: 341px;
        background: #f7f9fb;
    }

    /* 招考动态标题 */
    .exam-col-title {
        position: relative;
        padding-bottom: 24px; /* 预留背景图空间 */
        font-size: 1.1rem;
        font-weight: bold;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .exam-col-title-text {
        float: left;
    }

    .title-bg-img {
        display: block;
        width: auto;
        height: auto;
        margin-bottom: 15px;
    }

    /* 更多链接 */
    .more-link {
        float: right;
        color: #409EFF;
        text-decoration: none;
        font-size: 0.95rem;
        transition: color 0.2s;
    }

    .more-link:hover {
        color: #1e90ff;
    }

    /* 招考动态列表 */
    .exam-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .exam-list li {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 5px 0;
    }

    .exam-item {
        display: inline-block;
        color: inherit;
        text-decoration: none;
        text-align: left;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        flex: 1;
        padding-left: 24px; /* 留出圆点空间 */
        position: relative;
    }

    .exam-item::before {
        content: '';
        position: absolute;
        left: 8px;
        top: 50%;
        transform: translateY(-50%);
        width: 6px;
        height: 6px;
        background-color: #409EFF; /* 蓝色圆点 */
        border-radius: 50%;
    }

    .exam-item:hover {
        color: #409EFF; /* 可选：悬停变色 */
    }

    .exam-item:last-child {
        border-bottom: none;
    }

    .exam-item-title {
        color: #222;
    }

    /* 时间样式 */
    .exam-item-date {
        margin-left: 12px;
        color: #888;
        font-size: 0.9rem;
    }

    .footer {
        position: relative;
        background: #002140;
        color: #fff;
        padding: 32px 0 16px 0;
        font-size: 0.98rem;
    }

    .footer-bg {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        opacity: 0.15;
    }

    .footer-bg img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .footer-main {
        position: relative;
        z-index: 1;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 40px;
    }

    .footer-info {
        line-height: 2;
    }

    .footer-qr {
        text-align: center;
    }

    .footer-qr img {
        width: 100px;
        height: 100px;
        margin-bottom: 8px;
        background: #fff;
        border-radius: 8px;
    }

    @media (max-width: 1100px) {
        .experts, .quick-link-list, .exam-columns {
            flex-direction: column;
            align-items: center;
        }

        .honor-carousel {
            width: 100%;
        }

        .honor-slide {
            flex-direction: column;
            align-items: center;
        }
    }
    @media (max-width: 768px) {
        .navbar, .footer-main {
            flex-direction: column;
            align-items: center;
        }

        .banner {
            height: 180px;
        }

        .banner-img {
            height: 180px;
        }

        .news-section {
            flex-direction: column;
            gap: 20px;
        }

        .honor-carousel-box {
            flex-direction: column;
        }

        .honor-carousel {
            width: 100%;
        }

        .honor-left img {
            width: 100%;
            height: auto;
        }

        .exam-columns {
            flex-direction: column;
            gap: 20px;
        }

        .experts {
            flex-direction: column;
            gap: 20px;
        }

        .quick-link-list {
            flex-direction: column;
            gap: 20px;
        }
    }
    .hiddd {
        display: none;
    }
}