diff --git a/src/asset/css/MainBanner.css b/src/asset/css/MainBanner.css
index 82daab55..885c5ead 100644
--- a/src/asset/css/MainBanner.css
+++ b/src/asset/css/MainBanner.css
@@ -63,8 +63,32 @@
   font-size: 1.2rem;
 }
 
-.main-banner__scroll_icon {
+.main-banner__mouse {
   margin-top: 1.6rem;
+  width: 2rem;
+  height: 3.4rem;
+  border: 0.2rem solid rgba(255, 255, 255, 0.5);
+  border-radius: 6rem;
+  position: relative;
+  &::before {
+    content: "";
+    width: 0.6rem;
+    height: 0.6rem;
+    position: absolute;
+    top: 0.3rem;
+    left: 50%;
+    transform: translateX(-50%);
+    background-color: white;
+    border-radius: 50%;
+    animation: wheel 3s infinite;
+  }
+}
+
+@keyframes wheel {
+  to {
+    opacity: 0;
+    top: 2.4rem;
+  }
 }
 
 @media screen and (max-width: 1199px) {
diff --git a/src/asset/img/scroll-icon.svg b/src/asset/img/scroll-icon.svg
deleted file mode 100644
index 251d3b75..00000000
--- a/src/asset/img/scroll-icon.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="36">
-    <g data-name="scroll_icon" transform="translate(-944.243 -950.365)" style="opacity:.8">
-        <g data-name="사각형 3" transform="translate(944.243 950.365)" style="stroke:#d5d5d5;stroke-width:2px;fill:none">
-            <rect width="24" height="36" rx="12" style="stroke:none"/>
-            <rect x="1" y="1" width="22" height="34" rx="11" style="fill:none"/>
-        </g>
-        <circle data-name="타원 2" cx="3" cy="3" r="3" transform="translate(953.243 957.365)" style="fill:#d5d5d5"/>
-    </g>
-</svg>
diff --git a/src/component/main/MainBanner.tsx b/src/component/main/MainBanner.tsx
index d58481bc..b840f8e1 100644
--- a/src/component/main/MainBanner.tsx
+++ b/src/component/main/MainBanner.tsx
@@ -1,6 +1,4 @@
-import Image from "../utils/Image";
 import SearchBar from "../utils/SearchBar";
-import ScrollIcon from "../../asset/img/scroll-icon.svg";
 import "../../asset/css/Banner.css";
 import "../../asset/css/MainBanner.css";
 
@@ -24,11 +22,7 @@ const MainBanner = () => {
         </div>
         <div className="main-banner__scroll">
           <p className="font-12 color-d5">스크롤을 내려주세요</p>
-          <Image
-            src={ScrollIcon}
-            className="main-banner__scroll_icon"
-            alt="scroll-icon"
-          />
+          <div className="main-banner__mouse" />
         </div>
       </div>
     </section>