/* TOP FV。共通の書体・ウェイトを先に定義し、PC/SPの寸法を分離。 */

.home-hero, .home-hero * {
  box-sizing: border-box;
}

.home-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: max(72rem, 48.333333333vw);
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 15.5rem 0 4rem;
}

.home-hero__visual {
  position: absolute;
  inset: 0;
  z-index: -1;
}

.home-hero__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-hero__copy {
  position: absolute;
  left: 3.5%;
  top: 25%;
  width: 58rem;
  color: #fff;
}

.home-hero__copy h1 {
  margin: 0;
}

.home-hero__copy h1 img {
  display: block;
  width: 100%;
  height: auto;
}

.home-hero__copy p {
  margin: 1.4rem 0 0 2rem;
  font-size: 2.2rem;
  font-weight: 500;
  line-height: 1.4;
}

/* 開館状況・天気・本日開催。書体とウェイトはPC/SP共通。 */
.hero-status {
  width: 40.4rem;
  border-radius: 2rem 0 0 2rem;
  overflow: hidden;
  background: #fff;
  font-size: 1.4rem;
}

.hero-status h2 {
  margin: 0;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
}

.hero-status__summary {
  padding: 1.8rem 3rem 2rem;
  color: #fff;
  background: linear-gradient(110deg, #005bac, #697fc4);
}

.hero-status__date-row {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  margin-top: 0.8rem;
}

.hero-status__badge {
  flex-shrink: 0;
  min-width: 11.8rem;
  padding: 0.7rem 0.8rem;
  border: 0.1rem solid #fff;
  border-radius: 0.4rem;
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
}

.hero-status time {
  font-weight: 400;
  display: flex;
  align-items: baseline;
  white-space: nowrap;
}

.hero-status__year {
  font-size: 2.2rem;
}

.hero-status time strong {
  font-size: 4.8rem;
  line-height: 1.1;
  font-weight: 700;
}

.hero-status__weekday {
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  margin-left: 0.5rem;
  border: 0.1rem solid currentColor;
  border-radius: 50%;
}

.hero-status__weather {
  margin-top: 1.2rem;
}

.hero-status__weather-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 0.8rem;
  white-space: nowrap;
}

.hero-status__weather-row > span:not(.hero-status__temperature) {
  align-self: flex-end;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1;
}

.hero-status__weather-icon {
  width: 5.6rem;
  height: 3.8rem;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.hero-status__temperature {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: 0.6rem;
  padding-left: 1.2rem;
  border-left: 0.1rem solid rgb(255 255 255 / 60%);
}

.hero-status__temperature img {
  width: 1.4rem;
  height: 3.8rem;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

.hero-status__temperature strong {
  /* FV確定時の個別書体。共通数字書体への変更は別途行う。 */
  font: 700 4.4rem/1 Arial, sans-serif;
}

.hero-status__temperature > span {
  align-self: flex-end;
  padding-bottom: 0.3rem;
  font-size: 1.8rem;
}

.hero-status__programs {
  padding: 2.2rem 2.8rem 5.4rem;
}

.hero-status__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  padding: 0;
  margin: 1.4rem 0 2.4rem;
  list-style: none;
  font-size: 1.2rem;
}

.hero-status__legend li {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.hero-status__legend img {
  width: 2.4rem;
  height: 2.6rem;
  object-fit: contain;
}

.hero-status__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 0.1rem solid #ccc;
  max-height: 31rem;
  overflow-y: auto;
}

.hero-status__list li {
  border-bottom: 0.1rem solid #ccc;
}

.hero-status__list a {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-height: 6.2rem;
  padding-block: 1rem;
  color: #000;
  text-decoration: none;
}

.hero-status__list a:hover {
  color: #005bac;
}

.hero-status__list img {
  flex-shrink: 0;
  width: 3.6rem;
  height: 3.6rem;
  object-fit: contain;
}

.hero-status__list a span {
  font-weight: 500;
  overflow-wrap: anywhere;
  line-height: 1.6;
}

.hero-status__empty {
  line-height: 1.8;
}

.hero-status__link {
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 20.4rem;
  min-height: 4rem;
  margin: 4.8rem auto 0;
  padding: 0.8rem 3.6rem 0.8rem 1.6rem;
  border: 0.1rem solid #005bac;
  border-radius: 9.9rem;
  color: #005bac;
  font-size: 1.2rem;
  text-decoration: none;
}

.hero-status__link > span {
  position: absolute;
  right: 0.5rem;
  display: grid;
  place-items: center;
  width: 2.8rem;
  height: 2.8rem;
  border-radius: 50%;
  background: #005bac;
  color: #fff;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0;
  line-height: 0;
}

.hero-status a:focus-visible {
  outline: 0.3rem solid #005bac;
  outline-offset: -0.3rem;
}

.hero-status__link > span::before {
  content: "";
  width: 0;
  height: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) translateX(0.15rem);
  border-top: 0.7rem solid transparent;
  border-bottom: 0.7rem solid transparent;
  border-left: 0.9rem solid #fff;
}

