/* 下層ページ共通（会社概要・サービス・採用・お問い合わせ・お知らせ）。トップと同じ漆黒の世界観で、読み物として落ち着いた密度に。 */
:root { --void: #04060D; --room: #0A0E1A; --panel: #0F1424; --white: #F3F4F8; --silver: #B8BCC8; --mist: #6F7584; --line: rgba(243, 244, 248, 0.10); --line-strong: rgba(243, 244, 248, 0.22); --gold: #D9BC82; --blue: #86A3D0;
  --display: "Shippori Mincho B1", serif; --body: "Zen Kaku Gothic New", system-ui, sans-serif; --mono: "IBM Plex Mono", ui-monospace, monospace; --ease: cubic-bezier(0.16, 1, 0.3, 1); }
* { box-sizing: border-box; }
html { background: var(--void); scroll-behavior: smooth; }
body { margin: 0; background: radial-gradient(1200px 600px at 70% -10%, rgba(134, 163, 208, 0.10), transparent 60%), var(--void); color: var(--white); font: 400 16px/1.95 var(--body); font-feature-settings: "palt"; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; } img { display: block; max-width: 100%; height: auto; }
.wrap { max-width: 1120px; margin-inline: auto; padding-inline: 32px; }
.mono { font-family: var(--mono); font-weight: 500; letter-spacing: 0.04em; }
.top { position: sticky; top: 0; z-index: 10; height: 72px; border-bottom: 1px solid var(--line); background: rgba(4, 6, 13, 0.82); backdrop-filter: blur(10px); }
.top-in { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo img { width: 140px; }
.nav { display: flex; gap: 28px; font-size: 13px; letter-spacing: 0.1em; color: var(--silver); }
.nav a[aria-current] { color: var(--white); border-bottom: 1px solid var(--gold); padding-bottom: 2px; }
.nav a:hover { color: var(--white); }
main { padding-block: 80px 120px; min-height: 70vh; }
.label { font-size: 12px; letter-spacing: 0.18em; color: var(--mist); }
h1 { font-family: var(--display); font-weight: 700; font-size: clamp(34px, 5vw, 60px); line-height: 1.25; letter-spacing: -0.015em; margin: 14px 0 20px; }
.lede { max-width: 40em; color: var(--silver); font-size: 17px; margin: 0 0 64px; }
h2 { font-family: var(--display); font-weight: 700; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.4; margin: 0 0 24px; }
h3 { font-size: 20px; font-weight: 500; margin: 0 0 10px; }
.sec { padding: 56px 0; border-top: 1px solid var(--line); }
.sec-grid { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 40px; }
.sec-grid .label { padding-top: 8px; }
.prose { max-width: 42em; color: var(--silver); } .prose p { margin: 0 0 1.4em; } .prose strong { color: var(--white); font-weight: 500; }
.prose ul, .prose ol { padding-left: 1.3em; margin: 0 0 1.4em; } .prose li { margin-bottom: 0.4em; }
.quote-l { font-family: var(--display); font-size: clamp(22px, 2.4vw, 30px); line-height: 1.6; color: var(--white); margin: 0 0 28px; }
.gold { color: var(--gold); }
/* 定義表 */
.table { margin: 0; }
.table > div { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px; padding: 18px 0; border-top: 1px solid var(--line); }
.table > div:last-child { border-bottom: 1px solid var(--line); }
.table dt { font-size: 12px; letter-spacing: 0.08em; color: var(--mist); padding-top: 5px; } .table dd { margin: 0; }
/* 3本柱・箇条の並び */
.pillars { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); margin: 0; padding: 0; list-style: none; }
.pillars li { background: var(--room); padding: 32px 28px; }
.pillars .en { font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em; color: var(--gold); margin-bottom: 14px; display: block; }
.pillars h3 { font-family: var(--display); font-size: 22px; }
.steps3 { counter-reset: s; list-style: none; padding: 0; margin: 0; }
.steps3 li { counter-increment: s; display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 24px; padding: 28px 0; border-top: 1px solid var(--line); }
.steps3 li::before { content: counter(s, decimal-leading-zero); font-family: var(--mono); font-size: 32px; color: var(--mist); line-height: 1; padding-top: 4px; }
.steps3 h3 { font-family: var(--display); font-size: 22px; }
.svc { list-style: none; padding: 0; margin: 0; }
.svc > li { padding: 32px 0; border-top: 1px solid var(--line); display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 32px; }
.svc > li:last-child { border-bottom: 1px solid var(--line); }
.svc .tag { font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em; color: var(--gold); display: block; margin-bottom: 10px; }
.svc h3 { font-family: var(--display); font-size: 26px; }
.svc ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.svc ul li { padding-left: 18px; position: relative; color: var(--silver); }
.svc ul li::before { content: ""; position: absolute; left: 0; top: 0.85em; width: 8px; height: 1px; background: var(--gold); }
.svc ul li small { display: block; color: var(--mist); font-size: 13px; }
.access p { margin: 0 0 6px; } .access .st { color: var(--silver); }
.map { margin-top: 24px; aspect-ratio: 16 / 7; border: 1px solid var(--line); filter: grayscale(1) invert(0.92) contrast(0.9); }
.map iframe { width: 100%; height: 100%; border: 0; display: block; }
.policy ol { padding-left: 1.4em; } .policy li { margin-bottom: 0.6em; color: var(--silver); } .policy li b { color: var(--white); font-weight: 500; display: block; }
.bio { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px; align-items: start; }
.bio img { aspect-ratio: 4 / 5; object-fit: cover; border: 1px solid var(--line); filter: grayscale(0.3); }
.bio .name { font-family: var(--display); font-size: 28px; margin: 0; } .bio .en { font-family: var(--mono); font-size: 12px; color: var(--mist); letter-spacing: 0.14em; margin: 4px 0 18px; }
/* フォーム */
.form { max-width: 720px; }
.field { display: grid; gap: 8px; margin-bottom: 26px; }
.field label { font-size: 14px; color: var(--silver); }
.req { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; color: var(--gold); margin-left: 10px; border: 1px solid rgba(217, 188, 130, 0.5); padding: 1px 6px; vertical-align: middle; }
.opt { color: var(--mist); border-color: var(--line-strong); }
.field input, .field select, .field textarea { width: 100%; font: inherit; color: var(--white); background: var(--room); border: 1px solid var(--line-strong); padding: 14px 16px; border-radius: 0; outline: none; transition: border-color 0.3s, box-shadow 0.3s; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217, 188, 130, 0.12); }
.field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--silver) 50%), linear-gradient(135deg, var(--silver) 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.field textarea { min-height: 180px; resize: vertical; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.radio { display: flex; gap: 24px; } .radio label { display: inline-flex; gap: 8px; align-items: center; color: var(--white); }
.hp { position: absolute; left: -9999px; }
.btn { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--gold); color: var(--gold); padding: 16px 36px; font-size: 14px; font-weight: 500; letter-spacing: 0.08em; background: none; cursor: pointer; position: relative; overflow: hidden; transition: color 0.4s; }
.btn::before { content: ""; position: absolute; inset: 0; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 0.5s var(--ease); z-index: 0; }
.btn:hover::before { transform: scaleX(1); } .btn:hover { color: var(--void); } .btn span { position: relative; z-index: 1; }
.btn[disabled] { opacity: 0.5; pointer-events: none; }
.consent { font-size: 13px; color: var(--mist); margin: 0 0 28px; }
.msg { margin-top: 20px; font-size: 14px; min-height: 1.5em; } .msg[data-ok] { color: var(--gold); } .msg[data-err] { color: #e39a9a; }
.alt { margin-top: 48px; padding-top: 28px; border-top: 1px solid var(--line); color: var(--silver); font-size: 14px; } .alt a { color: var(--white); border-bottom: 1px solid var(--line-strong); }
/* お知らせ */
.news-list { list-style: none; padding: 0; margin: 0; }
.news-list li { display: grid; grid-template-columns: 140px 1fr; gap: 24px; padding: 22px 0; border-top: 1px solid var(--line); } .news-list li:last-child { border-bottom: 1px solid var(--line); }
.news-list time { font-size: 13px; color: var(--mist); padding-top: 3px; } .news-list a { font-size: 17px; font-weight: 500; } .news-list a:hover { color: var(--gold); }
.date { font-size: 13px; color: var(--mist); } .empty { color: var(--mist); }
.post .prose a { border-bottom: 1px solid var(--line-strong); }
.foot { border-top: 1px solid var(--line); padding-block: 32px; font-size: 12px; color: var(--mist); }
.foot-in { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: center; justify-content: space-between; }
.foot nav { display: flex; gap: 22px; letter-spacing: 0.08em; }
@media (max-width: 860px) {
  .wrap { padding-inline: 20px; } .nav { display: none; } main { padding-block: 48px 80px; }
  .sec-grid, .svc > li, .bio, .table > div, .steps3 li { grid-template-columns: 1fr; gap: 12px; }
  .pillars { grid-template-columns: 1fr; } .row2 { grid-template-columns: 1fr; gap: 0; }
  .news-list li { grid-template-columns: 1fr; gap: 4px; } .lede { margin-bottom: 40px; }
}