/* =========================================================
   01. Hero
   ========================================================= */

.top-hero__img {
  height: 55vh;
  min-height: 420px;
  max-height: 520px;
}

.top-hero__title {
  font-size: 1.25em;
}

.top-hero__note {
  font-size: 0.85em;
}

/* =========================================================
   02. Concept（SP）
   ========================================================= */

@media (max-width: 767px) {
  .top-concept {
    padding: 80px 20px;
  }

  .top-concept__title {
    text-align: center;
    letter-spacing: 0.05em;
  }

  .top-concept__title span::before {
    left: 50%;
    transform: translateX(-50%);
  }

  .top-concept__text {
    text-align: left;
    margin: 0 auto;
  }
}

/* =========================================================
    03) Designs（SP）
   ========================================================= */

.top-designs__list {
  grid-template-columns: 1fr; /* まず1カラム */
}

@media (min-width: 520px) {
  .top-designs__list {
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* SP横で2カラム */
  }
}

.top-designs__title {
  font-size: 1.6em;
  letter-spacing: 0.12em;
}

.top-designs__lead {
  font-size: 0.9em;
}

.top-designs__name {
  font-size: 0.95em;
}