@charset "UTF-8";
/* UNHCR 겨울캠페인 — 공통 + PC (시안 1440×900 기준, 1rem = 10px) */

@font-face { font-family: 'SBAggro'; font-weight: 500; font-style: normal; font-display: swap; src: url(../fonts/sb-aggro/SBAggroM.woff) format('woff'); }
@font-face { font-family: 'SBAggro'; font-weight: 700; font-style: normal; font-display: swap; src: url(../fonts/sb-aggro/SBAggroB.woff) format('woff'); }
@property --fill { syntax: '<percentage>'; inherits: true; initial-value: 13%; }

html { font-size: 10px; }
@media (max-width: 1280px) { html { font-size: 0.78125vw; } }
html, body { margin: 0; padding: 0; }
html.uw-lock, html.uw-lock body { overflow: hidden; height: 100%; overscroll-behavior: none; }

.wrap_unhcr_winter {
  --ff-pt: 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --ff-ns: 'Noto Sans KR Variable', 'Noto Sans KR', 'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --ff-sb: 'SBAggro', 'Noto Sans KR Variable', 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --blue: #3f72b1; --navy: #0d2b58; --yellow: #ffcc00; --red: #ff4d4d;
  --cream: #f3edd8; --cream2: #ece4c6; --gold: #b6a26f;
  --k: 1.6;                  /* 체온계 배율 (MO 1 / PC 1.6) */
  --ease: cubic-bezier(.65, 0, .35, 1);
  position: relative; overflow-x: clip;
  font-family: var(--ff-ns); color: #fff; background: #0a0a0a;
  -webkit-font-smoothing: antialiased; word-break: keep-all;
}
.wrap_unhcr_winter *, .wrap_unhcr_winter *::before, .wrap_unhcr_winter *::after { box-sizing: border-box; }
.wrap_unhcr_winter p, .wrap_unhcr_winter h1, .wrap_unhcr_winter h2, .wrap_unhcr_winter ul { margin: 0; padding: 0; }
.wrap_unhcr_winter ul { list-style: none; }
.wrap_unhcr_winter a { color: inherit; text-decoration: none; }
.wrap_unhcr_winter button { font: inherit; color: inherit; border: 0; background: none; padding: 0; cursor: pointer; }
.wrap_unhcr_winter img { display: block; max-width: none; }
.wrap_unhcr_winter .ver_mo { display: none; }
.wrap_unhcr_winter em { font-style: normal; color: var(--yellow); }

/* ---------- 스토리(풀페이지) ---------- */
.wrap_unhcr_winter .story { position: relative; height: 100vh; height: 100dvh; overflow: hidden; isolation: isolate; background: #0a0a0a; }
.wrap_unhcr_winter .story_track { position: absolute; inset: 0; transition: transform 1s var(--ease); will-change: transform; }
.wrap_unhcr_winter .sec { position: absolute; left: 0; width: 100%; height: 100%; overflow: hidden; }
.wrap_unhcr_winter .sec[data-sec="1"] { top: 0; }
.wrap_unhcr_winter .sec[data-sec="2"] { top: 100%; }
.wrap_unhcr_winter .sec[data-sec="3"] { top: 200%; }
.wrap_unhcr_winter .sec[data-sec="4"] { top: 300%; }
.wrap_unhcr_winter .sec[data-sec="5"] { top: 400%; }
.wrap_unhcr_winter .scene_track { position: absolute; inset: 0; display: flex; transition: transform .9s var(--ease); will-change: transform; }
.wrap_unhcr_winter .scene { position: relative; flex: 0 0 100%; width: 100%; height: 100%; overflow: hidden; background: #0a0a0a; }
.wrap_unhcr_winter .sec04 > .scene { position: absolute; inset: 0; }
.wrap_unhcr_winter .scene_media, .wrap_unhcr_winter .scene_media video { position: absolute; inset: 0; width: 100%; height: 100%; }
.wrap_unhcr_winter .scene_media video { object-fit: cover; display: block; }

/* 음영 (시안 그라디언트) */
.wrap_unhcr_winter .shade { position: absolute; left: 0; right: 0; pointer-events: none; }
/* 섹션 이동 중에도 딤이 영상 위에 그대로 보이도록 층을 고정 (iOS 등에서 움직이는 동안 영상 층이 위로 올라오는 현상 방지) */
.wrap_unhcr_winter .scene_media { z-index: 0; }
.wrap_unhcr_winter .shade { z-index: 1; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; }
/* 고객 피드백: 영상 위 텍스트 시인성 — 하단에서 올라오는 딤드 */
.wrap_unhcr_winter .shade_scene { bottom: 0; height: 100%; background: linear-gradient(0deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.6) 30%, rgba(0,0,0,.3) 55%, rgba(0,0,0,0) 78%); }
.wrap_unhcr_winter .shade_candle { bottom: 0; height: 66.67%; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000 100%); }
.wrap_unhcr_winter .shade_hero_bottom { bottom: 0; height: 28.89%; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.5) 100%); }
.wrap_unhcr_winter .shade_hero_left { top: 0; bottom: 0; right: auto; width: 55.56%; background: linear-gradient(90deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,0) 100%); }

