@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap");
/**
 * Swiper 12.2.0
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2026 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: May 27, 2026
 */
:root {
  --swiper-theme-color:#007aff;
}

:host {
  display: block;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}

.swiper {
  display: block;
  list-style: none;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  padding: 0;
  position: relative;
  z-index: 1;
}

.swiper-vertical > .swiper-wrapper {
  flex-direction: column;
}

.swiper-wrapper {
  box-sizing: initial;
  display: flex;
  height: 100%;
  position: relative;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
  width: 100%;
  z-index: 1;
}

.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper {
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

.swiper-horizontal {
  touch-action: pan-y;
}

.swiper-vertical {
  touch-action: pan-x;
}

.swiper-slide {
  display: block;
  flex-shrink: 0;
  height: 100%;
  position: relative;
  transition-property: -webkit-transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  width: 100%;
}

.swiper-slide-invisible-blank {
  visibility: hidden;
}

.swiper-autoheight, .swiper-autoheight .swiper-slide {
  height: auto;
}

.swiper-autoheight .swiper-wrapper {
  align-items: flex-start;
  transition-property: height, -webkit-transform;
  transition-property: transform, height;
  transition-property: transform, height, -webkit-transform;
}

.swiper-backface-hidden .swiper-slide {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
}

.swiper-3d.swiper-css-mode .swiper-wrapper {
  -webkit-perspective: 1200px;
          perspective: 1200px;
}

.swiper-3d .swiper-wrapper {
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.swiper-3d {
  -webkit-perspective: 1200px;
          perspective: 1200px;
  .swiper-cube-shadow, .swiper-slide {
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
  }
}

.swiper-css-mode {
  > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    &::-webkit-scrollbar {
      display: none;
    }
  }
  > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start;
  }
  &.swiper-horizontal {
    > .swiper-wrapper {
      -ms-scroll-snap-type: x mandatory;
          scroll-snap-type: x mandatory;
    }
    > .swiper-wrapper > .swiper-slide:first-child {
      -webkit-margin-start: var(--swiper-slides-offset-before);
              margin-inline-start: var(--swiper-slides-offset-before);
      scroll-margin-inline-start: var(--swiper-slides-offset-before);
    }
    > .swiper-wrapper > .swiper-slide:last-child {
      -webkit-margin-end: var(--swiper-slides-offset-after);
              margin-inline-end: var(--swiper-slides-offset-after);
    }
  }
  &.swiper-vertical {
    > .swiper-wrapper {
      -ms-scroll-snap-type: y mandatory;
          scroll-snap-type: y mandatory;
    }
    > .swiper-wrapper > .swiper-slide:first-child {
      -webkit-margin-before: var(--swiper-slides-offset-before);
              margin-block-start: var(--swiper-slides-offset-before);
      scroll-margin-block-start: var(--swiper-slides-offset-before);
    }
    > .swiper-wrapper > .swiper-slide:last-child {
      -webkit-margin-after: var(--swiper-slides-offset-after);
              margin-block-end: var(--swiper-slides-offset-after);
    }
  }
  &.swiper-free-mode {
    > .swiper-wrapper {
      -ms-scroll-snap-type: none;
          scroll-snap-type: none;
    }
    > .swiper-wrapper > .swiper-slide {
      scroll-snap-align: none;
    }
  }
  &.swiper-centered {
    > .swiper-wrapper:before {
      content: "";
      flex-shrink: 0;
      order: 9999;
    }
    > .swiper-wrapper > .swiper-slide {
      scroll-snap-align: center center;
      scroll-snap-stop: always;
    }
  }
  &.swiper-centered.swiper-horizontal {
    > .swiper-wrapper > .swiper-slide:first-child {
      -webkit-margin-start: var(--swiper-centered-offset-before);
              margin-inline-start: var(--swiper-centered-offset-before);
    }
    > .swiper-wrapper:before {
      height: 100%;
      min-height: 1px;
      width: var(--swiper-centered-offset-after);
    }
  }
  &.swiper-centered.swiper-vertical {
    > .swiper-wrapper > .swiper-slide:first-child {
      -webkit-margin-before: var(--swiper-centered-offset-before);
              margin-block-start: var(--swiper-centered-offset-before);
    }
    > .swiper-wrapper:before {
      height: var(--swiper-centered-offset-after);
      min-width: 1px;
      width: 100%;
    }
  }
}

