/* =========================================================================
   mall-inline.css — skin7 파셜(header/footer/_bps_gnbov)에 인라인으로 있던
   <style> 블록을 그대로 취합한 파일. Cafe24 @css 캐시 우회 목적으로 파셜에
   인라인돼 있던 규칙들이라, 캐스케이드 순서상 마지막에 로드한다.
   ========================================================================= */

/* ---------- header: 잉크드롭 (스크롤 진행도 연동) ---------- */
#header.gnb > .bps-headink{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;mix-blend-mode:multiply}
#header.gnb > .bps-headink .drop{
  position:absolute;left:-2px;top:-81px;width:271px;height:271px;
  background:radial-gradient(circle at 42% 46%, var(--bp) 0%, rgba(91,200,228,.5) 34%, transparent 70%);
  filter:blur(15px);
  transform:translateX(var(--tx,0));
  opacity:var(--o,.19);will-change:transform,opacity;
}
#header.gnb .row{position:relative;z-index:1}

/* ---------- header: 데스크톱 그리드 (로고 좌 · GNB 중앙 · util 우) ---------- */
@media (min-width:1024px){
  #header.gnb .row{ display:grid; grid-template-columns:1fr auto 1fr; gap:0; max-width:1383px; }
  #header.gnb .row > .logo{ justify-self:start; }
  #header.gnb .row > .nav{ justify-self:center; }
  #header.gnb .row > .util{ justify-self:end; }
}

/* ---------- header: 로고 올블랙 (EN hover 트윙클만 핑크 유지) ---------- */
#header .logo:not(.dark) > .ch:not(.wave-on){ color:var(--ink)!important; }

/* ---------- header: LNB 가로 드롭다운 ---------- */
#header .nav{position:relative}
#header .nav .nav-item{position:relative;display:inline-flex;align-items:center}
#header .nav .nav-item > a.nav-top{font-size:14px;font-weight:600;color:var(--ink);position:relative;padding:6px 0;opacity:.86;display:inline-flex;align-items:center;gap:5px}
#header .nav .nav-item > a.nav-top::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--bp);transition:width .35s var(--ease)}
#header .nav .nav-item:hover > a.nav-top,#header .nav .nav-item:focus-within > a.nav-top{opacity:1}
#header .nav .nav-item:hover > a.nav-top::after,#header .nav .nav-item:focus-within > a.nav-top::after{width:100%}
#header .nav .nav-item > a.nav-top::before{content:"";display:inline-block;width:5px;height:5px;margin-left:2px;border-right:1.4px solid currentColor;border-bottom:1.4px solid currentColor;transform:translateY(-1px) rotate(45deg);opacity:.55;transition:transform .3s var(--ease),opacity .3s}
#header .nav .nav-item:hover > a.nav-top::before,#header .nav .nav-item:focus-within > a.nav-top::before{transform:translateY(1px) rotate(225deg);opacity:.9}
#header .nav .lnb{position:absolute;top:100%;left:50%;transform:translate(-50%,4px);
  padding-top:10px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s var(--ease),transform .28s var(--ease);z-index:70}
#header .nav .nav-item:hover .lnb,#header .nav .nav-item:focus-within .lnb,#header .nav .nav-item.lnb-open .lnb{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
#header .nav .lnb-inner{display:flex;align-items:center;gap:22px;white-space:nowrap;
  background:var(--panel,#fff);padding:10px 22px 12px;box-shadow:0 8px 16px -12px rgba(0,0,0,.14)}
#header .nav .lnb-inner a{font-size:13px;font-weight:600;color:var(--ink);opacity:.82;position:relative;padding:6px 2px;
  transition:color .3s var(--ease),opacity .3s var(--ease),text-shadow .3s var(--ease)}
