diff --git a/web/static/css/style.css b/web/static/css/style.css
index 4aa822c..3a92efd 100644
--- a/web/static/css/style.css
+++ b/web/static/css/style.css
@@ -358,3 +358,142 @@ tr.kb-focus {
     outline: 2px solid var(--primary-color);
     outline-offset: -2px;
 }
+
+@media (max-width: 575.98px) {
+    .custom-table thead {
+        display: none;
+    }
+    .custom-table tbody tr {
+        display: block;
+        position: relative;
+        padding: 0.75rem;
+        border-bottom: 1px solid #dee2e6;
+    }
+    .custom-table tbody td {
+        display: inline-block;
+        border: none;
+        padding: 0;
+    }
+    
+    tr.assignment-row td:nth-child(1) {
+        position: absolute;
+        top: 0.75rem;
+        left: 0.75rem;
+    }
+    tr.assignment-row td:nth-child(2) {
+        position: absolute;
+        top: 0.75rem;
+        left: 2.25rem;
+    }
+    tr.assignment-row td:nth-child(5) {
+        display: block;
+        margin-left: 3.5rem; 
+        margin-right: 4rem; 
+        margin-bottom: 0.5rem;
+    }
+    tr.assignment-row td:nth-child(8) {
+        position: absolute;
+        top: 0.75rem;
+        right: 0.75rem;
+    }
+    tr.assignment-row td:nth-child(3) {
+        display: inline-block;
+        margin-right: 0.5rem;
+    }
+    tr.assignment-row td:nth-child(4) {
+        display: inline-block;
+        margin-right: 0.5rem;
+    }
+    tr.assignment-row td:nth-child(6) {
+        display: inline-block;
+        margin-right: 0.5rem;
+    }
+    tr.assignment-row td:nth-child(7) {
+        display: inline-block;
+    }
+    .countdown-col {
+        white-space: nowrap;
+        font-size: 0.75rem;
+    }
+
+    tr.recurring-row td:nth-child(1) {
+        display: block;
+        margin-bottom: 0.5rem;
+        margin-right: 3rem;
+    }
+    tr.recurring-row td:nth-child(5) {
+        position: absolute;
+        top: 0.75rem;
+        right: 0.75rem;
+    }
+    tr.recurring-row td:nth-child(2),
+    tr.recurring-row td:nth-child(3),
+    tr.recurring-row td:nth-child(4) {
+        display: inline-block;
+        margin-right: 0.5rem;
+    }
+
+    tr.user-row td:nth-child(1),
+    tr.user-row td:nth-child(5) {
+        display: none !important;
+    }
+    tr.user-row td:nth-child(2) {
+        display: block;
+        font-weight: bold;
+        margin-bottom: 0.25rem;
+    }
+    tr.user-row td:nth-child(3) {
+        display: block;
+        font-size: 0.85rem;
+        color: #6c757d;
+        margin-bottom: 0.5rem;
+    }
+    tr.user-row td:nth-child(6) {
+        position: absolute;
+        top: 0.75rem;
+        right: 0.75rem;
+    }
+    tr.user-row td:nth-child(4) {
+        display: inline-block;
+    }
+
+    .stats-table {
+        min-width: auto !important;
+    }
+    tr.subject-row td:nth-child(3),
+    tr.subject-row td:nth-child(4),
+    tr.subject-row td:nth-child(5) {
+        display: none !important;
+    }
+    .stats-table thead th:nth-child(3),
+    .stats-table thead th:nth-child(4),
+    .stats-table thead th:nth-child(5) {
+        display: none !important;
+    }
+
+    .dashboard-stat-card .display-4 {
+        font-size: 1.5rem !important;
+    }
+    .dashboard-stat-card h2 {
+        font-size: 1.4rem;
+    }
+    .dashboard-stat-card h6 {
+        font-size: 0.7rem;
+    }
+    .urgent-countdown {
+        font-size: 1.05rem !important;
+        padding-left: 0.75rem !important;
+        padding-right: 0.75rem !important;
+    }
+}
+
+@media (max-width: 767.98px) {
+    .nav-tabs#assignmentTabs {
+        flex-wrap: nowrap;
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+    }
+    .nav-tabs#assignmentTabs .ms-auto {
+        margin-left: 0 !important;
+    }
+}
diff --git a/web/templates/admin/users.html b/web/templates/admin/users.html
index 1b89c9c..047807d 100644
--- a/web/templates/admin/users.html
+++ b/web/templates/admin/users.html
@@ -7,7 +7,7 @@
 
 {{if .users}}
 <div class="table-responsive">
-    <table class="table table-hover" aria-label="ユーザー一覧">
+    <table class="table table-hover custom-table" aria-label="ユーザー一覧">
         <thead class="table-light">
             <tr>
                 <th scope="col">ID</th>
@@ -20,7 +20,7 @@
         </thead>
         <tbody>
             {{range .users}}
