diff --git a/README.md b/README.md
index acf4857..e8e6bc7 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,5 @@
 # NET ZERO-FitFit_FE
+![alt text](image.png)
 
 <br />
 
@@ -50,197 +51,195 @@
 
 <br />
 
-## 📂 Project structure
-```
 ## 📂 Project structure
 ```
 src
-├── api                                 # API 요청 함수 모음
-│   ├── authApi.js                      # 인증 관련 API (로그인, 회원가입 등)
-│   ├── chatApi.js                      # 채팅 관련 API (메시지 전송, 조회)
-│   ├── chatbotApi.js                   # 챗봇 관련 API
-│   ├── clothesApi.js                   # 의류 관련 API (상품 등록, 조회)
-│   ├── common.js                       # 공통 API 설정 및 함수
-│   ├── fittingApi.js                   # 가상 피팅 관련 API
-│   ├── memberApi.js                    # 회원 정보 관련 API
-│   ├── orderApi.js                     # 주문 및 거래 내역 API
-│   ├── quizApi.js                      # 퀴즈 관련 API
-│   └── recommendationApi.js            # 추천 시스템 관련 API
-├── App.css                             # 앱 전역 CSS 파일
-├── App.jsx                             # 앱의 메인 라우팅 및 레이아웃 설정 컴포넌트
-├── assets                              # 정적 리소스 (이미지, 아이콘 등)
-│   ├── advertisement1.png              # 광고 배너 이미지
-│   ├── bnkBank.png                     # 부산은행 아이콘
-│   ├── earth_quiz.png                  # 퀴즈 지구 이미지
-│   ├── earth.png                       # 지구 아이콘
-│   ├── fitfit.png                      # 핏핏 로고 이미지
-│   ├── hanaBank.png                    # 하나은행 아이콘
-│   ├── ibkBank.png                     # 기업은행 아이콘
-│   ├── kakao_login_medium_wide.png     # 카카오 로그인 버튼 이미지
-│   ├── kakaoBank.png                   # 카카오뱅크 아이콘
-│   ├── kBank.png                       # 케이뱅크 아이콘
-│   ├── kbBank.png                      # 국민은행 아이콘
-│   ├── kebBank.png                     # 하나은행(구 외환) 아이콘
-│   ├── kfccBank.png                    # 새마을금고 아이콘
-│   ├── logo-fitfit copy.png            # 로고 사본
-│   ├── logo-fitfit.png                 # 메인 로고
-│   ├── nhBank.png                      # 농협은행 아이콘
-│   ├── postBank.png                    # 우체국 아이콘
-│   ├── scBank.png                      # SC제일은행 아이콘
-│   ├── shinhanBank.png                 # 신한은행 아이콘
-│   ├── space.png                       # 우주 배경 이미지
-│   ├── suhyupBank.png                  # 수협 아이콘
-│   ├── tossBank.png                    # 토스뱅크 아이콘
-│   ├── userLocation.png                # 사용자 위치 표시 아이콘
-│   └── wooriBank.png                   # 우리은행 아이콘
-├── components                          # 공통으로 사용되는 UI 컴포넌트
-│   ├── BottomNavBar.jsx                # 하단 네비게이션 바 (메인 메뉴 이동)
-│   └── PhotoPickerModal.jsx            # 사진 선택 모달 (카메라/앨범)
-├── constants                           # 상수 데이터 모음
-│   ├── categories.js                   # 상품 카테고리 정의
-│   └── termContent.js                  # 약관 내용 정의
-├── contexts                            # 전역 상태 관리 (Context API)
-│   ├── MapContext.jsx                  # 지도 관련 상태 컨텍스트
-│   ├── SellFormContext.jsx             # 판매글 작성 폼 상태 컨텍스트
-│   └── SignupContext.jsx               # 회원가입 진행 상태 컨텍스트
-├── Hello.jsx                           # 테스트용 Hello 컴포넌트
-├── hooks                               # 커스텀 훅 모음
-│   └── useRequireAuth.js               # 로그인 여부 확인 및 리다이렉트 훅
-├── index.css                           # Tailwind CSS 진입점 및 기본 스타일
-├── main.jsx                            # React 앱 진입점 (DOM 렌더링)
-├── pages                               # 페이지 단위 컴포넌트 폴더
-│   ├── auth                            # 인증 관련 페이지
-│   │   ├── AuthStartPage.css           # 시작 페이지 스타일
-│   │   ├── AuthStartPage.jsx           # 시작 페이지 (로그인/회원가입 분기)
-│   │   └── kakao                       # 카카오 로그인 관련
-│   │       └── KakaoRedirect.jsx       # 카카오 로그인 콜백 처리 페이지
-│   ├── category                        # 카테고리 관련 페이지
-│   │   ├── CategoryPage.jsx            # 카테고리 목록 페이지
-│   │   ├── CategoryResultPage.jsx      # 카테고리 선택 결과 리스트 페이지
-│   │   └── components                  # 카테고리 페이지 내부 컴포넌트
-│   │       ├── AccessoriesCategory.jsx # 액세서리 카테고리 컴포넌트
-│   │       ├── BagsCategory.jsx        # 가방 카테고리 컴포넌트
-│   │       ├── BottomsCategory.jsx     # 하의 카테고리 컴포넌트
-│   │       ├── CategoryClothesList.jsx # 카테고리 의류 목록 컴포넌트
-│   │       ├── DressesCategory.jsx     # 원피스 카테고리 컴포넌트
-│   │       ├── OuterwearCategory.jsx   # 아우터 카테고리 컴포넌트
-│   │       ├── RecommendedCategory.jsx # 추천 카테고리 컴포넌트
-│   │       ├── ShoesCategory.jsx       # 신발 카테고리 컴포넌트
-│   │       └── TopsCategory.jsx        # 상의 카테고리 컴포넌트
-│   ├── Chat                            # 채팅 관련 페이지
-│   │   ├── ChatPage.jsx                # 채팅방 목록 페이지
-│   │   └── ChatRoomPage.jsx            # 개별 1:1 채팅방 페이지
-│   ├── Closet                          # 옷장 관련 페이지
-│   │   ├── Closet.jsx                  # 내 옷장 메인 페이지 (등록된 옷 확인)
-│   │   ├── components                  # 옷장 페이지 내부 컴포넌트
-│   │   │   └── ClosetTab.jsx           # 옷장 탭 컴포넌트
-│   │   └── FittingRoomPage.jsx         # 가상 피팅룸 페이지 (AI 피팅 실행)
-│   ├── LoadingPage.jsx                 # 로딩 화면 페이지
-│   ├── MainPage                        # 메인화면 페이지
-│   │   ├── components                  # 메인화면 내부 컴포넌트
-│   │   │   ├── AdSection.jsx           # 광고 섹션
-│   │   │   ├── MainNavBar.jsx          # 메인 상단 네비게이션바
-│   │   │   ├── NewTab.jsx              # 신상품 탭 컨텐츠
-│   │   │   ├── PopularRankingSection.jsx # 인기 랭킹 섹션
-│   │   │   ├── PopularTab.jsx          # 인기 상품 탭 컨텐츠
-│   │   │   ├── ProductCard.jsx         # 상품 카드 컴포넌트 (썸네일, 가격 등)
-│   │   │   ├── RecommendTab.jsx        # 추천 상품 탭 컨텐츠
-│   │   │   ├── SaleTab.jsx             # 세일 상품 탭 컨텐츠
-│   │   │   ├── SearchBar.jsx           # 검색바 컴포넌트
-│   │   │   └── WelcomeModal.jsx        # 환영 모달 컴포넌트
-│   │   └── MainPage.jsx                # 메인 페이지 진입점
-│   ├── map                             # 지도 관련 페이지
-│   │   ├── LocationSearchModal.jsx     # 위치 검색 모달
-│   │   ├── MapPage.jsx                 # 지도 페이지 (내 주변 상품 찾기)
-│   │   └── useKakaoLoader.jsx          # 카카오맵 로더 훅
-│   ├── MyPage                          # 마이페이지
-│   │   ├── AccountManagePage.jsx       # 계정 관리 페이지
-│   │   ├── BodyInfoPage.jsx            # 체형 정보 관리 페이지
-│   │   ├── ChatbotPage.jsx             # 챗봇 상담 페이지
-│   │   ├── components                  # 마이페이지 내부 컴포넌트
-│   │   │   ├── CleanTransactionModal.jsx # 클린 거래 안내 모달
-│   │   │   ├── HistoryPageLayout.jsx   # 내역 페이지 레이아웃
-│   │   │   ├── PurchaseHistoryList.jsx # 구매 내역 리스트
-│   │   │   ├── PurchaseHistoryTab.jsx  # 구매 내역 탭
-│   │   │   ├── ReviewModal.jsx         # 리뷰 작성 모달
-│   │   │   ├── SalesHistoryList.jsx    # 판매 내역 리스트
-│   │   │   └── SalesHistoryTab.jsx     # 판매 내역 탭
-│   │   ├── LeafManagePage.jsx          # 리프(포인트) 관리 페이지
-│   │   ├── MyPage.jsx                  # 마이페이지 메인 화면
-│   │   ├── ProfileEditPage.jsx         # 프로필 편집 페이지
-│   │   ├── PurchaseHistoryPage.jsx     # 구매 내역 전체 페이지
-│   │   ├── QuizPage                    # 퀴즈 관련 페이지 폴더
-│   │   │   ├── QuizPage.jsx            # 퀴즈 메인 페이지
-│   │   │   └── QuizQuestionPage.jsx    # 퀴즈 문제 풀이 페이지
-│   │   ├── SalesHistoryPage.jsx        # 판매 내역 전체 페이지
-│   │   ├── SellPage                    # 상품 판매 등록 폴더
-│   │   │   ├── components              # 판매 페이지 내부 컴포넌트
-│   │   │   │   ├── BasicInfoSection.jsx # 기본 정보 입력 섹션
-│   │   │   │   ├── DatePickerModal.jsx # 날짜 선택 모달
+├── api                                          # API 요청 함수 모음
+│   ├── authApi.js                               # 인증 관련 API (로그인, 회원가입 등)
+│   ├── chatApi.js                               # 채팅 관련 API (메시지 전송, 조회)
+│   ├── chatbotApi.js                            # 챗봇 관련 API
+│   ├── clothesApi.js                            # 의류 관련 API (상품 등록, 조회)
+│   ├── common.js                                # 공통 API 설정 및 함수
+│   ├── fittingApi.js                            # 가상 피팅 관련 API
+│   ├── memberApi.js                             # 회원 정보 관련 API
+│   ├── orderApi.js                              # 주문 및 거래 내역 API
+│   ├── quizApi.js                               # 퀴즈 관련 API
+│   └── recommendationApi.js                     # 추천 시스템 관련 API
+├── App.css                                      # 앱 전역 CSS 파일
+├── App.jsx                                      # 앱의 메인 라우팅 및 레이아웃 설정 컴포넌트
+├── assets                                       # 정적 리소스 (이미지, 아이콘 등)
+│   ├── advertisement1.png                       # 광고 배너 이미지
+│   ├── bnkBank.png                              # 부산은행 아이콘
+│   ├── earth_quiz.png                           # 퀴즈 지구 이미지
+│   ├── earth.png                                # 지구 아이콘
+│   ├── fitfit.png                               # 핏핏 로고 이미지
+│   ├── hanaBank.png                             # 하나은행 아이콘
+│   ├── ibkBank.png                              # 기업은행 아이콘
+│   ├── kakao_login_medium_wide.png              # 카카오 로그인 버튼 이미지
+│   ├── kakaoBank.png                            # 카카오뱅크 아이콘
+│   ├── kBank.png                                # 케이뱅크 아이콘
+│   ├── kbBank.png                               # 국민은행 아이콘
+│   ├── kebBank.png                              # 하나은행(구 외환) 아이콘
+│   ├── kfccBank.png                             # 새마을금고 아이콘
+│   ├── logo-fitfit copy.png                     # 로고 사본
+│   ├── logo-fitfit.png                          # 메인 로고
+│   ├── nhBank.png                               # 농협은행 아이콘
+│   ├── postBank.png                             # 우체국 아이콘
+│   ├── scBank.png                               # SC제일은행 아이콘
+│   ├── shinhanBank.png                          # 신한은행 아이콘
+│   ├── space.png                                # 우주 배경 이미지
+│   ├── suhyupBank.png                           # 수협 아이콘
+│   ├── tossBank.png                             # 토스뱅크 아이콘
+│   ├── userLocation.png                         # 사용자 위치 표시 아이콘
+│   └── wooriBank.png                            # 우리은행 아이콘
+├── components                                   # 공통으로 사용되는 UI 컴포넌트
+│   ├── BottomNavBar.jsx                         # 하단 네비게이션 바 (메인 메뉴 이동)
+│   └── PhotoPickerModal.jsx                     # 사진 선택 모달 (카메라/앨범)
+├── constants                                    # 상수 데이터 모음
+│   ├── categories.js                            # 상품 카테고리 정의
+│   └── termContent.js                           # 약관 내용 정의
+├── contexts                                     # 전역 상태 관리 (Context API)
+│   ├── MapContext.jsx                           # 지도 관련 상태 컨텍스트
+│   ├── SellFormContext.jsx                      # 판매글 작성 폼 상태 컨텍스트
+│   └── SignupContext.jsx                        # 회원가입 진행 상태 컨텍스트
+├── Hello.jsx                                    # 테스트용 Hello 컴포넌트
+├── hooks                                        # 커스텀 훅 모음
+│   └── useRequireAuth.js                        # 로그인 여부 확인 및 리다이렉트 훅
+├── index.css                                    # Tailwind CSS 진입점 및 기본 스타일
+├── main.jsx                                     # React 앱 진입점 (DOM 렌더링)
+├── pages                                        # 페이지 단위 컴포넌트 폴더
+│   ├── auth                                     # 인증 관련 페이지
+│   │   ├── AuthStartPage.css                    # 시작 페이지 스타일
+│   │   ├── AuthStartPage.jsx                    # 시작 페이지 (로그인/회원가입 분기)
+│   │   └── kakao                                # 카카오 로그인 관련
+│   │       └── KakaoRedirect.jsx                # 카카오 로그인 콜백 처리 페이지
+│   ├── category                                 # 카테고리 관련 페이지
+│   │   ├── CategoryPage.jsx                     # 카테고리 목록 페이지
+│   │   ├── CategoryResultPage.jsx               # 카테고리 선택 결과 리스트 페이지
+│   │   └── components                           # 카테고리 페이지 내부 컴포넌트
+│   │       ├── AccessoriesCategory.jsx          # 액세서리 카테고리 컴포넌트
+│   │       ├── BagsCategory.jsx                 # 가방 카테고리 컴포넌트
+│   │       ├── BottomsCategory.jsx              # 하의 카테고리 컴포넌트
+│   │       ├── CategoryClothesList.jsx          # 카테고리 의류 목록 컴포넌트
+│   │       ├── DressesCategory.jsx              # 원피스 카테고리 컴포넌트
+│   │       ├── OuterwearCategory.jsx            # 아우터 카테고리 컴포넌트
+│   │       ├── RecommendedCategory.jsx          # 추천 카테고리 컴포넌트
+│   │       ├── ShoesCategory.jsx                # 신발 카테고리 컴포넌트
+│   │       └── TopsCategory.jsx                 # 상의 카테고리 컴포넌트
+│   ├── Chat                                     # 채팅 관련 페이지
+│   │   ├── ChatPage.jsx                         # 채팅방 목록 페이지
+│   │   └── ChatRoomPage.jsx                     # 개별 1:1 채팅방 페이지
+│   ├── Closet                                   # 옷장 관련 페이지
+│   │   ├── Closet.jsx                           # 내 옷장 메인 페이지 (등록된 옷 확인)
+│   │   ├── components                           # 옷장 페이지 내부 컴포넌트
+│   │   │   └── ClosetTab.jsx                    # 옷장 탭 컴포넌트
+│   │   └── FittingRoomPage.jsx                  # 가상 피팅룸 페이지 (AI 피팅 실행)
+│   ├── LoadingPage.jsx                          # 로딩 화면 페이지
+│   ├── MainPage                                 # 메인화면 페이지
+│   │   ├── components                           # 메인화면 내부 컴포넌트
+│   │   │   ├── AdSection.jsx                    # 광고 섹션
+│   │   │   ├── MainNavBar.jsx                   # 메인 상단 네비게이션바
+│   │   │   ├── NewTab.jsx                       # 신상품 탭 컨텐츠
+│   │   │   ├── PopularRankingSection.jsx        # 인기 랭킹 섹션
+│   │   │   ├── PopularTab.jsx                   # 인기 상품 탭 컨텐츠
+│   │   │   ├── ProductCard.jsx                  # 상품 카드 컴포넌트 (썸네일, 가격 등)
+│   │   │   ├── RecommendTab.jsx                 # 추천 상품 탭 컨텐츠
+│   │   │   ├── SaleTab.jsx                      # 세일 상품 탭 컨텐츠
+│   │   │   ├── SearchBar.jsx                    # 검색바 컴포넌트
+│   │   │   └── WelcomeModal.jsx                 # 환영 모달 컴포넌트
+│   │   └── MainPage.jsx                         # 메인 페이지 진입점
+│   ├── map                                      # 지도 관련 페이지
+│   │   ├── LocationSearchModal.jsx              # 위치 검색 모달
+│   │   ├── MapPage.jsx                          # 지도 페이지 (내 주변 상품 찾기)
+│   │   └── useKakaoLoader.jsx                   # 카카오맵 로더 훅
+│   ├── MyPage                                   # 마이페이지
+│   │   ├── AccountManagePage.jsx                # 계정 관리 페이지
+│   │   ├── BodyInfoPage.jsx                     # 체형 정보 관리 페이지
+│   │   ├── ChatbotPage.jsx                      # 챗봇 상담 페이지
+│   │   ├── components                           # 마이페이지 내부 컴포넌트
+│   │   │   ├── CleanTransactionModal.jsx        # 클린 거래 안내 모달
+│   │   │   ├── HistoryPageLayout.jsx            # 내역 페이지 레이아웃
+│   │   │   ├── PurchaseHistoryList.jsx          # 구매 내역 리스트
+│   │   │   ├── PurchaseHistoryTab.jsx           # 구매 내역 탭
+│   │   │   ├── ReviewModal.jsx                  # 리뷰 작성 모달
+│   │   │   ├── SalesHistoryList.jsx             # 판매 내역 리스트
+│   │   │   └── SalesHistoryTab.jsx              # 판매 내역 탭
+│   │   ├── LeafManagePage.jsx                   # 리프(포인트) 관리 페이지
+│   │   ├── MyPage.jsx                           # 마이페이지 메인 화면
+│   │   ├── ProfileEditPage.jsx                  # 프로필 편집 페이지
+│   │   ├── PurchaseHistoryPage.jsx              # 구매 내역 전체 페이지
+│   │   ├── QuizPage                             # 퀴즈 관련 페이지 폴더
+│   │   │   ├── QuizPage.jsx                     # 퀴즈 메인 페이지
+│   │   │   └── QuizQuestionPage.jsx             # 퀴즈 문제 풀이 페이지
+│   │   ├── SalesHistoryPage.jsx                 # 판매 내역 전체 페이지
+│   │   ├── SellPage                             # 상품 판매 등록 폴더
+│   │   │   ├── components                       # 판매 페이지 내부 컴포넌트
+│   │   │   │   ├── BasicInfoSection.jsx         # 기본 정보 입력 섹션
+│   │   │   │   ├── DatePickerModal.jsx          # 날짜 선택 모달
 │   │   │   │   ├── DirectTransactionSection.jsx # 직거래 설정 섹션
