From a01a43a7ae5a0480fdf585bfc2131ce6bf8c89e9 Mon Sep 17 00:00:00 2001
From: sangkyu39 <sangkyu.p39@gmail.com>
Date: Sun, 22 Mar 2026 14:27:22 +0900
Subject: [PATCH 1/4] =?UTF-8?q?[FE]=20=EC=84=B8=EC=85=98=20=EC=82=AD?=
 =?UTF-8?q?=EC=A0=9C=20=EB=B0=8F=20=EC=88=98=EC=A0=95=20=EC=BC=80=EB=B0=A5?=
 =?UTF-8?q?=20=EC=95=88=20=EC=97=B4=EB=A6=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../SessionManagementCard.jsx                 | 16 +++++++
 .../SessionManagementCard.module.css          | 46 +++++++++++++++----
 2 files changed, 52 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/attendancemanage/SessionManagementCard.jsx b/frontend/src/components/attendancemanage/SessionManagementCard.jsx
index 8dd35ffa..91e7f1f9 100644
--- a/frontend/src/components/attendancemanage/SessionManagementCard.jsx
+++ b/frontend/src/components/attendancemanage/SessionManagementCard.jsx
@@ -20,6 +20,18 @@ const formatDate = (dateStr) => {
   return `${month}/${day}`;
 };
 
+const isSessionOwnerPermissionError = (error) => {
+  const status = error?.status ?? error?.response?.status;
+  const errorCode = error?.data?.errorCode ?? error?.response?.data?.errorCode;
+  const message =
+    error?.message ?? error?.data?.message ?? error?.response?.data?.message ?? '';
+  return (
+    status === 403 &&
+    (errorCode === 'NOT_SESSION_OWNER' ||
+      String(message).includes('세션 소유자 권한이 없습니다'))
+  );
+};
+
 const SessionManagementCard = ({ styles: commonStyles }) => {
   const {
     sessions,
@@ -97,6 +109,10 @@ const SessionManagementCard = ({ styles: commonStyles }) => {
                 toast.success('세션이 삭제되었습니다.');
               }
             } catch (error) {
+              if (isSessionOwnerPermissionError(error)) {
+                alert('세션 소유자 권한이 없어 삭제할 수 없습니다.');
+                return;
+              }
               toast.error('세션 삭제에 실패했습니다.');
             }
           }}
