/* ==========================================
   遍照尊院 LPスタイルシート
   ========================================== */

/* ------------------------------------------
   アンカーオフセット設定
   ------------------------------------------ */
.scroll-target {
  scroll-margin-top: 90px;
}

@media (min-width: 768px) {
  .scroll-target {
    scroll-margin-top: 120px;
  }
}

/* ------------------------------------------
   吹き出し - 左側
   ------------------------------------------ */
.speech-bubble-left[data-astro-cid-ipvp7mfx]:after {
  content: "";
  position: absolute;
  top: 50%;
  right: -12px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 12px solid #D4C469;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
}

.speech-bubble-left[data-astro-cid-ipvp7mfx]:before {
  content: "";
  position: absolute;
  top: 50%;
  right: -10px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 10px solid white;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  z-index: 1;
}

/* ------------------------------------------
   吹き出し - 右側
   ------------------------------------------ */
.speech-bubble-right[data-astro-cid-ipvp7mfx]:after {
  content: "";
  position: absolute;
  top: 50%;
  left: -12px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-right: 12px solid #D4C469;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
}

.speech-bubble-right[data-astro-cid-ipvp7mfx]:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -10px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-right: 10px solid white;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  z-index: 1;
}

/* ------------------------------------------
   吹き出し - 上側
   ------------------------------------------ */
.speech-bubble-top[data-astro-cid-ipvp7mfx]:after {
  content: "";
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translate(-50%);
  width: 0;
  height: 0;
  border-bottom: 12px solid #D4C469;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
}

.speech-bubble-top[data-astro-cid-ipvp7mfx]:before {
  content: "";
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translate(-50%);
  width: 0;
  height: 0;
  border-bottom: 10px solid white;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  z-index: 1;
}

/* ------------------------------------------
   アニメーション - フェードインスケール
   ------------------------------------------ */
.animate-fadeInScale[data-astro-cid-urydb7ya] {
  animation: fadeInScale .35s cubic-bezier(.33, 1, .68, 1);
}

.animate-fadeOutScale[data-astro-cid-urydb7ya] {
  animation: fadeOutScale .3s cubic-bezier(.33, 1, .68, 1);
}

.animate-backdrop-blur-in[data-astro-cid-urydb7ya] {
  animation: backdropFadeIn .35s cubic-bezier(.33, 1, .68, 1) forwards,
             backdropBlurIn .35s cubic-bezier(.33, 1, .68, 1) forwards;
  backdrop-filter: blur(6px);
}

.animate-backdrop-blur-out[data-astro-cid-urydb7ya] {
  animation: backdropFadeOut .3s cubic-bezier(.33, 1, .68, 1) forwards,
             backdropBlurOut .3s cubic-bezier(.33, 1, .68, 1) forwards;
}

@keyframes fadeInScale {
  0% {
    opacity: 0;
    transform: scale(.96) translateY(30px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

@keyframes fadeOutScale {
  0% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
  to {
    opacity: 0;
    transform: scale(.96) translateY(30px);
  }
}

/* ------------------------------------------
   アニメーション - cgksppug
   ------------------------------------------ */
.animate-fadeInScale[data-astro-cid-cgksppug] {
  animation: fadeInScale .35s cubic-bezier(.33, 1, .68, 1);
}

.animate-fadeOutScale[data-astro-cid-cgksppug] {
  animation: fadeOutScale .3s cubic-bezier(.33, 1, .68, 1);
}

@keyframes backdropBlurIn {
  0% {
    backdrop-filter: blur(0px);
  }
  to {
    backdrop-filter: blur(6px);
  }
}

@keyframes backdropBlurOut {
  0% {
    backdrop-filter: blur(6px);
  }
  to {
    backdrop-filter: blur(0px);
  }
}

@keyframes backdropFadeIn {
  0% {
    background-color: #0000;
  }
  to {
    background-color: #00000080;
  }
}

@keyframes backdropFadeOut {
  0% {
    background-color: #00000080;
  }
  to {
    background-color: #0000;
  }
}

.animate-backdrop-blur-in[data-astro-cid-cgksppug] {
  animation: backdropFadeIn .35s cubic-bezier(.33, 1, .68, 1) forwards,
             backdropBlurIn .35s cubic-bezier(.33, 1, .68, 1) forwards;
  backdrop-filter: blur(6px);
}

.animate-backdrop-blur-out[data-astro-cid-cgksppug] {
  animation: backdropFadeOut .3s cubic-bezier(.33, 1, .68, 1) forwards,
             backdropBlurOut .3s cubic-bezier(.33, 1, .68, 1) forwards;
}