diff --git a/app/modules/project/templates/project/inbox.html b/app/modules/project/templates/project/inbox.html
index de32e2b..9498440 100644
--- a/app/modules/project/templates/project/inbox.html
+++ b/app/modules/project/templates/project/inbox.html
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
-
+
{% endblock %}
diff --git a/app/modules/project/templates/project/index.html b/app/modules/project/templates/project/index.html
index 1cc65e7..b37f4fa 100644
--- a/app/modules/project/templates/project/index.html
+++ b/app/modules/project/templates/project/index.html
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
-
+
{% endblock %}
diff --git a/app/modules/project/templates/project/project.html b/app/modules/project/templates/project/project.html
index a8156d2..3c05214 100644
--- a/app/modules/project/templates/project/project.html
+++ b/app/modules/project/templates/project/project.html
@@ -1,7 +1,7 @@
{% extends "erp_base.html" %}
{% block head_extra %}
-
+
diff --git a/app/static/project.css b/app/static/project.css
index e71f2b0..b62dfee 100644
--- a/app/static/project.css
+++ b/app/static/project.css
@@ -43,9 +43,22 @@
.pj-chip { display: inline-block; padding: 2px 8px; border-radius: 999px; background: #eef0f2; color: #525860; font-size: 11px; font-weight: 600; }
.pj-chip-sm { padding: 1px 6px; font-size: 10px; }
-/* ── 홈 ── */
-.pj-home { display: grid; grid-template-columns: 1fr 300px; gap: 28px; align-items: start; }
-@media (max-width: 980px) { .pj-home { grid-template-columns: 1fr; } }
+/* ── 홈 — 프로젝트 상세와 같은 "한 화면 채움" 레이아웃. 페이지(.erp-page)는
+ 스크롤하지 않고 프로젝트 목록(좌)·내 업무(우)가 각자 안에서만 스크롤.
+ .erp-page 는 flex column 이라 .pj-wrap 을 flex:1 로 늘려 남은 높이를
+ 확보하고, .pj-home 의 행을 1fr 로 확정해야 자식 height:100% 가 먹는다. */
+.erp-page > .pj-wrap { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; padding-bottom: 8px; }
+.pj-home {
+ flex: 1 1 auto; min-height: 0;
+ display: grid; grid-template-columns: minmax(0, 1fr) 300px; grid-template-rows: minmax(0, 1fr);
+ gap: 28px; align-items: stretch;
+}
+.pj-home-main { min-width: 0; min-height: 0; height: 100%; overflow-y: auto; padding-right: 4px; }
+@media (max-width: 980px) {
+ .erp-page > .pj-wrap:not(.pj-project-view) { display: block; }
+ .pj-home { display: block; }
+ .pj-home-main { height: auto; overflow: visible; }
+}
.pj-project-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; align-items: start; }
.pj-project-card {
@@ -116,11 +129,13 @@
.pj-section-head-done { margin-top: 22px; }
.pj-section-head-done h2 { font-size: 14px; color: #6b7280; }
-/* max-height 는 항상 값을 갖는 안전한 fallback(홈 화면처럼 부모가 고정
- 높이가 아닌 곳에서도 동작) — 프로젝트 상세 화면은 .pj-project-mytasks 가
- 더 구체적인 height:100% 로 덮어써서 화면 꽉 채움 레이아웃을 그대로 쓴다. */
-.pj-home-side { width: 300px; border-left: 1px solid #eef0f2; padding-left: 24px; max-height: calc(100vh - 160px); overflow-y: auto; }
-@media (max-width: 980px) { .pj-home-side { border-left: none; padding-left: 0; } }
+/* 홈/프로젝트 상세 공통 "내 업무" 패널 — 부모 grid 행(1fr)에 맞춰 높이를
+ 확정하고 자기 안에서만 스크롤. 300px 는 padding 포함(border-box). */
+.pj-home-side {
+ width: 300px; box-sizing: border-box; min-height: 0; height: 100%; overflow-y: auto;
+ border-left: 1px solid #eef0f2; padding-left: 24px; padding-right: 4px;
+}
+@media (max-width: 980px) { .pj-home-side { border-left: none; padding-left: 0; height: auto; overflow: visible; } }
.pj-mytask-list { list-style: none; margin: 0; padding: 0; }
.pj-mytask a { display: flex; align-items: center; gap: 8px; padding: 9px 6px; border-radius: 8px; text-decoration: none; color: inherit; }
.pj-mytask a:hover { background: #f6f7f8; }
@@ -155,26 +170,26 @@
스크롤바 때문(호버해야만 잠깐 보이는 스타일). 여기 자체 스크롤 패널들은
막대가 항상 보이도록 커스텀 스크롤바를 그린다(윈도우 설정과 무관하게
고정 표시). */
-.pj-home-side, .pj-project-mytasks, .pj-side, .pj-board {
- scrollbar-width: thin; scrollbar-color: #c7c9cf transparent;
+.pj-home-side, .pj-home-main, .pj-project-mytasks, .pj-side, .pj-board {
+ scrollbar-width: thin; scrollbar-color: #b9bcc4 #f1f2f4;
}
-.pj-home-side::-webkit-scrollbar, .pj-project-mytasks::-webkit-scrollbar,
-.pj-side::-webkit-scrollbar, .pj-board::-webkit-scrollbar { width: 8px; height: 8px; }
-.pj-home-side::-webkit-scrollbar-track, .pj-project-mytasks::-webkit-scrollbar-track,
-.pj-side::-webkit-scrollbar-track, .pj-board::-webkit-scrollbar-track { background: transparent; }
-.pj-home-side::-webkit-scrollbar-thumb, .pj-project-mytasks::-webkit-scrollbar-thumb,
+.pj-home-side::-webkit-scrollbar, .pj-home-main::-webkit-scrollbar, .pj-project-mytasks::-webkit-scrollbar,
+.pj-side::-webkit-scrollbar, .pj-board::-webkit-scrollbar { width: 9px; height: 9px; }
+.pj-home-side::-webkit-scrollbar-track, .pj-home-main::-webkit-scrollbar-track, .pj-project-mytasks::-webkit-scrollbar-track,
+.pj-side::-webkit-scrollbar-track, .pj-board::-webkit-scrollbar-track { background: #f1f2f4; border-radius: 999px; }
+.pj-home-side::-webkit-scrollbar-thumb, .pj-home-main::-webkit-scrollbar-thumb, .pj-project-mytasks::-webkit-scrollbar-thumb,
.pj-side::-webkit-scrollbar-thumb, .pj-board::-webkit-scrollbar-thumb {
- background-color: #c7c9cf; border-radius: 999px;
+ background-color: #b9bcc4; border-radius: 999px;
}
-.pj-home-side::-webkit-scrollbar-thumb:hover, .pj-project-mytasks::-webkit-scrollbar-thumb:hover,
-.pj-side::-webkit-scrollbar-thumb:hover, .pj-board::-webkit-scrollbar-thumb:hover { background-color: #a7aab3; }
+.pj-home-side::-webkit-scrollbar-thumb:hover, .pj-home-main::-webkit-scrollbar-thumb:hover, .pj-project-mytasks::-webkit-scrollbar-thumb:hover,
+.pj-side::-webkit-scrollbar-thumb:hover, .pj-board::-webkit-scrollbar-thumb:hover { background-color: #979ba5; }
@media (max-width: 1280px) {
.pj-layout { grid-template-columns: 230px 1fr; }
.pj-project-mytasks { display: none; }
}
@media (max-width: 900px) {
.erp-page:has(> .pj-wrap) { max-width: 1550px; }
- .pj-project-view { display: block; }
+ .erp-page > .pj-wrap.pj-project-view { display: block; }
.pj-layout { display: block; height: auto; }
.pj-side, .pj-main { height: auto; overflow: visible; }
}