/* ==========================================================================
   OFFLINE MIRROR of the sample build's assets/site.css
   --------------------------------------------------------------------------
   This is a copy of the site stylesheet, taken from
   https://tahsample.pages.dev/assets/site.css, so the preview pages in this
   folder render without a network connection.

   It is NOT the authoritative file. Do not edit it and do not ship it. The
   real stylesheet lives in the generator. To point the preview pages at the
   live file instead, rebuild with:

       python3 preview/build_preview.py --live

   Sections that the preview pages do not use (the interactive globe, the news
   list, some homepage bands) may be absent here. Everything the booking engine
   inherits (the :root tokens, buttons, nav, tables, modal, mobile bar) is
   present and unmodified.
   ========================================================================== */

:root{
  --teal:#00a0a0;
  --teal-dark:#007878;
  --teal-deeper:#005f5f;
  --teal-pale:#eaf6f6;
  --ink:#1a1f27;
  --ink-deep:#0d2424;
  --cloud:#f4f7f7;
  --mist:#dae7e7;
  --white:#fff;
  --text:#3a4848;
  --text-lt:#6a7878;
  --alert:#c0392b;
  --alert-dark:#96271b;
  --shadow:0 4px 22px rgba(0,90,90,.10);
  --shadow-deep:0 16px 50px rgba(0,90,90,.18);
  --r:8px;
  --r-lg:14px;

  --sans:'Inter','Noto Sans JP','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',
         'Yu Gothic Medium','游ゴシック Medium',YuGothic,'游ゴシック体','Meiryo',sans-serif;
  --serif:'Noto Serif JP','Hiragino Mincho ProN','ヒラギノ明朝 ProN W3',
          'Yu Mincho','游明朝',YuMincho,'PT Serif',Georgia,serif;
  --num:'Barlow','Inter',sans-serif;

  --s1:8px; --s2:14px; --s3:22px; --s4:32px; --s5:48px; --s6:72px; --s7:96px;
  --nav-h:66px;
  --top-h:38px;
  --gutter:24px;
  --maxw:1200px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 16px)}
body{
  font-family:var(--sans);background:var(--white);color:var(--text);
  line-height:1.85;font-size:16px;overflow-x:hidden;
  -webkit-tap-highlight-color:transparent;font-feature-settings:"palt" 1;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal-dark)}
button{font:inherit;color:inherit}
address{font-style:normal}
:focus-visible{outline:3px solid var(--teal);outline-offset:2px;border-radius:2px}
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:var(--teal);color:#fff;padding:12px 20px;font-weight:700}
.skip-link:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- Layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
section{padding-top:clamp(52px,5vw,84px);padding-bottom:clamp(52px,5vw,84px)}
section.tight{padding-top:var(--s4);padding-bottom:var(--s4)}
.sec-head{margin-bottom:var(--s4)}
.sec-head .en{display:block;font-family:var(--num);font-size:12px;letter-spacing:.24em;
  color:var(--teal);font-weight:600;margin-top:var(--s1);text-transform:uppercase}
.sec-foot{margin-top:var(--s4)}

/* ---------- Type ---------- */
.h1{font-family:var(--serif);font-size:clamp(26px,3.8vw,40px);font-weight:600;line-height:1.4;color:var(--ink)}
.h2{font-family:var(--serif);font-size:clamp(23px,2.7vw,34px);font-weight:600;line-height:1.4;color:var(--ink)}
.h3{font-family:var(--serif);font-size:clamp(18px,2vw,22px);font-weight:600;line-height:1.5;color:var(--ink)}
.lead{font-size:16px;line-height:1.95;color:var(--text-lt);max-width:64ch}

/* ---------- Buttons ---------- */
.btn{padding:13px 26px;border-radius:var(--r);font-size:14px;font-weight:700;letter-spacing:.03em;
  text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;border:none;
  line-height:1.5;transition:background-color .18s,color .18s,box-shadow .18s,transform .18s}