.swiper-3d {
  .swiper-slide-shadow, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left, .swiper-slide-shadow-right, .swiper-slide-shadow-top {
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10;
  }
  .swiper-slide-shadow {
    background: rgba(0, 0, 0, 0.1490196078);
  }
  .swiper-slide-shadow-left {
    background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.5019607843), rgba(0, 0, 0, 0));
  }
  .swiper-slide-shadow-right {
    background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.5019607843), rgba(0, 0, 0, 0));
  }
  .swiper-slide-shadow-top {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5019607843), rgba(0, 0, 0, 0));
  }
  .swiper-slide-shadow-bottom {
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5019607843), rgba(0, 0, 0, 0));
  }
}

.swiper-lazy-preloader {
  border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
  border-radius: 50%;
  border-top: 4px solid rgba(0, 0, 0, 0);
  box-sizing: border-box;
  height: 42px;
  left: 50%;
  margin-left: -21px;
  margin-top: -21px;
  position: absolute;
  top: 50%;
  -webkit-transform-origin: 50%;
          transform-origin: 50%;
  width: 42px;
  z-index: 10;
}

.swiper-watch-progress .swiper-slide-visible, .swiper:not(.swiper-watch-progress) {
  .swiper-lazy-preloader {
    -webkit-animation: swiper-preloader-spin 1s linear infinite;
            animation: swiper-preloader-spin 1s linear infinite;
  }
}

.swiper-lazy-preloader-white {
  --swiper-preloader-color:#fff;
}

.swiper-lazy-preloader-black {
  --swiper-preloader-color:#000;
}

@-webkit-keyframes swiper-preloader-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
            transform: rotate(1turn);
  }
}

@keyframes swiper-preloader-spin {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
            transform: rotate(1turn);
  }
}
:root {
  --root-size: calc(100vw / 750);
}
@media screen and (min-width: 876px) {
  :root {
    --root-size: calc(750px / 750);
  }
}
:root {
  --color-text: #2c2c2c;
  --color-content-bg: #fdf4f1;
}

.is-hidden {
  overflow-y: hidden;
}

#content:has(.l-natsuasobi) {
  overflow: visible;
}

#colophon {
  position: relative;
  z-index: 1;
}

