diff --git a/frontend/src/pages/qna/QnADetailPage.module.css b/frontend/src/pages/qna/QnADetailPage.module.css
index e75dca6..0e4fd83 100644
--- a/frontend/src/pages/qna/QnADetailPage.module.css
+++ b/frontend/src/pages/qna/QnADetailPage.module.css
@@ -529,4 +529,105 @@
     align-items: center;
     justify-content: center;
     z-index: 101;
+}
+
+/* ════════════════════════════════════════
+   반응형 — 태블릿 (768px 이하)
+════════════════════════════════════════ */
+@media (max-width: 768px) {
+    .page {
+        margin-top: 40px;
+        padding: 36px 48px 100px;
+        border-radius: 24px 24px 0 0;
+    }
+
+    .questionText {
+        font-size: 20px;
+    }
+
+    .editInput {
+        font-size: 20px;
+    }
+}
+
+
+/* ════════════════════════════════════════
+   반응형 — 모바일 (480px 이하)
+════════════════════════════════════════ */
+@media (max-width: 480px) {
+    .page {
+        margin-top: 20px;
+        padding: 24px 20px 100px;
+        border-radius: 16px 16px 0 0;
+    }
+
+    /* ── 질문 본문 ── */
+    .qIcon {
+        font-size: 28px;
+    }
+
+    .questionText {
+        font-size: 18px;
+        padding-top: 2px;
+    }
+
+    .editInput {
+        font-size: 18px;
+    }
+
+    /* ── 작성자 행 ── */
+    .authorName {
+        font-size: 14px;
+    }
+
+    /* ── 액션 버튼 ── */
+    .actionRow {
+        gap: 6px;
+    }
+
+    .likeBtn,
+    .commentBtn {
+        font-size: 13px;
+        padding: 4px 8px;
+        height: 26px;
+    }
+
+    /* ── 댓글 말풍선 ── */
+    .commentBubble {
+        margin-left: 32px;
+        max-width: calc(100% - 32px);
+        padding: 8px 12px;
+    }
+
+    .commentDate {
+        margin-left: 32px;
+    }
+
+    .commentContent {
+        font-size: 13px;
+    }
+
+    .commentAuthorName {
+        font-size: 13px;
+    }
+
+    .commentImage {
+        max-width: 100%;
+    }
+
+    /* ── 댓글 수정 ── */
+    .commentEditWrapper {
+        flex-direction: column;
+    }
+
+    .commentEditButtons {
+        flex-direction: row;
+        justify-content: flex-end;
+    }
+
+    /* ── 하단 입력바 ── */
+    .commentInputBar {
+        bottom: 12px;
+        padding: 6px 10px;
+    }
 }
\ No newline at end of file
diff --git a/frontend/src/pages/qna/QnAListPage.module.css b/frontend/src/pages/qna/QnAListPage.module.css
index 9b32d7a..95ffedf 100644
--- a/frontend/src/pages/qna/QnAListPage.module.css
+++ b/frontend/src/pages/qna/QnAListPage.module.css
@@ -608,4 +608,148 @@
     display: flex;
     align-items: center;
     justify-content: center;
+}
+
+/* ════════════════════════════════════════
+   반응형 — 태블릿 (768px 이하)
+════════════════════════════════════════ */
+@media (max-width: 768px) {
+    .title {
+        font-size: 26px;
+        padding-top: 40px;
+    }
+
+    .understandName {
+        font-size: 20px;
+    }
+
+    .understandCount {
+        font-size: 16px;
+    }
+
+    .questionText {
+        font-size: 18px;
+    }
+
+    .oxCount {
+        font-size: 18px;
+        margin-left: 10px;
+    }
+}
+
+
+/* ════════════════════════════════════════
+   반응형 — 모바일 (480px 이하)
+════════════════════════════════════════ */
+@media (max-width: 480px) {
+    .page {
+        padding-left: 12px;
+        padding-right: 12px;
+        padding-bottom: 120px;
+    }
+
+    .title {
+        font-size: 22px;
+        padding-top: 28px;
+        margin: 6px;
+    }
+
+    .filterRow {
+        padding: 8px 4px;
+        gap: 8px;
+    }
+
+    /* ── 이해도 바 ── */
+    .understandBar {
+        height: auto;
+        min-height: 48px;
+        padding: 8px 10px;
+        flex-wrap: wrap;
+    }
+
+    .understandName {
+        font-size: 17px;
+    }
+
+    .understandCount {
+        font-size: 14px;
+    }
+
+    .oxBtn {
+        width: 30px;
+        height: 30px;
+        font-size: 12px;
+        margin: 0 2px;
+    }
+
+    .oxBtn:disabled {
+        width: 58px;
+        height: 30px;
+    }
+
+    .oxCount {
+        font-size: 16px;
+        margin-left: 8px;
+    }
+
+    /* ── 질문 카드 ── */
+    .questionList {
+        gap: 14px;
+    }
+
+    .questionCard {
+        width: 100%;
+        padding: 12px 14px;
+        border-radius: 20px;
+    }
+
+    .qIcon {
+        font-size: 28px;
+    }
+
+    .questionText {
+        font-size: 16px;
+    }
+
+    .questionActions {
+        gap: 6px;
+        margin-left: 4px;
+    }
+
+    .likeBtn {
+        width: 34px;
+        height: 22px;
+        font-size: 13px;
+    }
+
+    .commentBtn {
+        width: 76px;
+        height: 22px;
+        font-size: 13px;
+    }
+
+    /* ── 댓글 ── */
+    .commentPreview {
+        padding-left: 12px;
+        gap: 12px;
+    }
+
+    .commentItem {
+        max-width: 100%;
+    }
+
+    /* ── 하단 입력바 ── */
+    .newQuestionBar {
+        padding: 6px 10px;
+        bottom: 12px;
+    }
+
+    .newQuestionInput {
+        font-size: 16px;
+        /* iOS 자동 줌 방지 */
+    }
+
+    .newQuestionInputRow {
+        height: 36px;
+    }
 }
