refactor: 이미지 최적화 개선

Author: sikkzz

public/assets/img/img-graphic-logo.png

@@ -55,7 +55,7 @@ const HomePage = () => {
             </Text>
           </div>
           <div className={styles.HomeImage}>
-            <img src="/assets/img/img-graphic-logo.png" alt="mainLogo" />
+            <img src="/assets/img/img-graphic-logo.webp" alt="mainLogo" />
           </div>
         </div>
 

public/assets/img/img-graphic-logo.webp

@@ -23,9 +23,9 @@ interface StyleProps {
 }
 
 const IMG_STYLE_DATA = [
-  { name: "친근한 말투", image: "/assets/img/img-style-friendly.png" },
-  { name: "믿음직한 말투", image: "/assets/img/img-style-trust.png" },
-  { name: "귀여운 말투", image: "/assets/img/img-style-cute.png" },
+  { name: "친근한 말투", image: "/assets/img/img-style-friendly.webp" },
+  { name: "믿음직한 말투", image: "/assets/img/img-style-trust.webp" },
+  { name: "귀여운 말투", image: "/assets/img/img-style-cute.webp" },
 ];
 
 const STYLE_NAME_MAPPING: { [key: string]: string } = {