.photo-rally-parent, .photo-rally {
  position: relative;
  z-index: 1;
}
.momoka{
    text-align: right;
    margin-right: 5%;
}
@media screen and (max-width: 768px) {
    .momoka1{
        width: 60%;
    }
    
}
@media screen and (min-width: 769px) {
    .momoka1{
        width: 20%;
    }
    
}
.join{
    margin: 3rem 5%;
}
.join li{
    margin: 1rem 0;
    list-style-position: inside;
}
.qa-8 {
    margin: 2rem 5%;
    padding: 0;
}
.qa-8 dt {
    margin-bottom: 1em;
    color: #000000;
}

.qa-8 dt::before,
.qa-8 dd::before {
    margin-right: .4em;
}

.qa-8 dt::before {
    content: "Q.";
}

.qa-8 dd {
    margin: 0 0 2.5em;
    padding: 1em 1.5em;
    background-color: #f2f2f2;
    color: #000000;
}

.qa-8 dd::before {
    content: "A.";
}
.photo-rally{
    margin: 0 10%;
    width: 80%;
    border-radius: 10px;
}
.photo-rally-parent{
    text-align: right;
}
/*ここからスライドショー*/
  /* ====== カード全体 ====== */
  .slider {
    position: relative;
    width: min(100%, 1000px);
    margin: 5% 0 0 0;
    border-radius: 16px;
    overflow: hidden;                 /* 角丸に合わせて中身を切り抜く */
    box-shadow: 0 10px 24px rgba(0,0,0,.18);
    cursor: pointer;                  /* クリックで次へ */
    user-select: none;
    background: #000;                 /* 読み込み中の背景 */
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP", sans-serif;
    z-index: 100;
  }

  /* ====== 画像ステージ（16:9固定） ====== */
  .slider__stage {
    position: relative;
    aspect-ratio: 16 / 9;             /* 画像領域は常に16:9 */
    background: #000;
  }

  /* ====== 各スライド（フェード＋微ズーム） ====== */
  .slide {
    position: absolute; inset: 0;
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 480ms ease, transform 480ms ease;
    background-position: center;
    background-size: cover;           /* 余白なくフィット（必要に応じてトリミング） */
    background-repeat: no-repeat;
  }
  .slide.is-active {
    opacity: 1;
    transform: scale(1);
  }

  /* ====== キャプション ====== */
  .slider__caption {
  background: #101114;
  background-color: #fff;
  padding: 12px 16px;
  border-top: 1px solid rgba(255,255,255,.06);
  text-align: center;   /* ドットを中央揃え */
  z-index: 102;
  }
  .caption__text {
    font-size: 1rem;
    line-height: 1.6;
    letter-spacing: .2px;
    opacity: .92;
    transition: opacity 240ms ease;
  }
  .caption__text.is-fading {
    opacity: 0;
  }

  /* ====== インジケーター（任意） ====== */
  .dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 8px;   /* キャプション本文と少し離す */
  }
  .dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #bbb;
  opacity: .85;
  }
  .dot.is-active {   background: #000000;
  opacity: 1;}