:root { --navy:#12283f; --navy2:#0b1c2e; --red:#d94045; --pale:#f5f7fa; --line:#dde4ea; --ink:#243547; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#fff; color:var(--ink); font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.site-header { height:82px; padding:0 max(24px, calc((100% - 1120px)/2)); display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1px solid #edf0f3; }
.brand { display:flex; align-items:center; }
.brand-logo { display:block; width:min(360px,40vw); height:58px; object-fit:contain; object-position:left center; }
.header-cta { background:var(--red); color:#fff; padding:13px 23px; border-radius:4px; font-weight:700; font-size:14px; }
.hero { position:relative; overflow:hidden; color:#fff; text-align:center; background:linear-gradient(120deg,var(--navy2),#193f60); }
.hero::before,.hero::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(255,255,255,.12); }
.hero::before { width:560px; height:560px; left:-260px; top:-330px; }
.hero::after { width:420px; height:420px; right:-160px; bottom:-280px; }
.hero-inner { position:relative; z-index:1; max-width:860px; margin:auto; padding:76px 24px 70px; }
.eyebrow { margin:0 0 16px; color:#f1a6a8; font-size:12px; font-weight:800; letter-spacing:.28em; }
.hero h1 { margin:0; font-size:clamp(38px,6vw,62px); letter-spacing:.12em; font-weight:800; }
.hero h1::after { content:""; display:block; width:48px; height:3px; margin:23px auto; background:var(--red); }
.hero-inner>p:not(.eyebrow) { margin:0; font-size:17px; line-height:1.9; }
.free-badge { width:max-content; max-width:100%; margin:28px auto 0; display:flex; align-items:center; gap:14px; background:#fff; color:var(--navy); padding:9px 18px 9px 10px; border-radius:999px; font-size:13px; }
.free-badge strong { background:var(--red); color:#fff; padding:7px 13px; border-radius:999px; font-size:16px; letter-spacing:.08em; }
.faq-wrap { max-width:1040px; margin:auto; padding:52px 24px 100px; }
.category-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-bottom:28px; }
.category-nav button { border:1px solid #cfd8e1; background:#fff; color:#536577; border-radius:999px; padding:10px 17px; cursor:pointer; font-size:13px; font-weight:700; transition:.2s; }
.category-nav button:hover,.category-nav button.active { background:var(--navy); border-color:var(--navy); color:#fff; }
.notice { margin:0 auto 68px; max-width:800px; padding:15px 22px; border-left:4px solid var(--red); background:#fff6f6; color:#5c4547; font-size:14px; line-height:1.75; }
.faq-section { margin:0 0 72px; scroll-margin-top:20px; }
.section-title { display:flex; align-items:center; gap:18px; margin-bottom:23px; }
.section-title span { color:var(--red); font-family:Georgia,serif; font-size:15px; font-weight:700; letter-spacing:.15em; }
.section-title h2 { margin:0; color:var(--navy); font-size:clamp(24px,4vw,31px); letter-spacing:.05em; }
.section-title::after { content:""; height:1px; flex:1; background:var(--line); }
.faq-list { border-top:1px solid var(--line); }
.faq-item { border-bottom:1px solid var(--line); }
.faq-item summary { list-style:none; display:flex; align-items:center; gap:17px; min-height:78px; padding:17px 20px 17px 10px; cursor:pointer; color:var(--navy); font-weight:700; }
.faq-item summary::-webkit-details-marker { display:none; }
.q,.a { flex:0 0 38px; width:38px; height:38px; border-radius:50%; display:grid; place-items:center; font-family:Georgia,serif; font-size:19px; font-weight:700; }
.q { background:var(--navy); color:#fff; }
.a { background:var(--red); color:#fff; }
.question { flex:1; font-size:16px; line-height:1.65; }
.plus { position:relative; flex:0 0 20px; width:20px; height:20px; }
.plus::before,.plus::after { content:""; position:absolute; left:50%; top:50%; width:16px; height:2px; background:var(--red); transform:translate(-50%,-50%); }
.plus::after { transform:translate(-50%,-50%) rotate(90deg); transition:.2s; }
.faq-item[open] .plus::after { transform:translate(-50%,-50%) rotate(0); }
.answer { display:flex; gap:17px; padding:4px 54px 25px 10px; }
.answer p { margin:4px 0 0; color:#526274; font-size:15px; line-height:1.95; }
.cta { margin-top:95px; text-align:center; padding:57px 30px; color:#fff; background:linear-gradient(135deg,var(--navy2),#193d5a); border-radius:8px; box-shadow:0 16px 45px rgba(16,37,57,.18); }
.cta-kicker { color:#f3a3a6; font-weight:700; font-size:13px; letter-spacing:.08em; }
.cta h2 { margin:10px 0 13px; font-size:clamp(25px,4vw,35px); }
.cta>p:not(.cta-kicker) { margin:0 0 27px; color:#dbe5ed; line-height:1.8; font-size:14px; }
.cta a { display:inline-flex; align-items:center; gap:30px; background:var(--red); padding:16px 27px; border-radius:4px; font-weight:800; }
.cta a:hover,.header-cta:hover { background:#bd3035; }
.restart-site-footer { padding:30px 24px; text-align:center; color:#aeb9c3; background:#091724; font-size:12px; }
.restart-site-footer a { color:#fff; font-weight:700; }
.restart-site-footer p { margin:10px 0 0; }
@media(max-width:640px){
  .site-header { height:68px; padding:0 15px; }
  .brand-logo { width:min(230px,57vw); height:46px; }
  .header-cta { padding:10px 12px; font-size:11px; }
  .hero-inner { padding:56px 18px 52px; }
  .hero-inner>p:not(.eyebrow) { font-size:14px; }
  .free-badge { gap:8px; padding-right:12px; font-size:11px; }
  .free-badge strong { font-size:13px; }
  .faq-wrap { padding:37px 15px 70px; }
  .category-nav { justify-content:flex-start; flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; }
  .category-nav button { flex:0 0 auto; padding:9px 14px; }
  .notice { margin-bottom:49px; padding:13px 16px; }
  .faq-section { margin-bottom:55px; }
  .section-title { gap:10px; }.section-title span { font-size:11px; }.section-title h2 { font-size:22px; }
  .faq-item summary { min-height:72px; gap:11px; padding:15px 5px; }
  .q,.a { flex-basis:32px; width:32px; height:32px; font-size:16px; }
  .question { font-size:14px; }.plus { flex-basis:18px; }
  .answer { gap:11px; padding:2px 4px 22px 5px; }.answer p { font-size:14px; line-height:1.85; }
  .cta { margin-top:62px; padding:42px 18px; }.cta h2 { font-size:24px; }.cta a { width:100%; justify-content:center; }
}


/* Full-package additions */
.skip-link {
  position: fixed;
  z-index: 999;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  color: #fff;
  background: var(--navy);
  border-radius: 4px;
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }
[data-category-section][hidden] { display: none !important; }
.category-nav button:focus-visible,
.faq-item summary:focus-visible,
.header-cta:focus-visible,
.cta a:focus-visible,
.restart-site-footer a:focus-visible {
  outline: 3px solid #f1a6a8;
  outline-offset: 3px;
}
@media print {
  .site-header,
  .category-nav,
  .notice,
  .cta,
  .restart-site-footer { display: none !important; }
  .hero { color: var(--navy); background: #fff; }
  .hero::before,
  .hero::after,
  .free-badge { display: none; }
  .hero-inner { padding: 20px 0; }
  .eyebrow { color: var(--red); }
  .faq-wrap { max-width: none; padding: 0; }
  .faq-section { margin-bottom: 28px; break-inside: avoid; }
  .faq-item { break-inside: avoid; }
  .faq-item .answer { display: flex; }
}