/* 共通の頭と足（ヘッダー・タブ帯・フッター）だけのCSS。
   2026-09-23 竹中さん決定「全ページ今の6タブ・フッター16リンク」で、site.css を読んでいない
   手作りページ（Amazon系・FDA系・wl/・an/ ほか）に付けるために新設。
   値は生成器 article_html.py の CSS 定数と site.css の該当部分をそのまま写した。
   ★ページ側の見た目を変えないよう、変数も規則も .site-header / .catbar / .site-footer の中だけに効かせる。 */
.site-header,.catbar,.site-footer{--navy:#0c2340;--navy2:#15406e;--blue:#1763b8;--hot:#e8400e;--hot2:#ff6a3d;
  --ink:#16202e;--sub:#52606f;--line:#e6eaf0;--card:#ffffff;--soft:#f6f8fb;--maxw:1680px;
  box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.85;text-align:left}  /* 書体と行間は生成器の body と同じ（行間 37px/20px を実測）。ページ側の書体（例：クエストのドット書体）を持ち込まない */
.site-header *,.catbar *,.site-footer *{box-sizing:border-box}
.catbar input,.catbar button{font-family:inherit}
.site-header a,.catbar a,.site-footer a{text-decoration:none}
.site-header .bound,.catbar .bound,.site-footer .bound{max-width:var(--maxw);margin:0 auto;padding:0 clamp(16px,4vw,56px)}
.site-header.full,.catbar.full,.site-footer.full{width:100%}
.site-header{background:linear-gradient(100deg,var(--navy),var(--navy2));color:#fff}
.site-header .bound{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px}
.site-header .brand{display:flex;align-items:center;gap:11px;font-size:clamp(19px,2.3vw,29px);font-weight:900;letter-spacing:.02em;color:#fff}
.site-header .brand-logo{height:40px;width:auto;display:block;flex:none}
.site-header .brand-txt span{color:var(--hot2)}
.site-header .tagline{font-size:clamp(15px,1.4vw,18px);color:#c4d6ec;border-left:2px solid #335a85;padding-left:16px}
.site-header .hdr-fx{margin-left:auto;display:flex;align-items:baseline;gap:6px;white-space:nowrap;color:#cfe0f3;font-size:13px;font-weight:800}
.site-header .hdr-fx .hf-val{font-size:22px;font-weight:900;color:#fff;letter-spacing:-.01em;line-height:1}
.site-header .hdr-fx .hf-unit{font-size:13px;font-weight:900;color:#fff}
@media(max-width:560px){.site-header .hdr-fx{font-size:12px}.site-header .hdr-fx .hf-val{font-size:18px}}
.catbar{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;box-shadow:0 2px 8px rgba(12,35,64,.05)}
.catbar .bound{display:flex;gap:0;overflow-x:auto;white-space:nowrap;padding-top:0;padding-bottom:0;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.catbar .bound::-webkit-scrollbar{display:none}
.catbar a{display:inline-block;padding:15px 18px;font-size:16px;font-weight:800;color:var(--ink);border-bottom:3px solid transparent;flex:none}
.catbar a:hover{color:var(--blue);border-bottom-color:var(--blue);background:var(--soft)}
.site-footer{background:linear-gradient(100deg,var(--navy),var(--navy2));color:#cfdcec;margin-top:40px}
.site-footer .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:30px;padding:42px 0 28px}
.site-footer .brand-logo{height:40px;width:auto;display:block}
.site-footer .foot-brand b{color:#fff;font-size:18px;font-weight:900;display:block;margin:8px 0 6px}
.site-footer .foot-brand p{font-size:14px;line-height:1.7;color:#aebfd4;margin:0;max-width:34ch}
.site-footer .foot-brand a{color:#fff;font-weight:800}
.site-footer .foot-col h5{font-size:14px;font-weight:900;color:#fff;margin:2px 0 12px;letter-spacing:.04em}
.site-footer .foot-col a{display:block;font-size:14px;color:#bccbe0;padding:6px 0;line-height:1.4}
.site-footer .foot-col a:hover{color:#fff}
.site-footer .foot-bottom{border-top:1px solid rgba(255,255,255,.14);padding:16px 0 26px;font-size:13px;color:#9fb2c9}
@media(max-width:820px){.site-footer .foot-grid{grid-template-columns:1fr 1fr;gap:22px}}
@media(max-width:520px){.site-footer .foot-grid{grid-template-columns:1fr}}
/* ↓ site.css からそのまま写した、タブ帯と検索窓の規則 */
.catbar-search{flex:none;display:flex;align-items:center;padding:0 0 0 10px;position:relative}
.cs-results{position:absolute;top:calc(100% + 6px);right:0;width:340px;max-width:86vw;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 36px rgba(12,35,64,.18);overflow:hidden;z-index:80;display:none}
.cs-results.show{display:block}
.cs-results a{display:block;padding:10px 14px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--navy)}
.cs-results a:last-child{border-bottom:0}
.cs-results a:hover,.cs-results a.active{background:#eef5fc}
.cs-results .r-t{display:block;font-size:14px;font-weight:700;line-height:1.4}
.cs-results .r-c{display:block;font-size:11.5px;color:var(--sub);font-weight:700;margin-top:2px}
.cs-results .r-more{font-size:12.5px;color:var(--blue);font-weight:800;text-align:center;background:#f7fafd}
.cs-results .r-none{padding:12px 14px;color:var(--sub);font-size:13px}
.catbar-search .cs-wrap{position:relative;display:flex;align-items:center}
.catbar-search .cs-ico{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--sub);pointer-events:none}
.catbar-search input{border:1.5px solid #b9c8da;border-radius:999px;padding:9px 16px 9px 34px;font-size:15px;width:220px;
  background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(12,35,64,.07)}
.catbar-search input::placeholder{color:var(--sub)}
.catbar-search input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(23,99,184,.15)}
@media(max-width:720px){.catbar-search input{width:150px}}
.catbar-article .bound{display:flex;align-items:stretch;gap:0}
.catbar-article .wt-tabs{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.catbar-article .wt-tabs::-webkit-scrollbar{display:none}
.catbar-article .wt-tb{appearance:none;background:none;border:0;cursor:pointer;font-family:inherit;
  font-size:16px;font-weight:800;color:var(--sub);padding:14px 18px;white-space:nowrap;
  border-bottom:3px solid transparent;position:relative;display:inline-block;flex:none;text-decoration:none}
.catbar-article .wt-tb+.wt-tb::before{content:"";position:absolute;left:0;top:16px;bottom:16px;
  width:1px;background:var(--line)}
.catbar-article .wt-tb:hover{color:var(--navy);background:none;border-bottom-color:transparent}
.catbar-article .wt-tb.on{color:var(--navy);font-weight:900;border-bottom-color:var(--hot)}
.catbar-article .catbar-search{margin-left:auto;flex:none}
@media(max-width:720px){.catbar-article .bound{flex-wrap:wrap}.catbar-article .wt-tabs{width:100%;order:1}.catbar-article .catbar-search{order:2;width:100%;margin-left:0;
    border-top:1px solid var(--line);padding:10px 0}.catbar-article .catbar-search .cs-wrap{width:100%}.catbar-article .catbar-search input{width:100%}.catbar-article .wt-tb{padding:12px 14px;font-size:15px}}