#header .nav .lnb-inner a::before{content:"";position:absolute;left:50%;top:50%;width:160%;height:160%;transform:translate(-50%,-50%);
  background:radial-gradient(closest-side, rgba(91,200,228,.20), rgba(91,200,228,.06) 55%, transparent 76%);
  opacity:0;transition:opacity .4s var(--ease);pointer-events:none;z-index:-1}
#header .nav .lnb-inner a:hover,#header .nav .lnb-inner a:focus-visible{opacity:1;color:var(--bp);text-shadow:0 0 13px rgba(91,200,228,.42)}
#header .nav .lnb-inner a:hover::before,#header .nav .lnb-inner a:focus-visible::before{opacity:1}
@media (max-width:1023px){ #header .nav .lnb{display:none} }

/* ---------- GNB 오버레이: 서브 칩 ---------- */
.gnbov-mid .gnbov-grp{display:flex;flex-direction:column;gap:2px}
.gnbov-mid .gnbov-sub{display:flex;flex-wrap:wrap;gap:8px 16px;margin:2px 0 6px}
.gnbov-mid .gnbov-sub a{font-family:var(--lat,inherit)!important;font-size:14px!important;font-weight:600!important;
  line-height:1.3!important;color:var(--silver,#b9b9c2)!important;padding:0!important;opacity:.85}
.gnbov-mid .gnbov-sub a:hover{color:var(--bp,#2A7A94)!important;padding-left:0!important}

/* ---------- footer: 바로가기 · 클릭복사 · 로고/간격 보정 ---------- */
#footer .ft-quick{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:18px}
#footer .ft-quick a{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.62);position:relative;padding:2px 0;transition:color .25s}
#footer .ft-quick a:hover{color:var(--bp,#2A7A94)}
#footer .ft-quick a + a{padding-left:16px}
#footer .ft-quick a + a::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:11px;background:rgba(255,255,255,.2)}
#footer .comp a{display:inline}
#footer .comp a[href^="tel:"],#footer .comp a[href^="mailto:"],#footer a.bps-copy{cursor:pointer}
#footer a.bps-copy::after{content:"⧉";font-size:10px;margin-left:5px;opacity:0;transition:opacity .2s;vertical-align:1px}
#footer a.bps-copy:hover::after{opacity:.7}
#bps-copy-toast{position:fixed;left:50%;bottom:44px;transform:translate(-50%,14px);
  background:#1a1a1a;color:#fff;font-size:13px;font-weight:600;letter-spacing:.01em;
  padding:11px 20px;border-radius:999px;box-shadow:0 12px 32px -10px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;transition:opacity .28s var(--ease),transform .28s var(--ease);z-index:9999}
#bps-copy-toast.on{opacity:1;transform:translate(-50%,0)}
#bps-copy-toast b{color:var(--bp,#2A7A94)}
#footer .ftlogo .logo.dark .ch{ color:#fff!important; }
#footer .ftlogo .logo{ position:relative; top:-6px; }
@media (min-width:1024px){ #footer .ft-top .ft-brand{ margin-right:72px; } }


/* =========================================================================
   layout.html 인라인 <style> 블록 전체 취합 (skin7 원본 순서 유지, /skin-skin7/img → /img)
   ========================================================================= */

          .xans-member-join .ec-base-button.gBottom,
          .xans-member-joincomplete .ec-base-button.gBottom { margin-bottom: 80px !important; }
          .xans-member-login { padding-bottom: 64px !important; }
          #order_history_nologin_id { padding-bottom: 64px !important; }
        

/* ---- layout.html next style block ---- */

          .main_product_list .fusion-mod-wrap,.main_product_list [class*="xans-product-listmain"]{position:relative}
          .xans-product-listnormal{position:relative;min-height:360px}
          .prdList.bps-locked{opacity:1;pointer-events:none;user-select:none}
          /* [260914 지시 1] 카드 단위 잠금 — 비로그인·미인증 회원에게는 카드가 자리만 남는다.
             서버가 이미 이름·가격을 비워 보내므로(backend lib/viewerPolicy) 이 blur 를 지워도 읽을 것이 없다. */
          .bps-locked-card{pointer-events:none;user-select:none;display:flex;flex-direction:column}
          /* 이름·가격 자리는 종전대로 시머 스켈레톤 — 그 자리에는 보여줄 실루엣이 없다. */
          .bps-locked-card .bps-card-locked{display:block;background:linear-gradient(100deg,#efefef 30%,#f7f7f7 50%,#efefef 70%);background-size:220% 100%;animation:bpsLockShimmer 2.4s linear infinite;filter:blur(1.5px)}
          /* 제품 자리는 **블러된 실루엣**이다(260914 대표 지시 2). 수치는 skin7·skin8의 260915 강화값과 같다:
             layout/basic/layout.html 의 `.prdList.bps-locked{filter:blur(6.3px) grayscale(.08) brightness(1.02);opacity:1}`.
             배경 이미지는 컴포넌트가 curated 티저로 인라인 지정한다(실제 제품 사진이 아니다). */
          /* 컬리 카드(.kph)도 같은 실루엣 처리를 받는다 — 자기 마크업이라 .ph 셀렉터에 안 걸린다. */
          /* 자기 마크업을 쓰는 잠금 자리도 같은 실루엣 처리를 받는다(랭킹 행·TOP5 카드). */
          .bps-card-locked.rk2-thumb,
          .bps-card-locked.t5-thumb,
          .bps-locked-card .ph.bps-card-locked,
          .bps-locked-card .kph.bps-card-locked{aspect-ratio:1/1;width:100%;border-radius:2px;
            background:#ededf3 center/cover no-repeat;animation:none;
            filter:blur(6.3px) grayscale(.08) brightness(1.02);opacity:1}
          /* W-M: image owns the blur; no second blur on its parent or the whole grid. */
          .bps-locked-card .bps-card-locked:has(>.bps-locked-image){filter:none;overflow:hidden}
          .bps-locked-image{display:block;width:100%;height:100%;object-fit:contain}
          .bps-view-lock__behind:has(.pgrid){display:block!important}
          .bps-locked-card .bps-lock-skel{height:14px;margin:10px 0 6px;width:72%}
          .bps-locked-card .br{color:#bbb}
          .bps-lock-hint{pointer-events:auto;display:inline-block;font-size:12px;font-weight:700;color:#888;text-decoration:none;letter-spacing:-.2px}
          .bps-lock-hint:hover{color:var(--bp,#2A7A94)}
          @keyframes bpsLockShimmer{0%{background-position:120% 0}100%{background-position:-20% 0}}
          /* [260702 누수수정 ③] 오버레이 자체가 내용을 가리도록 강화(백드롭 블러7px+반투명). .bps-locked 가 순간적으로 빠져도 가격 판독 불가 = 이중 방어. */
          .bps-lock-overlay{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;z-index:6;background:rgba(255,255,255,.66);backdrop-filter:blur(7px) saturate(.92);-webkit-backdrop-filter:blur(7px) saturate(.92)}
          .bps-lock-overlay .ico{font-size:40px;line-height:1}
          .bps-lock-overlay .msg{font-size:21px;font-weight:800;letter-spacing:.01em;color:#1a1a1a}
          .bps-lock-overlay .sub{font-size:13px;color:#555;margin-top:-4px}
          .bps-lock-overlay .bps-lock-btns{margin-top:8px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
          .bps-lock-overlay .bps-lock-btn{display:inline-block;padding:12px 26px;background:var(--bp,#2A7A94);color:#fff;border-radius:0;font-weight:700;font-size:14px;text-decoration:none;border:2px solid var(--bp,#2A7A94)}
          .bps-lock-overlay .bps-lock-btn.ghost{background:#fff;color:var(--bp,#2A7A94)}
          .bps-lock-overlay .bps-lock-btn:hover{background:var(--bp-d,#1F5D71);border-color:var(--bp-d,#1F5D71);color:#fff}
          .bps-lock-overlay .bps-lock-btn.ghost:hover{color:#fff}
          .bps-ph{list-style:none}
          .bps-ph-img{width:100%;aspect-ratio:3/4;background:#ededf3 center/cover no-repeat;border-radius:10px}
          .bps-ph-l{height:13px;margin-top:10px;background:#e4e4eb;border-radius:6px}
          .bps-ph-l.s{width:55%}
          /* 가격 표기(item 9): 판매가(불그스름)+원가(검정 삭선) */
          .bps-price{display:flex;align-items:baseline;gap:8px;margin-top:6px;flex-wrap:wrap}
          .bps-price .bps-sale{font-size:15px;font-weight:800;color:var(--bp,#2A7A94);letter-spacing:-.01em}
          .bps-price .bps-orig{font-size:13px;font-weight:600;color:#1a1a1a;text-decoration:line-through;text-decoration-color:#1a1a1a}
          /* myshop 주문상태 컬러 배지(item 7b — sample/myshop-orders-improved 참조) */
          .myshopArea .txtStatus{display:inline-block;padding:4px 12px;border-radius:999px;font-size:12.5px;font-weight:700;line-height:1.4;background:#eef0f3;color:#555}
          .myshopArea .txtStatus.bps-st-paid{color:#1976d2;background:rgba(25,118,210,.12)}
          .myshopArea .txtStatus.bps-st-ship{color:#ff3a8c;background:rgba(255,58,140,.12)}
          .myshopArea .txtStatus.bps-st-done{color:#1e7a3e;background:rgba(30,122,62,.12)}
          .myshopArea .txtStatus.bps-st-cancel{color:#888;background:rgba(136,136,136,.12)}
          /* 모바일 상품 그리드 2단 (PC grid4가 모바일서 4단으로 좁아 글자겹침) — @css 번들 캐시 우회 인라인 */
          @media (max-width:600px){
            html body .ec-base-product ul.prdList.grid4,html body ul.prdList.grid4,html body .ec-base-product .prdList,html body .fusion-pgrid,html body .main_product_list .prdList{display:grid !important;grid-template-columns:repeat(2,1fr) !important;gap:14px 10px !important}
            html body ul.prdList.grid4>li,html body .ec-base-product .prdList>li,html body .fusion-pgrid>li{width:100% !important;float:none !important}
            html body .prdList.grid4 .pcard .nm,html body .fusion-pgrid .pcard .nm{font-size:13px !important;line-height:1.35 !important}
            /* [item3 모바일] EXPERTS' PICK·NEW ARRIVAL 카드가 너무 작음 → 패딩 축소로 2×2 카드 키움 */
            html body .main_product_list .prdList.grid4{padding:12px 10px !important}
            html body .main_product_list,html body .main_product_list .fusion-mod-wrap{padding-left:6px !important;padding-right:6px !important;margin-left:0 !important;margin-right:0 !important}
            html body .main_product_list .main_title{padding-left:6px !important;padding-right:6px !important}
          }
          /* 마퀴/헤더 sticky 고정 — #wrap의 overflow:hidden이 스크롤포트가 돼 sticky를 깨뜨려, 마퀴가 스크롤 후 '가끔 사라지던' 문제.
             overflow:clip은 스크롤포트가 아니라 가로overflow는 막으면서 sticky는 정상 동작. 헤더는 마퀴(38/30px) 아래로 stack */
          html body #wrap{overflow:clip !important}
          html body .marquee{position:sticky !important;top:0;z-index:62}
          /* 큐레이션 라인: 비회원은 카드 이미지만 blur(소분류 글씨/번역은 그대로 노출) */
          html body .bps-cat-blur .cat .im{filter:blur(13.8px) grayscale(.1) !important}
          html body .bps-cat-blur .cat .im img{transform:scale(1.12)}
          html body #header.gnb, html body .gnb{top:38px !important}
          @media (max-width:560px){ html body #header.gnb, html body .gnb, html body .gnb.mo{top:30px !important} }
        
          /* ===== (어워드, 어워드) 랜딩 — 정본 docs/design/260901_future01/Main.dc.html (260914 지시 3) ===== */
          .awm{margin:38px 0 0;text-align:center}
          .awm-note{font-size:12px;letter-spacing:.12em;color:var(--sub,#6b6f73);margin:0 0 14px;text-transform:none}
          .awm-ey{font-size:12.5px;font-weight:800;letter-spacing:.16em;color:var(--bp,#2A7A94);margin:0 0 6px}
          .awm-h{font-size:30px;font-weight:800;letter-spacing:-.02em;margin:0 0 8px}
          .awm-h .awm-dot{color:var(--bp,#2A7A94)}
          .awm-lead{font-size:14.5px;color:var(--sub,#5a5d60);line-height:1.7;margin:0 0 12px}
          .awm-more{display:inline-block;font-size:13px;font-weight:700;color:var(--ink,#1a1a1a);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
          .awm-when{font-size:12.5px;color:var(--sub,#6b6f73);margin:16px 0 22px}
          .awm-grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;padding:0;margin:0}
          .awm-card{border:1px solid var(--line,#e6e6ea);background:var(--paper,#fff);padding:18px 16px 20px;text-align:left}
          .awm-head{display:flex;align-items:center;gap:8px;margin-bottom:12px}
          .awm-grade{font-size:11px;font-weight:800;letter-spacing:.08em;background:#caa53d;color:#fff;padding:3px 8px}
          .awm-cate{font-size:12.5px;font-weight:700;color:var(--sub,#5a5d60)}
          .awm-shot{display:block;margin:0 auto 12px}
          .awm-brand{font-size:12.5px;color:var(--sub,#6b6f73);margin:0 0 2px}
          .awm-name{font-size:15px;font-weight:700;line-height:1.4;margin:0 0 10px}
          .awm-score{margin:0 0 4px;display:flex;align-items:baseline;gap:3px}
          .awm-score b{font-size:24px;font-weight:800;letter-spacing:-.02em}
          .awm-score span{font-size:12.5px;color:var(--sub,#6b6f73)}
          .awm-meta{font-size:12px;color:var(--sub,#6b6f73);margin:0}
          .awm-empty{font-size:14px;color:var(--sub,#6b6f73);padding:28px 0}

          .awp{margin:46px 0 0;text-align:center}
          .awp-ey{font-size:12.5px;font-weight:800;letter-spacing:.16em;color:var(--bp,#2A7A94);margin:0 0 6px}
          .awp-h{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:0 0 8px}
          .awp-lead{font-size:14px;color:var(--sub,#5a5d60);line-height:1.7;margin:0 0 12px}
          .awp-more{display:inline-block;font-size:13px;font-weight:700;color:var(--ink,#1a1a1a);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
          .awp-grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;padding:0;margin:22px 0 0;text-align:left}
          .awp-ax{border:1px solid var(--line,#e6e6ea);padding:16px 15px 18px;background:var(--paper,#fff)}
          .awp-ax-ko{font-size:14.5px;font-weight:800;margin:0 0 2px}
          .awp-ax-en{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--bp,#2A7A94);margin:0 0 8px}
          .awp-ax-q{font-size:13px;color:var(--sub,#5a5d60);margin:0 0 10px;line-height:1.55}
          .awp-ax-pt{margin:0 0 8px;display:flex;align-items:baseline;gap:3px}
          .awp-ax-pt b{font-size:20px;font-weight:800}
          .awp-ax-pt span{font-size:12px;color:var(--sub,#6b6f73)}
          .awp-ax-rule{font-size:12px;color:var(--sub,#6b6f73);margin:0;line-height:1.6}
          .awp-foot{font-size:12.5px;color:var(--sub,#6b6f73);margin:20px 0 0;line-height:1.7}