diff --git a/src/features/learn/ui/styles.ts b/src/features/learn/ui/styles.ts
index ee8fad6..73d09f2 100644
--- a/src/features/learn/ui/styles.ts
+++ b/src/features/learn/ui/styles.ts
@@ -8,7 +8,6 @@ export const SectionBoxWrapper = styled.div`
   align-items: center;
   justify-content: space-between;
   width: 100%;
-  margin-top: 45px;
 
   ${media.mobile} {
     margin-top: 65px;
diff --git a/src/pages/learn/Learn.tsx b/src/pages/learn/Learn.tsx
index 975a208..85b1924 100644
--- a/src/pages/learn/Learn.tsx
+++ b/src/pages/learn/Learn.tsx
@@ -77,7 +77,10 @@ export default function Learn() {
             />
           </S.ProgressBarWrapper>
         )}
-        <S.ScrollableContainer $show={showComponents}>
+        <S.ScrollableContainer
+          $show={showComponents}
+          $isLoggedIn={isLoggedIn(user)}
+        >
           <SelectSection />
         </S.ScrollableContainer>
         <SectionGroup>
diff --git a/src/pages/learn/styles.ts b/src/pages/learn/styles.ts
index 4997b59..1d13d4f 100644
--- a/src/pages/learn/styles.ts
+++ b/src/pages/learn/styles.ts
@@ -3,6 +3,7 @@ import { media } from '@style/media';
 
 interface ScrollableContainerProps {
   $show: boolean;
+  $isLoggedIn: boolean;
 }
 
 export const ScrollableContainer = styled.div<ScrollableContainerProps>`
@@ -14,6 +15,11 @@ export const ScrollableContainer = styled.div<ScrollableContainerProps>`
   flex-direction: column;
   justify-content: center;
   align-items: center;
+  margin-top: ${({ $isLoggedIn }) => ($isLoggedIn ? '45px' : '25px')};
+
+  ${media.mobile} {
+    margin-top: ${({ $isLoggedIn }) => ($isLoggedIn ? '0' : '-20px')};
+  }
 `;
 
 export const SectionGroup = styled.div`