/* リニューアル案D：骨格＝Acorns（中央そろえ・縦に積む・カードの並び・試算）／雰囲気＝Cash App（単色の面・極太の大きな文字・高いコントラスト） */
:root {
  --blue: #009ffd; --blue-d: #0077d9; --mint: #23e4ab;
  --black: #08090b; --ink: #0b1b2b; --ink-2: #55606b; --line: #e7ebef; --bg-2: #f4f6f8;
  --grad: linear-gradient(100deg, #009ffd 0%, #0bc0e6 55%, #23e4ab 100%);
  --ease: cubic-bezier(.2, .8, .2, 1);
}
*, *::before, *::after { box-sizing: border-box; }
body.rd { margin: 0; background: #fff; color: var(--black); font-family: "Inter", "Noto Sans JP", system-ui, sans-serif; font-size: 16px; line-height: 1.8;
  -webkit-font-smoothing: antialiased; overflow-x: hidden; word-break: auto-phrase; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
.pc { display: inline; } .sp { display: none; }
@media (max-width: 768px) { .pc { display: none; } .sp { display: inline; } }
.rd-wrap { width: min(1120px, 100% - 40px); margin: 0 auto; text-align: center; }
.rd-wrap--narrow { width: min(760px, 100% - 40px); }

/* 共通の文字 */
.rd-kicker { display: inline-block; margin: 0 0 16px; font: 800 13px/1 "Inter", "Noto Sans JP", sans-serif; letter-spacing: .14em; color: #fff; opacity: .7; }
.rd-kicker--blue { color: var(--blue); opacity: 1; }
.rd-kicker--light { color: #fff; opacity: .85; }
.rd-h2 { margin: 0 0 20px; font: 900 clamp(32px, 5.4vw, 72px)/1.12 "Noto Sans JP", sans-serif; letter-spacing: -.035em; }
.rd-lead { max-width: 640px; margin: 0 auto 40px; font-size: 18px; font-weight: 500; opacity: .8; }
.rd-small { margin: 28px 0 0; font-size: 13px; opacity: .6; }
.rd-note { position: absolute; right: 20px; bottom: 14px; margin: 0; font-size: 11px; opacity: .7; }
.rd-pill { display: inline-flex; align-items: center; height: 40px; padding: 0 20px; border-radius: 999px; font-weight: 800; font-size: 14px; white-space: nowrap; transition: transform .25s var(--ease); }
.rd-pill:hover { transform: scale(1.04); }
.rd-pill--dark { background: var(--black); color: #fff; }
.rd-stores { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.rd-stores img { width: auto; height: 50px; } /* 幅でそろえると App Store と Google Play で高さが違う（47/42px）→ 高さでそろえる（2026-10-06 機械の点検で162ページ） */
.rd-stores a { transition: transform .25s var(--ease); } .rd-stores a:hover { transform: translateY(-3px); }

/* ---------- ヘッダー（Acorns 式：白地・中央にメニュー・右に丸ボタン） ---------- */
.rd-header { position: fixed; inset: 0 0 auto; z-index: 50; transition: background .35s, box-shadow .35s; }
.rd-header.is-solid { background: rgba(255,255,255,.9); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.rd-header__in { width: min(1200px, 100% - 40px); margin: 0 auto; height: 64px; display: flex; align-items: center; gap: 24px; }
.rd-logo img { width: 128px; filter: brightness(0) invert(1); transition: filter .35s; }
.rd-header.is-solid .rd-logo img, .is-menu .rd-logo img { filter: none; }
.rd-nav { display: flex; align-items: center; gap: 24px; margin: 0 auto; font-size: 14px; font-weight: 700; color: #fff; }
.rd-header.is-solid .rd-nav { color: var(--black); }
.rd-nav > a, .rd-dd > button { padding: 6px 0; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; opacity: .9; }
.rd-nav > a:hover, .rd-dd > button:hover { opacity: 1; }
.rd-dd { position: relative; }
.rd-dd__menu { position: absolute; left: 50%; top: calc(100% + 12px); min-width: 210px; padding: 8px; border-radius: 16px; background: #fff; color: var(--black);
  box-shadow: 0 20px 40px -12px rgba(0,0,0,.25); opacity: 0; visibility: hidden; transform: translate(-50%, -6px); transition: .25s var(--ease); }
.rd-dd__menu::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.rd-dd__menu a { display: block; padding: 10px 14px; border-radius: 10px; white-space: nowrap; }
.rd-dd__menu a:hover { background: var(--bg-2); }
.rd-dd:hover .rd-dd__menu, .rd-dd:focus-within .rd-dd__menu, .rd-dd.is-open .rd-dd__menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.rd-header__cta { background: #fff; color: var(--black); }
.rd-header.is-solid .rd-header__cta, .is-menu .rd-header__cta { background: var(--black); color: #fff; }
.rd-burger { display: none; position: relative; width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(255,255,255,.2); cursor: pointer; }
.rd-burger span { position: absolute; left: 12px; right: 12px; height: 2px; background: #fff; transition: .3s var(--ease); }
.rd-burger span:first-child { top: 16px; } .rd-burger span:last-child { top: 22px; }
.rd-header.is-solid .rd-burger, .is-menu .rd-burger { background: var(--bg-2); }
.rd-header.is-solid .rd-burger span, .is-menu .rd-burger span { background: var(--black); }
.is-menu .rd-burger span:first-child { top: 19px; transform: rotate(45deg); } .is-menu .rd-burger span:last-child { top: 19px; transform: rotate(-45deg); }
.is-menu .rd-header { background: #fff; }
.is-menu { overflow: hidden; }
.rd-drawer { position: fixed; inset: 0; z-index: 45; padding: 84px 20px 28px; background: #fff; overflow-y: auto; display: flex; flex-direction: column; justify-content: space-between; }
.rd-drawer[hidden] { display: none; }
.rd-drawer nav { display: flex; flex-direction: column; }
.rd-drawer nav a { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 18px; font-weight: 800; }
.rd-drawer nav a.sub { font-size: 16px; font-weight: 600; padding-left: 12px; }
.rd-drawer nav p { margin: 20px 0 2px; font-size: 12px; font-weight: 800; color: #9aa3ab; letter-spacing: .08em; }
.rd-drawer nav a.biz { margin-top: 20px; border: 2px solid var(--black); border-radius: 999px; text-align: center; }
.rd-drawer .rd-stores { justify-content: flex-start; margin-top: 28px; } .rd-drawer .rd-stores img { width: auto; height: 45px; }

/* ---------- 1 ヒーロー（中央そろえ・単色の青） ---------- */
.rd-hero { position: relative; overflow: hidden; padding: 128px 0 0; background: var(--blue); color: #fff; text-align: center; }
.rd-hero__copy { position: relative; z-index: 2; width: min(1000px, 100% - 40px); margin: 0 auto; }
.rd-hero__title { margin: 0; font: 900 clamp(46px, 9.2vw, 132px)/1.02 "Noto Sans JP", sans-serif; letter-spacing: -.05em; }
.rd-w { display: inline-block; }
.rd-js .rd-w { opacity: 0; transform: translateY(40%) scale(.96); filter: blur(8px); }
.is-ready .rd-w { opacity: 1; transform: none; filter: none; transition: opacity .8s var(--ease) var(--d), transform 1s var(--ease) var(--d), filter .8s var(--ease) var(--d); }
.rd-hero__lead { margin: 28px 0 24px; font-size: 20px; font-weight: 700; }
.rd-hero__perks { list-style: none; margin: 0 0 32px; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
.rd-hero__perks li { display: flex; align-items: center; gap: 10px; padding: 8px 18px 8px 8px; border-radius: 999px; background: #fff; color: var(--black); font-weight: 800; font-size: 16px; }
.rd-hero__perks svg { width: 30px; height: 30px; }
.rd-js .rd-in { opacity: 0; transform: translateY(16px); }
.is-ready .rd-in { opacity: 1; transform: none; transition: opacity .8s var(--ease) var(--d), transform .8s var(--ease) var(--d); }

.rd-hero__stage { position: relative; width: min(900px, 100%); height: 560px; margin: 56px auto 0; }
.rd-phone { position: absolute; left: 50%; top: 0; width: 300px; height: 620px; margin-left: -150px; padding: 11px; border-radius: 50px; background: var(--black);
  box-shadow: 0 0 0 2px #2b3138, 0 40px 80px -20px rgba(0,30,70,.6); transform: translateY(var(--lift, 0px)); }
.rd-js .rd-phone { opacity: 0; translate: 0 120px; }
.is-ready .rd-phone { opacity: 1; translate: 0 0; transition: opacity .9s var(--ease) .45s, translate 1.3s var(--ease) .45s; }
.rd-phone::before { content: ""; position: absolute; top: 22px; left: 50%; width: 90px; height: 26px; margin-left: -45px; border-radius: 20px; background: var(--black); z-index: 2; }
.rd-phone__screen { height: 100%; border-radius: 40px; overflow: hidden; background: #fff; color: var(--black); text-align: left; }
.rd-status { display: flex; justify-content: space-between; padding: 16px 26px 0; font: 700 14px/1 "Inter", sans-serif; }
.rd-status i { width: 22px; height: 11px; border: 1.5px solid var(--black); border-radius: 3px; }
.rd-app { padding: 44px 18px 0; }
.rd-app__hi { margin: 0 4px 14px; font-size: 13px; color: var(--ink-2); line-height: 1.4; } .rd-app__hi b { color: var(--black); }
.rd-app__card { display: flex; flex-direction: column; padding: 20px; border-radius: 22px; background: var(--black); color: #fff; line-height: 1.3; }
.rd-app__card > span { font-size: 12px; opacity: .7; }
.rd-app__card b { margin: 6px 0 4px; font: 900 36px "Inter", sans-serif; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.rd-app__card b small { font: 800 15px "Noto Sans JP", sans-serif; margin-left: 2px; }
.rd-app__card em { font-style: normal; font-size: 11px; opacity: .7; }
.rd-app__row { display: flex; justify-content: space-between; padding: 12px 4px; border-bottom: 1px solid var(--line); font-size: 13px; }
.rd-app__row span { color: var(--ink-2); }
.rd-app__done { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding: 12px 14px; border-radius: 14px; background: #e8f7ff; color: var(--blue-d); font-size: 13px; font-weight: 800; }
.rd-app__done i { width: 22px; height: 22px; border-radius: 50%; background: var(--blue); position: relative; }
.rd-app__done i::after { content: ""; position: absolute; left: 8px; top: 4px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }

.rd-coin { position: absolute; z-index: 3; filter: drop-shadow(0 14px 16px rgba(0,40,90,.35)); }
.rd-coin svg { width: 100%; height: auto; display: block; animation: rd-spin 6s ease-in-out infinite alternate; }
@keyframes rd-spin { from { transform: rotate(-10deg) translateY(0); } to { transform: rotate(10deg) translateY(-12px); } }
.rd-coin--1 { width: 84px; left: 14%; top: 60px; } .rd-coin--2 { width: 64px; right: 16%; top: 10px; } .rd-coin--2 svg { animation-delay: -2s; }
.rd-coin--3 { width: 56px; right: 10%; top: 300px; } .rd-coin--3 svg { animation-delay: -4s; } .rd-coin--4 { width: 48px; left: 22%; top: 360px; } .rd-coin--4 svg { animation-delay: -1s; }
.rd-js .rd-coin { opacity: 0; scale: .4; }
.is-ready .rd-coin { opacity: 1; scale: 1; transition: opacity .5s 1.4s, scale .8s cubic-bezier(.34,1.4,.64,1) 1.4s; }
.is-ready .rd-coin--2 { transition-delay: 1.55s; } .is-ready .rd-coin--3 { transition-delay: 1.7s; } .is-ready .rd-coin--4 { transition-delay: 1.85s; }
.rd-float { position: absolute; z-index: 4; display: flex; flex-direction: column; padding: 14px 18px; border-radius: 18px; background: #fff; color: var(--black); text-align: left; line-height: 1.3; box-shadow: 0 24px 50px -20px rgba(0,30,70,.5); }
.rd-float small { font-size: 11px; font-weight: 700; color: var(--ink-2); }
.rd-float b { font: 900 24px "Inter", "Noto Sans JP", sans-serif; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.rd-float--l b { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rd-float em { font-style: normal; font-size: 11px; color: var(--ink-2); }
.rd-float--l { left: 4%; top: 190px; } .rd-float--r { right: 4%; top: 150px; }
.rd-float--r b { font-size: 18px; }
.rd-js .rd-float { opacity: 0; translate: 0 20px; }
.is-ready .rd-float { opacity: 1; translate: 0 0; transition: opacity .8s var(--ease) 1.2s, translate .9s var(--ease) 1.2s; }

/* ---------- 2 費用と条件（白・巨大な黒い数字） ---------- */
.rd-facts { border-bottom: 1px solid var(--line); }
.rd-facts ul { list-style: none; margin: 0 auto; padding: 56px 0; width: min(1120px, 100% - 40px); display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; }
.rd-facts li + li { border-left: 1px solid var(--line); }
.rd-facts b { display: block; font: 900 clamp(36px, 5vw, 64px)/1 "Inter", "Noto Sans JP", sans-serif; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.rd-facts b small { font-size: .42em; margin-left: 2px; letter-spacing: 0; }
.rd-facts li > span { display: block; margin-top: 10px; font-size: 14px; font-weight: 700; color: var(--ink-2); }

/* ---------- 3 しくみ（黒の面・流れる図） ---------- */
.rd-how { padding: 140px 0; background: var(--black); color: #fff; }
.rd-flow { display: grid; grid-template-columns: 1fr 1.1fr 1fr 1.1fr 1fr; align-items: center; margin-top: 16px; }
.rd-flow__node { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 28px 12px; border-radius: 24px; background: #15181d; line-height: 1.4; }
.rd-flow__node b { font-size: 18px; } .rd-flow__node small { font-size: 13px; opacity: .6; }
.rd-flow__node--brand { background: #fff; color: var(--black); box-shadow: 0 0 80px -10px rgba(0,159,253,.55); }
.rd-flow__node--brand img { width: 140px; margin: 6px 0; }
.rd-flow__ic { width: 56px; height: 56px; border-radius: 16px; background: #22262d; position: relative; }
.rd-flow__ic--card::after { content: ""; position: absolute; inset: 17px 11px; border-radius: 4px; background: var(--grad); }
.rd-flow__ic--home::after { content: ""; position: absolute; inset: 14px 14px 12px; background: #fff; clip-path: polygon(50% 0, 100% 45%, 100% 100%, 0 100%, 0 45%); }
.rd-flow__line { position: relative; height: 3px; margin: 0 10px; border-radius: 2px; background: #2a2f37; overflow: visible; }
.rd-flow__line i { position: absolute; inset: 0; border-radius: 2px; background: var(--grad); transform: scaleX(0); transform-origin: left; transition: transform 1s var(--ease); }
.rd-flow__line i::after { content: ""; position: absolute; right: -5px; top: -5px; width: 13px; height: 13px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 18px var(--mint); opacity: 0; }
.rd-flow.is-in .rd-flow__line i { transform: scaleX(1); }
.rd-flow.is-in .rd-flow__line:nth-of-type(4) i { transition-delay: .6s; }
.rd-flow.is-in .rd-flow__line i::after { animation: rd-dot 2.4s var(--ease) 1.2s infinite; }
@keyframes rd-dot { 0% { opacity: 0; right: 100%; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; right: -5px; } }
.rd-flow__line em { position: absolute; left: 50%; top: -30px; transform: translateX(-50%); font-style: normal; font-size: 12px; font-weight: 700; opacity: .6; white-space: nowrap; }

/* ---------- 4 メリット（Acorns 式の試算） ---------- */
.rd-merit { padding: 140px 0; background: var(--bg-2); }
.rd-calc { width: min(720px, 100%); margin: 32px auto 48px; padding: 48px; border-radius: 32px; background: #fff; box-shadow: 0 30px 60px -40px rgba(0,0,0,.3); }
.rd-calc__label { display: block; font-size: 14px; font-weight: 800; color: var(--ink-2); }
.rd-calc__rent { display: block; margin: 4px 0 20px; font: 800 22px "Noto Sans JP", sans-serif; }
.rd-calc__rent b { font: 900 48px/1.1 "Inter", sans-serif; letter-spacing: -.03em; margin-right: 4px; font-variant-numeric: tabular-nums; }
.rd-calc input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 10px; border-radius: 5px; cursor: pointer; outline: none;
  background: linear-gradient(90deg, var(--black) 0 var(--p, 11%), #e3e7eb var(--p, 11%) 100%); }
.rd-calc input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 32px; height: 32px; border-radius: 50%; background: var(--blue); border: 5px solid #fff; box-shadow: 0 4px 14px rgba(0,0,0,.3); }
.rd-calc input[type=range]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: var(--blue); border: 5px solid #fff; }
.rd-calc input[type=range]:focus-visible { box-shadow: 0 0 0 4px rgba(0,159,253,.35); }
.rd-calc__scale { display: flex; justify-content: space-between; margin-top: 8px; font-size: 12px; color: #9aa3ab; }
.rd-calc__result { margin: 28px 0 0; font-weight: 800; font-size: 18px; line-height: 1.4; }
.rd-calc__result b { display: inline-block; margin: 4px 0; font: 900 clamp(48px, 7vw, 88px)/1.05 "Inter", "Noto Sans JP", sans-serif; letter-spacing: -.04em;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; }
.rd-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; width: min(880px, 100%); margin: 0 auto; }
.rd-card { padding: 36px 32px; border-radius: 28px; background: #fff; text-align: center; transition: transform .4s var(--ease), box-shadow .4s; }
.rd-card:hover { transform: translateY(-6px); box-shadow: 0 30px 60px -36px rgba(0,0,0,.35); }
.rd-card h3 { margin: 18px 0 8px; font-size: 22px; font-weight: 900; line-height: 1.4; }
.rd-card p { margin: 0; color: var(--ink-2); font-size: 15px; }
.rd-card__ic { display: inline-flex; justify-content: center; } .rd-card__ic svg { width: 52px; height: 52px; margin: 0 -6px; }
.rd-card__ic--bar { align-items: flex-end; gap: 6px; width: 72px; height: 56px; padding: 8px; border-radius: 16px; background: var(--black); }
.rd-card__ic--bar i { flex: 1; border-radius: 3px; background: var(--grad); }
.rd-card__ic--bar i:nth-child(1) { height: 30%; } .rd-card__ic--bar i:nth-child(2) { height: 52%; } .rd-card__ic--bar i:nth-child(3) { height: 74%; } .rd-card__ic--bar i:nth-child(4) { height: 100%; }

/* ---------- 5 料金（青の面・巨大な数字） ---------- */
.rd-fee { padding: 140px 0; background: var(--blue); color: #fff; }
.rd-fee__num { margin: 0; font: 900 clamp(140px, 26vw, 360px)/.9 "Inter", sans-serif; letter-spacing: -.07em; font-variant-numeric: tabular-nums; }
.rd-fee__num i { font-style: normal; font-size: .38em; letter-spacing: -.02em; }
.rd-fee__cap { margin: 20px 0 40px; font-size: 20px; font-weight: 800; }
.rd-fee__list { list-style: none; display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 0; padding: 0; }
.rd-fee__list li { display: flex; gap: 12px; align-items: baseline; padding: 12px 22px; border-radius: 999px; background: rgba(255,255,255,.16); font-weight: 700; }
.rd-fee__list b { font: 900 20px "Inter", "Noto Sans JP", sans-serif; }
.rd-fee__ex { margin: 32px 0 0; font-weight: 700; opacity: .9; }

/* ---------- 6 払えるもの ---------- */
.rd-pay { padding: 140px 0; }
.rd-pay__grid { list-style: none; margin: 40px 0 24px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.rd-pay__grid li { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 36px 16px; border-radius: 28px; background: var(--bg-2); line-height: 1.4; transition: transform .4s var(--ease), background .4s; }
.rd-pay__grid li:hover { transform: translateY(-6px); background: #e9f6ff; }
.rd-pay__grid b { font-size: 20px; font-weight: 900; } .rd-pay__grid small { font-size: 13px; color: var(--ink-2); }
.rd-pay__ic { width: 64px; height: 64px; border-radius: 20px; background: var(--black); position: relative; }
.rd-pay__ic::after { content: ""; position: absolute; inset: 18px; background: var(--grad); }
.rd-pay__ic--rent::after { clip-path: polygon(50% 0, 100% 45%, 100% 100%, 0 100%, 0 45%); }
.rd-pay__ic--fee::after { border-radius: 50%; }
.rd-pay__ic--key::after { clip-path: polygon(0 30%, 40% 30%, 40% 0, 100% 0, 100% 60%, 60% 60%, 60% 100%, 0 100%); }
.rd-pay__ic--renew::after { inset: 16px; border-radius: 50%; background: none; border: 6px solid var(--mint); border-right-color: transparent; }
.rd-cond { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.rd-cond li { padding: 24px; border: 2px solid var(--black); border-radius: 24px; line-height: 1.5; }
.rd-cond b { display: block; font-size: 19px; font-weight: 900; } .rd-cond span { font-size: 14px; color: var(--ink-2); }

/* ---------- 7 はじめ方 ---------- */
.rd-start { padding: 140px 0; background: #eaf6ff; }
.rd-steps { list-style: none; margin: 40px 0 32px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.rd-steps li { padding: 36px 28px; border-radius: 28px; background: #fff; line-height: 1.6; }
.rd-steps__n { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--black); color: #fff; font: 900 24px "Inter", sans-serif; }
.rd-steps h3 { margin: 18px 0 6px; font-size: 20px; font-weight: 900; } .rd-steps p { margin: 0; font-size: 15px; color: var(--ink-2); }
.rd-need { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 16px; padding: 20px 28px; border-radius: 999px; background: #fff; }
.rd-need__h { margin: 0; font-weight: 900; }
.rd-need ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; }
.rd-need li { padding: 6px 14px; border-radius: 999px; background: var(--bg-2); font-size: 14px; font-weight: 700; }

/* ---------- 8 法人（黒の面） ---------- */
.rd-biz { padding: 140px 0; background: var(--black); color: #fff; }
.rd-biz__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; text-align: left; }
.rd-biz .rd-lead { margin: 0; }
.rd-stmt { padding: 28px; border-radius: 28px; background: #fff; color: var(--black); font-size: 14px; }
.rd-stmt p { margin: 0; }
.rd-stmt__h { display: flex; justify-content: space-between; padding-bottom: 14px; border-bottom: 1px solid var(--line); font-weight: 800; } .rd-stmt__h em { font-style: normal; color: var(--ink-2); font-weight: 500; }
.rd-stmt__row { display: grid; grid-template-columns: 52px 1fr auto; gap: 10px; padding: 14px 10px; margin: 0 -10px; border-radius: 12px; color: var(--ink-2); }
.rd-stmt__row b { font: 700 15px "Inter", sans-serif; color: var(--black); font-variant-numeric: tabular-nums; }
.rd-stmt__row--hl { color: var(--black); font-weight: 800; }
.rd-stmt.is-in .rd-stmt__row--hl { animation: rd-hl 1.2s var(--ease) .6s forwards; }
@keyframes rd-hl { to { background: #e8f7ff; } }
.rd-note--in { position: static; margin-top: 10px !important; text-align: right; color: var(--ink-2); }

/* ---------- 9 FAQ（中央・角丸の一覧） ---------- */
.rd-faq { padding: 140px 0; }
.rd-faq__list { margin: 32px 0 28px; text-align: left; }
.rd-faq__list details { margin-bottom: 12px; border-radius: 20px; background: var(--bg-2); transition: background .3s; }
.rd-faq__list details[open] { background: #eaf6ff; }
.rd-faq__list summary { list-style: none; cursor: pointer; position: relative; padding: 22px 64px 22px 28px; font-size: 17px; font-weight: 800; line-height: 1.5; }
.rd-faq__list summary::-webkit-details-marker { display: none; }
.rd-faq__list summary::after { content: "+"; position: absolute; right: 24px; top: 50%; width: 32px; height: 32px; margin-top: -16px; border-radius: 50%; background: var(--black); color: #fff; font: 700 20px/32px "Inter", sans-serif; text-align: center; transition: transform .35s var(--ease); }
.rd-faq__list details[open] summary::after { transform: rotate(45deg); }
.rd-faq__list details > div { overflow: hidden; }
.rd-faq__list p { margin: 0; padding: 0 28px 24px; color: var(--ink-2); }
.rd-link { display: inline-flex; gap: 8px; font-weight: 900; } .rd-link span { transition: transform .3s var(--ease); } .rd-link:hover span { transform: translateX(6px); }

/* ---------- 10 CTA ---------- */
.rd-cta { padding: 100px 0 120px; background: var(--blue); color: #fff; overflow: hidden; }
.rd-cta__char { width: 200px; margin: 0 auto 8px; }
.rd-cta__char.is-in { animation: rd-hop 3.4s ease-in-out 1s infinite; }
@keyframes rd-hop { 0%, 70%, 100% { translate: 0 0; } 78% { translate: 0 -14px; } 86% { translate: 0 0; } }
.rd-cta__title { margin: 0 0 36px; font: 900 clamp(40px, 7.4vw, 104px)/1.05 "Noto Sans JP", sans-serif; letter-spacing: -.045em; }

/* ---------- フッター ---------- */
.rd-footer { padding: 72px 0 28px; background: var(--black); color: rgba(255,255,255,.7); }
.rd-footer__grid { display: grid; grid-template-columns: 1fr 1.6fr; gap: 40px; text-align: left; }
.rd-footer__logo { width: 136px; filter: brightness(0) invert(1); }
.rd-footer__grid p { margin: 12px 0 0; color: #fff; font-weight: 800; }
.rd-footer nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 28px; font-size: 14px; }
.rd-footer nav a:hover { color: #fff; }
.rd-footer__copy { margin: 48px 0 0; text-align: center; font-size: 12px; opacity: .6; }

/* ---------- スクロールで出る ---------- */
.rd-reveal { transition: opacity .9s var(--ease), transform .9s var(--ease); }
.rd-js .rd-reveal { opacity: 0; transform: translateY(32px); }
.rd-js .rd-reveal.is-in { opacity: 1; transform: none; }

/* ---------- スマホ ---------- */
@media (max-width: 960px) {
  .rd-nav { display: none; }
  .rd-burger { display: block; }
  .rd-header__in { height: 56px; gap: 10px; } .rd-header__cta { margin-left: auto; }
  .rd-hero { padding-top: 104px; }
  .rd-hero__lead { font-size: 17px; margin: 20px 0; }
  .rd-hero__perks li { font-size: 15px; }
  .rd-stores img { width: auto; height: 45px; }
  .rd-hero__stage { height: 470px; margin-top: 40px; }
  .rd-phone { transform: scale(.86) translateY(var(--lift, 0px)); transform-origin: top center; }
  .rd-float { padding: 10px 14px; } .rd-float b { font-size: 18px; } .rd-float--r b { font-size: 15px; }
  .rd-float--l { left: 2%; top: 300px; } .rd-float--r { right: 2%; top: 120px; }
  .rd-coin--1 { width: 56px; left: 4%; top: 30px; } .rd-coin--2 { width: 46px; right: 6%; top: 0; }
  .rd-coin--3 { width: 44px; right: 4%; top: 250px; } .rd-coin--4 { width: 38px; left: 8%; top: 210px; }
  .rd-facts ul { grid-template-columns: 1fr 1fr; padding: 32px 0; row-gap: 28px; }
  .rd-facts li:nth-child(3) { border-left: 0; }
  .rd-how, .rd-merit, .rd-fee, .rd-pay, .rd-start, .rd-biz, .rd-faq { padding: 88px 0; }
  .rd-lead { font-size: 16px; }
  .rd-flow { grid-template-columns: 1fr; gap: 0; }
  .rd-flow__line { width: 3px; height: 56px; margin: 0 auto; }
  .rd-flow__line i { transform: scaleY(0); transform-origin: top; }
  .rd-flow.is-in .rd-flow__line i { transform: scaleY(1); }
  .rd-flow__line i::after { display: none; }
  .rd-flow__line em { left: 16px; top: 50%; transform: translateY(-50%); }
  .rd-calc { padding: 28px 20px; border-radius: 24px; }
  .rd-calc__rent b { font-size: 38px; }
  .rd-cards { grid-template-columns: 1fr; gap: 12px; }
  .rd-pay__grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .rd-pay__grid li { padding: 24px 10px; border-radius: 22px; }
  .rd-cond { grid-template-columns: 1fr; gap: 10px; }
  .rd-steps { grid-template-columns: 1fr; gap: 10px; }
  .rd-need { border-radius: 24px; }
  .rd-biz__grid { grid-template-columns: 1fr; gap: 40px; }
  .rd-faq__list summary { font-size: 16px; padding: 18px 58px 18px 20px; }
  .rd-faq__list p { padding: 0 20px 20px; }
  .rd-cta__char { width: 150px; }
  .rd-footer__grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .rd-js .rd-w, .rd-js .rd-in, .rd-js .rd-phone, .rd-js .rd-coin, .rd-js .rd-float, .rd-js .rd-reveal { opacity: 1 !important; transform: none !important; translate: none !important; scale: 1 !important; filter: none !important; }
  .rd-flow__line i { transform: none !important; }
}

/* 福岡ソフトバンクホークス オフィシャルスポンサー（白地・ロゴの周りに十分な余白） */
.rd-hawks { background: #fff; border-bottom: 1px solid #e7ebef; }
.rd-hawks__in { display: flex; align-items: center; justify-content: center; gap: 40px; padding: 40px 0; text-align: left; }
.rd-hawks img { width: 220px; flex: none; }
.rd-hawks__t { margin: 0; font-size: 20px; font-weight: 800; line-height: 1.6; color: #0b1b2b; }
.rd-hawks__c { margin: 6px 0 0; font-size: 12px; color: #6b7680; }
@media (max-width: 960px) { .rd-hawks__in { flex-direction: column; gap: 16px; padding: 32px 0; text-align: center; } .rd-hawks img { width: 200px; } .rd-hawks__t { font-size: 17px; } }

.rd-app__h { margin: 18px 4px 4px; font-size: 12px; font-weight: 800; color: var(--ink-2); }
.rd-app__hist { display: flex; justify-content: space-between; padding: 10px 4px; border-bottom: 1px solid var(--line); font-size: 13px; }
.rd-app__hist b { font: 700 13px "Inter", sans-serif; }
.rd-hero__stage { margin-top: 72px; }
@media (max-width: 960px) { .rd-float--r { display: none; } .rd-float--l { top: auto; bottom: 40px; left: 4%; } }

.rd-facts__cards { font-size: clamp(18px, 2vw, 26px) !important; letter-spacing: 0 !important; line-height: 1.3 !important; padding-top: .6em; }
.rd-facts__cards i { font-style: normal; opacity: .4; }
.rd-hawks__chars { width: 230px !important; }

/* =========================================================
   2026-10-01 シリコンバレーのテック寄りに（Linear・Vercel・Stripe 系）
   濃い地・1pxの細い線・光・格子・等幅のラベル・グラデーションの文字
   ========================================================= */
:root { --bg0: #06080b; --bg1: #0b0e13; --bd: rgba(255,255,255,.09); --bd2: rgba(255,255,255,.16); --tx: #e9eef3; --tx2: #8b96a3; --mono: "JetBrains Mono", ui-monospace, monospace; }
body.rd { background: var(--bg0); color: var(--tx); }
.rd-h2 { font-weight: 800; letter-spacing: -.04em; color: #fff; }
.rd-lead, .rd-calc__label, .rd-small { color: var(--tx2); opacity: 1; }
.rd-kicker, .rd-kicker--blue, .rd-kicker--light { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--bd2); border-radius: 999px;
  font: 500 12px/1 var(--mono); letter-spacing: .04em; color: #9fd8ff; opacity: 1; background: rgba(0,159,253,.06); }
.rd-kicker::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 10px var(--mint); }
.rd-reveal { transition: opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); }
.rd-js .rd-reveal { filter: blur(6px); } .rd-js .rd-reveal.is-in { filter: none; }

/* ヘッダー */
.rd-header.is-solid { background: rgba(6,8,11,.72); box-shadow: 0 1px 0 var(--bd); }
.rd-header.is-solid .rd-logo img { filter: brightness(0) invert(1); }
.rd-header.is-solid .rd-nav { color: var(--tx); }
.rd-nav { color: var(--tx2); } .rd-nav > a:hover, .rd-dd > button:hover { color: #fff; }
.rd-header__cta, .rd-header.is-solid .rd-header__cta { background: #fff; color: #000; }
.rd-dd__menu { background: #10141a; color: var(--tx); border: 1px solid var(--bd); }
.rd-dd__menu a:hover { background: rgba(255,255,255,.06); }
.rd-header.is-solid .rd-burger { background: rgba(255,255,255,.08); } .rd-header.is-solid .rd-burger span { background: #fff; }
.is-menu .rd-header { background: var(--bg0); } .is-menu .rd-logo img { filter: brightness(0) invert(1); }
.is-menu .rd-burger { background: rgba(255,255,255,.08); } .is-menu .rd-burger span { background: #fff; }
.rd-drawer { background: var(--bg0); color: var(--tx); } .rd-drawer nav a { border-color: var(--bd); } .rd-drawer nav a.biz { border-color: var(--bd2); }

/* ヒーロー：濃い地＋格子＋光 */
.rd-hero { background: var(--bg0); }
.rd-hero__fx { position: absolute; inset: 0; pointer-events: none; }
.rd-grid { position: absolute; inset: 0; background-image: linear-gradient(var(--bd) 1px, transparent 1px), linear-gradient(90deg, var(--bd) 1px, transparent 1px); background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(70% 60% at 50% 30%, #000 0%, transparent 75%); mask-image: radial-gradient(70% 60% at 50% 30%, #000 0%, transparent 75%); }
.rd-glow { position: absolute; left: 50%; top: 52%; width: 1100px; height: 700px; margin-left: -550px; border-radius: 50%; filter: blur(90px); opacity: .55;
  background: radial-gradient(closest-side, rgba(0,159,253,.9), rgba(0,159,253,0)), radial-gradient(closest-side at 70% 60%, rgba(35,228,171,.7), rgba(35,228,171,0)); animation: rd-breathe 9s ease-in-out infinite alternate; }
@keyframes rd-breathe { to { transform: scale(1.12) translateY(-20px); opacity: .7; } }
.rd-hero__title { font-weight: 800; letter-spacing: -.055em; }
.rd-hero__title .rd-w:last-child { background: linear-gradient(100deg, #fff 0%, #9fdcff 45%, #23e4ab 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rd-hero__lead { color: var(--tx2); font-weight: 500; }
.rd-hero__perks li { background: rgba(255,255,255,.04); color: var(--tx); border: 1px solid var(--bd2); backdrop-filter: blur(8px); }
.rd-phone { box-shadow: 0 0 0 1px var(--bd2), 0 0 0 10px rgba(255,255,255,.02), 0 40px 120px -20px rgba(0,159,253,.55); }
.rd-float { background: rgba(16,20,26,.8); color: var(--tx); border: 1px solid var(--bd2); backdrop-filter: blur(12px); box-shadow: 0 24px 60px -20px rgba(0,0,0,.6); }
.rd-float small, .rd-float em { color: var(--tx2); }
.rd-note { color: var(--tx2); }

/* 費用と使えるカード */
.rd-facts { border-color: var(--bd); border-top: 1px solid var(--bd); background: var(--bg0); }
.rd-facts li + li { border-color: var(--bd); }
.rd-facts b { font-weight: 800; color: #fff; }
.rd-facts li > span { color: var(--tx2); font: 500 12px var(--mono); letter-spacing: .02em; }

/* ホークス：ロゴは白地のカードの上（球団のガイドライン） */
.rd-hawks { background: var(--bg0); border-color: var(--bd); }
.rd-hawks__in { width: fit-content; margin: 40px auto; padding: 28px 40px; border-radius: 20px; background: #fff; }

/* しくみ */
.rd-how { background: var(--bg1); border-top: 1px solid var(--bd); }
.rd-flow__node { background: rgba(255,255,255,.03); border: 1px solid var(--bd); }
.rd-flow__node--brand { background: #fff; border-color: transparent; }
.rd-flow__ic { background: rgba(255,255,255,.06); }
.rd-flow__line { background: var(--bd); }

/* メリット */
.rd-merit { background: var(--bg0); border-top: 1px solid var(--bd); }
.rd-calc { background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)); border: 1px solid var(--bd2); box-shadow: 0 40px 120px -60px rgba(0,159,253,.6); }
.rd-calc__rent { color: #fff; }
.rd-calc input[type=range] { background: linear-gradient(90deg, var(--blue) 0 var(--p, 11%), rgba(255,255,255,.1) var(--p, 11%) 100%); }
.rd-calc input[type=range]::-webkit-slider-thumb { background: #fff; border-color: var(--blue); }
.rd-calc__result { color: var(--tx); }
.rd-card { background: rgba(255,255,255,.03); border: 1px solid var(--bd); color: var(--tx); }
.rd-card:hover { border-color: var(--bd2); box-shadow: 0 30px 80px -40px rgba(0,159,253,.5); }
.rd-card p { color: var(--tx2); }
.rd-card__ic--bar { background: rgba(255,255,255,.06); }

/* 料金：単色の青をやめ、濃い地に光る大きな数字 */
.rd-fee { position: relative; overflow: hidden; background: var(--bg1); border-top: 1px solid var(--bd); }
.rd-fee::before { content: ""; position: absolute; left: 50%; top: 40%; width: 900px; height: 500px; margin: -250px 0 0 -450px; border-radius: 50%; filter: blur(100px); opacity: .35; background: radial-gradient(closest-side, #009ffd, transparent), radial-gradient(closest-side at 70% 50%, #23e4ab, transparent); }
.rd-fee .rd-wrap { position: relative; }
.rd-fee__num { font-weight: 800; background: linear-gradient(180deg, #fff 30%, rgba(255,255,255,.35)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rd-fee__cap { color: var(--tx); }
.rd-fee__list li { background: rgba(255,255,255,.04); border: 1px solid var(--bd2); }
.rd-fee__ex { color: var(--tx2); }

/* 払えるもの */
.rd-pay { background: var(--bg0); border-top: 1px solid var(--bd); }
.rd-pay__grid li { background: rgba(255,255,255,.03); border: 1px solid var(--bd); color: var(--tx); }
.rd-pay__grid li:hover { background: rgba(255,255,255,.05); border-color: var(--bd2); }
.rd-pay__grid small { color: var(--tx2); }
.rd-pay__ill { width: 120px; height: auto; filter: drop-shadow(0 18px 24px rgba(0,0,0,.5)); }
.rd-cond li { border: 1px solid var(--bd2); background: transparent; }
.rd-cond span { color: var(--tx2); }

/* はじめ方 */
.rd-start { background: var(--bg1); border-top: 1px solid var(--bd); }
.rd-steps li { background: rgba(255,255,255,.03); border: 1px solid var(--bd); }
.rd-steps__n { background: transparent; border: 1px solid var(--bd2); color: #9fd8ff; font: 500 18px var(--mono); }
.rd-steps p { color: var(--tx2); }
.rd-need { background: rgba(255,255,255,.03); border: 1px solid var(--bd); }
.rd-need li { background: rgba(255,255,255,.06); }

/* 法人 */
.rd-biz { background: var(--bg0); border-top: 1px solid var(--bd); }
.rd-stmt { box-shadow: 0 40px 120px -50px rgba(0,159,253,.55); }

/* FAQ */
.rd-faq { background: var(--bg1); border-top: 1px solid var(--bd); }
.rd-faq__list details { background: rgba(255,255,255,.03); border: 1px solid var(--bd); }
.rd-faq__list details[open] { background: rgba(0,159,253,.06); border-color: rgba(0,159,253,.3); }
.rd-faq__list summary::after { background: rgba(255,255,255,.08); }
.rd-faq__list p { color: var(--tx2); }
.rd-link { color: #9fd8ff; }

/* CTA */
.rd-cta { position: relative; background: var(--bg0); border-top: 1px solid var(--bd); }
.rd-cta::before { content: ""; position: absolute; left: 50%; bottom: -300px; width: 1200px; height: 600px; margin-left: -600px; border-radius: 50%; filter: blur(110px); opacity: .5; background: radial-gradient(closest-side, #009ffd, transparent), radial-gradient(closest-side at 60% 40%, #23e4ab, transparent); }
.rd-cta .rd-wrap { position: relative; }
.rd-cta__title { font-weight: 800; }

/* フッター */
.rd-footer { background: var(--bg0); border-top: 1px solid var(--bd); }
@media (prefers-reduced-motion: reduce) { .rd-glow { animation: none !important; } .rd-js .rd-reveal { filter: none !important; } }
@media (max-width: 960px) { .rd-hawks__in { width: auto; margin: 32px 20px; padding: 24px 20px; } }
/* ショーケース（D：濃い地） */
.rd-show { background: var(--bg1); color: var(--tx); border-top: 1px solid var(--bd); }
.rd-show .fx-show__step p { color: var(--tx2); opacity: 1; }
.rd-show .fx-show__phone { box-shadow: 0 0 0 1px var(--bd2), 0 50px 140px -30px rgba(0,159,253,.6); }
/* カードブランドのロゴ（D：数字の段にそろえる） */
.rd-facts .fx-brands { justify-content: center; padding-top: 6px; }
.rd-show { --fx-show-bg: var(--bg1); }

/* 2026-10-01 軽量化：大きな面のぼかしを外し、ぼかした形のグラデーションに。ヒーロー内のすりガラスは半透明の色に */
.rd-glow { filter: none; opacity: .5; background: radial-gradient(closest-side, rgba(0,159,253,.8), rgba(0,159,253,0)), radial-gradient(closest-side at 70% 60%, rgba(35,228,171,.6), rgba(35,228,171,0)); }
.rd-fee::before { filter: none; opacity: .3; }
.rd-cta::before { filter: none; opacity: .4; }
.rd-hero__perks li, .rd-float { backdrop-filter: none; -webkit-backdrop-filter: none; }
.rd-float { background: rgba(16,20,26,.94); }
.rd-js .rd-reveal { filter: none; } /* ぼかしてから出す演出は重いのでやめる（位置の動きだけ） */
.fx-off, .fx-off * { animation-play-state: paused !important; }
/* 2026-11-05 入居者様の登録ページ：ほかのページへ行けない枠（Base の bare） */
.rd-header--bare .rd-header__in { justify-content: center; }
.rd-header--bare .rd-logo { pointer-events: none; }
.rd-footer--bare { padding: 28px 20px 40px; text-align: center; font-size: 12px; color: #6f7b87; background: #f6f8fa; }
.rd-footer--bare a { color: #4f5b67; }
.rd-footer--bare p + p { margin-top: 6px; }