/* BASIC css start */
.full-wrapper { max-width: none; --bs-gutter-x: var(--cw-size-200); }
.shopbrand-header { padding-top: var(--cw-size-60); }
.shopbrand-header__title { display: flex; align-items: center; gap: var(--cw-size-10); font-size: var(--cw-size-24); line-height: var(--cw-size-32); font-weight: 700; color: var(--cw-heading-color); }
.shopbrand-header__title .category-count { display: flex; align-items: center; justify-content: center; height: var(--cw-size-24); padding: 0 var(--cw-size-12) 0 var(--cw-size-30); border: 1px solid var(--cw-color-30); border-radius: 999px; font-size: var(--cw-size-12); font-weight: 400; background: url('//skin.makeshop.co.kr/skin/rw_shop/images/icons/ico_heart.svg') no-repeat 10px center / 14px; }
.shopbrand-header__title .category-count.count-on { background-image: url('//skin.makeshop.co.kr/skin/rw_shop/images/icons/ico_heart_fill.svg'); }

.category-title { padding: var(--cw-size-48) 0; }
.category-title img { max-width: 100%; }
.best-wrapper { margin-top: var(--cw-size-48); }
.best-wrapper .title-btns { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--cw-size-16); }
.best-wrapper .title-btns span { font-size: var(--cw-size-18); font-weight: 700; line-height: var(--cw-size-26); }
.best-wrapper .title-btns a { display: inline-block; width: var(--cw-size-28); height: var(--cw-size-28); }
.best-wrapper .title-btns a.disable { opacity: .3; }
.best-wrapper .best-scrollbar { display: none; }
.recmd-wrapper { margin-top: var(--cw-size-48); }
.recmd-wrapper .title-btns { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--cw-size-16); }
.recmd-wrapper .title-btns span { font-size: var(--cw-size-18); font-weight: 700; line-height: var(--cw-size-26); }
.recmd-wrapper .title-btns a { display: inline-block; width: var(--cw-size-28); height: var(--cw-size-28); }
.recmd-wrapper .title-btns a.disable { opacity: .3; }
.recmd-wrapper .recmd-scrollbar { display: none; }
.promotion-wrapper { margin-top: var(--cw-size-48); }
.promotion-wrapper .title-btns { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--cw-size-16); }
.promotion-wrapper .title-btns span { font-size: var(--cw-size-18); font-weight: 700; line-height: var(--cw-size-26); }
.promotion-wrapper .title-btns a { display: inline-block; width: var(--cw-size-28); height: var(--cw-size-28); }
.promotion-wrapper .title-btns a.disable { opacity: .3; }
.promotion-wrapper .promotion-scrollbar { display: none; }
.products-wrapper { padding-top: var(--cw-size-60); }
.products-wrapper .prds-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-bottom: var(--cw-size-16); }
.products-wrapper .prds-title h2 { font-weight: 400; font-size: var(--cw-size-14); line-height: var(--cw-size-20); color: var(--cw-heading-color); }
.products-wrapper .prds-title strong { font-weight: 700; }
.products-wrapper .prds-title .cw-select-box { min-width: var(--cw-size-100); }
.products-wrapper .prds-title .thumbnail-type { display: flex; flex-wrap: wrap; align-items: center; }
.products-wrapper .prds-title .thumbnail-type .type::before { content: ""; display: inline-block; width: 1px; height: var(--cw-size-14); margin: 0 var(--cw-size-16); background-color: var(--cw-color-30); vertical-align: middle; }
.products-wrapper .prds-list.list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cw-size-40) var(--cw-size-20); margin-top: var(--cw-size-40); }
.products-wrapper .prds-list.gallery { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--cw-size-60) var(--cw-size-20); margin-top: var(--cw-size-60); }
.products-wrapper :where(.prds-list.list, .prds-list.gallery):first-of-type { margin-top: 0 !important; }
.products-wrapper .prds-btn { margin-top: var(--cw-size-60); text-align: center; }
.products-wrapper .prds-btn a { width: var(--cw-size-300); height: var(--cw-size-46); line-height: var(--cw-size-46); }
.products-wrapper .list-none { margin-top: var(--cw-size-120); text-align: center; }
.products-wrapper.upper .prds-title a { margin-bottom: var(--cw-size-8); }
.products-wrapper.upper .prds-title a img { max-width: 100%; }
.products-wrapper.upper .prds-title h2 { font-size: var(--cw-size-18); line-height: var(--cw-size-26); }
.products-wrapper.upper .prds-title .thumbnail-type { width: 100%; justify-content: flex-end; }
.products-wrapper.upper .prds-list + .prds-title { margin-top: var(--cw-size-120); }

