diff --git a/components/modal/admin/AdminEditTournamentBraket.tsx b/components/modal/admin/AdminEditTournamentBraket.tsx
index 104cd663a..c0f6258a9 100644
--- a/components/modal/admin/AdminEditTournamentBraket.tsx
+++ b/components/modal/admin/AdminEditTournamentBraket.tsx
@@ -44,5 +44,5 @@ export default function AdminEditTournamentBraket({
         />
       </TournamentIdContext.Provider>
     </div>
-  ); //*onClick={putHandler}
+  );
 }
diff --git a/components/tournament/TournamentMegaphone.tsx b/components/tournament/TournamentMegaphone.tsx
new file mode 100644
index 000000000..0bad4aa61
--- /dev/null
+++ b/components/tournament/TournamentMegaphone.tsx
@@ -0,0 +1,108 @@
+import { useRouter } from 'next/router';
+import { useState, useEffect, useRef } from 'react';
+import { Virtuoso, VirtuosoHandle } from 'react-virtuoso';
+import { TournamentInfo } from 'types/tournamentTypes';
+import { instance } from 'utils/axios';
+import { mockInstance } from 'utils/mockAxios';
+import useInterval from 'hooks/useInterval';
+import styles from 'styles/Layout/MegaPhone.module.scss';
+
+interface IMegaphoneContent {
+  megaphoneId?: number;
+  content: string;
+  intraId: string;
+  onClick: (event: React.MouseEvent<HTMLDivElement>) => void;
+}
+
+type MegaphoneList = Array<IMegaphoneContent>;
+
+export const MegaphoneItem = ({
+  content,
+  intraId,
+  onClick,
+}: IMegaphoneContent) => {
+  return (
+    <div className={styles.contentWrapper} onClick={onClick}>
+      <div className={styles.intraId}>{intraId}</div>
+      <div className={styles.content}>{content}</div>
+    </div>
+  );
+};
+
+const TournamentMegaphone = () => {
+  const [contents, setContents] = useState<MegaphoneList>([]);
+  const [TournamentList, setTournamentList] = useState<TournamentInfo[]>([]);
+  const [megaphoneData, setMegaphoneData] = useState<MegaphoneList>([]);
+  const [selectedIndex, setSelectedIndex] = useState<number>(0);
+  const virtuoso = useRef<VirtuosoHandle>(null);
+  const router = useRouter();
+
+  function getTournamentListHandler() {
+    return mockInstance
+      .get(`tournament?page=1&status=예정&size=5`)
+      .then((res) => {
+        setTournamentList(res.data.tournaments);
+      });
+  }
+
+  const goTournamentPage = (event: React.MouseEvent<HTMLDivElement>) => {
+    router.push('tournament');
+  };
+
+  useEffect(() => {
+    if (contents.length === 0) getTournamentListHandler();
+  }, [contents]);
+
+  useEffect(() => {
+    if (contents.length > 0) setMegaphoneData([...contents]);
+    else {
+      setMegaphoneData([
+        ...TournamentList.map(
+          (item): IMegaphoneContent => ({
+            megaphoneId: item.tournamentId,
+            content: item.title,
+            intraId: item.startTime.toString().split(':').slice(0, 2).join(':'),
+            onClick: goTournamentPage,
+          })
+        ),
+      ]);
+    }
+  }, [contents, TournamentList]);
+
+  useInterval(() => {
+    if (!megaphoneData) return;
+    const nextIndex = (selectedIndex + 1) % megaphoneData.length;
+    setSelectedIndex(nextIndex);
+    if (virtuoso.current !== null)
+      virtuoso.current.scrollToIndex({
+        index: nextIndex,
+        align: 'start',
+        behavior: 'smooth',
+      });
+  }, 4000);
+
+  return (
+    <div className={styles.rollingBanner}>
+      <div className={styles.wrapper}>
+        {!!megaphoneData && megaphoneData.length > 0 && (
+          <Virtuoso
+            className={styles.virtuoso}
+            totalCount={megaphoneData.length}
+            data={megaphoneData}
+            ref={virtuoso}
+            itemContent={(index) => (
+              <MegaphoneItem
+                content={megaphoneData[index].content}
+                intraId={megaphoneData[index].intraId}
+                onClick={goTournamentPage}
+              />
+            )}
+            style={{ height: '100%' }}
+          />
+        )}
+      </div>
+    </div>
+  );
+};
+
+export default TournamentMegaphone;