public/img, index.mdx: ホームの画像を縮小・WebP化し幅と高さを付与

表示サイズに合わせて縮小し、WebP品質82で再圧縮した。ホーム専用のjpg/pngはWebPへ変換して参照を更新した。width/height属性とheight:autoでCLSを抑える。約683KiBを削減（目標の約554KiBを上回る）。

1 files changed, 43 insertions, 25 deletions

diff --git a/src/content/docs/index.mdx b/src/content/docs/index.mdx
index 3894a0a..0892e49 100644
--- a/src/content/docs/index.mdx
+++ b/src/content/docs/index.mdx
@@ -21,7 +21,7 @@ tableOfContents: true
     <div class="home-sep"><span>皆様へのメッセージ</span></div>
   </div>
   <div class="intro-photo">
-    <img src="/img/portrait.jpg" alt="安竹洋平" />
+    <img src="/img/portrait.webp" alt="安竹洋平" width="240" height="293" />
     <p class="photo-caption">安竹　洋平</p>
   </div>
   <div class="intro-text">
@@ -64,9 +64,11 @@ tableOfContents: true
 
 <figure style="text-align:left;margin:1rem 0">
   <img
-    src="/img/childhood.jpg"
+    src="/img/childhood.webp"
     alt="幼少期の写真"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="613"
+    height="600"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">幼少期の写真</figcaption>
 </figure>
@@ -79,7 +81,9 @@ tableOfContents: true
   <img
     src="/img/univ-earth-planetary-science-with-friend-scaled.webp"
     alt="大学生時代"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="720"
+    height="351"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">大学生時代</figcaption>
 </figure>
@@ -90,9 +94,11 @@ tableOfContents: true
 
 <figure style="text-align:left;margin:1rem 0">
   <img
-    src="/img/yasutake-yohei-graphic-board.png"
+    src="/img/yasutake-yohei-graphic-board.webp"
     alt="ソニー社員時代"
-    style="max-width:320px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="480"
+    height="418"
+    style="max-width:320px;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">ソニー社員時代</figcaption>
 </figure>
@@ -103,9 +109,11 @@ tableOfContents: true
 
 <figure style="text-align:left;margin:1rem 0">
   <img
-    src="/img/iec-dinner.jpg"
+    src="/img/iec-dinner.webp"
     alt="国際規格会議 晩餐会にて"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="449"
+    height="263"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">国際規格会議 晩餐会にて</figcaption>
 </figure>
@@ -120,9 +128,11 @@ tableOfContents: true
 
 <figure style="text-align:left;margin:1rem 0">
   <img
-    src="/img/astronaut-training-2.jpg"
+    src="/img/astronaut-training-2.webp"
     alt="NASA宇宙飛行士訓練施設にて"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="600"
+    height="450"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">NASA宇宙飛行士訓練施設にて</figcaption>
 </figure>
@@ -131,7 +141,9 @@ tableOfContents: true
   <img
     src="/img/astronaut-training-6-1.webp"
     alt="ジェット訓練機のシートにて"
-    style="max-width:600px;width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="600"
+    height="450"
+    style="max-width:600px;width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">ジェット訓練機のシートにて</figcaption>
 </figure>
@@ -146,7 +158,9 @@ tableOfContents: true
   <img
     src="/img/cookinglish-2-1.webp"
     alt="英語の会イベントでの一コマ"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="720"
+    height="480"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">英語の会イベント（Cookinglish）での一コマ</figcaption>
 </figure>
@@ -159,9 +173,11 @@ tableOfContents: true
 
 <figure style="text-align:left;margin:1rem 0">
   <img
-    src="/img/yasutake-yohei-7-1.jpg"
+    src="/img/yasutake-yohei-7-1.webp"
     alt="まだ0歳の時の長男と"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="720"
+    height="540"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">まだ0歳の時の長男と</figcaption>
 </figure>
