/* ===== コンテンツの枠（参考：.contents._index は上 60px） ===== */
.contents { width: 100%; margin: 0 auto; padding: 0 0 60px; }
@media (min-width: 768px) { .contents { padding: 60px 0 100px; } }

/* ===== CONCEPT（参考：PC は 縦書きの本文｜六角形の写真｜縦書きの見出し） ===== */
.concept { width: 100%; margin: 0 auto 40px; padding-top: 50px; }
.concept__inner { display: flex; flex-wrap: wrap; padding: 0 20px; }
.concept__h { order: 2; width: 100%; margin-bottom: 30px; font-family: var(--f-serif); font-size: 1.8rem; line-height: 4rem; font-weight: 500; letter-spacing: .24rem; color: var(--ink); text-align: center; }
.concept__txt { order: 3; width: 100%; text-align: center; }
.concept__img { position: relative; order: 1; width: 100%; max-width: 511px; margin: 0 auto 20px; aspect-ratio: 511 / 314; }
.concept__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; border-radius: 8px; }
/* 写真のまわりの小さなきらめき（参考の写真の左右の飾り） */
.concept__spark { position: absolute; top: 4%; width: 13%; height: auto; color: var(--accent); opacity: .75; }
.concept__spark--l { left: -9%; }
.concept__spark--r { right: -9%; transform: scaleX(-1); top: 30%; }
@media (max-width: 767px) {
  .concept__img { width: 82%; }
}

@media (min-width: 768px) {
  .concept { max-width: var(--wrap); margin-bottom: 85px; padding-top: 0; }
  .concept__inner { flex-wrap: nowrap; justify-content: space-between; align-items: flex-start; padding: 0 40px 0 30px; }
  .concept__h, .concept__txt { width: auto; margin: 0; text-align: left; writing-mode: vertical-rl; }
  .concept__h { order: 3; height: 330px; font-size: 2.6rem; line-height: 5.4rem; }
  .concept__txt { order: 1; height: 300px; font-size: 1.4rem; line-height: 3.2rem; }
  .concept__img { order: 2; flex: 0 1 511px; width: 511px; height: 314px; margin: 0; aspect-ratio: auto; }
}
@media (min-width: 768px) and (max-width: 959px) {
  .concept__inner { padding: 0 10px; }
  .concept__img { flex-basis: 380px; height: 240px; }
  .concept__h { font-size: 2.2rem; line-height: 4.4rem; }
  .concept__txt { line-height: 2.8rem; }
}