.arc-page { padding-top:80px; color:#334155; }
.arc-breadcrumb { display:flex; flex-wrap:wrap; gap:12px; padding-top:22px; padding-bottom:22px; font-size:12px; color:#64748b; }
.arc-hero { background:linear-gradient(115deg,#0f172a,#24354a); color:white; overflow:hidden; }
.arc-hero-grid { display:grid; grid-template-columns:minmax(0,3fr) minmax(180px,1fr); align-items:center; gap:40px; padding-top:74px; padding-bottom:74px; }
.arc-eyebrow { color:#957327; font-size:11px; font-weight:600; letter-spacing:.16em; margin-bottom:14px; }
.arc-hero .arc-eyebrow { color:#e0c78d; }
.arc-hero h1 { font-family:Inter,'Noto Sans JP',sans-serif; font-size:clamp(34px,4.4vw,62px); line-height:1.12; font-weight:600; overflow-wrap:break-word; letter-spacing:-.02em; }
.arc-subtitle { color:#e0c78d; font-size:19px; margin-top:16px; }
.arc-tagline { font-size:clamp(18px,2vw,25px); margin:30px 0; }
.arc-button { display:inline-flex; align-items:center; gap:28px; padding:15px 26px; border-radius:4px; background:#d8bb77; color:#182232; font-size:14px; font-weight:600; }
.arc-button:hover { background:#ecd39b; color:#182232; }
.arc-hero-aside { text-align:center; color:#d8bb77; font-size:11px; letter-spacing:.18em; }
.arc-hero-aside>span { display:block; font-size:20px; }
.arc-orbit { width:190px; height:190px; max-width:100%; margin:26px auto; border:1px solid #d8bb7766; border-radius:50%; position:relative; }
.arc-orbit:before,.arc-orbit:after { content:''; position:absolute; border:1px solid #d8bb7755; border-radius:50%; }
.arc-orbit:before { inset:20px -15px; transform:rotate(-40deg); }
.arc-orbit:after { inset:-15px 36px; transform:rotate(-40deg); }
.arc-section { padding-top:76px; padding-bottom:76px; }
.arc-section h2,.arc-related h2 { color:#142235; font-size:clamp(23px,2.5vw,32px); line-height:1.5; margin-bottom:25px; }
.arc-intro { max-width:940px; }
.arc-intro>p:last-child { font-size:16px; line-height:2.05; }
.arc-soft { background:#f7f8fa; }
.arc-card-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.arc-card { padding:32px; background:#fff; border:1px solid #e4e7ec; border-radius:8px; }
.arc-card-number { color:#98762c; font:500 13px/1.5 Inter,sans-serif; }
.arc-card h3 { color:#17283c; font-size:20px; margin:12px 0 16px; line-height:1.5; }
.arc-card p,.arc-feature>p { font-size:15px; line-height:1.95; }
.arc-feature { display:grid; grid-template-columns:1fr 1.3fr; gap:60px; border-left:3px solid #c5a35a; padding-left:36px; }
.arc-needs { display:grid; grid-template-columns:1fr 1.3fr; gap:40px; }
.arc-needs li { padding:16px 0 16px 24px; border-bottom:1px solid #dce1e8; position:relative; line-height:1.8; font-size:15px; }
.arc-needs li:before { content:'✓'; color:#957327; position:absolute; left:0; }
.arc-cta { text-align:center; border:1px solid #e4ddcd; background:#fcfaf5; padding:44px 24px; border-radius:8px; }
.arc-cta p { line-height:1.9; }
.arc-cta .arc-button { margin-top:26px; }
.arc-source { font-size:11px; line-height:1.9; color:#64748b; margin-top:26px; }
.arc-source p+p { margin-top:6px; }
.arc-related { padding-bottom:76px; }
.arc-related>div { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.arc-related a { padding:20px; border:1px solid #e4e7ec; border-radius:6px; }
.arc-related span,.arc-related small { display:block; }
.arc-related span { font-size:15px; color:#142235; font-weight:600; }
.arc-related small { margin-top:6px; color:#64748b; }
.arc-related a:hover,.arc-related a[aria-current] { background:#faf6ed; border-color:#c5a35a; }
.arc-page a:focus-visible { outline:2px solid #957327; outline-offset:3px; }
@media(max-width:1000px){.arc-page{padding-top:72px;}}
@media(max-width:700px){
.arc-hero-grid { grid-template-columns:1fr; padding-top:48px; padding-bottom:48px; }
.arc-hero-aside { display:none; }
.arc-section { padding-top:48px; padding-bottom:48px; }
.arc-card-grid,.arc-feature,.arc-needs { grid-template-columns:1fr; gap:22px; }
.arc-card { padding:24px; }
.arc-feature { padding-left:20px; }
.arc-related>div { grid-template-columns:1fr 1fr; }
.arc-related a { padding:14px; }
.arc-related span { overflow-wrap:anywhere; font-size:14px; }
}
@media(max-width:380px){.arc-related>div{grid-template-columns:1fr;}}