@charset "UTF-8";
/*
 * kidsrun permanent responsive layer
 *
 * 모든 페이지 전용 CSS 뒤, </head> 전에 로드한다. 첫 페인트부터 실제 뷰포트 폭을
 * 사용하며 JavaScript zoom 또는 DOMContentLoaded 이후 크기 보정에 의존하지 않는다.
 *
 * Breakpoints
 *   <= 1440 : small laptop
 *   <= 1279 : 헤더 축약 (원 이름 숨김)
 *   <= 1024 : tablet / landscape phone
 *   <=  600 : iPhone and Galaxy portrait sizes
 *
 * 브레이크포인트 사이의 빈 폭 구간에서 데스크톱 고정값이 되살아나 레이아웃이 깨졌다.
 * 폭 조건 없이 풀 수 있는 것은 아래 기본값 블록에서 처리한다. 구간을 새로 만들어
 * 막으면 그 사이에 또 빈 구간이 생겨 같은 증상이 재발한다.
 */

.rd-body{min-width:0;overflow-x:hidden;}
.rc-month-select{display:none;}

/* ---------- 폭 무관 기본값 (미디어쿼리 밖) ---------- */

/* 대시보드 2단. app.css 의 1140px/700px 고정폭은 gap 20 을 더하면 정확히 1860 =
   .rd-container max-width 라, 뷰포트가 1890 미만이면 그만큼 화면 밖으로 나갔다.
   유동으로 바꾸되 max-width 로 1920 시안 폭(좌 1140 / 우 700)은 그대로 남긴다.
   flex 가 secA 를 1140 에서 먼저 고정하고 남는 폭을 secB 로 흘려보낸다. */
.rd-secA{width:auto;flex:1 1 calc(66% - 10px);max-width:1140px;min-width:0;}
.rd-secB{width:auto;flex:1 1 calc(34% - 10px);max-width:700px;min-width:0;}
/* secB 안쪽도 같다. 470 + 210 + gap 20 = 700 이라 secB 가 줄면 자식이 그대로 뚫었다.
   basis 를 설계 폭 그대로 두면 secB 가 700 일 때 470/210 이 유지되고, 줄어들면
   그 비율대로 함께 줄어든다. (1440 이하의 균등 분할은 아래 미디어쿼리가 유지한다) */
.detail-notice{width:auto;flex:0 1 470px;min-width:0;}
/* 관찰일지 카드에는 하한을 둔다. 비율대로만 줄이면 1441px 에서 146px 까지 좁아져
   원아 이름이 "김하/늘" 로 쪼개지고, 창을 넓혔는데 카드가 되레 좁아지는 역전이 생긴다.
   200 은 1440px 에서 실제로 쓰이던 223 에 맞춘 값이다. */
.detail-observe{width:auto;flex:0 1 210px;min-width:200px;}

/* GNB. 헤더가 height:62px 고정이라 사용자명이 줄바꿈되면 아래로 밀리지 않고 겹쳐 찍힌다.
   폭 상한은 두지 않는다. min-width:0 + overflow:hidden 이면 축소가 필요한 폭에서만
   말줄임이 걸리고 넓은 화면은 손대지 않는다. */
