/* 기본 바탕 */
body, html {
  margin: 0; padding: 0;
  width: 100vw; height: 100vh;
  background-image: url('../jwh/Advertising/Ad_bg.jpg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  font-family: 'Noto Sans KR', sans-serif;
  user-select: none;
  position: relative;
  overflow: hidden;
  color: rgb(79, 37, 1);
}

/* 상단 좌측 텍스트 */
.header {
  position: absolute;
  top: 2vh;
  left: 2vw;
  font-size: 2.5vw;
  white-space: nowrap;
  user-select: text;
  color: rgb(79, 37, 1);
}
.header .back {
  cursor: pointer;
  margin-right: 1vw;
    text-decoration: none;
}
.header .text {
  font-weight: bold;
  font-size: 2.5vw;
  color: rgb(79, 37, 1);
}

/* 좌측 세로 회색 박스 */
.sidebar {
  position: absolute;
  top: 10vh;
  left: 2vw;
  width: 6vw;
  height: 35vh;
  background-color: rgba(249, 255, 126, 0.742);
  border-radius: 0.8vw;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  padding: 0.2vh 0;
}

/* 빨간 원 2개 */
.circle-img {
  width: 4.5vw;
  height: 4.5vw;
  border-radius: 50%;
  background-color: red; 
  object-fit: cover;
  cursor: pointer;
}

/* 중앙 큰 이미지 영역 */
.image-container {
  position: absolute;
  top: 10vh;
  left: 9vw;
  width: 38vw;
  height: 80vh;
  overflow: hidden;
  border-radius: 0.4vw;
  display: flex;
  justify-content: center;
  align-items: center;
}
.image-container img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  transition: opacity 0.5s ease;
}

/* 오른쪽 텍스트 영역 */
.text-area {
  position: absolute;
  top: 10vh;
  left: 49vw;
  width: 30vw;
  font-size: 1.2vw; /* ⭐️ 여기! 기존 2vw에서 1.7vw로 줄였어! ⭐️ */
  color: rgb(79, 37, 1);
  line-height: 1.4;
  user-select: text;
}
.text-area p {
  transition: opacity 0.5s ease;
}
.text-area p:first-child {
  font-weight: bold;
  margin-bottom: 1.5vh;
  font-size: 2.5vw; /* 제목은 그대로! */
}