마이페이지 UI 개선

Author: Danto7632

src/components/mypage/Mypage.css

@@ -23,17 +23,25 @@
     flex: 1;
     display: flex;
     justify-content: center;
+    align-items: flex-start;
+    flex-wrap: wrap;
+    gap: 48px;
+    padding: 104px 32px 128px;
+    box-sizing: border-box;
     color: var(--mypage-text-primary);
     background: var(--mypage-bg);
 }
 
 .mypage-content {
-    width: min(1120px, 100% - 48px);
-    padding: 72px 0 96px;
-    margin: 0 auto;
+    flex: 1 1 720px;
+    min-width: 0;
+    max-width: 1024px;
+    width: 100%;
+    padding: 0;
+    margin: 0;
     display: flex;
     flex-direction: column;
-    gap: 32px;
+    gap: 36px;
     box-sizing: border-box;
 }
 
@@ -486,6 +494,19 @@ body.body-scroll .mypage-content {
     }
 }
 
+@media (max-width: 960px) {
+    .mypage {
+        flex-direction: column;
+        align-items: stretch;
+        gap: 36px;
+        padding: 96px 24px 120px;
+    }
+
+    .mypage-content {
+        max-width: 100%;
+    }
+}
+
 @media (max-width: 840px) {
     .mypage-header {
         flex-direction: column;
@@ -517,9 +538,17 @@ body.body-scroll .mypage-content {
         background: #f8f9ff;
     }
 
+    .mypage {
+        flex-direction: column;
+        gap: 32px;
+        padding: 88px 18px 110px;
+    }
+
     .mypage-content {
         width: 100%;
-        padding: 56px 18px 72px;
+        margin: 0;
+        padding: 0;
+        gap: 32px;
     }
 
     .recent-projects,