@charset "utf-8";
/* ==========================================================================
   webui.css —— 前台界面优化样式
   适用：Albums / Articles / Comments / Downloads / Products / Recruit
   加载顺序：bootstrap.css → main.css → webui.css（本文件最后加载，优先级最高）
   ========================================================================== */

/* ============ 1. 基础排版 ============ */
.boxcontext,
.container,
.divcleft,
.divcright {
    font-size: 14px;
    line-height: 1.75;
}

.boxcontext p,
.container p,
.divContentDiv p,
.product_3 p,
.product_4 p,
.img_3 p,
.wrapper2 p {
    line-height: 1.9;
}

.first-line-indent {
    text-indent: 2em;
}

.dashed-line,
.bottom_border {
    height: 1px;
    margin: 18px 0;
    border: 0;
    background: transparent;
    border-top: 1px dashed #e3e8ef;
}

/* ============ 2. 布局容器自适应 ============ */
.content,
.boxcontent,
.boxcontext,
.container,
.containerbanner {
    width: 100%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.divbox {
    float: none;
    width: 100%;
    min-height: 0;
    background: #f4f6f9;
    padding: 18px 0 0;
}

.boxcontent {
    min-height: 0;
    background: transparent;
}

.boxcontext {
    float: none;
    min-height: 0;
    background: transparent;
    padding: 0 0 24px;
    margin-bottom: 0;
}

    .boxcontext:after,
    .container:after,
    .containerbanner:after {
        content: "";
        display: block;
        clear: both;
    }

.divcleft {
    float: left;
    width: 73%;
    min-height: 0;
    background: transparent;
}

.divcright {
    float: right;
    width: 25%;
    min-height: 0;
    margin: 0;
    padding: 5px 14px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .06);
}

/* Banner —— 全站通栏铺满 */
.divcebanner,
.containerbanner {
    float: none;
    width: 100%;
    max-width: none;
    height: auto !important;
    min-height: 0;
    margin: 0 0 18px;
    padding: 0;
    border-radius: 0;
    overflow: hidden;
    background: #dfeaf6;
}

    .divcebanner img,
    .containerbanner img {
        display: block;
        width: 100%;
        height: auto !important;
        max-height: 600px;
        border-radius: 0;
        object-fit: contain;
    }

    /* 通栏容器内的 bootstrap 栅格补白需要清掉，否则会出现横向滚动条 */
    .containerbanner > div,
    .containerbanner .box-margin-top-2 {
        margin: 0;
        padding: 0;
    }

    .containerbanner .row {
        margin-left: 0;
        margin-right: 0;
    }

        .containerbanner .row > [class*="col-"] {
            padding-left: 0;
            padding-right: 0;
        }

/* 内容区容器统一成白卡片 */
.product_3,
.product_1,
.product_3pr,
.product_4,
.img_3,
.wrapper2,
.divContentDiv,
.div_vv,
.product_3.product_1 {
    float: none;
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 20px;
    background: #fff;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

.divContentDiv {
    margin-bottom: 20px;
}

.div_vv {
    margin: 0 0 14px;
    padding: 0;
    background: transparent;
    box-shadow: none;
}

/* ============ 3. 面包屑 / 标题 ============ */
.title2,
.title8 {
    float: none;
    width: auto;
    height: auto;
    margin: 0 0 14px;
    padding: 0;
}

.mc-crumb {
    display: block;
    padding: 10px 14px;
    margin: 0 0 16px;
    font-size: 13px;
    color: #8a94a6;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 6px rgba(16, 42, 80, .06);
}

    .mc-crumb a {
        color: #8a94a6;
    }

        .mc-crumb a:hover {
            color: #e6212a;
        }

    .mc-crumb em {
        font-style: normal;
        margin: 0 8px;
        color: #c3cad6;
    }

    .mc-crumb span {
        color: #e6212a;
        font-weight: 600;
    }

/* 兼容旧写法 */
span.titlename {
    display: inline-block;
    padding: 2px 0;
    border-bottom: 2px solid #e6212a;
    color: #1b2733 !important;
    font-size: 15px;
    font-weight: 600;
}

span.more {
    float: right !important;
    line-height: 24px;
    color: #8a94a6;
    font-size: 13px;
}

    span.more a {
        color: #8a94a6;
    }

        span.more a:hover {
            color: #e6212a;
        }

.divtitlename {
    margin: 0 0 14px;
    padding-left: 12px;
    border-left: 4px solid #e6212a;
    font-size: 17px;
    font-weight: 700;
    color: #1b2733;
    line-height: 1.3;
}

    .divtitlename a {
        color: #1b2733;
    }

        .divtitlename a:hover {
            color: #e6212a;
        }

.mc-section-title {
    margin: 0 0 16px;
    font-size: 18px;
    font-weight: 700;
    color: #1b2733;
}

/* 新闻分类/列表页标题：与 .mc-article-list 卡片融为一体，形成蓝色标题栏 */
.divtitlen8 {
    margin: -16px -20px 16px -20px;
    padding: 14px 20px;
    background: #e6212a;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    border-radius: 10px 10px 0 0;
}

/* 产品分类页标题：.product_3pr 卡片内边距为 20px，负边距需对齐 */
.product_3pr .divtitlen8 
{
    margin-top:-10px;
}

/* 左侧边栏“分类”标题：与右侧卡片抬头保持同高、顶部对齐 */
.divcright .title18 {
    margin: -14px -14px 0 -14px;
    padding: 14px 20px;
    background: #e6212a;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    border: 0;
    border-radius: 10px 10px 0 0;
    height: auto;
    text-align: left;
}

    .divcright .title18 span.more {
        display: none;
    }

    .divcright .title18 span.titlename {
        float: none;
        display: block;
        width: auto;
        height: auto;
        padding: 0;
        font-size: 18px;
        font-weight: 700;
        line-height: 1.4;
        color: #fff;
        text-align: left;
        cursor: default;
    }

/* ============ 4. 通用卡片（相册 / 产品） ============ */
.mc-grid {
    margin-bottom: 20px;
}

/* 产品分类/搜索/列表页：重写 Bootstrap 浮动栅格为 Grid 布局，
   每行卡片等宽铺满，首行与末行卡片左右两端均与容器边缘对齐 */
.product_3pr .row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    /* 必须显式指定宽度：卡片为 width:100% 的百分比 + 图片绝对定位，
       两者都不产生固有宽度贡献，Grid 容器按固有宽度算会塌缩成 0px */
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 6px;
}

