From bf3e3101fc1933a7be753d2f2c084b437ec37896 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Tue, 26 May 2026 12:47:55 +0900
Subject: [PATCH 01/18] =?UTF-8?q?[feat]Mapframe=E3=82=92=E4=BD=9C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(frontend)/(dev)/dev/common/page.tsx |  6 ++++
 src/components/ui/MapFrame.tsx               | 37 ++++++++++++++++++++
 2 files changed, 43 insertions(+)
 create mode 100644 src/components/ui/MapFrame.tsx

diff --git a/src/app/(frontend)/(dev)/dev/common/page.tsx b/src/app/(frontend)/(dev)/dev/common/page.tsx
index aeeda2b..10dedd4 100644
--- a/src/app/(frontend)/(dev)/dev/common/page.tsx
+++ b/src/app/(frontend)/(dev)/dev/common/page.tsx
@@ -30,6 +30,7 @@ import { DevSection } from "../_components/DevSection";
 import ButtonMain from "@/components/ui/ButtonMain";
 import SectionTitle from "@/components/ui/SectionTitle";
 import { sampleNewsItems } from "../_data/sampleNews";
+import MapFrame from "@/components/ui/MapFrame";
 
 const previewSlides = ["Slide 1", "Slide 2", "Slide 3"];
 const noImportantNewsMessage = "現在、重要なお知らせはありません。";
@@ -147,6 +148,11 @@ export default function DevCommonComponentsPage() {
             <SectionTitle title="PICK UP" />
           </div>
         </DevPanel>
+        <DevPanel title="MapFrame">
+                <MapFrame imageSrc="/image/top/HeroAll.png" alt="Map" title="タイトルサンプル（長さに応じて伸びます）" />
+                <MapFrame title="画像が無い場合" />
+          
+        </DevPanel>
       </DevSection>
     </DevPageContainer>
   );
diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
new file mode 100644
index 0000000..c0015b2
--- /dev/null
+++ b/src/components/ui/MapFrame.tsx
@@ -0,0 +1,37 @@
+import Image from "next/image";
+
+type MapFrameProps = {
+  imageSrc?: string;
+  alt?: string;
+  title?: string;
+};
+
+export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
+  return (
+    <div className="relative flex flex-col items-center w-full">
+
+        <div className="p-10 w-[80%]">
+            <div className="flex items-stretch gap-0 w-full items-start">
+                <div className="text-base text-text-large px-4 bg-main">
+                    {title}
+                </div>
+                <div className="[clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)] self-stretch -ml-px w-[20px] bg-main"></div>
+
+            </div>
+            <div className="border-2 border-main relative overflow-hidden flex items-center justify-center text-text-large md:text-Ptext-large" style={{ aspectRatio: '4 / 3' }}>
+                {imageSrc ? (
+                  <Image src={imageSrc} alt={alt || ''} fill style={{ objectFit: 'cover' }} />
+                ) : (
+                  <div className="flex flex-col w-full h-full text-main text-center items-center justify-center gap-2">
+                    <p className="font-kaisotai text-[24px]">MAP</p>
+                    <p>NO IMAGE</p>
+                  </div>
+                )}
+            </div>
+        </div>
+
+    </div>
+
+  );
+}
+

From ef0415bafbd3c291ecab20842f6fc8b8bacc1c86 Mon Sep 17 00:00:00 2001
From: oniwawa <173151966+oniwawa@users.noreply.github.com>
Date: Tue, 26 May 2026 03:49:07 +0000
Subject: [PATCH 02/18] style: auto format by oxfmt

---
 src/app/(frontend)/(dev)/dev/common/page.tsx |  9 +++--
 src/components/ui/MapFrame.tsx               | 40 +++++++++-----------
 2 files changed, 24 insertions(+), 25 deletions(-)