-│   │   │   │   ├── PhotoUploadSection.jsx # 사진 업로드 섹션
-│   │   │   │   ├── PriceSection.jsx    # 가격 설정 섹션
-│   │   │   │   ├── SizeSection.jsx     # 사이즈 설정 섹션
-│   │   │   │   ├── SpecialSaleSection.jsx # 특가 설정 섹션
-│   │   │   │   ├── StyleSection.jsx    # 스타일 태그 설정 섹션
-│   │   │   │   └── VirtualFittingSection.jsx # 가상피팅 허용 설정
-│   │   │   ├── EditSellPage.jsx        # 판매글 수정 페이지
-│   │   │   └── SellPage.jsx            # 판매글 등록 페이지
-│   │   └── WithdrawalPage.jsx          # 회원 탈퇴 페이지
-│   ├── Payment                         # 결제 관련 페이지
-│   │   └── PaymentPage.jsx             # 결제 진행 페이지
-│   ├── ProductDetailPage               # 상품 상세 페이지
-│   │   ├── components                  # 상세 페이지 내부 컴포넌트
-│   │   │   ├── ProductActionButtons.jsx # 구매/채팅 버튼
-│   │   │   ├── ProductDescription.jsx  # 상품 상세 설명
-│   │   │   ├── ProductDetailHeader.jsx # 상세 페이지 헤더
-│   │   │   ├── ProductImageCarousel.jsx # 상품 이미지 슬라이더
-│   │   │   ├── ProductInfoSection.jsx  # 상품 정보 섹션
-│   │   │   ├── ProductSizeSection.jsx  # 실측 사이즈 섹션
-│   │   │   └── SellerInfoBox.jsx       # 판매자 정보 박스
-│   │   └── ProductDetailPage.jsx       # 상품 상세 페이지 메인
-│   ├── SearchPage                      # 검색 관련 페이지
-│   │   ├── components                  # 검색 페이지 내부 컴포넌트
-│   │   │   ├── PriceFilterDropdown.jsx # 가격 필터
-│   │   │   ├── RegionFilterDropdown.jsx # 지역 필터
-│   │   │   └── StyleFilterDropdown.jsx # 스타일 필터
-│   │   └── SearchPage.jsx              # 검색 결과 페이지
-│   └── signup                          # 회원가입 관련 페이지
-│       ├── components                  # 회원가입 내부 컴포넌트
-│       │   ├── BirthDateSelector.css   # 생년월일 선택 스타일
-│       │   ├── BirthDateSelector.jsx   # 생년월일 선택 컴포넌트
-│       │   ├── GenderSelector.css      # 성별 선택 스타일
-│       │   ├── GenderSelector.jsx      # 성별 선택 컴포넌트
-│       │   ├── InputWithCheckButton.css # 중복확인 버튼 포함 입력창 스타일
-│       │   ├── InputWithCheckButton.jsx # 중복확인 버튼 포함 입력창
-│       │   ├── LabeledInput.css        # 라벨 포함 입력창 스타일
-│       │   ├── LabeledInput.jsx        # 라벨 포함 입력창
-│       │   ├── PasswordFields.css      # 비밀번호 입력 필드 스타일
-│       │   └── PasswordFields.jsx      # 비밀번호 입력 필드
-│       ├── SignupPage.jsx              # 회원가입 메인 페이지
-│       ├── SignupStep1.css             # 단계1 스타일
-│       ├── SignupStep1.jsx             # 단계1 (약관동의)
-│       ├── SignupStep2.css             # 단계2 스타일
-│       ├── SignupStep2.jsx             # 단계2 (정보입력)
-│       ├── SignupStep3.css             # 단계3 스타일
-│       ├── SignupStep3.jsx             # 단계3 (완료)
-│       ├── styles                      # 회원가입 공통 스타일
-│       │   └── common.css              # 공통 CSS
-│       ├── TermsDetailPage.css         # 약관 상세 스타일
-│       ├── TermsDetailPage.jsx         # 약관 상세 내용 페이지
-│       ├── TermsPage.css               # 약관 목록 스타일
-│       └── TermsPage.jsx               # 약관 목록 페이지
-├── reducers                            # Redux Reducer 모음
-│   ├── auth.js                         # 인증 관련 리듀서
-│   ├── counter.js                      # 카운터 리듀서 (예제용)
-│   └── index.js                        # 루트 리듀서 결합
-├── store.js                            # Redux Store 설정 파일
-├── styles                              # 스타일 관련 폴더
-│   └── global.css                      # 전역 CSS 파일
-└── utils                               # 유틸리티 함수 폴더
-    ├── formatters.js                   # 날짜/금액 포맷팅 함수
-    ├── imageCompression.js             # 이미지 압축 유틸리티
-    └── imageUtils.js                   # 이미지 처리 관련 함수
+│   │   │   │   ├── PhotoUploadSection.jsx       # 사진 업로드 섹션
+│   │   │   │   ├── PriceSection.jsx             # 가격 설정 섹션
+│   │   │   │   ├── SizeSection.jsx              # 사이즈 설정 섹션
+│   │   │   │   ├── SpecialSaleSection.jsx       # 특가 설정 섹션
+│   │   │   │   ├── StyleSection.jsx             # 스타일 태그 설정 섹션
+│   │   │   │   └── VirtualFittingSection.jsx    # 가상피팅 허용 설정
+│   │   │   ├── EditSellPage.jsx                 # 판매글 수정 페이지
+│   │   │   └── SellPage.jsx                     # 판매글 등록 페이지
+│   │   └── WithdrawalPage.jsx                   # 회원 탈퇴 페이지
+│   ├── Payment                                  # 결제 관련 페이지
+│   │   └── PaymentPage.jsx                      # 결제 진행 페이지
+│   ├── ProductDetailPage                        # 상품 상세 페이지
+│   │   ├── components                           # 상세 페이지 내부 컴포넌트
+│   │   │   ├── ProductActionButtons.jsx         # 구매/채팅 버튼
+│   │   │   ├── ProductDescription.jsx           # 상품 상세 설명
+│   │   │   ├── ProductDetailHeader.jsx          # 상세 페이지 헤더
+│   │   │   ├── ProductImageCarousel.jsx         # 상품 이미지 슬라이더
+│   │   │   ├── ProductInfoSection.jsx           # 상품 정보 섹션
+│   │   │   ├── ProductSizeSection.jsx           # 실측 사이즈 섹션
+│   │   │   └── SellerInfoBox.jsx                # 판매자 정보 박스
+│   │   └── ProductDetailPage.jsx                # 상품 상세 페이지 메인
+│   ├── SearchPage                               # 검색 관련 페이지
+│   │   ├── components                           # 검색 페이지 내부 컴포넌트
+│   │   │   ├── PriceFilterDropdown.jsx          # 가격 필터 
+│   │   │   ├── RegionFilterDropdown.jsx         # 지역 필터
+│   │   │   └── StyleFilterDropdown.jsx          # 스타일 필터
+│   │   └── SearchPage.jsx                       # 검색 결과 페이지
+│   └── signup                                   # 회원가입 관련 페이지
+│       ├── components                           # 회원가입 내부 컴포넌트
+│       │   ├── BirthDateSelector.css            # 생년월일 선택 스타일
+│       │   ├── BirthDateSelector.jsx            # 생년월일 선택 컴포넌트
+│       │   ├── GenderSelector.css               # 성별 선택 스타일
+│       │   ├── GenderSelector.jsx               # 성별 선택 컴포넌트
+│       │   ├── InputWithCheckButton.css         # 중복확인 버튼 포함 입력창 스타일
+│       │   ├── InputWithCheckButton.jsx         # 중복확인 버튼 포함 입력창
+│       │   ├── LabeledInput.css                 # 라벨 포함 입력창 스타일
+│       │   ├── LabeledInput.jsx                 # 라벨 포함 입력창
+│       │   ├── PasswordFields.css               # 비밀번호 입력 필드 스타일
+│       │   └── PasswordFields.jsx               # 비밀번호 입력 필드
+│       ├── SignupPage.jsx                       # 회원가입 메인 페이지
+│       ├── SignupStep1.css                      # 단계1 스타일
+│       ├── SignupStep1.jsx                      # 단계1 (약관동의)
+│       ├── SignupStep2.css                      # 단계2 스타일
+│       ├── SignupStep2.jsx                      # 단계2 (정보입력)
+│       ├── SignupStep3.css                      # 단계3 스타일
+│       ├── SignupStep3.jsx                      # 단계3 (완료)
+│       ├── styles                               # 회원가입 공통 스타일
+│       │   └── common.css                       # 공통 CSS
+│       ├── TermsDetailPage.css                  # 약관 상세 스타일
+│       ├── TermsDetailPage.jsx                  # 약관 상세 내용 페이지
+│       ├── TermsPage.css                        # 약관 목록 스타일
+│       └── TermsPage.jsx                        # 약관 목록 페이지
+├── reducers                                     # Redux Reducer 모음
+│   ├── auth.js                                  # 인증 관련 리듀서
+│   ├── counter.js                               # 카운터 리듀서 (예제용)
+│   └── index.js                                 # 루트 리듀서 결합
+├── store.js                                     # Redux Store 설정 파일
+├── styles                                       # 스타일 관련 폴더
+│   └── global.css                               # 전역 CSS 파일
+└── utils                                        # 유틸리티 함수 폴더
+    ├── formatters.js                            # 날짜/금액 포맷팅 함수
+    ├── imageCompression.js                      # 이미지 압축 유틸리티
+    └── imageUtils.js                            # 이미지 처리 관련 함수
 ```
 
 <br />