@charset "UTF-8";
/* product_detail_kkw.php 전용 스타일 (쿠폰/가격 영역) */
/* 장바구니 배지 (이미지 태그 + 텍스트 오버레이) */
.hd_cart_btn.count .cart_cnt_badge {position: absolute; top: 1px; right: -4px; width: 16px; height: 16px; display: flex; align-items: center; justify-content: center;}
.hd_cart_btn.count .cart_cnt_badge img {position:absolute;inset:0;width:100%;height:100%;border-radius:50%;display:block;z-index:0;}
.hd_cart_btn.count #cart_cnt_h {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-weight: 700; font-size: 1.1rem; font-style: normal; line-height: 1; color: #FFFFFF; z-index: 1; display: block;}
/* 붉은별 아이콘 (SVG) 고정 사이즈 */
.icon_star_red{width:12px;height:12px;flex-shrink:0;display:inline-block;}
/* 가격+쿠폰 묶음 레이아웃 */
.price_box_v2 {display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin:8px 0 12px;}
.price_final_line {display:none;}
.price_box_v2 .price_info {flex:1;min-width:0;}
/* 쿠폰 버튼 박스 */
.coupon_btn_box {flex-shrink:0;display:flex;align-items:center;}
.coupon_badge_btn {display:inline-flex;align-items:center;justify-content:center;gap:6px;width:98px;height:37px;box-sizing:border-box;padding:0 10px;border:1px solid #BD7BEB;border-radius:7px;background:#F4E5FE;font-family:Pretendard;line-height:1;color:#870AE0;letter-spacing:0;position:relative;overflow:hidden;white-space:nowrap;}
.coupon_badge_btn img {width:16px;height:16px;}
.coupon_badge_btn .coupon_symbol{position:relative;display:inline-flex;align-items:center;justify-content:center;width:18px;height:13px;flex-shrink:0;}
.coupon_badge_btn .coupon_symbol .coupon_p_icon{width:18px;height:13px;display:block;flex-shrink:0;}
.coupon_badge_btn .coupon_symbol .coupon_p_char{position:absolute;width:8px;height:14px;/*left:50%;top:50%;*/transform:translate(-10%,0);font-family: Pretendard;font-size:1.2rem;font-weight:900;line-height:1;color:#FFFFFF;}
.coupon_badge_btn:active {background:#ECD8FF;}
.coupon_badge_btn.disabled {border-color:#E4E6EA;color:#9AA0A6;box-shadow:none;pointer-events:none;background:#F9FAFB;}
/* 다운로드 가능한 쿠폰이 더이상 없을 때 이미지로 교체 */
.coupon_badge_btn.is-done{padding:0 10px;border:0;background:#F0F3F8;gap:6px;cursor:default;color:#757575;letter-spacing:-0.84px;}
/* 쿠폰 완료 라벨 (이미지 대신 텍스트) */
/* 라벨 공통 규칙: 기본/완료 동일 레이아웃 & 타이포 */
.coupon_badge_btn .coupon_action_lbl,
.coupon_badge_btn.is-done .coupon_done_lbl{font-family: Pretendard;font-size:1.4rem;font-style:normal;font-weight:700;line-height:1;letter-spacing:-0.84px;display:inline-flex;align-items:center;transform:translateY(-1px);}
/* 상태별 색상만 다르게 */
.coupon_badge_btn .coupon_action_lbl{color:#870AE0;}
.coupon_badge_btn.is-done .coupon_done_lbl{color:#757575;}
/* 시각적 중앙 보정: 기본 라벨만 1px 추가 상향 */
.coupon_badge_btn .coupon_action_lbl{transform:translateY(-2px);}
/* (중복 제거) 기본 라벨 개별 규칙은 위 공통/색상 규칙으로 통일 */
/* 가격 영역 세부 */
.price_discount_line {display:flex;align-items:center;font-size:1.5rem;font-weight:500;color:#757575;min-height:18px;}
.price_discount_line.empty {display:none !important; min-height:0;}
.price_discount_line .sale_icon{width:10px;height:13px;flex-shrink:0;display:inline-block;}
.price_discount_line .sale_icon path{fill:#757575;stroke:#757575;stroke-width:.792px;stroke-linecap:round;stroke-linejoin:round;}
.price_discount_line .discount_percent {display:inline-block;padding:0;border-radius:0;background:transparent;color:#757575;font-size:1.5rem;font-weight:700;line-height:1;}
.price_discount_line .discount_amount {color:#949494;margin-left: 3px;font-family:Pretendard;font-size:1.5rem;font-style:normal;font-weight:500;line-height:normal;}
.price_original_line .price_original {font-family: Pretendard;font-size: 2.2rem;font-weight:800;color:#000;margin:0;line-height:1;letter-spacing:0;}
.price_final_line .price_final {font-family: Pretendard;font-size: 2.2rem;font-weight: 800;margin:0;display:flex;align-items:center;gap:8px;color:#D40022;line-height:1;letter-spacing:0;}
.price_final_line .final_price_value{display: inline-flex;align-items:center;gap:0;white-space:nowrap;}
.price_final_line .currency_unit_red {font-size: 16.201px;font-style: normal;font-weight:500;line-height: normal;color:#D40022;letter-spacing:0;display:inline-block;vertical-align:middle;position:relative;margin-left:2px;}
/* 공통 '원' 단위 스타일 */
.currency_unit{font-size: 16.2px;font-style: normal;font-weight:500;line-height:1;color:#000;letter-spacing:0;display:inline-block;vertical-align:middle;position:relative;margin-left:2px;}
.coupon_apply_txt {font-size:1.6rem;font-weight:500;color:#D40022;display:inline-flex;align-items:center;gap:4px;line-height:normal;letter-spacing:0;}
.coupon_apply_txt .coupon_arrow {display: inline-block;width: 5.063px;height: 10.125px;flex-shrink: 0;stroke-width: 1.688px;vertical-align: middle;}
.coupon_apply_txt .coupon_arrow path{fill:none;}
/* 별점 별 아이콘 상태값 (디테일 페이지 한정) */
.product_dt_layout .rating_inline .rating_star{color:#FF3D25;font-size:1.2rem;font-weight:900;line-height:1;display:inline-block;}
.product_dt_layout .rating_inline .rating_score{line-height:1;letter-spacing:0;}
.product_dt_layout .rating_inline .rating_score_value{font-family: Pretendard;font-size:1.2rem;font-weight:700;font-style: normal;line-height: normal;color: #000;}
.product_dt_layout .rating_inline .rating_score_count{font-family: Pretendard;font-size:1.2rem;font-weight:500;font-style: normal;line-height: normal;color: #3F3F3F;}
/* 메타 상단 라인에서 평점 블록을 우측 끝으로 밀기 */
.product_dt_layout .rating_inline{margin-left:auto;gap:0.3rem;}
/* 원산지 라벨 텍스트 */
.product_dt_layout .product_origin_label{
color:#3F3F3F;
font-family:Pretendard;
font-size:1.3rem;
font-style:normal;
font-weight:500;
line-height:normal;
}
/* 쿠폰 적용가 퍼센트 (붉은 색 굵게) */
.product_dt_layout .coupon_discount_percent{color:#D40022;font-size:22px;font-style:normal;font-weight:700;line-height:normal;}
/* 리뷰 섹션 우측 '전체보기' 링크 */
/* 텍스트/아이콘 분리 스타일 */
.prod_sec_link--viewall{display:inline-flex;align-items:center;gap:4px;line-height:1.4rem;}
.prod_sec_link--viewall .txt{font-family: Pretendard;color:#000;font-size:1.4rem;font-style:normal;font-weight:600;letter-spacing:0;line-height:1.4rem;display:block;}
/* SVG 파일 내부 여백/폰트 메트릭 차이 보정 (기본: 안드 포함) */
.prod_sec_link--viewall .ic_arrow{width:7px;height:11px;flex-shrink:0;display:block;align-self:center;position:static;transform:translateY(1px);}
/* iOS Safari는 동일 보정값이 더 아래로 내려가 보일 수 있어 축소 */
@supports (-webkit-touch-callout: none) {
.prod_sec_link--viewall .ic_arrow{transform:translateY(0px);}
}
.prod_sec_link--viewall svg.ic_arrow path{stroke:#870AE0;stroke-width:1;vector-effect:non-scaling-stroke;fill:none;stroke-linecap:round;stroke-linejoin:round;}
/* 공통 active 투명도 */
.prod_sec_link--viewall:active,
.group_wr.review_sec .review_list_wr .rv_more_link:active{opacity:.85;}
/* 리뷰 없음(empty) 문구 타이포 (상품상세 리뷰 섹션 전용) */
.no_data--review-empty .no_data_txt h5{
color:#000;
font-family:Pretendard;
font-size:1.9rem;
font-style:normal;
font-weight:600;
line-height:normal;
letter-spacing:-0.76px;
margin:0 0 5px;
}
.no_data--review-empty .no_data_txt p{
color:#878787;
font-family:Pretendard;
font-size:1.4rem;
font-style:normal;
font-weight:400;
line-height:normal;
margin:0;
}
/* product_detail_kkw.php 전용 스타일 (리뷰 이미지 그리드) */
/* 리뷰 이미지 그리드 UX 정교화 */
.review_image_grid_wr {padding:0 9px; margin-top:8px;}
.review_image_grid {display:grid; grid-template-columns:repeat(4,1fr); gap:4px; margin:0; padding:0; list-style:none;}
/* 4장 + 더보기(총 5칸) 케이스 지원 */
.review_image_grid.cols-5 {grid-template-columns:repeat(5,1fr);}
.review_image_grid.cols-5 .rv_img_cell{width:auto; height:auto;}
.review_image_grid .rv_img_cell {position:relative; aspect-ratio:1/1; width:100%; background:#E6E6E8; overflow:hidden; border-radius:2px;}
.review_image_grid .rv_img_cell img {position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.review_image_grid .rv_img_cell.more_cell {background:#870AE0; color:#fff; border-radius:2px; cursor:pointer;}
/* 앵커가 절대배치로 셀 전체를 덮고 있어, 앵커에서 중앙정렬 처리 */
.review_image_grid .rv_img_cell.more_cell .more_link {display:flex; align-items:center; justify-content:center;}
.review_image_grid .rv_img_cell.more_cell .more_inner {display:flex; flex-direction:column; align-items:center; justify-content:center; height:44px;}
/* 카운트: 23x26 박스 기준 */
.review_image_grid .rv_img_cell.more_cell .more_cnt_value {display:block; font-family: Pretendard; height:26px; line-height:26px; font-size:2.2rem; font-weight:500; letter-spacing:0; color:#FFFFFF; text-align:center;}
/* 더보기: 34x16 박스 기준 */
.review_image_grid .rv_img_cell.more_cell .more_txt {display:block; font-family: Pretendard; height:16px; line-height:16px; font-size:1.3rem; font-weight:800; letter-spacing:0; margin-top:2px; color:#FFFFFF; text-align:center;}
.review_image_grid a {text-decoration:none; display:block; position:absolute; inset:0; color:inherit;}
.review_image_grid .rv_img_cell.more_cell:active {filter:brightness(0.88);}
/* 리뷰 섹션 상단 패딩 제거 */
.group_wr.review_sec{padding-top:0 !important; padding-bottom:0 !important;}
/* 리뷰 헤더 12px 간격 규격 */
.group_wr.review_sec .prod_sec_link--viewall{padding-top:15px; padding-bottom:13px;}
/* 리뷰 헤더 래퍼: 기본 규칙 오버라이드 (margin-bottom 제거 + 하단 보더) */
.group_wr.review_sec .prod_sec_tit_wr{margin-bottom:0 !important;}
/* 리뷰 섹션 컨테이너 폭: 모바일 뷰포트에 맞춰 유동화 */
.group_wr.review_sec .container{width:100% !important;max-width:100% !important;}
/* 그리드 셀 반응형: 고정 너비/높이 제거 (정사각 유지) */
.group_wr.review_sec .review_image_grid .rv_img_cell{width:100% !important;height:auto !important;}
/* 요약/리스트 래퍼 보조 규칙 (안전장치) */
.group_wr.review_sec .rv_block--summary .review_list_wr{display:none;}
.group_wr.review_sec .rv_block--summary .count_wr{display:none !important;}
.group_wr.review_sec .rv_block--list .rivew_average_wr,
.group_wr.review_sec .rv_block--list .count_wr{display:none;}
/* 리뷰 작성하기 링크 스타일 */
.rivew_average_wr .review_write_link{font-family: Pretendard;color:#870AE0;font-size:1.4rem;font-style:normal;font-weight:600;line-height:normal;letter-spacing:-0.98px;text-decoration:none;}
.rivew_average_wr .review_write_link:active{opacity:.85;}
/* 리뷰 요약 줄 간격/패딩 조정 (좌 18px, 상하 14px) */
.group_wr.review_sec .rivew_average_wr{padding-top:14px;padding-bottom:14px;padding-left:18px;}
.group_wr.review_sec .rivew_average_wr .mb_7{margin-bottom:0 !important;}
/* 별점 점수(숫자) 타이포 */
.group_wr.review_sec .rv_score_value{font-family: Pretendard;color:#232A35 !important;font-size: 1.5rem !important;font-style:normal;font-weight:500;line-height:1;display:inline-flex;align-items:center;}
/* 요약 별점 라인에서 숫자/카운트 수직 중앙 보정 */
.group_wr.review_sec .rv_summary_left .rv_score_value{transform:translateY(-1px);line-height:1;}
.group_wr.review_sec .rv_summary_left .rv_score_count{transform:none;font-family: Pretendard;transform: translateY(-1px);line-height:1;display:inline-flex;align-items:center;}
.group_wr.review_sec .rv_summary_left .rv_score_count{color:#232A35;}
/* 리뷰 리스트 UX (상세 섹션 전용) */
.group_wr.review_sec .review_list_wr article.review{padding: 15px 16px 15px 16px;border-bottom:1px solid #F1F1F1;}
.group_wr.review_sec .review_list_wr article.review:last-child{border-bottom:0;}
.group_wr.review_sec .review_list_wr .review_info{display:flex;justify-content:space-between;align-items:center;}
.group_wr.review_sec .review_list_wr .review_meta{gap:0.6rem;}
.group_wr.review_sec .review_list_wr .rv_star img,
.review_full_pg .review_list_wr .rv_star img{width:12px;height:12px;margin-right:1px;}
.group_wr.review_sec .review_list_wr .rv_date{color: #7F7F7F;
font-family: Pretendard;
font-size: 1.3rem;
font-style: normal;
font-weight: 400;
line-height: normal;
}
/* 리뷰 전체 페이지(product_rv_kkw.php) 날짜 타이포 전용 오버라이드 */
.review_full_pg .review_list_wr .rv_date{
color:#727D89;
font-size:1.4rem;
font-style:normal;
font-weight:400;
line-height:normal;
letter-spacing:-0.56px;
}
.group_wr.review_sec .review_list_wr .rv_option,
.review_full_pg .review_list_wr .rv_option{margin-top:1.0rem;display:flex;align-items:center;}
.group_wr.review_sec .review_list_wr .rv_option .rv_option_label,
.review_full_pg .review_list_wr .rv_option .rv_option_label{
margin-right:4px;
font-weight:500;
}
/* 리뷰 전체 페이지(product_rv_kkw.php) 옵션명 스타일 오버라이드 */
.review_full_pg .review_list_wr .rv_option,
.review_full_pg .review_list_wr .rv_option .rv_option_label,
.review_full_pg .review_list_wr .rv_option .rv_option_value{color: #727D89;font-size: 1.4rem;font-style: normal;font-weight: 500;line-height: normal;letter-spacing: 0;}
.review_full_pg .review_list_wr .rv_option .rv_option_label{margin-right: 4px;}
/* 옵션명 좌측 묶음과 재구매 뱃지 */
/* 옵션명 좌측 묶음: 상세/전체 페이지 모두 적용 */
.group_wr.review_sec .review_list_wr .rv_option_left,
.review_full_pg .review_list_wr .rv_option_left{align-items:center;gap:4px;min-width:0;flex:1;color:#9F9F9F;font-family:Pretendard;font-size:1.4rem;font-style:normal;font-weight:500;line-height:normal;}
/* 재구매 배지: 옵션명 우측 끝 정렬 (상세 + 전체 페이지) */
.group_wr.review_sec .review_list_wr .repurchase_badge,
.review_full_pg .review_list_wr .repurchase_badge{display:inline-flex;align-items:center;justify-content:center;width:75px;height:20px;flex-shrink:0;padding:0;border:1px solid #870AE0;border-radius:10px;background:transparent;color:#870AE0;font-family:Pretendard;font-size:1.4rem;font-style:normal;font-weight:500;line-height:normal;white-space:nowrap;margin-left:auto;}
.group_wr.review_sec .review_list_wr .repurchase_badge .repurchase_badge_txt,
.review_full_pg .review_list_wr .repurchase_badge .repurchase_badge_txt{display:inline-block;line-height:1;transform:translateY(-1px);}
/* iOS에서 baseline/폰트 렌더링 차이로 텍스트가 위로 뜨는 현상 보정 */
@supports (-webkit-touch-callout: none) {
.group_wr.review_sec .review_list_wr .repurchase_badge .repurchase_badge_txt,
.review_full_pg .review_list_wr .repurchase_badge .repurchase_badge_txt{transform:translateY(0px);}
}
.group_wr.review_sec .review_list_wr .rv_img_count_badge{position:absolute;left:6px;bottom:6px;min-width:16px;height:16px;padding:0 4px;border-radius:3px;background:rgba(0,0,0,0.7);color:#fff;font-size:12px;line-height:16px;text-align:center;}
.group_wr.review_sec .review_list_wr .rv_more_link{display:block;margin-top:6px;color:#870AE0;font-size:1.4rem;font-weight:600;text-decoration:none;text-align:right;}
/* 상단의 공통 active 규칙으로 통합 */
/* 신고하기 버튼 하단 우측 정렬 */
.group_wr.review_sec .review_list_wr .review_actions{margin-top:1.0rem;}
.group_wr.review_sec .review_list_wr .rv_report_link{background:none;border:0;padding:0;color:#8D95A0;font-size:1.2rem;line-height:1;text-decoration:none;}
.group_wr.review_sec .review_list_wr .rv_report_link:active{opacity:.7;}
/* 도움이돼요 버튼 (상품상세 리뷰리스트 전용) */
.group_wr.review_sec .review_list_wr .rv_help_btn,
.review_full_pg .review_list_wr .rv_help_btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:28px;padding: 5px 12px 5px 12px;border-radius:18px;border:1px solid #D1D1D1;background:#FFFFFF;color:#040505;font-family:Pretendard;font-size:1.4rem;font-style:normal;font-weight:500;line-height:normal;cursor:pointer;}
.group_wr.review_sec .review_list_wr .rv_help_btn:active,
.review_full_pg .review_list_wr .rv_help_btn:active{opacity:.9;}
.group_wr.review_sec .review_list_wr .rv_help_check_icon,
.review_full_pg .review_list_wr .rv_help_check_icon{display:none;width:11px;height:11px;}
.group_wr.review_sec .review_list_wr .rv_help_icon,
.review_full_pg .review_list_wr .rv_help_icon{width:11px;height:11px;display:inline-block;object-fit:contain;}
/* 기본(off) 아이콘만 노출 */
.group_wr.review_sec .review_list_wr .rv_help_icon_on,
.review_full_pg .review_list_wr .rv_help_icon_on{display:none;}
.group_wr.review_sec .review_list_wr .rv_help_icon_off,
.review_full_pg .review_list_wr .rv_help_icon_off{display:inline-block;}
.group_wr.review_sec .review_list_wr .rv_help_label,
.review_full_pg .review_list_wr .rv_help_label{min-width:0;color:#040505;font-family:Pretendard;font-size:1.4rem;font-style:normal;font-weight:500;line-height:normal;}
.group_wr.review_sec .review_list_wr .rv_help_cnt,
.review_full_pg .review_list_wr .rv_help_cnt{margin-left:2px;min-width:0;color:#7F7F7F;font-weight:500;}
.group_wr.review_sec .review_list_wr .rv_help_btn.active,
.review_full_pg .review_list_wr .rv_help_btn.active{border-radius: 16.5px; border: 1px solid rgba(135, 10, 224, 0.25); color:#870AE0;}
.group_wr.review_sec .review_list_wr .rv_help_btn.active .rv_help_label,
.review_full_pg .review_list_wr .rv_help_btn.active .rv_help_label{color:#870AE0;}
.group_wr.review_sec .review_list_wr .rv_help_btn.active .rv_help_check_icon,
.review_full_pg .review_list_wr .rv_help_btn.active .rv_help_check_icon{display:inline-block;}
.group_wr.review_sec .review_list_wr .rv_help_btn.active .rv_help_check_icon,
.review_full_pg .review_list_wr .rv_help_btn.active .rv_help_check_icon{filter: invert(17%) sepia(92%) saturate(5200%) hue-rotate(271deg) brightness(94%) contrast(104%);}
.group_wr.review_sec .review_list_wr .rv_help_btn.active .rv_help_icon_off,
.review_full_pg .review_list_wr .rv_help_btn.active .rv_help_icon_off{display:none;}
.group_wr.review_sec .review_list_wr .rv_help_btn.active .rv_help_icon_on,
.review_full_pg .review_list_wr .rv_help_btn.active .rv_help_icon_on{display:inline-block;}
.group_wr.review_sec .review_list_wr .rv_help_btn.active .rv_help_cnt,
.review_full_pg .review_list_wr .rv_help_btn.active .rv_help_cnt{color:#870AE0;}
/* 요약 줄 별점 크기 소형화 */
.group_wr.review_sec .rivew_average_wr .star_grade .star_on img,
.group_wr.review_sec .rivew_average_wr .star_grade .star_off img{width:11.7rem;max-width:11.7rem;}
/* KKW 리뷰 텍스트 2줄 클램프 + 더보기 토글 */
.group_wr.review_sec .review_list_wr .review_text{position:relative;color: #353535;font-family: Pretendard;font-size: 1.5rem;font-style: normal;font-weight: 400;line-height: 21px; /* 140% */}
.group_wr.review_sec .review_list_wr .rv_text{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;white-space:normal;}
.group_wr.review_sec .review_list_wr .rv_text:not(.is-expanded){padding-right:56px;}
.group_wr.review_sec .review_list_wr .rv_text.is-expanded{display:block;-webkit-line-clamp:unset;line-clamp:unset;}
.group_wr.review_sec .review_list_wr .rv_more_btn{display:block;margin-top:6px;color:#870AE0;font-size:1.4rem;font-weight:400;font-style:normal;line-height:normal;background:none;border:0;padding:0;text-decoration:none;text-align:right;}
/* 클램프 상태(접힘)에서 더보기 버튼을 마지막 줄(컨테이너 하단) 우측 끝으로 배치 */
.group_wr.review_sec .review_list_wr .rv_text:not(.is-expanded) + .rv_more_btn{position:absolute;right:0;bottom:0;top:auto;margin-top:0;}
.group_wr.review_sec .review_list_wr .rv_more_btn:active{opacity:.85;}
/* 이미지 3번째 썸네일 +N 배지 */
.group_wr.review_sec .review_list_wr .img_more_badge{position:absolute;right:6px;bottom:6px;min-width:18px;height:18px;padding:0 6px;border-radius:9px;background:rgba(0,0,0,0.6);color:#fff;font-size:1.2rem;line-height:18px;text-align:center;}
/* 신고하기 버튼을 텍스트에서 더 아래로 띄우기 */
.group_wr.review_sec .review_list_wr .review_footer{margin-top:2.4rem;}
/* 신고하기 텍스트 스타일 (KKW 전용 버튼 클래스)
상세(product_detail_kkw.php) 리뷰 섹션과 전체(product_rv_kkw.php) 페이지 모두 적용 */
.group_wr.review_sec .review_list_wr .rv_report_btn,
.review_full_pg .review_list_wr .rv_report_btn{background: none; border: 0; padding: 0; font-family: Pretendard; color: #7F7F7F !important; font-size: 1.3rem; font-style: normal; font-weight: 400; line-height: normal;}
/* ================= Seller info (product_detail_kkw.php) 추가 스타일 ================= */
/* 판매자 정보 구분선 */
.store_info_separator{width:100%;height:1px;background:#E8ECEF;}
/* 쿠폰 바 래퍼 (판매자 최대 혜택 적용 가능 쿠폰 박스)
- 모바일 좁은 화면(358px 미만)에서 깨짐 방지 위해 width를 유동화하고 최대너비 제한
- 고정 높이 대신 최소 높이 사용 + 내부 컨텐츠 정렬
*/
.seller_coupon_bar{display:flex;align-items:center;box-sizing:border-box;width:100%;min-height:39px;flex-shrink:0;border-radius:8px;border:1px solid #E4BFFF;background:#F3E3FF;padding:0 18px;}
/* 데스크톱은 전체 폭 사용, 모바일 좁은 화면에서만 최대폭 제한 */
@media (max-width:420px){
.seller_coupon_bar{max-width:358px;padding:0 14px;margin-left:auto;margin-right:auto;}
}
@media (max-width:380px){
.seller_coupon_bar{padding:8px 10px;}
}
/* 쿠폰 바 좌측 텍스트 컨테이너 */
.seller_coupon_text{display: flex; align-items: center; font-size: 1.4rem; font-weight: 500; color: #4B1FB8; gap: 8px; min-width: 0;}
.seller_coupon_label{white-space:nowrap;color:#3A117F;line-height:1;}
/* P 배지: 기존 쿠폰 이미지 위에 P 텍스트만 오버레이 (라운드 제거) */
.coupon_p_badge{position:relative;display:inline-block;width:18.734px;height:13.703px;flex-shrink:0;}
.coupon_p_badge_svg{display: block; width: 100%; height: 100%;}
.coupon_p_badge_char{position: absolute; left: 50%; top: 50%; width: 8.327px; height: 14.757px; display: flex; align-items: center; justify-content: center; transform: translate(-50%,-50%); color: #FFF; font-size:1.2rem; font-style: normal; font-weight: 900; line-height: normal; pointer-events: none;}
/* 쿠폰 바 우측 라인 */
.coupon_divider{display:inline-block;width:1px;height:16px;background:#870AE0;margin:0 14px;}
/* 받기 버튼 */
.coupon_download_btn{display: inline-flex; align-items: center; gap: 2px; background: transparent; color: #870AE0; font-size:1.4rem; font-style: normal; font-weight: 400; line-height: 1; letter-spacing: -0.42px; padding: 0;}
.coupon_download_svg{width:11.162px;height:11.183px;flex-shrink:0;display:inline-block;}
/* 반응형 안전장치: 작은 화면에서 너비가 부족할 때 쿠폰 라벨 줄바꿈 허용 */
@media (max-width:360px){
.seller_coupon_label{white-space:normal;}
}
/* 판매자 지표: 최근판매 / 빠른배송 / CS응답 / 구매만족 공통 타이포 */
.recent-sales-count,
.fast-delivery-count,
.cs-response-count,
.purchase-score-count{color:#000; font-size:1.6rem; font-weight:700;line-height:normal;display:flex;align-items:center;justify-content:center;height:19px;min-height:19px;}
.recent-sales-label,
.fast-delivery-label,
.cs-response-label,
.purchase-score-label{font-family: Pretendard;color:#4E4E4E; font-size:1.4rem; font-weight: 500; line-height:1;}
/* 라벨 텍스트/아이콘(정보) 중앙라인 정렬 보정 */
.recent-sales-label > span,
.fast-delivery-label > span,
.cs-response-label > span,
.purchase-score-label > span{display:inline-flex;align-items:center;line-height:1;}
/* ✅ 스토어 지표 라벨 텍스트 (Pretendard 적용해도 OS 동일하게) */
.recent-sales-label,
.fast-delivery-label,
.cs-response-label,
.purchase-score-label{
font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
color:#4E4E4E;
font-size:1.4rem;
font-weight:500;
display:inline-block; /* ✅ baseline 영향 최소화 */
line-height:14px; /* ✅ 핵심: 아이콘 높이와 동일(px 고정) */
vertical-align:middle;
}
/* ✅ 라벨 + info 아이콘 래퍼 (해당 영역 한정) */
.store_info_wr--v2 .metric_tooltip{
display:inline-flex;
align-items:center; /* ✅ 핵심: 중앙정렬 */
vertical-align:middle;
gap:2px; /* 라벨-아이콘 간격(필요 없으면 삭제) */
line-height:14px; /* ✅ 텍스트/아이콘 기준 통일 */
}
/* ✅ info 버튼 */
.store_info_wr--v2 .metric_tooltip .info_btn{
display:inline-flex;
align-items:center;
justify-content:center;
width:14px;
height:14px;
padding:0 !important;
line-height:0;
background:transparent;
border:0;
transform:none !important; /* ✅ 기존 보정/캐시 스타일 제거 */
}
/* ✅ png 아이콘 */
.store_info_wr--v2 .metric_tooltip .info_btn img{
width:14px;
height:14px;
display:block;
transform:none !important; /* ✅ 기존 보정/캐시 스타일 제거 */
}
/* ✅ (케이스2) 버튼 없이 바로 붙는 아이콘도 동일 정렬 */
.store_info_wr--v2 .metric_tooltip > img.icon_14{
width:14px;
height:14px;
display:block;
flex-shrink:0;
transform:none !important;
}
/* 버튼 그룹: 모바일 가변 2열, 부모 폭 100% 사용 */
/* 모바일 가로 드래그 시 좌우 흔들림 방지:
- 내부 버튼을 유동폭 flex로 재구성
- 최대 폭 358px 유지 + 중앙 정렬
- grid -> flex 로 변경 (일부 브라우저에서 grid + fractional rounding이 수평 overflow 유발)
*/
.seller_action_group{display:flex;gap:8px;width:100%;padding:0;box-sizing:border-box;}
/* ================= Follow / Store Home Buttons ================= */
/* 팔로우 버튼: 보라 배경 + 흰 텍스트 */
.follow_btn_style{display:flex;background: #870AE0;border: 1px solid #870AE0;align-items:center;justify-content:center;flex:1 1 0;min-width:0;height:40px;box-sizing:border-box;border-radius:8px;font-family: Pretendard;color: #FFF;font-size:1.4rem;font-style:normal;font-weight:600;line-height:normal;letter-spacing:0;text-decoration:none;gap:0.45rem;padding:0;outline:none;box-shadow:none;}
/* 공통 포커스/액티브 아웃라인 제거 */
.follow_btn_style:focus,.follow_btn_style:active,
.store_home_btn_style:focus,.store_home_btn_style:active{outline:none;box-shadow:none;}
/* 팔로우 버튼만 border 제거 유지 */
.follow_btn_style:focus,.follow_btn_style:active{border:0;}
.follow_btn_style img{display:inline-block;}
.follow_btn_style .icon_follow{position:relative;top:1px;display:inline-block;}
.follow_btn_style:active{filter:brightness(.92);}
/* 스토어홈 버튼: 흰 배경 + 보라 테두리/텍스트 */
.store_home_btn_style{display:flex;align-items:center;justify-content:center;flex:1 1 0;min-width:0;height:40px;box-sizing:border-box;border-radius:8px;background:#FFFFFF;border:1px solid #870AE0;font-family: Pretendard;color:#870AE0;font-size:1.4rem;font-style:normal;font-weight:600;line-height:normal;letter-spacing:0;text-decoration:none;gap:0.45rem;padding:0;outline:none;box-shadow:none;cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease;}
/* btn-outline-primary 느낌: hover/active 시 보라 배경 + 흰 글씨 */
.store_home_btn_style:hover,.store_home_btn_style:active{color:#FFFFFF;background:#870AE0;border-color:#870AE0;text-decoration:none;}
.store_home_btn_style:hover .icon_store_arrow,.store_home_btn_style:active .icon_store_arrow{filter:brightness(0) invert(1);}
/* 수평 오버플로우 방지 (안전장치) */
.product_dt_layout, body{overflow-x:hidden;}
/* ================= 상품 제목 (product_detail.php) ================= */
/* 대상: */
.product_dt_layout .fw_500{
color:#000;
font-family:Pretendard;
font-size:1.6rem;
font-style:normal;
line-height:2.5rem; /* 156.25% */
}
/* 구매만족 별(★) 및 값 타이포 */
.seller_rating_star{display:inline-block;width:14px;height:13px;flex-shrink:0;object-fit:contain;}
/*.seller_rating_stars{display:inline-flex;align-items:center;gap:1px;line-height:0;}*/
.seller_rating_stars img{display:block;width:14px;height:13px;object-fit:contain;}
.purchase-score-count .seller_rating_value{font-size:1.6rem;font-weight:600;line-height:1;}
/* 위 공통 규칙으로 통합됨 */
.store_home_btn_style img{display:inline-block;}
.store_home_btn_style .icon_store_arrow{position:relative;top:1px;display:inline-block;}
/* 텍스트 라인 높이 고정으로 베이스라인 기준 안정화 */
.follow_btn_txt,.store_home_txt{line-height:1;display:inline-block;}
.store_home_btn_style:active{filter:brightness(.94);}
/* 모바일(좁은 화면)에서 버튼 폭 100%로 스택 */
/* 모바일에서도 2개 버튼을 1행 유지 (기존 column 전환 제거) */
/* ================= 상품 문의 (탭4 KKW) UI 리뉴얼 ================= */
.inquiry_section{background:#FFFFFF;}
/* 인트로 카드 */
.inquiry_intro_card{margin:0 16px 12px;padding:18px 16px 20px;border-radius:8px;background:#F5F6FA;text-align:center;}
.inquiry_intro_txt{font-family: Pretendard;margin:0 0 14px 0;font-size:1.4rem;font-weight:500;line-height:20px;color:#222;}
.inquiry_intro_txt .intro_highlight{color:#7E23FF;font-weight:600;}
.inquiry_primary_btn{display:inline-flex;align-items:center;justify-content:center;width:135px;height:34px;flex-shrink:0;padding:0;border-radius:6px;background:#870AE0;letter-spacing:0;border:0;box-shadow:none;color: #FFF;font-family: Pretendard;font-size: 1.6rem;font-style: normal;font-weight: 500;line-height: 20px; /* 125% */}
.inquiry_primary_btn:active{filter:brightness(.92);}
.inquiry_primary_btn:focus{outline:2px solid rgba(126,35,255,.35);outline-offset:2px;}
/* 세그먼트 탭 */
.inquiry_segment_wr{margin:0 16px 8px;}
.inquiry_segment{display:flex;width:100%;height:54px;border-radius:8px;background:#F5F6FA;overflow:hidden;}
.segment_btn{flex:1 1 50%;position:relative;display:flex;align-items:center;justify-content:center;font-family: Pretendard;font-size: 1.6rem;font-style: normal;font-weight: 500;line-height: 20px; /* 125% */border:0;outline:none;cursor:default;}
.segment_btn.is-active{background:#FFFFFF;color:#232A35;}
.segment_btn.is-active::after{content:"";position:absolute;inset:0;border:2px solid #870AE0;border-radius:8px;pointer-events:none;}
.segment_btn[disabled]{color:#C0C6CC;}
.segment_btn:active:not([disabled]){filter:brightness(.96);}
.segment_count{margin-left:6px;color:#870AE0;font-weight:700;}
/* 구 스타일 숨김 */
.inquiry_tabs_wr,.inquiry_tabs,.inquiry_tab{display:none !important;}
/* 리스트 래퍼 */
#inquiry_list_wr .inquiry_list_wr #qt_wr{list-style:none;margin:0;padding:0;}
#inquiry_list_wr .inquiry_list_wr #qt_wr > li{margin:0;padding-top:12px;border-bottom:1px solid #E6E8EB;}
#inquiry_list_wr .inquiry_list_wr #qt_wr > li:first-child{padding-top:6px;} /* 첫 항목 상단 간격 유지 */
/* 최종 목록의 마지막 항목만 하단선 제거 (버튼 상단 라인과 중복 방지) */
#inquiry_list_wr .inquiry_list_wr:last-of-type #qt_wr > li:last-child{border-bottom:0;}
/* 여러 페이징 블록 사이 시각적 구분선 유지 */
#inquiry_list_wr .inquiry_list_wr + .inquiry_list_wr{margin-top:0;}
/* 접힘 버튼 카드 */
#inquiry_list_wr .collapse_btn{position:relative;width:100%;text-align:left;background:#FFFFFF;border:0;border-radius:0;padding:0 18.12px 0 78px;box-shadow:none;display:block;} /* 우측 여백 18.12px */
#inquiry_list_wr .collapse_btn.secret_inq{background:#FFFFFF;}
#inquiry_list_wr .collapse_btn .inq_tit{font-family: Pretendard;display:block;font-size:1.4rem;font-weight:500;color:#232A35;line-height:20px;}
#inquiry_list_wr .collapse_btn .secret_ico{width:14px;height:14px;margin-right:4px;flex-shrink:0;}
/* 비밀글 잠금 아이콘 (제목 바로 옆 인라인 배치) */
.collapse_btn .inq_tit_row{display:flex;align-items:center;gap:6px;}
.collapse_btn .inq_tit_row .secret_lock_icon{display:inline-flex;align-items:center;justify-content:center;width:9.75px;height:13px;flex-shrink:0;margin:0;position:static;transform:none;}
.collapse_btn .inq_tit_row .secret_lock_icon svg{width:100%;height:100%;display:block;}
/* 상태 배지 */
#inquiry_list_wr .inquiry_status{position:absolute;left:16px;top:50%;transform:translateY(-52%);display:flex;flex-direction:column;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0;font-size:1.3rem;font-weight:500;padding:0;border-radius:50%;background:#F5F5F5;color:#BDBDBD;letter-spacing:0;text-align:center;} /* 약간 위로 올려 시각적 중앙 (-52%) */
#inquiry_list_wr .inquiry_status.done{background:#F3E3FF;color:#870AE0;}
#inquiry_list_wr .inquiry_status::before{content:"답변";display:block;}
#inquiry_list_wr .inquiry_status::after{content:attr(data-after);}
#inquiry_list_wr .collapse_btn .line{display:inline-block;width:1px;height:12px;background:#E9E9E9;vertical-align:middle;font-size:0;line-height:0;overflow:hidden;}
/* 이메일/날짜 줄 */
#inquiry_list_wr .collapse_btn .d-flex.align-items-center.flex-wrap.text-gray-300{ color: #757C8A !important;font-family: Pretendard;font-size: 1.3rem;font-style: normal;font-weight: 400;line-height: 20px;}
#inquiry_list_wr .collapse_btn .d-flex.align-items-center.flex-wrap.text-gray-300 span{line-height:13px;}
/* 토글 아이콘 */
#inquiry_list_wr .collapse_btn .inq_toggle_icon{position:absolute;right:18.12px;top:50%;transform:translateY(-52%);display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:0;} /* 상태 배지와 동일하게 약간 위로 (-52%) */
#inquiry_list_wr .collapse_btn .inq_toggle_icon svg{height:10px;flex-shrink:0;transform:rotate(0deg);stroke:#262626;stroke-width:1.2px;transition:transform .18s ease;}
#inquiry_list_wr .collapse_btn[aria-expanded="true"] .inq_toggle_icon svg{transform:rotate(180deg);}
/* 펼침 컨텐츠 */
#inquiry_list_wr .inquiry_list_wr .user_cont_wr,
.inquiry_list_wr .user_cont_wr{padding:17px 16px 11px;}
#inquiry_list_wr .collapse_cont .user_cont{font-family: Pretendard;font-size:1.4rem;font-weight:400;color:#4E5968;line-height:18px;margin:0;word-break:break-word;}
#inquiry_list_wr .inquiry_list_wr .collapse_cont,
.inquiry_list_wr .collapse_cont{background:var(--bg-light, #F6F7F8);}
#inquiry_list_wr .collapse_cont .store_cont_wr{position:relative;margin:0;padding:7px 16px 16px;border:0;border-radius:8px;}
#inquiry_list_wr .collapse_cont .store_name{font-size:0;margin:0 0 7px 0;}
#inquiry_list_wr .collapse_cont .store_name::before{content:"판매자";display:inline-flex;align-items:center;justify-content:center;height:22px;padding:0 10px;border-radius:11px;background:#870AE0;color:#FFFFFF;font-size:1.2rem;font-weight:600;line-height:1;}
#inquiry_list_wr .collapse_cont .store_cont{font-family: Pretendard;font-size:1.4rem;color:#232A35;line-height:18.5px;margin:0 0 10px 0;white-space:pre-line;}
#inquiry_list_wr .collapse_cont .store_date{font-family: Pretendard;font-size:1.1rem;color:#8D95A0;margin:0;font-weight:500;}
/* 상품 문의 답변 시간 (탭4) 커스텀 스타일 */
#inquiry_list_wr .collapse_cont .store_cont_wr .store_name .store_date{font-family: Pretendard;margin-left: 9px; color: #870AE0; text-align: center; font-size: 1.2rem; font-style: normal; font-weight: 400; line-height: 20px; /* 166.667% */ display: inline-block;}
@media (max-width:380px){
.inquiry_intro_card{padding:16px 12px 18px;}
.inquiry_primary_btn{width:135px;height:34px;font-size:1.5rem;} /* 모바일도 동일 레이아웃 유지 */
.inquiry_segment{height:50px;}
#inquiry_list_wr .collapse_btn{padding:0 18.12px 0 76px;} /* 모바일 우측 18.12px */
#inquiry_list_wr .inquiry_status{left:16px;width:46px;height:46px;font-size:1.1rem;} /* 모바일에서도 동일 좌측 정렬 */
#inquiry_list_wr .collapse_btn .inq_toggle_icon{right:18.12px;width:16px;height:16px;} /* 모바일 동일 센터링 */
#inquiry_list_wr .collapse_cont{margin-left:0;padding:12px 16px 14px;}
#inquiry_list_wr .collapse_cont .store_cont_wr{padding:10px 16px 14px;}
}
/* (삭제됨) 스크롤 네비게이션 스타일 제거 */
/* ================= 답변 완료 텍스트 스타일 ================= */
/* 사용 예:
답변완료
*/
.answer-complete{color:#870AE0;text-align:center;font-size:1.3rem;font-style:normal;font-weight:500;line-height:1.3rem;letter-spacing:0;}
/* 인라인(좌우 여백 없이 줄 안에서 쓰는 경우) */
.answer-complete-inline{display:inline;color:#870AE0;font-size:1.3rem;font-style:normal;font-weight:500;line-height:1.3rem;}
/* 배지 형태로 사용할 때 옵션 (필요 시) */
.answer-complete-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:6px;background:#F3E3FF;color:#870AE0;font-size:1.3rem;font-weight:500;line-height:1.3rem;}
/* ================= 답변 대기 텍스트/배지 스타일 ================= */
/* 기본 텍스트: 답변대기
*/
.answer-pending{color:#BDBDBD;text-align:center;font-size:1.3rem;font-style:normal;font-weight:500;line-height:1.3rem;letter-spacing:0;}
/* 인라인 버전 */
.answer-pending-inline{display:inline;color:#BDBDBD;font-size:1.3rem;font-style:normal;font-weight:500;line-height:1.3rem;}
/* 배지 형태 (알약 모양) */
.answer-pending-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 10px;border-radius:999px;background:#F5F5F5;color:#BDBDBD;font-size:1.3rem;font-weight:500;line-height:1.3rem;}
/* 완전 동그라미 박스 (고정 크기 필요할 때) */
/* Adjusted size for pending circle badge */
.answer-pending-circle{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:#F5F5F5;color:#BDBDBD;font-size:1.3rem;font-weight:500;line-height:1.3rem;text-align:center;}
/* 기존 문의 상태 클래스 확장 (답변대기) */
#inquiry_list_wr .inquiry_status.wait{background:#F5F5F5;color:#BDBDBD;}
/* ================= 문의 더보기 버튼 구분선 (탭4 공통) ================= */
#qt_list_add.inquiry_more_wr{position:relative;width:100%;}
#qt_list_add.inquiry_more_wr::before{content:"";display:block;width:100%;height:1px;background:#E6E8EB;position:absolute;top:-16px;left:0;}
#qt_list_add.inquiry_more_wr button{margin-top:0;}
/* 마지막 문의 아이템 하단 구분선 */
#inquiry_list_wr .user_cont_wr{border-bottom:0 !important;}
/* 상품 문의 헤더 중앙정렬 (kkw 전용) */
/* 중앙정렬 헤더: 기존 높이/패딩 변형 없이 타이틀만 중앙 배치 */
.hd_m.hd_m--center-title{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;z-index:1000;background:#FFFFFF;} /* 고정 헤더 */
.hd_m.hd_m--center-title .page_tit{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;flex:0 0 auto;width:auto;}
.hd_m.hd_m--center-title button{position:relative;left:auto;top:auto;transform:none;}
/* ================= 팔로워 카운트 텍스트 스타일 ================= */
/* 사용 예: 팔로워 0 */
.seller_follower_count{font-family: Pretendard;color:#121212;font-size:1.4rem;font-style:normal;font-weight:600;line-height:normal;}
/* 판매자 이름(스토어명) 타이포 */
.store_info_wr .store_tit{font-family: Pretendard;color:#000;font-size:1.8rem;font-style:normal;font-weight:700;line-height:normal;}
/* ================ Coupon Complete Modal (KKW 전용) ================ */
/* 배경(검은 반투명)은 .coupon-complete-backdrop 클래스가 붙은 bootstrap backdrop에서 처리 */
.modal-backdrop.coupon-complete-backdrop{background:#000 !important;opacity:.7 !important;}
#coupon_complete_modal_kkw .modal-dialog{max-width:318px;width:318px;margin-left:auto;margin-right:auto;}
#coupon_complete_modal_kkw .modal-content{width:318px;min-height:140px;border-radius:16px;background:#FFF;border:0;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.coupon_complete_modal .coupon_complete_body{width:100%;text-align:center;}
.coupon_complete_modal .coupon_complete_tit{margin:26px 0 7px 0;color:#000;font-family:Pretendard;font-size:2.0rem;font-style:normal;font-weight:700;line-height:normal;letter-spacing:-0.8px;}
.coupon_complete_modal .coupon_complete_desc{margin:0 0 24px 0;color:#979797;font-family:Pretendard;font-size:1.4412rem;font-style:normal;font-weight:400;line-height:normal;letter-spacing:-0.865px;}
.coupon_complete_modal .coupon_complete_divider{width:100%;height:1px;background:#EAEAEA;}
.coupon_complete_modal .cm_close_btn{background:transparent;border:0;padding:0;color:#343434;font-family:Pretendard;font-size:15px;font-style:normal;font-weight:400;line-height:normal;letter-spacing:0;cursor:pointer;margin: 12px 0 12px 0;}
.coupon_complete_modal .cm_close_btn:active{opacity:.85;}