diff --git a/src/assets/icons/no_result_alert.svg b/src/assets/icons/alert.svg
similarity index 74%
rename from src/assets/icons/no_result_alert.svg
rename to src/assets/icons/alert.svg
index 4b30753c..8dc2525b 100644
--- a/src/assets/icons/no_result_alert.svg
+++ b/src/assets/icons/alert.svg
@@ -1,3 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg width="24" height="24" viewBox="0 0 24 24" fill="black" xmlns="http://www.w3.org/2000/svg">
 <path d="M13 1H11V3H9V5H7V7H5V9H3V11H1V13H3V15H5V17H7V19H9V21H11V23H13V21H15V19H17V17H19V15H21V13H23V11H21V9H19V7H17V5H15V3H13V1ZM13 3V5H15V7H17V9H19V11H21V13H19V15H17V17H15V19H13V21H11V19H9V17H7V15H5V13H3V11H5V9H7V7H9V5H11V3H13ZM13 7H11V13H13V7ZM13 15H11V17H13V15Z" fill={fill} />
 </svg>
diff --git a/src/assets/icons/edit.svg b/src/assets/icons/edit.svg
index 3ae25e70..144450f5 100644
--- a/src/assets/icons/edit.svg
+++ b/src/assets/icons/edit.svg
@@ -1,3 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M18 2H16V4H18V2ZM4 4H10V6H4V20H18V14H20V22H2V4H4ZM8 12H6V18H12V16H14V14H12V16H8V12ZM12 10H10V12H8V10H10V8H12V6H14V8H12V10ZM14 4H16V6H14V4ZM18 4H20V6H22V8H20V10H18V12H16V10H18V8H20V6H18V4ZM14 12H16V14H14V12Z" fill="black"/>
+<svg width="24" height="24" viewBox="0 0 24 24" fill="black" xmlns="http://www.w3.org/2000/svg">
+<path d="M18 2H16V4H18V2ZM4 4H10V6H4V20H18V14H20V22H2V4H4ZM8 12H6V18H12V16H14V14H12V16H8V12ZM12 10H10V12H8V10H10V8H12V6H14V8H12V10ZM14 4H16V6H14V4ZM18 4H20V6H22V8H20V10H18V12H16V10H18V8H20V6H18V4ZM14 12H16V14H14V12Z" fill={fill} />
 </svg>
diff --git a/src/assets/icons/image.svg b/src/assets/icons/image.svg
index 2f4debce..696daa79 100644
--- a/src/assets/icons/image.svg
+++ b/src/assets/icons/image.svg
@@ -1,3 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M4 3H2V21H22V3H4ZM20 5V19H4V5H20ZM14 9H12V11H10V13H8V15H6V17H8V15H10V13H12V11H14V13H16V15H18V13H16V11H14V9ZM8 7H6V9H8V7Z" fill="black"/>
+<svg width="24" height="24" viewBox="0 0 24 24" fill="black" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 3H2V21H22V3H4ZM20 5V19H4V5H20ZM14 9H12V11H10V13H8V15H6V17H8V15H10V13H12V11H14V13H16V15H18V13H16V11H14V9ZM8 7H6V9H8V7Z" fill={fill} />
 </svg>
diff --git a/src/assets/icons/index.ts b/src/assets/icons/index.ts
index f1221708..8463ac85 100644
--- a/src/assets/icons/index.ts
+++ b/src/assets/icons/index.ts
@@ -22,7 +22,7 @@ export { default as LogoShortIcon } from './logo-short.svg?react'
 export { default as ReviewAlignIcon } from './review-align.svg?react'
 export { default as EditIcon } from './edit.svg?react'
 export { default as LeftSignXIcon } from './left-sign-x.svg?react'
-export { default as NoSearchResultIcon } from './no_result_alert.svg?react'
+export { default as AlertIcon } from './alert.svg?react'
 export { default as MultipleCheckIcon } from './multiple-check.svg?react'
 export { default as DropdownIcon } from './dropdown.svg?react'
 export { default as HexagonIcon } from './hexagon.svg?react'
diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
index e6c79cbe..093be99f 100644
--- a/src/components/Header/index.tsx
+++ b/src/components/Header/index.tsx
@@ -63,11 +63,11 @@ const Header = memo(({ handleGoBack }: HeaderProps) => {
         </div>
         <div className="flex items-center gap-x-3 md:gap-x-5">
           <div
-            className="flex cursor-pointer items-center justify-center md:h-8 md:w-8"
+            className="flex h-6 w-6 cursor-pointer items-center justify-center md:h-8 md:w-8"
             onClick={toggle}
           >
             {darkMode ? (
-              <MoonIcon className="h-full w-full animate" />
+              <MoonIcon className="h-full w-full" />
             ) : (
               <SunIcon className="h-full w-full" />
             )}
@@ -77,7 +77,7 @@ const Header = memo(({ handleGoBack }: HeaderProps) => {
               <Dropdown>
                 <Dropdown.Toggle className="avatar avatar-sm flex cursor-pointer items-center justify-center overflow-hidden border border-gray-200 bg-white md:avatar-md dark:bg-black">
                   {user?.path ? (
-                    <div className="flex h-7 w-7 p-0.5 md:h-9 md:w-9">
+                    <div className="flex h-7 w-7 md:h-9 md:w-9">
                       <img src={user.path} alt="my" />
                     </div>
                   ) : (
diff --git a/src/components/Profile/index.tsx b/src/components/Profile/index.tsx
index 2765ed6b..2dbda922 100644
--- a/src/components/Profile/index.tsx
+++ b/src/components/Profile/index.tsx
@@ -7,7 +7,9 @@ interface ProfileProps {
 }
 
 const Profile = ({
-  image = <BasicProfileIcon className="h-4 w-4 bg-white dark:bg-black" />,
+  image = (
+    <BasicProfileIcon className="visible h-4 w-4 bg-white dark:bg-black" />
+  ),
   name,
   className,
 }: ProfileProps) => {
diff --git a/src/components/UserList/index.tsx b/src/components/UserList/index.tsx
index dd8bb92e..b3b14ca0 100644
--- a/src/components/UserList/index.tsx
+++ b/src/components/UserList/index.tsx
@@ -59,17 +59,15 @@ const UserList = ({
               >
                 <div
                   onClick={() => handleClick(user.id, user.name)}
-                  className="flex items-center justify-between px-3 py-2 text-sm md:text-lg"
+                  className="flex items-center justify-between px-2 py-2 text-sm md:text-lg"
                 >
                   <div className="flex items-center gap-2">
                     {responserCount &&
                       responserCount[index] &&
                       questionType !== 'PROCEEDING' && (
                         <span
-                          className={`dot ${
-                            hasSavedResult(user.id)
-                              ? 'bg-blue-600'
-                              : 'bg-red-600'
+                          className={`h-1.5 w-1.5 rounded-full ${
+                            hasSavedResult(user.id) ? '' : 'bg-red-600'
                           }`}
                         ></span>
                       )}
diff --git a/src/pages/CreatedReviewManagePage/components/AllResponseByReceiver/index.tsx b/src/pages/CreatedReviewManagePage/components/AllResponseByReceiver/index.tsx
index 2b646c54..fd9b76f6 100644
--- a/src/pages/CreatedReviewManagePage/components/AllResponseByReceiver/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/AllResponseByReceiver/index.tsx
@@ -59,12 +59,7 @@ const AllResponseReviewByResponser = ({
             />
             <UserList
               hasDrawer
-              users={responseByReceiver.map((receiver) => {
-                return {
-                  id: receiver.receiverId,
-                  name: receiver.receiverName,
-                }
-              })}
+              users={findUserBySearchKeyword}
               onClickUser={({ id, name }) => setSelectedUser({ id, name })}
               responserCount={responseByReceiver?.map(
                 (value) => value.responserCount,
diff --git a/src/pages/CreatedReviewManagePage/components/AllResponseByResponser/index.tsx b/src/pages/CreatedReviewManagePage/components/AllResponseByResponser/index.tsx
index ffd0f90b..30c1d20d 100644
--- a/src/pages/CreatedReviewManagePage/components/AllResponseByResponser/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/AllResponseByResponser/index.tsx
@@ -18,6 +18,7 @@ const AllResponseReviewByResponser = ({
   const { data: responseByResponser } = useGetAllResponseByResponser({
     reviewId,
   }).data || { data: [] }
+  const [sortState, setSortState] = useState(false)
   const [keyword, setKeyword] = useState('')
   const [filteredUsers, setFilteredUsers] = useState(
     responseByResponser.sort((a, b) => a.user.name.localeCompare(b.user.name)),
@@ -36,12 +37,22 @@ const AllResponseReviewByResponser = ({
   }
 
   const sortByName = () => {
-    setFilteredUsers(
-      () =>
-        [...filteredUsers]?.sort((a, b) =>
-          a.user.name.localeCompare(b.user.name),
-        ),
-    )
+    if (sortState) {
+      setFilteredUsers(
+        () =>
+          [...filteredUsers]?.sort((a, b) =>
+            a.user.name.localeCompare(b.user.name),
+          ),
+      )
+    } else {
+      setFilteredUsers(
+        () =>
+          [...filteredUsers]?.sort((a, b) =>
+            b.user.name.localeCompare(a.user.name),
+          ),
+      )
+    }
+    setSortState((prevState) => !prevState)
   }
 
   const sortByResponse = () => {
diff --git a/src/pages/CreatedReviewManagePage/components/AnswerGroup/RenderRefinedSubjective.tsx b/src/pages/CreatedReviewManagePage/components/AnswerGroup/RenderRefinedSubjective.tsx
index 2835cd38..fb0b5dd9 100644
--- a/src/pages/CreatedReviewManagePage/components/AnswerGroup/RenderRefinedSubjective.tsx
+++ b/src/pages/CreatedReviewManagePage/components/AnswerGroup/RenderRefinedSubjective.tsx
@@ -12,20 +12,22 @@ const RenderRefinedSubjective = ({ text }: RenderRefinedSubjectiveProps) => {
   const { handleChangePrompt, handleRefine } = handlers
 
   return (
-    <div className="relative flex w-full flex-col bg-transparent p-2.5">
+    <div className="relative mt-8 flex w-full flex-col bg-transparent">
       {isLoading && (
         <div className="spinner-dot-pulse absolute right-6 top-6 [--spinner-color:var(--blue-9)]">
           <div className="spinner-pulse-dot"></div>
         </div>
       )}
 
+      <h1 className="mb-2 text-base md:text-lg">⭐ 전송될 취합 답변: </h1>
+
       <ReactTextareaAutosize
         onChange={handleChangePrompt}
         className="m-0 w-full shrink-0 resize-none rounded-none border border-gray-200 bg-transparent p-5 text-sm dark:text-white"
         value={result ? result : prompt}
       ></ReactTextareaAutosize>
 
-      <div className="ml-2.5 flex gap-2 p-2.5">
+      <div className="flex gap-2">
         <IconButton
           className="mt-2.5 h-7 gap-1 rounded-md border border-gray-200 bg-gray-400 text-sm text-black"
           text="정제"
diff --git a/src/pages/CreatedReviewManagePage/components/AnswerGroup/index.tsx b/src/pages/CreatedReviewManagePage/components/AnswerGroup/index.tsx
index 559aa55b..c06ab12e 100644
--- a/src/pages/CreatedReviewManagePage/components/AnswerGroup/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/AnswerGroup/index.tsx
@@ -1,7 +1,7 @@
 import { nanoid } from 'nanoid'
 import { useState } from 'react'
 import { StarRatingList } from '@/components'
-import { CloseDropDownIcon, BasicProfileIcon } from '@/assets/icons'
+import { BasicProfileIcon } from '@/assets/icons'
 import { QUESTION_TYPE } from '../../constants'
 import RenderRefinedSubjective from './RenderRefinedSubjective'
 
@@ -32,9 +32,9 @@ const renderStarRating = (value: Answer) => (
       <BasicProfileIcon className="avatar h-[1.25rem] w-[1.25rem] border dark:bg-white dark:fill-white" />
       <p className="ml-[1.31rem] text-sm">{value.userName}</p>
     </h3>
-    <p className="ml-[42.96px] mt-[0.5rem] text-base leading-5 md:mt-[0.62rem]">
+    <div className="ml-[42.96px] mt-[0.5rem] text-base leading-5 md:mt-[0.62rem]">
       <StarRatingList rate={Number(value.value)} fixed={true} />
-    </p>
+    </div>
   </div>
 )
 
@@ -81,10 +81,10 @@ const renderResponseByQuestion = (
   role?: 'responser' | 'receiver',
 ) => (
   <article
-    className="m-t-[1.25rem] accordion-content w-full text-black dark:text-white"
+    className="accordion-content w-full border-x border-gray-200 text-black dark:text-white"
     key={nanoid()}
   >
-    <div className="accordion-content ml-[0.63rem] border-none">
+    <div className="accordion-content border-none px-2.5">
       {(() => {
         switch (questionType) {
           case 'RATING':
@@ -115,25 +115,33 @@ const QuestionAnswerRenderer = ({
   const [inputId] = useState(nanoid())
 
   return (
-    <section
+    <div
       className={`${
-        role === 'responser' && 'accordion accordion-open border-b-0'
-      } border-x border-gray-200 bg-white dark:bg-main-gray`}
+        role === 'responser' ? 'accordion accordion-open' : 'accordion'
+      } bg-white dark:bg-main-gray`}
     >
-      <input type="checkbox" id={inputId} className="accordion-toggle " />
+      <input type="checkbox" id={inputId} className="accordion-toggle" />
       <label
         htmlFor={inputId}
-        className="accordion-title ml-[0.62px] flex h-[2.5rem] justify-center  border-r-[1px] border-t border-gray-200 bg-white text-lg dark:bg-black"
+        className="accordion-title flex h-10 justify-center border border-gray-200 bg-white px-2.5 text-lg dark:border-gray-400 dark:bg-main-gray"
       >
-        <div className="flex items-center justify-between">
-          <h1 className="flex h-[2.75rem] items-center pl-[0.63rem] text-lg md:text-xl">
-            {QUESTION_TYPE[questionType]}
-            <span className="ml-[0.63rem] text-lg md:text-xl">
-              {questionTitle}
-            </span>
-          </h1>
-          <CloseDropDownIcon className="fill-black stroke-black text-black dark:fill-white dark:stroke-white dark:text-white" />
+        <div className="flex h-11 items-center text-lg md:text-xl">
+          {QUESTION_TYPE[questionType]}
+          <span className="ml-[0.63rem] text-lg md:text-xl">
+            {questionTitle}
+          </span>
         </div>
+
+        <span className="accordion-icon absolute top-1/2 flex -translate-y-1/2 items-center justify-center">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+          >
+            <path d="M13.293 6.293 7.586 12l5.707 5.707 1.414-1.414L10.414 12l4.293-4.293z"></path>
+          </svg>
+        </span>
       </label>
 
       {questionType !== 'HEXASTAT' &&
@@ -150,7 +158,7 @@ const QuestionAnswerRenderer = ({
           ?.map((value) =>
             renderResponseByQuestion(value, answers, questionType),
           )}
-    </section>
+    </div>
   )
 }
 
diff --git a/src/pages/CreatedReviewManagePage/components/NotFoundSearchUser/index.tsx b/src/pages/CreatedReviewManagePage/components/NotFoundSearchUser/index.tsx
index 379c13cb..bbddca76 100644
--- a/src/pages/CreatedReviewManagePage/components/NotFoundSearchUser/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/NotFoundSearchUser/index.tsx
@@ -1,9 +1,9 @@
-import { NoSearchResultIcon } from '@/assets/icons'
+import { AlertIcon } from '@/assets/icons'
 
 const NotFoundUser = () => {
   return (
     <div className="flex h-[9.375rem] flex-col items-center justify-center border-gray-200">
-      <NoSearchResultIcon className="fill-black dark:fill-white" />
+      <AlertIcon className="fill-black dark:fill-white" />
       <p>검색 결과가 없다!</p>
     </div>
   )
diff --git a/src/pages/CreatedReviewManagePage/components/ReceiverTabReviewDatail/index.tsx b/src/pages/CreatedReviewManagePage/components/ReceiverTabReviewDatail/index.tsx
index 321c106a..88b6fd60 100644
--- a/src/pages/CreatedReviewManagePage/components/ReceiverTabReviewDatail/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/ReceiverTabReviewDatail/index.tsx
@@ -128,8 +128,8 @@ const ReceiverReviewDetail = ({
 
   return (
     <>
-      <label htmlFor="drawer" className="overlay"></label>
-      <div className="drawer drawer-bottom m-0 flex h-5/6 w-full  flex-col items-center gap-10 overflow-auto bg-main-ivory dark:bg-main-red-100 md:h-5/6">
+      <label className="overlay" htmlFor="drawer-bottom"></label>
+      <div className="drawer drawer-bottom m-0 flex h-[90%] w-full flex-col items-center gap-10 overflow-auto bg-main-ivory dark:bg-main-red-100 md:h-5/6">
         <div className="sticky top-0 z-50 flex h-[30px] w-full shrink-0 flex-col items-center justify-center bg-main-yellow dark:bg-main-red-200 sm:h-[40px]">
           <label
             htmlFor="drawer-bottom"
@@ -138,12 +138,14 @@ const ReceiverReviewDetail = ({
             <CloseDropDownIcon className="h-[1rem] w-[1rem] cursor-pointer fill-black stroke-black text-black dark:fill-white dark:stroke-white dark:text-white md:h-[1.25rem] md:w-[1.25rem]" />
           </label>
         </div>
-        <div className="accordion-group m-0 mb-[10px] flex w-[21.875rem] max-w-[550px] flex-col gap-10 md:w-[34.375rem]">
+        <div className="mx-auto w-full max-w-[550px] self-start px-2.5">
           <ProfileGroup
             type="receiver"
             name={receiverName}
             responserSize={responserCount?.size}
           />
+        </div>
+        <div className="accordion-group m-0 mb-[10px] flex w-[21.875rem] max-w-[550px] flex-col gap-10 md:w-[34.375rem]">
           {getReviewQuestion?.questions?.map((question) => (
             <AnswerGroup
               questionType={question?.type}
diff --git a/src/pages/CreatedReviewManagePage/components/ResponserTabReviewDetail/index.tsx b/src/pages/CreatedReviewManagePage/components/ResponserTabReviewDetail/index.tsx
index ff99c370..425a0a80 100644
--- a/src/pages/CreatedReviewManagePage/components/ResponserTabReviewDetail/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/ResponserTabReviewDetail/index.tsx
@@ -41,8 +41,8 @@ const ReceiverReviewDetail = ({
 
   return (
     <>
-      <label htmlFor="drawer" className="overlay"></label>
-      <div className="drawer drawer-bottom m-0 flex h-5/6 w-full  flex-col items-center gap-10 overflow-auto bg-main-ivory dark:bg-main-red-100 md:h-5/6">
+      <label className="overlay" htmlFor="drawer-bottom"></label>
+      <div className="drawer drawer-bottom m-0 flex h-[90%] w-full flex-col items-center gap-10 overflow-auto bg-main-ivory dark:bg-main-red-100 md:h-5/6">
         <div className="sticky top-0 z-50 flex h-[30px] w-full shrink-0 flex-col items-center justify-center bg-main-yellow dark:bg-main-red-200 sm:h-[40px]">
           <label
             htmlFor="drawer-bottom"
diff --git a/src/pages/CreatedReviewManagePage/components/SortDropDown/index.tsx b/src/pages/CreatedReviewManagePage/components/SortDropDown/index.tsx
index 07435fc5..0b90e7e2 100644
--- a/src/pages/CreatedReviewManagePage/components/SortDropDown/index.tsx
+++ b/src/pages/CreatedReviewManagePage/components/SortDropDown/index.tsx
@@ -18,33 +18,31 @@ const SortDropDown = ({
         <IconButton
           tabIndex={0}
           text="정렬"
-          className="
-        flex h-6 w-14 gap-0.5 rounded-none border-2 border-gray-200 bg-white p-0 text-xs dark:bg-main-gray dark:text-white"
+          className="flex h-6 w-14 gap-0.5 rounded-none border border-gray-200 bg-white p-0 text-xs dark:bg-main-gray dark:text-white"
         >
           <ReviewAlignIcon className="fill-black dark:fill-white" />
         </IconButton>
         <div
-          className="w-25 dropdown-menu dropdown-menu-bottom-left rounded-none border-2 bg-white
-        text-black dark:bg-black dark:text-white
-        "
+          className="dropdown-menu dropdown-menu-bottom-left w-28 rounded-none border bg-white
+        px-0 text-center text-black dark:bg-main-gray dark:text-white"
         >
           <a
             tabIndex={1}
-            className="dropdown-item w-full text-sm hover:bg-gray-200"
+            className="dropdown-item w-full text-sm hover:bg-main-yellow dark:hover:bg-gray-300"
             onClick={sortByName}
           >
             이름순
           </a>
           <a
             tabIndex={2}
-            className="dropdown-item w-full text-sm hover:bg-gray-200"
+            className="dropdown-item w-full text-sm hover:bg-main-yellow dark:hover:bg-gray-300"
             onClick={sortByNoResponse}
           >
             응답순
           </a>
           <a
             tabIndex={3}
-            className="dropdown-item w-full text-sm hover:bg-gray-200"
+            className="dropdown-item w-full text-sm hover:bg-main-yellow dark:hover:bg-gray-300"
             onClick={sortByResponse}
           >
             미응답순
diff --git a/src/pages/MainPage/components/EmptyReview/index.tsx b/src/pages/MainPage/components/EmptyReview/index.tsx
new file mode 100644
index 00000000..1544cc05
--- /dev/null
+++ b/src/pages/MainPage/components/EmptyReview/index.tsx
@@ -0,0 +1,12 @@
+import { AlertIcon } from '@/assets/icons'
+
+const EmptyReview = ({ message }: { message: string }) => {
+  return (
+    <div className="mx-auto mt-24 flex w-80 flex-col items-center justify-center gap-4">
+      <AlertIcon className="dark:fill-white md:h-8 md:w-8" />
+      <p className="text-base md:text-xl">{message}</p>
+    </div>
+  )
+}
+
+export default EmptyReview
diff --git a/src/pages/MainPage/components/InvitedReviewList/index.tsx b/src/pages/MainPage/components/InvitedReviewList/index.tsx
index 1fea964b..d8f67c3a 100644
--- a/src/pages/MainPage/components/InvitedReviewList/index.tsx
+++ b/src/pages/MainPage/components/InvitedReviewList/index.tsx
@@ -5,6 +5,7 @@ import { useGetInvitedReviews } from '@/apis/hooks'
 import { scrollToTop } from '@/utils'
 import { InvitedReview } from '@/types'
 import { ListSkeleton } from '..'
+import EmptyReview from '../EmptyReview'
 import InvitedReviewItem from './InvitedReviewItem'
 
 interface InvitedReviewListProps {
@@ -38,21 +39,25 @@ const InvitedReviewList = ({ handleClickReview }: InvitedReviewListProps) => {
     hasNextPage,
   })
 
-  return (
-    <>
-      <ul className="grid grid-cols-2 gap-8 sm:grid-cols-3 md:grid-cols-4 md:gap-10">
-        {reviews.map((review) => (
-          <InvitedReviewItem
-            handleClickReview={handleClickReview}
-            key={nanoid()}
-            {...review}
-          />
-        ))}
-        {isFetchingNextPage && <ListSkeleton />}
-        <div ref={ref}></div>
-      </ul>
-    </>
-  )
+  if (reviews.length) {
+    return (
+      <>
+        <ul className="grid grid-cols-2 gap-8 sm:grid-cols-3 md:grid-cols-4 md:gap-10">
+          {reviews.map((review) => (
+            <InvitedReviewItem
+              handleClickReview={handleClickReview}
+              key={nanoid()}
+              {...review}
+            />
+          ))}
+          {isFetchingNextPage && <ListSkeleton />}
+          <div ref={ref}></div>
+        </ul>
+      </>
+    )
+  }
+
+  return <EmptyReview message="초대받은 리뷰가 아직 없습니다. 😥" />
 }
 
 export default InvitedReviewList
diff --git a/src/pages/MainPage/components/ReceivedReviewList/index.tsx b/src/pages/MainPage/components/ReceivedReviewList/index.tsx
index 08f0bce3..f3888ca6 100644
--- a/src/pages/MainPage/components/ReceivedReviewList/index.tsx
+++ b/src/pages/MainPage/components/ReceivedReviewList/index.tsx
@@ -4,6 +4,7 @@ import { useInfiniteScroll } from '@/hooks'
 import { useGetReceivedReviews } from '@/apis/hooks'
 import { scrollToTop } from '@/utils'
 import { ReceivedReview } from '@/types'
+import EmptyReview from '../EmptyReview'
 import ListSkeleton from '../ListSkeleton'
 import ReceivedReviewItem from './ReceivedReviewItem'
 
@@ -31,21 +32,25 @@ const ReceivedReviewList = ({ handleClickReview }: ReceivedReviewListProps) => {
     hasNextPage,
   })
 
-  return (
-    <>
-      <ul className="grid grid-cols-2 gap-8 sm:grid-cols-3 md:grid-cols-4 md:gap-10">
-        {reviews.map((review) => (
-          <ReceivedReviewItem
-            handleClickReview={handleClickReview}
-            key={nanoid()}
-            {...review}
-          />
-        ))}
-        {isFetchingNextPage && <ListSkeleton />}
-        <div ref={ref}></div>
-      </ul>
-    </>
-  )
+  if (reviews.length) {
+    return (
+      <>
+        <ul className="grid grid-cols-2 gap-8 sm:grid-cols-3 md:grid-cols-4 md:gap-10">
+          {reviews.map((review) => (
+            <ReceivedReviewItem
+              handleClickReview={handleClickReview}
+              key={nanoid()}
+              {...review}
+            />
+          ))}
+          {isFetchingNextPage && <ListSkeleton />}
+          <div ref={ref}></div>
+        </ul>
+      </>
+    )
+  }
+
+  return <EmptyReview message="받은 리뷰 결과가 아직 없습니다. 😥" />
 }
 
 export default ReceivedReviewList
diff --git a/src/pages/MyPage/index.tsx b/src/pages/MyPage/index.tsx
index 1c6ed6d1..004e6b57 100644
--- a/src/pages/MyPage/index.tsx
+++ b/src/pages/MyPage/index.tsx
@@ -88,18 +88,23 @@ const MyPage = () => {
       <Header />
       <div className="flex h-full flex-col items-center gap-6 bg-main-ivory pt-28 dark:bg-main-red-100 md:pt-48">
         <div className="relative flex">
-          <div className="flex h-28 w-28 items-center justify-center overflow-hidden rounded-full border bg-white dark:bg-black">
+          <div
+            className="flex h-28 w-28 cursor-pointer items-center justify-center overflow-hidden rounded-full border bg-white dark:bg-black"
+            onClick={handleClickImageButton}
+          >
             {user?.path ? (
-              <div className="flex h-28 w-28 items-center justify-center overflow-hidden rounded-full p-1">
-                <img src={user?.path} alt="profile-image" />
-              </div>
+              <img
+                src={user?.path}
+                alt="profile-image"
+                className="h-full w-full"
+              />
             ) : (
               <BasicProfileIcon className="h-20 w-20" />
             )}
           </div>
           <div className="absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center rounded-full border bg-white dark:bg-main-red-200">
             <ImageIcon
-              className="z-10 h-4 w-4 cursor-pointer dark:stroke-white"
+              className="z-10 h-4 w-4 cursor-pointer dark:fill-white"
               onClick={handleClickImageButton}
             />
             <input
@@ -135,7 +140,7 @@ const MyPage = () => {
               </div>
               <div className="absolute -right-8 flex h-6 w-6 items-center justify-center rounded-full border bg-white dark:bg-main-red-200">
                 <EditIcon
-                  className="h-4 w-4 cursor-pointer dark:stroke-white"
+                  className="h-4 w-4 cursor-pointer dark:fill-white"
                   onClick={handleEditNameStartingClick}
                 />
               </div>
diff --git a/src/pages/ReviewCreatePage/components/QuestionItem/index.tsx b/src/pages/ReviewCreatePage/components/QuestionItem/index.tsx
index 3147bc00..13a0de6b 100644
--- a/src/pages/ReviewCreatePage/components/QuestionItem/index.tsx
+++ b/src/pages/ReviewCreatePage/components/QuestionItem/index.tsx
@@ -126,7 +126,7 @@ const QuestionItem = ({
               <li className="mb-2.5 w-full border border-gray-200 last:mb-0 dark:border-gray-100">
                 <div className="flex items-center pr-2.5">
                   <input
-                    className="grow p-2.5 text-sm text-black outline-none  placeholder:text-gray-100 dark:bg-main-gray dark:text-white md:text-base"
+                    className="grow bg-white p-2.5 text-sm text-black outline-none placeholder:text-gray-100 dark:bg-main-gray dark:text-white md:text-base"
                     placeholder={`옵션 ${optionIndex + 1}`}
                     {...register(
                       `questions.${index}.questionOptions.${optionIndex}.optionName`,
diff --git a/src/pages/ReviewReplyPage/components/QuestionItem/index.tsx b/src/pages/ReviewReplyPage/components/QuestionItem/index.tsx
index 385657f7..b1ff4da2 100644
--- a/src/pages/ReviewReplyPage/components/QuestionItem/index.tsx
+++ b/src/pages/ReviewReplyPage/components/QuestionItem/index.tsx
@@ -37,7 +37,7 @@ const QuestionItem = ({
         handleClickQuestion(e)
         checkReplyComplete && checkReplyComplete()
       }}
-      className={`flex h-9 w-9 shrink-0 items-center justify-center rounded-full border text-sm ${
+      className={`flex h-9 w-9 shrink-0 cursor-pointer items-center justify-center rounded-full border text-sm ${
         index === selectedQuestionIndex
           ? 'border-black bg-main-hover-yellow text-black dark:border-white dark:bg-main-red-300 dark:text-white'
           : 'border-gray-100 bg-white text-gray-300 dark:border-gray-300 dark:bg-main-red-200 dark:text-gray-100'
diff --git a/src/pages/ReviewReplyPage/components/ReceiverItem/index.tsx b/src/pages/ReviewReplyPage/components/ReceiverItem/index.tsx
index 6334ee4a..bae65240 100644
--- a/src/pages/ReviewReplyPage/components/ReceiverItem/index.tsx
+++ b/src/pages/ReviewReplyPage/components/ReceiverItem/index.tsx
@@ -31,7 +31,7 @@ const ReceiverItem = ({
         handleClickReceiver(e)
         checkReplyComplete && checkReplyComplete()
       }}
-      className={`flex h-fit shrink-0 items-center justify-center gap-2 rounded-md border px-2 
+      className={`flex h-fit shrink-0 cursor-pointer items-center justify-center gap-2 rounded-md border px-2 
               py-1.5
               ${
                 selectedReceiver.receiverId === receiverId
diff --git a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoice/index.tsx b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoice/index.tsx
index fe0cf560..e8818794 100644
--- a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoice/index.tsx
+++ b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoice/index.tsx
@@ -79,7 +79,7 @@ const ReplyChoice = ({
             key={option.optionId}
             value={option.optionId}
             onClick={handleClickOption}
-            className={`flex items-center justify-center gap-4 rounded-md border p-2.5 text-lg ${
+            className={`flex cursor-pointer items-center justify-center gap-4 rounded-md border p-2.5 text-lg ${
               selectedOptionId === option.optionId
                 ? 'border-sub-green bg-[#F1FFE7] text-black dark:bg-[rgba(81,156,23,0.20)] dark:text-white'
                 : 'border-gray-100 bg-white text-gray-200 dark:border-gray-200 dark:bg-main-red-200 dark:text-gray-100'
diff --git a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoices/index.tsx b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoices/index.tsx
index 61d41bec..9043242a 100644
--- a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoices/index.tsx
+++ b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyChoices/index.tsx
@@ -121,7 +121,7 @@ const ReplyChoices = ({
             key={option.optionId}
             value={option.optionId}
             onClick={handleClickOption}
-            className={`flex items-center justify-between gap-4 rounded-md border p-2.5 text-lg ${
+            className={`flex cursor-pointer items-center justify-between gap-4 rounded-md border p-2.5 text-lg ${
               selectedOptionIds.includes(option.optionId)
                 ? 'border-sub-green bg-[#F1FFE7] text-black dark:bg-[rgba(81,156,23,0.20)] dark:text-white'
                 : 'border-gray-100 bg-white text-gray-200 dark:border-gray-200 dark:bg-main-red-200 dark:text-gray-100'
diff --git a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyDropdown/index.tsx b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyDropdown/index.tsx
index 9e4aaf27..91dc7fc9 100644
--- a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyDropdown/index.tsx
+++ b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyDropdown/index.tsx
@@ -77,7 +77,7 @@ const ReplyChoice = ({
         {options.map((option) => {
           return (
             <option
-              className="text-md w-full bg-white"
+              className="text-md w-full bg-white dark:bg-main-gray"
               key={option.optionId}
               value={option.optionId}
             >
diff --git a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyRating/StarRatingList/index.tsx b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyRating/StarRatingList/index.tsx
index 64b988dd..69bdd5a5 100644
--- a/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyRating/StarRatingList/index.tsx
+++ b/src/pages/ReviewReplyPage/components/ReplyCategory/ReplyRating/StarRatingList/index.tsx
@@ -12,7 +12,7 @@ const StarRatingList = ({ handleClickStar, rates }: StarRatingListProps) => {
         <StarIcon
           className={`${
             rate ? 'fill-sub-yellow' : 'fill-gray-100'
-          } h-12 w-12 stroke-gray-200`}
+          } h-12 w-12 cursor-pointer stroke-gray-200`}
           onClick={() => handleClickStar(index)}
           key={index}
         />
diff --git a/src/pages/ReviewReplyPage/components/ReviewReplyStart/ReviewSelect.tsx b/src/pages/ReviewReplyPage/components/ReviewReplyStart/ReviewSelect.tsx
index ccc9e3d2..127bbe2c 100644
--- a/src/pages/ReviewReplyPage/components/ReviewReplyStart/ReviewSelect.tsx
+++ b/src/pages/ReviewReplyPage/components/ReviewReplyStart/ReviewSelect.tsx
@@ -1,6 +1,6 @@
 import { ChangeEvent, useState, Dispatch, SetStateAction } from 'react'
 import { SubmitHandler, useFieldArray, useFormContext } from 'react-hook-form'
-import { Profile, SearchBar } from '@/components'
+import { Profile, SearchBar, Dropdown } from '@/components'
 import { useUser } from '@/apis/hooks'
 import { CloseIcon } from '@/assets/icons'
 import { Question } from '@/types'
@@ -12,7 +12,6 @@ interface ReceiverSelectProps {
 }
 
 const ReceiverSelect = ({ setReviewStep, questions }: ReceiverSelectProps) => {
-  const [focus, setFocus] = useState<boolean>(false)
   const [name, setName] = useState<string>('')
   const { data: user } = useUser()
 
@@ -106,7 +105,6 @@ const ReceiverSelect = ({ setReviewStep, questions }: ReceiverSelectProps) => {
       'nonReceiverList',
       nonReceivers.sort((a, b) => a.receiverId - b.receiverId),
     )
-    setFocus(true)
   }
 
   const handleChangeName = (e: ChangeEvent<HTMLInputElement>) => {
@@ -120,44 +118,47 @@ const ReceiverSelect = ({ setReviewStep, questions }: ReceiverSelectProps) => {
   return (
     <div className="flex h-full flex-col justify-between pt-2.5">
       <div className="flex flex-col gap-5">
-        <div className="dropdown relative w-full">
-          <SearchBar
-            keyword={name}
-            placeholder="응답자 이름을 입력해주세요."
-            onFocus={handleInputFocus}
-            handleChangeKeyword={handleChangeName}
-            handleResetKeyword={handleResetName}
-            tabIndex={0}
-          />
-          {focus && (
-            <ul className="absolute z-10 flex max-h-[252px] w-full flex-col overflow-y-auto rounded-none border border-t-0 bg-white p-0 dark:bg-main-gray md:max-h-[258px]">
-              {nonReceivers.length > 0 ? (
-                nonReceivers
-                  .filter((nonReceiver) => nonReceiver.name.includes(name))
-                  .map((nonReceiver, index) => (
-                    <li
-                      onClick={() => {
-                        appendReceiver(nonReceiver)
-                        removeNonReceiver(index)
-                        clearErrors('receiverList')
-                        setFocus(false)
-                      }}
-                      key={nonReceiver.id}
-                      className={`${index !== 0 && 'border-t'} ${
-                        index != nonReceivers.length - 1 && 'border-b'
-                      } cursor-pointer border-gray-400 px-2.5 py-2.5 hover:bg-main-ivory dark:border-gray-300 dark:hover:bg-gray-300`}
-                    >
-                      <Profile name={nonReceiver.name} />
-                    </li>
-                  ))
-              ) : (
-                <p className="text-md flex h-[252px] items-center justify-center">
-                  더 이상 선택할 수 있는 유저가 없습니다.
-                </p>
-              )}
-            </ul>
-          )}
-        </div>
+        <Dropdown className="w-full">
+          <Dropdown.Toggle>
+            <SearchBar
+              keyword={name}
+              placeholder="응답자 이름을 입력해주세요."
+              onFocus={handleInputFocus}
+              handleChangeKeyword={handleChangeName}
+              handleResetKeyword={handleResetName}
+              tabIndex={0}
+            />
+          </Dropdown.Toggle>
+          <Dropdown.Menu className="absolute z-10 flex max-h-[252px] w-full flex-col overflow-y-auto rounded-none border border-t-0 bg-white p-0 dark:bg-main-gray md:max-h-[258px]">
+            {nonReceivers.length > 0 ? (
+              nonReceivers
+                .filter((nonReceiver) => nonReceiver.name.includes(name))
+                .map((nonReceiver, index) => (
+                  <Dropdown.Item
+                    key={nonReceiver.id}
+                    className={`${index !== 0 && 'border-t'} ${
+                      index != nonReceivers.length - 1 && 'border-b'
+                    } cursor-pointer border-gray-400 px-2.5 py-2.5 hover:bg-main-ivory dark:border-gray-300 dark:hover:bg-gray-300`}
+                    onClick={() => {
+                      const nonReceiverIndex = nonReceivers.findIndex(
+                        (target) => target === nonReceiver,
+                      )
+                      appendReceiver(nonReceiver)
+                      removeNonReceiver(nonReceiverIndex)
+                      clearErrors('receiverList')
+                      setName('')
+                    }}
+                  >
+                    <Profile name={nonReceiver.name} className="visible z-10" />
+                  </Dropdown.Item>
+                ))
+            ) : (
+              <Dropdown.Item className="text-md flex h-[252px] items-center justify-center">
+                {'더 이상 선택할 수 있는 유저가 없습니다.'}
+              </Dropdown.Item>
+            )}
+          </Dropdown.Menu>
+        </Dropdown>
 
         <div className="relative h-80 overflow-auto rounded-md border bg-main-yellow p-2.5 dark:bg-main-red-200">
           <ul className="flex flex-wrap justify-start gap-2.5">