@charset "utf-8";
/* ==========================================================================
   영카트 쇼핑몰 리뉴얼 - 헤더 스타일
   Reference: https://objetlife.co.kr/
   Breakpoints: 1280 / 840 / 480
   ========================================================================== */

/* ==========================================================================
   테마 변수 — 사이트마다 이 블록의 값만 바꿔서 재사용
   ========================================================================== */
:root {
    --theme-primary: #ab3e55;           /* 브랜드 포인트 컬러 */
    --theme-primary-light: #c25873;     /* 살짝 밝은 버전 (호버/보조) */
    --theme-primary-contrast: #ffffff;  /* 포인트 컬러 위에 올라가는 글자색 */
}
html { overflow-x: hidden;}
/* ========== Header Reset ========== */
#hd { position:relative; background:#fff; border:none; height:auto; min-width:0; z-index:99; }

#w_aside { position:fixed; right:20px; bottom:30px; display: flex; flex-direction: column; gap:14px; align-items: center; justify-content: center; z-index:99; }
#w_aside img { border-radius: 100px; width: 60px; box-shadow: 2px 2px 4px rgba(0,0,0,0.4); }


/* 상단 유틸바 내 모바일몰 pill 버튼 (.mall) */
#hd .tnb .hd_top_menu li.mall { margin-right:10px; }
#hd .tnb .hd_top_menu li.mall:after { display:none; }
#hd .tnb .hd_top_menu li.mall a { background:#1f305e; color:var(--theme-primary-contrast); padding:6px 12px; border-radius:4px; font-size:11px; font-weight:500; line-height:1; letter-spacing:.02em; }
#hd .tnb .hd_top_menu li.mall a:hover { opacity:.9; color:var(--theme-primary-contrast); }
#hd:before, #hd:after { display:none !important; }
#hd_h1, #skip_to_container { position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; }
#hd a { text-decoration:none; color:inherit; }
#hd ul { list-style:none; margin:0; padding:0; }
#hd .wrap { max-width:1200px; margin:0 auto; position:relative; }
#hd .wrap:after { content:""; display:block; clear:both; }

/* ========== (1) .tnb 상단 유틸바 ========== */
#hd .tnb { border-bottom:1px solid #ddd; }
#hd .tnb .wrap { display:flex; justify-content:flex-end; align-items:center; line-height:46px; font-size:11px; color:#888; }
#hd .tnb .hd_top_menu { display:flex; }
#hd .tnb .hd_top_menu li { position:relative; }
#hd .tnb .hd_top_menu li:after { content:"|"; margin:0 10px; font-size:10px; position:relative; top:-1px; color:#ccc; }
#hd .tnb .hd_top_menu li:last-child:after { display:none; }
#hd .tnb .hd_top_menu li a { color:#888; }
#hd .tnb .hd_top_menu li a:hover { color:var(--theme-primary); }
#hd .tnb .hd_top_menu li a strong { color:var(--theme-primary); font-weight:normal; }

/* ========== (2) .mid 로고 + 검색 ========== */
#hd .mid { display:flex; align-items:center; justify-content:flex-start; height:114px; position:relative; }
#hd .mid .hd_logo { display:block; }
#hd .mid .hd_logo img { height:60px; width:auto; vertical-align:middle; display:block; }
#hd .mid #schBox { position:absolute; right:0; top:40px; width:340px; border:1px solid #ddd; height:40px; padding:0; margin:0; background:#fff; }
#hd .mid #schBox legend { position:absolute; left:-9999px; top:-9999px; width:1px; height:1px; overflow:hidden; }
#hd .mid #schBox form { display:flex; align-items:center; height:100%; }
#hd .mid #schBox input { border:none; background:#fff; padding:0 10px; box-sizing:border-box; width:calc(100% - 40px); height:38px; outline:none; font-size:13px; }
#hd .mid #schBox button { width:39px; height:38px; border:none; border-left:1px solid #ddd; background:#fff; color:#000; font-size:18px; cursor:pointer; padding:0; }
#hd .mid #schBox button i { position:relative; top:-2px; }

/* ========== (3) .bot 메인 카테고리 ========== */
#hd .bot { border:none; height:50px; position:relative; background:#fff; color:#000; border-bottom:1px solid #bbb; border-top:1px solid #ddd; }
#hd .bot .wrap { height:50px; }
#hd .bot #nav_btn { position:absolute; left:0; top:-1px; width:50px; height:50px; background:#333; border:0; padding:0; display:flex; align-items:center; justify-content:center; flex-direction:column; cursor:pointer; transition:background .2s; }
#hd .bot #nav_btn .line { width:24px; height:2px; background:#fff; display:block; margin:3px auto; transition:all .3s ease-in-out; }
#hd .bot #nav_btn.act .line:nth-child(2) { opacity:0; }
#hd .bot #nav_btn.act .line:nth-child(1) { transform:translateY(8px) rotate(45deg); }
#hd .bot #nav_btn.act .line:nth-child(3) { transform:translateY(-8px) rotate(-45deg); }

