서버 인스턴스 늘어나면 sms가 서버카드 높이 따라가도록 수정, adapter 쪽 카드 꽉 채우도록 수정.

WebContent/jsp/dashboard-modern/components/dashboard-adapter.jsp

@@ -115,10 +115,15 @@
     .adapter-summary-card {
         padding: 0;
         overflow: hidden;
+        display: flex;
+        flex-direction: column;
     }
 
     .adapter-summary-container {
         padding: 0.5rem 1rem;
+        flex-grow: 1;
+        display: flex;
+        flex-direction: column;
     }
 
     .adapter-summary-header {
@@ -130,8 +135,10 @@
     }
 
     .adapter-summary-body {
-        max-height: 300px;
+        flex-grow: 1;
-        overflow-y: auto;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around; /* 내용을 수직으로 균등 배분 */
     }
 
     .adapter-summary-row {

WebContent/jsp/dashboard-modern/components/dashboard-sms.jsp

@@ -33,11 +33,9 @@
     .dashboard-sms-summary .card {
         border-radius: 0.35rem;
         box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15);
-        height: 337px; /* servers 카드와 강제로 높이 맞춤 */
     }
 
     .sms-table-container {
-        max-height: 220px;
         overflow-y: auto;
     }
 
@@ -56,8 +54,6 @@
         position: sticky;
         top: 0;
         z-index: 10;
-        
-        /* 텍스트 정렬, 균등하게  */
     }
 
     .sms-table td {

WebContent/jsp/dashboard-modern/modern-dashboard.jsp

@@ -126,12 +126,8 @@
     </script>
 
     <style>
-    	/* 2025.12.08 광주은행
+    	/* 모든 카드는 7:3 기준으로 수정, 광주은행 요청사항 */
-    	 1. 모든 카드를 7:3 기준으로 변경함.
+    
-    	 2. 자동으로 높이를 맞추지않고 왼쪽 요소 기준으로 오른쪽 높이를 강제로 설정함.
-    	 3. 중요도에 따라 각 카드 위치 변경.
-    	 */
-    	 
         /* 1번 줄 (5:3 비율) - 서버 상태, 배치 처리 상태 */
         .first-row {
             grid-template-columns: 7fr 3fr;
@@ -182,7 +178,7 @@
 <div class="container">
     <!-- 헤더 영역 -->
     <jsp:include page="components/dashboard-header.jsp" />
-
+    
     <!-- 1번 줄 (5:3 비율) - 서버 상태, 배치 처리 상태 -->
     <div class="dashboard-row first-row">
         <!-- 서버 상태 섹션 (5/8 비율) -->
@@ -205,7 +201,7 @@
 
     <!-- 2번 줄 (1:1 비율) - 거래 처리 집계, 실시간 트랜잭션 현황 -->
     <div class="dashboard-row second-row">
-		<!-- 어댑터 섹션 (8/10 비율) -->
+        <!-- 어댑터 섹션 (8/10 비율) -->
         <div class="adapters-container">
             <jsp:include page="components/dashboard-adapter.jsp">
                 <jsp:param name="serverTypeMap" value="<%= serverTypeMap %>" />
@@ -222,6 +218,7 @@
 
     <!-- 3번 줄 (8:2 비율) - 어댑터 상태, 장애통보(SMS) -->
     <div class="dashboard-row third-row">
+    
         <!-- 실시간 트랜잭션 현황 섹션 (좌측) -->
         <div class="transaction-overview-container">
             <jsp:include page="components/dashboard-tran-chart.jsp" />
@@ -239,19 +236,33 @@
 </div>
 
 <script type="text/javascript">
-    // 서버 데이터 초기화
+    // 행의 높이를 맞추는 함수 (카드를 직접 타겟)
-    <%= serverDataJS.toString() %>
+    function matchRowHeights() {
+        $('.dashboard-row').each(function() {
+            var maxHeight = 0;
+            // 각 행에 있는 .card 요소를 직접 찾음
+            var $cards = $(this).find('.card');
 
-    // 자동 새로고침 타이머 변수 (window 객체에 할당)
+            if ($cards.length > 1) {
-    window.refreshTimer = null;
+                // 자식 요소의 자연 높이를 얻기 위해 min-height 초기화
-    window.refreshInterval = 5; // 기본값 10초
+                $cards.css('min-height', '0');
 
-    // 숫자 포맷 유틸리티 함수
+                // 자식 카드들의 최대 높이를 찾음
-    function formatNumber(num) {
+                $cards.each(function() {
-        return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+                    var currentHeight = $(this).outerHeight();
+                    if (currentHeight > maxHeight) {
+                        maxHeight = currentHeight;
+                    }
+                });
+
+                // 모든 자식 카드에 최대 높이를 min-height로 적용
+                if (maxHeight > 0) {
+                    $cards.css('min-height', maxHeight + 'px');
+                }
+            }
+        });
     }
 
-    // 서버 데이터 설정 및 대시보드 초기화
     $(document).ready(function() {
         // 대시보드 초기화
         initDashboard('<%=request.getContextPath()%>');
@@ -275,6 +286,25 @@
         // modern-dashboard.js의 함수 호출
         window.startRefreshTimer();
         window.updateRefreshStatus();
+
+        // --- 높이 맞춤 로직 ---
+        // 초기 렌더링 후 높이 맞춤 (약간의 지연 후)
+        setTimeout(function() { matchRowHeights(); }, 300);
+
+        // 데이터 로딩이 끝날 때마다 높이 다시 맞춤
+        if (window.DashboardEventManager) {
+            window.DashboardEventManager.on('loading-end', function() {
+                // 데이터 렌더링을 위한 약간의 지연 후 높이 맞춤
+                setTimeout(function() { matchRowHeights(); }, 100);
+            });
+        }
+
+        // 창 크기 조절 시 높이 다시 맞춤 (디바운싱 적용)
+        var resizeTimeout;
+        $(window).on('resize', function() {
+            clearTimeout(resizeTimeout);
+            resizeTimeout = setTimeout(function() { matchRowHeights(); }, 200);
+        });
     });
 </script>
 </body>