/* 清除 Bootstrap .row 的浮动清除伪元素，避免占用网格单元 */
.product_3pr .row::before,
.product_3pr .row::after {
    content: none;
    display: none;
}

.product_3pr .row > .mc-grid {
    float: none;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

/* 分类标题由后端输出在 .row 内部：令其横跨整行，还原为通栏蓝色标题条 */
.product_3pr .row > .divtitlen8 {
    grid-column: 1 / -1;
    margin: 0 0 16px;
    border-radius: 8px;
}

/* 空状态横跨整行 */
.product_3pr .row > .mc-empty {
    grid-column: 1 / -1;
}

@media (max-width: 991px) {
    .product_3pr .row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .product_3pr .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        margin-bottom: 0;
    }

    .mc-grid {
        margin-bottom: 12px;
    }
}

.mc-card {
    display: block;
    overflow: hidden;
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(16, 42, 80, .05);
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

    .mc-card:hover,
    .mc-card:focus {
        transform: translateY(-4px);
        border-color: #bcdcf7;
        box-shadow: 0 12px 26px rgba(16, 42, 80, .16);
        text-decoration: none;
    }

.mc-card__media {
    display: block;
    position: relative;
    width: 100%;
    padding-top: 75%;
    overflow: hidden;
    background: #f2f5f9;
}

.mc-card__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 0;
    transition: transform .45s ease;
}

.mc-card:hover .mc-card__img {
    transform: scale(1.06);
}

.mc-card__body {
    display: block;
    padding: 12px 14px 14px;
}

.mc-card__title {
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    color: #26303d;
    max-height: 42px;
    overflow: hidden;
}

.mc-card:hover .mc-card__title {
    color: #e6212a;
}

.mc-card__desc {
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.7;
    color: #8a94a6;
    max-height: 40px;
    overflow: hidden;
}

/* 产品分类：保留原有 ds_ul 结构，重绘样式 */
.ds_ul {
    padding-bottom: 10px;
}

    .ds_ul li {
        padding: 8px !important;
    }

.ds_ul li .ds_img {
    display: block;
    border-radius: 10px 10px 0 0;
    overflow: hidden;
    background: #f2f5f9;
}

.ds_ul li .ds_img .img_none {
    display: block;
    width: 100%;
    height: 170px;
    object-fit: cover;
    transition: transform .45s ease;
}

.ds_ul li a.mc-card:hover .img_none {
    transform: scale(1.06);
}