.btn-teal{background:var(--teal);color:#fff}
.btn-teal:hover{background:var(--teal-dark);transform:translateY(-1px);box-shadow:var(--shadow)}
.btn-outline{background:transparent;color:var(--teal-dark);border:2px solid var(--teal)}
.btn-outline:hover{background:var(--teal);color:#fff}
.btn-ghost{background:#fff;color:var(--teal-dark);border:1px solid var(--mist)}
.btn-ghost:hover{border-color:var(--teal);background:var(--teal-pale)}
.btn-light{background:rgba(255,255,255,.94);color:var(--teal-deeper)}
.btn-light:hover{background:#fff;transform:translateY(-1px)}

/* ---------- Top bar ---------- */
.top-bar{background:var(--ink-deep);height:var(--top-h)}
.top-bar-inner{max-width:1400px;margin:0 auto;display:flex;align-items:stretch;
  justify-content:flex-end;height:100%;padding-left:var(--gutter)}
.top-bar-links{display:flex;margin-right:auto;min-width:0;overflow:hidden}
.top-bar-links a{display:flex;align-items:center;padding:0 14px;font-size:12.5px;
  color:rgba(255,255,255,.58);text-decoration:none;letter-spacing:.03em;white-space:nowrap;
  transition:color .18s,background-color .18s}
.top-bar-links a:hover{color:#fff;background:rgba(255,255,255,.08)}
.phone-block{display:flex;flex-direction:column;justify-content:center;gap:1px;padding:0 20px;
  background:var(--teal);text-decoration:none;color:#fff;transition:background .18s;flex-shrink:0}
.phone-block:hover{background:var(--teal-dark)}
.phone-block .num{font-family:var(--num);font-size:15px;font-weight:600;letter-spacing:.02em;line-height:1.15}
.phone-block .phone-sub{font-size:10.5px;letter-spacing:.06em;opacity:.9;line-height:1.15}

/* ---------- Language switcher ---------- */
.lang{position:relative;display:flex;align-items:stretch;flex-shrink:0}
.lang-btn{display:flex;align-items:center;gap:7px;background:transparent;border:none;cursor:pointer;
  color:rgba(255,255,255,.75);font-size:12.5px;font-weight:500;letter-spacing:.04em;padding:0 14px;
  border-left:1px solid rgba(255,255,255,.12);border-right:1px solid rgba(255,255,255,.12);
  white-space:nowrap;transition:color .18s,background-color .18s}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{color:#fff;background:rgba(255,255,255,.1)}
.lang-btn svg{flex-shrink:0}
.lang-btn .chev{transition:transform .2s}
.lang-btn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.lang-label{max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.lang-menu{
  display:none;position:absolute;top:100%;right:0;z-index:400;background:#fff;
  width:max-content;min-width:360px;max-width:min(520px,calc(100vw - 24px));
  border:1px solid var(--mist);border-top:3px solid var(--teal);box-shadow:var(--shadow-deep);
  padding:8px;border-radius:0 0 var(--r) var(--r);
  grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;
}
.lang-menu.open{display:grid}
.lang-menu a{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;
  min-height:42px;padding:6px 12px;text-decoration:none;color:var(--text);font-size:14px;
  border-radius:6px;line-height:1.35;transition:background-color .15s,color .15s;
}
.lang-menu a .name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lang-menu a .code{font-family:var(--num);font-size:11px;letter-spacing:.08em;opacity:.55;
  white-space:nowrap;justify-self:end}
.lang-menu a:hover{background:var(--teal-pale);color:var(--teal-deeper)}
.lang-menu a[aria-current="true"]{background:var(--teal);color:#fff}
.lang-menu a[aria-current="true"] .code{opacity:.8}

/* ---------- Nav ---------- */
.nav{position:sticky;top:0;z-index:300;background:rgba(255,255,255,.97);
  border-bottom:2.5px solid var(--teal);box-shadow:0 2px 14px rgba(0,100,100,.07);
  backdrop-filter:saturate(130%) blur(8px);-webkit-backdrop-filter:saturate(130%) blur(8px)}
.nav-inner{display:flex;align-items:stretch;gap:var(--s2);height:var(--nav-h);
  max-width:1400px;margin:0 auto;padding:0 var(--gutter)}
.nav-brand{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.nav-brand img{height:38px;width:auto;object-fit:contain}
.nav-links{display:flex;list-style:none;align-items:stretch;margin-left:auto;min-width:0}
.nav-links>li{display:flex;align-items:stretch;position:relative}
.nav-links>li>a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  padding:0 13px;text-decoration:none;color:var(--ink);white-space:nowrap;
  border-bottom:2.5px solid transparent;margin-bottom:-2.5px;transition:color .18s,border-color .18s}
.nav-links>li>a .ja{font-size:13.5px;font-weight:500;letter-spacing:.02em}
.nav-links>li>a .en{font-family:var(--num);font-size:9px;letter-spacing:.13em;color:var(--text-lt);
  font-weight:600;text-transform:uppercase}
.nav-links>li>a:hover,.nav-links>li.current>a{color:var(--teal-dark);border-bottom-color:var(--teal)}
.nav-links>li>a:hover .en{color:var(--teal)}
.submenu{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);
  background:#fff;border:1px solid var(--mist);border-top:3px solid var(--teal);
  box-shadow:var(--shadow-deep);min-width:240px;padding:8px;list-style:none;
  border-radius:0 0 var(--r) var(--r)}
.nav-links>li:hover .submenu,.nav-links>li:focus-within .submenu{display:block}
.submenu a{display:block;padding:9px 14px;font-size:13.5px;color:var(--text);text-decoration:none;
  border-radius:6px;white-space:nowrap;transition:background-color .15s,color .15s}
.submenu a:hover{background:var(--teal-pale);color:var(--teal-deeper)}

.nav-cta-wrap{display:flex;align-items:center;gap:var(--s1);flex-shrink:0;margin-left:var(--s2)}
/* The top bar (which holds the main .lang switcher) is hidden below 1240px,
   so its compact twin in the header CTA row only needs to show there --
   above 1240px the top-bar switcher is already visible and this one would
   just be a duplicate. */
.nav-cta-wrap .lang.lang-compact{display:none}
.nav-cta-wrap .lang-btn{color:var(--text);border-color:var(--mist);height:38px;border-radius:var(--r)}
.nav-cta-wrap .lang-btn:hover,.nav-cta-wrap .lang-btn[aria-expanded="true"]{
  color:var(--teal-deeper);background:var(--teal-pale)}
.nav-cta{display:inline-flex;align-items:center;gap:6px;padding:0 16px;height:38px;border-radius:var(--r);
  font-size:13px;font-weight:700;letter-spacing:.03em;text-decoration:none;white-space:nowrap;
  border:none;cursor:pointer;transition:background .18s}
.nav-cta.reserve{background:var(--teal);color:#fff}
.nav-cta.reserve:hover{background:var(--teal-dark)}
.nav-cta.alert{background:var(--alert);color:#fff}
.nav-cta.alert:hover{background:var(--alert-dark)}

.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;
  padding:9px;background:none;border:none;flex-shrink:0}
.hamburger span{width:24px;height:2px;background:var(--ink);display:block;transition:transform .3s,opacity .3s}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.mobile-menu{display:none;position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;background:#fff;
  z-index:290;overflow-y:auto;-webkit-overflow-scrolling:touch}
.mobile-menu.open{display:block}
.mm-inner{padding:var(--s2) var(--gutter) 120px}
.mobile-menu details{border-bottom:1px solid var(--mist)}
.mobile-menu summary{padding:15px 2px;font-size:15px;font-weight:600;color:var(--ink);cursor:pointer;
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.mobile-menu summary::-webkit-details-marker{display:none}
.mobile-menu summary::after{content:'+';color:var(--teal);font-size:22px;font-weight:300;line-height:1}
.mobile-menu details[open] summary::after{content:'\2212'}
.mm-links{padding-bottom:var(--s1)}
.mm-links a{display:block;padding:11px 14px;font-size:14px;color:var(--text);text-decoration:none;
  border-top:1px dotted var(--mist)}
.mm-top{display:block;padding:15px 2px;font-size:15px;font-weight:600;color:var(--ink);
  text-decoration:none;border-bottom:1px solid var(--mist)}
.mm-quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:var(--s3)}
.mm-quick a{display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:14px 8px;border-radius:var(--r);text-decoration:none;line-height:1.4;text-align:center;
  background:var(--teal);color:#fff}
.mm-quick a:nth-child(2){background:var(--cloud);color:var(--teal-deeper);border:1px solid var(--mist)}
.mm-quick strong{font-size:15px;font-weight:600}
.mm-quick span{font-size:11px;opacity:.85}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--ink-deep);overflow:hidden;padding:0;
  min-height:clamp(420px,58vw,620px);display:flex;align-items:flex-end}
.hero-slides{position:absolute;inset:0}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.hero-slide.active{opacity:1}
.hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center 32%}
.hero-scrim{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(90deg,rgba(4,26,26,.72) 0%,rgba(4,26,26,.38) 48%,rgba(4,26,26,.06) 100%),
  linear-gradient(0deg,rgba(4,26,26,.5) 0%,rgba(4,26,26,0) 42%)}
.hero-inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0 auto;
  padding:var(--s7) var(--gutter) var(--s6);color:#fff}
.hero h1{font-family:var(--serif);font-size:clamp(23px,3.4vw,42px);font-weight:600;line-height:1.55;
  color:#fff;margin-bottom:var(--s3);text-shadow:0 2px 22px rgba(0,0,0,.4);max-width:22em}
.hero-btns{display:flex;gap:var(--s1);flex-wrap:wrap}
.hero-dots{position:absolute;bottom:var(--s3);right:var(--gutter);z-index:3;display:flex;gap:9px}
.hero-dots button{width:10px;height:10px;border-radius:50%;border:2px solid rgba(255,255,255,.7);
  background:transparent;cursor:pointer;padding:0}
.hero-dots button[aria-current="true"]{background:#fff;border-color:#fff}

/* ---------- Quick grid ---------- */
.quick-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));max-width:1400px;margin:0 auto}
.quick-grid a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  text-align:center;padding:var(--s4) var(--s2);color:#fff;text-decoration:none;line-height:1.5;
  border-right:1px solid rgba(255,255,255,.15);transition:background-color .2s;min-height:118px}
.quick-grid a:last-child{border-right:none}
.quick-grid a:hover{background:rgba(255,255,255,.1)}
.quick-grid .ttl{font-size:14.5px;font-weight:600}
.quick-grid .en{font-family:var(--num);font-size:9.5px;letter-spacing:.16em;opacity:.7;text-transform:uppercase}
.quick-grid svg{opacity:.9;flex-shrink:0}

/* ---------- Cards ---------- */
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s2)}
.grid-5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s2)}
.card{background:#fff;border:1px solid var(--mist);border-radius:var(--r);padding:var(--s3);
  text-decoration:none;color:var(--text);display:block;
  transition:border-color .2s,box-shadow .2s,transform .2s}
a.card:hover{border-color:var(--teal);box-shadow:var(--shadow);transform:translateY(-2px)}
.card .en{font-family:var(--num);font-size:10px;letter-spacing:.16em;color:var(--teal);
  text-transform:uppercase;display:block;margin-bottom:var(--s1);font-weight:600}
.card h3{font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink);
  margin-bottom:var(--s1);line-height:1.55}
