@charset "UTF-8";
/* ============================================================
   o2onewcoupon — (2026.10.20)
   ============================================================ */
body .bat-wrapper { max-width: unset; }
.aem-Grid-Container--xxl { max-width: unset; margin: 0; }
.o2o__wrap { --o2o-unit: 0.0520833vw; --font-en: "Mont"; --font-kr: "Onemobile"; position: relative; width: 100%; overflow: hidden; background: linear-gradient(163.04deg, #000000 22.26%, #666666 80.25%); font-family: var(--font-en), var(--font-kr), sans-serif; color: #ffffff; word-break: keep-all; }
.o2o__wrap, .o2o__wrap * { box-sizing: border-box; }
.o2o__wrap img { max-width: 100%; display: block; }
.o2o__wrap p, .o2o__wrap h2, .o2o__wrap h3, .o2o__wrap ul, .o2o__wrap li { margin: 0; padding: 0; }
.o2o__wrap ul { list-style: none; }
.o2o__num { font-family: var(--font-en); font-style: normal; }
.o2o__disc { position: absolute; margin: 0; font-family: "NotoSans", sans-serif; font-weight: 400; font-size: calc(15 * var(--o2o-unit)); line-height: 1.3; letter-spacing: -0.03em; color: #ffffff; white-space: nowrap; }
.o2o__disc .o2o__num { font-weight: 400; }
.reveal { --reveal-y: calc(80 * var(--o2o-unit, 0.0520833vw)); opacity: 0; transform: translateY(var(--reveal-y, 0)); transition: opacity 1.4s ease, transform 1.4s ease; will-change: opacity, transform; }
.reveal.is-visible { --reveal-y: 0px; opacity: 1; }
.fx__tran_05 { transition-delay: 0.05s; }
.fx__tran_10 { transition-delay: 0.10s; }
.fx__tran_15 { transition-delay: 0.15s; }
.o2o__pc-only { display: block; }
.o2o__mo-only { display: none; }
.o2o__wrap img.o2o__pc-only { display: block; }
.o2o__wrap img.o2o__mo-only { display: none; }
.o2o__mo-br, .o2o__mo-indent { display: none; }
/*01. KV — 1920 x 1008*/
.o2o__kv { position: relative; width: 100%; height: calc(1008 * var(--o2o-unit)); background: url("/content/dam/glo-kr/mcs/images/glo_membership/o2newcoupon/kv_bg.png") no-repeat center top / 100% 100%; }
.o2o__kv-logo { position: absolute; left: calc(243.5 * var(--o2o-unit)); top: calc(49.3 * var(--o2o-unit)); width: calc(195 * var(--o2o-unit)); }
.o2o__kv-badge { position: absolute; left: calc(1509 * var(--o2o-unit)); top: calc(78 * var(--o2o-unit)); width: calc(337.05 * var(--o2o-unit)); }
.o2o__kv-eyebrow { position: absolute; left: calc(240 * var(--o2o-unit)); top: calc(334.5 * var(--o2o-unit)); font-family: var(--font-kr), sans-serif; font-weight: 700; font-size: calc(69.927 * var(--o2o-unit)); line-height: 1.2; white-space: nowrap; }
.o2o__kv-title { position: absolute; left: calc(240 * var(--o2o-unit)); top: calc(433.5 * var(--o2o-unit)); font-family: var(--font-kr), sans-serif; font-weight: 700; font-size: calc(100 * var(--o2o-unit)); line-height: 1.2; white-space: nowrap; }
.o2o__kv-disc { left: calc(60 * var(--o2o-unit)); top: calc(968.5 * var(--o2o-unit)); letter-spacing: -0.02em; }
/*COMMON*/
.o2o__body { position: relative; width: 100%; }
.o2o__sec { position: relative; width: 100%; }
.o2o__on  { height: calc(1209 * var(--o2o-unit)); }
.o2o__off { height: calc(1116 * var(--o2o-unit)); }
.o2o__usage--on  { height: calc(830 * var(--o2o-unit)); }
.o2o__usage--off { height: calc(923 * var(--o2o-unit)); }
.o2o__pill { position: absolute; left: calc(780 * var(--o2o-unit)); top: calc(142 * var(--o2o-unit)); width: calc(360 * var(--o2o-unit)); height: calc(54 * var(--o2o-unit)); border-radius: calc(50 * var(--o2o-unit)); background: #ffffff; display: flex; align-items: center; justify-content: center; font-family: var(--font-en); font-weight: 700; font-size: calc(29 * var(--o2o-unit)); line-height: 1.3; color: #fe5000; white-space: nowrap; }
.o2o__title { position: absolute; left: 0; top: calc(214 * var(--o2o-unit)); width: 100%; text-align: center; font-family: var(--font-kr), sans-serif; font-weight: 700; font-size: calc(62 * var(--o2o-unit)); line-height: 1.3; letter-spacing: -0.02em; white-space: nowrap; }
.o2o__title > .o2o__pc-only, .o2o__title > .o2o__mo-only { white-space: nowrap; }
.o2o__item { position: absolute; width: calc(458.94 * var(--o2o-unit)); height: calc(316.56 * var(--o2o-unit)); }
.o2o__on .o2o__item--1 { left: calc(486.47 * var(--o2o-unit)); top: calc(349 * var(--o2o-unit)); }
.o2o__on .o2o__item--2 { left: calc(975.41 * var(--o2o-unit)); top: calc(349 * var(--o2o-unit)); }
.o2o__on .o2o__item--3 { left: calc(486.47 * var(--o2o-unit)); top: calc(695.56 * var(--o2o-unit)); }
.o2o__on .o2o__item--4 { left: calc(975.41 * var(--o2o-unit)); top: calc(695.56 * var(--o2o-unit)); }
.o2o__off .o2o__item { height: calc(372.08 * var(--o2o-unit)); }
.o2o__off .o2o__item--1 { left: calc(486.47 * var(--o2o-unit)); top: calc(566 * var(--o2o-unit)); }
.o2o__off .o2o__item--2 { left: calc(975.41 * var(--o2o-unit)); top: calc(566 * var(--o2o-unit)); }
.o2o__card { --c: var(--o2o-unit); position: relative; width: calc(458.94 * var(--c)); height: calc(236.73 * var(--c)); }
.o2o__wrap .o2o__card-img { position: absolute; left: calc(-8 * var(--c)); top: 0; width: calc(475 * var(--c)); height: calc(253 * var(--c)); max-width: none; }
.o2o__price { position: absolute; margin: 0; color: #fe5000; line-height: 1.1; white-space: nowrap; }
.o2o__price-num { display: inline-block; font-family: var(--font-en); font-weight: 700; font-size: calc(63.943 * var(--c)); letter-spacing: -0.05em; }
.o2o__price-won { font-family: var(--font-kr), sans-serif; font-weight: 700; font-size: calc(34.012 * var(--c)); letter-spacing: -0.03em; }
.o2o__label { position: absolute; margin: 0; font-family: var(--font-kr), sans-serif; font-weight: 700; line-height: 1.5; letter-spacing: calc(-0.6122 * var(--c)); white-space: nowrap; }
.o2o__label-main { display: block; font-size: calc(20.4 * var(--c)); color: #2b2b2b; }
.o2o__label-sub { display: block; font-size: calc(15.652 * var(--c)); color: #fe5000; }
.o2o__label-sub .o2o__num { font-weight: 600; }
.o2o__card .o2o__price { margin-top: calc(4.73 * var(--c)); }
.o2o__price-won { position: relative; top: -0.3246em; }
.o2o__label-main { position: relative; top: calc(3.15 * var(--c)); }
.o2o__label-sub { position: relative; top: calc(1.58 * var(--c)); }
.o2o__card--1 .o2o__price-num { width: calc(195.91 * var(--c)); }
.o2o__card--2 .o2o__price-num { width: calc(181.91 * var(--c)); }
.o2o__card--3 .o2o__price-num { width: calc(162 * var(--c)); }
.o2o__card--4 .o2o__price-num { width: calc(149 * var(--c)); }
.o2o__card--1 .o2o__price { left: calc(17 * var(--c));    top: calc(60 * var(--c)); }
.o2o__card--1 .o2o__label { left: calc(18.36 * var(--c)); top: calc(124.81 * var(--c)); }
.o2o__card--2 .o2o__price { left: calc(17.3 * var(--c));  top: calc(60 * var(--c)); }
.o2o__card--2 .o2o__label { left: calc(18.67 * var(--c)); top: calc(124.81 * var(--c)); }
.o2o__card--3 .o2o__price,
.o2o__card--4 .o2o__price { left: calc(16.94 * var(--c)); top: calc(59.57 * var(--c)); }
.o2o__card--3 .o2o__label,
.o2o__card--4 .o2o__label { left: calc(18.3 * var(--c));  top: calc(124.38 * var(--c)); }
.o2o__btns { position: absolute; left: 0; right: 0; top: calc(275.08 * var(--o2o-unit)); display: flex; flex-direction: column; align-items: center; gap: calc(14 * var(--o2o-unit)); }
.o2o__btn { height: calc(41.48 * var(--o2o-unit)); padding: 0 calc(45.39 * var(--o2o-unit)); border-radius: calc(46.96 * var(--o2o-unit)); background: #fe5000; display: flex; align-items: center; justify-content: center; font-family: var(--font-kr), sans-serif; font-weight: 700; font-size: calc(15.652 * var(--o2o-unit)); line-height: 1.3; letter-spacing: -0.02em; color: #ffffff; text-decoration: none; white-space: nowrap; }
.o2o__btn--fix { width: calc(210 * var(--o2o-unit)); padding: 0; }
.o2o__btn--fix:first-child { height: calc(42 * var(--o2o-unit)); }
.o2o__on-disc  { left: calc(60 * var(--o2o-unit)); top: calc(1113 * var(--o2o-unit)); }
.o2o__off-disc { left: calc(60 * var(--o2o-unit)); top: calc(1037.06 * var(--o2o-unit)); }
.o2o__notice { position: absolute; left: calc(587 * var(--o2o-unit)); top: calc(416 * var(--o2o-unit)); font-family: var(--font-kr), sans-serif; font-weight: 400; font-size: calc(20 * var(--o2o-unit)); line-height: 1.5; letter-spacing: -0.02em; color: #ffffff; white-space: nowrap; }
.o2o__notice li { position: relative; padding-left: calc(13 * var(--o2o-unit)); }
.o2o__notice li::before { content: ""; position: absolute; left: 0; top: calc(12 * var(--o2o-unit)); width: calc(6 * var(--o2o-unit)); height: calc(6 * var(--o2o-unit)); border-radius: 50%; background: #ffffff; }
.o2o__usage-title { position: absolute; left: 0; top: calc(150 * var(--o2o-unit)); width: 100%; text-align: center; font-family: var(--font-kr), sans-serif; font-weight: 700; font-size: calc(62 * var(--o2o-unit)); line-height: 1.3; letter-spacing: -0.02em; white-space: nowrap; }
.o2o__timeline { position: absolute; left: calc(364.07 * var(--o2o-unit)); top: calc(588.86 * var(--o2o-unit)); width: calc(1193.71 * var(--o2o-unit)); height: calc(2 * var(--o2o-unit)); background: #ffffff; }
.o2o__timeline-dot { position: absolute; top: calc(-4.715 * var(--o2o-unit)); width: calc(11.43 * var(--o2o-unit)); height: calc(11.43 * var(--o2o-unit)); border-radius: 50%; background: #ffffff; }
.o2o__timeline-dot--1 { left: calc(-2.285 * var(--o2o-unit)); }
.o2o__timeline-dot--2 { left: calc(385.905 * var(--o2o-unit)); }
.o2o__timeline-dot--3 { left: calc(794.095 * var(--o2o-unit)); }
.o2o__timeline-dot--4 { left: calc(1182.715 * var(--o2o-unit)); }
.o2o__step { position: absolute; top: calc(291 * var(--o2o-unit)); width: calc(379.61 * var(--o2o-unit)); height: calc(390 * var(--o2o-unit)); }
.o2o__step--1 { left: calc(361.78 * var(--o2o-unit)); }
.o2o__step--2 { left: calc(769.98 * var(--o2o-unit)); }
.o2o__step--3 { left: calc(1178.17 * var(--o2o-unit)); }
.o2o__step-card { width: 100%; height: calc(222.96 * var(--o2o-unit)); border-radius: calc(22.868 * var(--o2o-unit)); background: #ffffff; overflow: hidden; }
.o2o__usage--off .o2o__step-card { background: #f6f6f6; }
.o2o__step-card img { width: 100%; height: 100%; }
.o2o__step-label { position: absolute; left: 0; top: calc(257.27 * var(--o2o-unit)); width: 100%; text-align: center; font-family: var(--font-en); font-weight: 600; font-size: calc(26 * var(--o2o-unit)); line-height: 1.3; letter-spacing: -0.02em; color: #acf92e; white-space: nowrap; }
.o2o__step-desc { position: absolute; left: 0; top: calc(321.06 * var(--o2o-unit)); width: 100%; text-align: center; font-family: var(--font-kr), sans-serif; font-weight: 400; font-size: calc(26 * var(--o2o-unit)); line-height: 1.3; letter-spacing: -0.02em; color: #ffffff; white-space: nowrap; }
.o2o__step-note { position: absolute; left: 0; top: calc(404.75 * var(--o2o-unit)); width: 100%; text-align: center; font-family: var(--font-kr), sans-serif; font-weight: 400; font-size: calc(17 * var(--o2o-unit)); line-height: 1.5; letter-spacing: -0.02em; color: #ffffff; white-space: nowrap; }
/* ============================================================
   MOBILE
   ============================================================ */
@media (max-width: 768px) {
  .o2o__wrap { --o2o-unit: 0.133333vw; background: #151515; }
  .o2o__pc-only { display: none !important; }
  .o2o__mo-only { display: block; }
  .o2o__wrap img.o2o__pc-only { display: none; }
  .o2o__wrap img.o2o__mo-only { display: block; }
  .o2o__mo-br { display: inline; }
  .o2o__mo-indent { display: inline-block; width: calc(9 * var(--o2o-unit)); }
  .o2o__disc { font-size: calc(18 * var(--o2o-unit)); letter-spacing: -0.02em; }
  .o2o__kv { height: calc(1200 * var(--o2o-unit)); background: #151515 url("/content/dam/glo-kr/mcs/images/glo_membership/o2newcoupon/kv_bg_m.png") no-repeat center top / 100% 100%; margin-bottom: -1px; }
  .o2o__kv-logo { left: calc(52 * var(--o2o-unit)); top: calc(32.76 * var(--o2o-unit)); width: calc(128 * var(--o2o-unit)); }
  .o2o__kv-badge { left: calc(472 * var(--o2o-unit)); top: calc(50 * var(--o2o-unit)); width: calc(228 * var(--o2o-unit)); }
  .o2o__kv-eyebrow { left: 0; top: calc(184 * var(--o2o-unit)); width: 100%; text-align: center; font-size: calc(56 * var(--o2o-unit)); }
  .o2o__kv-title { left: 0; top: calc(262 * var(--o2o-unit)); width: 100%; text-align: center; font-size: calc(80 * var(--o2o-unit)); }
  .o2o__kv-disc { left: calc(30 * var(--o2o-unit)); top: calc(1156 * var(--o2o-unit)); }
  .o2o__body { background: linear-gradient(180deg, #151515 0%, #4b4b4b 106.07%); }
  .o2o__on  { height: calc(2800 * var(--o2o-unit)); }
  .o2o__usage--on  { height: calc(2100 * var(--o2o-unit)); }
  .o2o__off { height: calc(2200 * var(--o2o-unit)); }
  .o2o__usage--off { height: calc(2354 * var(--o2o-unit)); }
  .o2o__pill { left: calc(186 * var(--o2o-unit)); top: calc(152 * var(--o2o-unit)); width: calc(374 * var(--o2o-unit)); height: calc(58 * var(--o2o-unit)); border-radius: calc(80 * var(--o2o-unit)); font-size: calc(32 * var(--o2o-unit)); }
  .o2o__off .o2o__pill { top: calc(66 * var(--o2o-unit)); }
  .o2o__title { top: calc(230 * var(--o2o-unit)); font-size: calc(56 * var(--o2o-unit)); }
  .o2o__off .o2o__title { top: calc(144 * var(--o2o-unit)); }
  .o2o__card { --c: calc(var(--o2o-unit) * 1.268183); }
  .o2o__item { width: calc(582 * var(--o2o-unit)); height: calc(440.84 * var(--o2o-unit)); }
  .o2o__on .o2o__item--1 { left: calc(82 * var(--o2o-unit)); top: calc(424 * var(--o2o-unit)); }
  .o2o__on .o2o__item--2 { left: calc(82 * var(--o2o-unit)); top: calc(964.84 * var(--o2o-unit)); }
  .o2o__on .o2o__item--3 { left: calc(82 * var(--o2o-unit)); top: calc(1505.68 * var(--o2o-unit)); }
  .o2o__on .o2o__item--4 { left: calc(82 * var(--o2o-unit)); top: calc(2046.52 * var(--o2o-unit)); }
  .o2o__off .o2o__item { height: calc(554.84 * var(--o2o-unit)); }
  .o2o__off .o2o__item--1 { left: calc(82 * var(--o2o-unit)); top: calc(684 * var(--o2o-unit)); }
  .o2o__off .o2o__item--2 { left: calc(82 * var(--o2o-unit)); top: calc(1338.84 * var(--o2o-unit)); }
  .o2o__btns { top: calc(348.84 * var(--o2o-unit)); gap: calc(22 * var(--o2o-unit)); }
  .o2o__btn { height: calc(92 * var(--o2o-unit)); padding: 0 calc(98 * var(--o2o-unit)); border-radius: calc(59.55 * var(--o2o-unit)); font-size: calc(34 * var(--o2o-unit)); }
  .o2o__btn--fix, .o2o__btn--fix:first-child { width: calc(442 * var(--o2o-unit)); height: calc(92 * var(--o2o-unit)); padding: 0; }
  .o2o__on-disc  { left: calc(28 * var(--o2o-unit)); top: calc(2587.36 * var(--o2o-unit)); }
  .o2o__off-disc { left: calc(28 * var(--o2o-unit)); top: calc(1993.68 * var(--o2o-unit)); }
  .o2o__notice { left: calc(76 * var(--o2o-unit)); top: calc(420 * var(--o2o-unit)); font-size: calc(22 * var(--o2o-unit)); line-height: calc(32 * var(--o2o-unit)); }
  .o2o__notice li { padding-left: calc(22.1 * var(--o2o-unit)); }
  .o2o__notice li::before { top: calc(12.86 * var(--o2o-unit)); width: calc(7.43 * var(--o2o-unit)); height: calc(7.43 * var(--o2o-unit)); }

  .o2o__usage-title { font-size: calc(56 * var(--o2o-unit)); }
  .o2o__usage--on .o2o__usage-title  { top: calc(67.36 * var(--o2o-unit)); }
  .o2o__usage--off .o2o__usage-title { top: calc(25.68 * var(--o2o-unit)); }
  .o2o__step { left: calc(90 * var(--o2o-unit)); width: calc(566 * var(--o2o-unit)); height: calc(560 * var(--o2o-unit)); }
  .o2o__step--1, .o2o__step--2, .o2o__step--3 { left: calc(90 * var(--o2o-unit)); }
  .o2o__usage--on .o2o__step--1  { top: calc(199.36 * var(--o2o-unit)); }
  .o2o__usage--on .o2o__step--2  { top: calc(813.36 * var(--o2o-unit)); }
  .o2o__usage--on .o2o__step--3  { top: calc(1451.36 * var(--o2o-unit)); }
  .o2o__usage--off .o2o__step--1 { top: calc(157.68 * var(--o2o-unit)); }
  .o2o__usage--off .o2o__step--2 { top: calc(942 * var(--o2o-unit)); }
  .o2o__usage--off .o2o__step--3 { top: calc(1580 * var(--o2o-unit)); }
  .o2o__step-card { height: calc(332 * var(--o2o-unit)); border-radius: calc(20 * var(--o2o-unit)); }
  .o2o__usage--off .o2o__step--3 .o2o__step-card { background: #ffffff; }
  .o2o__step-label { top: calc(362 * var(--o2o-unit)); font-size: calc(40 * var(--o2o-unit)); letter-spacing: 0; }
  .o2o__step-line { position: absolute; left: calc(5 * var(--o2o-unit)); top: calc(418 * var(--o2o-unit)); width: calc(561 * var(--o2o-unit)); height: calc(4 * var(--o2o-unit)); background: #ffffff; }
  .o2o__step-line::before { content: ""; position: absolute; left: calc(-5 * var(--o2o-unit)); top: calc(-8 * var(--o2o-unit)); width: calc(20 * var(--o2o-unit)); height: calc(20 * var(--o2o-unit)); border-radius: 50%; background: #ffffff; }
  .o2o__step-desc { top: calc(442 * var(--o2o-unit)); font-size: calc(40 * var(--o2o-unit)); line-height: 1.4; }
  .o2o__step-note { top: calc(574 * var(--o2o-unit)); font-size: calc(28 * var(--o2o-unit)); }
}
