@charset "utf-8";
/* ===========================================================
   STONE Capital Advisory コーポレートサイト 共通スタイル
   =========================================================== */

:root{
  --brand-900:#0E3223;   /* 夜の空 */
  --brand-800:#134430;
  --brand-700:#1A583D;
  --brand-600:#22704E;
  --brand-050:#F1F6F2;
  --gold:#B08D4F;
  --gold-dk:#96763E;
  --ink:#1E2622;
  --ink-2:#55605A;
  --ink-3:#7E8781;
  --line:#DCE2DD;
  --line-2:#C6CEC8;
  --bg:#FFFFFF;
  --bg-2:#F4F7F4;
  --bg-3:#EAF0EB;
  --red:#B03A2E;
  --serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",YuMincho,"MS PMincho",serif;
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",YuGothic,Meiryo,sans-serif;
  --mono:"Roboto Mono",Consolas,monospace;
  --wrap:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.95; letter-spacing:.02em;
  -webkit-font-smoothing:antialiased; text-size-adjust:100%;
}
img{max-width:100%; height:auto}
a{color:var(--brand-700); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--gold); outline-offset:2px}
h1,h2,h3,h4{margin:0; font-family:var(--serif); font-weight:600; line-height:1.6}
p{margin:0 0 1.1em}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 24px}
.en{font-family:var(--sans); font-size:11px; font-weight:500; letter-spacing:.22em; color:var(--brand-600); text-transform:uppercase}
.skip{position:absolute; left:-9999px}
.skip:focus{left:8px; top:8px; background:#fff; padding:8px 14px; z-index:999}

/* ---------- ヘッダー ---------- */
.hd-top{height:4px; background:linear-gradient(90deg,var(--brand-800) 0%,var(--brand-600) 55%,var(--gold) 100%)}
header{position:sticky; top:0; z-index:80; background:#fff; border-bottom:1px solid var(--line)}
.hd{max-width:var(--wrap); margin:0 auto; padding:0 24px; display:flex; align-items:center; gap:16px; min-height:70px; flex-wrap:nowrap}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none}
.brand:hover{text-decoration:none}
.brand .mark{width:34px; height:34px; flex:none}
.brand .nm{font-family:var(--serif); font-size:21px; font-weight:700; color:var(--brand-900); letter-spacing:.13em; line-height:1.1}
.brand .sub{display:block; font-family:var(--sans); font-size:9px; font-weight:500; letter-spacing:.24em; color:var(--gold-dk); margin-top:3px}
nav.gnav{margin-left:auto; display:none}
nav.gnav > ul{list-style:none; margin:0; padding:0; display:flex; align-items:center}
nav.gnav > ul > li{position:relative}
nav.gnav > ul > li > a{display:block; padding:24px 11px; font-size:13px; color:var(--ink); letter-spacing:.02em; white-space:nowrap}
nav.gnav > ul > li > a:hover{color:var(--brand-600); text-decoration:none}
nav.gnav .has > a::after{content:"▾"; font-size:9px; margin-left:6px; color:var(--ink-3)}
nav.gnav .sub-menu{
  list-style:none; margin:0; padding:0; position:absolute; top:100%; left:0; min-width:252px;
  background:#fff; border:1px solid var(--line); border-top:2px solid var(--brand-700);
  box-shadow:0 14px 30px -20px rgba(0,0,0,.45);
  opacity:0; visibility:hidden; transform:translateY(-4px); transition:.16s ease;
}
nav.gnav .sub-menu li + li{border-top:1px solid var(--line)}
nav.gnav li:hover > .sub-menu,nav.gnav li:focus-within > .sub-menu{opacity:1; visibility:visible; transform:none}
nav.gnav .sub-menu a{
  display:block; padding:11px 18px 11px 20px; font-size:13px; line-height:1.55; color:var(--ink);
  border-left:3px solid transparent; white-space:nowrap;
}
nav.gnav .sub-menu a:hover{background:var(--brand-050); color:var(--brand-800); border-left-color:var(--gold); text-decoration:none}
.brand .nm{white-space:nowrap}
.hd .hdcta{white-space:nowrap}
@media(max-width:640px){
  .hd{gap:10px; padding:0 16px; min-height:62px}
  .brand .mark{width:28px; height:28px}
  .brand .nm{font-size:17px; letter-spacing:.09em}
  .brand .sub{font-size:8px; letter-spacing:.18em; white-space:nowrap}
  .hd .hdcta{font-size:11.5px; padding:9px 11px; margin-left:auto}
  .navtoggle{width:40px; height:36px; margin-left:8px}
  .wrap{padding:0 18px}
  .layout{padding:36px 18px 0}
}
@media(max-width:400px){
  .brand .sub{display:none}
  .hd .hdcta{font-size:11px; padding:8px 9px}
}

/* モバイルメニュー */
.navtoggle{
  margin-left:12px; width:44px; height:40px; border:1px solid var(--line-2); background:#fff;
  display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; cursor:pointer; border-radius:2px;
}
.navtoggle span{display:block; width:19px; height:1.5px; background:var(--brand-900)}
body.nav-open .navtoggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
body.nav-open .navtoggle span:nth-child(2){opacity:0}
body.nav-open .navtoggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
body.nav-open nav.gnav{display:block; position:absolute; top:100%; left:0; right:0; background:#fff; border-top:1px solid var(--line); box-shadow:0 14px 26px -20px rgba(0,0,0,.5); max-height:74vh; overflow:auto}
body.nav-open nav.gnav > ul{display:block}
body.nav-open nav.gnav > ul > li > a{padding:14px 24px; border-bottom:1px solid var(--line); font-size:14px}
body.nav-open nav.gnav .has > a::after{content:""}
body.nav-open nav.gnav .sub-menu{position:static; opacity:1; visibility:visible; transform:none; border:none; box-shadow:none; background:var(--bg-2); padding:0}
body.nav-open nav.gnav .sub-menu a{padding:11px 24px 11px 40px; border-bottom:1px solid var(--line); font-size:13px}
@media(min-width:1180px){
  nav.gnav{display:block}
  .navtoggle{display:none}
  body.nav-open nav.gnav{position:static; box-shadow:none; border-top:none; max-height:none; overflow:visible}
  body.nav-open nav.gnav > ul{display:flex}
  body.nav-open nav.gnav > ul > li > a{padding:24px 11px; border-bottom:none; font-size:13px}
}
.hd .hdcta{margin-left:auto; background:var(--gold); color:#fff; font-size:12.5px; font-weight:700; padding:10px 16px; letter-spacing:.05em; border-radius:2px}
.hd .hdcta:hover{background:var(--gold-dk); text-decoration:none}
@media(min-width:1180px){ .hd .hdcta{margin-left:10px} }

/* ---------- 下層ページタイトル帯 ---------- */
.pagehead{
  color:#fff; padding:52px 0 48px;
  background:
    linear-gradient(115deg, rgba(9,32,22,.96) 0%, rgba(19,68,48,.92) 58%, rgba(34,112,78,.72) 100%),
    repeating-linear-gradient(58deg, rgba(255,255,255,.035) 0 2px, transparent 2px 9px),
    #0E3223;
}
.pagehead .en{color:#A9C6B2}
.pagehead h1{font-size:clamp(22px,3vw,31px); letter-spacing:.1em; color:#fff; margin-top:12px; font-weight:600}
.pagehead .sub{margin:10px 0 0; font-family:var(--sans); font-size:11px; letter-spacing:.16em; color:#93B29D}
.pagehead .phttl{font-family:var(--serif); font-size:clamp(22px,3vw,31px); letter-spacing:.1em; color:#fff; margin:12px 0 0; font-weight:600; line-height:1.6}

/* ---------- パンくず ---------- */
.crumbs{background:var(--bg-2); border-bottom:1px solid var(--line); font-size:11.5px; color:var(--ink-3)}
.crumbs ol{list-style:none; margin:0; padding:11px 24px; max-width:var(--wrap); margin:0 auto; display:flex; flex-wrap:wrap; gap:8px}
.crumbs li::after{content:"›"; margin-left:8px; color:var(--line-2)}
.crumbs li:last-child::after{content:""}
.crumbs a{color:var(--ink-2)}

/* ---------- 本体レイアウト ---------- */
.layout{max-width:var(--wrap); margin:0 auto; padding:52px 24px 0; display:grid; gap:44px; grid-template-columns:1fr}
@media(min-width:1000px){ .layout{grid-template-columns:minmax(0,1fr) 296px; gap:52px} }
main{min-width:0}

/* ---------- 見出し ---------- */
.sec{margin-bottom:56px}
.sechd{margin-bottom:26px; border-bottom:1px solid var(--line); padding-bottom:14px}
.sechd .en{display:block; padding-left:11px; border-left:3px solid var(--brand-600); line-height:1.4}
.sechd h2{font-size:clamp(20px,2.4vw,25px); letter-spacing:.06em; margin-top:11px}
main h2{font-size:22px; letter-spacing:.05em}
main h3{font-size:17px; letter-spacing:.05em; margin:32px 0 12px; padding-left:12px; border-left:3px solid var(--gold)}
main p{font-size:15.2px; line-height:2.05; color:#2C3531}
main ul,main ol{padding-left:1.4em; margin:0 0 1.2em}
main li{margin-bottom:8px; font-size:15px; line-height:2}

/* ---------- ボタン ---------- */
.btn{display:inline-block; background:var(--gold); color:#fff; font-size:14px; font-weight:700; padding:14px 30px; letter-spacing:.06em; border-radius:2px; border:1px solid var(--gold)}
.btn:hover{background:var(--gold-dk); border-color:var(--gold-dk); text-decoration:none; color:#fff}
.btn.line{background:transparent; color:#fff; border-color:rgba(255,255,255,.55)}
.btn.line:hover{background:rgba(255,255,255,.1); border-color:#fff}
.btn.green{background:var(--brand-700); border-color:var(--brand-700)}
.btn.green:hover{background:var(--brand-800); border-color:var(--brand-800)}

/* ---------- お悩みリスト ---------- */
.concerns{list-style:none; padding:0; margin:0}
.concerns li{
  background:#fff; border:1px solid var(--line); border-left:3px solid var(--gold);
  padding:15px 20px; margin-bottom:11px; font-size:14.5px; line-height:1.85; color:#2C3531;
}

/* ---------- 理由カード ---------- */
.reasons{display:grid; gap:16px; grid-template-columns:1fr}
@media(min-width:660px){ .reasons{grid-template-columns:1fr 1fr} }
.reasons .r{border:1px solid var(--line); background:#fff}
.reasons .r{display:flex; flex-direction:column}
.reasons .rh{background:var(--brand-800); color:#fff; padding:15px 20px; display:flex; flex-direction:column; justify-content:center; min-height:78px}
.reasons .rb{flex:1}
.reasons .rh .no{font-family:var(--mono); font-size:11px; letter-spacing:.16em; color:var(--gold); display:block; margin-bottom:5px}
.reasons .rh h3{font-size:16px; color:#fff; margin:0; padding:0; border:none; letter-spacing:.05em; line-height:1.6}
.reasons .rb{padding:17px 20px; font-size:14px; line-height:1.95; color:#3A443F}

/* ---------- サービスカード ---------- */
.svcgrid{display:grid; gap:16px; grid-template-columns:1fr}
@media(min-width:660px){ .svcgrid{grid-template-columns:1fr 1fr} }
.svccard{border:1px solid var(--line); background:#fff; display:block; color:inherit}
.svccard:hover{text-decoration:none; box-shadow:0 10px 24px -20px rgba(0,0,0,.5)}
.svccard .ch{background:var(--brand-800); color:#fff; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; gap:10px}
.svccard .ch .jp{font-family:var(--serif); font-size:15.5px; letter-spacing:.05em; display:block}
.svccard .ch .enm{font-size:10px; letter-spacing:.13em; color:#9DBCA9; display:block; margin-top:3px}
.svccard .ch .ar{color:var(--gold); font-size:14px}
.svccard:hover .ch{background:var(--brand-700)}
.svccard .cb{padding:16px 18px; font-size:13.8px; line-height:1.9; color:#3A443F}

/* ---------- 流れ ---------- */
.flow{counter-reset:st; margin:0; padding:0; list-style:none}
.flow > li{counter-increment:st; display:grid; grid-template-columns:auto 1fr; gap:18px; padding:20px 0; border-top:1px solid var(--line)}
.flow > li:last-child{border-bottom:1px solid var(--line)}
.flow .n{width:40px; height:40px; border:1px solid var(--brand-600); color:var(--brand-700); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:12px; letter-spacing:.06em}
.flow .n::before{content:"STEP"; display:none}
.flow > li::before{content:none}
.flow .n span{font-size:13px}
.flow h3{margin:0 0 6px; padding:0; border:none; font-size:16.5px}
.flow p{margin:0; font-size:14.2px; line-height:1.95}

/* ---------- 表 ---------- */
.tablewrap{overflow-x:auto; border:1px solid var(--line); margin:0 0 26px}
table{border-collapse:collapse; width:100%; min-width:520px; font-size:14px; background:#fff}
th,td{padding:13px 16px; text-align:left; border-bottom:1px solid var(--line); line-height:1.85; vertical-align:top}
thead th{background:var(--bg-3); font-family:var(--sans); font-size:12.5px; font-weight:700; color:var(--brand-900); letter-spacing:.04em; white-space:nowrap}
tbody th{background:var(--bg-2); font-weight:700; width:170px; white-space:nowrap; color:var(--ink)}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:none}

/* ---------- 注記 ---------- */
p.note,.note{background:var(--brand-050); border-left:3px solid var(--brand-600); padding:15px 19px; font-size:13.8px; line-height:1.95; color:#374039; margin:0 0 26px}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer; list-style:none; padding:18px 42px 18px 34px; position:relative; font-family:var(--serif); font-size:16px; font-weight:600; line-height:1.7}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"Q"; position:absolute; left:0; top:18px; font-family:var(--mono); font-size:13px; color:var(--gold)}
.faq summary::after{content:"＋"; position:absolute; right:6px; top:18px; color:var(--ink-3); font-size:14px}
.faq details[open] summary::after{content:"－"}
.faq .a{padding:0 12px 20px 34px; position:relative; font-size:14.5px; line-height:2; color:#3A443F}
.faq .a::before{content:"A"; position:absolute; left:0; top:0; font-family:var(--mono); font-size:13px; color:var(--ink-3)}
.faq .a p:last-child{margin-bottom:0}

/* ---------- 目次 ---------- */
.toc{background:var(--bg-2); border:1px solid var(--line); padding:20px 24px; margin:0 0 34px}
.toc .t{font-family:var(--serif); font-size:15px; font-weight:600; margin-bottom:10px; letter-spacing:.06em}
.toc ol{list-style:none; margin:0; padding:0; counter-reset:tc}
.toc > ol > li{counter-increment:tc; margin-bottom:7px; font-size:14px; line-height:1.75}
.toc > ol > li::before{content:counter(tc) ". "; color:var(--gold); font-family:var(--mono); font-size:12px}
.toc ol ol{padding-left:1.5em; margin-top:6px}
.toc ol ol li{font-size:13.2px; margin-bottom:5px; color:var(--ink-2)}
.toc ol ol li::before{content:"– "; color:var(--ink-3)}
.toc a{color:var(--ink)}

/* ---------- 記事 ---------- */
.article .lead{font-size:15.5px; line-height:2.05; color:#374039; background:var(--bg-2); border-left:3px solid var(--brand-600); padding:18px 22px; margin-bottom:32px}
.article h2{margin:44px 0 16px; padding-bottom:11px; border-bottom:1px solid var(--line); font-size:21px}
.article h2:first-of-type{margin-top:0}
.article .meta{display:flex; gap:14px; align-items:center; flex-wrap:wrap; margin-bottom:14px; font-size:12px; color:var(--ink-3); font-family:var(--mono)}
.article .cat{background:var(--brand-800); color:#fff; font-family:var(--sans); font-size:11px; letter-spacing:.1em; padding:3px 10px}

/* ---------- 記事一覧 ---------- */
.postlist{list-style:none; margin:0; padding:0; border-top:1px solid var(--line)}
.postlist li{border-bottom:1px solid var(--line)}
.postlist a{display:block; padding:20px 4px; color:inherit}
.postlist a:hover{background:var(--bg-2); text-decoration:none}
.postlist .m{font-family:var(--mono); font-size:11.5px; color:var(--ink-3); margin-bottom:6px; display:flex; gap:12px; align-items:center}
.postlist .m .cat{background:var(--brand-800); color:#fff; font-family:var(--sans); font-size:10.5px; letter-spacing:.1em; padding:2px 9px}
.postlist .t{font-family:var(--serif); font-size:17px; font-weight:600; letter-spacing:.04em; line-height:1.65; color:var(--ink)}
.postlist a:hover .t{color:var(--brand-700)}
.postlist .d{font-size:13.2px; color:var(--ink-2); margin:6px 0 0; line-height:1.85}

/* ---------- 関連記事 ---------- */
.related{background:var(--bg-2); border:1px solid var(--line); padding:24px; margin-top:48px}
.related .t{font-family:var(--serif); font-size:16px; font-weight:600; letter-spacing:.06em; margin-bottom:14px}
.related ul{list-style:none; margin:0; padding:0}
.related li{border-top:1px dotted var(--line-2); padding:11px 0; font-size:14px; line-height:1.75}
.related li:first-child{border-top:none}

/* ---------- サイドバー ---------- */
.side{min-width:0}
@media(min-width:1000px){ .side{position:sticky; top:96px; align-self:start} }
.sidebox{border:1px solid var(--line); margin-bottom:22px; background:#fff}
.sidebox .bh{background:var(--brand-900); color:#fff; padding:14px 18px}
.sidebox .bh .jp{font-family:var(--serif); font-size:15px; letter-spacing:.07em; display:block}
.sidebox .bh .enm{font-size:10px; letter-spacing:.14em; color:#9DBCA9; display:block; margin-top:3px}
.sidebox .grp{background:var(--bg-2); font-size:11.5px; color:var(--ink-2); padding:7px 18px; border-bottom:1px solid var(--line); letter-spacing:.06em}
.sidebox ul{list-style:none; margin:0; padding:0}
.sidebox ul li a{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:13px 18px; border-bottom:1px solid var(--line); font-size:13.5px; color:var(--ink); line-height:1.6}
.sidebox ul li:last-child a{border-bottom:none}
.sidebox ul li a:hover{background:var(--brand-050); color:var(--brand-700); text-decoration:none}
.sidebox ul li a .ar{color:var(--gold); font-size:12px}
.sidebox ul li a[aria-current="page"]{background:var(--brand-050); color:var(--brand-800); font-weight:700}
.sidecta{display:block; background:var(--gold); color:#fff; text-align:center; padding:15px; font-size:14px; font-weight:700; letter-spacing:.05em; margin-bottom:22px}
.sidecta:hover{background:var(--gold-dk); color:#fff; text-decoration:none}
.sidetel{border:1px solid var(--line); padding:16px 18px; text-align:center; font-size:11.5px; color:var(--ink-3); line-height:1.7}
.sidetel b{display:block; font-family:var(--mono); font-size:19px; color:var(--brand-900); font-weight:500; letter-spacing:.02em; margin:5px 0 3px}

/* ---------- 下部CTA ---------- */
.ctaband{
  margin-top:64px; color:#fff; text-align:center; padding:56px 24px;
  background:
    linear-gradient(115deg, rgba(9,32,22,.95) 0%, rgba(19,68,48,.9) 60%, rgba(34,112,78,.8) 100%),
    repeating-linear-gradient(58deg, rgba(255,255,255,.035) 0 2px, transparent 2px 9px),
    #0E3223;
}
.ctaband h2{font-size:clamp(19px,2.5vw,26px); line-height:1.75; letter-spacing:.08em; color:#fff}
.ctaband p{margin:16px auto 0; max-width:40em; font-size:14px; line-height:2; color:#CBDBD0}
.ctaband .btn{margin-top:26px}

/* ---------- フッター ---------- */
footer{background:#0A241A; color:#8FA396; padding:44px 0 26px; font-size:13px; line-height:1.9}
footer a{color:#C3D2C7}
.ftgrid{display:grid; gap:28px; grid-template-columns:1fr}
@media(min-width:820px){ .ftgrid{grid-template-columns:1.5fr 1fr 1fr} }
.ftgrid h4{font-family:var(--sans); font-size:10.5px; letter-spacing:.18em; color:var(--gold); font-weight:700; margin-bottom:13px}
.ftgrid ul{list-style:none; margin:0; padding:0}
.ftgrid li{margin-bottom:8px; font-size:12.8px}
.ftbrand .nm{font-family:var(--serif); font-size:19px; color:#EAF0EB; letter-spacing:.12em}
.ftbrand p{font-size:12.5px; margin:12px 0 0; color:#9DAFA3}
.gov{display:flex; gap:12px; flex-wrap:wrap; margin:30px 0 0}
.gov a{background:#fff; padding:13px 18px; display:block; min-width:196px; border-radius:3px}
.gov a:hover{text-decoration:none}
.gov .jp{display:flex; gap:7px; align-items:center; font-family:var(--sans); font-size:13.5px; font-weight:700; color:#1B3E2F; letter-spacing:.03em}
.gov .jp .ar{font-size:11px; color:#8894A4}
.gov .enm{display:block; font-size:10.5px; color:#9A9585; margin-top:4px}
.ftrule{height:1px; background:#1B3A2B; margin:28px 0}
.ftbtm{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:11.5px; color:#6E8175}
.ftbtm .disc{max-width:46em}

/* ---------- 汎用 ---------- */
.tags{display:flex; gap:8px; flex-wrap:wrap; margin:14px 0 0}
.tags a{border:1px solid var(--line-2); font-size:12px; padding:4px 11px; color:var(--ink-2); border-radius:2px}
.tags a:hover{background:var(--brand-050); border-color:var(--brand-600); color:var(--brand-700); text-decoration:none}
.works{counter-reset:w; list-style:none; margin:0; padding:0}
.works > li{counter-increment:w; border-top:1px solid var(--line); padding:26px 0}
.works > li:last-child{border-bottom:1px solid var(--line)}
.works .no{font-family:var(--mono); font-size:12px; color:var(--gold); letter-spacing:.14em}
.works h3{margin:6px 0 12px; padding:0; border:none; font-size:19px}
.career{list-style:none; margin:0; padding:0}
.career > li{border-top:1px solid var(--line); padding:20px 0; display:grid; gap:6px}
.career > li:last-child{border-bottom:1px solid var(--line)}
.career .org{font-family:var(--serif); font-size:16.5px; font-weight:600; letter-spacing:.04em}
.career ul{margin:4px 0 0; padding-left:1.3em}
.career li li{font-size:14px; margin-bottom:4px}
.history{list-style:none; margin:0; padding:0}
.history li{display:grid; grid-template-columns:auto 1fr; gap:20px; border-top:1px solid var(--line); padding:14px 0; font-size:14.5px}
.history li:last-child{border-bottom:1px solid var(--line)}
.history .ym{font-family:var(--mono); font-size:13px; color:var(--brand-700); white-space:nowrap; padding-top:2px}
.ph{color:var(--ink-3); background:var(--bg-3); padding:0 4px; border-radius:2px}

/* フォーム */
.formcard{border:1px solid var(--line); background:#fff; padding:30px 28px}
@media(max-width:520px){ .formcard{padding:22px 18px} }
.field{margin-bottom:19px}
.field label{display:flex; align-items:center; gap:9px; font-size:13px; font-weight:700; color:var(--brand-900); margin-bottom:8px; letter-spacing:.04em}
.req{background:var(--red); color:#fff; font-size:10px; font-weight:700; padding:2px 7px; border-radius:2px; letter-spacing:.06em}
.any{background:var(--bg-3); color:var(--ink-2); font-size:10px; font-weight:700; padding:2px 7px; border-radius:2px; letter-spacing:.06em}
.field input,.field select,.field textarea{
  width:100%; font-family:inherit; font-size:14.5px; color:var(--ink); background:#FCFDFC;
  border:1px solid var(--line-2); border-radius:3px; padding:12px 14px; line-height:1.7;
}
.field textarea{min-height:130px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--brand-600); box-shadow:0 0 0 3px rgba(34,112,78,.1)}
.field input::placeholder,.field textarea::placeholder{color:#A7ADA8}
.submit{width:100%; border:none; cursor:pointer; font-family:inherit; font-size:15.5px; font-weight:700; background:var(--brand-800); color:#fff; padding:16px; letter-spacing:.08em; border-radius:2px}
.submit:hover{background:var(--brand-700)}
.privacy-note{text-align:center; font-size:11.5px; color:var(--ink-3); margin:14px 0 0}

@media (prefers-reduced-motion:reduce){ *{transition:none !important; scroll-behavior:auto !important} }

/* ===========================================================
   ヒーローアニメーション／固定ヘッダー／スクロール表示
   =========================================================== */

/* --- 固定ヘッダー（スクロールで縮む） --- */
header{transition:box-shadow .25s ease, background .25s ease}
header.scrolled{box-shadow:0 6px 20px -14px rgba(0,0,0,.45); background:rgba(255,255,255,.97); backdrop-filter:saturate(180%) blur(8px)}
header.scrolled .hd{min-height:58px}
header.scrolled .brand .mark{width:30px; height:30px}
header.scrolled .brand .nm{font-size:19px}
.hd,.brand .mark,.brand .nm{transition:all .25s ease}
.gotop{
  position:fixed; right:20px; bottom:20px; z-index:70; width:46px; height:46px;
  background:var(--brand-800); color:#fff; border:none; border-radius:2px; cursor:pointer;
  display:flex; align-items:center; justify-content:center; font-size:15px;
  opacity:0; visibility:hidden; transform:translateY(8px); transition:.25s ease;
}
.gotop.on{opacity:1; visibility:visible; transform:none}
.gotop:hover{background:var(--brand-700)}

/* --- スクロール表示 --- */
body.anim-ready .rv{opacity:0; transform:translateY(16px)}
body.anim-ready .rv.in{opacity:1; transform:none; transition:opacity .75s ease, transform .75s cubic-bezier(.2,.7,.3,1)}

/* --- ヒーロー：レイアウト --- */
.hero .wrap{display:grid; gap:34px; grid-template-columns:1fr; align-items:center}
@media(min-width:980px){ .hero .wrap{grid-template-columns:minmax(0,1fr) 400px; gap:48px} }
.heroart{width:100%; max-width:340px; margin:0 auto; display:block}
@media(min-width:980px){ .heroart{max-width:400px} }

/* --- ヒーロー：アニメーション本体 --- */
.heroart .ring{transform-origin:220px 220px}
.heroart .ring-a{animation:ringspin 64s linear infinite}
.heroart .ring-b{animation:ringspin 46s linear infinite reverse}
.heroart .ring-c{animation:ringspin 96s linear infinite}
@keyframes ringspin{to{transform:rotate(360deg)}}

.heroart .bar{transform-origin:220px 310px; animation:barrise 16s ease-in-out infinite}
@keyframes barrise{
  0%{transform:scaleY(0); opacity:0}
  8%{opacity:1}
  14%{transform:scaleY(1)}
  86%{transform:scaleY(1); opacity:1}
  96%,100%{transform:scaleY(1); opacity:0}
}
.heroart .seg{animation:segsplit 16s ease-in-out infinite}
.heroart .seg2{animation-delay:.15s}
.heroart .seg3{animation-delay:.3s}
.heroart .seg4{animation-delay:.45s}
@keyframes segsplit{
  0%,16%{transform:translateY(0)}
  30%,86%{transform:translateY(var(--sy,0))}
  96%,100%{transform:translateY(0)}
}
.heroart .lbl{opacity:0; animation:lblin 16s ease-in-out infinite}
.heroart .lbl2{animation-delay:.5s}
.heroart .lbl3{animation-delay:.7s}
.heroart .lbl4{animation-delay:.9s}
@keyframes lblin{
  0%,26%{opacity:0; transform:translateX(-6px)}
  38%,84%{opacity:1; transform:translateX(0)}
  92%,100%{opacity:0; transform:translateX(0)}
}
.heroart .lead-line{stroke-dasharray:60; stroke-dashoffset:60; animation:draw 16s ease-in-out infinite}
.heroart .ll2{animation-delay:.5s}
.heroart .ll3{animation-delay:.7s}
.heroart .ll4{animation-delay:.9s}
@keyframes draw{
  0%,26%{stroke-dashoffset:60}
  40%,84%{stroke-dashoffset:0}
  92%,100%{stroke-dashoffset:60}
}
.heroart .deal{animation:dealmerge 16s ease-in-out infinite}
.heroart .dealL{--dx:-64px}
.heroart .dealR{--dx:64px}
@keyframes dealmerge{
  0%{transform:translateX(var(--dx,0)); opacity:0}
  6%{opacity:.9}
  16%{transform:translateX(0); opacity:.9}
  26%{transform:translateX(0); opacity:0}
  100%{transform:translateX(var(--dx,0)); opacity:0}
}
.heroart .person{opacity:0; animation:personin 16s ease-in-out infinite}
.heroart .p2{animation-delay:.35s}
.heroart .p3{animation-delay:.7s}
@keyframes personin{
  0%,44%{opacity:0; transform:translateY(7px)}
  56%,84%{opacity:.85; transform:translateY(0)}
  92%,100%{opacity:0; transform:translateY(0)}
}
.heroart .handover{stroke-dasharray:96; stroke-dashoffset:96; animation:draw2 16s ease-in-out infinite}
@keyframes draw2{
  0%,52%{stroke-dashoffset:96}
  68%,84%{stroke-dashoffset:0}
  92%,100%{stroke-dashoffset:96}
}
.heroart .dot{animation:dotdrift 9s ease-in-out infinite alternate}
.heroart .d2{animation-delay:-3s}
.heroart .d3{animation-delay:-6s}
@keyframes dotdrift{from{transform:translate(0,0)}to{transform:translate(6px,-10px)}}

/* --- 下層ページ：承継モチーフ --- */
.pagehead{position:relative; overflow:hidden}
.pagehead .wrap{position:relative; z-index:2}
.pagehead .headart{z-index:1}
.headart{position:absolute; right:40px; top:50%; transform:translateY(-50%); width:280px; opacity:.5; z-index:1; pointer-events:none}
@media(max-width:900px){ .headart{display:none} }
.headart .ring{transform-origin:110px 110px; animation:ringspin 70s linear infinite}
.headart .ring-b{animation:ringspin 50s linear infinite reverse}

@media (prefers-reduced-motion:reduce){
  .heroart *,.headart *{animation:none !important}
  .heroart .lbl,.heroart .person{opacity:1 !important}
  .heroart .lead-line,.heroart .handover{stroke-dashoffset:0 !important}
  .heroart .deal{opacity:.9 !important; transform:none !important}
  body.anim-ready .rv{opacity:1 !important; transform:none !important}
}