diff --git a/com.twin.app.shoptime/src/components/Optional/OptionalConfirm.jsx b/com.twin.app.shoptime/src/components/Optional/OptionalConfirm.jsx
index 27be4a9d..8e41fa0a 100644
--- a/com.twin.app.shoptime/src/components/Optional/OptionalConfirm.jsx
+++ b/com.twin.app.shoptime/src/components/Optional/OptionalConfirm.jsx
@@ -1,5 +1,7 @@
 import React from 'react';
+
 import PropTypes from 'prop-types';
+
 import TNewPopUp from '../TPopUp/TNewPopUp'; // TNewPopUp 컴포넌트의 정확한 경로를 확인해주세요.
 import css from './OptionalConfirm.module.less';
 
@@ -16,7 +18,7 @@ const OptionalConfirm = ({
   onOptionalTermsClick, // 약관 자세히 보기 버튼 클릭 핸들러
   onOptionalAgreeClick,   // 동의 버튼 클릭 핸들러
   onOptionalDeclineClick, // 거절 또는 다음에 하기 버튼 클릭 핸들러
-  customPosition,  
+  customPosition,
   position,
 }) => {
   return (
@@ -31,7 +33,7 @@ const OptionalConfirm = ({
       onOptionalAgreeClick={onOptionalAgreeClick}
       onOptionalDeclineClick={onOptionalDeclineClick}
       customPosition={customPosition}
-      position={position}  
+      position={position}
     />
   );
 };
diff --git a/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirm.jsx b/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirm.jsx
index 724b061a..3b4c0670 100644
--- a/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirm.jsx
+++ b/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirm.jsx
@@ -1,14 +1,26 @@
 // src/components/Optional/OptionalTermsConfirm.jsx
 
-import React, { useEffect, useCallback, useState } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import TPopUp from '../TPopUp/TPopUp';
-import TButton from '../TButton/TButton';
-import TCheckBoxSquare from '../TCheckBox/TCheckBoxSquare';
-import TButtonScroller from '../TButtonScroller/TButtonScroller';
-import { $L, scaleH, scaleW } from '../../utils/helperMethods';
+import React, {
+  useCallback,
+  useState,
+} from 'react';
+
+import {
+  useDispatch,
+  useSelector,
+} from 'react-redux';
+
 import { setHidePopup } from '../../actions/commonActions';
 import { setMyPageTermsAgree } from '../../actions/myPageActions';
+import {
+  $L,
+  scaleH,
+  scaleW,
+} from '../../utils/helperMethods';
+import TButton from '../TButton/TButton';
+import TButtonScroller from '../TButtonScroller/TButtonScroller';
+import TCheckBoxSquare from '../TCheckBox/TCheckBoxSquare';
+import TPopUp from '../TPopUp/TPopUp';
 import css from './OptionalTermsConfirm.module.less';
 
 const OptionalTermsConfirm = ({ open }) => {
@@ -17,9 +29,8 @@ const OptionalTermsConfirm = ({ open }) => {
   const [isChecked, setIsChecked] = useState(false);
   const [isTermsPopupVisible, setIsTermsPopupVisible] = useState(false);
   const [isWarningPopupVisible, setIsWarningPopupVisible] = useState(false);
- 
 
-  const optionalTermsData = useSelector((state) => 
+  const optionalTermsData = useSelector((state) =>
     state.home.termsData?.data?.terms.find(term => term.trmsTpCd === "MST00405")
   );
 
@@ -46,7 +57,7 @@ const OptionalTermsConfirm = ({ open }) => {
     if (isChecked) {
       // 약관 동의할 항목들 (string array)
       const termsList = ["TID0000222", "TID0000223", "TID0000232"];
-    
+
       // 동의하지 않을 항목들 (빈 배열)
       const notTermsList = [];
 
@@ -67,15 +78,15 @@ const OptionalTermsConfirm = ({ open }) => {
       setIsWarningPopupVisible(true);
     }
   }, [isChecked, dispatch]);
-  
+
   const handleCloseWarningPopup = useCallback(() => {
     setIsWarningPopupVisible(false);
   }, []);
 
-  const handleDontAskAgain = () => {
+  const handleDontAskAgain = useCallback(() => {
     console.log("Don't Ask Again 처리 필요");
     dispatch(setHidePopup());
-  };
+  },[dispatch]);
 
   if (isTermsPopupVisible) {
     return (
@@ -144,7 +155,7 @@ const OptionalTermsConfirm = ({ open }) => {
         <div className={css.mainContent}>
           <div className={css.checkboxSection}>
             <div className={css.checkboxArea}>
-              <TCheckBoxSquare 
+              <TCheckBoxSquare
                 selected={isChecked}
                 onToggle={handleCheckboxToggle}
                 spotlightId="optional-checkbox"
@@ -157,34 +168,34 @@ const OptionalTermsConfirm = ({ open }) => {
                 type="terms"
                 ariaLabel={$L("View Optional Terms")}
               >
-                <div className={css.termTitle}>Optional Terms</div>                
+                <div className={css.termTitle}>Optional Terms</div>
               </TButton>
             </div>
           </div>
-          
+
           <div className={css.descriptionSection}>
             <div className={css.description}>
               Get recommendations, special offers, and ads tailored just for you.
             </div>
           </div>
-          
+
           <div className={css.buttonSection}>
             <div className={css.buttonGroup}>
-              <TButton 
+              <TButton
                 onClick={handleAgree}
                 spotlightId="agree-button"
                 className={css.agreeButton}
               >
                 {$L('Agree')}
               </TButton>
-              <TButton 
+              <TButton
                 onClick={handleMainPopupClose}
                 spotlightId="not-now-button"
                 className={css.notNowButton}
               >
                 {$L('Not Now')}
               </TButton>
-              <TButton 
+              <TButton
                 onClick={handleDontAskAgain}
                 spotlightId="dont-ask-button"
                 className={css.dontAskButton}
diff --git a/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirmBottom.jsx b/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirmBottom.jsx
index bb2ab09f..ac639976 100644
--- a/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirmBottom.jsx
+++ b/com.twin.app.shoptime/src/components/Optional/OptionalTermsConfirmBottom.jsx
@@ -1,17 +1,28 @@
 // src/components/Optional/OptionalTermsConfirm.jsx
 
-import React, { useEffect, useCallback, useState } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import TNewPopUp from '../TPopUp/TNewPopUp';
-import TButton from '../TButton/TButton';
-import TCheckBoxSquare from '../TCheckBox/TCheckBoxSquare';
-import TButtonScroller from '../TButtonScroller/TButtonScroller';
-import { $L, scaleH, scaleW } from '../../utils/helperMethods';
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+} from 'react';
+
+import {
+  useDispatch,
+  useSelector,
+} from 'react-redux';
+
+import Spotlight from '@enact/spotlight';
+
 import { setHidePopup } from '../../actions/commonActions';
 import { setMyPageTermsAgree } from '../../actions/myPageActions';
+import {
+  $L,
+  scaleH,
+  scaleW,
+} from '../../utils/helperMethods';
+import TButtonScroller from '../TButtonScroller/TButtonScroller';
+import TNewPopUp from '../TPopUp/TNewPopUp';
 import css from './OptionalTermsConfirmBottom.module.less';
-import cssPopup from '../TPopUp/TNewPopUp.module.less';
-import Spotlight from "@enact/spotlight";
 
 const OptionalTermsConfirm = ({ open }) => {
   const dispatch = useDispatch();
@@ -19,9 +30,9 @@ const OptionalTermsConfirm = ({ open }) => {
   const [isChecked, setIsChecked] = useState(false);
   const [isTermsPopupVisible, setIsTermsPopupVisible] = useState(false);
   const [isWarningPopupVisible, setIsWarningPopupVisible] = useState(false);
- 
 
-  const optionalTermsData = useSelector((state) => 
+
+  const optionalTermsData = useSelector((state) =>
     state.home.termsData?.data?.terms.find(term => term.trmsTpCd === "MST00405")
   );
 
@@ -37,13 +48,13 @@ const OptionalTermsConfirm = ({ open }) => {
     }
   }, [open, isTermsPopupVisible, isWarningPopupVisible]);
 
-  const handleMainPopupClose = useCallback(() => {
-    dispatch(setHidePopup());
-  }, [dispatch]);
+  // const handleMainPopupClose = useCallback(() => {
+  //   dispatch(setHidePopup());
+  // }, [dispatch]);
 
-  const handleCheckboxToggle = useCallback(({ selected }) => {
-    setIsChecked(selected);
-  }, []);
+  // const handleCheckboxToggle = useCallback(({ selected }) => {
+  //   setIsChecked(selected);
+  // }, []);
 
   const handleViewTermsClick = useCallback(() => {
     setIsTermsPopupVisible(true);
@@ -66,20 +77,20 @@ const OptionalTermsConfirm = ({ open }) => {
   const handleAgreeTest = useCallback(() => {
     console.log("handleAgreeTest");
     Spotlight.pause();
-    setIsTermsPopupVisible(false);    
+    setIsTermsPopupVisible(false);
     // 상태 업데이트 후 DOM이 완전히 렌더링될 때까지 기다린 후 포커스
     setTimeout(() => {
       Spotlight.resume();
       Spotlight.focus("optional-terms-confirm-popup");
     }, 500); // 50ms에서 100ms로 증가
-    
+
   }, []);
 
   const handleAgree = useCallback(() => {
     if (isChecked) {
       // 약관 동의할 항목들 (string array)
       const termsList = ["TID0000222", "TID0000223", "TID0000232"];
-    
+
       // 동의하지 않을 항목들 (빈 배열)
       const notTermsList = [];
 
@@ -163,7 +174,7 @@ const OptionalTermsConfirm = ({ open }) => {
   return (
     <TNewPopUp
       kind="optionalConfirm"
-      open={open}      
+      open={open}
       spotlightId="optional-terms-confirm-popup"
       spotlightRestrict="self-only"
       className={css.optionalConfirmPopup}