.ds_ul li .ds_img .ds_hover {
    display: block;
    height: 44px;
    line-height: 44px;
    font-size: 15px !important;
    font-weight: 600;
    color: #fff !important;
    background: rgba(0, 92, 168, .82) none repeat scroll 0 0 !important;
    transition: all .3s ease;
}

    .ds_ul li .ds_img .ds_hover .ds_hoverh3 {
        float: none;
        display: block;
        width: 100%;
        padding: 0 12px;
        color: #fff !important;
        text-align: center;
        line-height: 44px;
        font-size: 15px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.ds_ul li .ds_img .ds_hoverimg {
    display: none;
    padding: 8px 14px;
    font-size: 12px;
    line-height: 1.7;
    color: #fff;
}

.ds_ul li .ds_img:hover .ds_hover {
    height: 100%;
    padding-top: 0;
    font-size: 15px !important;
    background: rgba(0, 62, 118, .88) none repeat scroll 0 0 !important;
}

    .ds_ul li .ds_img:hover .ds_hover .ds_hoverh3 {
        float: none;
        width: 100%;
        color: #fff !important;
    }

.ds_ul li .ds_img:hover .ds_hoverimg {
    display: block;
}

/* ============ 5. 文章列表 ============ */
/* 统一文章列表为白色卡片，清除旧 float 布局带来的错位；标题/日期在一行内顺序固定 */
.mc-article-list {
    padding: 16px 20px;
    min-height: 0;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

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

.mc-list__item {
    position: relative;
    display: flex;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px dashed #e3e8ef;
    transition: background .2s ease;
}

    .mc-list__item:last-child {
        border-bottom: 0;
    }

    .mc-list__item:hover {
        background: #f7fafd;
    }

    /* 固定顺序：圆点(1) -> 标题(2) -> 日期(3)，避免 flex/order 在不同浏览器下错乱 */
    .mc-list__item:before {
        content: "";
        flex: 0 0 auto;
        order: 1;
        width: 6px;
        height: 6px;
        margin: 0 10px 0 4px;
        border-radius: 50%;
        background: #e6212a;
        transition: background .2s ease;
    }

    .mc-list__item:hover:before {
        background: #ff8a00;
    }

.mc-list__link {
    flex: 1 1 auto;
    order: 2;
    min-width: 0;
    display: block;
    font-size: 14px;
    line-height: 1.6;
    color: #26303d;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: normal;
    text-decoration: none;
}

    .mc-list__link:hover {
        color: #e6212a;
        text-decoration: none;
    }

.mc-list__date {
    flex: 0 0 auto;
    order: 3;
    margin-left: 16px;
    font-size: 12px;
    line-height: 1.6;
    color: #a2abb9;
    white-space: nowrap;
}

/* 兜底：标题为空的行直接不显示（服务端过滤未生效或只有空白时的兜底） */
.mc-list__item:has(.mc-list__link:empty) {
    display: none;
}

/* 旧结构兼容：仍可能有其它页面用 product_3/product_1 包 ul */
.product_3 ul li,
.product_1 ul li {
    position: relative;
    padding: 12px 110px 12px 18px;
    border-bottom: 1px dashed #e3e8ef;
}

    .product_3 ul li span.date,
    .product_1 ul li span.date {
        position: absolute;
        right: 6px;
        top: 12px;
        float: none;
        font-size: 12px;
        color: #a2abb9;
    }

/* ============ 6. 下载列表 ============ */
.mc-row {
    display: block;
    padding: 14px 16px;
    margin-bottom: 12px;
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 10px;
    transition: box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}

    .mc-row:last-child {
        margin-bottom: 0;
    }

    .mc-row:hover {
        border-color: #bcdcf7;
        box-shadow: 0 10px 22px rgba(16, 42, 80, .12);
        transform: translateY(-2px);
    }

.mc-row__title {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #26303d;
    margin-bottom: 6px;
}

    .mc-row__title:hover {
        color: #e6212a;
        text-decoration: none;
    }

.mc-row__meta {
    font-size: 12px;
    color: #9aa4b2;
}

    .mc-row__meta span {
        display: inline-block;
        margin-right: 16px;
    }

.mc-row__action {
    margin-top: 10px;
    text-align: right;
}

/* ============ 7. 按钮 ============ */
.mc-btn {
    display: inline-block;
    padding: 6px 16px;
    font-size: 13px;
    line-height: 1.6;
    border-radius: 20px;
    border: 1px solid transparent;
    text-align: center;
    white-space: nowrap;
    
    transition: all .22s ease;
}
.mc-btndl { margin-left:70px;  }
    .mc-btn:hover,
    .mc-btn:focus {
        text-decoration: none;
    }

.mc-btn--primary {
    background: #e6212a;
    border-color: #e6212a;
    color: #fff !important;
}

    .mc-btn--primary:hover {
        background: #00558f;
        border-color: #00558f;
        color: #fff !important;
        box-shadow: 0 6px 14px rgba(0, 108, 183, .3);
    }

.mc-btn--ghost {
    background: #fff;
    border-color: #cddbea;
    color: #e6212a !important;
}

    .mc-btn--ghost:hover {
        border-color: #e6212a;
        background: #f2f8fd;
        color: #e6212a !important;
    }

.mc-btn--sm {
    padding: 4px 12px;
    font-size: 12px;
}

.btn-primary {
    background-color: #e6212a;
    border-color: #e6212a;
    border-radius: 20px;
}

    .btn-primary:hover,
    .btn-primary:focus {
        background-color: #00558f;
        border-color: #00558f;
    }

.btn-default {
    border-radius: 20px;
}

/* ============ 8. 表格（招聘） ============ */
.mc-table {
    width: 100%;
    margin-bottom: 10px !important;
    border: 1px solid #eef1f6;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

    .mc-table > thead > tr > th {
        padding: 12px 14px;
        font-size: 14px;
        font-weight: 600;
        color: #fff;
        background: #e6212a;
        border-bottom: 0;
        white-space: nowrap;
    }

    .mc-table > tbody > tr > td {
        padding: 12px 14px;
        font-size: 13px;
        color: #4a5563;
        border-top: 1px solid #eef1f6;
        vertical-align: middle;
    }

    .mc-table > tbody > tr:nth-of-type(even) {
        background: #fafbfd;
    }

    .mc-table > tbody > tr:hover {
        background: #f2f8fd;
    }

    .mc-table > tbody > tr > td:first-child {
        font-weight: 600;
        color: #26303d;
    }

/* ============ 9. 留言 ============ */
.mc-msg {
    padding: 16px 18px;
    margin-bottom: 14px;
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 10px;
    transition: box-shadow .25s ease, border-color .25s ease;
}

    .mc-msg:hover {
        border-color: #bcdcf7;
        box-shadow: 0 8px 20px rgba(16, 42, 80, .1);
    }

.mc-msg__head {
    position: relative;
    padding-right: 90px;
    margin-bottom: 8px;
}

.mc-msg__title {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
}

    .mc-msg__title a {
        color: #26303d;
    }

        .mc-msg__title a:hover {
            color: #e6212a;
            text-decoration: none;
        }

.mc-msg__more {
    position: absolute;
    right: 0;
    top: 0;
    font-size: 12px;
    color: #e6212a;
}

    .mc-msg__more:hover {
        color: #ff8a00;
        text-decoration: none;
    }

.mc-msg__meta {
    font-size: 12px;
    color: #9aa4b2;
    margin-bottom: 8px;
}

    .mc-msg__meta span {
        display: inline-block;
        margin-right: 16px;
    }

.mc-msg__body {
    font-size: 14px;
    color: #4a5563;
    line-height: 1.85;
    word-break: break-all;
}

.mc-msg__reply {
    position: relative;
    margin-top: 12px;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.8;
    color: #52616f;
    background: #f6f9fc;
    border-left: 3px solid #e6212a;
    border-radius: 0 8px 8px 0;
}

.mc-msg__reply-tag {
    display: inline-block;
    margin-right: 8px;
    padding: 1px 8px;
    font-size: 12px;
    color: #fff;
    background: #e6212a;
    border-radius: 10px;
}

/* ============ 10. 详情页 ============ */
.mc-detail__title {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
    color: #1b2733;
    text-align: center;
}

.mc-detail__meta {
    margin: 0 0 6px;
    font-size: 12px;
    color: #9aa4b2;
    text-align: center;
}

    .mc-detail__meta span {
        display: inline-block;
        margin: 0 10px;
    }

.mc-detail__body {
    padding: 14px 0 4px;
    font-size: 14px;
    line-height: 1.95;
    color: #3d4855;
    word-break: break-all;
}

    .mc-detail__body img {
        max-width: 100%;
        height: auto;
    }

.mc-detail__figure {
    margin: 0 auto 16px;
    text-align: center;
}

    .mc-detail__figure img {
        max-width: 100%;
        height: auto;
        border-radius: 10px;
        box-shadow: 0 6px 18px rgba(16, 42, 80, .12);
    }

.mc-detail__share {
    padding: 10px 0;
    text-align: center;
}

.mc-detail__nav {
    display: block;
    padding-top: 6px;
}

.mc-detail__nav-item {
    display: block;
    padding: 8px 0;
    font-size: 13px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

    .mc-detail__nav-item label {
        display: inline-block;
        margin: 0 8px 0 0;
        padding: 2px 10px;
        font-size: 12px;
        font-weight: 400;
        color: #e6212a;
        background: #eef6fd;
        border-radius: 12px;
    }

    .mc-detail__nav-item span a {
        color: #4a5563;
    }

    .mc-detail__nav-item:hover span a {
        color: #e6212a;
    }

#b-right {
    text-align: right;
}

.product_3 h4,
.img_3 h4 {
    margin: 0 0 10px;
    font-size: 21px;
    font-weight: 700;
    color: #1b2733;
}

/* ============ 11. 属性信息表 ============ */
.mc-info {
    margin: 0 0 16px;
    padding: 0;
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 10px;
    overflow: hidden;
}

    .mc-info li {
        display: block;
        padding: 10px 14px;
        font-size: 13px;
        border-bottom: 1px solid #f1f4f8;
    }

        .mc-info li:last-child {
            border-bottom: 0;
        }

.mc-info__k {
    display: inline-block;
    min-width: 82px;
    margin-right: 8px;
    color: #8a94a6;
}

.mc-info__v {
    color: #26303d;
}

.mc-info li.mc-info--action {
    padding: 12px 14px;
    background: #fafbfd;
}

/* ============ 12. 空状态 ============ */
.mc-empty {
    padding: 60px 20px;
    text-align: center;
    color: #a2abb9;
    font-size: 14px;
}

    .mc-empty:before {
        content: "";
        display: block;
        width: 64px;
        height: 64px;
        margin: 0 auto 16px;
        border: 3px dashed #d9e0ea;
        border-radius: 50%;
    }

/* ============ 13. 表单（留言 / 在线应聘） ============ */
.form-horizontal .control-label {
    font-weight: 600;
    color: #4a5563;
    padding-top: 7px;
}

.form-horizontal .form-group {
    margin-bottom: 14px;
}

.form-control {
    border: 1px solid #dce3ec;
    border-radius: 6px;
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

    .form-control:focus {
        border-color: #e6212a;
        box-shadow: 0 0 0 3px rgba(0, 108, 183, .12);
    }

    .form-control[readonly] {
        background: #f7f9fb;
    }

textarea.form-control {
    resize: vertical;
    min-height: 84px;
}

.text-brown {
    color: #e5484d !important;
    font-weight: 700;
}

.comment_info {
    margin-bottom: 18px;
    padding: 12px 16px;
    color: #0f7b4f;
    background: #eafaf1;
    border: 1px solid #b7e6cd;
    border-radius: 8px;
}

.wrapper2 h4 {
    margin: 0 0 18px;
    font-size: 19px;
    font-weight: 700;
    color: #1b2733;
}

.CodeImage,
img[id*="CodeImage"] {
    height: 32px;
    border: 1px solid #dce3ec;
    border-radius: 6px;
    vertical-align: middle;
    cursor: pointer;
}

/* ============ 14. 侧栏 ============ */
.divcright .title,
.divcright .divrtop {
    margin-bottom: 10px;
}

.divcright ul li {
    padding: 7px 0;
    border-bottom: 1px dashed #eef1f6;
}

/* ============ 15. 分页（适配 AspNetPager 输出结构） ============
   结构：<a disabled><span.btnLink>首页</span></a>、
         <span.CurrentPage><span.Pager>1</span></span>、
         <a href><span.Pager>2</span></a>、<a href><span.btnLink>下一页</span></a>
   外层 a/span 只是容器，一律不画框；按钮样式统一由内层 span 呈现，
   避免出现双层边框/叠加色块 */
.pager {
    padding: 18px 0 8px;
    height: auto;
    text-align: center;
}

    .pager > .Pager {
        float: none !important;
        width: auto !important;
    }

    .pager .CustomInfo {
        float: none !important;
        width: auto !important;
        margin: 0 0 10px;
        font-size: 12px;
        color: #93a0b1;
    }

    .pager > .Pager > .Pager {
        float: none !important;
        width: auto !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 8px;
    }

        /* 外层链接容器退化为透明包装，避免与内层按钮双重画框 */
        .pager > .Pager > .Pager > a {
            margin: 0 !important;
            min-width: 0;
            height: auto;
            line-height: normal;
            padding: 0;
            border: 0;
            background: none;
            box-shadow: none;
        }

            .pager > .Pager > .Pager > a:hover {
                color: inherit;
                background: none;
                text-decoration: none;
            }

    /* 内层按钮：统一规格（选择器带 .Pager 提升优先级，
       覆盖页面后置加载的 main.css 旧分页规则） */
    .pager .Pager span.btnLink,
    .pager .Pager span.Pager {
        box-sizing: border-box;
        display: inline-block;
        min-width: 36px;
        height: 34px;
        line-height: 32px;
        padding: 0 14px;
        font-size: 13px;
        font-weight: 500;
        text-align: center;
        color: #41506a;
        background: #fff;
        border: 1px solid #dde5ef;
        border-radius: 6px;
        transition: all .2s ease;
    }

    .pager a:hover span.btnLink,
    .pager a:hover span.Pager {
        color: #fff !important;
        background: #e6212a !important;
        border-color: #e6212a !important;
        text-decoration: none;
    }

    /* 当前页容器退化为透明包装，内层页码呈蓝色实心 */
    .pager span.CurrentPage {
        min-width: 0;
        height: auto;
        line-height: normal;
        padding: 0;
        margin: 0;
        border: 0;
        background: none;
    }

        .pager span.CurrentPage span.Pager {
            color: #fff !important;
            background: #e6212a !important;
            border-color: #e6212a !important;
            font-weight: 600;
            cursor: default;
        }

    /* 已到边界时禁用首页/上一页/下一页/尾页 */
    .pager a[disabled] {
        pointer-events: none;
    }

        .pager a[disabled] span.btnLink {
            color: #b9c4d0;
            background: #f5f8fb;
            border-color: #edf1f6;
        }

/* ============ 16. 响应式 ============ */
@media (max-width: 991px) {
    .divcleft,
    .divcright {
        float: none;
        width: 100%;
    }

    .divcright {
        margin-top: 18px;
    }

    .mc-detail__title {
        font-size: 20px;
    }
}

@media (max-width: 767px) {
    .boxcontext {
        display: flex;
        flex-direction: column;
    }

    .divcleft {
        order: 1;
    }

    .divcright {
        order: 2;
    }

    .product_3,
    .product_3pr,
    .product_4,
    .img_3,
    .wrapper2,
    .divContentDiv {
        padding: 14px;
    }

    .mc-detail__title {
        font-size: 18px;
    }

    .mc-article-list {
        padding: 12px 14px;
    }

    .divtitlen8 {
        padding: 12px 14px;
        font-size: 16px;
    }

    .product_3pr .divtitlen8 {
        margin: -14px -14px 12px -14px;
        padding: 12px 14px;
    }

    .mc-list__item {
        padding: 10px 0;
    }

    .mc-list__link {
        font-size: 13px;
    }

    .mc-list__date {
        margin-left: 12px;
        font-size: 11px;
    }

    .mc-info__k {
        min-width: 70px;
    }

    .mc-row__action {
        text-align: left;
    }

    .mc-msg__head {
        padding-right: 0;
    }

    .mc-msg__more {
        position: static;
        display: inline-block;
        margin-top: 6px;
    }

    #b-right {
        text-align: left;
    }

    .form-horizontal .control-label {
        text-align: left;
        padding-top: 0;
        margin-bottom: 6px;
    }
}

/* ============ 17. 首页 ============ */
.hp {
    padding: 18px 0 24px;
    background: #f4f6f9;
}

.hp-wrap {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* 全宽 Banner */
.hp-hero {
    position: relative;
    width: 100%;
    margin: 0;
    background: #dfeaf6;
    overflow: hidden;
}

.hp-hero__slider {
    position: relative;
    float: none;
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    border-radius: 0;
    overflow: hidden;
    background: transparent;
}

/* 轮播脚本未执行时，至少显示第一张，避免整块空白 */
.hp-hero .slick:not(.slick-initialized) > div {
    display: none;
}

    .hp-hero .slick:not(.slick-initialized) > div:first-child {
        display: block;
    }

/* 兜底轮播（slick 不可用时使用） */
.hp-slider--fallback {
    position: relative;
    display: block;
}

    .hp-slider--fallback > div {
        transition: opacity .7s ease;
    }

.hp-slider__dots {
    position: absolute;
    bottom: 24px;
    left: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
    z-index: 10;
}

    .hp-slider__dots li {
        display: inline-block;
        margin: 0 4px;
    }

        .hp-slider__dots button {
            width: 10px;
            height: 10px;
            padding: 0;
            overflow: hidden;
            font-size: 0;
            line-height: 0;
            border: 0;
            border-radius: 50%;
            background: rgba(255, 255, 255, .75);
            cursor: pointer;
        }

        .hp-slider__dots button.is-active {
            background: #e6212a;
        }

    /* css/banner.css 里 .slick 被写死 320px，这里改为自适应 */
    .hp-hero .slick {
        height: auto;
        margin-bottom: 0;
        overflow: hidden;
    }

    .hp-hero__slider img {
        display: block;
        width: 100%;
        height: 340px;
        max-height: none;
        object-fit: cover;
    }

    .hp-hero .slick-slide {
        outline: 0;
    }

    .hp-hero .slick-dots {
        position: absolute;
        bottom: 24px;
        left: 0;
        width: 100%;
        margin: 0;
        padding: 0;
        list-style: none;
        text-align: center;
        z-index: 10;
    }

        .hp-hero .slick-dots li {
            display: inline-block;
            margin: 0 4px;
        }

            .hp-hero .slick-dots li button {
                width: 10px;
                height: 10px;
                padding: 0;
                font-size: 0;
                line-height: 0;
                border: 0;
                border-radius: 50%;
                background: rgba(255, 255, 255, .7);
                cursor: pointer;
            }

        .hp-hero .slick-dots li button:before {
            display: none;
        }

        .hp-hero .slick-dots li.slick-active button {
            background: #e6212a;
        }

/* 公告栏 */
.hp-notice {
    display: flex;
    align-items: center;
    padding: 10px 14px;
    margin-bottom: 16px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

.hp-notice__tag {
    flex: 0 0 auto;
    padding: 4px 12px;
    margin-right: 12px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: #e6212a;
    border-radius: 20px;
}

.hp-notice__scroll {
    flex: 1 1 auto;
    min-width: 0;
    height: 30px;
}

#tgBigox {
    width: auto;
    height: 30px;
    margin: 0;
    padding-right: 0;
}

#tgGoox {
    height: 30px;
    white-space: nowrap;
}

#tgGoox .hp-notice__link {
    float: none;
    display: inline-block;
}

.hp-notice__link {
    display: inline-block;
    margin-right: 28px;
    font-size: 13px;
    line-height: 30px;
    color: #d9413f;
}

    .hp-notice__link:hover {
        color: #e6212a;
        text-decoration: none;
    }

.hp-notice__search {
    flex: 0 0 auto;
    margin-left: 16px;
    padding-left: 16px;
    border-left: 1px solid #eef1f6;
}

    /* 公告栏里的搜索框 */
    .hp-notice__search .navbar-form {
        display: flex;
        align-items: center;
        margin: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
    }

    .hp-notice__search .form-group {
        margin: 0;
    }

    .hp-notice__search .form_control_input_sm {
        float: none;
        width: 170px;
        height: 32px;
        padding: 0 10px;
        font-size: 13px;
        color: #26303d;
        background: #fff;
        border: 1px solid #dce3ec;
        border-radius: 6px 0 0 6px;
    }

        .hp-notice__search .form_control_input_sm:focus {
            border-color: #e6212a;
            outline: 0;
        }

    .hp-notice__search .btn_btn_sm {
        float: none;
        height: 32px;
        margin: 0;
        padding: 0 16px;
        font-size: 13px;
        color: #fff;
        background: #e6212a;
        border: 0;
        border-radius: 0 6px 6px 0;
        cursor: pointer;
    }

        .hp-notice__search .btn_btn_sm:hover {
            background: #00558f;
        }

    /* 隐藏重复的移动端搜索框 */
    .hp-notice__search .navbar-form.visible-xs {
        display: none !important;
    }

/* 主体两栏 */
.hp-cols {
    display: flex;
    align-items: flex-start;
}

.hp-main {
    flex: 1 1 auto;
    min-width: 0;
}

.hp-news {
    display: flex;
    align-items: stretch;
    margin: 0 0 16px;
}

.hp-news__col {
    flex: 1 1 50%;
    max-width: 50%;
    min-width: 0;
}

    .hp-news__col:first-child {
        padding-right: 8px;
    }

    .hp-news__col:last-child {
        padding-left: 8px;
    }

.hp-section {
    margin-bottom: 16px;
}

.hp-side {
    flex: 0 0 280px;
    width: 280px;
    margin-left: 16px;
}

@media (min-width: 992px) {
    .hp-side {
        position: -webkit-sticky;
        position: sticky;
        top: 12px;
    }
}

/* 通用面板 */
.hp-panel {
    margin: 0;
    padding: 14px 16px 16px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

.hp-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #eef1f6;
}

.hp-panel__title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    color: #1b2733;
}

    .hp-panel__title a {
        color: #1b2733;
    }

        .hp-panel__title a:hover {
            color: #e6212a;
            text-decoration: none;
        }

.hp-panel__sub {
    margin-left: 10px;
    font-size: 12px;
    font-weight: 400;
    color: #a9b2bf;
}

.hp-panel__more {
    flex: 0 0 auto;
    font-size: 12px;
    color: #e6212a;
}

    .hp-panel__more:hover {
        color: #ff8a00;
        text-decoration: none;
    }

/* 新闻列表 */
.hp-list {
    margin: 0;
    padding: 0;
}

.hp-list__item {
    position: relative;
    padding: 8px 92px 8px 14px;
    border-bottom: 1px dashed #eef1f6;
}

    .hp-list__item:last-child {
        border-bottom: 0;
    }

    .hp-list__item:before {
        content: "";
        position: absolute;
        left: 0;
        top: 17px;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: #e6212a;
    }

.hp-list__link {
    display: block;
    font-size: 13px;
    color: #3d4855;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    .hp-list__link:hover {
        color: #e6212a;
        text-decoration: none;
    }

.hp-list__date {
    position: absolute;
    right: 0;
    top: 8px;
    font-size: 12px;
    color: #a2abb9;
}

/* 关于我们 */
.hp-about__body {
    display: flex;
    align-items: flex-start;
}

.hp-about__media {
    flex: 0 0 200px;
    display: block;
    margin-right: 16px;
    border-radius: 8px;
    overflow: hidden;
    background: #f2f5f9;
}

    .hp-about__media img {
        display: block;
        width: 100%;
        height: 140px;
        object-fit: cover;
    }

.hp-about__text {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13px;
    line-height: 1.95;
    color: #4a5563;
    word-break: break-all;
}

    .hp-about__text p {
        margin: 0 0 8px;
    }

        .hp-about__text p:last-child {
            margin-bottom: 0;
        }

/* 推荐产品：桌面固定 4 列，与右侧栏等宽对齐 */
.hp-products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

    .hp-products .mc-card__media {
        padding-top: 75%;
    }

    .hp-products .mc-card__body {
        padding: 10px 12px 12px;
    }

    .hp-products .mc-card__title {
        font-size: 13px;
        line-height: 1.45;
        max-height: 38px;
    }

    .hp-products .mc-card__zoom {
        position: absolute;
        right: 10px;
        bottom: 10px;
        width: 28px;
        height: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        color: #fff;
        background: rgba(0, 108, 183, .82);
        border-radius: 50%;
        transform: rotate(0deg);
        opacity: 0;
        transition: opacity .3s ease;
        z-index: 2;
        pointer-events: none;
    }

    .hp-products .mc-card:hover .mc-card__zoom {
        opacity: 1;
    }

/* 右侧工具卡片 */
.hp-card {
    margin-bottom: 14px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

.hp-card__head {
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: #e6212a;
}

.hp-card__body {
    padding: 14px;
}

.hp-form {
    margin: 0;
    padding: 0;
}

    .hp-form li {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }

.hp-form__label {
    flex: 0 0 62px;
    font-size: 13px;
    font-weight: 400;
    color: #6b7684;
}

.hp-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 32px;
    padding: 0 10px;
    font-size: 13px;
    color: #26303d;
    border: 1px solid #dce3ec;
    border-radius: 6px;
    transition: border-color .2s ease, box-shadow .2s ease;
}

    .hp-input:focus {
        border-color: #e6212a;
        outline: 0;
        box-shadow: 0 0 0 3px rgba(0, 108, 183, .12);
    }

.hp-form__action {
    justify-content: space-between;
    margin-bottom: 0;
}

.hp-link {
    font-size: 12px;
    color: #8a94a6;
}

    .hp-link:hover {
        color: #ff8a00;
        text-decoration: none;
    }

.hp-textarea {
    display: block;
    width: 100%;
    min-height: 84px;
    padding: 8px 10px;
    font-size: 13px;
    line-height: 1.6;
    color: #26303d;
    border: 1px solid #dce3ec;
    border-radius: 6px;
    resize: vertical;
}

    .hp-textarea:focus {
        border-color: #e6212a;
        outline: 0;
        box-shadow: 0 0 0 3px rgba(0, 108, 183, .12);
    }

.hp-form__submit {
    margin-top: 10px;
}

.hp-block {
    display: block;
    width: 100%;
}

/* 快捷入口：竖列 + 左右结构（图标左，文字右） */
.hp-quick {
    display: block;
}

.hp-quick__item {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    margin-bottom: 8px;
    text-align: left;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(16, 42, 80, .06);
    transition: transform .25s ease, box-shadow .25s ease;
}

    .hp-quick__item:last-child {
        margin-bottom: 0;
    }

    .hp-quick__item:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 20px rgba(16, 42, 80, .14);
        text-decoration: none;
    }

    .hp-quick__item img {
        grid-row: 1 / 3;
        display: block;
        width: 44px;
        height: 44px;
        margin: 0;
        object-fit: cover;
        border-radius: 8px;
    }

