/* =========================================
 * 상품문의 / 상품후기
 * ========================================= */

.prd_review_wrap,
.prd_inquiry_wrap{
	margin-top:30px;
}

.prd_review_top,
.prd_inquiry_top{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	margin-bottom:20px;
	padding-bottom:14px;
	border-bottom:1px solid #e5e5e5;
}

.prd_review_score{
	display:flex;
	align-items:center;
	gap:12px;
	flex-wrap:wrap;
}

.prd_review_score .score_num{
	font-size:28px;
	font-weight:800;
	color:#111;
	line-height:1;
}

.prd_review_score .score_cnt,
.prd_inquiry_top .count_txt{
	font-size:14px;
	color:#666;
}

.rv_star{
	display:inline-flex;
	align-items:center;
	gap:2px;
	line-height:1;
	color:#d8d8d8;
	font-size:16px;
	letter-spacing:0;
}

.rv_star .on{
	color:var(--hh-yellow, #ffc12f);
}

/* 작성영역 */
.prd_review_write,
.prd_inquiry_write{
	margin-bottom:28px;
	padding:24px;
	border:1px solid #e5e5e5;
	border-radius:16px;
	background:#fafafa;
}

.rv_write_box,
.iq_write_box{
	display:flex;
	flex-direction:column;
	gap:16px;
}

.rv_row,
.iq_row{
	display:flex;
	flex-direction:column;
	gap:8px;
}

.rv_row input[type="text"],
.rv_row select,
.rv_row textarea,
.iq_row input[type="text"],
.iq_row select,
.iq_row textarea{
	width:100%;
	min-height:52px;
	padding:14px 16px;
	border:1px solid #dcdcdc;
	border-radius:8px;
	background:#fff;
	font-size:14px;
	color:#111;
	box-sizing:border-box;
}

.rv_row textarea,
.iq_row textarea{
	min-height:140px;
	resize:vertical;
}

/* 비밀글 */
.iq_secret_row{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	justify-content:flex-start;
	gap:6px;
	margin-top:-4px;
	text-align:left;
}

.iq_check_label{
	display:inline-flex;
	align-items:center;
	gap:7px;
	font-size:14px;
	font-weight:600;
	color:#333;
	cursor:pointer;
}

.iq_check_label input[type="checkbox"]{
	appearance:auto;
	-webkit-appearance:checkbox;
	width:16px;
	height:16px;
	margin:0;
	opacity:1;
	visibility:visible;
	position:static;
}

.iq_secret_help{
	display:none;
	font-size:13px;
	color:#777;
	line-height:1.5;
	margin:0;
}

.iq_secret_row.active .iq_secret_help{
	display:block;
}

/* 파일첨부 - 작성폼 */
.iq_file_area{
	width:100%;
}

.iq_file_preview{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
}

.iq_file_add,
.iq_file_item{
	width:120px;
	height:120px;
	border-radius:8px;
	border:1px solid #e5e5e5;
	background:#f7f7f7;
	position:relative;
	overflow:hidden;
	box-sizing:border-box;
}

.iq_file_add{
	display:flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
}

.iq_file_add input{
	display:none;
}

.iq_file_add span{
	font-size:34px;
	color:#666;
	line-height:1;
}

.iq_file_item img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.iq_file_item.file{
	display:flex;
	align-items:center;
	justify-content:center;
	padding:10px;
	background:#f5f5f5;
}

.iq_file_name{
	width:100%;
	font-size:12px;
	line-height:1.45;
	color:#333;
	word-break:break-all;
	text-align:left;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
	text-overflow:ellipsis;
}

.iq_file_del{
	position:absolute;
	top:4px;
	right:4px;
	width:24px;
	height:24px;
	border:0;
	border-radius:50%;
	background:rgba(0,0,0,.65);
	color:#fff;
	font-size:14px;
	line-height:24px;
	cursor:pointer;
	padding:0;
	z-index:2;
}

.iq_file_del:hover{
	background:#111;
}

.file_help{
	margin-top:8px;
	font-size:13px;
	color:#666;
}

/* 버튼 */
.rv_row.btn,
.iq_row.btn{
	margin-top:8px;
}

.btn_small{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:50px;
	border:0;
	border-radius:10px;
	background:#222;
	color:#fff;
	font-size:15px;
	font-weight:700;
	cursor:pointer;
	box-sizing:border-box;
	text-decoration:none;
}

.btn_small.gray{
	background:#fff;
	border:1px solid #ccc;
	color:#333;
}

/* 빈 데이터 */
.empty_box{
	padding:32px 20px;
	border:1px dashed #ddd;
	border-radius:12px;
	background:#fff;
	text-align:center;
}

.empty_box p{
	margin:0;
	font-size:14px;
	line-height:1.7;
	color:#666;
}

/* 리스트 */
.prd_review_list,
.prd_inquiry_list{
	display:flex;
	flex-direction:column;
	gap:0;
}

/* 상품후기 editorial layout */
.prd_review_wrap{
	margin-top:24px;
}

.prd_review_top{
	display:block;
	margin-bottom:0;
	padding:0 0 34px;
	border-bottom:1px solid #dfe4e1;
}

.prd_review_action_row{
	display:flex;
	justify-content:flex-end;
	margin-bottom:24px;
}

.prd_review_write{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:190px;
	height:48px;
	padding:0 22px;
	border:1px solid var(--hh-ink, #171a18);
	background:var(--hh-ink, #171a18);
	color:#fff;
	font-size:14px;
	font-weight:650;
	text-decoration:none;
	box-sizing:border-box;
	transition:background .2s ease, color .2s ease;
}

.prd_review_write:hover{
	background:#fff;
	color:var(--hh-ink, #171a18);
}

.prd_review_summary{
	display:grid;
	grid-template-columns:minmax(220px, .72fr) minmax(0, 1.6fr);
	align-items:center;
	min-height:150px;
}

.prd_review_score{
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:7px;
	height:100%;
	padding-right:34px;
	text-align:center;
}

.prd_review_score_value{
	display:flex;
	align-items:center;
	gap:10px;
	line-height:1;
}

.prd_review_score_value > span{
	color:var(--hh-yellow, #ffc12f);
	font-size:38px;
}

.prd_review_score .score_num{
	color:var(--hh-ink, #171a18);
	font-size:45px;
	font-weight:730;
	letter-spacing:-.04em;
}

.prd_review_score p{
	margin:2px 0 0;
	color:#555f5a;
	font-size:13px;
	line-height:1.5;
}

.prd_review_score p strong,
.prd_review_score p b{
	color:var(--hh-ink, #171a18);
	font-weight:700;
}

.prd_review_score .score_cnt{
	color:#89918d;
	font-size:12px;
}

.prd_review_distribution{
	display:flex;
	flex-direction:column;
	gap:10px;
	padding:4px 0 4px 42px;
	border-left:1px solid #dfe4e1;
}

.prd_review_distribution_row{
	display:grid;
	grid-template-columns:78px minmax(100px, 1fr) 54px;
	align-items:center;
	gap:14px;
	color:#707975;
	font-size:12px;
}

.prd_review_distribution_row:first-child{
	color:var(--hh-ink, #171a18);
	font-weight:650;
}

.prd_review_distribution_row .bar{
	display:block;
	height:9px;
	overflow:hidden;
	border-radius:99px;
	background:#e9eeeb;
}

.prd_review_distribution_row .bar i{
	display:block;
	height:100%;
	border-radius:inherit;
	background:#c3cbc6;
}

.prd_review_distribution_row:first-child .bar i{
	background:var(--hh-green, #214d43);
}

.prd_review_distribution_row strong{
	color:inherit;
	font-weight:550;
	text-align:right;
}

.prd_review_list{
	gap:0;
}

.rv_item{
	display:grid;
	grid-template-columns:minmax(0, 1fr) 185px;
	gap:34px;
	padding:30px 0;
	border-bottom:1px solid #dfe4e1;
	background:#fff;
}

.rv_main{
	min-width:0;
}

.rv_item .rv_head{
	margin:0 0 13px;
	padding:0;
}

.rv_item .rv_star{
	font-size:18px;
}

.rv_item .rv_body{
	max-width:720px;
	font-size:15px;
	font-weight:450;
	line-height:1.8;
}

.rv_intake_period{
	display:inline-flex;
	margin-top:14px;
	padding:6px 9px;
	border-radius:4px;
	background:#f3f5f4;
	color:#68716d;
	font-size:11px;
	font-weight:550;
}

.rv_profile{
	min-width:0;
	padding:3px 0 0 28px;
	border-left:1px solid #dfe4e1;
}

.rv_profile .rv_name{
	display:block;
	margin-bottom:24px;
	color:var(--hh-ink, #171a18);
	font-size:14px;
	font-weight:700;
}

.rv_profile dl,
.rv_profile dl div{
	margin:0;
}

.rv_profile dl{
	display:flex;
	flex-direction:column;
	gap:9px;
}

.rv_profile dl div{
	display:grid;
	grid-template-columns:48px 1fr;
	gap:6px;
	font-size:12px;
	line-height:1.5;
}

.rv_profile dt{
	color:#909793;
	font-weight:550;
}

.rv_profile dd{
	margin:0;
	color:#555e59;
	font-weight:600;
}

.rv_files{
	gap:8px;
	margin-top:20px;
}

.rv_file_img{
	width:112px;
	height:112px;
	border:0;
	border-radius:6px;
}

.rv_actions{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:14px;
	margin-top:20px;
}

.rv_action{
	display:inline-flex;
	align-items:center;
	gap:6px;
	padding:0;
	border:0;
	background:transparent;
	color:#858d89;
	font-size:12px;
	font-weight:520;
	cursor:pointer;
}

.rv_action svg{
	width:15px;
	height:15px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.5;
	stroke-linecap:round;
	stroke-linejoin:round;
}

.rv_action svg.is-down{
	transform:rotate(180deg);
}

.rv_action:hover,
.rv_action.is-active{
	color:var(--hh-green, #214d43);
}

.rv_action--report.is-active,
.rv_action--report:disabled{
	color:var(--hh-coral, #f56546);
	cursor:default;
}

.rv_action_divider{
	width:1px;
	height:12px;
	background:#d9dfdc;
}

@media only screen and (max-width:840px){
	.prd_review_top{
		padding-bottom:26px;
	}

	.prd_review_action_row{
		justify-content:stretch;
		margin-bottom:22px;
	}

	.prd_review_write{
		width:100%;
	}

	.prd_review_summary{
		grid-template-columns:1fr;
		gap:24px;
	}

	.prd_review_score{
		padding:4px 0 22px;
	}

	.prd_review_score_value > span{
		font-size:32px;
	}

	.prd_review_score .score_num{
		font-size:39px;
	}

	.prd_review_distribution{
		padding:22px 0 0;
		border-top:1px solid #dfe4e1;
		border-left:0;
	}

	.prd_review_distribution_row{
		grid-template-columns:72px minmax(80px, 1fr) 46px;
		gap:10px;
	}

	.rv_item{
		grid-template-columns:1fr;
		gap:20px;
		padding:26px 0;
	}

	.rv_profile{
		order:-1;
		display:flex;
		align-items:center;
		gap:16px;
		padding:0 0 16px;
		border-bottom:1px solid #edf0ee;
		border-left:0;
	}

	.rv_profile .rv_name{
		margin:0;
	}

	.rv_profile dl{
		flex-direction:row;
		gap:12px;
	}

	.rv_profile dl div{
		display:flex;
		gap:4px;
	}

	.rv_profile dt{
		display:none;
	}

	.rv_profile dl div + div::before{
		content:"·";
		margin-right:8px;
		color:#b2b8b5;
	}

	.rv_item .rv_body{
		font-size:14px;
	}

	.rv_file_img{
		width:92px;
		height:92px;
	}

	.rv_actions{
		gap:12px;
	}
}

.rv_item,
.iq_item{
	padding:24px 0;
	border:0;
	border-bottom:1px solid #e3e7e4;
	border-radius:0;
	background:#fff;
}

.rv_rating_line{
	display:flex;
	align-items:center;
	gap:11px;
	flex-wrap:wrap;
}

.rv_best_badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:0;
	color:var(--hh-coral, #f56546);
	background:transparent;
	font-size:11px;
	font-weight:650;
	line-height:1;
	letter-spacing:.04em;
	flex-shrink:0;
}

.rv_head,
.iq_head{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:12px;
	margin-bottom:10px;
}

.rv_head .left,
.iq_head .left{
	display:flex;
	flex-direction:column;
	gap:6px;
	min-width:0;
}

.rv_head .right,
.iq_head .right{
	display:flex;
	align-items:center;
	gap:10px;
	flex-shrink:0;
	font-size:13px;
	font-weight:600;
	color:#5f6863;
}

.rv_title,
.iq_title{
	font-size:16px;
	font-weight:700;
	line-height:1.4;
	color:#111;
	word-break:keep-all;
}

.rv_item.is-best{
	border-color:#e3e7e4;
	box-shadow:none;
}

.rv_body,
.iq_body{
	font-size:15px;
	line-height:1.8;
	color:#303633;
	word-break:break-word;
}

.rv_files{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-top:16px;
}

.rv_file_img{
	display:block;
	width:96px;
	height:96px;
	border:1px solid #e5e5e5;
	border-radius:8px;
	overflow:hidden;
	background:#f7f7f7;
}

.rv_file_img img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .2s ease;
}

.rv_file_img:hover img,
.iq_attach_img:hover img{
	transform:scale(1.04);
}

.review_img_viewer{
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:10000;
}

.review_img_viewer.active{
	display:block;
}

.review_img_dim{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.72);
}

.review_img_box{
	position:absolute;
	left:50%;
	top:50%;
	max-width:calc(100% - 40px);
	max-height:calc(100vh - 40px);
	transform:translate(-50%, -50%);
}

.review_img_box img{
	display:block;
	max-width:100%;
	max-height:calc(100vh - 40px);
	border-radius:8px;
	background:#fff;
	object-fit:contain;
}

.review_img_close{
	position:absolute;
	right:-12px;
	top:-12px;
	width:32px;
	height:32px;
	border:0;
	border-radius:50%;
	background:#111;
	color:#fff;
	font-size:16px;
	line-height:32px;
	padding:0;
	cursor:pointer;
	z-index:2;
}

.rv_answer,
.iq_answer{
	margin-top:16px;
	padding:16px;
	border-radius:10px;
	background:#f7f7f7;
}

.rv_answer strong,
.iq_answer strong{
	display:block;
	margin-bottom:8px;
	font-size:14px;
	font-weight:700;
	color:#111;
}

.answer_body{
	font-size:14px;
	line-height:1.7;
	color:#444;
}

.answer_date{
	margin:8px 0 0;
	font-size:12px;
	color:#999;
}

.rv_btns,
.iq_btns{
	display:flex;
	justify-content:flex-end;
	gap:8px;
	margin-top:14px;
}

.iq_status{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:74px;
	height:28px;
	padding:0 10px;
	border-radius:999px;
	font-size:12px;
	font-weight:700;
	box-sizing:border-box;
}

.iq_status.wait{
	background:#f2f2f2;
	color:#666;
}

.iq_status.done{
	background:#fff3ec;
	color:#ff5a1f;
}

.secret_msg{
	color:#888;
}

/* 리스트 첨부파일 */
.iq_attach_area{
	margin-top:18px;
	display:flex;
	flex-direction:column;
	gap:10px;
}

.iq_attach_images{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}

.iq_attach_img{
	display:block;
	width:84px;
	height:84px;
	border:1px solid #e5e5e5;
	border-radius:8px;
	overflow:hidden;
	background:#f7f7f7;
}

.iq_attach_img img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
	transition:transform .2s ease;
}

.iq_attach_img:hover img{
	transform:scale(1.04);
}

.iq_attach_files{
	display:flex;
	flex-direction:column;
	gap:6px;
	max-width:420px;
}

.iq_attach_file{
	display:flex;
	align-items:center;
	gap:8px;
	height:36px;
	padding:0 10px;
	border:1px solid #e5e5e5;
	border-radius:8px;
	background:#fafafa;
	text-decoration:none;
	box-sizing:border-box;
	color:#333;
}

.iq_attach_file:hover{
	background:#f2f2f2;
}

.iq_attach_file .file_icon{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
	min-width:42px;
	height:22px;
	padding:0 6px;
	border-radius:5px;
	background:#333;
	color:#fff;
	font-size:10px;
	font-weight:700;
	line-height:1;
	box-sizing:border-box;
}

.iq_attach_file .file_name{
	display:block;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	font-size:13px;
	color:#333;
}

/* 페이징 */
.paging_area{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:6px;
	margin-top:24px;
}

.paging_area a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:36px;
	height:36px;
	padding:0 10px;
	border:1px solid #ddd;
	border-radius:8px;
	background:#fff;
	font-size:13px;
	color:#444;
	text-decoration:none;
	box-sizing:border-box;
}

.paging_area a.on{
	border-color:#222;
	background:#222;
	color:#fff;
}

.paging_area a.pg_nav{
	font-size:16px;
	font-weight:700;
}

.pb_board_loading{
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	display:none;
	z-index:10000;
	background:rgba(255,255,255,.35);
}

.pb_board_loading_inner{
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%);
	display:flex;
	align-items:center;
	justify-content:center;
	width:72px;
	height:72px;
	border-radius:50%;
	background:rgba(255,255,255,.92);
	box-shadow:0 8px 24px rgba(0,0,0,.12);
}

.pb_board_spinner{
	width:32px;
	height:32px;
	border:3px solid #ffd8cb;
	border-top-color:#ff6a3a;
	border-radius:50%;
	animation:pbSpin .8s linear infinite;
	box-sizing:border-box;
}

@keyframes pbSpin{
	100%{
		transform:rotate(360deg);
	}
}

/* 레이어 */
body.layer_open{
	overflow:hidden;
}

.pb_layer{
	display:none;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:9999;
}

.pb_layer.active{
	display:block;
}

.pb_layer_dim{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.55);
}

.pb_layer_box{
	position:absolute;
	left:50%;
	top:50%;
	width:640px;
	max-width:calc(100% - 32px);
	max-height:calc(100vh - 60px);
	transform:translate(-50%, -50%);
	background:#fff;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 10px 40px rgba(0,0,0,.25);
}

.pb_layer_head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:20px 24px;
	border-bottom:1px solid #eee;
}

.pb_layer_head h3{
	margin:0;
	font-size:20px;
	font-weight:700;
	color:#111;
}

.pb_layer_close{
	width:32px;
	height:32px;
	border:0;
	background:none;
	font-size:28px;
	line-height:1;
	color:#333;
	cursor:pointer;
}

.pb_layer_body{
	padding:24px;
	max-height:calc(100vh - 140px);
	overflow-y:auto;
}

.pb_layer_body .prd_inquiry_write{
	margin:0;
	padding:0;
	border:0;
	background:none;
}

.iq_write_open{
	width:auto;
	min-width:110px;
	height:42px;
}

/* 모바일 */
@media only screen and (max-width:840px){

	.prd_review_write,
	.prd_inquiry_write{
		padding:16px;
		border-radius:12px;
	}

	.rv_item,
	.iq_item{
		padding:20px 0;
		border-radius:0;
	}

	.rv_best_badge{
		font-size:10px;
	}

	.rv_item .rv_head{
		padding-right:52px;
	}

	.pb_board_loading_inner{
		width:64px;
		height:64px;
	}

	.pb_board_spinner{
		width:28px;
		height:28px;
	}

	.rv_head,
	.iq_head{
		flex-direction:column;
	}

	.rv_title,
	.iq_title{
		font-size:15px;
	}

	.iq_file_add,
	.iq_file_item{
		width:90px;
		height:90px;
	}

	.btn_small{
		height:48px;
		font-size:14px;
	}

	.pb_layer_box{
		width:calc(100% - 24px);
		max-height:calc(100vh - 40px);
		border-radius:12px;
	}

	.pb_layer_head{
		padding:16px;
	}

	.pb_layer_body{
		padding:16px;
		max-height:calc(100vh - 110px);
	}

	.iq_write_open{
		width:auto;
	}
}

.prd_review_wrap .prd_review_write{
	border-radius:0;
	color:#fff !important;
}

.prd_review_wrap .prd_review_write:hover{
	color:var(--hh-ink, #171a18) !important;
}

.hh-product-page .rv_actions{
	gap:11px;
	margin-top:16px;
}

.hh-product-page .rv_action{
	gap:4px;
	color:#969d99 !important;
	font-size:12px !important;
	font-weight:480 !important;
	line-height:1.4 !important;
}

.hh-product-page .rv_action svg{
	width:14px;
	height:14px;
}

.hh-product-page .rv_action:hover,
.hh-product-page .rv_action.is-active{
	color:var(--hh-green, #214d43) !important;
}

.hh-product-page .rv_action--report.is-active,
.hh-product-page .rv_action--report:disabled{
	color:var(--hh-coral, #f56546) !important;
}

.hh-product-page .rv_action_divider{
	height:10px;
	background:#e1e5e3;
}

.hh-product-page .rv_profile .rv_name{
	margin-bottom:9px;
}

.hh-product-page .rv_profile dl{
	gap:3px;
}

.hh-product-page .rv_profile dl div{
	grid-template-columns:42px 1fr;
	gap:3px;
	font-size:11px;
	line-height:1.45;
}

@media only screen and (max-width:840px){
	.rv_item .rv_head{
		padding-right:0;
	}

	.rv_profile{
		display:flex;
	}

	.rv_profile dl div{
		display:flex;
		gap:2px;
	}

	.rv_profile dl{
		gap:8px;
	}

	.rv_profile dt{
		display:none;
	}
}