/* ファーストビュー：弧を描く大きな見出し＋右下の短い文＋写真を寄せて並べる */
.fv {
  position: relative;
  padding-top: calc(var(--u) * 116);
  overflow-x: clip;
}
.fv__ttl { width: calc(var(--u) * 700); margin: 0 auto; }
.fv__arc { width: 100%; height: auto; overflow: visible; }
.fv__arc text {
  font-family: var(--f-jp);
  font-weight: 900;
  fill: var(--red);
  letter-spacing: -0.03em;
  font-feature-settings: "palt";
}
.fv__line1 { font-size: 66px; }
.fv__line2 { font-size: 68px; }

.fv__lead {
  position: absolute;
  top: calc(var(--u) * 357);
  left: calc(50% + var(--u) * 360);
  font-size: calc(var(--u) * 16);
  line-height: 1.45;
  letter-spacing: 0.08em;
}

.fv__photos {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(var(--u) * 40);
  width: calc(var(--u) * 1440);
  margin: calc(var(--u) * 28) 0 0;
  height: calc(var(--u) * 526);
}
.fv__col { flex: none; display: flex; flex-direction: column; gap: calc(var(--u) * 20); }
.fv__col img {
  width: 100%;
  object-fit: cover;
  border-radius: calc(var(--u) * 20);
}
.fv__col--edge { width: calc(var(--u) * 182); }
.fv__col--edge img { height: calc(var(--u) * 263); }
.fv__col--side { width: calc(var(--u) * 256); }
.fv__wide { height: calc(var(--u) * 167); }
.fv__sq { height: calc(var(--u) * 260); }
.fv__col--main { width: calc(var(--u) * 404); }
.fv__col--main img { height: calc(var(--u) * 526); object-position: 40% 50%; }
.fv__col:nth-child(1) img { object-position: 50% 50%; }
.fv__col:nth-child(5) img { object-position: 88% 50%; }

/* 左右の端の写真は画面の外へはみ出す（参考と同じ） */
.fv__photos { position: relative; left: 50%; translate: -50% 0; }

.fv__col:nth-child(1) { transition-delay: 0.3s; }
.fv__col:nth-child(2) { transition-delay: 0.15s; }
.fv__col:nth-child(4) { transition-delay: 0.15s; }
.fv__col:nth-child(5) { transition-delay: 0.3s; }

@media (min-width: 1440px) {
  .fv__photos { width: 1440px; }
}

@media (max-width: 1023px) {
  .fv { padding-top: 32px; }
  .fv__ttl { width: min(350px, 90vw); }
  .fv__lead {
    position: static;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.45;
    text-align: center;
  }
  .fv__photos {
    gap: 16px;
    width: 624px;
    height: 229px;
    margin-top: 32px;
  }
  .fv__col { gap: 8px; }
  .fv__col img { border-radius: 10px; }
  .fv__col--edge { width: 80px; }
  .fv__col--edge img { height: 115px; }
  .fv__col--side { width: 112px; }
  .fv__wide { height: 73px; }
  .fv__sq { height: 114px; }
  .fv__col--main { width: 176px; }
  .fv__col--main img { height: 229px; }
}
@media (min-width: 600px) and (max-width: 1023px) {
  .fv__ttl { width: 500px; }
  .fv__lead { font-size: 14px; }
  .fv__photos { width: 960px; height: 352px; gap: 24px; }
  .fv__col { gap: 12px; }
  .fv__col img { border-radius: 14px; }
  .fv__col--edge { width: 124px; }
  .fv__col--edge img { height: 178px; }
  .fv__col--side { width: 172px; }
  .fv__wide { height: 112px; }
  .fv__sq { height: 176px; }
  .fv__col--main { width: 270px; }
  .fv__col--main img { height: 352px; }
}