* { box-sizing:border-box; }
.system-page { margin:0; color:var(--ink); background:#fff; font-family:"Noto Sans JP","Yu Gothic",sans-serif; }
.system-page a { text-decoration:none; }
.system-shell { width:min(1120px,calc(100% - 64px)); margin-inline:auto; }
.system-main { position:relative; min-height:calc(100vh - 88px); overflow:hidden; background:linear-gradient(115deg,#fff 0 57%,var(--ivory) 57%); }
.system-main::before { content:""; position:absolute; top:-330px; right:-250px; width:760px; height:760px; border:1px solid rgba(0,156,166,.2); border-radius:50%; }
.system-main::after { content:""; position:absolute; bottom:-380px; left:-330px; width:760px; height:760px; border:1px solid rgba(244,123,32,.14); border-radius:50%; }
.system-content { position:relative; z-index:1; padding:92px 0 106px; }
.system-heading { max-width:850px; margin-inline:auto; text-align:center; }
.system-status-mark { position:relative; width:98px; height:98px; margin:0 auto 28px; display:grid; place-items:center; border:1px solid rgba(0,156,166,.24); border-radius:50%; color:#fff; background:var(--teal); box-shadow:0 16px 38px rgba(0,156,166,.19); }
.system-status-mark::before { content:""; position:absolute; inset:-11px; border:1px solid rgba(0,156,166,.17); border-radius:50%; }
.system-status-mark svg { width:42px; height:42px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:2.2; }
.system-eyebrow { margin:0 0 18px; color:var(--teal-dark); font:800 12px/1.3 Inter,"Noto Sans JP",sans-serif; letter-spacing:.13em; }
.system-heading h1 { margin:0; font-size:52px; font-weight:700; line-height:1.48; letter-spacing:-.045em; }
.system-lead { max-width:680px; margin:22px auto 0; color:var(--muted); font-size:15px; line-height:2; }
.system-panel { max-width:920px; margin:50px auto 0; border:1px solid rgba(8,34,59,.12); border-radius: var(--radius-media); background:#fff; box-shadow:0 18px 46px rgba(8,34,59,.10); }
.download-panel { padding:42px 44px; display:grid; grid-template-columns:1fr auto; align-items:center; gap:44px; color:#fff; background:var(--dark); }
.download-panel__copy small { color:var(--teal-300); font:800 10px/1.3 Inter,sans-serif; letter-spacing:.13em; }
.download-panel__copy h2 { margin:15px 0 0; font-size:28px; font-weight:700; line-height:1.55; letter-spacing:-.035em; }
.download-panel__meta { margin:11px 0 0; color:rgba(255,255,255,.68); font-size:12px; line-height:1.8; }
.system-primary-action { min-width:260px; min-height:60px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; gap:18px; border:0; border-radius: var(--radius-control); color:#fff; background:var(--orange); font-size:13px; font-weight:700; cursor:pointer; box-shadow:0 12px 28px rgba(244,123,32,.2); }
.system-primary-action::after { content:"↓"; font-size:18px; }
.system-primary-action:hover { background:#db6918; transform:translateY(-1px); }
.system-note { max-width:920px; margin:18px auto 0; display:flex; align-items:flex-start; gap:10px; color:var(--muted); font-size:12px; line-height:1.8; }
.system-note::before { content:"i"; width:19px; height:19px; display:grid; flex:0 0 auto; place-items:center; border:1px solid var(--teal); border-radius:50%; color:var(--teal-dark); font:700 11px/1 Inter,sans-serif; }
.system-subheading { max-width:920px; margin:64px auto 0; display:flex; align-items:end; justify-content:space-between; gap:30px; }
.system-subheading h2 { margin:0; font-size:30px; font-weight:700; line-height:1.5; letter-spacing:-.035em; }
.system-subheading p { margin:0; color:var(--muted); font-size:12px; }
.system-links { max-width:920px; margin:24px auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
/* fix: T25 カード内の小ラベル(FUNCTION等)と本文(機能紹介を見る)の間隔を詰める（space-between→中央寄せ＋小gap。三木指示） */
.system-link-card { min-height:110px; padding:22px 24px; display:flex; flex-direction:column; justify-content:center; gap:10px; border:1px solid var(--line); border-radius:14px; color:var(--ink); background:rgba(255,255,255,.85); transition:.2s ease; }
.system-link-card:hover { border-color:var(--teal); transform:translateY(-2px); box-shadow:0 12px 28px rgba(8,34,59,.07); }
.system-link-card small { color:var(--teal-dark); font:800 9px/1.2 Inter,sans-serif; letter-spacing:.11em; }
.system-link-card span { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:14px; font-weight:700; }
.system-link-card span::after { content:"→"; color:var(--teal); font-size:18px; }

/* #27: materials/thanks — bring the arrow closer to the label and size it up */
.materials-thanks-page .system-link-card span { justify-content:flex-start; gap:10px; font-size:16px; }
/* fix: 手順フロー削除で枠だけが浮くため、.system-panel の白枠(border/bg/shadow)をこのページだけ打ち消す（三木T?）。padding:0にし複数の縦マージンは折りたたみに任せる */
.contact-complete-panel { padding:0; border:none; border-radius:0; background:none; box-shadow:none; }
.complete-flow { margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); list-style:none; }
.complete-flow li { position:relative; min-height:108px; padding:0 28px; border-right:1px solid var(--line); }
.complete-flow li:first-child { padding-left:0; }
.complete-flow li:last-child { padding-right:0; border:0; }
.complete-flow b { color:var(--teal); font:800 22px/1 Inter,sans-serif; }
.complete-flow h2 { margin:15px 0 0; font-size:15px; font-weight:700; }
.complete-flow p { margin:8px 0 0; color:var(--muted); font-size:11px; line-height:1.8; }
.complete-back { margin-top:34px; text-align:center; }
.system-secondary-action { min-width:260px; min-height:56px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; gap:18px; border:1px solid var(--teal); border-radius: var(--radius-control); color:var(--teal-dark); background:#fff; font-size:13px; font-weight:700; transition:.2s ease; }
.system-secondary-action:hover { background:var(--mist); box-shadow:0 8px 20px rgba(8,34,59,.08); transform:translateY(-1px); }
.system-secondary-action::after { content:"→"; }
.error-page .system-content { min-height:750px; display:grid; place-items:center; }
.error-layout { width:100%; display:grid; grid-template-columns:.82fr 1.18fr; align-items:center; gap:80px; }
.error-code { position:relative; text-align:center; }
.error-code strong { position:relative; z-index:1; display:block; color:var(--dark); font:800 clamp(150px,17vw,250px)/.8 Inter,sans-serif; letter-spacing:-.09em; }
/* 数字に重なる背後のリングを削除（高谷T28 / 三木T46）。線の丸が必要なら細い outline で再追加する */
.error-code::before { content:none; }
.error-copy .system-eyebrow { margin-bottom:20px; }
.error-copy h1 { margin:0; font-size:46px; font-weight:700; line-height:1.48; letter-spacing:-.045em; }
.error-copy > p { margin:22px 0 0; color:var(--muted); font-size:14px; line-height:2; }
.error-copy .error-status { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:18px; color:var(--muted); font-size:12px; line-height:1.7; }
.error-status span { color:var(--teal-dark); font:700 10px/1 Inter,sans-serif; letter-spacing:.12em; }
.error-status strong { color:var(--dark); font:800 13px/1 Inter,sans-serif; letter-spacing:.04em; }
.error-actions { margin-top:34px; display:flex; flex-wrap:wrap; gap:12px; }
.error-actions .system-primary-action { min-width:220px; background:var(--teal); }
.error-actions .system-primary-action::after { content:"→"; }
.error-actions .system-primary-action:hover { background:var(--teal-dark); }
.error-actions .system-secondary-action { min-width:200px; }
.error-help { margin-top:38px; padding-top:25px; border-top:1px solid var(--line); }
.error-help p { margin:0 0 14px; color:var(--muted); font-size:11px; }
.error-help nav { display:flex; flex-wrap:wrap; gap:18px; }
.error-help a { color:var(--teal-dark); font-size:12px; font-weight:700; }
.error-help a:hover { text-decoration:underline; }
.system-page .site-header .button-primary { color:#fff; }
.system-page .site-header .button-secondary { color:var(--teal-700); }

@media (max-width:700px) {
  .system-shell { width:calc(100% - 40px); }
  .system-main { min-height:calc(100vh - 89px); background:#fff; }
  .system-main::before { top:-210px; right:-260px; width:520px; height:520px; }
  .system-main::after { display:none; }
  .system-content { padding:58px 0 70px; }
  .system-status-mark { width:78px; height:78px; margin-bottom:24px; }
  .system-status-mark::before { inset:-8px; }
  .system-status-mark svg { width:34px; height:34px; }
  .system-eyebrow { margin-bottom:13px; font-size:10px; }
  .system-heading h1 { font-size:34px; line-height:1.52; }
  .system-lead { margin-top:18px; font-size:12px; }
  .system-panel { margin-top:35px; border-radius:15px; }
  .download-panel { padding:30px 24px 26px; grid-template-columns:1fr; gap:25px; text-align:left; }
  .download-panel__copy h2 { font-size:22px; }
  .system-primary-action { width:100%; min-width:0; min-height:58px; }
  .system-note { font-size:10px; }
  .system-subheading { margin-top:48px; display:block; }
  .system-subheading h2 { font-size:27px; }
  .system-subheading p { margin-top:9px; }
  .system-links { margin-top:20px; grid-template-columns:1fr; gap:11px; }
  .system-link-card { min-height:102px; padding:21px; }
  .contact-complete-panel { padding:0; }
  .complete-flow { grid-template-columns:1fr; }
  .complete-flow li,.complete-flow li:first-child,.complete-flow li:last-child { min-height:0; padding:20px 0; border-right:0; border-bottom:1px solid var(--line); }
  .complete-flow li:first-child { padding-top:0; }
  .complete-flow li:last-child { padding-bottom:0; border:0; }
  .complete-flow h2 { margin-top:10px; }
  .system-secondary-action { width:100%; min-width:0; }
  .error-page .system-content { min-height:700px; }
  .error-layout { grid-template-columns:1fr; gap:48px; text-align:center; }
  .error-code strong { font-size:142px; }
  .error-code::before { width:230px; height:230px; border-width:38px; }
  .error-copy h1 { font-size:28px; }
  .error-copy > p { font-size:12px; }
  .error-copy .error-status { justify-content:center; font-size:11px; }
  .error-actions { justify-content:center; }
  .error-actions a,.error-actions button { width:100%; }
  .error-help nav { justify-content:center; }
}