/* ===================================================================
   全站移动端样式（配合 xr-mobile.js）
   只在 ≤767px 生效，桌面端完全不介入
   =================================================================== */

/* 桌面端：移动端组件全部隐藏 */
.xr-tabbar,
.xr-mheader,
.xr-nav-mask,
.xr-nav-drawer-head,
.xr-tel-fab-wrap,
.xr-backtop {
    display: none;
}

/* ===================================================================
   手机端
   =================================================================== */
@media (max-width: 767px) {

    /* -----------------------------------------------------------------
       ① 隐藏桌面头部
       ----------------------------------------------------------------- */
    .xr-mhide {
        display: none !important;
    }

    /* -----------------------------------------------------------------
       ② 手机专用头部：左 logo + 右汉堡
       ----------------------------------------------------------------- */
    .xr-mheader {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 9990;
        height: 56px;
        padding: 0 16px;
        background: #fff;
        border-bottom: 1px solid #eef0f3;
        box-sizing: border-box;
        transition: box-shadow .28s, background .28s;
    }

    .xr-mheader.scrolled {
        box-shadow: 0 2px 14px rgba(31, 35, 41, .08);
    }

    .xr-mheader-brand {
        display: flex !important;
        align-items: center;
        flex: 0 1 auto;
        min-width: 0;
        max-width: calc(100% - 60px);
        text-decoration: none !important;
        height: 100%;
    }

    .xr-mheader-logo {
        max-height: 34px !important;
        width: auto !important;
        height: auto !important;
        display: block !important;
        object-fit: contain;
    }

    .xr-mheader-title {
        font-size: 16px;
        font-weight: 600;
        color: #1f2329;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* 汉堡按钮 */
    .xr-mheader-btn {
        flex: 0 0 auto;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        width: 42px;
        height: 42px;
        padding: 0;
        margin: 0 -8px 0 0;
        border: 0;
        background: transparent;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
    }

    .xr-mheader-btn span {
        display: block;
        width: 21px;
        height: 2px;
        border-radius: 2px;
        background: #2b3340;
        transition: transform .3s, opacity .2s;
    }

    body.xr-nav-open .xr-mheader-btn span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    body.xr-nav-open .xr-mheader-btn span:nth-child(2) {
        opacity: 0;
    }

    body.xr-nav-open .xr-mheader-btn span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    /* 顶栏占位，避免内容被遮挡 */
    body.xr-has-mheader {
        padding-top: 56px !important;
    }

    /* -----------------------------------------------------------------
       ③ 导航抽屉
       ----------------------------------------------------------------- */
    .xr-nav-drawer-head {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 10002;
        height: 56px;
        padding: 0 16px 0 20px;
        background: #fff;
        border-bottom: 1px solid #eef0f3;
        transform: translateX(-100%);
        transition: transform .32s cubic-bezier(.4, 0, .2, 1);
        box-sizing: border-box;
    }

    .xr-nav-drawer-head span {
        font-size: 15px;
        font-weight: 600;
        color: #1f2329;
    }

    .xr-drawer-close {
        width: 38px;
        height: 38px;
        border: 0;
        background: #f5f6f8;
        border-radius: 50%;
        font-size: 22px;
        line-height: 1;
        color: #5a6472;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
    }

    body.xr-nav-open .xr-nav-drawer-head {
        transform: translateX(0);
    }

    /* 抽屉主体 */
    .xr-nav-drawer {
        display: block !important;
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10001;
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 66px 0 40px !important;
        background: #fff !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        transform: translateX(-100%);
        transition: transform .32s cubic-bezier(.4, 0, .2, 1);
        box-sizing: border-box;
        list-style: none !important;
        border: 0 !important;
        float: none !important;
        box-shadow: none !important;
    }

    body.xr-nav-open .xr-nav-drawer {
        transform: translateX(0);
    }

    /* 一级项 */
    .xr-nav-drawer > li {
        display: block !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #f2f4f7 !important;
        position: static !important;
        background: none !important;
        text-align: left !important;
        height: auto !important;
        line-height: normal !important;
    }

    .xr-nav-drawer > li > a {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        width: 100% !important;
        min-height: 48px;
        padding: 13px 20px !important;
        margin: 0 !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
        color: #1f2329 !important;
        background: none !important;
        border: 0 !important;
        text-align: left !important;
        white-space: normal !important;
        height: auto !important;
        box-sizing: border-box;
        text-decoration: none !important;
    }

    .xr-nav-drawer > li > a:hover,
    .xr-nav-drawer > li.on > a,
    .xr-nav-drawer > li.active > a,
    .xr-nav-drawer > li.current > a {
        color: var(--xr-primary, #009aea) !important;
        background: #f7f9fc !important;
    }

    /* 二级菜单：一律展开显示 */
    .xr-nav-drawer > li > ul,
    .xr-nav-drawer > li > .dropdown-box,
    .xr-nav-drawer > li > .sub,
    .xr-nav-drawer > li > dl,
    .xr-nav-drawer .dropdown-box {
        display: block !important;
        position: static !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        background: #fafbfc !important;
        box-shadow: none !important;
        border: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        bottom: auto !important;
        float: none !important;
        overflow: visible !important;
    }

    .xr-nav-drawer > li > ul > li,
    .xr-nav-drawer .dropdown-box p,
    .xr-nav-drawer .dropdown-box li {
        display: block !important;
        float: none !important;
        width: 100% !important;
        margin: 0 !important;
        border: 0 !important;
        background: none !important;
    }

    .xr-nav-drawer > li > ul > li > a,
    .xr-nav-drawer .dropdown-box a,
    .xr-nav-drawer .sub a {
        display: block !important;
        padding: 11px 20px 11px 34px !important;
        font-size: 14.5px !important;
        color: #5a6472 !important;
        line-height: 1.5 !important;
        white-space: normal !important;
        height: auto !important;
        background: none !important;
        text-decoration: none !important;
    }

    .xr-nav-drawer > li > ul > li > a:hover,
    .xr-nav-drawer .dropdown-box a:hover {
        color: var(--xr-primary, #009aea) !important;
    }

    /* 抽屉里的装饰元素（箭头、竖线、图片）隐藏 */
    .xr-nav-drawer .arr,
    .xr-nav-drawer > li > a > i,
    .xr-nav-drawer > li > a > em {
        display: none !important;
    }

    /* 遮罩 */
    .xr-nav-mask {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 10000;
        background: rgba(15, 23, 35, .45);
    }

    body.xr-nav-open .xr-nav-mask {
        display: block !important;
    }

    body.xr-nav-open {
        overflow: hidden !important;
    }

    /* -----------------------------------------------------------------
       ④ 底部固定栏
       ----------------------------------------------------------------- */
    .xr-tabbar {
        display: flex !important;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 9989;
        height: 56px;
        padding-bottom: env(safe-area-inset-bottom);
        background: #fff;
        border-top: 1px solid #eceef1;
        box-shadow: 0 -2px 14px rgba(31, 35, 41, .07);
        box-sizing: content-box;
    }

    .xr-tabbar-item {
        flex: 1 1 0;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        color: #86909c !important;
        text-decoration: none !important;
        font-size: 11px !important;
        line-height: 1 !important;
        position: relative;
        -webkit-tap-highlight-color: transparent;
        transition: color .22s;
    }

    .xr-tabbar-item svg {
        width: 21px;
        height: 21px;
        display: block;
    }

    .xr-tabbar-item span {
        font-size: 11px !important;
        line-height: 1 !important;
    }

    .xr-tabbar-item.on {
        color: var(--xr-primary, #009aea) !important;
    }

    .xr-tabbar-item.on::after {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 22px;
        height: 2px;
        border-radius: 0 0 2px 2px;
        background: var(--xr-primary, #009aea);
    }

    body.xr-has-tabbar {
        padding-bottom: 60px !important;
    }

    /* -----------------------------------------------------------------
       ⑤ 悬浮拨号 + 回到顶部
       ----------------------------------------------------------------- */
    .xr-tel-fab-wrap {
        display: block !important;
        position: fixed;
        right: 16px;
        bottom: 72px;
        z-index: 9988;
    }

    .xr-tel-fab {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 46px;
        height: 46px;
        border-radius: 50%;
        background: var(--xr-primary, #009aea);
        color: #fff !important;
        box-shadow: 0 6px 20px rgba(0, 154, 234, .38);
        text-decoration: none;
    }

    .xr-tel-fab svg {
        width: 21px;
        height: 21px;
    }

    .xr-backtop {
        position: fixed;
        right: 16px;
        bottom: 128px;
        z-index: 9988;
        width: 40px;
        height: 40px;
        border: 1px solid #e6eaef;
        border-radius: 50%;
        background: #fff;
        color: #5a6472;
        box-shadow: 0 4px 16px rgba(31, 35, 41, .1);
        cursor: pointer;
        opacity: 0;
        visibility: hidden;
        transform: translateY(8px);
        transition: all .28s;
        padding: 0;
    }

    .xr-backtop.show {
        display: flex !important;
        align-items: center;
        justify-content: center;
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .xr-backtop svg {
        width: 17px;
        height: 17px;
    }

    /* -----------------------------------------------------------------
       ⑥ 内容完整显示（解决被截断/内滚动条）
       ----------------------------------------------------------------- */

    /* 常见的内容容器：放开 max-height / overflow */
    .xr-about-text,
    .xr-article-body,
    .xr-detail-body,
    .xr-case-body,
    .xr-prod-desc,
    .xr-news-side-desc,
    .xr-news-hero-body p,
    .about-text,
    .about-con,
    .intro,
    .desc,
    .summary,
    .abstract,
    .con,
    .content-text,
    .article-con,
    .detail-con {
        max-height: none !important;
        height: auto !important;
        overflow: visible !important;
        -webkit-line-clamp: unset !important;
        display: block !important;
    }

    /* 段落：允许完整换行 */
    .xr-about-text p,
    .about-text p,
    .intro p,
    .desc p,
    .content-text p {
        display: block !important;
        overflow: visible !important;
        -webkit-line-clamp: unset !important;
        max-height: none !important;
        text-indent: 0 !important;
    }

    /* 带内滚动条的容器 */
    [style*="overflow-y:scroll"],
    [style*="overflow-y: scroll"],
    [style*="overflow:scroll"],
    [style*="overflow: scroll"] {
        overflow: visible !important;
        max-height: none !important;
        height: auto !important;
    }

    [style*="max-height"] {
        max-height: none !important;
    }

    /* 卡片列表：折行 */
    .list, .items, .list-1, .list-2, .newsul, .picList,
    .case-list, .product-list, .news-list, .pro-list,
    .grid, .row, .cols {
        flex-wrap: wrap !important;
        height: auto !important;
        max-height: none !important;
    }

    /* banner：移动端铺满宽度，统一 200px 高、cover 裁剪，避免上下留灰边 */
    .banner, .slideBox, .swiper-off-container, .n_bann {
        height: auto !important;
        max-height: none !important;
        min-height: 0;
        overflow: hidden !important;
        background-size: cover !important;
        background-position: center !important;
    }

    .banner ul, .banner ul li {
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .banner img, .slideBox img, .swiper-off-container img {
        width: 100% !important;
        height: 200px !important;
        max-height: none !important;
        object-fit: cover !important;
        display: block !important;
    }

    /* bannerBox 是 section，会被下方全局 section 内边距规则命中，
       导致轮播图/内页背景图上下各出现 28px 灰边，这里显式清零 */
    section.bannerBox {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin: 0 !important;
        background: #fff !important;
    }

    .bannerBox .banner {
        margin: 0 !important;
        padding: 0 !important;
    }

    /* theme.css 中 .body{padding-top:1.4rem} 是为旧版 position:fixed 头部让位；
       现头部已改为 sticky（正常文档流），该让位空间成为 banner 上方的空白，这里清零 */
    .body {
        padding-top: 0 !important;
    }

    /* 内页侧栏标题（蓝色栏）右侧的展开/收起图标：
       原 FA 字形 \f13a/\f139 在字体子集中缺失，渲染为"口"，改为纯 CSS 箭头 */
    .w-com-menu .systitle .icon_menuControl {
        font-family: inherit !important;
        font-style: normal;
        line-height: 1 !important;
        text-indent: 0;
    }

    .w-com-menu .systitle .icon_menuControl:before {
        content: '' !important;
        display: block;
        width: 9px;
        height: 9px;
        border-right: 2px solid #fff;
        border-bottom: 2px solid #fff;
        transform: rotate(45deg);
        margin: 0 auto;
        font-family: inherit !important;
    }

    .w-com-menu .systitle.open .icon_menuControl:before {
        content: '' !important;
        transform: rotate(-135deg);
    }

    /* 浮动块取消 */
    .fr, .fl, .left, .right {
        float: none !important;
    }

    /* -----------------------------------------------------------------
       ⑦ 字号 / 间距
       ----------------------------------------------------------------- */
    body {
        font-size: 14px !important;
        line-height: 1.75 !important;
        overflow-x: hidden !important;
    }

    h1 { font-size: 21px !important; line-height: 1.4 !important; }
    h2 { font-size: 18px !important; line-height: 1.45 !important; }
    h3 { font-size: 16px !important; }

    /* 区块上下留白收紧 */
    section {
        padding-top: 28px !important;
        padding-bottom: 28px !important;
    }

    /* 页脚 */
    .footer, .foot {
        padding: 22px 0 18px !important;
    }

    .footer p, .foot p, .footer a, .foot a {
        font-size: 12.5px !important;
        line-height: 1.9 !important;
    }

    /* -----------------------------------------------------------------
       ⑧ 防溢出兜底
       ----------------------------------------------------------------- */
    html, body {
        overflow-x: hidden !important;
        max-width: 100% !important;
    }

    img, video, iframe, table, pre, figure {
        max-width: 100% !important;
    }

    /* 任意绝对定位超出右边界的修复 */
    [style*="width:1920px"],
    [style*="width: 1920px"] {
        width: 100% !important;
        max-width: 100% !important;
        left: 0 !important;
        right: auto !important;
    }
}

/* ===================================================================
   小屏（≤400px）
   =================================================================== */
@media (max-width: 400px) {
    .xr-mheader {
        height: 52px;
        padding: 0 12px;
    }

    .xr-mheader-logo {
        max-height: 30px !important;
    }

    .xr-tabbar-item span {
        font-size: 10px !important;
    }

    .xr-tabbar-item svg {
        width: 19px;
        height: 19px;
    }

    .xr-tel-fab {
        width: 42px;
        height: 42px;
    }

    .xr-backtop {
        width: 36px;
        height: 36px;
    }
}

/* ===================================================================
   横向溢出专项修复
   =================================================================== */

/* 桌面端也生效：防止被内联 min-width 撑破 */
html, body {
    max-width: 100%;
}

@media (max-width: 991px) {

    /* ---- 关键：干掉 body/html 上的最小宽度 ---- */
    html,
    body,
    .main,
    .wrapper,
    .wrap,
    .page,
    .layout,
    .container {
        min-width: 0 !important;
        width: auto !important;
        max-width: 100% !important;
    }

    /* ---- 内联 min-width 一律清零 ---- */
    [style*="min-width"],
    [style*="min-width"] {
        min-width: 0 !important;
    }

    /* ---- 内联固定宽度 700~1920px 全部收缩 ---- */
    [style*="width:700px"], [style*="width: 700px"],
    [style*="width:750px"], [style*="width: 750px"],
    [style*="width:800px"], [style*="width: 800px"],
    [style*="width:900px"], [style*="width: 900px"],
    [style*="width:950px"], [style*="width: 950px"],
    [style*="width:960px"], [style*="width: 960px"],
    [style*="width:980px"], [style*="width: 980px"],
    [style*="width:1000px"], [style*="width: 1000px"],
    [style*="width:1100px"], [style*="width: 1100px"],
    [style*="width:1200px"], [style*="width: 1200px"],
    [style*="width:1280px"], [style*="width: 1280px"],
    [style*="width:1400px"], [style*="width: 1400px"],
    [style*="width:1920px"], [style*="width: 1920px"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}

@media (max-width: 767px) {

    /* ---- 任何 grid 布局最多 2 列（防止 4/5 列卡片挤爆） ---- */
    [class*="grid"],
    [class*="list"],
    [class*="items"] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    /* 明确是单列语义的保持单列 */
    [class*="grid-1"],
    .xr-contact-grid {
        grid-template-columns: 1fr !important;
    }

    /* ---- 卡片 / 图片 ---- */
    [class*="card"],
    [class*="item"]:not(.owl-item) {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* ---- 表格 ---- */
    table {
        width: 100% !important;
        max-width: 100% !important;
        table-layout: fixed;
    }

    /* ---- 绝对定位的大块 ---- */
    [style*="position:absolute"],
    [style*="position: absolute"] {
        max-width: 100% !important;
    }

    /* ---- 允许横向滚动的容器（轮播、表格） ---- */
    .swiper-off-wrapper,
    .swiper-off-container,
    .slideBox,
    .marquee,
    .scroll-x {
        max-width: 100% !important;
        overflow: hidden !important;
    }

    /* ---- 修复后兜底：任何直接子元素不超出 ---- */
    body > * {
        max-width: 100% !important;
    }
}
/* ===================================================================
   老模板常见容器类名（yt_warp / xx_wrap / xx_box）手机自适应
   =================================================================== */
@media (max-width: 991px) {
    [class*="_warp"],
    [class*="-warp"],
    [class*="warp"],
    [class*="_wrap"]:not(.swiper-wrapper):not(.tempWrap):not(.owl-wrapper):not(.owl-wrapper-outer),
    [class*="-wrap"]:not(.swiper-wrapper):not(.tempWrap):not(.owl-wrapper):not(.owl-wrapper-outer),
    [class*="_box"],
    [class*="-box"],
    [class*="_con"],
    [class*="-con"],
    [class*="_main"],
    [class*="-main"],
    [class*="_inner"],
    [class*="-inner"] {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    /* 但带 padding 的容器保留内边距（轮播横向 wrapper 除外） */
    [class*="_warp"],
    [class*="warp"],
    [class*="_wrap"]:not(.swiper-wrapper):not(.tempWrap):not(.owl-wrapper):not(.owl-wrapper-outer) {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
}

@media (max-width: 767px) {
    /* 产品卡片：手机 2 列 */
    #yt_con4 .yt_con4_u ul,
    .pro-list,
    .pro-list ul,
    .product-list ul,
    .picList {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        display: grid !important;
        gap: 12px !important;
    }

    #yt_con4 .yt_con4_u li,
    .pro-list li,
    .product-list li,
    .picList li {
        width: auto !important;
        max-width: 100% !important;
        float: none !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* 图片撑满卡片 */
    #yt_con4 .yt_con4_u .pic,
    .pro-list li .pic,
    .product-list li .pic {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1;
        overflow: hidden;
    }

    #yt_con4 .yt_con4_u .pic img,
    .pro-list li .pic img,
    .product-list li .pic img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block;
    }
}
/* ===================================================================
   手机端：彻底隐藏电脑头部 / 页脚，只留手机专属
   =================================================================== */
@media (max-width: 767px) {

    /* ---- 电脑端头部（全部隐藏，由 .xr-mheader 接管） ---- */
    .yt_head,
    .yt-top,
    .yt-topbar,
    .site-header,
    .page-header,
    .header,
    .head,
    .topbar,
    #nav,
    .menuf,
    .nav-bar,
    .navbar,
    .nav-wrap,
    .top-nav,
    .header-wrap,
    [class*="_head"]:not(.xr-mheader),
    [class*="-head"]:not(.xr-mheader),
    [class*="topbar"] {
        display: none !important;
    }

    /* ---- 电脑端页脚（全部隐藏，避免和底部栏重复） ---- */
    #yt_footer,
    .footer,
    .foot,
    .yt_flink,
    .footer-link,
    .footer-nav,
    .footer-copy,
    .copyright,
    .footnav,
    .f_link,
    [class*="footer"]:not(.xr-tabbar),
    [class*="_footer"],
    [class*="-footer"] {
        display: none !important;
    }

    /* ---- 抽屉里的文字强制可见 ---- */
    .xr-nav-drawer,
    .xr-nav-drawer > li,
    .xr-nav-drawer > li > a,
    .xr-nav-drawer > li > a > span,
    .xr-nav-drawer > li > span,
    .xr-nav-drawer li a,
    .xr-nav-drawer li span,
    .xr-nav-drawer .dropdown-box a,
    .xr-nav-drawer .sub a {
        color: #1f2329 !important;
        background-color: transparent !important;
        background-image: none !important;
        text-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        height: auto !important;
        line-height: 1.5 !important;
        font-size: 16px !important;
        float: none !important;
        position: static !important;
        text-indent: 0 !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    .xr-nav-drawer > li > a:hover,
    .xr-nav-drawer li a:hover {
        color: var(--xr-primary, #009aea) !important;
        background-color: #f7f9fc !important;
    }

    /* 抽屉里 li 不要被固定高度压住 */
    .xr-nav-drawer > li {
        display: block !important;
        height: auto !important;
        min-height: 48px;
        border-bottom: 1px solid #f2f4f7 !important;
        background: none !important;
    }

    .xr-nav-drawer > li > a {
        display: flex !important;
        align-items: center;
        min-height: 48px;
        padding: 13px 20px !important;
    }

    /* 抽屉里隐藏装饰背景图 */
    .xr-nav-drawer li,
    .xr-nav-drawer a {
        background-image: none !important;
    }

    /* ---- 轮播：手机端保证可见 ---- */
    .xr-banner-off,
    .swiper-off-container {
        display: block !important;
        height: auto !important;
        min-height: 180px;
        max-height: 260px;
        overflow: hidden !important;
        background: #eef2f6;
    }

    .xr-banner-off .swiper-off-wrapper,
    .swiper-off-container .swiper-off-wrapper {
        display: flex !important;
        height: 100%;
    }

    .xr-banner-off .swiper-off-slide,
    .swiper-off-container .swiper-off-slide {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        position: relative;
        overflow: hidden;
    }

    .xr-banner-off .swiper-off-slide img,
    .swiper-off-container .swiper-off-slide img,

    /* 如果轮播用背景图 */
    .xr-banner-off .swiper-off-slide > a,

    /* 轮播标题条 */

    /* 分页 */


    /* 箭头隐藏 */
    .xr-banner-off-prev,

    /* ---- 底部栏留白（页脚已隐藏） ---- */
    body.xr-has-tabbar {
        padding-bottom: 60px !important;
    }
}
/* 轮播背景图兜底 */
@media (max-width: 767px) {
    .xr-banner-off .img-cover,
    .xr-banner-off .img-cover > span,
    .xr-banner-off .img-cover > a,
    .index-borad-1 .img-cover,
    .index-borad-1 .img-cover > span {
        display: block !important;
        width: 100% !important;
        height: 190px !important;
        min-height: 190px !important;
        background-size: cover !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
    }

    /* 轮播里的标题条 */
    .xr-banner-off .swiper-off-slide dl,
    .index-borad-1 .swiper-off-slide dl,
    .xr-banner-off .swiper-off-slide dd,
    .index-borad-1 .swiper-off-slide dd {
        position: absolute !important;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 !important;
        padding: 26px 14px 12px !important;
        background: linear-gradient(to top, rgba(0,0,0,.7), transparent) !important;
        color: #fff !important;
        font-size: 14px !important;
        text-align: left !important;
        z-index: 2;
    }

    .xr-banner-off .swiper-off-slide dt,
    .index-borad-1 .swiper-off-slide dt {
        display: none !important;
    }

    /* 轮播容器 */
    .xr-banner-off,
    .index-borad-1,
    .swiper-off-container {
        position: relative !important;
        height: 190px !important;
        min-height: 190px !important;
        max-height: 190px !important;
        overflow: hidden !important;
    }

    .xr-banner-off .swiper-off-wrapper,
    .index-borad-1 .swiper-off-wrapper {
        height: 190px !important;
    }

    .xr-banner-off .swiper-off-slide,
    .index-borad-1 .swiper-off-slide {
        height: 190px !important;
    }
}
/* ===================================================================
   轮播与内容图高度兜底（img 有 lazy / 父级无高度时不会塌陷）
   =================================================================== */
@media (max-width: 767px) {

    /* ---- 轮播：a 撑满 + img 固定高 ---- */
    .xr-banner-off .swiper-off-slide,
    .index-borad-1 .swiper-off-slide {
        position: relative !important;
        height: 190px !important;
        overflow: hidden !important;
    }

    .xr-banner-off .swiper-off-slide > a,
    .index-borad-1 .swiper-off-slide > a {
        display: block !important;
        width: 100% !important;
        height: 190px !important;
        line-height: 0 !important;
        position: relative;
    }

    .xr-banner-off .swiper-off-slide img,
    .index-borad-1 .swiper-off-slide img,

    /* 背景图形式 */
    .xr-banner-off .img-cover,
    .xr-banner-off .img-cover > span,
    .index-borad-1 .img-cover,
    .index-borad-1 .img-cover > span {
        display: block !important;
        width: 100% !important;
        height: 190px !important;
        background-size: cover !important;
        background-position: center !important;
    }

    /* ---- 新闻区：单列 + 大图固定高 ---- */
    .yt_con5_u {
        flex-direction: column !important;
        gap: 20px !important;
        height: auto !important;
    }

    .yt_con5_l {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        padding: 0 !important;
        background: none !important;
    }

    .yt_con5_img {
        display: block !important;
        width: 100% !important;
        height: 180px !important;
        overflow: hidden !important;
        border-radius: 8px;
    }

    .yt_con5_img img {
        display: block !important;
        width: 100% !important;
        height: 180px !important;
        object-fit: cover !important;
    }

    .yt_newsrt {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        height: auto !important;
        overflow: visible !important;
    }

    .yt_newsrt_txt {
        width: auto !important;
        float: none !important;
        flex: 1 1 auto;
        min-width: 0;
    }

    /* ---- 通用：内容区图片不塌陷 ---- */
    .yt_con1_r img,
    .aboutimg img,
    .about-img img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: 220px !important;
        object-fit: cover !important;
    }

    /* ---- 底部多余空白：收紧最后一个区块 ---- */
    .yt_con5,
    .yt_con1,
    #yt_con4 {
        padding-bottom: 32px !important;
    }

    /* 被隐藏元素的父容器不要留高度 */
    .xr-mhide {
        display: none !important;
    }
}
/* ===================================================================
   硬隐藏电脑头部（CSS 层，不依赖 JS）
   =================================================================== */
@media (max-width: 767px) {
    /* 377 及同类模板的头部容器 */
    .yt_head,
    .yt_head.yt_warp,
    .yt-top,
    .yt-topbar {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 明确是页脚的不显示 */
    #yt_footer,
    .yt_flink,
    .yt_footer,
    .yt_footer_c,
    .yt-footer-info,
    .yt-footer-copy {
        display: none !important;
        height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    /* ---- 轮播兜底背景（图片没加载时至少能看到色块） ---- */
    .xr-banner-off,
    .index-borad-1 {
        background: linear-gradient(135deg, var(--xr-primary, #009aea), #14618f) !important;
    }

    /* ---- 关于我们右侧图片 ---- */
    .yt_con1_r {
        display: block !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        margin-top: 18px !important;
    }

    .yt_con1_r img {
        display: block !important;
        width: 100% !important;
        height: 200px !important;
        max-height: 200px !important;
        object-fit: cover !important;
        border-radius: 10px;
    }

    /* ---- 关于我们主容器 ---- */
    .yt_con1 {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
        padding-top: 36px !important;
        padding-bottom: 36px !important;
    }

    .yt_con1_l {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
    }

    /* ---- 产品「更多」按钮图隐藏 ---- */
    .yt_con4_gd img {
        display: none !important;
    }
}
/* 补回：底部栏占位（之前被污染的选择器吃掉了） */
@media (max-width: 767px) {
    body.xr-has-tabbar {
        padding-bottom: 60px !important;
    }
}

/* 图片不超容器 */
img {
    max-width: 100%;
}
/* ===================================================================
   导航抽屉（改用 left 定位，不用 transform）
   =================================================================== */
@media (max-width: 767px) {

    /* 抽屉顶栏 */
    .xr-nav-drawer-head {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 10003 !important;
        height: 56px;
        padding: 0 16px 0 20px;
        background: #fff !important;
        border-bottom: 1px solid #eef0f3;
        /* 用 top 控制显隐，不用 transform */
        top: -60px;
        transition: top .3s cubic-bezier(.4, 0, .2, 1);
        box-sizing: border-box;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
    }

    body.xr-nav-open .xr-nav-drawer-head {
        top: 0;
    }

    .xr-nav-drawer-head span {
        font-size: 15px;
        font-weight: 600;
        color: #1f2329;
        transform: none !important;
    }

    /* 抽屉主体 */
    .xr-nav-drawer {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        left: -100% !important;          /* 移出屏幕左侧 */
        right: auto !important;
        bottom: auto !important;
        z-index: 10002 !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 100vh !important;
        min-height: 100vh !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 66px 0 40px !important;
        background: #fff !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;
        transition: left .3s cubic-bezier(.4, 0, .2, 1);
        box-sizing: border-box;
        list-style: none !important;
        border: 0 !important;
        float: none !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        box-shadow: none !important;
    }

    body.xr-nav-open .xr-nav-drawer {
        left: 0 !important;
    }

    /* 抽屉里的 li：绝对可见 */
    .xr-nav-drawer > li {
        display: block !important;
        float: none !important;
        clear: both !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 48px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #f2f4f7 !important;
        position: static !important;
        background: none !important;
        background-image: none !important;
        text-align: left !important;
        line-height: normal !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
        transform: none !important;
        list-style: none !important;
    }

    .xr-nav-drawer > li > a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 48px !important;
        padding: 14px 20px !important;
        margin: 0 !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
        color: #1f2329 !important;
        background: none !important;
        background-image: none !important;
        border: 0 !important;
        text-align: left !important;
        text-decoration: none !important;
        white-space: normal !important;
        text-indent: 0 !important;
        float: none !important;
        position: static !important;
        box-sizing: border-box;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
        transform: none !important;
    }

    .xr-nav-drawer > li > a > span {
        color: inherit !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
        display: inline !important;
        visibility: visible !important;
        opacity: 1 !important;
        background: none !important;
        transform: none !important;
    }

    .xr-nav-drawer > li > a:hover,
    .xr-nav-drawer > li.on > a,
    .xr-nav-drawer > li.active > a {
        color: var(--xr-primary, #009aea) !important;
        background: #f7f9fc !important;
    }

    /* 抽屉打开时盖住整屏 */
    body.xr-nav-open {
        overflow: hidden !important;
    }

    body.xr-nav-open .xr-nav-mask {
        display: block !important;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10001;
        background: rgba(15, 23, 35, .45);
    }
}
/* ===================================================================
   导航抽屉 v3（最终版）
   关闭方式：点顶部 ✕（汉堡变来的）/ 点遮罩 / 点任意导航项
   =================================================================== */
@media (max-width: 767px) {

    /* 手机头部永远在最上层，✕ 一定可点 */
    .xr-mheader {
        z-index: 10010 !important;
    }

    /* 抽屉顶栏不再需要（汉堡就在最上层） */
    .xr-nav-drawer-head {
        display: none !important;
    }

    /* 遮罩 */
    body.xr-nav-open .xr-nav-mask {
        display: block !important;
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10001 !important;
        background: rgba(15, 23, 35, .45) !important;
        transform: none !important;
    }

    /* 抽屉主体 */
    .xr-nav-drawer {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        left: -100% !important;
        right: auto !important;
        bottom: auto !important;
        z-index: 10002 !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: 100vh !important;
        min-height: 0 !important;
        max-height: 100vh !important;

        margin: 0 !important;
        padding: 56px 0 40px 0 !important;

        background: #fff !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        -webkit-overflow-scrolling: touch;

        transition: left .3s cubic-bezier(.4, 0, .2, 1);
        box-sizing: border-box;

        list-style: none !important;
        list-style-type: none !important;
        list-style-image: none !important;
        border: 0 !important;
        float: none !important;

        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        box-shadow: none !important;
        text-align: left !important;
        text-indent: 0 !important;
    }

    body.xr-nav-open .xr-nav-drawer {
        left: 0 !important;
    }

    /* 一级项 */
    .xr-nav-drawer > li {
        display: block !important;
        float: none !important;
        clear: both !important;
        position: static !important;

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: auto !important;
        min-height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        border-bottom: 1px solid #f2f4f7 !important;
        background: none !important;
        background-image: none !important;
        background-color: transparent !important;

        text-align: left !important;
        text-indent: 0 !important;
        line-height: normal !important;
        list-style: none !important;
        list-style-type: none !important;

        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
        transform: none !important;
    }

    .xr-nav-drawer > li > a {
        display: block !important;
        position: static !important;
        float: none !important;

        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 52px !important;

        margin: 0 !important;
        padding: 15px 22px !important;
        box-sizing: border-box;

        font-size: 16px !important;
        font-weight: 400 !important;
        line-height: 1.4 !important;
        color: #1f2329 !important;

        background: none !important;
        background-image: none !important;
        background-color: transparent !important;
        border: 0 !important;

        text-align: left !important;
        text-indent: 0 !important;
        text-decoration: none !important;
        white-space: normal !important;
        letter-spacing: normal !important;

        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
        transform: none !important;
    }

    .xr-nav-drawer > li > a > span {
        display: inline !important;
        color: inherit !important;
        font-size: inherit !important;
        line-height: inherit !important;
        background: none !important;
        text-indent: 0 !important;
        float: none !important;
        transform: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .xr-nav-drawer > li > a:hover,
    .xr-nav-drawer > li > a:active {
        background-color: #f7f9fc !important;
        color: var(--xr-primary, #009aea) !important;
    }

    /* 二级菜单展开 */
    .xr-nav-drawer > li > ul,
    .xr-nav-drawer > li > .dropdown-box,
    .xr-nav-drawer > li > .sub,
    .xr-nav-drawer > li > .dropdown {
        display: block !important;
        position: static !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fafbfc !important;
        border: 0 !important;
        box-shadow: none !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        list-style: none !important;
    }

    .xr-nav-drawer > li > ul > li,
    .xr-nav-drawer .dropdown-box li,
    .xr-nav-drawer .dropdown-box p {
        display: block !important;
        float: none !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: none !important;
        list-style: none !important;
    }

    .xr-nav-drawer > li > ul > li > a,
    .xr-nav-drawer .dropdown-box a {
        display: block !important;
        padding: 11px 22px 11px 38px !important;
        font-size: 14.5px !important;
        line-height: 1.4 !important;
        color: #5a6472 !important;
        text-decoration: none !important;
        background: none !important;
        white-space: normal !important;
        height: auto !important;
    }

    /* 隐藏装饰 */
    .xr-nav-drawer .arr,
    .xr-nav-drawer > li > a > i,
    .xr-nav-drawer > li > a > em,
    .xr-nav-drawer > li > a::before,
    .xr-nav-drawer > li > a::after {
        display: none !important;
        content: none !important;
    }

    /* 抽屉打开时禁止背景滚动 */
    body.xr-nav-open {
        overflow: hidden !important;
    }
}
/* 抽屉滚动条隐藏（移动端常见做法） */
@media (max-width: 767px) {
    .xr-nav-drawer {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .xr-nav-drawer::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    /* 抽屉底部多留一点，最后一项目不贴边 */
    .xr-nav-drawer > li:last-child {
        border-bottom: 0 !important;
    }
}
/* ===================================================================
   导航抽屉：兼容所有老模板
   问题：老模板导航普遍是
       .nav li { float: left; height: 45px; line-height: 45px; background: url(...) }
   搬进竖向抽屉后：浮动导致横排、固定高导致文字被顶出、背景图错位
   方案：对抽屉内所有层级统一清零（不管原模板用什么类名）
   =================================================================== */
@media (max-width: 767px) {

    /* ---- 清零：浮 / 高 / 行高 / 背景图 / 定位 ---- */
    .xr-nav-drawer li,
    .xr-nav-drawer li a,
    .xr-nav-drawer li span,
    .xr-nav-drawer li em,
    .xr-nav-drawer li i,
    .xr-nav-drawer dt,
    .xr-nav-drawer dd,
    .xr-nav-drawer dl,
    .xr-nav-drawer p,
    .xr-nav-drawer div {
        float: none !important;
        clear: both !important;
        position: static !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        line-height: 1.5 !important;
        text-indent: 0 !important;
        letter-spacing: normal !important;
        text-align: left !important;

        margin: 0 !important;
        background-image: none !important;
        background-color: transparent !important;
        background-repeat: no-repeat !important;

        overflow: visible !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        white-space: normal !important;
    }

    /* ---- 一级项：块级 + 分隔线 ---- */
    .xr-nav-drawer > li,
    .xr-nav-drawer > dl,
    .xr-nav-drawer > div {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 50px !important;
        padding: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #f2f4f7 !important;
    }

    /* ---- 一级链接：唯一负责内边距 ---- */
    .xr-nav-drawer > li > a,
    .xr-nav-drawer > dl > dt > a,
    .xr-nav-drawer > div > a {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 50px !important;
        padding: 14px 22px !important;
        font-size: 16px !important;
        font-weight: 400 !important;
        line-height: 1.4 !important;
        color: #1f2329 !important;
        background: none !important;
        border: 0 !important;
        text-decoration: none !important;
        white-space: normal !important;
    }

    /* ---- 二级 / 三级项 ---- */
    .xr-nav-drawer ul,
    .xr-nav-drawer ol,
    .xr-nav-drawer dl,
    .xr-nav-drawer .dropdown-box,
    .xr-nav-drawer .sub {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        background: #fafbfc !important;
        list-style: none !important;
        border: 0 !important;
        box-shadow: none !important;
        visibility: visible !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .xr-nav-drawer ul li,
    .xr-nav-drawer ol li,
    .xr-nav-drawer dl dd,
    .xr-nav-drawer .dropdown-box li,
    .xr-nav-drawer .dropdown-box p {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-bottom: 0 !important;
        background: none !important;
        list-style: none !important;
    }

    .xr-nav-drawer ul li a,
    .xr-nav-drawer ol li a,
    .xr-nav-drawer dl dd a,
    .xr-nav-drawer .dropdown-box a {
        display: block !important;
        width: 100% !important;
        padding: 11px 22px 11px 38px !important;
        font-size: 14.5px !important;
        line-height: 1.4 !important;
        color: #5a6472 !important;
        background: none !important;
        text-decoration: none !important;
        white-space: normal !important;
    }

    /* ---- span / em / i 保持行内，不破坏「文字 + 箭头」结构 ---- */
    .xr-nav-drawer li span,
    .xr-nav-drawer li em,
    .xr-nav-drawer li i,
    .xr-nav-drawer a span,
    .xr-nav-drawer a em {
        display: inline !important;
        width: auto !important;
        color: inherit !important;
        font-size: inherit !important;
        line-height: inherit !important;
        background: none !important;
    }

    /* ---- 隐藏装饰元素（下拉箭头、竖线、图标） ---- */
    .xr-nav-drawer .arr,
    .xr-nav-drawer .arrow,
    .xr-nav-drawer li > i,
    .xr-nav-drawer a > i,
    .xr-nav-drawer li > a::before,
    .xr-nav-drawer li > a::after,
    .xr-nav-drawer .icon,
    .xr-nav-drawer .hot,
    .xr-nav-drawer .new {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    /* ---- 悬停 / 当前项 ---- */
    .xr-nav-drawer > li > a:hover,
    .xr-nav-drawer > li > a:active,
    .xr-nav-drawer > li.on > a,
    .xr-nav-drawer > li.active > a,
    .xr-nav-drawer > li.current > a {
        color: var(--xr-primary, #009aea) !important;
        background-color: #f7f9fc !important;
    }

    .xr-nav-drawer > li > a:hover span,
    .xr-nav-drawer > li.on > a span {
        color: var(--xr-primary, #009aea) !important;
    }
}