diff --git a/apps/web/public/images/home/hero.png b/apps/web/public/images/home/hero.png
new file mode 100644
index 00000000..1ae80c71
Binary files /dev/null and b/apps/web/public/images/home/hero.png differ
diff --git a/apps/web/src/modules/home/Banner/SvgGroup.tsx b/apps/web/src/modules/home/Banner/SvgGroup.tsx
deleted file mode 100644
index e9df8409..00000000
--- a/apps/web/src/modules/home/Banner/SvgGroup.tsx
+++ /dev/null
@@ -1,238 +0,0 @@
-import React, { useEffect, useMemo, useRef } from 'react';
-import { gsap } from 'gsap';
-import { useDebounceFn } from 'ahooks';
-
-import Svg1 from './assets/01.svg';
-import Svg2 from './assets/02.svg';
-import Svg3 from './assets/03.svg';
-import Svg4 from './assets/04.svg';
-import Svg5 from './assets/05.svg';
-// import Svg6 from './assets/06.svg';
-import Svg6 from './assets/07.svg';
-// import Svg8 from './assets/08.svg';
-
-export const SvgPositionConfig = [
-  {
-    id: 1,
-    top: 38,
-    right: 213,
-    width: 143,
-    height: 129,
-    el: <Svg1 />,
-    animate: true,
-  },
-  {
-    id: 2,
-    top: 89,
-    right: 311,
-    width: 277,
-    height: 250,
-    el: <Svg2 />,
-    animate: true,
-  },
-  {
-    id: 3,
-    top: 107,
-    right: 1,
-    width: 226,
-    height: 232,
-    el: <Svg3 />,
-    animate: true,
-  },
-  {
-    id: 4,
-    top: 383,
-    right: 11,
-    width: 143,
-    height: 129,
-    el: <Svg4 />,
-    animate: true,
-  },
-  // {
-  //   id: 5,
-  //   top: 230,
-  //   right: 417,
-  //   width: 139,
-  //   height: 143,
-  //   el: <Svg4 />,
-  //   animate: true,
-  // },
-  {
-    id: 5,
-    top: 331,
-    right: 241,
-    width: 307,
-    height: 233,
-    el: <Svg5 />,
-    animate: true,
-  },
-  // {
-  //   id: 7,
-  //   top: 615,
-  //   right: 47,
-  //   width: 139,
-  //   height: 143,
-  //   el: <Svg6 />,
-  //   animate: true,
-  // },
-  {
-    id: 6,
-    top: 295,
-    right: 200,
-    width: 139,
-    height: 143,
-    el: <Svg6 />,
-    animate: false,
-  },
-];
-
-export const SvgPositionMobileConfig = [
-  {
-    id: 1,
-    top: 10,
-    right: 360,
-    width: 78,
-    height: 70,
-    el: <Svg1 />,
-    animate: true,
-  },
-  {
-    id: 2,
-    top: 10,
-    right: 211,
-    width: 151,
-    height: 136,
-    el: <Svg2 />,
-    animate: true,
-  },
-  {
-    id: 3,
-    top: 10,
-    right: 50,
-    width: 122,
-    height: 126,
-    el: <Svg3 />,
-    animate: true,
-  },
-  {
-    id: 4,
-    top: 150,
-    right: 20,
-    width: 100,
-    height: 100,
-    el: <Svg4 />,
-    animate: true,
-  },
-  // {
-  //   id: 5,
-  //   top: 230,
-  //   right: 417,
-  //   width: 139,
-  //   height: 143,
-  //   el: <Svg4 />,
-  //   animate: true,
-  // },
-  {
-    id: 5,
-    bottom: 20,
-    right: 50,
-    width: 167,
-    height: 126,
-    el: <Svg5 />,
-    animate: true,
-  },
-  // {
-  //   id: 7,
-  //   top: 205,
-  //   right: 47,
-  //   width: 139,
-  //   height: 143,
-  //   el: <Svg6 />,
-  //   animate: true,
-  // },
-  {
-    id: 6,
-    top: 200,
-    right: 140,
-    width: 139,
-    height: 143,
-    el: <Svg6 />,
-    animate: false,
-  },
-];
-
-const anim = (id: string) => {
-  const list = [
-    {
-      target: `#${id} svg path:nth-child(2)`,
-      vars: { duration: 0.5, x: -10, y: 5 },
-    },
-    {
-      target: `#${id} svg path:nth-child(3)`,
-      vars: { duration: 0.5, x: -20, y: 10 },
-    },
-    {
-      target: `#${id} svg path:nth-child(4)`,
-      vars: { duration: 0.5, x: -30, y: 15 },
-    },
-    {
-      target: `#${id} svg path:nth-child(5)`,
-      vars: { duration: 0.5, x: -40, y: 20 },
-    },
-  ];
-  list.forEach((item) => {
-    gsap.to(item.target, item.vars);
-  });
-};
-
-export const SvgBlock: React.FC<{
-  id: number;
-  left?: number;
-  right?: number;
-  top?: number;
-  bottom?: number;
-  width: number;
-  height: number;
-  el: React.ReactElement;
-  animate: boolean;
-}> = ({ id, top, bottom, left, right, width, height, el, animate }) => {
-  const ref = useRef(false);
-
-  useEffect(() => {
-    if (ref.current) return;
-    ref.current = true;
-  }, []);
-
-  const { run, cancel } = useDebounceFn(
-    (id) => {
-      anim(id);
-    },
-    { wait: 1000, leading: true, trailing: false }
-  );
-
-  const styles = useMemo(() => {
-    const styles: React.CSSProperties = {};
-    if (top) styles.top = `${top}px`;
-    if (bottom) styles.bottom = `${bottom}px`;
-    if (left) styles.left = `${left}px`;
-    if (right) styles.right = `${right}px`;
-    return styles;
-  }, [top, right, left, bottom]);
-
-  return (
-    <div className={`absolute`} style={styles}>
-      <div
-        id={`svg${id}`}
-        style={{ width: `${width}px`, height: `${height}px` }}
-        onMouseEnter={(e) => {
-          if (animate) {
-            cancel();
-            run(`svg${id}`);
-          }
-        }}
-      >
-        {el}
-      </div>
-    </div>
-  );
-};
diff --git a/apps/web/src/modules/home/Banner/assets/01.svg b/apps/web/src/modules/home/Banner/assets/01.svg
deleted file mode 100644
index ef15231a..00000000
--- a/apps/web/src/modules/home/Banner/assets/01.svg
+++ /dev/null
@@ -1,20 +0,0 @@
-<svg viewBox="0 0 216 166" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g id="96efa2c28220e1f0b47186fae7c54ca0">
-        <rect width="216" height="166"></rect>
-        <path id="16918f21c7a00d712335c228ad1616f4"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="white" stroke="black"></path>
-        <path id="55a1ff48dbb77509a479dc589691c237"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="white" stroke="black"
-        ></path>
-        <path id="bbdd6917cad8ed7cfc60b16c3a452ae3"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="white" stroke="black"
-        ></path>
-        <path id="7454810c61b321e1543b6efac71ac289"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="#FFDA83" stroke="black"
-        ></path>
-    </g>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/02.svg b/apps/web/src/modules/home/Banner/assets/02.svg
deleted file mode 100644
index 42e0ebfe..00000000
--- a/apps/web/src/modules/home/Banner/assets/02.svg
+++ /dev/null
@@ -1,14 +0,0 @@
-<svg viewBox="0 0 308 291" fill="none" xmlns="http://www.w3.org/2000/svg" >
-  <g id="def474a313bffa002eae8941b2e12620" clip-path="url(#clip0_1_2)">
-    <rect width="308" height="291" ></rect>
-    <path id="1767af75e11911c3e303540f8e81bc12" fill-rule="evenodd" clip-rule="evenodd" d="M233.636 40.1024C228.289 49.0527 210.595 78.1121 180.556 127.28C180.462 127.433 180.369 127.586 180.289 127.733C180.44 127.815 180.592 127.898 180.743 127.98C224.259 151.676 258.219 170.344 282.62 183.988C268.277 207.741 244.19 223.017 216.787 228.538C189.181 234.1 158.208 229.764 130.41 214.22C102.618 198.679 83.2565 174.873 74.4285 148.943C65.6115 123.044 67.3045 95.0258 81.6103 71.0272C95.9204 47.0213 120.135 31.5895 147.709 26.0342C175.166 20.5024 205.955 24.7618 233.636 40.1024Z" fill="white" stroke="black"></path>
-    <path id="7ae595e30fdac5288c4be28cc3b224fb" fill-rule="evenodd" clip-rule="evenodd" d="M233.636 40.1024C228.289 49.0527 210.595 78.1121 180.556 127.28C180.462 127.433 180.369 127.586 180.289 127.733C180.44 127.815 180.592 127.898 180.743 127.98C224.259 151.676 258.219 170.344 282.62 183.988C268.277 207.741 244.19 223.017 216.787 228.538C189.181 234.1 158.208 229.764 130.41 214.22C102.618 198.679 83.2565 174.873 74.4285 148.943C65.6115 123.044 67.3045 95.0258 81.6103 71.0272C95.9204 47.0213 120.135 31.5895 147.709 26.0342C175.166 20.5024 205.955 24.7618 233.636 40.1024Z" fill="white" stroke="black"></path>
-    <path id="14205a41a5b5dd563fbc816b9a4c4df8" fill-rule="evenodd" clip-rule="evenodd" d="M233.636 40.1024C228.289 49.0527 210.595 78.1121 180.556 127.28C180.462 127.433 180.369 127.586 180.289 127.733C180.44 127.815 180.592 127.898 180.743 127.98C224.259 151.676 258.219 170.344 282.62 183.988C268.277 207.741 244.19 223.017 216.787 228.538C189.181 234.1 158.208 229.764 130.41 214.22C102.618 198.679 83.2565 174.873 74.4285 148.943C65.6115 123.044 67.3045 95.0258 81.6103 71.0272C95.9204 47.0213 120.135 31.5895 147.709 26.0342C175.166 20.5024 205.955 24.7618 233.636 40.1024Z" fill="white" stroke="black" ></path>
-    <path id="f2e804e45e1dab1163588130bcd0d13e" fill-rule="evenodd" clip-rule="evenodd" d="M233.636 40.1024C228.289 49.0527 210.595 78.1121 180.556 127.28C180.462 127.433 180.369 127.586 180.289 127.733C180.44 127.815 180.592 127.898 180.743 127.98C224.259 151.676 258.219 170.344 282.62 183.988C268.277 207.741 244.19 223.017 216.787 228.538C189.181 234.1 158.208 229.764 130.41 214.22C102.618 198.679 83.2565 174.873 74.4285 148.943C65.6115 123.044 67.3045 95.0258 81.6103 71.0272C95.9204 47.0213 120.135 31.5895 147.709 26.0342C175.166 20.5024 205.955 24.7618 233.636 40.1024Z" fill="#3A5BEF" stroke="black"></path>
-  </g>
-  <defs>
-    <clipPath id="clip0_1_2">
-      <rect width="308" height="291" fill="white"></rect>
-    </clipPath>
-  </defs>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/03.svg b/apps/web/src/modules/home/Banner/assets/03.svg
deleted file mode 100644
index 9f0e18b6..00000000
--- a/apps/web/src/modules/home/Banner/assets/03.svg
+++ /dev/null
@@ -1,22 +0,0 @@
-<svg viewBox="0 0 284 292" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g id="12e20e29765be0909de1357bba2a4e90" clip-path="url(#clip0_8_11)">
-        <rect width="284" height="292" ></rect>
-        <path id="51d55726f1ae8b9fe7e4dc72461f3755" fill-rule="evenodd" clip-rule="evenodd"
-              d="M135.31 254.129C125.04 256.88 114.628 255.209 106.095 250.282C97.5622 245.356 90.9086 237.174 88.157 226.905L53.9929 99.4028C51.2711 89.2449 52.8768 78.947 57.68 70.4665C62.4913 61.9716 70.5108 55.3002 80.5988 52.4211L81.2165 52.2502L208.719 18.086C218.988 15.3344 229.4 17.0057 237.933 21.9322C246.466 26.8587 253.12 35.0404 255.871 45.3096C258.623 55.5789 256.952 65.9912 252.025 74.5242C247.099 83.0571 238.917 89.7107 228.648 92.4623L138.334 116.662L162.533 206.976C165.285 217.245 163.614 227.658 158.687 236.191C153.761 244.723 145.579 251.377 135.31 254.129Z"
-              fill="white" stroke="black" ></path>
-        <path id="14044d6e75592be4f669e3552fdb27e8" fill-rule="evenodd" clip-rule="evenodd"
-              d="M135.31 254.129C125.04 256.88 114.628 255.209 106.095 250.282C97.5622 245.356 90.9086 237.174 88.157 226.905L53.9929 99.4028C51.2711 89.2449 52.8768 78.947 57.68 70.4665C62.4913 61.9716 70.5108 55.3002 80.5988 52.4211L81.2165 52.2502L208.719 18.086C218.988 15.3344 229.4 17.0057 237.933 21.9322C246.466 26.8587 253.12 35.0404 255.871 45.3096C258.623 55.5789 256.952 65.9912 252.025 74.5242C247.099 83.0571 238.917 89.7107 228.648 92.4623L138.334 116.662L162.533 206.976C165.285 217.245 163.614 227.658 158.687 236.191C153.761 244.723 145.579 251.377 135.31 254.129Z"
-              fill="white" stroke="black" ></path>
-        <path id="af08f9c09037bf0ccd1aff00449a3c81" fill-rule="evenodd" clip-rule="evenodd"
-              d="M135.31 254.129C125.04 256.88 114.628 255.209 106.095 250.282C97.5622 245.356 90.9086 237.174 88.157 226.905L53.9929 99.4028C51.2711 89.2449 52.8768 78.947 57.68 70.4665C62.4913 61.9716 70.5108 55.3002 80.5988 52.4211L81.2165 52.2502L208.719 18.086C218.988 15.3344 229.4 17.0057 237.933 21.9322C246.466 26.8587 253.12 35.0404 255.871 45.3096C258.623 55.5789 256.952 65.9912 252.025 74.5242C247.099 83.0571 238.917 89.7107 228.648 92.4623L138.334 116.662L162.533 206.976C165.285 217.245 163.614 227.658 158.687 236.191C153.761 244.723 145.579 251.377 135.31 254.129Z"
-              fill="white" stroke="black"></path>
-        <path id="129c307efa0a75fa35627a3c46165d3d" fill-rule="evenodd" clip-rule="evenodd"
-              d="M135.31 254.129C125.04 256.88 114.628 255.209 106.095 250.282C97.5622 245.356 90.9086 237.174 88.157 226.905L53.9929 99.4028C51.2711 89.2449 52.8768 78.947 57.68 70.4665C62.4913 61.9716 70.5108 55.3002 80.5988 52.4211L81.2165 52.2502L208.719 18.086C218.988 15.3344 229.4 17.0057 237.933 21.9322C246.466 26.8587 253.12 35.0404 255.871 45.3096C258.623 55.5789 256.952 65.9912 252.025 74.5242C247.099 83.0571 238.917 89.7107 228.648 92.4623L138.334 116.662L162.533 206.976C165.285 217.245 163.614 227.658 158.687 236.191C153.761 244.723 145.579 251.377 135.31 254.129Z"
-              fill="#FFDA83" stroke="black" ></path>
-    </g>
-    <defs>
-        <clipPath id="clip0_8_11">
-            <rect width="284" height="292" ></rect>
-        </clipPath>
-    </defs>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/04.svg b/apps/web/src/modules/home/Banner/assets/04.svg
deleted file mode 100644
index d95d745b..00000000
--- a/apps/web/src/modules/home/Banner/assets/04.svg
+++ /dev/null
@@ -1,17 +0,0 @@
-<svg viewBox="0 0 216 166" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g id="c49af758062c38662250e5e8c5096f6e">
-        <rect width="216" height="166" ></rect>
-        <path id="3aa2182d544eeacb7d973da5af34a832"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="white" stroke="black"></path>
-        <path id="c3847ef4e959517866c5dd70021ab5b8"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="white" stroke="black"></path>
-        <path id="5c038552c7341d9f051df17332c3d190"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="white" stroke="black"></path>
-        <path id="9262d96ed34e578e418ae8465cfe97a7"
-              d="M100.832 110.754C126.421 125.528 158.022 118.699 171.415 95.5022C184.808 72.305 174.921 41.5236 149.332 26.75C123.744 11.9764 92.1429 18.805 78.75 42.0022C65.3571 65.1994 75.2437 95.9808 100.832 110.754Z"
-              fill="black" stroke="black"></path>
-    </g>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/05.svg b/apps/web/src/modules/home/Banner/assets/05.svg
deleted file mode 100644
index 5a57fae2..00000000
--- a/apps/web/src/modules/home/Banner/assets/05.svg
+++ /dev/null
@@ -1,17 +0,0 @@
-<svg viewBox="0 0 450 411" fill="none" xmlns="http://www.w3.org/2000/svg" >
-    <g id="9060da63f57e419732b39ade83a52119">
-        <rect width="450" height="411" ></rect>
-        <path id="46eb2d91d5ca87a90ca0acb545ed28ae"
-              d="M386.169 168.25L162.734 39.25C138.581 25.3048 107.695 33.5805 93.75 57.7343C79.8048 81.8881 88.0805 112.773 112.234 126.719L335.669 255.719C359.823 269.664 390.708 261.388 404.653 237.234C418.598 213.081 410.323 182.195 386.169 168.25Z"
-              fill="white" stroke="black"></path>
-        <path id="e13321bcc9fd21b7696883fa76c08195"
-              d="M386.169 168.25L162.734 39.25C138.581 25.3048 107.695 33.5805 93.75 57.7343C79.8048 81.8881 88.0805 112.773 112.234 126.719L335.669 255.719C359.823 269.664 390.708 261.388 404.653 237.234C418.598 213.081 410.323 182.195 386.169 168.25Z"
-              fill="white" stroke="black"></path>
-        <path id="a453761218777b011c5b985c20bced2e"
-              d="M386.169 168.25L162.734 39.25C138.581 25.3048 107.695 33.5805 93.75 57.7343C79.8048 81.8881 88.0805 112.773 112.234 126.719L335.669 255.719C359.823 269.664 390.708 261.388 404.653 237.234C418.598 213.081 410.323 182.195 386.169 168.25Z"
-              fill="white" stroke="black" ></path>
-        <path id="65616b13c4e0db0265bebfe13069b9ea"
-              d="M386.169 168.25L162.734 39.25C138.581 25.3048 107.695 33.5805 93.75 57.7343C79.8048 81.8881 88.0805 112.773 112.234 126.719L335.669 255.719C359.823 269.664 390.708 261.388 404.653 237.234C418.598 213.081 410.323 182.195 386.169 168.25Z"
-              fill="#FFDA83" stroke="black"></path>
-    </g>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/06.svg b/apps/web/src/modules/home/Banner/assets/06.svg
deleted file mode 100644
index b542d204..00000000
--- a/apps/web/src/modules/home/Banner/assets/06.svg
+++ /dev/null
@@ -1,17 +0,0 @@
-<svg viewBox="0 0 284 292" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <g id="b1614339e5198f05970dfc78157f6f1b">
-        <rect width="284" height="292" ></rect>
-        <path id="75838c32c7a68d35dc060a5cbce272ab" fill-rule="evenodd" clip-rule="evenodd"
-              d="M171.919 10.8228C182.189 8.07116 192.601 9.74245 201.134 14.669C209.667 19.5955 216.32 27.7772 219.072 38.0464L248.06 146.23C250.782 156.388 249.176 166.686 244.373 175.166C239.561 183.661 231.542 190.333 221.454 193.212L220.836 193.383L112.653 222.371C102.383 225.122 91.971 223.451 83.438 218.524C74.9051 213.598 68.2515 205.416 65.4999 195.147C62.7482 184.878 64.4195 174.465 69.346 165.932C74.2725 157.399 82.4543 150.746 92.7235 147.994L163.718 128.971L144.696 57.9755C141.944 47.7062 143.615 37.2939 148.542 28.7609C153.469 20.228 161.65 13.5744 171.919 10.8228Z"
-              fill="white" stroke="black"></path>
-        <path id="ff246b8bb602e9de14a07d664c30c44c" fill-rule="evenodd" clip-rule="evenodd"
-              d="M171.919 10.8228C182.189 8.07116 192.601 9.74245 201.134 14.669C209.667 19.5955 216.32 27.7772 219.072 38.0464L248.06 146.23C250.782 156.388 249.176 166.686 244.373 175.166C239.561 183.661 231.542 190.333 221.454 193.212L220.836 193.383L112.653 222.371C102.383 225.122 91.971 223.451 83.438 218.524C74.9051 213.598 68.2515 205.416 65.4999 195.147C62.7482 184.878 64.4195 174.465 69.346 165.932C74.2725 157.399 82.4543 150.746 92.7235 147.994L163.718 128.971L144.696 57.9755C141.944 47.7062 143.615 37.2939 148.542 28.7609C153.469 20.228 161.65 13.5744 171.919 10.8228Z"
-              fill="white" stroke="black"></path>
-        <path id="17de096d6d8fb13e9d0932df1a68b38e" fill-rule="evenodd" clip-rule="evenodd"
-              d="M171.919 10.8228C182.189 8.07116 192.601 9.74245 201.134 14.669C209.667 19.5955 216.32 27.7772 219.072 38.0464L248.06 146.23C250.782 156.388 249.176 166.686 244.373 175.166C239.561 183.661 231.542 190.333 221.454 193.212L220.836 193.383L112.653 222.371C102.383 225.122 91.971 223.451 83.438 218.524C74.9051 213.598 68.2515 205.416 65.4999 195.147C62.7482 184.878 64.4195 174.465 69.346 165.932C74.2725 157.399 82.4543 150.746 92.7235 147.994L163.718 128.971L144.696 57.9755C141.944 47.7062 143.615 37.2939 148.542 28.7609C153.469 20.228 161.65 13.5744 171.919 10.8228Z"
-              fill="white" stroke="black"></path>
-        <path id="338df0ff7b361295ba4cbf6d1a3c12a8" fill-rule="evenodd" clip-rule="evenodd"
-              d="M171.919 10.8228C182.189 8.07116 192.601 9.74245 201.134 14.669C209.667 19.5955 216.32 27.7772 219.072 38.0464L248.06 146.23C250.782 156.388 249.176 166.686 244.373 175.166C239.561 183.661 231.542 190.333 221.454 193.212L220.836 193.383L112.653 222.371C102.383 225.122 91.971 223.451 83.438 218.524C74.9051 213.598 68.2515 205.416 65.4999 195.147C62.7482 184.878 64.4195 174.465 69.346 165.932C74.2725 157.399 82.4543 150.746 92.7235 147.994L163.718 128.971L144.696 57.9755C141.944 47.7062 143.615 37.2939 148.542 28.7609C153.469 20.228 161.65 13.5744 171.919 10.8228Z"
-              fill="#3A5BEF" stroke="black"></path>
-    </g>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/07.svg b/apps/web/src/modules/home/Banner/assets/07.svg
deleted file mode 100644
index 2f96591e..00000000
--- a/apps/web/src/modules/home/Banner/assets/07.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="195px" height="130px" viewBox="0 0 210 165" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>01</title>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Artboard" transform="translate(-158.000000, -262.000000)" fill="#FFFFFF" stroke="#000000">
-            <path d="M196.596934,264.888041 C209.080634,261.543044 222.840407,262.960418 234.917296,269.933013 L234.917296,269.933013 L341.43842,331.433013 C353.515309,338.405608 361.622677,349.613234 364.967674,362.096934 C368.312672,374.580634 366.895298,388.340407 359.922703,400.417296 C352.950108,412.494184 341.742482,420.601553 329.258782,423.94655 C316.775082,427.291547 303.015309,425.874173 290.93842,418.901578 L290.93842,418.901578 L184.417296,357.401578 C172.340407,350.428984 164.233039,339.221357 160.888041,326.737657 C157.543044,314.253958 158.960418,300.494184 165.933013,288.417296 C172.905608,276.340407 184.113234,268.233039 196.596934,264.888041 Z" id="01"></path>
-        </g>
-    </g>
-</svg>
\ No newline at end of file
diff --git a/apps/web/src/modules/home/Banner/assets/08.svg b/apps/web/src/modules/home/Banner/assets/08.svg
deleted file mode 100644
index a7dcf62a..00000000
--- a/apps/web/src/modules/home/Banner/assets/08.svg
+++ /dev/null
@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg viewBox="0 0 143 125" version="1.1" xmlns="http://www.w3.org/2000/svg"
-     xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>02</title>
-    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="Artboard" transform="translate(-498.000000, -282.000000)" fill="#FFFFFF" stroke="#000000">
-            <g id="02" transform="translate(498.579406, 282.864327)">
-                <path d="M73.1670113,1.69350557 C85.9500253,-1.07514554 100.255686,0.910952927 113.055167,8.30073643 C125.854647,15.6905199 134.727489,27.0865364 138.721274,39.5412768 C142.707454,51.9723012 141.831431,65.4587845 135.137526,77.0529685 C128.44362,88.6471525 117.201995,96.1490524 104.443322,98.9124315 C91.6603079,101.681083 77.3546471,99.6949841 64.5551666,92.3052006 C51.7556861,84.9154171 42.882844,73.5194007 38.8890592,61.0646602 C34.9028792,48.6336358 35.7789022,35.1471525 42.4728075,23.5529685 C49.1667128,11.9587845 60.4083384,4.45688467 73.1670113,1.69350557 Z"
-                      id="Oval"></path>
-                <path d="M62.1670113,8.69350557 C74.9500253,5.92485446 89.2556861,7.91095293 102.055167,15.3007364 C114.854647,22.6905199 123.727489,34.0865364 127.721274,46.5412768 C131.707454,58.9723012 130.831431,72.4587845 124.137526,84.0529685 C117.44362,95.6471525 106.201995,103.149052 93.4433219,105.912431 C80.6603079,108.681083 66.3546471,106.694984 53.5551666,99.3052006 C40.7556861,91.9154171 31.882844,80.5194007 27.8890592,68.0646602 C23.9028792,55.6336358 24.7789022,42.1471525 31.4728075,30.5529685 C38.1667128,18.9587845 49.4083384,11.4568847 62.1670113,8.69350557 Z"
-                      id="Oval"></path>
-                <path d="M50.1670113,15.6935056 C62.9500253,12.9248545 77.2556861,14.9109529 90.0551666,22.3007364 C102.854647,29.6905199 111.727489,41.0865364 115.721274,53.5412768 C119.707454,65.9723012 118.831431,79.4587845 112.137526,91.0529685 C105.44362,102.647153 94.2019948,110.149052 81.4433219,112.912431 C68.6603079,115.681083 54.3546471,113.694984 41.5551666,106.305201 C28.7556861,98.9154171 19.882844,87.5194007 15.8890592,75.0646602 C11.9028792,62.6336358 12.7789022,49.1471525 19.4728075,37.5529685 C26.1667128,25.9587845 37.4083384,18.4568847 50.1670113,15.6935056 Z"
-                      id="Oval"></path>
-                <path d="M37.1670113,24.6935056 C49.9500253,21.9248545 64.2556861,23.9109529 77.0551666,31.3007364 C89.8546471,38.6905199 98.7274892,50.0865364 102.721274,62.5412768 C106.707454,74.9723012 105.831431,88.4587845 99.1375257,100.052969 C92.4436205,111.647153 81.2019948,119.149052 68.4433219,121.912431 C55.6603079,124.681083 41.3546471,122.694984 28.5551666,115.305201 C15.7556861,107.915417 6.882844,96.5194007 2.88905918,84.0646602 C-1.09712076,71.6336358 -0.221097752,58.1471525 6.4728075,46.5529685 C13.1667128,34.9587845 24.4083384,27.4568847 37.1670113,24.6935056 Z"
-                      id="Oval"></path>
-            </g>
-        </g>
-    </g>
-</svg>
diff --git a/apps/web/src/modules/home/Banner/assets/hero.png b/apps/web/src/modules/home/Banner/assets/hero.png
new file mode 100644
index 00000000..1ae80c71
Binary files /dev/null and b/apps/web/src/modules/home/Banner/assets/hero.png differ
diff --git a/apps/web/src/modules/home/Banner/index.tsx b/apps/web/src/modules/home/Banner/index.tsx
index 6328fb9d..f4a594e1 100644
--- a/apps/web/src/modules/home/Banner/index.tsx
+++ b/apps/web/src/modules/home/Banner/index.tsx
@@ -1,40 +1,28 @@
 import React, { memo, useMemo } from 'react';
 import { Center } from '@common/components/Layout';
