/* 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}
.sc-search__i{flex-grow:1;height:48px;padding:0 16px;background:transparent;color:#FFF;
  border:1px solid rgba(255,255,255,.28);font-size:15px;font-family:"Pretendard",sans-serif}
.sc-search__i::placeholder{color:rgba(255,255,255,.45)}
.sc-search__b{display:inline-flex;align-items:center;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}


@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}

/* BASIC css end */