:root{color-scheme:light;--ink:#162843;--text:#25354a;--muted:#536276;--paper:#f8f7f3;--white:#fff;--line:#dbe0e7;--blue:#b0000e;--gold:#fff5f5;--serif:"Noto Serif CJK JP","Hiragino Mincho ProN","Yu Mincho",serif;--sans:Inter,"Noto Sans CJK JP","Hiragino Sans","Yu Gothic",Meiryo,sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;color:var(--text);background:var(--paper);font:1rem/1.75 var(--sans);overflow-wrap:break-word}
a{color:inherit;text-underline-offset:.2em}
a:focus-visible,summary:focus-visible{outline:3px solid #e70012;outline-offset:4px}
h1,h2,h3,p{margin:0}
section[id],article[id]{scroll-margin-top:1.25rem}
.shell{width:min(1120px,calc(100% - 3rem));margin-inline:auto}
.skip{position:absolute;z-index:5;left:1rem;top:1rem;transform:translateY(-200%);padding:.65rem 1rem;background:white}
.skip:focus{transform:none}
.reservation-bar{display:grid;grid-template-columns:24% repeat(2,minmax(0,1fr));min-height:clamp(62px,9.9vw,96px);background:#fff}
.reservation-bar a{display:flex;align-items:center;justify-content:center;text-decoration:none;text-align:center}
.reservation-bar__brand img{display:block;width:auto;height:clamp(34px,6vw,66px)}
.reservation-bar__item{flex-direction:column;gap:.15rem;padding:.45rem .2rem;color:#fff;line-height:1.35;font-size:clamp(.69rem,1.58vw,1rem);font-weight:750}
.reservation-bar__item small{font-size:clamp(.63rem,1.3vw,.83rem);font-weight:500}
.reservation-bar__tel{background:linear-gradient(100deg,#e70012,#be0010)}
.reservation-bar__web{background:linear-gradient(100deg,#087f80,#066d70)}
.reservation-bar__item:hover{filter:brightness(.91)}
.reservation-bar a:focus-visible{outline-offset:-4px;outline-color:#263547}
.hero-photo{display:block;width:100%;aspect-ratio:2.66;object-fit:cover;object-position:center 52%;background:#f6d9dc}
.hero{background:#e70012;color:#fff}
.hero-copy{padding-block:clamp(1.55rem,4.4vw,3rem) clamp(2rem,6vw,4rem)}
.crumb{display:flex;gap:.5rem;align-items:center;list-style:none;padding:0;margin:0 0 clamp(1.15rem,3vw,2rem);font-size:.8rem;color:#ffffff}
.hero-eyebrow{margin-bottom:.55rem;color:#ffffff;font-size:.81rem;font-weight:800;letter-spacing:.12em}
.hero h1{font:800 clamp(1.72rem,4.25vw,3.4rem)/1.43 var(--sans);letter-spacing:.015em}
.hero-description{max-width:52rem;margin-top:.85rem;color:#ffffff;font-size:clamp(.91rem,1.8vw,1.06rem)}
.actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.15rem}
.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.65rem 1.2rem;border:1px solid transparent;border-radius:7px;text-decoration:none;font-weight:800;font-size:.93rem}
.button:hover{filter:brightness(.95)}
.hero .primary{background:#fff5f5;color:#93000a}
.hero .secondary{color:#fff;border-color:#ffffff}
.hero a:focus-visible{outline-color:#fff}
.section{padding-top:clamp(2.7rem,6vw,4.7rem)}
.section h2,.consult h2{font:800 clamp(1.65rem,4vw,2.4rem)/1.35 var(--serif);color:var(--ink)}
.intro{margin-top:.55rem;color:var(--muted);max-width:48rem}
.grade-list{list-style:none;margin:1.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}
.grade-card{--stripe:#e70012;position:relative;display:flex;flex-direction:column;gap:.4rem;height:100%;min-height:151px;padding:1rem 1.1rem .9rem;border:1px solid var(--line);border-top:4px solid var(--stripe);border-radius:12px;background:white;text-decoration:none;transition:box-shadow .18s,transform .18s}
.grade-card:hover{box-shadow:0 6px 22px #1628431a;transform:translateY(-2px)}
.grade-card.mid{--stripe:#e70012}
.grade-card.high{--stripe:#e70012}
.grade-card.advanced{--stripe:#e70012}
.grade-title{font:800 clamp(1.38rem,2.7vw,1.9rem)/1.26 var(--serif);color:var(--ink)}
.grade-level{font-size:.86rem;color:var(--muted)}
.grade-action{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:.3rem;color:var(--blue);font-size:.85rem;font-weight:750}
.grade-detail{display:none;background:white;border:1px solid #e5a8ad;border-left:5px solid var(--blue);border-radius:12px;padding:clamp(1rem,3vw,1.7rem);margin-top:1rem}
.grade-detail:target{display:block}
.grade-detail h3{font:800 1.5rem/1.3 var(--serif);color:var(--ink)}
.grade-detail ul{margin:.65rem 0 .9rem;padding-left:1.35rem}
.grade-detail p{font-size:.9rem;color:var(--muted)}
.grade-detail a,.ref a,.related a{color:var(--blue);font-weight:700}
.ref{margin-top:1rem;color:var(--muted);font-size:.84rem}
.learning-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem;margin-top:1.35rem}
.learning-grid article{border-top:2px solid var(--ink);background:#fff;padding:1.2rem}
.learning-grid h3{font-size:1.08rem;color:var(--ink)}
.learning-grid p{margin-top:.45rem;color:var(--muted);font-size:.92rem}
.related{margin-top:1.05rem;font-size:.9rem}
.faq{border-top:1px solid var(--line);margin-top:1.2rem}
.faq details{border-bottom:1px solid var(--line);padding:.85rem 0}
.faq summary{cursor:pointer;font-weight:750;color:var(--ink)}
.faq p{padding:.6rem 0 .15rem 1.15rem;color:var(--muted)}
.consult{margin-top:clamp(2.7rem,6vw,4.7rem);border-radius:16px;padding:clamp(1.5rem,4vw,2.6rem);background:#fff0f0;display:flex;justify-content:space-between;align-items:center;gap:1.5rem}
.consult p{margin-top:.65rem;max-width:38rem}
.consult .button{background:var(--ink);color:white;white-space:nowrap}
.foot{margin-top:3rem;padding:1.4rem 0;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.foot-inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.55rem 1rem}
@media(max-width:820px){.grade-list{grid-template-columns:repeat(2,minmax(0,1fr))}.learning-grid{grid-template-columns:1fr}.consult{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.shell{width:calc(100% - 1.5rem)}.hero .button{font-size:.81rem}.grade-list{gap:.55rem}.grade-card{min-height:128px;padding:.7rem .65rem}.grade-action{font-size:.78rem}.grade-level{font-size:.79rem}.button{padding-inline:.8rem}.consult .button{white-space:normal}}
@media(prefers-reduced-motion:reduce){.grade-card{transition:none}.grade-card:hover{transform:none}}

.grade-page .hero-photo{height:clamp(125px,22vw,300px);aspect-ratio:auto}
.grade-page .hero-copy{padding-block:clamp(1.3rem,3.2vw,2.3rem) clamp(1.65rem,4.4vw,3rem)}
.grade-page .hero .crumb{margin-bottom:.85rem;flex-wrap:wrap}
.grade-page .grade-overview{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:.85rem;margin-top:1.15rem}
.grade-page .exam-block,.grade-page .exercise{padding:clamp(1rem,3vw,1.45rem);background:#fff;border:1px solid var(--line);border-radius:12px}
.grade-page .exam-block h3,.grade-page .exercise h3{color:var(--ink);font-size:1.08rem}
.grade-page .exam-block dl{margin:.55rem 0 0}
.grade-page .exam-block dt{font-weight:750;margin-top:.6rem}
.grade-page .exam-block dd{margin:0;color:var(--muted)}
.grade-page .practice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin-top:1.15rem}
.grade-page .exercise p{margin-top:.5rem}
.grade-page .prompt,.grade-page .model{padding:.75rem .9rem;background:#f3f6fa;border-left:3px solid #e70012;color:#24364c;white-space:pre-line}
.grade-page .exercise details{margin-top:.85rem;border-top:1px solid var(--line);padding-top:.75rem}
.grade-page .exercise summary{cursor:pointer;color:var(--blue);font-weight:750;min-height:32px}
.grade-page .grade-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.65rem;margin-top:2rem}
.grade-page .grade-nav a{display:inline-flex;align-items:center;min-height:44px;padding:.45rem .8rem;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--blue);text-decoration:none;font-weight:700}
.grade-page .grade-nav a:hover{background:#fff0f0}
@media(max-width:650px){.grade-page .grade-overview,.grade-page .practice-grid{grid-template-columns:1fr}}