.card p{font-size:13.5px;color:var(--text-lt);line-height:1.8}
.dept-card{background:#fff;border:1px solid var(--mist);border-radius:var(--r);
  padding:var(--s2) var(--s3);text-decoration:none;display:flex;align-items:center;
  justify-content:space-between;gap:10px;color:var(--ink);font-size:14.5px;font-weight:500;
  min-height:58px;line-height:1.5;transition:border-color .2s,background-color .2s,color .2s}
.dept-card:hover{border-color:var(--teal);background:var(--teal-pale);color:var(--teal-deeper)}
.dept-card::after{content:'\203a';color:var(--teal);font-size:20px;line-height:1;flex-shrink:0}
.banner-card{display:block;border-radius:var(--r);overflow:hidden;border:1px solid var(--mist);
  transition:box-shadow .2s,transform .2s}
.banner-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.banner-card img{width:100%;height:auto}

.certs{background:#fff;border-top:1px solid var(--mist)}
.certs-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--s3);align-items:center}
.certs-grid img{max-height:74px;width:auto;margin:0 auto;object-fit:contain}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}

/* ---------- Page head and body ---------- */
.page-head{background:var(--teal-deeper);color:#fff;padding:var(--s5) 0;position:relative;overflow:hidden}
.page-head::after{content:'';position:absolute;right:-60px;top:-60px;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.05)}
.page-head .wrap{position:relative;z-index:1}
.page-head h1{font-family:var(--serif);font-size:clamp(24px,3.2vw,36px);font-weight:600;color:#fff;line-height:1.5}
.page-head .en{font-family:var(--num);font-size:11.5px;letter-spacing:.24em;color:rgba(255,255,255,.65);text-transform:uppercase;display:block;margin-top:var(--s1);font-weight:600}
.page-body{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:var(--s6);max-width:var(--maxw);margin:0 auto;padding:var(--s5) var(--gutter) var(--s7);align-items:start}
.page-body.no-aside{grid-template-columns:minmax(0,1fr);max-width:920px}
.side{position:sticky;top:calc(var(--nav-h) + 20px)}
.side h2{font-family:var(--serif);font-size:15.5px;font-weight:600;color:#fff;background:var(--teal-deeper);padding:14px 18px;border-radius:var(--r) var(--r) 0 0;line-height:1.5}
.side ul{list-style:none;border:1px solid var(--mist);border-top:none;border-radius:0 0 var(--r) var(--r);overflow:hidden}
.side li+li{border-top:1px solid var(--mist)}
.side a{display:block;padding:12px 18px;font-size:13.5px;color:var(--text);text-decoration:none;line-height:1.6;transition:background-color .15s,color .15s}
.side a:hover{background:var(--teal-pale);color:var(--teal-deeper)}
.side a[aria-current="page"]{background:var(--teal-pale);color:var(--teal-deeper);font-weight:600;box-shadow:inset 3px 0 0 var(--teal)}
.side-contact{margin-top:var(--s3);border:1px solid var(--mist);border-radius:var(--r);padding:var(--s3);background:var(--cloud)}
.side-contact .lbl{font-size:11px;letter-spacing:.14em;color:var(--text-lt);text-transform:uppercase;font-weight:700}
.side-contact .tel{font-family:var(--num);font-size:23px;font-weight:600;color:var(--teal-deeper);display:block;text-decoration:none;margin:4px 0 2px;letter-spacing:.01em}
.side-contact p{font-size:12.5px;color:var(--text-lt);line-height:1.75}
.side-contact .btn{margin-top:var(--s2);width:100%;justify-content:center}

/* ---------- Prose ---------- */
.prose{font-size:15.5px;line-height:2.05}
.prose>h2{font-family:var(--serif);font-size:clamp(20px,2.3vw,26px);font-weight:600;color:var(--ink);margin:var(--s6) 0 var(--s3);padding-bottom:12px;border-bottom:2px solid var(--mist);position:relative;line-height:1.55}
.prose>h2::after{content:'';position:absolute;left:0;bottom:-2px;width:72px;height:2px;background:var(--teal)}
.prose>h2:first-child{margin-top:0}
.prose h3{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--teal-deeper);margin:var(--s4) 0 var(--s2);line-height:1.6;padding-left:14px;border-left:4px solid var(--teal)}
.prose h4{font-size:16px;font-weight:700;color:var(--ink);margin:var(--s3) 0 var(--s1)}
.prose p{margin-bottom:var(--s2)}
.prose ul,.prose ol{margin:0 0 var(--s3);padding-left:0;list-style:none}
.prose ul>li{position:relative;padding-left:22px;margin-bottom:7px}
.prose ul>li::before{content:'';position:absolute;left:4px;top:.85em;width:7px;height:7px;border-radius:50%;background:var(--teal)}
.prose ol{counter-reset:n}
.prose ol>li{position:relative;padding-left:32px;margin-bottom:7px;counter-increment:n}
.prose ol>li::before{content:counter(n);position:absolute;left:0;top:.34em;width:22px;height:22px;border-radius:50%;background:var(--teal-pale);color:var(--teal-deeper);font-family:var(--num);font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center}
.prose .note{font-size:13.5px;color:var(--text-lt);line-height:1.9;margin-bottom:var(--s1)}
.prose .callout{background:var(--teal-pale);border-left:4px solid var(--teal);border-radius:0 var(--r) var(--r) 0;padding:var(--s3);margin:var(--s3) 0}
.prose .callout ul{margin-bottom:0}
.prose .callout p:last-child{margin-bottom:0}
.prose a{color:var(--teal-dark);text-decoration:underline;text-underline-offset:3px}
.prose a:hover{color:var(--teal-deeper)}
.prose .staff{border:1px solid var(--mist);border-radius:var(--r);padding:var(--s3);margin:var(--s2) 0;background:#fff}
.prose .staff h4{margin-top:0;font-family:var(--serif);font-size:17.5px;font-weight:600;color:var(--ink)}
.prose .staff dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:5px var(--s3);font-size:14px;margin-top:var(--s1);line-height:1.8}
.prose .staff dt{color:var(--text-lt);white-space:nowrap}
.prose .staff dd{color:var(--text)}
.prose .staff.has-photo{display:grid;grid-template-columns:168px minmax(0,1fr);gap:0 var(--s3)}
.prose .staff.has-photo .staff-photo{grid-row:1 / span 2;width:168px;height:168px;border-radius:50%;
  object-fit:cover;background:var(--mist)}
.prose .staff.has-photo h4{grid-column:2;align-self:center}
.prose .staff.has-photo dl{grid-column:2}
@media (max-width:720px){
  /* Stack the card: at the larger photo size the side-by-side grid squeezes
     the detail column badly on narrow screens. */
  .prose .staff.has-photo{grid-template-columns:minmax(0,1fr)}
  .prose .staff.has-photo .staff-photo{grid-row:auto;width:140px;height:140px;
    margin:0 auto var(--s2)}
  .prose .staff.has-photo h4{grid-column:1;text-align:center}
  .prose .staff.has-photo dl{grid-column:1}
}
@media (max-width:480px){
  /* Japanese labels such as アピールポイント leave too little room for the
     value beside them at this width, so put the value on its own line. */
  .prose .staff dl{grid-template-columns:minmax(0,1fr);gap:0}
  .prose .staff dt{margin-top:10px;font-size:13px}
  .prose .staff dl>dt:first-of-type{margin-top:0}
}

/* Restored content photos & video (2026-09-10). */
.prose .photo-single, .prose .photo-gallery{margin:var(--s3) 0}
.prose .photo-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:var(--s2);align-items:start}
/* Photos are never cropped, never stretched and never enlarged past their own
   size. The frame shrinks to whatever the image actually is, and a cap on the
   height keeps a tall portrait from taking over the column. */
