/* BASIC css start */
:root{
    --container:1300px;
    --wide-container:1460px;
    --text:#111827;
    --sub:#6b7280;
    --line:#e5e7eb;
    --line-soft:#edf1f5;
    --bg:#ffffff;
    --bg-soft:#f8fafc;
    --point:#e64646;
    --point-soft:#fff1f1;
    --shadow:0 18px 48px rgba(15, 23, 42, 0.08);
    --radius:28px;
}

#contentWrapper{overflow:hidden;}
.section{margin-bottom:120px;}
.sec_inner{width:var(--container); margin:0 auto;}
.sec_inner.wide{width:var(--wide-container);}

.section_head{text-align:center; margin-bottom:48px;}
.section_kicker{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 14px;
    border-radius:999px;
    background:var(--point-soft);
    color:var(--point);
    font-size:12px;
    font-weight:700;
    letter-spacing:0.16em;
    margin-bottom:16px;
}
.section h2{
    text-align:center;
    font-size:38px;
    line-height:1.2;
    color:var(--text);
    font-weight:700;
    margin-bottom:12px;
    letter-spacing:-0.04em;
    font-family:'Noto Sans KR', sans-serif;
}
.section_head p{
    color:var(--sub);
    font-size:16px;
    line-height:1.7;
    font-weight:400;
}

.swiper-button-disabled{opacity:.3; pointer-events:none;}

/* ---------- Hero ---------- */
#sec1{margin-top:42px; overflow:hidden;}
#sec1 .swiper{
    overflow:visible;
    padding-bottom:46px;
}
#sec1 .swiper-slide{height:auto;}
#sec1 .hero_card{
    height:100%;
}
#sec1 .ban_img a{
    display:block;
    width:100%;
    border-radius:32px;
    overflow:hidden;
    background:#f4f4f4;
    box-shadow:var(--shadow);
}
#sec1 .ban_img img{
    width:100%;
    display:block;
    transition:transform .6s ease;
}
#sec1 .hero_card:hover .ban_img img{transform:scale(1.04);}
#sec1 .ban_txt{
    text-align:center;
    padding:24px 12px 0;
}
#sec1 .ban_txt p{
    font-family:'Jost','Noto Sans KR',sans-serif;
}
#sec1 .ban_txt p.big{
    font-size:28px;
    line-height:1.35;
    color:var(--text);
    font-weight:600;
    margin-bottom:10px;
    letter-spacing:-0.04em;
}
#sec1 .ban_txt p.small{
    color:#8f96a3;
    font-size:16px;
    font-weight:400;
}
#sec1 .swiper .swiper-pagination{bottom:0;}
#sec1 .swiper .swiper-pagination-bullet{
    width:10px;
    height:10px;
    opacity:1;
    background:#d8dbe2;
}
#sec1 .swiper .swiper-pagination-bullet-active{
    width:28px;
    border-radius:999px;
    background:var(--text);
}

/* ---------- Product Common ---------- */
.product_grid{
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:28px;
}
.item_list{
    list-style:none;
}
.item_list .thumb{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:var(--bg-soft);
    aspect-ratio:1 / 1;
}
.item_list .thumb > a{
    display:block;
    width:100%;
    height:100%;
}
.item_list .thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .65s ease;
}
.item_list .prd-wish{
    position:absolute;
    top:16px;
    right:16px;
    z-index:2;
    display:flex;
    flex-direction:column;
    gap:10px;
}
.item_list .prd-wish a{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(12px);
    box-shadow:0 10px 24px rgba(0,0,0,0.08);
    transition:all .25s ease;
}
.item_list .prd-wish a:hover{
    transform:translateY(-2px);
}
.item_list .prd-wish i{
    font-size:16px;
    color:var(--text);
}
.item_list .prd-wish img{
    width:18px;
    height:18px;
    object-fit:contain;
}
.item_list .info{
    padding:22px 4px 6px;
}
.item_list .prdname{
    font-size:18px;
    line-height:1.5;
    color:var(--text);
    font-weight:700;
    letter-spacing:-0.03em;
    min-height:54px;
}
.item_list .prdetc{
    margin-top:8px;
    font-size:14px;
    line-height:1.65;
    color:#8b95a1;
    min-height:46px;
}
.item_list .prdprice{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 12px;
    padding-top:18px;
    margin-top:18px;
    border-top:1px solid var(--line-soft);
    font-family:'Jost','Noto Sans KR',sans-serif;
}
.item_list .prdprice .percent{
    color:var(--point);
    font-size:18px;
    font-weight:700;
}
.item_list .prdprice .price{
    color:var(--text);
    font-size:24px;
    font-weight:700;
    letter-spacing:-0.03em;
}
.item_list .prdprice strike{
    color:#a1a7b3;
    font-size:14px;
    font-weight:500;
}
.item_list .prdcolor{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:16px;
}
.item_list .prdcolor span{
    width:12px;
    height:12px;
    display:block;
    border-radius:50%;
    border:1px solid rgba(0,0,0,0.08);
}

