/* common.css — 全局令牌/reset/header/footer/共享组件（跨页共用，不含任何 pd-/cyber/home 专属规则） */ :root{--blue:#0176c3;--blue-d:#0266a8;--navy:#00285A;--ink:#333;--sub:#666;--line:#E5E7EB;--bg:#fff;--bg2:#F7F9FB;--maxw:1440px} *{box-sizing:border-box;margin:0;padding:0} body{font-family:Arial,"Helvetica Neue",Helvetica,"Microsoft YaHei","PingFang SC",sans-serif;color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased} a{text-decoration:none;color:inherit} .wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px} /* ===== 头部视觉重心对齐（#052）===== LOGO 放大到 48px 后头部撑到 84px，但导航/按钮/语言切换器未同步， 导致语言切换器仅 27px、按钮 40px，在 84px 内上下留白失衡、右侧偏弱。 现以 84px 为基准统一放大三处，使头部视觉重心居中、各控件量级匹配。 */ .hdr{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)} .hdr-in{display:flex;align-items:center;gap:28px;height:84px} .logo{display:flex;align-items:center} /* LOGO 等比放大（#050）：height 48 / width auto —— SVG viewBox 340.9×124.4 自带等比， 只锁高度即可保证宽高等比缩放，实测渲染 131.5×48px */ .logo-svg{display:block;height:48px;width:auto} .logo b{font-size:20px;color:var(--navy);font-weight:700} .logo i{font-size:11px;color:var(--sub);font-style:normal;letter-spacing:1px} .nav{display:flex;align-items:center;gap:26px;position:relative} .nav a{font-size:16px;color:var(--ink);padding:8px 0;border-bottom:2px solid transparent;position:relative} .nav .drop{align-self:stretch;display:flex;align-items:center} .nav a:hover,.nav a.on{color:var(--blue);border-bottom-color:var(--blue)} /* 导航下拉菜单 */ .nav .drop{position:relative} /* #093 导航「产品矩阵」下拉箭头：原为文字「▾」(11px)，改用给定 SVG 并放大到 16px （与导航字号一致，约为原文字箭头高度的 2.5 倍）； 颜色用 currentColor，随链接文字同步（常态 --ink，悬停/当前页 --blue）。 ⚠️ ≤980 移动端导航要把该箭头隐藏，见下方媒体查询。 */ .nav .drop> a{display:inline-flex;align-items:center} .nav .drop> a> svg.icon{width:16px;height:16px;flex:0 0 auto;margin-left:5px;fill:currentColor} .nav .drop-menu{display:none;position:absolute;top:100%;left:-12px;background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.10);min-width:180px;padding:8px 0;z-index:30} .nav .drop:hover .drop-menu{display:block} .nav .drop-menu a{display:block;padding:9px 18px;font-size:14px;border-bottom:none;color:var(--ink)} .nav .drop-menu a:hover{background:var(--bg2);color:var(--blue)} /* 头部右侧控件与 84px 头部对齐（#052）：按钮 40→44px、语言切换器 27→34px */ .hdr-r{margin-left:24px;display:flex;align-items:center;gap:14px} .hdr-r .btn{padding:11px 22px;font-size:15px} .lang-switch{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:999px;overflow:hidden;font-size:14px;line-height:1} .lang-switch button{border:0;background:transparent;color:var(--sub);padding:8px 15px;cursor:pointer;font:inherit} .lang-switch button.on{background:var(--blue);color:#fff;font-weight:700} .nav-wrap{display:flex;align-items:center;margin-left:auto;gap:24px} .nav-toggle{display:none;cursor:pointer;font-size:22px;line-height:1;color:var(--navy);padding:7px 11px;border:1px solid var(--line);border-radius:6px;user-select:none;background:#fff} .navchk{display:none} .btn{display:inline-block;padding:9px 20px;font-size:14px;font-weight:700;border-radius:4px;cursor:pointer} .btn-solid{background:var(--blue);color:#fff} .btn-solid:hover{background:var(--blue-d)} .btn-ghost{background:#fff;color:var(--blue);border:1px solid var(--blue)} .hero{background:linear-gradient(120deg,var(--blue) 0%,#0a5fa0 70%,var(--navy) 100%);color:#fff;padding:84px 0} .hero .wrap{display:flex;align-items:center;gap:48px} .hero-copy{flex:1} .tag{font-size:13px;letter-spacing:2px;color:#cfe6f7;text-transform:uppercase} .hero h1{font-size:44px;line-height:1.2;margin:14px 0 16px;font-weight:800} .hero p{font-size:17px;color:#e6f1fb;max-width:540px} .hero p.slogan{font-size:22px;color:#fff;letter-spacing:4px;font-weight:700;max-width:none;margin-top:2px} .hero-acts{display:flex;gap:14px;margin-top:28px} /* 深色 Hero 内的 ghost 按钮反白（#051）：原选择器 `.hero-acts .btn-ghost` 未锚定深色容器， 会误伤浅色区块里复用 .hero-acts + .btn-ghost 组合的按钮（如 MarketPro 产品优势区的 「联系客服」）——它们落在 #F7F9FB 浅底上被强制成白字白边，近乎不可见。 现锚定到深色容器 .hero / .cta / .op-banner，仅对真正深底场景反白。 */ .hero .hero-acts .btn-ghost,.cta .hero-acts .btn-ghost{color:#fff;border-color:rgba(255,255,255,.6);background:transparent} /* 平台实力（Hero 三大数据上移统领层）浅色版 */ .strength-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:0;background:linear-gradient(135deg,#eef6fc 0%,#e3f0fa 100%);border:1px solid #d4e6f4;border-radius:10px;overflow:hidden;margin-bottom:36px} .sb{position:relative;padding:34px 24px;text-align:left;color:var(--ink);border-right:1px solid #d4e6f4} .sb:last-child{border-right:0} .sb::before{content:"";position:absolute;top:30px;left:24px;transform:none;width:30px;height:3px;background:var(--blue);border-radius:2px;opacity:.9} .sb .n{font-size:40px;font-weight:800;color:var(--blue);letter-spacing:-.5px;margin-top:18px;line-height:1} .sb .l{font-size:14px;color:var(--sub);margin-top:10px;line-height:1.5} .sb .ey{font-size:12px;letter-spacing:2px;color:var(--blue);text-transform:uppercase;font-weight:700} .sec{padding:64px 0} .sec.alt{background:var(--bg2)} .sec-h{margin-bottom:28px} .ey{font-size:13px;font-weight:700;letter-spacing:2px;color:var(--blue);text-transform:uppercase} .sec-h h2{font-size:30px;color:var(--navy);margin:8px 0 6px;font-weight:800} .sec-h p{color:var(--sub);max-width:640px} .sec-h p.flow{max-width:none} /* 核心数据指标：2行×3列，标题在上、数字在下，带设计感 */ .metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} .metric{position:relative;padding:26px 24px 24px;border:1px solid var(--line);border-radius:8px;background:#fff;overflow:hidden;transition:.18s;display:flex;flex-direction:column} .metric:hover{border-color:var(--blue);box-shadow:0 10px 30px rgba(1,118,195,.12);transform:translateY(-2px)} .metric::before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--blue);opacity:.85} .metric .idx{position:absolute;top:18px;right:22px;font-size:13px;font-weight:800;color:#EAEFF4;line-height:1} .metric .l{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:12px;letter-spacing:.5px;padding-right:30px} .metric .n{font-size:38px;font-weight:800;color:var(--blue);letter-spacing:-1px;line-height:1;margin-top:auto} .metric .u{font-size:12px;color:var(--sub);margin-top:8px;line-height:1.5;font-weight:500} .m-note{text-align:center;color:var(--sub);font-size:13px;margin-top:14px} .pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} .pcard{border:1px solid var(--line);border-radius:6px;padding:22px;background:#fff;transition:.18s;display:flex;flex-direction:column} .pcard:hover{border-color:var(--blue);box-shadow:0 8px 24px rgba(1,118,195,.12)} .pcard .en{font-size:18px;font-weight:800;color:var(--navy)} .pcard .cn{font-size:13px;font-weight:700;color:var(--blue);margin:2px 0 10px} .pcard .pos{font-size:13px;color:var(--sub);min-height:54px} .pcard .dt{font-size:12px;font-weight:700;color:var(--ink);background:var(--bg2);padding:8px 10px;border-radius:4px;margin:12px 0} /* 第8格「了解更多」卡片：视觉区分（淡蓝底+虚线边框） */ .pcard.pcard-cta{background:linear-gradient(135deg,#f0f7ff 0%,#e8f4fd 100%);border-color:#b8d9f0;border-style:dashed;position:relative;overflow:hidden} .pcard.pcard-cta::before{content:"";position:absolute;top:-20px;right:-20px;width:60px;height:60px;background:rgba(1,118,195,.06);border-radius:50%} .pcard.pcard-cta::after{content:"";position:absolute;bottom:-15px;left:-10px;width:40px;height:40px;background:rgba(1,118,195,.05);border-radius:50%} .pcard.pcard-cta:hover{border-color:var(--blue);box-shadow:0 8px 24px rgba(1,118,195,.16)} .pcard.pcard-cta .en{color:var(--blue)} .pcard.pcard-cta .cn{color:var(--blue-d)} .pcard.pcard-cta .more{color:var(--blue)} .pcard .more{margin-top:auto;font-size:13px;font-weight:700;color:var(--blue)} .two{display:grid;grid-template-columns:1fr 1fr;gap:18px} /* SOLUTIONS 拆分为两个独立板块（数据定制 / 咨询服务） */ .caps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:6px} .cap{border:1px solid var(--line);border-radius:8px;padding:18px 18px;background:#fff;transition:.18s} .cap:hover{border-color:var(--blue);box-shadow:0 6px 16px rgba(1,118,195,.12)} .cap b{display:block;font-size:15px;color:var(--navy);margin-bottom:6px} .cap span{color:var(--sub);font-size:13px;line-height:1.5} /* ---- 咨询服务：中心六边形 + 6 子卡 环绕式 ---- */ /* 环绕定位：中间列上下 + 左右各2，统一朝中心侧加粗蓝条 */ /* 合作机构与客户 Logo 墙（通栏灰底 + 白卡，一类一排） */ .partners{padding:0} .partners-h{text-align:center;margin-bottom:34px} .partners-h .ey{font-size:13px;font-weight:700;letter-spacing:2px;color:var(--blue);text-transform:uppercase} .partners-h h2{font-size:30px;color:var(--navy);margin:8px 0 6px;font-weight:800} .partners-h p{color:var(--sub);font-size:14px} .pcat{margin-top:26px} .pcat+.pcat{margin-top:30px;padding-top:28px;border-top:1px dashed #cbd9e6} /* 分类标题：中文在上、英文在下、居中 */ .pcat-h{text-align:center;margin-bottom:16px} .pcat-h .pt{display:inline-block;font-size:17px;font-weight:700;color:var(--blue);letter-spacing:1px;position:relative;padding:0 10px;max-width:100%;overflow-wrap:anywhere} .pcat-h .pt::before,.pcat-h .pt::after{content:"";position:absolute;top:50%;width:12px;height:1px;background:var(--blue);opacity:.5} .pcat-h .pt::before{left:-12px} .pcat-h .pt::after{right:-12px} .pcat-h .ps{display:block;font-size:11px;color:var(--sub);margin-top:3px;letter-spacing:.5px;font-weight:500} /* 卡片：品牌色块 + 企业全名 + 英文小字（横排三段式） */ /* 牌墙列数契约（#118）：按张数选列、每行排满、不留孤卡 —— 5 张 → 5 列(264px)、7 张 → 5 列(264px)、11 张 → 6 列(217px)。 若再增减卡片数，须同步改此处列数，否则会出现「N+1」孤卡。 */ .pgrid-logo{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:14px} .pgrid-logo.five{grid-template-columns:repeat(5,1fr)} .pgrid-logo.park{display:flex;flex-wrap:wrap;justify-content:center;gap:14px} /* #118 产业园区：7 家 → 5 个/行（5+2），卡片宽度 333→264px，与上方各分类的 5 列卡一致 */ .pgrid-logo.park .plogo{flex:0 0 calc(100%/5 - 12px)} /* 政府/高校机构墙：11 家排两排 → 6 个/行，卡片 217px（张数最多，唯一保持 6 列的分类） */ .pgrid-logo.park.gov-2row .plogo{flex:0 0 calc(100%/6 - 12px)} .plogo{display:flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);border:1px solid #dfe7ef;border-radius:7px;padding:10px 14px;min-height:64px;font-size:13px;color:var(--ink);font-weight:600;transition:.18s;text-align:center;line-height:1.25;box-shadow:0 1px 3px rgba(15,42,80,.06)} .plogo:hover{border-color:var(--blue);box-shadow:0 6px 18px rgba(1,118,195,.16);transform:translateY(-2px)} /* #143 牌墙改 logo 展示：图片按卡片宽度等比铺满（源图统一 400x173，比例 2.31） */ .plogo img{display:block;width:100%;max-width:100%;height:auto} .plogo .li{width:28px;height:28px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:12px;flex:none;letter-spacing:0} /* #141 徽标文字留白：3/4 字符在 12px 下会顶到/溢出 28px 色块 → 分级降字号 + 轻度收字距 */ .plogo .li.li3{font-size:10px;letter-spacing:-.4px} .plogo .li.li4{font-size:9px;letter-spacing:-.7px} .plogo .ln{min-width:0;text-align:left} .plogo .ln small{display:block;font-size:10px;color:var(--sub);font-weight:500;letter-spacing:.3px;margin-top:1px} .plogo-gov{background:linear-gradient(135deg,#fdfaf2,#fbf5e6);border-color:#ead9a8} .plogo-gov:hover{border-color:#c9a14a;box-shadow:0 6px 16px rgba(180,135,40,.20)} /* 政府/高校机构墙：沿用与下方「生物医药产业园区」一致的 .park 横排卡片（flex 居中、约 25%/卡、整组居中）；仅保留金色底区分品类，卡片本身为横排（徽标左+名称左对齐）。#057 的竖排居中已撤销。 */ .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} .stat{border-left:3px solid var(--blue);padding:6px 16px} .stat .n{font-size:28px;font-weight:800;color:var(--navy)} .stat .l{font-size:13px;color:var(--sub)} .cta{background:var(--navy);color:#fff;padding:56px 0;text-align:center} .cta h2{font-size:26px;margin-bottom:10px} .cta p{color:#bcd0e6;margin-bottom:24px} .cta .hero-acts{justify-content:center} .ftr{background:#2B2F36;color:#9CA0A8;padding:48px 0 16px;font-size:13px} /* #071 padding-bottom 24 -> 16 */ .ftr-cols{display:flex;gap:40px;flex-wrap:wrap} /* #078 桌面恢复「最初宽度」铺满，撤销 #076 的收窄居中；收窄只保留在 <=980 适配态 */ .fcol{flex:1;min-width:160px} /* #078 恢复最初的等分铺满（撤销 #076 的 flex:0 1 auto）*/ .fcol h4{color:#E8EAED;font-size:14px;margin-bottom:16px;font-weight:700} .fcol a{display:block;color:#9CA0A8;font-size:13px;margin-bottom:10px;text-decoration:none} .fcol a:hover{color:#fff} /* 关于我们：两列链接（左=药渡简介/加入我们/联系我们/意见反馈，右=服务协议/隐私声明/广告声明/友情链接） */ .fcol-links{display:flex;gap:22px;margin-top:2px} .fcol-col{flex:1;min-width:0;display:flex;flex-direction:column} .fcol p{color:#9CA0A8;line-height:1.7;margin-bottom:6px} .fqr{text-align:center;margin-top:4px} .fqr img{width:120px;height:120px;border-radius:6px;background:#fff;padding:6px} .fqr span{font-size:12px;display:block;margin-top:6px;color:#9CA0A8} .fcontact .tel{font-size:20px;color:#E8EAED;font-weight:700;margin-bottom:8px} .fcontact .email{color:#9CA0A8} .fb-t{border-top:1px solid #3C4045;margin-top:32px;padding-top:20px;text-align:center;font-size:12px;color:#6B707A;line-height:2} /* 子页专用 */ .subhero{background:var(--bg2);border-bottom:1px solid var(--line);padding:48px 0} .subhero .en{font-size:14px;font-weight:700;letter-spacing:2px;color:var(--blue)} .subhero h1{font-size:38px;color:var(--navy);margin:8px 0;font-weight:800} .subhero .pos{font-size:17px;color:var(--sub);max-width:680px} .subhero .hero-acts .btn-ghost:hover{background:var(--blue);color:#fff;border-color:var(--blue)} .block{padding:48px 0} .block.alt{background:var(--bg2)} .block h2{font-size:24px;color:var(--navy);margin-bottom:18px;font-weight:800} /* 数据优势 一行四列卡片（主蓝标题栏 + 星标，文字可折行、卡片等高） */ .adv{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} .adv .a{border:1px solid var(--line);border-radius:6px;background:#fff;overflow:hidden;transition:.18s;display:flex;flex-direction:column} .adv .a:hover{border-color:var(--blue);box-shadow:0 8px 24px rgba(1,118,195,.10)} .adv .head{background:var(--blue);color:#fff;padding:10px 14px;display:flex;align-items:center;gap:6px;font-size:15px;font-weight:700;line-height:1.4;flex-wrap:wrap} .adv .head .star{color:#FFC940;font-size:13px;flex:0 0 auto} .adv .head .no{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.22);color:#fff;font-size:12px;font-weight:800;margin-right:6px;flex:0 0 auto} .adv .d{padding:14px;font-size:13px;color:var(--ink);line-height:1.8;flex:1;word-break:break-word} .adv-group{display:flex;gap:40px;align-items:center;margin-top:44px} .adv-group:first-of-type{margin-top:32px} .adv-ghead{flex:0 0 260px;display:flex;flex-direction:column;align-items:center;text-align:center;margin:0;padding:0;border:0} .adv-gno{display:inline-flex;align-items:center;justify-content:center;min-width:76px;height:76px;border-radius:20px;background:var(--blue);color:#fff;font-size:44px;font-weight:800;line-height:1;margin-bottom:16px;box-shadow:0 8px 20px rgba(1,118,195,.18)} .adv-gno svg{width:42px;height:42px;display:block} .adv-gno-cn{font-size:46px;line-height:1} /* 英文态：长单词（Knowledge / Insight…）字号略小并加左右内边距，避免撑满徽标、文字贴边 */ html[lang="en"] .adv-gno-cn{font-size:32px;padding:0 18px;letter-spacing:.2px} .adv-gtxt .ey{font-size:12px;letter-spacing:2px} .adv-gtxt h3{font-size:22px;color:var(--navy);font-weight:800;margin-top:4px;line-height:1.3} .adv-grid{flex:1;min-width:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px} .adv-group.rev{flex-direction:row-reverse} .adv-group.rev .adv-ghead{display:flex;flex-direction:column;align-items:center} .adv-group.rev .adv-gtxt{text-align:center} .adv2{background:#fff;border:1px solid var(--line);border-radius:12px;padding:24px 22px 26px;transition:.2s} .adv2:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(1,118,195,.14);border-color:var(--blue)} .adv2-no{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:24px;padding:0 8px;border-radius:6px;background:rgba(1,118,195,.10);color:var(--blue);font-size:13px;font-weight:800;margin-bottom:14px} .adv2 h4{font-size:17px;color:var(--navy);font-weight:700;margin-bottom:9px;line-height:1.45} .adv2 p{font-size:13.5px;color:var(--sub);line-height:1.75} .feat{display:grid;grid-template-columns:repeat(2,1fr);gap:16px} .feat .f{border:1px solid var(--line);border-radius:6px;padding:18px;background:#fff} .feat .f b{color:var(--blue)} .dtable{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden} .dtable th,.dtable td{border-bottom:1px solid var(--line);padding:12px 16px;text-align:left;font-size:14px} .dtable th{background:var(--bg2);color:var(--navy);font-weight:700} .dtable td .n{font-weight:800;color:var(--blue)} .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px} .col{border:1px solid var(--line);border-radius:6px;padding:18px;background:#fff} .col b{color:var(--navy)} /* 相关产品：标题与卡片文字全项目居中（#014） */ /* 频道页：团队/顾问卡片 */ /* 频道页：资质荣誉 */ /* 频道页：咨询方向（长文本双列） */ /* 角色细分场景列内列表 */ .col ul{margin:8px 0 0;padding-left:18px} .col ul li{font-size:13px;color:var(--sub);line-height:1.7;margin-bottom:4px} /* ===== 子页内容呈现增强（#0072）===== 仅补充「语义化标签 + 要点化排版」所需样式，不新增配色/字体/图形元素： h3 沿用原 b 标签的 16px/700 与配色；卡片、边框、圆角、间距全部沿用既有组件。 */ .block .lede{color:var(--sub);max-width:880px;font-size:15px;line-height:1.8} .feat .f h3,.col h3{font-size:16px;font-weight:700;line-height:1.5;margin:0} .feat .f h3{color:var(--blue)} .col h3{color:var(--navy)} .f-cap{display:block;font-size:13px;font-weight:700;color:var(--navy);margin:6px 0 10px;line-height:1.5} .col .f-cap{color:var(--blue)} .feat .f ul{margin:8px 0 0;padding-left:18px} .feat .f ul li{font-size:13px;color:var(--sub);line-height:1.75;margin-bottom:4px} .adv .d b{display:block;color:var(--blue);font-size:12.5px;letter-spacing:.3px;margin-bottom:6px} .dtable caption{caption-side:bottom;text-align:left;font-size:13px;color:var(--sub);padding-top:10px;line-height:1.7} .dtable tbody th{background:#fff;font-weight:400;color:var(--ink)} @media(max-width:980px){.adv-group{flex-direction:column;gap:18px}.adv-ghead{flex:0 0 auto}.adv-group.rev .adv-ghead{align-items:center}.adv-group.rev .adv-gtxt{text-align:center}.adv-grid{grid-template-columns:repeat(2,1fr)}} @media(max-width:640px){.adv-grid{grid-template-columns:1fr}.adv-gno{min-width:56px;height:56px;font-size:32px;border-radius:16px}.adv-gno svg{width:30px;height:30px}} @media(max-width:980px){.metrics{grid-template-columns:repeat(2,1fr)}.strength-bar{grid-template-columns:1fr}.sb{border-right:0;border-bottom:1px solid #d4e6f4;text-align:left}.sb:last-child{border-bottom:0}.sb::before{left:24px;transform:none}.pgrid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}.hero .wrap{flex-direction:column;align-items:flex-start}.two,.feat,.cols{grid-template-columns:1fr}.adv{grid-template-columns:repeat(2,1fr)}.nav-toggle{display:block}.nav-wrap{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:0;padding:6px 0;display:none;box-shadow:0 8px 24px rgba(0,0,0,.08)}.navchk:checked ~ .nav-wrap{display:flex}.nav{display:flex;flex-direction:column;gap:0;margin-left:0}.nav a{padding:13px 20px;border-bottom:1px solid var(--line)}.nav .drop{position:static}.nav .drop-menu{position:static;display:none;box-shadow:none;border:none;border-radius:0;min-width:0;padding:0}.nav .drop:hover .drop-menu{display:none}.nav .drop> a> svg.icon{display:none}.hdr-r{margin-left:0;padding:12px 20px}.ftr-cols{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:20px 18px;align-items:start;justify-content:center} /* #076 列贴合内容 + 整体居中 / #077 迁至 .ftr-cols */.ftr .fcol{min-width:0}.ftr .fcol-links{gap:16px}.ftr .fqr{margin-top:0}.ftr .fqr img{width:96px;height:96px}.fb-t{width:100%;margin-top:20px;text-align:left} /* #077 脱离 grid，不再撑宽列轨道 */.pgrid-logo{grid-template-columns:repeat(4,1fr)}.pgrid-logo.five{grid-template-columns:repeat(3,1fr)}.pgrid-logo.park .plogo{flex:0 0 calc(33.333% - 10px)}.caps{grid-template-columns:repeat(2,1fr)}} @media(max-width:480px){.ftr-cols{gap:18px 14px}.ftr .fqr img{width:88px;height:88px}.ftr .fcol-links{gap:12px}.ftr .fcol h4{margin-bottom:12px}.ftr{overflow-wrap:anywhere}} /* #076 窄屏防长邮箱/链接被裁切 */ @media(max-width:1180px){.pgrid-logo{grid-template-columns:repeat(6,minmax(0,1fr))}} @media(max-width:980px){.pgrid-logo{grid-template-columns:repeat(5,minmax(0,1fr))}} @media(max-width:760px){.pgrid-logo{grid-template-columns:repeat(4,minmax(0,1fr))}.pgrid-logo.five{grid-template-columns:repeat(2,1fr)} /* #118 窄屏牌墙：flex 版 5/6 列在窄屏不可读 → 与 grid 版对齐，园区/政府机构一并降档 */ .pgrid-logo.park .plogo,.pgrid-logo.park.gov-2row .plogo{flex:0 0 calc(100%/3 - 10px)}} @media(max-width:520px){.pgrid-logo{grid-template-columns:repeat(3,minmax(0,1fr))}.pgrid-logo.park .plogo,.pgrid-logo.park.gov-2row .plogo{flex:0 0 calc(50% - 7px)}.caps{grid-template-columns:1fr}} @media(max-width:400px){.pgrid-logo{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:640px){.adv,.metrics,.pgrid,.stats{grid-template-columns:1fr}} @media(max-width:640px){.block .lede{font-size:14px}} /* 窄屏：稠环骨架降级为规则六边形网格（隐藏键线层） */ @media(max-width:980px){ .cyber .mol{position:static;width:auto;height:auto;max-width:680px;margin:24px auto 10px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px} .cyber .mol-bonds{display:none} .cyber .mn{position:relative;left:auto !important;top:auto !important;width:100%;height:auto;aspect-ratio:165/190;margin:0} .cyber .mn .hb{padding:0 18px} } /* 数据表在窄屏强制固定布局，避免 min-content 撑破 375px 视口（#038 关于我们页 .dtable 溢出修复） */ @media(max-width:640px){ .dtable{table-layout:fixed} .dtable th,.dtable td{word-break:break-word;overflow-wrap:anywhere;font-size:13px;padding:10px 12px} } /* ===== #068 禁毒宣传悬浮浮窗（全站，可关闭） ===== */ .ad-pop{display:none;position:fixed;right:20px;bottom:20px;width:340px;max-width:calc(100vw - 32px); background:#C8102E;border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.26); padding:14px 14px 16px;z-index:900;font-size:14px} .ad-pop.show{display:block} .ad-pop-h{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:11px} .ad-pop-t{color:#fff;font-size:16px;font-weight:800;letter-spacing:.5px;line-height:1.3} .ad-pop-x{flex:0 0 auto;background:none;border:0;padding:0 2px;margin:-2px -2px 0 0;color:#fff; font-size:20px;line-height:1;cursor:pointer;opacity:.88;font-family:inherit} .ad-pop-x:hover{opacity:1} .ad-pop-x:focus-visible{outline:2px solid #fff;outline-offset:2px;border-radius:4px} .ad-pop-b{display:flex;flex-direction:column;gap:8px;max-height:min(330px,50vh);overflow-y:auto; -webkit-overflow-scrolling:touch} .ad-pop-i{display:block;background:#fff;color:#C8102E;font-size:13.5px;font-weight:700; line-height:1.55;padding:11px 13px;border-radius:9px;text-decoration:none;transition:.16s; overflow-wrap:anywhere} .ad-pop-i:hover{box-shadow:0 4px 14px rgba(0,0,0,.20);transform:translateY(-1px)} .ad-pop-i:focus-visible{outline:2px solid #fff;outline-offset:2px} @media(max-width:640px){ .ad-pop{right:10px;left:10px;bottom:10px;width:auto;max-width:none;padding:12px 12px 14px} .ad-pop-t{font-size:15px} .ad-pop-b{max-height:38vh} .ad-pop-i{font-size:13px;padding:10px 12px} } /* ===== #069 页脚「禁毒宣传」入口（图标 + 文字，紧扣数据邮箱下方） ===== 注意：.fcol a 权重为 (0,1,1)，故此处用 .ftr .f-ad (0,2,0) 覆盖其 display/color 等。 */ .ftr .f-ad{display:inline-flex;align-items:center;gap:7px;margin:10px 0 0;padding:5px 11px 5px 9px; border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#E8EAED;font-size:13px; font-weight:600;line-height:1;text-decoration:none; transition:background .18s,border-color .18s,color .18s} .ftr .f-ad:hover{background:rgba(200,16,46,.18);border-color:rgba(226,59,82,.65);color:#fff} .ftr .f-ad .f-ad-ico{flex:0 0 auto;width:16px;height:16px;display:block;color:#E23B52} .ftr .f-ad:hover .f-ad-ico{color:#FF5A72} .ftr .f-ad:focus-visible{outline:2px solid #E23B52;outline-offset:2px} /* ============================================================ #079 数据定制页（复刻 data.pharmacodia.com/opendata 的「数据定制服务」） 仅新增布局样式；配色、字号、圆角、边框全部沿用既有变量与 .block/.cap 组件。 tab 切换用纯 CSS（radio + :checked），不新增 JS。 ============================================================ */ #od-overview,#od-solve,#od-core,#od-flow,#od-after{scroll-margin-top:88px} /* 锚点导航 */ .od-nav{background:#fff;border-bottom:1px solid var(--line)} .od-nav .wrap{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;padding-top:14px;padding-bottom:14px} .od-nav a{font-size:14px;font-weight:700;color:var(--navy);text-decoration:none} .od-nav a:hover{color:var(--blue)} /* 通用 tab：input 与 .od-tabnav / .od-panes 必须是 .od-tabs 的直接子元素 */ .od-tabs>input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0} .od-tabnav{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px} .od-tabnav>label{display:inline-block;padding:9px 20px;border:1px solid var(--line);border-radius:999px; background:#fff;font-size:14px;font-weight:700;color:var(--navy);cursor:pointer;transition:.18s;white-space:nowrap} .od-tabnav>label:hover{border-color:var(--blue);color:var(--blue)} .od-pane{display:none} .od-tabs>input:nth-of-type(1):checked~.od-tabnav>label:nth-of-type(1), .od-tabs>input:nth-of-type(2):checked~.od-tabnav>label:nth-of-type(2), .od-tabs>input:nth-of-type(3):checked~.od-tabnav>label:nth-of-type(3), .od-tabs>input:nth-of-type(4):checked~.od-tabnav>label:nth-of-type(4), .od-tabs>input:nth-of-type(5):checked~.od-tabnav>label:nth-of-type(5), .od-tabs>input:nth-of-type(6):checked~.od-tabnav>label:nth-of-type(6){ background:var(--blue);border-color:var(--blue);color:#fff} .od-tabs>input:nth-of-type(1):checked~.od-panes>.od-pane:nth-child(1), .od-tabs>input:nth-of-type(2):checked~.od-panes>.od-pane:nth-child(2), .od-tabs>input:nth-of-type(3):checked~.od-panes>.od-pane:nth-child(3), .od-tabs>input:nth-of-type(4):checked~.od-panes>.od-pane:nth-child(4), .od-tabs>input:nth-of-type(5):checked~.od-panes>.od-pane:nth-child(5), .od-tabs>input:nth-of-type(6):checked~.od-panes>.od-pane:nth-child(6){display:block} /* 竖向 tab（解决方案：左方案名 / 右内容） */ .od-tabs.vert{display:grid;grid-template-columns:minmax(180px,232px) minmax(0,1fr);gap:26px} .od-tabs.vert>.od-tabnav{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:8px;margin-bottom:0} .od-tabs.vert>.od-tabnav>label{border-radius:6px;text-align:left;padding:12px 16px;white-space:normal} .od-tabs.vert>.od-panes{min-width:0} /* 数据概览：分类卡片（5 大类，桌面端尽量排满一行，避免出现「4+1」锯齿空行） */ .od-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:16px;align-items:start} .od-cat{border:1px solid var(--line);border-radius:8px;background:#fff;padding:18px} .od-cat>b{display:block;font-size:15px;font-weight:700;color:var(--navy); padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--line)} .od-cat ul{list-style:none;margin:0;padding:0} .od-cat li{display:flex;justify-content:space-between;align-items:baseline;gap:10px; font-size:13px;color:var(--ink);line-height:1.6;padding:3px 0} .od-cat li>span{min-width:0;overflow-wrap:anywhere} .od-cat li>em{font-style:normal;font-weight:700;color:var(--blue);flex:0 0 auto} /* 解决方案：左 tab 右内容 */ .od-svc{display:flex;flex-direction:column;gap:18px} .od-svc-i>b{display:block;font-size:13px;font-weight:700;color:var(--blue);letter-spacing:.3px;margin-bottom:6px} .od-svc-i>span{font-size:13.5px;color:var(--sub);line-height:1.75} /* 核心特征：3 列 + 2 列（卡片沿用 .cap） */ .od-core{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .od-core.two{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px} .od-core .cap{display:block} /* 服务流程：5 步 */ .od-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px} .od-step{border:1px solid var(--line);border-radius:8px;background:#fff;padding:20px 18px} .od-step-n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%; background:rgba(1,118,195,.10);color:var(--blue);font-size:14px;font-weight:800;margin-bottom:12px} .od-step>b{display:block;font-size:15px;color:var(--navy);margin-bottom:8px} .od-step>span:last-child{font-size:13px;color:var(--sub);line-height:1.7} /* 售后服务：每项含「服务内容 / 服务标准」两段（对齐原站 dd 的双段结构） */ .caps.od-after{grid-template-columns:repeat(2,minmax(0,1fr))} .od-as{margin:0} .od-as dt{font-size:12px;font-weight:700;color:var(--blue);letter-spacing:.3px;margin:0 0 4px} .od-as dt+dd{margin:0 0 12px} .od-as dd{margin:0;font-size:13px;color:var(--sub);line-height:1.7} .od-as dd:last-child{margin-bottom:0} /* 窄屏适配 */ @media(max-width:1199px){ .od-cats{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))} .od-flow{grid-template-columns:repeat(3,minmax(0,1fr))} } @media(max-width:980px){ .od-tabs.vert{grid-template-columns:minmax(0,1fr);gap:18px} .od-tabs.vert>.od-tabnav{flex-direction:row;flex-wrap:wrap;gap:10px} .od-tabs.vert>.od-tabnav>label{border-radius:999px;text-align:center;padding:9px 18px} .od-core{grid-template-columns:repeat(2,minmax(0,1fr))} .od-flow{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:640px){ .od-cats{grid-template-columns:minmax(0,1fr)} .od-core,.od-core.two,.od-flow{grid-template-columns:minmax(0,1fr)} .caps.od-after{grid-template-columns:minmax(0,1fr)} .od-nav .wrap{gap:10px 18px} .od-nav a{font-size:13px} } /* ===== #080 药渡咨询页（consulting.html）：核心数据 / 服务网格 / 客户 tab / 团队 ===== */ /* 核心数据：源站为 3 项，覆盖 .stats 的 4 列默认（同权重，靠追加在末尾取胜） */ .cs-stats{grid-template-columns:repeat(3,minmax(0,1fr))} /* 我们的服务：10 张卡沿用 .cap，列宽下限 228px 与 .od-cats 保持一致 */ .cs-svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(228px,1fr));gap:16px;align-items:stretch} .cs-svc{display:flex;flex-direction:column} .cs-svc-i{display:block;width:42px;height:auto;margin:0 0 10px} .cs-svc b{line-height:1.45} .cs-svc-l{list-style:none;margin:6px 0 0;padding:0} .cs-svc-l li{position:relative;padding:3px 0 3px 14px;font-size:13px;color:var(--sub);line-height:1.55;overflow-wrap:anywhere} .cs-svc-l li:before{content:"";position:absolute;left:0;top:11px;width:5px;height:5px;background:var(--blue);border-radius:50%;opacity:.75} /* 代表客户：纯 CSS tab 复用 .od-tabs；logo 列数对齐源站节奏 （源站实测 1440 下每行 6 个、图 165x82、行距 22；10 个 = 6+4） */ .cs-tabs{margin-top:6px} .cs-logos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px} .cs-logo{display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px 16px;min-height:106px} .cs-logo img{display:block;width:100%;max-width:165px;height:auto} /* 咨询团队：3 张卡沿用 .cap + .od-as */ @media(max-width:1199px){ .cs-logos{grid-template-columns:repeat(4,minmax(0,1fr))} } @media(max-width:980px){ .cs-logo{padding:10px 14px;min-height:92px} } /* 「2,000,000,000+」在 3 列下需 ~215px，窄于 820 会溢出 → 提前回落单列 */ @media(max-width:820px){ .cs-stats{grid-template-columns:minmax(0,1fr)} .cs-logos{grid-template-columns:repeat(3,minmax(0,1fr))} } @media(max-width:640px){ .cs-stats{grid-template-columns:minmax(0,1fr)} .cs-svc-grid{grid-template-columns:minmax(0,1fr)} .cs-svc-i{width:36px;height:auto} .cs-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .cs-logo{min-height:76px;padding:8px 10px} } /* EN 态标签显著更长（Large Pharmaceutical Enterprises ≈ 268px）， .od-tabnav>label 是 nowrap，窄屏会撑破容器 → 本页 tab 允许折行。 作用域限定 .cs-tabs，不影响其他页的通用 tab。 */ @media(max-width:480px){ .cs-tabs .od-tabnav>label{white-space:normal;text-align:center;padding:8px 14px;font-size:13px} } @media(max-width:380px){ .cs-logos{grid-template-columns:minmax(0,1fr)} } /* ===== #081 关于我们页：官网 About 八板块复刻 ===== */ /* 锚点避让固定导航（与数据定制页同口径 88px） */ #intro,#contact,#terms,#privacy,#ad,#links{scroll-margin-top:88px} /* 加入我们 —— 职位表：原生
折叠，无 JS 依赖，文本始终在 DOM 内 */ /* 联系方式 meta（加入我们 / 意见反馈 共用） */ /* 联系我们 —— 公司信息 + 位置图 */ .contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:28px;align-items:start;margin-bottom:26px} .contact-grid .od-as{margin:0} .map{margin:0} .map img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:#fff} /* 意见反馈 —— 留言板表单（静态站点，提交走邮件客户端） */ /* 法务长文（服务协议 / 隐私声明 / 广告声明）——中文原文为法定准据，EN 态保留中文并加说明句 */ .legal-note{max-width:920px;margin:0 0 20px;padding:12px 14px;background:var(--bg2); border-left:3px solid var(--blue);border-radius:0 6px 6px 0; font-size:13px;color:var(--sub);line-height:1.75} .legal{max-width:920px} .legal h3{font-size:17px;color:var(--navy);line-height:1.5;margin:26px 0 10px} .legal h3:first-child{margin-top:0} .legal h4{font-size:15px;color:var(--navy);line-height:1.5;margin:18px 0 8px} .legal p{font-size:14px;color:var(--sub);line-height:1.9;margin:0 0 10px;overflow-wrap:anywhere} .legal a{color:var(--blue)} /* 友情链接 —— 6 条固定 3 列（3+3 齐整，不用 auto-fill 免出锯齿行） #097：列宽封顶 370px（用户指定，先 350 后调 370）。用 minmax(0,370px) 而不是写死 370px —— 容器不够宽时自然收缩、**永不溢出**；≥1206px 时内容区（视口−64）≥1142，三列恰好各 370px， 与 1206 以下的自适应列宽无缝衔接，因此**一个断点都不需要**。 justify-content:center 是为了与同样居中的 h2「友情链接」对齐（要左对齐把 center 换成 start）。 ⚠️ 必须改在这条基础规则里，**不能**另加 `body.pg-about .fl-grid` 覆盖： 媒体查询不提升优先级，作用域规则(0,2,0)会盖掉下面 ≤980/≤640 的两条自适应规则(0,1,0)。 */ .fl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,370px));justify-content:center;gap:16px} .fl{display:grid;grid-template-columns:80px minmax(0,1fr);grid-template-rows:auto auto; gap:3px 14px;align-items:center;padding:14px 16px;background:#fff; border:1px solid var(--line);border-radius:8px;text-decoration:none} .fl img{grid-row:1/3;width:80px;height:80px;border-radius:6px} .fl b{font-size:14px;color:var(--navy);align-self:end;line-height:1.4} .fl span{font-size:12px;color:var(--sub);line-height:1.55;align-self:start;overflow-wrap:anywhere} .fl:hover{border-color:var(--blue)} .fl:hover b{color:var(--blue)} @media(max-width:980px){ .contact-grid{grid-template-columns:minmax(0,1fr);gap:22px} .fl-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:640px){ .fl-grid{grid-template-columns:minmax(0,1fr);gap:12px} .fl{grid-template-columns:64px minmax(0,1fr);padding:12px} .fl img{width:64px;height:64px} .legal h3{font-size:16px;margin:22px 0 8px} .legal p{font-size:13px;line-height:1.85} } /* ===== #082 数据定制页：区块标题居中 + 数据概览照官网版式重做 ===== ⚠️ 页面级覆盖一律追加在 common.css 末尾（同权重靠源码顺序取胜，#080 教训）。 ⚠️ 用 body.pg-od 限定作用域，避免波及其它 10 页。 */ .pg-od .block h2{text-align:center} .pg-od .block .lede{text-align:center;margin-left:auto;margin-right:auto} /* —— 页头 hero（DATA CUSTOMIZATION / 数据定制 / 描述 / 两个按钮）整体居中 —— */ .pg-od .subhero{text-align:center} .pg-od .subhero .pos{margin-left:auto;margin-right:auto} .pg-od .subhero .hero-acts{justify-content:center} /* —— 锚点导航条（数据概览 / 解决方案 / 核心特征 / 服务流程 / 售后服务）居中 —— */ .pg-od .od-nav .wrap{justify-content:center} /* —— 数据概览：整行深蓝 tab 栏（5 等分、标签居中、选中项浅蓝斜边）—— */ .od-tabs.ov .od-tabnav{--slant:17px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0; margin:0;background:#2968EE;border-radius:4px 4px 0 0;overflow:hidden} .od-tabs.ov .od-tabnav>label{display:block;padding:20px 12px;border:0;border-radius:0;background:transparent; color:#fff;font-size:16px;font-weight:700;line-height:1.2;text-align:center;white-space:nowrap; cursor:pointer;transition:background .18s,color .18s} .od-tabs.ov .od-tabnav>label:hover{background:rgba(255,255,255,.12);color:#fff} .od-tabs.ov>input:nth-of-type(1):checked~.od-tabnav>label:nth-of-type(1), .od-tabs.ov>input:nth-of-type(2):checked~.od-tabnav>label:nth-of-type(2), .od-tabs.ov>input:nth-of-type(3):checked~.od-tabnav>label:nth-of-type(3), .od-tabs.ov>input:nth-of-type(4):checked~.od-tabnav>label:nth-of-type(4), .od-tabs.ov>input:nth-of-type(5):checked~.od-tabnav>label:nth-of-type(5), .od-tabs.ov>input:nth-of-type(6):checked~.od-tabnav>label:nth-of-type(6){ background:linear-gradient(90deg,#52AFE4 0%,#4482F9 100%);color:#fff; clip-path:polygon(0 0,calc(100% - var(--slant)) 0,100% 100%,0 100%)} /* —— 数据概览：浅灰面板 + 分组标题 + 内联数据列表（面板内一律左对齐，与官网截图一致）—— */ .od-tabs.ov .od-panes{background:#F4F5FA;border-radius:0 0 4px 4px;padding:36px 24px 40px;text-align:left} .od-tabs.ov .od-cats{display:block} .od-tabs.ov .od-cat{border:0;border-radius:0;background:transparent;padding:0;margin:0 0 66px} .od-tabs.ov .od-cat:last-child{margin-bottom:0} .od-tabs.ov .od-cat>b{display:block;font-size:16px;font-weight:700;color:#2C3E4F; padding:0;border:0;margin:0 0 24px;text-align:left} .od-tabs.ov .od-cat ul{display:flex;flex-wrap:wrap;justify-content:flex-start;column-gap:29px;row-gap:44px} .od-tabs.ov .od-cat li{display:inline-flex;align-items:baseline;justify-content:flex-start;gap:0;padding:0; font-size:15px;font-weight:400;color:#666;line-height:1.6;white-space:nowrap} .od-tabs.ov .od-cat li>span{overflow-wrap:normal;white-space:nowrap} .od-tabs.ov .od-cat li>em{font-style:normal;font-weight:400;color:#2968EE;margin-left:6px} .od-tabs.ov .od-cat li>em:first-child{color:#666;margin:0 6px 0 0} @media (max-width:980px){ .od-tabs.ov .od-tabnav{--slant:13px} .od-tabs.ov .od-tabnav>label{padding:16px 8px;font-size:15px} .od-switch .od-nav .wrap>label{padding:12px 0;font-size:13px} .od-tabs.ov .od-panes{padding:28px 18px 32px} .od-tabs.ov .od-cat{margin-bottom:52px} .od-tabs.ov .od-cat ul{column-gap:24px;row-gap:36px} } @media (max-width:640px){ .od-tabs.ov .od-tabnav{--slant:9px} .od-tabs.ov .od-tabnav>label{padding:14px 6px;font-size:13px;white-space:normal;line-height:1.25} .od-tabs.ov .od-panes{padding:22px 12px 26px} .od-tabs.ov .od-cat{margin-bottom:40px} .od-tabs.ov .od-cat>b{font-size:15px;margin-bottom:18px} .od-tabs.ov .od-cat ul{column-gap:18px;row-gap:26px} .od-tabs.ov .od-cat li{font-size:14px} } /* —— 锚点导航改为「切换 tab」：点击就地切换内容，不做锚点跳转（纯 CSS，零 JS）—— */ .od-switch>input{position:fixed;top:0;left:0;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0 0 0 0);border:0} .od-panels>.od-panel{display:none} .od-switch>input:nth-of-type(1):checked~.od-panels>.od-panel:nth-child(1), .od-switch>input:nth-of-type(2):checked~.od-panels>.od-panel:nth-child(2), .od-switch>input:nth-of-type(3):checked~.od-panels>.od-panel:nth-child(3), .od-switch>input:nth-of-type(4):checked~.od-panels>.od-panel:nth-child(4), .od-switch>input:nth-of-type(5):checked~.od-panels>.od-panel:nth-child(5){display:block} .od-switch .od-nav .wrap{padding-top:0;padding-bottom:0} .od-switch .od-nav .wrap>label{display:block;padding:14px 0;font-size:14px;font-weight:700;color:var(--navy); cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent; transition:color .18s,border-color .18s} .od-switch .od-nav .wrap>label:hover{color:var(--blue)} .od-switch>input:nth-of-type(1):checked~.od-nav .wrap>label:nth-of-type(1), .od-switch>input:nth-of-type(2):checked~.od-nav .wrap>label:nth-of-type(2), .od-switch>input:nth-of-type(3):checked~.od-nav .wrap>label:nth-of-type(3), .od-switch>input:nth-of-type(4):checked~.od-nav .wrap>label:nth-of-type(4), .od-switch>input:nth-of-type(5):checked~.od-nav .wrap>label:nth-of-type(5){ color:var(--blue);border-bottom-color:var(--blue)} /* ===== #083 药渡咨询页（consulting.html）===== ⚠️ 同 #082：页面级规则一律追加在 common.css 末尾，作用域用 body.pg-cs。 */ .pg-cs #cs-about h2{text-align:center} .pg-cs #cs-about .lede{text-align:center;margin-left:auto;margin-right:auto} /* —— 页头 hero（CONSULTING / 药渡咨询 / 描述 / 两个按钮）整体居中 —— */ .pg-cs .subhero{text-align:center} .pg-cs .subhero .pos{margin-left:auto;margin-right:auto} .pg-cs .subhero .hero-acts{justify-content:center} /* —— 区块标题与副文案居中 —— */ .pg-cs #cs-service h2{text-align:center} .pg-cs #cs-service .lede{text-align:center;margin-left:auto;margin-right:auto} /* —— 代表客户：区块标题/副文案 + 客户类型 tab 行居中 —— */ .pg-cs #cs-customer h2{text-align:center} .pg-cs #cs-customer .lede{text-align:center;margin-left:auto;margin-right:auto} .pg-cs #cs-customer .cs-tabs>.od-tabnav{justify-content:center} /* —— 项目示例（代表案例）：区块标题 + 底部脚注居中 —— */ .pg-cs #cs-cases h2{text-align:center} .pg-cs #cs-cases .m-note{text-align:center} /* —— 代表客户：logo 卡片组整体居中（不满行的末行也居中）—— 原为 6 列 grid，末行不满时靠左留空；改 flex 后按列数算 basis，justify-content 居中。 断点与列数保持与源站一致：6 / 4(≤1199) / 3(≤820) / 2(≤640,gap10) / 1(≤380)。 */ .pg-cs #cs-customer .cs-logos{display:flex;flex-wrap:wrap;justify-content:center;gap:16px} .pg-cs #cs-customer .cs-logo{flex:0 1 calc((100% - 80px)/6);min-width:0} @media(max-width:1199px){ .pg-cs #cs-customer .cs-logo{flex-basis:calc((100% - 48px)/4)} } @media(max-width:820px){ .pg-cs #cs-customer .cs-logo{flex-basis:calc((100% - 32px)/3)} } @media(max-width:640px){ .pg-cs #cs-customer .cs-logos{gap:10px} .pg-cs #cs-customer .cs-logo{flex-basis:calc((100% - 10px)/2)} } @media(max-width:380px){ .pg-cs #cs-customer .cs-logo{flex-basis:100%} } /* —— 核心数据（100+ / 20亿+ / 400+）：照源站 —— 标签在上、数值在下、整列居中、去掉左侧蓝条 —— 源站 .bannerCount{flex:1;text-align:center}；p1 14px、p2 span 34px、色 #333、p2 margin-top 15px； .bannerCount p 未声明 font-weight（默认 400），.stat 也无左侧边框。 */ .pg-cs .cs-stats .stat{border-left:0;padding:0;text-align:center} .pg-cs .cs-stats .stat .l{font-size:14px;color:#333} .pg-cs .cs-stats .stat .n{font-size:34px;color:#333;font-weight:400;margin-top:15px;line-height:1.2} /* —— #083g 「上接资本、下承市场、一站式咨询服务」副标题上下各加 10px 留白（自身高度 27→47px）—— 原状：与上方 h2 相距 18px、与下方 .cs-svc-grid 相距 0px（贴死）。只作用于 #cs-service。 */ .pg-cs #cs-service .lede{padding:10px 0} /* ===== #083h 「预约咨询」弹窗（横向三列联系人名片，源站 rightProximg 内容）===== */ .pg-cs .bk-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px} .pg-cs .bk-modal[hidden]{display:none} /* ⚠️ 必须写：上面的 display:flex 会盖掉 hidden 的默认 none */ .pg-cs .bk-mask{position:absolute;inset:0;background:rgba(8,24,48,.5)} .pg-cs .bk-box{position:relative;width:min(780px,100%);max-height:calc(100vh - 48px);overflow:auto; background:#fff;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.22);padding:26px 26px 22px} .pg-cs .bk-x{position:absolute;top:12px;right:12px;width:32px;height:32px;padding:0;border:0;border-radius:6px; background:transparent;cursor:pointer;line-height:0} .pg-cs .bk-x svg{width:18px;height:18px;fill:none;stroke:#94a0b0;stroke-width:1.8;stroke-linecap:round} .pg-cs .bk-x:hover{background:#f1f4f9} .pg-cs .bk-x:hover svg{stroke:#333} .pg-cs .bk-box h3{margin:0 0 6px;font-size:20px;font-weight:800;color:var(--navy);text-align:center} .pg-cs .bk-sub{margin:0 0 20px;font-size:13px;line-height:1.6;color:var(--sub);text-align:center} .pg-cs .bk-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--line);border-radius:10px;overflow:hidden} .pg-cs .bk-card{display:flex;flex-direction:column;gap:9px;padding:20px 18px} .pg-cs .bk-card + .bk-card{border-left:1px dashed var(--line)} /* 呼应对照图里的虚线分隔 */ .pg-cs .bk-name{font-size:16px;font-weight:700;color:var(--navy);line-height:1.3} .pg-cs .bk-line{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;line-height:1.45; color:var(--sub);word-break:break-all} .pg-cs .bk-ico{flex:0 0 15px;width:15px;height:15px;fill:none;stroke:#b4bcc9; stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round} .pg-cs .bk-qr{align-self:center;width:120px;height:120px;margin-top:5px;background:#fff; border:1px solid var(--line);border-radius:6px} @media(max-width:760px){ .pg-cs .bk-cards{grid-template-columns:minmax(0,1fr)} .pg-cs .bk-card + .bk-card{border-left:0;border-top:1px dashed var(--line)} .pg-cs .bk-qr{align-self:center} } @media(max-width:480px){ .pg-cs .bk-modal{padding:12px} .pg-cs .bk-box{padding:22px 16px 18px} .pg-cs .bk-box h3{font-size:18px} } /* ===== #084 关于我们页（about.html）===== ⚠️ 同 #082/#083：页面级规则一律追加在 common.css 末尾，作用域 body.pg-about。 范围：页头 subhero + 每个区块的 h2 + 紧跟在 h2 后的那一句介绍。 区块里的数据/卡片/表格/法务正文/表单一律不动。 （底部 CTA 的按钮行不用管：`.cta .hero-acts{justify-content:center}` 全站已有。） */ .pg-about .subhero{text-align:center} .pg-about .subhero .pos{margin-left:auto;margin-right:auto} .pg-about .block h2, .pg-about .cta h2{text-align:center} .pg-about .block > .wrap > h2 + p,.pg-about .cta > .wrap > h2 + p,.pg-about .lede,.pg-about .legal-note{text-align:center;margin-left:auto;margin-right:auto} /* ============================================================ #085 / #088 关于我们页（about.html）：od-nav = 「居中 Tab + 内容切换」 #085 建：6 项锚点导航改为点击只切内容、不跳转。 #088 改：原实现仍是 ，点击会把 # 写进地址栏，观感上还是「定位」 （用户反馈）→ 导航改为 **label + input[type=radio] 的纯 CSS Tab**： · ~~地址栏永不出现 #~~（脚本只读 hash，载入后即清掉外来 hash） ⚠️ **#148 已撤回这一条**：用户要求「复制链接后跳转能定位到该 Tab」， 故改为**保留** # —— 点 Tab 即把当前面板写回地址栏（如 `about.html#contact`）， 复制粘贴到新窗口可直接定位。实现见 about.html 里