/* BASIC css start */
.full-wrapper { max-width: none; --bs-gutter-x: var(--cw-size-200); }
.shopbrand-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    margin: 60px 0 24px;
}

.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'); }
.shopbrand-header__nav + .shopbrand-header__nav__s { column-gap: var(--cw-size-40); padding: 0 var(--cw-size-10); margin-top: 0; border-bottom: 0; }
.shopbrand-header__nav + .shopbrand-header__nav__s li { padding: 0; }
.shopbrand-header__nav + .shopbrand-header__nav__s li a { display: inline-block; padding: var(--cw-size-16) 0; font-size: var(--cw-size-14); line-height: var(--cw-size-20); color: var(--cw-color-80); }
.shopbrand-header__nav + .shopbrand-header__nav__s .active a { color: var(--cw-heading-color); font-weight: bold; }
.shopbrand-header__nav__s:not(:has(li)) + .shopbrand-header__nav { display: none; }
.shopbrand-header__nav__s .btn-arr { display: none; }
.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 .prds-btn { margin-top: var(--cw-size-60); text-align: center; }
.products-wrapper .prds-btn a {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 360px;
    height: 60px;
    border-radius: 8px;
    border: 1px solid #999;
    color: #151515;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.48px;
}

.products-wrapper .prds-btn a::after {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background: url('/design/bikibiki/renewal/images/icon_product_more.svg') no-repeat center;
}

.products-wrapper .list-none { margin-top: var(--cw-size-120); text-align: center; }

.prds-list {
    flex-wrap: wrap;
    gap: 60px 16px;
}

.prds-list .prds-list--item {
    width: calc(25% - 12px);
}

.prds-list .prds--subname {
    color: #666;
    font-size: 14px;
    line-height: 1;
    font-style: normal;
    font-weight: 500;
    letter-spacing: -0.32px;
}

.prds-list .prds--image {
    margin-bottom: 20px;
    max-height: 540px;
}

.prds-list .prds--name {
    margin-bottom: 6px;
    font-size: 16px;
}

.prds-list .price-wrap .price .normal {
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.48px;
}

.prds-list .ico-wish {
    right: 10px;
    bottom: 10px;
}

.prds-list .price-wrap .price {
    gap: 4px;
}

.prds-list .ico-wish .my-wish-list {
    background-size: 28px;
}

.prds-list .price-wrap .consumer {
    font-size: 16px;
}

.prds-list .price-wrap .price .dc_per {
    font-size: 20px;
}

.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    padding: 0;
}

.product-title {
    margin-top: 100px;
    color: #151515;
    font-family: "Rozha One";
    font-size: 48px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: -0.96px;
}

.product-sub-title {
    color: #4C4C4A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 19px; /* 118.75% */
    letter-spacing: -0.32px;
}

#MS_select_sort.cw-select-box {
    position: absolute;
    opacity: 0;
    top: 0;
    right: 0;
    height: 36px;
    padding: 0 32px 0 16px;
    background: url(/design/bikibiki/renewal/images/icon_select_arrow.svg) no-repeat right .625rem center;
    background-size: 20px;
    border: none;
    color: #4C4C4A;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 19px;
    letter-spacing: -0.36px;
}

.shopbrand-header .shopbrand-header__nav-wrapper {
    width: calc(100% - 130px);
    overflow: hidden;
    overflow-x: auto;
}

.shopbrand-header .shopbrand-header__nav {
    display: flex;
    align-items: center;
}

.shopbrand-header .shopbrand-header__nav > li > a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 35px;
    padding: 0 16px;
    background: #ffffff;
    border-radius: 23px;
    color: #4C4C4A;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 19px; /* 105.556% */
    letter-spacing: -0.36px;
    white-space: nowrap;
}

.shopbrand-header .shopbrand-header__nav > li.active > a {
    background: #151515;
    color: #FFF;
    font-weight: 600;
}

.popup-bottom-wrap {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 100;
    transition: opacity 0.25s ease;
}

.popup-bottom-wrap.active {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.popup-bottom-wrap .contents-wrap {
    position: absolute;
    bottom: -30px;
    left: 0;
    width: 100%;
    border-radius: 16px 16px 0 0;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.25);
    background: #FFFFFF;
    padding: 0 20px 50px 20px ;
    transform: translateY(100%);
    will-change: transform, opacity;
}

/* 활성화될 때 튕기면서 올라오는 애니메이션 */
.popup-bottom-wrap.active .contents-wrap {
    animation: popup-bounce-in 560ms cubic-bezier(.2,.9,.2,1);
    animation-fill-mode: forwards;
}