.prose .content-photo{margin:0;background:#fff;border:1px solid var(--mist);overflow:hidden;
  width:fit-content;max-width:100%}
.prose .content-photo img{display:block;width:auto;height:auto;aspect-ratio:auto;object-fit:fill;
  max-width:100%;max-height:400px}
.prose .content-photo figcaption{padding:var(--s1) var(--s2);font-size:13px;color:var(--text-lt);line-height:1.6}
.prose .content-video{margin:0;background:#fff;border:1px solid var(--mist);overflow:hidden}
.prose .content-video video{display:block;width:100%;height:auto;background:#000}
.prose .content-video figcaption{padding:var(--s1) var(--s2);font-size:13px;color:var(--text-lt)}
.prose .video-embed{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden}
.prose .video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.prose .video-embed .video-caption{position:absolute;inset:auto 0 0 0;margin:0;padding:6px 10px;
  font-size:12.5px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.75));pointer-events:none}
.prose .video-library{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.prose .video-library .video-embed{margin:0}

.related{margin-top:var(--s6);border-top:1px solid var(--mist);padding-top:var(--s4)}
.related h2{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);margin-bottom:var(--s2)}
.related ul{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;align-items:stretch}
.related a{display:flex;align-items:center;min-height:52px;padding:12px 16px;border:1px solid var(--mist);border-radius:var(--r);font-size:14px;color:var(--text);text-decoration:none;line-height:1.6;transition:border-color .2s,background-color .2s}
.related a:hover{border-color:var(--teal);background:var(--teal-pale)}
.related li>span{display:flex;align-items:center;min-height:52px;padding:12px 16px;border:1px dashed var(--mist);border-radius:var(--r);font-size:14px;color:var(--text-lt);line-height:1.6}

.jp-badge{display:inline-block;font-family:var(--num);font-size:9.5px;font-weight:700;
  letter-spacing:.06em;color:var(--teal-deeper);background:var(--teal-pale);
  border:1px solid var(--mist);border-radius:4px;padding:1px 5px;margin-left:6px;
  vertical-align:1px;line-height:1.4}
.nav-links>li>a .jp-badge{margin-left:5px}
.side a .jp-badge,.related a .jp-badge{margin-left:6px}

