diff --git a/src/components/archiving/Archiving.tsx b/src/components/archiving/Archiving.tsx
index 787c08a7..f278e8c7 100644
--- a/src/components/archiving/Archiving.tsx
+++ b/src/components/archiving/Archiving.tsx
@@ -65,7 +65,7 @@ const ArchivingIndex = styled.div`
   font-weight: 900;
   font-size: 2.3rem;
   margin-bottom: 20px;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
 `;
 
 const CardWrapper = styled.div`
diff --git a/src/components/archiving/Header.tsx b/src/components/archiving/Header.tsx
index 1401541b..4bd73213 100644
--- a/src/components/archiving/Header.tsx
+++ b/src/components/archiving/Header.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import styled from 'styled-components';
 import { GreyScale } from '@utils/constant/color';
-const Header = ({ pageName, introduce }: { pageName: string; introduce: string; }) => {
+const Header = ({ pageName, introduce }: { pageName: string; introduce: string }) => {
   return (
     <Wrapper>
       <Category>아카이빙 &gt; {pageName}</Category>
@@ -22,7 +22,7 @@ const Category = styled.div`
   }
 `;
 const Title = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 700;
   font-size: 4rem;
diff --git a/src/components/common/empty/EmptyView.tsx b/src/components/common/empty/EmptyView.tsx
index e90e1b90..add23a51 100644
--- a/src/components/common/empty/EmptyView.tsx
+++ b/src/components/common/empty/EmptyView.tsx
@@ -3,31 +3,31 @@ import React from 'react';
 import styled from 'styled-components';
 
 const EmptyView = () => {
-    return (
-        <Wrapper>
-            <Text>송하야 세션해줘,,</Text>
-        </Wrapper>
-    );
+  return (
+    <Wrapper>
+      <Text>송하야 세션해줘,,</Text>
+    </Wrapper>
+  );
 };
 
 export default EmptyView;
 
 const Wrapper = styled.div`
-    width: 93%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: ${GreyScale.light};
-    height: 330px;
-    border-radius: 20px;
-    margin: 1rem 0 2rem 0;
+  width: 93%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: ${GreyScale.light};
+  height: 330px;
+  border-radius: 20px;
+  margin: 1rem 0 2rem 0;
 `;
 
 const Text = styled.div`
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-size: 2rem;
-    color: ${GreyScale.default};
-    font-family: 'GmarketSans';
-`;
\ No newline at end of file
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 2rem;
+  color: ${GreyScale.default};
+  font-family: 'Gmarket Sans';
+`;
diff --git a/src/components/common/footer/Footer.tsx b/src/components/common/footer/Footer.tsx
index 4b0fecfc..0a1e95d5 100644
--- a/src/components/common/footer/Footer.tsx
+++ b/src/components/common/footer/Footer.tsx
@@ -53,7 +53,7 @@ const TitleText = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 900;
   font-size: 1.8rem;
diff --git a/src/components/gallery/GalleryDetailSection.tsx b/src/components/gallery/GalleryDetailSection.tsx
index ec22467f..248742a8 100644
--- a/src/components/gallery/GalleryDetailSection.tsx
+++ b/src/components/gallery/GalleryDetailSection.tsx
@@ -55,7 +55,7 @@ const LeftWrapper = styled.div`
 `;
 
 const TitleText = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 900;
   font-size: 3rem;
diff --git a/src/components/home/activity/ActivitySection.tsx b/src/components/home/activity/ActivitySection.tsx
index b6a85086..b352e4b0 100644
--- a/src/components/home/activity/ActivitySection.tsx
+++ b/src/components/home/activity/ActivitySection.tsx
@@ -111,7 +111,7 @@ const ImageWrapper = styled.div`
 const TitleText = styled.div`
   display: flex;
   justify-content: flex-start;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 800;
   line-height: 4rem;
diff --git a/src/components/home/introduction/IntroduceSection.tsx b/src/components/home/introduction/IntroduceSection.tsx
index 892a9fed..5ee73ae6 100644
--- a/src/components/home/introduction/IntroduceSection.tsx
+++ b/src/components/home/introduction/IntroduceSection.tsx
@@ -73,7 +73,7 @@ const TitleText = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 900;
   font-size: 2.5rem;
