/* ===== 20_site.css ===== */
/* ===== O01056 株式会社五日市設備 site.css =====
   受領14ページの helmet 内 style を全ページ union（同一宣言は1本化・食い違いは index 優先）。
   ・受領の `[style*="font-size: 27px"]` 等の style属性セレクタは `[data-sw-m~="mN"]` へ振り替え済み。
     dc-runtime は style をCSSOMで再直列化する（コロンの後に空白／`150px 0`→`150px 0px`）ため受領
     プレビューでは当たるが、納品HTMLの生テキストには空白が無く当たらない。マーク属性にして同じ結果を再現。
   ・受領の image-slot 要素セレクタは `img.gs-slot` へ振り替え済み。
   ・::before/::after の content 依存装飾（ドロワーの×）は実 span へ昇格済み（R-27）。
 */
/* === 案件トークン（このファイルの先頭に置く） === */
/* KEEP: 固定ヘッダー高さ（R-18）。skin がシステム描画ページの上余白に加算する。
   ★実測値（transition停止・scrollY=0・iframe実測 2026-09-11）：
     PC  = padding 26px×2 + ロゴブロック53px ＝ 105px
     SP  = padding 16px×2 + ロゴブロック42px ＝  76px
   旧値 98px/66px はロゴを「丸アイコンの高さ(46/34px)」で見積もっており、
   実際はアイコン横のテキスト列（社名＋肩書き）の方が高い。この差分が
   下層ページの英字ラベル（BUSINESS / COMPANY）への被りの原因だった。
   切替幅は下の ① と揃えて 1170px（スクロールバー15px込み）。 */
:root{ --fixed-header-h: 105px; }
@media (max-width:1170px){ :root{ --fixed-header-h: 76px; } }
/* /KEEP */
 
