body {
  margin: 0;
}

div {
  box-sizing: border-box;
}

img {
  width: 100%;
  height: 100%;
}

.wrap {
  width: 100%;
  display: inline-block;
  position: relative;
}

.image-wrapper {
  width: 100%;
  display: block;
}

button {
  cursor: pointer;
}

#divDogChange {
  position: absolute;
  top: 6.5%;
  left: 57%;
  width: 14.2%;
  height: 7.9%;
  z-index: 999;
}

#btnDogChange {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: none;
  border-radius: 8%;
}

#divCatChange {
  position: absolute;
  top: 6.5%;
  left: 71.5%;
  width: 14.5%;
  height: 7.9%;
  z-index: 999;
}

#btnCatChange {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: none;
  border-radius: 8%;
}

.gifButton {
  position: absolute;
  top: 19.1%;
  left: 57.65%;
  background-color: transparent;
  width: 22.4%;
}

.explainText6 {
  position: absolute;
  margin-top: 4.5%; /* 텍스트의 Y축 위치 */
  left: 3%; /* 텍스트의 X축 위치 */
  font-size: 0.8vw;
  line-height: 1.4;
  color: #333;
  font-family: 'pretendard', sans-serif;
  text-align: left; /* 텍스트를 왼쪽 정렬 */
}

.explainDetail {
  position: absolute;
  top: 87%;
  left: 25.5%;
  text-align: left;
}

.detailHead {
  /* margin-left: 0.5vw; */
  font-size: 1.3vw;
  font-weight: 550;
  font-family: 'pretendard', sans-serif;
  color: #2b2b2b;
  margin-bottom: 1vw;
}

.detailText {
  font-size: 0.9vw;
  font-family: 'pretendard', sans-serif;
  color: #2b2b2b;
  line-height: 1.5;
}

.nextText {
  margin-left: 0.65vw;
  font-size: 0.9vw;
  font-family: 'pretendard', sans-serif;
  color: #2b2b2b;
}
.floating_cta_fixed {
  width: 100%;
  bottom: 0;
  position: fixed;
  z-index: 9999; /* 항상 최상단에 노출 */
}
.floating_cta_fixed .cta-fixed-img {
  width: 100%;
  height: auto; /* 전역 img height:100% 상쇄 */
  display: block;
}

/* DOG 전용 롤링 이미지 (PC) */
#rolling-images {
  position: absolute;
  top: 9%;
  left: 16.05%;
  width: 31.5%;
  z-index: 12; /* dog-extra(10)보다 위, 하단 CTA(9999)보다 아래 */
}
#rolling-images .rolling_img {
  position: relative; /* 컨테이너 높이 계산을 위해 상대 배치 */
  width: 100%;
  height: auto;
  display: none;
}
#rolling-images .rolling_img.active {
  display: block;
}
#rolling-images .rolling_btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 7%;
  height: auto;
  cursor: pointer;
  z-index: 13;
}
#rolling-images .rolling_left_btn {
  left: 0%;
}
#rolling-images .rolling_right_btn {
  right: 0%;
}

.element-hide {
  display: none;
}

/* DOG 전용 추가 이미지 레이어 (PC) */
#context-dog-new,
#context-cat-new {
  display: none !important;
}
#dog-extra-images {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.dog-extra {
  position: absolute;
  z-index: 10;
  height: auto; /* 전역 img { height:100% } 상쇄 */
}
.left_top_banner {
  position: absolute;
  top: 7%;
  left: 6%;
}
.right_top_image {
  position: absolute;
  top: 4.3%;
  left: 56%;
  width: 31%;
}
.right_top_cta {
  position: absolute;
  top: 14.9%; /* right_top_image 바로 아래 */
  left: 56%;
  width: 31%;
}
.middle_top_image {
  position: absolute;
  top: 26%;
  left: 17.5%;
  width: 70%;
}
.central_image {
  position: absolute;
  top: 36.5%;
  left: 17.5%;
  width: 70%;
}
.bottom_image {
  position: absolute;
  top: 50%;
  left: 14.5%;
  width: 70%;
}
.bottom_image2 {
  position: absolute;
  top: 69%;
  left: 15%;
  width: 70%;
}