#hd .bot #w_category { position:relative; margin-left:60px; margin-right:0; }
/* swiper 수평 클리핑: 좌/우만 자르고 수직(서브메뉴 드롭다운)은 보이게 유지 */
#hd .bot #w_category .ct_wr.swiperMenu { overflow:visible; clip-path:inset(-100vh 0 -100vh 0); -webkit-clip-path:inset(-100vh 0 -100vh 0); }
#hd .bot #w_category .cate { display:flex; justify-content:flex-start; flex-wrap:nowrap; }
#hd .bot #w_category .cate_li_1 { position:relative; width:auto !important; flex-shrink:0; }
/* 스와이퍼 prev/next 버튼 — 카테고리 영역 좌/우 끝 오버레이(레이아웃 shift 없음) */
#hd .bot .wrap { position:relative; }
#hd .bot .wrap > .gnb-nav-btn { position:absolute; top:0; width:36px; height:48px; margin:0; padding:0; border:0; cursor:pointer; z-index:10; display:flex; align-items:center; justify-content:center; font-size:14px; color:#000; background: #fff;  }
#hd .bot .wrap > .gnb-nav-btn:after { display:none; }
#hd .bot .wrap > .swiper-button-prev { left:50px; }
#hd .bot .wrap > .swiper-button-next { right:0; }
#hd .bot .wrap > .swiper-button-prev:before { content:""; position:absolute; top:0; left:100%; width:24px; height:100%; background:linear-gradient(to right, var(--theme-primary), rgba(171,62,85,0)); pointer-events:none; display: none; }
#hd .bot .wrap > .swiper-button-next:before { content:""; position:absolute; top:0; right:100%; width:24px; height:100%; background:linear-gradient(to left, var(--theme-primary), rgba(171,62,85,0)); pointer-events:none; display: none; }
#hd .bot .wrap > .gnb-nav-btn:hover { color:#000; }
/* watchOverflow=true: 오버플로 없을 때 자동 숨김 (메뉴 shift 없음) */
#hd .bot .wrap > .swiper-button-lock { display:none !important; }
/* 시작/끝 도달 시 비활성 */
#hd .bot .wrap > .swiper-button-disabled { opacity:.3; cursor:default; pointer-events:none; }
#hd .bot #w_category .cate_li_1 > a { padding:0 25px; line-height:50px; font-size:14px; display:block; box-sizing:border-box; font-weight:bold; color:#000; white-space:nowrap; transition:background .15s; }
#hd .bot #w_category .cate_li_1:hover > a { color:#000; }
#hd .bot #w_category .cate_li_1 > ul.sub_cate { border:1px solid #bbb; display:none; background:#fff; position:absolute; white-space:nowrap; left:0; top:100%; min-width:140px; z-index:110; }
/* 메인 <-> 서브 사이 투명 bridge — 마우스가 지나가도 hover 유지 */
#hd .bot #w_category .cate_li_1 > ul.sub_cate:before { content:""; position:absolute; left:0; right:0; top:-8px; height:8px; background:transparent; }
#hd .bot #w_category .cate_li_1:hover > ul.sub_cate { display:block; }
#hd .bot #w_category .sub_cate .cate_li_2 > a { padding:0 25px; line-height:30px; font-size:12px; display:block; color:#444; }
#hd .bot #w_category .sub_cate .cate_li_2 > a:hover { background:var(--theme-primary); color:var(--theme-primary-contrast); }
#hd .bot .no-cate { padding:16px 0 16px 25px; margin:0; font-size:13px; color:#999; }

/* 모바일 전용 아이콘바: 데스크톱에서는 숨김 */
#hd #hd_btn.hd_m_btn { display:none; }

/* ========== 전체 카테고리 사이트맵 패널 ========== */
#hd #sitemap_panel { position:absolute; width:100%; max-width:1200px; left:50%; transform: translateX(-50%); top:100%; background:#fff; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-shadow:0 12px 24px -12px rgba(0,0,0,.15); max-height:0; overflow:hidden; opacity:0; visibility:hidden; transition:max-height .35s ease, opacity .25s ease, visibility 0s linear .35s; z-index:100; }
#hd #sitemap_panel.open { max-height:80vh; opacity:1; visibility:visible; overflow:auto; transition:max-height .35s ease, opacity .25s ease, visibility 0s linear 0s; }
#hd #sitemap_panel .wrap { max-width:1200px; margin:0 auto; padding:36px 20px; }
#hd #sitemap_panel .sitemap_grid { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, 1fr); gap:20px 24px; }
#hd #sitemap_panel .sitemap_col { min-width:0; padding:20px 0;  }
#hd #sitemap_panel .sitemap_col h3 { margin:0 0 12px; font-size:14px; font-weight:700; color:#222; padding-bottom:10px; border-bottom:1px solid #eee; letter-spacing:-.01em; }
#hd #sitemap_panel .sitemap_col h3 a { color:inherit; text-decoration:none; display:block; }
#hd #sitemap_panel .sitemap_col h3 a:hover { color:var(--theme-primary); }
#hd #sitemap_panel .sitemap_sub { list-style:none; margin:0; padding:0; }
#hd #sitemap_panel .sitemap_sub li { margin:0; }
#hd #sitemap_panel .sitemap_sub li a { display:block; padding:5px 0; font-size:12.5px; color:#666; text-decoration:none; line-height:1.5; }
#hd #sitemap_panel .sitemap_sub li a:hover { color:var(--theme-primary); text-decoration: underline; }