@@ -174,9 +190,11 @@ tableOfContents: true
 
 <figure style="text-align:left;margin:1rem 0">
   <img
-    src="/img/yasutake-yohei-city-council.jpg"
+    src="/img/yasutake-yohei-city-council.webp"
     alt="議場にて"
-    style="max-width:100%;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
+    width="578"
+    height="500"
+    style="max-width:100%;height:auto;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.1)"
   />
   <figcaption style="font-size:0.85rem;color:var(--sl-color-gray-2);margin-top:0.5rem">議場にて</figcaption>
 </figure>
@@ -218,39 +236,39 @@ import Updates from '@/components/Updates.astro';
 <div class="activity-grid">
   <a href="/joutyo-koteikyu/" class="activity-card">
     <span class="activity-title">情緒固定級の設置</span>
-    <img src="/img/joutyo-koteikyu-eyecatch.webp" alt="情緒固定級" />
+    <img src="/img/joutyo-koteikyu-eyecatch.webp" alt="情緒固定級" width="720" height="509" />
   </a>
   <a href="/koubunsyo-kanri/" class="activity-card">
     <span class="activity-title">公文書管理の不正追及</span>
-    <img src="/img/25914623.webp" alt="公文書管理" />
+    <img src="/img/25914623.webp" alt="公文書管理" width="720" height="480" />
   </a>
   <a href="/ijime-judai-jitai/" class="activity-card">
     <span class="activity-title">いじめ重大事態</span>
-    <img src="/img/ijime-judai-jitai-eyecatch.webp" alt="いじめ重大事態" />
+    <img src="/img/ijime-judai-jitai-eyecatch.webp" alt="いじめ重大事態" width="640" height="427" />
   </a>
   <a href="/kajo-seigen-kanwa/" class="activity-card">
     <span class="activity-title">過剰な制限の緩和</span>
-    <img src="/img/kajo-eyecatch.webp" alt="マスク制限緩和" />
+    <img src="/img/kajo-eyecatch.webp" alt="マスク制限緩和" width="720" height="771" />
   </a>
   <a href="/dislexia-taiou/" class="activity-card">
     <span class="activity-title">ディスレクシア支援</span>
-    <img src="/img/dislexia-eyecatch.webp" alt="ディスレクシア" />
+    <img src="/img/dislexia-eyecatch.webp" alt="ディスレクシア" width="640" height="564" />
   </a>
   <a href="/aiki-kouen/" class="activity-card">
     <span class="activity-title">合気公園の整備</span>
-    <img src="/img/aiki-kouen-eyecatch.webp" alt="合気公園" />
+    <img src="/img/aiki-kouen-eyecatch.webp" alt="合気公園" width="595" height="385" />
   </a>
   <a href="/fukushi-shisetsu-gyakutai/" class="activity-card">
     <span class="activity-title">障害者虐待の追及</span>
-    <img src="/img/fukushi-gyakutai-eyecatch.webp" alt="障害者虐待" />
+    <img src="/img/fukushi-gyakutai-eyecatch.webp" alt="障害者虐待" width="720" height="360" />
   </a>
   <a href="/vaccine-kyuusai-tekiseika/" class="activity-card">
     <span class="activity-title">ワクチン副反応救済制度の適正化</span>
-    <img src="/img/fukuhannou.webp" alt="ワクチン副反応救済制度" />
+    <img src="/img/fukuhannou.webp" alt="ワクチン副反応救済制度" width="720" height="360" />
   </a>
   <a href="/konan-eisei-kumiai/" class="activity-card">
     <span class="activity-title">湖南衛生組合の報酬見直し</span>
-    <img src="/konan-eisei-kumiai/images/konan-eisei-kumiai-icon.webp" alt="湖南衛生組合の議員報酬・給与見直し" />
+    <img src="/konan-eisei-kumiai/images/konan-eisei-kumiai-icon.webp" alt="湖南衛生組合の議員報酬・給与見直し" width="480" height="331" />
   </a>
 </div>