@charset "UTF-8";
/* ─────────────────────────────────────────────────────────
 * 원본: feelpack/src/assets/css/tobe/fw.header.css
 * 용도: 모바일 GNB CSS FOUC 방지 (NF-8353, 2026-04-30)
 * 동기화: feelpack 의 원본이 변경되면 본 파일도 같이 갱신해야 함
 * 추후: feelpack 빌드 설정에서 CSS 자동 추출 도입 시 본 파일 제거 예정
 * ───────────────────────────────────────────────────────── */
.commonGnbList_scroll{position: relative;}
.commonGnbList_scroll:after{content:"";display: block;position: absolute;top:0;right:0;width:20px;height:100%;background-image:linear-gradient(to left, #fff, rgba(255, 255, 255, 0));}
.commonGnbList__wrap {position:relative;overflow-y: hidden;overflow-x: scroll;width: 100%;height: 52px;background: #fff;-webkit-box-sizing: border-box;box-sizing: border-box;white-space: nowrap;}
.commonGnbList {width:auto;height: 52px;padding: 0 4vw;box-sizing: border-box;text-align: center;}
.commonGnbList li{display: inline-block;padding-left:4vw;font-size:16px;}
.commonGnbList li:last-child {padding-right: 4vw;}
.commonGnbList li:first-child{padding-left:8.5vw;}
.commonGnbList li .gnbLink {position: relative;display: inline-block;height: 52px;color: #222;font-size:15px;font-family: 'Pretendard Medium';line-height: 52px;text-decoration: none !important;}
.commonGnbList li .gnbLink img {height: 52px;}
.commonGnbList li .newIcon {position: absolute;top: 12px;right: -6px;width:4px;height:4px;padding:0;border:none;border-radius: 100%;background:#ec5026;font-size:0;line-height: 0;}
.commonGnbList li.live .gnbLink{color:#ED4E2B;font-family:'Pretendard Bold';}
.commonGnbList li .liveIcon {position: absolute;top: 12px;right: -16px;width:16px;height:10px;padding:0;border:none;background: url('//icon.feelway.com/recent/mo/common/icon/icon_gnbLive.png') no-repeat 0 0;font-size:0;line-height: 0;background-size:32px;animation:blink-effect 1s step-end infinite;}
@keyframes blink-effect{50%{background-position-x:100%;}}
.commonGnbList li.current .gnbLink {font-family:'Pretendard Bold';color: #139eac;}
.commonGnbList li.current .gnbLink::after {content: " ";display: block;position: absolute;bottom: 0;left: 0;-webkit-transform: translate(0, 0);transform: translate(0, 0);width: 100%;height: 3px;background: #139eac;}
.commonGnbList li.bold .gnbLink {color: #ffc065;}
.commonGnbList__wrap::-webkit-scrollbar{display: none;}
.commonGnbList_scroll .headerBackBtn {display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;bottom: 0;z-index:2;padding:0 0 0 3px;border:0;background-color:#fff;}
.commonGnbList_scroll .headerBackBtn:before {content:"";display:flex;width: 40px;height: 43px;background-image: url('//icon.feelway.com/recent/mo/common/bg_headerPrev.png');background-repeat:no-repeat;background-size: 100% auto;}
@media screen and (max-width:360px) {
    .commonGnbList li .gnbLink {font-size: 15px;}
}

/* ─── NEW 공통 헤더 스타일 (assets/m/css/tobe/common.css 에서 이전, NF-8353) ─── */
body:has(.commonPrevHeader .subMenu .commonPrevHeader) {padding:0 5px;}
.commonPrevHeader__title {border-bottom: none !important;}
.common-gnb-position {border-bottom: 1px solid #e2e2e2;}

/* bundle 로드 전 placeholder height (layout shift 방지) */
.header__function {height: 50px;}
.common-mainheader-box {height: 50px;}

/* 공통헤더 헤드룸 — 스크롤 업 시 노출(.fw-hr-pinned 는 fw-header.js 가 토글).
   대상: 헤더 sticky 페이지 = GNB + 타이틀(commonPrevHeader). museum 등 자체헤더 제외.
   wrap 말고 box 를 움직임(wrap transform 시 자식 .common-gnb-position(fixed)가 사라짐).
   숨김은 transform(GPU) 으로, transition 은 노출(pinned)에만 → 진입은 snap(빼꼼/툭 둘 다 없음), 노출만 슬라이드 */
.common-header-gap.zone-fixed:not(.museum-no-gnb-fixed) .common-mainheader-box {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 501;
  background: #169dab;
  transform: translateY(-100%);
}
html.fw-hr-pinned .common-header-gap.zone-fixed:not(.museum-no-gnb-fixed) .common-mainheader-box {
  transform: translateY(0);
  transition: transform .25s ease-out;
}
html.fw-hr-pinned .common-header-gap.zone-fixed:not(.museum-no-gnb-fixed) .common-gnb-position {
  transform: translateY(50px);
  transition: transform .25s ease-out;
}