diff --git a/src/widgets/navigation/footer.tsx b/src/widgets/navigation/footer.tsx
index 5f2a5f7..95da813 100644
--- a/src/widgets/navigation/footer.tsx
+++ b/src/widgets/navigation/footer.tsx
@@ -5,12 +5,14 @@ import {
   FooterProps,
   FooterItemActiveKey
 } from '@/entities/common/model/types';
+import { useEffect, useState } from 'react';
 
 export const FooterNavigation = ({ 
   setMenuOn,
   footerCurrentPage
 }: FooterProps) => {
   const { navigate } = useNavigate();
+  const [isFooterOn, setIsFooterOn] = useState<boolean>(false);
   
   const onClickToNavigate = (path?: string) => {
     if(!!path){
@@ -91,11 +93,30 @@ export const FooterNavigation = ({
     return rs;
   };
 
+  useEffect(() => {
+
+    const handleScroll = () => {
+      if(window.scrollY > window.outerHeight / 3){
+        setIsFooterOn(true);
+      }
+      else{
+        setIsFooterOn(false);
+      }
+    };
+    
+    window.addEventListener('scroll', handleScroll);
+    return () => {
+      window.removeEventListener('scroll', handleScroll);
+    };
+  }, []);
+
   return (
     <>
-      <nav className="bottom-tabbar">
-        { getFooterButtonItems() }
-      </nav>
+      { isFooterOn && 
+        <nav className="bottom-tabbar">
+          { getFooterButtonItems() }
+        </nav>
+      }
     </>
   );
 };