@charset "utf-8";
/* =========================================================
   KOREA MALL — 전자제품 리스트 카드 고급화 (electronics)
   theme/market · 상품진열 10 (.sct_20) 전용
   깔끔한 화이트 카드 + 테크블루 포인트, emart 스타일 가격
   ========================================================= */

:root{
    --ec-blue:#0071e3;
    --ec-blue-dark:#005bb5;
    --ec-ink:#1d1d1f;
    --ec-gray:#86868b;
    --ec-line:#ececf0;
    --ec-red:#e74c3c;
    --ec-radius:16px;
}

/* ---------- 리스트 ul · 카드 ----------
   bxSlider 레이아웃(float/width/margin)은 건드리지 않고
   시각 속성만 덮어쓰기 */
.sct.sct_20{
    padding:0; margin:0;
}
.sct.sct_20 .sct_li{
    border:1px solid var(--ec-line);
    background:#fff;
    border-radius:var(--ec-radius);
    box-shadow:0 1px 2px rgba(0,0,0,.03), 0 6px 18px rgba(0,0,0,.05);
    overflow:hidden;
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s;
    float:left; display:inline-block;
}
.sct.sct_20 .sct_li:hover{
    border-color:#d6e6fa;
    transform:translateY(-5px);
    box-shadow:0 12px 30px rgba(0,113,227,.15);
}

/* hover 시 전통 빨간 배경 제거 → 화이트 유지 */
.sct.sct_20 .sct_li:hover .sct_cnt{ background:#fff; color:var(--ec-ink); }
.sct.sct_20 .sct_li:hover .sct_txt a, .sct.sct_20 .sct_li:hover .sct_cost{ color:var(--ec-ink); }
.sct.sct_20 .sct_li:hover .sct_discount{ color:#b0b0b6; }

/* ---------- 이미지 영역 ---------- */
.sct.sct_20 .sct_20_wrap{ width:100%; }
.sct.sct_20 .sct_img{
    background:#fff;
    padding:0; margin:0; overflow:hidden; aspect-ratio:1/1;
}
.sct.sct_20 .sct_img img{
    width:100%; height:100%; display:block; object-fit:contain; object-position:center;
    border-radius:0; transition:transform .3s ease;
}
.sct.sct_20 .sct_li:hover .sct_img img{ transform:scale(1.04); }

/* ---------- 내용(이름/부제/가격) ---------- */
.sct.sct_20 .sct_cnt{ padding:12px 14px 14px; text-align:left; }
.sct.sct_20 .sct_txt{
    padding:0; font-size:14px; font-weight:600; color:var(--ec-ink); line-height:1.42;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:40px;
}
.sct.sct_20 .sct_txt a{ color:var(--ec-ink); text-decoration:none; }
.sct.sct_20 .sct_basic{ font-size:12px; color:var(--ec-gray); line-height:1.4; margin:2px 0 8px; }

/* 가격: 현품가는 크게 검정, sct_discount(원가)는 작게 회색 취소선 */
.sct.sct_20 .sct_cost{ padding:2px 0 6px; font-size:17px; font-weight:800; color:var(--ec-ink); text-align:left; }
.sct.sct_20 .sct_discount{
    display:inline-block; margin:0 0 0 4px; color:#b0b0b6;
    font-size:12px; font-weight:400; text-decoration:line-through;
}

/* ---------- 아이콘 (히트/추천/최신/인기/할인/쿠폰/품절) ---------- */
.sct.sct_20 .sct_icon{
    position:static; display:flex; flex-wrap:wrap; gap:4px; width:auto;
    margin:8px 0 0; padding-top:10px; border-top:1px solid #f0f0f2;
    line-height:normal; text-indent:0;
}
.sct.sct_20 .shop_icon{
    border-radius:6px; padding:2px 8px; font-size:11px; font-weight:700; line-height:18px; margin:0;
}
.sct.sct_20 .shop_icon_soldout{
    position:static; width:auto; height:auto; border:0;
    color:#fff; background:#9a9aa0; border-radius:6px; padding:2px 8px;
    font-size:11px; font-weight:700; line-height:18px;
}

/* ---------- 장바구니 버튼 (hover 시 등장, 블루 원형) ---------- */
.sct.sct_20 .sct_btn{
    position:absolute; bottom:16px; left:0; width:100%; text-align:center; z-index:10;
}
.sct.sct_20 .sct_cart{
    background:var(--ec-blue); opacity:1; width:44px; height:44px; border-radius:50%;
    box-shadow:0 6px 16px rgba(0,113,227,.32);
    transition:background .2s, transform .2s;
}
.sct.sct_20 .sct_cart:hover{ background:var(--ec-blue-dark); transform:scale(1.08); }

/* ---------- 반응형(모바일) ---------- */
@media (max-width:767px){
    .sct.sct_20 .sct_li{ border-radius:12px; }
    .sct.sct_20 .sct_img{ padding:10px 10px 0; }
    .sct.sct_20 .sct_cnt{ padding:10px 12px 12px; }
    .sct.sct_20 .sct_txt{ font-size:13px; min-height:36px; }
    .sct.sct_20 .sct_cost{ font-size:15px; }
}

/* =========================================================
   상단 헤더 / 내비 / 카테고리 / 타이틀 통일 (electronics v3)
   ========================================================= */

/* 헤더 전체 */
#hd{ background:#fff; border-bottom:1px solid #eef0f3; }

/* 내비게이션 바 */
#gnb{ height:54px; }
#gnb #menu_open{
    background:transparent; color:#1d1d1f; border:0; font-size:14px; font-weight:700;
    height:54px; line-height:54px; padding:0 16px; cursor:pointer; vertical-align:top;
}
#gnb #menu_open:hover{ color:#0071e3; }

/* 분류 탭 (히트/추천/최신/인기/할인) */
#gnb .gnb_shortcut{ display:inline-block; float:left; }
#gnb .gnb_shortcut a{
    display:block; padding:0 15px; font-size:14px; font-weight:600; color:#1d1d1f;
    line-height:54px; text-decoration:none; position:relative; transition:color .2s;
}
#gnb .gnb_shortcut a:hover{ color:#0071e3; }
#gnb .gnb_shortcut a:hover::after{
    content:""; position:absolute; left:12px; right:12px; bottom:0; height:3px;
    background:#0071e3; border-radius:3px 3px 0 0;
}