.l-natsuasobi {
  position: relative;
  color: var(--color-text);
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  line-height: 1.6;
  word-break: break-all;
}
.l-natsuasobi::after {
  content: "";
  display: block;
  background: url("../img/pc/bg.png") center center/cover no-repeat;
  position: fixed;
  inset: 0;
  z-index: -1;
}
@media only screen and (min-width: 876px) {
  .l-natsuasobi {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 750px minmax(0, 1fr);
    align-items: center;
    justify-content: center;
    overflow-x: clip;
  }
}
.l-natsuasobi :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, figure, dl, dd, dt) {
  margin: 0;
  padding: 0;
}
.l-natsuasobi :where(li) {
  list-style: none;
}
.l-natsuasobi img {
  display: block;
  width: 100%;
  height: auto;
}
.l-natsuasobi a {
  color: inherit;
  text-decoration: none;
}
.l-natsuasobi a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.l-natsuasobi__side {
  display: none;
}
@media only screen and (min-width: 876px) {
  .l-natsuasobi__side {
    display: flex;
    justify-content: center;
    height: 100%;
    z-index: 0;
  }
}
@media only screen and (min-width: 876px) {
  .l-natsuasobi__side-bg {
    position: sticky;
    top: 0;
    width: 585px;
    height: 100vh;
    flex: none;
  }
}
.l-natsuasobi .p-pcview__left,
.l-natsuasobi .p-pcview__right {
  position: absolute;
  inset: 0;
}
.l-natsuasobi .p-pcview__deco {
  position: absolute;
  left: 0;
  will-change: transform;
  -webkit-animation: pcview-drift var(--drift, 30s) linear infinite;
          animation: pcview-drift var(--drift, 30s) linear infinite;
  -webkit-animation-delay: var(--delay, 0s);
          animation-delay: var(--delay, 0s);
}
.l-natsuasobi .p-pcview__deco img {
  will-change: transform;
  -webkit-animation: pcview-sway var(--sway, 4s) ease-in-out infinite;
          animation: pcview-sway var(--sway, 4s) ease-in-out infinite;
}
.l-natsuasobi .p-pcview__left .p-pcview__deco-1 {
  top: 5%;
  width: 238px;
  --drift: 38s;
  --delay: -4s;
  --sway: 5.5s;
}
.l-natsuasobi .p-pcview__left .p-pcview__deco-2 {
  top: 23%;
  width: 153px;
  --drift: 30s;
  --delay: -19s;
  --sway: 4.2s;
}
.l-natsuasobi .p-pcview__left .p-pcview__deco-3 {
  top: 41%;
  width: 88px;
  --drift: 23s;
  --delay: -9s;
  --sway: 3.3s;
}
.l-natsuasobi .p-pcview__left .p-pcview__deco-4 {
  top: 58%;
  width: 210px;
  --drift: 34s;
  --delay: -26s;
  --sway: 4.8s;
}
.l-natsuasobi .p-pcview__left .p-pcview__deco-5 {
  top: 76%;
  width: 112px;
  --drift: 27s;
  --delay: -13s;
  --sway: 3.7s;
}
.l-natsuasobi .p-pcview__right .p-pcview__deco-1 {
  top: 7%;
  width: 160px;
  --drift: 32s;
  --delay: -6s;
  --sway: 4.4s;
}
.l-natsuasobi .p-pcview__right .p-pcview__deco-2 {
  top: 21%;
  width: 92px;
  --drift: 24s;
  --delay: -20s;
  --sway: 3.4s;
}
.l-natsuasobi .p-pcview__right .p-pcview__deco-3 {
  top: 35%;
  width: 129px;
  --drift: 29s;
  --delay: -12s;
  --sway: 4.0s;
}
.l-natsuasobi .p-pcview__right .p-pcview__deco-4 {
  top: 51%;
  width: 149px;
  --drift: 36s;
  --delay: -29s;
  --sway: 4.6s;
}
.l-natsuasobi .p-pcview__right .p-pcview__deco-5 {
  top: 67%;
  width: 119px;
  --drift: 26s;
  --delay: -3s;
  --sway: 3.6s;
}
.l-natsuasobi .p-pcview__right .p-pcview__deco-6 {
  top: 83%;
  width: 190px;
  --drift: 40s;
  --delay: -22s;
  --sway: 5.2s;
}
.l-natsuasobi__content {
  position: relative;
  z-index: 2;
  width: 100%;
  background-color: var(--color-content-bg);
  overflow: hidden;
}
@media only screen and (min-width: 876px) {
  .l-natsuasobi__content {
    width: 750px;
    margin: 0 auto;
  }
}
.l-natsuasobi .p-hero {
  position: relative;
  z-index: 3;
}
.l-natsuasobi .p-hero__bg {
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: calc(-14 / 750 * 100%);
  width: 100%;
  z-index: 0;
  pointer-events: none;
}
.l-natsuasobi .p-hero__bg img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-hero__kv {
  position: relative;
  z-index: 1;
}
.l-natsuasobi .p-hero__kv img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-hero__date {
  position: relative;
  z-index: 1;
  background-color: #e85298;
  display: flex;
  justify-content: center;
  align-items: center;
  height: calc(var(--root-size) * 68);
}
.l-natsuasobi .p-hero__date img {
  width: calc(var(--root-size) * 448);
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro {
  position: relative;
  z-index: 2;
  margin-top: calc(var(--root-size) * 85);
  padding: calc(var(--root-size) * 228) 0 calc(var(--root-size) * 292);
}
.l-natsuasobi .p-intro__bg-base {
  position: absolute;
  bottom: 0;
  left: 0;
  margin-bottom: calc(-14 / 750 * 100%);
  width: 100%;
  z-index: 0;
  pointer-events: none;
}
.l-natsuasobi .p-intro__bg-base img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__bg-burst {
  position: absolute;
  top: calc(var(--root-size) * -95);
  left: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
.l-natsuasobi .p-intro__bg-burst img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__deco-1 {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.l-natsuasobi .p-intro__deco-1 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__deco-2 {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.l-natsuasobi .p-intro__deco-2 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__deco-3 {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.l-natsuasobi .p-intro__deco-3 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__deco-4 {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.l-natsuasobi .p-intro__deco-4 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__deco-5 {
  position: absolute;
  z-index: 2;
  pointer-events: none;
}
.l-natsuasobi .p-intro__deco-5 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-intro__deco-1 {
  top: calc(var(--root-size) * 0);
  left: calc(50% + var(--root-size) * 131);
  width: calc(var(--root-size) * 177);
}
.l-natsuasobi .p-intro__deco-2 {
  top: calc(var(--root-size) * 186);
  left: calc(var(--root-size) * 11);
  width: calc(var(--root-size) * 129);
}
.l-natsuasobi .p-intro__deco-3 {
  top: calc(var(--root-size) * 481);
  left: calc(75% + var(--root-size) * 65.5);
  width: calc(var(--root-size) * 98);
}
.l-natsuasobi .p-intro__deco-4 {
  top: calc(var(--root-size) * 717);
  left: calc(var(--root-size) * 27);
  width: calc(var(--root-size) * 249);
}
.l-natsuasobi .p-intro__deco-5 {
  top: calc(var(--root-size) * 741);
  left: calc(50% + var(--root-size) * 164);
  width: calc(var(--root-size) * 186);
}
.l-natsuasobi .p-intro__text {
  position: relative;
  z-index: 3;
  color: #e85298;
  font-size: calc(var(--root-size) * 37);
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--root-size) * 32);
}
.l-natsuasobi .p-event {
  position: relative;
  z-index: 1;
  overflow: hidden;
  background-color: #f0ea0c;
}
.l-natsuasobi .p-event__deco-1, .l-natsuasobi .p-event__deco-2, .l-natsuasobi .p-event__deco-3 {
  position: absolute;
  pointer-events: none;
  z-index: 0;
}
.l-natsuasobi .p-event__deco-1 img, .l-natsuasobi .p-event__deco-2 img, .l-natsuasobi .p-event__deco-3 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-event__deco-1 {
  top: calc(var(--root-size) * 1147);
  left: calc(75% + var(--root-size) * 78.5);
  width: calc(var(--root-size) * 109);
}
.l-natsuasobi .p-event__deco-2 {
  top: calc(var(--root-size) * 3658);
  left: calc(var(--root-size) * -36);
  width: calc(var(--root-size) * 251);
}
.l-natsuasobi .p-event__deco-3 {
  top: calc(var(--root-size) * 5900);
  left: calc(75% + var(--root-size) * 32.5);
  width: calc(var(--root-size) * 155);
}
.l-natsuasobi .p-event__inner {
  position: relative;
  z-index: 1;
  padding-top: calc(var(--root-size) * 80);
  padding-bottom: calc(var(--root-size) * 120);
}
.l-natsuasobi .p-event__ttl {
  display: flex;
  justify-content: center;
  margin-bottom: calc(var(--root-size) * 56);
}
.l-natsuasobi .p-event__ttl img {
  width: calc(var(--root-size) * 471);
  height: auto;
}
.l-natsuasobi .p-event__cards {
  display: flex;
  flex-direction: column;
  gap: calc(var(--root-size) * 56);
  padding: 0 calc(var(--root-size) * 20);
}
.l-natsuasobi .p-event__card {
  position: relative;
}
.l-natsuasobi .p-event__card-bg {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-radius: calc(var(--root-size) * 20);
  z-index: 0;
}
.l-natsuasobi .p-event__card-thumb {
  position: relative;
  z-index: 1;
  padding: calc(var(--root-size) * 25) calc(var(--root-size) * 25) 0;
}
.l-natsuasobi .p-event__card-thumb img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-event__card-meta {
  position: relative;
  z-index: 1;
  padding-top: calc(var(--root-size) * 40);
  display: flex;
  flex-direction: column;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.l-natsuasobi .p-event__card-meta-row {
  display: flex;
  align-items: center;
  gap: calc(var(--root-size) * 16);
}
.l-natsuasobi .p-event__card-meta-row p {
  font-size: calc(var(--root-size) * 32);
  font-weight: 700;
  line-height: 1.8;
  white-space: nowrap;
  margin: 0;
}
.l-natsuasobi .p-event__card-meta-icon {
  flex-shrink: 0;
  display: block;
  width: auto;
  height: auto;
}
.l-natsuasobi .p-event__card-meta-note {
  padding-left: calc(29px + calc(var(--root-size) * 16));
  margin-bottom: calc(var(--root-size) * 4);
  font-size: calc(var(--root-size) * 20);
  font-weight: 700;
  line-height: 1;
  text-align: right;
  white-space: nowrap;
}
.l-natsuasobi .p-event__card-toggle {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: calc(var(--root-size) * 35) 0;
  background: transparent;
  border: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.l-natsuasobi .p-event__card-toggle img {
  width: calc(var(--root-size) * 37);
  height: auto;
  display: block;
  -webkit-transform: scaleY(-1);
          transform: scaleY(-1);
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.l-natsuasobi .p-event__card-toggle[aria-expanded=true] img {
  -webkit-transform: scaleY(1);
          transform: scaleY(1);
}
.l-natsuasobi .p-event__card-body {
  position: relative;
  z-index: 1;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}
.l-natsuasobi .p-event__card-body-inner {
  padding: 0 calc(var(--root-size) * 34) calc(var(--root-size) * 60);
}
.l-natsuasobi .p-event__card-desc {
  text-align: center;
  font-size: calc(var(--root-size) * 30);
  line-height: 1.9;
  margin-bottom: calc(var(--root-size) * 50);
}
.l-natsuasobi .p-event__card-desc p {
  margin: 0;
}
.l-natsuasobi .p-event__card--02 .p-event__card-desc {
  margin-bottom: calc(var(--root-size) * 2);
}
.l-natsuasobi .p-event__card-step-label {
  display: block;
  text-align: center;
  color: #e85298;
  font-size: calc(var(--root-size) * 32);
  font-weight: 700;
  line-height: 1.8;
  margin-bottom: calc(var(--root-size) * 20);
}
.l-natsuasobi .p-event__card-steps {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--root-size) * 40);
  margin-bottom: calc(var(--root-size) * 50);
}
.l-natsuasobi .p-event__card-step {
  display: flex;
  align-items: flex-start;
  gap: calc(var(--root-size) * 24);
}
.l-natsuasobi .p-event__card-step-num {
  flex-shrink: 0;
  width: calc(var(--root-size) * 50);
  height: calc(var(--root-size) * 50);
  border-radius: 50%;
  background: #e85298;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: calc(var(--root-size) * 34);
  font-weight: 900;
  line-height: 1;
}
.l-natsuasobi .p-event__card-step-text {
  font-size: calc(var(--root-size) * 30);
  line-height: 1.6;
}
.l-natsuasobi .p-event__card-step-text p {
  margin: 0;
}
.l-natsuasobi .p-event__card-gift {
  display: flex;
  flex-direction: column;
  gap: calc(var(--root-size) * 20);
  margin-bottom: calc(var(--root-size) * 50);
}
.l-natsuasobi .p-event__card-gift-row {
  font-size: calc(var(--root-size) * 26);
  line-height: 1.7;
}
.l-natsuasobi .p-event__card-gift-row p {
  margin: 0;
}
.l-natsuasobi .p-event__card-notes {
  font-size: calc(var(--root-size) * 25);
  color: #474747;
  line-height: 1.7;
}
.l-natsuasobi .p-event__card-notes p {
  margin: 0;
}
.l-natsuasobi .p-event__card-price {
  display: block;
  text-align: center;
  font-size: calc(var(--root-size) * 30);
  line-height: 1.6;
  margin-bottom: calc(var(--root-size) * 30);
}
.l-natsuasobi .p-event__card-subsection {
  margin-bottom: calc(var(--root-size) * 60);
}
.l-natsuasobi .p-event__card-subsection-ttl {
  width: calc(var(--root-size) * 600);
  margin: 0 auto calc(var(--root-size) * 28);
  text-align: center;
}
.l-natsuasobi .p-event__card-subsection-ttl::before, .l-natsuasobi .p-event__card-subsection-ttl::after {
  content: "";
  display: block;
  height: 2px;
  background-color: #2c2c2c;
}
.l-natsuasobi .p-event__card-subsection-ttl::before {
  margin-bottom: calc(var(--root-size) * 14);
}
.l-natsuasobi .p-event__card-subsection-ttl::after {
  margin-top: calc(var(--root-size) * 14);
}
.l-natsuasobi .p-event__card-subsection-name {
  color: #e85298;
  font-size: calc(var(--root-size) * 32);
  font-weight: 700;
  line-height: 1.8;
}
.l-natsuasobi .p-event__card-sublocation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--root-size) * 12);
  color: #e85298;
  font-size: calc(var(--root-size) * 26);
  line-height: 1.8;
  margin-bottom: calc(var(--root-size) * 20);
  width: calc(var(--root-size) * 600);
  margin-left: auto;
  margin-right: auto;
}
.l-natsuasobi .p-event__card-sublocation-icon {
  flex-shrink: 0;
  width: calc(var(--root-size) * 22);
  height: calc(var(--root-size) * 28);
}
.l-natsuasobi .p-event__card-sublocation-icon::before {
  content: "";
  width: 100%;
  height: 100%;
  background: url("../img/icon-map-pink.svg") 0 0/100% auto no-repeat;
  display: block;
}
.l-natsuasobi .p-event__card-sublocation--note {
  flex-direction: column;
  gap: calc(var(--root-size) * 4);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.l-natsuasobi .p-event__card-sublocation-row {
  display: flex;
  align-items: center;
  gap: calc(var(--root-size) * 12);
}
.l-natsuasobi .p-event__card-sublocation-note {
  align-self: stretch;
  text-align: right;
  color: var(--color-text);
  font-size: calc(var(--root-size) * 20);
  line-height: 1;
  white-space: nowrap;
}
.l-natsuasobi .p-event__card-sublocation p {
  margin: 0;
}
.l-natsuasobi .p-event__card-subdesc {
  text-align: center;
  font-size: calc(var(--root-size) * 30);
  line-height: 1.7;
  margin-bottom: calc(var(--root-size) * 28);
}
.l-natsuasobi .p-event__card-subdesc p {
  margin: 0;
}
.l-natsuasobi .p-event__card-comingsoon {
  display: block;
  color: #e85298;
  font-size: calc(var(--root-size) * 32);
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
  padding: calc(var(--root-size) * 20) 0 calc(var(--root-size) * 40);
}
.l-natsuasobi .p-related {
  background: #54C3F1;
  position: relative;
  z-index: 2;
}
.l-natsuasobi .p-related__bg-base {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 0;
  pointer-events: none;
  margin-top: calc(-14 / 750 * 100%);
}
.l-natsuasobi .p-related__bg-base img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-related__deco-1 {
  position: absolute;
  bottom: calc(var(--root-size) * 120);
  left: calc(var(--root-size) * -16);
  width: calc(var(--root-size) * 141);
  z-index: 0;
  pointer-events: none;
}
.l-natsuasobi .p-related__deco-1 img {
  width: 100%;
  height: auto;
  display: block;
}
.l-natsuasobi .p-related__ttl {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  padding-top: calc(var(--root-size) * 79);
  margin-bottom: calc(var(--root-size) * 31);
}
.l-natsuasobi .p-related__ttl img {
  width: calc(var(--root-size) * 471);
  height: auto;
}
.l-natsuasobi .p-related__bnrs {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(var(--root-size) * 24);
  padding-bottom: calc(var(--root-size) * 100);
}
.l-natsuasobi .p-related__bnr {
  width: calc(var(--root-size) * 630);
}
.l-natsuasobi .p-related__bnr a {
  display: block;
}
.l-natsuasobi .p-related__bnr img {
  width: 100%;
  height: auto;
  display: block;
}

@-webkit-keyframes pcview-drift {
  0% {
    -webkit-transform: translateX(-585px);
            transform: translateX(-585px);
    opacity: 0;
  }
  1% {
    opacity: 1;
  }
  99% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(585px);
            transform: translateX(585px);
    opacity: 0;
  }
}

@keyframes pcview-drift {
  0% {
    -webkit-transform: translateX(-585px);
            transform: translateX(-585px);
    opacity: 0;
  }
  1% {
    opacity: 1;
  }
  99% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(585px);
            transform: translateX(585px);
    opacity: 0;
  }
}
@-webkit-keyframes pcview-sway {
  0% {
    -webkit-transform: translateY(0) rotate(-3deg);
            transform: translateY(0) rotate(-3deg);
  }
  50% {
    -webkit-transform: translateY(-16px) rotate(3deg);
            transform: translateY(-16px) rotate(3deg);
  }
  100% {
    -webkit-transform: translateY(0) rotate(-3deg);
            transform: translateY(0) rotate(-3deg);
  }
}
@keyframes pcview-sway {
  0% {
    -webkit-transform: translateY(0) rotate(-3deg);
            transform: translateY(0) rotate(-3deg);
  }
  50% {
    -webkit-transform: translateY(-16px) rotate(3deg);
            transform: translateY(-16px) rotate(3deg);
  }
  100% {
    -webkit-transform: translateY(0) rotate(-3deg);
            transform: translateY(0) rotate(-3deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .p-pcview__deco,
  .p-pcview__deco img {
    -webkit-animation: none;
            animation: none;
  }
}