﻿@charset "utf-8";

/* ==============================================
   全站移动端通用基础样式（所有页面共用）
   ============================================== */

/* 1. 全局移动端通用重置（≤1299px） */
@media (max-width: 1299px) {
    html, body {
        width: 100% ;
        overflow-x: hidden ;
        margin: 0 ;
        padding: 0 ;
    }
    body {
        font-size: 14px ;
        background: #F9F9F9 ;
        max-width: 100vw ;
    }
    * {
        box-sizing: border-box ;
        margin: 0 ;
        padding: 0 ;
        max-width: 100% ;
    }
    a {
        text-decoration: none ;
        color: inherit ;
    }
    ul, li {
        list-style: none ;
    }
    .visually-hidden {
        display: none ;
    }
    .clear {
        clear: both ;
    }

    /* 全站通用隐藏规则（移动端） */
    .huaxu-client-wrapper,
    .yh-trust-footer.huaxu-client-inner,
    .yh-client-tagline,
    .yh-client-logos.huaxu-client-logos,
    .content-list-wrapper,
    .content-list-container,
    .content-grid,
    .content-card,
    .card-title,
    .content-list,
    .article-top-img,
    .article-img,
    .article-top-title,
    .article-top-desc,
    #nav_all, 
    #nav-onhoo, 
    .text, 
    .textwz,
    #box1, .box1, .thumbnailwrapper2,
    .footer-links,
    .foot_ba,
    .yb_conct {
        display: none ;
        visibility: hidden ;
        height: 0 ;
        width: 0 ;
        overflow: hidden ;
        position: absolute ;
        top: -9999px ;
        left: -9999px ;
    }

    /* 全站header移动端通用适配 */
    #hd {
        height: auto ;
        background: #F9F9F9 ;
        padding: 10px 0 ;
        width: 100% ;
        max-width: 100vw ;
        overflow: visible ;
        position: relative ;
    }
    #header {
        width: 100% ;
        height: auto ;
        padding: 0 ;
        position: relative ;
        max-width: 100vw ;
        background: #F9F9F9 ;
        overflow: visible ;
        box-sizing: border-box ;
        display: flex ;
        justify-content: center ;
        align-items: center ;
    }
    .logo {
        width: 80vw ;
        max-width: 320px ;
        height: auto ;
        top: auto ;
        left: auto ;
        transform: none ;
        position: relative ;
        background: transparent ;
        margin: 10px 0 ;
        padding: 0 ;
        overflow: visible ;
        min-height: 80px ;
    }
    .logo a {
        width: 100% ;
        height: 100% ;
        min-height: 80px ;
        padding: 10px 0 ;
        background-size: contain ;
        background-repeat: no-repeat ;
        background-position: center center ;
        display: block ;
        box-sizing: border-box ;
        line-height: 1 ;
        background-color: transparent ;
    }

    /* 全站footer移动端通用适配 */
    #foot {
        width: 100% ;
        margin-top: 10px ;
        max-width: 100vw ;
        background: #000 ;
        padding-bottom: 0 ;
    }
    #foot_980 {
        width: 100% ;
        height: auto ;
        padding: 10px 15px ;
        max-width: 100vw ;
        display: flex ;
        flex-direction: column ;
        align-items: center ;
        gap: 5px ;
    }


/* ===================== 底部按钮 - 移动端样式 ===================== */
.foot-btn ul {
    list-style: none;
    padding: 0 15px; /* 移动端左右留白 */
    margin: 0 auto; /* 水平居中核心 */
    display: flex;
    justify-content: center; /* 按钮组内部居中 */
    flex-wrap: wrap; /* 核心：允许按钮换行 */
    box-sizing: border-box;
    gap: 10px; /* 按钮之间的间距（行内+换行后都生效） */
    max-width: 100%;
}

/* 控制每个按钮占比，实现两个一排 */
.foot-btn li {
    width: calc(50% - 5px); /* 50%宽度 - 一半的gap间距，避免换行 */
    box-sizing: border-box;
}