diff --git a/src/components/home/introduction/component/PhotoCard.tsx b/src/components/home/introduction/component/PhotoCard.tsx
index 0f6fd1b7..bdb10c29 100644
--- a/src/components/home/introduction/component/PhotoCard.tsx
+++ b/src/components/home/introduction/component/PhotoCard.tsx
@@ -51,7 +51,7 @@ const BlurBackground = styled.div`
   border-radius: 20px;
 `;
 
-const Container = styled.div<{ img: string; }>`
+const Container = styled.div<{ img: string }>`
   &:hover {
     .blur {
       opacity: 1;
@@ -109,7 +109,7 @@ const Container = styled.div<{ img: string; }>`
 `;
 
 const TitleText = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 700;
   font-size: 4rem;
diff --git a/src/components/home/main/MainSection.tsx b/src/components/home/main/MainSection.tsx
index 36be44fc..46b790e4 100644
--- a/src/components/home/main/MainSection.tsx
+++ b/src/components/home/main/MainSection.tsx
@@ -10,7 +10,7 @@ import { motion } from 'framer-motion';
 import { HiOutlineArrowDown } from 'react-icons/hi';
 import { GENERATION_CHECKER } from '@utils/constant';
 
-const MainSection = ({ clickMore }: { clickMore: () => void; }) => {
+const MainSection = ({ clickMore }: { clickMore: () => void }) => {
   const generation = new Date().getFullYear() - GENERATION_CHECKER;
 
   return (
@@ -18,23 +18,21 @@ const MainSection = ({ clickMore }: { clickMore: () => void; }) => {
       <MainWrapper>
         <LeftSection>
           <LionWrapper>
-            {
-              Array.from({ length: 3 }).map(
-                (_, i) => (
-                  <ImageWrapper key={i} animate={animationSetting(i)}>
-                    <Lion key={i} src={loadingPic} layout="fill" objectFit="cover" objectPosition="center" />
-                  </ImageWrapper>
-                )
-              )
-            }
+            {Array.from({ length: 3 }).map((_, i) => (
+              <ImageWrapper key={i} animate={animationSetting(i)}>
+                <Lion key={i} src={loadingPic} layout="fill" objectFit="cover" objectPosition="center" />
+              </ImageWrapper>
+            ))}
           </LionWrapper>
           <TextWrapper>
             <UnionTextWrapper>
               <BlueBlockText>멋쟁이</BlueBlockText>
-              <UnionText className='union'><Union src={union} /></UnionText>
+              <UnionText className="union">
+                <Union src={union} />
+              </UnionText>
             </UnionTextWrapper>
             <BlueBlockText>사자처럼</BlueBlockText>
-            <LandingRectangle style={{ 'marginTop': '22px' }} />
+            <LandingRectangle style={{ marginTop: '22px' }} />
             <WhiteBlockText>중앙대학교</WhiteBlockText>
           </TextWrapper>
         </LeftSection>
@@ -45,9 +43,13 @@ const MainSection = ({ clickMore }: { clickMore: () => void; }) => {
               <GenerationText>{generation}기</GenerationText>
               <GenerationDia src={generationDia} />
             </GenerationDiaWrapper>
-            <CircleWrapper className='circle'><Circle src={circle} /></CircleWrapper>
+            <CircleWrapper className="circle">
+              <Circle src={circle} />
+            </CircleWrapper>
             <UnionRow>
-              <UnionWrapper className='union'><Union src={union} /></UnionWrapper>
+              <UnionWrapper className="union">
+                <Union src={union} />
+              </UnionWrapper>
             </UnionRow>
           </ImagesWrapper>
         </RightSection>
@@ -56,7 +58,7 @@ const MainSection = ({ clickMore }: { clickMore: () => void; }) => {
       <MoreWrapper>
         <Text onClick={clickMore}>더 알아보기</Text>
         <ArrowCircle onClick={clickMore}>
-          <HiOutlineArrowDown className='arrow' color={Primary.default} />
+          <HiOutlineArrowDown className="arrow" color={Primary.default} />
         </ArrowCircle>
       </MoreWrapper>
     </Wrapper>
@@ -65,7 +67,6 @@ const MainSection = ({ clickMore }: { clickMore: () => void; }) => {
 
 export default MainSection;
 
-
 const Wrapper = styled.div`
   display: flex;
   flex-direction: column;
@@ -85,16 +86,14 @@ const MainWrapper = styled.div`
   align-items: center;
   position: relative;
 
-  @media (max-width: 900px){
+  @media (max-width: 900px) {
     justify-content: space-between;
   }
 `;
 
-const LeftSection = styled.div`
-`;
+const LeftSection = styled.div``;
 
-const RightSection = styled.div`
-`;
+const RightSection = styled.div``;
 
 const LionWrapper = styled.div`
   display: flex;
@@ -114,8 +113,8 @@ const animationSetting = (i: number) => {
       duration: 1,
       delay: i,
       repeat: Infinity,
-      repeatDelay: 3
-    }
+      repeatDelay: 3,
+    },
   };
 };
 
@@ -141,11 +140,10 @@ const ImageWrapper = styled(motion.div)`
     width: 2.5rem;
     height: 2.5rem;
   }
-  
 `;
 
 const ImagesWrapper = styled.div`
-  position: absolute; 
+  position: absolute;
   right: 0;
   bottom: 30rem;
   display: flex;
@@ -153,109 +151,102 @@ const ImagesWrapper = styled.div`
   justify-content: center;
   align-items: center;
 
-  @media (max-width: 1920px){
+  @media (max-width: 1920px) {
     bottom: 25rem;
   }
 
-  @media (max-width:1440px){
+  @media (max-width: 1440px) {
     bottom: 13rem;
   }
 
-  @media (max-width:900px){
+  @media (max-width: 900px) {
     bottom: 10rem;
   }
 
-  @media (max-width: 750px){
+  @media (max-width: 750px) {
     bottom: 19rem;
   }
 
-  @media (max-width: 524px){
+  @media (max-width: 524px) {
     bottom: 19rem;
   }
 
-  @media (max-width: 360px){
+  @media (max-width: 360px) {
     bottom: 16rem;
   }
 `;
 
-
 const GenerationDiaWrapper = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
   width: 19.6rem;
   height: 19.6rem;
-  z-index:1;
-  margin-bottom: -9.4rem; 
+  z-index: 1;
+  margin-bottom: -9.4rem;
 
-  @media(max-width:1600px){
+  @media (max-width: 1600px) {
     width: 15rem;
     height: 15rem;
-    margin-bottom: -8rem; 
+    margin-bottom: -8rem;
   }
 
-  @media(max-width:1440px){
+  @media (max-width: 1440px) {
     width: 14rem;
     height: 14rem;
-    margin-bottom: -8.3rem; 
+    margin-bottom: -8.3rem;
   }
 
-  @media(max-width:900px){
+  @media (max-width: 900px) {
     width: 13rem;
     height: 13rem;
-    margin-bottom: -7rem; 
-
+    margin-bottom: -7rem;
   }
 
-  @media(max-width:750px){
+  @media (max-width: 750px) {
     width: 9rem;
     height: 9rem;
-    margin-bottom: -5rem; 
-
+    margin-bottom: -5rem;
   }
-  
-  @media(max-width: 524px){
+
+  @media (max-width: 524px) {
     width: 7rem;
     height: 7rem;
-    margin-bottom: -3.7rem; 
-
+    margin-bottom: -3.7rem;
   }
 
-  @media(max-width: 360px){
+  @media (max-width: 360px) {
     width: 6rem;
     height: 6rem;
     margin-bottom: -2.7rem;
   }
-  
 `;
 
 const CircleWrapper = styled.div`
-  width:40rem;
-  height:22rem;
-  @media(max-width:1280px){
+  width: 40rem;
+  height: 22rem;
+  @media (max-width: 1280px) {
     width: 36rem;
     height: 18rem;
   }
 
-   @media (max-width:900px){
+  @media (max-width: 900px) {
     width: 288px;
     height: 161.8px;
   }
-  @media(max-width: 750px){
+  @media (max-width: 750px) {
     width: 21rem;
     height: 12rem;
   }
 
-  @media (max-width: 524px){
+  @media (max-width: 524px) {
     width: 17rem;
     height: 9.5rem;
   }
-  @media (max-width: 360px){
+  @media (max-width: 360px) {
     width: 15rem;
     height: 7rem;
   }
-
-
 `;
 
 const UnionRow = styled.div`
@@ -265,36 +256,35 @@ const UnionRow = styled.div`
 `;
 
 const UnionWrapper = styled.div`
-  width:10rem;
+  width: 10rem;
   height: 10rem;
 
   margin-top: -20px;
 
-  @media(max-width:1280px) {
+  @media (max-width: 1280px) {
     width: 6rem;
     height: 6rem;
   }
 
-  @media (max-width:900px) {
+  @media (max-width: 900px) {
     width: 5rem;
     height: 5rem;
   }
 
-  @media(max-width:750px){
-    width:4rem;
+  @media (max-width: 750px) {
+    width: 4rem;
     height: 4rem;
   }
-  
-  @media(max-width: 524px){
+
+  @media (max-width: 524px) {
     width: 3rem;
     height: 3rem;
   }
 
-  @media(max-width: 360px){
+  @media (max-width: 360px) {
     width: 3rem;
     height: 3rem;
   }
-  
 `;
 
 const UnionText = styled.div`
@@ -326,44 +316,41 @@ const UnionText = styled.div`
   }
 `;
 
-
 const GenerationDia = styled(Image)`
   position: absolute;
 `;
 
-
 const Circle = styled(Image)``;
 const Union = styled(Image)``;
 
 const GenerationText = styled.div`
   position: absolute;
-  z-index:1;
-  font-family: 'GmarketSans';
+  z-index: 1;
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 700;
   font-size: 5rem;
-  color:#FFFFFF;
+  color: #ffffff;
 
-  @media(max-height:1280px){
+  @media (max-height: 1280px) {
     font-size: 4rem;
   }
 
-  @media(max-width:900px){
+  @media (max-width: 900px) {
     font-size: 3rem;
   }
 
-  @media(max-width:750px){
+  @media (max-width: 750px) {
     font-size: 2rem;
   }
 
-  @media(max-height:524px){
+  @media (max-height: 524px) {
     font-size: 1.7rem;
   }
 
-  @media(max-width:360px){
+  @media (max-width: 360px) {
     font-size: 1.7rem;
   }
-
 `;
 
 const TextWrapper = styled.div`
@@ -372,10 +359,10 @@ const TextWrapper = styled.div`
 `;
 
 const BlueBlockText = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-weight: 700;
   font-size: 13rem;
-  color: #1A21BD;
+  color: #1a21bd;
   @media (max-width: 1440px) {
     font-size: 9.5rem;
   }
@@ -391,8 +378,9 @@ const BlueBlockText = styled.div`
 const WhiteBlockText = styled(BlueBlockText)`
   margin-top: 22px;
   color: white;
-  text-shadow: -1px -1px 0 ${Primary.default}, 1px -1px 0 ${Primary.default}, -1px 1px 0 ${Primary.default}, 1px 1px 0 ${Primary.default}; 
-  
+  text-shadow: -1px -1px 0 ${Primary.default}, 1px -1px 0 ${Primary.default}, -1px 1px 0 ${Primary.default},
+    1px 1px 0 ${Primary.default};
+
   @media (max-width: 360px) {
     font-size: 4rem;
   }
@@ -411,7 +399,7 @@ const MoreWrapper = styled.div`
   @media (max-width: 524px) {
     justify-content: center;
   }
-  @media (max-width: 360px){
+  @media (max-width: 360px) {
     align-items: center;
     justify-content: center;
     flex-direction: column;
@@ -419,58 +407,51 @@ const MoreWrapper = styled.div`
 `;
 
 const ArrowCircle = styled.div`
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: 100%;
-    width: 5rem;
-    cursor: pointer;
-
-    height: 5rem;
-    border: 2px solid ${Primary.default};
-    box-shadow: 1rem 1rem 1rem 0rem #2B22784D;
-    .arrow{
-        width: 3rem;
-        height: 3rem;
-        @media (max-width: 900px) {
-          width: 1.8rem;
-          height: 1.8rem;
-        }
-        @media (max-width: 750px){
-          width: 1.3rem;
-          height: 1.3rem;
-        }
-    };
-    @media(max-width: 900px){
-      width: 3rem;
-      height: 3rem;
-      box-shadow: 0.4rem 0.4rem 0.4rem 0rem #2B22784D;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 100%;
+  width: 5rem;
+  cursor: pointer;
+
+  height: 5rem;
+  border: 2px solid ${Primary.default};
+  box-shadow: 1rem 1rem 1rem 0rem #2b22784d;
+  .arrow {
+    width: 3rem;
+    height: 3rem;
+    @media (max-width: 900px) {
+      width: 1.8rem;
+      height: 1.8rem;
     }
-    @media(max-width: 750px) {
-      width: 2.3rem;
-      height: 2.3rem;
-      box-shadow: 0.2rem 0.2rem 0.2rem 0rem #2B22784D;
+    @media (max-width: 750px) {
+      width: 1.3rem;
+      height: 1.3rem;
     }
-
-
+  }
+  @media (max-width: 900px) {
+    width: 3rem;
+    height: 3rem;
+    box-shadow: 0.4rem 0.4rem 0.4rem 0rem #2b22784d;
+  }
+  @media (max-width: 750px) {
+    width: 2.3rem;
+    height: 2.3rem;
+    box-shadow: 0.2rem 0.2rem 0.2rem 0rem #2b22784d;
+  }
 `;
 
 const Text = styled.div`
-    display: flex;
-    cursor: pointer;
-    justify-content: center;
-    align-items: center;
-    font-family: 'GmarketSans';
-    font-size: 2.3rem;
-    color: ${Primary.default};
-    font-weight: 700;
+  display: flex;
+  cursor: pointer;
+  justify-content: center;
+  align-items: center;
+  font-family: 'Gmarket Sans';
+  font-size: 2.3rem;
+  color: ${Primary.default};
+  font-weight: 700;
 
-    @media (max-width: 900px) {
-      font-size: 1.7rem;
-    }
+  @media (max-width: 900px) {
+    font-size: 1.7rem;
+  }
 `;
-
-
-
-
-
diff --git a/src/components/home/plan/PlanSection.tsx b/src/components/home/plan/PlanSection.tsx
index 31202956..4f31d331 100644
--- a/src/components/home/plan/PlanSection.tsx
+++ b/src/components/home/plan/PlanSection.tsx
@@ -48,7 +48,7 @@ const TitleText = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 900;
   font-size: 3.7rem;
diff --git a/src/components/home/project/ProjectSection.tsx b/src/components/home/project/ProjectSection.tsx
index ca26c005..7c01a3dc 100644
--- a/src/components/home/project/ProjectSection.tsx
+++ b/src/components/home/project/ProjectSection.tsx
@@ -49,7 +49,7 @@ const TitleWrapper = styled.div`
   }
 `;
 const Title = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-weight: 700;
   font-size: 3rem;
   @media (max-width: 900px) {
@@ -57,7 +57,7 @@ const Title = styled.div`
   }
 `;
 const Text = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-weight: 500;
   font-size: 17px;
   margin-top: 23px;
diff --git a/src/components/home/track/TrackSection.tsx b/src/components/home/track/TrackSection.tsx
index ee2732a5..57d63ac4 100644
--- a/src/components/home/track/TrackSection.tsx
+++ b/src/components/home/track/TrackSection.tsx
@@ -68,7 +68,7 @@ const TitleText = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 900;
   width: 100%;
@@ -87,7 +87,7 @@ const TitleText = styled.div`
 `;
 
 const Text = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-weight: 500;
   line-height: 2.5rem;
   font-size: 1.7rem;
diff --git a/src/components/mypage/component/ScoreHeader.tsx b/src/components/mypage/component/ScoreHeader.tsx
index 53865e0e..cfad88ed 100644
--- a/src/components/mypage/component/ScoreHeader.tsx
+++ b/src/components/mypage/component/ScoreHeader.tsx
@@ -51,7 +51,7 @@ const ScoreHeader = ({ isAdmin, name }: UserProps) => {
 export default ScoreHeader;
 
 const TitleText = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 700;
   font-size: 1.7rem;
diff --git a/src/components/session/SessionDetailSection.tsx b/src/components/session/SessionDetailSection.tsx
index de0c2d1d..a73d6e4f 100644
--- a/src/components/session/SessionDetailSection.tsx
+++ b/src/components/session/SessionDetailSection.tsx
@@ -74,7 +74,7 @@ const RightWrapper = styled.div`
 `;
 
 const TitleText = styled.div`
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 900;
   font-size: 2.3rem;
diff --git a/src/components/session/Track.tsx b/src/components/session/Track.tsx
index f0da165e..1621bf92 100644
--- a/src/components/session/Track.tsx
+++ b/src/components/session/Track.tsx
@@ -35,11 +35,9 @@ const Track = ({ track, trackData }: TrackProps) => {
     <>
       <StWrapper>
         <TrackTitle>{track}</TrackTitle>
-        {trackData.length &&
-          <StShowAll onClick={handleOpen}>전체보기 &gt;</StShowAll>}
+        {trackData.length && <StShowAll onClick={handleOpen}>전체보기 &gt;</StShowAll>}
       </StWrapper>
-      {visible &&
-        <SessionModal trackData={trackData} trackName={track} handleClose={handleClose} />}
+      {visible && <SessionModal trackData={trackData} trackName={track} handleClose={handleClose} />}
     </>
   );
 };
@@ -48,7 +46,7 @@ export default Track;
 
 const StWrapper = styled.div`
   display: flex;
-  font-family: 'GmarketSans';
+  font-family: 'Gmarket Sans';
   justify-content: space-between;
   align-items: center;
   width: 100%;
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
index aea3f046..28805ee7 100644
--- a/src/pages/_document.tsx
+++ b/src/pages/_document.tsx
@@ -33,7 +33,10 @@ export default class MyDocument extends Document {
             href="https://fonts.googleapis.com/css2?family=Inter:wght@400;900;500;600;700;800&display=swap"
             rel="stylesheet"
           />
-          <link href="https://webfontworld.github.io/gmarket/GmarketSans.css" rel="stylesheet" />
+          <link
+            href="https://cdn.jsdelivr.net/gh/leetaewook/gmarket-sans-dynamic-subset/GmarketSans.css"
+            rel="stylesheet"
+          />
           <link
             rel="stylesheet"
             type="text/css"
diff --git a/src/pages/signup/index.tsx b/src/pages/signup/index.tsx
index 9b65bce6..3a7cf366 100644
--- a/src/pages/signup/index.tsx
+++ b/src/pages/signup/index.tsx
@@ -6,51 +6,48 @@ import { useRecoilValue } from 'recoil';
 import { token } from '@utils/state';
 
 const SignUp = () => {
-    const router = useRouter();
-    const tokenState = useRecoilValue(token);
-    const [isLogin, setIsLogin] = useState(false);
-
-    useEffect(() => {
-        if (tokenState.access) {
-            setIsLogin(true);
-            router.push('/');
-        }
-    }, [tokenState]);
-
-    return (
-        <Wrapper>
-            <TitleText>회원정보 입력</TitleText>
-            <SmallText>CAU LIKELION 에 방문하신 것을 환영합니다!</SmallText>
-            <SmallText>회원정보 입력 후 활동을 시작해보세요.</SmallText>
-            <SignUpFormSection />
-        </Wrapper>
-    );
+  const router = useRouter();
+  const tokenState = useRecoilValue(token);
+  const [isLogin, setIsLogin] = useState(false);
+
+  useEffect(() => {
+    if (tokenState.access) {
+      setIsLogin(true);
+      router.push('/');
+    }
+  }, [tokenState]);
+
+  return (
+    <Wrapper>
+      <TitleText>회원정보 입력</TitleText>
+      <SmallText>CAU LIKELION 에 방문하신 것을 환영합니다!</SmallText>
+      <SmallText>회원정보 입력 후 활동을 시작해보세요.</SmallText>
+      <SignUpFormSection />
+    </Wrapper>
+  );
 };
 
 export default SignUp;
 
-
 const Wrapper = styled.div`
-    display: flex;
-    flex-direction: column;
+  display: flex;
+  flex-direction: column;
 `;
 
 const TitleText = styled.div`
-    font-family: 'GmarketSans';
-    font-style: normal;
-    font-weight: 900;
-    font-size: 2.5rem;
-    text-align: center;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin-bottom: 15px;
+  font-family: 'Gmarket Sans';
+  font-style: normal;
+  font-weight: 900;
+  font-size: 2.5rem;
+  text-align: center;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-bottom: 15px;
 `;
 
 const SmallText = styled(TitleText)`
-    font-size: 1.4rem;
-    font-weight: 500;
-    margin-bottom: 5px;
+  font-size: 1.4rem;
+  font-weight: 500;
+  margin-bottom: 5px;
 `;
-
-