/* ==========================================================================
   모바일 슬라이드 드로어 (#m_drawer) — 기본 숨김, 모바일 브레이크에서만 표시
   ========================================================================== */
#m_drawer { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.45); z-index:9999; visibility:hidden; opacity:0; transition:opacity .25s ease, visibility 0s linear .25s; }
#m_drawer.open { visibility:visible; opacity:1; transition:opacity .25s ease, visibility 0s linear 0s; }
#m_drawer .m_drawer_inner { position:absolute; top:0; left:0; bottom:0; width:82%; max-width:340px; background:#fff; overflow-y:auto; -webkit-overflow-scrolling:touch; transform:translateX(-100%); transition:transform .3s ease; box-shadow:2px 0 12px rgba(0,0,0,.2); }
#m_drawer.open .m_drawer_inner { transform:translateX(0); }

/* 드로어 상단: 로그인/회원가입 + 닫기 버튼 */
#m_drawer .m_drawer_top { position:relative; background:#333; color:#fff; padding:18px 50px 18px 20px; display:flex; align-items:center; gap:10px; }
#m_drawer .m_drawer_top a { color:#fff; text-decoration:none; font-size:14px; font-weight:500; line-height:1; display:inline-block; padding:4px 0; }
#m_drawer .m_drawer_top .m_login { font-weight:700; font-size:15px; }
#m_drawer .m_drawer_top .m_join { opacity:.85; border-left:1px solid rgba(255,255,255,.4); padding-left:10px; }
#m_drawer .m_drawer_top .m_drawer_close { position:absolute; top:50%; right:8px; transform:translateY(-50%); width:40px; height:40px; border:0; background:none; color:#fff; font-size:20px; cursor:pointer; padding:0; }

/* 드로어 카테고리 리스트 */
#m_drawer ul.m_cate { list-style:none; margin:0; padding:0; background:#fff; border-bottom:1px solid #e5e5e5; }
#m_drawer ul.m_cate.m_cate_sub { background:#f7f7f7; }
#m_drawer ul.m_cate > li { position:relative; border-bottom:1px solid #eee; }
#m_drawer ul.m_cate > li:last-child { border-bottom:none; }
#m_drawer ul.m_cate > li > a { display:block; padding:0 50px 0 20px; line-height:48px; font-size:14px; color:#222; font-weight:500; text-decoration:none; }
#m_drawer ul.m_cate > li > a:hover { color:var(--theme-primary); }

/* 하위분류 토글 버튼 */
#m_drawer ul.m_cate > li > .m_sub_toggle { position:absolute; top:0; right:0; width:48px; height:48px; border:0; background:none; color:#999; font-size:16px; cursor:pointer; padding:0; transition:transform .2s, color .2s; }
#m_drawer ul.m_cate > li.open > .m_sub_toggle { transform:rotate(180deg); color:var(--theme-primary); }

/* 서브 카테고리 */
#m_drawer ul.m_sub_cate { display:none; list-style:none; margin:0; padding:0; background:#fafafa; border-top:1px solid #eee; }
#m_drawer ul.m_cate > li.open > ul.m_sub_cate { display:block; }
#m_drawer ul.m_sub_cate li { border-bottom:1px solid #eee; }
#m_drawer ul.m_sub_cate li:last-child { border-bottom:none; }
#m_drawer ul.m_sub_cate li a { display:block; padding:0 20px 0 36px; line-height:42px; font-size:13px; color:#555; text-decoration:none; position:relative; }
#m_drawer ul.m_sub_cate li a:before { content:""; position:absolute; left:22px; top:50%; width:6px; height:1px; background:#bbb; }
#m_drawer ul.m_sub_cate li a:hover { color:var(--theme-primary); background:#fff; }

/* ==========================================================================
   히어로 슬라이드 (#main .mainSlide) — 레퍼런스 기준 최소 스타일
   ========================================================================== */
#main { position:relative; width:100%; overflow:hidden; }
#main .swiper-slide { line-height:0; height:auto; }
#main .swiper-slide a { display:block; width:100%; }
#main .swiper-slide img.mainSlide-img { width:100%; height:auto; display:block; }
#main .swiper-button-next, #main .swiper-button-prev { color:#fff; }
#main .swiper-button-next:after, #main .swiper-button-prev:after { padding:30px 40px; font-size:18px; font-weight:bold; }
#main .swiper-pagination-bullets { bottom:30px; }
#main .swiper-pagination-bullets .swiper-pagination-bullet { background:#fff; opacity:.5; width:10px; height:10px; }
#main .swiper-pagination-bullets .swiper-pagination-bullet-active { background:#fff; opacity:1; }

/* ==========================================================================
   메인(index) 레이아웃 오버라이드 — 레퍼런스 풀폭 본문 / 흰 배경
   default_shop.css 의 #wrapper{background:#f6f6f6/min-width:1200px},
   #container{width:1200px}, .is_index{margin-left:285px} 재정의
   ========================================================================== */
/* 배경/최소폭 해제, #container 풀폭화 */
#wrapper { background: none; }
#wrapper.is_index { background:#fff; min-width:0; }
#wrapper.is_index #container { width:100%; max-width:none; margin:0; padding:0; min-height:0; box-sizing:border-box; }
#wrapper.is_index #container .shop-content.is_index { margin-left:0; width:100%; padding:0; box-sizing:border-box; }

