/* ============================================================
   锁具百科 s30 · 极简宽栏风（墨黑#1a1a1a+亮橙#ff7a1a+纯白底）
   www.suojubaike.com 订制款 禁换款 · 定稿9页1:1 · 响应式860/560
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Microsoft YaHei",sans-serif;background:#fff;color:#2e2e2e;font-size:14px;line-height:1.8}
.w{width:min(1100px,94%);margin:0 auto}
a{text-decoration:none;color:inherit}
ul{list-style:none}
img{max-width:100%}
.stub{position:fixed;right:10px;bottom:10px;background:#2e2e2e;color:#ff7a1a;font-size:12px;padding:4px 10px;border-radius:3px;z-index:9}
/* 头部 */
.s30-hd{border-bottom:2px solid #111}
.s30-hd .w{display:flex;align-items:baseline;gap:26px;padding:18px 0 12px}
.s30-hd h1,.s30-hd .lg{font-size:30px;letter-spacing:6px;color:#111;font-weight:900;white-space:nowrap}
.s30-hd h1 span{color:#ff7a1a}
.s30-hd nav{display:flex;gap:18px;font-size:13px;color:#555;padding-bottom:4px;flex-wrap:wrap}
.s30-hd nav a{padding:4px 2px}
.s30-hd nav a:hover{color:#ff7a1a}
.s30-hd nav a.on{color:#111;font-weight:bold;border-bottom:2px solid #ff7a1a}
.s30-hd .qq{margin-left:auto;font-size:12px;color:#888;white-space:nowrap}
.s30-hd .qq b{color:#111;border-bottom:2px solid #ff7a1a}
/* 面包屑 */
.crumb{background:#fafafa;border-bottom:1px solid #eee;font-size:12px;color:#999}
.crumb .w{padding:9px 0;display:flex;gap:8px;flex-wrap:wrap}
.crumb a{color:#777}.crumb a:hover{color:#ff7a1a}
/* 页头 */
.ph{padding:16px 0 14px;border-bottom:2px solid #111;margin-bottom:4px}
.ph h2{font-size:23px;color:#111;margin-bottom:8px;line-height:1.5}
.ph h2 em{font-style:normal;color:#ff7a1a}
.ph p{font-size:13.5px;color:#666;max-width:820px;text-align:justify}
.ph .meta{margin-top:10px;font-size:12px;color:#999;display:flex;gap:16px;flex-wrap:wrap}
.ph .meta b{color:#111;font-family:Arial}
.ph .bdg{display:inline-block;background:#ff7a1a;color:#fff;font-size:12px;padding:2px 11px;border-radius:3px;margin-bottom:10px}
.ph .tgn{font-size:26px;color:#111;font-weight:900}
.ph .tgn i{font-style:normal;color:#ff7a1a}
.ph .tgn small{display:block;font-size:12px;color:#999;font-weight:normal;margin-top:4px}
.ph .n{font-size:12px;color:#999;border:1px solid #e5e5e5;border-radius:14px;padding:5px 15px;white-space:nowrap}
.ph .n b{color:#ff7a1a;font-family:Arial}
/* 首页导语带 */
.s30-lead{padding:18px 0 14px;border-bottom:1px solid #e5e5e5}
.s30-lead h1{font-size:22px;line-height:1.6;margin-bottom:10px;color:#111}
.s30-lead h1 em{font-style:normal;background:#ff7a1a;color:#fff;font-size:13px;padding:2px 10px;border-radius:3px;vertical-align:3px;margin-right:10px}
.s30-lead p{font-size:14px;color:#555;max-width:880px;text-align:justify}
.s30-lead .meta{margin-top:10px;font-size:12px;color:#999;display:flex;gap:16px;flex-wrap:wrap}
/* 行内小卡 */
.s30-inline{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;border:1px solid #e5e5e5;margin:16px 0}
.s30-ic{background:#fafafa;padding:14px 16px;border-right:1px solid #e5e5e5;display:block}
.s30-ic:last-child{border-right:0}
.s30-ic:hover{background:#fff;color:#ff7a1a}
.s30-ic b{font-size:13px;color:#111;display:block;margin-bottom:4px}
.s30-ic b i{font-style:normal;color:#ff7a1a;margin-right:5px}
.s30-ic span{font-size:12px;color:#777}
/* 双栏清单 */
.s30-list2{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin:16px 0}
.s30-list2 h3{font-size:16px;color:#111;border-bottom:2px solid #111;padding-bottom:6px;margin-bottom:4px}
.s30-list2 li{display:flex;gap:10px;padding:8px 0;border-bottom:1px dotted #e0e0e0;font-size:13px;color:#444;list-style:none}
.s30-list2 li i{font-style:normal;font-family:Arial;color:#ff7a1a;font-weight:bold;flex:none}
/* 最新词条带 */
.s30-latest{margin:16px 0}
.s30-latest h3{font-size:16px;color:#111;border-bottom:2px solid #111;padding-bottom:6px;margin-bottom:4px;display:flex;justify-content:space-between;align-items:baseline}
.s30-latest h3 a{font-size:12px;color:#999;font-weight:normal}
.s30-latest .g{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.s30-latest li{display:flex;gap:10px;padding:8px 0;border-bottom:1px dotted #e0e0e0;font-size:13px;color:#444;list-style:none;align-items:baseline}
.s30-latest li i{font-style:normal;font-family:Arial;color:#ff7a1a;font-size:12px;flex:none}
.s30-latest li span{margin-left:auto;font-size:11px;color:#aaa;flex:none}
.s30-latest li a:hover{color:#ff7a1a}
/* 问答三栏 */
.s30-qa{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:16px 0;padding:14px 0;border-top:1px solid #e5e5e5}
.s30-qa div h4{font-size:13.5px;color:#111;margin-bottom:5px}
.s30-qa div h4::before{content:"Q ";color:#ff7a1a;font-family:Arial;font-weight:bold}
.s30-qa div p{font-size:12.5px;color:#666}
.s30-qa div p::before{content:"A ";color:#999;font-family:Arial}
/* 服务四步 */
.s30-svc4{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;border:1px solid #111;margin:16px 0}
.s30-sv{background:#fff;padding:13px 16px;border-right:1px solid #e5e5e5}
.s30-sv:last-child{border-right:0}
.s30-sv b{font-size:13.5px;color:#111;display:block;margin-bottom:4px}
.s30-sv b i{font-style:normal;color:#fff;background:#ff7a1a;border-radius:3px;padding:0 8px;margin-right:7px;font-family:Arial}
.s30-sv span{font-size:12px;color:#777}
/* 价目黑带 */
.s30-price{background:#111;color:#eee;padding:14px 20px;display:flex;flex-wrap:wrap;gap:6px 26px;align-items:center;margin:16px 0}
.s30-price .t{color:#ff7a1a;font-weight:bold}
.s30-price b{color:#ffcf9a;font-family:Arial}
.s30-price span{font-size:13px}
.s30-price .mut{font-size:12px;color:#888}
/* 密链底 */
.s30-links{border-top:2px solid #111;padding:14px 0 2px}
.s30-links h3{font-size:14px;color:#111;margin-bottom:8px}
.s30-links .gr{display:grid;grid-template-columns:repeat(5,1fr);gap:6px 20px}
.s30-links .gr a{font-size:12.5px;color:#666;padding:4px 0;border-bottom:1px dotted #e8e8e8;display:block}
.s30-links .gr a:hover{color:#ff7a1a}
/* 合规 */
.s30-law{font-size:12px;color:#888;width:min(1100px,94%);margin:0 auto;padding:12px 0;border-top:1px solid #e5e5e5}
.s30-law b{color:#b0432f}
/* 页脚 */
.s30-ft{background:#111;color:#888;font-size:12px;padding:14px 0}
.s30-ft .w{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.s30-ft a{color:#bbb;margin-left:14px}
.s30-ft a:hover{color:#ff7a1a}
.s30-ft b{color:#ff7a1a;font-weight:normal}
.s30-ft .ba{width:100%;text-align:center;border-top:1px solid #333;padding-top:10px}
.s30-ft .ba a{margin-left:0;margin-right:6px;color:#ccc}
.s30-ft .gaba img{vertical-align:-2px;margin-right:4px}
/* 子类速读/相关分类 */
.subs{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;border:1px solid #e5e5e5;margin:16px 0}
.subs a{background:#fafafa;padding:13px 15px;border-right:1px solid #e5e5e5;display:block}
.subs a:last-child{border-right:0}
.subs a:hover{background:#fff;color:#ff7a1a}
.subs b{font-size:13.5px;color:#111;display:block;margin-bottom:3px}
.subs span{font-size:12px;color:#888}
.cats2{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;border:1px solid #111;margin:14px 0 16px}
.cats2 a{background:#fff;padding:12px 15px;border:1px solid #e5e5e5;margin:-1px 0 0 -1px;display:block}
.cats2 a:hover{background:#111;color:#fff}
.cats2 a:hover span{color:#aaa}
.cats2 b{font-size:14px;display:block}
.cats2 span{font-size:12px;color:#999}
/* 布局 */
.layout{display:grid;grid-template-columns:1fr 280px;gap:36px;margin:4px 0 8px}
/* 列表 */
.li-cap{font-size:16px;color:#111;border-bottom:2px solid #111;padding:14px 0 6px;display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px}
.li-cap span{font-size:12px;color:#999;font-weight:normal}
.items li{display:flex;gap:14px;padding:13px 2px;border-bottom:1px solid #eee;align-items:baseline}
.items .no{font-family:Arial;color:#ff7a1a;font-weight:bold;font-size:13px;width:26px;flex:none}
.items .no.tp{color:#111}
.items b{font-size:14.5px;font-weight:normal;line-height:1.6}
.items b a:hover{color:#ff7a1a;font-weight:bold}
.items .sum{font-size:12px;color:#999;margin-top:3px}
.items .d{margin-left:auto;font-size:11px;color:#bbb;flex:none}
/* 侧栏 */
.side .bx{border:1px solid #e5e5e5;padding:12px 14px;margin-bottom:16px}
.side h4{font-size:13px;color:#111;border-left:4px solid #ff7a1a;padding-left:9px;margin-bottom:8px}
.side li{border-bottom:1px dotted #e8e8e8;padding:7px 0;font-size:12.5px;color:#555;display:flex;gap:8px;list-style:none}
.side li:last-child{border:0}
.side li i{font-style:normal;font-family:Arial;color:#ff7a1a;font-size:12px;flex:none}
.side li a:hover{color:#ff7a1a}
.side .lw{font-size:12px;color:#777;line-height:2}
.side .lw b{color:#b0432f}
.side .pr{display:flex;justify-content:space-between;font-size:12.5px;color:#555;border-bottom:1px dotted #e8e8e8;padding:6px 0}
.side .pr:last-child{border:0}
.side .pr b{color:#b0432f;font-family:Arial}
/* 标签chips */
.chips{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0 2px}
.chips a{font-size:12px;color:#555;border:1px solid #e0e0e0;border-radius:3px;padding:5px 14px}
.chips a:hover{border-color:#ff7a1a;color:#ff7a1a}
.chips a.on{background:#111;color:#ff7a1a;border-color:#111}
/* 分页 */
.pager{display:flex;gap:8px;align-items:center;padding:14px 0;flex-wrap:wrap}
.pager .pg{font-size:12px;color:#999;margin-right:6px}
.pager .pg b{color:#ff7a1a;font-family:Arial}
.pager a{font-size:13px;color:#555;border:1px solid #e0e0e0;padding:5px 13px}
.pager a:hover{border-color:#ff7a1a;color:#ff7a1a}
.pager a.cur{background:#111;color:#ff7a1a;border-color:#111;font-weight:bold}
.pager .dots{color:#bbb}
/* 文章页 */
.artc .content{padding:6px 0 4px}
.artc .content p{font-size:14px;color:#444;text-align:justify;margin-bottom:12px}
.artc .content h2{font-size:17px;color:#111;margin:20px 0 10px;border-left:5px solid #ff7a1a;padding-left:11px;line-height:1.5;scroll-margin-top:10px}
.artc .content h3{font-size:15px;color:#333;margin:16px 0 8px}
.artc .content ul,.artc .content ol{margin:0 0 12px 2em}
.artc .content li{font-size:14px;color:#444;margin-bottom:6px;list-style:disc}
.artc .content ol li{list-style:decimal}
.artc .content blockquote{background:#fafafa;border-left:4px solid #ff7a1a;padding:10px 15px;font-size:13px;color:#666;margin:12px 0}
.artc .content table{border-collapse:collapse;width:100%;margin:12px 0;font-size:13px}
.artc .content th{background:#fafafa;border:1px solid #e0e0e0;padding:7px 10px;text-align:left}
.artc .content td{border:1px solid #e0e0e0;padding:7px 10px}
.artc .lead-p{font-size:14.5px;color:#333;background:#fafafa;border-left:4px solid #111;padding:11px 14px}
.artc .art-note{font-size:12px;color:#999;border-top:1px dashed #e0e0e0;padding-top:10px;margin-top:6px}
.art-tags{padding:12px 0 0;border-top:1px solid #eee;font-size:12.5px;color:#999;display:flex;gap:9px;flex-wrap:wrap}
.art-tags a{color:#555;border:1px solid #e0e0e0;border-radius:3px;padding:3px 11px}
.art-tags a:hover{border-color:#ff7a1a;color:#ff7a1a}
/* 上下篇 */
.pn{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0;border-top:2px solid #111;padding-top:14px}
.pn a{font-size:13px;color:#555;border:1px solid #e5e5e5;padding:10px 14px;line-height:1.6;display:block}
.pn a:hover{color:#ff7a1a;border-color:#ff7a1a}
.pn a i{font-style:normal;display:block;font-size:11px;color:#aaa;margin-bottom:3px}
.pn a.next{text-align:right}
/* 相关阅读 */
.reco{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;border:1px solid #e5e5e5;margin:14px 0 16px}
.reco a{background:#fafafa;padding:12px 14px;border-right:1px solid #e5e5e5;display:block}
.reco a:last-child{border-right:0}
.reco a:hover{background:#fff;color:#ff7a1a}
.reco b{font-size:13px;color:#111;display:block;line-height:1.6;margin-bottom:4px}
.reco span{font-size:11px;color:#999}
/* 404 */
.errbox{border:1px solid #111;padding:30px 26px;margin:26px auto;text-align:center}
.errbox .code{font-family:Arial;font-size:54px;font-weight:900;color:#ff7a1a;line-height:1.2}
.errbox h2{font-size:19px;color:#111;margin:8px 0}
.errbox p{font-size:13px;color:#777;margin-bottom:14px}
.errbox .go{display:inline-block;background:#111;color:#ff7a1a;font-weight:bold;padding:9px 30px;border-radius:3px}
.errbox .alt{margin-top:12px;font-size:12px;color:#999}
.errbox .alt a{color:#555;border-bottom:1px dotted #bbb;margin:0 4px}
.errbox .alt a:hover{color:#ff7a1a}
/* 正文首段特殊 */
.ph + .layout,.ph + .artc{margin-top:4px}
/* ===== 移动适配 ===== */
@media (max-width:860px){
  .s30-hd .w{flex-wrap:wrap;gap:8px 16px;padding:14px 0 0}
  .s30-hd h1,.s30-hd .lg{font-size:24px;letter-spacing:3px}
  .s30-hd .qq{margin-left:auto;padding-bottom:10px}
  .s30-hd nav{order:3;width:100%;flex-wrap:wrap;gap:0 4px;padding:0 0 4px;border-top:1px solid #eee}
  .s30-hd nav a{padding:9px 12px 7px}
  .layout{grid-template-columns:1fr;gap:8px}
  .subs{grid-template-columns:1fr 1fr}
  .subs a:nth-child(2){border-right:0}
  .subs a:nth-child(-n+2){border-bottom:1px solid #e5e5e5}
  .cats2{grid-template-columns:1fr 1fr}
  .ph h2{font-size:19px}
  .ph .tgn{font-size:20px}
  .s30-lead h1{font-size:18px}
  .s30-inline{grid-template-columns:1fr 1fr}
  .s30-ic:nth-child(2){border-right:0}
  .s30-ic:nth-child(-n+2){border-bottom:1px solid #e5e5e5}
  .s30-list2{grid-template-columns:1fr;gap:14px}
  .s30-latest .g{grid-template-columns:1fr}
  .s30-qa{grid-template-columns:1fr;gap:14px;padding:12px 0}
  .s30-svc4{grid-template-columns:1fr 1fr}
  .s30-sv:nth-child(2){border-right:0}
  .s30-sv:nth-child(-n+2){border-bottom:1px solid #e5e5e5}
  .s30-links .gr{grid-template-columns:repeat(3,1fr)}
  .duo{grid-template-columns:1fr}
  .pn{grid-template-columns:1fr}
  .pn a.next{text-align:left}
  .reco{grid-template-columns:1fr 1fr}
  .reco a:nth-child(2){border-right:0}
  .reco a:nth-child(-n+2){border-bottom:1px solid #e5e5e5}
  .side{order:-1}
  .items .d{display:none}
  .ph .n{margin-left:auto}
}
@media (max-width:560px){
  .stub{right:6px;bottom:6px}
  .s30-hd h1,.s30-hd .lg{font-size:21px;letter-spacing:2px}
  .s30-hd .qq{font-size:11px}
  .ph h2{font-size:17px}
  .ph .tgn{font-size:18px}
  .s30-lead h1{font-size:17px}
  .s30-inline{grid-template-columns:1fr}
  .s30-ic{border-right:0;border-bottom:1px solid #e5e5e5}
  .s30-ic:last-child{border-bottom:0}
  .s30-svc4{grid-template-columns:1fr}
  .s30-sv{border-right:0;border-bottom:1px solid #e5e5e5}
  .s30-sv:last-child{border-bottom:0}
  .subs{grid-template-columns:1fr}
  .subs a{border-right:0;border-bottom:1px solid #e5e5e5}
  .subs a:last-child{border-bottom:0}
  .cats2{grid-template-columns:1fr}
  .reco{grid-template-columns:1fr}
  .reco a{border-right:0;border-bottom:1px solid #e5e5e5}
  .reco a:last-child{border-bottom:0}
  .s30-links .gr{grid-template-columns:1fr 1fr}
  .s30-price span{font-size:12.5px}
  .s30-price{padding:12px 14px;gap:5px 16px}
  .s30-ft .w{flex-direction:column;gap:6px}
  .s30-ft a{margin-left:0;margin-right:14px}
}