Merge remote-tracking branch 'origin/sub_laptop_7' into main_laptop_1

M02_MasterTemplete/M02_MasterTemplete_Structure.css

@@ -6,39 +6,55 @@
   display: contents;
 }
 
-/* 카드 셋 나란히(같은 폭) · 카드 하나가 300px 안 되면 자동으로 2열 → 1열(칸 폭에 따라 · 창이 작아지면 바로 바뀜) */
+/* 카드 넷(도면 정보 · 면적산출 · 재료산출 · 선택 입력) = 2행 2열 · 카드 높이 고정(PLAN 31-2) ·
+   칸이 좁으면(720px 아래) 1열 */
 .m02-struct {
-  /* CAD 미리보기 · 면적산출 · 재료산출 내용 최소 높이 — 이보다 작아질 때만 화면이 스크롤 */
-  --m02-struct-body-min: 16rem;
+  /* 카드 본문은 카드 높이를 채움 — 넘치면 카드 안에서 스크롤 */
+  --m02-struct-body-min: 0;
+  --m02-struct-card-h: 360px;
   display: grid;
-  flex: 1 1 0; /* 메인 칸(창 높이)에서 표 아래 남은 높이를 다 차지 */
-  grid-auto-rows: minmax(auto, 1fr); /* 카드 셋 같은 높이 */
-  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
+  flex: none;
+  grid-auto-rows: var(--m02-struct-card-h);
+  grid-template-columns: repeat(2, minmax(0, 1fr));
   padding-top: var(--spacing-12);
   border-top: 1px solid var(--color-border);
   min-width: 0;
 }
 
+@media (max-width: 720px) {
+  .m02-struct {
+    grid-template-columns: minmax(0, 1fr);
+  }
+}
+
 .m02-struct > * {
   min-width: 0;
 }
 
-/* 집계표 칸을 골라 카드가 보이면 메인 칸을 창 높이로 고정 — 표 아래 남은 높이만큼만 카드(스크롤 없음) */
+/* 카드가 보이면 상세 칸은 창 높이까지 — 표 + 카드가 넘치면 상세 칸 전체가 스크롤 */
 .m02-main:has(> .m02-main__extra > .m02-struct:not([hidden])) {
   box-sizing: border-box;
-  height: calc(100vh - var(--spacing-64));
+  max-height: calc(100vh - var(--spacing-64));
+  overflow-y: auto;
 }
 
-/* 표는 줄어들지 않음(줄면 표가 카드 위로 넘침) — 창이 작으면 카드가 최소 높이에서 멈추고 화면이 스크롤 */
+/* 표는 줄어들지 않음(줄면 표가 카드 위로 넘침) */
 .m02-main:has(> .m02-main__extra > .m02-struct:not([hidden])) > .m02-main__host {
   flex-shrink: 0;
 }
 
-/* 카드 = 제목 + 머리 + 본문 — 본문이 남는 높이를 채움 */
+/* 카드 = 제목 + 머리 + 본문 — 본문이 남는 높이를 채움 · 넘치면 카드 안 스크롤 */
 .m02-struct__card {
   display: flex;
   flex-direction: column;
   min-height: 0;
+  overflow: hidden;
+}
+
+.m02-struct__card > :last-child {
+  flex: 1 1 0;
+  min-height: 0;
+  overflow: auto;
 }
 
 /* ui-sidebar-panel 은 display:flex 라 hidden 속성을 덮어씀 — 안 보일 땐 확실히 안 보이게 */