@charset "UTF-8";

body.home .container,
body.front-page .container {
  padding-top: 0 !important;
}

body.home #header_wrap,
body.front-page #header_wrap {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(8px);
  opacity: 0;
  visibility: hidden;
  animation: none;
  transition:
    opacity 1s ease,
    visibility 0s linear 1s;
}

@media screen and (max-width: 1024px) {
  body.home #header_wrap,
  body.front-page #header_wrap {
    background: #fff;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@media screen and (min-width: 600px) and (max-width: 1024px) {
  .top_hero {
    min-height: 100svh;
  }

  .top_hero_media {
    height: 100svh;
    min-height: 100svh;
  }

  .top_hero_logo_layer {
    box-sizing: border-box;
    padding-bottom: 8svh;
  }
}

body.home.top-hero-ready #header_wrap,
body.front-page.top-hero-ready #header_wrap {
  opacity: 1;
  visibility: visible;
  transition:
    opacity 0.6s ease,
    visibility 0s linear 0s;
}

.top_contents {
  background: #fff;
  color: #2f2f2f;
}

.top_hero {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background: #fff;
}

.top_hero_logo_layer,
.top_hero_media {
  position: absolute;
  inset: 0;
}

.top_hero_logo_layer {
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  opacity: 1;
  visibility: visible;
}

.top_hero_logo {
  width: 400px;
  max-width: calc(100vw - 48px);
  opacity: 0;
  filter: blur(18px);
  transform: scale(1.1);
  transition:
    opacity 1.2s ease,
    filter 1.35s ease,
    transform 1.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.top_hero_media {
  z-index: 1;
  height: 100vh;
  min-height: 100vh;
  opacity: 1;
}

.top_hero.is-logo-visible .top_hero_logo {
  opacity: 1;
  filter: blur(0);
  transform: scale(1);
}

.top_hero.is-logo-hidden .top_hero_logo {
  opacity: 0;
  filter: blur(12px);
  transform: scale(0.96);
}

.top_hero.is-logo-hidden .top_hero_logo_layer {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 1.2s ease,
    visibility 0s linear 1.2s;
}

.top_about_area::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.36);
  pointer-events: none;
}

.top_hero_video,
.top_hero_swiper,
.top_hero_swiper .swiper-wrapper,
.top_hero_swiper .swiper-slide,
.top_hero_swiper picture,
.top_hero_swiper img {
  width: 100%;
  height: 100%;
}

.top_hero_video,
.top_hero_swiper img {
  display: block;
  object-fit: cover;
}

.top_hero_swiper .swiper-slide {
  overflow: hidden;
}

.top_hero_swiper img {
  transform: scale(1.03);
  transform-origin: center center;
  will-change: transform;
}

.top_banner_area {
  position: relative;
  overflow: hidden;
  padding: 14px 0 18px;
  background: #fff;
}

.top_banner_swiper {
  width: 90%;
  max-width: 1280px;
  margin: 0 auto;
  overflow: hidden;
}

.top_banner_swiper .swiper-wrapper {
  align-items: stretch;
}

.top_banner_swiper:not(.swiper-initialized) .swiper-wrapper {
  justify-content: center;
  gap: 12px;
}

.top_banner_swiper:not(.swiper-initialized) .top_banner_slide {
  flex: 0 0 calc((100% - 24px) / 3);
}

.top_banner_area-count-1
  .top_banner_swiper:not(.swiper-initialized)
  .top_banner_slide {
  flex-basis: min(100%, 420px);
}

.top_banner_area-count-2
  .top_banner_swiper:not(.swiper-initialized)
  .top_banner_slide {
  flex-basis: min(calc((100% - 12px) / 2), 420px);
}

.top_banner_link {
  position: relative;
  display: block;
  height: 0;
  padding-top: 37%;
  overflow: hidden;
  background: #eee;
  color: #fff;
  text-decoration: none;
}

.top_banner_link img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s ease;
}

.top_banner_link:hover img,
.top_banner_link:focus-visible img {
  transform: scale(1.04);
}

.top_banner_pagination {
  position: static;
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 16px;
}

.top_banner_swiper:not(.is-sliding) .top_banner_pagination {
  display: none;
}