/* SP：件数に応じた自然な高さ。6件以上は一覧内でスクロール。 */
@media (max-width: 767.98px) {
  .home-hero {
    display: block;
    min-height: 0;
    padding: 37rem 1.8rem 0;
  }

  .home-hero__visual {
    bottom: auto;
    height: auto;
    aspect-ratio: 375 / 553;
  }

  .home-hero__copy {
    top: 14.5rem;
    left: 1.8rem;
    width: min(78%, 36rem);
  }

  .home-hero__copy h1 img {
    width: 100%;
  }

  .home-hero__copy p {
    margin: 1rem 0 0 1rem;
    font-size: 1.4rem;
    line-height: 1.2;
  }

  .hero-status {
    width: 100%;
    border-radius: 2rem;
    box-shadow: 0 0.2rem 0.8rem rgb(0 0 0 / 8%);
  }

  .hero-status h2 {
    font-size: 1.2rem;
  }

  .hero-status__summary {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 1rem 1.8rem 1.2rem;
  }

  .hero-status__date-row {
    gap: 0.4rem;
    margin-top: 0.6rem;
  }

  .hero-status__badge {
    width: 7.2rem;
    min-width: 7.2rem;
    padding: 0.5rem 0.4rem;
    border-radius: 0.2rem;
    font-size: 1.2rem;
    white-space: nowrap;
  }

  .hero-status__year {
    font-size: 1.1rem;
  }

  .hero-status time strong {
    font-size: 2.3rem;
  }

  .hero-status__weekday {
    width: 1.4rem;
    height: 1.4rem;
    margin-left: 0.2rem;
    font-size: .8rem;
  }

  .hero-status__weather {
    margin-top: 0;
  }

  .hero-status__weather-row {
    gap: 0.2rem;
    margin-top: 0.6rem;
    font-size: 1rem;
  }

  .hero-status__weather-row > span:not(.hero-status__temperature) {
    font-size: 1rem;
  }

  .hero-status__weather-icon {
    width: 3rem;
    height: 2.2rem;
  }

  .hero-status__temperature {
    gap: 0.1rem;
    margin-left: 0.3rem;
    padding-left: 0.4rem;
  }

  .hero-status__temperature img {
    margin-right: 0.3rem;
    width: 0.8rem;
    height: 2.2rem;
  }

  .hero-status__temperature strong {
  /* FV確定時の個別書体。共通数字書体への変更は別途行う。 */
    font-size: 2.2rem;
  }

  .hero-status__temperature > span {
    font-size: 1rem;
    padding-bottom: 0.1rem;
  }

  .hero-status__programs {
    height: auto;
    padding: 1.8rem 1.8rem 2.5rem;
  }

  .hero-status__legend {
    margin: 1.2rem 0 1.8rem;
    gap: 1rem 1.6rem;
    font-size: 1rem;
  }

  .hero-status__legend img {
    width: 2rem;
    height: 2.4rem;
  }

  .hero-status__list {
    max-height: 26.1rem;
    overflow-y: auto;
  }

  .hero-status__list a {
    min-height: 5.1rem;
    gap: 0.8rem;
    font-size: 1.2rem;
  }

  .hero-status__list img {
    width: 3rem;
    height: 3rem;
    object-fit: contain;
  }

  .hero-status__link {
    width: 17rem;
    min-height: 3.2rem;
    margin-top: 2.5rem;
    padding: 0.6rem 3.2rem 0.6rem 1.6rem;
    font-size: 1rem;
    line-height: 1.4;
  }

  .hero-status__link > span {
    width: 2.2rem;
    height: 2.2rem;
    right: 0.4rem;
  }

  .hero-status__link > span::before {
    border-top-width: 0.5rem;
    border-bottom-width: 0.5rem;
    border-left-width: 0.7rem;
  }
}