/* =========================================
   상품별 지정 이미지 아이콘 90% 축소
========================================= */
.prds--icons img,
.goods--icons img,
.prds-list--item .prds--icons img {
    max-width: 90% !important;
    height: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

.prds--icons span,
.goods--icons span {
    transform: scale(0.9) !important;
    transform-origin: left center !important;
    display: inline-flex !important;
}

/* =========================================
   분류(카테고리) 페이지 타이틀 중앙 정렬
========================================= */
.shopbrand-header {
    display: block !important;
    text-align: center !important;
    margin: 30px 0 20px !important;
    padding: 0 !important;
}

.shopbrand-header__title {
    display: block !important;
    text-align: center !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    color: #000 !important;
    margin-bottom: 20px !important;
    line-height: 1.2 !important;
}

/* =========================================
   중분류 타일(Grid) 카테고리
========================================= */
.shopbrand-header__nav-wrapper {
    position: relative !important;
    width: 100% !important;
    margin: 20px auto 30px !important;
    padding: 0 !important;
    background: transparent !important;
}

.cate-tile-grid {
    display: grid !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: visible !important;
    border-top: 1px solid #e2e2e2 !important;
    border-left: 1px solid #e2e2e2 !important;
    box-sizing: border-box !important;
    list-style: none !important;
}

.cate-tile-grid li {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: none !important;
    width: auto !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-right: 1px solid #e2e2e2 !important;
    border-bottom: 1px solid #e2e2e2 !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    white-space: normal !important;
}

.cate-tile-grid li a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 4px !important;
    font-size: 13px !important;
    color: #555555 !important;
    text-align: center !important;
    text-decoration: none !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
}

.cate-tile-grid li.active {
    background-color: #f8f9fa !important;
}

.cate-tile-grid li.active a {
    color: #d92525 !important;
    font-weight: 700 !important;
}

/* =========================================
   PC (992px 이상): 한 줄당 4개
========================================= */
@media (min-width: 992px) {
    .cate-tile-grid {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

/* =========================================
   태블릿 (768px ~ 991.98px)
========================================= */
@media (max-width: 991.98px) {
    .full-wrapper { --bs-gutter-x: var(--cw-size-32); }
    .shopbrand-header { z-index: 99; position: relative !important; top: 0 !important; margin: 20px 0 15px !important; }
    .shopbrand-header__title { font-size: 22px !important; margin-bottom: 15px !important; }
    
    .shopbrand-header__nav-wrapper :where(.shopbrand-header__nav, .shopbrand-header__nav__s) {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        height: auto !important;
        padding: 0 !important;
        margin: 0 !important;
        overflow-x: visible !important;
        border-bottom: none !important;
    }

    .shopbrand-header__nav-wrapper :where(.shopbrand-header__nav, .shopbrand-header__nav__s) li a {
        padding: 0 2px !important;
        font-size: 12px !important;
    }

    .cate-tile-grid li {
        height: 42px !important;
    }

    .category-title { padding: var(--cw-size-40) 0; }
    .best-wrapper { margin-top: var(--cw-size-40); }
    .best-wrapper .title-btns { margin-bottom: var(--cw-size-12); }
    .recmd-wrapper { margin-top: var(--cw-size-40); }
    .recmd-wrapper .title-btns { margin-bottom: var(--cw-size-12); }
    .promotion-wrapper { margin-top: var(--cw-size-40); }
    .promotion-wrapper .title-btns { margin-bottom: var(--cw-size-12); }
    .products-wrapper { padding-top: var(--cw-size-50); }
    .products-wrapper .prds-title { margin-bottom: var(--cw-size-12); }
    .products-wrapper .prds-list.list { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: var(--cw-size-20); margin-top: var(--cw-size-20); }
    .products-wrapper .prds-list.gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--cw-size-60) var(--cw-size-16); }
    .products-wrapper.upper .prds-title a { margin-bottom: var(--cw-size-4); }
    .header-container--md .navi-title { display: flex; gap: 8px; }
}

