:root{
  color-scheme:light;
  --bg:#F5F6F4;
  --panel:#ECEEEA;
  --white:#FFFFFF;
  --ink:#2D3237;
  --sub:#585F63;
  --hair:#D9DDD7;
  --sage:#75847A;
  --line-green:#06C755;
  --script:"Sacramento",cursive;
  --sans:"Zen Kaku Gothic New",sans-serif;
  --serif:"Shippori Mincho",serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}
body{
  font-family:var(--sans);
  font-weight:400;
  color:var(--ink);
  background:var(--bg);
  line-height:2.05;
  font-size:15px;
  letter-spacing:.05em;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--ink)}
.wrap{max-width:680px;margin:0 auto;padding:0 24px}
.wrap-wide{max-width:920px;margin:0 auto;padding:0 24px}

h1,h2,h3{text-wrap:balance;word-break:auto-phrase;line-break:strict}
p,li{text-wrap:pretty;word-break:auto-phrase;line-break:strict}
.w{display:inline-block}

.label{
  display:block;text-align:center;margin-bottom:10px;
  font-size:11px;letter-spacing:.34em;text-indent:.34em;color:var(--sage);font-weight:500;
}
h2.h{
  text-align:center;font-weight:500;font-size:clamp(18px,2.6vw,20px);
  letter-spacing:.16em;line-height:2;margin-bottom:44px;
}

header{
  position:sticky;top:0;z-index:50;
  background:rgba(245,246,244,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--hair);
}
.header-in{
  max-width:1000px;margin:0 auto;padding:14px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.brand{text-decoration:none}
.brand-jp{font-weight:500;font-size:14.5px;letter-spacing:.18em;white-space:nowrap}
.btn-s{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--ink);color:var(--bg);text-decoration:none;
  font-size:12.5px;letter-spacing:.12em;font-weight:500;
  padding:9px 18px;border-radius:999px;white-space:nowrap;
}
.btn-s:hover{opacity:.85}
.line-dot{width:8px;height:8px;border-radius:50%;background:var(--line-green);flex:0 0 auto}

.hero{padding:100px 0 110px;text-align:center;background:var(--bg)}
.hero .script{
  font-family:var(--script);display:block;line-height:1;
  font-size:clamp(34px,5.5vw,46px);color:var(--sage);margin-bottom:22px;
}
.hero .school{
  font-weight:500;font-size:clamp(20px,4.4vw,27px);letter-spacing:.26em;text-indent:.26em;
  white-space:nowrap;
}
.hero-rule{width:32px;height:1px;background:var(--sage);margin:40px auto}
.hero h1{
  font-weight:500;font-size:clamp(17px,3vw,22px);letter-spacing:.14em;line-height:2.2;
  margin-bottom:26px;
}
.hero p{color:var(--sub);max-width:28em;margin:0 auto;text-align:left}
.hero p + p{margin-top:1em}
.hero-cta{margin-top:48px}
.btn{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--ink);color:var(--bg);text-decoration:none;
  font-size:14px;letter-spacing:.14em;font-weight:500;
  padding:16px 36px;border-radius:999px;
  transition:transform .2s ease,opacity .2s ease;
}
.btn:hover{transform:translateY(-2px);opacity:.9}
.hero-note{margin-top:16px;font-size:12px;color:var(--sub);letter-spacing:.06em}

section{padding:96px 0;background:var(--bg)}
.alt{background:var(--panel);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}

.venue-fig{max-width:680px;margin:0 auto 34px}
.venue-fig .frame{
  aspect-ratio:3/2;border:1px solid var(--hair);border-radius:2px;overflow:hidden;
  background:var(--panel);display:flex;align-items:center;justify-content:center;
}
.venue-fig img{width:100%;height:100%;object-fit:cover;display:block}
.venue-fig .ph-note{color:var(--sub);font-size:12.5px;letter-spacing:.08em;text-align:center;line-height:2;padding:0 20px}
.venue-copy{max-width:28em;margin:0 auto;color:var(--sub);text-align:left}
.venue-foot{
  max-width:28em;margin:22px auto 0;color:var(--sub);font-size:12px;letter-spacing:.05em;
  text-align:left;line-height:2.1;padding-left:1.2em;text-indent:-1.2em;
}

.scene-list{list-style:none;max-width:540px;margin:0 auto;background:var(--white);border:1px solid var(--hair);border-radius:2px;padding:6px 30px}
.scene-list li{
  padding:19px 0;text-align:center;font-size:14.5px;letter-spacing:.06em;line-height:2;
  border-bottom:1px solid var(--hair);
}
.scene-list li:last-child{border-bottom:none}
.scenes-close{margin:42px auto 0;max-width:28em;color:var(--sub);text-align:left}
.scenes-close b{color:var(--ink);font-weight:500}

.kofu{max-width:580px;margin:0 auto}
.kofu-item{padding:32px 0;border-bottom:1px solid var(--hair)}
.kofu-item:first-child{border-top:1px solid var(--hair)}
.kofu-item h3{
  font-weight:500;font-size:16px;letter-spacing:.12em;margin-bottom:12px;text-align:center;
}
.kofu-item p{color:var(--sub);text-align:left}

.tt{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:920px;margin:0 auto}
.tt-item{
  background:var(--white);border:1px solid var(--hair);border-radius:2px;
  padding:28px 28px 30px;
}
.tt-item .period{
  font-family:var(--serif);font-size:13px;color:var(--sage);letter-spacing:.2em;display:block;margin-bottom:12px;
}
.tt-item h3{font-weight:500;font-size:15.5px;letter-spacing:.08em;line-height:2;margin-bottom:10px}
.tt-item h3 .sub{display:block;font-size:13.5px;color:var(--sage);font-weight:500;letter-spacing:.06em}
.tt-item p{color:var(--sub);font-size:13.5px;line-height:2.1}
@media (max-width:680px){.tt{grid-template-columns:1fr}}

