@charset "utf-8";
/* ============================================================================
   뉴트리미 리뉴얼 메인 CSS — 2026-11-14
   - 기준 시안: 피그마 EVHLxoov2NmsSgVvFkJ3IT 01 메인 데스크탑 749:13265 · 모바일 744:13209
   - 변수(색·글꼴)는 css/renewal.css 의 :root 를 쓴다. 웹셀러_라이브러리 스타일 이름은 주석.
   - 구간: 1024px 이상 PC / 1023px 이하 모바일
   - 불러오는 곳: main/index.html 맨 위
   ========================================================================== */

.nm-main { font-family: var(--nm-font); color: var(--nm-font-black); -webkit-font-smoothing: antialiased; }
.nm-main *, .nm-main *::before, .nm-main *::after { box-sizing: border-box; }
.nm-main a { text-decoration: none; }
.nm-main img { max-width: none; }
.nm-main li { list-style: none; }

/* ── 공통 부품 ─────────────────────────────────────────────────────────── */
/* 버튼(라이브러리 Button_Default, 둥근 100) — 높이 54.4: 위아래 15 + 선 1 (피그마 선은 안쪽) */
.nm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 390px; max-width: 100%; padding: 15px 20px; border: 1px solid transparent; border-radius: 100px; font-size: 16px; font-weight: 600; line-height: 1.4; letter-spacing: -0.4px; white-space: nowrap; cursor: pointer; } /* PC/Body/B1_KR_Sb_16 */
.nm-btn img { display: block; width: 20px; height: 20px; }
.nm-btn--fill, .nm-btn--fill:hover, .nm-btn--fill:focus { background: var(--nm-brand-primary); color: var(--nm-font-white); }
.nm-btn--line, .nm-btn--line:hover, .nm-btn--line:focus { background: var(--nm-bg-white); border-color: var(--nm-brand-primary); color: var(--nm-brand-primary); }
.nm-btn--white, .nm-btn--white:hover, .nm-btn--white:focus { background: var(--nm-bg-white); color: var(--nm-brand-primary); }