/* =========================================
   [수정 완료] 모바일 (767.98px 이하): 좌우 여백 초밀착 & 이미지 확대
========================================= */
@media (max-width: 767.98px) {
    /* 1. 최외곽 좌우 패딩을 8px로 축소하여 본문 영역 극대화 */
    .full-wrapper,
    .container.full-wrapper,
    .shopbrand-wrapper {
        --bs-gutter-x: 16px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .category-title { padding: var(--cw-size-20) 0; }
    .best-wrapper { margin-top: var(--cw-size-24); }
    .best-wrapper .title-btns { margin-bottom: var(--cw-size-8); }
    .best-wrapper .title-btns span { font-size: var(--cw-size-16); line-height: var(--cw-size-24); }
    .best-wrapper .title-btns .best-btn { display: none; }
    .best-wrapper .prds-list { padding-bottom: var(--cw-size-20); }
    .best-wrapper .best-scrollbar { display: block; --swiper-scrollbar-size: var(--cw-size-2); --swiper-scrollbar-drag-bg-color: var(--cw-color-80); --swiper-scrollbar-bottom: 0; left: 0; }
    
    .recmd-wrapper { margin-top: var(--cw-size-24); }
    .recmd-wrapper .title-btns { margin-bottom: var(--cw-size-8); }
    .recmd-wrapper .title-btns span { font-size: var(--cw-size-16); line-height: var(--cw-size-24); }
    .recmd-wrapper .title-btns .recmd-btn { display: none; }
    .recmd-wrapper .prds-list { padding-bottom: var(--cw-size-20); }
    .recmd-wrapper .recmd-scrollbar { display: block; --swiper-scrollbar-size: var(--cw-size-2); --swiper-scrollbar-drag-bg-color: var(--cw-color-80); --swiper-scrollbar-bottom: 0; left: 0; }
    
    .promotion-wrapper { margin-top: var(--cw-size-24); }
    .promotion-wrapper .title-btns { margin-bottom: var(--cw-size-8); }
    .promotion-wrapper .title-btns span { font-size: var(--cw-size-16); line-height: var(--cw-size-24); }
    .promotion-wrapper .title-btns .promotion-btn { display: none; }
    .promotion-wrapper .prds-list { padding-bottom: var(--cw-size-20); }
    .promotion-wrapper .promotion-scrollbar { display: block; --swiper-scrollbar-size: var(--cw-size-2); --swiper-scrollbar-drag-bg-color: var(--cw-color-80); --swiper-scrollbar-bottom: 0; left: 0; }

    /* 2. 2열 상품 그리드: 상품 간 좌우 간격을 6px로 좁혀 썸네일 폭 확장 */
    .products-wrapper { padding-top: 20px !important; }
    .products-wrapper .prds-list.gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 24px 6px !important;
        margin-top: 15px !important;
    }

    .products-wrapper .prds-btn a { width: 100%; }
    .products-wrapper.upper .prds-title { margin-bottom: var(--cw-size-8); }
    .products-wrapper.upper .prds-list + .prds-title { margin-top: var(--cw-size-40); }
}

/* =========================================
   대분류 타이틀 이미지 가운데 정렬
========================================= */
.category-title {
    text-align: center !important;
    padding: var(--cw-size-48) 0;
}

.category-title img {
    display: inline-block !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
}

/* =========================================
   2열 / 3열 정렬 토글 버튼 스타일
========================================= */
.btn-grid-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    padding: 4px;
    margin-left: 8px;
    cursor: pointer;
    line-height: 1;
}

.btn-grid-toggle svg {
    display: block;
}

/* =========================================
   2열 / 3열 정렬 토글 버튼 스타일
========================================= */
.btn-grid-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    padding: 4px !important;
    margin-left: 8px !important;
    cursor: pointer !important;
    line-height: 1 !important;
}

.btn-grid-toggle svg {
    display: block !important;
}

/* =========================================
   모바일 (767.98px 이하) 2열(기본) & 3열(토글) 레이아웃
========================================= */
@media (max-width: 767.98px) {
    /* 1. 기본 2열 그리드 강제 (viewtype=list 무력화) */
    .products-wrapper .prds-list,
    .products-wrapper .prds-list.gallery,
    .products-wrapper .prds-list.list {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 24px 6px !important;
        margin-top: 15px !important;
    }

    /* 2. 3열 모드 활성화 시 */
    .products-wrapper .prds-list.col-3-view,
    .products-wrapper .prds-list.gallery.col-3-view,
    .products-wrapper .prds-list.list.col-3-view {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 14px 4px !important;
        margin-top: 15px !important;
    }

    /* 3열 모드 세부 축소 */
    .products-wrapper .prds-list.col-3-view .prds--name {
        font-size: 11px !important;
        line-height: 1.25 !important;
        height: 2.5em !important;
        margin-top: 2px !important;
        overflow: hidden !important;
    }

    .products-wrapper .prds-list.col-3-view .prds--subname,
    .products-wrapper .prds-list.col-3-view .prds--engname {
        display: none !important;
    }

    .products-wrapper .prds-list.col-3-view .prds--colorchip {
        margin: 3px 0 2px 0 !important;
    }

    .products-wrapper .prds-list.col-3-view .prds--colorchip .rectangle {
        width: 8px !important;
        height: 3px !important;
    }

    .products-wrapper .prds-list.col-3-view .prds--price-wrap {
        margin: 2px 0 !important;
    }

    .products-wrapper .prds-list.col-3-view .prices .price strong,
    .products-wrapper .prds-list.col-3-view .prices .discount {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .products-wrapper .prds-list.col-3-view .prices .original {
        display: none !important;
    }

    .products-wrapper .prds-list.col-3-view .preview-btn {
        display: none !important;
    }

    .products-wrapper .prds-list.col-3-view .prds--icons img {
        max-height: 10px !important;
    }

    .products-wrapper .prds-list.col-3-view .ico-wish {
        width: 18px !important;
        height: 18px !important;
        top: 4px !important;
        right: 4px !important;
    }
}
/* BASIC css end */