diff --git a/frontend/src/components/Mypage/ChangeInfo.tsx b/frontend/src/components/Mypage/ChangeInfo.tsx
index 0137092..ddbbd82 100644
--- a/frontend/src/components/Mypage/ChangeInfo.tsx
+++ b/frontend/src/components/Mypage/ChangeInfo.tsx
@@ -5,11 +5,7 @@ import {
     Grid,
     Typography,
     Container,
-    styled,
-    TextField,
     Box,
-    Link,
-    Button
 } from "@mui/material";
 import ChangePassWord from "./Change_password";
 import ChangeNickName from "./Change_nickname";
diff --git a/frontend/src/components/Mypage/MyTrashChart.tsx b/frontend/src/components/Mypage/MyTrashChart.tsx
index 95c879f..82fefb4 100644
--- a/frontend/src/components/Mypage/MyTrashChart.tsx
+++ b/frontend/src/components/Mypage/MyTrashChart.tsx
@@ -4,8 +4,6 @@ import { useState } from "react";
 import {
     Typography,
     Container,
-    Box
-
 } from "@mui/material";
 import Chart from "../chart/Chart";
 import Date from "../chart/Date";
diff --git a/frontend/src/components/chart/Chart.tsx b/frontend/src/components/chart/Chart.tsx
index 87204ae..d6d45f5 100644
--- a/frontend/src/components/chart/Chart.tsx
+++ b/frontend/src/components/chart/Chart.tsx
@@ -44,23 +44,7 @@ const trashlist: Contentlist =
 
 function TrashChart({ list }: Contentlist) {
   const [BasicList, setBasicList] = useState(trashlist.list);
-  /*
-    React.useEffect(() => {
-      console.log("list",list);
-      console.log("기본 데이터",trashlist.list);
-      for (let i = 0; i < trashlist.list.length; i++) {
-        for (let j = 0; j < list.length; j++) {
-          if (list[j].trash_kind === trashlist.list[i].trash_kind) {
-            trashlist.list[i].count = list[j].cnt;
-            console.log("같은 것을 발견");
-          }
-        }
-      }
-      setBasicList(trashlist.list);
-      console.log("데이터 변환",trashlist.list);
-    }
-      , [list]);
-*/
+
   React.useEffect(() => {
     console.log("list", list);
     if (list) {
diff --git a/frontend/src/components/mainpage/TrashCardView.tsx b/frontend/src/components/mainpage/TrashCardView.tsx
index 6e3f72c..12eb28d 100644
--- a/frontend/src/components/mainpage/TrashCardView.tsx
+++ b/frontend/src/components/mainpage/TrashCardView.tsx
@@ -5,10 +5,8 @@ import {
   Grid,
   Button,
   CardActionArea,
-  CardActions,
-  Card,
+  styled,
   Box,
-  CardContent,
   CardMedia,
   Typography,
 } from "@mui/material";
@@ -20,6 +18,21 @@ interface BaseContent {
   images: any;
 }
 
+const StyledBox =
+{
+  border: 0,
+  backgroundColor: "white",
+  borderColor: "#759F98",
+  borderRadius: 5,
+  boxShadow: "1px 3px 3px #B0B09A",
+  margin: "auto",
+  mt: 5
+};
+
+const styledTypo = {
+  fontSize: 40, component: "div", mt: 5, fontFamily: "Itim", color: "#737458"
+};
+
 const trashlist: BaseContent[] = [
   {
     kind: "",
@@ -102,23 +115,11 @@ function MultiActionAreaCard() {
         >1st
         </Typography>
         <Box  {...useScrollFadeIn('up', 1, 0.1)}>
-          <Box sx={{
-            width: 800, border: 0,
-            backgroundColor: "white",
-            borderColor: "#759F98",
-            borderRadius: 5,
-            boxShadow: "1px 3px 3px #B0B09A",
-            margin: "auto",
-            mt: 5,
-          }}>
+          <Box style={StyledBox} sx={{ width: 800 }}>
             <CardActionArea sx={{ borderRadius: 5 }} >
               <CardMedia component="img" height="500" width="450" image={firstData?.images} sx={{ borderRadius: 5 }} />
               <Typography
-                fontSize={40}
-                component="div"
-                margin={1}
-                marginTop={2}
-                sx={{ fontFamily: "Itim", color: "#737458" }}
+                style={styledTypo}
               >
                 {firstData?.kind}
               </Typography>
@@ -148,23 +149,11 @@ function MultiActionAreaCard() {
         >2nd
         </Typography>
         <Box   {...useScrollFadeIn('left', 1, 0.1)}>
-          <Box sx={{
-            width: 650, border: 0,
-            backgroundColor: "white",
-            borderColor: "#759F98",
-            borderRadius: 5,
-            boxShadow: "1px 3px 3px #B0B09A",
-            margin: "auto",
-            mt: 5,
-          }}>
+          <Box style={StyledBox} sx={{ width: 650 }}>
             <CardActionArea sx={{ borderRadius: 5 }}>
               <CardMedia component="img" height="500" width="450" image={secondData?.images} sx={{ borderRadius: 5 }} />
               <Typography
-                fontSize={40}
-                component="div"
-                margin={1}
-                marginTop={2}
-                sx={{ fontFamily: "Itim", color: "#737458" }}
+                style={styledTypo}
               >
                 {secondData?.kind}
               </Typography>
@@ -195,23 +184,11 @@ function MultiActionAreaCard() {
         >3rd
         </Typography>
         <Box {...useScrollFadeIn('right', 1, 0.1)}>
-          <Box sx={{
-            width: 450, border: 1,
-            backgroundColor: "white",
-            borderColor: "white",
-            borderRadius: 5,
-            boxShadow: "1px 3px 3px #B0B09A",
-            margin: "auto",
-            mt: 5
-          }}>
+          <Box style={StyledBox} sx={{ width: 500 }}>
             <CardActionArea sx={{ borderRadius: 5 }}>
               <CardMedia component="img" height="500" width="450" image={thridData?.images} sx={{ borderRadius: 5 }} />
               <Typography
-                fontSize={40}
-                component="div"
-                margin={1}
-                marginTop={2}
-                sx={{ fontFamily: "Itim", color: "#737458" }}
+                style={styledTypo}
               >
                 {thridData?.kind}
               </Typography>