/* 02 말풍선 */
.empathy-section {
  background: transparent;
  box-shadow: none;
}

.empathy-stage {
  position: relative;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  overflow: hidden;
}

.empathy-bg {
  display: block;
  width: 100%;
  height: auto;
}

.empathy-bubble {
  position: absolute;
  height: auto;
  opacity: 0;
  transform: translateY(42px);
  transition: opacity 1.15s ease, transform 1.15s ease;
  will-change: opacity, transform;
}

.empathy-section.is-visible .bubble-1 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0s;
}

.empathy-section.is-visible .bubble-2 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.3s;
}

.empathy-section.is-visible .bubble-3 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.6s;
}

.empathy-section.is-visible .bubble-4 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.9s;
}

.empathy-section.is-visible .bubble-5 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 1.1s;
}

/* 공감 섹션 위치 재조정 */
.bubble-1 {
  top: 25%;
  left: 0%;
  width: 100%;
}

.bubble-2 {
  top: 33%;
  right: 0%;
  width: 100%;
}

.bubble-3 {
  top: 39%;
  left: 0%;
  width: 100%;
}

.bubble-4 {
  top: 46.5%;
  right: 0%;
  width: 100%;
}

.bubble-5 {
  top: 52%;
  left: 0%;
  width: 100%;
}

@media (max-width: 768px) {
  .bubble-1 {
    top: 25%;
    left: 0%;
    width: 100%;
  }

  .bubble-2 {
    top: 33%;
    right: 0%;
    width: 100%;
  }

  .bubble-3 {
    top: 39%;
    left: 0%;
    width: 100%;
  }

  .bubble-4 {
    top: 46.5%;
    right: 0%;
    width: 100%;
  }

  .bubble-5 {
    top: 52%;
    left: 0%;
    width: 100%;
  }
}