From 7459fc674e4982965ef4ad1a039c4d2363c8493e Mon Sep 17 00:00:00 2001
From: dongmin0204 <nm2205@dgu.ac.kr>
Date: Tue, 30 Sep 2025 01:17:04 +0900
Subject: [PATCH 1/2] =?UTF-8?q?feat=20:=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?=
 =?UTF-8?q?=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../farminglog/src/pages/game/index.styled.ts | 38 +++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/apps/farminglog/src/pages/game/index.styled.ts b/apps/farminglog/src/pages/game/index.styled.ts
index c2800578..ee9cd97f 100644
--- a/apps/farminglog/src/pages/game/index.styled.ts
+++ b/apps/farminglog/src/pages/game/index.styled.ts
@@ -121,4 +121,42 @@ export const StartButton = styled.button`
     transform: scale(1.05);
     box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
   }
+`;
+
+// 랜딩 페이지용 배경 히어로 
+export const LandingHero = styled.div<{
+  $bgDesktop: string;
+  $bgMobile?: string;
+}>`
+  width: 100%;
+  height: 59760px;
+
+
+  background: ${({ $bgDesktop }) => `url(${$bgDesktop}) center / cover no-repeat`};
+
+
+  // 모바일에선 잘모르겠음 일단 때리쳐!
+  @media (max-width: 768px) {
+    aspect-ratio: 750 / 2237;
+    background-image: ${({ $bgDesktop, $bgMobile }) =>
+      `url(${($bgMobile && $bgMobile.length > 0) ? $bgMobile : $bgDesktop})`};
+    background-size: cover;
+    background-position: center;
+  }
+`;
+
+export const UpButton = styled.div`
+  position: fixed;
+  bottom: 100px;
+  right: 100px;
+  width: 150px;
+  height: 150px;
+  border-radius: 50%;
+  cursor: pointer;
+`;
+
+export const UpButtonImage = styled.img`
+  width: 150px;
+  height: 150px;
+  object-fit: fill;
 `;
\ No newline at end of file

From 7908d71b193afe63dbe29d03078b6282b73ca9cb Mon Sep 17 00:00:00 2001
From: dongmin0204 <nm2205@dgu.ac.kr>
Date: Tue, 30 Sep 2025 01:17:16 +0900
Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?=
 =?UTF-8?q?=EB=93=B1=EB=A1=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/farminglog/src/pages/game/index.tsx | 32 +++++++++++++++++++++---
 1 file changed, 29 insertions(+), 3 deletions(-)

diff --git a/apps/farminglog/src/pages/game/index.tsx b/apps/farminglog/src/pages/game/index.tsx
index 92d41b93..d2bfb01a 100644
--- a/apps/farminglog/src/pages/game/index.tsx
+++ b/apps/farminglog/src/pages/game/index.tsx
@@ -1,17 +1,28 @@
 import React, { useState } from 'react'; // useState를 import 합니다.
 import { UnityWebGL } from '../../components/UnityWebGL';
-import { GameContainer, GameTitle, StartButton, StartContainer } from './index.styled.ts';
+import useMediaQueries from "@/hooks/useMediaQueries";
+import { GameContainer, StartButton, StartContainer, LandingHero, UpButton, UpButtonImage } from './index.styled.ts';
+
 
 const Game: React.FC = () => {
   const [isGameStarted, setIsGameStarted] = useState(false);
-
+  const [isLanding, setIsLanding] = useState(true);
+  const { isMobile } = useMediaQueries();
+  const landingImage = 'https://farmsystem-bucket.s3.ap-northeast-2.amazonaws.com/game/DetailGameLanding.png';
+  const upButtonImage = 'https://farmsystem-bucket.s3.ap-northeast-2.amazonaws.com/game/UpGameButton.png';
   const handleStartGame = () => {
     setIsGameStarted(true); 
   };
+  const handleScrollTop = () => {
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+  };
 
   return (
+    <div
+      style={{ backgroundColor: '#46D77C' }}
+    >
     <GameContainer>
-      <GameTitle>🌱 Grow My Farm</GameTitle>
+
       
       {/** isGameStarted 값에 따라 조건부로 렌더링. */}
       {isGameStarted ? (
@@ -27,6 +38,21 @@ const Game: React.FC = () => {
         </StartContainer>
       )}
     </GameContainer>
+
+    {!isMobile && (
+    <LandingHero
+      $bgDesktop={landingImage}
+      $bgMobile={landingImage}
+      onClick={() => setIsLanding(false)}
+    >
+    </LandingHero>
+    )}
+    {( !isMobile && isLanding &&  
+    <UpButton onClick={handleScrollTop}  title="맨 위로">
+      <UpButtonImage src={upButtonImage} alt="Up Button" />
+      </UpButton>)}
+  
+    </div>
   );
 };