/* 大屏基础样式（你原有的，仅作对照） */
.page {
    height: 100vh; /* 每个页面占满视口高度 */
    overflow: hidden; /* 隐藏溢出内容 */
    position: relative; /* 为绝对定位提供上下文 */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 5vw; /* 使用视口宽度单位 */
    color: white;
    padding: 2vw; /* 使用视口宽度单位 */
    background-size: cover; /* 背景图覆盖 */
    background-position: center; /* 背景图居中 */
}

/* 仅小屏（≤800px）隐藏全局滚动条（彻底生效版） */
@media (max-width: 800px) {
    /* 1. 核心：覆盖html/body，强制隐藏滚动条 + 提升优先级 */
    html, body {
        scrollbar-width: none !important; /* Firefox 强制隐藏 */
        -ms-overflow-style: none !important; /* IE/Edge 强制隐藏 */
        overflow-x: hidden !important; /* 强制隐藏横向滚动 */
        overflow-y: auto !important; /* 保留纵向滚动功能 */
    }

    /* 2. Webkit内核（Chrome/Safari/Edge）强制隐藏滚动条 */
    html::-webkit-scrollbar,
    body::-webkit-scrollbar {
        display: none !important; /* 强制隐藏 */
        width: 0px !important;
        height: 0px !important;
    }

    /* 3. 关键：覆盖页面核心容器（你的页面滚动大概率来自这个容器） */
    .pages-wrapper {
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        overflow-x: hidden !important;
    }

    .pages-wrapper::-webkit-scrollbar {
        display: none !important;
        width: 0px !important;
        height: 0px !important;
    }
}

/* 小屏适配（≤800px） */
@media (max-width: 800px) {
    /* 容器基础布局：保持原有逻辑，强化溢出隐藏 */
    .pages-wrapper {
        width: 100vw !important;
        min-height: 100vh !important;
        margin-top: 50px !important; /* 避开导航栏 */
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important; /* 允许纵向滚动，避免内容截断 */
    }

    /* 覆盖大屏.page的100vh，统一所有.pageone为16:9 */
    .pageone,
    .page { /* 同时命中.pageone和大屏的.page，强制覆盖height */
        height: calc(100vw * 9 / 16) !important; /* 16:9核心，覆盖100vh */
        max-height: calc(100vh - 50px) !important; /* 最大高度不超屏幕（减导航栏） */
        width: 100vw !important;
        position: relative !important;
        margin: 0 !important;
        padding: 0 !important; /* 覆盖大屏的2vw padding */
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        transform: scale(calc(100vw / 1920)) !important; /* 适配设计稿1920px */
        transform-origin: top center !important; /* 避免垂直偏移 */
        overflow: hidden !important;
        background-size: cover !important; /* 继承大屏背景逻辑 */
        background-position: center !important;
        font-size: unset !important; /* 清空大屏的5vw字体，单独给page1定义 */
    }

}


