diff --git a/src/layouts/Layout.tsx b/src/layouts/Layout.tsx
index e50a051..3875beb 100644
--- a/src/layouts/Layout.tsx
+++ b/src/layouts/Layout.tsx
@@ -63,10 +63,10 @@ const Layout = () => {
 
   const hideBottomBar = isLogin || isSignup || isCertification || isCertificationGuide || isCertificationShoot || isCertificationSuccess || isCertificationFail || isImageSearch || isProblemSearch || isMyContribution || isAllContribution || isDisposalInfoFail || isDisposalInfoDetail || isCamera || isDisposalInfo || isReward || isCommunityDetail || isMyPosts || isMycomments || isMyProfileEdit || isMyfavorites || isMyhistory || isCommunityWrite || isCommunityModify;
 
-  const hasGreenBackground = isGuide || isCertification || isCertificationGuide || isCertificationShoot || isCertificationSuccess || isDisposalInfo || isDisposalInfoDetail || isImageSearch || isProblemSearch || isDisposalInfoFail || isCamera || isAllContribution || isReward || isCommunityMain || isCommunityWrite || isCommunityModify || isCommunityDetail || isMyContribution;
+  const hasGreenBackground = isGuide || isCertification || isCertificationGuide || isCertificationShoot || isCertificationSuccess || isDisposalInfo || isDisposalInfoDetail || isImageSearch || isProblemSearch || isDisposalInfoFail || isCamera || isCommunityMain || isCommunityWrite || isCommunityModify || isCommunityDetail;
 
   return (
-    <div className={`flex flex-1 flex-col min-h-screen ${hasGreenBackground ? 'bg-bg-green1' : 'bg-white'}`}>
+    <div className={`flex flex-1 flex-col min-h-screen ${hasGreenBackground ? 'bg-bg-green1' : 'bg-bg-my'}`}>
       <div className='flex mx-auto min-h-screen w-full max-w-120'>
         {isGuide && <TopBar title='이용 가이드' bgColor='bg-bg-green1' />}
 
@@ -91,17 +91,17 @@ const Layout = () => {
         {isMyhistory && <TopBar title='리워드 사용내역' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
         {isMycomments && <TopBar title='작성한 댓글' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
 
-        {isReward && <TopBar title='리워드 적립' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardHistory && <TopBar title='리워드 내역' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardStore && <TopBar title='리워드 상점' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardProdocts && <TopBar title='제품 정보' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardCheckout && <TopBar title='포인트 사용' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardAddressList && <TopBar title='배송지 목록' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardAddressSearch && <TopBar title='배송지 입력' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isRewardAddressEdit && <TopBar title='배송지 입력' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-
-        {isMyContribution && <TopBar title='나의 기여도' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
-        {isAllContribution && <TopBar title='전체 기여도' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-green1' />}
+        {isReward && <TopBar title='리워드 적립' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardHistory && <TopBar title='리워드 내역' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardStore && <TopBar title='리워드 상점' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardProdocts && <TopBar title='제품 정보' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardCheckout && <TopBar title='포인트 사용' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardAddressList && <TopBar title='배송지 목록' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardAddressSearch && <TopBar title='배송지 입력' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isRewardAddressEdit && <TopBar title='배송지 입력' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+
+        {isMyContribution && <TopBar title='나의 기여도' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
+        {isAllContribution && <TopBar title='전체 기여도' leftIcon rightIcon={Home} onClick={() => navigate('/')} bgColor='bg-bg-my' />}
 
         <div className={`mx-auto flex w-full max-w-120 flex-col ${hideTopBar ? 'min-h-dvh' : 'pt-14'}`}>
           <main className='flex flex-1 flex-col'>
diff --git a/src/pages/all-contribution-page.tsx b/src/pages/all-contribution-page.tsx
index d944908..316fbfa 100644
--- a/src/pages/all-contribution-page.tsx
+++ b/src/pages/all-contribution-page.tsx
@@ -104,7 +104,7 @@ export default function AllContributionPage() {
 
   if (isPending) {
     return (
-      <div className='flex min-h-[calc(100dvh-56px)] items-center justify-center bg-bg-green1'>
+      <div className='flex min-h-[calc(100dvh-56px)] items-center justify-center bg-[#F9FBFB]'>
         <LoadingSpinner />
       </div>
     );
@@ -112,7 +112,7 @@ export default function AllContributionPage() {
 
   if (isError) {
     return (
-      <div className='flex min-h-[calc(100dvh-56px)] flex-col items-center justify-center gap-4 bg-bg-green1 px-5 text-center'>
+      <div className='flex min-h-[calc(100dvh-56px)] flex-col items-center justify-center gap-4 bg-[#F9FBFB] px-5 text-center'>
         <p className='text-base font-semibold text-text'>
           전체 기여도를 불러오지 못했어요.
         </p>
@@ -131,7 +131,7 @@ export default function AllContributionPage() {
   const feeds = data.pages.flatMap((page) => page.feeds);
 
   return (
-    <div className='min-h-[calc(100dvh-56px)] bg-bg-green1'>
+    <div className='min-h-[calc(100dvh-56px)] bg-[#F9FBFB]'>
       <div className='px-5 py-6'>
         <UserCountBanner
           userCount={firstPage.totalParticipantCount}
diff --git a/src/pages/home-page.tsx b/src/pages/home-page.tsx
index 143bc6f..a2a5084 100644
--- a/src/pages/home-page.tsx
+++ b/src/pages/home-page.tsx
@@ -94,7 +94,7 @@ export default function HomePage() {
   };
 
   return (
-    <div className='min-h-screen bg-bg-green1 pb-32 font-pretendard text-text'>
+    <div className='min-h-screen bg-[#F9FBFB] pb-32 font-pretendard text-text'>
       <main className='px-5 pb-8 pt-4'>
         {/* 홈 상단 인사말과 로그아웃 진입 버튼입니다. */}
         <header className='flex items-start justify-between'>
diff --git a/src/pages/my-contribution-page.tsx b/src/pages/my-contribution-page.tsx
index 2d21c0a..78f2434 100644
--- a/src/pages/my-contribution-page.tsx
+++ b/src/pages/my-contribution-page.tsx
@@ -46,7 +46,7 @@ export default function MyContributionPage() {
   }
 
   return (
-    <div className='min-h-screen bg-[#F4FFF8] pt-14'>
+    <div className='min-h-screen bg-[#F9FBFB] pt-14'>
       <section>
         <div className='px-5 py-6'>
           <h2 className='text-[20px] font-bold leading-[1.35] text-text'>
diff --git a/src/pages/my-page/reward-use-history-page.tsx b/src/pages/my-page/reward-use-history-page.tsx
index 4e9b2a6..b562732 100644
--- a/src/pages/my-page/reward-use-history-page.tsx
+++ b/src/pages/my-page/reward-use-history-page.tsx
@@ -160,7 +160,7 @@ const RewardUseHistoryPage = () => {
 
   if (isPending) {
     return (
-      <div className='flex min-h-screen items-center justify-center bg-bg-my'>
+      <div className='flex min-h-screen items-center justify-center bg-[#F9FBFB]'>
         <LoadingSpinner />
       </div>
     );
@@ -168,14 +168,14 @@ const RewardUseHistoryPage = () => {
 
   if (isError) {
     return (
-      <div className='flex min-h-screen items-center justify-center bg-bg-my'>
+      <div className='flex min-h-screen items-center justify-center bg-[#F9FBFB]'>
         리워드 사용 내역을 불러오지 못했어요.
       </div>
     );
   }
 
   return (
-    <div className='min-h-screen bg-bg-my'>
+    <div className='min-h-screen bg-[#F9FBFB]'>
       <main className='px-5 pb-[40px] pt-[60px]'>
         {rewardUseHistory.length > 0 ? (
           <ul className='flex flex-col gap-[10px]'>
@@ -250,4 +250,4 @@ const RewardUseHistoryPage = () => {
   );
 };
 
-export default RewardUseHistoryPage;
\ No newline at end of file
+export default RewardUseHistoryPage;
diff --git a/src/pages/reward-page/reward-address-complete-page.tsx b/src/pages/reward-page/reward-address-complete-page.tsx
index 7feecaa..6b0bb5b 100644
--- a/src/pages/reward-page/reward-address-complete-page.tsx
+++ b/src/pages/reward-page/reward-address-complete-page.tsx
@@ -15,7 +15,7 @@ export default function RewardAddressCompletePage() {
   }
 
   return (
-    <div className='flex flex-1 flex-col bg-bg-green1 px-5 pb-6 font-pretendard text-text'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 font-pretendard text-text'>
       <div className='flex flex-1 flex-col items-center justify-center text-center'>
         <img
           src={FullCheck}
diff --git a/src/pages/reward-page/reward-address-detail-page.tsx b/src/pages/reward-page/reward-address-detail-page.tsx
index 095f023..1acb14b 100644
--- a/src/pages/reward-page/reward-address-detail-page.tsx
+++ b/src/pages/reward-page/reward-address-detail-page.tsx
@@ -123,7 +123,7 @@ function RewardAddressDetailForm({
   const inputClassName = 'mt-2 h-12 w-full rounded-[20px] border border-gray-200 bg-white px-6 text-[15px] font-medium text-text outline-none placeholder:text-gray-400 focus:border-main-green1';
 
   return (
-    <div className='flex flex-1 flex-col bg-gray-50 px-5 pb-7 font-pretendard'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-7 font-pretendard'>
       <form className='flex flex-1 flex-col pt-4' onSubmit={handleSubmit}>
         <h1 className='text-lg font-bold text-text'>상세정보를 입력해주세요</h1>
 
@@ -239,7 +239,7 @@ export default function RewardAddressDetailPage() {
 
   if (isEditMode && isAddressListPending) {
     return (
-      <div className='flex flex-1 items-center justify-center bg-gray-50'>
+      <div className='flex flex-1 items-center justify-center bg-[#F9FBFB]'>
         <LoadingSpinner />
       </div>
     );
diff --git a/src/pages/reward-page/reward-address-list-page.tsx b/src/pages/reward-page/reward-address-list-page.tsx
index a2be322..5bc455e 100644
--- a/src/pages/reward-page/reward-address-list-page.tsx
+++ b/src/pages/reward-page/reward-address-list-page.tsx
@@ -54,7 +54,7 @@ export default function RewardAddressListPage() {
 
   if (isPending) {
     return (
-      <div className='flex flex-1 items-center justify-center bg-bg-green1'>
+      <div className='flex flex-1 items-center justify-center bg-[#F9FBFB]'>
         <LoadingSpinner />
       </div>
     );
@@ -62,7 +62,7 @@ export default function RewardAddressListPage() {
 
   if (isError || !addressList) {
     return (
-      <div className='flex flex-1 flex-col bg-bg-green1 px-4 pb-8 font-pretendard'>
+      <div className='flex flex-1 flex-col bg-[#F9FBFB] px-4 pb-8 font-pretendard'>
         <FailInfo
           title='배송지 목록을 불러오지 못했어요.'
           content='잠시 후 다시 시도해 주세요.'
@@ -72,7 +72,7 @@ export default function RewardAddressListPage() {
   }
 
   return (
-    <div className='flex flex-1 flex-col bg-bg-green1 px-4 pb-8 font-pretendard'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-4 pb-8 font-pretendard'>
       <button type='button' onClick={() => navigate('/reward/address-search')} className='mx-4 mt-4 flex h-16 w-[calc(100%-2rem)] items-center justify-center gap-3 rounded-[22px] border border-dashed border-main-green1 bg-bg-green2 font-pretendard text-base font-bold text-main-green1'>
         <span aria-hidden='true' className='text-[30px] font-light leading-none'>
           +
diff --git a/src/pages/reward-page/reward-address-search-page.tsx b/src/pages/reward-page/reward-address-search-page.tsx
index d8c361e..9f4807c 100644
--- a/src/pages/reward-page/reward-address-search-page.tsx
+++ b/src/pages/reward-page/reward-address-search-page.tsx
@@ -45,7 +45,7 @@ export default function RewardAddressSearchPage() {
   };
 
   return (
-    <div className='flex flex-1 flex-col bg-bg-green1 px-4 pb-8 font-pretendard'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-4 pb-8 font-pretendard'>
       <h1 className='mt-4 text-xl font-semibold text-black'>주소를 검색해주세요</h1>
 
       <form className='mt-4 flex items-center gap-3' onSubmit={handleSearch}>
diff --git a/src/pages/reward-page/reward-product-detail-page.tsx b/src/pages/reward-page/reward-product-detail-page.tsx
index d9b0b21..d50a941 100644
--- a/src/pages/reward-page/reward-product-detail-page.tsx
+++ b/src/pages/reward-page/reward-product-detail-page.tsx
@@ -27,7 +27,7 @@ export default function RewardProductDetailPage() {
     product.status !== 'ACTIVE';
 
   return (
-    <div className='flex flex-1 flex-col bg-white px-5 pb-6 pt-4 font-pretendard'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 pt-4 font-pretendard'>
       {!isValidProductId ? (
         <FailInfo
           title='제품을 찾을 수 없어요.'
diff --git a/src/pages/reward-page/reward-purchase-page.tsx b/src/pages/reward-page/reward-purchase-page.tsx
index 7051439..36d39de 100644
--- a/src/pages/reward-page/reward-purchase-page.tsx
+++ b/src/pages/reward-page/reward-purchase-page.tsx
@@ -193,7 +193,7 @@ export default function RewardCheckoutPage() {
     (isPartnerProduct && isAddressError)
   ) {
     return (
-      <div className='flex flex-1 flex-col bg-white px-5 pb-6 pt-4 font-pretendard'>
+      <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 pt-4 font-pretendard'>
         <FailInfo
           title='제품을 불러오지 못했어요.'
           content='제품 번호를 확인한 후 다시 시도해 주세요.'
@@ -208,7 +208,7 @@ export default function RewardCheckoutPage() {
     (isPartnerProduct && isAddressPending)
   ) {
     return (
-      <div className='flex flex-1 items-center justify-center bg-white'>
+      <div className='flex flex-1 items-center justify-center bg-[#F9FBFB]'>
         <LoadingSpinner />
       </div>
     );
@@ -216,7 +216,7 @@ export default function RewardCheckoutPage() {
 
   if (!productDetail || !rewardPoints) {
     return (
-      <div className='flex flex-1 flex-col bg-white px-5 pb-6 pt-4 font-pretendard'>
+      <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 pt-4 font-pretendard'>
         <FailInfo
           title='제품을 찾을 수 없어요.'
           content='잠시 후 다시 시도해 주세요.'
@@ -236,7 +236,7 @@ export default function RewardCheckoutPage() {
     (isPartner ? !selectedShippingAddress : !hasGifticonRecipient);
 
   return (
-    <div className='flex flex-1 flex-col bg-bg-green1 px-5 pb-6 pt-4 font-pretendard'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 pt-4 font-pretendard'>
       <h1 className='text-lg font-bold text-text'>제품 내역</h1>
       <div className='mt-3 flex min-h-27 items-center gap-4 rounded-[28px] bg-white px-5 py-[18px]'>
         <div className='flex h-[70px] w-[70px] shrink-0 items-center justify-center overflow-hidden rounded-xl bg-gray-100'>
diff --git a/src/pages/reward-page/reward-use-complete-page.tsx b/src/pages/reward-page/reward-use-complete-page.tsx
index 4e94abe..9e2dc80 100644
--- a/src/pages/reward-page/reward-use-complete-page.tsx
+++ b/src/pages/reward-page/reward-use-complete-page.tsx
@@ -41,7 +41,7 @@ export default function RewardUseCompletePage() {
 
   if (!locationProductType && isPending) {
     return (
-      <div className='flex flex-1 items-center justify-center bg-bg-green1'>
+      <div className='flex flex-1 items-center justify-center bg-[#F9FBFB]'>
         <LoadingSpinner />
       </div>
     );
@@ -49,7 +49,7 @@ export default function RewardUseCompletePage() {
 
   if (!rewardProductType || isError) {
     return (
-      <div className='flex flex-1 flex-col bg-bg-green1 px-5 pb-6 font-pretendard'>
+      <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 font-pretendard'>
         <FailInfo
           title='완료 정보를 불러오지 못했어요.'
           content='리워드 스토어에서 사용 내역을 확인해 주세요.'
@@ -69,7 +69,7 @@ export default function RewardUseCompletePage() {
     rewardProductType === 'PARTNER_BRAND' ? '배송지' : '번호';
 
   return (
-    <div className='flex flex-1 flex-col bg-bg-green1 px-5 pb-6 font-pretendard text-text'>
+    <div className='flex flex-1 flex-col bg-[#F9FBFB] px-5 pb-6 font-pretendard text-text'>
       <div className='flex flex-1 flex-col items-center justify-center text-center'>
         <img
           src={FullCheck}