/* BASIC css start */
/* 세인트크로익스 · 62096 · 기본 상단 전용 CSS · 2026-08-29
   토큰과 공용 부품은 「공통 css-js」 화면의 sc-parts.css 에 있습니다. */

.sc-headban{background:var(--sc-deep);color:#FFF;font-size:12.5px;text-align:center;padding:9px 16px}
.sc-header__left{display:flex;align-items:center;gap:12px}
.sc-header__logo{display:block;line-height:0}
.sc-header__logo img{height:26px;width:auto;display:block}
.sc-burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;
  background:none;border:0;padding:0;cursor:pointer;color:inherit;margin-left:-11px}

.sc-gnb-wrap{flex-grow:1;display:flex;justify-content:center}
/* 하위 분류가 없으면 서랍을 그리지 않는다 */
.sc-gnb__2:empty{display:none}
.sc-header__page{font-size:13px;font-weight:300;color:inherit;text-decoration:none;opacity:.78}
.sc-header__page:hover{opacity:1}

.sc-ico{display:inline-flex;width:32px;height:32px;align-items:center;justify-content:center;
  background:none;border:0;padding:0;cursor:pointer;color:inherit;position:relative;text-decoration:none}
.sc-ico svg{width:19px;height:19px}
.sc-ico--cart .sc-ico__n{position:absolute;right:-2px;top:1px;min-width:15px;height:15px;padding:0 4px;
  border-radius:9px;background:var(--sc-gold-br);color:var(--sc-deep);
  font-family:"IBM Plex Mono",monospace;font-size:10px;font-style:normal;
  display:grid;place-items:center;line-height:1}

/* 검색 서랍 */
.sc-search{position:absolute;left:0;right:0;top:100%;background:var(--sc-deep);
  border-top:1px solid rgba(255,255,255,.12)}
.sc-search[hidden]{display:none}
.sc-search__in{max-width:var(--sc-max);margin:0 auto;padding:18px var(--sc-pad);display:flex;gap:10px;box-sizing:border-box}
.sc-search__i{flex:1 1 0;min-width:0;height:48px;padding:0 16px;
  background:rgba(255,255,255,.10);color:#FFF;-webkit-text-fill-color:#FFF;caret-color:#C1A021;
  border:1px solid rgba(255,255,255,.45);font-size:16px;font-weight:500;font-family:"Pretendard",sans-serif}
.sc-search__i::placeholder{color:rgba(255,255,255,.55);-webkit-text-fill-color:rgba(255,255,255,.55)}
.sc-search__b{display:inline-flex;align-items:center;flex:0 0 auto;height:48px;padding:0 24px;
  background:var(--sc-gold-br);color:var(--sc-deep);font-size:15px;font-weight:500;text-decoration:none}

/* 서랍 안쪽 */
.sc-drawer__sec{padding:0 0 26px}
.sc-drawer__h{font-family:"Poppins",sans-serif;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(255,255,255,.5);margin:22px 0 12px}
.sc-drawer__serial{display:flex;align-items:center;justify-content:center;height:52px;margin-top:20px;
  border:1px solid rgba(201,174,23,.5);color:var(--sc-gold-br);font-size:14.5px;
  font-weight:500;text-decoration:none}

}


/* ── 260829 실측 뒤 보탬 ─────────────────────────────
   등록분류가 10개라 기본값으로는 메뉴가 두 줄로 접혔습니다.
   한 줄로 고정하고 사이 간격을 화면폭에 따라 줄입니다. */
.sc-gnb{flex-wrap:nowrap;gap:clamp(12px,1.3vw,24px)}
.sc-gnb__1{white-space:nowrap}
.sc-header__page{white-space:nowrap}
.sc-header__util{gap:14px}