\ No newline at end of file
diff --git a/frontend/src/pages/qna/QnAMainPage.module.css b/frontend/src/pages/qna/QnAMainPage.module.css
index af7ee0f..38d5103 100644
--- a/frontend/src/pages/qna/QnAMainPage.module.css
+++ b/frontend/src/pages/qna/QnAMainPage.module.css
@@ -3,6 +3,8 @@
     min-height: 100vh;
     max-width: 880px;
     margin: 0 auto;
+    padding: 0 16px;
+    box-sizing: border-box;
 }
 
 /* ── 섹션 공통 ── */
@@ -119,6 +121,7 @@
     border: none;
     cursor: pointer;
     color: var(--black);
+    flex-shrink: 0;
 }
 
 .listItem:hover .enterBtn {
@@ -130,4 +133,125 @@
     text-align: center;
     color: var(--gray400);
     margin-top: 40px;
+}
+
+
+/* ════════════════════════════════════════
+   반응형 — 태블릿 (768px 이하)
+════════════════════════════════════════ */
+@media (max-width: 768px) {
+    .sectionTitle {
+        font-size: 26px;
+        padding: 16px 48px;
+        margin-bottom: 24px;
+    }
+
+    .card {
+        width: min(356px, 80%);
+        height: auto;
+        min-height: 120px;
+        box-sizing: border-box;
+    }
+
+    .cardTitle {
+        font-size: 20px;
+        margin: 12px 0;
+    }
+
+    .cardWeek,
+    .cardDate,
+    .cardTime {
+        font-size: 16px;
+    }
+
+    .listTitle {
+        font-size: 20px;
+    }
+
+    .listWeek {
+        font-size: 16px;
+    }
+
+    .icon {
+        margin-right: 14px;
+    }
+
+    .divider {
+        margin: 24px 0;
+    }
+
+    .section {
+        margin-bottom: 24px;
+    }
+}
+
+
+/* ════════════════════════════════════════
+   반응형 — 모바일 (480px 이하)
+════════════════════════════════════════ */
+@media (max-width: 480px) {
+    .page {
+        padding: 0 12px;
+    }
+
+    .sectionTitle {
+        font-size: 22px;
+        padding: 12px 16px;
+        margin-bottom: 20px;
+    }
+
+    .card {
+        width: min(356px, 80%);
+        padding: 14px 12px;
+    }
+
+    .cardTitle {
+        font-size: 18px;
+        margin: 10px 0;
+    }
+
+    .cardWeek,
+    .cardDate,
+    .cardTime {
+        font-size: 14px;
+    }
+
+    .list {
+        gap: 14px;
+    }
+
+    .listItem {
+        padding: 12px;
+        gap: 8px;
+    }
+
+    .listTitle {
+        font-size: 16px;
+    }
+
+    .listWeek {
+        font-size: 13px;
+    }
+
+    .icon {
+        margin-right: 10px;
+        flex-shrink: 0;
+    }
+
+    .enterBtn {
+        padding: 4px;
+    }
+
+    .divider {
+        margin: 20px 0;
+    }
+
+    .section {
+        margin-bottom: 20px;
+    }
+
+    .empty {
+        margin-top: 28px;
+        font-size: 14px;
+    }
 }
\ No newline at end of file