diff --git a/src/features/reviews/api/review.ts b/src/features/reviews/api/review.ts
index 57650bf2..6304cf7f 100644
--- a/src/features/reviews/api/review.ts
+++ b/src/features/reviews/api/review.ts
@@ -22,6 +22,13 @@ export interface UserEvaluation {
   score: number;
 }
 
+export type AttractionType =
+  | "STORY"
+  | "CHARACTER"
+  | "DRAWING"
+  | "VOICE_ACTOR"
+  | "MUSIC";
+
 export default class ReviewApi {
   /** @description 리뷰 작성 요청 */
   async addReview(review: AddReviewDto): Promise<void> {
@@ -106,4 +113,29 @@ export default class ReviewApi {
   async getEvaluation(animeId: number) {
     return get<UserEvaluation>(`/ratings/${animeId}`);
   }
+
+  // 입덕 포인트
+
+  /** @description 입덕 포인트 남기기 */
+  async addAttractionPoint(
+    animeId: number,
+    attractionElements: AttractionType[],
+  ) {
+    return post(`/attraction-points`, {
+      animeId,
+      attractionElements,
+    });
+  }
+
+  /** @description 입덕 포인트 존재 여부 조회 */
+  async getUserAttractionPointStatus(animeId: number) {
+    return get<{ isAttractionPoint: boolean }>(`/attraction-points/${animeId}`);
+  }
+
+  /** @description 리뷰 수정 시 입덕 포인트 조회 */
+  async getUserAttractionPoint(animeId: number, name: string) {
+    return get<AttractionPoint>(`/short-reviews/attraction-points`, {
+      params: { animeId, name },
+    });
+  }
 }
diff --git a/src/features/reviews/api/reviewDev.ts b/src/features/reviews/api/reviewDev.ts
index eccb84a8..861476ec 100644
--- a/src/features/reviews/api/reviewDev.ts
+++ b/src/features/reviews/api/reviewDev.ts
@@ -10,7 +10,12 @@ import recentReviewMock1 from "./mock/recentReview1.json";
 import recentReviewMock2 from "./mock/recentReview2.json";
 import recentReviewMock3 from "./mock/recentReview3.json";
 import recentReviewOnlyOneMock from "./mock/recentReviewOnlyOne.json";
-import { AddReviewDto, ReviewInfo, UserEvaluation } from "./review";
+import {
+  AddReviewDto,
+  AttractionType,
+  ReviewInfo,
+  UserEvaluation,
+} from "./review";
 
 export default class ReviewDevApi {
   /** @description 리뷰 작성 요청*/
@@ -71,4 +76,27 @@ export default class ReviewDevApi {
   async getEvaluation(animeId: number) {
     return get<UserEvaluation>(`/ratings/${animeId}`);
   }
+
+  /** @description 입덕 포인트 남기기 */
+  async addAttractionPoint(
+    animeId: number,
+    attractionElements: AttractionType[],
+  ) {
+    return post(`/attraction-points`, {
+      animeId,
+      attractionElements,
+    });
+  }
+
+  /** @description 입덕 포인트 존재 여부 조회 */
+  async getUserAttractionPointStatus(animeId: number) {
+    return get<{ isAttractionPoint: boolean }>(`/attraction-points/${animeId}`);
+  }
+
+  /** @description 리뷰 수정 시 입덕 포인트 조회 */
+  async getUserAttractionPoint(animeId: number, name: string) {
+    return get<AttractionPoint>(`/short-reviews/attraction-points`, {
+      params: { animeId, name },
+    });
+  }
 }
diff --git a/src/features/reviews/components/ReviewCard/ReviewMoreButton.tsx b/src/features/reviews/components/ReviewCard/ReviewMoreButton.tsx
index db6ca630..934a1b96 100644
--- a/src/features/reviews/components/ReviewCard/ReviewMoreButton.tsx
+++ b/src/features/reviews/components/ReviewCard/ReviewMoreButton.tsx
@@ -9,6 +9,7 @@ import useSnackBar from "@/components/SnackBar/useSnackBar";
 import useToast from "@/components/Toast/useToast";
 import DropDownModal from "@/features/users/components/DropDownModal";
 import useDropDownModal from "@/features/users/components/DropDownModal/useDropDownModal";
+import useDebounce from "@/hooks/useDebounce";
 
 import useEvaluation from "../../hook/useEvaluation";
 import ShortReviewModal from "../ReviewRating/ShortReviewModal";
@@ -19,15 +20,6 @@ import {
   RatingContainer,
 } from "./ReviewMoreButton.style";
 
-// TODO: 서버에서 가져오기
-const USER_MOCK_ATTRACTION = {
-  character: true,
-  art: true,
-  story: false,
-  voiceActing: false,
-  sound: true,
-};
-
 interface ReviewMoreButtonProps {
   isMine: boolean;
   reviewId: number;
@@ -37,6 +29,8 @@ interface ReviewMoreButtonProps {
   score: number;
 }
 
+const DEBOUNCE_DELAY = 200;
+
 export default function ReviewMoreButton({
   isMine,
   reviewId,
@@ -62,7 +56,7 @@ export default function ReviewMoreButton({
     handleReviewModalToggle();
   };
 
-  const handleRate = (value: number) => {
+  const handleRate = useDebounce((value: number) => {
     evaluationMutation.mutate(
       { score: value },
       {
@@ -71,8 +65,7 @@ export default function ReviewMoreButton({
         },
       },
     );
-    console.log(value);
-  };
+  }, DEBOUNCE_DELAY);
 
   const handleReviewDeleteClick = () => console.log("리뷰삭제");
 
@@ -150,7 +143,6 @@ export default function ReviewMoreButton({
               animeId,
               content,
               isSpoiler,
-              ...USER_MOCK_ATTRACTION,
             }}
           >
             <MyRating>내 별점</MyRating>
diff --git a/src/features/reviews/components/ReviewRating/ShortReviewModal.tsx b/src/features/reviews/components/ReviewRating/ShortReviewModal.tsx
index 9a8843dc..d4352c57 100644
--- a/src/features/reviews/components/ReviewRating/ShortReviewModal.tsx
+++ b/src/features/reviews/components/ReviewRating/ShortReviewModal.tsx
@@ -1,8 +1,10 @@
 import { PropsWithChildren } from "react";
 
+import DeferredComponent from "@/components/DeferredComponent";
 import Modal from "@/components/Modal";
 import Textarea from "@/components/TextArea";
 
+import { ReviewInfo } from "../../api/review";
 import useReviewForm from "../../hook/useReviewForm";
 import AttractionPoint from "../AttractionPoint";
 
@@ -15,23 +17,16 @@ import {
 } from "./ShortReviewModal.style";
 import SpoilerCheckBox from "./SpoilerCheckBox";
 
-export interface MOCK_USER_REVIEW_DATA {
-  reviewId: number;
-  animeId: number;
-  content: string;
-  isSpoiler: boolean;
-  character: boolean;
-  art: boolean;
-  story: boolean;
-  voiceActing: boolean;
-  sound: boolean;
-}
+export type UserReview = Pick<
+  ReviewInfo,
+  "reviewId" | "animeId" | "content" | "isSpoiler"
+>;
 
 interface ShortReviewModalProps {
   onClose: () => void;
   onReview: () => void;
   showBackdrop?: boolean;
-  userReviewData?: MOCK_USER_REVIEW_DATA;
+  userReviewData?: UserReview;
 }
 
 export default function ShortReviewModal({
@@ -60,14 +55,14 @@ export default function ShortReviewModal({
       isChecked: form.character,
     },
     {
-      name: "art",
+      name: "drawing",
       content: (
         <>
           현실 찢고 들어간듯한/이쁜
           <strong style={{ marginLeft: 4 }}>그림체</strong>
         </>
       ),
-      isChecked: form.art,
+      isChecked: form.drawing,
     },
     {
       name: "story",
@@ -80,84 +75,91 @@ export default function ShortReviewModal({
       isChecked: form.story,
     },
     {
-      name: "voiceActing",
+      name: "voiceActor",
       content: (
         <>
           <strong>성우</strong>들의 미친 연기력
         </>
       ),
-      isChecked: form.voiceActing,
+      isChecked: form.voiceActor,
     },
     {
-      name: "sound",
+      name: "music",
       content: (
         <>
           가슴이 옹졸해지는 <strong style={{ marginLeft: 4 }}>음악</strong>
         </>
       ),
-      isChecked: form.sound,
+      isChecked: form.music,
     },
   ];
 
   return (
-    <Modal onClose={onClose} showBackdrop={showBackdrop}>
-      <Modal.Content>
-        <Title>한 줄 리뷰 모달</Title>
-        {children}
-        <ReviewContentSection>
-          <label htmlFor="content">작품에 대한 의견을 남겨주세요</label>
-          <Textarea
-            name="content"
-            placeholder="최대 100자 까지 입력 가능해요"
-            onChange={handleTextInputChange}
-            value={form.content}
-            warn={error}
-            message="최소 10자 이상 입력해 주세요."
-          />
-          <SpoilerCheckBox
-            name="isSpoiler"
-            checked={form.isSpoiler}
-            onChange={handleCheckboxChange}
-          />
-        </ReviewContentSection>
-        <AttractionPointSection>
-          <label htmlFor="attraction-point">
-            이 애니의 입덕포인트는 무엇인가요?
-          </label>
-          <p>
-            입덕 포인트 선택 시 <span>포인트</span>가 쌓여요!
-          </p>
-          <AttractionPointList>
-            {attractionPoints.map((point) => (
-              <li key={point.name}>
-                <AttractionPoint
-                  name={point.name}
-                  isChecked={point.isChecked}
-                  onChange={handleCheckboxChange}
-                >
-                  {point.content}
-                </AttractionPoint>
-              </li>
-            ))}
-          </AttractionPointList>
-        </AttractionPointSection>
-      </Modal.Content>
+    <DeferredComponent>
+      <Modal onClose={onClose} showBackdrop={showBackdrop}>
+        <Modal.Content>
+          <Title>한 줄 리뷰 모달</Title>
+          {children}
+          <ReviewContentSection>
+            <label htmlFor="content">작품에 대한 의견을 남겨주세요</label>
+            <Textarea
+              name="content"
+              placeholder="최대 100자 까지 입력 가능해요"
+              onChange={handleTextInputChange}
+              value={form.content}
+              warn={error}
+              message="최소 10자 이상 입력해 주세요."
+            />
+            <SpoilerCheckBox
+              name="isSpoiler"
+              checked={form.isSpoiler}
+              onChange={handleCheckboxChange}
+            />
+          </ReviewContentSection>
+          <AttractionPointSection>
+            <label htmlFor="attraction-point">
+              이 애니의 입덕포인트는 무엇인가요?
+            </label>
+            <p>
+              입덕 포인트 선택 시 <span>포인트</span>가 쌓여요!
+            </p>
+            <AttractionPointList>
+              {attractionPoints.map((point) => (
+                <li key={point.name}>
+                  <AttractionPoint
+                    name={point.name}
+                    isChecked={point.isChecked}
+                    onChange={handleCheckboxChange}
+                  >
+                    {point.content}
+                  </AttractionPoint>
+                </li>
+              ))}
+            </AttractionPointList>
+          </AttractionPointSection>
+        </Modal.Content>
 
-      <Modal.Actions direction="row">
-        <Button
-          name="닫기"
-          variant="solid"
-          color="neutral"
-          size="lg"
-          isBlock
-          onClick={onClose}
-        >
-          취소
-        </Button>
-        <Button name="평가 완료" isBlock size="lg" onClick={handleReviewSubmit}>
-          완료
-        </Button>
-      </Modal.Actions>
-    </Modal>
+        <Modal.Actions direction="row">
+          <Button
+            name="닫기"
+            variant="solid"
+            color="neutral"
+            size="lg"
+            isBlock
+            onClick={onClose}
+          >
+            취소
+          </Button>
+          <Button
+            name="평가 완료"
+            isBlock
+            size="lg"
+            onClick={handleReviewSubmit}
+          >
+            완료
+          </Button>
+        </Modal.Actions>
+      </Modal>
+    </DeferredComponent>
   );
 }
diff --git a/src/features/reviews/hook/useAttractionPoint.ts b/src/features/reviews/hook/useAttractionPoint.ts
new file mode 100644
index 00000000..5a190920
--- /dev/null
+++ b/src/features/reviews/hook/useAttractionPoint.ts
@@ -0,0 +1,53 @@
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { AxiosError } from "axios";
+
+import useAuth from "@/features/auth/hooks/useAuth";
+import { useApi } from "@/hooks/useApi";
+import { useCommonToastError } from "@/libs/error";
+
+import { AttractionType } from "../api/review";
+
+export default function useAttractionPoint(animeId: number) {
+  const { reviewApi } = useApi();
+  const { user } = useAuth();
+  const { toastAuthError, toastDefaultError } = useCommonToastError();
+  const queryClient = useQueryClient();
+
+  // 사용자가 남긴 입덕 포인트 조회
+  const { data: userAttraction } = useQuery({
+    queryKey: ["attraction", animeId, user?.name],
+    queryFn: () => reviewApi.getUserAttractionPoint(animeId, user?.name ?? ""),
+    enabled: Boolean(user?.name),
+  });
+
+  // 사용자의 입덕 포인트 존재 여부 조회
+  const { data: status } = useQuery({
+    queryKey: ["attraction", animeId, "status", user?.memberId],
+    queryFn: () => reviewApi.getUserAttractionPointStatus(animeId),
+  });
+
+  // 입덕 포인트 추가
+  const addAttraction = useMutation({
+    mutationFn: (attractions: AttractionType[]) =>
+      reviewApi.addAttractionPoint(animeId, attractions),
+    onSuccess: () => {
+      queryClient.invalidateQueries(["attraction", animeId]);
+      // TODO: 애니 입덕 포인트 통계 query 무효화
+    },
+    onError: (error) => {
+      if (error instanceof AxiosError && error.response?.status) {
+        const status = error.response.status;
+        switch (status) {
+          case 401:
+            toastAuthError();
+            break;
+          default:
+            toastDefaultError();
+            break;
+        }
+      }
+    },
+  });
+
+  return { userAttraction, status, addAttraction };
+}
diff --git a/src/features/reviews/hook/useReviewForm.tsx b/src/features/reviews/hook/useReviewForm.tsx
index cfa899a2..9f5f081e 100644
--- a/src/features/reviews/hook/useReviewForm.tsx
+++ b/src/features/reviews/hook/useReviewForm.tsx
@@ -1,16 +1,23 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { useLocation, useNavigate } from "react-router-dom";
 
 import useToast from "@/components/Toast/useToast";
 import useAuth from "@/features/auth/hooks/useAuth";
+import useDebounce from "@/hooks/useDebounce";
 
-import { MOCK_USER_REVIEW_DATA } from "../components/ReviewRating/ShortReviewModal";
+import { AttractionType } from "../api/review";
+import { UserReview } from "../components/ReviewRating/ShortReviewModal";
 
+import useAttractionPoint from "./useAttractionPoint";
 import useReview from "./useReview";
 
+type ReviewForm = Pick<UserReview, "content" | "isSpoiler"> & AttractionPoint;
+
+const DEBOUNCE_DELAY = 200;
+
 export default function useReviewForm(
   onReview: () => void,
-  userReviewData?: MOCK_USER_REVIEW_DATA,
+  userReviewData?: UserReview,
 ) {
   const { pathname } = useLocation();
   const navigate = useNavigate();
@@ -19,18 +26,31 @@ export default function useReviewForm(
   const { user } = useAuth();
   const { addReview, updateReview } = useReview(animeId, onReview);
 
+  const { userAttraction, addAttraction, status } = useAttractionPoint(animeId);
+
   const toast = useToast();
 
-  const [form, setForm] = useState({
+  const [form, setForm] = useState<ReviewForm>({
     content: userReviewData?.content ?? "",
     isSpoiler: userReviewData?.isSpoiler ?? false,
-    character: userReviewData?.character ?? false,
-    art: userReviewData?.art ?? false,
-    story: userReviewData?.story ?? false,
-    voiceActing: userReviewData?.voiceActing ?? false,
-    sound: userReviewData?.sound ?? false,
+    character: userAttraction?.character ?? false,
+    drawing: userAttraction?.drawing ?? false,
+    story: userAttraction?.story ?? false,
+    voiceActor: userAttraction?.voiceActor ?? false,
+    music: userAttraction?.music ?? false,
   });
 
+  useEffect(() => {
+    setForm((prev) => ({
+      ...prev,
+      character: userAttraction?.character ?? false,
+      drawing: userAttraction?.drawing ?? false,
+      story: userAttraction?.story ?? false,
+      voiceActor: userAttraction?.voiceActor ?? false,
+      music: userAttraction?.music ?? false,
+    }));
+  }, [userAttraction]);
+
   const [error, setError] = useState(false);
 
   const handleTextInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
@@ -50,7 +70,7 @@ export default function useReviewForm(
     }));
   };
 
-  const handleReviewSubmit = () => {
+  const handleReviewSubmit = useDebounce(() => {
     // 유효성 검사
     setError(false);
     if (form.content.trim().length < 10) {
@@ -58,13 +78,25 @@ export default function useReviewForm(
       return;
     }
 
-    // console.log(form);
-    console.log({
-      name: user?.name,
-      animeId,
-      isSpoiler: form.isSpoiler,
-      content: form.content,
-    });
+    // 체크한 입덕 포인트
+    const selectedAttraction = Object.keys(form)
+      .filter(
+        (key) =>
+          form[key as keyof ReviewForm] === true &&
+          !["content, isSpoiler"].includes(key),
+      )
+      .map((key) =>
+        key === "voiceActor" ? "VOICE_ACTOR" : key.toUpperCase(),
+      ) as AttractionType[];
+
+    console.log("입덕 포인트: ", selectedAttraction);
+
+    // 입덕 포인트 추가: 체크된 입덕 포인트가 있는 경우에만 요청
+    if (selectedAttraction.length !== 0 && !status?.isAttractionPoint) {
+      addAttraction.mutate(selectedAttraction);
+    }
+
+    // TODO: 입덕 포인트 수정
 
     // 리뷰 수정
     if (userReviewData) {
@@ -113,7 +145,7 @@ export default function useReviewForm(
         },
       );
     }
-  };
+  }, DEBOUNCE_DELAY);
 
   return {
     form,
diff --git a/src/features/reviews/types/index.d.ts b/src/features/reviews/types/index.d.ts
index 7a72bab6..0447c984 100644
--- a/src/features/reviews/types/index.d.ts
+++ b/src/features/reviews/types/index.d.ts
@@ -14,3 +14,11 @@ declare interface Review {
     avgScore: number;
   };
 }
+
+declare interface AttractionPoint {
+  drawing: boolean;
+  story: boolean;
+  music: boolean;
+  character: boolean;
+  voiceActor: boolean;
+}