/* 기능 링크 (오른쪽) */
#gnb .tnb_right{ float:right; }
#gnb .tnb_right a{ color:#6e6e73; font-size:13px; font-weight:500; line-height:54px; }
#gnb .tnb_right a:hover{ color:#0071e3; }

/* 카테고리 드롭다운 */
#category{ border:0; border-top:1px solid #eef0f3; box-shadow:0 18px 44px rgba(0,0,0,.1); }
#category .ct_wr{ padding:24px; }
#category .cate_li_1{ min-height:0; margin-bottom:18px; padding-right:24px; }
#category .cate_li_1_a{
    font-size:14px; font-weight:700; color:#1d1d1f;
    padding-bottom:10px; margin-bottom:8px; border-bottom:2px solid #0071e3;
}
#category .cate_li_2 a{ color:#555; font-size:13px; }
#category a:hover{ color:#0071e3; }
#category .close_btn{ top:-54px; background:#fff; color:#6e6e73; border:1px solid #eef0f3; border-bottom:0; }

/* 페이지 타이틀 */
#wrapper_title{ border-bottom:2px solid #eef0f3; padding:0 0 14px; margin:0 0 20px; }
#wrapper_title .wt{
    font-size:24px; font-weight:800; color:#1d1d1f; line-height:1.2;
    padding-left:12px; border-left:4px solid #0071e3;
}

/* 분류 이동 select */
#sct_location{ margin-bottom:14px; }
#sct_location .category1{
    border:1px solid #d6d6dc; border-radius:10px; padding:8px 14px; font-size:14px;
    color:#1d1d1f; background:#fff; cursor:pointer;
}

@media (max-width:767px){
    #wrapper_title .wt{ font-size:19px; }
    #sct_location .category1{ font-size:13px; }
}

/* =========================================================
   홈(main) 상품진열 30 (.sct_30) — 동일 카드 스타일 (electronics v4)
   ========================================================= */