/* 既存の狭幅SP調整 */
@media (max-width: 359px) {
  .hero-status__summary {
    flex-wrap: wrap;
    padding-inline: 1rem;
    gap: 1rem;
  }

  .hero-status__weather {
    flex-basis: 100%;
  }

  .hero-status__temperature strong {
  /* FV確定時の個別書体。共通数字書体への変更は別途行う。 */
    font-size: 2rem;
  }
}

/* PC：カード高731px、1行タイトル5件。下部ボタンは残り領域の上下中央。 */
@media (min-width: 768px) {
  .hero-status__list a span {
    font-size: 1.5rem;
  }

  .hero-status {
    display: flex;
    flex-direction: column;
    height: 73.1rem;
  }

  .hero-status__summary {
    flex: 0 0 auto;
  }

  .hero-status__programs {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    padding-bottom: 0;
  }

  .hero-status__programs > h2,
    .hero-status__legend {
    flex-shrink: 0;
  }

  .hero-status__list {
    min-height: 0;
    flex: 0 0 auto;
    max-height: 31.1rem;
  }

  .hero-status__link {
    flex-shrink: 0;
    margin-top: auto;
    margin-bottom: auto;
    transition: color 180ms ease, background-color 180ms ease;
  }

  .hero-status__legend {
    margin-bottom: 1.4rem;
  }

  .hero-status__list li {
    box-sizing: border-box;
    border-bottom-width: 0.1rem;
  }

  .hero-status__list a {
    min-height: 6.1rem;
  }

  .hero-status__link > span {
    transition: background-color 180ms ease;
  }

  .hero-status__link > span::before {
    transition: border-left-color 180ms ease;
  }

  .hero-status__link:hover {
    background-color: #005BAD;
    color: #fff;
  }

  .hero-status__link:hover > span {
    background-color: #fff;
  }

  .hero-status__link:hover > span::before {
    border-left-color: #005BAD;
  }
}

/* ユーザー指定：フルード停止後のキャッチ幅 */
@media (min-width: 768px) and (max-width: 1011.111111px) {
  .home-hero__copy {
    width: 48rem;
  }
}

/* FV直下のお知らせ。PC/SP共通の書体・ウェイト。 */
.home-notice, .home-notice * {
  box-sizing: border-box;
}
.home-notice {
  padding: 5rem 5rem;
  color: #000;
  border-bottom: 1px solid #E5F8FE;
}
.home-notice__inner {
  display: flex;
  max-width: 110rem;
  margin-inline: auto;
}
.home-notice__meta {
  flex: 0 0 14rem;
  padding-right: 3rem;
}
.home-notice h2 {
  margin: 0 0 1.4rem;
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.4;
}
.home-notice time {
  font-size: 1.4rem;
  font-weight: 400;
}
.home-notice__content {
  flex: 1;
  min-width: 0;
  padding-left: 3rem;
  border-left: 1px solid #000;
  overflow-wrap: anywhere;
}
.home-notice h3 {
  margin: 0 0 1.4rem;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.6;
}
.home-notice__body {
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2;
}
.home-notice__body p {
  margin: 0 0 1em;
}
.home-notice__body > :last-child {
  margin-bottom: 0;
}
.home-notice__body a {
  color: #005BAD;
  text-decoration: underline;
}
@media (max-width: 767.98px) {
  .home-notice {
    padding: 3rem 1.8rem;
  }
  .home-notice__inner {
    display: block;
  }
  .home-notice__meta {
    display: flex;
    align-items: baseline;
    gap: 1.2rem;
    padding: 0 0 1rem;
  }
  .home-notice h2 {
    margin: 0;
    font-size: 2rem;
  }
  .home-notice time {
    font-size: 1.3rem;
  }
  .home-notice__content {
    border-left: 0;
    padding: 0;
  }
  .home-notice h3 {
    margin-bottom: .8rem;
    font-size: 1.7rem;
  }
  .home-notice__body {
    font-size: 1.5rem;
  }
}