.rd-hd-left,.rd-hd-right,.rd-hd-center{min-width:0;}
.rd-header .rd-hd-user{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* 일지 입력줄. 216px 필드 x2 + 240px 버튼은 줄어들지 않아 카드를 뚫었다.
   wrap 은 한 줄에 다 들어갈 때 아무 일도 하지 않으므로 데스크톱 배치는 그대로다. */
.rc-fieldrow,.rc-ctrlrow,.rc-fields{flex-wrap:wrap;min-width:0;}
.rd-body .rc-gen{flex:0 1 240px;min-width:0;}

/* 알림장 아이 헤더. 특성 문구가 min-content(한 어절 73px)까지 눌리는 대신 아랫줄로 내린다.
   자식의 flex/min-width 를 건드리면 데스크톱 배치가 같이 움직이므로 wrap 만 준다. */
.nt-kidhead{flex-wrap:wrap;}

/* 그리드 칸이 좁아졌을 때 글자가 칸을 밀지 않게 한다. .cols3 가 쓰던 처리를 일반화.
   트랙 자체를 줄이는 minmax(0,1fr) 은 각 파일의 grid-template-columns 에서 처리한다. */
.nt-namegrid .nt-namechip{min-width:0;}
.nt-namegrid .nt-namechip .nm{max-width:100%;overflow:hidden;text-overflow:ellipsis;}

/* 1025~1119px 페이지 가로 스크롤의 실제 원인 두 곳. 둘 다 푸는 규칙이 1024 이하에만
   있어서, 태블릿 규칙이 끝나는 1025px 부터 데스크톱 고정값이 되살아났다.

   (1) 대시보드 배너 카드. .bc-title 이 white-space:nowrap 인데 카드는 flex:1 0 0 로
       160px 까지 좁아진다. 카드에 클리핑이 없어 제목이 카드 밖으로 흘러 마지막
       카드의 넘침이 그대로 페이지를 밀었다(1025px 에서 15px).
   (2) 서브비주얼 제목·설명. record/notice/journal 의 h1·p 가 white-space:nowrap 이라
       849px 를 요구했다. 아이콘 90 + gap 24 를 더하면 963px 인데 7vw 패딩을 뺀
       안쪽은 842px 뿐이다(상담일지 1025px 에서 30px).
   white-space:normal 은 한 줄에 들어가면 아무 일도 하지 않으므로 넓은 화면은 그대로다. */
.bann-card{overflow:hidden;}
.bann-card .bc-title{overflow:hidden;text-overflow:ellipsis;}
.nt-sv-txt,.jn-sv-txt,.rc-sv-txt{min-width:0;}
.nt-sv-txt h1,.nt-sv-txt p,.jn-sv-txt h1,.jn-sv-txt p,
.rc-sv-txt h1,.rc-sv-txt p{white-space:normal;}

/* 소제목 줄(아이콘 + 제목 + 안내문구 + 버튼). 안내문구에 min-width 가 없어
   한 어절 폭까지 눌려 세로 기둥이 됐다. notice/journal/record 세 파일이 같은 정의를 쓴다. */
.nt-subtitle,.jn-subtitle,.rc-subtitle{flex-wrap:wrap;}

/* 오늘 알림장 카드가 좁은 폭에서 무너지던 것. 우측 패널이 좁아지면 3칸 그리드의
   칸이 27~50px 까지 줄어드는데, 아바타가 47px 라 칸보다 크고 이름은 한 글자씩
   세 줄로 접혔다. 원인이 둘이라 덮는 구간도 다르다.
     - 칸 수(2칸)  : 아바타가 안 들어가는 1440px 이하
     - 패딩·폰트   : 이름이 접히기 시작하는 1600px 이하 (1441~1539 는 3칸이라 폰트만 필요)
   1601px 이상은 손대지 않는다 — 1920 시안은 그대로. */
@media (max-width:1600px){
  /* 좌우 패딩 30px 가 좁아진 칸에서 글상자를 12~18px 로 만들어 이름을 세 줄로 접는다. */
  .dt-grid .chk-card{padding-inline:6px;}
  .dt-grid .chk-card .who .nm{font-size:11px;}
}
@media (max-width:1440px){
  /* 칸이 27~50px 까지 줄어 47px 아바타가 칸보다 커지는 구간. 2칸으로 낮춘다. */
  .dt-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

/* 기록 이어가기 흐름줄. .flow-box 가 flex 아이템인데 min-width 가 auto(=min-content)라
   라벨의 white-space:nowrap 때문에 "내 말투 설정" 폭 아래로 안 줄어든다.
   601~1440px 에서 .flow-set 이 54~124px 인데 내용은 139px 를 요구해 옆 상자와 겹쳐 그려졌다.
   푸는 규칙(white-space:normal)이 600px 이하에만 있어서 생긴 빈 구간이다.
   라벨은 한 줄에 들어가면 안 접히므로 넓은 화면은 그대로다. */
.flow-box.fixed,.flow-box.flex1{min-width:0;}
.flow-box .flabel{white-space:normal;}

/* 오늘 알림장 범례("생성 N / 작성완료 N · 미작성 N"). 186px 를 요구하는데 카드가
   좁아지는 1025~1440px 에서는 113~171px 뿐이라 "미작성 N" 이 카드 밖으로 잘렸다.
   한 줄에 들어가는 폭에서는 접히지 않으므로 1600px 이상은 그대로다. */
.dt-legend,.dt-legend>*{flex-wrap:wrap;min-width:0;}

/* 헤더 축약. 원 이름 칩이 nav 위에 덧그려지는 것은 폭을 실제로 줄여야 풀린다.
   1024 이하 규칙을 팀 표준 브레이크포인트인 1280 까지 끌어올린다. */
@media (max-width:1279px){
  .rd-hd-center .nm{display:none;}
  /* 보육일지 월 버튼 12개가 712px 를 요구하는데 1025~1279px 에서는 618px 뿐이라
     뒤쪽 달이 카드 밖으로 잘렸다. 가로 스와이프 처리가 1024 이하에만 있어 생긴 빈 구간.
     기본값으로 올리면 다 들어가는 폭에서도 정렬이 미세하게 틀어져 이 구간만 덮는다. */
  .jn-fbtns{overflow-x:auto;}
}

/* ---------- small laptop ---------- */
@media (max-width:1440px){
  .rd-shell{width:100%;max-width:100%;padding:16px 20px 0;}
  .rd-container{width:100%;}
  .rd-header{gap:12px;padding-inline:18px;}
  .rd-hd-left{gap:16px;min-width:0;}
  .rd-nav{gap:2px;min-width:0;}
  .rd-nav a,.rd-nav span{padding-inline:7px;font-size:13px;}
  .rd-nav a.is-active{padding-inline:8px;}
  .rd-nav-btn{padding-inline:7px;font-size:11px;}
  .rd-hd-right{gap:7px;}
  .rd-hd-center{padding-inline:6px;}
  .rd-hd-center .nm{max-width:120px;overflow:hidden;text-overflow:ellipsis;}

  /* dashboard */
  .rd-main{align-items:stretch;}
  .rd-secA{padding:34px;}   /* 폭·flex 는 기본값 블록이 유동으로 처리한다 */
  .detail-notice,.detail-observe{width:auto;flex:1 1 0;min-width:0;}
  .rd-svc-row{flex-wrap:wrap;}
  .card-notice{flex-basis:100%;}
  .card-journal,.card-observe{width:auto;flex:1 1 calc(50% - 4px);}
  .box-meal{width:auto;flex:1 1 100%;}
  .box-s.flex1{flex-basis:calc(50% - 4px);}
  .help-box.w497{width:auto;flex:1 1 46%;}
  .flow-row{gap:6px;}
  .flow-set{flex:1;min-width:0;}
  .flow-box.fixed{width:auto;flex:1 1 0;}
  .flow-arrow{padding-inline:2px;}
  .rd-event{right:96px;}

  /* sub pages */
  .nt-shell,.jn-shell,.rc-shell{width:100%;}
  .nt-hd-float,.jn-hd-float,.rc-hd-float{left:20px;width:calc(100% - 40px);}
  .nt-subvisual,.jn-subvisual,.rc-subvisual{width:100%;padding-left:7vw;padding-right:7vw;}
  .nt-tabs,.rc-tabs{width:100%;}
  .nt-container,.rc-container{padding:44px 7vw 64px;}
  .jn-container{padding:44px 8vw 64px;}
  .nt-namegrid{grid-template-columns:repeat(10,minmax(0,1fr));}

  /* utility pages */
  .tool-band{width:100%;}
  .tool-band.tall .tool-band-tit{width:calc(100% - 64px);}
  .tool-hd{width:calc(100% - 40px);}
  .tool-wrap{padding:120px 5vw 64px;}
  .tool-main{padding:42px;}
  .kn-hero .txt{width:50%;}
  .kn-figure{right:24px;transform:translateY(-50%) scale(.82);transform-origin:right center;}
}

/* ---------- tablet ---------- */
@media (max-width:1024px){
  .rd-shell{padding:12px 16px 0;}
  .rd-header{height:auto;min-height:104px;padding:12px 16px;align-items:flex-start;position:relative;}
  .rd-hd-left{width:100%;display:block;}
  .rd-hd-logo-link{display:inline-flex;height:34px;align-items:center;}
  /* 데스크톱 배너용 overlay 로고는 좁은 화면에서 채도가 크게 빠진다.
     반응형 미리보기에서만 원색 에셋을 사용해 브랜드 컬러를 유지한다. */
  .rd-hd-logo{content:url(../images/app/logo-kidsrun.png);width:96px;height:auto;
    mix-blend-mode:normal;object-fit:contain;}
  .rd-nav{position:absolute;left:12px;right:12px;bottom:9px;overflow-x:auto;overflow-y:hidden;
    justify-content:flex-start;padding:0 4px 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .rd-nav::-webkit-scrollbar{display:none;}
  .rd-nav a,.rd-nav span{flex:0 0 auto;min-height:34px;}
  .rd-hd-right{position:absolute;right:16px;top:12px;}
  .rd-hd-center .nm,.rd-hd-point .max,.rd-hd-point .sep{display:none;}
  .rd-hd-user{max-width:96px;}
  .rd-header .rd-hd-user{padding-block:7px;}
  .rd-hd-user{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

  /* dashboard becomes one readable column */
  .rd-container{padding-top:18px;}
  .rd-topnews{gap:14px;padding-right:44px;align-items:flex-start;flex-wrap:wrap;}
  .rd-topnews .tn-txt{white-space:normal;line-height:1.5;flex:1;min-width:0;}
  .rd-topnews .tn-tone{margin-left:54px;}
  .rd-greet .g-class .illust{left:auto;right:0;}
  .rd-main{display:block;margin-top:16px;}
  /* 한 열이 되는 구간. 기본값의 max-width(1140/700)가 살아 있으면 display:block 상태에서
     우측 블록이 700px 로 잘리므로 여기서 푼다. */
  .rd-secA{width:100%;max-width:none;padding:32px;}
  .rd-secB{width:100%;max-width:none;margin-top:16px;display:grid;grid-template-columns:2fr 1fr;}
  /* 한 열/그리드로 바뀌는 구간. 기본값의 min-width:200px 가 남으면 320px 화면에서
     그리드 칸을 밀어내 가로 스크롤이 생기므로 여기서 푼다. */
  .detail-notice,.detail-observe{width:auto;min-width:0;min-height:320px;}
  .rd-bann{flex-wrap:wrap;}
  .bann-card{flex-basis:calc(50% - 4px);}
  /* 이벤트는 헤더의 포도알 버튼으로도 열 수 있다. 좁은 화면에서는 카드와
     겹치지 않도록 큰 장식 배너만 감춘다. */
  .rd-event{display:none;}

  /* common sub-page hero/header */
  .nt-hd-float,.jn-hd-float,.rc-hd-float{top:12px;left:16px;width:calc(100% - 32px);z-index:5;}
  .nt-subvisual,.jn-subvisual,.rc-subvisual{min-height:310px;padding:145px 32px 0;gap:24px;}
  .nt-sv-ico,.jn-sv-ico,.rc-sv-ico{width:72px;height:72px;flex-basis:72px;}
  .nt-sv-ico img,.jn-sv-ico img,.rc-sv-ico img{width:72px;height:72px;}
  .nt-sv-txt,.jn-sv-txt,.rc-sv-txt{min-width:0;}
  .nt-sv-txt h1,.jn-sv-txt h1,.rc-sv-txt h1{font-size:34px;}
  .nt-sv-txt h1,.nt-sv-txt p,.jn-sv-txt h1,.jn-sv-txt p,
  .rc-sv-txt h1,.rc-sv-txt p{white-space:normal;}
  .nt-tabs,.rc-tabs{justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;}
  .nt-tabs::-webkit-scrollbar,.rc-tabs::-webkit-scrollbar{display:none;}
  .nt-page .nt-tab,.rc-page .rc-tab{flex:1 0 auto;min-width:150px;padding-inline:20px;}
  .nt-container,.jn-container,.rc-container{padding:32px;}
  .nt-panel,.jn-card,.rc-card{padding:36px;}
  .nt-namegrid{grid-template-columns:repeat(7,minmax(0,1fr));}
  .nt-split .col-left{width:300px;flex-basis:300px;}
  .nt-split.child .col-left{width:190px;flex-basis:190px;}
  .jn-fbtns{overflow-x:auto;padding-bottom:4px;}
  .jn-page .jn-fbtn{flex:0 0 64px;}

  /* record pages: roster becomes a horizontal strip */
  .rc-inner{display:block;}
  .rc-list{width:100%;padding:18px;margin-bottom:20px;overflow:visible;}
  .rc-kids{flex-direction:row;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;}
  .rc-page .rc-child{width:auto;min-width:160px;flex:0 0 160px;}
  .rc-pager{display:none;}

  /* utility shell: LNB becomes a top navigation strip */
  .tool-hd{top:12px;width:calc(100% - 32px);}
  .tool-band{min-height:220px;}
  .tool-band.tall{min-height:390px;}
  .tool-band.tall .tool-band-tit{margin-top:150px;}
  .tool-wrap{padding:132px 32px 56px;}
  .tool-wrap.narrow-wrap{padding-top:278px;}
  .tool-panel{display:block;}
  .rd-lnb{width:100%;padding:14px 18px;display:flex;flex-direction:row;gap:16px;border-radius:18px 18px 0 0;
    overflow-x:auto;overflow-y:hidden;align-items:center;scrollbar-width:none;}
  .rd-lnb::-webkit-scrollbar{display:none;}
  .rd-lnb-group{display:flex;flex-direction:row;gap:6px;align-items:center;flex:0 0 auto;}
  .rd-lnb-title{font-size:16px;white-space:nowrap;}
  .rd-lnb-items{flex-direction:row;gap:2px;}
  .rd-lnb-line{width:1px;height:32px;flex:0 0 1px;}
  .rd-body .rd-lnb-item{white-space:nowrap;}
  .tool-main{border-radius:0 0 18px 18px;padding:36px;}
  .tool-panel.narrow .tool-main{border-radius:20px;}
  .kn-hero{padding:48px;overflow:hidden;}
  .kn-hero .txt{width:58%;}
  .kn-figure{right:-70px;opacity:.72;}
  .meal-bar{align-items:flex-start;gap:16px;flex-wrap:wrap;}
}

/* ---------- phones: iPhone / Galaxy ---------- */
@media (max-width:600px){
  .rd-body{-webkit-text-size-adjust:100%;}
  .rd-shell{padding:8px 10px 0;}
  .rd-header{min-height:100px;border-radius:14px;padding:10px 12px;}
  .rd-hd-logo{width:84px;}
  .rd-hd-right{right:10px;top:9px;gap:3px;}
  .rd-hd-center{display:none;}
  .rd-hd-point{padding:7px 5px;}
  .rd-header .rd-hd-user{max-width:68px;font-size:11px;}
  .rd-hd-user img{display:none;}
  .rd-hd-logout{width:22px;height:22px;}
  .rd-nav{left:6px;right:6px;bottom:7px;gap:1px;}
  .rd-nav a,.rd-nav span{font-size:12px;padding:7px 9px;min-height:32px;}
  .rd-nav a.is-active{padding:7px 9px;}
  .rd-nav-div,.rd-nav-btns{display:none;}
  .rd-hd-dropdown{position:fixed;top:48px;right:10px;}

  .rd-container{padding-top:12px;}
  .rd-topnews{padding:14px 38px 14px 14px;gap:10px;}
  .rd-topnews .tn-ico{width:34px;height:34px;flex-basis:34px;}
  .rd-topnews .tn-txt{font-size:12px;}
  .rd-topnews .tn-tone{width:100%;margin-left:0;padding:8px 12px;justify-content:space-between;}
  .rd-topnews .tn-tone .t1{font-size:11px;white-space:normal;}
  .rd-topnews .tn-tone .t2{font-size:11px;}
  .rd-secA{padding:20px;border-radius:18px;}
  .rd-greet{display:block;}
  .rd-greet .g-date{font-size:14px;white-space:normal;line-height:1.45;}
  .rd-greet .g-hi{font-size:22px;white-space:normal;line-height:1.35;}
  .rd-greet .g-class{padding-top:38px;justify-content:flex-end;}
  .rd-greet .g-class .illust{left:auto;right:70px;}
  .rd-brief{margin-top:18px;padding:14px;align-items:flex-start;}
  .rd-brief .b-in{align-items:flex-start;}
  .rd-brief .b-tit{display:none;}
  .rd-brief .b-div{display:none;}
  .rd-brief .b-desc{font-size:12px;white-space:normal;display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;}
  .rd-svc,.rd-help,.rd-flow{margin-top:20px;}
  .rd-svc-row,.help-row{display:grid;grid-template-columns:1fr;}
  .svc-card,.card-notice,.card-journal,.card-observe{width:100%;flex:none;height:226px;padding:24px;}
  .card-notice{height:auto;min-height:226px;}
  .svc-chart{position:static;width:100%;margin-top:12px;}
  .box-s,.box-meal,.box-s.flex1{width:100%;flex:none;}
  .help-box,.help-box.w497,.help-box.flex1{width:100%;flex:none;padding-inline:16px;}
  .help-box .hb-desc{display:none;}
  .flow-row{overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;}
  .flow-set{min-width:560px;}
  .rd-secB{display:grid;grid-template-columns:1fr;}
  .detail-notice,.detail-observe{min-height:0;}
  .dt-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .rd-bann{display:grid;grid-template-columns:1fr;}
  .bann-card{padding:18px;}
  .rd-footer{justify-content:center;}
  .rd-event{display:none;}

  /* heroes and tabs */
  .nt-hd-float,.jn-hd-float,.rc-hd-float{top:8px;left:10px;width:calc(100% - 20px);}
  .nt-subvisual,.jn-subvisual,.rc-subvisual{min-height:278px;padding:125px 16px 0;gap:18px;}
  .jn-subvisual{min-height:252px;padding-bottom:20px;}
  .nt-sv-inner,.jn-sv-inner,.rc-sv-inner{gap:12px;align-items:center;}
  .nt-sv-ico,.jn-sv-ico,.rc-sv-ico{width:54px;height:54px;flex-basis:54px;}
  .nt-sv-ico img,.jn-sv-ico img,.rc-sv-ico img{width:54px;height:54px;}
  .nt-sv-txt,.jn-sv-txt,.rc-sv-txt{gap:6px;min-width:0;}
  .nt-sv-txt h1,.jn-sv-txt h1,.rc-sv-txt h1{font-size:26px;}
  .nt-sv-txt p,.jn-sv-txt p,.rc-sv-txt p{font-size:13px;white-space:normal;line-height:1.45;}
  .nt-tabs,.rc-tabs{width:calc(100% + 32px);margin-left:-16px;padding:0 16px;justify-content:flex-start;}
  .nt-page .nt-tab,.rc-page .rc-tab{min-width:132px;padding:12px 14px;font-size:13px;}
  .nt-container,.jn-container,.rc-container{padding:20px 12px 40px;}
  .nt-panel,.jn-card,.rc-card{border-radius:18px;padding:20px 16px;gap:20px;}
  .nt-subtitle,.jn-subtitle,.rc-subtitle{align-items:flex-start;flex-wrap:wrap;gap:8px;}
  .nt-subtitle h2,.jn-subtitle h2,.rc-subtitle h2{font-size:19px;white-space:normal;}
  .nt-subtitle .desc{width:100%;line-height:1.45;}
  .nt-toprow,.nt-selrow,.jn-title,.jn-result-top{align-items:flex-start;gap:10px;flex-wrap:wrap;}
  .nt-textarea .ta-hd{padding:20px 20px 6px;}
  .nt-textarea .ta-body{padding:6px 20px 30px;}
  .nt-textarea textarea{font-size:15px;}
  .nt-namegrid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .nt-card .box{padding:12px 6px;}
  .nt-actions,.jn-cta-center,.jn-cta-end,.rc-bottom{flex-wrap:wrap;}
  .nt-actions .rd-btn,.jn-cta-center .rd-btn,.jn-cta-end .rd-btn,.rc-bottom .rd-btn{flex:1;}
  /* 문구와 버튼이 한 줄에서 서로를 밀어 글자가 몰린다 — 세로로 세우고 버튼은 오른쪽 아래 */
  .nt-alertbar{border-radius:16px;padding:14px 16px;flex-direction:column;align-items:stretch;gap:10px;}
  .nt-alertbar .act{align-self:flex-end;}
  .nt-alertbar p{font-size:13px;line-height:1.45;}
  .nt-split{display:block;}
  .nt-split .col-left,.nt-split.child .col-left{width:100%;}
  .nt-kidlist{flex-direction:row;overflow-x:auto;padding-bottom:6px;}
  .nt-kidrow{min-width:150px;flex:0 0 150px;}
  .nt-split .col-right{margin-top:16px;}
  /* 사진·이름·편집하기를 한 줄에 — 아바타·버튼을 줄여 좁은 폭에서도 안 접히게 */
  .nt-kidhead{padding:16px;gap:10px;align-items:center;flex-wrap:wrap;}
  .nt-kidhead .prof{flex:1 1 auto;min-width:0;}
  .nt-kidhead .prof img{width:38px;height:38px;}
  .nt-kidhead .nm{font-size:15px;}
  .nt-kidhead .feat{font-size:14px;}
  .nt-kidhead .nt-edit-btn{padding:8px 14px;gap:4px;border-radius:10px;font-size:13px;}
  .nt-kidhead .nt-edit-btn img{width:14px;height:14px;}
  .nt-doc{padding:22px 18px;}

  /* journal */
  .jn-badges{width:100%;overflow-x:auto;}
  .jn-ctabox,.jn-open-row{align-items:stretch;flex-direction:column;}
  .jn-ctabox .rd-btn,.jn-open-row .rd-btn{width:100%;}
  .jn-open,.jn-filterbox{padding:18px 14px;}
  .jn-row{align-items:flex-start!important;}
  .jn-fbtns{overflow-x:auto;padding-bottom:5px;}
  .jn-page .jn-fbtn{min-width:62px;flex:0 0 62px;padding-inline:10px;}

  /* record forms */
  .rc-list{padding:14px;}
  .rc-summary-counts{gap:10px;}
  .rc-page .rc-child{min-width:142px;flex-basis:142px;padding:11px 12px;}
  .rc-infobox{padding:14px;align-items:flex-start;gap:12px;flex-wrap:wrap;}
  .rc-profile{flex-wrap:wrap;}
  .rc-profile .bd,.rc-info-right .lbl{font-size:14px;}
  /* 세로 배치로 바꾸는 구간에서는 기본값의 flex-wrap:wrap 을 되돌린다.
     column 방향에서 wrap 이 걸리면 flex 라인의 cross 크기(=너비)가 컨테이너가 아니라
     내용 기준으로 잡혀, 자식이 부모보다 넓어지며 화면을 뚫는다. */
  .rc-ctrlrow{align-items:flex-start;gap:10px;flex-direction:column;flex-wrap:nowrap;}
  .rc-ctrlrow .acts{width:100%;}
  /* .rc-ctrlrow 가 align-items:flex-start 라 자식을 늘리지 않는다. 그래서 .rc-fields 가
     내용 폭으로 잡히는데, 그 내용이 <input type="datetime-local"> 의 고유 폭(344px)이라
     258px 짜리 카드를 뚫었다(320px 에서 55px 넘침). 네이티브 입력은 min-width:0 을
     명시하지 않으면 고유 폭 아래로 안 줄어든다. */
  .rc-ctrlrow .rc-fields{width:100%;}
  .rc-field{min-width:0;}
  .rc-field input{min-width:0;width:100%;}
  .rc-page .rc-ghost{flex:1;}
  .rc-acc{padding:22px 16px;border-radius:16px;}
  .rc-acc-head .num{font-size:16px;}
  .rc-fieldrow{align-items:stretch;flex-direction:column;flex-wrap:nowrap;}
  .rc-fields{align-items:stretch;flex-direction:column;flex-wrap:nowrap;}
  .rc-field{width:100%;}
  .rd-body .rc-gen{width:100%;flex-basis:auto;}
  .rc-ta-hd{padding:20px 18px 6px;}
  .rc-ta-body{padding:6px 18px 30px;}

  /* utility pages */
  .tool-hd{top:8px;width:calc(100% - 20px);}
  .tool-band{min-height:196px;}
  .tool-band.tall{min-height:320px;}
  .tool-band.tall .tool-band-tit{width:calc(100% - 32px);margin-top:126px;}
  .tool-band.tall .tool-band-tit h1{font-size:30px;}
  .tool-band.tall .tool-band-tit p{font-size:13px;}
  .tool-wrap{padding:116px 10px 40px;}
  .tool-wrap.narrow-wrap{padding-top:248px;}
  .rd-lnb{padding:10px 12px;border-radius:16px 16px 0 0;}
  .rd-lnb-title{font-size:15px;}
  .rd-body .rd-lnb-item{font-size:12px;padding:8px 10px;}
  .tool-main,.tool-panel.narrow .tool-main{padding:22px 16px;border-radius:0 0 16px 16px;}
  .tool-panel.narrow .tool-main{border-radius:16px;}
  .tool-h1{font-size:20px;}
  .tool-head{align-items:flex-start;flex-wrap:wrap;}
  .tool-tabs{width:100%;}
  .tool-tab{width:auto;flex:1;padding-inline:8px;}
  .meal-bar{display:block;}
  .meal-nav{justify-content:center;margin-bottom:14px;}
  .meal-bar>div:last-child{flex-wrap:wrap!important;}
  .meal-age{width:100%;}
  .meal-age a{width:auto;flex:1;padding-inline:8px;font-size:12px;}
  .meal-cal{min-width:760px;}
  .tool-main:has(.meal-cal){overflow-x:auto;}
  .mc-clsbar{padding:16px;align-items:flex-start;gap:12px;flex-direction:column;}
  .mc-clsbar .acts{width:100%;}
  .mc-clsbar .acts .mc-mini{flex:1;justify-content:center;}
  .mc-sum,.mc-item[open] .mc-sum{padding:18px 16px;}
  .mc-body{padding:16px;}
  .mc-grid2,.mc-addform .mc-grid2{display:block;}
  .mc-grid2>div+div{margin-top:14px;}
  .mc-in,.mc-name{width:100%;}
  .mc-birth .mc-in{width:100%;}
  .mc-facerow{display:block;}
  .mc-facenone,.mc-facethumbs{margin-top:10px;min-height:84px;}
  /* facerow가 block이 되면 nowrap 유지 이유가 사라진다 — 안 풀면 80px 썸네일이 줄줄이 테두리를 넘는다 */
  .mc-facerow .mc-faces{margin-top:10px;flex-wrap:wrap;}
  .mc-actions .rd-btn{flex:1;}
  .tn-banner{border-radius:14px;padding:14px;align-items:flex-start;flex-direction:column;}
  .tn-box,.mc-ta,.mc-addbox{padding:22px 16px;}
  .kn-hero{padding:28px 20px;min-height:420px;}
  .kn-hero .txt{width:100%;}
  .kn-hero h2{font-size:22px;}
  .kn-figure{right:-95px;top:auto;bottom:-70px;transform:scale(.58);transform-origin:right bottom;opacity:.55;}
  .kn-steps{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .kn-step{min-height:126px;}
  .kn-arrow{display:none;}
  .mp-row{align-items:flex-start;flex-direction:column;}
  .mp-actions,.mp-actions .rd-btn{width:100%;}

  /* member.css is loaded from the page body after this file, so use the
     .rd-body scope to keep the member card fluid on narrow phones. */
  .rd-body .mb-card{padding:22px 18px;}
  .rd-body .mb-row{display:block;}
  .rd-body .mb-illust{margin:0 auto 18px;}
  .rd-body .mb-info{width:100%;margin-left:0;justify-content:center;}
  .rd-body .mb-switch{padding:22px 18px;}
  .rd-body .mb-bullets{padding-left:0;}
  .rd-body .mb-bullet{align-items:flex-start;}
  .rd-body .mb-cta{align-items:stretch;flex-direction:column;}
  .rd-body .mb-cta button{width:100%;}

  /* popups must never exceed a phone viewport */
  .kr-pop,.kr-confirm,.rv-modal,.survey-modal,.fb-modal{width:calc(100vw - 24px);min-width:0;max-width:100%;}
  .kr-pop-top{padding:38px 24px;}
  .kr-pop h3{font-size:28px;}
  .kr-pop-body{padding:28px 24px 32px;}
  .kr-pop-btns{flex-direction:column;}
  .kr-pop-btns .sec{flex-basis:auto;}
  .survey-modal{padding:20px;}
}

@media (max-width:390px){
  .rd-header .rd-hd-user{max-width:56px;}
  .nt-namegrid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .rd-body .rd-btn{padding-inline:16px;}
  .rd-topnews .tn-tone{justify-content:center;overflow:hidden;}
  .rd-topnews .tn-tone .t1,.rd-topnews .tn-tone .vdiv{display:none;}
  .rd-topnews .tn-tone .t2{min-width:0;white-space:normal;}
}

@media (prefers-reduced-motion:reduce){
  .rd-body *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;}
}

/* ---------- permanent mobile navigation ---------- */
/* 1024 가 아니라 1199 까지 덮는다. GNB 항목 전체가 737px 를 요구하는데 헤더 왼쪽은
   1025px 에서 615px, 1199px 에서 718px 만 준다. .rd-nav a 가 nowrap + flex:0 0 auto 라
   줄지도 접히지도 않아 메뉴가 자기 자리를 넘어 우측(포도알·사용자명) 위에 겹쳐 그려졌다
   ("알림장 도우미 연동" 위에 "홍길동 선생님"). 1200px 에서 737/737 로 정확히 들어가므로
   그 앞까지만 덮는다.
   주의: 페이지 가로 스크롤과는 무관하다. nav 의 넘침은 뷰포트 안에서 끝나며,
   가로 스크롤의 원인은 .bann-card 와 .rc-sv-inner 였다(위 기본값 블록 참고). */
@media (max-width:1199px){
  html.mobile-nav-open,html.mobile-nav-open body{overflow:hidden;}
  .rd-header{height:62px;min-height:62px;padding:10px 14px;align-items:center;}
  .rd-hd-left{width:auto;display:flex;align-items:center;}
  .rd-hd-right{position:static;margin-left:auto;gap:8px;}
  .rd-hd-center,.rd-hd-usermenu,.rd-hd-right>a{display:none;}
  .rd-menu-toggle{display:inline-flex;flex:0 0 auto;width:44px;height:44px;border:0;border-radius:10px;background:rgba(255,255,255,.14);
    align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:0;cursor:pointer;}
  .rd-menu-toggle span{display:block;width:20px;height:2px;padding:0;border-radius:2px;background:#fff;}
  .rd-nav{position:fixed;z-index:2200;left:auto!important;right:0!important;top:0;bottom:0;width:min(88vw,360px);height:100dvh;
    display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:18px 16px max(24px,env(safe-area-inset-bottom));
    overflow-y:auto;overflow-x:hidden;background:#123b78;box-shadow:-18px 0 48px rgba(10,28,58,.3);
    transform:translateX(105%);transition:transform .22s ease;visibility:hidden;}
  .rd-nav.is-open{transform:translateX(0);visibility:visible;}
  .rd-nav-mobile-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;padding:0 4px 12px;
    border-bottom:1px solid rgba(255,255,255,.16);}
  .rd-nav .rd-nav-mobile-head strong{font-family:var(--rd-round);font-size:18px;color:#fff;}
  .rd-menu-close{display:inline-flex;position:relative;width:44px;height:44px;align-items:center;justify-content:center;
    border:0;border-radius:10px;background:rgba(255,255,255,.1);padding:0;cursor:pointer;}
  .rd-menu-close img{display:block;width:20px;height:20px;object-fit:contain;}
  .rd-nav a,.rd-nav span{flex:0 0 auto;}
  .rd-nav>a,.rd-nav-btns>a,.rd-nav-mobile-extra>a{width:100%;min-height:44px;padding:11px 12px!important;border-radius:10px;
    justify-content:flex-start;font-size:14px;color:#fff;}
  .rd-nav>a.is-active{background:#1b64da;border:1px solid rgba(255,255,255,.85);}
  .rd-nav .rd-nav-dim{color:rgba(255,255,255,.82);}
  .rd-nav-div{display:none;}
  .rd-nav-btns{display:flex!important;flex-direction:column;gap:4px;margin:0;}
  .rd-nav-btn{background:rgba(255,255,255,.08);font-size:14px;}
  .rd-nav-mobile-extra{display:flex;flex-direction:column;gap:4px;padding-top:4px;border-top:1px solid rgba(255,255,255,.12);}
  .rd-nav-backdrop{display:block;position:fixed;z-index:2190;inset:0;width:100%;height:100%;padding:0;border:0;
    background:rgba(10,24,48,.5);opacity:0;visibility:hidden;transition:opacity .2s ease;}
  .rd-header.nav-open .rd-nav-backdrop{opacity:1;visibility:visible;}

  .rd-lnb{display:none;}
  .tool-main{border-radius:20px;}
  /* transform 은 position:fixed 의 컨테이닝 블록을 만든다. .tool-hd 의 가운데정렬
     translateX(-50%) 가 살아 있으면 위 드로어가 뷰포트가 아니라 .tool-hd 기준으로
     붙어, 닫힌 상태(translateX(105%))에서도 페이지가 358px 늘어난다.
     이 규칙은 드로어와 반드시 같은 구간을 덮어야 한다. */
  .tool-hd{left:16px;right:16px;width:auto;transform:none;}
  .rd-body .tut-step{z-index:3000;}
}

@media (min-width:601px) and (max-width:820px){
  .rd-body .tut-wrap{width:calc(100vw - 32px);padding-right:24px;}
  .rd-body .tut-modal{width:100%;height:auto;min-height:420px;padding:44px 36px;}
  .rd-body .tut-title h3,.rd-body .tut-title p{white-space:normal;}
  .rd-body .tut-char{right:-10px;width:270px;opacity:.75;}
  .rd-body .tut-close{right:-2px;}
  .rd-body .tut-step-coach{max-width:calc(100vw - 28px);padding:28px;}
  .rd-body .tut-step-bar .wave,.rd-body .tut-step-bar .char{display:none;}
  .rd-body .tut-step-bar .inner{left:20px;right:20px;gap:14px;}
  .rd-body .tut-step-bar .prog .dot{margin-inline:20px;}
}

@media (max-width:600px){
  .rd-shell{padding:8px 10px 0;}
  .rd-header{height:60px;min-height:60px;padding:8px 10px;}
  .rd-hd-logo-link{height:34px;}
  .rd-hd-point{min-height:40px;}
  .rd-menu-toggle{width:42px;height:42px;}
  .rd-nav{width:min(92vw,340px);}

  /* 탭과 원아 선택은 가로 스크롤 대신 줄바꿈 카드로 표시한다. */
  .nt-tabs,.rc-tabs{width:calc(100% + 32px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    overflow:visible;margin-left:-16px;padding:0 16px;}
  .nt-page .nt-tab,.rc-page .rc-tab{min-width:0;width:100%;white-space:normal;padding:11px 8px;}
  .rc-month-tabs{display:block;width:calc(100% + 32px);margin-left:-16px;padding:0 16px;}
  .rc-month-tabs .rc-tab{display:none;}
  .rc-month-tabs .rc-month-select{display:block;width:100%;height:46px;padding:0 42px 0 15px;border:1px solid rgba(255,255,255,.72);
    border-radius:12px 12px 0 0;appearance:none;-webkit-appearance:none;
    background:#f6f8fc url(../images/app/rc-tab-dropdown.svg) no-repeat right 15px center/18px 18px;
    font-family:var(--rd-round);font-size:15px;font-weight:800;color:#2b2f34;}
  .rc-kids,.nt-kidlist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;}
  .rc-page .rc-child,.nt-kidrow{width:100%;min-width:0;}
  #jnMonths{display:none;}
  .jn-mobile-select{display:block;flex:1;width:100%;min-width:0;height:44px;padding:0 38px 0 14px;border:1px solid #dce2eb;border-radius:10px;
    appearance:none;-webkit-appearance:none;background:#fff url(../images/app/nt-caret.svg) no-repeat right 14px center/12px 12px;
    font-family:var(--rd-round);font-size:14px;font-weight:800;color:#2b2f34;}
  #jnWeeks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible;}
  .jn-page #jnWeeks .jn-fbtn{width:100%;min-width:0;max-width:none;padding-inline:4px;}
  .nt-namegrid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .nt-photobox .thumbs,.np-grid,.np-cardgrid{overflow:visible;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}

  /* 저장 알림장 달력: 휴대폰에서는 월·일을 드롭다운으로 선택한다. */
  .nt-mobile-date-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .nt-mobile-date-controls label{display:flex;min-width:0;flex-direction:column;gap:6px;}
  .nt-mobile-date-controls label>span{font-family:var(--rd-round);font-size:12px;font-weight:800;color:#667085;}
  .nt-mobile-date-controls select{width:100%;min-width:0;height:44px;padding:0 32px 0 10px;border:1px solid #dce2eb;border-radius:10px;
    appearance:none;-webkit-appearance:none;background:#fff url(../images/app/nt-caret.svg) no-repeat right 10px center/11px 11px;
    font-family:var(--rd-sans);font-size:13px;font-weight:700;color:#2b2f34;}
  .nt-cal2 .monthhd,.nt-cal2 .dowrow,.nt-cal2 .grid{display:none;}

  /* 식단표 월 이동도 같은 방식의 드롭다운으로 제공한다. */
  .meal-nav{width:100%;}
  .meal-month-select{display:block;width:100%;height:44px;padding:0 40px 0 14px;border:1px solid #dce2eb;border-radius:10px;
    appearance:none;-webkit-appearance:none;background:#fff url(../images/app/nt-caret.svg) no-repeat right 14px center/12px 12px;
    font-family:var(--rd-round);font-size:14px;font-weight:800;color:#2b2f34;}
  .meal-nav>a,.meal-nav>.mo{display:none;}

  /* 식단표: 넓은 5열 표를 날짜 카드로 바꾼다. 폼 input name/value는 그대로 유지한다. */
  .tool-main:has(.meal-cal){overflow:visible;}
  .meal-cal,.meal-cal tbody{display:block;width:100%;min-width:0;}
  .meal-cal thead{display:none;}
  .meal-cal tr{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px;}
  .meal-cal td{display:block;width:100%;height:auto;min-height:112px;padding:16px;border:1px solid #e1e5ec!important;
    border-radius:14px;background:#fff;box-shadow:0 4px 12px rgba(28,36,48,.05);}
  .meal-cal td.empty{display:none;}
  .meal-cal td::before{content:attr(data-weekday);display:inline-flex;margin-bottom:8px;padding:4px 8px;border-radius:999px;
    background:#eef4ff;color:#297bff;font-family:var(--rd-round);font-weight:800;font-size:12px;}
  .meal-day{display:inline-block;margin:0 0 8px 8px;font-size:16px;}
  .meal-day::after{content:"일";}
  .meal-slot{display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;align-items:start;margin:8px 0;}
  .meal-slot .lb{font-size:12px;padding-top:2px;}
  .meal-slot .tx{font-size:14px;word-break:break-word;}
  .meal-slot .mc-in{width:100%;height:44px;font-size:16px!important;}

  /* 튜토리얼: 코치마크와 진행 조작을 휴대폰의 실제 표시 영역 안에 유지한다. */
  .rd-body .rd-overlay{padding:8px;overflow-y:auto;}
  .rd-body .tut-wrap{width:100%;max-width:520px;padding:8px 0 0;}
  .rd-body .tut-modal{width:100%;height:auto;min-height:0;padding:32px 20px 24px;border-radius:22px;overflow:hidden;}
  .rd-body .tut-left,.rd-body .tut-textwrap{width:100%;gap:24px;}
  .rd-body .tut-textbox{gap:8px;}
  .rd-body .tut-textbox .eyebrow{font-size:13px;}
  .rd-body .tut-title h3{font-size:23px;line-height:1.35;white-space:normal;word-break:keep-all;}
  .rd-body .tut-title p{font-size:13px;line-height:1.55;white-space:normal;word-break:keep-all;}
  .rd-body .tut-cta,.rd-body .tut-btn{width:100%;min-height:48px;}
  .rd-body .tut-btns{width:100%;flex-direction:column;}
  .rd-body .tut-deco .logo{left:auto;right:-18px;top:54px;width:145px;opacity:.14;}
  .rd-body .tut-deco .w1,.rd-body .tut-deco .w2,.rd-body .tut-char{display:none;}
  .rd-body .tut-close{right:8px;top:0;width:40px;height:40px;}

  .rd-body .tut-step{z-index:3000;}
  .rd-body .tut-step-spot{border-width:3px;}
  .rd-body .tut-step-coach{width:calc(100vw - 16px);max-width:none;max-height:calc(100dvh - 190px);
    overflow-y:auto;padding:18px 16px;border-radius:14px;box-shadow:0 8px 28px rgba(16,24,40,.22);}
  .rd-body .tut-step-coach .eyebrow{font-size:12px;margin-bottom:7px;}
  .rd-body .tut-step-coach .ct{gap:6px;}
  .rd-body .tut-step-coach h4{font-size:17px;line-height:1.35;white-space:normal;word-break:keep-all;}
  .rd-body .tut-step-coach .ct p{max-width:none;font-size:13px;line-height:1.45;}
  .rd-body .tut-step-coach .arrow{border-left-width:11px;border-right-width:11px;border-bottom-width:9px;top:-8px;}
  .rd-body .tut-step-coach.up .arrow{bottom:-8px;border-top-width:9px;}
  .rd-body .tut-step-bar{height:auto;min-height:142px;padding:12px 10px max(10px,env(safe-area-inset-bottom));}
  .rd-body .tut-step-bar .wave,.rd-body .tut-step-bar .char{display:none;}
  .rd-body .tut-step-bar .inner{position:static;display:grid;grid-template-columns:minmax(0,1fr) auto;
    gap:10px;width:100%;align-items:center;}
  .rd-body .tut-step-bar .prog{grid-column:1/-1;width:100%;display:block;}
  .rd-body .tut-step-bar .mobile-current{display:flex;align-items:center;justify-content:space-between;gap:12px;}
  .rd-body .tut-step-bar .mobile-current>span{display:flex;align-items:center;gap:7px;min-width:0;}
  .rd-body .tut-step-bar .mobile-current small{padding:3px 6px;border-radius:5px;background:#e7f4fe;color:#248ace;font-size:11px;}
  .rd-body .tut-step-bar .mobile-current b{font-family:var(--rd-round);font-size:15px;white-space:nowrap;}
  .rd-body .tut-step-bar .mobile-current>strong{font-size:12px;color:#64748b;white-space:nowrap;}
  .rd-body .tut-step-bar .mobile-meter{display:block;width:100%;height:4px;margin-top:7px;border-radius:5px;background:#e3e7ee;overflow:hidden;}
  .rd-body .tut-step-bar .mobile-meter i{display:block;height:100%;background:#297bff;}
  .rd-body .tut-step-bar .btns{gap:7px;margin:0;}
  .rd-body .tut-step-bar .nav{min-height:46px;padding:12px 16px!important;border-radius:10px;}
  .rd-body .tut-step-bar .end{justify-self:end;min-height:44px;padding:6px;font-size:12px;}

  /* 휴대폰 정보 밀도: 터치 영역은 유지하고 장식·여백·카드 높이를 줄여 한 화면에 더 많이 보이게 한다. */
  .rd-container{padding-top:8px;}
  .rd-topnews{padding:10px 34px 10px 10px;border-radius:12px;}
  .rd-topnews .tn-ico{width:28px;height:28px;flex-basis:28px;}
  .rd-main{margin-top:10px;}
  .rd-secA{padding:18px 14px;border-radius:14px;}
  .rd-secB{margin-top:10px;gap:10px;}
  .rd-greet .g-date{font-size:12px;}
  .rd-greet .g-hi{margin-top:5px;font-size:20px;line-height:1.3;}
  .rd-greet .g-class{padding-top:30px;gap:5px;}
  .rd-greet .g-class .illust{display:none;}
  .rd-brief{margin-top:12px;padding:10px;}
  .rd-svc,.rd-help,.rd-flow{margin-top:14px;gap:7px;}
  .flow-tit{align-items:flex-start;flex-direction:column;gap:2px;white-space:normal;}
  .flow-tit .t2{font-size:11px;line-height:1.4;white-space:normal;}
  .rd-svc-row{gap:7px;}
  .svc-card,.card-notice,.card-journal,.card-observe{height:auto;min-height:172px;padding:17px 15px;border-radius:13px;}
  .svc-card .sc-ico{width:38px;height:38px;right:10px;top:-7px;}
  .svc-card .sc-title{font-size:14px;}
  .card-journal .sc-btn,.card-observe .sc-btn{left:15px;top:67px;min-height:40px;padding:9px 11px;}
  .box-s,.box-meal,.box-s.flex1{height:auto;min-height:72px;padding:14px;}
  .box-s .bs-title{font-size:14px;}
  .help-box,.help-box.w497,.help-box.flex1{height:auto;min-height:48px;padding:10px 12px;}
  .flow-row{margin-top:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;
    overflow:visible;padding:0;scroll-snap-type:none;}
  .flow-set{display:contents;min-width:0;}
  .flow-arrow{display:none;}
  .flow-box.fixed,.flow-box.flex1{width:100%;min-width:0;height:88px;flex:none;padding:9px 4px;gap:4px;}
  .flow-box .flabel{font-size:11px;white-space:normal;text-align:center;}
  .rd-bann{margin-top:14px;gap:8px;}
  .bann-card{padding:12px;gap:9px;border-radius:12px;}
  .bann-card .bc-ico{width:38px;height:38px;flex-basis:38px;}
  .bann-card .bc-title{font-size:12px;}
  .bann-card .bc-desc{font-size:11px;}

  .nt-subvisual,.jn-subvisual,.rc-subvisual{min-height:214px;padding:88px 14px 0;gap:10px;}
  .jn-subvisual{min-height:190px;padding-bottom:12px;}
  .nt-sv-ico,.jn-sv-ico,.rc-sv-ico,.nt-sv-ico img,.jn-sv-ico img,.rc-sv-ico img{width:42px;height:42px;flex-basis:42px;}
  .nt-sv-txt h1,.jn-sv-txt h1,.rc-sv-txt h1{font-size:22px;}
  .nt-sv-txt p,.jn-sv-txt p,.rc-sv-txt p{font-size:12px;}
  .nt-container,.jn-container,.rc-container{padding:14px 8px 28px;}
  .nt-panel,.jn-card,.rc-card{padding:15px 12px;border-radius:14px;gap:14px;}
  .nt-subtitle h2,.jn-subtitle h2,.rc-subtitle h2{font-size:17px;}
  .nt-textarea .ta-hd,.rc-ta-hd{padding:14px 14px 5px;}
  .nt-textarea .ta-body,.rc-ta-body{padding:5px 14px 20px;}

  .tool-band{min-height:174px;}
  .tool-band.tall{min-height:268px;}
  .tool-band.tall .tool-band-tit{margin-top:98px;}
  .tool-band.tall .tool-band-tit h1{font-size:25px;}
  .tool-wrap{padding:88px 8px 28px;}
  .tool-wrap.narrow-wrap{padding-top:202px;}
  .tool-hd{left:10px;right:10px;width:auto;}
  .tool-main,.tool-panel.narrow .tool-main{padding:16px 12px;border-radius:14px;}
  .tool-h1{font-size:18px;}
  .tool-hr{margin:13px 0;}

  /* 포도알 모달의 핵심 600px를 확대하고 바깥 장식 여백만 화면 밖으로 잘라낸다. */
  #rd-ev-modal{align-items:flex-start;justify-content:center;padding:4px 0;overflow-y:auto;overflow-x:hidden;}
  #rd-ev-modal .ev-modal{width:700px;min-width:700px;max-width:none;max-height:none;margin:auto;
    zoom:.9;zoom:min(.9,calc((100vw - 8px) / 600px));}
  #rd-ev-modal .ev-close{right:64px;}
}

/* ============================================================
   Figma responsive refinement

   데스크톱 수치를 통째로 축소하지 않고 Figma의 정보 계층(제목·상태·행동),
   기능별 포인트 컬러, 둥근 카드와 얕은 그림자를 작은 화면에 맞게 재배치한다.
   아래 블록이 휴대폰 규칙의 최종 정본이며, 본문 가독성과 터치 영역을 우선한다.
   ============================================================ */
@media (max-width:1024px){
  .rd-body{font-size:14px;line-height:1.55;}
  .rd-body :where(h1,h2,h3,h4,p,li,label,span){overflow-wrap:normal;word-break:keep-all;}
  .rd-body :where(input,textarea,select,button){font-size:16px;}
  .rd-body :where(a,button,input,select,textarea,summary){-webkit-tap-highlight-color:transparent;}

  /* 태블릿도 한쪽에 떠 보이지 않게 공통 콘텐츠 폭과 정렬을 맞춘다. */
  .nt-container,.jn-container,.rc-container,.tool-wrap{max-width:900px;margin-inline:auto;}
  .nt-panel,.jn-card,.rc-card,.tool-main{box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 24px -16px rgba(16,24,40,.2);}
  .nt-empty,.mc-empty,.tn-empty{min-height:120px;padding:28px 18px;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:8px;text-align:center;line-height:1.55;}
  .meal-empty{min-height:120px;padding:28px 18px;text-align:center;line-height:1.65;word-break:keep-all;}
  .meal-empty p{margin:0;}
  .meal-empty p+p{margin-top:6px;}
  .nt-empty.grow{min-height:220px;}
}

@media (max-width:600px){
  /* ---------- readable type and rhythm ---------- */
  .rd-body{--rd-mobile-pad:14px;--rd-mobile-gap:12px;font-size:14px;line-height:1.55;}
  .rd-body input,.rd-body textarea,.rd-body select{font-size:16px!important;line-height:1.45;}
  .rd-body :where(input,textarea,select){min-height:44px;}
  .rd-body .rd-btn,.rd-body .nt-cta-ghost,.rd-body .mc-mini{min-height:44px;font-size:14px;line-height:1.2;}
  .rd-body .rd-btn.sm{font-size:13px;}
  .rd-body :where(.nt-subtitle .desc,.jn-open-msg,.jn-sheet-hint,.rc-infobox,.tool-flash,
    .mc-fld .hint,.mp-sec h2 .sub,.tn-banner,.mb-bullet,.nt-empty p){font-size:13px;line-height:1.55;}

  /* ---------- shell and right-side navigation ---------- */
  .rd-shell{padding:8px 8px 0;}
  .rd-header{padding:8px 10px;border-radius:14px;}
  .rd-hd-logo{width:92px;height:auto;object-fit:contain;}
  .rd-hd-point{padding-inline:8px;}
  .rd-hd-point .pt{font-size:13px;}
  .rd-nav{right:0!important;left:auto!important;width:min(92vw,350px);padding-inline:14px;
    transform:translateX(105%);box-shadow:-18px 0 48px rgba(10,28,58,.3);}
  .rd-nav>a,.rd-nav-btns>a,.rd-nav-mobile-extra>a{font-size:15px;line-height:1.35;}

  /* ---------- dashboard: compact controls, readable content ---------- */
  .rd-container{padding-top:10px;}
  .rd-topnews{padding:12px 38px 12px 12px;gap:10px;}
  .rd-topnews .tn-txt{font-size:13px;line-height:1.5;}
  .rd-topnews .tn-tone .t1,.rd-topnews .tn-tone .t2{font-size:13px;line-height:1.4;}
  .rd-secA{padding:20px 16px;}
  .rd-greet .g-date{font-size:13px;line-height:1.45;}
  .rd-greet .g-hi{font-size:22px;line-height:1.35;}
  .rd-greet .g-class{padding-top:24px;}
  /* 모바일 첫 화면에서는 아래 업무 카드와 내용이 겹치는 AI 브리핑을 생략한다. */
  .rd-brief{display:none;}
  .rd-svc,.rd-help,.rd-flow{margin-top:18px;gap:10px;}
  .rd-svc-row,.help-row,.rd-bann{gap:10px;}
  .svc-card,.card-notice,.card-journal,.card-observe{min-height:184px;padding:18px 16px;}
  .svc-card .sc-title,.box-s .bs-title{font-size:15px;}
  .svc-card :where(.sc-date,.sc-stat,.reg,.wait),.box-s :where(.reg,.done,.wait){font-size:13px;line-height:1.45;}
  .card-journal .sc-btn,.card-observe .sc-btn{left:16px;top:70px;min-height:44px;font-size:13px;}
  .box-s,.box-meal,.box-s.flex1{min-height:82px;padding:15px;}
  .help-box,.help-box.w497,.help-box.flex1{min-height:56px;padding:12px 14px;}
  .help-box .hb-title{font-size:14px;white-space:normal;}
  .flow-tit .t2{font-size:13px;line-height:1.45;}
  .flow-box.fixed,.flow-box.flex1{height:96px;padding:10px 6px;}
  .flow-box .flabel{font-size:13px;line-height:1.35;}
  .flow-box :where(.fdone,.fcount,.fwait){font-size:12px;}
  .bann-card{padding:14px 12px;}
  .bann-card .bc-title{font-size:14px;white-space:normal;}
  .bann-card .bc-desc{font-size:13px;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}

  /* ---------- feature heroes: identity remains, copy does not dominate ---------- */
  .nt-subvisual,.jn-subvisual,.rc-subvisual{min-height:232px;padding:88px 14px 0;gap:12px;}
  .jn-subvisual{min-height:210px;padding-bottom:18px;}
  .nt-sv-inner,.jn-sv-inner,.rc-sv-inner{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:start;}
  .nt-sv-ico,.jn-sv-ico,.rc-sv-ico,.nt-sv-ico img,.jn-sv-ico img,.rc-sv-ico img{width:48px;height:48px;flex-basis:48px;}
  .nt-sv-txt,.jn-sv-txt,.rc-sv-txt{gap:5px;padding-top:1px;}
  .nt-sv-txt h1,.jn-sv-txt h1,.rc-sv-txt h1{font-size:24px;line-height:1.25;}
  .nt-sv-txt p,.jn-sv-txt p,.rc-sv-txt p{font-size:13px;line-height:1.5;opacity:.78;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
  /* 기능 설명은 탭 수와 무관하게 끝까지 읽혀야 한다. 알림장·보육일지·관찰/상담/발달평가에
     동일한 해제 규칙을 적용해 페이지별 클래스 차이로 말줄임이 다시 생기지 않게 한다. */
  .rd-body .nt-sv-txt p,.rd-body .jn-sv-txt p,.rd-body .rc-sv-txt p{
    display:block;-webkit-box-orient:initial;-webkit-line-clamp:unset;overflow:visible;}
  .rc-page .rc-subvisual{padding-bottom:12px;}
  .nt-container,.jn-container,.rc-container{padding:16px 8px 34px;gap:18px;}
  .nt-panel,.jn-card,.rc-card{padding:18px 14px;border-radius:16px;gap:18px;}
  .nt-subtitle,.jn-subtitle,.rc-subtitle{gap:10px;}
  .nt-subtitle img,.jn-subtitle .in img,.rc-subtitle .in img{width:28px;height:28px;}
  .nt-subtitle h2,.jn-subtitle h2,.rc-subtitle h2{font-size:19px;line-height:1.35;}
  .nt-subtitle .desc{width:100%;}

  /* tabs/selects: month/day are dropdowns, semester tabs stay untouched */
  .rc-month-tabs .rc-month-select,.jn-mobile-select,.nt-mobile-date-controls select,.meal-month-select{
    min-height:46px;font-size:15px;line-height:1.2;background-size:12px 12px;}
  .rc-month-tabs .rc-month-select{background-size:18px 18px;}
  .nt-page .nt-subvisual{padding-bottom:12px;}
  .nt-page .nt-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:6px;
    width:100%;margin:auto 0 0;padding:0;overflow:visible;}
  .nt-page .nt-tab{width:100%;min-width:0;min-height:44px;padding:10px 5px;border-radius:12px;border-bottom:1px solid rgba(255,255,255,.4);
    font-size:13px;line-height:1.3;letter-spacing:-.3px;white-space:nowrap;}
  .nt-page .nt-tab.on{border-color:#f6f8fc;}
  .nt-page .nt-tab .tabic{display:none!important;}
  .rc-page .rc-tab{min-height:46px;font-size:14px;line-height:1.3;}
  .rc-tabs:not(.rc-month-tabs){gap:6px;} /* 상담·발달평가 학기 탭 */

  /* ---------- forms and record cards ---------- */
  .nt-toprow,.nt-selrow,.jn-title,.jn-result-top{gap:12px;}
  .nt-textarea .ta-hd,.rc-ta-hd{padding:16px 14px 6px;}
  .nt-textarea .ta-hd b,.rc-ta-hd .h{font-size:16px;line-height:1.45;}
  .nt-textarea .ta-body,.rc-ta-body{padding:6px 14px 24px;}
  .nt-textarea textarea,.rc-ta-body textarea{font-size:16px;line-height:1.55;}
  .nt-selrow .desc{font-size:13px;line-height:1.45;}
  .nt-card .box{min-height:78px;padding:12px 8px;}
  .nt-card .box .nm{font-size:13px;}
  .nt-info{padding:18px 16px;}
  .nt-info .hd{font-size:15px;}
  .nt-info ul{padding-left:20px;}
  .nt-info li{font-size:14px;line-height:1.55;}
  .nt-empty.grow{min-height:160px;}
  /* 저장된 알림장 원아 목록은 데스크톱의 고정 3열 규칙보다 우선해
     좁은 화면에서 두 열로 감싼다. minmax(0, 1fr)로 긴 이름도 그리드를 밀지 않는다. */
  .nt-page .nt-namegrid.cols3{box-sizing:border-box;width:100%;min-width:0;
    grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .nt-page .nt-namegrid.cols3 .nt-namechip{min-width:0;padding:14px 6px;}
  .nt-page .nt-namegrid.cols3 .nt-namechip .nm{max-width:100%;overflow:hidden;text-overflow:ellipsis;}
  .nt-page .nt-child-editor,.nt-page .nt-doc{width:100%;min-width:0;}
  .nt-page .nt-kidhead .feat{display:none;}
  .nt-page .nt-doc{padding:18px 14px 22px;font-size:14px;line-height:1.65;}
  /* 공통 모바일 input min-height:44px가 결과 textarea의 360px를 덮지 않게 복구한다.
     본문은 내용 높이에 맞춰 JS가 늘리고, 가로 여백은 줄여 카드 폭을 충분히 사용한다. */
  .nt-page .nt-doc-ta{display:block;box-sizing:border-box;width:100%;min-width:0;min-height:260px;
    height:auto;padding:30px 0 34px;overflow-y:hidden;overflow-x:hidden;}
  .nt-page .nt-doc-copy{top:12px;right:12px;}
  .nt-page .nt-doc .nt-counter{right:14px!important;bottom:12px!important;}

  .rc-list{padding:14px;border-radius:14px;}
  .rc-summary-top span{font-size:16px;}
  .rc-cnt,.rc-child .nm,.rc-child .ct{font-size:13px;}
  .rc-page .rc-child{min-height:52px;padding:12px;}
  .rc-infobox{padding:16px;border-radius:14px;}
  .rc-profile .nm,.rc-profile .bd,.rc-info-right .lbl{font-size:15px;line-height:1.45;}
  .rc-acc{padding:20px 14px;gap:16px;}
  .rc-acc-head,.rc-acc-head .ttl{gap:10px;}
  .rc-acc-head .num{font-size:17px;line-height:1.4;white-space:normal;}
  .rc-field{min-height:44px;}
  .rc-field input{font-size:16px;}
  .rc-bottom{gap:8px;}

  .jn-filterbox{padding:18px 14px;gap:16px;}
  .jn-row{gap:8px;}
  .jn-row-label{padding:10px 12px;}
  #jnWeeks{gap:6px;}
  .jn-page #jnWeeks .jn-fbtn{min-height:44px;font-size:13px;}
  .jn-open,.jn-filterbox{padding:18px 14px;}

  /* ---------- utility pages ---------- */
  .tool-band{min-height:184px;}
  .tool-band.tall{min-height:286px;}
  .tool-band.tall .tool-band-tit{margin-top:104px;}
  .tool-band.tall .tool-band-tit h1{font-size:27px;line-height:1.3;}
  .tool-band.tall .tool-band-tit p{font-size:13px;line-height:1.5;}
  .tool-wrap{padding:98px 8px 34px;}
  .tool-wrap.narrow-wrap{padding-top:218px;}
  .tool-main,.tool-panel.narrow .tool-main{padding:18px 14px;border-radius:16px;}
  .tool-main[style*="min-height"]{min-height:0!important;}
  .tool-h1{font-size:20px;line-height:1.35;}
  .tool-head{gap:10px;}
  .tool-tab,.meal-age a{min-height:44px;font-size:14px;}
  .meal-edit-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;align-items:center!important;
    gap:8px 10px!important;margin-bottom:14px!important;}
  .meal-edit-head>b,.meal-edit-head>span{grid-column:1/-1;min-width:0;}
  .meal-edit-head>b{font-size:17px!important;line-height:1.35;word-break:keep-all;}
  .meal-edit-head>span{font-size:13px!important;line-height:1.45;word-break:keep-all;}
  .meal-edit-head>a{grid-column:2;margin-left:0!important;}
  .meal-edit-head>button{grid-column:3;}
  .meal-slot{grid-template-columns:78px minmax(0,1fr);}
  .meal-slot .lb{font-size:13px;line-height:1.4;}
  .meal-slot .tx{font-size:14px;line-height:1.55;word-break:keep-all;overflow-wrap:anywhere;}
  .mc-clsbar{padding:16px 14px;}
  .mc-clsbar .nm{font-size:15px;line-height:1.45;flex-wrap:wrap;}
  .mc-sum,.mc-item[open] .mc-sum{padding:17px 14px;}
  .mc-sum .snm,.mc-sum .sbd{font-size:16px;line-height:1.4;}
  .mc-body{padding:16px 14px 20px;}
  .mc-fld{font-size:15px;line-height:1.45;}
  .mc-facewrap,.mc-faceinner,.mc-facerow{min-width:0;max-width:100%;}
  /* 삭제 버튼의 44px 터치 영역까지 카드 안에 포함한다. auto-fill 그리드라 좁은 폰에서는
     2개+1개로 자연스럽게 내려가고, 360px 이상에서는 가능한 경우 세 장이 한 줄에 놓인다. */
  .mc-facerow .mc-faces{box-sizing:border-box;display:grid;width:100%;max-width:100%;min-width:0;
    grid-template-columns:repeat(auto-fill,80px);gap:14px;padding:0 12px 12px 0;overflow:visible;}
  .mc-facerow .mc-face{min-width:0;max-width:80px;}
  .tn-box,.mc-ta,.mc-addbox{padding:20px 14px;}
  .kn-hero{min-height:390px;padding:26px 18px;}
  .kn-hero h2{font-size:23px;line-height:1.4;}
  .kn-hero p{font-size:14px;line-height:1.6;}
  .kn-step h4{font-size:13px;line-height:1.4;}
  .kn-step p{font-size:12px;line-height:1.5;}
  .rd-body .kn-foot{font-size:13px;line-height:1.5;}
  .mp-sec h2{font-size:18px;line-height:1.4;}

  /* 사진 삭제 아이콘은 보이는 크기는 유지하고 터치 영역만 44px로 넓힌다. */
  .mc-face .rm{right:-12px;bottom:-12px;width:44px;height:44px;border:0;background:transparent;font-size:0;}
  .mc-face .rm::before{content:"×";display:flex;align-items:center;justify-content:center;width:24px;height:24px;
    border:1px solid #fff;border-radius:50%;background:#f6303e;color:#fff;font-size:12px;}

  /* ---------- floating helpers never cover the primary content ---------- */
  .rd-fab{right:10px;bottom:max(10px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px;align-items:flex-end;}
  .rd-body .rd-fab .fab-btn{width:46px!important;height:46px!important;min-width:46px;padding:0!important;border-radius:50%;justify-content:center;
    transition:width .22s ease,border-radius .22s ease,box-shadow .22s ease;}
  .rd-fab .fab-btn>span:not(.fab-icon){display:none;}
  .rd-fab .fab-icon{width:22px;height:22px;flex-basis:22px;}
  .rd-fab .tut .fab-icon img{width:22px;height:22px;}
  .rd-fab .fb .fab-icon img{left:2px;top:2px;width:18px;height:18px;}
  .rd-body:has(.tut-step:not([hidden])) .rd-fab,.rd-body:has(.rd-overlay.open) .rd-fab{visibility:hidden;}

  /* popup text remains readable; grape modal is deliberately handled above as one scaled canvas */
  .kr-pop,.kr-confirm,.rv-modal,.survey-modal,.fb-modal{font-size:14px;}
  .kr-pop h3{font-size:25px;line-height:1.35;}
  .kr-pop-body{font-size:14px;line-height:1.6;}
  .kr-feedback-panel{width:calc(100vw - 20px);max-width:390px;max-height:calc(100dvh - 88px);}
  .kr-feedback-event,.kr-feedback-event img{width:96px;height:106px;}
  .kr-feedback-event{right:14px;top:-70px;}
  .kr-feedback-headtext p,.kr-feedback-question .q-title,.kr-feedback-question .q-note,
  .kr-feedback-option,.kr-feedback-detail{font-size:14px;line-height:1.5;}

  /* tutorial copy and controls use the same mobile reading scale */
  .rd-body .tut-title p,.rd-body .tut-step-coach .ct p{font-size:14px;line-height:1.55;}
  .rd-body .tut-title br,.rd-body .tut-step-coach br.desktop-break{display:none;}
  .rd-body .tut-step-coach h4{font-size:18px;}
  .rd-body .tut-step-bar .mobile-current small,.rd-body .tut-step-bar .mobile-current>strong{font-size:12px;}
  .rd-body .tut-step-bar .end{font-size:13px;}

  /* authentication/legal pages share the same readable mobile scale */
  .rd-auth .au-main{padding:24px 12px 48px;}
  .rd-auth .au-inner{gap:28px;}
  .rd-auth .au-brand{gap:18px;}
  .rd-auth .au-card{padding:28px 18px;gap:22px;border-radius:18px;}
  .rd-auth .au-title .t1{font-size:26px;line-height:1.3;}
  .rd-auth .au-title .t2{font-size:30px;line-height:1.3;}
  .rd-auth .su-head,.rd-auth .tm-hd{gap:10px;align-items:flex-start;flex-direction:column;}
  .rd-auth .su-title,.rd-auth .tm-tit-main{font-size:22px;line-height:1.35;}
  .rd-auth .su-sub,.rd-auth .tm-hd-sub,.rd-auth .su-alert{font-size:14px;line-height:1.55;}
  .rd-auth .su-panel,.rd-auth .su-fields{gap:18px;}
  .rd-auth .su-sec-t{font-size:18px;line-height:1.4;}
  .rd-auth .su-tab,.rd-auth .su-select,.rd-auth .su-drop,.rd-auth .au-input{font-size:16px;}
  .rd-auth .su-drop{height:auto;min-height:60px;padding:12px 14px;text-align:center;line-height:1.45;}
  .rd-auth .su-result,.rd-auth .su-selected,.rd-auth .su-result .sub{font-size:13px;line-height:1.5;}
  .rd-auth .tm-head{min-height:56px;gap:10px;padding:14px 12px;}
  .rd-auth .tm-open{gap:6px;}
  .rd-auth .tm-labs{align-items:center;gap:4px;min-width:0;flex-wrap:nowrap;}
  .rd-auth .tm-name{display:flex;align-items:center;flex-wrap:wrap;column-gap:4px;min-width:0;
    font-size:13.5px;line-height:1.45;white-space:normal;word-break:keep-all;}
  .rd-auth .tm-name-part{white-space:nowrap;}
  .rd-auth .tm-tag{flex:0 0 auto;font-size:13px;line-height:1.45;white-space:nowrap;}
  .rd-auth .tm-caret{flex:0 0 18px;width:18px;}
  .rd-auth .tm-body-in,.rd-auth .tm-legal .legal-doc p,.rd-auth .tm-legal .legal-doc li{font-size:14px;line-height:1.65;}
  .rd-auth .tm-legal .legal-doc table,.rd-auth .tm-legal .legal-doc th,.rd-auth .tm-legal .legal-doc td{font-size:12px;line-height:1.55;}
}

/* 마우스가 있는 작은 화면에서는 Figma처럼 원형 FAB가 오른쪽을 고정한 채 왼쪽으로 펼쳐진다. */
@media (max-width:600px) and (hover:hover) and (pointer:fine){
  .rd-body .rd-fab .fab-btn.tut:hover,.rd-body .rd-fab .fab-btn.tut:focus-visible{width:116px!important;}
  .rd-body .rd-fab .fab-btn.fb:hover,.rd-body .rd-fab .fab-btn.fb:focus-visible{width:124px!important;}
  .rd-body .rd-fab .fab-btn:hover,.rd-body .rd-fab .fab-btn:focus-visible{
    padding:0 14px 0 12px!important;border-radius:23px;justify-content:flex-start;}
  .rd-fab .fab-btn:hover>span:not(.fab-icon),.rd-fab .fab-btn:focus-visible>span:not(.fab-icon){display:block;}
}

@media (max-width:360px){
  .rd-body{--rd-mobile-pad:12px;}
  .rd-hd-logo{width:86px;}
  .rd-hd-point{padding-inline:5px;}
  .rd-greet .g-hi{font-size:20px;}
  .nt-sv-inner,.jn-sv-inner,.rc-sv-inner{grid-template-columns:42px minmax(0,1fr);gap:10px;}
  .nt-sv-ico,.jn-sv-ico,.rc-sv-ico,.nt-sv-ico img,.jn-sv-ico img,.rc-sv-ico img{width:42px;height:42px;}
  .nt-sv-txt h1,.jn-sv-txt h1,.rc-sv-txt h1{font-size:22px;}
  .nt-mobile-date-controls{grid-template-columns:1fr;}
  .rc-kids,.nt-kidlist,.nt-namegrid{grid-template-columns:1fr;}
  .flow-row{grid-template-columns:1fr 1fr;}
}