diff --git a/src/components/BlockScroll.tsx b/src/components/BlockScroll.tsx
new file mode 100644
index 0000000..fbb4f5b
--- /dev/null
+++ b/src/components/BlockScroll.tsx
@@ -0,0 +1,14 @@
+import React from "react";
+import { createGlobalStyle } from "styled-components";
+
+const GlobalBlock = createGlobalStyle`
+  body {
+    overflow: hidden;
+  }
+`;
+
+const BlockScroll: React.FC = () => (
+  <GlobalBlock />
+);
+
+export default BlockScroll;
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 730fa40..edd5da7 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -6,6 +6,7 @@ import breakpoints from "@theme/breakpoints";
 import Navigation from "./Navigation";
 import NavigationMobile from "./NavigationMobile";
 import HeaderLogo from "./HeaderLogo";
+import BlockScroll from "./BlockScroll";
 
 const StyledHeader = styled.header`
   display: flex;
@@ -15,7 +16,7 @@ const StyledHeader = styled.header`
   }
 `;
 
-const Sticky = styled.div<{ $isHidden?: boolean }>`
+const Sticky = styled.div<{ $isHidden?: boolean; $mobileMenuOpen?: boolean }>`
   position: sticky;
   top: 0;
   z-index: 10;
@@ -24,6 +25,8 @@ const Sticky = styled.div<{ $isHidden?: boolean }>`
   background-color: ${colors.darkBlue};
   transition: all 200ms ease-out;
 
+  height: ${(p) => (p.$mobileMenuOpen ? "100vh" : "unset")};
+
   ${(p) => (p.$isHidden ? (`
     transition: all 200ms ease-in;
     transform: translateY(-100%);
@@ -56,7 +59,10 @@ const Header: React.FC = () => {
   }, [mobileMenuOpen]);
 
   return (
-    <Sticky $isHidden={isHidden}>
+    <Sticky $isHidden={isHidden} $mobileMenuOpen={mobileMenuOpen}>
+      { mobileMenuOpen && (
+        <BlockScroll />
+      )}
       <StyledHeader>
         <HeaderLogo />
         <Navigation onMobileMenuOpen={handleMobileMenuClick} />