.top_banner_pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  width: 5px;
  height: 5px;
  margin: 0;
  padding: 0;
  border: 0;
  background: #2f2f2f;
  opacity: 0.28;
  cursor: pointer;
}

.top_banner_pagination.swiper-pagination-bullets
  .swiper-pagination-bullet-active {
  opacity: 1;
}

@keyframes topHeroKenBurnsZoom {
  from {
    transform: scale(1.03);
  }

  to {
    transform: scale(1.12);
  }
}

@media (prefers-reduced-motion: reduce) {
  .top_hero_swiper.is-kenburns-running .swiper-slide img {
    animation: none;
    transform: scale(1.06);
  }
}

.top_hero_media_sp {
  display: none;
}

.top_section {
  padding: clamp(64px, 9vw, 110px) 0;
  background: #fff;
}

.top_banner_area + .top_section {
  padding-top: clamp(42px, 5.5vw, 72px);
}

.top_section_inner {
  display: grid;
  grid-template-columns: minmax(160px, 300px) minmax(0, 1fr);
  column-gap: clamp(30px, 6vw, 92px);
  width: 90%;
  max-width: 1280px;
  margin: 0 auto;
}

.top_section_title {
  margin: 0;
  font-family: 'Bebas Neue', 'Noto Sans JP', sans-serif;
  font-size: clamp(5.4rem, 8vw, 7.8rem);
  font-weight: 400;
  line-height: 0.92;
  letter-spacing: 0.02em;
}

.top_schedule_list,
.top_news_list {
  margin: 0;
  padding: 0;
  border-top: 1px solid #d9d4cb;
}

.top_schedule_item {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  min-height: 200px;
  padding: 8px 0;
  border-bottom: 1px solid #d9d4cb;
  color: inherit;
  text-decoration: none;
  overflow: hidden;
  transition: background-color 0.25s ease;
}

.top_schedule_item:hover,
.top_schedule_item:focus-visible {
  background: rgba(243, 239, 231, 0.55);
}

.schedule-reveal-ready .top_schedule_thumb {
  opacity: 0;
  filter: grayscale(100%);
  transform: translateX(-28px);
  transition:
    transform 1.2s cubic-bezier(0.16, 1, 0.3, 1),
    opacity 1.2s ease,
    filter 1.2s ease;
}

.schedule-reveal-ready .top_schedule_body {
  opacity: 0;
  transform: translateX(24px);
  transition:
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1) 0.08s,
    opacity 0.7s ease 0.08s;
}

.top_schedule_item.is-in .top_schedule_thumb {
  opacity: 1;
  filter: grayscale(0%);
  transform: translateX(0);
}

.top_schedule_item.is-in .top_schedule_body {
  opacity: 1;
  transform: translateX(0);
}

.top_schedule_thumb {
  width: 300px;
  height: 200px;
  overflow: hidden;
  background: #d8d5ce;
}

.top_schedule_thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.top_schedule_item:hover .top_schedule_thumb img,
.top_schedule_item:focus-visible .top_schedule_thumb img {
  transform: scale(1.045);
}

.top_schedule_body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  padding: 8px 28px 16px 42px;
}

.top_schedule_date {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  line-height: 1;
}

.top_schedule_date .schedule_event_month,
.top_schedule_date .schedule_event_day,
.top_schedule_date .schedule_event_sep {
  font-family: 'Bebas Neue', 'Noto Sans JP', sans-serif;
  line-height: 1;
}

.top_schedule_date .schedule_event_month,
.top_schedule_date .schedule_event_day {
  font-size: 4.8rem;
  letter-spacing: 0.03em;
}

.top_schedule_date .schedule_event_sep {
  color: #aaa;
  font-size: 2.8rem;
}

.top_schedule_date .schedule_event_week {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 8px;
  min-width: 46px;
  height: 20px;
  padding: 0 8px;
  background: #2f2f2f;
  color: #fff;
  font-family: 'Roboto', 'Noto Sans JP', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
}

.top_schedule_date .schedule_event_week-sat {
  background: #2d1fb3;
}

.top_schedule_date .schedule_event_week-sun,
.top_schedule_date .schedule_event_week-holiday {
  background: #b20f16;
}