/* 상단 라벨 (SB Aggro 웹폰트) */
.wrap_unhcr_winter .sec_head { position: absolute; left: 0; right: 0; top: 0; height: 8.8rem; padding: 0 8rem; display: flex; align-items: center; background: linear-gradient(180deg, rgba(17,17,17,.6) 0%, rgba(17,17,17,0) 100%); z-index: 4; pointer-events: none; }
.wrap_unhcr_winter .label { font-family: var(--ff-sb); font-weight: 500; font-size: 2.4rem; line-height: 1.4; letter-spacing: -0.01em; text-shadow: 0 1px 6px rgba(0,0,0,.35); white-space: pre; }
.wrap_unhcr_winter .label b { font-weight: 700; }
.wrap_unhcr_winter .label_rewrite { display: flex; align-items: center; color: var(--yellow); }
.wrap_unhcr_winter .label_icon { width: 2.6rem; height: 2.6rem; margin: 0 .8rem 0 -.3rem; background: url(../img/common/global/icon_rewrite_label.svg) no-repeat center / contain; }

/* 히어로 */
.wrap_unhcr_winter .hero_photo, .wrap_unhcr_winter .hero_photo img { position: absolute; inset: 0; width: 100%; height: 100%; }
.wrap_unhcr_winter .hero_photo img { object-fit: cover; object-position: 50% 40%; }
.wrap_unhcr_winter .hero_photo::after { content: ''; position: absolute; inset: 0; box-shadow: inset 0 0 60px #000; }
.wrap_unhcr_winter .hero_copy { position: absolute; left: 8rem; bottom: 8rem; z-index: 3; display: flex; flex-direction: column; gap: 3rem; }
.wrap_unhcr_winter .hero_title { font-weight: 500; font-size: 8rem; line-height: 1.2; color: #fff; }
.wrap_unhcr_winter .hero_sub { display: flex; flex-direction: column; gap: .4rem; font-family: var(--ff-pt); font-size: 2.4rem; line-height: 1.4; }
.wrap_unhcr_winter .hero_sub_1 { color: #92afca; font-weight: 400; }
.wrap_unhcr_winter .hero_sub_2 { font-weight: 700; }

/* 자막 (시각 + 문장) */
.wrap_unhcr_winter .cap { position: absolute; left: 50%; top: 42.22%; width: 76rem; margin-left: -38rem; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 1.6rem; text-align: center; letter-spacing: -0.02em; }
.wrap_unhcr_winter .cap_time { font-weight: 900; font-size: 8rem; line-height: 1.1; -webkit-text-stroke: .5px #565656; paint-order: stroke fill; text-shadow: 0 1px 6px rgba(0,0,0,.35); font-variant-numeric: normal; letter-spacing: -0.0225em; /* 웹폰트 폭 보정(시안 -2% → -2.25%) */ }
.wrap_unhcr_winter .cap_txt { font-weight: 700; font-size: 3rem; line-height: 1.4; text-shadow: 0 1px 6px rgba(0,0,0,.35); white-space: nowrap; }
.wrap_unhcr_winter .cap_txt + .cap_txt { margin-top: -.4rem; }
.wrap_unhcr_winter .cap_sub { color: var(--yellow); }
.wrap_unhcr_winter .sec03 .cap_sub { font-size: 2rem; }
.wrap_unhcr_winter .cap_tonight { top: 30.67%; }
.wrap_unhcr_winter .cap_tonight .cap_time { font-size: 8rem; line-height: 1.4; }
/* 등장: 중앙 텍스트 페이드 인 */
/* 떠오른 뒤에도 자막을 같은 층에 두어(translate3d 유지 + will-change), 동작이 끝나는 순간 iOS가 글자를 다시 그리며 잠깐 비는 현상을 막음 */
.wrap_unhcr_winter .scene .cap > * { opacity: 0; -webkit-transform: translate3d(0,1rem,0); transform: translate3d(0,1rem,0); transition: opacity .8s ease, transform .8s ease; will-change: opacity, transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.wrap_unhcr_winter .scene.is-on .cap > * { opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
.wrap_unhcr_winter .scene.is-on .cap > *:nth-child(2) { transition-delay: .25s; }
.wrap_unhcr_winter .scene.is-on .cap > *:nth-child(3) { transition-delay: .5s; }

/* 다음(→) 버튼 · 되감기 버튼 */
.wrap_unhcr_winter .btn_next, .wrap_unhcr_winter .btn_rewind { position: relative; display: block; border-radius: 50%; background: rgba(255,255,255,.25); box-shadow: inset 0 0 0 2px #fff; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); transition: background-color .2s; }
.wrap_unhcr_winter .btn_next { position: absolute; left: 50%; top: 65.11%; width: 6rem; height: 6rem; margin-left: -3rem; z-index: 3; }
.wrap_unhcr_winter .btn_next i, .wrap_unhcr_winter .btn_rewind i { position: absolute; left: 50%; top: 50%; background: #fff; transition: background-color .2s; }
.wrap_unhcr_winter .btn_next i { animation: uwNudge 1.6s ease-in-out infinite; width: 3.6rem; height: 2.7rem; margin: -1.35rem 0 0 -1.8rem; -webkit-mask: url(../img/common/global/icon_scene_next.svg) no-repeat center / contain; mask: url(../img/common/global/icon_scene_next.svg) no-repeat center / contain; }
.wrap_unhcr_winter .rewind_wrap { position: absolute; left: 50%; top: 64.67%; width: 11.6rem; margin-left: -5.8rem; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.wrap_unhcr_winter .btn_rewind { width: 9rem; height: 9rem; }
.wrap_unhcr_winter .btn_rewind i { width: 4.3rem; height: 2.7rem; margin: -1.35rem 0 0 -1.95rem; /* 기하 중심 -2.15rem에서 오른쪽으로 시각 보정 */ -webkit-mask: url(../img/common/global/icon_rewind.svg) no-repeat center / contain; mask: url(../img/common/global/icon_rewind.svg) no-repeat center / contain; }
.wrap_unhcr_winter .btn_next:hover, .wrap_unhcr_winter .btn_next:active, .wrap_unhcr_winter .btn_next:focus-visible,
.wrap_unhcr_winter .btn_rewind:hover, .wrap_unhcr_winter .btn_rewind:active, .wrap_unhcr_winter .btn_rewind:focus-visible { background-color: #fff; outline: none; }
.wrap_unhcr_winter .btn_next:hover i, .wrap_unhcr_winter .btn_next:active i, .wrap_unhcr_winter .btn_next:focus-visible i,
.wrap_unhcr_winter .btn_rewind:hover i, .wrap_unhcr_winter .btn_rewind:active i, .wrap_unhcr_winter .btn_rewind:focus-visible i { background-color: #181818; }

/* 다음(→) 화살표 안쪽 무빙 */
@keyframes uwNudge { 0%, 100% { transform: translateX(-.2rem); } 50% { transform: translateX(.4rem); } }

/* 영상 상단 흰색 인디케이터 (고객 피드백 4: section_02 3칸 / section_03 4칸) */
.wrap_unhcr_winter .story_bar { position: absolute; left: 8rem; right: 8rem; top: 1.2rem; display: flex; gap: .8rem; }
.wrap_unhcr_winter .story_bar i { position: relative; flex: 1; height: 3px; border-radius: 2px; background: rgba(255,255,255,.35); overflow: hidden; }
.wrap_unhcr_winter .story_bar i::after { content: ''; position: absolute; inset: 0; background: #fff; transform: scaleX(var(--p, 0)); transform-origin: 0 50%; }

/* PC 히어로 우측 상단 가로 로고 (고객 피드백 5) */
.wrap_unhcr_winter .hero_logo { position: absolute; right: 8rem; top: 2.3rem; z-index: 3; width: auto; height: 4.2rem; filter: drop-shadow(0 1.18px 7.09px rgba(0,0,0,.35)); }

/* section_04 되감기 연출 */
.wrap_unhcr_winter .rewind_fx { position: absolute; inset: 0; z-index: 4; background: #000; opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s; }
.wrap_unhcr_winter .rewind_video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.wrap_unhcr_winter .rewind_fx::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.2) 60%, rgba(0,0,0,.1) 100%); }
.wrap_unhcr_winter .rewind_hud { position: absolute; left: 50%; top: 42.22%; z-index: 1; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 1.6rem; }
.wrap_unhcr_winter .rewind_mark { width: 4.3rem; height: 2.7rem; background: #fff; -webkit-mask: url(../img/common/global/icon_rewind.svg) no-repeat center / contain; mask: url(../img/common/global/icon_rewind.svg) no-repeat center / contain; animation: uwRewMark .5s steps(1, end) infinite; }
@keyframes uwRewMark { 50% { opacity: .25; } }
.wrap_unhcr_winter .rewind_time { font-weight: 900; font-size: 8rem; line-height: 1.1; letter-spacing: -0.0225em; color: #fff; -webkit-text-stroke: .5px #565656; paint-order: stroke fill; text-shadow: 0 1px 6px rgba(0,0,0,.35); }
.wrap_unhcr_winter .rewind_dim { position: absolute; inset: 0; z-index: 2; background: #000; opacity: 0; transition: opacity var(--rw-dur, 1.6s) cubic-bezier(.4, 0, .9, .6); }
.wrap_unhcr_winter .scene.is-rewinding .rewind_fx { opacity: 1; visibility: visible; transition-duration: .15s; }
.wrap_unhcr_winter .scene.is-dark .rewind_dim { opacity: 1; }
.wrap_unhcr_winter .scene.is-rewinding .cap, .wrap_unhcr_winter .scene.is-rewinding .rewind_wrap, .wrap_unhcr_winter .scene.is-rewinding > .scroll_down { opacity: 0; transition: opacity .25s; }

/* 스크롤 다운 (화살표 상하 무빙) */
.wrap_unhcr_winter .scroll_down { display: flex; align-items: center; gap: .2rem; font-weight: 500; font-size: 1.68rem; line-height: 1.4; letter-spacing: -0.02em; color: #fafafa; white-space: nowrap; }
.wrap_unhcr_winter .scene > .scroll_down { position: absolute; left: 50%; bottom: 4.8rem; transform: translateX(-50%); z-index: 3; }
.wrap_unhcr_winter .scroll_down i { width: 2.1rem; height: 2.1rem; background: url(../img/common/global/icon_scroll_down.svg) no-repeat center / contain; animation: uwBob 1.4s ease-in-out infinite; }
@keyframes uwBob { 0%, 100% { transform: translateY(-.3rem); } 50% { transform: translateY(.4rem); } }

/* ---------- 체온계 ---------- */
.wrap_unhcr_winter .thermo { position: absolute; right: 8rem; top: 39%; z-index: 5; display: flex; flex-direction: column; align-items: center; gap: .5rem; opacity: 0; visibility: hidden; transition: opacity .6s, visibility .6s; pointer-events: none; }
.wrap_unhcr_winter .thermo.is-on { opacity: 1; visibility: visible; }
.wrap_unhcr_winter .thermo_warn { position: absolute; bottom: calc(100% + .5rem); width: calc(5.2rem * var(--k)); padding: 1.2rem 0 1rem; border-radius: 1.6rem; background: rgba(0,0,0,.8); font-family: var(--ff-pt); font-weight: 700; font-size: 1.6rem; line-height: 1.2; color: var(--red); text-align: center; opacity: 0; transition: opacity .3s; }
.wrap_unhcr_winter .thermo_warn span { display: block; }
/* 박스는 그대로, 글자만 부드럽게 깜빡임 */
.wrap_unhcr_winter .thermo.is-danger .thermo_warn { opacity: 1; }
.wrap_unhcr_winter .thermo.is-danger .thermo_warn span { animation: uwBlink 1.6s ease-in-out infinite; }
@keyframes uwBlink { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }
.wrap_unhcr_winter .thermo_box { width: calc(5.2rem * var(--k)); height: calc(12.4rem * var(--k)); padding: calc(1rem * var(--k)) 0; border-radius: 1.6rem; background: rgba(0,0,0,.8); display: flex; flex-direction: column; align-items: center; gap: calc(.8rem * var(--k)); }
/* 오늘밤 섹션(PC·MO): 뒤 배경을 흐리고 밝게 끌어올려, 어두운 촛불 화면·밝은 불꽃 어느 쪽에서도 박스가 보이게 (흰 반투명 + 배경 보정 + 얇은 테두리) */
.wrap_unhcr_winter .thermo.is-light .thermo_box, .wrap_unhcr_winter .thermo.is-light .thermo_warn { background: rgba(255,255,255,.1); -webkit-backdrop-filter: blur(8px) brightness(1.9) saturate(.7); backdrop-filter: blur(8px) brightness(1.9) saturate(.7); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 2px 10px rgba(0,0,0,.25); }
.wrap_unhcr_winter .thermo_num { font-family: var(--ff-pt); font-weight: 700; font-size: calc(1.2rem * var(--k)); line-height: 1.2; white-space: nowrap; transition: color .3s; }
.wrap_unhcr_winter .thermo.is-danger .thermo_num { color: var(--red); }
/* 체온계: 튜브·수은·구를 모두 짝수 px로 반올림해 중심이 정수 픽셀에 오게 함 (소수점 어긋남 방지)
   튜브 SVG 22.4×128, 구 중심 = 아래에서 8.75% */
.wrap_unhcr_winter .thermo { --tw: calc(1.4rem * var(--k)); --th: calc(8rem * var(--k)); --mw: calc(.4rem * var(--k)); --bd: calc(1rem * var(--k)); --bx: calc(5.2rem * var(--k)); }
@supports (width: round(1.5px, 2px)) {
  .wrap_unhcr_winter .thermo { --tw: round(calc(1.4rem * var(--k)), 2px); --th: round(calc(8rem * var(--k)), 2px); --mw: round(calc(.4rem * var(--k)), 2px); --bd: round(calc(1rem * var(--k)), 2px); --bx: round(calc(5.2rem * var(--k)), 2px); }
}
.wrap_unhcr_winter .thermo_box, .wrap_unhcr_winter .thermo_warn { width: var(--bx); }
.wrap_unhcr_winter .thermo_tube { position: relative; flex: 0 0 auto; width: var(--tw); height: var(--th); background: url(../img/common/global/thermo_tube.svg) no-repeat 0 0 / 100% 100%; }
.wrap_unhcr_winter .thermo_mercury { position: absolute; left: calc(50% - var(--mw) / 2); bottom: calc(var(--th) * .0875); width: var(--mw); height: calc(var(--th) * var(--mh, .7625)); border-radius: 99px 99px 0 0; background: var(--mc, #ffcc00); transition: height .8s var(--ease), background-color .8s; }
.wrap_unhcr_winter .thermo_bulb { position: absolute; left: calc(50% - var(--bd) / 2); bottom: calc(var(--th) * .0875 - var(--bd) / 2); width: var(--bd); height: var(--bd); border-radius: 50%; background: var(--mc, #ffcc00); transition: background-color .8s; }
.wrap_unhcr_winter .thermo.is-shake .thermo_box { animation: uwShake .6s linear; }
/* 체온 변화 신호: 내려가면 붉게(위험), 올라가면 노랗게(회복) 물들었다 사라짐 */
.wrap_unhcr_winter .thermo_box { position: relative; isolation: isolate; }   /* 색 막이 박스 배경 위·글자 아래에 오도록 */
.wrap_unhcr_winter .thermo_box::after { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; opacity: 0; pointer-events: none; }
.wrap_unhcr_winter .thermo_box > * { position: relative; z-index: 1; }
.wrap_unhcr_winter .thermo.is-flash-down .thermo_box::after { background: rgba(255,77,77,.55); box-shadow: 0 0 2.4rem rgba(255,77,77,.7); animation: uwFlash 1.4s ease-out both; }
.wrap_unhcr_winter .thermo.is-flash-up .thermo_box::after { background: rgba(255,204,0,.5); box-shadow: 0 0 2.4rem rgba(255,204,0,.65); animation: uwFlash 1.4s ease-out both; }
@keyframes uwFlash { 0% { opacity: 0; } 18% { opacity: 1; } 45% { opacity: .85; } 100% { opacity: 0; } }
@keyframes uwShake { 0%, 100% { transform: translateX(0); } 15% { transform: translateX(-.4rem) rotate(-2deg); } 30% { transform: translateX(.4rem) rotate(2deg); } 45% { transform: translateX(-.3rem) rotate(-1deg); } 60% { transform: translateX(.3rem) rotate(1deg); } 75% { transform: translateX(-.15rem); } }

/* ---------- section_05 하단 박스 ---------- */
.wrap_unhcr_winter .kit { position: absolute; left: 50%; bottom: 8rem; width: 100rem; margin-left: -50rem; z-index: 3; display: flex; align-items: center; gap: 2.1rem; padding: 2rem 2rem 2rem 4rem; border-radius: 2.1rem; background: rgba(0,0,0,.45); box-shadow: inset 0 0 0 1.4px rgba(255,255,255,.15); -webkit-backdrop-filter: blur(8.4px); backdrop-filter: blur(8.4px); opacity: 0; transform: translateY(3rem); transition: opacity .8s ease .3s, transform .8s ease .3s; }
.wrap_unhcr_winter .scene.is-on .kit { opacity: 1; transform: none; }
.wrap_unhcr_winter .kit_desc { flex: 1; display: flex; align-items: center; gap: 3rem; letter-spacing: -0.02em; }
.wrap_unhcr_winter .kit_title { font-weight: 700; font-size: 4rem; line-height: 1.45; color: var(--yellow); white-space: nowrap; }
.wrap_unhcr_winter .kit_txt { font-weight: 400; font-size: 2.4rem; line-height: 1.4; white-space: nowrap; }
.wrap_unhcr_winter .kit_btn { flex: 0 0 38rem; height: 7.7rem; display: flex; align-items: center; gap: 1.68rem; padding: 1.68rem 1.68rem 1.68rem 3.36rem; border-radius: 1.12rem; background: var(--yellow); box-shadow: inset 0 0 0 2px rgba(255,255,255,.3); color: #181818; letter-spacing: -0.02em; transition: background-color .2s; }
.wrap_unhcr_winter .kit_btn_txt { flex: 1; text-align: center; font-weight: 400; font-size: 2.6rem; line-height: 1; white-space: nowrap; }
.wrap_unhcr_winter .kit_btn_txt b { font-weight: 700; }
.wrap_unhcr_winter .kit_chip { flex: 0 0 auto; padding: .84rem 1.4rem; border-radius: .84rem; background: #fff; font-weight: 900; font-size: 2.6rem; line-height: 1.4; white-space: nowrap; transition: background-color .2s; }
.wrap_unhcr_winter .kit_btn:hover, .wrap_unhcr_winter .kit_btn:active, .wrap_unhcr_winter .kit_btn:focus-visible { background-color: #fff; outline: none; }
.wrap_unhcr_winter .kit_btn:hover .kit_chip, .wrap_unhcr_winter .kit_btn:active .kit_chip, .wrap_unhcr_winter .kit_btn:focus-visible .kit_chip { background-color: var(--yellow); }

/* 눈보라 · 노이즈 */
/* 되감기 → section_05: 검은 화면을 유지한 채 바로 전환한 뒤 걷어냄 */
.wrap_unhcr_winter .story_black { position: absolute; inset: 0; z-index: 5; background: #000; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .7s ease, visibility .7s; }
.wrap_unhcr_winter .story_black.is-on { opacity: 1; visibility: visible; transition: none; }
.wrap_unhcr_winter .snow { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; opacity: 0; transition: opacity .8s; }
.wrap_unhcr_winter .snow.is-on { opacity: 1; }
/* 노이즈: 영상·사진 바로 위, 자막·버튼 아래 (시안 overlay .7 → 화면 체감에 맞춰 .4) */

/* ---------- 플로팅 CTA ---------- */
.wrap_unhcr_winter .cta_fixed { position: fixed; right: 8rem; bottom: 6rem; z-index: 50; width: 22rem; height: 12rem; padding: 1.8rem 3rem; display: flex; align-items: center; justify-content: flex-start; border-radius: 2.1rem; background: var(--blue); box-shadow: inset 0 0 0 2px rgba(255,255,255,.3); font-family: var(--ff-pt); font-weight: 700; font-size: 2.6rem; line-height: 1.3; letter-spacing: -0.02em; color: #fff; transition: background-color .2s, opacity .4s, visibility .4s, transform .4s; }
.wrap_unhcr_winter .cta_fixed_txt { white-space: nowrap; }
.wrap_unhcr_winter .cta_fixed_last { display: inline-flex; align-items: center; gap: .8rem; }
.wrap_unhcr_winter .cta_fixed i { display: block; flex: 0 0 auto; width: 3.1rem; height: 1.3rem; background: url(../img/common/global/icon_arrow_long.svg) no-repeat center / contain; }
.wrap_unhcr_winter .cta_fixed:hover, .wrap_unhcr_winter .cta_fixed:active, .wrap_unhcr_winter .cta_fixed:focus-visible { background-color: var(--navy); outline: none; }
.wrap_unhcr_winter .cta_fixed.is-off { opacity: 0; visibility: hidden; transform: translateY(2rem); }

/* ---------- section_06 정기후원 카드 ---------- */
.wrap_unhcr_winter .in { max-width: 128rem; margin: 0 auto; }
.wrap_unhcr_winter .sec06 { position: relative; height: 87.6rem; padding-top: 12rem; background: var(--cream); color: var(--navy); }
.wrap_unhcr_winter .sec_title { display: flex; flex-direction: column; align-items: center; gap: 1rem; text-align: center; }
.wrap_unhcr_winter .badge { display: inline-block; padding: .65rem 1.3rem; background: var(--navy); font-weight: 700; font-size: 2.6rem; line-height: 1.2; letter-spacing: -0.013em; /* 웹폰트 폭 보정 */ color: #fff7d9; white-space: nowrap; }
.wrap_unhcr_winter .headline { font-weight: 700; font-size: 5rem; line-height: 1.3; letter-spacing: -0.02em; color: var(--navy); white-space: nowrap; }
.wrap_unhcr_winter .cards { margin-top: 4rem; }
.wrap_unhcr_winter .cards_track { display: flex; justify-content: center; gap: 2.4rem; }
.wrap_unhcr_winter .card_item { flex: 0 0 38.4rem; }
.wrap_unhcr_winter .card { position: relative; display: flex; flex-direction: column; min-height: 43.5rem; border-radius: 1.536rem; overflow: hidden; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.3); transition: background-color .25s; }
.wrap_unhcr_winter .card_photo { position: absolute; left: 0; top: 0; width: 100%; height: 27.1rem; }
.wrap_unhcr_winter .card_photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
.wrap_unhcr_winter .card_label { position: relative; z-index: 1; display: block; padding: .768rem 0; background: linear-gradient(180deg, rgba(0,0,0,.7) 0%, rgba(0,0,0,0) 100%); font-weight: 700; font-size: 2.4rem; line-height: 1.5; text-align: center; color: #fff; transition: color .25s; }
.wrap_unhcr_winter .card_body { position: relative; z-index: 1; margin-top: auto; padding: .128rem 0 3.4rem; display: flex; flex-direction: column; align-items: center; gap: 1.28rem; background: #fff; transition: background-color .25s; }
.wrap_unhcr_winter .card_head { align-self: stretch; display: flex; align-items: center; justify-content: center; gap: 1.28rem; padding: 1.152rem 0; border-bottom: 1px solid #fef8e3; }
.wrap_unhcr_winter .card_badge { padding: .384rem 1.92rem; border-radius: 100px; background: var(--navy); font-weight: 700; font-size: 2.4rem; line-height: 1.4; letter-spacing: -0.02em; color: #fff; }
.wrap_unhcr_winter .card_amount { font-weight: 900; font-size: 4rem; line-height: 1.4; letter-spacing: -0.02em; white-space: nowrap; }
.wrap_unhcr_winter .card_txt { font-weight: 400; font-size: 2.4rem; line-height: 1.5; letter-spacing: -0.02em; text-align: center; white-space: nowrap; }
.wrap_unhcr_winter .card_txt b { font-weight: 900; }
.wrap_unhcr_winter .card:hover, .wrap_unhcr_winter .card:active, .wrap_unhcr_winter .card:focus-visible { background-color: var(--yellow); outline: none; }
.wrap_unhcr_winter .card:hover .card_body, .wrap_unhcr_winter .card:active .card_body, .wrap_unhcr_winter .card:focus-visible .card_body { background-color: var(--yellow); }
.wrap_unhcr_winter .card:hover .card_label, .wrap_unhcr_winter .card:active .card_label, .wrap_unhcr_winter .card:focus-visible .card_label { color: var(--yellow); }
.wrap_unhcr_winter .note { margin-top: 4rem; font-weight: 400; font-size: 1.5rem; line-height: 1.4; letter-spacing: -0.02em; text-align: center; color: var(--gold); }

/* ---------- section_07 마무리 ---------- */
.wrap_unhcr_winter .sec07 { position: relative; height: 72rem; background: var(--cream2); overflow: hidden; }
.wrap_unhcr_winter .closing_photo { position: absolute; left: 0; top: 0; width: 112.8rem; height: 72rem; }
.wrap_unhcr_winter .closing_photo img { width: 100%; height: 100%; object-fit: cover; }
.wrap_unhcr_winter .closing_copy { position: absolute; left: 50%; top: 15.4rem; margin-left: 16rem; width: 44rem; display: flex; flex-direction: column; gap: 4rem; }
.wrap_unhcr_winter .closing_copy .sec_title { align-items: flex-start; text-align: left; gap: 2rem; }
.wrap_unhcr_winter .closing_copy .badge { color: #fff; }
.wrap_unhcr_winter .closing_cta { position: relative; display: flex; flex-direction: column; gap: 1rem; padding: 2rem; border-radius: 2.1rem; background: rgba(255,255,255,.4); box-shadow: inset 0 0 0 3px #fff; --fill: 13%; }
.wrap_unhcr_winter .fill_tube { position: relative; display: block; width: 40.2rem; height: 10rem; }
/* 온도계 모양: 원 + 알약형을 CSS로 (SVG를 늘리면 MO에서 찌그러짐) */
.wrap_unhcr_winter .fill_shape { position: absolute; inset: 0; opacity: .9; }
.wrap_unhcr_winter .fill_shape::before { content: ''; position: absolute; left: 0; top: 0; width: 10rem; height: 10rem; border-radius: 50%; background: #fff; }
.wrap_unhcr_winter .fill_shape::after { content: ''; position: absolute; left: 5rem; right: 0; top: 1.1rem; bottom: 1.1rem; border-radius: 10rem; background: #fff; }
.wrap_unhcr_winter .fill_bar { position: absolute; left: 4.7rem; top: 1.8rem; width: 34.7rem; height: 6.4rem; border-radius: 10rem; background: linear-gradient(90deg, var(--yellow) 0%, var(--yellow) var(--fill), var(--navy) calc(var(--fill) + 7%), var(--navy) 100%); display: flex; align-items: center; justify-content: center; padding-left: 4rem; }
.wrap_unhcr_winter .fill_label { display: flex; align-items: center; gap: .7rem; font-weight: 800; font-size: 2.6rem; line-height: 1; letter-spacing: -0.02em; color: #fff; white-space: nowrap; transition: color .3s; }
.wrap_unhcr_winter .fill_label i { width: 2.7rem; height: 2.7rem; background: currentColor; -webkit-mask: url(../img/common/global/icon_arrow_right.svg) no-repeat center / contain; mask: url(../img/common/global/icon_arrow_right.svg) no-repeat center / contain; }
.wrap_unhcr_winter .fill_bulb { position: absolute; left: 1rem; top: .9rem; width: 8.2rem; height: 8.2rem; border-radius: 50%; background: var(--yellow); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 2.4rem; letter-spacing: -0.02em; color: var(--navy); }
.wrap_unhcr_winter .fill_meta { display: flex; justify-content: space-between; padding: 0 .5rem; font-weight: 800; font-size: 1.6rem; line-height: 1.4; letter-spacing: -0.02em; color: var(--navy); }
/* 버튼 온도계: 살짝 올랐다 내렸다 */
.wrap_unhcr_winter .closing_cta:not(.is-js) { animation: uwFillBob 2.4s ease-in-out infinite; }
@keyframes uwFillBob { 0%, 100% { --fill: 11%; } 50% { --fill: 19%; } }
/* PC 호버·MO 터치: JS가 --fill을 서서히 올림. 수은이 글자 뒤까지 차면 글자색 전환 */
.wrap_unhcr_winter .closing_cta.is-full .fill_label { color: var(--navy); }
.wrap_unhcr_winter .closing_cta:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }

/* 등장: 타이틀 페이드 업 */
.wrap_unhcr_winter .js-fade { opacity: 0; transform: translateY(4rem); transition: opacity .9s ease, transform .9s ease; }
.wrap_unhcr_winter .js-fade.is-in { opacity: 1; transform: none; }

/* ---------- 푸터 ---------- */
.wrap_unhcr_winter .uw_foot { background: #202020; padding: 5.6rem 0 6.4rem; }
.wrap_unhcr_winter .uw_foot .in { max-width: 120rem; display: flex; align-items: flex-start; gap: 4.8rem; }
.wrap_unhcr_winter .uw_foot_logo { width: 6.3rem; height: 7.9rem; }
.wrap_unhcr_winter .uw_foot_info { font-family: var(--ff-pt); font-size: 1.2rem; line-height: 1.4; letter-spacing: -0.02em; }
.wrap_unhcr_winter .uw_foot_name { font-weight: 700; font-size: 1.4rem; }
.wrap_unhcr_winter .uw_foot_list { margin-top: 1.2rem; display: flex; flex-wrap: wrap; gap: .6rem; font-weight: 300; }
.wrap_unhcr_winter .uw_foot_copy { margin-top: 1.2rem; font-weight: 400; color: #595959; }
/* 휴대폰 브라우저가 전화번호·이메일을 자동으로 링크로 만들 때 밑줄·파란색 없이 본문과 같게 */
.wrap_unhcr_winter .uw_foot a, .wrap_unhcr_winter .uw_foot a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font: inherit !important; }

/* 마감 체온계 버튼 클릭 반응 (PC 마우스 환경만): 눌림 → 튕겨 복귀 + 전구에서 노란 빛 퍼짐 */
@media (hover: hover) and (pointer: fine) {
  .wrap_unhcr_winter .closing_cta.is-press .fill_tube { animation: uwPress .5s cubic-bezier(.3,1.5,.5,1); }
  .wrap_unhcr_winter .closing_cta.is-press .fill_bulb { animation: uwBulbPop .5s cubic-bezier(.3,1.6,.5,1); }
  .wrap_unhcr_winter .fill_bulb::after { content: ''; position: absolute; inset: 0; border-radius: 50%; pointer-events: none; opacity: 0; }
  .wrap_unhcr_winter .closing_cta.is-press .fill_bulb::after { animation: uwBulbRing .7s ease-out; }
  .wrap_unhcr_winter .closing_cta::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; }
  .wrap_unhcr_winter .closing_cta.is-press::after { animation: uwCtaRing .7s ease-out; }
}
/* PC 공통 버튼 클릭 반응: 눌림 → 튕겨 복귀 + 테두리 바깥으로 빛 링 (outline이라 카드의 overflow에도 안 잘림) */
@media (hover: hover) and (pointer: fine) {
  .wrap_unhcr_winter .btn_next.is-press { animation: uwTapS .5s cubic-bezier(.3,1.5,.5,1), uwRingW .6s ease-out; }
  .wrap_unhcr_winter .btn_rewind.is-press { animation: uwTapM .5s cubic-bezier(.3,1.5,.5,1), uwRingW .6s ease-out; }
  .wrap_unhcr_winter .kit_btn.is-press { animation: uwTapL .5s cubic-bezier(.3,1.5,.5,1), uwRingY .6s ease-out; }
  .wrap_unhcr_winter .card.is-press { animation: uwTapXL .5s cubic-bezier(.3,1.5,.5,1), uwRingY .6s ease-out; }
  .wrap_unhcr_winter .cta_fixed.is-press { animation: uwTapL .5s cubic-bezier(.3,1.5,.5,1), uwRingW .6s ease-out; }
}
@keyframes uwTapS { 25% { transform: scale(.86); } 100% { transform: scale(1); } }
@keyframes uwTapM { 25% { transform: scale(.9); } 100% { transform: scale(1); } }
@keyframes uwTapL { 25% { transform: scale(.95); } 100% { transform: scale(1); } }
@keyframes uwTapXL { 25% { transform: scale(.975); } 100% { transform: scale(1); } }
@keyframes uwRingW { 0% { outline: 2px solid rgba(255,255,255,.8); outline-offset: 0; } 100% { outline: 2px solid rgba(255,255,255,0); outline-offset: 1.4rem; } }
@keyframes uwRingY { 0% { outline: 2px solid rgba(255,204,0,.9); outline-offset: 0; } 100% { outline: 2px solid rgba(255,204,0,0); outline-offset: 1.4rem; } }
@keyframes uwPress { 0% { transform: scale(1); } 25% { transform: scale(.95); } 100% { transform: scale(1); } }
@keyframes uwBulbPop { 0% { transform: scale(1); } 30% { transform: scale(.9); } 65% { transform: scale(1.12); } 100% { transform: scale(1); } }
@keyframes uwCtaRing { 0% { opacity: 1; box-shadow: 0 0 0 0 rgba(255,204,0,.6); } 100% { opacity: 1; box-shadow: 0 0 0 1.8rem rgba(255,204,0,0); } }
@keyframes uwBulbRing { 0% { opacity: 1; box-shadow: 0 0 0 0 rgba(255,204,0,.75); } 100% { opacity: 1; box-shadow: 0 0 0 3.2rem rgba(255,204,0,0); } }

@media (prefers-reduced-motion: reduce) {
  .wrap_unhcr_winter *, .wrap_unhcr_winter *::before, .wrap_unhcr_winter *::after { animation: none !important; transition-duration: .01ms !important; }
}

/* 체온계 위치도 정수 px로 (어떤 화면 폭에서도 튜브 SVG와 수은이 같은 픽셀 격자에 놓이게) */
@supports (width: round(1.5px, 1px)) {
  .wrap_unhcr_winter .thermo { right: round(8rem, 1px); top: round(39%, 1px); }
}

/* section_05 박스: 시안 그대로 (PC 버튼 SPACE_BETWEEN, 문구 칸 180 고정) */
.wrap_unhcr_winter .kit_btn { justify-content: space-between; }
.wrap_unhcr_winter .kit_btn_txt { flex: 0 0 18rem; }

/* 원형 다음 화살표: PC는 화면이 커서 50px(시안 60px의 약 83%), MO는 36px(60%) — mo.css */
.wrap_unhcr_winter .btn_next { width: 5rem; height: 5rem; margin-left: -2.5rem; box-shadow: inset 0 0 0 2px #fff; }
.wrap_unhcr_winter .btn_next i { width: 3rem; height: 2.25rem; margin: -1.125rem 0 0 -1.5rem; }