diff --git a/src/app/(frontend)/(dev)/dev/common/page.tsx b/src/app/(frontend)/(dev)/dev/common/page.tsx
index 10dedd4..2c8c832 100644
--- a/src/app/(frontend)/(dev)/dev/common/page.tsx
+++ b/src/app/(frontend)/(dev)/dev/common/page.tsx
@@ -149,9 +149,12 @@ export default function DevCommonComponentsPage() {
           </div>
         </DevPanel>
         <DevPanel title="MapFrame">
-                <MapFrame imageSrc="/image/top/HeroAll.png" alt="Map" title="タイトルサンプル（長さに応じて伸びます）" />
-                <MapFrame title="画像が無い場合" />
-          
+          <MapFrame
+            imageSrc="/image/top/HeroAll.png"
+            alt="Map"
+            title="タイトルサンプル（長さに応じて伸びます）"
+          />
+          <MapFrame title="画像が無い場合" />
         </DevPanel>
       </DevSection>
     </DevPageContainer>
diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index c0015b2..45b4b9f 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -8,30 +8,26 @@ type MapFrameProps = {
 
 export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
   return (
-    <div className="relative flex flex-col items-center w-full">
-
-        <div className="p-10 w-[80%]">
-            <div className="flex items-stretch gap-0 w-full items-start">
-                <div className="text-base text-text-large px-4 bg-main">
-                    {title}
-                </div>
-                <div className="[clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)] self-stretch -ml-px w-[20px] bg-main"></div>
-
-            </div>
-            <div className="border-2 border-main relative overflow-hidden flex items-center justify-center text-text-large md:text-Ptext-large" style={{ aspectRatio: '4 / 3' }}>
-                {imageSrc ? (
-                  <Image src={imageSrc} alt={alt || ''} fill style={{ objectFit: 'cover' }} />
-                ) : (
-                  <div className="flex flex-col w-full h-full text-main text-center items-center justify-center gap-2">
-                    <p className="font-kaisotai text-[24px]">MAP</p>
-                    <p>NO IMAGE</p>
-                  </div>
-                )}
+    <div className="relative flex w-full flex-col items-center">
+      <div className="w-[80%] p-10">
+        <div className="flex w-full items-start items-stretch gap-0">
+          <div className="bg-main px-4 text-text-large text-base">{title}</div>
+          <div className="-ml-px w-[20px] self-stretch bg-main [clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)]"></div>
+        </div>
+        <div
+          className="relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large md:text-Ptext-large"
+          style={{ aspectRatio: "4 / 3" }}
+        >
+          {imageSrc ? (
+            <Image src={imageSrc} alt={alt || ""} fill style={{ objectFit: "cover" }} />
+          ) : (
+            <div className="flex h-full w-full flex-col items-center justify-center gap-2 text-center text-main">
+              <p className="font-kaisotai text-[24px]">MAP</p>
+              <p>NO IMAGE</p>
             </div>
+          )}
         </div>
-
+      </div>
     </div>
-
   );
 }
-

From a5be1caef2af3dcaa36c035c9aa2af599b77c9f5 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Wed, 27 May 2026 11:22:42 +0900
Subject: [PATCH 03/18] =?UTF-8?q?[feat]noImage=E3=81=AB=E8=83=8C=E6=99=AF?=
 =?UTF-8?q?=E8=89=B2=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ui/MapFrame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index 45b4b9f..b9584c5 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -21,7 +21,7 @@ export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
           {imageSrc ? (
             <Image src={imageSrc} alt={alt || ""} fill style={{ objectFit: "cover" }} />
           ) : (
-            <div className="flex h-full w-full flex-col items-center justify-center gap-2 text-center text-main">
+            <div className="flex h-full w-full flex-col items-center justify-center gap-2 text-center text-main bg-base">
               <p className="font-kaisotai text-[24px]">MAP</p>
               <p>NO IMAGE</p>
             </div>

From 0e2fd6a9b99bd530f438646ea11bafd1f82978dc Mon Sep 17 00:00:00 2001
From: oniwawa <173151966+oniwawa@users.noreply.github.com>
Date: Wed, 27 May 2026 02:23:20 +0000
Subject: [PATCH 04/18] style: auto format by oxfmt

---
 src/components/ui/MapFrame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index b9584c5..ecbcaeb 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -21,7 +21,7 @@ export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
           {imageSrc ? (
             <Image src={imageSrc} alt={alt || ""} fill style={{ objectFit: "cover" }} />
           ) : (
-            <div className="flex h-full w-full flex-col items-center justify-center gap-2 text-center text-main bg-base">
+            <div className="flex h-full w-full flex-col items-center justify-center gap-2 bg-base text-center text-main">
               <p className="font-kaisotai text-[24px]">MAP</p>
               <p>NO IMAGE</p>
             </div>

From 2514b1434412abdf7210cce8460741ec07c3ecd3 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Wed, 27 May 2026 11:34:30 +0900
Subject: [PATCH 05/18] =?UTF-8?q?[fix]=E3=82=BF=E3=82=A4=E3=83=88=E3=83=AB?=
 =?UTF-8?q?=E9=83=A8=E5=88=86=E3=81=AE=E3=82=B3=E3=83=BC=E3=83=89=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ui/MapFrame.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index ecbcaeb..10c2d41 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -11,11 +11,11 @@ export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
     <div className="relative flex w-full flex-col items-center">
       <div className="w-[80%] p-10">
         <div className="flex w-full items-start items-stretch gap-0">
-          <div className="bg-main px-4 text-text-large text-base">{title}</div>
+          <div className="bg-main px-4 text-text-large h-[25px] text-base">{title}</div>
           <div className="-ml-px w-[20px] self-stretch bg-main [clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)]"></div>
         </div>
         <div
-          className="relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large md:text-Ptext-large"
+          className="relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large"
           style={{ aspectRatio: "4 / 3" }}
         >
           {imageSrc ? (

From 2384eaaf38ee17d7ad840b2187c62a15766acb4c Mon Sep 17 00:00:00 2001
From: oniwawa <173151966+oniwawa@users.noreply.github.com>
Date: Wed, 27 May 2026 02:39:14 +0000
Subject: [PATCH 06/18] style: auto format by oxfmt

---
 src/components/ui/MapFrame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index 10c2d41..3c549a9 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -11,7 +11,7 @@ export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
     <div className="relative flex w-full flex-col items-center">
       <div className="w-[80%] p-10">
         <div className="flex w-full items-start items-stretch gap-0">
-          <div className="bg-main px-4 text-text-large h-[25px] text-base">{title}</div>
+          <div className="h-[25px] bg-main px-4 text-text-large text-base">{title}</div>
           <div className="-ml-px w-[20px] self-stretch bg-main [clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)]"></div>
         </div>
         <div

From 116a8186e2f942ab7000995cb338b6aec092dad9 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Wed, 27 May 2026 18:23:54 +0900
Subject: [PATCH 07/18] =?UTF-8?q?[fix]=E3=82=BF=E3=82=A4=E3=83=88=E3=83=AB?=
 =?UTF-8?q?=E3=81=AE=E5=B9=85=E3=81=AE=E4=BB=95=E6=A7=98=E3=82=92=E5=A4=89?=
 =?UTF-8?q?=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(frontend)/(dev)/dev/common/page.tsx | 7 ++-----
 src/components/aria/DateRangePicker.tsx      | 2 +-
 src/components/layout/HeaderMenuButton.tsx   | 2 +-
 src/components/ui/MapFrame.tsx               | 9 +++++++--
 4 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/src/app/(frontend)/(dev)/dev/common/page.tsx b/src/app/(frontend)/(dev)/dev/common/page.tsx
index 2c8c832..353287f 100644
--- a/src/app/(frontend)/(dev)/dev/common/page.tsx
+++ b/src/app/(frontend)/(dev)/dev/common/page.tsx
@@ -149,11 +149,8 @@ export default function DevCommonComponentsPage() {
           </div>
         </DevPanel>
         <DevPanel title="MapFrame">
-          <MapFrame
-            imageSrc="/image/top/HeroAll.png"
-            alt="Map"
-            title="タイトルサンプル（長さに応じて伸びます）"
-          />
+          <MapFrame imageSrc="/image/top/HeroAll.png" alt="Map" type="short" title="1F" />
+          <MapFrame imageSrc="/image/top/HeroAll.png" alt="Map" type="long" title="長いテキスト" />
           <MapFrame title="画像が無い場合" />
         </DevPanel>
       </DevSection>
diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 5fbc284..48e9b6a 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
+        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 93060cf..386eeb2 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >
diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index 3c549a9..cb90a0d 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -4,14 +4,19 @@ type MapFrameProps = {
   imageSrc?: string;
   alt?: string;
   title?: string;
+  type?: "short" | "long";
 };
 
-export default function MapFrame({ imageSrc, alt, title }: MapFrameProps) {
+export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFrameProps) {
   return (
     <div className="relative flex w-full flex-col items-center">
       <div className="w-[80%] p-10">
         <div className="flex w-full items-start items-stretch gap-0">
-          <div className="h-[25px] bg-main px-4 text-text-large text-base">{title}</div>
+          <div
+            className={`bg-main px-4 text-text-large text-base ${type === "short" ? "w-[50px]" : "w-[194px]"}`}
+          >
+            <span className="leading-tight break-words whitespace-normal">{title}</span>
+          </div>
           <div className="-ml-px w-[20px] self-stretch bg-main [clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)]"></div>
         </div>
         <div

From 9f654a71e8974b47f6b190078166881ef46e92b6 Mon Sep 17 00:00:00 2001
From: oniwawa <173151966+oniwawa@users.noreply.github.com>
Date: Wed, 27 May 2026 09:24:42 +0000
Subject: [PATCH 08/18] style: auto format by oxfmt

---
 src/components/aria/DateRangePicker.tsx    | 2 +-
 src/components/layout/HeaderMenuButton.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 48e9b6a..5fbc284 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
+        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 386eeb2..93060cf 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >

From 81e7e66bf5c717ba80dfc5f8b554954b1f60772f Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Wed, 27 May 2026 18:35:05 +0900
Subject: [PATCH 09/18] =?UTF-8?q?[fix]=E6=A8=AA=E5=B9=85=E3=82=92=E4=BF=AE?=
 =?UTF-8?q?=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/aria/DateRangePicker.tsx    | 2 +-
 src/components/layout/HeaderMenuButton.tsx | 2 +-
 src/components/ui/MapFrame.tsx             | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 5fbc284..48e9b6a 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
+        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 93060cf..386eeb2 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >
diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index cb90a0d..52df318 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -10,7 +10,7 @@ type MapFrameProps = {
 export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFrameProps) {
   return (
     <div className="relative flex w-full flex-col items-center">
-      <div className="w-[80%] p-10">
+      <div className="w-full px-10">
         <div className="flex w-full items-start items-stretch gap-0">
           <div
             className={`bg-main px-4 text-text-large text-base ${type === "short" ? "w-[50px]" : "w-[194px]"}`}

From a0c15aa82b5ad12042daab8070910be841eaf38c Mon Sep 17 00:00:00 2001
From: oniwawa <173151966+oniwawa@users.noreply.github.com>
Date: Wed, 27 May 2026 09:35:46 +0000
Subject: [PATCH 10/18] style: auto format by oxfmt

---
 src/components/aria/DateRangePicker.tsx    | 2 +-
 src/components/layout/HeaderMenuButton.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 48e9b6a..5fbc284 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
+        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 386eeb2..93060cf 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >

From d9095c5571cea91be7d4cebcb7a447e0f77da115 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 00:50:07 +0900
Subject: [PATCH 11/18] =?UTF-8?q?[fix]items-center=E3=82=92=E5=89=8A?=
 =?UTF-8?q?=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ui/MapFrame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index 52df318..043a2d0 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -9,7 +9,7 @@ type MapFrameProps = {
 
 export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFrameProps) {
   return (
-    <div className="relative flex w-full flex-col items-center">
+    <div className="relative flex w-full flex-col">
       <div className="w-full px-10">
         <div className="flex w-full items-start items-stretch gap-0">
           <div

From ef1b3e5b2769845b3fbb18290a9467fecdc754bc Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 00:51:32 +0900
Subject: [PATCH 12/18] =?UTF-8?q?[fix]=E3=82=A2=E3=82=B9=E3=83=9A=E3=82=AF?=
 =?UTF-8?q?=E3=83=88=E6=AF=94=E3=82=92style=E6=8C=87=E5=AE=9A=E3=81=8B?=
 =?UTF-8?q?=E3=82=89className=E3=81=A7=E3=81=AE=E6=8C=87=E5=AE=9A=E3=81=AB?=
 =?UTF-8?q?=E5=A4=89=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ui/MapFrame.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index 043a2d0..d567955 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -20,8 +20,7 @@ export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFra
           <div className="-ml-px w-[20px] self-stretch bg-main [clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)]"></div>
         </div>
         <div
-          className="relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large"
-          style={{ aspectRatio: "4 / 3" }}
+          className="aspect-4/3 relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large"
         >
           {imageSrc ? (
             <Image src={imageSrc} alt={alt || ""} fill style={{ objectFit: "cover" }} />

From fdc0b84e761edf2e644e1ae7362430d206485faa Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 00:55:46 +0900
Subject: [PATCH 13/18] =?UTF-8?q?[fix]py=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ui/MapFrame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index d567955..a248fbf 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -13,7 +13,7 @@ export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFra
       <div className="w-full px-10">
         <div className="flex w-full items-start items-stretch gap-0">
           <div
-            className={`bg-main px-4 text-text-large text-base ${type === "short" ? "w-[50px]" : "w-[194px]"}`}
+            className={`bg-main px-4 text-text-large text-base py-[4px] ${type === "short" ? "w-[50px]" : "w-[194px]"}`}
           >
             <span className="leading-tight break-words whitespace-normal">{title}</span>
           </div>

From ad3ad3da6db1383acdbcc426ca2fe20b872a70b4 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 00:56:46 +0900
Subject: [PATCH 14/18] =?UTF-8?q?[fix]className=E6=8C=87=E5=AE=9A=E3=81=AB?=
 =?UTF-8?q?=E5=A4=89=E6=9B=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ui/MapFrame.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index a248fbf..cdc3cb0 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -23,7 +23,7 @@ export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFra
           className="aspect-4/3 relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large"
         >
           {imageSrc ? (
-            <Image src={imageSrc} alt={alt || ""} fill style={{ objectFit: "cover" }} />
+            <Image src={imageSrc} alt={alt || ""} fill className="object-cover" />
           ) : (
             <div className="flex h-full w-full flex-col items-center justify-center gap-2 bg-base text-center text-main">
               <p className="font-kaisotai text-[24px]">MAP</p>

From 44b2d01662383742a2c4d06416d1f563217ec50d Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 00:58:36 +0900
Subject: [PATCH 15/18] =?UTF-8?q?[feat]pnpm=20fmt=E5=AE=9F=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/aria/DateRangePicker.tsx    | 2 +-
 src/components/layout/HeaderMenuButton.tsx | 2 +-
 src/components/ui/MapFrame.tsx             | 6 ++----
 3 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 5fbc284..48e9b6a 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
+        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 93060cf..386eeb2 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >
diff --git a/src/components/ui/MapFrame.tsx b/src/components/ui/MapFrame.tsx
index cdc3cb0..1309428 100644
--- a/src/components/ui/MapFrame.tsx
+++ b/src/components/ui/MapFrame.tsx
@@ -13,15 +13,13 @@ export default function MapFrame({ imageSrc, alt, title, type = "long" }: MapFra
       <div className="w-full px-10">
         <div className="flex w-full items-start items-stretch gap-0">
           <div
-            className={`bg-main px-4 text-text-large text-base py-[4px] ${type === "short" ? "w-[50px]" : "w-[194px]"}`}
+            className={`bg-main px-4 py-[4px] text-text-large text-base ${type === "short" ? "w-[50px]" : "w-[194px]"}`}
           >
             <span className="leading-tight break-words whitespace-normal">{title}</span>
           </div>
           <div className="-ml-px w-[20px] self-stretch bg-main [clip-path:polygon(0%_0%,20%_0%,100%_100%,0%_100%)]"></div>
         </div>
-        <div
-          className="aspect-4/3 relative flex items-center justify-center overflow-hidden border-2 border-main text-text-large"
-        >
+        <div className="relative flex aspect-4/3 items-center justify-center overflow-hidden border-2 border-main text-text-large">
           {imageSrc ? (
             <Image src={imageSrc} alt={alt || ""} fill className="object-cover" />
           ) : (

From 868a62f5e2e9bd7fb826604f40777074327e3eca Mon Sep 17 00:00:00 2001
From: oniwawa <173151966+oniwawa@users.noreply.github.com>
Date: Wed, 27 May 2026 15:59:37 +0000
Subject: [PATCH 16/18] style: auto format by oxfmt

---
 src/components/aria/DateRangePicker.tsx    | 2 +-
 src/components/layout/HeaderMenuButton.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 48e9b6a..5fbc284 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
+        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 386eeb2..93060cf 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >

From 318431d90feacbc0162717fef83e4257701ee2ae Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 10:54:14 +0900
Subject: [PATCH 17/18] =?UTF-8?q?[fix]=E3=82=B3=E3=83=B3=E3=83=95=E3=83=AA?=
 =?UTF-8?q?=E3=82=AF=E3=83=88=E8=A7=A3=E6=B6=88=E5=BE=8C=E3=81=AE=E3=82=A8?=
 =?UTF-8?q?=E3=83=A9=E3=83=BC=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(frontend)/(dev)/dev/common/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/(frontend)/(dev)/dev/common/page.tsx b/src/app/(frontend)/(dev)/dev/common/page.tsx
index 7c329bf..984fb38 100644
--- a/src/app/(frontend)/(dev)/dev/common/page.tsx
+++ b/src/app/(frontend)/(dev)/dev/common/page.tsx
@@ -154,7 +154,7 @@ export default function DevCommonComponentsPage() {
           <MapFrame imageSrc="/image/top/HeroAll.png" alt="Map" type="short" title="1F" />
           <MapFrame imageSrc="/image/top/HeroAll.png" alt="Map" type="long" title="長いテキスト" />
           <MapFrame title="画像が無い場合" />
-
+        </DevPanel>
         <DevPanel title="EventFrame">
           <div className="flex flex-wrap gap-m p-m">
             <EventFrame

From 068419c1a0883b4b25b0865b892abec5ed92b266 Mon Sep 17 00:00:00 2001
From: oniwawa <s243336@stn.nagaokaut.ac.jp>
Date: Thu, 28 May 2026 10:54:47 +0900
Subject: [PATCH 18/18] [fix]pnpm fmt

---
 src/app/(frontend)/(dev)/dev/common/page.tsx | 1 -
 src/components/aria/DateRangePicker.tsx      | 2 +-
 src/components/layout/HeaderMenuButton.tsx   | 2 +-
 3 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/app/(frontend)/(dev)/dev/common/page.tsx b/src/app/(frontend)/(dev)/dev/common/page.tsx
index 984fb38..21691ce 100644
--- a/src/app/(frontend)/(dev)/dev/common/page.tsx
+++ b/src/app/(frontend)/(dev)/dev/common/page.tsx
@@ -33,7 +33,6 @@ import { sampleNewsItems } from "../_data/sampleNews";
 import MapFrame from "@/components/ui/MapFrame";
 import EventFrame from "@/components/ui/EventFrame";
 
-
 const previewSlides = ["Slide 1", "Slide 2", "Slide 3"];
 const noImportantNewsMessage = "現在、重要なお知らせはありません。";
 const sampleImportantNewsBody =
diff --git a/src/components/aria/DateRangePicker.tsx b/src/components/aria/DateRangePicker.tsx
index 5fbc284..48e9b6a 100644
--- a/src/components/aria/DateRangePicker.tsx
+++ b/src/components/aria/DateRangePicker.tsx
@@ -36,7 +36,7 @@ export function DateRangePicker<T extends DateValue>({
     >
       {label && <Label>{label}</Label>}
       <FieldGroup className="w-auto min-w-[208px] cursor-text disabled:cursor-default">
-        <div className="flex w-fit flex-1 [scrollbar-width:none] items-center overflow-x-auto overflow-y-clip">
+        <div className="flex w-fit flex-1 items-center overflow-x-auto overflow-y-clip [scrollbar-width:none]">
           <DateInput slot="start" className="ps-3 pe-2 text-sm" />
           <span
             aria-hidden="true"
diff --git a/src/components/layout/HeaderMenuButton.tsx b/src/components/layout/HeaderMenuButton.tsx
index 93060cf..386eeb2 100644
--- a/src/components/layout/HeaderMenuButton.tsx
+++ b/src/components/layout/HeaderMenuButton.tsx
@@ -106,7 +106,7 @@ export default function HeaderMenuButton() {
         aria-modal="false"
         aria-label="メインメニュー"
         aria-hidden={!isMenuOpen}
-        className={`fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 scrollbar-gutter-stable overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
+        className={`scrollbar-gutter-stable fixed top-(--header-height) right-0 z-350 hidden h-[calc(100dvh-var(--header-height))] w-full max-w-97.5 overflow-y-auto overscroll-contain bg-base-dark ease-out motion-safe:transition-transform motion-safe:duration-300 md:block ${
           isMenuOpen ? "translate-x-0" : "pointer-events-none translate-x-full ease-in"
         }`}
       >