/* 휴대폰 폭 덧댐(운영센터) — 결정요청서 E-04 ⓐ · 원본변경 C-61.
   원본 admin.css 는 한 글자도 고치지 않는다. 규칙은 전부 폭 480px 이하에서만 — PC 화면은 그대로다.
   재는 도구: node tools/qa/shot-all.mjs --width 375 (게이트 「모바일 넘침」) */
@media (max-width:480px){
  /* ① 머리줄 — 메뉴 버튼 · 로고 · 「내 정보」 · 「로그아웃」이 한 줄에 */
  .topbar{padding:0 10px;}
  .tb-logo{padding-right:8px;min-width:0;flex:0 1 auto;}
  .tb-logo img{height:20px;}
  .tb-logo b{display:none;}
  .tb-r{gap:6px;}
  .tb-btn{padding:0 8px;}

  /* ② 그리드 칸 — 한 줄로 접힌 칸이 안쪽 내용(표 최소폭 1,020px 등)을 따라 늘어나지 않게 */
  .grid > *, .flex > *, .page-bar > *{min-width:0;}

  /* ③ 표 — 스크롤 감싸개가 없는 표도 패널 폭 안에서 가로로 민다 */
  .panel > .tbl, .panel form > .tbl{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}

  /* ④ 입력 폼(dl.frm) — 제목 칸을 좁히고 입력 칸이 폭을 넘지 않게 */
  .frm .row{grid-template-columns:96px minmax(0,1fr);}
  .frm .row > *{min-width:0;}

  .frm dd input, .frm dd select, .frm dd textarea{max-width:100%;}
  /* ⑤ 인라인 그리드(입력칸 여러 개를 한 줄에 둔 dd 등) — 좁은 폭에서는 한 칸으로 쌓는다(인라인 스타일이라 !important) */
  [style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr) !important;}
}
