/* =============================================
出演者紹介
============================================= */


.cast__section{
  margin-top: 64px;
}

.cast__heading {
  position: relative;

  margin: 0 0 36px;
  padding-bottom: 12px;

  font-size: var(--fz24);

}

.cast__heading::after {
  content: "";

  position: absolute;
  bottom: 0;
  left: 0;

  width: 100%;
  height: 2px;


  background: linear-gradient(90deg, #FFC28D 0%, #FF8ED9 100%);
}

.cast__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px 18px;

  margin: 0;
  padding: 0;

  list-style: none;
}

.cast-day__item {
  min-width: 0;
}

/* メインMC */

.cast-main .cast__list{
  grid-template-columns: 1fr;
  align-items: center;

  width: calc(var(--sp-vw) * 240);
  max-width: 330px;
  margin: 0 auto;
}


@media (min-width: 641px) {
  .cast-day {
  }

  .cast__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 40px 24px;
  }

}

@media (min-width: 1025px) {
  .cast__section + .cast__section{
    margin-top: 80px;
  }

  .cast__list {
    grid-template-columns: repeat(5, 1fr);
    gap: 40px 24px;
  }

}


/* =====================================
   出演者カード
===================================== */

.cast-card {
  display: block;

  color: inherit;
  text-decoration: none;

  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
}

.cast-card__image {
  overflow: hidden;
  aspect-ratio: 80/101;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;

}

.cast-card__image-inner{
  position: relative;
  width: 100%;
  height: 100%;
  border-top-left-radius: 50cqi;
  border-top-right-radius: 50cqi;
  box-shadow: 4px 4px 12px 0 rgba(210, 181, 173, 0.20) inset;
  background: linear-gradient(165deg, #FFE8C3 4.41%, #FFD2E0 96.79%);
  overflow: hidden;
}

.cast-card__image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
}

.assigned-day{
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 2px 8px;
  font-size: var(--fz12);
  font-weight: 700;
  font-feature-settings: "palt";
  color: #D25F78;
  background: rgb(255 255 255 / 0.8);
  border-top-right-radius: 4px;
}

.cast-card__body {
  padding-top: 8px;

  text-align: center;
}

.cast-card__name {
  margin: 0;

  color: #333;
  font-size: var(--fz14);
  font-weight: 700;
  line-height: 1.4;
}

.cast-card__role {
  margin: 2px 0 0;

  color: #333;
  font-size: var(--fz11);
  line-height: 1.4;
}

.cast-card__segment{
  font-size: var(--fz11);
}

.cast-main .cast-card__role{
  font-size: var(--fz16);
}

.cast-main .cast-card__name{
  font-size: var(--fz20);
}

@media (min-width: 641px) {

  .assigned-day{
    font-size: var(--fz14);
  }

  .cast-card__name {
    font-size: var(--fz16);
  }
  .cast-card__role {
    font-size: var(--fz12);
  }
  .cast-card__segment{
    font-size: var(--fz12);
  }

  .cast-main .cast-card__role{
    font-size: var(--fz16);
  }

  .cast-main .cast-card__name{
    font-size: var(--fz20);
  }

}