.cate_title_area { padding: 24px 0 16px; }
.cate_path { font-size: 13px; color: var(--text-muted); margin-bottom: 6px; }
.cate_path a { color: var(--text-muted); }
.cate_title_row { display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px; }
.cate_title_row strong { font-size: 22px; font-weight: 800; color: var(--text-strong); }
.cate_title_row .cate_total_cnt { font-size: 14px; color: var(--text-muted); }

.cate_tab_area { margin-bottom: 10px; }
.cate_tab_grid { display: flex; flex-wrap: wrap; gap: 8px; }
.cate_tab_item { position: relative; }
.cate_tab_label {
    display: block;
    padding: 8px 16px;
    border: 1px solid var(--border);
    border-radius: 20px;
    font-size: 13px;
    color: var(--text-dark);
}
.cate_tab_label:hover { border-color: var(--accent2); color: var(--accent2); }
.cate_tab_item.has_grand:hover .grand_sub_box { display: block; }
.grand_sub_box {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
    padding: 8px 0;
    min-width: 160px;
}
.grand_sub_box ul li a { display: block; padding: 7px 16px; font-size: 13px; color: var(--text-dark); white-space: nowrap; }
.grand_sub_box ul li a:hover { color: var(--accent2); background: #f7f9fc; }

/* ===== 레이아웃 (좌측 필터 + 우측 목록) ===== */
.list_layout { display: flex; gap: 28px; padding-bottom: 60px; align-items: flex-start; }

.filter_box {
    flex: 0 0 220px;
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 18px;
    position: sticky;
    top: 20px;
}
.filter_head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.filter_label { font-size: 15px; font-weight: 800; color: var(--text-strong); }
.filter_reset { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 3px; }
.filter_reset:hover { color: var(--accent2); }

.filter_search_row { display: flex; margin-bottom: 20px; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.filter_search_row input { flex: 1; border: none; padding: 8px 10px; font-size: 13px; outline: none; }
.filter_search_row button { border: none; background: #fafafa; padding: 0 12px; color: var(--text-muted); cursor: pointer; }

.filter_group { border-top: 1px solid var(--border2); padding: 16px 0; }
.filter_group:first-of-type { border-top: none; padding-top: 0; }
.filter_group dt { font-size: 14px; font-weight: 700; color: var(--text-strong); margin-bottom: 10px; }
.filter_group .c_label { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-dark); padding: 5px 0; cursor: pointer; }
.filter_empty { font-size: 12px; color: var(--text-light); }

.brand_list { max-height: 220px; overflow-y: auto; }

.price_range_box { display: flex; align-items: center; gap: 6px; margin-top: 10px; }
.price_range_box input { width: 0; flex: 1; min-width: 0; border: 1px solid var(--border); border-radius: 4px; padding: 6px 8px; font-size: 12px; }
.price_range_box button { flex-shrink: 0; border: none; background: var(--text-strong); color: #fff; font-size: 12px; padding: 6px 10px; border-radius: 4px; cursor: pointer; }

/* ===== 우측 상품목록 ===== */
.area_item_wrap { flex: 1; min-width: 0; }
.list_ctrl { display: flex; align-items: center; justify-content: space-between; padding-bottom: 16px; border-bottom: 2px solid var(--text-strong); margin-bottom: 20px; }
.list_ctrl .total { font-size: 14px; color: var(--text-dark); }
.list_ctrl .total em { color: var(--accent2); font-weight: 700; }
.sort_box select { border: 1px solid var(--border); border-radius: 6px; padding: 6px 10px; font-size: 13px; color: var(--text-dark); background: #fff; }

.area_item_wrap .product-grid { grid-template-columns: repeat(4, 1fr); }

.pagination {
    display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
    gap: 6px; margin-top: 40px;
}
.pagination a, .pagination span {
    display: flex; align-items: center; justify-content: center; gap: 2px;
    height: 34px; min-width: 34px;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 13px;
    color: var(--text-dark);
    text-decoration: none;
}
.pagination .pg_nav { color: var(--text-light, #888); }
.pagination .pg_nav i { font-size: 16px; line-height: 1; }
.pagination a.pg_num:hover, .pagination a.pg_nav:hover { border-color: var(--accent2); color: var(--accent2); }
.pagination .pg_nav.disabled { opacity: .35; cursor: default; }
.pagination a.active { background: var(--text-strong); color: #fff; border-color: var(--text-strong); font-weight: 700; }

@media (max-width: 900px) {
    .list_layout { flex-direction: column; }
    .filter_box { flex: none; width: 100%; position: static; }
    .area_item_wrap .product-grid { grid-template-columns: repeat(2, 1fr); }
}