@charset "UTF-8";
/*  상품 상세 페이지 스타일 파일입니다. */
.product-summary {
  width: 100%;
}
.product-summary__title-wrap {
  margin-top: 0px;
  padding-bottom: 0px;
}
.product-summary__brand-name {
  font-family: Pretendard;
  font-size: 17px;
  font-weight: 400;
  line-height: 20.4px;
  letter-spacing: -0.04em;
  text-align: left;
  margin-bottom: 12px;
  color: var(--gray002);
  display: -webkit-box;
  -webkit-line-clamp: 1; /* 원하는 줄 수 설정 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.product-summary__title {
  color: var(--secondary);
  font-family: Pretendard;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 120%; /* 48px */
  letter-spacing: 0.2px;
  margin-top: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 원하는 줄 수 설정 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.product-summary__promotion-text {
  font-family: Pretendard;
  font-size: 18px;
  font-weight: 400;
  line-height: 21.6px;
  letter-spacing: -0.04em;
  text-align: left;
  margin-top: 0px;
  color: var(--gray002);
  margin-top: 10px;
}
.product-summary__price-detail {
  margin-top: 13px;
  display: flex;
  flex-direction: row;
  gap: 9px;
  align-items: flex-end;
  border-bottom: 1px solid #000;
  padding-bottom: 18px;
}

.product-summary__price-detail .discount {
  height: 26px;
  padding-left: 6px;
  padding-right: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #00a9a9;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.06px;
  border-radius: 5px;
  background: #e3fffc;
}

.product-summary__price-detail .real-price {
  color: #666;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 16.8px */
  letter-spacing: 0.07px;
  text-decoration-line: line-through;
}
.product-summary__original-price {
  color: var(--gray002);
  text-align: center;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
  text-decoration: line-through;
}
.product-summary__original-price span {
  font-family: Pretendard;
  font-size: 22px;
  font-weight: 300;
  line-height: 26.4px;
  letter-spacing: -0.04em;
  text-align: left;
}
.product-summary__price {
  font-family: Pretendard;
  font-size: 30px;
  font-weight: 500;
  line-height: 38.4px;
  letter-spacing: -0.04em;
  text-align: left;
}
.product-summary__price span {
  font-family: Pretendard;
  font-size: 32px;
  font-weight: 300;
  line-height: 38.4px;
  letter-spacing: -0.04em;
  text-align: left;
}
.product-summary dl {
  border: none;
  padding: 0;
}
.product-summary dl dt {
  color: var(--secondary);
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
}
.product-summary dl dd {
  color: var(--gray002);
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
}
.product-summary__purchase-option .quantity-box {
  width: 100%;
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #e1e1e1;
  padding: 18px 0px;
  gap: 14px;
}
.product-summary__purchase-option .quantity-box .quantity__label {
  width: 100%;
  max-width: 100%;
  color: var(--secondary);
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
}
.quantity__label {
  padding-right: 24px;
}
.quantity.quantity-box.undeletable .quantity__label {
  padding-right: 0px;
}
.product-summary__purchase-option .quantity-box .quantity__content {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  margin: 0;
}

.counter {
  height: 30px;
  background-color: #f6f6f6 !important;
  width: 100px;
}

.counter .minus {
  border-radius: 5px;
  background-color: #e1e1e1;
  border: 0;
  background-image: url("/assets/images/icons/icon_minus.svg");
  background-repeat: no-repeat;
  background-position: center;
}

.counter .plus {
  border-radius: 5px;
  background-color: var(--black);
  border: 0;
  background-image: url("/assets/images/icons/icon_plus.svg");
  background-repeat: no-repeat;
  background-position: center;
}
.counter button {
  width: 18px;
  height: 18px;
}
.counter input {
  color: #29292e;
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
  text-align: center;
  padding: 0;
}
.quantity__content__price {
  color: var(--secondary);
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
}
.quantity__content__price span {
  font-family: Pretendard;
  font-size: 18px;
  font-weight: 300;
  line-height: 21.48px;
  letter-spacing: -0.04em;
  text-align: right;
  padding-bottom: 3px;
  padding-left: 5px;
}
.purchase__like-btn {
  width: 50px;
  height: 50px;
  border: none;
}
.purchase__like-btn.is-active svg {
  fill: var(--gray003);
}

.gift-btn-wrap {
  width: 50px;
  height: 50px;
}

.sc-gift-button {
  stroke-width: 2;
}

#main-tabs {
  position: sticky;
  top: 0;
  background-color: white;
  z-index: 15;
}

