# Conflicts:
#	src/app/pages/danka-detail/danka-detail.ts
#	src/app/services/dankaService.ts

src/app/pages/danka-detail/danka-detail.scss

@@ -2,29 +2,29 @@
   position: relative;
   display: block;
   min-height: 100vh;
-  background: #f4eee4;
+  background: #f6f0e7;
   color: #2f2720;
 }
 
 .danka-detail-page {
-  display: flex;
-  align-items: flex-start;
-  gap: 8px;
-  background: #f4eee4;
+  display: grid;
+  grid-template-columns: 172px minmax(0, 1fr);
+  gap: 20px;
+  padding: 0 38px 36px 0;
+  background: #f6f0e7;
 }
 
 .danka-detail-main {
-  flex: 1;
-  padding-right: 34px;
+  min-width: 0;
   box-sizing: border-box;
 }
 
 .detail-panel {
-  min-height: 650px;
-  padding: 26px 34px 36px;
-  background: #ffffff;
+  min-height: 760px;
+  padding: 34px 42px 40px;
+  background: #fffdf9;
   border: 2px solid #d8caba;
-  border-radius: 76px;
+  border-radius: 64px;
   box-sizing: border-box;
 }
 
@@ -32,16 +32,17 @@
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
-  margin-bottom: 20px;
+  gap: 24px;
+  margin-bottom: 22px;
 }
 
 .page-title-row h1 {
-  margin: 0 0 8px;
+  margin: 0 0 18px;
   color: #2f2720;
-  font-size: 32px;
-  line-height: 1.2;
+  font-size: 34px;
+  line-height: 1.1;
   font-weight: 800;
-  letter-spacing: 0.02em;
+  letter-spacing: 0;
 }
 
 .tab-list {
@@ -83,7 +84,7 @@
 .edit-button {
   width: 140px;
   height: 46px;
-  margin-top: 36px;
+  margin-top: 54px;
   border: 2px solid #8a6543;
   border-radius: 6px;
   background: #ffffff;
@@ -104,7 +105,7 @@
   padding: 14px 24px;
   border: 2px solid #d8caba;
   border-radius: 8px;
-  background: #f1e7d8;
+  background: #fbf7f0;
   display: flex;
   align-items: center;
   box-sizing: border-box;
@@ -169,7 +170,7 @@
 .add-button {
   width: 140px;
   height: 46px;
-  margin-top: 36px;
+  margin-top: 54px;
   border: 2px solid #8a6543;
   border-radius: 6px;
   background: #ffffff;
@@ -187,7 +188,7 @@
 .family-page-add-button {
   width: 140px;
   height: 46px;
-  margin-top: 36px;
+  margin-top: 54px;
   border: 2px solid #8a6543;
   border-radius: 6px;
   background: #ffffff;
@@ -209,12 +210,12 @@
 .detail-content {
   display: grid;
   grid-template-columns: minmax(0, 1fr) 420px;
-  gap: 18px;
+  gap: 20px;
   align-items: start;
 }
 
 .basic-info-section {
-  padding: 24px 20px 18px;
+  padding: 24px 20px 22px;
   border: 2px solid #d8caba;
   border-radius: 12px;
   background: #fffdf9;
@@ -222,7 +223,7 @@
 }
 
 .section-heading {
-  margin-bottom: 8px;
+  margin-bottom: 14px;
 }
 
 .section-heading h2 {
@@ -230,6 +231,7 @@
   color: #2f2720;
   font-size: 22px;
   font-weight: 800;
+  line-height: 1.3;
 }
 
 .section-heading p {
@@ -276,7 +278,7 @@
   border-radius: 6px;
   background: #f3eee8;
   color: #4b3c31;
-  font-size: 17px;
+  font-size: 16px;
   font-weight: 800;
   display: flex;
   align-items: center;
@@ -290,7 +292,8 @@
   border-radius: 0;
   background: transparent;
   color: #2f2720;
-  font-size: 17px;
+  font-size: 16px;
+  font-weight: 700;
   box-sizing: border-box;
   display: flex;
   align-items: center;
@@ -390,6 +393,7 @@
   color: #2f2720;
   font-size: 22px;
   font-weight: 800;
+  line-height: 1.3;
   display: flex;
   align-items: center;
   gap: 12px;
@@ -452,7 +456,7 @@
 .next-memorial h3 {
   margin: 0 0 16px;
   color: #4b3c31;
-  font-size: 17px;
+  font-size: 18px;
   font-weight: 800;
   display: flex;
   align-items: center;
@@ -535,8 +539,9 @@
 
   h2 {
     margin: 0;
-    font-size: 20px;
-    font-weight: 700;
+    font-size: 22px;
+    line-height: 1.3;
+    font-weight: 800;
   }
 }
 
@@ -808,8 +813,9 @@
 
   h2 {
     margin: 0;
-    font-size: 20px;
-    font-weight: 700;
+    font-size: 22px;
+    line-height: 1.3;
+    font-weight: 800;
   }
 }
 
@@ -1273,6 +1279,33 @@
   color: #ffffff;
 }
 
+@media (max-width: 1100px) {
+  .danka-detail-page {
+    grid-template-columns: 1fr;
+    padding: 0 24px 32px;
+  }
+
+  .detail-panel {
+    min-height: auto;
+    border-radius: 28px;
+    padding: 28px 24px 32px;
+  }
+
+  .detail-content {
+    grid-template-columns: 1fr;
+  }
+
+  .page-title-row {
+    flex-direction: column;
+  }
+
+  .edit-button,
+  .add-button,
+  .family-page-add-button {
+    margin-top: 0;
+  }
+}
+
 /* 家族表が狭い画面では横スクロール */
 @media (max-width: 800px) {
   .detail-content,

src/app/pages/danka-edit/danka-edit.html

@@ -100,7 +100,6 @@
           <section class="phone-edit-section">
             <div class="section-heading">
               <h2>電話番号（複数登録）</h2>
-              <p>番号と備考を複数登録できます。</p>
             </div>
 
             <div formArrayName="phones" class="phone-table">
@@ -148,22 +147,27 @@
         </div>
 
         <div class="bottom-actions">
-          <button type="button" class="delete-button" (click)="deleteDanka()">
-            削除
-          </button>
-
-          <button type="button" class="cancel-button" [routerLink]="['/danka-detail', danka?.id]">
-            キャンセル
-          </button>
-
-          <button
-            type="button"
-            class="save-button"
-            [disabled]="dankaForm.invalid"
-            (click)="saveDanka()"
-          >
-            保存
-          </button>
+          <div class="left-actions"></div>
+
+          <div class="right-actions">
+            @if (danka) {
+              <button type="button" class="delete-button" (click)="deleteDanka()">
+                削除
+              </button>
+            }
+            <button type="button" class="cancel-button" [routerLink]="danka ? ['/danka-detail', danka.id] : ['/danka-list']">
+              キャンセル
+            </button>
+
+            <button
+              type="button"
+              class="save-button"
+              [disabled]="dankaForm.invalid"
+              (click)="saveDanka()"
+            >
+              保存
+            </button>
+          </div>
         </div>
       </form>
     </section>

src/app/pages/danka-edit/danka-edit.scss

@@ -2,7 +2,7 @@
   position: relative;
   display: block;
   min-height: 100vh;
-  background: #f4eee4;
+  background: #f6f0e7;
   color: #2f2720;
 }
 
@@ -11,7 +11,7 @@
   grid-template-columns: 172px minmax(0, 1fr);
   gap: 20px;
   padding: 0 38px 36px 0;
-  background: #f4eee4;
+  background: #f6f0e7;
 }
 
 .danka-edit-main {
@@ -22,7 +22,7 @@
 .edit-panel {
   min-height: 760px;
   padding: 34px 42px 40px;
-  background: #ffffff;
+  background: #fffdf9;
   border: 2px solid #d8caba;
   border-radius: 64px;
   box-sizing: border-box;
@@ -55,20 +55,28 @@
 
 .edit-content {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) 500px;
-  gap: 32px;
+  grid-template-columns: minmax(0, 1fr) 430px;
+  gap: 22px;
   align-items: start;
 }
 
 .basic-edit-section,
 .phone-edit-section {
-  padding-top: 0;
+  overflow: hidden;
+  padding: 0 28px 28px;
+  border: 2px solid #d8caba;
+  border-radius: 12px;
+  background: #fffdf9;
+  box-sizing: border-box;
 }
 
 .basic-edit-section h2,
 .phone-edit-section h2,
 .support-box h2 {
-  margin: 0;
+  margin: 0 -28px 20px;
+  padding: 14px 28px;
+  background: #eadfce;
+  border-bottom: 2px solid #d8caba;
   color: #2f2720;
   font-size: 22px;
   line-height: 1.3;
@@ -83,7 +91,9 @@
 
 /* 基本情報 */
 .form-list {
-  margin-top: 12px;
+  margin-top: 0;
+  padding-top: 18px;
+  border-top: 2px solid #eadfce;
 }
 
 .form-field {
@@ -94,10 +104,10 @@
 
 .form-row {
   display: grid;
-  grid-template-columns: 140px 1fr;
+  grid-template-columns: 132px 1fr;
   align-items: center;
-  gap: 14px;
-  margin-bottom: 12px;
+  gap: 18px;
+  margin-bottom: 14px;
 }
 
 .form-row label {
@@ -124,8 +134,12 @@
   padding: 0 14px;
 }
 
+.form-row:has(#postalCode) input {
+  max-width: 300px;
+}
+
 .form-row textarea {
-  min-height: 104px;
+  min-height: 150px;
   padding: 12px 14px;
   line-height: 1.6;
   resize: vertical;
@@ -157,7 +171,7 @@
 .phone-table-header,
 .phone-table-row {
   display: grid;
-  grid-template-columns: 1.35fr 1.45fr 84px;
+  grid-template-columns: minmax(110px, 1fr) minmax(88px, 0.8fr) 72px;
   align-items: center;
   gap: 10px;
 }
@@ -235,7 +249,7 @@
 .phone-action {
   display: flex;
   justify-content: flex-end;
-  margin-top: 10px;
+  margin-top: 16px;
 }
 
 .add-phone-button {
@@ -277,10 +291,17 @@
 /* 下部ボタン */
 .bottom-actions {
   display: flex;
-  justify-content: flex-end;
+  justify-content: space-between;
+  align-items: center;
+  gap: 12px;
+  margin-top: 36px;
+}
+
+.left-actions,
+.right-actions {
+  display: flex;
   align-items: center;
   gap: 12px;
-  margin-top: 26px;
 }
 
 .delete-button,

src/app/pages/dashboard/dashboard.html

@@ -46,7 +46,6 @@
           <div>
             <h2>最近開いた檀家・世帯</h2>
           </div>
-          <a class="text-link" href="#">一覧へ</a>
         </div>
 
         <div class="recent-table" role="table" aria-label="最近開いた檀家">
@@ -58,29 +57,25 @@
             <div class="cell" role="columnheader">最終更新</div>
           </div>
 
-          <a class="recent-row" href="#" role="row">
-            <div class="cell" role="cell">鈴木 太郎</div>
-            <div class="cell muted" role="cell">すずき</div>
-            <div class="cell" role="cell">市内 1-2-3</div>
-            <div class="cell" role="cell">6月12日</div>
-            <div class="cell muted" role="cell">今日</div>
-          </a>
-
-          <a class="recent-row" href="#" role="row">
-            <div class="cell" role="cell">佐藤 恵一</div>
-            <div class="cell muted" role="cell">さとう</div>
-            <div class="cell" role="cell">市内 2-8-1</div>
-            <div class="cell" role="cell">7月4日</div>
-            <div class="cell muted" role="cell">昨日</div>
-          </a>
-
-          <a class="recent-row" href="#" role="row">
-            <div class="cell" role="cell">田中 雪子</div>
-            <div class="cell muted" role="cell">たなか</div>
-            <div class="cell" role="cell">市内 3-4-6</div>
-            <div class="cell muted" role="cell">未設定</div>
-            <div class="cell muted" role="cell">5日前</div>
-          </a>
+          @if (recentDankaList.length > 0) {
+            @for (recent of recentDankaList; track recent.danka.id) {
+              <a class="recent-row" [routerLink]="['/danka-detail', recent.danka.id]" role="row">
+                <div class="cell" role="cell">{{ recent.danka.householder }}</div>
+                <div class="cell muted" role="cell">{{ recent.danka.householderFurigana }}</div>
+                <div class="cell" role="cell">{{ recent.danka.address }}</div>
+                <div class="cell" role="cell">{{ recent.nextMemorialLabel }}</div>
+                <div class="cell muted" role="cell">{{ recent.updatedAtLabel }}</div>
+              </a>
+            }
+          } @else {
+            <div class="recent-row" role="row">
+              <div class="cell muted" role="cell">表示できる檀家・世帯はありません</div>
+              <div class="cell muted" role="cell">-</div>
+              <div class="cell muted" role="cell">-</div>
+              <div class="cell muted" role="cell">-</div>
+              <div class="cell muted" role="cell">-</div>
+            </div>
+          }
         </div>
       </section>
 
@@ -89,7 +84,6 @@
           <div>
             <h2>近日の法要・命日</h2>
           </div>
-          <a class="text-link" href="#">年次法要一覧へ</a>
         </div>
 
         <div class="upcoming-list">

src/app/pages/dashboard/dashboard.ts

@@ -2,6 +2,7 @@ import { Component } from '@angular/core';
 import { RouterLink } from '@angular/router';
 import { KakochoService } from '../../services/kakocho-service';
 import { DankaService } from '../../services/dankaService';
+import { Danka } from '../../models/danka';
 import { AppHeader } from '../../share/header/app-header';
 import { AppSideMenu } from '../../share/side-menu/app-side-menu';
 
@@ -16,6 +17,12 @@ interface UpcomingMemorial {
   status: '準備確認' | '要確認';
 }
 
+interface RecentDanka {
+  danka: Danka;
+  nextMemorialLabel: string;
+  updatedAtLabel: string;
+}
+
 @Component({
   selector: 'app-dashboard',
   imports: [AppHeader, AppSideMenu, RouterLink],
@@ -27,6 +34,7 @@ export class Dashboard {
   todayMemorialCount = 0;
   upcomingWeeklyMemorialCount = 0;
   monthlyMemorialCount = 0;
+  recentDankaList: RecentDanka[] = [];
   upcomingMemorials: UpcomingMemorial[] = [];
 
   private readonly targetYear = new Date().getFullYear();
@@ -37,9 +45,18 @@ export class Dashboard {
   ) {
     this.setWeeklyMemorialSummary();
     this.setMonthlyMemorialSummary();
+    this.setRecentDankaList();
     this.setUpcomingMemorials();
   }
 
+  private setRecentDankaList(): void {
+    this.recentDankaList = this.dankaService.getRecentDankaList(5).map((danka) => ({
+      danka,
+      nextMemorialLabel: this.getNextMemorialLabel(danka.id),
+      updatedAtLabel: this.formatUpdatedAt(danka.updatedAt),
+    }));
+  }
+
   private setWeeklyMemorialSummary(): void {
     const today = this.toDateOnly(new Date());
     const weekEnd = this.addDays(this.getWeekStart(today), 6);
@@ -150,6 +167,54 @@ export class Dashboard {
     return `${date.getMonth() + 1}月${date.getDate()}日`;
   }
 
+  private getNextMemorialLabel(dankaId: string): string {
+    const today = this.toDateOnly(new Date());
+    const nextMemorial = this.kakochoService
+      .getKakochoByDankaId(dankaId)
+      .map((kakocho) => {
+        const deathDate = this.parseDate(kakocho.deathDate);
+        if (!deathDate) {
+          return null;
+        }
+
+        const memorialDate = new Date(this.targetYear, deathDate.getMonth(), deathDate.getDate());
+        if (memorialDate < today || !this.getMemorialType(deathDate)) {
+          return null;
+        }
+
+        return memorialDate;
+      })
+      .filter((date): date is Date => date !== null)
+      .sort((a, b) => a.getTime() - b.getTime())[0];
+
+    return nextMemorial ? this.formatDateLabel(nextMemorial, today) : '未設定';
+  }
+
+  private formatUpdatedAt(updatedAt: string): string {
+    const updatedDate = this.parseDate(updatedAt);
+    const today = this.toDateOnly(new Date());
+
+    if (!updatedDate) {
+      return '未登録';
+    }
+
+    const diffDays = Math.floor((today.getTime() - updatedDate.getTime()) / 86400000);
+
+    if (diffDays === 0) {
+      return '今日';
+    }
+
+    if (diffDays === 1) {
+      return '昨日';
+    }
+
+    if (diffDays > 1 && diffDays <= 7) {
+      return `${diffDays}日前`;
+    }
+
+    return `${updatedDate.getMonth() + 1}月${updatedDate.getDate()}日`;
+  }
+
   private getWeekStart(date: Date): Date {
     const day = date.getDay();
     const diff = day === 0 ? -6 : 1 - day;

src/app/pages/family-edit/family-edit.html

@@ -86,16 +86,26 @@
                 </div>
               </div>
 
-              <div class="form-row form-row-heading">
-                <label></label>
+              <div class="form-row householder-setting-row">
+                <label>施主設定</label>
                 <div class="form-field">
-                  <h3 class="sub-section-title">家系図情報</h3>
-                  <p class="sub-section-description">
-                    家系図に反映する親子・配偶者の関係を設定します。
-                  </p>
+                  <button type="button"
+                          class="set-householder-button"
+                          (click)="setAsHouseholder()">
+                    この方を施主にする
+                  </button>
                 </div>
               </div>
+            </div>
+          </section>
 
+          <section class="family-tree-edit-section">
+            <h2>家系図情報</h2>
+            <p class="section-description">
+              家系図に反映する親子・配偶者の関係を設定します。
+            </p>
+
+            <div class="form-list">
               <div class="form-row">
                 <label for="fatherId">父</label>
                 <div class="form-field">
@@ -167,18 +177,6 @@
 
             </div>
           </section>
-
-          <section class="phone-edit-section">
-            <div class="householder-area">
-              <h3>この方を施主にする</h3>
-
-              <button type="button"
-                      class="set-householder-button"
-                      (click)="setAsHouseholder()">
-                施主に設定
-              </button>
-            </div>
-          </section>
         </div>
 
         <div class="bottom-actions">

src/app/pages/family-edit/family-edit.scss

@@ -2,7 +2,7 @@
   position: relative;
   display: block;
   min-height: 100vh;
-  background: #f4eee4;
+  background: #f6f0e7;
   color: #2f2720;
 }
 
@@ -11,7 +11,7 @@
   grid-template-columns: 172px minmax(0, 1fr);
   gap: 20px;
   padding: 0 38px 36px 0;
-  background: #f4eee4;
+  background: #f6f0e7;
 }
 
 .danka-edit-main {
@@ -22,7 +22,7 @@
 .edit-panel {
   min-height: 760px;
   padding: 34px 42px 40px;
-  background: #ffffff;
+  background: #fffdf9;
   border: 2px solid #d8caba;
   border-radius: 64px;
   box-sizing: border-box;
@@ -56,18 +56,28 @@
 
 .edit-content {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) 500px;
-  gap: 32px;
+  grid-template-columns: 1fr;
+  gap: 16px;
   align-items: start;
 }
 
-.basic-edit-section {
-  padding-left: 0;
+.basic-edit-section,
+.family-tree-edit-section {
+  overflow: hidden;
+  padding: 0 22px 24px;
+  border: 2px solid #d8caba;
+  border-radius: 12px;
+  background: #fffdf9;
+  box-sizing: border-box;
 }
 
 .basic-edit-section h2,
+.family-tree-edit-section h2,
 .section-heading h2 {
-  margin: 0;
+  margin: 0 -22px 18px;
+  padding: 12px 22px;
+  background: #eadfce;
+  border-bottom: 2px solid #d8caba;
   color: #2f2720;
   font-size: 22px;
   line-height: 1.3;
@@ -84,14 +94,21 @@
   font-size: 14px;
 }
 
+.section-description {
+  margin: 6px 0 0;
+  color: #7b6b5c;
+  font-size: 14px;
+  line-height: 1.6;
+}
+
 .form-list {
-  width: 100%;
-  margin-top: 12px;
+  width: min(100%, 620px);
+  margin-top: 14px;
 }
 
 .form-row {
   display: grid;
-  grid-template-columns: 140px 1fr;
+  grid-template-columns: 150px minmax(0, 1fr);
   align-items: center;
   gap: 14px;
   margin-bottom: 12px;
@@ -129,7 +146,7 @@
 }
 
 .form-row textarea {
-  min-height: 104px;
+  min-height: 112px;
   padding: 12px 14px;
   resize: vertical;
   line-height: 1.6;
@@ -178,49 +195,9 @@
   line-height: 1.6;
 }
 
-.phone-edit-section {
-  min-height: 240px;
-  padding: 18px 20px;
-  border: 2px solid #d8caba;
-  border-radius: 8px;
-  background: #fffdf9;
-  box-sizing: border-box;
-}
-
-.family-edit-guide {
-  padding: 18px 22px;
-  border: 2px solid #d8caba;
-  border-radius: 14px;
-  background: #ffffff;
-  box-sizing: border-box;
-}
-
-.family-edit-guide ul {
-  margin: 0;
-  padding-left: 20px;
-  color: #7b6b5c;
-  font-size: 15px;
-  line-height: 2;
-}
-
-.householder-area {
-  margin-top: 0;
-  padding: 18px 20px;
-  border: 2px solid #d8caba;
-  border-radius: 8px;
-  background: #eadfce;
-  box-sizing: border-box;
-}
-
-.householder-area h3 {
-  margin: 0 0 12px;
-  color: #2f2720;
-  font-size: 17px;
-  font-weight: 800;
-}
-
 .set-householder-button {
-  width: 148px;
+  width: auto;
+  min-width: 170px;
   height: 46px;
   border: 2px solid #d8caba;
   border-radius: 6px;
@@ -241,7 +218,7 @@
   justify-content: flex-end;
   align-items: center;
   gap: 12px;
-  margin-top: 26px;
+  margin-top: 28px;
 }
 
 .delete-button,

src/app/pages/family-edit/family-edit.ts

@@ -9,6 +9,7 @@ import {
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 import { AppHeader } from '../../share/header/app-header';
 import { AppSideMenu } from '../../share/side-menu/app-side-menu';
+import { DankaService } from '../../services/dankaService';
 import { FamilyService } from '../../services/family-service';
 import { MarriageRelationService } from '../../services/marriage-relation-service';
 import { Danka } from '../../models/danka';
@@ -30,8 +31,10 @@ export class FamilyEdit {
   relationMode: string = '';
   baseFamilyId: string = '';
   marriageErrorMessages: string[] = [];
+  private setHouseholderOnSave = false;
 
   constructor(
+    private dankaService: DankaService,
     private familyService: FamilyService,
     private marriageRelationService: MarriageRelationService,
     private route: ActivatedRoute,
@@ -39,6 +42,7 @@ export class FamilyEdit {
   ) {
     this.dankaId = this.route.snapshot.params['dankaId'];
     this.familyId = this.route.snapshot.params['familyId'];
+    this.danka = this.dankaService.getDankaById(this.dankaId);
     this.families = this.familyService.getFamiliesByDankaId(this.dankaId);
     this.relationMode = this.route.snapshot.queryParamMap.get('relationMode') ?? '';
     this.baseFamilyId = this.route.snapshot.queryParamMap.get('baseFamilyId') ?? '';
@@ -193,6 +197,7 @@ export class FamilyEdit {
     }
 
     this.familyService.saveFamily(updatedFamily);
+    this.saveHouseholderIfSelected(updatedFamily);
     this.router.navigate(['/danka-detail', dankaId], { queryParams: { tab: 'family' } });
   }
 
@@ -210,5 +215,30 @@ export class FamilyEdit {
     this.router.navigate(['/danka-detail', dankaId], { queryParams: { tab: 'family' } });
   }
 
-  setAsHouseholder() {}
+  setAsHouseholder(): void {
+    this.setHouseholderOnSave = true;
+    this.familyForm.patchValue({
+      relationship: '施主',
+    });
+  }
+
+  private saveHouseholderIfSelected(family: Family): void {
+    if (!this.setHouseholderOnSave || !this.danka) {
+      return;
+    }
+
+    this.dankaService.saveDanka({
+      ...this.danka,
+      householder: family.name,
+      householderFurigana: family.furigana,
+      updatedAt: this.formatDateForSave(new Date()),
+    });
+  }
+
+  private formatDateForSave(date: Date): string {
+    const year = date.getFullYear();
+    const month = String(date.getMonth() + 1).padStart(2, '0');
+    const day = String(date.getDate()).padStart(2, '0');
+    return `${year}-${month}-${day}`;
+  }
 }

src/app/pages/kakocho-edit/kakocho-edit.scss

@@ -2,7 +2,7 @@
   position: relative;
   display: block;
   min-height: 100vh;
-  background: #f4eee4;
+  background: #f6f0e7;
   color: #2f2720;
 }
 
@@ -11,7 +11,7 @@
   grid-template-columns: 172px minmax(0, 1fr);
   gap: 20px;
   padding: 0 38px 36px 0;
-  background: #f4eee4;
+  background: #f6f0e7;
 }
 
 .danka-edit-main {
@@ -22,7 +22,7 @@
 .edit-panel {
   min-height: 760px;
   padding: 34px 42px 40px;
-  background: #ffffff;
+  background: #fffdf9;
   border: 2px solid #d8caba;
   border-radius: 64px;
   box-sizing: border-box;
@@ -55,20 +55,28 @@
 
 .edit-content {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) 500px;
-  gap: 32px;
+  grid-template-columns: minmax(0, 1fr);
+  gap: 22px;
   align-items: start;
 }
 
 .basic-edit-section,
 .phone-edit-section {
-  padding-top: 0;
+  overflow: hidden;
+  padding: 0 28px 28px;
+  border: 2px solid #d8caba;
+  border-radius: 12px;
+  background: #fffdf9;
+  box-sizing: border-box;
 }
 
 .basic-edit-section h2,
 .phone-edit-section h2,
 .support-box h2 {
-  margin: 0;
+  margin: 0 -28px 20px;
+  padding: 14px 28px;
+  background: #eadfce;
+  border-bottom: 2px solid #d8caba;
   color: #2f2720;
   font-size: 22px;
   line-height: 1.3;
@@ -83,7 +91,8 @@
 
 /* 蝓ｺ譛ｬ諠・ｱ */
 .form-list {
-  margin-top: 12px;
+  width: min(100%, 980px);
+  margin-top: 0;
 }
 
 .form-field {

src/app/pages/kakocho-edit/kakocho-edit.ts

@@ -146,6 +146,10 @@ export class KakochoEdit {
       this.kakochoService.addKakocho(
         newKakocho
       );
+
+      if (this.sourceFamily) {
+        this.familyService.deleteFamily(this.sourceFamily.id);
+      }
     }
 
     // 一覧へ戻る

src/app/services/dankaService.ts

@@ -17,6 +17,7 @@ import { Danka } from '../models/danka';
 })
 export class DankaService {
   private path = 'danka';
+  private readonly recentDankaStorageKey = 'kaimyo-management.recent-danka';
 
   // 一覧
   async getDankaList(): Promise<Danka[]> {
@@ -58,4 +59,34 @@ export class DankaService {
     const ref = doc(db, this.path, id);
     await deleteDoc(ref);
   }
-}
+
+  private getRecentDankaIds(): string[] {
+    if (!this.canUseLocalStorage()) {
+      return [];
+    }
+
+    const value = localStorage.getItem(this.recentDankaStorageKey);
+    if (!value) {
+      return [];
+    }
+
+    try {
+      const parsed = JSON.parse(value);
+      return Array.isArray(parsed) ? parsed.filter((id): id is string => typeof id === 'string') : [];
+    } catch {
+      return [];
+    }
+  }
+
+  private saveRecentDankaIds(ids: string[]): void {
+    if (!this.canUseLocalStorage()) {
+      return;
+    }
+
+    localStorage.setItem(this.recentDankaStorageKey, JSON.stringify(ids));
+  }
+
+  private canUseLocalStorage(): boolean {
+    return typeof localStorage !== 'undefined';
+  }
+}