diff --git a/frontend/src/components/attendancemanage/SessionManagementCard.module.css b/frontend/src/components/attendancemanage/SessionManagementCard.module.css
index 3cde0d5f..a15ba3ce 100644
--- a/frontend/src/components/attendancemanage/SessionManagementCard.module.css
+++ b/frontend/src/components/attendancemanage/SessionManagementCard.module.css
@@ -598,21 +598,28 @@
 }
 
 .qrButton {
-  width: 86px;
+  background: linear-gradient(99.86deg, #b3ebff -15.44%, #91c3ff 39.86%, #d3edff 94.81%);
+  width: 89px;
   height: 40px;
-  border-radius: 10px;
-  padding: 0;
+  border-radius: 8px;
+  padding: 12px 26px;
+  gap: 10px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
   border: none;
-  background: linear-gradient(180deg, #b8ddff 0%, #9dc9f9 100%);
-  color: #2a3340;
-  font-size: 15px;
-  font-weight: 700;
-  box-shadow: none;
+  cursor: pointer;
+  box-sizing: border-box;
+  font-family: Inter, Pretendard, sans-serif;
+  font-weight: 600;
+  font-size: 14px;
+  color: #111827;
+  transition: opacity 0.2s, transform 0.2s;
 }
 
 .qrButton:hover {
-  opacity: 0.95;
-  transform: none;
+  opacity: 0.9;
+  transform: translateY(-1px);
 }
 
 .menuButton {
@@ -690,3 +697,22 @@
     justify-content: flex-end;
   }
 }
+
+/* Keep dropdown menu visible above table and card clipping */
+.sessionManagementCardContainer {
+  overflow: visible;
+}
+
+.headerControls {
+  overflow: visible;
+}
+
+.menuWrapper {
+  position: relative;
+  z-index: 30;
+  flex-shrink: 0;
+}
+
+.dropdownMenu {
+  z-index: 1000;
+}

From 4c3228d2f450ad355d4ed96a1d6aadbc7d349288 Mon Sep 17 00:00:00 2001
From: sangkyu39 <sangkyu.p39@gmail.com>
Date: Sun, 22 Mar 2026 14:34:39 +0900
Subject: [PATCH 2/4] =?UTF-8?q?[FE]=20=EC=84=B8=EC=85=98=20=EB=9D=BC?=
 =?UTF-8?q?=EC=9A=B4=EB=93=9C=20=EA=B4=80=EB=A6=AC=20=EC=8B=9C=20=EC=8B=9C?=
 =?UTF-8?q?=EC=9E=91=EC=8B=9C=EA=B0=84=EA=B3=BC=20=EC=A2=85=EB=A3=8C?=
 =?UTF-8?q?=EC=8B=9C=EA=B0=84=EC=9D=B4=20=EB=B3=B4=EC=9D=B4=EA=B2=8C=20?=
 =?UTF-8?q?=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../attendancemanage/SessionManagementCard.jsx       | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/attendancemanage/SessionManagementCard.jsx b/frontend/src/components/attendancemanage/SessionManagementCard.jsx
index 91e7f1f9..0a3a4463 100644
--- a/frontend/src/components/attendancemanage/SessionManagementCard.jsx
+++ b/frontend/src/components/attendancemanage/SessionManagementCard.jsx
@@ -206,8 +206,8 @@ const SessionManagementCard = ({ styles: commonStyles }) => {
           <thead>
             <tr>
               <th>일자</th>
-              <th>시간</th>
-              <th>가능(분)</th>
+              <th>시작시간</th>
+              <th>종료시간</th>
               <th>회차</th>
               <th>QR 코드</th>
               <th></th>
@@ -218,7 +218,6 @@ const SessionManagementCard = ({ styles: commonStyles }) => {
               currentDisplayedRounds.map((round, index) => {
                 const startTime = new Date(round.startAt);
                 const closeTime = new Date(round.closeAt);
-                const minutes = Math.floor((closeTime - startTime) / 60000);
 
                 return (
                   <tr key={round.roundId}>
@@ -229,7 +228,12 @@ const SessionManagementCard = ({ styles: commonStyles }) => {
                         minute: '2-digit',
                       })}
                     </td>
-                    <td>{minutes}</td>
+                    <td>
+                      {closeTime.toLocaleTimeString([], {
+                        hour: '2-digit',
+                        minute: '2-digit',
+                      })}
+                    </td>
                     <td>{index + 1}</td>
                     <td>
                       <button

From a873f3f128c7053c630898c5e8aecbadcd3d0274 Mon Sep 17 00:00:00 2001
From: sangkyu39 <sangkyu.p39@gmail.com>
Date: Sun, 22 Mar 2026 15:07:40 +0900
Subject: [PATCH 3/4] =?UTF-8?q?[FE]=20=ED=94=BC=EB=93=9C=EB=B0=B1=20?=
 =?UTF-8?q?=EB=AA=A8=EB=8B=AC=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AdminMemberManage/AdminMemberManage.jsx   |  11 +-
 frontend/src/components/Sidebar.jsx           | 319 ++++++++++++------
 frontend/src/components/Sidebar.module.css    | 199 +++++++++++
 3 files changed, 417 insertions(+), 112 deletions(-)

diff --git a/frontend/src/components/AdminMemberManage/AdminMemberManage.jsx b/frontend/src/components/AdminMemberManage/AdminMemberManage.jsx
index 9cd04d0f..cf4e740f 100644
--- a/frontend/src/components/AdminMemberManage/AdminMemberManage.jsx
+++ b/frontend/src/components/AdminMemberManage/AdminMemberManage.jsx
@@ -34,6 +34,7 @@ const STATUS_LABELS = {
 };
 
 const STATUS_OPTIONS = ['ACTIVE', 'INACTIVE', 'GRADUATED'];
+const STATUS_CHANGE_OPTIONS = ['ACTIVE', 'INACTIVE'];
 
 const GRADE_LABELS = {
   NEW_MEMBER: '신입부원',
@@ -147,11 +148,15 @@ const AdminMemberManage = () => {
   };
 
   const openStatusDialog = (member) => {
+    const initialStatus = STATUS_CHANGE_OPTIONS.includes(member.status)
+      ? member.status
+      : STATUS_CHANGE_OPTIONS[0];
+
     setChangeDialog({
       open: true,
       type: 'status',
       member,
-      value: member.status,
+      value: initialStatus,
     });
   };
 
@@ -189,7 +194,7 @@ const AdminMemberManage = () => {
         }
         await changeAdminMemberRole({ userId: member.id, role: value });
       } else if (type === 'status') {
-        if (!STATUS_OPTIONS.includes(value)) {
+        if (!STATUS_CHANGE_OPTIONS.includes(value)) {
           window.alert('유효하지 않은 상태입니다.');
           return;
         }
@@ -457,7 +462,7 @@ const AdminMemberManage = () => {
               {(changeDialog.type === 'role'
                 ? ROLE_OPTIONS
                 : changeDialog.type === 'status'
-                  ? STATUS_OPTIONS
+                  ? STATUS_CHANGE_OPTIONS
                   : GRADE_OPTIONS
               ).map((option) => (
                 <option key={option} value={option}>
diff --git a/frontend/src/components/Sidebar.jsx b/frontend/src/components/Sidebar.jsx
index fad0ac54..fcc18e56 100644
--- a/frontend/src/components/Sidebar.jsx
+++ b/frontend/src/components/Sidebar.jsx
@@ -26,6 +26,9 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
   const { isLoggedIn, logout } = useAuth();
   const [canSeeAdminMenu, setCanSeeAdminMenu] = useState(false);
   const [canSeeAttendanceManageMenu, setCanSeeAttendanceManageMenu] = useState(false);
+  const [isFeedbackModalOpen, setIsFeedbackModalOpen] = useState(false);
+  const [feedbackContent, setFeedbackContent] = useState('');
+  const [isSubmittingFeedback, setIsSubmittingFeedback] = useState(false);
 
   useEffect(() => {
     const loadParentBoards = async () => {
@@ -126,6 +129,38 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
     handleNavLinkClick();
   };
 
+  const openFeedbackModal = () => {
+    setIsFeedbackModalOpen(true);
+  };
+
+  const closeFeedbackModal = () => {
+    setIsFeedbackModalOpen(false);
+    setFeedbackContent('');
+  };
+
+  const handleFeedbackSubmit = async () => {
+    const content = feedbackContent.trim();
+    if (!content) {
+      toast.error('피드백 내용을 입력해주세요.');
+      return;
+    }
+
+    if (isSubmittingFeedback) {
+      return;
+    }
+
+    setIsSubmittingFeedback(true);
+    try {
+      await api.post('/api/user/feedbacks', { content });
+      toast.success('피드백이 접수되었습니다. 감사합니다.');
+      closeFeedbackModal();
+    } catch (error) {
+      toast.error(error?.message || '피드백 등록에 실패했습니다.');
+    } finally {
+      setIsSubmittingFeedback(false);
+    }
+  };
+
   return (
     <>
       {/* 모바일 오버레이 */}
@@ -140,9 +175,10 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
         }`}
         aria-hidden={!isOpen}
       >
-        <nav aria-label="사이드바">
-          <div className={styles['menu-section']}>
-            <span className={styles['menu-title']}>Main</span>
+        <div className={styles.sidebarContent}>
+          <nav aria-label="사이드바">
+            <div className={styles['menu-section']}>
+              <span className={styles['menu-title']}>Main</span>
 
             <button
               type="button"
@@ -186,153 +222,218 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
             )}
           </div>
 
-          <div className={styles['menu-section']}>
-            <span className={styles['menu-title']}>출석체크</span>
-            <ul>
-              <li>
-                <NavLink
-                  to="/attendance"
-                  className={({ isActive }) =>
-                    isActive ? styles['active-link'] : styles['inactive-link']
-                  }
-                  onClick={handleNavLinkClick}
-                >
-                  출석조회
-                </NavLink>
-              </li>
-              {isLoggedIn && canSeeAttendanceManageMenu && (
+            <div className={styles['menu-section']}>
+              <span className={styles['menu-title']}>출석체크</span>
+              <ul>
                 <li>
                   <NavLink
-                    to="/attendance-manage"
+                    to="/attendance"
                     className={({ isActive }) =>
                       isActive ? styles['active-link'] : styles['inactive-link']
                     }
                     onClick={handleNavLinkClick}
                   >
-                    출석관리(담당자)
+                    출석조회
                   </NavLink>
                 </li>
-              )}
-            </ul>
-          </div>
-
-          <div className={styles['menu-section']}>
-            <span className={styles['menu-title']}>트레이딩</span>
-            <ul>
-              <li>
-                <NavLink
-                  to="/quant-bot"
-                  className={({ isActive }) =>
-                    isActive ? styles['active-link'] : styles['inactive-link']
-                  }
-                  onClick={handleNavLinkClick}
-                >
-                  퀀트봇
-                </NavLink>
-              </li>
-              <li>
-                <NavLink
-                  to="/stock-game"
-                  className={({ isActive }) =>
-                    isActive ? styles['active-link'] : styles['inactive-link']
-                  }
-                  onClick={handleNavLinkClick}
-                >
-                  주식베팅
-                </NavLink>
-              </li>
-              <li>
-                <NavLink
-                  to="/backtest"
-                  className={({ isActive }) =>
-                    isActive ? styles['active-link'] : styles['inactive-link']
-                  }
-                  onClick={handleNavLinkClick}
-                >
-                  백테스팅
-                </NavLink>
-              </li>
-            </ul>
-          </div>
+                {isLoggedIn && canSeeAttendanceManageMenu && (
+                  <li>
+                    <NavLink
+                      to="/attendance-manage"
+                      className={({ isActive }) =>
+                        isActive ? styles['active-link'] : styles['inactive-link']
+                      }
+                      onClick={handleNavLinkClick}
+                    >
+                      출석관리(담당자)
+                    </NavLink>
+                  </li>
+                )}
+              </ul>
+            </div>
 
-          <div className={styles['menu-section']}>
-            <span className={styles['menu-title']}>계정</span>
-            <ul>
-              <li>
-                <NavLink
-                  to="/mypage"
-                  className={({ isActive }) =>
-                    isActive ? styles['active-link'] : styles['inactive-link']
-                  }
-                  onClick={handleNavLinkClick}
-                >
-                  마이페이지
-                </NavLink>
-              </li>
-
-              {isLoggedIn && canSeeAdminMenu && (
+            <div className={styles['menu-section']}>
+              <span className={styles['menu-title']}>트레이딩</span>
+              <ul>
+                <li>
+                  <NavLink
+                    to="/quant-bot"
+                    className={({ isActive }) =>
+                      isActive ? styles['active-link'] : styles['inactive-link']
+                    }
+                    onClick={handleNavLinkClick}
+                  >
+                    퀀트봇
+                  </NavLink>
+                </li>
+                <li>
+                  <NavLink
+                    to="/stock-game"
+                    className={({ isActive }) =>
+                      isActive ? styles['active-link'] : styles['inactive-link']
+                    }
+                    onClick={handleNavLinkClick}
+                  >
+                    주식베팅
+                  </NavLink>
+                </li>
                 <li>
                   <NavLink
-                    to="/admin"
+                    to="/backtest"
                     className={({ isActive }) =>
                       isActive ? styles['active-link'] : styles['inactive-link']
                     }
                     onClick={handleNavLinkClick}
                   >
-                    관리자
+                    백테스팅
                   </NavLink>
                 </li>
-              )}
+              </ul>
+            </div>
 
-              {isLoggedIn ? (
+            <div className={styles['menu-section']}>
+              <span className={styles['menu-title']}>계정</span>
+              <ul>
                 <li>
                   <NavLink
-                    to="/"
-                    className={styles['inactive-link']}
-                    onClick={(e) => {
-                      e.preventDefault();
-                      handleLogout();
-                      handleNavLinkClick();
-                    }}
+                    to="/mypage"
+                    className={({ isActive }) =>
+                      isActive ? styles['active-link'] : styles['inactive-link']
+                    }
+                    onClick={handleNavLinkClick}
                   >
-                    로그아웃
+                    마이페이지
                   </NavLink>
                 </li>
-              ) : (
-                <>
+
+                {isLoggedIn && canSeeAdminMenu && (
                   <li>
                     <NavLink
-                      to="/login"
+                      to="/admin"
                       className={({ isActive }) =>
-                        isActive
-                          ? styles['active-link']
-                          : styles['inactive-link']
+                        isActive ? styles['active-link'] : styles['inactive-link']
                       }
                       onClick={handleNavLinkClick}
                     >
-                      로그인
+                      관리자
                     </NavLink>
                   </li>
+                )}
 
+                {isLoggedIn ? (
                   <li>
                     <NavLink
-                      to="/signup"
-                      className={({ isActive }) =>
-                        isActive
-                          ? styles['active-link']
-                          : styles['inactive-link']
-                      }
-                      onClick={handleNavLinkClick}
+                      to="/"
+                      className={styles['inactive-link']}
+                      onClick={(e) => {
+                        e.preventDefault();
+                        handleLogout();
+                        handleNavLinkClick();
+                      }}
                     >
-                      회원가입
+                      로그아웃
                     </NavLink>
                   </li>
-                </>
-              )}
-            </ul>
+                ) : (
+                  <>
+                    <li>
+                      <NavLink
+                        to="/login"
+                        className={({ isActive }) =>
+                          isActive
+                            ? styles['active-link']
+                            : styles['inactive-link']
+                        }
+                        onClick={handleNavLinkClick}
+                      >
+                        로그인
+                      </NavLink>
+                    </li>
+
+                    <li>
+                      <NavLink
+                        to="/signup"
+                        className={({ isActive }) =>
+                          isActive
+                            ? styles['active-link']
+                            : styles['inactive-link']
+                        }
+                        onClick={handleNavLinkClick}
+                      >
+                        회원가입
+                      </NavLink>
+                    </li>
+                  </>
+                )}
+              </ul>
+            </div>
+          </nav>
+
+          <div className={styles.feedbackTriggerWrap}>
+            <button
+              type="button"
+              className={styles.feedbackTriggerButton}
+              onClick={openFeedbackModal}
+            >
+              피드백 작성하기
+            </button>
           </div>
-        </nav>
+        </div>
       </div>
+
+      {isFeedbackModalOpen && (
+        <div
+          className={styles.feedbackModalOverlay}
+          onClick={closeFeedbackModal}
+          aria-hidden="true"
+        >
+          <div
+            className={styles.feedbackModal}
+            onClick={(event) => event.stopPropagation()}
+            role="dialog"
+            aria-modal="true"
+            aria-labelledby="feedback-modal-title"
+          >
+            <div className={styles.feedbackModalHeader}>
+              <div>
+                <h2 id="feedback-modal-title">피드백 작성</h2>
+                <p>솔직한 피드백은 금융IT팀에게 큰 도움이 됩니다.</p>
+              </div>
+              <button
+                type="button"
+                className={styles.feedbackModalCloseButton}
+                onClick={closeFeedbackModal}
+                aria-label="피드백 모달 닫기"
+              >
+                ×
+              </button>
+            </div>
+
+            <label className={styles.feedbackModalLabel} htmlFor="feedback-content">
+              내용
+            </label>
+            <textarea
+              id="feedback-content"
+              className={styles.feedbackModalTextarea}
+              placeholder="피드백 내용을 입력해주세요."
+              value={feedbackContent}
+              onChange={(event) => setFeedbackContent(event.target.value)}
+              maxLength={1000}
+            />
+
+            <div className={styles.feedbackModalActions}>
+              <button
+                type="button"
+                className={styles.feedbackSubmitButton}
+                onClick={handleFeedbackSubmit}
+                disabled={isSubmittingFeedback}
+              >
+                {isSubmittingFeedback ? '작성 중...' : '피드백 작성하기'}
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
     </>
   );
 };
diff --git a/frontend/src/components/Sidebar.module.css b/frontend/src/components/Sidebar.module.css
index 371f5c35..9edbcde5 100644
--- a/frontend/src/components/Sidebar.module.css
+++ b/frontend/src/components/Sidebar.module.css
@@ -34,6 +34,33 @@
   overflow-y: auto;
   overflow-x: hidden;
   box-sizing: border-box;
+  scrollbar-width: thin;
+  scrollbar-color: #3a3a3a #070910;
+}
+
+.homeSidebarMenu::-webkit-scrollbar {
+  width: 8px;
+}
+
+.homeSidebarMenu::-webkit-scrollbar-track {
+  background: #070910;
+  border-radius: 8px;
+}
+
+.homeSidebarMenu::-webkit-scrollbar-thumb {
+  background: #3a3a3a;
+  border-radius: 8px;
+  border: 1px solid #070910;
+}
+
+.homeSidebarMenu::-webkit-scrollbar-thumb:hover {
+  background: #4a4a4a;
+}
+
+.sidebarContent {
+  min-height: 100%;
+  display: flex;
+  flex-direction: column;
 }
 
 .open {
@@ -293,3 +320,175 @@
   font-size: 13px;
   padding: 8px 6px;
 }
+
+.feedbackTriggerWrap {
+  margin-top: auto;
+  padding-top: 12px;
+  border-top: 1px solid rgba(255, 255, 255, 0.08);
+}
+
+.feedbackTriggerButton {
+  width: 100%;
+  padding: 8px 2px;
+  border: none;
+  background: transparent;
+  color: #8f96a6;
+  font-size: 12px;
+  font-weight: 500;
+  letter-spacing: -0.01em;
+  text-align: left;
+  cursor: pointer;
+}
+
+.feedbackTriggerButton:hover {
+  color: #b8becc;
+}
+
+.feedbackModalOverlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.68);
+  z-index: 2100;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 20px;
+}
+
+.feedbackModal {
+  width: min(620px, calc(100vw - 36px));
+  background: #f4f4f4;
+  border-radius: 18px;
+  padding: 24px 24px 18px;
+  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
+}
+
+.feedbackModalHeader {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 14px;
+  margin-bottom: 14px;
+}
+
+.feedbackModalHeader h2 {
+  margin: 0;
+  color: #1b1b1b;
+  font-size: 22px;
+  line-height: 1.18;
+  font-weight: 700;
+}
+
+.feedbackModalHeader p {
+  margin: 6px 0 0;
+  color: #6f6f6f;
+  font-size: 14px;
+  line-height: 1.4;
+  font-weight: 500;
+}
+
+.feedbackModalCloseButton {
+  width: 32px;
+  height: 32px;
+  border: none;
+  background: transparent;
+  color: #222;
+  font-size: 26px;
+  line-height: 1;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.feedbackModalLabel {
+  display: inline-block;
+  margin-bottom: 8px;
+  color: #1c1c1c;
+  font-size: 18px;
+  font-weight: 700;
+  line-height: 1.2;
+}
+
+.feedbackModalTextarea {
+  width: 100%;
+  min-height: 130px;
+  border: 1px solid #d7d7d7;
+  border-radius: 10px;
+  resize: vertical;
+  padding: 12px 12px;
+  font-size: 14px;
+  color: #111;
+  background: #f8f8f8;
+  box-sizing: border-box;
+}
+
+.feedbackModalTextarea::placeholder {
+  color: #a6a6a6;
+}
+
+.feedbackModalTextarea:focus {
+  outline: none;
+  border-color: #7eb1ff;
+  box-shadow: 0 0 0 3px rgba(126, 177, 255, 0.22);
+}
+
+.feedbackModalActions {
+  margin-top: 14px;
+  display: flex;
+  justify-content: flex-end;
+}
+
+.feedbackSubmitButton {
+  border: none;
+  border-radius: 10px;
+  background: #2f7de5;
+  color: #fff;
+  min-width: 120px;
+  height: 36px;
+  padding: 0 12px;
+  font-size: 13px;
+  font-weight: 600;
+  cursor: pointer;
+}
+
+.feedbackSubmitButton:hover {
+  background: #246bc9;
+}
+
+.feedbackSubmitButton:disabled {
+  opacity: 0.7;
+  cursor: not-allowed;
+}
+
+@media (max-width: 1024px) {
+  .feedbackModal {
+    width: min(540px, calc(100vw - 24px));
+    padding: 20px 16px 14px;
+  }
+
+  .feedbackModalHeader h2 {
+    font-size: 20px;
+  }
+
+  .feedbackModalHeader p {
+    font-size: 13px;
+    margin-top: 6px;
+  }
+
+  .feedbackModalLabel {
+    font-size: 16px;
+  }
+
+  .feedbackModalTextarea {
+    min-height: 112px;
+    font-size: 13px;
+    padding: 10px 12px;
+  }
+
+  .feedbackSubmitButton {
+    min-width: 108px;
+    height: 34px;
+    font-size: 12px;
+  }
+}

From bdba0a35d922f9255e656b5a524d2c3a906fa639 Mon Sep 17 00:00:00 2001
From: sangkyu39 <sangkyu.p39@gmail.com>
Date: Sun, 22 Mar 2026 15:48:50 +0900
Subject: [PATCH 4/4] =?UTF-8?q?[FE]=20PR=20=EC=82=AC=ED=95=AD=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/Sidebar.jsx           | 53 ++++++++++++++++---
 frontend/src/components/Sidebar.module.css    | 11 ++++
 .../SessionManagementCard.module.css          |  6 +--
 3 files changed, 57 insertions(+), 13 deletions(-)

diff --git a/frontend/src/components/Sidebar.jsx b/frontend/src/components/Sidebar.jsx
index fcc18e56..66707077 100644
--- a/frontend/src/components/Sidebar.jsx
+++ b/frontend/src/components/Sidebar.jsx
@@ -1,7 +1,7 @@
 /* eslint-disable no-unused-vars */
 import { NavLink, useNavigate, useLocation } from 'react-router-dom';
 import styles from './Sidebar.module.css';
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { api } from '../utils/axios';
 import { toast } from 'react-toastify';
 import { useAuth } from '../contexts/AuthContext';
@@ -29,6 +29,8 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
   const [isFeedbackModalOpen, setIsFeedbackModalOpen] = useState(false);
   const [feedbackContent, setFeedbackContent] = useState('');
   const [isSubmittingFeedback, setIsSubmittingFeedback] = useState(false);
+  const feedbackTriggerButtonRef = useRef(null);
+  const feedbackTextareaRef = useRef(null);
 
   useEffect(() => {
     const loadParentBoards = async () => {
@@ -138,6 +140,36 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
     setFeedbackContent('');
   };
 
+  useEffect(() => {
+    if (!isFeedbackModalOpen) {
+      return;
+    }
+
+    const previousActiveElement = document.activeElement;
+    feedbackTextareaRef.current?.focus();
+
+    const handleKeyDown = (event) => {
+      if (event.key === 'Escape') {
+        closeFeedbackModal();
+      }
+    };
+
+    document.addEventListener('keydown', handleKeyDown);
+
+    return () => {
+      document.removeEventListener('keydown', handleKeyDown);
+
+      if (
+        previousActiveElement &&
+        typeof previousActiveElement.focus === 'function'
+      ) {
+        previousActiveElement.focus();
+      } else {
+        feedbackTriggerButtonRef.current?.focus();
+      }
+    };
+  }, [isFeedbackModalOpen]);
+
   const handleFeedbackSubmit = async () => {
     const content = feedbackContent.trim();
     if (!content) {
@@ -175,7 +207,11 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
         }`}
         aria-hidden={!isOpen}
       >
-        <div className={styles.sidebarContent}>
+        <div
+          className={styles.sidebarContent}
+          aria-hidden={isFeedbackModalOpen}
+          inert={isFeedbackModalOpen ? '' : undefined}
+        >
           <nav aria-label="사이드바">
             <div className={styles['menu-section']}>
               <span className={styles['menu-title']}>Main</span>
@@ -374,6 +410,7 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
               type="button"
               className={styles.feedbackTriggerButton}
               onClick={openFeedbackModal}
+              ref={feedbackTriggerButtonRef}
             >
               피드백 작성하기
             </button>
@@ -382,22 +419,21 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
       </div>
 
       {isFeedbackModalOpen && (
-        <div
-          className={styles.feedbackModalOverlay}
-          onClick={closeFeedbackModal}
-          aria-hidden="true"
-        >
+        <div className={styles.feedbackModalOverlay} onClick={closeFeedbackModal}>
           <div
             className={styles.feedbackModal}
             onClick={(event) => event.stopPropagation()}
             role="dialog"
             aria-modal="true"
             aria-labelledby="feedback-modal-title"
+            aria-describedby="feedback-modal-description"
           >
             <div className={styles.feedbackModalHeader}>
               <div>
                 <h2 id="feedback-modal-title">피드백 작성</h2>
-                <p>솔직한 피드백은 금융IT팀에게 큰 도움이 됩니다.</p>
+                <p id="feedback-modal-description">
+                  솔직한 피드백은 금융IT팀에게 큰 도움이 됩니다.
+                </p>
               </div>
               <button
                 type="button"
@@ -419,6 +455,7 @@ const Sidebar = ({ isOpen, isRoot, onClose }) => {
               value={feedbackContent}
               onChange={(event) => setFeedbackContent(event.target.value)}
               maxLength={1000}
+              ref={feedbackTextareaRef}
             />
 
             <div className={styles.feedbackModalActions}>
diff --git a/frontend/src/components/Sidebar.module.css b/frontend/src/components/Sidebar.module.css
index 9edbcde5..b6970d52 100644
--- a/frontend/src/components/Sidebar.module.css
+++ b/frontend/src/components/Sidebar.module.css
@@ -353,6 +353,7 @@
   align-items: center;
   justify-content: center;
   padding: 20px;
+  overflow-y: auto;
 }
 
 .feedbackModal {
@@ -361,6 +362,11 @@
   border-radius: 18px;
   padding: 24px 24px 18px;
   box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
+  max-height: calc(100vh - 40px);
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
 }
 
 .feedbackModalHeader {
@@ -462,9 +468,14 @@
 }
 
 @media (max-width: 1024px) {
+  .feedbackModalOverlay {
+    padding: 12px;
+  }
+
   .feedbackModal {
     width: min(540px, calc(100vw - 24px));
     padding: 20px 16px 14px;
+    max-height: calc(100vh - 24px);
   }
 
   .feedbackModalHeader h2 {
diff --git a/frontend/src/components/attendancemanage/SessionManagementCard.module.css b/frontend/src/components/attendancemanage/SessionManagementCard.module.css
index a15ba3ce..0780be4e 100644
--- a/frontend/src/components/attendancemanage/SessionManagementCard.module.css
+++ b/frontend/src/components/attendancemanage/SessionManagementCard.module.css
@@ -692,7 +692,7 @@
   .headerControls {
     width: auto;
     max-width: 100%;
-    overflow-x: visible;
+    overflow: visible;
     padding-bottom: 0;
     justify-content: flex-end;
   }
@@ -703,10 +703,6 @@
   overflow: visible;
 }
 
-.headerControls {
-  overflow: visible;
-}
-
 .menuWrapper {
   position: relative;
   z-index: 30;