/* 번호(01~05) · 제목 · 설명 */
.nm-head { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.nm-head--center { align-items: center; text-align: center; }
.nm-num { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.nm-head--center .nm-num { align-items: center; }
.nm-num b { display: block; font-size: 24px; font-weight: 600; line-height: 1.4; letter-spacing: -0.6px; color: var(--nm-brand-primary); } /* PC/Headline/H5_KR_Sb_24 */
.nm-num i { display: block; width: 32px; height: 2px; background: var(--nm-brand-primary); }
.nm-tit { font-size: 40px; font-weight: 400; line-height: 1.3; letter-spacing: -1px; color: var(--nm-font-black); } /* PC/Headline/H2 40 */
.nm-tit span { display: block; }
.nm-tit strong { font-weight: 700; color: var(--nm-brand-primary); }
.nm-tit strong.is-black { color: var(--nm-font-black); }
.nm-desc { font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: -0.45px; color: var(--nm-font-sub); } /* PC/Title/T5_KR_Rg_18 · Font/03_Sub */
.nm-desc span { display: block; }
.nm-desc strong { font-weight: 700; color: var(--nm-font-black); }
.nm-desc--dark { color: var(--nm-font-black); }

/* 넘김 표시(모바일 막대 1 + 점) */
.nm-dots { display: flex; justify-content: center; gap: 4px; padding-top: 4px; }
.nm-dots button, .nm-dots i { display: block; width: 6px; height: 4px; padding: 0; border: 0; border-radius: 2px; background: var(--nm-line-dd); cursor: pointer; transition: width .2s; }
.nm-dots .is-on { width: 18px; background: var(--nm-text-333); }

/* 가로 넘김(모바일) — 스크롤 막대 숨김 */
.nm-scroll { display: flex; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scroll-snap-type: x mandatory; scrollbar-width: none; }
.nm-scroll::-webkit-scrollbar { display: none; }
.nm-scroll > * { scroll-snap-align: start; }

/* 별점(라이브러리 Star Fill 16) — 점수보다 큰 별은 흐리게(시안에 없음: 4점 후기 대비) */
.nm-rate { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.nm-rate__stars { display: flex; }
.nm-rate__stars img { display: block; width: 16px; height: 16px; }
.nm-rate[data-score="4"] .nm-rate__stars img:nth-child(n+5), .nm-rate[data-score="3"] .nm-rate__stars img:nth-child(n+4),
.nm-rate[data-score="2"] .nm-rate__stars img:nth-child(n+3), .nm-rate[data-score="1"] .nm-rate__stars img:nth-child(n+2) { opacity: .2; }
.nm-rate__num { font-size: 14px; font-weight: 600; line-height: 1.45; color: var(--nm-font-black); } /* PC/Body/B3_EN_Sb_14 */

/* 후기 카드(NM2/메인/ConsultReviewCard 760:13713) — 고객 후기·상담 후기 공용 */
.nm-rcard { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 24px; border-radius: 16px; background: var(--nm-bg-light); color: var(--nm-font-black); } /* BG/Light_Color */
.nm-rcard__head { display: flex; align-items: flex-start; justify-content: space-between; width: 100%; gap: 8px; }
.nm-rcard__who { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.nm-rcard__name { font-size: 16px; font-weight: 600; line-height: 1.4; letter-spacing: -0.4px; color: var(--nm-font-black); } /* PC/Body/B1_KR_Sb_16 */
.nm-rcard__date { font-size: 13px; font-weight: 400; line-height: 1.45; letter-spacing: -0.325px; color: var(--nm-font-info); } /* PC/Caption/C1_KR_Rg_13 · Font/04_info */
.nm-rcard__sub { width: 100%; font-size: 14px; font-weight: 600; line-height: 1.45; letter-spacing: -0.35px; color: var(--nm-brand-primary); } /* PC/Body/B3_KR_Sb_14 */
.nm-rcard__txt { width: 100%; font-size: 15px; font-weight: 400; line-height: 1.45; letter-spacing: -0.375px; color: var(--nm-font-black); white-space: pre-line; word-break: keep-all; overflow-wrap: anywhere; } /* PC/Body/B2_KR_Rg_15 */
.nm-rcard__photo { display: block; width: 88px; height: 88px; border-radius: 8px; object-fit: cover; }

/* ============================================================================
   상단 띠배너 2칸 (PC 749:13310 · NM2/BannerCard 446:278 / 모바일 744:13218)
   ========================================================================== */
.nm-band { padding-top: 32px; }
.nm-band__row { display: flex; gap: 24px; }
.nm-band__item { display: flex; flex: 1 1 0; min-width: 0; align-items: center; justify-content: space-between; gap: 12px; padding: 28px 32px; border-radius: 16px; background: var(--nm-bg-light); color: var(--nm-font-black); }
.nm-band__txt { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.nm-band__label { font-size: 13px; font-weight: 400; line-height: 1.45; letter-spacing: -0.325px; color: var(--nm-brand-primary); } /* PC/Caption/C1_KR_Rg_13 */
.nm-band__title { font-size: 20px; font-weight: 600; line-height: 1.4; letter-spacing: -0.5px; color: var(--nm-font-black); } /* PC/Title/T4_KR_Sb_20 */
.nm-band__arrow img { display: block; width: 24px; height: 24px; }
.nm-band__arrow-mo { display: none; }

/* ============================================================================
   히어로 · 사진 4장 롤링 (PC 749:13325 / 모바일 744:13231 · 롤링 부품 372:41: 4초 · 0.45초 디졸브)
   ========================================================================== */
.nm-hero { padding: 64px 0 120px; }
.nm-hero__row { display: flex; align-items: center; gap: 80px; }
.nm-hero__text { display: flex; flex-direction: column; gap: 48px; flex: 0 0 560px; }
.nm-hero__tit { font-size: 56px; font-weight: 700; line-height: 1.3; letter-spacing: -1.4px; color: var(--nm-font-black); white-space: nowrap; } /* PC/Display/KR_D6 56 */
.nm-hero__tit span { display: block; }
.nm-hero__tit strong { display: block; font-weight: 700; color: var(--nm-brand-primary); }
.nm-hero__btns { display: flex; flex-direction: column; gap: 12px; }
.nm-hero__photo { position: relative; flex: 0 1 640px; min-width: 0; }
.nm-hero__frame { position: relative; height: 0; padding-top: 117.5%; overflow: hidden; border-radius: 24px; background: var(--nm-bg-light); } /* 640×752 */
.nm-hero__slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity .45s ease; }
.nm-hero__slide.is-on { opacity: 1; z-index: 1; }
.nm-hero__slide img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nm-hero__fade { display: none; }
/* 넘김 표시 1 / 4 + 재생·정지 (라이브러리 페이지 표시, Opacity/Black_60%) */
.nm-hero__pager { position: absolute; right: 24px; bottom: 24px; z-index: 3; display: flex; align-items: center; gap: 2px; padding: 10px 10px 10px 12px; border-radius: 100px; background: rgba(17, 17, 17, .6); }
.nm-hero__count { width: 46px; font-size: 14px; line-height: 1.45; letter-spacing: -0.3px; color: var(--nm-font-white); text-align: center; white-space: nowrap; }
.nm-hero__count b { font-weight: 600; }
.nm-hero__count em { font-style: normal; font-weight: 400; color: rgba(255, 255, 255, .5); }
.nm-hero__ctl { display: block; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 0; background: none; cursor: pointer; opacity: .5; }
.nm-hero__ctl.is-on { opacity: 1; }
.nm-hero__ctl img { display: block; width: 20px; height: 20px; }
.nm-hero__dots { display: none; }

/* ============================================================================
   고객 후기 (PC 749:13363 / 모바일 744:13244)
   ========================================================================== */
.nm-review { padding: 120px 0; }
.nm-review__in { display: flex; flex-direction: column; gap: 32px; }
.nm-review__tit { font-size: 32px; font-weight: 600; line-height: 1.3; letter-spacing: -0.8px; color: var(--nm-font-black); } /* PC/Headline/H3_KR_Sb_32 */
.nm-review__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.nm-review__list > li { display: flex; min-width: 0; }
.nm-review__list .nm-rcard { width: 100%; min-height: 291px; }
.nm-review__list .nm-rcard__sub { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nm-review__list .nm-rcard__txt { display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; }
.nm-review__bar { display: none; }
.nm-review__more { display: flex; justify-content: center; }
.nm-review__more a { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 390px; max-width: 100%; padding: 14px 20px; border: 1px solid var(--nm-line-regular); border-radius: 100px; background: var(--nm-bg-white); font-size: 14px; font-weight: 600; line-height: 1.45; letter-spacing: -0.35px; color: var(--nm-font-black); } /* PC/Body/B3_KR_Sb_14 · Line_Gray */
.nm-review__more img { display: block; width: 20px; height: 20px; }

/* ============================================================================
   방송 영상 (PC 749:13485 · NM2/VideoCard 446:209 / 모바일 744:13346)
   ========================================================================== */
.nm-press { padding: 120px 0; background: var(--nm-bg-light); }
.nm-press__in { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.nm-press__tit { font-size: 32px; font-weight: 700; line-height: 1.3; letter-spacing: -0.8px; color: var(--nm-font-black); text-align: center; }
.nm-press__tit em { font-style: normal; color: var(--nm-brand-primary); }
.nm-press__sub { font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: -0.45px; color: var(--nm-font-sub); text-align: center; } /* PC/Title/T5_KR_Rg_18 */
.nm-press__list { display: flex; gap: 24px; width: 100%; padding: 32px 0 24px; }
.nm-video { display: flex; flex: 1 1 0; min-width: 0; flex-direction: column; gap: 16px; }
.nm-video__thumb { position: relative; display: block; width: 100%; height: 0; padding: 56.21% 0 0; overflow: hidden; border: 0; border-radius: 16px; background: #000; cursor: pointer; } /* 628×353 */
.nm-video__thumb > img, .nm-video__thumb > video { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.nm-video__play { position: absolute; top: 50%; left: 50%; width: 72px; height: 72px; margin: -36px 0 0 -36px; border-radius: 100px; background: rgba(17, 17, 17, .5); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } /* 라이브러리 Play A_Type 72 · Opacity/Black_50% */
.nm-video__play img { position: absolute; top: 50%; left: 50%; display: block; width: 36px; height: 36px; margin: -18px 0 0 -18px; }
.nm-video__play .is-mo { display: none; }
.nm-video__cap { font-size: 18px; font-weight: 500; line-height: 1.4; letter-spacing: -0.45px; color: var(--nm-font-black); } /* PC/Title/T5_KR_Md_18 */
.nm-video.is-playing .nm-video__play { display: none; }
.nm-press__dots { display: none; }
.nm-press__btn { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 11px 16px; border-radius: 100px; background: var(--nm-brand-primary); font-size: 14px; font-weight: 500; line-height: 1.45; letter-spacing: -0.35px; color: var(--nm-font-white); white-space: nowrap; } /* PC/Body/B3_KR_Md_14 */
.nm-press__btn:hover, .nm-press__btn:focus { color: var(--nm-font-white); }
.nm-press__btn img { display: block; width: 16px; height: 16px; }

/* ============================================================================
   고민 말풍선 (PC 749:13515 · NM2/메인D/Bubble 748:13316 · OnePackCard 748:13344 / 모바일 744:13369)
   ========================================================================== */
.nm-worry { padding: 120px 0; }
.nm-worry__in { display: flex; flex-direction: column; align-items: center; gap: 64px; }
.nm-worry__tit { font-size: 32px; font-weight: 700; line-height: 1.3; letter-spacing: -0.8px; color: var(--nm-font-black); text-align: center; }
.nm-worry__tit span { display: block; }
.nm-worry__flow { display: flex; align-items: center; justify-content: center; gap: 72px; }
.nm-worry__bubbles { display: flex; flex-direction: column; gap: 14px; width: 480px; }
.nm-worry__row { display: flex; }
.nm-worry__row:nth-child(odd) { justify-content: flex-end; }
.nm-bubble { display: block; padding: 14px 24px; border-radius: 20px; font-size: 16px; font-weight: 500; line-height: 1.4; letter-spacing: -0.4px; color: var(--nm-font-white); white-space: nowrap; } /* PC/Body/B1_KR_Md_16 */
.nm-worry__row:nth-child(1) .nm-bubble { background: var(--nm-font-black); }    /* Font/02_black */
.nm-worry__row:nth-child(2) .nm-bubble { background: var(--nm-font-sub); }      /* Font/03_Sub */
.nm-worry__row:nth-child(3) .nm-bubble { background: var(--nm-font-info); }     /* Font/04_info */
.nm-worry__row:nth-child(4) .nm-bubble { background: var(--nm-font-disabled); } /* Font/05_Disabled */
.nm-worry__dots img { display: block; }
.nm-worry__dots .is-pc { width: 34px; height: 6px; }
.nm-worry__dots .is-mo { display: none; width: 4px; height: 28px; }
.nm-worry__pack { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.nm-worry__lead { font-size: 20px; font-weight: 700; line-height: 1.4; letter-spacing: -0.5px; color: var(--nm-brand-primary); white-space: nowrap; }
.nm-onepack { width: 400px; overflow: hidden; border-radius: 16px; background: var(--nm-bg-white); box-shadow: 0 4px 16px rgba(0, 0, 0, .08); }
.nm-onepack img { display: block; width: 100%; height: 267px; object-fit: cover; }
.nm-onepack p { padding: 24px 26px 26px; font-size: 20px; font-weight: 700; line-height: 1.4; letter-spacing: -0.5px; color: var(--nm-text-1a); }
.nm-onepack p span { display: block; }
.nm-onepack p strong { display: block; font-weight: 700; color: var(--nm-brand-primary); }

/* ============================================================================
   01 맞춤 영양 관리 (PC 749:13541 · NM2/메인D/StepRow 748:13313 / 모바일 744:13393)
   ========================================================================== */
.nm-steps { padding: 120px 0; background: var(--nm-bg-light); }
.nm-steps__row { display: flex; align-items: center; gap: 80px; }
.nm-steps__row > .nm-head { flex: 0 0 560px; }
.nm-steps__list { display: flex; flex-direction: column; gap: 16px; flex: 0 1 640px; min-width: 0; }
.nm-step { display: flex; align-items: center; gap: 16px; }
.nm-step__no { display: flex; flex: 0 0 36px; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 13px; background: var(--nm-bg-white); font-size: 14px; font-weight: 700; line-height: 1.45; letter-spacing: -0.35px; color: var(--nm-brand-primary); }
.nm-step__card { display: flex; flex: 1 1 0; min-width: 0; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 24px 20px 28px; border-radius: 12px; background: var(--nm-bg-white); box-shadow: 0 4px 16px rgba(0, 0, 0, .08); }
.nm-step__tit { font-size: 18px; font-weight: 700; line-height: 1.4; letter-spacing: -0.45px; color: var(--nm-text-1a); }
.nm-step__card img { display: block; flex: 0 0 48px; width: 48px; height: 48px; object-fit: contain; }

/* ============================================================================
   02 식단까지 챙기는 영양관리 · 상담 후기 9개 (PC 761:14032 3열 / 모바일 761:13725 가로 넘김)
   ========================================================================== */
.nm-consult { padding: 120px 0; }
.nm-consult__in { display: flex; flex-direction: column; gap: 48px; }
.nm-consult__cols { display: flex; align-items: flex-start; gap: 25px; }
.nm-consult__col { display: flex; flex: 1 1 0; min-width: 0; max-width: 410px; flex-direction: column; gap: 24px; }
.nm-consult__dots { display: none; }

/* ============================================================================
   03 하루 영양제 루틴 (PC 749:13570 · NoticeBox 748:13348 · 사례 카드 413:400 / 모바일 744:13424)
   ========================================================================== */
.nm-routine { padding: 120px 0; }
.nm-routine__grid { display: grid; grid-template-columns: 560px minmax(0, 1fr); grid-template-areas: "head cases" "notice cases" "btn cases"; column-gap: 80px; row-gap: 20px; align-items: start; }
.nm-routine__grid > .nm-head { grid-area: head; }
.nm-routine__notice { grid-area: notice; display: flex; flex-direction: column; gap: 12px; padding-top: 20px; }
.nm-routine__btn { grid-area: btn; padding-top: 20px; }
.nm-routine__cases { grid-area: cases; align-self: center; }
.nm-routine__check { font-size: 16px; font-weight: 700; line-height: 1.4; letter-spacing: -0.4px; color: var(--nm-font-black); }
.nm-notice { display: flex; align-items: center; gap: 20px; padding: 20px 24px; border-radius: 12px; background: var(--nm-bg-f8); }
.nm-notice img { display: block; flex: 0 0 48px; width: 48px; height: 48px; object-fit: contain; }
.nm-notice p { font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: -0.4px; color: var(--nm-text-333); }
.nm-notice p span { display: block; }
.nm-notice p strong { font-weight: 700; color: var(--nm-brand-primary); }
.nm-cases { display: flex; gap: 21px; }
.nm-case { position: relative; display: flex; flex: 0 0 199px; flex-direction: column; justify-content: flex-end; gap: 10px; width: 199px; height: 199px; padding: 14px; overflow: hidden; border-radius: 12px; background: #3e7c63; }
.nm-case > img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.nm-case__tags { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.nm-case__tags span { display: block; padding: 3px 8px; border-radius: 100px; background: var(--nm-bg-white); font-size: 11px; font-weight: 500; line-height: 1.45; letter-spacing: -0.275px; color: var(--nm-font-black); white-space: nowrap; } /* 라이브러리 Chip Round/Solid/White · MO/Caption/C3_KR_Md_11 */
.nm-case__txt { position: relative; font-size: 15px; font-weight: 400; line-height: 21px; letter-spacing: -0.3px; color: var(--nm-font-white); white-space: nowrap; }
.nm-case__txt span { display: block; }
.nm-case__txt strong { font-weight: 700; color: #e2f6ca; }
.nm-routine__dots { display: none; }

/* ============================================================================
   04 건강고민별 맞춤 추천 팩 (PC 863:12717 / 모바일 863:12808)
   ========================================================================== */
.nm-pack { padding: 120px 0; }
.nm-pack__grid { display: grid; grid-template-columns: 560px minmax(0, 640px); grid-template-areas: "head photo" "btn photo"; column-gap: 80px; row-gap: 20px; align-items: center; align-content: center; }
.nm-pack__grid > .nm-head { grid-area: head; align-self: end; }
.nm-pack__btn { grid-area: btn; align-self: start; padding-top: 20px; }
.nm-pack__photo { grid-area: photo; display: block; width: 100%; height: 420px; border-radius: 16px; object-fit: cover; }

/* ============================================================================
   05 하루 한 포 (PC 제목 749:13624 + 초록 돔 749:13630 · StatCard 748:13322 / 모바일 744:13493)
   ========================================================================== */
.nm-onepack5__head { padding-top: 120px; }
.nm-dome { position: relative; height: 954px; overflow: hidden; }
.nm-dome__arc { position: absolute; top: 260px; left: 50%; display: block; width: 2400px; height: 700px; margin-left: -1200px; }
.nm-dome__base { position: absolute; top: 610px; right: 0; bottom: 0; left: 0; background: var(--nm-brand-primary); }
.nm-dome__pouch { position: absolute; top: 40px; left: 50%; z-index: 1; display: block; width: 440px; height: 418px; margin-left: -220px; object-fit: contain; }
.nm-dome__box { position: absolute; top: 520px; left: 50%; z-index: 2; display: flex; flex-direction: column; align-items: center; width: 1280px; max-width: 100%; transform: translateX(-50%); }
.nm-dome__tit { font-size: 32px; font-weight: 400; line-height: 1.3; letter-spacing: -0.8px; color: var(--nm-font-white); text-align: center; }
.nm-dome__tit span { display: block; }
.nm-dome__tit strong { display: block; font-weight: 700; }
.nm-dome__stats { display: flex; gap: 16px; padding: 32px 0 40px; }
.nm-stat { display: flex; align-items: center; gap: 6px; width: 300px; padding: 24px 28px; border-radius: 12px; background: var(--nm-bg-white); }
.nm-stat img { display: block; flex: 0 0 56px; width: 56px; height: 56px; object-fit: contain; }
.nm-stat dl { display: flex; flex-direction: column; gap: 4px; }
.nm-stat dt { font-size: 16px; font-weight: 400; line-height: 1.4; letter-spacing: -0.4px; color: var(--nm-text-666); white-space: nowrap; }
.nm-stat dd { font-size: 20px; font-weight: 800; line-height: 1.4; letter-spacing: -0.5px; color: var(--nm-brand-primary); white-space: nowrap; }

/* ============================================================================
   PC 좁은 폭(1024~1319) — 고정 폭을 줄여 넘치지 않게
   ========================================================================== */
@media (min-width: 1024px) and (max-width: 1319px) {
	.nm-hero__row, .nm-steps__row { gap: 40px; }
	.nm-hero__text { flex-basis: 531px; }
	.nm-steps__row > .nm-head { flex: 0 1 560px; }
	.nm-routine__grid { grid-template-columns: minmax(0, 1fr) auto; column-gap: 40px; }
	.nm-cases { gap: 12px; }
	.nm-pack__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 40px; }
	.nm-worry__flow { gap: 40px; }
	.nm-worry__bubbles { width: 420px; }
}

/* 1024~1199(태블릿 가로 등): 03 제목(360px)·후기 머리줄(날짜 68 + 별점 105)이 들어가지 않아 배치를 바꾼다 */
@media (min-width: 1024px) and (max-width: 1199px) {
	.nm-review__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nm-routine__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "cases" "notice" "btn"; }
	.nm-routine__cases { align-self: start; padding-top: 20px; }
	.nm-routine__btn .nm-btn, .nm-routine__notice { max-width: 560px; }
}

/* ============================================================================
   모바일(1023 이하)
   ========================================================================== */
@media (max-width: 1023px) {
	.nm-btn { width: 100%; }

	.nm-head { gap: 12px; }
	.nm-num { gap: 4px; }
	.nm-num b { font-size: 22px; font-weight: 800; line-height: 1.2; letter-spacing: 0; }
	.nm-num i { width: 24px; }
	.nm-tit { font-size: 22px; line-height: 1.4; letter-spacing: -0.44px; color: var(--nm-text-1a); }
	.nm-tit strong.is-black { color: var(--nm-text-1a); }
	.nm-desc { font-size: 14px; line-height: 1.5; letter-spacing: -0.28px; color: var(--nm-text-666); }
	.nm-desc strong { color: var(--nm-text-333); }
	.nm-desc--dark { color: var(--nm-text-333); }
	.nm-desc--tight { line-height: 1.4; }

	/* 띠배너: 두 칸이 화면 끝까지, 크림·민트 */
	.nm-band { padding-top: 0; }
	.nm-band > .nm-inner { padding: 0; }
	.nm-band__row { gap: 0; }
	.nm-band__item { align-self: stretch; gap: 8px; padding: 16px 12px 16px 16px; border-radius: 0; color: var(--nm-text-1a); }
	.nm-band__item:nth-child(1) { background: var(--nm-brand-cream-bg); }
	.nm-band__item:nth-child(2) { background: var(--nm-brand-mint-bg); }
	.nm-band__txt { gap: 2px; }
	.nm-band__label { font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: -0.24px; }
	.nm-band__title { font-size: 14px; font-weight: 700; line-height: 1.35; letter-spacing: -0.28px; color: var(--nm-text-1a); word-break: keep-all; }
	.nm-band__arrow-pc { display: none; }
	.nm-band__arrow-mo { display: flex; flex: 0 0 22px; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 11px; background: var(--nm-bg-white); opacity: .9; }
	.nm-band__arrow-mo img { width: 14px; height: 14px; }
	.nm-band__item:nth-child(1) .nm-band__arrow-mo img { transform: rotate(90deg); }

	/* 히어로: 제목이 사진 위로 40 겹침, 사진 위쪽 흰 흐림 140, 버튼은 사진 아래쪽에 얹음 */
	.nm-hero { position: relative; max-width: 600px; margin: 0 auto; padding: 56px 0 0; }
	.nm-hero > .nm-inner { padding: 0; }
	.nm-hero__row { display: block; }
	.nm-hero__text { display: block; }
	.nm-hero__tit { position: relative; z-index: 4; margin-bottom: -40px; font-size: 26px; line-height: 1.35; letter-spacing: -0.78px; color: var(--nm-text-1a); text-align: center; }
	.nm-hero__btns { position: absolute; right: 0; bottom: 0; left: 0; z-index: 4; gap: 10px; padding: 20px 20px 40px; }
	.nm-hero__btns .nm-btn--line { background: rgba(255, 255, 255, .6); }
	.nm-hero__photo { position: static; }
	.nm-hero__frame { padding-top: 117.44%; border-radius: 0; } /* 430×505 */
	.nm-hero__fade { position: absolute; top: 0; left: 0; z-index: 2; display: block; width: 100%; height: 140px; background: linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0)); pointer-events: none; }
	.nm-hero__pager { display: none; }
	.nm-hero__dots { position: absolute; bottom: 16px; left: 0; z-index: 5; display: flex; width: 100%; }

	/* 고객 후기: 270×313 카드 옆으로 넘김 + 스크롤 막대 */
	.nm-review { padding: 48px 0; }
	.nm-review__in { gap: 24px; }
	.nm-review__tit { font-size: 24px; font-weight: 700; line-height: 33.6px; letter-spacing: -0.6px; color: #000; }
	.nm-review__slider { display: flex; flex-direction: column; align-items: center; gap: 16px; }
	.nm-review__list { display: flex; gap: 16px; width: calc(100% + 40px); margin: 0 -20px; padding: 0 20px; scroll-padding-left: 20px; }
	.nm-review__list > li { flex: 0 0 270px; }
	.nm-review__list .nm-rcard { height: 313px; min-height: 0; overflow: hidden; }
	.nm-review__bar { position: relative; display: block; width: 60px; height: 6px; overflow: hidden; border-radius: 3px; background: #f0f0f0; }
	.nm-review__bar i { position: absolute; top: 0; left: 0; display: block; width: 19px; height: 6px; border-radius: 10px; background: var(--nm-font-black); }
	.nm-review__more a { width: 100%; height: 48px; padding: 0 20px; border-color: var(--nm-line-dd); border-radius: 8px; font-size: 16px; font-weight: 500; line-height: 19px; letter-spacing: 0; color: #222; }

	/* 방송 영상: 360 카드 옆으로 넘김 */
	.nm-press { padding: 48px 0; background: var(--nm-bg-f8); }
	.nm-press__in { gap: 6px; }
	.nm-press__tit { font-size: 22px; line-height: 1.4; letter-spacing: -0.44px; color: var(--nm-text-1a); }
	.nm-press__sub { font-size: 14px; letter-spacing: -0.28px; color: var(--nm-text-666); }
	.nm-press__list { gap: 12px; width: calc(100% + 40px); margin: 0 -20px; padding: 20px 20px 10px; scroll-padding-left: 20px; }
	.nm-video { flex: 0 0 360px; gap: 6px; align-items: center; }
	.nm-video__thumb { padding-top: 56.39%; border-radius: 12px; } /* 360×203 */
	.nm-video__play { width: 52px; height: 52px; margin: -26px 0 0 -26px; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
	.nm-video__play .is-pc { display: none; }
	.nm-video__play .is-mo { display: block; }
	.nm-video__play .is-mo.is-circle { top: 0; left: 0; width: 52px; height: 52px; margin: 0; }
	.nm-video__play .is-mo.is-icon { width: 24px; height: 24px; margin: -12px 0 0 -12px; }
	.nm-video__cap { width: 340px; max-width: 100%; font-size: 12px; font-weight: 400; letter-spacing: -0.24px; color: var(--nm-text-666); text-align: center; }
	.nm-press__dots { display: flex; }
	.nm-press__btn { height: 36px; margin-top: 10px; padding: 8px 12px; font-size: 13px; letter-spacing: -0.325px; }
	.nm-press__btn img { width: 12px; height: 12px; }

	/* 고민 말풍선: 세로 배치 */
	.nm-worry { padding: 56px 0; }
	.nm-worry__in { gap: 28px; }
	.nm-worry__tit { font-size: 22px; line-height: 1.4; letter-spacing: -0.44px; color: var(--nm-text-1a); }
	.nm-worry__flow { flex-direction: column; gap: 28px; }
	.nm-worry__bubbles { gap: 10px; width: 300px; }
	.nm-bubble { padding: 11px 18px; font-size: 14px; letter-spacing: -0.28px; }
	.nm-worry__row:nth-child(1) .nm-bubble { background: var(--nm-text-333); }
	.nm-worry__row:nth-child(2) .nm-bubble { background: #444; }
	.nm-worry__row:nth-child(3) .nm-bubble { background: var(--nm-text-666); }
	.nm-worry__row:nth-child(4) .nm-bubble { background: var(--nm-text-888); }
	.nm-worry__dots .is-pc { display: none; }
	.nm-worry__dots .is-mo { display: block; }
	.nm-worry__pack { gap: 28px; }
	.nm-worry__lead { font-size: 18px; letter-spacing: -0.36px; }
	.nm-onepack { width: 300px; }
	.nm-onepack img { height: 200px; }
	.nm-onepack p { padding: 18px 20px 20px; font-size: 17px; letter-spacing: -0.34px; }

	/* 01 */
	.nm-steps { padding: 56px 0; background: var(--nm-bg-f8); }
	.nm-steps__row { display: block; }
	.nm-steps__list { gap: 10px; padding-top: 28px; } /* 위 간격 12 + 단계 위 16 */
	.nm-step { gap: 12px; }
	.nm-step__no { flex-basis: 26px; width: 26px; height: 26px; font-size: 12px; line-height: 1; letter-spacing: -0.24px; }
	.nm-step__card { padding: 11px 14px 11px 18px; }
	.nm-step__tit { font-size: 15px; letter-spacing: -0.3px; }
	.nm-step__card img { flex-basis: 40px; width: 40px; height: 40px; }

	/* 02: 열을 풀고(display:contents) 순서를 바꿔 280×413 카드 9장 가로 넘김 */
	.nm-consult { padding: 56px 0; }
	.nm-consult__in { gap: 0; }
	.nm-consult__cols { gap: 12px; width: calc(100% + 40px); margin: 28px -20px 0; padding: 0 20px; scroll-padding-left: 20px; } /* 위 간격 12 + 위 16 */
	.nm-consult__col { display: contents; }
	.nm-consult__cols .nm-rcard { flex: 0 0 280px; min-height: 413px; scroll-snap-align: start; }
	.nm-consult__dots { display: flex; margin-top: 12px; }

	/* 03: 머리말 → 사례(가로 넘김) → 안내 → 버튼 */
	.nm-routine { padding: 56px 0; }
	.nm-routine__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; } /* PC 의 align-items:start 를 되돌림 */
	.nm-routine__cases { order: 2; align-self: stretch; min-width: 0; padding-top: 28px; } /* 위 간격 12 + 위 16 */
	.nm-routine__notice { order: 3; gap: 8px; padding-top: 36px; } /* 12 + 24 */
	.nm-routine__btn { order: 4; padding-top: 12px; }
	.nm-routine__check { font-size: 14px; letter-spacing: -0.28px; color: var(--nm-text-1a); }
	.nm-notice { gap: 16px; padding: 16px 18px; }
	.nm-notice img { flex-basis: 40px; width: 40px; height: 40px; }
	.nm-notice p { font-size: 14px; line-height: 1.5; letter-spacing: -0.28px; }
	.nm-cases { gap: 12px; width: calc(100% + 40px); margin: 0 -20px; padding: 0 20px; scroll-padding-left: 20px; }
	.nm-routine__dots { display: flex; margin-top: 16px; }

	/* 04: 머리말 → 사진 → 버튼 */
	.nm-pack { padding: 56px 0; }
	.nm-pack__grid { display: flex; flex-direction: column; align-items: stretch; align-content: normal; gap: 12px; } /* PC 의 가운데 정렬을 되돌림 */
	.nm-pack__grid > .nm-head { align-self: stretch; }
	.nm-pack__photo { order: 2; align-self: stretch; height: auto; aspect-ratio: 3 / 2; }
	.nm-pack__btn { order: 3; align-self: stretch; padding-top: 0; }

	/* 05: 한 칸(390×649) 안에 돔·포장지·글자 */
	.nm-onepack5__head { padding-top: 56px; }
	.nm-onepack5__head .nm-head { align-items: flex-start; text-align: left; }
	.nm-onepack5__head .nm-num { align-items: flex-start; }
	.nm-dome { height: 721px; margin-top: 0; overflow: hidden; } /* 위 간격 12 + 649 + 시안 「마무리 여백」 초록 60(744:13528) */
	.nm-dome__arc { display: none; }
	.nm-dome__base { top: 241px; right: 0; left: 0; bottom: 0; border-radius: 215px 215px 0 0; } /* 12 + 229 */
	.nm-dome__pouch { top: 54px; width: 248px; height: 236px; margin-left: -94px; } /* 12 + 42, 시안처럼 가운데에서 오른쪽으로 30 */
	.nm-dome__box { top: 401px; align-items: flex-start; gap: 20px; width: auto; right: 20px; left: 20px; transform: none; max-width: none; } /* 12 + 389 */
	.nm-dome__tit { font-size: 20px; line-height: 1.45; letter-spacing: -0.4px; text-align: left; }
	.nm-dome__stats { gap: 10px; width: 100%; padding: 0; }
	.nm-stat { flex: 1 1 0; min-width: 0; width: auto; padding: 14px 16px; }
	.nm-stat img { flex-basis: 36px; width: 36px; height: 36px; }
	.nm-stat dl { gap: 4px; }
	.nm-stat dt { font-size: 12px; letter-spacing: -0.24px; }
	.nm-stat dd { font-size: 18px; line-height: 1.2; letter-spacing: -0.18px; }
	.nm-dome__box .nm-btn { width: 100%; }
}
@media (min-width: 600px) and (max-width: 1023px) {
	.nm-hero__frame { padding-top: 0; height: 600px; } /* 넓은 모바일: 사진이 너무 길어지지 않게 */
}