@charset "UTF-8";
/* Shared header and footer from the 2026 Halloween special site. */
:root {
  --header:90px;
  --shell-serif:"Times New Roman","游明朝体","YuMincho","游明朝","Yu Mincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN W3",serif;
}
.event-header { position:fixed; z-index:1000; top:0; left:0; width:100%; height:var(--header); background:#fff; color:#000; }
.shell-logo { display:flex; align-items:center; justify-content:center; width:70px; height:90px; margin:0 auto; }
.shell-logo img { width:100%; height:auto; }
.shell-nav { display:none; }
.event-header a,.site-mobile-menu a { transition:opacity .3s ease-out; }
.event-header a:hover,.site-mobile-menu a:hover { opacity:.7; }
.shell-social-icon { display:block; width:auto; height:22px; }
.shell-menu-toggle { position:fixed; z-index:1001; top:24px; right:5%; width:35px; height:23px; padding:0; border:0; background:transparent; }
.shell-menu-toggle span { position:absolute; left:0; width:100%; height:2px; border-radius:4px; background:#000; }
.shell-menu-toggle span:nth-child(1) { top:0; }
.shell-menu-toggle span:nth-child(2) { top:10px; }
.shell-menu-toggle span:nth-child(3) { bottom:0; }
.site-mobile-menu { position:fixed; inset:0; width:100%; max-width:none; height:100%; max-height:none; margin:0; padding:110px 20px; border:0; background:rgba(0,0,0,.9); color:#fff; overflow:auto; overscroll-behavior:contain; }
.site-mobile-menu::backdrop { background:transparent; }
.site-mobile-menu[open] { display:block; }
.site-mobile-menu .shell-menu-toggle span { background:#fff; }
.site-mobile-menu .shell-menu-toggle span:nth-child(1) { transform:translateY(9px) rotate(-45deg); }
.site-mobile-menu .shell-menu-toggle span:nth-child(2) { transform:rotate(45deg); }
.site-mobile-menu .shell-menu-toggle span:nth-child(3) { opacity:0; }
.site-mobile-menu ul { position:relative; list-style:none; padding:0; margin:0; }
.site-mobile-menu li { display:flex; align-items:center; justify-content:center; margin:0; line-height:52px; text-align:center; font:300 18px/52px var(--shell-serif); }
.site-mobile-menu li a { display:inline-block; width:102px; padding:0; border-bottom:1px solid #fff; color:#fff; letter-spacing:2.5px; text-align:center; }
.site-mobile-menu li.shell-official { margin-top:30px; }
.site-mobile-menu li.shell-official a { width:auto; margin:0 8px; border-bottom:0; line-height:30px; }
.site-mobile-menu .shell-social-icon { filter:invert(1); }
.site-mobile-menu :focus-visible { outline-color:#fff; }
.attention-page #contents { margin:var(--header) auto 0; }
.event-footer { display:flow-root; position:relative; width:100%; padding:0; background:#fff; color:#000; font-family:"Noto Serif JP",serif; font-weight:300; }
.shell-page-top { text-align:center; width:100%; }
.shell-page-top a { display:block; width:100%; padding:10px 0; border-radius:20px 20px 0 0; background:#fff; line-height:20px; transition:background-color .3s ease-out; }
.shell-page-top img { display:inline-block; width:auto; height:20px; vertical-align:middle; }
.shell-copyright { width:100%; margin:20px auto; color:#000; text-align:center; font-size:12px; line-height:1; letter-spacing:2px; }
.shell-noscript { display:flex; flex-wrap:wrap; justify-content:center; gap:16px; padding:15px; font-size:14px; }
@media (min-width:900px) {
  :root { --header:130px; }
  .shell-logo { position:absolute; top:15px; left:50%; transform:translateX(-50%); width:100px; height:100px; margin:0; }
  .shell-menu-toggle { display:none; }
  .shell-nav { display:block; margin-top:50px; }
  .shell-nav ul { display:flex; align-items:center; justify-content:space-between; margin:0; padding:0; list-style:none; }
  .shell-nav li { display:flex; align-items:center; justify-content:center; width:19.5%; min-height:35px; border-right:2px solid #000; line-height:35px; }
  .shell-nav li.shell-center { width:22%; }
  .shell-nav li:last-child { border-right:0; }
  .shell-nav li a { display:block; color:#000; text-align:center; letter-spacing:3px; font:300 15px/35px var(--shell-serif); }
  .shell-nav li.shell-official a { display:inline-block; margin:0 5px; }
}
@media (min-width:870px) {
  .shell-page-top a { line-height:30px; }
  .shell-page-top a:hover { background:#eee; }
  .shell-page-top img { height:30px; }
}
@media (prefers-reduced-motion:reduce) {
  .event-header a,.site-mobile-menu a,.shell-page-top a { transition:none; }
}
