dm_new: (with-layout) 이하 <Image />로 교체

apps/dm_new/components/ImageSlider.tsx

@@ -1,6 +1,7 @@
 // apps/dm/app/(landing)/reuse/_components/ImageSlider.tsx
 "use client";
 
+import Image from "next/image";
 import { useEffect, useMemo, useRef, useState } from "react";
 
 type Slide = { src: string; alt?: string };
@@ -86,10 +87,12 @@ export default function CaseImageSlider({
                         w-[80px] h-[80px] rounded-full border border-black/20 bg-white
                         grid place-items-center shadow-sm hover:bg-black/[0.03]"
             >
-            <img
-                src="/images/landing/icon_left_arrow.png"
-                alt="이전"
-                className="w-[12px] h-[22px]"
+            <Image
+              src="/images/landing/icon_left_arrow.png"
+              alt="이전"
+              width={12}
+              height={22}
+              className="w-[12px] h-[22px]"
             />
           </button>
 
@@ -102,10 +105,12 @@ export default function CaseImageSlider({
                         w-[80px] h-[80px] rounded-full border border-black/20 bg-white
                         grid place-items-center shadow-sm hover:bg-black/[0.03]"
             >
-            <img
-                src="/images/landing/icon_right_arrow.png"
-                alt="다음"
-                className="w-[12px] h-[22px]"
+            <Image
+              src="/images/landing/icon_right_arrow.png"
+              alt="다음"
+              width={12}
+              height={22}
+              className="w-[12px] h-[22px]"
             />
           </button>
 
@@ -129,10 +134,13 @@ export default function CaseImageSlider({
             >
               {safeSlides.map((s, i) => (
                 <div key={`${s.src}-${i}`} className="min-w-full">
-                  <img
+                  <Image
                     src={s.src}
                     alt={s.alt ?? `slide-${i + 1}`}
+                    width={583}
+                    height={400}
                     className="w-full h-full object-contain"
+                    style={{ width: "100%", height: "100%" }}
                     draggable={false}
                   />
                 </div>