/*
 * 社会责任区域 - PC/移动端分离
 * PC：.social_resp_pc 仅桌面显示
 * 移动：.social_resp_m 仅移动显示（banner + 横向子导航 + 内容/列表），主题色 #f08200
 */

@media (min-width: 768px) {
    .social_resp_m {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .social_resp_pc {
        display: none !important;
    }

    .social_resp_m {
        display: block !important;
    }

    /* 社会责任 移动端 banner */
    .social_resp_m_banner {
        width: 100%;
        height: 0;
        padding-bottom: 36%;
        overflow: hidden;
        position: relative;
        background: #eee;
    }

    .social_resp_m_banner img {
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        min-width: 100%;
        min-height: 100%;
        width: auto;
        height: 100%;
        object-fit: cover;
    }

    /* 横向子导航，选中 #f08200 */
    .social_resp_m_nav {
        background: #e7e7e7;
        padding: 10px 15px;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        overflow-y: hidden;
    }

    .social_resp_m_nav .r_cell {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        width: max-content;
        min-width: min-content;
        box-sizing: border-box;
    }

    .social_resp_m_nav a {
        flex: 0 0 auto;
        padding: 8px 14px;
        font-size: 14px;
        line-height: 1.4;
        color: #333;
        text-decoration: none;
        white-space: nowrap;
        border-radius: 4px;
    }

    .social_resp_m_nav a.tab_light {
        background: #f08200;
        color: #fff;
    }

    /* 内容区（简介 + 列表复用 news_group_m 列表样式） */
    .social_resp_m_content {
        padding: 24px 15px 30px;
        box-sizing: border-box;
    }

    .social_resp_m_intro {
        margin-bottom: 20px;
        padding-bottom: 16px;
        border-bottom: 1px solid #e5e5e5;
    }

    .social_resp_m_intro h4 {
        margin: 0 0 10px 0;
        font-size: 16px;
        font-weight: 600;
        color: #333;
        line-height: 1.4;
    }

    .social_resp_m_intro p {
        margin: 0;
        font-size: 14px;
        line-height: 1.65;
        color: #555;
    }

    /* 社会责任报告页：报告卡片列表 */
    .social_resp_m_report_list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 14px 12px; /* 行高/列间距 */
        align-items: stretch;
    }

    .social_resp_m_report_item {
        list-style: none;
        margin: 0;
        padding: 0;
        flex: 0 0 calc(50% - 6px); /* 两列布局（扣除一侧间距的一半） */
        max-width: calc(50% - 6px);
        background: #f9f9f9;
        border-radius: 8px;
        overflow: hidden;
        border: 1px solid #eee;
    }

    .social_resp_m_report_item:last-child {
        margin-bottom: 0;
    }

    .social_resp_m_report_item img {
        width: 100%;
        height: auto;
        display: block;
        background: #eee;
    }

    .social_resp_m_report_item_inner {
        padding: 14px 16px;
    }

    .social_resp_m_report_item_inner p {
        margin: 0 0 12px 0;
        font-size: 15px;
        font-weight: 500;
        color: #333;
        line-height: 1.4;
    }

    .social_resp_m_report_item_inner a {
        display: inline-block;
        padding: 6px 16px;
        font-size: 14px;
        color: #fff;
        background: #f08200;
        text-decoration: none;
        border-radius: 4px;
        -webkit-tap-highlight-color: rgba(240, 130, 0, 0.2);
    }

    .social_resp_m_report_item_inner a:active {
        background: #c26900;
    }

    /* 移动端分页容器 */
    .social_resp_m_pager_wrap {
        text-align: center;
        margin: 24px 15px 40px;
    }

    .social_resp_m_pager_wrap .pager {
        justify-content: center;
    }
}