.foot-btn a.foot-btn {
    /* 移动端视觉+尺寸样式（对齐PC端配色） */
    padding: 0 8px;
    font-size: 14px;
    font-weight: 600; /* 字体加粗（和PC端一致） */
    margin: 0;
    width: 100%; /* 按钮占满li的宽度 */
    height: 32px;
    text-decoration: none;
    color: #fff; /* 文字白色（和PC端一致） */
    border-radius: 2px; /* 圆角（和PC端一致） */
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #007Fdd; /* 背景色（和PC端一致） */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 移动端悬浮/点击响应效果（和PC端一致） */
.foot-btn a.foot-btn:hover,
.foot-btn a.foot-btn:active {
    background: #005fa8;
    color: #fff;
}

    .footer-main {
        width: 100% ;
        display: flex ;
        flex-direction: column ;
        align-items: center ;
        gap: 5px ;
        padding: 0 ;
        margin: 0 ;
    }
    .footer-wechat {
        text-align: center ;
        margin: 0 ;
        padding: 0 ;
        width: 100% ;
    }
    .wechat-title {
        color: #ffffff ;
        margin: 0 0 8px 0 ;
        font-size: 14px ;
        padding: 0 ;
    }
    .wechat-img {
        width: 80px ;
        height: auto ;
        margin: 0 auto ;
        display: block ;
    }
    .footer-contact {
        text-align: center ;
        width: 100% ;
        margin: 0 ;
        padding: 0 ;
        color: #fff ;
    }
    .contact-phone {
        margin: 0 0 8px 0 ;
        font-size: 14px ;
        line-height: 1.2 ;
        color: #ff0 ;
    }
    .contact-address {
        margin: 0 0 8px 0 ;
        font-size: 12px ;
        line-height: 1.2 ;
        color: #fff ;
    }
    .contact-map {
    display: none !important; /* 强制隐藏，覆盖原有 display 样式 */
    /* 兜底：即使 display 失效，也通过其他属性隐藏 */
    visibility: hidden;
    height: 0;
    width: 0;
    margin: 0;
    padding: 0;
    }
    .map-img {
        width: 80px ;
        height: auto ;
    }
    .company-name {
        margin: 5px 0 0 0 ;
        font-size: 12px ;
        line-height: 1 ;
        color: #fff ;
    }
    .company-name a {
        color: #fff ;
        text-decoration: none ;
    }

    /* 全站通用容器适配 */
    #hotall {
        width: 100% ;
        padding: 0 15px ;
        margin: 0 ;
        max-width: 100vw ;
    }
    .hot_all_footer.container {
        padding: 10px ;
        max-width: 100vw ;
    }
}

/* ==============================================
   小屏手机（≤480px）全站通用适配
   ============================================== */
@media (max-width: 480px) {
    /* 全站logo小屏适配 */
    .logo {
        min-height: 60px ;
    }
    .logo a {
        min-height: 60px ;
        padding: 8px 0 ;
    }

    /* 全站footer小屏适配 */
    .wechat-img {
        width: 70px ;
    }
    .contact-phone {
        font-size: 13px ;
    }
    .contact-address {
        font-size: 11px ;
    }
    .map-img {
        width: 70px ;
    }
    .company-name {
        font-size: 11px ;
    }
}

/* ==============================================
   兜底（≥1300px）全站通用样式还原
   ============================================== */
@media (min-width: 1300px) {
    /* 全站通用隐藏元素还原 */
    #box1, .box1, .thumbnailwrapper2,
    .huaxu-client-wrapper,
    .yh-trust-footer.huaxu-client-inner,
    .yh-client-tagline,
    .yh-client-logos.huaxu-client-logos,
    .content-list-wrapper,
    .content-list-container,
    .content-grid,
    .content-card {
        display: block ;
        visibility: visible ;
        height: auto ;
        width: auto ;
        overflow: visible ;
        position: static ;
        top: auto ;
        left: auto ;
    }

    /* 全站logo PC端还原 */
    .logo {
        width: 180px ;
        height: 40px ;
        min-height: auto ;
    }
    .logo a {
        min-height: auto ;
        padding: 0 ;
        height: 40px ;
    }
}

/* ==============================================
   全局兜底样式（所有设备共用）
   ============================================== */
* {
    margin: 0 ;
    padding: 0 ;
    box-sizing: border-box ;
}
html {
    width: 100% ;
    overflow-x: hidden ;
}
body {
    position: relative ;
    width: 100% ;
    overflow-x: hidden ;
}