/* ===== 상단 메뉴 · 세븐릴 · 블랭크를 로고로 (2026-09-15 · 본사 에셋 정본 + 흰 테두리판) =====
   ★ 로고 그림은 에셋 사이트 BRAND STORY 의 공식 브랜드마크입니다. 색은 손대지 않았습니다.
       세븐      /node/24921  PRIMARY LOGO    남색 #2E3342 + 빨강 #EE3932 (두 가지 색입니다)
       로드 긱스 /node/24920  HORIZONTAL LOGO 블루그린 #004247
   ★ 흰 알약(네모 바탕) 을 없애고, 로고 모양을 그대로 따라가는 흰 테두리를 둘렀습니다.
       흰 바탕을 투명하게 빼내고 바깥으로 한 겹 넓혀 흰색으로 채운 그림입니다.
       검정 머리에서도 또렷하고, 로고 자체는 규정대로 고치지 않았습니다.
   ★ 그림에 테두리가 이미 들어 있어 CSS 에서 따로 그리지 않습니다. 크기만 잡아 줍니다.
       테두리 두께가 있어 그림이 로고보다 큽니다. 아래 크기는 그것까지 셈한 값입니다.
   ★ 옛 mask 규칙이 살아 있으면 그림이 로고 모양으로 잘립니다. mask:none 을 함께 적습니다. */
:root{--sc-sv-logo:url("data:image/png;base64,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");
      --sc-rg-logo:url("data:image/png;base64,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")}

.sc-gnb__1[href*="xcode=010"], .sc-gnb__1[href*="xcode=015"],
.sc-drawer__1[href*="xcode=010"], .sc-drawer__1[href*="xcode=015"]{font-size:0}

.sc-gnb__1[href*="xcode=010"]::before, .sc-gnb__1[href*="xcode=015"]::before,
.sc-drawer__1[href*="xcode=010"]::before, .sc-drawer__1[href*="xcode=015"]::before{
  content:"";display:inline-block;vertical-align:middle;
  background-color:transparent;background-repeat:no-repeat;background-position:center;
  border-radius:0;-webkit-mask:none;mask:none}

/* PC 주메뉴 — 자리는 120x28 로 똑같이, 그림만 각자 비율대로 */
.sc-gnb__1[href*="xcode=010"]::before,
.sc-gnb__1[href*="xcode=015"]::before{width:120px;height:28px}
.sc-gnb__1[href*="xcode=010"]::before{background-image:var(--sc-sv-logo);background-size:95px 17px}
.sc-gnb__1[href*="xcode=015"]::before{background-image:var(--sc-rg-logo);background-size:88px 16px}

/* 모바일 서랍 — 줄 높이 60px 를 지키려고 line-height 를 30px 로 되돌립니다 */
.sc-drawer__1[href*="xcode=010"],
.sc-drawer__1[href*="xcode=015"]{line-height:30px}
.sc-drawer__1[href*="xcode=010"]::before,
.sc-drawer__1[href*="xcode=015"]::before{width:138px;height:30px}
.sc-drawer__1[href*="xcode=010"]::before{background-image:var(--sc-sv-logo);background-size:113px 20px}
.sc-drawer__1[href*="xcode=015"]::before{background-image:var(--sc-rg-logo);background-size:104px 19px}

@media (max-width:1100px){
  .sc-gnb__1[href*="xcode=010"]::before,
  .sc-gnb__1[href*="xcode=015"]::before{width:106px;height:25px}
  .sc-gnb__1[href*="xcode=010"]::before{background-size:85px 15px}
  .sc-gnb__1[href*="xcode=015"]::before{background-size:78px 14px}
}
/* ===== 상단 메뉴 로고 끝 ===== */





@media(max-width:820px){
  .sc-burger{display:inline-flex}
  .sc-gnb-wrap{display:none}
  .sc-header__page{display:none}
  .sc-header__logo{position:absolute;left:50%;transform:translateX(-50%)}
  .sc-header__logo img{height:20px}
  .sc-header__in{position:relative;justify-content:space-between}
  .sc-header__util{gap:6px}


/* ── 서랍 SNS 아이콘 (2026-09-10) ─────────────────── */
.sc-drawer__sns{display:flex;gap:10px;padding:4px 0 30px}
.sc-drawer__sns a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  border:1px solid rgba(255,255,255,.22);border-radius:50%;color:rgba(255,255,255,.72)}
.sc-drawer__sns a:hover{color:#0E0C0A;background:var(--sc-gold-br,#C1A021);border-color:var(--sc-gold-br,#C1A021)}
.sc-drawer__sns svg{width:20px;height:20px;display:block}

/* BASIC css end */