@charset "utf-8";
/* ============================================================
   analytics-cloud/analyticscloud.html (大数据分析云 · 概述) 移动端适配
   2026-09-15 —— 参考 sale-cloud/spot.html + analytics-cloud/analyticsfeatures.html
   ------------------------------------------------------------
   基础 CSS: change.css + pro-god.css (与 analyticsfeatures.html 同模板)

   本页独有:
     1) 顶部 banner 是「大图 + .pro-ding 绝对定位压图上」(同 chatter/
        prmcloud/platformcloud 结构):
          .pro-one(position:relative)
            > div > img analytics_04.jpg (990×456, 内联 width/height)
            > .pro-ding (position:absolute; width:990px; height:175px; bottom:0)
                > .back-bg.back-green  (#009a7e @ opacity .5)
                > .back-con (position:absolute; top:30px; left:40px) h3 + p>a.free-shi
        → 沿用已上线验证的「色块+文字压图」做法: 图固定 175px + object-fit:cover,
          .pro-ding 绝对定位贴底, .back-bg 撑满并继承 PC 品牌色, .back-con 回相对定位。
          banner 总高 ≈ 175px (改前是 图 + 图下文字块两段式)
     2) .ser_report「新闻报道」白条: 桌面 890px + 内联 height:160px,
        .report_L(640px/22px/行高40) + .report_R(250px) 双浮动 + 报道按钮
     3) .ser_solve「小型企业解决方案」: 桌面 890px + 内联 height:395px,
        .solve_left(450px) + .solve_right(440px) 双浮动;
        ⚠️ solve_right 内的 <p> 带内联 text-align:right;margin-right:-50px
           (靠它把 306×395 的图往右推出血) → 手机端必须重置, 否则右溢被裁
     4) .sale_title.analytics_bg / .analytics_bg1 / .analytics_bg2 = sprite 图标标题
        ⚠️ **关键**: 桌面 `.sale_title{height:50px;line-height:50px}` 让文字中心落在
           盒内 y=25; 而 analytics_bg.png(52×230) 的图标区间各 50px 高、起点
           y=1/59/119/178, 配上偏移 +1/-57/-117 ⇒ 图标中心恒在盒内 y=27。
           桌面这两者本来就对得上(差 2px)。
           手机端**绝不能只改 line-height 不改 height** (会变成文字贴盒顶、
           偏上约 18px, prmcloud/chatter 都踩过这个坑)
           → 这里 50/50 原样保留, 只收字号。
     5) 收尾 CTA 块 .cell-sale.font-color.border-no.back-green (#009a7e 青绿实底)
        + .sale-left 装饰图 bg-close-img-hi2.png (442×450, 上下共 131px 透明留白)
     6) 页脚: 2026-09-15 起改为全站标准 footer_sub.js 注入的深蓝页脚
        (旧版静态 .footer 已停用; 下方 .footer 规则保留作兜底, 万一回退仍可用)
     7) 隐藏: .div-dian SEO 轮播 / #footer 分页圆点 / #back-to-top / .qr_code_l
     8) .pro-right 左边框来自类 .bg_greentwo (#009a7e) → 可覆盖

   作用域: 全部规则在 @media (max-width: 768px) 内, 桌面端零影响。
   ============================================================ */