/* TOPスライダー：1920pxでは画像387×261px、SP375pxでは287×193px。 */
.home-slider, .home-slider * {
  box-sizing: border-box;
}
.home-slider {
  padding: 10rem 0;
  background: #fff;
}
.home-slider__inner {
  position: relative;
  width: 84%;
  margin-inline: auto;
}
/* 枠の比率を固定し、比率違いは中央でトリミング。小さい画像も枠まで拡大。 */
.home-slider .swiper-slide a {
  display: block;
  aspect-ratio: 387 / 261;
  overflow: hidden;
}
.home-slider .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.home-slider .swiper-slide a:focus-visible {
  outline: 2px solid #005BAD;
  outline-offset: -2px;
}
@media (min-width: 768px) {
  .home-slider .swiper-slide a {
    transition: opacity 180ms ease;
  }
  .home-slider .swiper-slide a:hover {
    opacity: .7;
  }
}
.home-slider__prev, .home-slider__next {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 4.4rem;
  height: 4.4rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #005BAD;
  cursor: pointer;
  z-index: 1;
}
.home-slider__prev {
  right: calc(100% + 2.6rem);
}
.home-slider__next {
  left: calc(100% + 2.6rem);
}
.home-slider__prev::before, .home-slider__next::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2.6rem;
  height: 2.6rem;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
}
.home-slider__prev::before {
  transform: translate(-25%, -50%) rotate(-135deg);
}
.home-slider__next::before {
  transform: translate(-75%, -50%) rotate(45deg);
}
.home-slider__prev:focus-visible, .home-slider__next:focus-visible {
  outline: 2px solid #005BAD;
}
.home-slider .swiper-button-disabled {
  opacity: .35;
  cursor: default;
}
.home-slider .swiper-button-lock {
  display: none;
}
.home-slider__pagination {
  display: flex;
  justify-content: center;
  gap: .6rem;
  margin-top: 4rem;
  min-height: 1rem;
}
.home-slider__pagination .swiper-pagination-bullet {
  width: 1rem;
  height: 1rem;
  margin: 0;
  background: #e5e5e5;
  opacity: 1;
}
.home-slider__pagination .swiper-pagination-bullet-active {
  background: #005BAD;
}
@media (max-width: 767.98px) {
  .home-slider {
    padding: 7rem 0 6rem;
  }
  .home-slider__inner {
    width: calc(100% - 8.8rem);
  }
  .home-slider__prev {
    right: 100%;
  }
  .home-slider__next {
    left: 100%;
  }
  .home-slider__prev::before, .home-slider__next::before {
    width: 1.8rem;
    height: 1.8rem;
  }
  .home-slider__pagination {
    margin-top: 3rem;
  }
  .home-slider__pagination .swiper-pagination-bullet {
    width: .8rem;
    height: .8rem;
  }
}