/* =========================
   sec2 BEST SELLER 전용 수정
========================= */
#sec2{margin-bottom:120px;}
#sec2 .sec_inner{width:1300px; margin:0 auto;}

#sec2 .section_head{text-align:center; margin-bottom:48px;}
#sec2 .section_kicker{
    display:inline-block;
    padding:8px 14px;
    border-radius:999px;
    background:#fff1f1;
    color:#dc3737;
    font-size:12px;
    font-weight:700;
    letter-spacing:.14em;
    margin-bottom:14px;
}
#sec2 h2{
    margin-bottom:10px;
    font-size:36px;
    line-height:1.2;
    color:#111;
    font-weight:700;
    letter-spacing:-0.03em;
}
#sec2 .section_head p{
    font-size:15px;
    color:#888;
    line-height:1.6;
}

/* 핵심: 메이크샵 기본 width/float 충돌 제거 */
#sec2 .best_prd_grid{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:28px !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
}

#sec2 .best_prd_grid > li.best_item{
    position:relative;
    width:calc((100% - 84px) / 4) !important;
    flex:0 0 calc((100% - 84px) / 4) !important;
    max-width:calc((100% - 84px) / 4) !important;
    min-width:0 !important;
    margin:0 !important;
    padding:18px !important;
    float:none !important;
    border:1px solid #edf0f4;
    border-radius:24px;
    background:#fff;
    box-sizing:border-box;
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

#sec2 .best_prd_grid > li.best_item:hover{
    transform:translateY(-6px);
    box-shadow:0 18px 40px rgba(0,0,0,.08);
    border-color:#e3e7ed;
}

#sec2 .best_thumb{
    position:relative;
    width:100%;
    aspect-ratio:1 / 1;
    overflow:hidden;
    border-radius:20px;
    background:#f7f8fa;
}

#sec2 .best_thumb > a{
    display:block;
    width:100%;
    height:100%;
}

#sec2 .best_thumb img{
    width:100% !important;
    height:100% !important;
    object-fit:cover;
    display:block;
    transition:transform .45s ease;
}

#sec2 .best_item:hover .best_thumb img{
    transform:scale(1.05);
}

#sec2 .best_badge_area{
    position:absolute;
    top:14px;
    right:14px;
    z-index:3;
    display:flex;
    flex-direction:column;
    gap:8px;
}

#sec2 .best_icon_btn{
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.95);
    box-shadow:0 8px 20px rgba(0,0,0,.08);
}

#sec2 .best_icon_btn i{
    font-size:16px;
    color:#111;
}

#sec2 .best_icon_btn img{
    width:17px !important;
    height:17px !important;
    object-fit:contain;
}

#sec2 .best_info{
    padding:18px 4px 2px;
    min-width:0;
}

#sec2 .best_name{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    min-height:54px;
    font-size:18px;
    line-height:1.5;
    color:#111;
    font-weight:700;
    letter-spacing:-0.03em;
    word-break:keep-all;
}

