@charset "UTF-8";
/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template: cocoon
Version: 1.1.2
*/
/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/*---------------------------------
複数の固定ページの日付を非表示にする、おまじない
--------------------------------*/
.post-181 .date-tags,
.post-3209 .date-tags,
.post-3498 .date-tags,
.post-3 .date-tags {
display: none;
}
/*---------------------------------
固定ページ記事タイトル非表示
--------------------------------*/
.type-page h1,
.type-page
.post-meta{
display:none;
}
/*---------------------------------
グローバルメニューにアンダーライン
--------------------------------*/
/*カレントメニュー*/
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
border-bottom: 1px solid #fa884b; /*下線色*/
background: #fff; /*背景色*/
}
.menu-header .current-menu-item .item-label,
.menu-header .current-post-item .item-label,
.menu-header .current-menu-ancestor .item-label,
.menu-header .current-post-ancestor .item-label,
.menu-header .menu-item .item-label:hover {
color:#fa4b97; /*文字色*/
}
/*---------------------------------
サムネイルの左上部カテゴリー消す
--------------------------------*/
.cat-label {
display: none;
}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
/*必要ならばここにコードを書く*/
}
/*834px以下*/
@media screen and (max-width: 834px){
/*必要ならばここにコードを書く*/
}
/*480px以下*/
@media screen and (max-width: 480px){
/*必要ならばここにコードを書く*/
}
/***************************************************************
** HUD系デザイン ダークテーマ（2026-08-03、第一段階：配色のみ）
** Claude Codeとの相談で決めた近未来HUD風の配色を、Cocoonの既存
** 構造（テンプレートは未変更）にCSSだけで適用する。
** ヒーロー・タイル一覧などの新要素はまだ含まない（別途対応）。
***************************************************************/
:root{
--hud-bg-deep:#05070b;
--hud-panel:#0b121b;
--hud-panel-2:#0f1a26;
--hud-cyan:#35d6e8;
--hud-cyan-dim:#124a53;
--hud-cyan-line:#1c5964;
--hud-ink:#dff7fa;
--hud-ink-muted:#93a9b5;
--hud-amber:#f5e642;
--hud-amber-dim:#6b6218;
--hud-magenta:#ff3fa4;
--hud-magenta-dim:#7a1a52;
--hud-green:#3dffa0;
--hud-blue:#3d7cff;
}
html, body, #container{
background-color: var(--hud-bg-deep) !important;
background-image:
linear-gradient(var(--hud-cyan-line) 1px, transparent 1px),
linear-gradient(90deg, var(--hud-cyan-line) 1px, transparent 1px) !important;
background-size: 34px 34px !important;
}
body, #content, .article, .entry-content, #main, .content-in{
color: var(--hud-ink) !important;
}
/* ヘッダー・ナビ */
#header, #header-container{
background-color: rgba(5,7,11,0.9) !important;
border-bottom: 1px solid var(--hud-cyan-dim);
}
/* ヘッダー内側の枠（.wrap）はCocoon標準で幅1256px固定＋中央寄せのため、
画面が広いと左側に余白ができ、ロゴを左寄せにしても画面端までは届かない。
ヘッダーだけ枠を画面幅いっぱいに広げて解消する（2026-08-06追加）。 */
#header-in.wrap{
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 16px !important;
box-sizing: border-box !important;
}
.site-name-text, .site-name-text a{
color: var(--hud-cyan) !important;
}
/* ヘッダーロゴ帯: 白背景が焼き込み済みの写真バナー（top-04.png）はやめて、
他のHUD見出しと統一感のあるテキストロゴに変更（2026-08-06、ユーザー指示で
額縁案から変更）。2026-08-07に画像ロゴへの差し替えを試したが、画像側の
フォントがイメージと違うとのことで、このテキストロゴに戻した
（画像自体は`images/header-logo.png`にそのまま残してあるので、
デザイン違いの画像を再度作った場合はまた差し替えられる）。
画像は非表示にし、既存の.site-name-text要素にテキストを表示する。 */
.logo.logo-header.logo-image{
padding: 18px 16px !important;
background-color: var(--hud-bg-deep);
text-align: left !important; /* Cocoon標準の.logo{text-align:center}を上書き */
}
.logo.logo-header.logo-image .site-logo-image{
display: none !important;
}
.logo.logo-header.logo-image .site-name-text::before{
content: "AME.MAME.BAR";
display: block;
text-align: left;
font-family: 'Orbitron', 'JetBrains Mono', Consolas, monospace;
font-size: 22px;
font-weight: 700;
letter-spacing: 2px;
color: var(--hud-cyan);
text-shadow: 0 0 8px rgba(53, 214, 232, 0.7);
}
.logo.logo-header.logo-image .site-name-text::after{
content: "Nostalgic Finder from 90's";
display: block;
text-align: left;
font-family: 'JetBrains Mono', Consolas, monospace;
font-size: 11px;
letter-spacing: 1px;
color: var(--hud-ink-muted);
margin-top: 3px;
}
/* フッター下部のマスコットロゴ画像（fto-04.png）・標準メニュー
（HOME/Sitemap/Privacy-Policy/Contact）・著作権表記は非表示に
（2026-08-06、ユーザー指示）。同じ内容は下の.hud-footer-panelに
まとめて表示するため、標準フッター側の.footer-bottom全体を隠す形にした。 */
.footer-bottom{
display: none !important;
}
/* PAGE TOPボタン（Cocoon標準は水色地で、暗いテーマと合わなかったため2026-08-06追加） */
.page-top a{
background-color: var(--hud-bg-deep) !important;
color: var(--hud-cyan) !important;
border-top: 1px solid var(--hud-cyan-dim) !important;
}
.page-top a:hover{
color: var(--hud-ink) !important;
background-color: var(--hud-panel-2) !important;
}
#navi{
background-color: transparent !important;
border-top: none !important;
}
.menu-header .item-label{
color: var(--hud-ink-muted) !important;
}
.menu-header .menu-item:hover .item-label,
.menu-header .current-menu-item .item-label,
.menu-header .current-post-item .item-label{
color: var(--hud-cyan) !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover{
border-bottom: 1px solid var(--hud-cyan) !important;
background: transparent !important;
}
/* 記事・サイドバーを包む土台（スマホのスライドメニュー内の複製も含む） */
#main, #sidebar, .sidebar, .navi-menu-content, .sidebar-menu-content{
background-color: var(--hud-bg-deep) !important;
}
/* 記事エリア（本文） */
.article, .entry-content{
background-color: var(--hud-panel) !important;
border: 1px solid var(--hud-cyan-dim) !important;
}
/* HUDパネル（個別ブロックを囲む枠。四隅に鍵カッコの装飾） */
.hud-panel{
position: relative;
background-color: var(--hud-panel-2);
border: 1px solid var(--hud-cyan-dim);
padding: 16px;
margin: 20px 0;
}
.hud-panel::before, .hud-panel::after{
content: "";
position: absolute;
pointer-events: none;
z-index: 2;
inset: 0;
background-repeat: no-repeat;
}
/* 四隅の鍵カッコ（HUDパネル風）: ::beforeで左上・右下、::afterで右上・左下 */
.hud-panel::before{
background-image:
linear-gradient(var(--hud-cyan), var(--hud-cyan)),
linear-gradient(var(--hud-cyan), var(--hud-cyan)),
linear-gradient(var(--hud-cyan), var(--hud-cyan)),
linear-gradient(var(--hud-cyan), var(--hud-cyan));
background-size:
14px 2px,
2px 14px,
14px 2px,
2px 14px;
background-position:
top -1px left -1px,
top -1px left -1px,
bottom -1px right -1px,
bottom -1px right -1px;
}
.hud-panel::after{
background-image:
linear-gradient(var(--hud-cyan), var(--hud-cyan)),
linear-gradient(var(--hud-cyan), var(--hud-cyan)),
linear-gradient(var(--hud-cyan), var(--hud-cyan)),
linear-gradient(var(--hud-cyan), var(--hud-cyan));
background-size:
14px 2px,
2px 14px,
14px 2px,
2px 14px;
background-position:
top -1px right -1px,
top -1px right -1px,
bottom -1px left -1px,
bottom -1px left -1px;
}
.hud-panel > *:first-child{ margin-top: 0; }
.hud-panel > *:last-child{ margin-bottom: 0; }
.entry-content a{
color: var(--hud-cyan) !important;
}
.entry-title{
color: var(--hud-ink) !important;
}
.wp-block-heading{
color: var(--hud-ink) !important;
}
.entry-content h2, .entry-content h3, .entry-content h4,
.entry-content .wp-block-heading{
border-color: var(--hud-cyan-dim) !important;
}
.entry-content h3 + p{
margin-top: 6px !important;
font-size: 13px !important;
color: var(--hud-ink-muted) !important;
}
/* キット名見出し（h3、赤背景バナーの直後にある「1/35 ○○（再販版）」等）を
サイバー系に（2026-08-06）。ボックスアート等のセクション見出しはh4なので
ここでは影響しない */
.entry-content h3.wp-block-heading{
color: var(--hud-amber, #f5e642) !important;
font-family: 'RocknRoll One', 'JetBrains Mono', Consolas, monospace !important;
letter-spacing: 0.04em !important;
margin-top: 28px !important;
}
.entry-content h3.wp-block-heading::before{
content: "▶";
display: inline-block;
margin-right: 8px;
font-size: 1.15em;
color: var(--hud-amber, #f5e642);
text-shadow: 0 0 3px rgba(245, 230, 66, 0.5);
}
/* セクション見出し（h4、「ボックスアート」「箱の側面」「ランナー」等）は
キット名見出し（h3、黄色＋矢印）とはっきり区別できるデザインに（2026-08-06）。
色はシアン、マーカーは◆、下線付きのラベル風にして階層を分ける */
.entry-content h4.wp-block-heading{
color: var(--hud-cyan, #35d6e8) !important;
font-family: 'JetBrains Mono', Consolas, monospace !important;
letter-spacing: 0.08em !important;
border-bottom: 1px dashed var(--hud-cyan-dim, #124a53) !important;
padding-bottom: 6px !important;
margin-top: 24px !important;
}
.entry-content h4.wp-block-heading::before{
content: "◆";
display: inline-block;
margin-right: 6px;
font-size: 0.7em;
color: var(--hud-cyan, #35d6e8);
}
/* 元の見出し（ランナー・デカール等）をまとめた小さいラベル
（section-image-scroll.jsが生成。2026-08-06追加） */
.hud-img-scroll-label{
color: var(--hud-amber, #f5e642) !important;
font-family: 'JetBrains Mono', Consolas, monospace !important;
font-size: 14px !important;
letter-spacing: 0.04em !important;
margin: 20px 0 4px !important;
}
/* h4見出し直後の画像群をまとめる横スクロール枠（section-image-scroll.jsが
ここにfigureを移動させる。2026-08-06追加） */
.hud-img-scroll{
display: flex;
gap: 12px;
overflow-x: auto;
padding: 4px 4px 12px;
margin: 8px 0 20px;
cursor: grab;
scrollbar-width: thin;
scrollbar-color: var(--hud-cyan, #35d6e8) var(--hud-panel-2, #0f1a26);
}
.hud-img-scroll::-webkit-scrollbar{
height: 8px;
}
.hud-img-scroll::-webkit-scrollbar-track{
background: var(--hud-panel-2, #0f1a26);
}
.hud-img-scroll::-webkit-scrollbar-thumb{
background: var(--hud-cyan, #35d6e8);
border-radius: 4px;
}
.hud-img-scroll::-webkit-scrollbar-thumb:hover{
background: var(--hud-amber, #f5e642);
}
.hud-img-scroll.is-dragging{
cursor: grabbing;
user-select: none;
}
.hud-img-scroll.is-dragging *{
pointer-events: none;
}
.hud-img-scroll figure.wp-block-image{
position: relative;
flex: 0 0 auto;
margin: 0 !important;
}
.hud-img-scroll figure.wp-block-image img{
height: 260px !important;
width: auto !important;
max-width: none !important;
display: block;
}
/* キャプション（ファイル名等）が画像より横長だと枠が広がり画像の左右に
隙間ができるため、画像の下に重ねて表示することで幅の影響を無くす
（2026-08-06） */
.hud-img-scroll figure.wp-block-image figcaption{
position: absolute;
left: 0;
right: 0;
top: 0;
margin: 0 !important;
padding: 3px 6px !important;
background: rgba(5, 7, 11, 0.75) !important;
color: var(--hud-ink, #dff7fa) !important;
font-size: 11px !important;
white-space: normal;
text-align: center;
}
/* トップページ一番上のタイトル（AME-MAME-BAR HEAD OFFICE）の文字装飾のみ
（枠・背景は付けない。ユーザーの意向で外した）。
2026-08-04、この見出しだけ「もっとサイバーな感じ」の指示でOrbitronに変更
（他の場所のJetBrains Monoはそのまま） */
.post-181 .entry-content > h2.wp-block-heading{
font-family: 'Orbitron', 'JetBrains Mono', Consolas, monospace;
font-size: 22px;
font-weight: 700;
letter-spacing: 0.14em;
color: var(--hud-cyan) !important;
background: transparent !important;
margin: 4px 0 10px !important;
}
.post-181 .entry-content > p.has-text-align-center:first-of-type{
font-size: 13px;
color: var(--hud-ink-muted);
letter-spacing: 0.04em;
margin: 0 0 4px;
}
/* トップページ ヒーロー（PICK UP、デザイン案通り：画像とテキストの横並びパネル） */
.hud-hero-panel{
padding: 0 !important;
overflow: hidden;
}
.hud-hero-inner{
display: grid;
grid-template-columns: 1fr 1fr;
}
@media (max-width: 560px){
.hud-hero-inner{ grid-template-columns: 1fr; }
}
.hud-hero-art{
position: relative;
min-height: 260px;
border-right: 1px solid var(--hud-cyan-dim);
background: var(--hud-panel-2);
}
.hud-hero-art img{
position: absolute;
top: 12px;
left: 12px;
width: calc(100% - 24px);
height: calc(100% - 24px);
object-fit: cover;
}
.hud-hero-text{
padding: 28px 32px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 12px;
}
.hud-hero-eyebrow{
font-family: 'JetBrains Mono', Consolas, monospace;
font-size: 11px;
color: var(--hud-cyan);
letter-spacing: 0.14em;
margin: 0;
}
.hud-hero-title{
font-size: 20px;
font-weight: 500;
color: var(--hud-ink);
margin: 0;
}
.hud-hero-desc{
font-size: 13px;
color: var(--hud-ink-muted);
line-height: 1.7;
margin: 0;
}
.hud-hero-cta{
margin-top: 4px;
align-self: flex-start;
border: 1px solid var(--hud-cyan);
color: var(--hud-cyan);
font-family: 'JetBrains Mono', Consolas, monospace;
font-size: 12px;
padding: 7px 16px;
text-decoration: none;
letter-spacing: 0.08em;
}
.hud-hero-cta:hover{
background: var(--hud-cyan);
color: var(--hud-bg-deep);
}
/* 新着レビュー（最新の投稿ブロックをカード風に再スタイル。中身は自動更新のまま） */
.wp-block-latest-posts.is-grid{
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
gap: 12px !important;
}
.wp-block-latest-posts.is-grid > li{
background: var(--hud-panel-2);
border: 1px solid var(--hud-cyan-line);
padding: 10px;
margin: 0 !important;
}
.wp-block-latest-posts__featured-image{
float: none !important;
margin: 0 0 8px !important;
width: auto !important;
}
.wp-block-latest-posts__featured-image img{
width: 100% !important;
height: 110px !important;
max-width: none !important;
max-height: none !important;
object-fit: cover !important;
display: block !important;
}
.wp-block-latest-posts li > a{
display: block;
font-size: 13px;
font-weight: 500;
color: var(--hud-ink) !important;
text-decoration: none !important;
line-height: 1.5;
}
.wp-block-latest-posts li > a:hover{
color: var(--hud-cyan) !important;
}
.wp-block-latest-posts__post-date{
display: block;
font-family: 'JetBrains Mono', Consolas, monospace;
font-size: 10px;
color: var(--hud-ink-muted) !important;
margin-top: 4px;
}
/* 新着レビュー（[hud_latest_reviews]ショートコード）カード */
.hud-review-grid{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
gap:12px;
}
.hud-review-card{
display:block;
background:var(--hud-panel-2);
border:1px solid var(--hud-cyan-line);
padding:10px;
text-decoration:none !important;
color:var(--hud-ink);
}
.hud-review-grade{
display:inline-block;
font-family:'JetBrains Mono',Consolas,monospace;
font-size:10px;
color:var(--hud-cyan);
border:1px solid var(--hud-cyan-dim);
padding:1px 6px;
margin-bottom:6px;
}
.hud-review-grade--empty{
visibility:hidden;
}
.hud-review-thumb{
height:90px;
margin-bottom:8px;
overflow:hidden;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
}
.hud-review-thumb img{
width:100%;
height:100%;
object-fit:cover;
display:block;
}
.hud-review-card h3{
margin:0 0 4px;
font-size:13px;
font-weight:500;
line-height:1.5;
color:var(--hud-ink);
border:none !important;
}
.hud-review-card:hover h3{
color:var(--hud-cyan);
}
.hud-review-card time{
font-family:'JetBrains Mono',Consolas,monospace;
font-size:10px;
color:var(--hud-ink-muted);
}
/* パネル内の見出し（NEW REVIEWS・YouTube Channel・Search for plastic models）
左右にひし形マーカーを添えて挟む形にする（2026-08-04、ユーザー指示で右側も追加） */
.hud-panel > h3.wp-block-heading::before,
.hud-panel > h3.wp-block-heading::after{
content:"";
display:inline-block;
width:6px;
height:6px;
margin-bottom:1px;
background:var(--hud-cyan);
transform:rotate(45deg);
}
.hud-panel > h3.wp-block-heading::before{
margin-right:8px;
}
.hud-panel > h3.wp-block-heading::after{
margin-left:8px;
}
/* パネル見出し3つ（Search for plastic models・YouTube Channel・NEW REVIEWS）は
色々試した結果、最終的に全部AME-MAME-BAR HEAD OFFICEと同じOrbitronで統一
（2026-08-04、ユーザー指示。RocknRoll One・DotGothic16・Monomaniac Oneを
個別に試した経緯があったため、クラス名は残しつつフォントは共通化） */
.hud-heading-tiles,
.hud-heading-youtube,
.hud-heading-reviews,
.hud-heading-scale{
font-family: 'Orbitron', 'JetBrains Mono', Consolas, monospace;
}
/* KIT DATAなどの表をパネル風に */
.entry-content table{
width: 90% !important;
margin: 4px auto 20px !important;
border-collapse: collapse !important;
background-color: var(--hud-panel-2) !important;
border: 1px solid var(--hud-cyan, #35d6e8) !important;
box-shadow: 0 0 8px rgba(53, 214, 232, 0.5), inset 0 0 12px rgba(53, 214, 232, 0.08) !important;
}
/* 「KIT DATA」等、表の直前にある見出し用の段落を表と同じ幅・左端に揃え、
表にくっつくくらい近づける */
.entry-content p:has(+ figure.wp-block-table){
width: 90% !important;
margin: 20px auto 2px !important;
}
.entry-content table td, .entry-content table th{
border: 1px dotted #2a8fa3 !important;
padding: 6px 10px !important;
color: var(--hud-ink) !important;
}
.entry-content table tr td:first-child,
.entry-content table tr th:first-child{
color: var(--hud-ink-muted) !important;
font-family: 'JetBrains Mono', Consolas, monospace !important;
font-size: 12px !important;
white-space: nowrap !important;
}
/* 記事下部のタグ一覧の枠を無くしてフラットに（2026-08-06） */
.entry-tags .tag-link.border-element,
.date-tags .tag-link.border-element{
border: none !important;
background: none !important;
padding: 0 !important;
margin: 0 0.8em 0.4em 0 !important;
}
.entry-tags .tag-link.border-element:hover,
.date-tags .tag-link.border-element:hover{
text-decoration: underline !important;
}
/* 記事上部の「1/35 scale」等のカテゴリーバッジも同様に枠・背景色を無くして
フラットに（2026-08-06）。Cocoon標準ではカテゴリーごとに自動で色が
割り当てられ、テーマの配色と合わないため統一する */
.entry-categories .cat-label,
.entry-categories .cat-link{
border: none !important;
background: none !important;
padding: 0 !important;
margin: 0 0.8em 0.4em 0 !important;
color: var(--hud-cyan, #35d6e8) !important;
}
.entry-categories .cat-link:hover{
text-decoration: underline !important;
}
/* 記事本文中の色付き見出し（シリーズ名バナー、Gutenbergの色パレット指定。
15種類以上の背景色（赤・indigo・watery-green等）が記事によってバラバラに
使われていることが判明したため、個別の色名を列挙せず、クラス名に
「-background-color」を含む見出し全部を対象にする汎用セレクターに変更
（2026-08-06）。元の文字色が何であってもシアンで上書きする。個別記事は
編集せず、この種の色指定を使っている記事すべてに一括で効く */
.entry-content h1[class*="-background-color"],
.entry-content h2[class*="-background-color"],
.entry-content h3[class*="-background-color"],
.entry-content h4[class*="-background-color"]{
position: relative;
background-color: var(--hud-panel-2, #0f1a26) !important;
border: 1px solid var(--hud-cyan-dim, #124a53) !important;
padding: 16px !important;
color: var(--hud-cyan, #35d6e8) !important;
font-family: 'RocknRoll One', 'JetBrains Mono', 'Consolas', monospace !important;
letter-spacing: 0.06em !important;
text-shadow: 0 0 8px rgba(53, 214, 232, 0.7), 0 0 16px rgba(53, 214, 232, 0.35) !important;
}
.entry-content h1[class*="-background-color"]::before,
.entry-content h2[class*="-background-color"]::before,
.entry-content h3[class*="-background-color"]::before,
.entry-content h4[class*="-background-color"]::before,
.entry-content h1[class*="-background-color"]::after,
.entry-content h2[class*="-background-color"]::after,
.entry-content h3[class*="-background-color"]::after,
.entry-content h4[class*="-background-color"]::after{
content: "";
position: absolute;
pointer-events: none;
z-index: 2;
inset: 0;
background-repeat: no-repeat;
}
.entry-content h1[class*="-background-color"]::before,
.entry-content h2[class*="-background-color"]::before,
.entry-content h3[class*="-background-color"]::before,
.entry-content h4[class*="-background-color"]::before{
background-image:
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8)),
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8)),
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8)),
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8));
background-size: 16px 2px, 2px 16px, 16px 2px, 2px 16px;
background-position:
top -1px left -1px,
top -1px left -1px,
bottom -1px right -1px,
bottom -1px right -1px;
}
.entry-content h1[class*="-background-color"]::after,
.entry-content h2[class*="-background-color"]::after,
.entry-content h3[class*="-background-color"]::after,
.entry-content h4[class*="-background-color"]::after{
background-image:
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8)),
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8)),
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8)),
linear-gradient(var(--hud-cyan, #35d6e8), var(--hud-cyan, #35d6e8));
background-size: 16px 2px, 2px 16px, 16px 2px, 2px 16px;
background-position:
top -1px right -1px,
top -1px right -1px,
bottom -1px left -1px,
bottom -1px left -1px;
}
/* 本文中の区切り線（色付き
、多くの記事で共通）を中央寄せで縮め、
元の色に近いネオンカラーに統一（2026-08-06）。色無しの区切り線
（is-style-wide等）は今回は対象外 */
.entry-content hr.has-red-background-color,
.entry-content hr.has-blue-background-color,
.entry-content hr.has-pink-background-color,
.entry-content hr.has-lime-background-color{
width: 90% !important;
height: 1px !important;
margin: 24px auto !important;
border: none !important;
}
.entry-content hr.has-red-background-color{
background-color: var(--hud-blue, #3d7cff) !important;
box-shadow: 0 0 8px rgba(61, 124, 255, 0.7), 0 0 16px rgba(61, 124, 255, 0.35) !important;
}
.entry-content hr.has-blue-background-color{
background-color: var(--hud-cyan, #35d6e8) !important;
box-shadow: 0 0 8px rgba(53, 214, 232, 0.7), 0 0 16px rgba(53, 214, 232, 0.35) !important;
}
.entry-content hr.has-pink-background-color{
background-color: var(--hud-magenta, #ff3fa4) !important;
box-shadow: 0 0 8px rgba(255, 63, 164, 0.7), 0 0 16px rgba(255, 63, 164, 0.35) !important;
}
.entry-content hr.has-lime-background-color{
background-color: var(--hud-green, #3dffa0) !important;
box-shadow: 0 0 8px rgba(61, 255, 160, 0.7), 0 0 16px rgba(61, 255, 160, 0.35) !important;
}
/* 色無しの区切り線（is-style-wide等、デフォルトで白っぽく表示されるもの）も
同じ扱いにしてシアンのネオンカラーに統一（2026-08-06）。既に色指定が
ある区切り線には影響しないよう:not()で除外 */
.entry-content hr.wp-block-separator:not(.has-red-background-color):not(.has-blue-background-color):not(.has-pink-background-color):not(.has-lime-background-color){
width: 90% !important;
height: 1px !important;
margin: 10px auto !important;
border: none !important;
background-color: var(--hud-cyan, #35d6e8) !important;
box-shadow: 0 0 8px rgba(53, 214, 232, 0.7), 0 0 16px rgba(53, 214, 232, 0.35) !important;
}
/* サイドバー */
#sidebar .widget{
background-color: var(--hud-panel) !important;
border: 1px solid var(--hud-cyan-dim) !important;
color: var(--hud-ink) !important;
}
#sidebar .widget a{
color: var(--hud-ink-muted) !important;
}
#sidebar .widget a:hover{
color: var(--hud-cyan) !important;
}
/* サイドバー プロフィール（Cocoon標準の「プロフィール」ウィジェット）
アバター・名前・SNSアイコンをHUD配色に寄せる。
左側のヒーロー/タイルパネルと同じ明るいシアンの枠で囲み、
本文まで含めて等幅フォント（デジタル風）にしている */
#sidebar .widget_author_box{
border: 1px solid rgba(53,214,232,0.45) !important;
box-shadow: 0 0 4px rgba(53,214,232,0.12);
}
.author-thumb img{
border: 2px solid var(--hud-cyan) !important;
border-radius: 50% !important;
}
#sidebar .author-name a{
font-family: 'DotGothic16', 'MS Pゴシック', 'MS Gothic', sans-serif !important;
color: var(--hud-cyan) !important;
letter-spacing: 0.06em;
}
#sidebar .author-description p{
font-family: 'DotGothic16', 'MS Pゴシック', 'MS Gothic', sans-serif !important;
font-size: 12px;
line-height: 1.7;
letter-spacing: 0.02em;
}
.author-follows .follow-button{
background: transparent !important;
border: 1px solid var(--hud-cyan-dim) !important;
}
.author-follows .follow-button:hover{
border-color: var(--hud-cyan) !important;
filter: brightness(1.3);
}
/* シリーズ詳細ページの記事一覧を画像タイルでスケールごとに表示（2026-08-04）。
タイルは.hud-series-tile（フロントページのシリーズタイルと同じ見た目）を再利用。
標準のCocoon記事一覧（#list）はこのページでは非表示にして差し替える。
全体をトップページと同じ.hud-panel（四隅に鍵カッコ）で囲んでいる。 */
.series-scale-group-title{
font-family: 'JetBrains Mono', Consolas, monospace;
font-size: 13px;
color: var(--hud-cyan);
margin: 22px 0 10px;
padding-top: 14px;
border-top: 1px solid var(--hud-cyan-dim);
}
.series-scale-panel .series-scale-group-title:first-child{
margin-top: 0;
padding-top: 0;
border-top: none;
}
.series-scale-group-grid{
justify-content: flex-start;
}
/* 大見出し（例:「新キット」「旧キット」）。hud_family_children_is_grouped()が
trueのシリーズ（今のところガンダムのみ）でだけ使われる（2026-08-04追加） */
.series-supergroup-title{
font-family: 'Orbitron', 'JetBrains Mono', Consolas, monospace;
font-size: 16px;
letter-spacing: 0.06em;
color: var(--hud-cyan);
margin: 32px 0 14px;
padding-bottom: 8px;
border-bottom: 2px solid var(--hud-cyan);
/* トップページのタイルから#newkit/#oldkitでジャンプした時に見出しの真上で
止まるよう余白を確保（2026-08-05追加） */
scroll-margin-top: 90px;
}
.series-supergroup-title:first-child{
margin-top: 0;
}
/* 対象カテゴリーの判定はfunctions.php側のbody_classフィルター
（hud-series-page、hud_current_series_id()を参照）に一本化した
（2026-08-05、以前はここに対象カテゴリーIDを1つずつ列挙しており、
シリーズ追加のたびにfunctions.phpと二重管理になっていた。
.pagination・.pagination-nextは標準の記事一覧に付随するページ送り
リンクで、このページでは投稿を全件タイル表示するため不要かつ、
投稿数の少ないシリーズでは実体のないページへのリンクになっていたため
同時に非表示にする）。 */
body.hud-series-page #list,
body.hud-series-page .pagination,
body.hud-series-page .pagination-next{
display: none !important;
}
.search-box.input-box{
background-color: var(--hud-panel-2) !important;
border: 1px solid var(--hud-cyan-dim) !important;
}
.search-box .search-edit{
background: transparent !important;
color: var(--hud-ink) !important;
}
/* ランキングバナー2種を非表示（以前の合意通り廃止） */
#block-81, #block-82, #block-108, #block-110{
display: none !important;
}
/* YouTube動画 自動スクロール一覧（スクロールバーは出さない） */
.hud-yt-hscroll{
overflow:hidden;
margin:12px 0;
}
.hud-yt-track{
display:flex;
gap:12px;
width:max-content;
animation: hud-yt-scroll 40s linear infinite;
}
.hud-yt-hscroll:hover .hud-yt-track{
animation-play-state: paused;
}
@keyframes hud-yt-scroll{
from{ transform: translateX(0); }
to{ transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
.hud-yt-track{ animation: none; overflow-x: auto; }
}
.hud-yt-card{
flex:0 0 160px;
background:var(--hud-panel-2);
border:1px solid var(--hud-cyan-line);
padding:8px;
text-decoration:none;
color:var(--hud-ink);
display:block;
}
.hud-yt-card .hud-yt-thumb{
position:relative;
height:90px;
margin-bottom:6px;
overflow:hidden;
background:#000;
}
.hud-yt-card .hud-yt-thumb img{
width:100%;height:100%;object-fit:cover;
opacity:0.85;
}
.hud-yt-card .hud-yt-play{
position:absolute;top:50%;left:50%;
transform:translate(-50%,-50%);
width:0;height:0;
border-style:solid;
border-width:10px 0 10px 16px;
border-color:transparent transparent transparent var(--hud-cyan);
filter:drop-shadow(0 0 3px rgba(0,0,0,0.8));
}
.hud-yt-card h4{
margin:0;
font-size:11px;
font-weight:500;
line-height:1.5;
}
.hud-yt-card:hover h4{
color: var(--hud-cyan);
}
/* トップページのYouTube欄・タイル欄をウィジェットから編集できるようにした際の見た目
（通常の画像ウィジェット＝![]()
を、カード/タイル風にCSSだけで整形） */
.hud-yt-card-wrap{
flex:0 0 160px;
background:var(--hud-panel-2);
border:1px solid var(--hud-cyan-line);
padding:8px;
}
.hud-yt-card-wrap figure{ margin:0; }
.hud-yt-card-wrap a{ position:relative; display:block; }
.hud-yt-card-wrap img{
width:100%; height:90px; object-fit:cover; display:block;
opacity:0.85; margin-bottom:6px;
}
.hud-yt-card-wrap a::after{
content:;
position:absolute; top:36px; left:50%;
transform:translate(-50%,-50%);
width:0;height:0;
border-style:solid;
border-width:10px 0 10px 16px;
border-color:transparent transparent transparent var(--hud-cyan);
filter:drop-shadow(0 0 3px rgba(0,0,0,0.8));
}
.hud-yt-card-wrap figcaption{
font-size:11px; font-weight:500; line-height:1.5;
color:var(--hud-ink);
}
.hud-yt-card-wrap:hover figcaption{
color: var(--hud-cyan);
}
.hud-widget-title{ display:none; }
/* サイドバー「AME-MAME-BAR YOUTUBE LIST」の縦スクロール一覧
（sidebar-youtube-vscroll.jsが画像ウィジェットをここへ移動する。
トップページのYouTube欄（横スクロール）の縦バージョン。2026-08-06追加） */
.hud-yt-vscroll{
height: 420px;
overflow: hidden;
position: relative;
margin: 12px 0;
}
.hud-yt-vtrack{
display: flex;
flex-direction: column;
gap: 12px;
animation: hud-yt-vscroll-move 90s linear infinite;
}
.hud-yt-vscroll:hover .hud-yt-vtrack{
animation-play-state: paused;
}
@keyframes hud-yt-vscroll-move{
from{ transform: translateY(0); }
to{ transform: translateY(-50%); }
}
@media (prefers-reduced-motion: reduce){
.hud-yt-vtrack{ animation: none; }
.hud-yt-vscroll{ overflow-y: auto; }
}
.hud-yt-vtrack .widget_media_image{
flex: 0 0 auto;
background: var(--hud-panel-2);
border: 1px solid var(--hud-cyan-line);
padding: 8px;
margin: 0 !important;
}
.hud-yt-vtrack .widget_media_image figure{ margin: 0; }
.hud-yt-vtrack .widget_media_image a{ position: relative; display: block; }
.hud-yt-vtrack .widget_media_image img{
width: 100%; height: auto; display: block;
opacity: 0.85; margin-bottom: 6px;
}
.hud-yt-vtrack .widget_media_image a::after{
content: "";
position: absolute; top: 50%; left: 50%;
transform: translate(-50%, -50%);
width: 0; height: 0;
border-style: solid;
border-width: 10px 0 10px 16px;
border-color: transparent transparent transparent var(--hud-cyan);
filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.8));
}
.hud-yt-vtrack .widget_media_image figcaption{
font-size: 11px; font-weight: 500; line-height: 1.5;
color: var(--hud-ink);
}
.hud-yt-vtrack .widget_media_image:hover figcaption{
color: var(--hud-cyan);
}
.hud-series-tile-wrap{
position:relative;
flex:0 0 100px;
aspect-ratio:3/4;
overflow:hidden;
border:2px solid var(--hud-cyan);
clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
transition: border-width 0.15s ease;
}
.hud-series-tile-wrap:hover{ border-width:4px; }
.hud-series-tile-wrap figure{ margin:0; height:100%; position:relative; }
.hud-series-tile-wrap a{ display:block; height:100%; }
.hud-series-tile-wrap img{
width:100%; height:100%; object-fit:cover; object-position:top center; display:block;
transition: filter 0.15s ease;
}
.hud-series-tile-wrap:hover img{ filter:brightness(1.2); }
.hud-series-tile-wrap figure::after{
content:"";
position:absolute; inset:0;
background:linear-gradient(180deg, rgba(5,7,11,0) 55%, rgba(5,7,11,0.9) 100%);
pointer-events:none;
}
/* キャプション文字は画像に重ねず、title属性のネイティブツールチップにしている
（2026-08-04、シリーズ詳細ページの個別タイルと挙動を揃えた。以前あった
.hud-series-tile-wrap figcaptionのスタイルは、HUD_Tile_Widgetがfigcaptionを
出力しなくなったため削除済み） */
/* スケールモデル タイル（SEARCH FOR SCALE MODEL欄、2026-08-04追加）。
.hud-series-tile-wrapとほぼ同じ作りだが、スケールモデルは横長の写真が
多いため、縦横比を4:3（横長）に変更・タイル幅も少し広げてある */
.hud-scale-tile-wrap{
position:relative;
flex:0 0 130px;
aspect-ratio:4/3;
overflow:hidden;
border:2px solid var(--hud-cyan);
clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
transition: border-width 0.15s ease;
}
.hud-scale-tile-wrap:hover{ border-width:4px; }
.hud-scale-tile-wrap figure{ margin:0; height:100%; position:relative; }
.hud-scale-tile-wrap a{ display:block; height:100%; }
.hud-scale-tile-wrap img{
width:100%; height:100%; object-fit:cover; object-position:center center; display:block;
transition: filter 0.15s ease;
}
.hud-scale-tile-wrap:hover img{ filter:brightness(1.2); }
.hud-scale-tile-wrap figure::after{
content:"";
position:absolute; inset:0;
background:linear-gradient(180deg, rgba(5,7,11,0) 55%, rgba(5,7,11,0.9) 100%);
pointer-events:none;
}
/* キャラクタープラモ タイル一覧 */
.hud-series-grid{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:18px;
margin:16px 0;
}
.hud-series-tile{
position:relative;
flex:0 0 100px;
aspect-ratio:3/4;
overflow:hidden;
border:3px solid var(--hud-cyan);
box-shadow: 0 0 0 1px var(--hud-bg-deep), 0 0 6px rgba(53,214,232,0.6);
clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
text-decoration:none;
color:var(--hud-ink);
background:#fff;
display:block;
}
.hud-series-tile img{
position:absolute;inset:0;width:100%;height:100%;
object-fit:cover;object-position:top center;
}
.hud-series-tile .hud-scrim{
position:absolute;inset:0;
background:linear-gradient(180deg, rgba(5,7,11,0) 55%, rgba(5,7,11,0.9) 100%);
}
.hud-series-tile .hud-label{
position:absolute;left:7px;right:7px;bottom:6px;
font-size:11px;font-weight:500;
text-shadow:0 1px 2px rgba(0,0,0,0.8);
}
.hud-series-tile{
transition: border-width 0.15s ease, border-color 0.15s ease;
}
.hud-series-tile img{
transition: filter 0.15s ease;
}
.hud-series-tile:hover{
border-width: 4px;
}
.hud-series-tile:hover img{
filter: brightness(1.2);
}
/* スケールモデル（自動車・オートバイ・軍用車両・飛行機）の個別タイル。
.hud-series-tileとほぼ同じだが、横長の写真が多いため縦横比を4:3（横長）に、
幅も少し広げてある（2026-08-04追加。1行あたりの並び数が変わってもよいと
ユーザー確認済み） */
.hud-scale-tile{
position:relative;
flex:0 0 140px;
aspect-ratio:4/3;
overflow:hidden;
border:3px solid var(--hud-cyan);
box-shadow: 0 0 0 1px var(--hud-bg-deep), 0 0 6px rgba(53,214,232,0.6);
clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
text-decoration:none;
color:var(--hud-ink);
background:#fff;
display:block;
transition: border-width 0.15s ease, border-color 0.15s ease;
}
.hud-scale-tile img{
position:absolute;inset:0;width:100%;height:100%;
object-fit:cover;object-position:center center;
transition: filter 0.15s ease;
}
.hud-scale-tile:hover{
border-width: 4px;
}
.hud-scale-tile:hover img{
filter: brightness(1.2);
}
/* スマホ（480px以下）ではタイルを正方形比率に切り替え。
PC/スマホ切替ウィジェット（HUD_Tile_Widget）のpicture要素が
同じ幅でスマホ用画像に切り替わるのに合わせて、枠の比率も揃える */
@media screen and (max-width: 480px){
.hud-series-tile-wrap{
aspect-ratio: 1/1;
}
}
/* フッター */
#footer{
background-color: var(--hud-bg-deep) !important;
border-top: 1px solid var(--hud-cyan-dim) !important;
color: var(--hud-ink-muted) !important;
}
#footer a{
color: var(--hud-ink-muted) !important;
}
/* 記事一覧のカード（カテゴリー・アーカイブページなど） */
.entry-card{
background-color: var(--hud-panel) !important;
border: 1px solid var(--hud-cyan-dim) !important;
color: var(--hud-ink) !important;
}
.entry-card-title, .entry-card-title a{
color: var(--hud-ink) !important;
}
.entry-card-title a:hover{
color: var(--hud-cyan) !important;
}
.entry-card-content, .entry-card-content a{
color: var(--hud-ink-muted) !important;
}
.entry-card .post-date{
color: var(--hud-ink-muted) !important;
}
.entry-card-thumb{
border-bottom: 1px solid var(--hud-cyan-dim) !important;
}
/* パンくず・ページヘッダー・ページネーション */
.breadcrumb, .breadcrumb a{
color: var(--hud-ink-muted) !important;
}
.page-header, .archive-title, .content-header{
background-color: var(--hud-panel) !important;
border: 1px solid var(--hud-cyan-dim) !important;
color: var(--hud-ink) !important;
}
.pagination a, .pagination span{
background-color: var(--hud-panel-2) !important;
border: 1px solid var(--hud-cyan-dim) !important;
color: var(--hud-ink-muted) !important;
}
.pagination .current{
color: var(--hud-cyan) !important;
border-color: var(--hud-cyan) !important;
}
/***************************************************************
** レトロ裏メニュー（ソフビ・プラレール・映画チラシ）配色
** 90年代・古き良きインターネット風。対象カテゴリーのページだけ、
** CSS変数を上書きすることでHUD系ダークテーマのルールをそのまま
** 転用している（第一段階：配色・フォントのみ、装飾要素は今後）。
***************************************************************/
body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570{
--hud-bg-deep:#142b52;
--hud-panel:#fef9ec;
--hud-panel-2:#fdf6e3;
--hud-cyan:#0000ee;
--hud-cyan-dim:#7d2fae;
--hud-cyan-line:#999966;
--hud-ink:#1a1a1a;
--hud-ink-muted:#555;
font-family:'DotGothic16',"MS Pゴシック","MS Gothic",sans-serif !important;
}
body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 html, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 body, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 #container{
background-image:
repeating-linear-gradient(45deg, #1c3a6e 0 6px, #142b52 6px 12px) !important;
background-size: auto !important;
}
body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .entry-content a, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 #sidebar .widget a{
text-decoration: underline !important;
}
body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .hud-panel::before, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .hud-panel::after{
background-image: none !important;
border: none !important;
}
body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .hud-panel, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .article, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .entry-content{
border: 2px solid #000 !important;
}
body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .entry-title, body.categoryid-5, body.categoryid-17, body.categoryid-18, body.categoryid-376, body.categoryid-377, body.categoryid-418, body.categoryid-419, body.categoryid-420, body.categoryid-421, body.categoryid-422, body.categoryid-423, body.categoryid-424, body.categoryid-425, body.categoryid-426, body.categoryid-427, body.categoryid-428, body.categoryid-429, body.categoryid-430, body.categoryid-431, body.categoryid-432, body.categoryid-433, body.categoryid-434, body.categoryid-435, body.categoryid-436, body.categoryid-437, body.categoryid-438, body.categoryid-439, body.categoryid-440, body.categoryid-1771, body.categoryid-1772, body.categoryid-1785, body.categoryid-1868, body.categoryid-2570 .wp-block-heading{
font-family:'DotGothic16',"MS Pゴシック","MS Gothic",sans-serif !important;
}
/***************************************************************
** 資料室別館（レトロ裏メニューのハブページ）
** 2026-08-03追加。Artifact「資料室別館（レトロ裏メニュー案）」の
** モックアップをそのままCSS化。.retro-rootでスコープし、他ページの
** クラス名（.section-title等）と衝突しないようretro-プレフィックスを
** 付けている。固定ページ側はwp:htmlブロックでこのクラス構造を出力する。
***************************************************************/
.retro-root, .retro-root *{
box-sizing: border-box;
}
.retro-root{
min-height: 100vh;
--retro-navy: #142b52;
--retro-navy-2: #1c3a6e;
--retro-panel: #fef9ec;
--retro-edge: #000000;
--retro-ink: #1a1a1a;
--retro-link: #0000ee;
--retro-link-visited: #7d2fae;
--retro-pink: #ff2f92;
--retro-gold: #ffb400;
--retro-led: #2f9e44;
font-family: 'DotGothic16', "MS Pゴシック", "MS Gothic", sans-serif;
color: var(--retro-ink);
background-color: var(--retro-navy);
background-image: repeating-linear-gradient(45deg, var(--retro-navy-2) 0 6px, var(--retro-navy) 6px 12px);
padding: 20px 12px;
display: flex;
justify-content: center;
}
.retro-frame{
max-width: 760px;
width: 100%;
background: var(--retro-panel);
border: 2px solid var(--retro-edge);
box-shadow: 4px 4px 0 rgba(0,0,0,0.35);
}
/* 上部の流れる帯（marquee、CSSアニメーションで実装。