/* ---------- Modal ---------- */
.modal{position:fixed;inset:0;z-index:900;background:rgba(8,24,24,.6);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:var(--s3);overflow-y:auto}
.modal[hidden]{display:none}
.modal-card{background:#fff;border-radius:var(--r-lg);width:100%;max-width:560px;
  padding:var(--s5) var(--s4) var(--s4);position:relative;box-shadow:var(--shadow-deep);
  animation:modalIn .28s cubic-bezier(.22,1,.36,1);margin:auto}
@keyframes modalIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.modal-close{position:absolute;top:12px;right:14px;width:38px;height:38px;border-radius:50%;
  border:none;background:var(--cloud);color:var(--text);font-size:24px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .18s}
.modal-close:hover{background:var(--mist)}
.modal-title{font-family:var(--serif);font-size:22px;font-weight:600;color:var(--ink);line-height:1.5}
.modal-lead{font-size:14px;color:var(--text-lt);margin-top:var(--s1);line-height:1.8}
.modal-options{display:grid;gap:var(--s2);margin-top:var(--s3)}
.modal-option{display:flex;gap:var(--s2);align-items:flex-start;text-align:left;width:100%;
  padding:var(--s3);border:1.5px solid var(--mist);border-radius:var(--r);background:#fff;
  text-decoration:none;color:var(--text);cursor:pointer;
  transition:border-color .18s,background-color .18s,box-shadow .18s}
.modal-option:hover{border-color:var(--teal);background:var(--teal-pale);box-shadow:var(--shadow)}
.mo-icon{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:var(--teal-pale);
  color:var(--teal-deeper);display:flex;align-items:center;justify-content:center}
.mo-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.mo-title{font-size:15.5px;font-weight:700;color:var(--ink);display:flex;align-items:center;
  gap:8px;flex-wrap:wrap;line-height:1.5}
.mo-num{font-family:var(--num);font-size:25px;font-weight:600;color:var(--teal-deeper);
  letter-spacing:.01em;line-height:1.3}
.mo-note{font-size:12.5px;color:var(--text-lt);line-height:1.7}
.mo-badge{font-size:11px;font-weight:700;letter-spacing:.08em;background:var(--mist);
  color:var(--teal-deeper);padding:3px 9px;border-radius:99px}
.modal-option.is-soon{opacity:.7;cursor:not-allowed}
.modal-option.is-soon:hover{border-color:var(--mist);background:#fff;box-shadow:none}
.modal-option.is-soon .mo-icon{background:var(--cloud);color:var(--text-lt)}
.modal-foot{font-size:12.5px;color:var(--text-lt);line-height:1.8;margin-top:var(--s3);
  padding-top:var(--s2);border-top:1px solid var(--mist)}

/* ---------- Mobile action bar ---------- */
.mbb{display:none}
.mbb a,.mbb button{flex:1;text-align:center;padding:13px 6px;font-size:13px;font-weight:700;
  border-radius:99px;text-decoration:none;display:flex;align-items:center;justify-content:center;
  line-height:1.3;border:none;cursor:pointer}
.mbb .a1{background:#fff;color:var(--teal-dark);border:1.5px solid var(--teal)}
.mbb .a2{background:var(--teal);color:#fff}
.mbb .a3{background:var(--alert);color:#fff}

/* ---------- Footer ---------- */
footer{background:var(--ink-deep);color:rgba(255,255,255,.62);padding:var(--s6) 0 var(--s3);font-size:14px}
.footer-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:var(--s6);
  padding-bottom:var(--s5);border-bottom:1px solid rgba(255,255,255,.12)}
.footer-logo img{height:44px;width:auto;filter:brightness(0) invert(1);opacity:.95}
.footer-addr{margin-top:var(--s3);line-height:1.95;font-size:13.5px}
.footer-addr .tel{font-family:var(--num);font-size:24px;color:#fff;font-weight:600;
  text-decoration:none;display:inline-block;margin-top:6px;letter-spacing:.01em}
.footer-sub{font-size:12.5px;opacity:.75;margin-top:var(--s1);line-height:1.85}
.footer-sns{display:flex;gap:var(--s1);margin-top:var(--s3)}
.footer-sns a{display:flex;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);
  align-items:center;justify-content:center;transition:background-color .18s}
.footer-sns a:hover{background:rgba(255,255,255,.2)}
.footer-sns img{width:20px;height:20px;object-fit:contain}
.footer-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4)}
.footer-nav h3{font-size:13px;color:#fff;font-weight:600;letter-spacing:.05em;margin-bottom:var(--s2)}
.footer-nav ul{list-style:none}
.footer-nav li{margin-bottom:8px}
.footer-nav a{color:rgba(255,255,255,.58);text-decoration:none;font-size:13px;line-height:1.7;
  transition:color .18s}
.footer-nav a:hover{color:var(--teal)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);
  padding-top:var(--s3);flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.42)}
.footer-legal{display:flex;flex-wrap:wrap;gap:var(--s2)}
.footer-legal a{color:rgba(255,255,255,.48);text-decoration:none}
.footer-legal a:hover{color:var(--teal)}
.footer-lang{display:flex;align-items:center;gap:10px}
.footer-lang-label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.42)}
/* This widget sits at the very bottom of the document, so its popover
   opens upward instead of off the bottom of the page. */
.footer-lang .lang-menu{top:auto;bottom:100%;border-top:1px solid var(--mist);
  border-bottom:3px solid var(--teal);border-radius:var(--r) var(--r) 0 0}

