@charset "UTF-8";

/* AEM reset */
body .bat-wrapper { max-width: unset; }
.aem-Grid-Container--xxl { max-width: unset; margin: 0; }

/* ==========================================================================
   글로 하이퍼프로+ 공식 출시(launching) 페이지
   - 단위 체계(기존 페이지 동일):
     PC  --launching-unit    : 1920 기준 1px = min(0.0520833vw, 1px)
     MO  --launching-unit-mo : 피그마 375 기준 x2 -> 750 단위 1unit = 0.133333vw
   - 섹션별 스타일은 시안 확정 후 순차 추가.
   ========================================================================== */
.launching__wrap {
  --launching-unit: min(0.0520833vw, 1px);
  position: relative;
  width: 100%;
  font-family: var(--font-en, "Mont"), var(--font-kr, "Onemobile"), sans-serif;
}
.launching__wrap, .launching__wrap * { box-sizing: border-box; }
.launching__wrap img { max-width: 100%; display: block; }
.launching__wrap p { margin: 0; }

/* ==========================================================================
   main — 피그마 275:4938(PC 1920x1008) / 275:4790(MO 375x600, x2 -> 750x1200)
   배경: 영상(main_pc/mo.mp4) + poster = 영상 첫 프레임(main_poster_pc/mo.jpg).
   섹션 배경은 첫 프레임 평균색 단색 — 포스터 로드 전 찰나를 덮는 용도다.
   ※ 피그마 원본 배경은 PC 2160x1008(좌측 정렬), MO 1285x600(x:-364) 이라
     스테이지 밖까지 걸쳐 있다. export 는 화면에 보이는 영역만 크롭해서 받는다.
   로고/락업/타이틀은 벡터 -> PNG(@2x) export 필요.
   ========================================================================== */
/* 스테이지 박스. 바깥 <section> 이 아니라 이 div 가 비율·overflow·스케일을 갖는다.
   AEM 이 블록의 바깥 태그를 삼켜도 이 div 만 남으면 레이아웃이 그대로 선다. */
.launching__section--main {
  --main-stage-scale: calc(100vw / 1920 / 1px);
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 1008;
  overflow: hidden;
  /* 영상 첫 프레임 평균색(#60A06C). 포스터가 뜨기 전 아주 짧은 순간을 덮는다.
     예전처럼 완성 KV 이미지를 깔면 영상이 시작될 때 그림이 확 바뀌어 오작동처럼 보인다. */
  background: #60a06c;
}

/* 배경 영상 — 섹션을 꽉 채우고 비율은 유지(cover).
   스테이지(z:1)보다 아래에 깔린다. */
.main__bg-video {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  object-fit: cover;
  z-index: 0;
  /* video 자체 배경색도 같은 색 — 디코딩 직전 빈 프레임이 떠도 색이 안 바뀐다. */
  background-color: #60a06c;
}

.main__stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1008px;
  transform: translate(-50%, -50%) scale(var(--main-stage-scale));
  z-index: 1;
}

/* 글로 로고 195x137.115, X:243.5 Y:49.3 */
.main__logo {
  position: absolute;
  left: 243.5px;
  top: 49.3px;
  width: 195px;
  max-width: none;
}
/* 카피 블록(Frame 10) : X:240 Y:334.46, 세로 flex gap 15
   eyebrow(24px, h26) -> 락업(508.75x68) -> 타이틀(509x88.933) */
.main__eyebrow {
  position: absolute;
  left: 240px;
  /*top: 334.46px;*/
  top: 300px;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.083; /* h26 고정 */
  letter-spacing: -0.02em;
  color: #ffffff;
  white-space: nowrap;
}
/* NEW HYPERpro+ 락업 508.75x68, X:240 Y:375.46 (334.46 + 26 + gap15) */
.main__lockup {
  position: absolute;
  left: 240px;
  top: 375.46px;
  width: 508.75px;
  max-width: none;
}
/* "+로 더 쉽게" 그래픽 509x88.933, X:240 Y:458.46 (375.46 + 68 + gap15) */
.main__title-img {
  position: absolute;
  left: 240px;
  top: 458.46px;
  width: 509px;
  max-width: none;
}
/* "2026. 08. 18 공식 출시" 32.548px, 중심 Y:604.52 */
.main__date {
  position: absolute;
  left: 240px;
  top: 604.52px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 32.548px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #ffffff;
  white-space: nowrap;
}
.main__date-num {
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 600;
}
/* CTA 262x54.461, X:240 Y:674, r:51.517 */
.main__btn {
  position: absolute;
  left: 240px;
  top: 674px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 262px;
  height: 54.461px;
  border-radius: 51.517px;
  background: #fe5000;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
  color: #ffffff;
  text-decoration: none;
  white-space: nowrap;
}
/* 각주 2줄 14px/1.25, X:60 / 중심 Y:950 (하단에서 58) */
.main__footnote {
  position: absolute;
  left: 60px;
  bottom: 58px;
  transform: translateY(50%);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.25;
  letter-spacing: -0.03em;
  color: #ffffff;
  white-space: nowrap;
}

/* 모바일 스테이지는 기본(데스크톱)에서 숨김 */
.main_stage_m { display: none; }