/* 小屏适配（≤800px）- 覆盖大屏border+极细横线+300px logo居中 */
@media (max-width: 800px) {
    /* ========== 核心修改：居中对齐+极细横线+300px logo ========== */
    .dom .headername {
        margin: 0 auto 20px auto !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important; /* 强制水平居中（核心） */
        justify-content: center !important;
        width: 100% !important;
        text-align: center !important; /* 兜底居中 */
        position: relative !important; /* 相对定位，避免绝对定位干扰 */
    }

    /* logo保持300px，居中 */
    .dom .headername .logo {
        width: 300px !important; /* 你要的更大logo尺寸 */
        height: auto !important;
        margin: 0 auto 0px auto !important; /* 和横线间距12px */
        display: block !important;
        position: relative !important;
        left: 0 !important;
    }

    /* 关键：覆盖大屏的border/定位，实现极细横线+居中 */
    .dom .divider {
        /* 1. 清除大屏的粗border和绝对定位 */
        border: none !important;
        border-top: none !important;
        position: relative !important; /* 覆盖大屏的absolute */
        top: unset !important; /* 清除大屏的top:30% */
        left: unset !important; /* 清除大屏的left:6% */
        right: unset !important; /* 清除大屏的right:40% */

        /* 2. 极细横线：用border-top实现（比background更细） */
        width: 100px !important; /* 适配300px logo的宽度比例 */
        height: 0 !important; /* 高度设0，靠border撑粗细 */
        border-top: 2px solid rgba(255, 255, 255, 0.6) !important; /* 0.5px极细+半透明白，视觉更细 */
        background-color: transparent !important; /* 清除大屏的background */

        /* 3. 精准居中 */
        margin: 0 auto !important;
        display: block !important;
    }

    /* ========== 以下样式完全保留，无需修改 ========== */
    .dom {
        height: auto !important;
        padding: 20px 15px !important;
        background-color: #0b5894 !important;
    }

    .dom .container {
        flex: 1 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important; /* 容器整体居中，双重保障 */
    }

    .dom .features {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-around !important;
        align-items: center !important;
        width: 95% !important;
        max-width: 100% !important;
        margin: 10px auto !important;
        padding: 2vw 0 !important;
        gap: 1vw !important;
        overflow: hidden !important;
    }

    .dom .feature-item {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 1 1 0 !important;
        width: 18vw !important;
        max-width: 20vw !important;
        margin: 0 !important;
    }

    .dom .feature-container {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        width: 10vw !important;
        height: 10vw !important;
        margin: 0 auto !important;
    }

    .dom .feature-text {
        display: block !important;
        text-align: center !important;
        font-size: 4vw !important;
        line-height: 1 !important;
    }

    .dom .feature-desc {
        text-align: center !important;
        margin: 1vw 0 0 0 !important;
        padding: 0 !important;
        font-size: 2.5vw !important;
        white-space: nowrap !important;
        width: 100% !important;
    }

    .dom .main-title,
    .dom .contact-section,
    .dom .image-row {
        text-align: center !important;
        margin: 10px 0 !important;
    }

    .dom .contact-info, .dom .contact-info1, .dom .contact-info2, .dom .contact-info3 {
        text-align: center !important;
        margin: 5px 0 !important;
        display: block !important;
    }

    .dom .image-item, .dom .image-item5 {
        display: inline-block !important;
        width: 18% !important;
        margin: 5px 1% !important;
    }

    .dom .small-icon {
        height: 30px !important;
        width: auto !important;
    }

    .dom .large-icon {
        height: 60px !important;
        width: auto !important;
    }

    .dom .footer {
        text-align: center !important;
        margin-top: 20px !important;
        font-size: 12px !important;
    }

    .dom * {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }

    .dom .contact-title {
        text-align: center !important; /* 强制文本水平居中 */
        margin: 0 auto 15px auto !important; /* 左右margin:auto确保块级居中，上下留间距更美观 */
        font-size: 18px !important; /* 可选：小屏适配字号，不需要可删除 */
    }
}