/* TOPプログラムカレンダー。開催データ・リンクは既存のまま。 */
.home-calendar, .home-calendar * {
  box-sizing: border-box;
}
.home-calendar {
  padding: 0 5rem 10rem;
  color: #000;
}
.home-calendar__inner {
  max-width: 120rem;
  margin-inline: auto;
}
.home-calendar__heading {
  margin-bottom: 6rem;
}
.home-calendar__body {
  position: relative;
}
.home-calendar__legend {
  position: absolute;
  right: 0;
  bottom: calc(100% - 4rem);
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .6rem .4rem;
  width: 20.2rem;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #fff;
  font-size: 1.4rem;
  line-height: 1.4;
  font-weight: 700;
}
.home-calendar__legend li {
  padding: .5rem .3rem;
  border-radius: .4rem;
  text-align: center;
  white-space: nowrap;
}
.home-calendar__legend-closed {
  background: #005BAD;
}
.home-calendar__legend-temporary {
  background: #00B9EF;
}
.home-calendar__legend-event {
  background: #35B4D4;
}
.home-calendar__legend-theater {
  background: #687FC4;
}
.home-calendar__legend-kids {
  background: #E8B83F;
  grid-column: 1 / -1;
}
.home-calendar__link {
  margin: 7rem auto 0;
}
.home-calendar .fc {
  --fc-border-color: #d5d5d5;
  color: #000;
  font-size: 1.8rem;
}
.home-calendar .fc .fc-toolbar {
  position: relative;
  min-height: 4rem;
  margin-bottom: 2.4rem;
}
.home-calendar .fc .fc-toolbar-title {
  font-size: 3rem;
}
.home-calendar .fc .fc-toolbar-chunk:nth-child(2) {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.home-calendar .fc .fc-button {
  font-size: 1.6rem;
  padding: .6rem 1.2rem;
}
/* today：当月表示中は通常色、別月表示中は薄く表示する。 */


.home-calendar .fc .fc-col-header-cell-cushion {
  padding: .4rem;
}
.home-calendar .fc .fc-daygrid-day-number {
  padding: .6rem;
}
.home-calendar .fc .fc-daygrid-day-frame {
  min-height: 14rem;
}
.home-calendar .fc .fc-event {
  font-size: 1.4rem;
  border-radius: .4rem;
}

@media (max-width: 767.98px) {
  .home-calendar {
    padding: 0 1.8rem 7rem;
  }
  .home-calendar__heading {
    margin-bottom: 2.4rem;
  }
  .home-calendar__legend {
    position: static;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .4rem;
    width: auto;
    margin-bottom: 2.5rem;
    font-size: 1rem;
  }
  .home-calendar__legend li {
    padding: .4rem .8rem;
    border-radius: .3rem;
  }
  .home-calendar__link {
    margin-top: 3rem;
  }
  .home-calendar .fc {
    font-size: 1.3rem;
  }
  .home-calendar .fc .fc-toolbar {
    min-height: 2.4rem;
    margin-bottom: 1.4rem;
    justify-content: flex-start;
    gap: 1.6rem;
  }
  .home-calendar .fc .fc-toolbar-title {
    font-size: 1.8rem;
  }
  .home-calendar .fc .fc-toolbar-chunk:nth-child(2) {
    position: static;
    transform: none;
  }
  .home-calendar .fc .fc-button {
    padding: .3rem .6rem;
    font-size: 1.1rem;
  }
  .home-calendar .fc .fc-button .fc-icon {
    font-size: 1.4rem;
  }
  .home-calendar .fc .fc-daygrid-day-number {
    padding: .4rem .2rem;
  }
  .home-calendar .fc .fc-daygrid-day-frame {
    min-height: 9rem;
  }
  .home-calendar .fc .fc-event {
    font-size: 1rem;
  }
}

/* TOP新着情報。PCは見出し・ボタンを左、SPはボタンを記事の下へ。 */
.home-news, .home-news * {
  box-sizing: border-box;
}
.home-news {
  padding: 0 5rem 15rem;
  color: #000;
}
.home-news__inner {
  display: grid;
  grid-template-columns: 26rem minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  column-gap: 8rem;
  max-width: 120rem;
  margin-inline: auto;
}
.home-news__heading {
  grid-column: 1;
  grid-row: 1;
}
.home-news__articles {
  grid-column: 2;
  grid-row: 1 / 3;
  min-width: 0;
}
.home-news__link {
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  margin-top: 3.6rem;
}
.home-news .common-news-list__item:first-child {
  border-top: 0;
}
@media (min-width: 768px) {
  .home-news .common-news-list__item {
    position: relative;
    border-bottom: 0;
  }
  .home-news .common-news-list__item::after {
    content: '';
    position: absolute;
    left: 0;
    right: calc(-1 * max(5rem, (100vw - 120rem) / 2));
    bottom: 0;
    height: 1px;
    background: #ccc;
    pointer-events: none;
  }
}
@media (max-width: 767.98px) {
  .home-news {
    padding: 0 1.8rem 7rem;
  }
  .home-news__inner {
    display: flex;
    flex-direction: column;
  }
  .home-news__heading {
    margin-bottom: 2.4rem;
  }
  .home-news .common-news-list__item:first-child {
    border-top: 1px solid #ccc;
  }
  .home-news__link {
    align-self: center;
    margin-top: 3rem;
  }
}

@media (min-width: 768px) {
  .home-news .common-section-heading__title {
    /* 4文字＋3つの文字間を、一覧ボタンと同じ26rem幅に揃える。 */
    letter-spacing: calc((26rem - 4em) / 3);
    white-space: nowrap;
  }
}

/* SPの方眼はMV画像の下端から、お知らせ末尾まで連続させる。 */
.home-intro__grid {
  display: none;
}
@media (max-width: 767.98px) {
  .home-intro {
    position: relative;
    isolation: isolate;
  }
  .home-intro__grid {
    display: block;
    position: absolute;
    z-index: -1;
    top: calc(100vw * 553 / 375);
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
  }
  .home-intro .home-notice {
    background: transparent;
  }
}