-            <tr {{if eq .ID $.currentUserID}}class="table-primary"{{end}}>
+            <tr class="user-row {{if eq .ID $.currentUserID}}table-primary{{end}}">
                 <td>{{.ID}}</td>
                 <td>{{.Name}}{{if eq .ID $.currentUserID}}<span class="badge bg-info ms-2">自分</span>{{end}}</td>
                 <td>{{.Email}}</td>
diff --git a/web/templates/assignments/index.html b/web/templates/assignments/index.html
index e537b27..60aad15 100644
--- a/web/templates/assignments/index.html
+++ b/web/templates/assignments/index.html
@@ -3,9 +3,9 @@
 {{define "content"}}
 <input type="hidden" id="_csrf_global" value="{{.csrfToken}}">
 
-<div class="d-flex justify-content-between align-items-center mb-3">
+<div class="d-flex flex-column flex-md-row justify-content-between align-items-md-center mb-3 gap-2">
     <h4 class="mb-0 fw-bold"><i class="bi bi-list-task me-2" aria-hidden="true"></i>課題一覧</h4>
-    <div class="d-flex gap-2 align-items-center flex-wrap">
+    <div class="d-flex gap-2 align-items-stretch align-items-md-center">
         <div class="btn-group btn-group-sm" role="group" aria-label="表示切替">
             <button type="button" class="btn btn-outline-secondary" id="viewTableBtn" onclick="setView('table')" title="テーブル表示">
                 <i class="bi bi-table" aria-hidden="true"></i>
@@ -14,13 +14,13 @@
                 <i class="bi bi-kanban" aria-hidden="true"></i>
             </button>
         </div>
-        <button class="btn btn-sm btn-outline-secondary" id="groupToggleBtn" onclick="toggleGrouping()" title="科目でグループ化">
-            <i class="bi bi-collection me-1" aria-hidden="true"></i><span id="groupBtnText">グループ化</span>
+        <button class="btn btn-sm btn-outline-secondary flex-fill" id="groupToggleBtn" onclick="toggleGrouping()" title="科目でグループ化">
+            <i class="bi bi-collection me-1" aria-hidden="true"></i><span id="groupBtnText" class="d-none d-sm-inline">グループ化</span>
         </button>
-        <button class="btn btn-sm btn-secondary text-white" onclick="toggleCountdown()" id="toggleCountdownBtn" aria-pressed="false">
-            <i class="bi bi-clock me-1" aria-hidden="true"></i><span id="countdownBtnText">残り非表示</span>
+        <button class="btn btn-sm btn-secondary text-white flex-fill" onclick="toggleCountdown()" id="toggleCountdownBtn" aria-pressed="false">
+            <i class="bi bi-clock me-1" aria-hidden="true"></i><span id="countdownBtnText" class="d-none d-sm-inline">残り非表示</span>
         </button>
-        <a href="/assignments/new" class="btn btn-sm btn-primary">
+        <a href="/assignments/new" class="btn btn-sm btn-primary flex-fill text-nowrap text-center">
             <i class="bi bi-plus-lg me-1" aria-hidden="true"></i>新規登録
         </a>
     </div>
@@ -57,14 +57,14 @@
 
 <form action="/assignments" method="GET" class="row g-2 mb-3 align-items-center" role="search">
     <input type="hidden" name="filter" value="{{.filter}}">
-    <div class="col-md-4">
+    <div class="col-md-4 col-12">
         <div class="input-group input-group-sm">
             <span class="input-group-text bg-white border-end-0 text-muted"><i class="bi bi-search" aria-hidden="true"></i></span>
             <label for="searchInput" class="visually-hidden">課題を検索</label>
             <input type="text" class="form-control border-start-0 ps-0 bg-white" id="searchInput" name="q" placeholder="検索..." value="{{.query}}">
         </div>
     </div>
-    <div class="col-md-2">
+    <div class="col-md-2 col-6">
         <label for="priorityFilter" class="visually-hidden">重要度</label>
         <select class="form-select form-select-sm bg-white" id="priorityFilter" name="priority" onchange="this.form.submit()">
             <option value="">全重要度</option>
@@ -73,14 +73,14 @@
             <option value="low"    {{if eq .priority "low"   }}selected{{end}}>低</option>
         </select>
     </div>
-    <div class="col-md-2">
+    <div class="col-md-2 col-6">
         <label for="subjectFilter" class="visually-hidden">科目</label>
         <select class="form-select form-select-sm bg-white" id="subjectFilter" name="subject" onchange="this.form.submit()">
             <option value="">全科目</option>
             {{range .subjects}}<option value="{{.}}" {{if eq . $.subject}}selected{{end}}>{{.}}</option>{{end}}
         </select>
     </div>
-    <div class="col-md-2">
+    <div class="col-md-2 col-6">
         <label for="sortSelect" class="visually-hidden">並び順</label>
         <select class="form-select form-select-sm bg-white" id="sortSelect" name="sort" onchange="this.form.submit()">
             <option value=""         {{if eq .sort ""          }}selected{{end}}>期限昇順</option>