@media (max-width: 750px) {
  .launching__section--main {
    --launching-unit-mo: 0.133333vw;
    aspect-ratio: 750 / 1200;
    background: #709368;   /* MO 영상 첫 프레임 평균색 */
  }
  .main__bg-video { background-color: #709368; }
  .main__stage { display: none; }
  .main_stage_m {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  /* 로고 128x90, X:52 Y:32.76 */
  .main_m__logo {
    position: absolute;
    left: calc(52 * var(--launching-unit-mo));
    top: calc(32.76 * var(--launching-unit-mo));
    width: calc(128 * var(--launching-unit-mo));
    max-width: none;
  }
  /* 카피 블록 X:60 Y:356, 세로 gap 14.174
     eyebrow(22.68, h24) -> 락업(480.76x64.26) -> 타이틀(481x84.04)
     ※ PC 와 달리 MO 도 eyebrow -> 락업 -> 타이틀 순서(기존과 순서 다름 주의) */
  .main_m__eyebrow {
    position: absolute;
    left: calc(60 * var(--launching-unit-mo));
    top: calc(325 * var(--launching-unit-mo));
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(22.68 * var(--launching-unit-mo));
    line-height: 1.058; /* h24 고정 */
    letter-spacing: -0.02em;
    color: #ffffff;
    white-space: nowrap;
    width:calc(384 * var(--launching-unit-mo));
  }
  .main_m__lockup {
    position: absolute;
    left: calc(60 * var(--launching-unit-mo));
    top: calc(394.174 * var(--launching-unit-mo));
    width: calc(480.76 * var(--launching-unit-mo));
    max-width: none;
  }
  .main_m__title-img {
    position: absolute;
    left: calc(60 * var(--launching-unit-mo));
    top: calc(472.6 * var(--launching-unit-mo));
    width: calc(481 * var(--launching-unit-mo));
    max-width: none;
  }
  /* "2026. 08. 18 공식 출시" 30.758, 중심 Y:611.358 */
  .main_m__date {
    position: absolute;
    left: calc(60 * var(--launching-unit-mo));
    top: calc(611.358 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(30.758 * var(--launching-unit-mo));
    line-height: 1.2;
    letter-spacing: -0.02em;
    color: #ffffff;
    white-space: nowrap;
  }
  /* CTA 340x71.381, X:52 Y:676, r:68.218 */
  .main_m__btn {
    position: absolute;
    left: calc(52 * var(--launching-unit-mo));
    top: calc(676 * var(--launching-unit-mo));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: calc(340 * var(--launching-unit-mo));
    height: calc(71.381 * var(--launching-unit-mo));
    border-radius: calc(68.218 * var(--launching-unit-mo));
    background: #fe5000;
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(26.484 * var(--launching-unit-mo));
    line-height: 1.3;
    color: #ffffff;
    text-decoration: none;
    white-space: nowrap;
  }
  /* 각주 2줄 14units/1.25, X:30 / 중심 Y:1142 (하단에서 58) */
  .main_m__footnote {
    position: absolute;
    left: calc(30 * var(--launching-unit-mo));
    bottom: calc(58 * var(--launching-unit-mo));
    transform: translateY(50%);
    font-weight: 400;
    font-size: calc(14 * var(--launching-unit-mo));
    line-height: 1.25;
    letter-spacing: -0.03em;
    color: #ffffff;
    white-space: nowrap;
  }
}

/* ==========================================================================
   #intro-top — 피그마 275:4977(PC 1920x1064) / 275:4668(MO 375x900, x2 -> 750x1800)
   구성: eyebrow + 타이틀 + 모션 플레이트 3개.
   플레이트는 반투명 검정(#000/50%) 라운드 박스이고, 그 안에서 디바이스가 움직인다.
   ※ 모션은 다음 단계에서 붙인다. 지금은 레이어 자리와 클래스만 확보한다.
     - .it__plate  : overflow:hidden 컨테이너(모션 무대)
     - .it__media  : 디바이스/스틱 등 움직이는 레이어들의 부모
     - .it__label  : 플레이트 위 고정 카피(static_text)
   이미지 export 목록(피그마 275:4977 / 275:4668):
     introtop1_device.png / introtop1_stick.png (플레이트1 : 스틱 + 오픈 디바이스)
     introtop2_device.png (플레이트2 : 예열 디바이스)
     introtop3_device.png (플레이트3 : 스크린 디바이스)
   ========================================================================== */
#intro-top.launching__section {
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 1064;
  overflow: hidden;
  background: linear-gradient(180deg, #000000 0%, #3ba366 85.602%);
}
.intro-top__stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1064px;
  transform: translate(-50%, -50%) scale(calc(100vw / 1920 / 1px));
}

/* eyebrow — Mont Regular 22px / 자간 6.16px / #FE5000 / 가운데 / Y:150(h29) */
.launching__wrap .it__eyebrow {
  position: absolute;
  left: 0;
  right: 0;
  top: 150px;
  width: max-content;
  margin: 0 auto;
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: 6.16px;
  color: #fe5000;
  text-align: center;
  white-space: nowrap;
}
/* 타이틀 — ONE Mobile Bold 62px / 1.3 / 자간 -1.24 / 가운데 / Y:206(h162,
2줄) */
.launching__wrap .it__title {
  position: absolute;
  left: 0;
  right: 0;
  top: 206px;
  width: max-content;
  margin: 0 auto;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 62px;
  line-height: 1.3;
  letter-spacing: -1.24px;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}
.it__point { color: #fe5000; }

/* 모션 플레이트 367x610, Y:421, X:355 / 773 / 1199, r:20 */
.it__plate {
  position: absolute;
  top: 421px;
  width: 367px;
  height: 610px;
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.5);
  overflow: hidden;
}
.it__plate--1 { left: 355px; }
.it__plate--2 { left: 773px; }
.it__plate--3 { left: 1199px; }

/* 플레이트 안 카피 — ONE Mobile Bold 40px / 자간 -0.8 / 가운데
   중심 Y: 512(플레이트 기준 91) — 3번만 510.43(89.43) */
.launching__wrap .it__label {
  position: absolute;
  left: 0;
  right: 0;
  top: 91px;
  width: max-content;
  margin: 0 auto;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.3;
  letter-spacing: -0.8px;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
  z-index: 2;
}
.it__plate--3 .it__label { top: 89.43px; }
.it__en { font-family: "Mont", "Onemobile", sans-serif; font-weight: 600; }

/* 모션 레이어 부모 — 플레이트 기준 절대좌표 */
.it__media {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.it__media img { position: absolute; max-width: none; }

/* 플레이트1 : 스틱(피그마 박스 104.823x188.448 @136.67,149) + 디바이스(218x336 @75,274)
   export 본은 64x161 로 피그마 박스와 비율이 달라 높이를 박스에 맞춘다.
   최종 자세는 "디바이스 입구에 밑동이 닿아 멈춘" 상태이고, 스틱이 디바이스 위에 그려진다. */
.it__stick--1 {
  /* 폭 = 64/161 * 188.448 = 74.906.
     introtop1_device.png(218x336) 의 입구는 이미지 기준 x 78~147 / y 40~62, 중심 (112, 51).
     디바이스가 플레이트 (75,274) 에 1:1 로 놓이므로 입구는 플레이트 x 중심 187, y 314~336.
       X : left = 187 - 74.906/2 = 149.55
       Y : 밑동이 입구 안쪽(하단 립 근처)까지 내려오도록 bottom = 330
           -> top = 330 - 188.448 = 141.55
     스틱이 디바이스보다 위에 그려져야(z-index) 입구에서 멈춘 것처럼 보인다.
     translateX(-50%) 를 쓰지 않는 이유: GSAP 가 transform 을 잡으면 흔들릴 수 있다. */
  left: 149.55px;
  top: 141.55px;
  height: 188.448px;
  width: auto;
  z-index: 2;
}
.it__device--1 {
  left: 75px;
  top: 274px;
  width: 218px;
}
/* 플레이트2 : 디바이스 253x433 @ 59.14,177.7 (하단이 플레이트 끝에 맞는다) */
.it__device--2 {
  left: 59.14px;
  top: 177.7px;
  width: 252.816px;
}
/* 게이지 채움 gage_full.png(28x161).
   introtop2_device.png(253x433) 안에서 게이지 외곽선은 x 185~212 / y 157~276,
   불꽃은 y 288~312 이다. gage_full 은 막대(y1~121)와 불꽃(y132~157)을 같이 담고 있어
   이미지 좌상단을 디바이스 (185,156) 에 맞추면 외곽선·불꽃이 정확히 포개진다.
   디바이스 표시 배율 252.816/253 = 0.99927 을 곱해 플레이트 좌표로 환산.
     left = 59.14 + 185*0.99927 = 244.01
     top  = 177.7 + 156*0.99927 = 333.59
     width = 28*0.99927 = 27.98
   JS 가 clip-path inset(top) 을 75.16% -> 0.6% 로 움직여 아래에서 위로 채운다.
   (막대가 이미지 세로의 0.6%~75.2% 구간이라 그 범위만 움직인다)
   ※ `round` 로 위쪽 두 모서리만 둥글려 채움 끝이 직선이 아닌 반원이 되게 한다.
     반지름은 막대 폭의 절반(27.98/2 = 13.99). 아래 두 모서리는 0 으로 둬야
     이미지 하단의 불꽃이 잘리지 않는다. */
.it__gauge--2 {
  left: 244.01px;
  top: 333.59px;
  width: 27.98px;
  clip-path: inset(75.16% 0px 0px round 13.99px 13.99px 0px 0px);
  will-change: clip-path;
}
/* 플레이트3 : 디바이스 222x447 @ 73,163 (하단이 플레이트 끝에 맞는다) */
.it__device--3 {
  left: 73px;
  top: 163px;
  width: 222px;
}
/* 스크린 마스크 — introtop3_device_mask.png(59x107).
   디바이스에 "Hi" 가 박혀 있어 다음 컷으로 넘어가려면 이걸로 한 번 덮어야 한다.
   위치는 마스크 이미지를 디바이스 스크린에 템플릿 매칭해서 잡았다(가로 x=78 에서 최소 오차).
   세로는 "Hi" 글자(이미지 기준 x 92~129 / y 251~285) 를 세로 중앙에 두도록 y=214.
   플레이트 좌표 = 디바이스(73,163) + (78,214) */
.it__screen-mask--3 {
  position: absolute;
  left: 151px;
  top: 377px;
  width: 59px;
  max-width: none;
  opacity: 0;
  will-change: opacity;
  z-index: 1;
}
/* 디스플레이 컷 스택 — 마스크 위에 얹는다 */
.it__screen {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 2;
}
.it__screen img {
  position: absolute;
  max-width: none;
  opacity: 0;
  will-change: opacity;
}
/* 컷 위치 — 배경을 뺀 이미지라 크기가 제각각이다(27x141 / 15x151 / 43x167 / 62x33).
   가로는 전부 스크린 중앙(이미지 기준 x 110.5) 정렬.
   boost/standard/cleaner 는 불꽃이 이미지 맨 아래에 붙어 있어 하단 기준으로 맞춘다.
   불꽃 밑선을 스크린 하단(379)에서 22px 위로 두어 이미지 하단 = 357.
   bye 는 불꽃이 없어 "Hi" 와 같은 자리(세로 중심 268)에 둔다.
   ※ K 확인 후 조정 예정 — bye 위치가 확정되면 나머지도 같은 기준으로 다시 맞춘다.
   플레이트 좌표 = 디바이스(73,163) + 이미지 좌표 */
.it__scr--boost    { left: 170px;   top: 379px;   width: 27px; }
.it__scr--standard { left: 176px;   top: 369px;   width: 15px; }
.it__scr--cleaner  { left: 162px;   top: 353px;   width: 43px; }
.it__scr--bye      { left: 152.5px; top: 414.5px; width: 62px; }

.intro-top_stage_m { display: none; }

@media (max-width: 750px) {
  #intro-top.launching__section {
    --launching-unit-mo: 0.133333vw;
    aspect-ratio: 750 / 1800;
    background: linear-gradient(180deg, #000000 0%, #3ba366 95%);
  }
  .intro-top__stage { display: none; }
  .intro-top_stage_m {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  /* eyebrow — Mont Regular 24units / 자간 6.72 / 중심 Y:150 */
.launching__wrap .it_m__eyebrow {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(150 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 400;
    font-size: calc(24 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(6.72 * var(--launching-unit-mo));
    color: #fe5000;
    text-align: center;
    white-space: nowrap;
  }
  /* 타이틀 — ONE Mobile Bold 60units / 1.3 / 자간 -1.2 / 중심 Y:309 (3줄) */
.launching__wrap .it_m__title {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(309 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(60 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-1.2 * var(--launching-unit-mo));
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }
  /* 플레이트 576x372, X:86, Y:508 / 912 / 1316, r:20 */
  .it_m__plate {
    position: absolute;
    left: calc(86 * var(--launching-unit-mo));
    width: calc(576 * var(--launching-unit-mo));
    height: calc(372 * var(--launching-unit-mo));
    border-radius: calc(20 * var(--launching-unit-mo));
    background: rgba(0, 0, 0, 0.5);
    overflow: hidden;
  }
  .it_m__plate--1 { top: calc(508 * var(--launching-unit-mo)); }
  .it_m__plate--2 { top: calc(912 * var(--launching-unit-mo)); }
  .it_m__plate--3 { top: calc(1316 * var(--launching-unit-mo)); }

  /* 카피 — 44units / 자간 -0.88 / 중심 X:396.2(플레이트 기준) / 중심 Y:184.6 */
  .it_m__label {
    position: absolute;
    left: calc(396.2 * var(--launching-unit-mo));
    top: calc(184.6 * var(--launching-unit-mo));
    transform: translate(-50%, -50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(44 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.88 * var(--launching-unit-mo));
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    z-index: 2;
  }
  .it_m__plate--2 .it_m__label { top: calc(185.6 * var(--launching-unit-mo)); }
  .it_m__plate--3 .it_m__label { top: calc(182 * var(--launching-unit-mo)); }

  .it_m__media {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }
  .it_m__media img { position: absolute; max-width: none; }

  /* 플레이트1 : 스틱(피그마 박스 76.43x137.41 @118.83,32.25) + 디바이스(158.96x245 @73.86,123.4) */
  .it_m__stick--1 {
    /* 폭 = 64/161 * 137.41 = 54.62. 디바이스 배율 158.96/218 = 0.72917.
       입구 중심 x = 73.86 + 112*0.72917 = 155.53 -> left = 155.53 - 27.31 = 128.22
       밑동 y = 123.4 + 56*0.72917 = 164.23 -> top = 164.23 - 137.41 = 26.82 */
    left: calc(128.22 * var(--launching-unit-mo));
    top: calc(26.82 * var(--launching-unit-mo));
    height: calc(137.41 * var(--launching-unit-mo));
    width: auto;
    z-index: 2;
  }
  .it_m__device--1 {
    left: calc(73.86 * var(--launching-unit-mo));
    top: calc(123.4 * var(--launching-unit-mo));
    width: calc(158.96 * var(--launching-unit-mo));
  }
  /* 플레이트2 : 디바이스 184.34x570.65 @ 62.2,53.17 (아래로 넘침) */
  .it_m__device--2 {
    left: calc(62.2 * var(--launching-unit-mo));
    top: calc(53.17 * var(--launching-unit-mo));
    width: calc(184.34 * var(--launching-unit-mo));
  }
  /* 디바이스 배율 184.34/253 = 0.72862
       left = 62.2 + 185*0.72862 = 196.99
       top  = 53.17 + 156*0.72862 = 166.83
       width = 28*0.72862 = 20.40 */
  .it_m__gauge--2 {
    left: calc(196.99 * var(--launching-unit-mo));
    top: calc(166.83 * var(--launching-unit-mo));
    width: calc(20.4 * var(--launching-unit-mo));
    /* 반지름 = 20.4/2 = 10.2 unit */
    clip-path: inset(75.16% 0px 0px round calc(10.2 * var(--launching-unit-mo)) calc(10.2 * var(--launching-unit-mo)) 0px 0px);
    will-change: clip-path;
  }
  /* 플레이트3 : 디바이스 161.88x700 @ 72.2,42.85 (아래로 넘침) */
  .it_m__device--3 {
    left: calc(72.2 * var(--launching-unit-mo));
    top: calc(42.85 * var(--launching-unit-mo));
    width: calc(161.88 * var(--launching-unit-mo));
  }
  /* 디바이스 배율 161.88/222 = 0.72919 — PC 와 같은 계산을 MO 단위로 환산 */
  .it_m__screen-mask--3 {
    position: absolute;
    left: calc(129.08 * var(--launching-unit-mo));
    top: calc(198.9 * var(--launching-unit-mo));
    width: calc(43.02 * var(--launching-unit-mo));
    max-width: none;
    opacity: 0;
    will-change: opacity;
    z-index: 1;
  }
  .it_m__screen {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 2;
  }
  .it_m__screen img {
    position: absolute;
    max-width: none;
    opacity: 0;
    will-change: opacity;
  }
  .it_m__scr--boost    { left: calc(142.93 * var(--launching-unit-mo)); top: calc(200.36 * var(--launching-unit-mo)); width: calc(19.69 * var(--launching-unit-mo)); }
  .it_m__scr--standard { left: calc(147.31 * var(--launching-unit-mo)); top: calc(193.06 * var(--launching-unit-mo)); width: calc(10.94 * var(--launching-unit-mo)); }
  .it_m__scr--cleaner  { left: calc(137.1 * var(--launching-unit-mo));  top: calc(181.4 * var(--launching-unit-mo));  width: calc(31.36 * var(--launching-unit-mo)); }
  .it_m__scr--bye      { left: calc(130.17 * var(--launching-unit-mo)); top: calc(226.24 * var(--launching-unit-mo)); width: calc(45.21 * var(--launching-unit-mo)); }
}
/* ==========================================================================
   #intro-bottom — 피그마 275:5015(PC 1920x1976) / 275:4709(MO 375x1428, x2 -> 750x2856)
   구성: 헤더(eyebrow + 타이틀 + 흰 박스 강조) + 상단 대형 카드(EVENT1) + 하단 2단(EVENT2/3)
   변경점(구시안 대비)
     - 타이틀 2번째 줄이 흰 박스 위 주황 텍스트로 바뀜
     - EVENT1 카드에 40% OFF 원형 뱃지 추가
     - EVENT3 카피 "가장 마음에 드는 기능 남기면 / 추첨을 통해 선물 증정!" 으로 교체
     - PC EVENT2 금액 2,000P / MO 2,000원 (시안 그대로 상이)
   이미지 export 목록:
     intro1_device.png       (EVENT1 디바이스 4종, PC 661.6x618 / MO 191x179)
     intro2_visual.png / _m  (네이버페이 카드 + 선착순 뱃지 제외한 카드 비주얼)
     intro3_visual.png / _m  (보아르 위셀 음식물처리기)
   ========================================================================== */
#intro-bottom.launching__section {
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 1976;
  overflow: hidden;
  /*background: linear-gradient(180deg, #3ba366 0%, #206439 131.83%);*/
  background:#3ba366 url("/content/dam/glo-kr/mcs/images/event/hyperproplus/launching/intro_bg.jpg") no-repeat center center / cover;
}
.ib__stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1976px;
  transform: translate(-50%, -50%) scale(calc(100vw / 1920 / 1px));
}

/* ── 헤더 ───────────────────────────────────────────────────────── */
/* Launch Benefits — Mont Regular 22px / 자간 6.16 / 흰색 / Y:150 */
.launching__wrap .ib__eyebrow {
  position: absolute;
  left: 0;
  right: 0;
  top: 150px;
  width: max-content;
  margin: 0 auto;
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: 6.16px;
  text-transform: uppercase;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}
/* "고민 없이 쉽게 즐기는" — 58px / 1.3 / 자간 -1.16 / Y:193 */
.launching__wrap .ib__title {
  position: absolute;
  left: 0;
  right: 0;
  top: 193px;
  width: max-content;
  margin: 0 auto;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 58px;
  line-height: 1.3;
  letter-spacing: -1.16px;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}
/* 흰 박스 587.583x101.76 @ X:670.71 Y:276.33 (사각, 라운드 없음) */
.ib__title-box {
  position: absolute;
  left: 670.71px;
  top: 276.33px;
  width: 587.583px;
  height: 101.76px;
  background: #ffffff;
}
/* "100% 플러스 혜택" — 72px / 1.3 / 자간 -1.44 / #FE5000 / 중심 (963.53,
326.71) */
.launching__wrap .ib__title-em {
  position: absolute;
  left: 0;
  right: 0;
  top: 326.71px;
  width: max-content;
  margin: 0 auto;
  transform: translate(3.53px, -50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 72px;
  line-height: 1.3;
  letter-spacing: -1.44px;
  color: #fe5000;
  text-align: center;
  white-space: nowrap;
}
.ib__en-sb { font-family: "Mont", "Onemobile", sans-serif; font-weight: 600; }
.ib__en-b  { font-family: "Mont", "Onemobile", sans-serif; font-weight: 700; }
.ib__en-r  { font-family: "Mont", "Onemobile", sans-serif; font-weight: 400; }
.ib__point { color: #fe5000; }

/* ── EVENT 1 : 상단 대형 카드 1371x713 @ (275,448) ─────────────── */
.ib__card--1 {
  position: absolute;
  left: 275px;
  top: 448px;
  width: 1371px;
  height: 713px;
  border: 2px solid #3ba965;
  border-radius: 15px;
  box-shadow: 4px 4px 7px 0 rgba(0, 0, 0, 0.31);
  /* 피그마는 conic-gradient(90deg 회전/스케일) — 시각적으로 근사한 선형으로 대체 */
  background: linear-gradient(118deg, #0b241b 0%, #144836 50%, #0b3123 62.5%, #021911 78%, #0b241b 100%);
}
/* 디바이스 4종 661.601x618 @ (920.46,513) -> 카드 기준 (645.46,65) */
.ib__card1-visual {
  position: absolute;
  left: 645.46px;
  top: 65px;
  width: 661.601px;
  max-width: none;
}
/* EVENT 1 필 172.834x43.502 @ (534.5,627) -> 카드 기준 (259.5,179) */
.ib__pill {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2.351px solid #fe5000;
  border-radius: 70.545px;
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 600;
  font-size: 28px;
  line-height: 1;
  letter-spacing: -0.56px;
  color: #fe5000;
  white-space: nowrap;
}
.ib__card1-pill {
  left: 259.5px;
  top: 179px;
  width: 172.834px;
  height: 43.502px;
}
/* 이벤트 기간 26px / 1.3 / 자간 -0.52 / 중심 (620.23, 263.02) — 카드 기준 */
.ib__card1-period {
  position: absolute;
  left: 156.73px;
  top: 263.02px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 1.3;
  letter-spacing: -0.52px;
  color: #ffffff;
  white-space: nowrap;
}
/* "런칭 기념 혜택가" 56px / 1.3 / 자간 -1.12 / 좌 151.7 / 중심 Y 358.94 */
.ib__card1-copy {
  position: absolute;
  left: 151.7px;
  top: 358.94px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 56px;
  line-height: 1.3;
  letter-spacing: -1.12px;
  color: #ffffff;
  white-space: nowrap;
}
/* 정가 28px #B8B8B8 / 좌 179.57 / 중심 Y 432.64 */
.ib__card1-old {
  position: absolute;
  left: 179.57px;
  top: 432.64px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 28px;
  line-height: 1.3;
  letter-spacing: -0.56px;
  color: #b8b8b8;
  white-space: nowrap;
}
/* 취소선 163.596px @ (158.09,430.47) */
.ib__card1-strike {
  position: absolute;
  left: 158.09px;
  top: 430.47px;
  width: 163.596px;
  height: 2px;
  background: #b8b8b8;
}
/* 할인가 Mont Bold 54px #FE5000 / 좌 345.88 / 중심 Y 431.77 */
.ib__card1-new-num {
  position: absolute;
  left: 345.88px;
  top: 431.77px;
  transform: translateY(-50%);
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 700;
  font-size: 54px;
  line-height: 1.3;
  letter-spacing: -1.08px;
  color: #fe5000;
  white-space: nowrap;
}
.ib__card1-new-won {
  position: absolute;
  left: 513.08px;
  top: 433.89px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 27px;
  line-height: 1.3;
  letter-spacing: -0.54px;
  color: #fe5000;
  white-space: nowrap;
}
/* 버튼 225.743x54.084 r60.571 @ (109,479.07) / (358.26,479.07) */
.ib__btn {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14.109px;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
  white-space: nowrap;
}
.ib__btn::after {
  content: "";
  width: 9px;
  height: 9px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-1px) rotate(45deg);
}
.ib__btn--orange { background: #fe5000; color: #ffffff; }
.ib__btn--gray   { background: #e6e6e6; color: #000000; }
.ib__card1-btn-buy,
.ib__card1-btn-more {
  top: 479.07px;
  width: 225.743px;
  height: 54.084px;
  border-radius: 60.571px;
  font-size: 24px;
}
.ib__card1-btn-buy  { left: 109px; }
.ib__card1-btn-more { left: 358.26px; }
/* 40% OFF 뱃지 187 @ (1421,483) — 섹션 기준 */
.ib__off-badge {
  position: absolute;
  left: 1421px;
  top: 483px;
  width: 187px;
  height: 187px;
  border-radius: 50%;
  background: #fe5000;
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 700;
  line-height: 0.93;
  letter-spacing: -1.2818px;
  color: #ffffff;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 64.09px;
}
.ib__off-badge .ib__off-pct { font-size: 37.205px; }
.ib__off-badge .ib__off-txt { font-size: 50.649px; display: block; }

/* ── EVENT 2 / 3 : 하단 2단 673x505 @ y1186, x275 / x973 ───────── */
.ib__card--2,
.ib__card--3 {
  position: absolute;
  top: 1186px;
  width: 673px;
  height: 505px;
  border-radius: 15px;
  overflow: hidden;
  background: linear-gradient(127.94deg, #ffffff 0%, #dedede 106.63%);
}
.ib__card--2 { left: 275px; }
.ib__card--3 { left: 973px; }
/* EVENT 2/3 필 147x37 r60 @ (35,35) */
.ib__card2-pill,
.ib__card3-pill {
  left: 35px;
  top: 35px;
  width: 147px;
  height: 37px;
  border: 2px solid #fe5000;
  border-radius: 60px;
  font-size: 24px;
  letter-spacing: -0.48px;
}
/* 리뷰 작성 기간 — 우측 정렬, 우측 끝 644, 중심 Y 54 */
.ib__card2-period {
  position: absolute;
  right: 29px;
  top: 54px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1;
  letter-spacing: -0.4px;
  color: #545454;
  text-align: right;
  white-space: nowrap;
}
/* "공식몰 리뷰 작성 하면" 30px / 중심 Y 143.5 */
.ib__card2-copy1 {
  position: absolute;
  left: 48.46px;
  top: 143.5px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.3;
  letter-spacing: -0.6px;
  color: #272727;
  white-space: nowrap;
}
/* "네이버페이 포인트" 42px / 중심 Y 194.17 */
.ib__card2-copy2 {
  position: absolute;
  left: 48.46px;
  top: 194.17px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 42px;
  line-height: 1.3;
  letter-spacing: -0.84px;
  color: #272727;
  white-space: nowrap;
}
/* 형광펜 243x25 #FFE9DF @ (45,236) */
.ib__card2-highlight {
  position: absolute;
  left: 45px;
  top: 236px;
  width: 243px;
  height: 25px;
  background: #ffe9df;
}
/* "2,000P 증정!" 41px #FE5000 / 중심 Y 248.36 */
.ib__card2-copy3 {
  position: absolute;
  left: 52.46px;
  top: 248.36px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 41px;
  line-height: 1.3;
  letter-spacing: -0.82px;
  color: #fe5000;
  white-space: nowrap;
}
/* "*30자 이상 작성 시" 20px / 중심 Y 301.78 */
.ib__card2-note {
  position: absolute;
  left: 48.46px;
  top: 301.78px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
  letter-spacing: -0.4px;
  color: #272727;
  white-space: nowrap;
}
/* 네이버페이 카드 비주얼 305.84x198.28 @ (328,270) */
.ib__card2-visual {
  position: absolute;
  left: 328px;
  top: 270px;
  width: 305.843px;
  max-width: none;
}
/* 선착순 100명 뱃지 79.628 @ (328,270) */
.ib__badge {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fe5000;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  line-height: 1.1;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
  z-index: 2;
}
.ib__card2-badge {
  left: 328px;
  top: 270px;
  width: 79.628px;
  height: 79.628px;
  font-size: 19.779px;
  letter-spacing: -0.3956px;
}
/* EVENT 3 */
.ib__card3-copy {
  position: absolute;
  left: 48.46px;
  top: 172px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 37.308px;
  line-height: 1.3;
  letter-spacing: -0.7462px;
  color: #000000;
  white-space: nowrap;
}
.ib__card3-btn {
  left: 48px;
  top: 330px;
  width: 192px;
  height: 46px;
  border-radius: 51.517px;
  font-size: 20px;
  gap: 12px;
}
.ib__card3-btn::after { width: 7.5px; height: 7.5px; }
.ib__card3-visual {
  position: absolute;
  left: 383px;
  top: 170px;
  width: 251.5px;
  max-width: none;
}
/* 제품명 16px / 우측 정렬 우측 끝 369 / 중심 Y 465.5 */
.ib__card3-prod {
  position: absolute;
  left: 290px;
  top: 425.5px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.3;
  letter-spacing: -0.32px;
  color: #717171;
  white-space: nowrap;
  text-align:right;
}

.ib__card3-copy2 {
  position: absolute;
  left: 48.46px;
  top: 220px;
  transform: translateY(-50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 42px;
  line-height: 1.3;
  letter-spacing: -0.84px;
  color: #272727;
  white-space: nowrap;
}

.ib_stage_m { display: none; }

@media (max-width: 750px) {
  #intro-bottom.launching__section {
    --launching-unit-mo: 0.133333vw;
    /* EVENT3 카피가 길어지면서 카드 하단이 2862unit 까지 내려와 시안 높이(2856)를
       6unit 넘겼다. 섹션이 딱 맞게 끝나 다음 #review 배경에 가려 잘려 보였다.
       카드 아래 여유를 두려고 100unit(375 기준 50px) 늘린다.
       ※ .ib_stage_m 은 height:100% 라 실제 높이 결정은 이 aspect-ratio 가 한다. */
    aspect-ratio: 750 / 2956;
    background:#3ba366 url("/content/dam/glo-kr/mcs/images/event/hyperproplus/launching/intro_bg_m.jpg") no-repeat center center / cover;
    overflow: visible;
    height:auto;
  }
  .ib__stage { display: none; }
  .ib_stage_m {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height:auto;
    overflow: visible;
  }
.launching__wrap .ib_m__eyebrow {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(108 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 400;
    font-size: calc(24 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(6.72 * var(--launching-unit-mo));
    text-transform: uppercase;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }
.launching__wrap .ib_m__title {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(152 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(48.258 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.9652 * var(--launching-unit-mo));
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }
  .ib_m__title-box {
    position: absolute;
    left: calc(130 * var(--launching-unit-mo));
    top: calc(221.34 * var(--launching-unit-mo));
    width: calc(488.886 * var(--launching-unit-mo));
    height: calc(84.668 * var(--launching-unit-mo));
    background: #ffffff;
  }
.launching__wrap .ib_m__title-em {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(263.14 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(59.906 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-1.1982 * var(--launching-unit-mo));
    color: #fe5000;
    text-align: center;
    white-space: nowrap;
  }

  /* EVENT 1 카드 654x840 @ (48,386) */
  .ib_m__card--1 {
    position: absolute;
    left: calc(48 * var(--launching-unit-mo));
    top: calc(386 * var(--launching-unit-mo));
    width: calc(654 * var(--launching-unit-mo));
    height: calc(840 * var(--launching-unit-mo));
    border: calc(1.458 * var(--launching-unit-mo)) solid #3ba965;
    border-radius: calc(20 * var(--launching-unit-mo));
    box-shadow: calc(2.916 * var(--launching-unit-mo)) calc(2.916 * var(--launching-unit-mo)) calc(5.104 * var(--launching-unit-mo)) 0 rgba(0, 0, 0, 0.31);
    background: linear-gradient(118deg, #0b241b 0%, #144836 50%, #0b3123 62.5%, #021911 78%, #0b241b 100%);
  }
  /* 공통 필 234x60 r95.576 — 카드 기준 가운데 */
.launching__wrap .ib_m__pill {
    position: absolute;
    left: 0;
    right: 0;
    width: calc(234 * var(--launching-unit-mo));
    height: calc(60 * var(--launching-unit-mo));
    margin: 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: calc(1.592 * var(--launching-unit-mo)) solid #fe5000;
    border-radius: calc(95.576 * var(--launching-unit-mo));
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 600;
    font-size: calc(32 * var(--launching-unit-mo));
    line-height: 1;
    letter-spacing: calc(-0.64 * var(--launching-unit-mo));
    color: #fe5000;
    white-space: nowrap;
  }
  .ib_m__card--1 .ib_m__pill { top: calc(56 * var(--launching-unit-mo)); }
  .ib_m__card--2 .ib_m__pill,
  .ib_m__card--3 .ib_m__pill { top: calc(56 * var(--launching-unit-mo)); }
  /* 이벤트 기간 20units / 카드 기준 중심 Y 153 */
.launching__wrap .ib_m__card1-period {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(153 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(20 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.4 * var(--launching-unit-mo));
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }
  /* 디바이스 382x358 @ 카드 기준 (134,204) */
  .ib_m__card1-visual {
    position: absolute;
    left: calc(134 * var(--launching-unit-mo));
    top: calc(204 * var(--launching-unit-mo));
    width: calc(382 * var(--launching-unit-mo));
    max-width: none;
  }
  /* 40% OFF 뱃지 136.354 @ 카드 기준 (434,188) */
  .ib_m__off-badge {
    position: absolute;
    left: calc(434 * var(--launching-unit-mo));
    top: calc(188 * var(--launching-unit-mo));
    width: calc(136.354 * var(--launching-unit-mo));
    height: calc(136.354 * var(--launching-unit-mo));
    border-radius: 50%;
    background: #fe5000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 700;
    font-size: calc(46.732 * var(--launching-unit-mo));
    line-height: 0.93;
    letter-spacing: calc(-0.9346 * var(--launching-unit-mo));
    color: #ffffff;
    text-align: center;
    z-index: 2;
  }
  .ib_m__off-badge .ib__off-pct { font-size: calc(27.128 * var(--launching-unit-mo)); }
  .ib_m__off-badge .ib__off-txt { font-size: calc(36.932 * var(--launching-unit-mo)); display: block; }
  /* "런칭 기념 혜택가" 50units / 좌 153.84 / 중심 Y 594 (카드 기준) */
  .ib_m__card1-copy {
    position: absolute;
    left: calc(153.84 * var(--launching-unit-mo));
    top: calc(594 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(50 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-1 * var(--launching-unit-mo));
    color: #ffffff;
    white-space: nowrap;
  }
  .ib_m__card1-old {
    position: absolute;
    left: calc(165.24 * var(--launching-unit-mo));
    top: calc(657.92 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(24.996 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.5 * var(--launching-unit-mo));
    color: #b8b8b8;
    white-space: nowrap;
  }
  .ib_m__card1-strike {
    position: absolute;
    left: calc(159.5 * var(--launching-unit-mo));
    top: calc(657.72 * var(--launching-unit-mo));
    width: calc(144.94 * var(--launching-unit-mo));
    height: calc(1.5 * var(--launching-unit-mo));
    background: #b8b8b8;
  }
  .ib_m__card1-new-num {
    position: absolute;
    left: calc(325.86 * var(--launching-unit-mo));
    top: calc(658.86 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 700;
    font-size: calc(47.916 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.9584 * var(--launching-unit-mo));
    color: #fe5000;
    white-space: nowrap;
  }
  .ib_m__card1-new-won {
    position: absolute;
    left: calc(474 * var(--launching-unit-mo));
    top: calc(661.24 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(23.958 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.4792 * var(--launching-unit-mo));
    color: #fe5000;
    white-space: nowrap;
  }
  /* 버튼 217.044x52 r58.236 @ 카드 기준 (98.06,718) / (337.72,718) */
  .ib_m__btn {
    position: absolute;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: calc(13.566 * var(--launching-unit-mo));
    width: calc(217.044 * var(--launching-unit-mo));
    height: calc(52 * var(--launching-unit-mo));
    border-radius: calc(58.236 * var(--launching-unit-mo));
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(22.608 * var(--launching-unit-mo));
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
  }
  .ib_m__btn::after {
    content: "";
    width: calc(9 * var(--launching-unit-mo));
    height: calc(9 * var(--launching-unit-mo));
    border-top: calc(1.5 * var(--launching-unit-mo)) solid currentColor;
    border-right: calc(1.5 * var(--launching-unit-mo)) solid currentColor;
    transform: rotate(45deg);
  }
  .ib_m__card1-btn-buy  { left: calc(98.06 * var(--launching-unit-mo)); top: calc(718 * var(--launching-unit-mo)); }
  .ib_m__card1-btn-more { left: calc(337.72 * var(--launching-unit-mo)); top: calc(718 * var(--launching-unit-mo)); }

  /* EVENT 2 / 3 카드 654x732 @ (48,1254) / (48,2014) */
  .ib_m__card--2,
  .ib_m__card--3 {
    position: absolute;
    left: calc(48 * var(--launching-unit-mo));
    width: calc(654 * var(--launching-unit-mo));
    height: calc(792 * var(--launching-unit-mo));
    background: #ffffff;
    overflow: hidden;
  }
  .ib_m__card--2 { top: calc(1254 * var(--launching-unit-mo)); border-radius: calc(20 * var(--launching-unit-mo)); }
  .ib_m__card--3 { top: calc(2070 * var(--launching-unit-mo)); border-radius: calc(16.74 * var(--launching-unit-mo)); }
  /* 기간 20units #696969 / 중심 Y 146 (카드 기준) */
.launching__wrap .ib_m__card2-period {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(146 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 400;
    font-size: calc(20 * var(--launching-unit-mo));
    line-height: 1;
    letter-spacing: calc(-0.4 * var(--launching-unit-mo));
    color: #696969;
    text-align: center;
    white-space: nowrap;
  }
  /* 네이버페이 비주얼 271.728x184.27 @ 카드 기준 (196.28,211.5) */
  .ib_m__card2-visual {
    position: absolute;
    left: calc(196.28 * var(--launching-unit-mo));
    top: calc(211.5 * var(--launching-unit-mo));
    width: calc(271.728 * var(--launching-unit-mo));
    max-width: none;
  }
  /* 선착순 뱃지 112 @ 카드 기준 (130,186) */
  .ib_m__badge {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    left: calc(130 * var(--launching-unit-mo));
    top: calc(186 * var(--launching-unit-mo));
    width: calc(112 * var(--launching-unit-mo));
    height: calc(112 * var(--launching-unit-mo));
    border-radius: 50%;
    background: #fe5000;
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(28 * var(--launching-unit-mo));
    line-height: 1.1;
    letter-spacing: calc(-0.56 * var(--launching-unit-mo));
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
    z-index: 2;
  }
  .launching__wrap .ib_m__card2-copy1,
.launching__wrap .ib_m__card2-copy2,
.launching__wrap .ib_m__card2-copy3,
.launching__wrap .ib_m__card2-note {
    position: absolute;
    left: 0;
    right: 0;
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    white-space: nowrap;
  }
  .ib_m__card2-copy1 {
    top: calc(473 * var(--launching-unit-mo));
    font-size: calc(32 * var(--launching-unit-mo));
    letter-spacing: calc(-0.64 * var(--launching-unit-mo));
    color: #272727;
  }
  .ib_m__card2-copy2 {
    top: calc(572 * var(--launching-unit-mo));
    font-size: calc(52 * var(--launching-unit-mo));
    letter-spacing: calc(-1.04 * var(--launching-unit-mo));
    color: #272727;
  }
  .ib_m__card2-highlight {
    position: absolute;
    left: calc(186.8 * var(--launching-unit-mo));
    top: calc(590.26 * var(--launching-unit-mo));
    width: calc(272.5 * var(--launching-unit-mo));
    height: calc(27.5 * var(--launching-unit-mo));
    background: #ffe9df;
  }
  .ib_m__card2-copy3 {
    top: calc(663 * var(--launching-unit-mo));
    font-size: calc(48 * var(--launching-unit-mo));
    letter-spacing: calc(-0.9 * var(--launching-unit-mo));
    color: #fe5000;
  }
  .ib_m__card2-note {
    top: calc(728 * var(--launching-unit-mo));
    font-size: calc(16 * var(--launching-unit-mo));
    letter-spacing: calc(-0.32 * var(--launching-unit-mo));
    color: #272727;
  }
  /* EVENT 3 */
  .ib_m__card3-visual {
    position: absolute;
    left: calc(187.46 * var(--launching-unit-mo));
    top: calc(135.7 * var(--launching-unit-mo));
    width: calc(275.854 * var(--launching-unit-mo));
    max-width: none;
  }
  .launching__wrap .ib_m__card3-prod,
  .launching__wrap .ib_m__card3-sub,
.launching__wrap .ib_m__card3-copy {
    position: absolute;
    left: 0;
    right: 0;
    width: max-content;
    margin: 0 auto;
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
  }
  .ib_m__card3-prod {
    left:calc(-320 * var(--launching-unit-mo)) !important;
    text-align:right !important;
    color:#717171;
    top: calc(350 * var(--launching-unit-mo));
    font-size: calc(16 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.32 * var(--launching-unit-mo));
  }
  .ib_m__card3-copy {
    top: calc(456 * var(--launching-unit-mo));
    font-size: calc(32 * var(--launching-unit-mo));
    line-height: 1.4;
    letter-spacing: calc(-0.88 * var(--launching-unit-mo));
    color: #000000;
  }

  .ib_m__card3-sub {
    top: calc(510 * var(--launching-unit-mo));
    left:50%;
    font-size: calc(48 * var(--launching-unit-mo));
    line-height: 1.4;
    letter-spacing: calc(-0.88 * var(--launching-unit-mo));
    color: #000000;
  }
  .ib_m__card3-btn {
    left: calc(218 * var(--launching-unit-mo));
    top: calc(682 * var(--launching-unit-mo));
  }
}

/* ==========================================================================
   #review — 피그마 275:5103(PC 1920x1693) / 275:4830(MO 375x2230, x2 -> 750x4460)
   구성: 헤더 + 흰 카드 3단(번호 · 라벨 · 타이틀 · 세로 영상 썸네일 · 인용 · @핸들)
   구시안 대비 전면 개편(좌우 지그재그 -> 3단 카드 그리드, 작성자 표기 -> @핸들)
   이미지 export 목록:
     review1_thumb.jpg ~ review3_thumb.jpg (세로 크롭 382x549 / MO 260x378)
     ※ 재생 버튼(흰 원+삼각형)과 버튼 화살표는 CSS 로 그렸다 — 별도 export 불필요.
   ※ 배경 그라디언트는 피그마에서 값을 못 읽어와 근사치로 넣었다 — 확인 필요.
   ※ 3번 카드의 인용문 · @핸들은 시안에서 hidden 상태(미확정) — 임시 문구.
   ========================================================================== */
#review.launching__section {
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 1693;
  overflow: hidden;
  background: linear-gradient(180deg, #000000 0%, #0f3d2b 38%, #0b2a1e 62%, #000000 100%);
}
.rv__stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1693px;
  transform: translate(-50%, -50%) scale(calc(100vw / 1920 / 1px));
}
.launching__wrap .rv__eyebrow {
  position: absolute;
  left: 0;
  right: 0;
  top: 150px;
  width: max-content;
  margin: 0 auto;
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: 6.16px;
  color: #fe5000;
  text-align: center;
  white-space: nowrap;
}
.launching__wrap .rv__title {
  position: absolute;
  left: 0;
  right: 0;
  top: 206px;
  width: max-content;
  margin: 0 auto;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 62px;
  line-height: 1.3;
  letter-spacing: -1.24px;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}
.rv__point { color: #fe5000; }
.launching__wrap .rv__sub {
  position: absolute;
  left: 0;
  right: 0;
  top: 398px;
  width: max-content;
  margin: 0 auto;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.6;
  letter-spacing: -0.6px;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}
.rv__sub strong { font-weight: 700; color: #fe5000; }

/* 카드 438x989 @ y554 / x275, 742, 1209 */
.rv__card {
  position: absolute;
  top: 554px;
  width: 438px;
  height: 989px;
  border-radius: 15px;
  background: #ffffff;
  overflow: hidden;
}
.rv__card--1 { left: 275px; }
.rv__card--2 { left: 742px; }
.rv__card--3 { left: 1209px; }

/* 번호 행 — 카드 기준 (27,31), gap 16 */
.rv__num-row {
  position: absolute;
  left: 27px;
  top: 31px;
  display: flex;
  align-items: center;
  gap: 16px;
}
.rv__num {
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 1.5;
  letter-spacing: -0.64px;
  color: #fe5000;
}
.rv__num-bar {
  width: 2px;
  height: 24px;
  background: #fe5000;
}
.rv__num-label {
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.5;
  letter-spacing: -0.48px;
  color: #fe5000;
  white-space: nowrap;
}
/* 카드 타이틀 42px / 1.3 / 카드 기준 (27,79) */
.rv__card-title {
  position: absolute;
  left: 27px;
  top: 79px;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 42px;
  line-height: 1.3;
  letter-spacing: -0.84px;
  color: #000000;
  white-space: nowrap;
}
/* 세로 썸네일 382x549 @ 카드 기준 (28,205) */
.rv__thumb {
  position: absolute;
  left: 28px;
  top: 205px;
  width: 382px;
  height: 549px;
  border-radius: 10px;
  overflow: hidden;
  background: #8a8a8a;
}
.rv__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rv__play {
  position: absolute;
  cursor: pointer;
  left: 131px;
  top: 215px;
  width: 120px;
  height: 120px;
  border: 3px solid #ffffff;
  border-radius: 50%;
}
.rv__play::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-40%, -50%);
  border-left: 30px solid #ffffff;
  border-top: 18px solid transparent;
  border-bottom: 18px solid transparent;
}
/* 인용 박스 383x139 r10 #F6F6F6 @ 카드 기준 (27,779) */
.rv__quote-box {
  position: absolute;
  left: 27px;
  top: 779px;
  width: 383px;
  height: 139px;
  border-radius: 10px;
  background: #f6f6f6;
}
.rv__quote {
  position: absolute;
  left: 85px;
  top: 802px;
  white-space: nowrap; /* 줄바꿈은 <br> 로만 — 카드2 문구가 267px 를 살짝 넘겨 자동 줄바꿈되는 것 방지 */
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 400;
  font-size: 24px;
  line-height: 1.3;
  letter-spacing: -0.48px;
  color: #272727;
}
.rv__qmark {
  position: absolute;
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 900;
  font-size: 54px;
  line-height: 1.3;
  letter-spacing: -1.08px;
  color: #cbcbcb;
  transform: translateY(-50%);
}
.rv__qo { left: 18px; top: 823px; }
.rv__qc { left: 390px; top: 904px; }
/* @핸들 — 우측 정렬(우측 끝 410), 중심 Y 945 */
.rv__handle {
  position: absolute;
  right: 28px;
  top: 945px;
  transform: translateY(-50%);
  font-family: "Mont", "Onemobile", sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.3;
  color: #6c6c6c;
  text-align: right;
  white-space: nowrap;
}
/* 각주 X:60 Y:1635 */
.rv__footnote {
  position: absolute;
  left: 60px;
  top: 1635px;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: -0.03em;
  color: rgba(255, 255, 255, 0.6);
  white-space: nowrap;
}

.rv_stage_m { display: none; }

@media (max-width: 750px) {
  #review.launching__section {
    --launching-unit-mo: 0.133333vw;
    aspect-ratio: 750 / 4460;
  }
  .rv__stage { display: none; }
  .rv_stage_m {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  .launching__wrap .rv_m__eyebrow,
.launching__wrap .rv_m__title,
.launching__wrap .rv_m__sub {
    position: absolute;
    left: 0;
    right: 0;
    width: max-content;
    margin: 0 auto;
    text-align: center;
    white-space: nowrap;
  }
  .rv_m__eyebrow {
    top: calc(126 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 400;
    font-size: calc(24 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(6.72 * var(--launching-unit-mo));
    color: #fe5000;
  }
  .rv_m__title {
    top: calc(160.66 * var(--launching-unit-mo));
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(60 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-1.2 * var(--launching-unit-mo));
    color: #ffffff;
  }
  .rv_m__sub {
    top: calc(450 * var(--launching-unit-mo));
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 400;
    font-size: calc(30 * var(--launching-unit-mo));
    line-height: 1.6;
    letter-spacing: calc(-0.6 * var(--launching-unit-mo));
    color: #ffffff;
  }
  .rv_m__sub strong { font-weight: 700; color: #fe5000; }

  /* 카드 654 폭 @ X:48 — 1·2번 h1200 / 3번 h1260(타이틀 2줄) */
  .rv_m__card {
    position: absolute;
    left: calc(48 * var(--launching-unit-mo));
    width: calc(654 * var(--launching-unit-mo));
    border-radius: calc(15.624 * var(--launching-unit-mo));
    background: #ffffff;
    overflow: hidden;
  }
  .rv_m__card--1 { top: calc(642 * var(--launching-unit-mo));  height: calc(1200 * var(--launching-unit-mo)); }
  .rv_m__card--2 { top: calc(1866 * var(--launching-unit-mo)); height: calc(1200 * var(--launching-unit-mo)); }
  .rv_m__card--3 { top: calc(3090 * var(--launching-unit-mo)); height: calc(1260 * var(--launching-unit-mo)); }

  /* 번호 행 — 카드 기준 가운데,
top 46,
gap 16.666 */
.launching__wrap .rv_m__num-row {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(46 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: calc(16.666 * var(--launching-unit-mo));
  }
  .rv_m__num-row .rv__num {
    font-size: calc(33.334 * var(--launching-unit-mo));
    letter-spacing: calc(-0.6666 * var(--launching-unit-mo));
  }
  .rv_m__num-row .rv__num-bar {
    width: calc(1.5 * var(--launching-unit-mo));
    height: calc(25 * var(--launching-unit-mo));
  }
  .rv_m__num-row .rv__num-label {
    font-size: calc(25 * var(--launching-unit-mo));
    letter-spacing: calc(-0.5 * var(--launching-unit-mo));
  }
  /* 카드 타이틀 48units / 카드 기준 top 100 가운데 */
.launching__wrap .rv_m__card-title {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(48 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.96 * var(--launching-unit-mo));
    color: #000000;
    text-align: center;
    white-space: nowrap;
  }
  /* 썸네일 520x756 @ 카드 기준 (68,192) — 3번은 +62 */
  .rv_m__thumb {
    position: absolute;
    left: calc(68 * var(--launching-unit-mo));
    top: calc(192 * var(--launching-unit-mo));
    width: calc(520 * var(--launching-unit-mo));
    height: calc(756 * var(--launching-unit-mo));
    border-radius: calc(16.598 * var(--launching-unit-mo));
    overflow: hidden;
    background: #8a8a8a;
  }
  .rv_m__card--3 .rv_m__thumb { top: calc(254 * var(--launching-unit-mo)); }
  .rv_m__thumb img { width: 100%; height: 100%; object-fit: cover; }
  .rv_m__play {
    position: absolute;
    cursor: pointer;
    left: calc(204 * var(--launching-unit-mo));
    top: calc(322 * var(--launching-unit-mo));
    width: calc(112 * var(--launching-unit-mo));
    height: calc(112 * var(--launching-unit-mo));
    border: calc(2.8 * var(--launching-unit-mo)) solid #ffffff;
    border-radius: 50%;
  }
  .rv_m__play::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-40%, -50%);
    border-left: calc(28 * var(--launching-unit-mo)) solid #ffffff;
    border-top: calc(16.8 * var(--launching-unit-mo)) solid transparent;
    border-bottom: calc(16.8 * var(--launching-unit-mo)) solid transparent;
  }
  /* 인용 박스 520x128 r20 @ 카드 기준 (67,976) — 3번은 +64 */
  .rv_m__quote-box {
    position: absolute;
    left: calc(67 * var(--launching-unit-mo));
    top: calc(976 * var(--launching-unit-mo));
    width: calc(520 * var(--launching-unit-mo));
    height: calc(128 * var(--launching-unit-mo));
    border-radius: calc(20 * var(--launching-unit-mo));
    background: #f6f6f6;
  }
  .rv_m__quote {
    position: absolute;
    left: calc(126 * var(--launching-unit-mo));
    top: calc(1039.26 * var(--launching-unit-mo));
    transform: translateY(-50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 400;
    font-size: calc(25 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-0.5 * var(--launching-unit-mo));
    color: #272727;
    white-space: nowrap;
  }
  .rv_m__qmark {
    position: absolute;
    transform: translateY(-50%);
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 900;
    font-size: calc(56.25 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: calc(-1.125 * var(--launching-unit-mo));
    color: #cbcbcb;
  }
  .rv_m__qo { left: calc(52 * var(--launching-unit-mo)); top: calc(1022.38 * var(--launching-unit-mo)); }
  .rv_m__qc { left: calc(576 * var(--launching-unit-mo)); top: calc(1085.92 * var(--launching-unit-mo)); }
.launching__wrap .rv_m__handle {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(1139 * var(--launching-unit-mo));
    width: max-content;
    margin: 0 auto;
    transform: translateY(-50%);
    font-family: "Mont", "Onemobile", sans-serif;
    font-weight: 400;
    font-size: calc(20 * var(--launching-unit-mo));
    line-height: 1.3;
    color: #6c6c6c;
    text-align: center;
    white-space: nowrap;
  }
  /* 3번 카드는 타이틀이 2줄 -> 썸네일 이하 전부 +64 */
  .rv_m__card--3 .rv_m__quote-box { top: calc(1040 * var(--launching-unit-mo)); }
  .rv_m__card--3 .rv_m__quote     { top: calc(1103.26 * var(--launching-unit-mo)); }
  .rv_m__card--3 .rv_m__qo        { top: calc(1086.38 * var(--launching-unit-mo)); }
  .rv_m__card--3 .rv_m__qc        { top: calc(1149.92 * var(--launching-unit-mo)); }
  .rv_m__card--3 .rv_m__handle    { top: calc(1203 * var(--launching-unit-mo)); }
  /* MO 시안에는 각주가 없다 */
  .rv__footnote { display: none; }
}

/* ==========================================================================
   #foot — 피그마 243:4400(PC 1920x1008, A-B 공통) / 243:4904(MO 375x600, x2 -> 750x1200)
   배경 KV 위 70% 블랙 딤은 CSS(::before). 타이틀 그래픽은 main_title.png 재활용.
   필요 이미지(export 대기, 딤 제외한 원본 KV):
     foot_bg.jpg    PC 1920x1008
     foot_bg_m.jpg  MO 375x600 (@2x 750x1200)
   ========================================================================== */
#foot.launching__section {
  position: relative;
  width: 100%;
  aspect-ratio: 1920 / 1008;
  overflow: hidden;
  background: #000000 url("/content/dam/glo-kr/mcs/images/event/hyperproplus/launching/foot_bg.jpg") no-repeat center center / cover;
}
/* 딤 없음: 배경 export(foot_bg/foot_bg_m)에 시안의 70% 블랙 딤이 포함되어 있음.
   (CSS 딤을 얹으면 이중으로 어두워짐 — 딤 없는 원본으로 교체 시 아래 주석 해제)
#foot.launching__section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
} */
.ft__stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1920px;
  height: 1008px;
  transform: translate(-50%, -50%) scale(calc(100vw / 1920 / 1px));
}
.ft__point { color: #fe5000; }

/* "+로 더 쉽게" 그래픽 339.8x59.5, 중앙 Y:327 */
.ft__title-img {
  position: absolute;
  left: 50%;
  top: 327px;
  transform: translateX(-50%);
  width: 339.8px;
  max-width: none;
}
.ft__title {
  position: absolute;
  left: 50%;
  top: 470px;
  transform: translate(-50%, -50%);
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 52px;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
}
.ft__btns {
  position: absolute;
  left: 50%;
  top: 623px;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 20px;
}
.ft__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 262px;
  height: 54.46px;
  border-radius: 51.52px;
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 1.3;
  text-decoration: none;
  white-space: nowrap;
}
.ft__btn--buy {
  background: #fe5000;
  color: #ffffff;
}
.ft__btn--more {
  border: 2px solid #fe5000;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  color: #fe5000;
}

/* MO 스테이지: 기본 숨김 */
.ft_stage_m { display: none; }

@media (max-width: 750px) {
  #foot.launching__section {
    --launching-unit-mo: 0.133333vw;
    aspect-ratio: 750 / 1200;
    background-image: url("/content/dam/glo-kr/mcs/images/event/hyperproplus/launching/foot_bg_m.jpg");
  }
  .ft__stage { display: none; }
  .ft_stage_m {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }
  /* "+로 더 쉽게" 354.2, 중앙 Y:356 */
  .ft_m__title-img {
    position: absolute;
    left: 50%;
    top: calc(356 * var(--launching-unit-mo));
    transform: translateX(-50%);
    width: calc(354.2 * var(--launching-unit-mo));
    max-width: none;
  }
  .ft_m__title {
    position: absolute;
    left: 50%;
    top: calc(494 * var(--launching-unit-mo));
    transform: translate(-50%, -50%);
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(48 * var(--launching-unit-mo));
    line-height: 1.3;
    letter-spacing: -0.02em;
    color: #ffffff;
    text-align: center;
    white-space: nowrap;
  }
  /* 버튼 세로 스택 382.1x79.4, Y:636 / 735.4 */
  .ft_m__btn {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: calc(382.1 * var(--launching-unit-mo));
    height: calc(79.4 * var(--launching-unit-mo));
    border-radius: calc(75.1 * var(--launching-unit-mo));
    font-family: "Onemobile", "Mont", sans-serif;
    font-weight: 700;
    font-size: calc(29.2 * var(--launching-unit-mo));
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
  }
  .ft_m__btn.ft__btn--buy { top: calc(636 * var(--launching-unit-mo)); }
  .ft_m__btn--more {
    top: calc(735.4 * var(--launching-unit-mo));
    border-width: calc(2.9 * var(--launching-unit-mo));
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
  }
}

/* ==========================================================================
   모션 최소화 설정 — 최종 상태로 고정
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  /* 게이지는 가득 찬 상태, 디스플레이는 마지막 컷(Bye)으로 고정 */
  .it__gauge--2 { clip-path: inset(0.6% 0px 0px round 13.99px 13.99px 0px 0px) !important; }
  .it__screen-mask--3, .it_m__screen-mask--3 { opacity: 1 !important; }
  .it__screen img, .it_m__screen img { opacity: 0 !important; }
  .it__scr--bye, .it_m__scr--bye { opacity: 1 !important; }
}

/* ==========================================================================
   #notice — 유의사항 아코디언
   preorder #notice(.pr-notice)와 동일한 구조·수치. 단위만 launching 것으로 바꿨다
   (--preorder-unit -> --launching-unit, --preorder-unit-mo -> --launching-unit-mo).
   검정바(#262626, H:120) + #333 본문. 바 전체가 토글 버튼이고
   본문은 max-height 트랜지션으로 slideUp/Down 한다(기본 열림).

   ※ 그룹 제목은 <p> 라서 `.launching__wrap p { margin: 0 }`(명시도 0,1,1)에
     margin 이 먹힌다. 그래서 선택자 앞에 .launching__wrap 을 붙여 (0,2,0)으로 올린다.
   ========================================================================== */
#notice.pr-notice {
  position: relative;
  width: 100%;
  background: #333333;
  overflow: hidden;
}

.pr-notice__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: calc(120 * var(--launching-unit));
  padding: 0 calc(227 * var(--launching-unit)) 0 calc(238 * var(--launching-unit));
  border: 0;
  background: #262626;
  cursor: pointer;
}
.pr-notice__bar-left {
  display: flex;
  align-items: center;
  gap: calc(33 * var(--launching-unit));
}
.pr-notice__icon {
  width: calc(50 * var(--launching-unit));
  height: calc(50 * var(--launching-unit));
  max-width: none;
}
.pr-notice__label {
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: calc(28 * var(--launching-unit));
  line-height: 1;
  letter-spacing: -0.02em;
  color: #ffffff;
  white-space: nowrap;
}
/* 화살표: 열림 = 위(∧), 닫힘 = 180도 회전 */
.pr-notice__arrow {
  width: calc(50 * var(--launching-unit));
  height: calc(50 * var(--launching-unit));
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cpath d='M13 30.5 25 18.5 37 30.5' fill='none' stroke='%23ffffff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform 0.3s ease-in-out;
}
.pr-notice.is-closed .pr-notice__arrow { transform: rotate(180deg); }

.pr-notice__body {
  overflow: hidden;
  transition: max-height 0.4s ease-in-out;
}
.pr-notice__inner {
  padding: calc(60 * var(--launching-unit)) calc(227 * var(--launching-unit)) calc(60 * var(--launching-unit)) calc(227.55 * var(--launching-unit));
}
.pr-notice__group {
  margin: 0 0 calc(40 * var(--launching-unit));
}
.pr-notice__group:last-child { margin-bottom: 0; }
.launching__wrap .pr-notice__group-title {
  margin: 0 0 calc(24 * var(--launching-unit));
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 700;
  font-size: calc(28 * var(--launching-unit));
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #ffffff;
}
.pr-notice__list {
  margin: 0;
  padding: 0 0 0 calc(30 * var(--launching-unit));
  list-style: disc;
}
.pr-notice__list li {
  font-family: "Onemobile", "Mont", sans-serif;
  font-weight: 400;
  font-size: calc(20 * var(--launching-unit));
  line-height: 1.7;
  letter-spacing: -0.02em;
  color: #ffffff;
}
.pr-notice__en { font-family: "Mont", "Onemobile", sans-serif; }

@media (max-width: 750px) {
  /* MO: 바 H:140(70x2), 아이콘 64, 라벨 36, 본문 패딩 48/36 */
  #notice.pr-notice {
    --launching-unit-mo: 0.133333vw;
  }
  .pr-notice__bar {
    height: calc(140 * var(--launching-unit-mo));
    padding: 0 calc(48 * var(--launching-unit-mo));
  }
  .pr-notice__bar-left { gap: calc(20 * var(--launching-unit-mo)); }
  .pr-notice__icon {
    width: calc(64 * var(--launching-unit-mo));
    height: calc(64 * var(--launching-unit-mo));
  }
  .pr-notice__label { font-size: calc(36 * var(--launching-unit-mo)); }
  .pr-notice__arrow {
    width: calc(80 * var(--launching-unit-mo));
    height: calc(80 * var(--launching-unit-mo));
  }
  .pr-notice__inner {
    padding: calc(48 * var(--launching-unit-mo)) calc(36 * var(--launching-unit-mo));
  }
  .pr-notice__group { margin-bottom: calc(40 * var(--launching-unit-mo)); }
  .pr-notice__group:last-child { margin-bottom: 0; }
  .launching__wrap .pr-notice__group-title {
    margin-bottom: calc(24 * var(--launching-unit-mo));
    font-size: calc(28 * var(--launching-unit-mo));
    line-height: 1.3;
  }
  .pr-notice__list { padding-left: calc(40 * var(--launching-unit-mo)); }
  .pr-notice__list li {
    font-size: calc(24 * var(--launching-unit-mo));
    line-height: 1.6;
  }
}