/* Shared header/footer appearance from the main Boon site. */
.site-header,.footer{--accent:#79c8df;--line:rgba(26,43,60,.18);font-family:"Noto Sans JP",sans-serif;font-size:16px;line-height:normal}
.site-header{top:0;left:0}
#main{padding-top:64px}
.site-header button{font:inherit}
.site-header a,.site-header button,.footer a{transition:color .2s,background-color .2s,border-color .2s,box-shadow .2s,transform .2s}
.site-header a:focus-visible,.site-header button:focus-visible,.site-header summary:focus-visible,.footer a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.footer .section-kicker{margin:0 0 18px;font:700 15px Outfit,sans-serif;letter-spacing:.15em}
.footer h2{margin:0;font-size:clamp(36px,4.3vw,66px);line-height:1.28;letter-spacing:.03em}
.footer .button{display:inline-flex;align-items:center;justify-content:normal;gap:32px;min-height:0;padding:15px 0;border:0;border-bottom:1px solid currentColor;background:none;font-size:16px;font-weight:700;line-height:normal}
.footer .button span{font-size:22px;transition:transform .2s}
.footer .button:hover{gap:38px}
.footer .button:hover span{transform:translateX(6px)}
.footer { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 360px); grid-template-areas: "kicker pages" "title pages" "copy pages" "button pages"; column-gap: clamp(56px, 12vw, 180px); min-height: 470px; padding: 115px 10vw 42px; background: var(--ink); color: #fff; }
.footer .section-kicker { grid-area: kicker; color: var(--accent); }
.footer h2 { grid-area: title; }
.footer > p:not(.section-kicker) { grid-area: copy; margin: 30px 0 0; color: rgba(255,255,255,.72); font-size: 16px; line-height: 1.9; }
.button-footer { grid-area: button; justify-self: start; margin-top: 32px; color: var(--accent); }
.button-footer:hover, .button-footer:focus-visible { color: #fff; }
.copyright { position: absolute; bottom: 38px; left: 50%; color: rgba(255,255,255,.58); font: 500 10px Outfit, sans-serif; transform: translateX(-50%); }
.copyright:hover, .copyright:focus-visible { color: var(--accent); transform: translate(-50%, -2px); }
.footer-pages { grid-area: pages; align-self: center; width: 100%; margin: 0; padding: 8px 0 8px 38px; border-left: 1px solid rgba(255,255,255,.24); }
.footer-pages p { margin: 0 0 15px; color: var(--accent); font: 700 15px Outfit, sans-serif; letter-spacing: .15em; }
.footer-page-list { display: grid; gap: 14px; }
.footer-page-list a, .footer-page-list span { color: rgba(255,255,255,.86); font-size: 15px; }
.footer-page-list a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.footer-page-list a:hover { color: var(--accent); }
.footer-page-list small { margin-left: 5px; color: rgba(255,255,255,.48); font-size: 11px; }
.footer-link-group + .footer-link-group { margin-top: 30px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.18); }
.footer-social { margin-top: 38px; padding-top: 27px; border-top: 1px solid rgba(255,255,255,.18); }
.footer-social > p { margin: 0 0 14px; color: var(--accent); font: 700 13px Outfit, sans-serif; letter-spacing: .15em; }
.footer-social-list { display: flex; gap: 10px; }
.footer-contact { margin-top: 30px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.18); }
.footer-contact p { margin: 0 0 14px; color: var(--accent); font: 700 13px Outfit, sans-serif; letter-spacing: .15em; }
.footer-contact a { display: block; width: fit-content; color: rgba(255,255,255,.86); font-size: 15px; line-height: 1.8; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.footer-contact a:hover, .footer-contact a:focus-visible { color: var(--accent); }
.footer-social-list a { position: relative; display: grid; width: 42px; height: 42px; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: transparent; transition: border-color .2s, background .2s, transform .2s; }
.social-icon { position: absolute; width: 18px; height: 18px; object-fit: contain; transition: opacity .2s; }
.social-icon--hover { opacity: 0; }
.footer-social-list a:hover, .footer-social-list a:focus-visible { border-color: #fff; background: #fff; outline: 0; transform: translateY(-3px); }
.footer-social-list a:hover .social-icon--default, .footer-social-list a:focus-visible .social-icon--default { opacity: 0; }
.footer-social-list a:hover .social-icon--hover, .footer-social-list a:focus-visible .social-icon--hover { opacity: 1; }

@media(max-width:760px){
#main{padding-top:68px}
.site-header { height: 68px; padding: 0 22px; }
.logo { position: relative; z-index: 12; gap: 7px; font-size: 22px; }
.logo img { width: 27px; height: 27px; }
.menu-toggle { position: relative; z-index: 12; display: flex; flex-direction: column; align-items: flex-end; gap: 5px; border: 0; background: none; color: #fff; cursor: pointer; }
.menu-toggle span { display: block; width: 24px; height: 1px; background: currentColor; }
.menu-toggle b { margin-top: 2px; font: 500 8px Outfit, sans-serif; letter-spacing: .1em; }
.site-header.is-scrolled .menu-toggle { color: var(--ink); }
.site-header.is-menu-open .menu-toggle { color: #fff; }
.site-header.is-scrolled.is-menu-open .menu-toggle { color: var(--ink); }
.main-nav { position: fixed; z-index: 11; top: 0; right: 0; left: 0; box-sizing: border-box; height: fit-content; max-height: 100dvh; flex-direction: column; align-items: flex-start; gap: 28px; padding: max(110px, calc(env(safe-area-inset-top) + 82px)) 36px max(36px, env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; background: var(--ink); font-size: 20px; opacity: 0; visibility: hidden; transition: .25s; }
.site-header.is-scrolled .main-nav { background: #fff; color: var(--ink); }
.main-nav.is-open { opacity: 1; visibility: visible; }
.nav-pages { width: 100%; padding-left: 0; border-left: 0; }
.nav-pages summary { width: fit-content; }
.nav-pages-list { position: static; min-width: 0; margin-top: 12px; padding: 0 0 0 16px; border: 0; border-left: 1px solid currentColor; background: transparent; box-shadow: none; color: inherit; }
.nav-pages-list a { color: inherit !important; font-size: 16px; }
.nav-pages-list a + a { border-top-color: currentColor; }
.nav-contact { margin-top: 10px; }
.footer h2 { font-size: 34px; }
.footer { display: block; min-height: 510px; padding: 85px 7vw 70px; }
.footer small { bottom: 25px; }
.footer-pages { margin-top: 38px; padding: 19px 0 0; border-top: 1px solid rgba(255,255,255,.24); border-left: 0; }
.footer-pages p { font-size: 14px; }
.footer-page-list { gap: 12px 18px; }
.footer-page-list a, .footer-page-list span { font-size: 14px; }
.footer .section-kicker{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.site-header a,.site-header button,.footer a,.footer .button span{transition:none}}