@@ -90,7 +90,7 @@
             <option value="created_desc" {{if eq .sort "created_desc"}}selected{{end}}>登録日時</option>
         </select>
     </div>
-    <div class="col-md-2">
+    <div class="col-md-2 col-6">
         <a href="/assignments?filter={{.filter}}" class="btn btn-sm btn-outline-secondary w-100 bg-white">クリア</a>
     </div>
 </form>
diff --git a/web/templates/assignments/new.html b/web/templates/assignments/new.html
index 1183545..d9f0a2d 100644
--- a/web/templates/assignments/new.html
+++ b/web/templates/assignments/new.html
@@ -72,7 +72,7 @@
                         <div class="collapse" id="recurringSettings">
                             <div class="card-body py-2">
                                 <div class="row mb-2">
-                                    <div class="col-6">
+                                    <div class="col-sm-6 col-12 mb-2 mb-sm-0">
                                         <label for="recurrence_type" class="form-label small">繰り返しタイプ</label>
                                         <select class="form-select form-select-sm" id="recurrence_type" name="recurrence_type" onchange="updateRecurrenceOptions()">
                                             <option value="none" selected>なし</option>
@@ -81,7 +81,7 @@
                                             <option value="monthly">毎月</option>
                                         </select>
                                     </div>
-                                    <div class="col-6" id="interval_group" style="display: none;">
+                                    <div class="col-sm-6 col-12" id="interval_group" style="display: none;">
                                         <label for="recurrence_interval" class="form-label small">間隔</label>
                                         <div class="input-group input-group-sm">
                                             <input type="number" class="form-control" id="recurrence_interval" name="recurrence_interval" value="1" min="1" max="12" onchange="updateLeadDaysMax()">
@@ -142,10 +142,10 @@
                                         <label class="form-check-label small" for="end_date">終了日</label>
                                     </div>
                                     <div class="mt-1" id="end_count_group" style="display: none;">
-                                        <input type="number" class="form-control form-control-sm" id="end_count_value" name="end_count" value="10" min="1" style="width: 100px;">
+                                        <input type="number" class="form-control form-control-sm" id="end_count_value" name="end_count" value="10" min="1" style="max-width: 100px; width: 100%;">
                                     </div>
                                     <div class="mt-1" id="end_date_group" style="display: none;">
-                                        <input type="date" class="form-control form-control-sm" id="end_date_value" name="end_date" style="width: 150px;">
+                                        <input type="date" class="form-control form-control-sm" id="end_date_value" name="end_date" style="max-width: 150px; width: 100%;">
                                     </div>
                                 </div>
                             </div>
diff --git a/web/templates/assignments/statistics.html b/web/templates/assignments/statistics.html
index 1d97acd..7077dcb 100644
--- a/web/templates/assignments/statistics.html
+++ b/web/templates/assignments/statistics.html
@@ -62,7 +62,7 @@
                 <label for="toDate" class="form-label">登録日（終了）</label>
                 <input type="date" id="toDate" name="to" class="form-control" value="{{.toDate}}">
             </div>
-            <div class="col-md-4 d-flex align-items-end">
+            <div class="col-md-4 d-flex align-items-end mt-2 mt-md-0">
                 <button type="submit" class="btn btn-primary me-2">
                     <i class="bi bi-filter me-1" aria-hidden="true"></i>絞り込み
                 </button>
diff --git a/web/templates/layouts/base.html b/web/templates/layouts/base.html
index 8ff87fc..df077d7 100644
--- a/web/templates/layouts/base.html
+++ b/web/templates/layouts/base.html
@@ -87,7 +87,7 @@
     <footer class="footer mt-auto py-1 bg-light">
         <div class="container text-center">
             <span class="text-muted small" style="font-size: 0.75rem;">Super Homework Manager</span><br>
-            <small class="text-muted" style="font-size: 0.65rem;">Licensed under <a
+            <small class="text-muted" style="font-size: 0.75rem;">Licensed under <a
                     href="https://www.gnu.org/licenses/agpl-3.0.html" target="_blank">AGPLv3</a> | Time:
                 {{.processing_time}}</small>
         </div>
diff --git a/web/templates/recurring/index.html b/web/templates/recurring/index.html
index 4529464..8e7b8bf 100644
--- a/web/templates/recurring/index.html
+++ b/web/templates/recurring/index.html
@@ -10,7 +10,7 @@
 
 <div class="card shadow-sm">
     <div class="table-responsive">
-        <table class="table table-hover mb-0" aria-label="繰り返し設定一覧">
+        <table class="table table-hover mb-0 custom-table" aria-label="繰り返し設定一覧">
             <thead class="table-light">
                 <tr>
                     <th scope="col" class="ps-3">タイトル</th>
@@ -22,7 +22,7 @@
             </thead>
             <tbody>
                 {{range .recurrings}}
-                <tr>
+                <tr class="recurring-row">
                     <td class="ps-3">
                         <div class="fw-bold">{{.Title}}</div>
                         {{if .Description}}