/* responsive.css - 移动端响应式适配 */
/* 武汉天傲科技网站移动端自适应样式 */

/* ===== 全局响应式基础 ===== */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    width: 100%;
    overflow-x: hidden;
    max-width: 100%;
}

img {
    max-width: 100%;
    height: auto;
    -ms-interpolation-mode: bicubic;
}

table {
    width: 100% !important;
    table-layout: fixed;
    word-wrap: break-word;
    height: auto !important;
}

td[height] {
    height: auto !important;
}

/* 1x1像素分隔线图片保持原始高度，防止height:auto导致高度膨胀 */
img[height="1"] {
    height: 1px !important;
}

/* 保持蓝条间隔列宽度一致，确保"返回上级菜单"与栏目标题左对齐 */
td[width="18"] {
    width: 18px !important;
}

/* 竖直分隔线图片保持原始高度 */
img[width="1"][height="160"] {
    height: 160px !important;
}
img[width="1"][height="180"] {
    height: 180px !important;
}

/* ===== 修复白色竖直分隔线不显示 ===== */
/* 分隔线td使用content-box，1px宽度不被padding挤压 */
/* 匹配底部联系表的分隔线td 和 优势展示区的分隔线td */
table[bgcolor="#666666"] td[width="1"],
td[width="1"][bgcolor="#666666"] {
    box-sizing: content-box !important;
    padding: 0 !important;
    width: 1px !important;
    min-width: 1px !important;
}

/* 分隔线图片(lin-w.png)不受max-width限制 */
img[src*="lin-w"] {
    max-width: none !important;
    display: block !important;
}

/* 竖直分隔线图片保持1px宽度 */
img[src*="lin-w"][width="1"] {
    width: 1px !important;
}
img[src*="lin-w"][width="1"][height="160"] {
    height: 160px !important;
}
img[src*="lin-w"][width="1"][height="180"] {
    height: 180px !important;
}

/* ===== 大屏幕(>1024px) 保持原样 ===== */

/* ===== 平板端(768px-1024px) ===== */
@media screen and (max-width: 1024px) {
    table {
        width: 100% !important;
        table-layout: fixed;
        height: auto !important;
    }

    .banner {
        width: 100% !important;
        height: auto !important;
    }

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

    /* 导航栏适配 */
    table[width="100%"][height="30"] td {
        padding: 5px 2px !important;
        font-size: 14px !important;
    }

    /* 产品图片网格 */
    table[width="100%"][height="auto"] td {
        width: 50% !important;
        display: inline-block;
        float: left;
    }

    /* 底部联系信息区 - 保持三列布局 */
    table[width="100%"][height="180"][bgcolor="#666666"] td {
        padding: 8px !important;
        font-size: 13px !important;
    }

    /* 隐藏左右留白列 */
    table[width="100%"][height="180"][bgcolor="#666666"] td[width="10%"] {
        display: none !important;
    }

    /* 保持分隔线和分隔图片可见 */
    table[width="100%"][height="180"][bgcolor="#666666"] td[width="1"] {
        display: table-cell !important;
        box-sizing: content-box !important;
        padding: 0 !important;
        width: 1px !important;
        min-width: 1px !important;
    }

    table[width="100%"][height="180"][bgcolor="#666666"] img[width="1"] {
        max-width: none !important;
        width: 1px !important;
        height: 160px !important;
        display: block !important;
    }

    /* 客户展示区 */
    table[width="100%"][height="130"] td {
        width: 33% !important;
    }

    table[width="100%"][height="130"] img {
        max-width: 120px;
        height: auto;
    }
}