@media (max-width: 768px) {

  .pro-mes {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
    font-size: 13px !important;
  }

  .pro-mes .pro-left { display: none !important; }

  .pro-mes .pro-right {
    width: 100% !important;
    float: none !important;
    height: auto !important;
    margin-top: 10px !important;
    box-sizing: border-box !important;
  }
  /* 去掉 .bg_greentwo 的青绿左竖线 */
  .pro-mes .pro-right.bg_greentwo { border-left: none !important; }

  .pro-right .pro-two,
  .pro-mes .cell-sale,
  .clear-both {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  /* ---------- banner: 色块 + 文字压在图上 (对齐 PC 形态), 总高 ≈ 175px ---------- */
  .pro-mes .pro-right .pro-one {
    position: relative !important;
    width: 100% !important;
  }
  .pro-mes .pro-one > div:first-child {
    width: 100% !important;
    height: 175px !important;
    overflow: hidden !important;
    line-height: 0 !important;
  }
  .pro-mes .pro-one > div:first-child img {
    width: 100% !important;
    max-width: 100% !important;
    height: 175px !important;
    object-fit: cover !important;
    object-position: center 42% !important;
    display: block !important;
  }
  .pro-mes .pro-right .pro-ding {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: 0 !important;
    width: 100% !important;
    height: auto !important;
    background: none !important;
    padding: 0 !important;
    z-index: 11 !important;
  }
  /* 半透明色块 —— 与 PC 同源: .back-bg.back-green = #009a7e @ opacity .5
     (只撑满, 不覆盖色值, 让品牌色从 PC 类继承) */
  .pro-mes .pro-right .pro-ding .back-bg {
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  .pro-mes .pro-right .pro-ding .back-con {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 14px 16px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .pro-right .pro-ding .back-con h3 {
    color: #ffffff !important;
    font-size: 17px !important;
    line-height: 1.5 !important;
    margin: 0 0 10px !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
  }
  .pro-mes .pro-right .pro-ding .back-con p { color: #ffffff !important; margin: 0 !important; }
  /* 2026-09-15: banner 内的「免费试用」按钮隐藏 (移动端)。
     连同它所在的 <p> 一起隐藏, 否则空 <p> 仍占一行行高, 会把色块撑高。
     ⚠️ 只作用于 banner(.pro-ding .back-con, 该块内 <p> 仅此一个);
     页面底部收尾 CTA 的 .free-shi / .btn-block 保持显示。 */
  .pro-mes .pro-right .pro-ding .back-con .free-shi,
  .pro-mes .pro-right .pro-ding .back-con p {
    display: none !important;
  }

  /* ---------- .ser_report「新闻报道」白条 (890px + 内联 height:160px) ---------- */
  .pro-mes .pro-two .ser_report {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 16px !important;
    box-sizing: border-box !important;
  }
  .pro-mes .ser_report .report_L,
  .pro-mes .ser_report .report_R {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1.6 !important;
    box-sizing: border-box !important;
  }
  .pro-mes .ser_report .report_L {
    font-size: 14px !important;
    margin-bottom: 10px !important;
  }
  .pro-mes .ser_report .report_L p { margin: 0 0 4px !important; }
  .pro-mes .ser_report .report_R { text-align: left !important; }
  .pro-mes .ser_report .report_R .btn-block { margin: 0 !important; }

  /* ---------- 各内容块 ---------- */
  .pro-mes .cell-sale {
    padding: 16px !important;
    margin-bottom: 10px !important;
    box-sizing: border-box !important;
  }
  /* 内联 padding-bottom:50px 的 .clear-both → 收紧 */
  .pro-mes .cell-sale .clear-both[style*="padding-bottom"] { padding-bottom: 0 !important; }
  .pro-mes .cell-sale .clear-both { margin-top: 0 !important; }

  .cell-sale .sale-con {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  .cell-sale .sale-con.padding-px { padding: 14px 0 6px !important; }

  /* ---------- 产品行单列堆叠 ----------
     ⚠️ .sale-left 内联 width:500px / margin-top:50px (均非 !important) → 可覆盖;
        .no-potion 桌面 position:absolute → 必须回正常流 */
  .cell-sale .sale-left,
  .cell-sale .sale-right,
  .no-potion,
  .no-float {
    float: none !important;
    box-sizing: border-box !important;
  }
  .cell-sale .sale-left {
    position: static !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 12px !important;
    line-height: 0 !important;
  }
  .cell-sale .sale-left.no-potion {
    position: static !important;
    right: auto !important;
    top: auto !important;
  }
  .cell-sale .sale-left img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
  }
  .cell-sale .sale-right {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .cell-sale .sale-right .top-shou { margin-top: 0 !important; }

  .pro-mes img { max-width: 100% !important; height: auto !important; }

  /* ---------- 字号 / 间距收敛 ----------
     ⚠️ .sale_title 的 height/line-height 50px 必须保留: 它是文字中心落在
        y=25 (与图标中心 27 对得上) 的依据, 只收 font-size。 */
  .cell-sale h3,
  .cell-sale .top-shou h3,
  .cell-sale .sale_title {
    font-size: 15px !important;
    margin: 10px 0 8px !important;
    padding-top: 0 !important;
    color: #1c3d7a !important;
  }
  .cell-sale .sale-right p,
  .cell-sale p {
    font-size: 13px !important;
    line-height: 1.7 !important;
    margin: 0 0 8px !important;
  }
  .cell-sale h4 {
    font-size: 18px !important;
    line-height: 1.4 !important;
    margin: 0 0 10px !important;
  }
  /* .top-shou 默认 padding-bottom:50px → 手机端收紧, 避免块间空隙过大 */
  .cell-sale .top-shou { padding-bottom: 18px !important; }
  /* 「相关功能」文字链接 → 次级胶囊按钮 */
  .pro-mes .cell-sale a.video-color {
    display: inline-block !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    color: #0564F5 !important;
    background: #eef3ff !important;
    border: 1px solid #c9ddff !important;
    border-radius: 999px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  /* ---------- .ser_solve「小型企业解决方案」 (890px + 内联 height:395px) ---------- */
  .pro-mes .pro-two .ser_solve {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 16px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
  .pro-mes .ser_solve .solve_left,
  .pro-mes .ser_solve .solve_right {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .pro-mes .ser_solve .solve_left h3 {
    font-size: 17px !important;
    line-height: 1.4 !important;
    margin: 0 0 8px !important;
    color: #1c3d7a !important;
  }
  .pro-mes .ser_solve .solve_left p {
    font-size: 13px !important;
    line-height: 1.7 !important;
    margin: 0 0 10px !important;
  }
  /* ⚠️ 内联 text-align:right;margin-right:-50px 的 <p> → 重置, 否则图右溢被裁 */
  .pro-mes .ser_solve .solve_right p {
    text-align: center !important;
    margin: 0 !important;
    line-height: 0 !important;
  }
  .pro-mes .ser_solve .solve_right img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* ---------- 收尾 CTA 块 (.cell-sale.font-color.border-no.back-green) ---------- */
  .pro-mes .cell-sale.back-green { background: #009a7e !important; }
  .pro-mes .cell-sale.back-green .font-color,
  .pro-mes .cell-sale.back-green .sale-con h4,
  .pro-mes .cell-sale.back-green .top-shou p { color: #ffffff !important; }
  /* 装饰图 bg-close-img-hi2.png (442×450, 内容行 81~399, 上下共 131px 透明留白)
     → object-fit 按内容区开窗, 消掉多余的空白带 */
  .pro-mes .cell-sale.back-green .sale-left img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 442 / 319;
    object-fit: cover;
    object-position: center 62%;
  }
  /* 绿底上的按钮: 反白 */
  .pro-mes .cell-sale.back-green .btn-block {
    display: inline-block !important;
    padding: 10px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    background: #ffffff !important;
    color: #009a7e !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
    text-decoration: none !important;
    margin: 12px 0 0 !important;
    white-space: nowrap !important;
  }

  /* ---------- 按钮统一渐变胶囊 ---------- */
  .pro-mes .free-shi {
    display: inline-block !important;
    padding: 9px 22px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    color: #ffffff !important;
    background: linear-gradient(115deg, #0564F5 0%, #4a7bff 50%, #06bcd4 100%) !important;
    border: none !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 14px rgba(5, 100, 245, 0.28) !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    margin: 0 !important;
  }
  /* 青绿底上的「免费试用」(.free-shi) → 反白, 与 analyticsfeatures 的
     .btn-block 处理一致 (深蓝→青渐变落在 #009a7e 绿底上对比不足) */
  .pro-mes .cell-sale.back-green .top-shou .free-shi {
    background: #ffffff !important;
    color: #009a7e !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
  }

  /* ---------- 旧版静态页脚 .footer —— 2026-09-15 起已停用, 改为全站标准
     footer_sub.js (深蓝页脚 .cloud_footer_box)。
     本段规则**保留作兜底**: 若日后回退成静态 .footer, change.css 写死
     width:980px + height:66px + overflow:hidden, .footer p 也 float:left +
     width:980px → 390px 视口下整页横向溢出; 这些规则即整宽化处理。
     (.wrap 整宽化对 footer_sub.js 的注入同样有益, 不是死代码) */
  .wrap { width: 100% !important; overflow: visible !important; }
  .footer {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 14px 12px !important;
    background: none !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    margin: 10px 0 !important;
  }
  .footer p {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 6px !important;
    font-size: 12px !important;
    line-height: 1.7 !important;
    box-sizing: border-box !important;
  }
  .footer p a {
    display: inline-block !important;
    margin: 0 6px !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
    white-space: nowrap !important;
  }

  /* ---------- 隐藏固定悬浮 / 底部 SEO 长文 Tab 轮播 ----------
     ⚠️ #footer 是那个轮播的分页圆点 (在 .div-dian 内), 不是页面页脚 */
  .div-dian { display: none !important; }
  #footer { display: none !important; }
  #back-to-top { display: none !important; }
  .qr_code_l { display: none !important; }
}

/* end @media (max-width: 768px) */