/* 키프레임: 바닥에서 올라와서 약간 넘어갔다가 튀며 정지 */
@keyframes popup-bounce-in {
    0% {
        transform: translateY(120px);
        opacity: 0;
    }
    55% {
        transform: translateY(-10px);
        opacity: 1;
    }
    75% {
        transform: translateY(6px);
    }
    100% {
        transform: translateY(0);
    }
}

/* 접근성: 사용자 설정에서 동작 최소화를 우선 */
@media (prefers-reduced-motion: reduce) {
    .popup-bottom-wrap .contents-wrap,
    .popup-bottom-wrap.active .contents-wrap {
        animation: none !important;
        transition: transform 0.32s ease;
        transform: translateY(0);
    }
}



.popup-bottom-wrap .contents-wrap .btn-close {
    position: relative;
    display: block;
    padding: 12px 0 16px;
    cursor: pointer;
}

.popup-bottom-wrap .contents-wrap .btn-close::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
    height: 6px;
    border-radius: 36px;
    background: #D3D3D3;
}

.popup-bottom-wrap .contents-wrap .list-wrap > li > a {
    position: relative;
    display: block;
    padding: 10px 0;
    color: #D3D3D3;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.28px;
}

.popup-bottom-wrap .contents-wrap .list-wrap > li.active > a {
    color: #4C4C4A;
}

.popup-bottom-wrap .contents-wrap .list-wrap > li.active > a::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0px;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background: url('/design/bikibiki/renewal/images/icon_select_arrow_mo.svg') no-repeat center;

}

.cw-paging {
    margin-top: 100px;
}

.thumbnail-type {
    position: relative;
    height: 36px;
}

.thumbnail-type .text-wrap {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    background: #fff;
    padding: 0 12px;
    height: 36px;
    border-radius: 23px;
    white-space: nowrap;
    cursor: pointer;
    pointer-events: none;
}

.thumbnail-type .text-wrap::after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    background: url(/design/bikibiki/renewal/images/icon_select_arrow.svg) no-repeat center;
}


@media (max-width: 976px) {
    .full-wrapper { --bs-gutter-x: var(--cw-size-48); }
    .shopbrand-header {
        margin-top: 40px;
    }

    .shopbrand-header__title { display: none; }
    .shopbrand-header__nav + .shopbrand-header__nav__s { column-gap: var(--cw-size-32); padding: 0 calc(0.5 * var(--bs-gutter-x)); position: relative; overflow-x: hidden; height: var(--cw-size-40); padding-right: var(--cw-size-60); border-bottom: 1px solid var(--cw-color-20); }
    .shopbrand-header__nav + .shopbrand-header__nav__s li a { padding: var(--cw-size-11) 0; font-size: var(--cw-size-13); line-height: var(--cw-size-18); }
    .shopbrand-header__nav + .shopbrand-header__nav__s .btn-arr { z-index: 1; position: absolute; top: 0; right: 0; display: inline-block; width: var(--cw-size-40); height: var(--cw-size-40); }
    .shopbrand-header__nav + .shopbrand-header__nav__s::before { display: none; content: "카테고리"; position: absolute; top: 0; left: 0; padding: var(--cw-size-11) 0 0 var(--cw-size-16); font-size: var(--cw-size-13); line-height: var(--cw-size-18); }
    .shopbrand-header__nav + .shopbrand-header__nav__s::after { content: ""; position: absolute; top: 0; right: 0; width: var(--cw-size-40); height: var(--cw-size-40); background: var(--cw-color-white) url('//skin.makeshop.co.kr/skin/rw_shop/images/icons/ico_arrow_cheveron-down.svg') center center no-repeat; }
    .shopbrand-header__nav + .shopbrand-header__nav__s.on::before { display: block; }
    .shopbrand-header__nav + .shopbrand-header__nav__s.on::after { background-image: url('//skin.makeshop.co.kr/skin/rw_shop/images/icons/ico_arrow_cheveron-up.svg'); }
    .shopbrand-header__nav + .shopbrand-header__nav__s.on { z-index: 1; position: absolute; top: var(--cw-size-40); left: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; width: 100%; height: auto; padding: var(--cw-size-40) var(--cw-size-16) var(--cw-size-12); background: var(--Neutral-White, #FFF); box-shadow: 0 var(--cw-size-3) var(--cw-size-4) 0 rgba(0, 0, 0, 0.10); }
    .shopbrand-header__nav + .shopbrand-header__nav__s.on li { white-space: normal; }
    .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); }
    .header-container--md .navi-title { display: flex; gap: 8px; }
    .header-container--md .navi-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; }
    .header-container--md .navi-title .category-count.count-on { background-image: url('//skin.makeshop.co.kr/skin/rw_shop/images/icons/ico_heart_fill.svg'); }

    .prds-list {
        gap: 40px 16px;
    }

    .prds-list .prds-list--item {
        width: calc(50% - 8px);
    }

    .prds-list .prds--subname {
        font-size: 16px;
        font-weight: 500;
        letter-spacing: -0.32px;
    }

    .prds-list .prds--name {
        font-size: 24px;
        letter-spacing: -0.48px;
        margin-bottom: 8px;
        line-height: normal;
    }

    .prds-list .price-wrap .consumer {
        font-size: 20px;
    }

    .prds-list .price-wrap .price .dc_per, .prds-list .price-wrap .price .normal {
        font-size: 24px;
    }

    .prds-list .price-wrap .price {
        font-size: 24px;
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.48px;
    }

    .prds-list .ico-wish .my-wish-list, .my-wish-list.wish-on {
        width: 35px;
        height: 35px;
        background-size: 28px !important;
    }

    .product-title {
        margin-top: 60px;
        font-size: 40px;
        letter-spacing: -0.8px;
    }

    .product-sub-title {
        font-size: 16px;
        font-weight: 400;
        line-height: 19px; /* 118.75% */
        letter-spacing: -0.32px;
    }

}