/* ===== 手机端(≤768px) ===== */
@media screen and (max-width: 768px) {
    body {
        font-size: 14px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 隐藏左右留白列 */
    table tr td:first-child[width="10%"],
    table tr td:last-child[width="10%"] {
        display: none !important;
        width: 0 !important;
    }

    table tr td:first-child[width="10%"] + td,
    table tr td:last-child {
        width: auto !important;
    }

    /* 保持间隔列(蓝条/空格)的18px宽度，确保"返回上级菜单"与栏目标题左对齐 */
    table tr td[width="18"] {
        width: 18px !important;
        min-width: 18px !important;
    }

    /* Logo区域 */
    table[width="100%"] td[width="40%"] {
        width: 100% !important;
        display: block;
        text-align: center !important;
    }

    table[width="100%"] td[width="40%"] img {
        max-width: 280px;
        height: auto;
    }

    /* 导航栏 */
    table[width="100%"][height="30"] tr {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }

    table[width="100%"][height="30"] td {
        width: auto !important;
        display: inline-block;
        padding: 5px 8px !important;
        font-size: 13px !important;
        float: none !important;
    }

    table[width="100%"][height="30"] td[width="25%"] {
        display: none !important;
    }

    /* Banner轮播 - 修复手机端图片下方空白 */
    .banner {
        width: 100% !important;
        height: 200px !important;
        object-fit: cover;
        display: block !important;
    }

    #nav-backgroud {
        height: 200px !important;
        max-height: 200px !important;
        overflow: hidden !important;
    }

    .swiper-container {
        height: 200px !important;
        max-height: 200px !important;
        overflow: hidden !important;
    }

    .swiper-wrapper {
        height: 200px !important;
        max-height: 200px !important;
        overflow: hidden !important;
    }

    .swiper-slide {
        width: 100% !important;
        height: 200px !important;
        overflow: hidden !important;
    }

    .swiper-slide img {
        width: 100% !important;
        height: 200px !important;
        object-fit: cover;
    }

    /* 产品中心标题 */
    .font-16G, .font-18G {
        font-size: 16px !important;
    }

    /* 产品图片网格 - 单列 */
    table[width="100%"][height="auto"] tr {
        display: block;
    }

    table[width="100%"][height="auto"] td {
        display: block;
        width: 90% !important;
        margin: 10px auto;
        float: none !important;
    }

    table[width="100%"][height="auto"] td img {
        max-width: 300px;
        height: auto;
    }

    /* 产品名称行 */
    table[width="100%"][height="20"] td {
        width: 50% !important;
        display: inline-block;
        font-size: 13px !important;
    }

    /* 公司简介 */
    .font-16B {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    /* 新闻列表 */
    table[width="100%"][height="20"] td[width="28%"] {
        width: 90% !important;
        display: block;
        padding: 4px 0;
        font-size: 13px !important;
    }

    table[width="100%"][height="20"] td[width="140"] {
        width: auto !important;
        display: block;
        text-align: left !important;
        font-size: 12px !important;
        padding-left: 20px !important;
    }

    table[width="100%"][height="20"] td[width="40"] {
        display: none !important;
    }

    table[width="100%"][height="20"] td img[width="8"] {
        display: none !important;
    }

    /* 优势展示区 */
    table[width="100%"][height="150"] td {
        width: 50% !important;
        display: inline-block;
        height: auto !important;
    }

    table[width="100%"][height="150"] td[width="1"] {
        display: none !important;
    }

    table[width="100%"][height="150"] td[bgcolor="#666666"] {
        height: auto !important;
    }

    .font-14W {
        font-size: 12px !important;
    }

    /* 客户展示 - 横向滚动 */
    table[width="100%"][height="130"] {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    table[width="100%"][height="130"] tr {
        display: inline-flex;
    }

    table[width="100%"][height="130"] td {
        display: inline-block !important;
        width: 100px !important;
        height: 100px !important;
    }

    table[width="100%"][height="130"] img {
        width: 80px !important;
        height: 80px !important;
    }

    /* 底部联系信息区 - 保持三列布局 */
    table[width="100%"][height="180"][bgcolor="#666666"] td {
        padding: 5px !important;
        font-size: 12px !important;
    }

    /* 隐藏左右留白列 */
    table[width="100%"][height="180"][bgcolor="#666666"] td[width="10%"] {
        display: none !important;
    }

    /* 保持分隔线和分隔图片可见 */
    table[width="100%"][height="180"][bgcolor="#666666"] td[width="1"] {
        display: table-cell !important;
        box-sizing: content-box !important;
        padding: 0 !important;
        width: 1px !important;
        min-width: 1px !important;
    }

    table[width="100%"][height="180"][bgcolor="#666666"] img[width="1"] {
        max-width: none !important;
        width: 1px !important;
        height: 160px !important;
        display: block !important;
    }

    /* 二维码图片缩小 */
    table[width="100%"][height="180"][bgcolor="#666666"] img[src*="wechart"] {
        width: 100px !important;
        height: auto !important;
    }

    /* 友情链接隐藏链接文字 */
    table[width="80%"] td {
        font-size: 12px !important;
    }

    /* 底部版权 */
    .font-14W {
        font-size: 12px !important;
    }

    /* 新闻图片 */
    table[width="100%"][height="auto"] td img[width="400px"] {
        width: 100% !important;
        max-width: 300px;
        height: auto !important;
    }

    /* 产品详情页相关商品网格 - 改为横向滚动 */
    table table[width="100%"] {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* 面包屑导航 */
    .breadcrumb {
        font-size: 12px !important;
        padding: 8px 10px !important;
    }
}

/* ===== 小屏手机(≤480px) ===== */
@media screen and (max-width: 480px) {
    body {
        font-size: 13px !important;
    }

    /* Logo缩小 */
    table[width="100%"] td[width="40%"] img {
        max-width: 200px;
        height: auto;
    }

    /* 导航文字更小 */
    table[width="100%"][height="30"] td {
        font-size: 12px !important;
        padding: 4px 6px !important;
    }

    /* 产品图片 */
    table[width="100%"][height="auto"] td img {
        max-width: 250px;
    }

    /* 新闻图片 */
    table[width="100%"][height="auto"] td img[width="400px"] {
        max-width: 250px;
    }

    /* Banner高度 - 修复小屏空白 */
    .banner,
    .swiper-slide img,
    #nav-backgroud,
    .swiper-container,
    .swiper-wrapper,
    .swiper-slide {
        height: 160px !important;
        max-height: 160px !important;
    }

    #nav-backgroud,
    .swiper-container,
    .swiper-wrapper,
    .swiper-slide {
        overflow: hidden !important;
    }

    /* 优势展示区 - 单列 */
    table[width="100%"][height="150"] td[width="19%"] {
        width: 100% !important;
    }

    /* 新闻列表项 */
    table[width="100%"][height="20"] td[width="28%"] {
        font-size: 12px !important;
    }

    .font-18B {
        font-size: 15px !important;
    }

    .font-16B {
        font-size: 13px !important;
    }
}

/* ===== 高清屏优化 ===== */
@media screen and (-webkit-min-device-pixel-ratio: 2),
       screen and (min-resolution: 2dppx) {
    img {
        image-rendering: -webkit-optimize-contrast;
    }
}

/* ===== 打印样式 ===== */
@media print {
    body {
        font-size: 12px;
    }

    .swiper-container,
    #nav-backgroud {
        display: none !important;
    }
}