.sct.sct_30{ padding:0; margin:0; }
.sct.sct_30 .sct_li{
    border:1px solid var(--ec-line); background:#fff; border-radius:var(--ec-radius);
    box-shadow:0 1px 2px rgba(0,0,0,.03), 0 6px 18px rgba(0,0,0,.05);
    overflow:hidden; transition:transform .22s ease, box-shadow .22s ease, border-color .22s;
    float:left; display:inline-block;
}
.sct.sct_30 .sct_li:hover{
    border-color:#d6e6fa; transform:translateY(-5px); box-shadow:0 12px 30px rgba(0,113,227,.15);
}
.sct.sct_30 .sct_li:hover .sct_cnt{ background:#fff; color:var(--ec-ink); }
.sct.sct_30 .sct_li:hover .sct_txt a, .sct.sct_30 .sct_li:hover .sct_cost{ color:var(--ec-ink); }
.sct.sct_30 .sct_20_wrap{ width:100%; }
.sct.sct_30 .sct_img{
    background:#fff; padding:0; margin:0; overflow:hidden; aspect-ratio:1/1;
}
.sct.sct_30 .sct_img img{
    width:100%; height:100%; display:block; object-fit:contain; object-position:center;
    border-radius:0; transition:transform .3s ease;
}
.sct.sct_30 .sct_li:hover .sct_img img{ transform:scale(1.04); }
.sct.sct_30 .sct_cnt{ padding:12px 14px 14px; text-align:left; }
.sct.sct_30 .sct_txt{
    padding:0; font-size:14px; font-weight:600; color:var(--ec-ink); line-height:1.42;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:40px;
}
.sct.sct_30 .sct_txt a{ color:var(--ec-ink); text-decoration:none; }
.sct.sct_30 .sct_basic{ font-size:12px; color:var(--ec-gray); line-height:1.4; margin:2px 0 8px; }
.sct.sct_30 .sct_cost{ padding:2px 0 6px; font-size:17px; font-weight:800; color:var(--ec-ink); text-align:left; }
.sct.sct_30 .sct_discount{
    display:inline-block; margin:0 0 0 4px; color:#b0b0b6; font-size:12px; font-weight:400; text-decoration:line-through;
}
.sct.sct_30 .sct_icon{
    position:static; display:flex; flex-wrap:wrap; gap:4px; width:auto;
    margin:8px 0 0; padding-top:10px; border-top:1px solid #f0f0f2;
    line-height:normal; text-indent:0;
}
.sct.sct_30 .shop_icon{
    border-radius:6px; padding:2px 8px; font-size:11px; font-weight:700; line-height:18px; margin:0;
}
.sct.sct_30 .sct_btn{
    position:absolute; bottom:16px; left:0; width:100%; text-align:center; z-index:10;
}
.sct.sct_30 .sct_cart{
    background:var(--ec-blue); opacity:1; width:44px; height:44px; border-radius:50%;
    box-shadow:0 6px 16px rgba(0,113,227,.32); transition:background .2s, transform .2s;
}
.sct.sct_30 .sct_cart:hover{ background:var(--ec-blue-dark); transform:scale(1.08); }
@media (max-width:767px){
    .sct.sct_30 .sct_li{ border-radius:12px; }
    .sct.sct_30 .sct_img{ padding:10px 10px 0; }
    .sct.sct_30 .sct_cnt{ padding:10px 12px 12px; }
    .sct.sct_30 .sct_txt{ font-size:13px; min-height:36px; }
    .sct.sct_30 .sct_cost{ font-size:15px; }
}

/* ---------- 상품 순위(1위/2위...) 숨김 (electronics v5) ---------- */
.sct.sct_20 .sct_rank,
.sct.sct_30 .sct_rank{ display:none !important; }

/* =========================================================
   추천상품(section.main2) 배경 이미지 (electronics v14)
   ========================================================= */
section.main2{
    background:url('https://aka.doubaocdn.com/s/l36NomvrNk') center top / cover no-repeat;
    padding:28px 22px 32px; border-radius:18px;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}
section.main2 .main_tit{ color:#fff; }
section.main2 p{ color:#dbe4f5; margin-bottom:14px; }