-import useBreakpoint from '@common/hooks/useBreakpoint';
-import NoSsr from '@common/components/NoSsr';
-import {
-  SvgBlock,
-  SvgPositionConfig,
-  SvgPositionMobileConfig,
-} from './SvgGroup';
 import Search from './Search';
 import styles from './index.module.scss';
+import NoSsr from '@common/components/NoSsr';
+import Image from 'next/image';
 
-const SvgGroup: React.FC<{ breakpoint: string }> = memo(({ breakpoint }) => {
-  const svgConfig = useMemo(() => {
-    if (breakpoint === 'sm') return SvgPositionMobileConfig;
-    return SvgPositionConfig;
-  }, [breakpoint]);
-
+const Carousel = () => {
   return (
-    <>
-      {svgConfig.map((item) => {
-        return <SvgBlock key={item.id} {...item} />;
-      })}
-    </>
+    <div className="absolute top-[100px] -right-16">
+      <Image
+        width={680}
+        height={540}
+        src={'/images/home/hero.png'}
+        // unoptimized
+        alt={''}
+      />
+    </div>
   );
-});
-SvgGroup.displayName = 'SvgGroup';
-
+};
 const SectionBanner = () => {
-  const breakpoint = useBreakpoint();
-
   return (
     <section className={`${styles.bg}`}>
       <Center className="relative z-10 mx-auto h-[620px] md:h-[500px]">
-        <NoSsr>
-          <SvgGroup breakpoint={breakpoint} />
-        </NoSsr>
+        <Carousel />
         <Search />
       </Center>
     </section>