#sec2 .best_desc{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    min-height:42px;
    margin-top:8px;
    font-size:14px;
    line-height:1.6;
    color:#8b8b8b;
    word-break:keep-all;
}

#sec2 .best_price{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 10px;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid #f0f2f5;
    font-family:'Jost','Noto Sans KR',sans-serif;
}

#sec2 .best_percent{
    color:#dc3737;
    font-size:18px;
    font-weight:700;
}

#sec2 .best_price_num{
    color:#111;
    font-size:28px;
    font-weight:700;
    letter-spacing:-0.03em;
}

#sec2 .best_price strike{
    color:#aaa;
    font-size:14px;
    font-weight:500;
}

#sec2 .best_color{
    display:flex;
    gap:7px;
    margin-top:14px;
}

#sec2 .best_color span{
    width:12px;
    height:12px;
    border-radius:50%;
    border:1px solid rgba(0,0,0,.08);
}

/* ---------- Promo ---------- */
#sec3 .promo_grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:28px;
}
#sec3 .promo_grid li a{
    display:block;
    overflow:hidden;
    border-radius:28px;
    box-shadow:var(--shadow);
}
#sec3 .promo_grid li img{
    width:100%;
    display:block;
    transition:transform .65s ease;
}
#sec3 .promo_grid li a:hover img{
    transform:scale(1.04);
}

/* ---------- Re-buy slider ---------- */
#sec4 .swiper{
    padding-bottom:42px;
    overflow:visible;
}
#sec4 .swiper-slide{
    height:auto;
}
#sec4 .swiper .swiper-pagination-progressbar{
    bottom:0;
    top:auto;
    height:4px;
    border-radius:999px;
    background:rgba(15,23,42,0.08);
    overflow:hidden;
}
#sec4 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
    background:linear-gradient(90deg, #ff6b6b 0%, #dc3737 100%);
    border-radius:999px;
}

/* ---------- Special sale ---------- */
#sec5 .sec5_cont{
    display:grid;
    grid-template-columns:1.05fr 1fr;
    gap:32px;
    align-items:start;
}
#sec5 .banner_img a{
    display:block;
    overflow:hidden;
    border-radius:32px;
    box-shadow:var(--shadow);
}
#sec5 .banner_img img{
    width:100%;
    display:block;
    transition:transform .7s ease;
}
#sec5 .banner_img a:hover img{
    transform:scale(1.04);
}
#sec5 .item_cont ul{
    display:flex;
    flex-direction:column;
    gap:20px;
}
#sec5 .item_cont ul li{
    display:flex;
    align-items:center;
    gap:20px;
    min-height:220px;
}
#sec5 .item_cont ul li .thumb{
    width:220px;
    min-width:220px;
    aspect-ratio:1 / 1;
    border-radius:22px;
}
#sec5 .item_cont ul li .info{
    flex:1;
    padding:0;
}
#sec5 .item_cont ul li .prdname{
    min-height:auto;
    font-size:20px;
}
#sec5 .item_cont ul li .prdetc{
    min-height:auto;
}
#sec5 .item_cont ul li .prdprice{
    border-top:none;
    margin-top:14px;
    padding-top:0;
}
#sec5 .item_cont ul li .prdprice .percent{
    display:none;
}

/* ---------- CTA banner ---------- */
#sec7 .sec_inner{
    width:var(--container);
}
#sec7 a{
    display:block;
    overflow:hidden;
    border-radius:32px;
    box-shadow:var(--shadow);
}
#sec7 a img{
    width:100%;
    display:block;
    transition:transform .65s ease;
}
#sec7 a:hover img{
    transform:scale(1.03);
}

/* ---------- Responsive ---------- */
@media (max-width:1440px){
    .sec_inner{width:calc(100% - 48px);}
    .sec_inner.wide{width:calc(100% - 48px);}
}

@media (max-width:1280px){
    .product_grid{grid-template-columns:repeat(3, minmax(0, 1fr));}
    #sec5 .sec5_cont{grid-template-columns:1fr;}
}

@media (max-width:1024px){
    .product_grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}

/* BASIC css end */