@charset "UTF-8";
/* ==========================================================================
   BASIC theme (베이직) - clean white / black modern look on the built-in default views.
   Only skin.css: refines the common.css variables (primary #111, subtle red accent, light hairlines) and polishes a
   few components. Loaded after /common/assets/front/common.css; module styles (shop/member/board.css) load after this
   file, so component overrides are prefixed with "body" for a higher specificity.
   ========================================================================== */

:root {
    --c-primary: #111111;
    --c-primary-text: #ffffff;
    --c-accent: #e0463c;
    --c-bg: #ffffff;
    --c-bg-soft: #f6f6f5;
    --c-surface: #ffffff;
    --c-text: #161616;
    --c-text-sub: #5c5c5c;
    --c-muted: #9a9a9a;
    --c-line: #ededec;
    --c-line-strong: #d8d8d6;
    --c-overlay: rgba(10, 10, 10, .45);
    --radius: 4px;
    --radius-lg: 8px;
    --shadow: 0 2px 12px rgba(0, 0, 0, .05);
    --shadow-lg: 0 18px 44px rgba(0, 0, 0, .14);
    --t1: #e0463c;
    --t2: #161616;
    --t3: #2a6fdb;
    --t4: #ef8a1a;
    --t5: var(--c-accent);
}

/* ---------------------------------------------------------------- header */
body .hd-top { background: #fafafa; border-bottom-color: var(--c-line); }
body .hd-search input[type=search] { border-width: 1px; border-color: var(--c-line-strong); background: var(--c-bg-soft); }
body .hd-search input[type=search]:focus { border-color: var(--c-text); background: var(--c-bg); }
body .gnb { border-top-color: var(--c-line); border-bottom-color: var(--c-line); }
body .gnb-link { font-weight: 600; letter-spacing: -.01em; }
body .gnb-sub { border-radius: 0 0 var(--radius-lg) var(--radius-lg); box-shadow: 0 16px 36px rgba(0, 0, 0, .1); }
body .hd.is-sticky .hd-main { box-shadow: 0 1px 0 var(--c-line), 0 6px 18px rgba(0, 0, 0, .05); }

/* ---------------------------------------------------------------- sections / headings */
body .sec-title { font-weight: 800; letter-spacing: -.035em; }
body .page-title { letter-spacing: -.035em; }
body .more-link { color: var(--c-muted); }
body .more-link:hover { color: var(--c-text); }

/* ---------------------------------------------------------------- product card */
body .it-thumb { border-radius: 6px; }
body .it-badge { border-radius: 3px; font-weight: 600; letter-spacing: -.01em; }
body .it-brand { font-size: 12px; letter-spacing: .02em; }
body .it-name { color: var(--c-text); font-size: 14px; }
body .it-sale { font-weight: 700; }
body .it-dc { font-weight: 700; }
body .it-soldout { background: rgba(255, 255, 255, .55); }
body .it-soldout span { border-radius: 3px; background: rgba(22, 22, 22, .84); font-size: 12px; }

/* ---------------------------------------------------------------- main page */
body .shop-hero { background: linear-gradient(180deg, #f7f7f6, #ffffff); border-bottom-color: var(--c-line); }
body .shop-cat-tile a { background: var(--c-bg-soft); border: 1px solid transparent; }
body .shop-cat-tile a:hover { background: var(--c-bg); border-color: var(--c-line); box-shadow: var(--shadow); }
body .shop-brand-logo { border-color: var(--c-line); }
body .shop-event-thumb, body .shop-display-banner, body .shop-mid-item { border-radius: var(--radius-lg); }
body .shop-notice-list { border-top-width: 1px; border-top-color: var(--c-text); }

/* ---------------------------------------------------------------- tables / lists : light hairlines */
body .tbl, body .bd-list, body .tbl-form, body .bd-webzine, body .bd-faq, body .bd-view-head, body .shop-info-tbl, body .fm-rows, body .fm-consent { border-top-width: 1px; }
body .my-title, body .box-section-title, body .shop-cart-bar { border-bottom-width: 1px; }
body .tbl tbody tr:hover > td { background: #fafafa; }
body .list-toolbar { border-bottom-color: var(--c-line); }
body .cate-chips a { border-color: var(--c-line-strong); }
body .pg .pg-cur { border-radius: 50%; }
body .pg a { border-radius: 50%; }

/* ---------------------------------------------------------------- footer */
body .ft { background: #fafafa; border-top-color: var(--c-line); }
body .ft-nav { background: var(--c-bg); }
body .ft-copy { border-top-color: var(--c-line); }

@media (max-width: 1023px) {
    body .hd-main { border-bottom-color: var(--c-line); }
    body .hd-search { z-index: 130; }
    body .hd-search input[type=search] { background: var(--c-bg); }
}
