[For You] 부분 처리건

1. 홈배너 노출부분.
	2. 롤링배너에 노출시에 아이템 갯수별로 노출시 스타일 피그마랑 맞춤.
	3. 저스트포유패널생성및 연결
		- 피그마에는 따로 사이드바가 보이지않아 이부분은 월요일에 물어보고 처리해야할것같습니다.
		- 디자인만 우선 넣어둠.(좌우 스크롤이 정상작동하지않음)
		- 상품 컴포넌트 분리 필요
		- 첫번째 타이틀이 흰색으로 처리되어있는데 이부분 스크롤시에 어떤식으로 생각하고 한부분인지 물어보고 처리필요.

com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx

@@ -1,46 +1,60 @@
 // src/views/HomePanel/HomeBanner/HomeBanner.jsx
 
-import React, { useCallback, useEffect, useMemo, useState } from "react";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+} from 'react';
 
-import { useDispatch, useSelector } from "react-redux";
-import Spotlight from "@enact/spotlight";
-import { SpotlightContainerDecorator } from "@enact/spotlight/SpotlightContainerDecorator";
-import Spottable from "@enact/spotlight/Spottable";
-import { $L } from "../../../utils/helperMethods";
 import {
-  setDefaultFocus,
-  // setShowPopup,
-  fetchCurrentUserHomeTerms,
-} from "../../../actions/homeActions";
+  useDispatch,
+  useSelector,
+} from 'react-redux';
+
+import Spotlight from '@enact/spotlight';
+import {
+  SpotlightContainerDecorator,
+} from '@enact/spotlight/SpotlightContainerDecorator';
+import Spottable from '@enact/spotlight/Spottable';
+
 import {
   changeAppStatus,
-  setOptionalTermsPopupShown,
-  setOptionalTermsUserDecision,
   handleOptionalTermsAgree as handleOptionalTermsAgreeAction,
   handleOptionalTermsDecline,
+  setOptionalTermsPopupShown,
+  setOptionalTermsUserDecision,
   updateOptionalTermsAgreement,
-} from "../../../actions/commonActions";
-import { setMyPageTermsAgree } from "../../../actions/myPageActions";
-import { pushPanel, popPanel } from "../../../actions/panelActions";
-import { panel_names } from "../../../utils/Config";
+} from '../../../actions/commonActions';
+import {
+  fetchCurrentUserHomeTerms,
+  setDefaultFocus,
+} from '../../../actions/homeActions';
+import { setMyPageTermsAgree } from '../../../actions/myPageActions';
+import {
+  popPanel,
+  pushPanel,
+} from '../../../actions/panelActions';
 import {
-  startVideoPlayer,
-  requestPlayControl,
   releasePlayControl,
-} from "../../../actions/playActions";
-import CustomImage from "../../../components/CustomImage/CustomImage";
-import css from "./HomeBanner.module.less";
-import Random from "./RandomUnit";
-import Rolling from "./RollingUnit";
-import TNewPopUp from "../../../components/TPopUp/TNewPopUp";
+  requestPlayControl,
+  startVideoPlayer,
+} from '../../../actions/playActions';
+import CustomImage from '../../../components/CustomImage/CustomImage';
 // import TButtonScroller from "../../../components/TButtonScroller/TButtonScroller";
-import OptionalConfirm from "../../../components/Optional/OptionalConfirm";
+import OptionalConfirm from '../../../components/Optional/OptionalConfirm';
+import TNewPopUp from '../../../components/TPopUp/TNewPopUp';
+import { panel_names } from '../../../utils/Config';
+import { $L } from '../../../utils/helperMethods';
+import css from './HomeBanner.module.less';
 // import * as Config from "../../../utils/Config";
-
 // 새로운 비디오 유닛 컴포넌트 임포트
-import PersistentVideoUnit from "./PersistentVideoUnit";
-import RandomUnitNew from "./RandomUnit.new";
-import SimpleVideoContainer from "./SimpleVideoContainer";
+import PersistentVideoUnit from './PersistentVideoUnit';
+import JustForSwitchBanner from './RandomBannerType/JustForYouBanner';
+import Random from './RandomUnit';
+import RandomUnitNew from './RandomUnit.new';
+import Rolling from './RollingUnit';
+import SimpleVideoContainer from './SimpleVideoContainer';
 
 const SpottableComponent = Spottable("div");
 const Container = SpotlightContainerDecorator(
@@ -647,7 +661,20 @@ export default function HomeBanner({
               {renderItem(1, true)}
             </ContainerBasic>
             {renderItem(2, false)}
-            {renderItem(3, false)}
+            {/* //NOTE - 약관 동의 여부 & 추후 API 따라 팝업 표시 여부 결정 */}
+            {introTermsAgree ? (
+              <div className={css.imgBox}>
+                <JustForSwitchBanner
+                  renderItem={renderItem}
+                  handleShelfFocus={_handleShelfFocus}
+                  handleItemFocus={_handleItemFocus}
+                  isHorizontal={false}
+                  spotlightId={"banner3"}
+                />
+              </div>
+            ) : (
+              renderItem(3, false)
+            )}
           </>
         );
       }