@charset "utf-8";
/* ══════════════════════════════════════════════════════════════════════
AI裁缝官网 样式表 —— IE8/9/10 全兼容版（2026-09-24 重写）
⚠️ 兼容性红线（本文件禁止出现以下写法）：
✗ CSS 变量 var(--x) → IE 全系不支持
✗ clamp() / min() / max() → IE 全系不支持
✗ display:grid / minmax() → IE 只支持老 -ms-grid，语法不同
✗ flexbox → IE8/9 不支持，IE10 仅旧语法
✗ aspect-ratio → IE 不支持
✗ backdrop-filter → IE 不支持
✗ :is() / :where() / gap in flex
✓ 本文件只用「最大公约数」写法：
float 浮动 + width 百分比 + table-cell + inline-block
+ 媒体查询（IE9+ 支持；IE8 走默认值，也能看）
布局策略：
· 栅格用 float + width% + 清除浮动（IE8 起全支持）
· 等高列用 table / table-cell（比 float 稳，老浏览器也好）
· 大屏靠「媒体查询放大百分比容器」实现，不依赖 vw/clamp
══════════════════════════════════════════════════════════════════════ */
/* ---------- 1. 基础重置 ---------- */
*{margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
body{
background:#FAF7F2;
color:#2C4A52;
font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
line-height:1.85;
font-size:15px;
}
/* emoji 字体回退：Windows 用 Segoe UI Emoji/Symbol，避免 emoji 变成空方块
（IE8 无彩色 emoji，但至少能显示符号本身） */
.ico,.mi,.hstat .ic{
font-family:"Segoe UI Emoji","Segoe UI Symbol","Apple Color Emoji",
"Noto Color Emoji","PingFang SC","Microsoft YaHei",sans-serif;
}
img{border:0;max-width:100%;height:auto;-ms-interpolation-mode:bicubic;}
a{color:#C65D3E;text-decoration:none;}
a:hover{text-decoration:underline;}
/* IE8/9 的 HTML5 标签支持（配合页面里的 html5.js，此处兜底） */
header,footer,nav,section,article,aside,figure{display:block;}
ul,ol{list-style:none;}
table{border-collapse:collapse;}
b,strong{font-weight:700;}
/* ---------- 2. 布局容器 ---------- */
.wrap{
max-width:1080px;
_width:1080px; /* IE6/7 兜底 */
margin:0 auto;
padding:0 22px;
}
.narrow{max-width:820px;}
section{padding:62px 0;}
section.tint{background:#F3E8DD;}
section.dark{background:#2C4A52;color:#FAF7F2;}
section.dark a{color:#E9A98F;}
/* 清除浮动（IE8 起支持 :after） */
.clearfix:after{content:"";display:table;clear:both;}
.clearfix{*zoom:1;} /* IE6/7 hasLayout 兜底 */
/* ---------- 3. 顶栏 ---------- */
header.top{
position:relative;
z-index:60;
background:#FAF7F2;
background:rgba(250,247,242,.96);
border-bottom:1px solid #E8DFCE;
}
.top-in{height:62px;line-height:62px;}
.top-in:after{content:"";display:table;clear:both;}
.top-in{*zoom:1;}
.logo{
float:left;
font-weight:800;
font-size:18px;
color:#2C4A52;
letter-spacing:.02em;
line-height:62px;
}
.logo em{font-style:normal;color:#C65D3E;}
nav{float:right;font-size:14.5px;}
nav a{
color:#2C4A52;
display:inline-block;
margin-left:22px;
line-height:62px;
vertical-align:middle;
filter:alpha(opacity=82);
opacity:.82;
}
nav a:hover,nav a.on{
filter:alpha(opacity=100);
opacity:1;
color:#C65D3E;
text-decoration:none;
}
nav a.on{font-weight:700;}
.btn-top{
background:#C65D3E;
color:#fff;
padding:7px 15px;
border-radius:7px;
font-size:14px;
font-weight:600;
line-height:1;
display:inline-block;
vertical-align:middle;
}
.btn-top:hover{color:#fff;text-decoration:none;background:#A94A2E;}
/* ---------- 4. Hero 首屏 ---------- */
.hero{
padding:78px 0 60px;
background:#FAF7F2;
background-image:-webkit-radial-gradient(12% -8%, #F0DFCF 0%, rgba(250,247,242,0) 62%);
background-image:radial-gradient(1100px 460px at 12% -8%, #F0DFCF 0%, rgba(250,247,242,0) 62%);
}
.eyebrow{
font-size:12.5px;
letter-spacing:.22em;
color:#C65D3E;
font-weight:700;
text-transform:uppercase;
}
h1.big{
font-size:47px;
line-height:1.28;
margin:16px 0 18px;
font-weight:800;
letter-spacing:-.01em;
}
.lead{
font-size:17px;
color:#6B7B82;
max-width:760px;
margin:0 0 26px;
}
.cta{margin-top:8px;}
.cta:after{content:"";display:table;clear:both;}
.cta{*zoom:1;}
.btn{
display:inline-block;
padding:12px 24px;
border-radius:9px;
font-weight:700;
font-size:15px;
border:1.5px solid transparent;
margin-right:12px;
margin-bottom:10px;
line-height:1.2;
}
.btn:hover{text-decoration:none;}
.btn-p{background:#C65D3E;color:#fff;border-color:#C65D3E;}
.btn-p:hover{background:#A94A2E;border-color:#A94A2E;color:#fff;}
.btn-o{border-color:#2C4A52;color:#2C4A52;background:transparent;}
.btn-o:hover{background:#2C4A52;color:#FAF7F2;}
/* ---------- 5. 通用标题 ---------- */
.sec-t{
font-size:31px;
font-weight:800;
margin:0 0 10px;
letter-spacing:-.01em;
}
.sec-d{
color:#6B7B82;
margin:0 0 30px;
font-size:15.5px;
max-width:760px;
}
/* ---------- 6. 栅格系统（float 实现，IE8+ 通用） ----------
现有 HTML 形如：
为不改动页面结构，这里直接对 .grid 的直接子元素做百分比浮动，
用 .grid>X 选择器覆盖（IE7+ 支持子选择器；IE6 走默认 block 也能看）。 */
.grid{margin:0 -8px;}
.grid:after{content:"";display:table;clear:both;}
.grid{*zoom:1;}
.grid>*{
float:left;
padding:0 8px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
_height:1%;
margin-bottom:16px;
}
.grid.g2>*{width:50%;}
.grid.g3>*{width:33.3333%;}
.grid.g4>*{width:25%;}
/* 已带 .col 的旧结构也兼容 */
.col{float:left;padding:0 8px;box-sizing:border-box;
-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin-bottom:16px;}
.col.g2{width:50%;}
.col.g3{width:33.3333%;}
.col.g4{width:25%;}
/* 等分内的卡片 */
.card{
background:#fff;
border:1px solid #E8DFCE;
border-radius:12px;
padding:20px 22px;
_height:1%; /* IE6 hasLayout */
}
.card h4{margin:0 0 8px;font-size:16px;color:#2C4A52;}
.card p{margin:0;color:#6B7B82;font-size:14.2px;line-height:1.75;}
.card .ico{font-size:22px;display:block;margin-bottom:8px;}
.num{font-size:12px;font-weight:800;color:#C65D3E;letter-spacing:.1em;display:block;margin-bottom:6px;}
/* ---------- 7. 痛点三栏（float，3 列换行 → 共 6 块排成 2 行） ----------
注意：不能用 display:table-cell（不会换行，6 块会挤成一行）。
用 float:left + width:33.33% + 边框模拟，IE8 完全支持。 */
.pains{
overflow:hidden;
*zoom:1;
border:1px solid #E8DFCE;
border-radius:12px;
}
.pain{
float:left;
width:33.3333%;
background:#FAF7F2;
padding:20px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
border-right:1px solid #E8DFCE;
border-bottom:1px solid #E8DFCE;
_height:1%;
min-height:110px;
_height:110px;
}
/* 每行第 3 个去掉右边框（IE8 支持 nth-child，兜底 .n3） */
.pain.n3,.pain:nth-child(3n){border-right:0;}
/* 最后一行去掉下边框 */
.pain.last,.pain:nth-child(n+4){border-bottom:0;}
.pain b{display:block;font-size:15.5px;margin-bottom:5px;}
.pain span{font-size:13.6px;color:#8A7B6E;line-height:1.72;}
/* ---------- 8. 功能模块 ---------- */
.mod{border:1px solid #E8DFCE;border-radius:12px;background:#fff;margin-bottom:14px;}
.mod-h{
padding:15px 22px;
background:#F7EEE3;
background-image:-webkit-linear-gradient(left,#F7EEE3,transparent);
background-image:linear-gradient(90deg,#F7EEE3,transparent);
border-bottom:1px solid #E8DFCE;
}
.mod-h:after{content:"";display:table;clear:both;}
.mod-h{*zoom:1;}
.mod-h .mi{float:left;font-size:21px;margin-right:12px;line-height:1.5;}
.mod-h h4{float:left;font-size:17px;line-height:1.6;font-weight:700;}
.mod-h .cnt{float:right;font-size:13px;color:#8A7B6E;white-space:nowrap;line-height:2.1;}
.mod-b{padding:16px 22px;}
.chips:after{content:"";display:table;clear:both;}
.chips{*zoom:1;}
.chip{
font-size:13.2px;
background:#FAF7F2;
border:1px solid #E8DFCE;
border-radius:20px;
padding:4px 13px;
color:#2C4A52;
display:inline-block;
margin:0 7px 7px 0;
line-height:1.5;
}
.chip.new{background:#EAF4EF;border-color:#A8CFBE;color:#2E7D5B;font-weight:600;}
.chip.hot{background:#FAEDE8;border-color:#E5BBAA;color:#C65D3E;font-weight:600;}
.mod-note{font-size:13.6px;color:#8A7B6E;margin:12px 0 0;}
/* ---------- 9. 价格方案（float 四栏） ----------
现有 HTML：
.plan 自身就是卡片：宽度 25%，用 margin-right 造栏间距。
最后一列去掉右间距（IE8 不支持 :last-child → 加 .last 类兜底）。 */
.plans:after{content:"";display:table;clear:both;}
.plans{*zoom:1;}
.plan{
float:left;
width:23.5%;
margin-right:2%;
margin-bottom:16px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
_height:1%;
background:#fff;
border:1px solid #E8DFCE;
border-radius:14px;
position:relative;
padding:22px 20px;
}
.plan.last,.plan:last-child{margin-right:0;}
.plan.hot{border:2px solid #C65D3E;}
.plan .tag{
position:absolute;
top:-11px;
left:50%;
margin-left:-40px;
width:80px;
text-align:center;
background:#C65D3E;
color:#fff;
font-size:12px;
font-weight:700;
padding:2px 0;
border-radius:11px;
white-space:nowrap;
}
.plan h4{margin:0 0 3px;font-size:16.5px;}
.plan .who{font-size:13px;color:#8A7B6E;margin:0 0 14px;}
.plan .price{font-size:30px;font-weight:800;color:#2C4A52;line-height:1.1;}
.plan .price small{font-size:14px;font-weight:600;color:#8A7B6E;}
.plan .unit{font-size:12.5px;color:#8A7B6E;margin-bottom:14px;}
.plan ul{margin:0 0 16px;}
.plan li{
font-size:13.4px;
color:#6B7B82;
padding:4px 0 4px 19px;
position:relative;
line-height:1.65;
}
.plan li:before{content:"✓";position:absolute;left:0;color:#2E7D5B;font-weight:800;}
.plan .btn{display:block;width:100%;text-align:center;padding:10px 0;font-size:14px;margin:0;
box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
/* ---------- 10. 计算器 ---------- */
.calc{background:#2C4A52;color:#FAF7F2;border-radius:14px;padding:26px 28px;}
.calc h4{margin:0 0 4px;color:#fff;font-size:18px;}
.calc .cd{color:#B9C7CB;font-size:13.6px;margin:0 0 20px;}
.calc-row{margin-bottom:16px;}
.calc-row:after{content:"";display:table;clear:both;}
.calc-row{*zoom:1;}
.calc input[type=range]{
float:left;width:60%;min-width:200px;height:6px;margin-top:12px;
accent-color:#C65D3E;
}
.calc .n{
float:right;
font-size:27px;
font-weight:800;
color:#fff;
min-width:96px;
text-align:right;
}
.calc .n small{font-size:14px;color:#B9C7CB;font-weight:600;}
.calc-out{
margin-top:20px;
padding-top:18px;
border-top:1px solid #4A626A;
border-top:1px solid rgba(255,255,255,.16);
}
.calc-out:after{content:"";display:table;clear:both;}
.calc-out{*zoom:1;}
.calc-out>div{
float:left;
width:33.3333%;
box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;
_height:1%;
}
.calc-out>div span{display:block;font-size:12.5px;color:#B9C7CB;margin-bottom:3px;}
.calc-out>div b{font-size:22px;color:#fff;}
.calc-out>div.hi b{color:#F2A98A;}
.calc-out .co{float:left;width:33.3333%;box-sizing:border-box;_height:1%;}
.calc-out .co span{display:block;font-size:12.5px;color:#B9C7CB;margin-bottom:3px;}
.calc-out .co b{font-size:22px;color:#fff;}
.calc-out .co.hi b{color:#F2A98A;}
/* ---------- 11. 表格（页面用裸 ，直接选中） ---------- */
table{
width:100%;
border-collapse:collapse;
font-size:14px;
background:#fff;
}
table th,table td{
padding:11px 14px;
border-bottom:1px solid #E8DFCE;
text-align:left;
vertical-align:top;
}
table th{background:#F5EDE3;font-weight:700;color:#2C4A52;font-size:13.5px;}
table tr.last td,table tr:last-child td{border-bottom:0;}
td.y{color:#2E7D5B;font-weight:700;}
td.n{color:#8A7B6E;}
table.data{
width:100%;
border-collapse:collapse;
font-size:14px;
background:#fff;
border:1px solid #E8DFCE;
}
table.data th,table.data td{
padding:11px 14px;border-bottom:1px solid #E8DFCE;text-align:left;vertical-align:top;
}
table.data th{background:#F5EDE3;font-weight:700;color:#2C4A52;font-size:13.5px;}
table.data tr:last-child td{border-bottom:0;}
/* ---------- 12. 引言 / 提示 ---------- */
.note{
border-left:3px solid #C65D3E;
background:#fff;
padding:14px 18px;
border-radius:0 10px 10px 0;
font-size:14.3px;
color:#6B7B82;
}
.note b{color:#2C4A52;}
.callout{background:#2C4A52;color:#FAF7F2;border-radius:14px;padding:26px 30px;}
.callout h4{margin:0 0 8px;color:#fff;font-size:19px;}
.callout p{margin:0;color:#C8D4D7;font-size:14.6px;}
.callout .btn-o{border-color:#fff;color:#fff;margin-top:16px;}
.callout .btn-o:hover{background:#fff;color:#2C4A52;}
/* ---------- 13. 步骤（float 四栏，能换行 → demo 页 8 步排成 2 行） ----------
不能用 display:table-cell（demo 页有 8 个 step，会挤成一行 8 列）。 */
.steps{overflow:hidden;*zoom:1;}
.step{
float:left;
width:25%;
padding:0 18px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
border-left:1px dashed #E8DFCE;
vertical-align:top;
_height:1%;
min-height:96px;
_height:96px;
margin-bottom:20px;
}
.step.first,.step.first-child,.step:nth-child(4n+1){border-left:0;padding-left:0;}
.step b{display:block;font-size:13px;color:#C65D3E;letter-spacing:.1em;margin-bottom:5px;}
.step p{margin:0;font-size:14px;color:#6B7B82;}
.step h5{margin:0 0 5px;font-size:15.5px;font-weight:700;}
/* ---------- 13b. 更新日志行（原 flex → float，IE8 兼容） ---------- */
.upd-row{padding:13px 0;border-bottom:1px solid #E8DFCE;}
.upd-row:after{content:"";display:table;clear:both;}
.upd-row{*zoom:1;}
.upd-d{
float:left;
width:5.8em;
font-size:.82em;
color:#C65D3E;
font-weight:700;
white-space:nowrap;
line-height:1.9;
}
.upd-b{margin-left:6.4em;}
.upd-b b{font-size:.96em;}
.upd-x{font-size:.88em;color:#6B7B82;margin-top:2px;}
.upd-row.last,.upd-row:last-child{border-bottom:0;}
/* ---------- 13c. 文章列表行（原 flex → float） ---------- */
.post-row{
display:block;
padding:13px 0;
border-bottom:1px solid #E8DFCE;
text-decoration:none;
}
.post-row:after{content:"";display:table;clear:both;}
.post-row{*zoom:1;}
.post-row:hover{text-decoration:none;}
.post-tag{
float:left;
font-size:11.5px;
font-weight:700;
color:#fff;
padding:2px 9px;
border-radius:9px;
white-space:nowrap;
margin-right:12px;
line-height:1.7;
}
.post-t{color:#2C4A52;font-size:14.6px;overflow:hidden;}
.post-t:hover{color:#C65D3E;}
/* ---------- 14. FAQ ----------
⚠️ IE 不支持 /，故改用 div + onclick 切换（见页面脚本）。
默认收起：.faq-a{display:none}；.faq-item.open 时展开。 */
.faq{border-top:1px solid #E8DFCE;}
.faq-item{border-bottom:1px solid #E8DFCE;}
.faq-q{
cursor:pointer;
font-weight:700;
font-size:15.2px;
padding:14px 0 14px 30px;
position:relative;
color:#2C4A52;
}
.faq-q:before{
content:"+";
position:absolute;
left:0;top:12px;
color:#C65D3E;
font-weight:800;
font-size:19px;
width:20px;
text-align:center;
}
.faq-item.open .faq-q:before{content:"–";}
.faq-a{display:none;}
.faq-item.open .faq-a{display:block;}
.faq-a p{margin:0 0 14px 30px;color:#6B7B82;font-size:14.2px;}
/* 兼容旧 结构（万一还有残留） */
.faq details{border-bottom:1px solid #E8DFCE;}
.faq summary{cursor:pointer;font-weight:700;font-size:15.2px;padding:14px 0;}
.faq p{margin:10px 0 0 30px;color:#6B7B82;font-size:14.2px;}
/* ---------- 15. 数据条（float 四栏，直接作用于 .stat） ---------- */
.stats:after{content:"";display:table;clear:both;}
.stats{*zoom:1;}
.stat{
float:left;
width:23.5%;
margin-right:2%;
margin-bottom:16px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
_height:1%;
background:#fff;
border:1px solid #E8DFCE;
border-radius:12px;
padding:18px;
text-align:center;
}
.stat.last,.stat:last-child{margin-right:0;}
.stat b{display:block;font-size:29px;color:#C65D3E;font-weight:800;line-height:1.15;}
.stat span{font-size:12.8px;color:#8A7B6E;}
/* ---------- 16. 页脚（float 四栏） ----------
现有 HTML：（无 class 区分）
用 :first-child 让第一列更宽（IE7+ 支持），其余均分。 */
footer{background:#1F363D;color:#A9B8BC;padding:44px 0 30px;font-size:13.6px;}
.fg:after{content:"";display:table;clear:both;}
.fg{*zoom:1;}
.fg>div{
float:left;
width:20%;
padding-right:24px;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
_height:1%;
}
.fg>div:first-child{width:40%;}
.fg .fc{float:left;padding-right:24px;box-sizing:border-box;
-webkit-box-sizing:border-box;-moz-box-sizing:border-box;_height:1%;}
.fg .fc.main{width:40%;}
.fg .fc.sm{width:20%;}
footer h5{color:#fff;margin:0 0 10px;font-size:14px;}
footer a{color:#C3CFD2;display:block;padding:3px 0;font-size:13.4px;}
footer a:hover{color:#fff;}
.fbot{
margin-top:28px;
padding-top:16px;
border-top:1px solid #334B52;
border-top:1px solid rgba(255,255,255,.13);
color:#7F8F93;
font-size:12.6px;
}
/* ══════════════════════════════════════════════════════════════════════
17. 大屏放大（媒体查询 · IE9+ 支持；IE8 无媒体查询→用默认值，同样可看）
原设计只有 max-width:900/620 小屏断点，1920 大屏上内容卡在 1080px
两边留白 → 投影像"半张纸"。这里补大屏档位：容器加宽 + 字号放大。
注意：不能用 clamp()/vw，一律用固定 px（IE 友好）。
══════════════════════════════════════════════════════════════════════ */
/* 1080P 全屏 / 常见会议室大屏 */
@media screen and (min-width:1240px){
.wrap{max-width:1320px;}
body{font-size:15.6px;}
section{padding:76px 0;}
h1.big{font-size:54px;}
.sec-t{font-size:36px;}
.lead,.sec-d{font-size:16.4px;max-width:920px;}
.plan .price{font-size:33px;}
.stat b{font-size:32px;}
.calc .n{font-size:30px;}
}
/* 2K 显示器 / 大投影 */
@media screen and (min-width:1600px){
.wrap{max-width:1700px;}
body{font-size:17px;}
section{padding:92px 0;}
h1.big{font-size:64px;}
.sec-t{font-size:42px;}
.lead,.sec-d{font-size:17.8px;max-width:1120px;}
.card h4{font-size:17.8px;}
.card p{font-size:15.6px;}
.plan .price{font-size:38px;}
.stat b{font-size:37px;}
.calc .n{font-size:34px;}
.calc h4{font-size:20px;}
.callout h4{font-size:21px;}
.callout p{font-size:15.8px;}
.chip{font-size:14.2px;padding:5px 15px;}
}
/* 4K / LED 拼接大屏 —— 用最宽的档位，避免只占屏幕中间一小条 */
@media screen and (min-width:2200px){
.wrap{max-width:2100px;}
body{font-size:19px;}
h1.big{font-size:78px;}
.sec-t{font-size:54px;}
.lead,.sec-d{font-size:20px;max-width:1360px;}
section{padding:118px 0;}
.logo{font-size:22px;}
nav{font-size:17px;}
nav a{margin-left:30px;}
.btn{font-size:17px;padding:15px 30px;}
.card h4{font-size:20px;}
.card p{font-size:17px;}
.plan .price{font-size:44px;}
.stat b{font-size:44px;}
.calc .n{font-size:40px;}
.pain b{font-size:18px;}
.pain span{font-size:15.6px;}
table{font-size:16px;}
table th,table td{padding:15px 19px;}
}
/* 超宽屏（21:9 ≈ 2.33）：再宽就不撑满，限制行长保证可读性
⚠️ IE 不支持嵌套 @media，这里拆成两条独立规则。 */
@media screen and (min-width:1900px) and (min-aspect-ratio:2/1){
.wrap{max-width:1780px;}
}
@media screen and (min-width:2200px) and (min-aspect-ratio:2/1){
.wrap{max-width:1960px;}
}
/* ---------- 18. 小屏（IE8 不支持媒体查询 → 用固定宽度兜底） ---------- */
@media screen and (max-width:900px){
.grid.g2>*,.grid.g3>*,.grid.g4>*{width:50%;}
.col.g2,.col.g3,.col.g4{width:50%;}
.plan{width:48%;margin-right:4%;}
.plan:nth-child(2n),.plan.last{margin-right:0;}
.stat{width:48%;margin-right:4%;}
.stat:nth-child(2n),.stat.last{margin-right:0;}
.fg>div,.fg>div:first-child{width:50%;}
.fg .fc.main,.fg .fc.sm{width:50%;}
}
@media screen and (max-width:620px){
nav{display:none;}
.grid.g2>*,.grid.g3>*,.grid.g4>*{width:100%;}
.col.g2,.col.g3,.col.g4{width:100%;}
.plan{width:100%;margin-right:0;}
.stat{width:100%;margin-right:0;}
/* 三栏痛点、四步流程改竖排 */
.pains,.steps{display:block;}
.pain,.step{display:block;width:auto;border-right:0;border-left:0;padding:12px 0;}
.step{border-left:0;padding:0 0 14px;}
.fg>div,.fg>div:first-child{width:100%;padding-right:0;}
.fg .fc.main,.fg .fc.sm{width:100%;padding-right:0;}
.calc input[type=range]{width:100%;float:none;}
.calc .n{float:none;text-align:left;margin-top:8px;}
.calc-out>div,.calc-out .co{width:100%;float:none;margin-bottom:10px;}
}
/* ---------- 19. 打印 / 投影降级 ---------- */
@media print{
header.top{position:static;}
.btn{text-decoration:none;}
}