.top_schedule_body h3 {
  margin: 0;
  color: #2f2f2f;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.06em;
}

.top_schedule_artists {
  margin: 0;
  color: #2f2f2f;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.02em;
}

.top_more {
  grid-column: 2;
  justify-self: end;
  margin: 8px 0 0;
  line-height: 0;
}

.top_button {
  margin: 0;
}

.top_button span {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.top_button_arrow {
  font-style: normal;
  line-height: 1;
}

.top_button-reverse {
  border-color: #fff !important;
  color: #fff !important;
}

.top_button-reverse::before {
  background: #fff !important;
}

.top_button-reverse:hover,
.top_button-reverse:focus-visible {
  color: #111 !important;
  border-color: #fff !important;
}

.top_button-reverse:hover span,
.top_button-reverse:focus-visible span {
  color: inherit !important;
}

.top_more .top_button {
  display: inline-block;
  vertical-align: top;
}

.top_more .top_button::before {
  inset: -1px;
}

.top_more a.top_button span {
  padding: 8px 18px 8px 20px;
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  line-height: 1.2;
}

.top_more .top_button:hover,
.top_more .top_button:focus-visible {
  color: #fff;
}

.top_about_area {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 360px;
  overflow: hidden;
  background: #fff;
}

.top_about_media {
  position: absolute;
  inset: 0;
}

.top_about_media video,
.top_about_media picture,
.top_about_media img {
  display: block;
  width: 100%;
  height: 100%;
}

.top_about_media video,
.top_about_media img {
  object-fit: cover;
}

.top_about_text {
  position: relative;
  z-index: 1;
  width: 90%;
  max-width: 780px;
  padding: 56px 0;
  color: #fff;
  text-align: center;
}

.top_about_text p {
  margin: 0 0 32px;
  font-size: clamp(2.1rem, 3vw, 3.2rem);
  font-weight: 300;
  line-height: 2;
  letter-spacing: 0.08em;
}

.top_about_text a {
  color: #fff;
}

.top_about_text a.button.top_button.scroll_reveal {
  transition:
    color 0.35s ease,
    border-color 0.35s ease,
    opacity 0.7s ease var(--scroll-reveal-delay, 0ms),
    transform 0.75s cubic-bezier(0.16, 1, 0.3, 1)
      var(--scroll-reveal-delay, 0ms);
}

@media (prefers-reduced-motion: reduce) {
  .top_about_text a.button.top_button.scroll_reveal {
    transition: none;
  }
}

.top_news_list {
  list-style: none;
}

.top_news_item {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid #ddd6cc;
}

.top_news_link {
  position: relative;
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 8px 24px;
  padding: 22px 8px 22px 0;
  color: inherit;
  text-decoration: none;
  overflow: hidden;
}

.top_news_link::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(243, 239, 231, 0.5);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.28s ease;
  pointer-events: none;
}

.top_news_item.is-link .top_news_link:hover::before,
.top_news_item.is-link .top_news_link:focus-visible::before {
  transform: scaleX(1);
}

.top_news_meta {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  grid-column: 1;
  grid-row: 1;
}

.top_news_meta .date {
  margin: 0;
}

.top_news_meta .date time {
  color: #2f2f2f;
  font-family: 'Bebas Neue', 'Noto Sans JP', sans-serif;
  font-size: 2rem;
  line-height: 1;
  letter-spacing: 0.04em;
}

.top_news_meta .news_archive_tag {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 0 8px;
  background: #565656;
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.top_news_meta .news_archive_tag-info {
  background: #2c3e50;
}

.top_news_meta .news_archive_tag-live {
  background: #b36b00;
}

.top_news_meta .news_archive_tag-staff {
  background: #5a4a7a;
}

.top_news_meta .news_archive_tag-release {
  background: #3e7c99;
}

.top_news_title {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

.top_access_section_inner {
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  align-items: start;
}

.top_access_heading {
  display: flex;
  flex-direction: column;
  gap: 26px;
}

.top_access_place {
  margin: 0 0 12px;
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.7;
}

.top_access_address {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.9;
  letter-spacing: 0.03em;
}

.top_access_address p {
  margin: 0;
}

.top_access_address a[x-apple-data-detectors],
.top_access_note a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  border-bottom: 0 !important;
}

.top_access_note {
  margin-top: 12px;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.8;
  letter-spacing: 0.03em;
}

.top_access_note p {
  margin: 0;
}

.top_access_map {
  min-height: 360px;
  background: #ddd8ce;
  overflow: hidden;
}

.top_access_map iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 520px;
  border: 0;
  filter: saturate(0.75);
}