/* 메인 슬라이더는 풀폭 유지 */
#wrapper.is_index #main { position:relative; width:100%; overflow:hidden; }
#wrapper.is_index #main .swiper-slide img { width:100%; height:auto; max-height:none; object-fit:cover; }
#wrapper.is_index #main .swiper-button-next:after,
#wrapper.is_index #main .swiper-button-prev:after { padding:30px 40px; font-size:18px; }
#wrapper.is_index #main .swiper-pagination-bullets { bottom:30px; }
#wrapper.is_index #main .swiper-pagination-bullets .swiper-pagination-bullet { background:#fff; opacity:.5; width:10px; height:10px; border-radius:50%; }
#wrapper.is_index #main .swiper-pagination-bullets .swiper-pagination-bullet-active { opacity:1; width:10px; border-radius:50%; }

/* 레퍼런스 .wrap 규칙 — 섹션 내부 콘텐츠 컨테이너 */
#wrapper.is_index .wrap { width:1200px; max-width:100%; margin:0 auto; position:relative; box-sizing:border-box; padding-left:20px; padding-right:20px; }
#wrapper.is_index .fl { display:flex; align-items:center; justify-content:space-between; }

/* #main / #fav 외 본문 섹션(상품진열 sct_wrap, boxevent 등)을 1200px 센터 정렬 */
#wrapper.is_index .shop-content.is_index > section:not(#main):not(#fav),
#wrapper.is_index .shop-content.is_index > .sct_wrap,
#wrapper.is_index .shop-content.is_index > #boxevent,
#wrapper.is_index .shop-content.is_index > .idx_evt { width:1200px; max-width:100%; margin-left:auto; margin-right:auto; padding-left:20px; padding-right:20px; box-sizing:border-box; }

/* ==========================================================================
   BEST 카테고리 (#fav) — 레퍼런스 수치 1:1 매칭
   ========================================================================== */
section#fav { text-align:center; padding:100px 0 30px; background:#fff; }
section#fav .wrap { width:1200px; max-width:100%; margin:0 auto; }
section#fav h2 { font-size:22px; font-weight:bold; color:#222; margin:0; line-height:1.4; }
section#fav ul.fl { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin:40px 0 0; padding:0; list-style:none; flex-wrap:wrap; }
section#fav ul.fl li { width:160px; margin:0; flex:0 0 auto; }
section#fav ul.fl li a { display:block; text-decoration:none; color:#333; }
section#fav ul.fl li figure { width:160px; height:160px; margin:0 auto; border-radius:1000px; overflow:hidden; background:#f5f5f5; display:flex; align-items:center; justify-content:center; }
section#fav ul.fl li figure img { width:100%; height:100%; aspect-ratio:1 / 1; object-fit:cover; display:block; }
section#fav ul.fl li p { margin:10px 0 0; font-size:16px; font-weight:bold; color:#222; }

/* ==========================================================================
   메인(index) 상품 섹션 — 4열 그리드 (히트/최신/추천/할인)
   ========================================================================== */
