diff --git a/frontend/src/component/Info/Help.tsx b/frontend/src/component/Info/Help.tsx
index bea43b1..77aee39 100644
--- a/frontend/src/component/Info/Help.tsx
+++ b/frontend/src/component/Info/Help.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import help from '../../assets/icon/help.svg';
 import BoardAndRankInfo from './HelpDescription/BoardAndRankInfo';
 import KeyBoardInfo from './HelpDescription/keyBoardInfo';
@@ -10,17 +10,30 @@ import * as style from './info.styled';
 const Help = () => {
   const [isShowModal, setIsShowModal] = useState(false);
   const [animation, setAnimation] = useState('show');
+  const [setOpen, isSetOpen] = useState(true);
+
+  const setOpenModal = () => {
+    isSetOpen(!setOpen);
+  };
 
   const handleModal = () => {
     if (isShowModal) {
       setAnimation('close');
       setTimeout(() => setIsShowModal(false), 300);
+
+      const setValue = setOpen ? 'open' : 'close';
+      localStorage.setItem('openHelp', setValue);
     } else {
       setAnimation('show');
       setIsShowModal(true);
     }
   };
 
+  useEffect(() => {
+    const openHelp = localStorage.getItem('openHelp');
+    if (openHelp === 'open') setIsShowModal(true);
+  }, []);
+
   return (
     <>
       {isShowModal && (
@@ -37,6 +50,13 @@ const Help = () => {
               <BoardAndRankInfo />
               <WalkAndUserInfo />
             </div>
+            <div css={style.helpSettingWrapper}>
+              <div css={style.helpSetting(setOpen)}>
+                <p>접속시 도움말 켜기</p>
+                <button type="button" onClick={setOpenModal}></button>
+              </div>
+              <p>우측 하단의 물음표 버튼을 클릭해서 도움말을 볼 수 있습니다.</p>
+            </div>
           </section>
         </>
       )}
diff --git a/frontend/src/component/Info/HelpDescription/sidebarInfo.styled.ts b/frontend/src/component/Info/HelpDescription/sidebarInfo.styled.ts
index 5609499..cf82cf2 100644
--- a/frontend/src/component/Info/HelpDescription/sidebarInfo.styled.ts
+++ b/frontend/src/component/Info/HelpDescription/sidebarInfo.styled.ts
@@ -52,9 +52,5 @@ export const subDescription = css`
     width: 100%;
     padding-bottom: 15px;
     font-size: 14px;
-
-    /* span {
-      color: ${theme.red};
-    } */
   }
 `;
diff --git a/frontend/src/component/Info/help.styled.ts b/frontend/src/component/Info/help.styled.ts
deleted file mode 100644
index 0dc7c91..0000000
--- a/frontend/src/component/Info/help.styled.ts
+++ /dev/null
@@ -1,79 +0,0 @@
-import { css } from '@emotion/react';
-import help from '../../assets/icon/help.svg';
-import help2 from '../../assets/icon/help2.svg';
-import close from '../../assets/icon/close.svg';
-
-export const helpBtn = css`
-  width: 60px;
-  height: 60px;
-
-  position: absolute;
-  bottom: 55px;
-  right: 60px;
-  background-image: url(${help2});
-  background-repeat: no-repeat;
-  background-position: center;
-`;
-
-export const modal = (animation: string) => css`
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-flow: column;
-
-  width: 60%;
-  min-width: 600px;
-  max-width: 800px;
-  height: 60%;
-  min-height: 400px;
-  max-height: 600px;
-  padding: 20px;
-
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -60%);
-  border-radius: 0 20px 20px 20px;
-  background-color: rgba(255, 255, 255, 0.9);
-
-  animation: ${animation} 0.3s ease-in-out;
-
-  @keyframes show {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-
-  @keyframes close {
-    from {
-      opacity: 1;
-    }
-    to {
-      opacity: 0;
-    }
-  }
-`;
-
-export const closeBtn = css`
-  position: absolute;
-  top: 20px;
-  right: 20px;
-  width: 20px;
-  height: 20px;
-  opacity: 0.7;
-  padding: 5px;
-
-  ::after {
-    content: '';
-    display: block;
-    width: 20px;
-    height: 20px;
-    background-image: url(${close});
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: contain;
-  }
-`;
diff --git a/frontend/src/component/Info/info.styled.ts b/frontend/src/component/Info/info.styled.ts
index 43cc4b9..6af9537 100644
--- a/frontend/src/component/Info/info.styled.ts
+++ b/frontend/src/component/Info/info.styled.ts
@@ -1,6 +1,8 @@
 import { css } from '@emotion/react';
 import theme from '../../styles/theme';
 import close from '../../assets/icon/close.svg';
+import checkBox from '../../assets/icon/checkBox.svg';
+import { flexCenter } from '../../styles/mixin.styled';
 
 export const infoBox = css`
   display: flex;
@@ -118,3 +120,25 @@ export const content = css`
     display: none;
   }
 `;
+
+export const helpSettingWrapper = css`
+  font-size: 14px;
+  padding-top: 20px;
+  text-align: center;
+`;
+
+export const helpSetting = (isCheck: boolean) => css`
+  ${flexCenter}
+  padding-bottom: 10px;
+
+  button {
+    margin-left: 10px;
+    width: 14px;
+    height: 14px;
+    background-image: url(${checkBox});
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover;
+    opacity: ${isCheck ? 1 : 0.3};
+  }
+`;