@media screen and (max-width: 1024px) {
  .top_section_inner,
  .top_access_section_inner {
    grid-template-columns: 1fr;
  }

  .top_section_title {
    margin-bottom: 28px;
  }

  .top_access_heading {
    gap: 0;
  }

  .top_access_text {
    margin-bottom: 24px;
  }

  .top_more {
    grid-column: 1;
  }
}

@media screen and (max-width: 599px) {
  .top_hero_media_pc {
    display: none;
  }

  .top_banner_area {
    padding: 10px 0 18px;
  }

  .top_banner_swiper {
    width: 100%;
    max-width: none;
    min-width: 0;
    overflow: hidden;
  }

  .top_banner_swiper:not(.swiper-initialized) .swiper-wrapper {
    justify-content: flex-start;
    gap: 10px;
  }

  .top_banner_swiper:not(.swiper-initialized) .top_banner_slide {
    flex-basis: calc((100% - 10px) / 2);
  }

  .top_banner_area-count-1 .top_banner_swiper {
    width: calc(100% - 32px);
  }

  .top_banner_area-count-1
    .top_banner_swiper:not(.swiper-initialized)
    .top_banner_slide {
    flex-basis: 100%;
  }

  .top_banner_link {
    padding-top: 37%;
  }

  .top_banner_pagination {
    margin-top: 14px;
  }

  .top_hero_media_sp {
    display: block;
  }

  .top_hero {
    min-height: 100svh;
  }

  .top_hero_media {
    height: 100svh;
    min-height: 100svh;
  }

  .top_hero_logo {
    width: min(56vw, 280px);
  }

  .top_hero_video,
  .top_hero_swiper img {
    object-fit: cover;
  }

  .top_section {
    padding: 56px 0;
  }

  .top_section_title {
    font-size: 4.6rem;
  }

  .top_schedule_item {
    display: block;
    min-height: 0;
    padding: 12px 0 18px;
  }

  .top_schedule_body {
    gap: 8px;
    padding: 12px 0 0;
  }

  .top_schedule_thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }

  .schedule-reveal-ready .top_schedule_thumb {
    transform: translateX(-18px);
  }

  .schedule-reveal-ready .top_schedule_body {
    transform: translateX(18px);
  }

  .top_schedule_date .schedule_event_month,
  .top_schedule_date .schedule_event_day {
    font-size: 2.8rem;
  }

  .top_schedule_date .schedule_event_sep {
    font-size: 1.8rem;
  }

  .top_schedule_date .schedule_event_week {
    min-width: 34px;
    height: 16px;
    padding: 0 5px;
    font-size: 0.9rem;
  }

  .top_schedule_body h3 {
    font-size: 1.8rem;
    line-height: 1.45;
  }

  .top_schedule_artists {
    margin-top: 0;
    font-size: 1.2rem;
    line-height: 1.75;
  }

  .top_about_area {
    min-height: 240px;
  }

  .top_about_text {
    padding: 32px 0;
  }

  .top_about_text p {
    font-size: 1.7rem;
    line-height: 1.9;
  }

  .top_about_text a.button.top_button {
    display: block;
    width: fit-content;
    margin-right: auto;
    margin-left: auto;
  }

  .top_news_link {
    gap: 10px 14px;
    padding: 18px 18px 18px 0;
  }

  .top_news_meta .date time {
    font-size: 1.8rem;
  }

  .top_news_title {
    font-size: 1.4rem;
    line-height: 1.7;
  }

  .top_button span {
    padding: 12px 28px;
  }

  .top_more a.top_button span {
    padding: 8px 18px;
    font-size: 1.2rem;
  }

  .top_access_map,
  .top_access_map iframe {
    min-height: 260px;
  }
}