/* ---------- Tables ---------- */
.hours{width:100%;border-collapse:collapse;font-size:14.5px;background:#fff}
.hours caption{text-align:left;font-family:var(--serif);font-size:17px;font-weight:600;
  color:var(--ink);padding-bottom:var(--s1)}
.hours th,.hours td{border:1px solid var(--mist);padding:10px 6px;text-align:center}
.hours thead th{background:var(--teal-deeper);color:#fff;font-weight:600;font-size:13.5px}
.hours tbody th{background:var(--cloud);color:var(--ink);font-weight:600;text-align:left;
  padding-left:14px;white-space:nowrap;font-family:var(--num);font-size:13.5px}
.hours td{color:var(--teal-dark);font-weight:700}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.prose table{width:100%;border-collapse:collapse;font-size:14.5px;margin:var(--s3) 0;background:#fff}
.prose th,.prose td{border:1px solid var(--mist);padding:11px 13px;text-align:left;vertical-align:top;
  line-height:1.75}
.prose thead th{background:var(--teal-deeper);color:#fff;font-weight:600;white-space:nowrap}
.prose tbody th{background:var(--cloud);font-weight:600;color:var(--ink);white-space:nowrap}
.prose .chart-figure{background:#fff;border:1px solid var(--mist);border-radius:var(--r);
  padding:var(--s3);margin:var(--s3) 0;text-align:center}
.prose .chart-figure svg{max-width:480px;width:100%;height:auto}
.prose figcaption.note{margin-top:0}

/* ---------- Breadcrumbs ---------- */
.crumbs{background:var(--cloud);border-bottom:1px solid var(--mist);font-size:12.5px}
.crumbs ol{max-width:var(--maxw);margin:0 auto;padding:11px var(--gutter);list-style:none;
  display:flex;flex-wrap:wrap;gap:7px;color:var(--text-lt);line-height:1.7}
.crumbs li::after{content:'\203a';margin-left:7px;color:var(--mist)}
.crumbs li:last-child::after{content:''}
.crumbs a{color:var(--text-lt);text-decoration:none}
.crumbs a:hover{color:var(--teal-dark);text-decoration:underline}

/* ---------- Breakpoints ---------- */
@media(max-width:1300px){
  .nav-links>li>a{padding:0 10px}
  .nav-links>li>a .ja{font-size:13px}
}

@media(max-width:1240px){
  .top-bar{display:none}
  .nav-links{display:none}
  .hamburger{display:flex}
  .nav-cta-wrap{margin-left:auto}
  .nav-cta-wrap .lang.lang-compact{display:flex}
}

@media(max-width:1080px){
  .page-body{grid-template-columns:minmax(0,1fr);gap:var(--s5)}
  .side{position:static}
  .certs-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:900px){
  :root{--gutter:20px}
  .nav-cta.alert{display:none}
  .nav-cta.reserve{display:none}
  .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quick-grid a{border-bottom:1px solid rgba(255,255,255,.15);min-height:104px;padding:var(--s3) var(--s2)}
  .quick-grid a:nth-child(odd){border-right:1px solid rgba(255,255,255,.15)}
  .quick-grid a:nth-child(even){border-right:none}
  .quick-grid a:last-child{grid-column:1 / -1;border-right:none;border-bottom:none}
  .grid-2,.grid-3,.grid-4,.grid-5{grid-template-columns:1fr}
  .footer-top{grid-template-columns:1fr;gap:var(--s4)}
  .footer-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
  section{padding-top:clamp(40px,7vw,52px);padding-bottom:clamp(40px,7vw,52px)}
  .hero-inner{padding:var(--s6) var(--gutter) var(--s5)}
  .lang-menu{position:fixed;top:var(--nav-h);left:var(--gutter);right:var(--gutter);
    width:auto;max-width:none;min-width:0;border-radius:0 0 var(--r) var(--r);
    max-height:calc(100vh - var(--nav-h) - 40px);overflow-y:auto}
  .mbb{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:280;
    background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-top:1px solid var(--mist);
    padding:9px 12px;padding-bottom:calc(9px + env(safe-area-inset-bottom));gap:8px;
    box-shadow:0 -4px 14px rgba(0,80,80,.08)}
  body{padding-bottom:74px}
  .mm-inner{padding-bottom:140px}
}

@media(max-width:640px){
  .certs-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
  .footer-nav{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:var(--s2)}
  .lang-menu{grid-template-columns:1fr}
  .related ul{grid-template-columns:1fr}
  .modal{padding:0;align-items:flex-end}
  .modal-card{max-width:none;border-radius:var(--r-lg) var(--r-lg) 0 0;
    padding:var(--s4) var(--s3) var(--s3);margin:0}
  .modal-title{font-size:20px}
  .modal-option{padding:var(--s2);gap:var(--s2)}
  .mo-num{font-size:22px}
  .prose>h2{margin-top:var(--s5)}
  .page-body{padding-top:var(--s4)}
  .hero h1{line-height:1.6}
}

@media(max-width:400px){
  .quick-grid .ttl{font-size:13.5px}
  .mbb a,.mbb button{font-size:12px;padding:12px 4px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}

@media print{
  .nav,.top-bar,.mbb,.side,footer,.mobile-menu,.modal,.hero-dots{display:none!important}
  body{padding:0;font-size:11pt;background:#fff}
  .page-head{background:none;color:#000;padding:0 0 12px}
  .page-head h1,.page-head .en{color:#000}
  .page-body{display:block;padding:0}
}

/* Buttons rendered as links inside .prose: .prose a outranks .btn (two
   selectors beat one), so restore the button's own colour and remove the
   prose underline. */
.prose a.btn{text-decoration:none}
.prose a.btn-teal{color:#fff}
.prose a.btn-teal:hover{color:#fff}
.prose a.btn-ghost{color:var(--teal-dark)}

/* Header phone block, in place of the former reservation and emergency
   buttons. Hidden at the same width those were. */
.nav-phone{display:inline-flex;flex-direction:column;justify-content:center;gap:1px;
  height:38px;padding:0 16px;border-radius:var(--r);background:var(--teal);color:#fff;
  text-decoration:none;white-space:nowrap;transition:background .18s}
.nav-phone:hover{background:var(--teal-dark)}
.nav-phone .num{font-family:var(--num);font-size:15px;font-weight:600;letter-spacing:.02em;line-height:1.1}
.nav-phone .sub{font-size:10px;letter-spacing:.04em;opacity:.9;line-height:1.1}
@media(max-width:900px){
  .nav-phone{display:none}
}

/* Temporary-site notice, above the top bar. */
/* Site notice. Sticky above the sticky nav, and deliberately not in the site
   palette so it reads as a notice rather than as part of the header.
   --maint-h is measured at runtime so the nav sits directly beneath it. */
:root{--maint-h:0px}
.maint-bar{position:sticky;top:0;z-index:320;background:#fdf3e3;color:#6b4e12;
  border-bottom:2px solid #d8b874;margin-bottom:-1px}
.maint-bar p{max-width:var(--maxw);margin:0 auto;padding:13px var(--gutter);
  font-size:15px;font-weight:700;line-height:1.7;text-align:center;letter-spacing:.01em}
.maint-ico{width:19px;height:19px;flex:none;vertical-align:-4px;margin-right:9px}
.nav{top:calc(var(--maint-h) - 1px)}
@media(max-width:700px){
  .maint-bar p{padding:11px var(--gutter);font-size:13.5px;text-align:left}
  .maint-ico{width:17px;height:17px;vertical-align:-3px;margin-right:7px}
}
}

/* ---------- Booking form (obstetrics first visit) ---------- */
.form-notice{border:1px solid #f0dcb8;background:#fdf3e3;border-radius:var(--r);
  padding:var(--s2) var(--s3);margin:0 0 var(--s3)}
.form-notice p{margin:0;font-size:14px;line-height:1.85;color:#6b4e12}
.form-notice p+p{margin-top:6px}
.form-notice a{color:#6b4e12}

.form-steps{display:flex;gap:10px;margin:0 0 var(--s3)}
.fstep{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 10px;border-radius:var(--r);background:var(--cloud);color:var(--text-lt);
  font-size:14px;font-weight:700;text-align:center;line-height:1.3}
.fstep em{font-style:normal;font-family:var(--num);font-size:15px}
.fstep small{font-size:10px;letter-spacing:.08em;font-weight:500;opacity:.75}
.fstep.is-current{background:var(--teal);color:#fff}

.prose .tah-form{margin:var(--s2) 0 0}
.frow{display:grid;grid-template-columns:210px minmax(0,1fr);gap:var(--s3);
  align-items:start;padding:var(--s2) 0;border-bottom:1px solid var(--mist)}
.fgroup .frow:first-of-type{border-top:1px solid var(--mist)}
.frow.is-invalid{background:#fff7f6}
.flabel{display:flex;align-items:flex-start;gap:8px;flex-wrap:wrap;
  font-size:14px;font-weight:700;color:var(--ink);padding-top:10px;line-height:1.6}
.flabel .fsub{display:block;font-weight:400;font-size:12.5px;color:var(--text-lt);margin-top:3px}
.req{font-style:normal;font-size:10.5px;font-weight:700;color:#fff;background:var(--alert);
  border-radius:3px;padding:2px 6px;letter-spacing:.04em;white-space:nowrap;margin-top:2px}

.ffield input[type=text],.ffield input[type=tel],.ffield input[type=email],
.ffield input[type=date],.ffield select,.ffield textarea{
  width:100%;font:inherit;font-size:14px;color:var(--ink);background:#fff;
  border:1px solid var(--mist);border-radius:var(--r);padding:9px 11px;line-height:1.5}
.ffield textarea{resize:vertical}
.ffield input:focus,.ffield select:focus,.ffield textarea:focus{
  outline:2px solid var(--teal);outline-offset:1px;border-color:var(--teal)}
.frow.is-invalid input,.frow.is-invalid select{border-color:var(--alert)}
.fgrid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
.fgrid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.fstack{display:grid;gap:10px}
.finline{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.finline input{max-width:220px}
.fsmall{font-size:12.5px;color:var(--text-lt)}
.fhint{margin:7px 0 0;font-size:12.5px;color:var(--text-lt);line-height:1.8}
.fnote-alert{margin:9px 0 0;font-size:12.5px;color:var(--alert-dark);line-height:1.8}

.fchoice{display:flex;flex-wrap:wrap;gap:10px}
.pill{position:relative;display:inline-flex}
.pill input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.pill span{display:inline-flex;align-items:center;justify-content:center;min-width:96px;
  padding:9px 15px;border:1px solid var(--mist);border-radius:var(--r);background:#fff;
  font-size:14px;transition:background .15s,border-color .15s,color .15s}
.pill input:checked+span{background:var(--teal);border-color:var(--teal);color:#fff;font-weight:700}
.pill input:focus-visible+span{outline:2px solid var(--teal);outline-offset:2px}
.pill-wide span{min-width:120px}

.fpref{display:grid;grid-template-columns:86px minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:center}
.fpref .tag{display:inline-flex;align-items:center;justify-content:center;padding:8px 6px;
  border-radius:var(--r);background:var(--cloud);color:var(--teal-dark);
  font-size:12.5px;font-weight:700;white-space:nowrap}

.fcheck{display:flex;align-items:center;gap:9px;font-size:14px;line-height:1.6;cursor:pointer}
.fcheck input{width:17px;height:17px;flex:none;accent-color:var(--teal);cursor:pointer}
.prose .tah-form .fcheck{margin-top:12px}
.fsubhead{margin:var(--s3) 0 10px;font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink)}
.fprivacy{max-height:200px;overflow:auto;border:1px solid var(--mist);border-radius:var(--r);
  padding:var(--s2) var(--s3);background:var(--cloud);font-size:13px;line-height:1.9}
.fprivacy p{margin:0 0 9px}
.fprivacy p:last-child{margin-bottom:0}
.fconsent{display:grid;gap:4px;margin-top:var(--s2);justify-items:start}
.fconsent.is-invalid{background:#fff7f6}
.fconsent .fcheck{align-items:center}

.fsubmit{margin-top:var(--s3);text-align:center}
.ferr{margin:12px 0 0;font-size:13.5px;color:var(--alert-dark);font-weight:700}

.fout{margin-top:var(--s4);border:1px solid var(--teal);border-radius:var(--r);
  padding:var(--s3);background:var(--cloud)}
.fout .fsubhead{margin-top:0}
.fout textarea{width:100%;min-height:300px;margin-top:10px;font-size:13px;line-height:1.8;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Noto Sans JP",monospace;
  color:var(--ink);background:#fff;border:1px solid var(--mist);border-radius:var(--r);
  padding:var(--s2);resize:vertical}
.fout-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s2)}
.prose .fout a.btn{text-decoration:none}

@media(max-width:720px){
  .form-steps{flex-direction:column;gap:8px}
  .frow{grid-template-columns:minmax(0,1fr);gap:9px;padding:16px 0}
  .flabel{padding-top:0}
  .fpref{grid-template-columns:minmax(0,1fr);gap:8px}
  .fpref .tag{justify-self:start;padding:5px 12px}
  .fgrid-2{grid-template-columns:minmax(0,1fr)}
  .finline input{max-width:none;width:100%}
  .fout-btns .btn{width:100%;text-align:center;justify-content:center}
}

/* Hours table: the Friday column is the exception people miss, so it is
   called out rather than left as a dash in a grid of dots. */
.hours td{font-size:15px}
.hours tbody th{font-size:14px}
.hours thead th.hl{background:#8a5a12;font-size:14.5px;line-height:1.3}
.hours thead th.hl span{display:block;font-size:10.5px;font-weight:500;opacity:.92;margin-top:2px}
.hours td.hl{background:#fdf7ec}
.hours td.off{color:var(--text-lt);font-weight:600;font-size:12.5px;background:var(--cloud)}
.hours td.hl.off{background:#fbf0dd;color:#8a5a12}
.hours-key{margin:var(--s2) 0 6px;font-size:14.5px;line-height:1.8;color:var(--ink);
  border-left:3px solid #8a5a12;padding-left:12px}

/* Form groups, per-field messages and the copy button's done state. */
.fgroup{border:0;margin:0 0 var(--s4);padding:0;min-width:0}
.fgroup legend{display:block;width:100%;padding:0 0 10px;margin:0 0 2px;
  font-family:var(--serif);font-size:18px;font-weight:600;color:var(--teal-dark);
  border-bottom:2px solid var(--teal)}
.freq-note{margin:0 0 var(--s3);font-size:13.5px;color:var(--text-lt)}
.freq-note .req{margin-right:6px}
.fmsg{margin:7px 0 0;font-size:13px;font-weight:700;color:var(--alert-dark)}
.fmsg::before{content:"\26A0\FE0E";margin-right:6px}
.frow.is-invalid{background:#fff7f6;box-shadow:inset 3px 0 0 var(--alert)}
.frow.is-invalid .flabel{padding-left:9px}
.fconsent.is-invalid{background:#fff7f6;box-shadow:inset 3px 0 0 var(--alert);
  padding:10px 12px;border-radius:var(--r)}
.btn.is-done{background:var(--teal-dark)}
.fout .fsubhead::before{content:"\2713";color:var(--teal);margin-right:8px;font-weight:700}

@media(max-width:720px){
  .fgroup legend{font-size:16.5px}
  .frow.is-invalid .flabel{padding-left:9px}
  .frow.is-invalid{padding-left:0}
  /* comfortable touch targets */
  .ffield input[type=text],.ffield input[type=tel],.ffield input[type=email],
  .ffield input[type=date],.ffield select,.ffield textarea{padding:12px 12px;font-size:16px}
  .pill span{min-width:0;flex:1;padding:12px 16px;font-size:15px}
  .fchoice{gap:8px}
  .fcheck input{width:20px;height:20px}
  .fsubmit .btn{width:100%}
}

/* The logo would not shrink, so brand + language + CTA + burger overflowed a
   narrow viewport and the whole page could be dragged sideways. */
@media(max-width:900px){
  .nav-brand{flex:0 1 auto;min-width:0}
  .nav-brand img{max-width:100%;height:auto;max-height:38px}
}
@media(max-width:420px){
  .nav-brand img{max-height:32px}
}

/* Document download list. */
.prose .dl-list{list-style:none;margin:var(--s2) 0 var(--s2);padding:0;display:grid;gap:10px}
.prose .dl-list li{margin:0;padding:0}
.prose .dl-list li::before{display:none}
.prose a.dl-item{display:flex;align-items:center;gap:14px;padding:14px 16px;
  border:1px solid var(--mist);border-radius:var(--r);background:#fff;
  text-decoration:none;color:var(--ink);transition:border-color .15s,background .15s}
.prose a.dl-item:hover{border-color:var(--teal);background:var(--cloud)}
.dl-ico{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:var(--r);background:var(--teal);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:.06em}
.dl-text{display:grid;gap:3px;min-width:0}
.dl-text strong{font-size:15px;font-weight:700;line-height:1.5}
.dl-text span{font-size:13px;color:var(--text-lt);line-height:1.7}
@media(max-width:560px){
  .prose a.dl-item{gap:12px;padding:12px 13px}
  .dl-ico{width:38px;height:38px;font-size:10px}
  .dl-text strong{font-size:14.5px}
}

/* 404 */
.nf-body{grid-template-columns:minmax(0,1fr)}
.nf-code{font-family:var(--num);font-size:60px;font-weight:700;color:var(--mist);
  line-height:1;margin:0 0 var(--s2)}
.prose .nf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
  margin:var(--s3) 0}
.prose a.nf-card{display:grid;gap:3px;padding:16px 18px;border:1px solid var(--mist);
  border-radius:var(--r);background:#fff;text-decoration:none;color:var(--ink);
  transition:border-color .15s,background .15s}
.prose a.nf-card:hover{border-color:var(--teal);background:var(--cloud)}
.nf-card strong{font-size:15px;font-weight:700}
.nf-card span{font-size:10.5px;letter-spacing:.08em;color:var(--teal-dark)}
@media(max-width:720px){.prose .nf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:430px){.prose .nf-grid{grid-template-columns:minmax(0,1fr)}}

/* 出産の申し込み flow, and the reception-hours pairs. */
.prose .flow{display:grid;gap:14px;margin:var(--s3) 0}
.flow-row{display:grid;grid-template-columns:230px 34px minmax(0,1fr);gap:0;align-items:center}
.flow-from{padding:20px 18px;border:1px solid var(--teal);border-radius:var(--r);
  background:var(--cloud);text-align:center}
.prose .flow-from p{margin:0;font-size:14.5px;font-weight:700;line-height:1.7;color:var(--ink)}
.flow-from span{font-weight:400;font-size:13.5px}
.flow-arrow{justify-self:center;width:26px;height:26px;border-radius:50%;background:var(--teal);
  position:relative}
.flow-arrow::after{content:"";position:absolute;top:50%;left:54%;transform:translate(-50%,-50%);
  border-left:8px solid #fff;border-top:5.5px solid transparent;border-bottom:5.5px solid transparent}
.flow-to{padding:20px 22px;border-radius:var(--r);background:var(--cloud);text-align:center}
.prose .flow-to p{margin:0 0 8px;font-size:14.5px;line-height:1.8}
.prose .flow-to p:last-child{margin-bottom:0}
.flow-head{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--teal-dark);
  line-height:1.6}
.flow-sub{font-size:13.5px;color:var(--text-lt)}
.prose .flow-to a{font-weight:700}
@media(max-width:760px){
  .flow-row{grid-template-columns:minmax(0,1fr);gap:8px;justify-items:stretch}
  .flow-arrow{transform:rotate(90deg)}
  .flow-from,.flow-to{padding:16px 15px}
  .flow-head{font-size:16.5px}
}
.prose .hoursdl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px var(--s3);
  margin:0 0 var(--s2);font-size:15px;line-height:1.9}
.prose .hoursdl dt{font-weight:700;white-space:nowrap;color:var(--ink)}
.prose .hoursdl dd{margin:0;font-family:var(--num);letter-spacing:.01em}