.hp-quick__cn {
    grid-column: 2;
    grid-row: 1;
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #e6212a;
}

.hp-quick__en {
    grid-column: 2;
    grid-row: 2;
    display: block;
    font-size: 11px;
    color: #a2abb9;
    line-height: 1.3;
}

/* 小屏下恢复上下居中，避免左右结构过挤 */
@media (max-width: 359px) {
    .hp-quick__item {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

        .hp-quick__item img {
            grid-row: auto;
            margin: 0 0 6px;
        }

    .hp-quick__cn,
    .hp-quick__en {
        grid-column: 1;
        grid-row: auto;
    }
}

/* 首页响应式 */
@media (max-width: 991px) {
    .hp-cols {
        display: block;
    }

    .hp-side {
        position: static;
        width: auto;
        margin: 16px 0 0;
    }

    .hp-quick__item {
        padding: 12px 2px;
    }
}

@media (max-width: 767px) {
    .hp-hero__slider img {
        height: 180px;
    }

    .hp-notice {
        display: block;
    }

    .hp-notice__tag {
        display: inline-block;
        margin-bottom: 6px;
    }

    .hp-notice__scroll {
        width: 100%;
    }

    .hp-notice__search {
        margin: 10px 0 0;
        padding-left: 0;
        border-left: 0;
    }

        .hp-notice__search .form_control_input_sm {
            width: 100%;
        }

    .hp-news {
        display: block;
        margin: 0 0 16px;
    }

    .hp-news__col,
    .hp-news__col:first-child,
    .hp-news__col:last-child {
        max-width: 100%;
        padding: 0;
        margin-bottom: 16px;
    }

    .hp-products {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .hp-about__body {
        display: block;
    }

    .hp-about__media {
        width: 100%;
        margin: 0 0 12px;
    }

    .hp-list__item {
        padding-right: 0;
    }

    .hp-list__date {
        position: static;
        display: block;
        margin-top: 2px;
    }
}

/* ============ 18. 副页：侧栏导航 / 404 / 网站地图 ============ */
.mc-side {
    margin: 0 0 16px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

.mc-side__head {
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: #e6212a;
}

.mc-side__list {
    margin: 0;
    padding: 6px 0;
}

    .mc-side .mc-side__list > li {
        padding: 0;
        border-bottom: 0;
    }

.mc-side__link {
    position: relative;
    display: block;
    padding: 9px 14px 9px 28px;
    font-size: 13px;
    line-height: 1.5;
    color: #4a5563;
    transition: color .2s ease, background .2s ease;
}

    .mc-side__link:before {
        content: "";
        position: absolute;
        left: 14px;
        top: 17px;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #c3cad6;
    }

    .mc-side__link:hover {
        color: #fff;
        background: #e6212a;
        text-decoration: none;
    }

        .mc-side__link:hover:before {
            background: #fff;
        }

.mc-side__link.is-active {
    color: #e6212a;
    font-weight: 600;
    background: #f2f8fd;
}

    .mc-side__link.is-active:before {
        background: #e6212a;
    }

/* 404 */
.page404 {
    padding: 80px 20px 100px;
    text-align: center;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(16, 42, 80, .07);
}

    .page404:before {
        content: "404";
        display: block;
        margin-bottom: 20px;
        font-size: 72px;
        font-weight: 700;
        line-height: 1;
        color: #d6dde7;
        letter-spacing: 2px;
    }

    .page404 a {
        display: inline-block;
        padding: 8px 26px;
        font-size: 14px;
        color: #fff;
        background: #e6212a;
        border-radius: 20px;
    }

        .page404 a:hover {
            background: #00558f;
            text-decoration: none;
        }

/* 网站地图 */
.div_dcon {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

.mc-sitemap__group {
    margin: 0 0 14px;
    padding: 0;
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 10px;
    overflow: hidden;
}

.mc-sitemap__title {
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 600;
    background: #f6f9fc;
    border-bottom: 1px solid #eef1f6;
}

    .mc-sitemap__title a {
        color: #e6212a;
    }

        .mc-sitemap__title a:hover {
            color: #ff8a00;
            text-decoration: none;
        }

.mc-sitemap__items {
    margin: 0;
    padding: 10px 8px;
}

.mc-sitemap__item {
    display: inline-block;
    margin: 4px 6px;
    padding: 4px 12px;
    font-size: 13px;
    color: #4a5563;
    background: #f7fafd;
    border-radius: 16px;
    transition: color .2s ease, background .2s ease;
}

    .mc-sitemap__item:hover {
        color: #fff;
        background: #e6212a;
        text-decoration: none;
    }

/* ============ 19. 顶部 header 优化 ============ */
.header_top .content {
    height: 100%;
}

.header_main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}

    .header_main .logo img {
        display: block;
        height: 68px;
        width: auto;
        max-width: 100%;
    }

.header_actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 8px;
}

.header_actions__top {
    display: flex;
    align-items: center;
    gap: 18px;
}

.header_action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #3a4a5e;
    text-decoration: none;
    transition: color .2s ease;
}

    .header_action:hover,
    .header_action:focus {
        color: #e6212a;
        text-decoration: none;
    }

.header_action__icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.header_hotline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #5a6677;
}

.header_hotline__icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #e6212a;
}

.header_hotline__num {
    display: inline;
    font-size: 20px;
    font-weight: 700;
    color: #e60012;
    letter-spacing: .5px;
}

@media (max-width: 767px) {
    .header_top {
        height: auto;
        min-height: 80px;
    }

    .header_main {
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 10px;
        height: auto;
        padding: 10px 0;
    }

    .header_actions {
        align-items: flex-start;
        width: 100%;
    }

    .header_main .logo img {
        height: 50px;
    }
}