/* 神楽AYA｜スマホ画面の横揺れ防止 2026-11-12
   Restore a viewport-clipped root scrollport and constrain layout boxes.
   Preserve the precomposed Sakura hero, existing CTA hotspots, and desktop CSS.
*/
@media screen and (max-width: 760px) {
  html {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
  }
  body {
    position: relative;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
  }
  body > header.header,
  body > main,
  body > footer,
  main > section {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body > header.header,
  body > main,
  body > footer {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
  }
  .header .header-inner,
  main .container,
  footer .container {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: calc(100% - 28px) !important;
  }
  .header .navigation {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  main > section,
  #services,
  #individual-booking,
  #group-booking {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  img,
  video,
  iframe {
    max-width: 100%;
  }
  #services .ksc-category,
  #services .ksc-services-grid,
  #services .ksc-service-item,
  #individual-booking .pkr-form,
  #individual-booking .pkr-form-inner,
  #group-booking .booking-fields {
    min-width: 0 !important;
    max-width: 100% !important;
  }
}
@media screen and (max-width: 740px) {
  #top.hero {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    overflow: hidden !important;
    background-position: center top !important;
    background-size: 100% 100% !important;
  }
  #top.hero::before {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    transform: none !important;
  }
  #top.hero .hero-inner,
  #top.hero .hero-copy {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }
}