.sct_wrap.idx-grid { margin-bottom:60px; }
.sct_wrap.idx-grid > header { margin-bottom:24px; border-bottom:1px solid #ddd; margin-top: 100px; }
.sct_wrap.idx-grid > header h2 { font-size:22px; font-weight:700; color:#222; margin:0; letter-spacing:-.01em; }
.sct_wrap.idx-grid > header h2 a { color:inherit; text-decoration:none; }
.sct_wrap.idx-grid > header h2 a:hover { color:var(--theme-primary); }
.sct_wrap.idx-grid ul.smt,
.sct_wrap.idx-grid ul.smt.smt_10 { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; list-style:none; margin:0; padding:0; width:100%; box-sizing:border-box; }
.sct_wrap.idx-grid ul.smt > .sct_li { width:auto; min-width:0; max-width:100%; margin:0; padding:0; float:none; clear:none; list-style:none; position:relative; box-sizing:border-box; }
.sct_wrap.idx-grid .sct_img { position:relative; width:100%; border:1px solid #ebebeb; background:#fff; overflow:hidden; aspect-ratio:1/1; box-sizing:border-box; }
.sct_wrap.idx-grid .sct_img > a { display:block; width:100%; height:100%; }
.sct_wrap.idx-grid .sct_img > a img { position:absolute; inset:0; width:100%; height:100%; max-width:100%; object-fit:cover; display:block; transition:transform .25s; }
.sct_wrap.idx-grid .sct_img > a:hover img { transform:scale(1.04); }
.sct_wrap.idx-grid .sct_img .sct_btn { position:absolute; left:0; right:0; bottom:0; padding:8px; background:rgba(0,0,0,.55); text-align:center; opacity:0; transition:opacity .2s; }
.sct_wrap.idx-grid .sct_img:hover .sct_btn { opacity:1; }
.sct_wrap.idx-grid .sct_img .btn_cart { border:0; background:#fff; color:#222; padding:0 14px; height:32px; border-radius:2px; font-size:12px; cursor:pointer; }
.sct_wrap.idx-grid .sct_img .btn_cart:hover { background:var(--theme-primary); color:#fff; }
.sct_wrap.idx-grid .sct_ct_wrap { padding-top:14px; }
.sct_wrap.idx-grid .sct_txt { margin:0; padding:0; border:none; line-height:1.4; }
.sct_wrap.idx-grid .sct_txt a { display:block; font-size:13px; font-weight:700; color:#222; text-decoration:none; padding:0; }
.sct_wrap.idx-grid .sct_txt a:hover { color:var(--theme-primary); }
.sct_wrap.idx-grid .sct_basic { margin-top:6px; font-size:12px; color:#888; line-height:1.5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sct_wrap.idx-grid .sct_cost { display:block; padding:8px 0 4px; font-size:14px; font-weight:700; color:var(--theme-primary); line-height:1.2; }
.sct_wrap.idx-grid .sct_op_btn { display:flex; gap:4px; margin-top:4px; }
.sct_wrap.idx-grid .sct_op_btn button { width:28px; height:28px; border:1px solid #e5e5e5; background:#fff; color:#888; cursor:pointer; border-radius:50%; font-size:12px; }
.sct_wrap.idx-grid .sct_op_btn button:hover { color:var(--theme-primary); border-color:var(--theme-primary); }
.sct_wrap.idx-grid .sct_star { margin-bottom:4px; }
.sct_wrap.idx-grid .shop_icon_soldout { position:absolute; top:8px; left:8px; background:rgba(0,0,0,.7); color:#fff; padding:4px 8px; font-size:11px; border-radius:2px; }

/* ==========================================================================
   상품 리스트 / 카테고리 페이지 — 레퍼런스(list.php) 매칭
   ========================================================================== */
/* 전역 min-width 해제 (카테고리/상세 페이지도 반응형 허용) */
#wrapper { min-width:0; }
#container { width:1200px; max-width:100%; margin:0 auto; box-sizing:border-box; padding-left:20px; padding-right:20px; }
#container .shop-content { padding:20px 0; }

/* 경로/카테고리 선택 상단 영역 */
#container #sct { padding-top:20px; }
#container #sct_location { float:none; position:static; display:inline-flex; align-items:center; justify-content:flex-start; margin:0; padding:0; border:none; }
#container #sct_location .go_home { color:#555; font-size:16px; text-decoration:none; }
#container #sct_location .dividing-line { margin-left:10px; margin-right:10px; color:#999; font-size:12px; }
#container #sct_location select { height:30px; padding:0 30px 0 10px; border:1px solid #ddd; background:#fff; font-size:13px; color:#333; border-radius:2px; }

/* 카테고리 타이틀 */
#container h2.category-title { margin:10px 0 60px; font-size:21px; font-weight:700; color:#222; letter-spacing:-.01em; }

/* 정렬/뷰 변경 바 */
#container #sct_sortlst { position:relative; margin-top:80px; border:none; border-top:1px solid #999; border-bottom:1px solid #dbdbdb; padding:0 10px; overflow:hidden; }
#container #sct_sortlst:after { content:""; display:block; clear:both; }
#container #sct_sort { float:left; }
#container #sct_sort > h2 { position:absolute; left:-9999px; top:-9999px; }
#container #ssch_sort { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; }
#container #ssch_sort li { float:none; line-height:42px; padding:0;  }
#container #ssch_sort li:after { display:none !important; }
#container #ssch_sort li a { display:block; color:#333; border:none; padding:0 20px 0 0; margin-right:20px; font-size:13px; text-decoration:none; }
#container #ssch_sort li a:hover { color:var(--theme-primary); }
#container #sct_lst { float:right; list-style:none; margin:0; padding:0; display:flex; line-height:42px; }
#container #sct_lst li { margin-left:4px; }
#container #sct_lst li button { width:28px; height:28px; border:1px solid #ddd; background:#fff; color:#666; cursor:pointer; border-radius:2px; }
#container #sct_lst li button:hover { background:#f5f5f5; color:#222; }

/* 상품 그리드 */
#container ul.sct.lists-row { margin-left:-10px; margin-right:-10px; padding:0; list-style:none; }
#container ul.sct.lists-row:after { content:""; display:block; clear:both; }
#container ul.sct.lists-row > .sct_li { margin-top:40px; padding-left:10px; padding-right:10px; box-sizing:border-box; float:left; }

/* 상품 카드 */
#container .sct .sct_img { position:relative; text-align:left; display:block; border:1px solid #ebebeb; background:#fff; overflow:hidden; }
#container .sct .sct_img a { display:block; }
#container .sct .sct_img a img { width:100%; height:auto; display:block; transition:transform .25s; }
#container .sct .sct_img a:hover img { transform:scale(1.03); }
#container .sct .sct_img .sct_btn.list-10-btn { position:absolute; left:0; right:0; bottom:0; padding:8px; background:rgba(0,0,0,.55); text-align:center; opacity:0; transition:opacity .2s; }
#container .sct .sct_img:hover .sct_btn.list-10-btn { opacity:1; }
#container .sct .sct_img .btn_cart { border:0; background:#fff; color:#222; padding:0 14px; height:32px; border-radius:2px; font-size:12px; cursor:pointer; }
#container .sct .sct_img .btn_cart:hover { background:var(--theme-primary); color:var(--theme-primary-contrast); }
#container .sct .sct_ct_wrap { padding-top:20px; }
#container .sct .sct_txt { border:none; margin:5px 0 0; padding:0; line-height:1.4; }
#container .sct .sct_txt a { display:block; padding:5px 0 0; font-size:13px; font-weight:bold; color:#222; text-decoration:none; }
#container .sct .sct_txt a:hover { color:var(--theme-primary); }
#container .sct .sct_basic { margin-top:6px; font-size:12px; color:#888; line-height:1.5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#container .sct .sct_bottom { display:flex; align-items:center; justify-content:space-between; margin-top:6px; }
#container .sct .sct_cost { display:block; padding:7px 0 5px; font-size:14px; color:var(--theme-primary); margin-top:0; line-height:1; font-weight:700; }
#container .sct .sct_op_btn { display:flex; gap:4px; }
#container .sct .sct_op_btn button { width:28px; height:28px; border:1px solid #e5e5e5; background:#fff; color:#888; cursor:pointer; border-radius:50%; font-size:12px; }
#container .sct .sct_op_btn button:hover { color:var(--theme-primary); border-color:var(--theme-primary); }

/* 아이콘/품절 등 */
#container .sct .sit_icon_li { position:absolute; left:6px; top:6px; }

/* ==========================================================================
   푸터 (#w_footer) — 레퍼런스 라이트 테마 기준
   .cp(브랜드 포인트 컬러): var(--theme-primary)
   ========================================================================== */
footer#w_footer { background:#fff; color:#333; border-top:1px solid #ddd; margin-top:80px; font-size:13px; line-height:1.6; }
footer#w_footer a { color:inherit; text-decoration:none; }
footer#w_footer a:hover { color:var(--theme-primary); }
footer#w_footer .wrap { max-width:1200px; margin:0 auto; padding:0 20px; position:relative; }
footer#w_footer .fl { display:flex; flex-wrap:wrap; }
footer#w_footer .spb { justify-content:space-between; }
footer#w_footer .ait { align-items:flex-start; }

/* (1) 상단 3컬럼 — CS / BANK / NOTICE */
footer#w_footer .top { padding:40px 20px; gap:30px; }
footer#w_footer .top article { flex:1 1 0; min-width:0; width:370px; max-width:370px; }
footer#w_footer .top article h2 { font-size:14px; line-height:30px; font-weight:700; color:#222; margin:0; padding-bottom:5px; letter-spacing:.02em; }
footer#w_footer .top article strong.cp { display:block; font-size:18px; line-height:30px; font-weight:700; color:var(--theme-primary); margin:0 0 7px; }
footer#w_footer .top article p { margin:0; font-size:13px; color:#666; line-height:1.6; }
footer#w_footer .top article p b { color:#000; font-weight:600; }
footer#w_footer .top .news_frame ul { list-style:none; margin:0; padding:0; line-height:26px; position:relative; top:0; }
footer#w_footer .top .news_frame ul li { margin:0; font-size:13px; color:#666; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
footer#w_footer .top .news_frame ul li.empty_li { color:#999; }

/* (2) 정책 링크 네비 */
footer#w_footer nav { border-top:1px solid #ddd; border-bottom:1px solid #ddd; }
footer#w_footer nav ul.wrap { list-style:none; margin:0 auto; padding:0 20px; display:block; }
footer#w_footer nav ul li { float:left; line-height:40px; font-size:13px; color:#555; }
footer#w_footer nav ul li:after { content:"|"; position:relative; top:-2px; color:#ccc; }
footer#w_footer nav ul li:last-child:after { display:none; }
footer#w_footer nav ul li a { padding:0 10px; color:#555; }
footer#w_footer nav ul li:first-child a { padding-left:0; }
footer#w_footer nav ul li b a { color:#222; font-weight:700; }
footer#w_footer nav:after { content:""; display:block; clear:both; }

/* (3) 로고 + 회사정보 */
footer#w_footer .bot { padding:40px 20px; align-items:flex-start; }
footer#w_footer .bot > img { height:40px; width:auto; flex:0 0 auto; margin-right:30px; }
footer#w_footer .bot address { width:calc(100% - 270px); font-style:normal; line-height:1.8; color:#666; font-size:13px; }
footer#w_footer .bot address span { display:inline-block; margin-right:20px; }
footer#w_footer .bot address span a { color:#888; text-decoration:underline; margin-left:4px; }
footer#w_footer .bot address span a:hover { color:var(--theme-primary); }
footer#w_footer .bot address p { margin:10px 0 0; font-size:12px; color:#999; letter-spacing:.01em; }

#side_menu { display: none; }
#sit_ov { width:510px; }

/* 반응형 */
@media (max-width:1240px){
    footer#w_footer .top article { width:auto; max-width:none; }
    div#sit_ov_from { padding:0; }
    #sit_pvi, section#sit_ov { width:calc(50% - 20px ); }
    #sit_pvi #sit_pvi_big { width: 100%; height:auto; aspect-ratio: 1 / 1; }
    section#sit_rel { padding-top: 20px; }
}
@media (max-width:900px){
    footer#w_footer .top { flex-direction:column; gap:24px; padding:30px 20px; }
    footer#w_footer .top article { width:100%; }
    footer#w_footer .bot { flex-direction:column; gap:16px; padding:30px 20px; }
    footer#w_footer .bot > img { margin-right:0; }
    footer#w_footer .bot address { width:100%; }
    footer#w_footer nav ul.wrap { padding:6px 20px; }
    footer#w_footer nav ul li { line-height:32px; }
    footer#w_footer nav ul li a { padding:0 8px; }
    div#sit_ov_wrap { padding:16px 0; }
}

/* 상품 상세 - 썸네일 Swiper 레이아웃 (shop 레퍼런스 기준) */
#sit_pvi_big { border:1px solid #eee; width:600px; height:600px; display:flex; align-items:center; justify-content:center; float:none; position:relative; }
#sit_pvi_big #popup_item_image { right:-1px; bottom:-1px; }
.th_slide { margin-top:20px; width:600px; padding:0 46px; }
.th_slide .swiper-button-next, .th_slide .swiper-button-prev { color:#999; background:#fff; width:36px; height:72px; top:0; margin-top:0; font-size:20px; }
.th_slide .swiper-button-next { right:0; }
.th_slide .swiper-button-prev { left:0; }
.th_slide .swiper-button-next:after, .th_slide .swiper-button-prev:after { font-size:30px; }
#sit_pvi_thumb { float:none; }
#sit_pvi_thumb li { margin:0; width:auto; }
#sit_pvi_big img { width:auto; max-width:100%; max-height:100%; }

/* ── 상품 상세 레이아웃 & 폰트 오버라이드 ── */
#sit_ov_wrap { border-top:none; padding:0; }
/* 고정 1200px → 유동 max-width */
#sit_ov_from, #sit_rel, #sit_siblings { width:100%; max-width:1200px; margin-left:auto; margin-right:auto; box-sizing:border-box; }

#sit_title { font-size:18px; font-weight:700; }
#sit_desc { font-size:14px; color:#666; }
#sit_ov_btn { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
#sit_ov_btn:after { display:none; }
#sit_ov_btn * { font-size:16px; color:#333; }
#sit_ov_btn button, #sit_ov_btn a { margin-right:0; height:50px; box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; }
#sit_ov_btn button.sit_btn_cart { flex:1 1 0; min-width:0; }
#sit_ov_btn a.sit_btn_wish { flex:1 1 0; min-width:0; border:1px solid #ddd; background:#fff; text-decoration:none; }
#sit_ov_btn button.sit_btn_buy { flex:1.5 1 0; min-width:0; color:#fff; background:var(--theme-primary); border-color:var(--theme-primary); }
#sit_ov_btn button.sit_btn_buy *, #sit_ov_btn a.sit_btn_buy * { color:#fff !important; }
#sit_ov_btn a.sit_btn_buy { background:#1375ec; border-color:#1375ec; color:#fff; }
/* #sit_info: inline-flex → block-level flex로 변경, float 해제 */
#sit_info { display:flex !important; clear:both; width:100%; max-width:1200px; margin:40px auto 0; box-sizing:border-box; }
/* #sit_tab 고정폭(928px) 해제 → flex grow */
#sit_tab { width:100% !important; flex:1 1 0; min-width:0; }

/* ── 탭 스타일: 모던 하단 라인 ── */
#sit_tab .tab_tit { display:flex !important; flex-wrap:wrap; justify-content:flex-start; padding:0; margin:0; border-bottom:1px solid #e8e8e8; background:#fff; }
#sit_tab .tab_tit li { float:none !important; display:flex; flex:1 1 0; min-width:25%; }
#sit_tab .tab_tit li button {
    display:flex; flex:1; align-items:center; justify-content:center; gap:6px;
    position:relative; font-size:1em; font-weight:500; padding:16px 10px;
    border:none; border-bottom:3px solid transparent; margin:0;
    color:#777; background:#fff;
    cursor:pointer; white-space:nowrap; transition:all 0.3s ease;
}
#sit_tab .tab_tit li button:hover { color:#111; }
/* 선택 탭 */
#sit_tab .tab_tit li .selected {
    color:var(--theme-primary, #111) !important; font-weight:700 !important;
    border-bottom:3px solid var(--theme-primary, #111) !important;
    background:#fff !important;
}
#sit_tab .tab_tit li .selected:after { display:none !important; }
/* 카운트 배지 */
#sit_tab .item_use_count, #sit_tab .item_qa_count { 
    display:inline-flex; align-items:center; justify-content:center;
    min-width:20px; height:20px; font-size:0.75em; font-weight:600; padding:0 6px; 
    background:#f0f0f0; border-radius:10px; color:#777; transition:all 0.3s ease; box-sizing:border-box;
}
#sit_tab .tab_tit li .selected .item_use_count,
#sit_tab .tab_tit li .selected .item_qa_count {
    background:var(--theme-primary, #111); color:var(--theme-primary-contrast, #fff);
}
/* #sit_buy 사이드 주문 패널 숨김 */
#sit_buy { display:none !important; }

/* ==========================================================================
   전체 반응형
   Breakpoints: 1240 / 1024 / 840 / 480
   ========================================================================== */

/* ── 1240px 이하: 컨테이너 유동화 ── */
@media (max-width: 1240px) {
    #hd .wrap { padding:0 20px; }
    #hd #sitemap_panel { width:100%; left:0; transform:none; }
    #container { width:100%; }
    #wrapper.is_index .wrap { width:100%; }
    section#fav .wrap { width:100%; }
    #sit_ov_from, #sit_rel, #sit_siblings { width:100%; padding:0 20px; box-sizing:border-box; }
    #sit_info { width:100%; }
}

/* ── 1024px 이하: 태블릿 ── */
@media (max-width: 1024px) {
    #hd .mid #schBox { width:260px; right:20px; }

    /* 상품 상세 */
    #sit_ov_wrap { padding:20px; }
    #sit_pvi_big { width:100%; height:auto; aspect-ratio:1/1; }
    .th_slide { width:100%; }
    #sit_ov { width:calc(100% - 660px); min-height:0; }

    /* 인덱스 그리드 3열 */
    .sct_wrap.idx-grid ul.smt,
    .sct_wrap.idx-grid ul.smt.smt_10 { grid-template-columns:repeat(3, 1fr); }
}

/* ── 840px 이하: 모바일 ── */
@media (max-width: 840px) {
    /* 헤더 상단 유틸바 숨김 */
    

    /* 헤더 로고 영역 압축 */
    #hd .mid { height:60px; padding:0 10px; }
    #hd .mid .hd_logo img { height:38px; }
    #hd .mid #schBox { display:none; }

    /* 데스크톱 카테고리 바 숨김 */
    #hd .bot { display:none; }

    /* 모바일 아이콘바 표시 */
    #hd #hd_btn.hd_m_btn { display:flex; position:absolute; right:8px; top:0; height:60px; align-items:center; gap:0; }
    #hd #hd_btn.hd_m_btn a,
    #hd #hd_btn.hd_m_btn button { width:42px; height:42px; display:flex; align-items:center; justify-content:center; color:#333; font-size:20px; border:none; background:none; cursor:pointer; padding:0; text-decoration:none; }

    /* 드로어 활성화 */
    #m_drawer { display:block; }

    /* 컨테이너 패딩 */
    #container { padding-left:12px; padding-right:12px; }
    #wrapper.is_index .wrap { padding-left:12px; padding-right:12px; }

    /* BEST 카테고리 */
    section#fav { padding:50px 0 20px; }
    section#fav .wrap { padding:0 12px; }
    section#fav ul.fl { gap:8px; justify-content:center; }
    section#fav ul.fl li { width:calc(20% - 8px); min-width:64px; flex:0 0 auto; }
    section#fav ul.fl li figure { width:100%; height:auto; aspect-ratio:1/1; }
    section#fav ul.fl li p { font-size:12px; }

    /* 인덱스 상품 그리드 2열 */
    .sct_wrap.idx-grid ul.smt,
    .sct_wrap.idx-grid ul.smt.smt_10 { grid-template-columns:repeat(2, 1fr); gap:12px; }
    .sct_wrap.idx-grid > header { margin-top:50px; margin-bottom:14px; }
    .sct_wrap.idx-grid > header h2 { font-size:18px; }

    /* 상품 목록 2열 */
    #container ul.sct.lists-row { margin-left:-6px; margin-right:-6px; }
    #container ul.sct.lists-row > .sct_li { width:50% !important; padding-left:6px; padding-right:6px; margin-top:20px; }
    #container #sct_sortlst { margin-top:40px; }
    #container h2.category-title { margin-bottom:30px; }

    /* 상품 상세: 세로 배치 */
    #sit_ov_from, #sit_rel, #sit_siblings { padding:0 12px; }
    /* 상품 탭 + 사이드바 세로 배치 */
    #sit_info { padding:0 12px; display:block !important; }
    #sit_tab { width:100% !important; flex:none; display:block !important; }
    #sit_buy { display:none !important; }
    #sit_ov_wrap { padding:16px 12px; }
    #sit_pvi { float:none !important; width:100% !important; }
    #sit_ov { float:none !important; width:100% !important; margin-top:24px; min-height:0 !important; height:auto !important; }
    #sit_pvi_big { width:100% !important; height:auto !important; aspect-ratio:1/1; }
    #sit_pvi_big img { width:100%; max-width:100%; max-height:100%; }
    .th_slide { width:100%; }
    #sit_ov_btn button.sit_btn_cart,
    #sit_ov_btn a.sit_btn_wish { flex:1 1 0; min-width:0; }
    #sit_ov_btn button.sit_btn_buy { width:100%; }
}

/* ── 480px 이하: 소형 모바일 ── */
@media (max-width: 480px) {
    #hd .mid { padding:0 8px; }
    #hd .mid .hd_logo img { height:32px; }
    #hd #hd_btn.hd_m_btn { right:4px; }
    #hd #hd_btn.hd_m_btn a,
    #hd #hd_btn.hd_m_btn button { width:38px; font-size:18px; }

    section#fav ul.fl li { width:calc(33.333% - 8px); }

    .sct_wrap.idx-grid ul.smt { gap:8px; }
    .sct_wrap.idx-grid > header { margin-top:40px; }

    #sit_ov_btn button.sit_btn_cart,
    #sit_ov_btn a.sit_btn_wish,
    #sit_ov_btn button.sit_btn_buy { width:100%; flex:none; }

    footer#w_footer .wrap { padding:0 12px; }
    footer#w_footer .top { padding:24px 12px; }
    footer#w_footer .bot { padding:24px 12px; }
   .month_option, .card_option { width:100%; max-width: auto; }
   .month_option br, .card_option br { display: none; }
   .cart_info { padding-left:0;}
}