/* Site menu (hamburger) — shared by every page. Markup comes from /assets/site-menu.js.
   Column width: --alu-col (480px on the hand-written pages, 560px on the generated ones via pages.css). */
.alu-nav-btn,.alu-nav{--an-paper:#FDF4E3;--an-sage:#E4ECE3;--an-mint:#B1D8B7;--an-ink:#3B4F3E;--an-soft:#566657;--an-primary:#44706A;--an-deep:#365A53;--an-line:rgba(78,123,115,.22);--an-en:"Gelasio","Noto Serif JP",serif;--an-serif:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif}

.alu-nav-btn{position:fixed;z-index:50;top:calc(10px + env(safe-area-inset-top,0px));right:max(10px,calc(50% - var(--alu-col,480px)/2 + 10px));width:46px;height:46px;padding:0;border:0;border-radius:50%;background:var(--an-paper);color:var(--an-primary);box-shadow:0 4px 14px rgba(54,90,83,.2);display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:box-shadow .2s ease,transform .2s ease}
.alu-nav-btn:active{transform:scale(.94)}
.alu-nav-btn svg,.alu-nav-x svg{width:22px;height:22px;display:block}
.alu-nav-btn:focus-visible,.alu-nav a:focus-visible,.alu-nav-x:focus-visible{outline:2px solid var(--an-primary);outline-offset:3px}

html.alu-nav-lock{overflow:hidden}
/* The sheet slides in from the column's right edge and leaves a dimmed strip of the page visible on the left,
   so it reads as a layer over the page. Closing plays the same motion in reverse (.alu-nav-closing, see site_menu.js). */
.alu-nav{--an-gap:clamp(32px,12vw,56px);--an-right:max(0px,calc((100vw - var(--alu-col,480px))/2));position:fixed;inset:0 var(--an-right) 0 auto;margin:0;width:calc(min(100vw,var(--alu-col,480px)) - var(--an-gap));max-width:none;height:100%;max-height:none;padding:0;border:0;border-radius:22px 0 0 22px;background:var(--an-paper);color:var(--an-ink);font-family:var(--an-serif);font-size:15px;line-height:1.75;letter-spacing:.04em;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;box-shadow:-14px 0 40px rgba(45,62,48,.24)}
.alu-nav[open]{animation:alu-nav-in .46s cubic-bezier(.16,1,.3,1)}
.alu-nav[open] .alu-nav-in{animation:alu-nav-drift .56s cubic-bezier(.16,1,.3,1)}
.alu-nav::backdrop{background:rgba(45,62,48,.46);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:alu-nav-fade .46s ease}
.alu-nav.alu-nav-closing{animation:alu-nav-out .26s cubic-bezier(.4,0,1,1) forwards}
.alu-nav.alu-nav-closing .alu-nav-in{animation:none}
.alu-nav.alu-nav-closing::backdrop{animation:alu-nav-fade-out .26s ease forwards}
@keyframes alu-nav-in{from{transform:translateX(104%)}}
@keyframes alu-nav-out{to{transform:translateX(104%)}}
@keyframes alu-nav-drift{from{opacity:0;transform:translateX(28px)}}
@keyframes alu-nav-fade{from{opacity:0}}
@keyframes alu-nav-fade-out{to{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .alu-nav[open],.alu-nav::backdrop{animation:alu-nav-fade .2s ease}
  .alu-nav[open] .alu-nav-in{animation:none}
  .alu-nav.alu-nav-closing,.alu-nav.alu-nav-closing::backdrop{animation:alu-nav-fade-out .16s ease forwards}
  .alu-nav-btn{transition:none}
}

.alu-nav-in{min-height:100%;display:flex;flex-direction:column;padding:0 22px calc(28px + env(safe-area-inset-bottom,0px))}
.alu-nav-hd{display:flex;align-items:center;justify-content:space-between;min-height:66px;padding-top:env(safe-area-inset-top,0px);margin:0 -12px 0 0}
.alu-nav-brand{font-family:var(--an-en);font-weight:600;font-size:1.05rem;letter-spacing:.12em;color:var(--an-primary);text-decoration:none;padding:8px 0}
.alu-nav-x{width:46px;height:46px;padding:0;border:0;border-radius:50%;background:var(--an-sage);color:var(--an-primary);display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent}

.alu-nav nav{flex:1}
.alu-nav h2{display:flex;align-items:center;gap:8px;margin:26px 0 4px;font-family:var(--an-serif);font-size:.8125rem;font-weight:600;letter-spacing:.14em;color:var(--an-soft)}
.alu-nav h2::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--an-mint)}
.alu-nav ul{list-style:none;margin:0;padding:0}
.alu-nav li{border-bottom:1px solid var(--an-line)}
.alu-nav li a{display:grid;grid-template-columns:1fr auto 10px;align-items:center;gap:12px;min-height:54px;padding:10px 2px;color:var(--an-primary);text-decoration:none;-webkit-tap-highlight-color:rgba(177,216,183,.35)}
.alu-nav .nm{font-weight:600;line-height:1.55;word-break:keep-all;overflow-wrap:anywhere}
.alu-nav .mt{font-family:var(--an-en);font-size:.8125rem;color:var(--an-soft);white-space:nowrap;letter-spacing:.04em;text-align:right}
.alu-nav .mt b{font-weight:600;color:var(--an-primary);margin-left:6px;font-size:.9375rem}
.alu-nav .chev{width:7px;height:12px;color:var(--an-primary);opacity:.55}
.alu-nav a[aria-current="page"] .nm::after{content:"表示中";margin-left:8px;padding:1px 8px;border-radius:999px;background:var(--an-sage);font-size:.6875rem;font-weight:400;color:var(--an-soft);letter-spacing:.08em;vertical-align:2px;white-space:nowrap}

/* narrow phones: time above price so the course name keeps its width */
@media (max-width:359px){.alu-nav li .mt{line-height:1.5}.alu-nav li .mt b{display:block;margin-left:0}}
/* the one featured entry: first visit */
.alu-nav .feat{margin-top:6px}
.alu-nav .feat a{display:grid;grid-template-columns:1fr 10px;gap:2px 12px;align-items:center;padding:16px 18px;border-radius:16px;background:var(--an-sage);color:var(--an-primary);text-decoration:none}
.alu-nav .feat .lb{grid-column:1;font-size:.75rem;letter-spacing:.12em;color:var(--an-soft)}
.alu-nav .feat .nm{grid-column:1;font-size:1.0625rem}
.alu-nav .feat .mt{grid-column:1;text-align:left}
.alu-nav .feat .sub{grid-column:1;font-size:.8125rem;color:var(--an-soft);line-height:1.6;margin-top:4px;word-break:auto-phrase}
.alu-nav .feat .chev{grid-column:2;grid-row:1/span 4}

.alu-nav-cta{margin-top:34px;text-align:center}
.alu-nav-book{display:flex;align-items:center;justify-content:center;min-height:56px;padding:15px 20px;border-radius:999px;background:var(--an-primary);color:#FDF6E8;font-weight:600;letter-spacing:.1em;text-decoration:none;box-shadow:0 10px 26px rgba(62,102,95,.22)}
.alu-nav-book:active{background:var(--an-deep)}
.alu-nav-line{display:inline-flex;align-items:center;min-height:44px;margin-top:6px;color:var(--an-primary);font-size:.875rem}
.alu-nav-addr{margin-top:14px;font-size:.8125rem;color:var(--an-soft);line-height:1.8}
@media print{.alu-nav-btn,.alu-nav{display:none}}
