@charset "utf-8";

/* 갤러리 분류 */
.product_gall #bo_cate{width: 100%; background-color: #f9f9f9; border-radius: var(--bor_r); padding: 30px; margin-bottom:0}
.product_gall #bo_cate_ul{justify-content: left; }
.product_gall #bo_cate_ul > li{width:calc(100% / 7); text-align: center;}
.product_gall #bo_cate_ul > li a{background-color: #fff;}


/* 갤러리 목록 */
.board_product_gallery{margin-right:-20px;}
.board_product_gallery > li{ width:25%; margin-bottom: 20px;} 
.board_product_gallery > li .gall_box{border-radius:var(--item_r); padding:1.5em 1.5em 2em; position: relative; transition: .3s; height:100%; margin-right:20px; background-color: #f7f7f7;}
.board_product_gallery > li .gall_box:hover{} 

.board_product_gallery > li .gall_box .gall_chk {position:absolute; top:5px; left:5px; padding:5px; z-index:1}
.board_product_gallery > li .gall_box .gall_img{margin-bottom: 20px; width: 100%;}
.board_product_gallery > li .gall_box .gall_img img{border-radius: var(--item_r); width:100%; height: auto;}
.board_product_gallery > li .gall_box .gall_text_href{width:100%;}
.board_product_gallery > li .gall_box .bo_cate_link{font-size:.938em; font-weight:500; color:var(--mainColor)!important;}
.board_product_gallery > li .gall_box .bo_cate_link:before,
.board_product_gallery > li .gall_box .bo_cate_link:after{display:none;}
.board_product_gallery > li .gall_box .bo_tit{margin-top:12px; font-size:1.25em; font-weight:600; color:#111; line-height:1.4}
.board_product_gallery > li .gall_box .bo_cnt{margin-top:8px; font-size:.938em; color:#999}
.board_product_gallery > li .gall_box .bo_cnt span{color:#777;}
.board_product_gallery > li .gall_box .bo_cnt .ws{width:54px;}
.board_product_gallery > li .gall_box .bo_cnt .ws2{width: calc(100% - 75px);}
.board_product_gallery > li .gall_box .bo_cnt .bar{margin:0 7px; display: inline-block;}

.bo_top_wrap{}
.bo_top_wrap .bo_top_img{width:47%; border:1px solid #ccc; text-align: center; position: relative; border-radius: var(--bor_r);}
.bo_top_wrap .bo_top_img .bo_top_slide .slick-slide img{display:inline-block;}
.bo_top_wrap .bo_top_img .bo_slide_arr{position: absolute; bottom:10px; left:50%; transform: translateX(-50%); background: rgba(0, 0, 0, .3); border-radius: 50px; padding: 2px 5px; color:#fff;}
.bo_top_wrap .bo_top_img .bo_slide_arr .bo_slide_cnt{margin:0 5px; letter-spacing: 1.5px;}
.bo_top_wrap .bo_top_img .bo_slide_arr .xi{cursor:pointer;}
.bo_top_wrap .bo_top_txt{width:100%; padding-bottom:3em; margin-bottom: 3em; border-bottom:1px solid #ccc;}
.bo_top_wrap .bo_top_txt .bo_cate_link{font-size: 1.068em; color:var(--mainColor)!important; font-weight: 600; margin-bottom:10px;}
.bo_top_wrap .bo_top_txt .bo_cate_link:before,
.bo_top_wrap .bo_top_txt .bo_cate_link:after{display:none;}
.bo_top_wrap .bo_top_txt .bo_v_tt{font-size:2em; font-weight: 700; margin-bottom: 10px;}
.bo_top_wrap .bo_top_txt .bo_v_tx{font-size: 1.068em; color: #999;}
.bo_top_wrap .bo_top_txt .bo_op_list{margin-top:40px;}

.bo_op_list{margin-top:25px; padding:3em; background-color: #f7f7f7; border-radius: 10px;}
.bo_op_list > li{margin-bottom:5px; width:33.33%; gap:15px;}
.bo_op_list > li .op_tt{background-color:var(--mainColor); color:#fff; border-radius: 50px; padding:5px 15px; min-width:110px; text-align: center;}
.bo_op_list > li .op_tx{margin-top: 6px; color:#444;}

.prod_sch{width:100%; border-radius: var(--bor_r); background-color: #f9f9f9; padding:30px; margin-bottom:30px;}
.prod_sch .bo_sch{margin-top:0;}

.bo_v_ainfo{border:1px solid #999; padding:30px; border-radius: 10px; margin-bottom:60px;}
.bo_v_ainfo .ainfo_list{gap:20px; margin: 20px 0;}
.bo_v_ainfo .ainfo_list > li{width:33.33%; font-size:1.068em; color:#444; gap:20px; display:flex;}
.bo_v_ainfo .ainfo_list > li .bar{color:#aaa; font-weight: 400;}
.bo_v_ainfo #bo_v_file_st ul{gap:7px;}
.bo_v_ainfo #bo_v_file_st a{background-color: #333; color:#fff; border-radius: 5px; padding:7px 20px; display:inline-block;}
.bo_v_ainfo #bo_v_file_st a .xi{margin-right:5px; vertical-align: -2px;}
.board_stt{font-size:1.25em; font-weight: 500; margin-bottom: 7px;}

/* 제품 속성 필터 */
.prod_filter{width:100%; background-color:#f9f9f9; border-radius:var(--bor_r); padding:20px 30px 30px; margin-bottom:20px;}
.prod_filter .pf_grid{display:flex; flex-wrap:wrap; column-gap:60px; row-gap:20px; border-top:1px solid #e8e8e8; padding-top:40px;}
.prod_filter .pf_row{width:calc(50% - 30px); display:flex; align-items:flex-start; gap:20px; border:0; padding:0; margin:0; min-width:0;}
.prod_filter .pf_tt{flex:0 0 84px; padding:8px 0; font-size:1em; font-weight:600; color:#111;}
.prod_filter .pf_opts{display:flex; flex-wrap:wrap; gap:5px; min-width:0;}

.prod_filter .pf_ip{position:absolute; width:0; height:0; opacity:0; overflow:hidden; z-index:-1;}
.prod_filter .pf_op{display:block; padding:8px 18px; border:1px solid #ddd; background:#fff; color:#666; line-height:1.5; border-radius:var(--bor_r); cursor:pointer; transition:.2s; user-select:none;}
.prod_filter .pf_op:hover{background-color:var(--mainColor); border-color:var(--mainColor); color:#fff;}
.prod_filter .pf_ip:checked + .pf_op{background-color:#333; border-color:#333; color:#fff;}
.prod_filter .pf_ip:checked + .pf_op.is_none{background-color:#333; border-color:#333; color:#fff;}
/*.prod_filter .pf_ip:focus-visible + .pf_op{outline:2px solid #111; outline-offset:2px;}*/

.prod_filter .pf_foot{display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:25px; padding-top:20px; border-top:1px solid #e8e8e8;}
.prod_filter .pf_sum{font-size:.938em; color:#777; margin:0;}
.prod_filter .pf_sum strong{color:#111; font-weight:600;}
.prod_filter .pf_sum .bar{margin:0 7px; color:#ccc;}
.prod_filter .pf_reset{display:inline-block; flex:0 0 auto; padding:.5em 1.25em; border:1px solid #666; background:#fff; color:#666; border-radius:var(--bor_r); font-size:.938em; line-height:1.5; transition:.2s; white-space:nowrap;}
.prod_filter .pf_reset:hover{background:#333; border-color:#333; color:#fff;}

.empty_list .empty_reset{display:inline-block; margin-left:10px; padding:.4em 1em; border:1px solid #666; color:#666; border-radius:var(--bor_r); font-size:.938em;}
.empty_list .empty_reset:hover{background:#333; border-color:#333; color:#fff;}

/* 등록폼 : 인증 / 천장밀착형 */
.write_div .pg_field{min-height:48px; line-height: 48px;}
/* 제품명 칸은 #autosave_wrapper 가 .write_div 라 margin-top 이 겹친다 */
#bo_w .write_div .pg_field > #autosave_wrapper.write_div{margin-top:0;}
.write_div .pg_field .pg_field_tt{font-size:.938em; color:#777; margin-bottom:8px;}
.write_div .pg_chk_list{gap:20px; padding-left:2px;}

/* 관련 제품목록 */
.bo_v_rel{margin-bottom:60px;}
.bo_v_rel .rel_head{justify-content:space-between; gap:10px; margin-bottom:15px;}
.bo_v_rel .rel_head .board_tt{margin-bottom:0;}
.bo_v_rel .rel_more{color:#777; font-size:.938em;}
.bo_v_rel .rel_more:hover{color:var(--mainColor);}
.bo_v_rel .rel_more .xi{vertical-align:-1px;}
.bo_v_rel .rel_list{margin-right:-20px;}
.bo_v_rel .rel_list > li{width:25%; margin-bottom:20px;}
.bo_v_rel .rel_list > li > a{display:block; height:100%; margin-right:20px; padding:1.2em 1.2em 1.5em; background-color:#f7f7f7; border-radius:var(--item_r); transition:.3s;}
.bo_v_rel .rel_list > li > a:hover .rel_tit{color:var(--mainColor);}
.bo_v_rel .rel_img{margin-bottom:14px;}
.bo_v_rel .rel_img img{width:100%; height:auto; display:block; border-radius:var(--item_r);}
.bo_v_rel .rel_img .no_image{position:relative; width:100%; padding-top:100%; border-radius:var(--item_r); background-color:#f9f9f9; color:#ccc; font-weight:600;}
.bo_v_rel .rel_img .no_image span{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center;}
.bo_v_rel .rel_img .no_image .xi{font-size:2em; display:block; line-height:1;}
.bo_v_rel .rel_tit{font-size:1.068em; font-weight:600; color:#111; line-height:1.4; transition:.2s;}

.inp_box{display:flex; align-items: center; gap:0 5px;}
.inp_t{width:150px;}
.inp_w{width:calc(100% - 150px);}


/*반응형*/

@media screen and (max-width:1024px){
	.prod_filter .pf_row{width:100%;}
    
    .bo_v_rel .rel_list > li{width:50%;}
}
@media screen and (max-width:768px){
	.prod_filter{padding:15px;}
	.prod_filter .pf_row{flex-wrap:wrap; gap:0;}
	.prod_filter .pf_tt{flex:0 0 100%; padding:0 0 8px;}
	.prod_filter .pf_foot{flex-wrap:wrap; margin-top:18px; padding-top:15px;}
    
    .bo_v_rel{margin-bottom:40px;}
	.bo_v_rel .rel_list{margin-right:-7px;}
	.bo_v_rel .rel_list > li{margin-bottom:7px;}
	.bo_v_rel .rel_list > li > a{margin-right:7px; padding:1em;}
	.bo_v_rel .rel_img{margin-bottom:10px;}
	.bo_v_rel .rel_tit{font-size:1em;}
}
@media screen and (max-width:500px){
	.prod_filter .pf_op{padding:6px 8px; font-size:14px;}
	.prod_filter .pf_tt{font-size:15px;}
    
    .inp_box{display:block; margin-bottom: 20px;}
    .inp_t{width:100%;}
    .inp_w{width:100%;}
}