/* 総合ページ（パロディの案）を、建設業の経営者と職人向けに作り直した分の見た目（2026-09-29 先生 決定1〜12）
   写真なしの手配書・効く看板の札・看板の「見る人で分ける」切り替え・現場の実績・一般のお客様向けの細い帯 */

/* ── 写真なしの手配書（姿を見せない星人・決定8） ── */
.nashi-e { position: relative; aspect-ratio: 1 / 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background:
    radial-gradient(60% 55% at 50% 42%, rgba(11,11,13,.92) 0 38%, rgba(11,11,13,0) 39%),
    repeating-linear-gradient(135deg, #E9E9E2 0 12px, #DCDCD4 12px 24px);
  overflow: hidden; }
/* 人の形の影 */
.nashi-e::before { content: ""; position: absolute; left: 50%; bottom: -8%; width: 62%; height: 44%; translate: -50% 0;
  background: #0B0B0D; border-radius: 48% 48% 0 0; }
.nashi-e span.anton { position: relative; z-index: 1; font-size: 120px; line-height: 1; color: var(--kin); margin-top: -40px;
  text-shadow: 0 0 24px rgba(255,214,10,.35); }
.nashi-e span.bc { position: absolute; left: 0; right: 0; top: 46%; z-index: 1; text-align: center; font-size: 12px; letter-spacing: .24em; font-weight: 700;
  color: #0B0B0D; background: var(--kin); padding: 2px 0; rotate: -8deg; scale: 1.1; }
.ugoku .tehai-nashi .nashi-e span.anton { animation: nashi-yureru 3.2s ease-in-out infinite; }
.tehai-nashi:hover .nashi-e span.anton { animation-duration: .5s; }
@keyframes nashi-yureru { 0%, 100% { translate: 0 0; opacity: 1; } 45% { translate: 0 -6px; opacity: .85; } 50% { translate: 3px -6px; opacity: .3; } 55% { translate: 0 -6px; opacity: .9; } }

/* 効く看板（手配書の下） */
.kiku { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.kiku b { margin-right: 2px; }
.kiku-fuda { display: inline-block; font-size: 12.5px; font-weight: 700; color: #0B0B0D; background: #FFF3B0; border: 1.5px solid #0B0B0D; padding: 0 8px; line-height: 1.7; }
.paro .kiku-fuda:hover { color: #0B0B0D; background: var(--kin); }

/* ── 看板の「見る人で分ける」切り替え（決定4） ── */
.jigyo-kirikae { display: flex; gap: 8px; margin-top: 26px; }
.jigyo-kirikae button { font-family: "Zen Kaku Gothic New", sans-serif; font-weight: 700; font-size: 14px; color: #C4C4CC; background: transparent;
  border: 1.5px solid #3A3A42; padding: 8px 20px; cursor: pointer; transition: color .25s ease, background .25s ease, border-color .25s ease; }
.jigyo-kirikae button:hover { color: #FFFFFF; border-color: var(--kin); }
.jigyo-kirikae button.ima { color: #0B0B0D; background: var(--kin); border-color: var(--kin); }
.jigyo-kirikae + .jigyo-ami, .jigyo-ami { margin-top: 22px; }

.kb-muke { display: flex; gap: 5px; margin-bottom: 8px; }
.kb-muke span { font-size: 11px; font-weight: 700; line-height: 1.6; padding: 0 7px; border: 1px solid rgba(255,255,255,.6); color: #FFFFFF; background: rgba(11,11,13,.55); }
.kb-muke .kb-muke-keiei { border-color: var(--kin); color: var(--kin); }
.kb-muke .kb-muke-shokunin { border-color: #7CFF6B; color: #7CFF6B; }

/* 選んだ見る人に合わない札を暗くする（札の数や並びは変えない） */
.jigyo-ami[data-mukou="keiei"] .kb:not(.kb-mada):not([data-muke~="keiei"]),
.jigyo-ami[data-mukou="shokunin"] .kb:not(.kb-mada):not([data-muke~="shokunin"]),
.jigyo-ami[data-mukou="sumai"] .kb:not(.kb-mada):not([data-muke~="sumai"]) { filter: brightness(.28) grayscale(1); scale: .95; }
.jigyo-ami[data-mukou="keiei"] .kb[data-muke~="keiei"],
.jigyo-ami[data-mukou="shokunin"] .kb[data-muke~="shokunin"],
.jigyo-ami[data-mukou="sumai"] .kb[data-muke~="sumai"] { box-shadow: 0 0 0 2px var(--kin), 0 0 30px rgba(255,214,10,.25); }

/* ── 現場の実績（決定10） ── */
.jisseki { padding: 130px 0 60px; }
.jisseki-dai { font-size: 52px; line-height: 1.35; margin-top: 16px; }
.jisseki-hon { font-size: 16px; line-height: 1.95; color: var(--usui); max-width: 44em; margin-top: 18px; }
.genba { padding-top: 100px; }
.genba .fuda5 { margin-top: 34px; }
.paro .tehai-chiisa .tehai-e .tehai-en { font-size: 26px; bottom: 12px; padding: 2px 16px 3px 18px; }
.paro .tehai-chiisa .tehai-na { font-size: 18px; flex-wrap: wrap; gap: 4px 10px; }
.paro .tehai-chiisa .tehai-na .bc { font-size: 12px; }
.paro .tehai-chiisa .tehai-shita { padding: 14px 16px 16px; }
.paro .tehai-chiisa p { font-size: 12.5px; line-height: 1.7; min-height: 5.1em; }
.paro .tehai-chiisa .jakuten { font-size: 12px; }

/* ── 一般のお客様向けの細い帯（決定9） ── */
.sumai-hoso { border-top: 1px solid #26262C; border-bottom: 1px solid #26262C; margin-top: 90px; }
.sumai-hoso-naka { display: flex; align-items: center; gap: 22px; padding-top: 22px; padding-bottom: 22px; font-size: 16px; }
.sumai-hoso-naka .bc { font-size: 13px; letter-spacing: .2em; font-weight: 700; }
.sumai-hoso-saki { margin-left: auto; color: var(--kin); font-size: 15px; letter-spacing: .06em; transition: translate .4s var(--yawaraka); }
.sumai-hoso-naka:hover .sumai-hoso-saki { translate: 6px 0; }

/* 長い星人の名前は、危険度を次の行へ送る */
.paro .tehai-nashi .tehai-na { flex-wrap: wrap; gap: 0 12px; }

/* 通報の札は、6人の手配書の下に横長の1段で置く（左に見出し・真ん中に文・右に行き先） */
.paro .tsuho-hiro { grid-column: 1 / -1; display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content;
  column-gap: 48px; align-items: center; padding: 30px 44px; }
.paro .tsuho-hiro .tsuho-ue { grid-column: 1; grid-row: 1; }
.paro .tsuho-hiro .tsuho-dai { grid-column: 1; grid-row: 2; font-size: 72px; margin-top: 4px; }
.paro .tsuho-hiro .tsuho-na { grid-column: 1; grid-row: 3; margin-top: 6px; }
.paro .tsuho-hiro p { grid-column: 2; grid-row: 1 / 4; margin-top: 0; font-size: 15px; }
.paro .tsuho-hiro .tsuho-saki { grid-column: 3; grid-row: 1 / 4; margin-top: 0; }

/* 親玉の肩の手下：新しい6人を、親玉の絵（前の5星人）の上に重ねる。親玉の顔には手を入れない（2026-09-29 決裁 社長機-2026-0929-13） */
.teshita-ami { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.teshita { position: absolute; display: block; height: auto; aspect-ratio: 1 / 1; object-fit: contain; border: 0 !important; margin: 0 !important;
  filter: drop-shadow(0 6px 8px rgba(0,0,0,.35)); }
.paro .tehai-e img.teshita { width: auto; aspect-ratio: 1 / 1; background: none; }
.teshita-kengai   { left: 3%;  top: 16%; width: 34% !important; }
.teshita-itsumono { left: 19%; top: 5%;  width: 26% !important; }
.teshita-snsmushi { left: 58%; top: 5%;  width: 26% !important; }
.teshita-shukyaku { left: 68%; top: 18%; width: 30% !important; }
.teshita-shokai   { left: 82%; top: 38%; width: 20% !important; }
.teshita-hitode   { left: -3%; top: 44%; width: 22% !important; }
.ugoku .teshita { animation: teshita-yureru 3s ease-in-out infinite; }
.ugoku .teshita-itsumono, .ugoku .teshita-shukyaku { animation-delay: -1s; }
.ugoku .teshita-snsmushi, .ugoku .teshita-hitode { animation-delay: -2s; }
@keyframes teshita-yureru { 0%, 100% { translate: 0 0; } 50% { translate: 0 -4px; } }

/* 写真の右下（スマホは右上）の「見本」の札は出さない（2026-10-01 社長指示「なぜ全部見本？」）。
   写真が機械で作った見本であることは、足もとの断り書きと「はじめに読む」で管理する（お客様に出す前に実物へ差し替える決まりは変わらない） */
.paro .ph::after { content: none; }

/* 行き先がまだ無い所は、押せる形を出さない・押しても何も起きない（2026-10-01 公開前の仕上げ）。
   ホームページ道場の札の「見る →」と、一番下の「準備中」の一覧。住所が入れば自動で戻る */
.ami-oki .kb[href="#"] .kb-saki { display: none; }
.ami-oki .kb[href="#"] { cursor: default; }
.ashi-michi a[href="#"] { pointer-events: none; cursor: default; }
/* 締めの一言（チャンネル登録しても、記憶は消えません） */
.shime-gag { margin-top: 16px; }