diff --git a/src/Detail/components/BigLecueNote/BigLecueNote.style.ts b/src/Detail/components/BigLecueNote/BigLecueNote.style.ts
index a2ba5cc3..7ceb8c38 100644
--- a/src/Detail/components/BigLecueNote/BigLecueNote.style.ts
+++ b/src/Detail/components/BigLecueNote/BigLecueNote.style.ts
@@ -2,7 +2,7 @@ import styled from '@emotion/styled';
 
 export const BigLecueNoteWrapper = styled.div<{
   noteBackground: string;
-  noteTextColor: number;
+  noteTextColor: string;
 }>`
   width: 100%;
   height: 34.2rem;
diff --git a/src/Detail/components/BigLecueNote/index.tsx b/src/Detail/components/BigLecueNote/index.tsx
index 9fa75b7f..fc207d7d 100644
--- a/src/Detail/components/BigLecueNote/index.tsx
+++ b/src/Detail/components/BigLecueNote/index.tsx
@@ -4,7 +4,7 @@ interface BigLecueNoteProps {
   content: string;
   noteDate: string;
   noteNickname: string;
-  noteTextColor: number;
+  noteTextColor: string;
   noteBackground: string;
 }
 
diff --git a/src/Detail/components/LecueNoteModal/LecueNoteModal.style.ts b/src/Detail/components/LecueNoteModal/LecueNoteModal.style.ts
index 78e958f6..aa2d9ad6 100644
--- a/src/Detail/components/LecueNoteModal/LecueNoteModal.style.ts
+++ b/src/Detail/components/LecueNoteModal/LecueNoteModal.style.ts
@@ -16,7 +16,7 @@ export const BlurryContainer = styled.div`
 
 export const LecueNoteModalWrapper = styled.div<{
   noteBackground?: string;
-  noteTextColor: number;
+  noteTextColor: string;
 }>`
   position: relative;
 
@@ -33,13 +33,8 @@ export const LecueNoteModalWrapper = styled.div<{
     }
   }};
   background-size: cover;
-  color: ${({ theme, noteTextColor }) => {
-    switch (noteTextColor) {
-      case 0:
-        return theme.colors.white;
-      case 1:
-        return theme.colors.BG;
-    }
+  color: ${({ noteTextColor }) => {
+    return noteTextColor;
   }};
 `;
 
diff --git a/src/Detail/components/LecueNoteModal/index.tsx b/src/Detail/components/LecueNoteModal/index.tsx
index 62df547a..10ab70db 100644
--- a/src/Detail/components/LecueNoteModal/index.tsx
+++ b/src/Detail/components/LecueNoteModal/index.tsx
@@ -8,7 +8,7 @@ const modalContainer = document.getElementById(
 ) as HTMLElement;
 
 interface LecueNoteModalProps {
-  selectedNote: NoteType | undefined;
+  selectedNote: NoteType;
   closeModal: () => void;
 }
 
@@ -22,21 +22,21 @@ function LecueNoteModal({ selectedNote, closeModal }: LecueNoteModalProps) {
   return createPortal(
     <S.BlurryContainer>
       <S.LecueNoteModalWrapper
-        noteBackground={selectedNote?.noteBackground}
-        noteTextColor={selectedNote?.noteTextColor || 0}
+        noteBackground={selectedNote.noteBackground}
+        noteTextColor={selectedNote.noteTextColor}
       >
         <S.CloseButton type="button" onClick={handleCloseButtonClick}>
           <IcX />
         </S.CloseButton>
         <S.LecueNoteModalNickname>
-          {selectedNote?.noteNickname}
+          {selectedNote.noteNickname}
         </S.LecueNoteModalNickname>
         <S.LecueNoteModalContentWrapper>
           <S.LecueNoteModalContent>
-            {selectedNote?.content}
+            {selectedNote.content}
           </S.LecueNoteModalContent>
         </S.LecueNoteModalContentWrapper>
-        <S.LecueNoteModalDate>{selectedNote?.noteDate}</S.LecueNoteModalDate>
+        <S.LecueNoteModalDate>{selectedNote.noteDate}</S.LecueNoteModalDate>
       </S.LecueNoteModalWrapper>
     </S.BlurryContainer>,
     modalContainer,
diff --git a/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts b/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts
index 058a8c51..cf67e523 100644
--- a/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts
+++ b/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts
@@ -2,7 +2,7 @@ import styled from '@emotion/styled';
 
 export const SmallLecueNoteWrapper = styled.div<{
   renderType: number;
-  noteTextColor: number;
+  noteTextColor: string;
   noteBackground: string;
 }>`
   width: 15.2rem;
diff --git a/src/Detail/components/SmallLecueNote/index.tsx b/src/Detail/components/SmallLecueNote/index.tsx
index 0733623f..87db9ae5 100644
--- a/src/Detail/components/SmallLecueNote/index.tsx
+++ b/src/Detail/components/SmallLecueNote/index.tsx
@@ -9,7 +9,7 @@ interface SmallLecueNoteProps {
   content: string;
   noteDate: string;
   noteNickname: string;
-  noteTextColor: number;
+  noteTextColor: string;
   noteBackground: string;
   noteId: number;
   noteList: NoteType[];
@@ -27,7 +27,8 @@ function SmallLecueNote({
 }: SmallLecueNoteProps) {
   const [modalShow, setModalShow] = useState(false);
 
-  const getClickedNote = () => noteList.find((note) => note.noteId === noteId);
+  const getClickedNote = () =>
+    noteList.filter((note) => note.noteId === noteId);
 
   const handleClickSmallLecueNote = () => {
     const clickedNote = getClickedNote();
@@ -50,7 +51,7 @@ function SmallLecueNote({
       <S.SmallLecueNoteDate>{noteDate}</S.SmallLecueNoteDate>
       {modalShow && (
         <LecueNoteModal
-          selectedNote={getClickedNote()}
+          selectedNote={getClickedNote()[0]}
           closeModal={() => setModalShow(false)}
         />
       )}
diff --git a/src/Detail/type/lecueBookType.ts b/src/Detail/type/lecueBookType.ts
index 5b602421..a945977a 100644
--- a/src/Detail/type/lecueBookType.ts
+++ b/src/Detail/type/lecueBookType.ts
@@ -11,6 +11,6 @@ export interface NoteType {
   content: string;
   noteDate: string;
   noteNickname: string;
-  noteTextColor: number;
+  noteTextColor: string;
   noteBackground: string;
 }