@charset "UTF-8";
/* ============================================================
   파일쿠키 — 11월 시즌 상단 레이어 (2026 11월 한정)
   기존 상단 CSS 뒤에 추가 로드. 로고 자체 스타일은 november_logo_2026.css(전달물 원본, 무수정).
   전부 .fkr-november 스코프 — 기존 규칙을 덮어쓰지 않음.
   시즌 종료 시 이 파일 링크와 클래스만 빠지면 원상복구.

   출처 = 11월 테마 전달물 2026-11-02 (preview/november_theme_demo.html 의 site-header 규칙)
     PC     : 상단 58px 유지 · 로고 163px · 배경 1440×58 SVG 를 아래 가운데 맞춤(xMidYMax meet)
     모바일 : ⚠ 시안(두 줄 112px · 로고 208px)과 다르게 **한 줄 · 기존 높이 유지** — bob.bae 2026-11-02
              "줄 바뀌어서 헤더 늘어나는 거 별로". 로고는 기존 로고 폭(90px, m_logo 400×93 을 21px 높이로)에 맞춘다
              배경 390×52 SVG 를 상단바 전체에 깐다(xMidYMax slice)
   색 = 시연의 .theme 토큰 (--sky-* · --search* · --text)
   PC 좌우 여백 씬은 없다 — 전달물의 scene_*.svg 는 "별도 큰 배너 위치가 정해진 경우에만" 이라 미사용.
   ============================================================ */

/* ── PC 상단 띠 ─────────────────────────────────────────── */
#fkrTopUnify.fkr-november .fkr-utilbar{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#d8e4df 0%,#eef0df 65%,#f9eacb 100%);
}
#fkrTopUnify.fkr-november .fkr-utilbar-in{ position:relative; z-index:2; }
#fkrTopUnify.fkr-november .fkr-nov-band{
  position:absolute; left:0; top:0; width:100%; height:100%; z-index:0;
  display:block; pointer-events:none; object-fit:contain; object-position:50% 100%;
}
/* [시안 밖 보정] 1440 미만에선 축소하지 않고 원래 크기(1440)로 가운데 맞춰 양끝을 자른다.
   시안(meet)대로 줄이면 기와집·수레가 화면 끝에 붙은 채 작아질 뿐이라, 본문 1132px 밴드와
   겹친다 — 1280(데스크톱 최다 폭)에서 수레가 '로그인' 글자 뒤를 덮었다(2026-11-02 로컬 실측).
   cover = 이 폭에선 배율 1(높이 58 기준)이라 확대 없이 좌우만 잘린다. */
@media (max-width:1439px){
  #fkrTopUnify.fkr-november .fkr-nov-band{ object-fit:cover; }
}

/* 검색 알약 · 유틸 글자 */
#fkrTopUnify.fkr-november .fkr-search{
  background:rgba(255,255,255,.93); border-color:#cbd6cb; box-shadow:0 1px 4px rgba(73,60,44,.03);
}
#fkrTopUnify.fkr-november .fkr-search input.ph{ color:#23313c; }
#fkrTopUnify.fkr-november .fkr-search input.ph::placeholder{ color:#596a60; opacity:1; }
#fkrTopUnify.fkr-november .fkr-util-txt,
#fkrTopUnify.fkr-november .fkr-util-my{ color:#23313c; }