.product-tabs {
  background-color: white;
  width: 100%;
  display: flex;
  flex-direction: row;
  padding-top: 20px;
  margin-top: 80px;
  margin-bottom: 50px;
}
.product-tabs-item {
  width: 25%;
  border-bottom: 1px solid var(--gray001);
  border-bottom: 2px solid var(--gray001);
}
.product-tabs-item.active {
  border-color: var(--black) 2px solid;
}
.product-tabs-item.active a {
  color: var(--black);
  font-weight: 700;
}
.product-tabs-item a {
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 21.6px */
  letter-spacing: 0.09px;
  color: var(--gray002);
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding-bottom: 20px;
}
.thumb-box-wrap .swiper {
  width: calc(100% - 144px);
}
.thumb-box .thumb-item {
  margin-top: 0;
}
.thumb-box-wrap {
  margin-top: 0;
}
.thumb-box .thumb-item__img {
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  border-radius: 6px;
}
.thumb-box .thumb-item__img img {
  border-radius: 6px;
}
.thumb-box .thumb-item__info {
  margin-top: 18px;
}
.thumb-box .thumb-item__info-name {
  width: 100%;
  height: 36px;
  font-family: Pretendard;
  font-size: 15px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
  color: var(--color-base-black);
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 원하는 줄 수 설정 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.thumb-box .thumb-item__info-price {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 15px;
}
.thumb-item__info-price .origin-price {
  font-family: Pretendard;
  font-size: 15px;
  font-weight: 400;
  line-height: 18px;
  text-align: left;
  text-decoration: line-through;
  color: var(--gray002);
  margin-right: 6px;
}
.thumb-item__info-price .current-price {
  font-family: Pretendard;
  font-size: 20px;
  font-weight: 700;
  line-height: 23.87px;
  text-align: right;
  color: var(--color-point-red) !important;
}
.thumb-item__info-price .current-price span {
  font-family: Pretendard;
  font-size: 13px;
  font-weight: 400;
  line-height: 15.51px;
  text-align: left;
}

.product-detail {
  width: 1200px;
  padding-top: 80px;
  padding-bottom: 100px;
  margin: auto;
}
.product-detail img[shopby-lazy] {
  height: 300px;
}
.product-detail img {
  display: inline;
}
.product-detail em {
  font-style: normal;
}
.product-detail .product-review-list {
  border-top: 1px solid var(--color-base-black);
}
.product-review-list-header {
  display: flex;
  flex-direction: row;
  border-bottom: 1px solid var(--gray002);
  padding: 18px 0;
}
.product-review-list-header div {
  font-family: Pretendard;
  font-size: 16px;
  font-weight: 500;
  line-height: 19.2px;
  text-align: left;
  color: var(--color-base-black);
}
.product-review__no {
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.product-review__reply {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.product-review__title {
  width: 650px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.product-review__date {
  width: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.product-review__register {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.product-detail .pagination {
  margin-top: 80px;
}
.product-detail .thumbs-btn {
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}
.product-detail .product-info {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  align-items: flex-start;
  gap: 100px;
}
.product-detail .product-info img {
  object-fit: cover;
}
.product-detail .product-info .thumb-item {
  width: 510px;
}
.product-detail .product-info .thumb-item__main {
  display: flex;
  align-items: center;
  flex-direction: row;
  flex-direction: column;
}
.product-detail .product-info .thumb-item__main .product-image-slider {
  width: 100%;
}
.product-detail .product-info .thumb-item__main-img {
  width: 510px;
  height: 560px;
  border-radius: 10px;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
}
.product-detail .product-info .thumb-item__main-img img {
  width: auto;
  height: 70%;
}
.product-detail .product-info .thumb-item__sub {
  margin-top: 12px;
}
.product-detail .product-info .thumb-item__sub .thumb-item__sub-img {
  width: 130px;
  height: 130px;
  border: 1px solid var(--gray001);
  cursor: pointer;
  user-select: none;
}
.product-detail .product-info .thumb-item__sub .thumb-item__sub-img img {
  width: 100%;
  height: 100%;
}
.product-detail .tabs-wrap {
  margin-top: 123px;
  position: sticky;
  top: 0;
  z-index: 5;
}
.product-detail .tab {
  width: 100%;
}
.product-detail .tab li {
  width: 100%;
}
.product-detail .tab li .tab__btn {
  width: 100%;
}
.product-detail .tab a {
  text-decoration: none;
  color: unset;
}
.product-detail .product-content__content-box {
  margin-top: 60px;
  padding: 0 95px;
}
.product-detail .product-content__info-box {
  margin-top: 60px;
}
.product-detail .product-content__info-box.product-review {
  /* margin-top: 80px; */
}
.product-detail .product-content__info-box.duty-info,
.product-detail .product-content__info-box.certification-info {
  margin-top: 80px;
}
.product-detail .product-content__empty-content {
  text-align: center;
}
.product-detail .product-content__title {
  font-size: 24px;
  font-weight: 700;
}
.product-detail .product-content__title-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  padding-bottom: 20px;
}
.product-detail .product-content__title-container div:first-child {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}
.product-detail .product-content__title-container div:first-child:first-child {
  gap: 10px;
}
.product-detail .product-content__info-description {
  border: 1px solid var(--gray001);
  margin-top: 20px;
  padding: 40px;
  font-size: 18px;
}
.product-detail .product-content__info > dl {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  font-size: 18px;
}
.product-detail .product-content__info > dl > dt,
.product-detail .product-content__info > dl > dd {
  display: flex;
  align-items: center;
  min-height: 60px;
  border-bottom: solid 1px var(--gray001);
  padding: 20px 40px;
}
.product-detail .product-content__info > dl > dt {
  width: 200px;
  border-right: solid 1px var(--gray001);
}
.product-detail .product-content__info > dl > dd {
  width: calc(100% - 200px);
  position: relative;
}
.product-detail .kc-certification-box {
  width: 100%;
}
.product-detail .kc-certification-box .kc-info {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: row;
  gap: 12px;
  border: 1px solid var(--gray001);
  min-height: 120px;
  flex-direction: column;
  font-size: 18px;
  background-size: 40px;
  padding: 4px 4px 4px 240px;
}
.product-detail .kc-certification-box .kc-info dt {
  font-weight: 500;
}
.product-detail .kc-certification-box .kc-info dd {
  font-weight: 400;
}
.product-review-summary__score-wrap {
  width: fit-content;
}
.product-review-title {
  font-family: Noto Sans KR;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  letter-spacing: -0.04em;
  text-align: right;
  color: var(--color-point-black);
  margin-bottom: 6px;
}
.product-review-score-wrap {
  position: relative;
  width: fit-content;
}
.product-review__rating-score {
  width: var(--rating-count);
  overflow: hidden;
  display: flex;
  flex-direction: row;
  position: relative;
  z-index: 2;
}
.product-review__rating-score svg {
  flex-shrink: 0;
}
.product-review__limit-score {
  width: 300px;
  display: flex;
  flex-direction: row;
  position: absolute;
  top: 0;
  left: 0;
}
.product-review-summary {
  width: 100%;
  padding: 47px 0;
  background-color: var(--bg-gray);
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: center;
  border-radius: 10px;
  gap: 10px;
}
.product-review-summary__score {
  color: var(--gray002);
  font-size: 20px;
  font-weight: 500;
}
.product-review-summary__score em {
  color: var(--color-base-black);
  font-weight: 700;
}
.product-review-score {
  font-family: Roboto;
  font-size: 30px;
  font-weight: 400;
  line-height: 25px;
  letter-spacing: -0.04em;
  text-align: left;
  color: var(--gray002);
  display: flex;
  flex-direction: row;
  align-items: flex-end;
}
.product-review-score span {
  font-family: Roboto;
  font-size: 80px;
  font-weight: 400;
  line-height: 45px;
  letter-spacing: -0.04em;
  text-align: left;
  color: var(--color-point-black);
}
.product-review-media-summary {
  padding-top: 40px;
}
.product-review-media-summary__header {
  color: var(--color-base-black);
  font-size: 20px;
  font-weight: 700;
}
.product-review-media-summary__content {
  margin: 20px 0;
}
.product-review-media-summary__content ul {
  display: flex;
  gap: 24px;
}
.product-review-media-summary__content ul li {
  width: 180px;
  height: 180px;
  border: 1px solid var(--gray001);
}
.product-review-media-summary__content ul li img {
  width: 100%;
  height: 100%;
}
.product-review-list .qna-list__item {
  border-bottom: solid 1px #e1e1e1;
}
.product-review-list .qna-list__item.active .qna-list__item-box.more {
  display: flex;
  margin-left: 197px;
  width: calc(100% - 197px);
  padding: 20px 0;
}
.product-review-list
  .qna-list__item.active
  .qna-list__item-box.more
  .qna-list__item-content {
  padding: 0;
}
.qna-answer {
  border-top: 1px solid var(--gray001);
}
.product-review-list .qna-list__item-box {
  display: flex;
  width: 100%;
  padding: 34px 0;
  font-family: Pretendard;
  font-size: 16px;
  font-weight: 400;
  line-height: 19.09px;
  text-align: center;
}
.product-review-list .qna-list__item-box.more {
  display: none;
}
.product-review-list .qna-list__item-status {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
.product-review-list .qna-list__item-category {
  display: table-cell;
  width: 120px;
  text-align: center;
  color: var(--gray003);
  font-family: "Noto Sans KR";
  font-size: 18px;
  font-weight: 400;
  vertical-align: middle;
}
.product-review-list .qna-list__item-category .ico {
  background-image: none;
  width: 40px;
  height: 40px;
  border-radius: 100px;
  align-items: center;
  display: flex;
  justify-content: center;
  margin: auto;
}
.product-review-list .qna-list__item-category .ico:before {
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 700;
  color: var(--White, var(--color-base-white));
}
.product-review-list .qna-list__item-category .ico.ico-question {
  background-color: var(--color-base-navy);
}
/* .product-review-list .qna-list__item-category .ico.ico-question:before {
  content: "Q";
} */
.product-review-list .qna-list__item-category .ico.ico-answer {
  background-color: var(--color-point-red);
}
/* .product-review-list .qna-list__item-category .ico.ico-answer:before {
  content: "A";
} */
.product-review-list .qna-list__item-content {
  width: 100%;
  font-family: Pretendard;
  font-size: 16px;
  font-weight: 400;
  line-height: 19.09px;
  text-align: left;
  padding: 0 30px;
}
.product-review-list .qna-list__item-content.title {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  display: flex;
  align-items: center;
  color: var(--secondary);
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 21.6px */
  letter-spacing: 0.09px;
  gap: 10px;
}
.product-review-list .qna-list__item-content .ico {
  vertical-align: unset;
}
.product-review-list .qna-list__item-register {
  vertical-align: middle;
  text-align: center;
  color: var(--gray002);
  font-family: Pretendard;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 21.6px */
  letter-spacing: 0.09px;
  display: flex;
  align-items: center;
  gap: 15px;
}
.product-review-list .qna-list__item-register .btn-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.product-review .photo-review-more {
  float: right;
  font-size: 18px;
  font-weight: 500;
}
.product-review .photo-review-more a {
  text-decoration: none;
  color: inherit;
}

.crema_product_reviews_score_star_wrapper__star {
  fill: var(--color-point-black);
}

.gradient__star-secondary {
  stop-color: var(--color-point-red);
}

.gradient__star {
  stop-color: var(--bg-gray);
}

.product-review__sort-wrap {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  margin-top: 58px;
  margin-bottom: 10px;
}
.product-review__sort-wrap .select {
  width: 180px;
}
.product-detail .product-content__title {
  font-family: Pretendard;
  font-size: 22px;
  font-weight: 500;
  line-height: 26.4px;
  letter-spacing: -0.04em;
  text-align: left;
  color: var(--color-base-black);
}
.product-board-list__total-count em {
  font-family: Pretendard;
  font-size: 22px;
  font-weight: 700;
  line-height: 26.25px;
  letter-spacing: -0.04em;
  text-align: left;
  color: var(--color-base-black);
}
.review-list {
  /* border-top: 1px solid var(--color-base-black); */
  /* margin-top: 10px; */
}
.pagination__link {
  font-family: Pretendard;
  font-size: 16px;
  font-weight: 300;
  line-height: 19.09px;
  text-align: center;
  background: none;
  color: var(--color-base-black);
}
.pagination__link.is-current {
  font-family: Pretendard;
  font-size: 16px;
  font-weight: 400;
  line-height: 19.09px;
  text-align: center;
}

.tooltip {
  position: absolute;
  top: calc(100% + 10px);
  left: -20px;
  display: none;
  z-index: 5;
  padding: 20px;
  background-color: var(--color-base-white);
  box-shadow: inset 0 0 0 1px var(--gray001);
  width: max-content;
}
.tooltip.active {
  display: block;
}
.tooltip.coupon-guide {
  position: absolute;
  top: calc(100% + 15px);
  right: -75px;
  left: unset;
}
.tooltip.coupon-guide::before {
  position: absolute;
  right: 93px;
  left: unset;
}
.tooltip::before {
  position: absolute;
  top: -6px;
  left: 20px;
  transform: rotate(-45deg);
  content: "";
  width: 12px;
  height: 12px;
  background-color: inherit;
  border: 1px solid var(--gray001);
  border-width: 1px 1px 0 0;
}
.tooltip__header {
  display: flex;
  justify-content: space-between;
}
.tooltip__title {
  color: var(--color-base-black);
  font-family: "Noto Sans KR";
  font-size: 16px;
  font-weight: 700;
}
.tooltip__content {
  margin-top: 22px;
}
.tooltip__close-btn {
  cursor: pointer;
}

.discount-price-information__description {
  margin-top: 20px;
  padding: 20px;
  background: var(--gray001);
  color: var(--gray003);
  font-family: "Noto Sans KR";
  font-size: 12px;
  font-weight: 400;
}
.discount-price-information__description li {
  list-style: inside;
}
.discount-price-information__detail li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  margin-top: 14px;
  color: var(--color-base-black);
  font-family: "Noto Sans KR";
  font-size: 14px;
  font-weight: 400;
}
.discount-price-information__detail li em {
  text-align: right;
  font-family: Montserrat;
  font-size: 16px;
  font-weight: 700;
}
.discount-price-information__detail .total-price {
  color: var(--color-point-red);
  font-family: "Noto Sans KR";
  font-size: 14px;
  font-weight: 400;
}
.discount-price-information .guide__sub-description {
  margin-top: 10px;
  font-size: 12px;
  font-weight: 400;
}

.option-info-txt {
  margin-bottom: 20px;
}

related-product .thumb-item__img .thumb-fab {
  bottom: 10px;
  right: 10px;
}
related-product .thumb-item__img .thumb-fab path {
  stroke-width: 2;
}
related-product .thumb-item__img .thumb-fab svg {
  fill: var(--color-base-white);
}
related-product .thumb-item__img .thumb-fab:where(.is-active) svg {
  fill: var(--color-point-red);
}

.coupon-guide-container {
  position: relative;
}

.photo-collection-item {
  position: relative;
  cursor: pointer;
}
.photo-collection-item .review-img-count {
  position: absolute;
  right: 0px;
  bottom: 0px;
  color: var(--color-base-white);
  text-align: center;
  line-height: 24px;
  width: 24px;
  height: 24px;
  background: var(--color-base-black);
  font-size: 12px;
}

.product-review-search {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  border-top: solid 1px var(--gray001);
  border-bottom: solid 1px var(--gray001);
  padding: 22px 0;
}
.product-review-search button {
  all: unset;
  cursor: pointer;
}
/* 리뷰 정책 */
.product-review-search .policy {
  anchor-name: --my-button;
}
#review-policy {
  position: absolute;
  width: 500px;

  position-anchor: --my-button;
  top: anchor(--my-button bottom);
  right: anchor(--my-button right);
  position-visibility: anchors-visible;

  border: solid 1px black;
  border-radius: 4px;
  padding: 16px;
  display: none;
  flex-direction: column;
  gap: 16px;
  background-color: var(--color-base-white);
  margin-top: 4px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
#review-policy.active {
  display: flex;
}
#review-policy h4 {
  font-weight: normal;
}
#review-policy .review-policy-content {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  gap: 4px;
}
#review-policy .review-policy-content .row {
  display: flex;
  flex-direction: column;
}
#review-policy .review-policy-content .title {
  position: relative;
  padding-left: 8px;
}
#review-policy .review-policy-content .subtitle {
  position: relative;
  padding-left: 16px;
}
#review-policy .review-policy-content .title:before {
  position: absolute;
  left: 0;
  content: '•';
}
#review-policy .review-policy-content .subtitle:before {
  position: absolute;
  left: 8px;
  content: '•';
}
#review-policy .review-policy-content span:not(.title, .subtitle) {
  padding-left: 8px;
}
.product-review-search__sort-type {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: row;
  gap: 32px;
}
.product-review-search__sort-type li {
  color: var(--gray003);
  font-size: 16px;
  font-weight: 400;
  position: relative;
}
.product-review-search__sort-type li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 0;
  right: -15px;
  bottom: 0;
  width: 1px;
  background-color: var(--gray001);
}
.product-review-search__sort-type li.active {
  color: var(--color-point-red);
}
.product-review-search .form-check__label {
  cursor: pointer;
}
.product-review-list .review-list-item__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding: 20px;
  min-height: 170px;
  border-bottom: solid 1px var(--gray001);
}
.product-review-list .review-list-item__content.comment {
  background-color: var(--gray001);
  min-height: 95px;
}
.product-review-list .review-list__score {
  color: var(--gray003);
  font-size: 16px;
  font-weight: 700;
}
.product-review-list .review-list__score-container {
  display: flex;
  align-items: center;
  flex-direction: row;
  width: 200px;
  gap: 26px;
}
.product-review-list .review-list__score-star {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 2px;
}
.product-review-list .review-list__content-container {
  width: 590px;
  height: 100%;
}
.product-review-list .review-list__content-container.open .review-content {
  max-height: unset;
}
.product-review-list .review-list__content-image {
  float: left;
  margin-right: 24px;
  width: 130px;
  height: 130px;
  border: 1px solid var(--gray001);
  position: relative;
  border-radius: 6px;
}
.product-review-list .review-list__content-image img {
  width: 100%;
  height: 100%;
  border-radius: 6px;
}
.product-review-list .review-list__content-image .review-img-count {
  font-size: 12px;
  color: var(--color-base-white);
  text-align: center;
  line-height: 24px;
  width: 24px;
  height: 24px;
  background: var(--color-base-black);
  position: absolute;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  border-radius: 0 0 6px 0;
}
.product-review-list .review-list__content-box {
  position: relative;
  float: left;
  width: calc(100% - 154px);
  height: 100%;
  font-size: 16px;
}
.product-review-list .review-list__content-box .review-option {
  margin-top: 20px;
  color: var(--gray003);
  font-weight: 400;
}
.product-review-list .review-list__content-box .review-content {
  margin-top: 10px;
  margin-bottom: 32px;
  color: var(--color-base-black);
  font-family: Pretendard;
  font-size: 18px;
  font-weight: 400;
  line-height: 21.48px;
  text-align: left;
  max-height: 45px;
  overflow: hidden;
}
.product-review-list .review-list__content-box .review-content .review-text {
  cursor: pointer;
}
.product-review-list
  .review-list__content-box
  .review-content
  .review-list__content-image {
  display: block;
  margin: 10px 10px 0px 0px;
}
.product-review-list .review-list__content-box .review-content .ico-wrap.best {
  width: 52px;
  height: 24px;
  float: left;
  margin-right: 5px;
}
.product-review-list
  .review-list__content-box
  .review-content
  .ico-wrap.best
  .ico {
  width: 100%;
  height: 100%;
}
.product-review-list .review-list__content-box .review-more-photo {
  margin-top: 15px;
}
.product-review-list .review-list__content-box .review-comment-box {
  display: flex;
  flex-direction: row;
}
.product-review-list .review-list__content-box .review-recommend,
.product-review-list .review-list__content-box .review-comment {
  color: var(--color-base-black);
  font-weight: 500;
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 6px;
}
.product-review-list .review-list__content-box .review-recommend span,
.product-review-list .review-list__content-box .review-comment span {
  color: var(--color-base-black);
  font-weight: 500;
}
.product-review-list .review-list__content-box .review-recommend span em,
.product-review-list .review-list__content-box .review-comment span em {
  color: var(--color-point-red);
  font-weight: 700;
  cursor: auto;
}
.product-review-list .review-list__content-box .review-comment .comment {
  cursor: pointer;
}
.product-review-list .review-list__edit-container {
  height: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-direction: row;
  gap: 22px;
}
.product-review-list .review-list__edit-container .review-list__btn-box {
  display: flex;
  justify-content: center;
  flex-direction: row;
  gap: 8px;
}