@media (max-width: 768px) {
    .full-wrapper { --bs-gutter-x: var(--cw-size-32); }
    .shopbrand-header__nav + .shopbrand-header__nav__s { gap: var(--cw-size-28); }
    .shopbrand-header__nav + .shopbrand-header__nav__s li a { padding: var(--cw-size-12) 0; font-size: var(--cw-size-12); line-height: var(--cw-size-16); }
    .shopbrand-header__nav + .shopbrand-header__nav__s.on::before { font-size: var(--cw-size-12); line-height: var(--cw-size-16); }
    .category-title { padding: var(--cw-size-32) 0; }
    .best-wrapper { margin-top: var(--cw-size-32); }
    .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 .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-32); }
    .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 .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-32); }
    .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; }
    .products-wrapper .prds-btn a { width: 100%; }

    .prds-list {
        gap: 20px 8px;
    }

    .prds-list .prds-list--item {
        width: calc(50% - 4px);
    }

    .prds-list .prds--image {
        margin-bottom: 12px;
        max-height: 212px;
    }

    .prds-list .prds--subname {
        font-size: 10px;
        letter-spacing: -0.2px;
        margin-bottom: 8px;
    }

    .prds-list .prds--name {
        font-size: 14px;
        letter-spacing: -0.28px;
        margin-bottom: 4px;
    }

    .prds-list .price-wrap .price {
        gap: 4px;
    }

    .prds-list .price-wrap .consumer {
        font-size: 14px;
        letter-spacing: -0.32px;
    }

    .prds-list .price-wrap .price .dc_per, .prds-list .price-wrap .price .normal {
        font-size: 16px;
        letter-spacing: -0.32px;
    }

    .prds-list .ico-wish {
        right: 4px;
        bottom: 4px;
    }

    .prds-list .ico-wish .my-wish-list, .my-wish-list.wish-on {
        width: 21px;
        height: 21px;
        background-size: 17px !important;
    }

    .product-title {
        margin-top: 28px;
        font-size: 24px;
        letter-spacing: -0.48px;
    }

    .product-sub-title {
        font-size: 16px;
        font-weight: 400;
        line-height: 19px; /* 118.75% */
        letter-spacing: -0.32px;
    }

    .shopbrand-header {
        flex-direction: column;
        align-items: flex-end;
        gap: 12px;
        margin: 28px 0 12px;
    }

    .shopbrand-header .shopbrand-header__nav-wrapper {
        width: 100%;
    }

    .shopbrand-header .shopbrand-header__nav > li > a {
        font-size: 12px;
        font-weight: 500;
        line-height: 19px; /* 158.333% */
        letter-spacing: -0.24px;
        border-radius: 20px;
        height: 27px;
    }

    .shopbrand-header .shopbrand-header__nav > li.active > a {
        font-size: 12px;
        font-weight: 600;
        line-height: 19px; /* 158.333% */
        letter-spacing: -0.24px;
    }

    .thumbnail-type .text-wrap {
        pointer-events: visible;
        height: 20px;
        font-size: 12px;
        font-weight: 500;
        line-height: 19px;
        letter-spacing: -0.24px;
    }

    #MS_select_sort.cw-select-box {
        pointer-events: none;
        height: 20px;
        font-size: 12px;
        font-weight: 500;
        line-height: 19px; /* 158.333% */
        letter-spacing: -0.24px;
    }

    .products-wrapper .prds-btn a {
        max-width: 100%;
        height: 32px;
        border-radius: 4px;
        color: #151515;
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 100%; /* 12px */
    }

    .products-wrapper .prds-btn a::after {
        width: 20px;
        background-size: 20px;
    }

    .cw-paging {
        margin-top: 60px;
    }

}
/* BASIC css end */