/* 다크 (초겨울 밤 · 창문 불빛) */
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-utilbar{
  background:linear-gradient(180deg,#182b37 0%,#2b4248 65%,#53605b 100%);
}
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-search{
  background:rgba(35,54,56,.94); border-color:#5c7069; box-shadow:none;
}
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-search input.ph{ color:#edf0eb; }
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-search input.ph::placeholder{ color:#e2d8b6; }
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-util-txt,
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-util-my{ color:#edf0eb; }

/* 라이트/다크 배경 교체 */
#fkrTopUnify.fkr-november .fkr-nov-band-dk{ display:none; }
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-nov-band-lt{ display:none; }
html[data-dark=true] #fkrTopUnify.fkr-november .fkr-nov-band-dk{ display:block; }


/* ── PC 좌우 여백 풍경 (본문 1132px 바깥) ─────────────────── */
/* [시안 밖 사용 — bob.bae 2026-11-02] 전달물 scene_*.svg(1440×370)를 화면 폭에 맞춰 키워 깐다.
   화면이 넓을수록 그림도 커져 기와집·수레가 여백으로 나간다(2560 = 여백 714px 에 기와집 전체).
   1440 미만은 키우지 않고 1440 그대로 가운데 맞춤 → 양끝 소품 일부가 본문 카드 뒤로 들어간다
   (할로윈·추석판과 같은 "잘림은 사양").
   z-index:-1 + body:has 3줄은 할로윈판(topbar_halloween.css) 구조 그대로 — 0 이면 본문 카드를 가린다
   (2026-08-12 여름판 실사고). 아래 끝은 mask 로 페이지 바탕에 녹인다(가로 절단선 방지). */
.fkr-nov-side{
  position:absolute; left:0; right:0; z-index:-1; overflow:hidden; pointer-events:none; line-height:0;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 72%,transparent 100%);
          mask-image:linear-gradient(180deg,#000 0,#000 72%,transparent 100%);
}
.fkr-nov-side > img{ display:block; width:100%; height:auto; }
@media (max-width:1439px){
  .fkr-nov-side{ height:370px; }
  .fkr-nov-side > img{ position:absolute; top:0; left:50%; width:1440px; margin-left:-720px; }
}
.fkr-nov-side > .fkr-nov-side-dk{ display:none; }
html[data-dark=true] .fkr-nov-side > .fkr-nov-side-lt{ display:none; }
html[data-dark=true] .fkr-nov-side > .fkr-nov-side-dk{ display:block; }
body:has(.fkr-nov-side){ background:#f0f0f0; }
html[data-dark=true] body:has(.fkr-nov-side){ background:#1a1b1c; }
body:has(.fkr-nov-side) > .fkr-body{ background:transparent; }
/* 하한 1150 = 할로윈판 주석 그대로(본문 고정 1132 + 스크롤바 — 더 내리면 가로 스크롤을 못 따라간다) */
@media (max-width:1150px){ .fkr-nov-side{ display:none; } }


/* ── 모바일 상단 (한 줄 · 기존 높이) ──────────────────────── */
/* 호스트 2곳 — #fkrTopUniM (실서비스 mobile/header.jsp 주입분) · .fkrm-top (리뉴얼 m 페이지 —
   쿠키오븐 모바일 등). 같은 조각을 쓰므로 셀렉터도 쌍으로 유지 (이전 시즌들과 같은 처리).
   배치(가로 한 줄 flex)·높이는 기존 그대로 두고 로고 크기·배경·색만 바꾼다.
   .fkrm-top 은 평시 sticky 인데 시즌 동안은 relative 다(가을·할로윈 등 이전 시즌과 동일). */
#fkrTopUniM.fkr-november, .fkrm-top.fkr-november{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,#d8e4df 0%,#eef0df 65%,#f9eacb 100%);
}
#fkrTopUniM.fkr-november > .fkr-nov-band, .fkrm-top.fkr-november > .fkr-nov-band{
  position:absolute; left:0; top:0; width:100%; height:100%; z-index:0;
  display:block; pointer-events:none; object-fit:cover; object-position:50% 100%;
}
#fkrTopUniM.fkr-november > *:not(.fkr-nov-band), .fkrm-top.fkr-november > *:not(.fkr-nov-band){ position:relative; z-index:1; }

/* 로고 — 기존 로고 폭 90px (높이 30 = 검색 알약보다 낮아 상단 높이 무변경).
   전달물 CSS 의 .fk-nov-logo--mobile{width:208px} 를 여기서만 덮는다(그 파일은 무수정) */
#fkrTopUniM.fkr-november .fkr-uni-logo, .fkrm-top.fkr-november .fkr-logo-m{ display:block; line-height:0; flex-shrink:0; }
#fkrTopUniM.fkr-november .fk-nov-logo, .fkrm-top.fkr-november .fk-nov-logo{ width:90px; }

#fkrTopUniM.fkr-november a.fkrm-uni-menu, #fkrTopUniM.fkr-november a.fkrm-uni-menu:link, #fkrTopUniM.fkr-november a.fkrm-uni-menu:visited,
.fkrm-top.fkr-november a.fkrm-menu, .fkrm-top.fkr-november a.fkrm-menu:link, .fkrm-top.fkr-november a.fkrm-menu:visited{ color:#596a60; }

/* 검색 알약 */
#fkrTopUniM.fkr-november .fkrm-uni-search, .fkrm-top.fkr-november .fkrm-search{
  background:rgba(255,255,255,.93); border-color:#cbd6cb;
}
#fkrTopUniM.fkr-november .fkrm-uni-search input::placeholder,
.fkrm-top.fkr-november .fkrm-search input::placeholder{ color:#596a60; opacity:1; font-size:10.5px; letter-spacing:-.04em; }
/* 좁은 폭 — 이전 시즌과 같은 처리(375px 에서 12.5px 문구가 "…따뜻한 이" 로 잘렸다) */
@media (max-width:389px){
  #fkrTopUniM.fkr-november .fkrm-uni-search input::placeholder,
  .fkrm-top.fkr-november .fkrm-search input::placeholder{ font-size:9.5px; letter-spacing:-.06em; }
}

/* 다크 */
html[data-dark=true] #fkrTopUniM.fkr-november, html[data-dark=true] .fkrm-top.fkr-november{
  background:linear-gradient(180deg,#182b37 0%,#2b4248 65%,#53605b 100%);
}
html[data-dark=true] #fkrTopUniM.fkr-november .fkrm-uni-search, html[data-dark=true] .fkrm-top.fkr-november .fkrm-search{
  background:rgba(35,54,56,.94); border-color:#5c7069;
}
html[data-dark=true] #fkrTopUniM.fkr-november .fkrm-uni-search input, html[data-dark=true] .fkrm-top.fkr-november .fkrm-search input{ color:#edf0eb; }
html[data-dark=true] #fkrTopUniM.fkr-november .fkrm-uni-search input::placeholder,
html[data-dark=true] .fkrm-top.fkr-november .fkrm-search input::placeholder{ color:#e2d8b6; }
html[data-dark=true] #fkrTopUniM.fkr-november a.fkrm-uni-menu, html[data-dark=true] #fkrTopUniM.fkr-november a.fkrm-uni-menu:link, html[data-dark=true] #fkrTopUniM.fkr-november a.fkrm-uni-menu:visited,
html[data-dark=true] .fkrm-top.fkr-november a.fkrm-menu, html[data-dark=true] .fkrm-top.fkr-november a.fkrm-menu:link, html[data-dark=true] .fkrm-top.fkr-november a.fkrm-menu:visited{ color:#e2d8b6; }
#fkrTopUniM.fkr-november .fkr-nov-band-dk, .fkrm-top.fkr-november .fkr-nov-band-dk{ display:none; }
html[data-dark=true] #fkrTopUniM.fkr-november .fkr-nov-band-lt, html[data-dark=true] .fkrm-top.fkr-november .fkr-nov-band-lt{ display:none; }
html[data-dark=true] #fkrTopUniM.fkr-november .fkr-nov-band-dk, html[data-dark=true] .fkrm-top.fkr-november .fkr-nov-band-dk{ display:block; }