.review-header__btn {
  display: flex;
  gap: 12px;
}

.sns-btn {
  width: 50px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
}

.like-btn-wrap {
  position: relative;
}
.like-btn-wrap .like-message {
  left: 10px;
  display: inline-block;
  animation: fadeout 3s;
  -moz-animation: fadeout 3s; /* Firefox */
  -webkit-animation: fadeout 3s; /* Safari and Chrome */
  -o-animation: fadeout 3s; /* Opera */
  animation-fill-mode: forwards;
}
@keyframes fadeout {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-moz-keyframes fadeout {
  /* Firefox */
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-webkit-keyframes fadeout {
  /* Safari and Chrome */
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-o-keyframes fadeout {
  /* Opera */
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

.detail-option {
  padding: 18px 0;
  color: var(--gray003);
  font-size: 16px;
  font-weight: 500;
  line-height: 33px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #e1e1e1;
}

.option-span {
  width: 55px;
  flex-shrink: 0;
  color: var(--secondary);
  font-family: Pretendard;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 19.2px */
  letter-spacing: 0.08px;
}
.badge-product {
  width: 167px;
  height: 50px;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.board-form__notice-text{
    display: none;
}


/* 응시 정보 입력폼 */
.application_form {
  width: 100%;
  min-height: 50dvh;
  display: flex;
  justify-content: center;
  margin-top: 5rem;
}

.application_form > .container {
  display: flex;
  width: 100%;
  min-width: 17.5rem;
  max-width: 27.5rem;
  padding: 3rem 1.25rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;

  border-radius: 0.625rem;
  border: 1px solid #DEDEDE;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0.90) 100%), #FFF;
}

.application_form > .container > .title {
  display: flex;
  padding-bottom: 0.5rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;

  color: black;
  text-align: center;
  font-size: 1.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.375rem; /* 135.714% */
}

.application_form .applicant_info,
.application_form .subject_info,
.application_form .policy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  align-self: stretch;
}

.application_form .subject_info .class_label {
  padding: var(--spacing-4) var(--spacing-8);
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  display: none;

  border-radius: 0.375rem;
  border: 1px solid var(--gray-900);
  background: var(--gray-900);

  color: var(--base-white);
}

.application_form .policy .label {
  display: flex;
  flex-grow: 1;
  justify-content: space-between;
  align-items: center;
}

.application_form .policy .label > button {
  color: #666;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: var(--body-font-weight-regular, 400);
  line-height: var(--body-md-16-line-height, 1.5rem); /* 171.429% */
  letter-spacing: var(--body-letter-spacing, -0.0125rem);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.application_form .form_input .search {
  width: 100%;
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.application_form .form_input .search > input {
  flex-grow: 1;
}

.application_form .form_input .search > button {
  display: flex;
  width: 5.5rem;
  height: 3rem;
  min-width: 4.5rem;
  max-width: 5.5rem;
  padding: 0 var(--spacing-20);
  justify-content: center;
  align-items: center;
  gap: var(--spacing-6);

  border-radius: var(--border-radius-6);
  border: 1px solid var(--gray-600);
  background: var(--base-white);
  color: var(--gray-900);
  text-align: center;
}





/* 공통 사용 */
.application_form .note {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  align-self: stretch;
}

.application_form .note > .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.application_form .note > .top > .title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1 0 0;

  color: #222;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.875rem; /* 150% */
}

.application_form .note > .top > .title::before {
  content: '';
  display: inline-flex;
  width: 0.25rem;
  height: 1.25rem;
  border-radius: 0.0625rem 0.5rem 0.5rem 0.0625rem;
  background: #0A888F;
}

.application_form .note > .top > .title.required::after {
  content: '*';

  width: 0.5rem;
  height: 1.5rem;

  color: var(--red-500);
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.625rem; /* 162.5% */
  margin-left: -0.25rem;
}

.application_form .note > .top > .checkbox {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);

  color: var(--gray-800);
  /* Body/md-16/regular */
}

.application_form .note > .top > .checkbox * {
  cursor: pointer;
}

.application_form .note > .desc {
  color: #666;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.625rem; /* 162.5% */
}

.application_form .form_container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  align-self: stretch;

  width: 100%;
}

.application_form .divider {
  height: 0.0625rem;
  align-self: stretch;

  background: #DEDEDE;
}

.application_form input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;

  display: grid;
  place-content: center;

  width: 1.25rem;
  height: 1.25rem;
  padding: 0.125rem;
  flex-shrink: 0;

  border-radius: var(--border-radius-2);
  border: 1px solid var(--gray-300);
  background: var(--base-white);
}

.application_form input[type=checkbox]:checked {
  background: var(--mint-500);
  border: none;
}

.application_form input[type=checkbox]:checked::before {
  content: '';
  background-image: url("/assets/images/icons/check.svg");
  display: flex;
  width: 1rem;
  height: 1rem;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.application_form .form_container span {
  color: var(--gray-900);

  display: flex;
  align-items: center;
  gap: 0.25rem;
  align-self: stretch;
  /* Body/md-16/semibold */
}

.application_form .form_container span.required::after {
  content: '*';

  width: 0.5rem;
  height: 1.5rem;

  color: var(--red-500);
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.625rem; /* 162.5% */
}

.application_form .form_container .form_input {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-8);
  align-self: stretch;
}

.application_form .form_container .form_input input[type=text],
.application_form .form_container .form_input input[type=date],
.application_form .form_container .check_card,
.application_form select {
  width: 100%;
  display: flex;
  padding: 0.75rem;
  justify-content: space-between;
  align-items: center;
  flex: 1 0 0;

  border-radius: 0.375rem;
  border: 1px solid var(--gray-300);
  background: var(--base-white);
}

.application_form .form_container .form_input input[type=text][data-invalid="true"],
.application_form .form_container .form_input input[type=date][data-invalid="true"],
.application_form .form_container .check_card[data-invalid="true"],
.application_form select[data-invalid="true"] {
  border: 1px solid var(--red-500);
}

.application_form .radio_group:has(input[type=hidden][data-invalid="true"]) .check_card {
  border: 1px solid var(--red-500);
}

.application_form .check_card:has(input[type=checkbox][data-invalid="true"]) {
  border: 1px solid var(--red-500);
}

.application_form .form_container .form_input input[type=text]:disabled,
.application_form .form_container .form_input input[type=date]:disabled,
.application_form .form_container .check_card:has(:disabled),
.application_form select:disabled {
  border-radius: 0.375rem;
  background: var(--gray-100, #EDEDF2);
  color: var(--gray-400);
  opacity: 1;
}

.application_form .form_container .form_input input[type=text]:disabled::placeholder {
  color: var(--gray-400);
}

.application_form .radio_group {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
}

.application_form .check_card {
  flex-direction: row;
  color: var(--gray-400);
  column-gap: 0.5rem;
}

.application_form .check_card:has(input:checked) {
  border-color: var(--mint-500);
  color: var(--mint-500);
  font-weight: var(--body-font-weight-semi-bold);
}

.application_form input[type="date"]:invalid,
.application_form input[type="date"]:invalid::-webkit-datetime-edit-fields-wrapper,
.application_form input[type="date"]:invalid::-webkit-datetime-edit-text,
.application_form input[type="date"]:invalid::-webkit-datetime-edit-month-field,
.application_form input[type="date"]:invalid::-webkit-datetime-edit-day-field,
.application_form input[type="date"]:invalid::-webkit-datetime-edit-year-field{
  color: transparent;
  background: transparent;
}

.application_form input[type="date"]:invalid::before {
  content: attr(data-placeholder);
  color: var(--gray-400);
  width: 100%;
}

.application_form input[type="date"]::after {
  content: '';
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;

  background-image: url('/assets/images/icons/calendar.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none; /* 아이콘 클릭 시에도 input 클릭 이벤트 동작 */
}

.application_form input[type="date"]::-webkit-calendar-picker-indicator,
.application_form input[type="date"]::-webkit-inner-spin-button {
  display: none;
  -webkit-appearance: none;
}

.application_form .form_select {
  display: flex;
  align-items: center;
  gap: var(--spacing-8);
  align-self: stretch;
  position: relative;
}

.application_form .form_select::after {
  content: '';
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%) rotate(0deg); /* 기본 0도 */

  width: 1.25rem;
  height: 1.25rem;

  background-color: var(--gray-800);

  -webkit-mask-image: url('/assets/images/icons/chevron-down.svg');
  mask-image: url('/assets/images/icons/chevron-down.svg');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;

  pointer-events: none;
  transition: transform 0.2s ease-in-out;
}

.application_form .form_select:has(select[data-open="true"])::after {
  transform: translateY(-50%) rotate(180deg);
}

.application_form .form_select:has(select:disabled)::after {
  background-color: var(--gray-500);
}

.application_form .form_select > span {
  min-width: 3rem;
}

.application_form select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  color: var(--gray-800);
}

.application_form select > option.placeholder {
  display: none;
}

/* 응시생 정보 확인 모달 */
.application-confirm-modal .modal-body {
  padding: 0;
  width: 100%;
}

.application-confirm-modal .screen {
  display: flex;
  flex-direction: column;
  height: 560px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 20px;
  position: relative;
  background-color: #f5f5f5;
  border-radius: 8px;
  overflow: hidden;
}

.application-confirm-modal .screen .view {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 0 0 auto;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.application-confirm-modal .screen .frame {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.application-confirm-modal .screen .text-wrapper {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-weight: 700;
  color: #222222;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.application-confirm-modal .screen .div {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-weight: 400;
  color: #222222;
  font-size: 18px;
  text-align: right;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.application-confirm-modal .screen .view-2 {
  height: 1px;
  background-color: #d9d9d9;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.application-confirm-modal .screen .text-wrapper-2 {
  align-self: stretch;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  position: relative;
  margin-top: -1px;
  color: #222222;
  letter-spacing: 0;
}

.application-confirm-modal .btn-group {
  margin-top: 1.5rem;
}

.application-confirm-modal .btn-group .btn {
  height: 3.5rem;
}

/* 응시생 정보 확인 모달 */
.application-confirm-modal .modal-body {
  padding: 0;
  width: 100%;
}

.application-confirm-modal .screen {
  display: flex;
  flex-direction: column;
  height: 560px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 20px;
  position: relative;
  background-color: #f5f5f5;
  border-radius: 8px;
  overflow: hidden;
}

.application-confirm-modal .screen .view {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 0 0 auto;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.application-confirm-modal .screen .frame {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.application-confirm-modal .screen .text-wrapper {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-weight: 700;
  color: #222222;
  font-size: 18px;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.application-confirm-modal .screen .div {
  position: relative;
  width: fit-content;
  margin-top: -1px;
  font-weight: 400;
  color: #222222;
  font-size: 18px;
  text-align: right;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.application-confirm-modal .screen .view-2 {
  height: 1px;
  background-color: #d9d9d9;
  position: relative;
  align-self: stretch;
  width: 100%;
}

.application-confirm-modal .screen .text-wrapper-2 {
  align-self: stretch;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  position: relative;
  margin-top: -1px;
  color: #222222;
  letter-spacing: 0;
}

.application-confirm-modal .btn-group {
  margin-top: 1.5rem;
}

.application-confirm-modal .btn-group .btn {
  height: 3.5rem;
}

/* 응시생 유의사항 / 취소·환불 규정 전문 모달 - 원문 줄바꿈 유지 (다른 페이지의 공용 term-detail 모달에는 영향 없도록 범위 한정) */
[shopby-layer-modal-helper-key="rehearsal-guidelines"] .term-detail__content,
[shopby-layer-modal-helper-key="rehearsal-refund"] .term-detail__content {
  white-space: pre-line;
}