/* 小屏适配（≤800px）- pagecpznkz 背景+图片居中（匹配大屏定位逻辑） */
@media (max-width: 800px) {
    /* 核心容器：保留大屏的relative，适配小屏尺寸 */
    .pagecpznkz {
        background-image: url('../img/shuininew/01.png') !important; /* 继承大屏背景 */
        color: #ffffff !important;
        width: 100vw !important; /* 小屏占满宽度 */
        height: auto !important; /* 取消大屏可能的固定高度 */
        min-height: 300px !important; /* 保底高度，保证背景展示 */
        position: relative !important; /* 必须保留，为子元素绝对定位 */
        overflow: hidden !important; /* 防止内容溢出 */
        transform: none !important; /* 清空所有缩放，避免偏移 */
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 前景图容器：绝对定位+居中（核心修改） */
    .pagecpznkz .img-hzimgone {
        position: absolute !important; /* 继承大屏的absolute，关键！ */
        top: 50% !important; /* 垂直居中：距离顶部50% */
        left: 50% !important; /* 水平居中：距离左侧50% */
        transform: translate(-50%, -50%) !important; /* 反向偏移50%，实现真正居中 */
        width: 40% !important; /* 小屏放大宽度（大屏15%→小屏40%，适配显示） */
        max-width: 60% !important; /* 小屏最大宽度限制 */
        z-index: 10 !important; /* 继承大屏z-index */
        transition: all 0.4s ease !important;
        border-radius: 4px !important;
        overflow: hidden !important;
        /* 清空大屏的top/left，强制居中 */
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 前景图片：继承大屏样式，适配小屏 */
    .pagecpznkz .img-hzimgone img {
        width: 100% !important; /* 继承大屏100%宽度 */
        height: auto !important;
        display: block !important;
        transition: transform 0.3s ease !important;
    }


    /* 基础样式 - 大屏默认样式 */
    .zntextdown1 {
        padding: 20px 0;
    }

    .container2 {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    /* 图片自适应核心样式 */
    .left-aligned-image img,
    .left-aligned-image-xttd img {
        max-width: 100%;
        height: auto;
        display: block;
        margin-bottom: 15px;
    }

    /* 文本基础样式 */
    .left-aligned-image p {
        line-height: 1.8;
        font-size: 16px;
        color: #333;
        margin: 0;
    }

    /* 栅格列垂直居中 */
    .row {
        align-items: center;
    }
}
/* 800px小屏自适应核心样式 */
@media (max-width: 800px) {
    .zntextdown1 {
        padding: 15px 0;
    }

    /* 小屏文本优化 */
    .left-aligned-image p {
        font-size: 14px;
        line-height: 1.6;
    }

    /* 小屏图片间距调整 */
    .left-aligned-image img,
    .left-aligned-image-xttd img {
        margin-bottom: 10px;
    }

    /* 小屏列堆叠后间距 */
    .row > div {
        margin-bottom: 20px;
    }

    /* 小屏容器内边距优化 */
    .container2 {
        padding: 0 10px;
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 800px) {
    .container2 {
        padding: 0 8px;
    }
}

/* 兼容Bootstrap栅格 - 确保小屏单列显示（如未引入Bootstrap需补充） */
@media (max-width: 800px) {
    .col-md-7, .col-md-5 {
        width: 100%;
        padding: 0;
        margin: 0;
    }


    /* 基础样式 - 大屏默认展示效果 */
    .zntextdown2 {
        padding: 20px 0;
    }

    .container2 {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    /* 图片自适应核心样式 */
    .left-aligned-image2 img,
    .left-aligned-image-xttd2 img {
        max-width: 100%;
        height: auto;
        display: block;
        margin-bottom: 15px;
        /* 确保图片在容器内完整显示 */
        object-fit: cover;
    }

    /* 文本基础样式 */
    .left-aligned-image2 p {
        line-height: 1.8;
        font-size: 16px;
        color: #333;
        margin: 0;
        text-align: justify; /* 文本两端对齐，提升阅读体验 */
    }

    /* 栅格列垂直居中对齐 */
    .row {
        align-items: center;
        margin: 0; /* 清除默认行间距，避免布局偏移 */
    }

    .row > div {
        padding: 0 10px; /* 列内边距，避免内容贴边 */
    }
}
/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    .zntextdown2 {
        padding: 15px 0; /* 减少上下内边距，适配小屏 */
    }

    /* 小屏文本优化 */
    .left-aligned-image2 p {
        font-size: 14px; /* 缩小字体，提升小屏可读性 */
        line-height: 1.6; /* 调整行高，避免文字拥挤 */
    }

    /* 小屏图片间距调整 */
    .left-aligned-image2 img,
    .left-aligned-image-xttd2 img {
        margin-bottom: 10px; /* 减少图片下方间距 */
    }

    /* 小屏列堆叠后增加间距 */
    .row > div {
        margin-bottom: 20px;
        width: 100%; /* 强制单列显示 */
        padding: 0; /* 清除列内边距，充分利用屏幕宽度 */
    }

    /* 小屏容器内边距优化 */
    .container2 {
        padding: 0 10px;
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 576px) {
    .container2 {
        padding: 0 8px; /* 进一步缩小内边距 */
    }

    .left-aligned-image2 p {
        font-size: 13px; /* 进一步缩小字体 */
    }


    /* 基础样式 - 大屏默认展示效果 */
    .zntextdown3 {
        padding: 20px 0;
    }

    .container2 {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    /* 主图片自适应样式 */
    .left-aligned-image3 img:first-child {
        max-width: 100%;
        height: auto;
        display: block;
        margin-bottom: 20px;
        object-fit: cover; /* 保证图片比例不变 */
    }

    /* 标题行样式（含小图标） */
    .left-aligned-image3 p.title {
        font-size: 18px;
        font-weight: 600; /* 标题加粗，突出层级 */
        color: #222;
        margin: 15px 0 8px 0;
        display: flex;
        align-items: center; /* 图标与文字垂直居中 */
        gap: 8px; /* 图标与文字间距 */
    }

    /* 标题内小图标样式 */
    .left-aligned-image3 p.title img {
        width: auto;
        height: 1em; /* 图标高度与文字行高一致 */
        display: inline-block;
    }

    /* 正文文本样式 */
    .left-aligned-image3 p:not(.title) {
        line-height: 1.8;
        font-size: 16px;
        color: #333;
        margin: 0 0 10px 0;
        text-align: justify; /* 文本两端对齐，提升阅读体验 */
    }

    /* 行布局基础样式 */
    .row {
        margin: 0; /* 清除默认行间距 */
    }

    .left-aligned-image3 {
        width: 100%;
        padding: 0;
    }
}
/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    .zntextdown3 {
        padding: 15px 0; /* 减少上下内边距 */
    }

    /* 小屏主图片间距调整 */
    .left-aligned-image3 img:first-child {
        margin-bottom: 15px;
    }

    /* 小屏标题样式优化 */
    .left-aligned-image3 p.title {
        font-size: 16px; /* 缩小标题字体 */
        gap: 6px; /* 缩小图标与文字间距 */
        margin: 12px 0 6px 0; /* 调整标题间距 */
    }

    /* 小屏正文样式优化 */
    .left-aligned-image3 p:not(.title) {
        font-size: 14px; /* 缩小正文字体 */
        line-height: 1.6; /* 调整行高，避免拥挤 */
        margin: 0 0 8px 0; /* 减少正文间距 */
    }

    /* 小屏容器内边距优化 */
    .container2 {
        padding: 0 10px;
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 800px) {
    .container2 {
        padding: 0 8px; /* 进一步缩小内边距 */
    }

    .left-aligned-image3 p.title {
        font-size: 15px; /* 进一步微调标题字体 */
    }

    .left-aligned-image3 p:not(.title) {
        font-size: 13px; /* 进一步缩小正文字体 */
    }

    /* 基础样式 - 大屏默认效果 */
    .zntextdownjiejue {
        padding: 20px 0;
        width: 100%;
    }

    .container2 {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    /* 核心图片自适应样式 */
    .left-aligned-image-jiejue img {
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto; /* 图片水平居中显示 */
        object-fit: contain; /* 保证图片完整显示，不裁剪 */
    }

    /* 行布局基础样式 */
    .row {
        margin: 0; /* 清除默认行间距 */
    }

    .left-aligned-image-jiejue {
        width: 100%;
        padding: 0;
    }

    /* 空区块基础样式（pageone系列） */
    .pageone {
        width: 100%;
        /* 若区块有背景/内容，保证基础占位 */
        min-height: 1px;
        margin: 0 auto;
        /* 清除默认间距，避免布局错乱 */
        padding: 0;
        border: 0;
    }

    /* 区分不同pageone区块（可选，便于后续扩展） */
    .pageznz8, .pagezn8,
    .pageznz9, .pagezn9,
    .pageznz10, .pagezn10,
    .pageznz12, .pagezn12,
    .pageznz11, .pagezn11 {
        width: 100%;
        /* 若后续添加内容，保证基础内边距 */
        padding: 0;
        margin-bottom: 0;
    }
}
/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    .zntextdownjiejue {
        padding: 15px 0; /* 减少上下内边距，适配小屏 */
    }

    /* 小屏图片优化 */
    .left-aligned-image-jiejue img {
        /* 小屏下图片最大宽度限制，避免拉伸 */
        max-width: 95%;
        margin-bottom: 10px; /* 图片下方预留少量间距 */
    }

    /* 小屏容器内边距优化 */
    .container2 {
        padding: 0 10px;
    }

    /* 小屏空区块适配（防止后续加内容溢出） */
    .pageone {
        max-width: 100%; /* 强制不超出屏幕宽度 */
        box-sizing: border-box; /* 盒模型优化，避免溢出 */
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 800px) {
    .container2 {
        padding: 0 8px; /* 进一步缩小内边距 */
    }

    .left-aligned-image-jiejue img {
        max-width: 98%; /* 超小屏充分利用屏幕宽度 */
    }

    /* 基础样式 - 大屏默认效果 */
    .zntextdown4 {
        padding: 20px 0;
        width: 100%;
    }

    .container2 {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    /* 主图片自适应样式 */
    .left-aligned-image4 img:first-child {
        max-width: 100%;
        height: auto;
        display: block;
        margin-bottom: 20px;
        object-fit: cover; /* 保证图片比例不变 */
    }

    /* 标题样式（含不同图标） */
    .left-aligned-image4 p.title {
        font-size: 18px;
        font-weight: 700;
        color: #222;
        margin: 18px 0 10px 0;
        display: flex;
        align-items: center; /* 图标与文字垂直居中 */
        gap: 10px; /* 图标与文字间距 */
    }

    /* 标题内小图标自适应 */
    .left-aligned-image4 p.title img {
        width: auto;
        height: 1em; /* 图标高度与文字行高匹配 */
        display: inline-block;
        flex-shrink: 0; /* 防止图标被压缩 */
    }

    /* 列表式正文样式 */
    .left-aligned-image4 p:not(.title) {
        line-height: 1.8;
        font-size: 16px;
        color: #333;
        margin: 0 0 8px 0;
        padding-left: 5px; /* 列表文本缩进，提升层级感 */
    }

    /* 行布局基础样式 */
    .row {
        margin: 0; /* 清除默认行间距 */
    }

    .left-aligned-image4 {
        width: 100%;
        padding: 0;
        box-sizing: border-box; /* 盒模型优化，避免溢出 */
    }
}

/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    .zntextdown4 {
        padding: 15px 0; /* 减少上下内边距 */
    }

    /* 小屏主图片优化 */
    .left-aligned-image4 img:first-child {
        margin-bottom: 15px; /* 减少图片下方间距 */
        max-width: 95%; /* 小屏图片占比优化 */
        margin-left: auto;
        margin-right: auto; /* 图片水平居中 */
    }

    /* 小屏标题样式优化 */
    .left-aligned-image4 p.title {
        font-size: 16px; /* 缩小标题字体 */
        gap: 8px; /* 缩小图标与文字间距 */
        margin: 15px 0 8px 0; /* 调整标题间距 */
    }

    /* 小屏列表正文优化 */
    .left-aligned-image4 p:not(.title) {
        font-size: 14px; /* 缩小正文字体 */
        line-height: 1.6; /* 调整行高，避免文字拥挤 */
        margin: 0 0 6px 0; /* 减少列表项间距 */
        padding-left: 3px; /* 缩小文本缩进 */
    }

    /* 小屏容器内边距优化 */
    .container2 {
        padding: 0 10px;
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 800px) {
    .container2 {
        padding: 0 8px; /* 进一步缩小内边距 */
    }

    .left-aligned-image4 p.title {
        font-size: 15px; /* 微调标题字体 */
    }

    .left-aligned-image4 p:not(.title) {
        font-size: 13px; /* 进一步缩小正文字体 */
        line-height: 1.5; /* 进一步优化行高 */
    }

    .left-aligned-image4 img:first-child {
        max-width: 98%; /* 超小屏充分利用屏幕宽度 */
    }


    /* 基础样式 - 大屏默认效果 */
    .zntextdownjiejue2 {
        padding: 20px 0;
        width: 100%;
        box-sizing: border-box; /* 盒模型优化，避免溢出 */
    }

    .container2 {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 15px;
    }

    /* 核心图片自适应样式 */
    .left-aligned-image-jiejue2 img {
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto; /* 图片水平居中显示 */
        object-fit: contain; /* 保证图片完整显示，不裁剪、不变形 */
    }

    /* 行布局基础样式 */
    .row {
        margin: 0; /* 清除默认行间距，避免布局偏移 */
    }

    .left-aligned-image-jiejue2 {
        width: 100%;
        padding: 0;
    }

    /* 空区块基础样式（pageone系列） */
    .pageone {
        width: 100%;
        min-height: 1px; /* 保证空区块基础占位 */
        margin: 0 auto;
        padding: 0;
        border: 0;
        box-sizing: border-box; /* 防止后续加内容溢出 */
    }

    /* 区分不同pageone区块（便于后续扩展样式） */
    .pageznz13, .pagezn13,
    .pageznz14, .pagezn14 {
        width: 100%;
        padding: 0;
        margin-bottom: 0; /* 清除默认间距 */
    }
}
/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    .zntextdownjiejue2 {
        padding: 15px 0; /* 减少上下内边距，适配小屏 */
    }

    /* 小屏图片优化 */
    .left-aligned-image-jiejue2 img {
        max-width: 95%; /* 小屏下图片占比优化，避免贴边 */
        margin-bottom: 10px; /* 图片下方预留少量间距 */
    }

    /* 小屏容器内边距优化 */
    .container2 {
        padding: 0 10px;
    }

    /* 小屏空区块适配（防止后续加内容溢出） */
    .pageone {
        max-width: 100%; /* 强制不超出屏幕宽度 */
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 800px) {
    .container2 {
        padding: 0 8px; /* 进一步缩小内边距，充分利用屏幕 */
    }

    .left-aligned-image-jiejue2 img {
        max-width: 98%; /* 超小屏图片几乎占满屏幕宽度 */
    }

    /* 基础样式 - 大屏默认效果 */
    .pageznz9 {
        height: 1vh; /* 保持原有高度设置 */
        overflow: hidden; /* 隐藏溢出内容 */
        position: relative; /* 为绝对定位提供上下文 */
        display: flex;
        align-items: center;
        justify-content: flex-start; /* 改为靠左对齐（核心修改） */
        font-size: 1vw; /* 大屏使用视口宽度单位 */
        color: white;
        padding: 1vw; /* 大屏使用视口宽度单位 */
        background-size: contain; /* 背景图保持比例 */
        background-position: left center; /* 背景图靠左+垂直居中（核心修改） */
        background-repeat: no-repeat; /* 避免重复 */
        box-sizing: border-box; /* 盒模型优化，防止padding溢出 */
    }

    .pagezn9 {
        background-image: url('../img/shuininew/11.png'); /* 背景图片路径 */
        color: #ffffff; /* 文字颜色为白色 */
        margin-top: 30px;
        margin-bottom: 80px;
        z-index: 0;
        width: 100%; /* 强制宽度100%，确保自适应 */
    }
}
/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    .pageznz9 {
        font-size: 2.5vw; /* 小屏放大字体，保证可读性 */
        padding: 2vw; /* 增大内边距，避免内容贴边 */
        min-height: 30vh; /* 小屏设置最小高度，避免背景图显示不全 */
        background-size: cover; /* 小屏背景图覆盖容器，保证显示效果 */
        background-position: left center; /* 小屏保持靠左对齐 */
    }

    .pagezn9 {
        margin-top: 15px; /* 小屏减少顶部间距 */
        margin-bottom: 40px; /* 小屏减少底部间距 */
    }

    /* 基础样式 - 大屏默认效果（图片适度缩小） */
    .pageznz9 {
        height: 1vh; /* 保留原有高度设置 */
        overflow: hidden; /* 隐藏溢出内容 */
        position: relative; /* 为绝对定位提供上下文 */
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1vw; /* 使用视口宽度单位 */
        color: white;
        padding: 1vw; /* 使用视口宽度单位 */
        /* 核心：大屏先缩小背景图 */
        background-size: 80% contain; /* 宽度缩为原80%，保持比例 */
        background-position: center; /* 背景图居中 */
        background-repeat: no-repeat; /* 避免重复 */
        box-sizing: border-box; /* 盒模型优化 */
        min-height: 200px; /* 保证图片显示高度 */
    }

    .pagezn9 {
        background-image: url('../img/shuininew/11.png'); /* 背景图片路径 */
        color: #ffffff; /* 设置文字颜色为白色 */
        margin-top: 30px;
        margin-bottom: 80px;
        z-index: 0;
        width: 100%; /* 强制宽度100%，确保自适应 */
    }
}

/* 800px小屏核心自适应样式（图片进一步缩小） */
@media (max-width: 800px) {
    .pageznz9 {
        font-size: 2.5vw; /* 小屏放大字体保证可读性 */
        padding: 2vw; /* 调整内边距 */
        /* 小屏图片缩小到70% */
        background-size: 70% contain;
        min-height: 150px; /* 适配小屏高度 */
    }

    .pagezn9 {
        margin-top: 15px; /* 小屏减少顶部间距 */
        margin-bottom: 40px; /* 小屏减少底部间距 */
    }
}

/* 超小屏（576px以下）补充优化（图片继续缩小） */
@media (max-width: 800px) {
    .pageznz9 {
        font-size: 3vw; /* 进一步放大字体 */
        padding: 3vw; /* 调整内边距 */
        /* 超小屏图片缩小到60% */
        background-size: 60% contain;
        min-height: 120px; /* 适配手机窄屏高度 */
    }

    .pagezn9 {
        margin-top: 10px; /* 进一步减少顶部间距 */
        margin-bottom: 30px; /* 进一步减少底部间距 */
    }


    /* 基础样式 - 大屏默认效果（文字紧靠图片+靠左） */
    /* 主图片（16.png）核心样式 */
    .left-aligned-image4 img:first-child {
        max-width: 100%;
        height: auto;
        display: block;
        margin-bottom: 20px;
        object-fit: cover;
        margin-left: 0 !important; /* 强制靠左 */
    }

    /* 标题容器（含15.png+痛点文字）- 核心调整间距 */
    p.title {
        font-size: 18px;
        font-weight: 700;
        color: #222;
        margin: 18px 0 10px 0;
        display: flex;
        align-items: center; /* 图标与文字垂直居中 */
        gap: 2px !important; /* 极小间距，实现紧靠（核心修改） */
        justify-content: flex-start; /* 整体靠左 */
        padding-left: 0; /* 清除内边距 */
        line-height: 1; /* 统一行高，避免间距 */
    }


    /* 标题内小图标（15.png） */
    p.title img {
        width: auto;
        height: 1em; /* 与文字行高匹配 */
        display: inline-block;
        flex-shrink: 0; /* 防止压缩 */
        margin: 0 !important; /* 清除图标默认边距 */
        padding: 0; /* 清除内边距 */
    }
}
/* 800px小屏核心自适应样式 */
@media (max-width: 800px) {
    /* 小屏主图片优化 */
    .left-aligned-image4 img:first-child {
        margin-bottom: 15px;
        max-width: 95%;
        margin-left: 0 !important;
    }

    /* 小屏标题 - 保持紧靠+靠左 */
    p.title {
        font-size: 16px;
        gap: 2px !important; /* 小屏仍保持极小间距 */
        margin: 15px 0 8px 0;
        justify-content: flex-start;
    }

    /* 小屏图标 */
    p.title img {
        height: 0.9em; /* 随文字等比例缩小，仍紧靠 */
    }
}

/* 超小屏（576px以下）补充优化 */
@media (max-width: 800px) {
    .left-aligned-image4 img:first-child {
        max-width: 98%;
        margin-left: 0 !important;
    }

    p.title {
        font-size: 15px;
        gap: 1px !important; /* 超小屏进一步缩小间距 */
    }
}

/* 基础样式 - 大屏默认效果（图片缩小显示） */
@media (max-width: 800px) {
    .pageznz11 {
        height: 1vh; /* 保留原有高度设置 */
        overflow: hidden; /* 隐藏溢出内容 */
        position: relative; /* 为绝对定位提供上下文 */
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1vw; /* 使用视口宽度单位 */
        color: white;
        padding: 1vw; /* 使用视口宽度单位 */
        /* 核心：大屏先缩小背景图至原尺寸70%，保持比例 */
        background-size: 70% contain;
        background-position: center; /* 背景图居中 */
        background-repeat: no-repeat; /* 避免重复 */
        box-sizing: border-box; /* 盒模型优化，防止溢出 */
        min-height: 200px; /* 保证图片显示高度，避免缩小后看不见 */
    }

    .pagezn11 {
        background-image: url('../img/shuininew/14.png'); /* 背景图片路径 */
        color: #ffffff; /* 设置文字颜色为白色 */
        margin-top: 30px;
        margin-bottom: 80px;
        z-index: 0;
        width: 100%; /* 强制宽度100%，确保自适应 */
    }
}

/* 800px小屏核心自适应样式（图片进一步缩小+适配） */
@media (max-width: 800px) {
    .pageznz11 {
        font-size: 2.5vw; /* 小屏放大字体保证可读性 */
        padding: 2vw; /* 调整内边距 */
        /* 小屏图片缩小到60% */
        background-size: 60% contain;
        min-height: 150px; /* 适配小屏高度 */
    }

    .pagezn11 {
        margin-top: 15px; /* 小屏减少顶部间距 */
        margin-bottom: 40px; /* 小屏减少底部间距 */
    }
}

/* 超小屏（576px以下）补充优化（图片继续缩小） */
@media (max-width: 576px) {
    .pageznz11 {
        font-size: 3vw; /* 进一步放大字体 */
        padding: 3vw; /* 调整内边距 */
        /* 超小屏图片缩小到50% */
        background-size: 50% contain;
        min-height: 120px; /* 适配手机窄屏高度 */
    }

    .pagezn11 {
        margin-top: 10px; /* 进一步减少顶部间距 */
        margin-bottom: 30px; /* 进一步减少底部间距 */
    }
}


/* 仅针对≤800px小屏的样式：隐藏.pageznz9/pagezn9，显示.tu99 */
@media (max-width: 800px) {
    /* 小屏隐藏指定元素 */
    .pageone.pageznz9.pagezn9 {
        display: none !important; /* 强制隐藏 */
    }

    /* 小屏确保.tu99显示（兜底） */
    .tu99 {
        display: flex !important; /* 配合之前的居中样式 */
        justify-content: center;
        align-items: center;
        width: 100%;
        padding: 0 5px;
        box-sizing: border-box;
    }

    .tu99 .tu9 {
        max-width: 90%;
        height: auto;
        display: block;
        object-fit: contain;
    }
}

/* 补充：大屏(>800px)隐藏.tu99（确保逻辑闭环，否则大屏会同时显示两个元素） */
@media (min-width: 801px) {
    .tu99 {
        display: none !important; /* 大屏隐藏.tu99 */
    }

    /* 大屏确保.pageznz9/pagezn9显示（兜底） */
    .pageone.pageznz9.pagezn9 {
        display: block !important;
    }
}

/* 仅≤800px小屏生效：图片居中+自适应缩放 */
@media (max-width: 800px) {
    .tc9 {
        /* 核心：图片自适应缩放，不超出屏幕 */
        max-width: 90%; /* 小屏最多占屏幕90%宽度，自动缩小 */
        height: auto; /* 高度跟着宽度自动变，保证图片不变形 */
        /* 核心：图片水平居中 */
        display: block;
        margin: 0 auto; /* 左右自动留白，实现居中 */
        /* 兜底：保证图片完整显示，不裁剪 */
        object-fit: contain;
    }
}

/* 可选补充：超小屏（手机窄屏）进一步优化 */
@media (max-width: 576px) {
    .tc9 {
        max-width: 95%; /* 手机上占屏幕95%宽度，显示更饱满 */
    }
}

/* 仅≤800px小屏生效的样式 */
@media (max-width: 800px) {
    /* 1. 小屏隐藏指定元素 */
    .pageone.pageznz11.pagezn11 {
        display: none !important;
    }

    /* 2. 小屏显示图片容器，设置上下间距+居中 */
    .tc99 {
        display: block !important;
        width: 100%;
        text-align: center; /* 图片水平居中 */
        margin: 20px 0; /* 上下各留20px间距（可自行调整数值） */
        padding: 0 5px; /* 左右留边，避免贴屏 */
        box-sizing: border-box;
    }

    /* 3. 图片缩小+自适应缩放（核心） */
    .tc99 .tc9 {
        max-width: 55%; /* 小屏缩至屏幕70%宽度（缩小核心，可调整） */
        height: auto; /* 高度随宽度自动变，保证不变形 */
        object-fit: contain; /* 图片完整显示，不裁剪 */
        display: inline-block; /* 配合text-align:center居中 */
    }
}

/* 补充：大屏(>800px)隐藏图片容器，确保逻辑闭环 */
@media (min-width: 801px) {
    .tc99 {
        display: none !important;
    }
    .pageone.pageznz11.pagezn11 {
        display: block !important;
    }
}

/* 仅≤800px小屏生效的样式 */
@media (max-width: 800px) {
    /* 1. 小屏隐藏指定元素 */
    .pageone.pageznz9.pagezn9 {
        display: none !important;
    }

    /* 2. 小屏显示图片容器，设置上下间距+居中 */
    .tu99 {
        display: block !important;
        width: 100%;
        text-align: center; /* 图片水平居中 */
        margin: 20px 0; /* 上下各20px间距（可自行调整） */
        padding: 0 5px; /* 左右留边，避免贴屏 */
        box-sizing: border-box;
    }

    /* 3. 图片缩小+自适应缩放（核心） */
    .tu99 .tu9 {
        max-width: 50%; /* 小屏缩至屏幕70%宽度（缩小核心） */
        height: auto; /* 高度自动匹配，保证不变形 */
        object-fit: contain; /* 图片完整显示，不裁剪 */
        display: inline-block;
    }
}

/* 补充：大屏(>800px)隐藏图片容器，确保逻辑闭环 */
@media (min-width: 801px) {
    .tu99 {
        display: none !important;
    }
    .pageone.pageznz9.pagezn9 {
        display: block !important;
    }
}