/* KEEP: skin（動的パーツ）へ渡す書体トークン。skin §0 が var(--font-*) を参照する */
:root{
  --font-display: 'Zen Old Mincho', serif;
  --font-body: 'Zen Kaku Gothic New', sans-serif;
  --font-numeric: 'Roboto', sans-serif;
}
/* /KEEP */
*{box-sizing:border-box}
body{margin:0;background:#fff;color:#1f2733;font-family:"Zen Kaku Gothic New",sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:#2C6FB3;text-decoration:none}
a:hover{color:#2B5581}
img{display:block;max-width:100%}
span.line-chunk{display:inline-block;overflow-wrap:anywhere;word-break:normal}
@keyframes gs-loopV{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes gs-loopVdown{from{transform:translateY(-50%)}to{transform:translateY(0)}}
@keyframes gs-waveH{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes gs-heroRise{0%{transform:translateY(115%)}55%{opacity:1}100%{transform:translateY(0);opacity:1}}
[data-hero-catch] .line-chunk{display:inline-block;transform:translateY(115%);opacity:0}
body.gs-loaded [data-hero-catch] .line-chunk{animation:gs-heroRise 1s cubic-bezier(.16,.84,.28,1) both}
body.gs-loaded [data-hero-catch] > span:nth-child(1) .line-chunk{animation-delay:.55s}
body.gs-loaded [data-hero-catch] > span:nth-child(2) .line-chunk{animation-delay:.72s}
@media (prefers-reduced-motion: reduce){
  [data-hero-catch] .line-chunk{transform:none;opacity:1;animation:none}
}
@keyframes gsl-dropfall{0%{transform:translateY(-46px) scaleY(1.12);opacity:0}16%{opacity:1}60%{transform:translateY(34px) scaleY(1);opacity:1}72%{transform:translateY(34px) scaleY(.85);opacity:0}100%{opacity:0}}
@keyframes gsl-sweep{0%{background-position:135% 0}100%{background-position:-135% 0}}
@keyframes gsl-flow{0%{width:0}70%{width:100%}100%{width:100%}}
@keyframes gsl-flowDot{0%{left:0;opacity:0}8%{opacity:1}70%{left:100%;opacity:1}80%{opacity:0}100%{left:100%;opacity:0}}
#gs-loader{position:fixed;inset:0;z-index:9999;background:#eef4fa;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:opacity .6s ease,visibility .6s ease}
body.gs-loaded #gs-loader{opacity:0;visibility:hidden;pointer-events:none}
header[data-screen-label="ヘッダー"]{transition:background .3s ease,box-shadow .3s ease,padding .3s ease}
.gs-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0;background:none;border:0;cursor:pointer}
.gs-hamburger span{display:block;width:24px;height:2px;background:#fff;transition:transform .3s,opacity .3s}
body.gs-nav-open .gs-hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
body.gs-nav-open .gs-hamburger span:nth-child(2){opacity:0}
body.gs-nav-open .gs-hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.gs-drawer-overlay{position:fixed;inset:0;background:rgba(9,26,44,.55);opacity:0;pointer-events:none;transition:opacity .3s;z-index:70}
body.gs-nav-open .gs-drawer-overlay{opacity:1;pointer-events:auto}
.gs-drawer{position:fixed;top:0;right:0;height:100%;width:min(84vw,340px);background:#1E4064;transform:translateX(105%);transition:transform .34s ease;z-index:71;padding:92px 32px 40px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
body.gs-nav-open .gs-drawer{transform:none !important}
.gs-drawer a{color:#fff;text-decoration:none}
/* ⑤ タップ領域44px。×アイコン自体は24pxのまま、当たり判定だけ 40→44px。
   x1/x2 は (44-2)/2=21px, (44-24)/2=10px で再センタリング（見た目の位置は不変）。 */
.gs-d-close{position:absolute;top:26px;right:24px;width:44px;height:44px;background:none;border:0;cursor:pointer}
.gs-d-close > .gs-d-x1,.gs-d-close > .gs-d-x2{position:absolute;top:21px;left:10px;width:24px;height:2px;background:#fff}
.gs-d-close > .gs-d-x1{transform:rotate(45deg)}
.gs-d-close > .gs-d-x2{transform:rotate(-45deg)}
.gs-d-link{padding:15px 4px;font-size:16px;letter-spacing:.04em;border-bottom:1px solid rgba(255,255,255,.14)}
/* ⑤ 43px → 44px。padding を触ると字下げが変わるので min-height で確保する */
.gs-d-sub{display:flex;align-items:center;min-height:44px;padding:11px 4px 11px 20px;font-size:14px;color:rgba(255,255,255,.8);border-bottom:1px solid rgba(255,255,255,.08)}
.gs-d-label{padding:16px 4px 4px;font-size:16px;letter-spacing:.04em;color:#fff}
.gs-d-cta{margin-top:26px;display:flex;align-items:center;justify-content:center;min-height:52px;background:#5FB8E6;color:#2B5581;font-weight:700;font-size:15px}
/* ① ヘッダー2段化の解消（全14ページ）
   PCナビが1段に収まるのに必要な版面幅は 実測 1150px
   （ロゴ295 + gap24 + ナビ736 + 左右padding96）。
   メディアクエリの幅は「スクロールバーを含む innerWidth」で評価されるため、
   デスクトップの縦スクロールバー15px を足した 1170px を切替点にする。
   1147px では 1148〜1164px の帯でナビが折り返し、2段（153px）が残った。 */
@media (max-width:1170px){
  .gs-desktop-nav{display:none !important}
  .gs-hamburger{display:flex}
  header[data-screen-label="ヘッダー"]{padding:16px 22px !important}
  body.hd-scrolled header[data-screen-label="ヘッダー"]{padding:12px 22px !important}
  body.gs-nav-open{overflow:hidden}
}
.gs-g2{grid-template-columns:repeat(2,1fr)}
.gs-g3{grid-template-columns:repeat(3,1fr)}
.gs-g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:980px){
  .gs-g4{grid-template-columns:repeat(2,1fr) !important}
}
@media (max-width:560px){
  .gs-g4{grid-template-columns:1fr !important}
}
@media (max-width:700px){
  .gs-g2,.gs-g3{grid-template-columns:1fr !important}
}
body.hd-scrolled header[data-screen-label="ヘッダー"]{background:#1E4064;box-shadow:0 6px 24px rgba(9,26,44,.28);padding-top:16px !important;padding-bottom:16px !important}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important}
}
/* ① HTML側インラインの flex-wrap:wrap を全幅で打ち消す。
   これが残っていると、切替点の直前で「ロゴ／ナビ」が2段に折り返る。
   ナビは 1171px 以上でのみ表示され、そこでは必ず1段に収まる（実測）。 */
.gs-header-inner{flex-wrap:nowrap !important}
@media (max-width:1170px){
  .gs-header-inner{gap:14px !important}
  .gs-header-inner>a:first-child{min-width:0 !important;flex:0 1 auto !important;overflow:hidden !important}
  .gs-hamburger{flex:0 0 auto !important;margin-left:auto !important}
  /* ロゴ縮小。従来は 1024px 以下だったが、ハンバーガー化と同じ 1170px へ引き上げる。
     ここを揃えないと 1025〜1170px でロゴだけ大きいままになり、
     ヘッダー実高が --fixed-header-h(76px) と食い違う。 */
  .gs-header-inner>a:first-child>span:first-child{width:34px !important;height:34px !important}
  .gs-header-inner>a:first-child span{white-space:nowrap !important}
  .gs-header-inner>a:first-child span[data-sw-m~="m1"]{font-size:19px !important;letter-spacing:.12em !important}
  .gs-header-inner>a:first-child span[data-sw-m~="m2"]{font-size:12px !important}
  /* ⑨ キャッチ（肩書き行）の逃げ。letter-spacing を .06em → .04em */
  .gs-header-inner>a:first-child span[data-sw-m~="m3"]{font-size:9.5px !important;letter-spacing:.04em !important}
}
/* ⑨ 切り取り枠の右端と最後の字の右端が 0.00px で一致していたため、
   端末のまるめ／Webフォント読込中のフォールバックで最後の1字が欠けていた。3px の逃げを作る。 */
.gs-header-inner>a:first-child{padding-right:3px}
@media (max-width:1024px){
  /* ロゴ縮小5行は ① により 1170px のブロックへ移設（重複定義を避けるためここからは撤去） */
  [data-sw-m~="m4"]{padding-top:70px !important;padding-bottom:74px !important}
  [data-sw-m~="m5"]{padding-top:70px !important;padding-bottom:74px !important}
  [data-sw-m~="m6"]{padding-top:70px !important;padding-bottom:74px !important}
  [data-sw-m~="m7"]{padding-left:22px !important;padding-right:22px !important}
  [data-sw-m~="m8"]{padding-left:22px !important;padding-right:22px !important}
  [data-sw-m~="m9"]{height:100svh !important;min-height:560px !important}
  [data-sw-m~="m10"]{bottom:auto !important;top:48svh !important}
  [data-sw-m~="m11"]{font-size:32px !important}
  [data-sw-m~="m12"]{display:none !important}
  .gs-value-flex{flex-direction:column !important;align-items:stretch !important;gap:34px !important}
  .gs-value-vtext{justify-content:flex-end !important}
  [data-sw-m~="m13"]{width:100% !important}
  [class*="design-parts-52"] .content{display:block !important;padding:14px 0 !important}
  [class*="design-parts-52"] .banner-area{display:inline-flex !important;align-self:flex-start !important;padding:6px 16px !important;margin-bottom:8px !important}
  [class*="design-parts-52"] li{min-height:0 !important}
  [class*="design-parts-52"] li a{padding:6px 0 !important}
  [class*="design-parts-52"] .parts-52-textarea{flex-wrap:wrap !important;gap:2px 16px !important}
  [class*="design-parts-52"] .d-inline-block{white-space:normal !important;overflow:visible !important;text-overflow:clip !important;line-height:1.6 !important}
  [data-sw-m~="m14"]{padding:40px 26px !important}
  [data-sw-m~="m15"]{font-size:60px !important}
  .gs-works-grid{grid-template-columns:1fr !important;grid-auto-rows:210px !important}
  [data-sw-m~="m16"]{grid-row:auto !important}
  [data-sw-m~="m17"]{grid-column:auto !important}
  .gs-rc-tags{grid-auto-rows:1fr !important}
  .gs-rc-tags>span{display:flex !important;align-items:center !important;justify-content:center !important;min-height:52px !important}
  [data-sw-m~="m18"]{max-width:none !important}
  #contact [data-sw-m~="m19"]{flex-wrap:wrap !important;gap:6px 16px !important}
  [data-sw-m~="m20"]{font-size:23px !important}
}
@media (max-width:760px){
  [data-sw-m~="m21"]{writing-mode:horizontal-tb !important;text-orientation:mixed !important;max-height:none !important;line-height:1.7 !important}
  .gs-value-flex{flex-direction:column-reverse !important;align-items:stretch !important;gap:34px !important}
  [data-sw-m~="m13"]{width:100% !important}
  [data-sw-m~="m22"]{height:220px !important}
  .gs-value-vtext{height:auto !important;flex-direction:column-reverse !important;align-items:flex-start !important;gap:22px !important}
  .gs-value-vtext span[data-sw-m~="m23"], .gs-recruit-visual span[data-sw-m~="m23"], .gs-contact-visual span[data-sw-m~="m23"]{display:none !important}
  .gs-recruit-visual>div:first-child, .gs-contact-visual>div:first-child{flex-direction:column !important;align-items:flex-start !important;gap:10px !important}
  .gs-recruit-grid{grid-template-columns:1fr !important;gap:40px !important;padding:0 22px !important}
  [data-sw-m~="m24"]{height:auto !important}
  .gs-recruit-visual{flex-direction:column !important;align-items:stretch !important;gap:26px !important}
  .gs-recruit-visual>div:last-child{height:280px !important;flex:0 0 280px !important}
  .gs-contact-grid{grid-template-columns:1fr !important;gap:40px !important}
  .gs-contact-grid>div{min-width:0 !important}
  .gs-contact-visual{min-height:0 !important;flex-direction:column !important;align-items:stretch !important;gap:24px !important}
  .gs-contact-visual>div:last-child{height:300px !important;flex:0 0 300px !important}
}
.gs-biz-img{overflow:hidden}
@media (max-width:1024px){
  .gs-biz-row{height:auto !important;margin-bottom:44px !important}
  .gs-biz-accent{display:none !important}
  .gs-biz-row img.gs-slot{position:relative !important;width:100% !important;height:230px !important;display:block !important;overflow:hidden !important}
  .gs-biz-overlay{display:none !important}
  .gs-biz-card{position:static !important;width:100% !important;transform:none !important;top:auto !important;left:auto !important;right:auto !important;box-shadow:0 14px 30px rgba(9,26,44,.10) !important;padding:30px 30px !important;margin-top:0 !important}
  .gs-biz-card h3[data-sw-m~="m20"]{font-size:24px !important}
  #service [data-sw-m~="m25"]{margin-bottom:40px !important}
}
.svc-row:nth-child(even){grid-template-columns:1fr 500px !important}
.svc-row:nth-child(even) .svc-img{order:2}
.svc-row:nth-child(even) .svc-txt{order:1;padding:52px 4px 52px 56px !important}
@media (max-width:1200px){
  .svc-row,.svc-row:nth-child(even){grid-template-columns:1fr !important}
  .svc-row:nth-child(even) .svc-img{order:0}
  .svc-txt,.svc-row:nth-child(even) .svc-txt{padding:36px 36px 40px !important}
}
@media (max-width:760px){
  a[data-sw-m~="m26"],a[data-sw-m~="m27"],a[data-sw-m~="m28"],a[data-sw-m~="m29"],a[data-sw-m~="m30"],a[data-sw-m~="m31"],a[data-sw-m~="m32"],.contact_submit input[type="submit"]{display:flex !important;width:100% !important;box-sizing:border-box !important;padding-left:18px !important;padding-right:18px !important;font-size:15px !important;text-align:center !important;white-space:normal !important}
  [data-sw-m~="m33"][data-sw-m~="m19"]{flex-direction:column !important;align-items:flex-start !important;gap:8px !important}
  [data-screen-label="ページヒーロー"] h1{font-size:30px !important;line-height:1.45 !important}
}
@media (min-width:761px) and (max-width:1024px){
  [data-screen-label="沿革"] [data-sw-m~="m34"][data-sw-m~="m35"]{display:none !important}
  [data-screen-label="沿革"] [data-sw-m~="m36"]{height:auto !important;display:flex !important;align-items:center !important;gap:22px !important;margin-bottom:24px !important;max-width:600px !important;margin-left:auto !important;margin-right:auto !important}
  [data-screen-label="沿革"] [data-sw-m~="m37"][data-sw-m~="m38"]{position:static !important;transform:none !important;order:1 !important;flex:0 0 auto !important}
  [data-screen-label="沿革"] [data-sw-m~="m39"]{position:static !important;transform:none !important;order:2 !important;width:auto !important;flex:1 1 auto !important;text-align:left !important}
}
@media (max-width:760px){
  [data-screen-label="物語"] [data-sw-m~="m40"]{flex-direction:column !important;height:auto !important;align-items:stretch !important;gap:22px !important}
  [data-screen-label="物語"] [data-sw-m~="m41"]{height:230px !important;flex:0 0 230px !important}
  [data-screen-label="物語"] [data-sw-m~="m40"] > :nth-child(1){order:0 !important}
  [data-screen-label="物語"] [data-sw-m~="m40"] > :nth-child(2){order:3 !important}
  [data-screen-label="物語"] [data-sw-m~="m40"] > :nth-child(3){order:2 !important}
  [data-screen-label="物語"] [data-sw-m~="m40"] > :nth-child(4){order:1 !important;align-items:flex-start !important}
  [data-screen-label="受け継ぎ次の百年へ"] [data-sw-m~="m42"]{flex-direction:column !important;height:auto !important;align-items:stretch !important;gap:22px !important}
  [data-screen-label="受け継ぎ次の百年へ"] [data-sw-m~="m42"] > :nth-child(1){order:1 !important;align-items:flex-start !important}
  [data-screen-label="受け継ぎ次の百年へ"] [data-sw-m~="m42"] > :nth-child(2){order:2 !important}
  [data-screen-label="受け継ぎ次の百年へ"] [data-sw-m~="m42"] > :nth-child(3){order:3 !important}
  [data-screen-label="受け継ぎ次の百年へ"] [data-sw-m~="m41"]{order:0 !important;height:230px !important;flex:0 0 230px !important}
  [data-screen-label="受け継ぎ次の百年へ"] [data-sw-m~="m23"]{display:none !important}
  [data-screen-label="沿革"] [data-sw-m~="m34"][data-sw-m~="m35"]{display:none !important}
  [data-screen-label="沿革"] [data-sw-m~="m36"]{height:auto !important;display:flex !important;align-items:center !important;gap:16px !important;margin-bottom:20px !important}
  [data-screen-label="沿革"] [data-sw-m~="m37"][data-sw-m~="m38"]{position:static !important;transform:none !important;order:1 !important;flex:0 0 auto !important}
  [data-screen-label="沿革"] [data-sw-m~="m39"]{position:static !important;transform:none !important;order:2 !important;width:auto !important;flex:1 1 auto !important;text-align:left !important;font-size:14px !important}
  [data-screen-label="物語"] [data-sw-m~="m23"]{display:none !important}
}
@media (max-width:900px){
  .gs-sdgs{grid-template-columns:repeat(4,1fr) !important}
}
@media (max-width:520px){
  .gs-sdgs{grid-template-columns:repeat(2,1fr) !important}
}
@media (max-width:760px){
  [data-sw-m~="m43"]{flex-direction:column !important;align-items:flex-start !important}
  [data-screen-label="重点テーマ"] [data-sw-m~="m44"]{min-width:0 !important;width:100% !important;align-self:stretch !important;height:230px !important;flex:none !important}
  [data-screen-label="重点テーマ"] [data-sw-m~="m45"][data-sw-m~="m46"]{display:none !important}
  [data-screen-label="重点テーマ"] [data-sw-m~="m47"]{padding:32px 24px !important}
  [data-screen-label="重点テーマ"] [data-sw-m~="m48"]{min-width:0 !important}
  [data-screen-label="重点テーマ"] [data-sw-m~="m49"]{align-items:flex-start !important}
  [data-screen-label="重点テーマ"] [data-sw-m~="m49"] > *{width:100% !important;align-self:stretch !important}
  [data-screen-label="会社概要"] [data-sw-m~="m50"] > div{flex-direction:column !important}
  [data-screen-label="会社概要"] [data-sw-m~="m51"]{flex:none !important;width:100% !important}
  [data-screen-label="歴史導線"] [data-sw-m~="m47"]{padding:32px 24px !important}
  [data-screen-label="歴史導線"] [data-sw-m~="m48"]{min-width:0 !important}
}
@media (min-width:761px) and (max-width:1024px){
  [data-screen-label="成長ロードマップ"] .gs-g4{grid-template-columns:1fr !important}
  [data-screen-label="成長ロードマップ"] [data-sw-m~="m52"]{clip-path:polygon(0 0, 50% 18px, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px)) !important;padding:34px 30px 40px !important;border-top:none !important}
}
@media (max-width:760px){
  [data-screen-label="採用ヒーロー"]{min-height:672px !important}
  [data-screen-label="採用ヒーロー"] [data-sw-m~="m21"]{writing-mode:vertical-rl !important;text-orientation:mixed !important;max-height:none !important}
  [data-screen-label="採用ヒーロー"] [data-sw-m~="m53"][data-sw-m~="m54"]{top:126px !important;bottom:auto !important;align-items:flex-start !important}
  [data-screen-label="採用ヒーロー"] [data-sw-m~="m55"]{bottom:64px !important;right:40px !important}
  [data-sw-m~="m45"][data-sw-m~="m56"]{display:none !important}
  [data-sw-m~="m57"]{grid-template-columns:1fr !important}
  [data-sw-m~="m52"]{clip-path:polygon(0 0, 50% 18px, 100% 0, 100% calc(100% - 20px), 50% 100%, 0 calc(100% - 20px)) !important;padding:34px 30px 40px !important;border-top:none !important}
  [data-screen-label="募集要項・応募"] a[href="/recruit/requirements"]{width:100% !important;min-height:62px !important;padding:14px 18px !important;font-size:13px !important;gap:10px !important;letter-spacing:.02em !important;white-space:nowrap !important;box-sizing:border-box !important}
  [data-screen-label="ページヒーロー"] [data-sw-m~="m21"]{writing-mode:vertical-rl !important;text-orientation:mixed !important;max-height:none !important}
  [data-sw-m~="m45"][data-sw-m~="m58"]{display:none !important}
  [data-screen-label="一日の流れ"] > div{flex-direction:column !important;align-items:stretch !important;gap:30px !important}
  [data-screen-label="一日の流れ"] [data-sw-m~="m59"]{max-width:none !important;width:100% !important}
  [data-screen-label="一日の流れ"] [data-sw-m~="m60"]{width:100% !important}
}
@media (min-width:761px) and (max-width:1024px){
  [data-screen-label="一日の流れ"] > div{flex-wrap:nowrap !important;gap:40px !important;align-items:flex-start !important;justify-content:center !important}
  [data-screen-label="一日の流れ"] [data-sw-m~="m59"]{flex:1 1 auto !important;max-width:540px !important;min-width:0 !important}
}
@media (max-width:760px){
  [data-screen-label="募集要項"] [data-sw-m~="m50"] > div{flex-direction:column !important}
  [data-screen-label="募集要項"] [data-sw-m~="m61"]{flex:none !important;width:100% !important}
}
@media (max-width:1024px){
  .parts222_wrap{grid-template-columns:1fr !important;gap:40px !important}
}
@media (max-width:640px){
  .parts222_post_list{grid-template-columns:1fr !important}
}
@media (max-width:760px){
  [data-screen-label="導入文"] [data-sw-m~="m62"]{flex-direction:column !important;gap:6px !important;align-items:center !important}
  [data-screen-label="導入文"] [data-sw-m~="m62"] [data-sw-m~="m63"]{display:none !important}
}
/* === 変換後の土台（受領CSSに無い＝分解で必要になった分だけ） === */
/* KEEP: PCナビのサブメニュー（受領は dc の state 開閉 → 純CSS開閉に置換）
   消すとサブメニューが開いたまま固定される */
.gs-navitem > .gs-submenu{ display:none; }
.gs-navitem:hover > .gs-submenu,
.gs-navitem:focus-within > .gs-submenu{ display:block; }
/* /KEEP */
 
/* KEEP: R-27対応。ドロワーの×は ::before/::after の content 依存だったので実 span へ昇格した。
   AddCssInfo は content 宣言を落とすため、疑似要素のままでは×が消える */
.gs-d-close > .gs-d-x1, .gs-d-close > .gs-d-x2{ position:absolute; top:21px; left:10px; width:24px; height:2px; background:#fff; }
/* /KEEP */
 
/* KEEP: TOPのBLOG帯（R-6でパーツの前後に分割した2枚）の余白。
   受領は1つの section が padding:120px 0 128px を持ち、受領CSSの
   [style*="padding: 120px 0px 128px"] が 1024px以下で 70px/74px に詰めていた。
   分割して上下の余白を分担させた時点でその属性セレクタは当たらなくなるので、同じ効き方をここで作り直す。
   消すと 1024px以下でBLOG帯だけ上下の余白が広いまま残る */
@media (max-width:1024px){
  .gs-blog-band-head{ padding-top:70px !important; }
  .gs-blog-band-foot{ padding-bottom:74px !important; }
}
/* /KEEP */
 
/* 変換後 img（受領 image-slot）の土台 */
img.gs-slot{ max-width:100%; }
.gs-slot-empty{ background:#e9eff5; }
/* === インライン animation/transition の退避（CueZillaは style 属性から除去する） ===
   3重クラス＝インライン相当の詳細度を保つ。 */
.gsa1.gsa1.gsa1{animation:gsl-dropfall 2.2s cubic-bezier(.5,0,.7,.35) infinite;}
.gsa2.gsa2.gsa2{animation:gsl-sweep 2.2s linear infinite;}
.gsa3.gsa3.gsa3{animation:gsl-flow 2.2s cubic-bezier(.55,.1,.3,1) infinite;}
.gsa4.gsa4.gsa4{animation:gsl-flowDot 2.2s cubic-bezier(.55,.1,.3,1) infinite;}
.gsa5.gsa5.gsa5{animation:gs-waveH 14s linear infinite;}
.gsa6.gsa6.gsa6{animation:gs-waveH 16s linear infinite;}
.gsa7.gsa7.gsa7{transition:background .25s ease,border-color .25s ease;}
.gsa8.gsa8.gsa8{transition:background .25s ease;}
/* === style-hover / style-focus 由来の生成クラス（3重クラスで詳細度確保） === */
.gsx1.gsx1.gsx1:hover{background:#eef4fa;color:#2C6FB3;}
.gsx2.gsx2.gsx2:hover{color:#5FB8E6;}
.gsx3.gsx3.gsx3:hover{opacity:.94;}
.gsx4.gsx4.gsx4:hover{background:#eaf2fa;}
.gsx5.gsx5.gsx5:hover{background:#2B5581;border-color:#2B5581;color:#fff;}
.gsx6.gsx6.gsx6:hover{background:#eef4fa;border-color:#8fb6d6;}
.gsx7.gsx7.gsx7:hover{background:rgba(255,255,255,.1);}
.gsx8.gsx8.gsx8:hover{background:#fff;}
.gsx9.gsx9.gsx9:hover{background:#22598F;}
.gsx10.gsx10.gsx10:hover{background:#eceded;}
.gsx11.gsx11.gsx11:hover{background:#4a5158;}
.gsx12.gsx12.gsx12:hover{opacity:.72;}
.gsx13.gsx13.gsx13:hover{color:#2C6FB3;}
 
 
/* ============================================================
   2026-09-11 改修分（②③⑤⑧）
   ①⑨ は上の該当ブロック内に直接反映済み。
   ============================================================ */
 
/* --- ② セクション見出しがスマホで切れる（work「選ばれる三つの理由」ほか）---
   見出しは HTML 側インラインで
     font-size:clamp(32px,4vw,44px); letter-spacing:.22em; white-space:nowrap
   を持つ。下限32pxのままだと 9文字×約39px＝約350px となり、
   375px 端末（版面331px）で最後の「由」が欠ける。下限を 24px に下げる。
   ・納品HTMLの style 属性は「コロンの後に空白なし」で出力されるため、
     style属性セレクタで確実に当たる（実機DOMで確認済み）。
   ・新ビルドでクラス化された場合に備えて .gs-sec-head h2 も併記。 */
h2[style*="clamp(32px,4vw,44px)"],
.gs-sec-head h2{ font-size:clamp(24px,4vw,44px) !important; }
 
/* --- ③ TOP「私たちの価値」が右にはみ出して切れる ---
   セクションに overflow:hidden があるため横スクロールが発生せず、
   scrollWidth 系の機械ゲートでは検出できない型。
   写真 width:min(620px,56vw) が縦組みテキストを押し出していた。
   ・1025px 以上でのみ当てる（1024px以下は既存の width:100% を殺さないため）
   ・1025〜1249px は折り返して縦組みを写真の下へ逃がす（縦組み自体は縮めない） */
@media (min-width:1025px){
  .gs-value-flex > [data-sw-m~="m13"]{ width:min(520px,44vw) !important; }
}
@media (min-width:1025px) and (max-width:1249px){
  .gs-value-flex{ flex-wrap:wrap !important; }
  .gs-value-vtext{ height:auto !important; }
}
 
/* --- ⑤ フッターリンクのタップ領域（見た目は変えない）---
   実測 20px。padding で当たり判定を 35px に広げ、同量の負マージンで
   レイアウトを元に戻す（行送り36px。8px にすると実測37pxとなり隣接と1px重なるため7px）。
   ::after + content を使わないのは、AddCssInfo が content 宣言を落とすため（R-27）。 */
footer li > a{ display:inline-block; padding-top:7px; padding-bottom:7px; margin-top:-7px; margin-bottom:-7px; }
 
/* --- ⑧ キーボードフォーカスの可視化 ---
   :focus-visible なのでマウス操作では出ない＝見た目は不変。 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{ outline:2px solid #5FB8E6; outline-offset:2px; border-radius:2px; }
 
 
/* ===== 21_cuezilla-skin.css ===== */
/* ============================================================
   ★★★ このファイルは【全案件共通の資産】です。案件では編集しないでください ★★★
   ------------------------------------------------------------
   （Claude Code / Claude Design / 手作業、いずれの経路でも同じです）
 
   ■ 案件ごとの調整は、必ず `override.css` に書いてください。
     読み込み/結合順が  … → style.css → cuezilla-skin.css → 【override.css】  なので、
     override.css に書いた指定は本ファイルに打ち消されません。**案件の上書きが効く唯一の場所です。**
     （例: カード面を白にしたい → override.css に `:root{ --dyn-surface:#fff; }`）
 
   ■ なぜ編集してはいけないか
     本ファイルを案件で書き換えた瞬間、その案件の skin は共通資産から切り離されます。
     以後、共通側で直した修正（カード高さの不揃い／サイドバーの可読性／
     フォーム送信ボタンの崩れ 等）が **その案件には二度と届きません**。
     実際に S01189 で本ファイルの §0 が案件調整で書き換えられ、共通修正が届かなくなりました。
     「毎案件おなじ崩れを直している」の原因はこれです。
 
   ■ 共通で直すべき崩れを見つけたら
     案件で握り込まず、正本 `skin/cuezilla-skin.css` へ還流してください（全案件に効きます）。
     還流し忘れると、次の同期でその修正は消えます。
 
   詳細は R-30（70_運用ルール/運用ルール集.md）。
   ============================================================ */
 
/* ============================================================
   CueZilla 動的パーツ スキンキット v1.0
   ------------------------------------------------------------
   目的: ブログ/施工実績(blog-ex)/お問い合わせ/パンくず/ページヘッダー等の
         CueZilla 既定パーツを、サイトのトンマナ（ダーク/ライト・ブランド色・
         フォント・角丸）に "自動で寄せる" 汎用CSS。案件ごとの調整を最小化する。
 
   思想:
     (1) 色は CueZilla テーマ変数(--main-color 等)から自動連動
         → サイトのテーマ設定がそのまま skin にも効く（色は一元管理）
     (2) フォント/角丸/グリッド幅はトークンで指定（テーマ変数に無いため）
     (3) partsNNN は採番が可変だが接尾辞は共通(_post_wrap 等)
         → 属性セレクタ [class*="_xxx"] で番号非依存に当てる（単一属性セレクタまで。積んで詳細度を稼がない）
 
   ★適用範囲と安全契約（重要・memory: cuezilla-css-safety-contract）:
     ・本skinは「CueZilla既定の動的パーツ」だけを寄せる。サイトのフリーコーディング設計には当てない
       （生成サイトCSSは変数非依存＋具体値＋自作接頭辞クラスで組む＝構造的に非衝突・skinと干渉しない）。
     ・[class*=…]を積んで詳細度を同点/超過させる手法は禁止（脆い・過剰マッチ・アーマーレース）。
       単一の番号非依存セレクタ＋!important1個で当てる（theme_defaultは非importantなので確定勝ち）。
     ・!important可は「レイヤーで越えられない相手」＝theme_default／body内インライン／BSユーティリティ／
       .partsNNN_blog_<ID>(0,3,0) のみ。後者(0,3,0)+!importantには詳細度で負けるため、
       負けた時だけ §14 の手順で実採番(0,3,1)を【案件CSS】に足して勝つ（汎用skinには番号を書かない）。
     ・変数の注意：実機は body内コンポの style 要素の :root が7色(--main-color等)を撒きうる（490件中16件）。
       →§0の--dyn-*はその頁で乗っ取られ得る。動的パーツの色合わせには許容だが、サイト設計の主機構にしない。
 
   使い方:
     1. §0 のトークンを案件に合わせて調整（ダーク/ライトはプリセットをコピー）
     2. CueZilla テーマカラー(--main-color 等)をブランド値に設定
     3. 本ファイルをサイト全体CSS(AddCssInfo)へ貼る（サイト固有のフリーコーディングCSSの後ろ）
   ============================================================ */
 
 
/* ============================================================
   §0  トークン ─ ここだけ案件ごとに調整
   ============================================================ */
:root{
  /* --- 色: CueZilla テーマ変数から自動取得（無い場合のフォールバック付き） ---
     ※これらは【動的パーツの色合わせ用】。生成サイトCSSはこの変数に依存せず具体値で書く（安全契約）。
       実機では body内コンポの style 要素の :root が --main-color 等を頁単位で上書きしうる＝--dyn-*も追従する。 */
  --dyn-bg:        var(--background-color, #ffffff);   /* ページ/セクション背景 */
  --dyn-surface:   var(--temporary-color, #f4f4f2);    /* カード/パネル/入力欄の面 */
  --dyn-text:      var(--text-color, #222222);         /* 本文 */
  --dyn-heading:   var(--text-color, #111111);         /* 見出し */
  --dyn-muted:     var(--sub-color, #8a8a8a);          /* 補助/日付 */
  --dyn-border:    var(--sub-color, #dddddd);          /* 罫線/枠 */
  --dyn-accent:    var(--main-color, #1e3a5f);         /* アクセント（ボタン/チップ/見出しバー） */
  --dyn-accent-2:  var(--link-color, var(--main-color, #1e3a5f)); /* リンク/ホバー */
  --dyn-on-accent: #ffffff;                             /* アクセント面の上の文字 */
 
  /* --- フォント（site.css の :root に定義があればそれを使用） --- */
  --dyn-font-display: var(--font-display, "Noto Serif JP","Yu Mincho",serif);
  --dyn-font-body:    var(--font-body, "Noto Sans JP","Yu Gothic",sans-serif);
  --dyn-font-numeric: var(--font-numeric, "EB Garamond","Noto Serif JP",serif);
 
  /* --- 角丸（チップ/ボタン/カード）。角なしにするなら 0 --- */
  --dyn-radius: 6px;
  /* --- 一覧カードの最小幅 / 段組ギャップ --- */
  --dyn-card-min: 300px;
  --dyn-gap: 32px;
}
 
/* === テーマ プリセット（使う方を §0 の後にコピペして上書き） =========
   【ダーク】
   :root{
     --dyn-bg:#0A0A0A; --dyn-surface:#111110; --dyn-text:#F4F1EC; --dyn-heading:#FAF7F1;
     --dyn-muted:#8C857A; --dyn-border:#3A352D; --dyn-accent:#8E3A22; --dyn-accent-2:#B0533A;
     --dyn-on-accent:#FAF7F1; --dyn-radius:0;
   }
   【ライト】
   :root{
     --dyn-bg:#ffffff; --dyn-surface:#f7f7f5; --dyn-text:#222222; --dyn-heading:#111111;
     --dyn-muted:#8a8a8a; --dyn-border:#e3e3e3; --dyn-accent:#1e3a5f; --dyn-accent-2:#1e3a5f;
     --dyn-on-accent:#ffffff; --dyn-radius:6px;
   }
   ※ CueZilla テーマ変数(--main-color 等)を設定する場合は §0 が自動連動するのでプリセット不要。
   ============================================================ */
 
 
/* ============================================================
   §1  パンくず（CueZilla parts###_breadcrumb / p-breadcrumb）
   実markup: div.parts###_breadcrumb.p-breadcrumb.c-breadcrumb
             > ul.p-breadcrumb__inner(BreadcrumbList) > li.p-breadcrumb__item(ListItem)
   CueZilla共通CSSにパンくず装飾は無い → skin側で横並び・区切り・配色を付与
   ============================================================ */
[class*="_breadcrumb"], .p-breadcrumb{ background:var(--dyn-bg) !important; }
.p-breadcrumb__inner{
  list-style:none; margin:0 auto; padding:14px 24px;
  max-width:1200px; display:flex; flex-wrap:wrap; align-items:center;
}
.p-breadcrumb__item{
  display:inline-flex; align-items:center;
  color:var(--dyn-muted) !important; font-family:var(--dyn-font-body);
  font-size:.78rem; letter-spacing:.04em;
}
.p-breadcrumb__item a{ color:var(--dyn-muted) !important; text-decoration:none; }
.p-breadcrumb__item a:hover{ color:var(--dyn-accent-2) !important; text-decoration:underline; }
.p-breadcrumb__item:last-child{ color:var(--dyn-text) !important; }   /* 現在地 */
/* 区切り（2件目以降の前に "›"） */
.p-breadcrumb__item + .p-breadcrumb__item::before{
  content:"\203A"; margin:0 .6em; color:var(--dyn-border) !important; font-size:.95em;
}
.p-breadcrumb meta{ display:none; }   /* schema.org の <meta itemprop="position"> は非表示 */
 
 
/* ============================================================
   §2  ページヘッダー（[class*="_article_header"]）画像上のタイトル
   ============================================================ */
[class*="_article_header"] .ja, [class*="_article_header"] h1, [class*="_article_header"] h2{
  color:var(--dyn-heading) !important; font-family:var(--dyn-font-display) !important;
  text-shadow:0 2px 14px rgba(0,0,0,.5) !important;
}
[class*="_article_header"] .en{ color:var(--dyn-muted) !important; font-family:var(--dyn-font-numeric) !important; letter-spacing:.1em; text-shadow:0 1px 10px rgba(0,0,0,.5) !important; }
 
 
/* ============================================================
   §3  ページネーション（2系統。テーマCSSの持ち方が違うので扱いを分ける＝崩れ防止）
   ・.pagination_*（enjoyworks系）            … テーマが素 → 体裁＋色を一式付与
   ・[class*="_pagenation"]（parts222/225/228系）… テーマが体裁を持つ（flex/padding/border/白黒ハードコード）
        → レイアウト・サイズはテーマに任せ、ハードコードの白黒(#000/#fff)だけブランド色へ置換（最小限）。
          a/.current 以外（余白用の素の <span>）には触らない＝二重ボックス化を防ぐ。
          --dyn-accent は §0 で var(--main-color) にバインド済み＝サイトのCMS色に自動一致（案件側の手当て不要）。
   ============================================================ */
/* (A) pagination_* 系：テーマ装飾が無いので一式付与 */
.pagination_num, .pagination_prev, .pagination_next{
  font-family:var(--dyn-font-numeric); color:var(--dyn-text) !important;
  border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius);
  min-width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; text-decoration:none;
}
.pagination_num.current{ background:var(--dyn-accent) !important; border-color:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important; }
.pagination_num:hover, .pagination_prev:hover, .pagination_next:hover{ border-color:var(--dyn-accent-2) !important; color:var(--dyn-accent-2) !important; }
 
/* (B) _pagenation 系：色だけ寄せる（ジオメトリはテーマのまま＝箱を再定義しない） */
[class*="_pagenation"] a{ border-color:var(--dyn-accent) !important; color:var(--dyn-text) !important; }
[class*="_pagenation"] span.current, [class*="_pagenation"] .current, [class*="_pagenation"] .active{
  background:var(--dyn-accent) !important; border-color:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important;
}
[class*="_pagenation"] a:hover{ border-color:var(--dyn-accent-2) !important; color:var(--dyn-accent-2) !important; }
.pe-none{ opacity:.3; pointer-events:none; }
 
 
/* ============================================================
   §4  ブログ / 施工実績(blog-ex) 一覧（番号非依存）
   ============================================================ */
/* 一覧セクションの地 */
[class*="_post_list"], [class*="_post_wrap"]{ } /* 下で個別指定 */
/* カード並び（最小幅を確保して細くなりすぎない） */
[class*="_post_list"]{ display:grid !important; grid-template-columns:repeat(auto-fill, minmax(var(--dyn-card-min), 1fr)) !important; gap:var(--dyn-gap) !important; }
/* カード */
[class*="_post_wrap"]{
  /* カード等寸化：中身を縦に積み、内側の <a>/本文枠を flex で伸長させて高さを揃える（S01189還流） */
  display:flex !important; flex-direction:column;
  margin:0 !important;   /* theme_default の margin-bottom(55px等)残存で最終行カードだけ高さ不揃いになるのを打ち消す */
  width:auto !important; max-width:none !important; text-decoration:none;
  background:var(--dyn-surface) !important; border:1px solid var(--dyn-border) !important;
  border-radius:var(--dyn-radius); overflow:hidden;
  transition:transform .3s ease, border-color .3s ease;
}
[class*="_post_wrap"]:hover{ transform:translateY(-4px); border-color:var(--dyn-accent-2) !important; }
[class*="_post_wrap"] > a{ display:flex; flex-direction:column; flex:1 1 auto; color:inherit; }  /* カード全体ラップ<a>を縦伸長（内容を上下に満たす） */
/* サムネ等寸化：グリッド列の幅から高さを算出（幅制約下＝§6.5の aspect-ratio×height 併用の罠には該当しない） */
[class*="_post_img"]{ width:100%; display:block; border-radius:0; aspect-ratio:16/10; overflow:hidden; }
[class*="_post_img"] img{ width:100%; height:100%; object-fit:cover; display:block; }
/* カード内のテキストに左右余白 */
[class*="_post_status"]{ border:none !important; background:transparent !important; margin:14px 16px 0 !important; padding:0 !important; display:flex !important; flex-wrap:wrap; justify-content:flex-start !important; gap:10px; align-items:center; }
[class*="_post_status"]:has([class*="_title-excerpt"]){ display:block !important; }   /* parts228系「日付｜タイトル」の横並びを解除（:has非対応環境ではflex-wrapで折返し） */
[class*="_post_title-excerpt"]{ padding:10px 16px 16px !important; flex:1 1 auto; }   /* 本文枠を伸長＝カード等寸化の要 */
[class*="_post_status"]:has([class*="_title-excerpt"]) [class*="_title-excerpt"]{ padding:10px 0 16px !important; }   /* 施工実績は左端揃え */
[class*="_post_title"]{ font-family:var(--dyn-font-display) !important; color:var(--dyn-heading) !important; font-weight:700 !important; line-height:1.5; }
[class*="_post_excerpt"]{ color:var(--dyn-muted) !important; }
[class*="_post_date"]{ font-family:var(--dyn-font-numeric) !important; color:var(--dyn-muted) !important; }
/* カテゴリ/ステータスは1チップに。
   テーマは既に _post_category に border:1px solid var(--main-color) を持つ＝枠を“足す”と2重になるので
   同一要素に !important で単一の枠を確定（色は --dyn-accent=var(--main-color) で一致）。幅は % 制約を解除し content 幅に。 */
[class*="_post_category"]:not([class*="_sidebar"]), [class*="_post_status"] > span:last-child{
  /* :not(_sidebar) ＝ この§4チップ装飾が §5 の _sidebar_post_category_count へ漏れ二重適用されるのを防ぐ（S01189還流） */
  width:auto; max-width:none !important;
  background:var(--dyn-bg) !important; border:1px solid var(--dyn-accent) !important;
  border-radius:var(--dyn-radius); padding:2px 8px; color:var(--dyn-accent) !important;
}
.parts-blog-ex-tag_wrap{ display:flex; flex-wrap:wrap; gap:6px; padding:0 16px 14px; }
.parts-blog-ex_tag{ font-size:.72rem; color:var(--dyn-muted) !important; background:var(--dyn-surface) !important; border:1px solid var(--dyn-border); border-radius:var(--dyn-radius); padding:2px 8px; }
 
/* --- 一覧パーツ固有の崩れ2点（実共有CSS=theme parts222/225/228 を突き合わせて確定）---
   (a) 自動セクション見出し（「ブログ」「施工実績」等）の撤去：
       テーマは `.parts222_section h2 / .parts228_section h2` に
       color:var(--main-color)/font-size:35px/text-align:center を付与し、
       一覧上部に大見出しを自動描画する。自前の下層ヘッダー(hero)と二重化＝崩れ。
       → 一覧パーツ(_post_list を含む _section)直下の素の h2 だけ隠す。
         残したいサイトは案件CSSで個別に復帰。`:has()` 非対応保険に f_meiryo 版も併記。 */
[class*="_section"]:has([class*="_post_list"]) > h2,
[class*="_section"] > h2.f_meiryo{ display:none !important; }
/* (b) flex前提の余白スペーサー ::after の無効化：
       テーマは `.parts228_post_list::after{content:"";width:32.465%}` で flex の最終行詰めをする。
       §4 で _post_list を grid 化すると、この ::after が「空のゴースト列」になり最終行が片寄る。
       → grid では不要なので除去（content:none で擬似要素自体を消す）。 */
[class*="_post_list"]::after{ content:none !important; display:none !important; }
 
 
/* ============================================================
   §5  サイドバー / 最近の投稿 / カテゴリ記事数
   ============================================================ */
[class*="_sidebar"], .recent_posts_wrap{ color:var(--dyn-text); }
/* サイドバー見出し（「最近の投稿」「カテゴリ」）の可読性を確保。
   theme_default は `.partsNNN_sidebar h3{ background-color:var(--main-color); color:#fff }` と
   色を直当てするが、§12 の見出しリセットが**背景だけ**を transparent にするため、
   ライト基調の案件では「白地に白文字」で消える（ダーク案件では地に映えるため露見しない）。
   背景は戻さず（skinのフラット化方針を維持）、文字色だけトークンへ寄せて両基調で可読にする。
   あわせて左右パディングも解除する：`padding:15px 20px` は**帯があった前提**の内側余白のため、
   帯を透明化したまま残すと「見出しだけ20px字下げ」になり、直下の日付／タイトルと文頭がズレる。
   （詳細ページ側の .recent_post_title には下で同じ手当てをしており、一覧側だけ取り残されていた） */
[class*="_sidebar"] h3{ color:var(--dyn-heading) !important; padding-left:0 !important; padding-right:0 !important; }
[class*="_sidebar_post_title"], .recent_post_title{ font-family:var(--dyn-font-display) !important; color:var(--dyn-heading) !important; }
/* 「最近の投稿」見出し（詳細ページ側）の帯を外して一覧側と体裁を揃える。
   theme_default は `.recent_posts_wrap .recent_post_title{ background-color:var(--main-color); color:#fff }` で帯を敷くが、
   §12 の見出しリセットは (a) 包み(parts166_single_article / parts-blog-ex-single-wrap)が `_section` を含まない
   (b) 要素が <div>（h2/h3でない）── の2点で**届かず**、帯だけが生き残る。
   一方すぐ上の §5 が文字色を --dyn-heading（＝ライトでは濃色）へ寄せるため「濃い帯に濃い文字」となり、
   案件ごとに帯との視認性を見て文字色を手当てする必要があった。帯を外せば一覧（§12で帯が外れる）と揃い、手当ても不要になる。
   ※帯を活かしたい案件は案件側で `background:var(--dyn-accent); color:var(--dyn-on-accent)` を再指定する。 */
.recent_post_title{ background:transparent !important; padding-left:0 !important; }
[class*="_sidebar_date"], .recent_post_date{ font-family:var(--dyn-font-numeric) !important; color:var(--dyn-muted) !important; }
/* 記事li の区切り罫線：theme_default が #666 をハードコードしており地に合わず過剰に見える → トークンへ */
[class*="_sidebar"] ul li, .recent_posts_wrap ul li{ border-bottom-color:var(--dyn-border) !important; }
/* カテゴリ右の記事数を視認できるチップに */
[class*="_sidebar_post_category_count"]{ background:var(--dyn-surface) !important; color:var(--dyn-text) !important; border:1px solid var(--dyn-border); border-radius:var(--dyn-radius); padding:0 8px !important; }
/* カテゴリ一覧 li：theme_default 由来の左右縦罫線(1px solid #666)を除去（下罫線は区切りとして意図的に残す）。S01189還流 */
[class*="category_post_count"] li{ border-left:0 !important; border-right:0 !important; }
/* カテゴリ名と件数チップが重ならないよう両端寄せ。
   あわせて左右パディングを解除：theme_default は `.category_post_count ul li a{ padding:15px 20px }` と
   **帯／箱があった前提**の字下げを持つため、帯を外した状態では
   カテゴリ名だけが 20px 右にずれ、見出し(h3)や「最近の投稿」リストと頭が揃わない。
   上下15pxはタップ領域として残す。 */
[class*="category_post_count"] li a{ display:flex; justify-content:space-between; align-items:center; gap:8px; padding-left:0 !important; padding-right:0 !important; }
 
 
/* ============================================================
   §6  詳細ページ（本文 / 署名 / SNS / 詳細内スライダー）
   ============================================================ */
.parts-blog-ex_text{ font-family:var(--dyn-font-body); color:var(--dyn-text) !important; line-height:1.9; }
.parts-blog-ex_text h2, .parts-blog-ex_text h3{ font-family:var(--dyn-font-display) !important; color:var(--dyn-heading) !important; }
.signature_wrap{ font-family:var(--dyn-font-display); color:var(--dyn-muted) !important; border-top:1px solid var(--dyn-border); padding-top:16px; }
.slick-prev, .slick-next{ color:var(--dyn-accent-2) !important; }
/* ※詳細本文の親ラッパーが固定class薄め。崩れる場合は実ページで本文コンテナを確認し追補 */
 
 
/* ============================================================
   §7  お問い合わせフォーム
   ============================================================ */
.contact_section, [class*="_section_form"], [class*="_section_content"], [class*="_content_wrap"], [class*="_content"]{ background:var(--dyn-bg) !important; color:var(--dyn-text) !important; }
[class*="_form_wrap"]{ max-width:720px; margin:0 auto; }
[class*="_form_wrap"] label, [class*="_form_wrap"] dt, [class*="_form_wrap"] .ja, [class*="_form_wrap"] .en{ color:var(--dyn-text) !important; }
/* 入力欄を十分な大きさに（チェック/ラジオは除外） */
[class*="_form_wrap"] dd input:not([type="checkbox"]):not([type="radio"]),
[class*="_form_wrap"] dd select{ width:100% !important; max-width:none !important; padding:14px 16px !important; font-size:16px !important; min-height:54px !important; background:var(--dyn-surface) !important; color:var(--dyn-text) !important; border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius); }
[class*="_form_wrap"] textarea, .form_textarea textarea{ width:100% !important; padding:14px 16px !important; font-size:16px !important; min-height:220px !important; background:var(--dyn-surface) !important; color:var(--dyn-text) !important; border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius); }
/* チェックボックス/ラジオはサイズ統一 */
[class*="_form_wrap"] input[type="checkbox"], [class*="_form_wrap"] input[type="radio"]{ width:18px !important; height:18px !important; min-height:0 !important; padding:0 !important; margin:0 8px 0 0 !important; vertical-align:-3px; accent-color:var(--dyn-accent); flex:none !important; }
/* 必須バッジ: 文字を中央・折り返さない・角丸はトークン */
.required{ display:inline-flex !important; align-items:center !important; justify-content:center !important; line-height:1 !important; white-space:nowrap !important; padding:6px 12px !important; border-radius:var(--dyn-radius) !important; background:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important; }
.error{ color:var(--dyn-accent-2) !important; }
/* 「お問い合わせ内容」を囲む大きな箱(枠線)を撤去 */
.form_textarea, .form_text_dt{ border:none !important; background:transparent !important; }
/* 送信ボタン。★セレクタに包み(.contact_submit 自体)を含めないこと：
   包みは複数ボタンを載せるレイアウト用のdivで、ここを accent で塗ると
   (a) 完了ページ=藍の包みに藍のボタンが乗って同化し、ボタンが消えて見える
   (b) 確認ページ=すぐ下でアウトライン化する「戻る」が藍地に濃色文字となり判読不能（実測 1.01:1）
   になる。当てる先はボタン実体だけでよい（dynamic-form.md §1 の意図も「送信 .contact_submit input = accent地」）。 */
.contact_submit button, .contact_submit input{ background:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important; border:none !important; border-radius:var(--dyn-radius) !important; }
/* 確認ページの「戻る」は副ボタン（送信＝アクセント／戻る＝アウトライン）＝誤導線防止 */
.contact_submit input[name="back"]{ background:transparent !important; color:var(--dyn-text) !important; border:1px solid var(--dyn-border) !important; }
/* 送信前 disabled（reCAPTCHA未完了）の見え方 */
.contact_submit input[disabled]{ opacity:.5; cursor:not-allowed; }
 
/* --- フォーム実コードで頻出するが §7本体に無かった部品（parts213等の実装を突き合わせ）--- */
/* ファイル添付の自作UI：受領のインライン style が #eee 地・#999 文字・明るいグラデで固定し、
   ダーク地で白い箱・低コントラストになる。トークンで地・枠・文字を寄せる（label_file_upload に限定）。 */
.label_file_upload{ display:block; width:100%; padding:12px 14px; cursor:pointer;
  background:var(--dyn-surface) !important; color:var(--dyn-text) !important;
  border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius); }
.label_file_upload button{ background:var(--dyn-bg) !important; color:var(--dyn-text) !important;
  border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius) !important; pointer-events:none; }
.label_file_upload span, #file-chosen, [id$="filechosen"]{ color:var(--dyn-muted) !important; }
.des{ color:var(--dyn-muted) !important; }
/* 注意書き（文字数制限・ファイル名規則等の補助）：色未指定/未定義var(--red)で可読性がばらつくため muted で固定（AA確保色） */
.attention{ color:var(--dyn-muted) !important; }
/* 郵便番号は narrow に保つ：上の入力欄ルール `[class*="_form_wrap"] dd input:not([checkbox]):not([radio])`
   は (0,3,2)+!important で .zip も全幅化し〒[郵便番号][住所]を壊す。これに勝つよう :not() を重ねて
   詳細度を (0,4,2) に上げて .zip だけ幅を戻す（parts219等 form_address系・番号非依存）。 */
[class*="_form_wrap"] dd input.zip:not([type="checkbox"]):not([type="radio"]){ width:9em !important; max-width:9em !important; display:inline-block; margin-right:8px; }
/* プライバシー同意 */
.privacypolicy{ background:var(--dyn-surface) !important; border:1px solid var(--dyn-border); border-radius:var(--dyn-radius); padding:16px; color:var(--dyn-muted) !important; }
.privacypolicy-link{ color:var(--dyn-accent-2) !important; }
/* 電話/メール等の content バー（角丸はトークン） */
[class*="_content"] [class*="btn"], [class*="_content"] a[class*="round"]{ border-radius:var(--dyn-radius) !important; }
 
 
/* ============================================================
   §7b  お問い合わせフォーム ─ wpcf7 / .formBox 系（第2系統）
   ------------------------------------------------------------
   【重要】フォームには構造が2系統ある（dynamic-harvest.js の「フォーム系統」で判定）：
     ・§7  = parts_form/dl 系（[class*="_form_wrap"] / dt / dd / .required / .contact_submit）
     ・§7b = wpcf7/.formBox 系（.formWrap > .formBox > dt>label>span.req + dd>input,
              送信=input.wpcf7-submit。SEIKEN/協力会社フォーム等 Contact Form 7 由来）
   §7 の `[class*="_form_wrap"]` は §7b 構造に当たらないため、当該系統では本セクションが要る。
   いずれも番号非依存のセマンティッククラスで記述。
   ============================================================ */
.formWrapbg, .formWrap, .form, [class*="formSec"]{ background:var(--dyn-bg) !important; color:var(--dyn-text) !important; }
.formWrap{ max-width:720px; margin:0 auto; }
.formBox{ margin-bottom:20px; }
.formBox dt, .formBox label{ color:var(--dyn-text) !important; }
.formBox dd input:not([type="checkbox"]):not([type="radio"]),
.formBox dd select,
.formWrap input[type="text"], .formWrap input[type="email"], .formWrap input[type="tel"]{
  width:100% !important; max-width:none !important; padding:14px 16px !important; font-size:16px !important;
  min-height:54px !important; background:var(--dyn-surface) !important; color:var(--dyn-text) !important;
  border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius);
}
.formBox dd textarea, .formWrap textarea{
  width:100% !important; padding:14px 16px !important; font-size:16px !important; min-height:220px !important;
  background:var(--dyn-surface) !important; color:var(--dyn-text) !important;
  border:1px solid var(--dyn-border) !important; border-radius:var(--dyn-radius);
}
.formWrap input[type="checkbox"], .formWrap input[type="radio"]{
  width:18px !important; height:18px !important; min-height:0 !important; padding:0 !important; margin:0 8px 0 0 !important;
  vertical-align:-3px; accent-color:var(--dyn-accent); flex:none !important;
}
/* 必須バッジ（wpcf7系は .req） */
.req, .formBox .req{
  display:inline-flex !important; align-items:center !important; justify-content:center !important; line-height:1 !important;
  white-space:nowrap !important; padding:6px 12px !important; border-radius:var(--dyn-radius) !important;
  background:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important;
}
.wpcf7-not-valid-tip, .wpcf7-response-output{ color:var(--dyn-accent-2) !important; }
/* 送信（Contact Form 7） */
input.wpcf7-submit, .formWrap button[type="submit"]{
  background:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important;
  border:none !important; border-radius:var(--dyn-radius) !important;
  min-height:54px !important; padding:14px 28px !important; font-size:16px !important; cursor:pointer;
}
/* プライバシー同意（両系統共通の .privacypolicy* は §7 で適用済） */
 
 
/* ============================================================
   §14  自動CSSに負けた時の手順（R-27）※汎用アーマーは持たない＝安全契約
   ------------------------------------------------------------
   CueZilla は body内コンポの style 要素でパーツ単位に `.partsNNN_blog_<ID> .card .card-body{…!important}`
   等の高詳細度(0,3,0)+!important を吐く。§1〜§9 の単一属性セレクタ(0,1,0〜0,2,0)+!important は
   同プロパティで【負ける】（症状：当てているのに反映されない＝崩れの常連）。
 
   → 【禁止】[class*=…]を積んで(0,3,0)に並べる汎用アーマー（脆い・過剰マッチ・アーマーレース）。
        ＝以前ここにあった `[class*="parts"][class*="_blog"] .card` 等は本契約により撤去した。
        （theme_default 非importantへの色寄せは §8 の単一 `[class*="_blog"] .card`(0,2,0)+!important で足りる）
   → 【正】負けたパーツだけ、harvestで実採番を取り【案件CSS】末尾に (0,3,1) を1個足して確実に勝つ：
        section.parts131415_blog_xxxx .card .card-body{ … !important }   ← 実採番。構造変化に不感
     ※ skin は全案件共通なので案件固有の番号は書かない（負けた時だけ案件側で対処）。
     ※ 採番取得＝verify/dynamic-harvest.js。当て方＝50_CSS・動的ページ/動的ページCSS_実セレクタ参考.md §14。 */
/* 見出しのテーマ装飾(角丸/中央寄せ/背景/罫線)残りをパーツ内でリセット（R-21）。
   theme_default は非importantなので、単一 [class*="_section"] + !important で確定勝ち（[class*]を積まない）。 */
[class*="_section"] h2, [class*="_section"] h3{
  border-radius:0 !important; background:transparent !important; border:none !important; text-align:inherit !important;
}
 
 
/* ============================================================
   §8  トップ用 お知らせ/ブログ teaser（notice-news / blog teaser）
   ============================================================ */
.parts040506_notice-news{ background:var(--dyn-bg) !important; color:var(--dyn-text) !important; }
.parts040506_notice-news *{ color:var(--dyn-text) !important; }
.parts040506_notice-news .title, .parts040506_notice-news .title a{ color:var(--dyn-heading) !important; }
.parts040506_notice-news [class*="date"], .parts040506_notice-news .f_yugothic{ font-family:var(--dyn-font-numeric) !important; color:var(--dyn-muted) !important; }
.parts040506_notice-news .more{ white-space:nowrap !important; color:var(--dyn-accent-2) !important; }
.parts040506_notice-news a{ color:var(--dyn-accent-2) !important; }
/* サムネ型ブログ teaser */
[class*="_blog_title_wrap"]{ font-family:var(--dyn-font-display) !important; color:var(--dyn-heading) !important; }
[class*="_blog_thumbnail"]{ border-radius:var(--dyn-radius); }
/* teaser内が Bootstrap .card（既定で白）の場合のダーク/トーン化 */
[class*="_blog"] .card{ background:var(--dyn-surface) !important; border-color:var(--dyn-border) !important; border-radius:var(--dyn-radius) !important; }
[class*="_blog"] .card-title, [class*="_blog"] .card-text{ color:var(--dyn-text) !important; }
[class*="_blog"] .card-title{ font-family:var(--dyn-font-display) !important; }
 
 
/* ============================================================
   §9  Bootstrap汎用クラスの地ならし（パーツ内に限定）
       text-dark / bg-light 等がパーツ内でトーンを乱すのを抑える
   ============================================================ */
[class*="parts"] .text-dark{ color:var(--dyn-text) !important; }
[class*="parts"] .bg-light{ background:var(--dyn-surface) !important; }
.card-header.bg-light{ background:var(--dyn-accent) !important; color:var(--dyn-on-accent) !important; }
 
 
/* ============================================================
   §10  プライバシーポリシー（templates/privacy-policy.html のフリーコーディング設置版）
   ※CueZilla既定パーツ(item_title/item_description)へ転記する場合は §5 等で別途適用される
   ============================================================ */
.privacy{ max-width:880px; margin:0 auto; padding:64px 24px; color:var(--dyn-text); font-family:var(--dyn-font-body); line-height:1.9; }
.privacy__title{ font-family:var(--dyn-font-display); color:var(--dyn-heading); font-size:clamp(1.8rem,4vw,2.6rem); }
.privacy__subtitle{ font-family:var(--dyn-font-display); color:var(--dyn-heading); font-size:1.2rem; margin-top:8px; }
.privacy__lead{ color:var(--dyn-muted); margin:24px 0 40px; }
.privacy-item{ margin-bottom:32px; }
.privacy-item__title{ font-family:var(--dyn-font-display); color:var(--dyn-heading); border-left:3px solid var(--dyn-accent); padding-left:12px; margin-bottom:12px; }
.privacy-item__body{ color:var(--dyn-text); }
/* 原文の (1)(2)… 表記を維持（auto ol の "1." ではなく括弧付き番号で表示） */
.privacy-item__list{ list-style:none; counter-reset:pp; margin:8px 0; padding:0; }
.privacy-item__list li{ counter-increment:pp; padding-left:2.2em; text-indent:-2.2em; margin:4px 0; color:var(--dyn-text); }
.privacy-item__list li::before{ content:"(" counter(pp) ") "; }
 
 
/* ============================================================
   §11  下層ヘッダーパーツ（templates/subpage-header.html）
   サイトヘッダーとパンくずの間。フリーコーディングで別パーツ化
   ============================================================ */
/* padding-top に固定ヘッダー高さ(--fixed-header-h)を加算＝固定ヘッダーへのめり込み防止。
   固定ヘッダーが無いサイトは既定0で無影響。固定ヘッダー採用サイトは案件CSSで :root{ --fixed-header-h:88px } 等を設定（R-18）。 */
.subpage-header{ position:relative; padding:calc(72px + var(--fixed-header-h, 0px)) 24px 72px; background:var(--dyn-surface); text-align:center; overflow:hidden; }
.subpage-header__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.45; z-index:0; }
.subpage-header__inner{ position:relative; z-index:1; }
.subpage-header__title{ font-family:var(--dyn-font-display); color:var(--dyn-heading); font-size:clamp(1.8rem,5vw,3rem); line-height:1.3; text-shadow:0 2px 14px rgba(0,0,0,.5); }
.subpage-header__en{ font-family:var(--dyn-font-numeric); color:var(--dyn-muted); letter-spacing:.12em; margin-top:8px; }
 
 
/* ============================================================
   §12  システム定型ページ：送信完了(thanks) / 404
   templates/thanks.html, templates/404.html 用。トークンスキン準拠
   ============================================================ */
.thanks, .notfound{ max-width:760px; margin:0 auto; padding:calc(80px + var(--fixed-header-h, 0px)) 24px 96px; text-align:center; }
/* CueZilla 既定404（section.not-found）はレイアウトを変えず、固定ヘッダー分の上余白だけ確保（R-18） */
/*.not-found{ padding-top: calc(var(--fixed-header-h, 0px) + 24px); }*/
.thanks__title, .notfound__title{ font-family:var(--dyn-font-display); color:var(--dyn-heading); font-size:clamp(1.8rem,5vw,2.6rem); line-height:1.3; margin-bottom:28px; }
.thanks__lead, .notfound__lead{ color:var(--dyn-text); line-height:2; margin-bottom:40px; }
.thanks__action, .notfound__action{ margin-top:8px; }
 
 
/* ============================================================
   §13  Bootstrap(テーマ)既定の恒久打ち消し（R-20）
   ------------------------------------------------------------
   CueZillaテーマが読み込む Bootstrap の "素のタグ/汎用クラス" が
   フリーHTMLに当たって崩す症状を、案件ごとの手当て無しで地ならしする。
   ここは確認済みの実害2件（test0605）に限定して打ち消す。
   ※「色/余白/タイポ」を意図して変える装飾は接頭辞クラス(.xw- 等)で
     付け直す＝下記より高詳細度になり、本セクションに勝つ（壊さない）。
   ============================================================ */
/* (a) <mark> / .mark の黄ハイライト背景：ロゴや見出しが黄色い箱になる症状 → 無効化。
       意図的なマーカー装飾は専用クラスで（Bootstrap名 .mark を流用しない＝R-20）。 */
mark, .mark{
  background-color:transparent !important; color:inherit !important;
  padding:0 !important; border-radius:0 !important;
}
/* (b) a:hover が Bootstrap青(#0a58ca)になる症状 → 既定は「ホバーで色を変えない」。
       !important は付けない＝個別のホバー装飾(接頭辞クラスや site.css の指定)が
       そのまま勝ち、未指定リンクだけが青化を免れる（フォールバック）。 */
a:hover{ color:inherit; }
 
/* (c) 電話番号リンク(tel:)の最低タップ確保（R-24／§5.5-3）。
       本文中インラインでも折り返さない。CTA/ボタン用途は接頭辞クラスで44px確保。 */
a[href^="tel:"]{ white-space:nowrap; }
 
 
/* ===== 29_override.css ===== */
/* O01056 株式会社五日市設備 — override（site.css → skin の後に結合・案件の上書きはここだけ／R-30）
 
   skin は採用する（既定・cz-judgment §3）。受領データは動的パーツ（parts222 / parts228 /
   parts210 / parts213 / parts219 / design-parts-52）を「実在クラス名の素マークアップ＋インラインstyle」
   で描いていたが、インラインstyleは CMSパーツが描く実DOMには乗らない＝受領CSSだけでは当たらない。
   そのため skin（番号非依存セレクタ）を土台に、受領デザインの配色・書体へ寄せる分だけをここに書く。 */
 
/* ============================================================
   1. 全ページ共通の地ならし
   ============================================================ */
 
/* KEEP: CueZilla自動パンくずは全ページ非表示（ユーザー標準ルール）。
   受領デザインは各ページのページヒーロー内に自前のパンくず（ホーム › ◯◯）を持っているため、
   自動パーツを出すと二重になる（R-10a）。採番非依存で当てる。 */
[class*="_breadcrumb"], .p-breadcrumb, .c-breadcrumb{ display:none !important; }
.parts231_breadcrumb{ display:none !important; }   /* 実採番の明示（納品前チェックの目視用） */
/* /KEEP */
 
/* KEEP: JS不動時のフォールバック（R-4）。BODY内JSが読み込まれない・失敗した場合の保険。
   ・#gs-loader は position:fixed;inset:0;z-index:9999 なので、JSが .gs-loaded を付けないと
     画面を覆ったままになる＝サイトが真っ白に見える。
   ・ヒーローのキャッチは body.gs-loaded 前提で opacity:0 のまま止まる。
   site.js が最初に html へ .js を付けるので、付いていない＝JSが動いていない、と判定できる。 */
html:not(.js) #gs-loader{ display:none !important; }
html:not(.js) [data-hero-catch] .line-chunk{ opacity:1 !important; transform:none !important; }
/* /KEEP */
 
/* KEEP: 動的パーツの角丸を無くす（受領デザインは全面的に角丸なし）。skin §0 の既定は 6px。 */
:root{ --dyn-radius: 0px; }
/* /KEEP */
 
/* ============================================================
   2. 動的ページ（CMSパーツが描画する＝受領HTMLに実DOMが無い領域）
      skin が当てた上に、受領デザインの配色・書体へ寄せる分だけを足す。
      当て先は番号非依存の接尾辞セレクタ（templates/dynamic-blog-works.md）。
      ※実採番・実DOMは投入後に verify/dynamic-harvest.js の harvestEW() で確認する（R-28）。
   ============================================================ */
 
/* --- 一覧カード（ブログ parts222 / 施工実績 parts228）--- */
[class*="_post_wrap"]{ background:#ffffff !important; box-shadow:0 8px 22px rgba(9,26,44,.06); transition:box-shadow .3s ease; }
[class*="_post_wrap"]:hover{ box-shadow:0 20px 40px rgba(9,26,44,.13); }
[class*="_post_title"]{ font-family:'Zen Old Mincho', serif !important; font-weight:600 !important; color:#2B5581 !important; line-height:1.7 !important; }
[class*="_post_date"]{ font-family:'Roboto', sans-serif !important; color:#8aa6bf !important; letter-spacing:.06em !important; }
[class*="_post_excerpt"]{ color:#54606e !important; line-height:2 !important; }
/* カテゴリ／タグのチップ（テーマは枠線＋白地で描く。受領は塗り＋白文字なので“枠は足さず色だけ”変える） */
/*[class*="_post_category"], .parts-blog-ex_tag{
  background:#2B5581 !important; color:#ffffff !important; border-color:#2B5581 !important;
  font-size:12px !important; font-weight:700 !important; letter-spacing:.08em !important;
}*/
/* --- サイドバー（ブログのみ）--- */
[class*="_sidebar_wrap"] h3{ font-family: 'Zen Old Mincho', serif !important;
    color: #ffffff !important;
    background: #2b5581!important;
    padding-left: 10px!important; }
[class*="_sidebar_post_title"]{ color:#1f2733 !important; }
[class*="_sidebar_date"]{ font-family:'Roboto', sans-serif !important; color:#8aa6bf !important; }
 
/* --- ページネーション --- */
[class*="_pagenation"] a{ color:#2B5581 !important; border-color:#cfd9e4 !important; }
[class*="_pagenation"] .current, [class*="_pagenation"] span.active{
  background:#2B5581 !important; color:#ffffff !important; border-color:#2B5581 !important;
}
 
/* --- トップの新着情報（NEWS帯 / design-parts-52 系）---
   受領は濃紺の帯＋左端に水色の「NEWS」ラベル＋白文字の1行リスト。 */
[class*="design-parts-52"]{ background:#2B5581 !important; }
[class*="design-parts-52"] .banner-area{
  background:#5FB8E6 !important; color:#2B5581 !important;
  font-family:'Raleway', sans-serif !important; font-weight:600 !important; letter-spacing:.18em !important;
}
[class*="design-parts-52"] a{ color:#ffffff !important; }
[class*="design-parts-52"] a:hover{ color:#5FB8E6 !important; }
[class*="design-parts-52"] .date{ font-family:'Roboto', sans-serif !important; color:rgba(255,255,255,.7) !important; }
 
/* --- フォーム（お問い合わせ parts213 / 応募 parts219）---
   受領の入力欄は「白地・1px #c4d3e0・角なし・16px」。必須バッジと注意文は赤 #c0392b。 */
[class*="_form_wrap"] input[type="text"], [class*="_form_wrap"] input[type="email"],
[class*="_form_wrap"] input[type="tel"], [class*="_form_wrap"] input[type="number"],
[class*="_form_wrap"] input[type="url"], [class*="_form_wrap"] textarea,
[class*="_form_wrap"] select,
.formBox input[type="text"], .formBox input[type="email"], .formBox input[type="tel"],
.formBox input[type="number"], .formBox input[type="url"], .formBox textarea, .formBox select{
  background:#ffffff !important; border:1px solid #c4d3e0 !important; border-radius:0 !important;
  color:#1f2733 !important; font-size:16px !important; padding:14px 16px !important;
}
[class*="_form_wrap"] dt, .formBox dt{ color:#2f343a !important; font-weight:700 !important; }
.required, .req{ color:#c0392b !important; font-weight:700 !important; }
.error{ color:#c0392b !important; }
.contact_submit input[type="submit"], [class*="_form_wrap"] input[type="submit"], input.wpcf7-submit{
  background:#2B5581 !important; color:#ffffff !important; border:none !important; border-radius:0 !important;
  min-height:58px !important; padding:0 60px !important; font-size:16px !important; letter-spacing:.04em !important;
}
 
/* ============================================================
   3. 実機で崩れやすい既知パターンの先回り（R-28 の典型崩れ）
   ============================================================ */
 
/* KEEP: 記事カードのグリッド項目に min-width:0。CSS Grid の既定 min-width:auto は
   サムネイル img の intrinsic 幅を min-content として要求するため、SP幅でカードが横にはみ出す。 */
[class*="_post_list"], [class*="_post_list"] > *{ min-width:0 !important; }
/* /KEEP */
 
/* KEEP: テーマ既定の max-width:28〜48% でカード／サイドバー／チップが列幅の1/3に潰れるのを解除。 */
/*[class*="_post_wrap"], [class*="_sidebar"], [class*="_post_category"], .parts-blog-ex_tag{ max-width:none !important; }*/
/* /KEEP */
 
.required{
        background-color: #ffffff!important;
}
.parts213_section_form dl,.parts219_section_form dl{
        display: block!important;
}
.parts213_section_form dd,.parts219_section_form dd{
    margin-left: 0!important;
}
 
/* === add.css 貼り付け ここから === */
/* 下層ページ共通CTA（水のご相談も、採用のご質問も。） */
.gs-cta{ position:relative !important; padding:104px 0 !important; overflow:hidden !important; text-align:center !important; }
.gs-cta__bg{
  position:absolute !important; inset:0 !important; width:100% !important; height:100% !important;
  object-fit:cover !important; object-position:center 30% !important; z-index:0 !important; pointer-events:none !important;
}
.gs-cta__overlay{
  position:absolute !important; inset:0 !important; z-index:1 !important; pointer-events:none !important;
  background:linear-gradient(120deg,rgba(21,47,76,.94),rgba(27,58,91,.82) 55%,rgba(44,111,179,.7)) !important;
}
.gs-cta__inner{ position:relative !important; z-index:2 !important; max-width:820px !important; margin:0 auto !important; padding:0 40px !important; }
.gs-cta__en{
  display:block !important; font-family:'Raleway',sans-serif !important; font-weight:600 !important;
  font-size:12px !important; letter-spacing:.34em !important; color:#8fd0f2 !important;
}
.gs-cta__title{
  margin:18px 0 16px !important; font-family:'Zen Old Mincho',serif !important; font-weight:600 !important;
  font-size:clamp(26px,3.4vw,40px) !important; line-height:1.55 !important; letter-spacing:.1em !important; color:#fff !important;
}
.gs-cta__lead{ margin:0 0 44px !important; font-size:15.5px !important; line-height:2 !important; color:rgba(255,255,255,.86) !important; text-wrap:pretty; }
.gs-cta__actions{
  display:grid !important; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important;
  gap:20px !important; max-width:600px !important; margin:0 auto !important;
}
/* TELカード：外枠はdiv。番号のaはCMSが自動生成 */
.gs-cta__tel{
  display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important;
  gap:2px !important; min-height:78px !important; padding:0 20px !important;
  border:1px solid rgba(255,255,255,.4) !important; color:#fff !important; transition:background .25s ease !important;
}
.gs-cta__tel:hover{ background:rgba(255,255,255,.1) !important; }
.gs-cta__tel-label{
  font-family:'Raleway',sans-serif !important; font-weight:600 !important;
  font-size:10px !important; letter-spacing:.24em !important; color:#8fd0f2 !important;
}
.gs-cta__tel-num,
.gs-cta__tel-num a{
  font-family:'Bodoni Moda',serif !important; font-size:clamp(22px,2.4vw,28px) !important;
  letter-spacing:.04em !important; line-height:1.1 !important; color:#fff !important; text-decoration:none !important;
}
.gs-cta__tel-num a{ display:block !important; }
.gs-cta__btn{
  display:flex !important; align-items:center !important; justify-content:center !important; gap:14px !important;
  min-height:78px !important; padding:0 20px !important; background:#fff !important; color:#1B3A5B !important;
  font-weight:600 !important; font-size:16px !important; letter-spacing:.06em !important;
  text-decoration:none !important; transition:opacity .25s ease !important;
}
.gs-cta__btn:hover{ opacity:.82 !important; color:#1B3A5B !important; }
@media (max-width:767px){
  .gs-cta{ padding:72px 0 !important; }
  .gs-cta__inner{ padding:0 24px !important; }
  .gs-cta__lead{ margin-bottom:32px !important; font-size:14.5px !important; }
  .gs-cta__actions{ grid-template-columns:1fr !important; gap:14px !important; }
}
/* === add.css 貼り付け ここまで === */
 
.parts213_section_form dd label_{
        display: block!important;
}
.design-parts-52_gh3ANVaz9A .container .content h4.banner-area{
        font-size: 15px!important;
    font-weight: bold !important;
}
.parts131415_blog_2aqj4Tu3ga.bg-color{
        background-color: #ffffff00!important;
    padding-top: 1px!important;
    padding-bottom: 1px!important;
}
.parts131415_blog_2aqj4Tu3ga .card{
        border: 1px solid #b5c8d9 !important;
}
 
/* === add.css 追記 ここから === */
/* 募集概要：入社後の育成／勤務条件 SP調整 */
@media (max-width:760px){
  /* 見出し（和文＋英字）は縦積み */
  .gs-growth .gs-sec-head,
  .gs-cond .gs-sec-head{ flex-direction:column !important; align-items:flex-start !important; gap:8px !important; }
  .gs-cond .gs-sec-head--lg{ margin-bottom:28px !important; }
 
  /* 入社後の育成：番号＋期間を横並びヘッダー、本文は全幅 */
  .gs-growth__inner{ padding:0 22px !important; }
  .gs-growth__lead{ margin-bottom:32px !important; font-size:14.5px !important; }
  .gs-growth__item{ grid-template-columns:1fr !important; gap:12px !important; padding-bottom:30px !important; }
  .gs-growth__meta{ flex-direction:row !important; align-items:baseline !important; gap:14px !important; }
  .gs-growth__no{ font-size:28px !important; }
  .gs-growth__body{ padding-left:22px !important; }
  .gs-growth__body p{ font-size:14.5px !important; line-height:1.95 !important; }
 
  /* 勤務条件：テーブルを縦積み */
  .gs-cond__inner{ padding:0 22px !important; }
  .gs-cond__row{ flex-direction:column !important; }
  .gs-cond__th{ flex:none !important; width:100% !important; padding:13px 18px !important; font-size:13px !important; }
  .gs-cond__td{ padding:16px 18px 20px !important; font-size:14.5px !important; line-height:1.9 !important; }
}
/* === add.css 追記 ここまで === */
/* === add.css 追記 ここから === */
.gs-mascot{user-select:none;height:auto !important;object-fit:contain}
@media (max-width:1147px){
  .gs-mascot--recruit{left:auto !important;right:14px !important;bottom:-8px !important;width:126px !important}
}
@media (max-width:600px){
  .gs-mascot--recruit{right:10px !important;width:104px !important}
}
/* === add.css 追記 ここまで === */
/* === add.css 追記 ここから === */
.gs-mascot{user-select:none;height:auto !important;object-fit:contain}
.gs-mascot--contact2{position:static !important}
@media (max-width:1147px){
  .gs-mascot--contact2{width:126px !important;opacity:.7 !important}
}
@media (max-width:600px){
  .gs-mascot--contact2{width:100px !important}
}
/* === add.css 追記 ここまで === */
/* === add.css 追記 ここから === */
/* 人を知る：社員インタビュー */
@media (max-width:1080px){
  .gs-iv-cols{columns:1 !important}
}
@media (max-width:860px){
  .gs-iv-row{grid-template-columns:1fr !important}
  .gs-iv-media{min-height:0 !important;aspect-ratio:4/3}
}
/* === add.css 追記 ここまで === */