.consultation-section{padding:64px 0;border-bottom:1px solid var(--hair)}
.consultation-box{max-width:580px;margin:0 auto;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:30px 0}
.consultation-box h2{font-weight:500;font-size:16px;letter-spacing:.12em;line-height:2;text-align:center;margin-bottom:16px}
.consultation-box p{color:var(--sub);font-size:14px;margin-top:1em}
.consultation-box p:first-of-type{margin-top:0}
.consultation-price{text-align:center;color:var(--ink)!important;font-family:var(--serif);font-size:16px!important;font-weight:500;letter-spacing:.08em;margin:20px 0!important}

.sensei-photo{max-width:220px;margin:0 auto 34px}
.sensei-photo .frame{
  aspect-ratio:4/5;border:1px solid var(--hair);border-radius:2px;overflow:hidden;
  background:var(--panel);display:flex;align-items:center;justify-content:center;
}
.sensei-photo img{width:100%;height:100%;object-fit:cover;display:block}
.sensei-photo .ph-note{
  color:var(--sub);font-size:12px;letter-spacing:.08em;text-align:center;
  line-height:2;padding:0 18px;
}

.sensei-name{
  text-align:center;font-family:var(--serif);font-weight:500;
  font-size:clamp(30px,5vw,36px);letter-spacing:.3em;text-indent:.3em;margin-bottom:14px;
}
.sensei-title{
  text-align:center;font-size:12.5px;letter-spacing:.14em;color:var(--sub);line-height:2.1;
  margin-bottom:54px;
}
.profile-brief{
  max-width:580px;margin:0 auto;font-family:var(--serif);font-size:15px;
  line-height:2.35;letter-spacing:.05em;
}
.profile-brief p{margin-bottom:1.6em;text-align:justify}
.profile-brief p:last-child{margin-bottom:0}
.profile-details{max-width:580px;margin:36px auto 0}
.profile-details summary{
  list-style:none;cursor:pointer;text-align:center;color:var(--sage);
  font-size:13px;font-weight:500;letter-spacing:.1em;padding:12px 0;
  border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);
}
.profile-details summary::-webkit-details-marker{display:none}
.profile-details summary::after{content:" ＋"}
.profile-details[open] summary::after{content:" −"}
.profile-details .close-label{display:none}
.profile-details[open] .open-label{display:none}
.profile-details[open] .close-label{display:inline}
.profile-details .essay{margin-top:42px}
.essay{max-width:580px;margin:0 auto;font-family:var(--serif);font-size:15px;line-height:2.35;letter-spacing:.05em}
.essay p{margin-bottom:1.6em;text-align:justify}
.essay p:last-child{margin-bottom:0}

.menu{max-width:580px;margin:0 auto;background:var(--white);border:1px solid var(--hair);border-radius:2px;padding:8px 30px}
.menu-item-block{padding:21px 0;border-bottom:1px solid var(--hair)}
.menu-item-block:last-child{border-bottom:none}
.menu-item{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.menu-item .nm{font-weight:500;font-size:15px;letter-spacing:.1em;white-space:nowrap}
.menu-item .dots{flex:1;border-bottom:1px dotted #C4C9C2;transform:translateY(-6px)}
.menu-item .tm{font-family:var(--serif);font-size:14px;color:var(--sub);white-space:nowrap}
.menu-desc{color:var(--sub);font-size:13.5px;margin-top:5px;letter-spacing:.05em}
.menu-note{margin-top:34px;text-align:center;color:var(--sub);font-size:13.5px;line-height:2.2}

.steps{max-width:920px;margin:0 auto;counter-reset:st;list-style:none;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.steps li{
  counter-increment:st;text-align:center;
  background:var(--white);border:1px solid var(--hair);border-radius:2px;padding:32px 24px;
}
.steps li::before{
  content:counter(st);display:block;margin:0 auto 14px;
  width:34px;height:34px;border:1px solid var(--sage);color:var(--sage);border-radius:50%;
  font-family:var(--serif);font-size:14px;line-height:33px;
}
.steps h3{font-weight:500;font-size:15px;letter-spacing:.1em;margin-bottom:8px}
.steps p{color:var(--sub);font-size:13.5px;text-align:left}
@media (max-width:680px){.steps{grid-template-columns:1fr}}

.qa{max-width:580px;margin:0 auto}
.qa-item{padding:26px 0;border-bottom:1px solid var(--hair)}
.qa-item:first-child{border-top:1px solid var(--hair)}
.qa-item h3{font-weight:500;font-size:15px;letter-spacing:.08em;margin-bottom:10px}
.qa-item h3::before{content:"Q. ";font-family:var(--serif);color:var(--sage)}
.qa-item p{color:var(--sub);font-size:14px}

.final{padding:116px 0;text-align:center;background:var(--bg)}
.final h2{font-weight:500;font-size:clamp(18px,3vw,21px);letter-spacing:.16em;line-height:2.3;margin-bottom:22px}
.final p{color:var(--sub);max-width:28em;margin:0 auto 42px;text-align:left}
.final small{display:block;margin-top:18px;font-size:12px;color:var(--sub);letter-spacing:.06em;line-height:2.2}

footer{border-top:1px solid var(--hair);padding:42px 24px 50px;text-align:center;background:var(--panel)}
footer .fj{font-size:12px;letter-spacing:.28em;text-indent:.28em;margin-bottom:12px;font-weight:500}
footer p{font-size:11px;color:var(--sub);letter-spacing:.1em}

.rv{opacity:0;transform:translateY(10px);transition:opacity .7s ease,transform .7s ease}
.rv.on{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.rv{opacity:1;transform:none}}
