:root { color-scheme: light; --teal:#005e62; --cream:#fffbda; --yellow:#ffdc48; --orange:#ff8b3b; --page-width:375px; --scale:1; }
* { box-sizing:border-box; }
html { background:var(--teal); scroll-behavior:smooth; }
body { margin:0; min-width:0; overflow-x:hidden; background:var(--teal); color:#132c2d; font-family:Arial,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif; }
a { color:inherit; }
button { font:inherit; }
.site-main { min-height:100vh; }
.visual-flow { position:relative; width:var(--page-width); margin:0 auto; background:#fff; }
.art-segment,.notice-segment,.notice-gap,.faq-segment { position:relative; width:100%; overflow:hidden; }
.art-segment { height:var(--segment-height); }
.artwork { position:absolute; top:var(--art-top,0); left:0; display:block; width:var(--page-width); max-width:none; height:auto; pointer-events:none; user-select:none; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.skip-link { position:fixed; z-index:100; top:8px; left:8px; padding:10px 16px; transform:translateY(-150%); color:white; border-radius:30px; background:var(--teal); }
.skip-link:focus { transform:translateY(0); }
.hotspot { position:absolute; z-index:3; left:calc(48px * var(--scale)); width:calc(279px * var(--scale)); height:calc(48px * var(--scale)); border-radius:40px; outline-offset:3px; }
.hotspot:focus-visible { outline:3px solid #ff8b3b; box-shadow:0 0 0 5px #fff; }
.art-segment .hotspot { top:var(--hotspot-top); }
.hero-menu-hit { position:absolute; z-index:4; top:calc(14.74px * var(--scale)); left:calc(297.43px * var(--scale)); width:calc(34px * var(--scale)); height:calc(34px * var(--scale)); padding:0; border:0; background:transparent; cursor:pointer; }

/* PC sidebar artwork uses the exact source board coordinates. */
.desktop-menu { display:none; }
.mobile-menu-button { display:none; }
.sticky-cta { display:block; }
.menu-backdrop { position:fixed; z-index:29; inset:0; background:rgba(0,45,47,.62); }
.mobile-menu { position:fixed; z-index:30; top:0; right:0; width:calc(300px * var(--scale)); height:calc(440px * var(--scale)); overflow:hidden; transform:translateX(105%); transition:transform .25s ease; background:var(--cream); }
.mobile-menu.is-open { transform:translateX(0); }
.mobile-menu__art { display:block; width:100%; height:100%; }
.mobile-menu__close { position:absolute; z-index:3; top:calc(8px * var(--scale)); right:calc(8px * var(--scale)); width:calc(32px * var(--scale)); height:calc(32px * var(--scale)); border:0; border-radius:50%; background:rgba(255,255,255,.88); color:var(--teal); font-size:calc(22px * var(--scale)); line-height:1; }
.mobile-menu nav { position:absolute; top:calc(157.06px * var(--scale)); left:calc(13.81px * var(--scale)); display:grid; grid-template-rows:repeat(7,calc(21.72px * var(--scale))); width:calc(272.38px * var(--scale)); }
.mobile-menu nav a { display:block; overflow:hidden; color:transparent; font-size:0; text-decoration:none; }
body.menu-open { overflow:hidden; }
.sticky-cta { position:fixed; z-index:18; right:0; bottom:0; left:0; width:var(--page-width); height:calc(80px * var(--scale)); margin:auto; }
.sticky-cta img { display:block; width:100%; height:auto; }
.sticky-cta:focus-visible { outline:3px solid #fff; outline-offset:-5px; }

.notice-segment { overflow:visible; }
.art-window { position:relative; width:100%; height:calc(45.32px * var(--scale)); overflow:hidden; }
.notice-details { position:relative; z-index:2; margin-top:calc(-45.32px * var(--scale)); width:100%; }
.notice-details summary { position:relative; height:calc(45.32px * var(--scale)); padding:0; color:transparent; cursor:pointer; list-style:none; }
.notice-details summary::-webkit-details-marker { display:none; }
.notice-details summary::after { content:"+"; position:absolute; top:50%; right:calc(47px * var(--scale)); display:grid; width:calc(22px * var(--scale)); height:calc(22px * var(--scale)); place-items:center; border-radius:50%; background:#fff; color:var(--teal); font:400 calc(20px * var(--scale))/1 Arial,sans-serif; transform:translateY(-50%); }
.notice-details[open] summary::after { content:"−"; }
.notice-answer { width:calc(317px * var(--scale)); margin:0 auto 12px; padding:calc(14px * var(--scale)) calc(18px * var(--scale)); border:1px solid var(--teal); background:#fff; box-shadow:0 0 0 4px #fff; color:#222; font-size:calc(11px * var(--scale)); font-weight:600; line-height:1.8; }
.notice-gap { height:var(--segment-height); }

.faq-segment { overflow:visible; }
.faq-heading-art { position:relative; height:calc(167.43px * var(--scale)); overflow:hidden; }
.faq-heading-art img { position:absolute; top:calc(-10820.18px * var(--scale)); left:0; width:var(--page-width); height:calc(12717.4px * var(--scale)); }
.faq-list { position:relative; left:calc(37.5px * var(--scale)); display:flex; width:calc(300px * var(--scale)); flex-direction:column; gap:calc(20.24px * var(--scale)); }
.faq-row { position:relative; flex:none; height:calc(var(--row-height) * var(--scale)); overflow:hidden; background-repeat:no-repeat; background-size:var(--page-width) calc(12717.4px * var(--scale)); color:transparent; }
.faq-row:not([open]) { height:calc(56px * var(--scale)); }
.faq-row:not([open])::after { content:"⌄"; position:absolute; z-index:3; top:calc(15px * var(--scale)); right:calc(9px * var(--scale)); display:grid; width:calc(18px * var(--scale)); height:calc(20px * var(--scale)); place-items:center; background:#edf8f0; color:var(--teal); font:600 calc(15px * var(--scale))/1 Arial,sans-serif; }
.faq-row summary { position:absolute; z-index:2; inset:0 0 auto; display:block; height:calc(56px * var(--scale)); overflow:hidden; color:transparent; cursor:pointer; list-style:none; }
.faq-row summary::-webkit-details-marker { display:none; }
.faq-row .sr-only { color:var(--teal); }
.faq-answer-link { position:absolute; z-index:3; top:calc(83.49px * var(--scale)); left:calc(49.19px * var(--scale)); width:calc(190.2px * var(--scale)); height:calc(34.27px * var(--scale)); }
.faq-answer-link:focus-visible { outline:2px solid #005e62; outline-offset:1px; }
.faq-proceed { display:block; width:calc(277.7px * var(--scale)); height:calc(48px * var(--scale)); margin:calc(32.16px * var(--scale)) 0 0 calc(48.65px * var(--scale)); background-repeat:no-repeat; background-size:var(--page-width) calc(12717.4px * var(--scale)); }
.faq-tail-space { height:calc(72.34px * var(--scale)); }
.footer-segment .footer-logo { position:absolute; top:calc(45.33px * var(--scale)); left:calc(99.29px * var(--scale)); width:calc(176.42px * var(--scale)); height:calc(80px * var(--scale)); }
.footer-legal { position:absolute; top:calc(173.59px * var(--scale)); left:calc(113.95px * var(--scale)); display:grid; gap:calc(22px * var(--scale)); }
.footer-legal a { display:block; height:calc(15px * var(--scale)); color:transparent; font-size:0; }
.footer-legal a { width:calc(155px * var(--scale)); }

@media (min-width:1000px) {
  .desktop-menu { position:fixed; z-index:10; top:calc(150px * var(--scale)); left:calc(50% - 500px); display:block; width:calc(300px * var(--scale)); height:calc(405px * var(--scale)); color:transparent; }
  .desktop-menu__art { position:absolute; inset:0; width:100%; height:100%; }
  .desktop-menu__logo { position:absolute; top:calc(15px * var(--scale)); left:calc(10px * var(--scale)); width:calc(285px * var(--scale)); height:calc(50px * var(--scale)); }
  .desktop-menu nav { position:absolute; top:calc(98px * var(--scale)); left:calc(15px * var(--scale)); display:grid; grid-template-rows:repeat(7,calc(22px * var(--scale))); width:calc(272.4px * var(--scale)); }
  .desktop-menu nav a { display:block; overflow:hidden; color:transparent; background:transparent; font-size:0; text-decoration:none; }
  .desktop-menu__cta { position:absolute; left:calc(12.44px * var(--scale)); display:block; width:calc(277.7px * var(--scale)); height:calc(48px * var(--scale)); color:transparent; font-size:0; }
  .desktop-menu__cta--plan { top:calc(280.92px * var(--scale)); }
  .desktop-menu__cta--shop { top:calc(345.75px * var(--scale)); }
  .desktop-menu a:focus-visible { outline:3px solid #fff; outline-offset:3px; }
  .mobile-menu-button,.mobile-menu,.menu-backdrop,.sticky-cta,.hero-menu-hit { display:none; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.mobile-menu{transition:none} }