From 5cd5b2f3472e85ed791991d0481533d324557718 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=AA=85=EC=9E=AC?= <arkk20000@gmail.com>
Date: Wed, 20 Sep 2023 03:26:10 +0900
Subject: [PATCH 1/6] =?UTF-8?q?ADD=20::=20=EC=97=86=EC=9D=8C=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../\352\265\220\352\263\274\354\204\261\354\240\201.tsx"   | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
index df832dc50..25b0c2d1c 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
@@ -23,9 +23,9 @@ const 교과성적 = ({ id }: Props) => {
             {achievementLevelsGroupList.map((group) => (
                 <교과성적Item
                     subjectName={group.subjectName}
-                    achievementLevel21={group.achievementLevels[0]}
-                    achievementLevel22={group.achievementLevels[1]}
-                    achievementLevel31={group.achievementLevels[2]}
+                    achievementLevel21={group.achievementLevels[0] || '없음'}
+                    achievementLevel22={group.achievementLevels[1] || '없음'}
+                    achievementLevel31={group.achievementLevels[2] || '없음'}
                 />
             ))}
         </Styled교과성적>

From 71f24f17ac517539658a17a21e9722add8b114d0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=AA=85=EC=9E=AC?= <arkk20000@gmail.com>
Date: Wed, 20 Sep 2023 03:36:56 +0900
Subject: [PATCH 2/6] =?UTF-8?q?ADD=20::=20=EC=B6=9C=EA=B2=B0=20=EC=83=81?=
 =?UTF-8?q?=ED=99=A9=20=ED=8E=98=EC=9D=B4=EC=A7=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ...0\352\263\274\354\204\261\354\240\201.tsx" |   7 +-
 .../\354\204\261\354\240\201.tsx"             |   2 +
 ...4\352\262\260\354\203\201\355\231\251.tsx" | 123 ++++++++++++++++++
 3 files changed, 127 insertions(+), 5 deletions(-)
 create mode 100644 "apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx"

diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
index 25b0c2d1c..7f146a75f 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
@@ -1,6 +1,5 @@
 import { useFormDetailQuery } from '@/services/form/queries';
 import getAchievementLevelsGroupList from '@/utils/functions/getAchievementLevelsGroupList';
-import styled from 'styled-components';
 import 교과성적Header from './교과성적Header/교과성적Header';
 import 교과성적Item from './교과성적Item/교과성적Item';
 
@@ -18,7 +17,7 @@ const 교과성적 = ({ id }: Props) => {
     console.log(achievementLevelsGroupList);
 
     return (
-        <Styled교과성적>
+        <div>
             <교과성적Header />
             {achievementLevelsGroupList.map((group) => (
                 <교과성적Item
@@ -28,10 +27,8 @@ const 교과성적 = ({ id }: Props) => {
                     achievementLevel31={group.achievementLevels[2] || '없음'}
                 />
             ))}
-        </Styled교과성적>
+        </div>
     );
 };
 
 export default 교과성적;
-
-const Styled교과성적 = styled.div``;
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
index 1388f64a5..0a4f35b22 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
@@ -4,6 +4,7 @@ import { Column, Row } from '@maru/ui';
 import { SwitchCase } from '@toss/react';
 import { useState } from 'react';
 import 교과성적 from './교과성적/교과성적';
+import 출결상황 from './출결상황/출결상황';
 
 interface Props {
     id: number;
@@ -27,6 +28,7 @@ const 성적 = ({ id }: Props) => {
                 value={currentGraduationStep}
                 caseBy={{
                     '교과 성적': <교과성적 id={id} />,
+                    '출결 상황': <출결상황 id={id} />,
                 }}
             />
         </Row>
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx"
new file mode 100644
index 000000000..707ff8b99
--- /dev/null
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx"
@@ -0,0 +1,123 @@
+import { useFormDetailQuery } from '@/services/form/queries';
+import { CellInput, Column, Row, Td, Th } from '@maru/ui';
+
+interface Props {
+    id: number;
+}
+
+const 출결상황 = ({ id }: Props) => {
+    const { data: formDetailData } = useFormDetailQuery(id);
+
+    return (
+        <div>
+            <Column>
+                <Row>
+                    <Th width={140} height={56} borderTopLeftRadius={12}>
+                        학년
+                    </Th>
+                    <Th width={140} height={56}>
+                        미인정 결석
+                    </Th>
+                    <Th width={140} height={56}>
+                        미인정 지각
+                    </Th>
+                    <Th width={140} height={56}>
+                        미인정 조퇴
+                    </Th>
+                    <Th width={140} height={56} borderTopRightRadius={12}>
+                        미인정 결과
+                    </Th>
+                </Row>
+                <Row>
+                    <Td option="SECONDARY" width={140} height={56}>
+                        1학년
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance1.absenceCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance1.latenessCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance1.earlyLeaveCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance1.classAbsenceCount}
+                            readOnly
+                        />
+                    </Td>
+                </Row>
+                <Row>
+                    <Td option="SECONDARY" width={140} height={56}>
+                        2학년
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance2.absenceCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance2.latenessCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance2.earlyLeaveCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance2.classAbsenceCount}
+                            readOnly
+                        />
+                    </Td>
+                </Row>
+                <Row>
+                    <Td option="SECONDARY" width={140} height={56} borderBottomLeftRadius={12}>
+                        3학년
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance3.absenceCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance3.latenessCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance3.earlyLeaveCount}
+                            readOnly
+                        />
+                    </Td>
+                    <Td width={140} height={56}>
+                        <CellInput
+                            value={formDetailData?.grade.attendance3.classAbsenceCount}
+                            readOnly
+                        />
+                    </Td>
+                </Row>
+            </Column>
+        </div>
+    );
+};
+
+export default 출결상황;

From bb87d01f53cfdb7abbeb1bc25fea27b903f2340e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=AA=85=EC=9E=AC?= <arkk20000@gmail.com>
Date: Wed, 20 Sep 2023 03:43:53 +0900
Subject: [PATCH 3/6] =?UTF-8?q?ADD=20::=20=EB=B4=89=EC=82=AC=20=EC=8B=9C?=
 =?UTF-8?q?=EA=B0=84=20=ED=8E=98=EC=9D=B4=EC=A7=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ...1\354\202\254\354\213\234\352\260\204.tsx" | 60 +++++++++++++++++++
 .../\354\204\261\354\240\201.tsx"             |  2 +
 2 files changed, 62 insertions(+)
 create mode 100644 "apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\353\264\211\354\202\254\354\213\234\352\260\204/\353\264\211\354\202\254\354\213\234\352\260\204.tsx"

diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\353\264\211\354\202\254\354\213\234\352\260\204/\353\264\211\354\202\254\354\213\234\352\260\204.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\353\264\211\354\202\254\354\213\234\352\260\204/\353\264\211\354\202\254\354\213\234\352\260\204.tsx"
new file mode 100644
index 000000000..40378827b
--- /dev/null
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\353\264\211\354\202\254\354\213\234\352\260\204/\353\264\211\354\202\254\354\213\234\352\260\204.tsx"
@@ -0,0 +1,60 @@
+import { useFormDetailQuery } from '@/services/form/queries';
+import { color, font } from '@maru/theme';
+import { CellInput, Column, Row, Td, Th } from '@maru/ui';
+import { styled } from 'styled-components';
+
+interface Props {
+    id: number;
+}
+
+const 봉사시간 = ({ id }: Props) => {
+    const { data: formDetailData } = useFormDetailQuery(id);
+
+    return (
+        <Column>
+            <Row>
+                <Th borderTopLeftRadius={12} width={162} height={56}>
+                    학년
+                </Th>
+                <Th borderTopRightRadius={12} width={318} height={56}>
+                    봉사시간
+                </Th>
+            </Row>
+            <Row>
+                <Td width={162} height={56} option="SECONDARY">
+                    1학년
+                </Td>
+                <Td width={318} height={56}>
+                    <CellInput value={formDetailData?.grade.volunteerTime1} readOnly />
+                    <Hour>시간</Hour>
+                </Td>
+            </Row>
+            <Row>
+                <Td width={162} height={56} option="SECONDARY">
+                    2학년
+                </Td>
+                <Td width={318} height={56}>
+                    <CellInput value={formDetailData?.grade.volunteerTime2} readOnly />
+                    <Hour>시간</Hour>
+                </Td>
+            </Row>
+            <Row>
+                <Td borderBottomLeftRadius={12} width={162} height={56} option="SECONDARY">
+                    3학년
+                </Td>
+                <Td borderBottomRightRadius={12} width={318} height={56}>
+                    <CellInput value={formDetailData?.grade.volunteerTime3} readOnly />
+                    <Hour>시간</Hour>
+                </Td>
+            </Row>
+        </Column>
+    );
+};
+
+export default 봉사시간;
+
+const Hour = styled.p`
+    ${font.p2}
+    color: ${color.gray900};
+    margin-left: 8px;
+`;
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
index 0a4f35b22..2050eda6a 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
@@ -4,6 +4,7 @@ import { Column, Row } from '@maru/ui';
 import { SwitchCase } from '@toss/react';
 import { useState } from 'react';
 import 교과성적 from './교과성적/교과성적';
+import 봉사시간 from './봉사시간/봉사시간';
 import 출결상황 from './출결상황/출결상황';
 
 interface Props {
@@ -29,6 +30,7 @@ const 성적 = ({ id }: Props) => {
                 caseBy={{
                     '교과 성적': <교과성적 id={id} />,
                     '출결 상황': <출결상황 id={id} />,
+                    '봉사 시간': <봉사시간 id={id} />,
                 }}
             />
         </Row>

From 0e41b7f342ab3e7e23f01576037b2135455f2d02 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=AA=85=EC=9E=AC?= <arkk20000@gmail.com>
Date: Wed, 20 Sep 2023 10:48:08 +0900
Subject: [PATCH 4/6] =?UTF-8?q?ADD=20::=20=EB=BA=84=20=EC=88=98=20?=
 =?UTF-8?q?=EC=9E=88=EB=8A=94=20=EC=BD=94=EB=93=9C=20=EC=A0=9C=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ...0\352\263\274\354\204\261\354\240\201.tsx" |   5 +-
 ...263\274\354\204\261\354\240\201Header.tsx" |  51 +++--
 ...4\352\262\260\354\203\201\355\231\251.tsx" | 187 ++++++++----------
 3 files changed, 105 insertions(+), 138 deletions(-)

diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
index 7f146a75f..ca90fffea 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201.tsx"
@@ -1,5 +1,6 @@
 import { useFormDetailQuery } from '@/services/form/queries';
 import getAchievementLevelsGroupList from '@/utils/functions/getAchievementLevelsGroupList';
+import { Column } from '@maru/ui';
 import 교과성적Header from './교과성적Header/교과성적Header';
 import 교과성적Item from './교과성적Item/교과성적Item';
 
@@ -17,7 +18,7 @@ const 교과성적 = ({ id }: Props) => {
     console.log(achievementLevelsGroupList);
 
     return (
-        <div>
+        <Column>
             <교과성적Header />
             {achievementLevelsGroupList.map((group) => (
                 <교과성적Item
@@ -27,7 +28,7 @@ const 교과성적 = ({ id }: Props) => {
                     achievementLevel31={group.achievementLevels[2] || '없음'}
                 />
             ))}
-        </div>
+        </Column>
     );
 };
 
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201Header/\352\265\220\352\263\274\354\204\261\354\240\201Header.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201Header/\352\265\220\352\263\274\354\204\261\354\240\201Header.tsx"
index ad28edce7..64a37c244 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201Header/\352\265\220\352\263\274\354\204\261\354\240\201Header.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201/\352\265\220\352\263\274\354\204\261\354\240\201Header/\352\265\220\352\263\274\354\204\261\354\240\201Header.tsx"
@@ -1,39 +1,34 @@
 import { Column, Row, Th } from '@maru/ui';
-import styled from 'styled-components';
 
 const 교과성적Header = () => {
     return (
-        <Styled교과성적Header>
-            <Row>
-                <Th width={123} height={100} borderTopLeftRadius={12}>
-                    과목
+        <Row>
+            <Th width={123} height={100} borderTopLeftRadius={12}>
+                과목
+            </Th>
+            <Column>
+                <Th width={279} height={50}>
+                    2학년
                 </Th>
-                <Column>
-                    <Th width={279} height={50}>
-                        2학년
-                    </Th>
-                    <Row>
-                        <Th option="SECONDARY" width="50%" height={50}>
-                            1학기
-                        </Th>
-                        <Th option="SECONDARY" width="50%" height={50}>
-                            2학기
-                        </Th>
-                    </Row>
-                </Column>
-                <Column>
-                    <Th width={140} height={50} borderTopRightRadius={12}>
-                        3학년
-                    </Th>
-                    <Th option="SECONDARY" width={140} height={50}>
+                <Row>
+                    <Th option="SECONDARY" width="50%" height={50}>
                         1학기
                     </Th>
-                </Column>
-            </Row>
-        </Styled교과성적Header>
+                    <Th option="SECONDARY" width="50%" height={50}>
+                        2학기
+                    </Th>
+                </Row>
+            </Column>
+            <Column>
+                <Th width={140} height={50} borderTopRightRadius={12}>
+                    3학년
+                </Th>
+                <Th option="SECONDARY" width={140} height={50}>
+                    1학기
+                </Th>
+            </Column>
+        </Row>
     );
 };
 
 export default 교과성적Header;
-
-const Styled교과성적Header = styled.div``;
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx"
index 707ff8b99..0dfbe1f38 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\266\234\352\262\260\354\203\201\355\231\251/\354\266\234\352\262\260\354\203\201\355\231\251.tsx"
@@ -9,114 +9,85 @@ const 출결상황 = ({ id }: Props) => {
     const { data: formDetailData } = useFormDetailQuery(id);
 
     return (
-        <div>
-            <Column>
-                <Row>
-                    <Th width={140} height={56} borderTopLeftRadius={12}>
-                        학년
-                    </Th>
-                    <Th width={140} height={56}>
-                        미인정 결석
-                    </Th>
-                    <Th width={140} height={56}>
-                        미인정 지각
-                    </Th>
-                    <Th width={140} height={56}>
-                        미인정 조퇴
-                    </Th>
-                    <Th width={140} height={56} borderTopRightRadius={12}>
-                        미인정 결과
-                    </Th>
-                </Row>
-                <Row>
-                    <Td option="SECONDARY" width={140} height={56}>
-                        1학년
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance1.absenceCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance1.latenessCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance1.earlyLeaveCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance1.classAbsenceCount}
-                            readOnly
-                        />
-                    </Td>
-                </Row>
-                <Row>
-                    <Td option="SECONDARY" width={140} height={56}>
-                        2학년
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance2.absenceCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance2.latenessCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance2.earlyLeaveCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance2.classAbsenceCount}
-                            readOnly
-                        />
-                    </Td>
-                </Row>
-                <Row>
-                    <Td option="SECONDARY" width={140} height={56} borderBottomLeftRadius={12}>
-                        3학년
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance3.absenceCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance3.latenessCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance3.earlyLeaveCount}
-                            readOnly
-                        />
-                    </Td>
-                    <Td width={140} height={56}>
-                        <CellInput
-                            value={formDetailData?.grade.attendance3.classAbsenceCount}
-                            readOnly
-                        />
-                    </Td>
-                </Row>
-            </Column>
-        </div>
+        <Column>
+            <Row>
+                <Th width={140} height={56} borderTopLeftRadius={12}>
+                    학년
+                </Th>
+                <Th width={140} height={56}>
+                    미인정 결석
+                </Th>
+                <Th width={140} height={56}>
+                    미인정 지각
+                </Th>
+                <Th width={140} height={56}>
+                    미인정 조퇴
+                </Th>
+                <Th width={140} height={56} borderTopRightRadius={12}>
+                    미인정 결과
+                </Th>
+            </Row>
+            <Row>
+                <Td option="SECONDARY" width={140} height={56}>
+                    1학년
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance1.absenceCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance1.latenessCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance1.earlyLeaveCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput
+                        value={formDetailData?.grade.attendance1.classAbsenceCount}
+                        readOnly
+                    />
+                </Td>
+            </Row>
+            <Row>
+                <Td option="SECONDARY" width={140} height={56}>
+                    2학년
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance2.absenceCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance2.latenessCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance2.earlyLeaveCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput
+                        value={formDetailData?.grade.attendance2.classAbsenceCount}
+                        readOnly
+                    />
+                </Td>
+            </Row>
+            <Row>
+                <Td option="SECONDARY" width={140} height={56} borderBottomLeftRadius={12}>
+                    3학년
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance3.absenceCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance3.latenessCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput value={formDetailData?.grade.attendance3.earlyLeaveCount} readOnly />
+                </Td>
+                <Td width={140} height={56}>
+                    <CellInput
+                        value={formDetailData?.grade.attendance3.classAbsenceCount}
+                        readOnly
+                    />
+                </Td>
+            </Row>
+        </Column>
     );
 };
 

From f64d04f5f95ad377b590a9ee57791cf1952989d4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=AA=85=EC=9E=AC?= <arkk20000@gmail.com>
Date: Wed, 20 Sep 2023 12:48:36 +0900
Subject: [PATCH 5/6] =?UTF-8?q?ADD=20::=20=EC=9E=90=EA=B2=A9=EC=A6=9D=20?=
 =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FormStatus/FormStatus.tsx                 |  2 +-
 .../\354\204\261\354\240\201.tsx"             |  2 +
 .../\354\236\220\352\262\251\354\246\235.tsx" | 98 +++++++++++++++++++
 3 files changed, 101 insertions(+), 1 deletion(-)
 create mode 100644 "apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx"

diff --git a/apps/admin/src/components/form/FormDetailContent/FormStatus/FormStatus.tsx b/apps/admin/src/components/form/FormDetailContent/FormStatus/FormStatus.tsx
index 945837b4f..fb9e3767c 100644
--- a/apps/admin/src/components/form/FormDetailContent/FormStatus/FormStatus.tsx
+++ b/apps/admin/src/components/form/FormDetailContent/FormStatus/FormStatus.tsx
@@ -77,7 +77,7 @@ const FormStatus = ({ id }: Props) => {
                 </Row>
             </FormStatusBox>
             <Column gap={8}>
-                <Button size="SMALL">원서 상태 변경하기</Button>
+                <Button size="SMALL">최종 접수 상태 변경하기</Button>
                 <Button size="SMALL" option="SECONDARY">
                     제출 서류 조회하기
                 </Button>
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
index 2050eda6a..d48c784d6 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\204\261\354\240\201.tsx"
@@ -5,6 +5,7 @@ import { SwitchCase } from '@toss/react';
 import { useState } from 'react';
 import 교과성적 from './교과성적/교과성적';
 import 봉사시간 from './봉사시간/봉사시간';
+import 자격증 from './자격증/자격증';
 import 출결상황 from './출결상황/출결상황';
 
 interface Props {
@@ -31,6 +32,7 @@ const 성적 = ({ id }: Props) => {
                     '교과 성적': <교과성적 id={id} />,
                     '출결 상황': <출결상황 id={id} />,
                     '봉사 시간': <봉사시간 id={id} />,
+                    자격증: <자격증 id={id} />,
                 }}
             />
         </Row>
diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx"
new file mode 100644
index 000000000..53e94047c
--- /dev/null
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx"
@@ -0,0 +1,98 @@
+import { useFormDetailQuery } from '@/services/form/queries';
+import { CheckBox, Column, Row, Td, Th } from '@maru/ui';
+
+interface Props {
+    id: number;
+}
+
+const 자격증 = ({ id }: Props) => {
+    const { data: formDetailData } = useFormDetailQuery(id);
+
+    const is기능사included =
+        formDetailData?.grade.certificateList.includes('CRAFTSMAN_INFORMATION_PROCESSING') ||
+        formDetailData?.grade.certificateList.includes(
+            'CRAFTSMAN_INFORMATION_EQUIPMENT_OPERATION',
+        ) ||
+        formDetailData?.grade.certificateList.includes('CRAFTSMAN_COMPUTER');
+
+    return (
+        <Column>
+            <Row>
+                <Th width={416} height={56}>
+                    자격증명
+                </Th>
+                <Th width={200} height={56}>
+                    시행기관
+                </Th>
+                <Th width={120} height={56}>
+                    반영점수
+                </Th>
+                <Th width={80} height={56}>
+                    선택
+                </Th>
+            </Row>
+            <Row>
+                <Td width={416} height={56}>
+                    정보처리기능사, 정보기기운용기능사, 전자계산기기능사
+                </Td>
+                <Td width={200} height={56}>
+                    한국산업인력공단
+                </Td>
+                <Td width={120} height={56}>
+                    4점
+                </Td>
+                <Td width={80} height={56}>
+                    <CheckBox checked={is기능사included} />
+                </Td>
+            </Row>
+            <Row>
+                <Td width={416} height={168}>
+                    컴퓨터활용능력
+                </Td>
+                <Td width={200} height={168}>
+                    한국산업인력공단
+                </Td>
+                <Column>
+                    <Row>
+                        <Td width={120} height={56}>
+                            1급(3점)
+                        </Td>
+                        <Td width={80} height={56}>
+                            <CheckBox
+                                checked={formDetailData?.grade.certificateList.includes(
+                                    'COMPUTER_SPECIALIST_LEVEL_1',
+                                )}
+                            />
+                        </Td>
+                    </Row>
+                    <Row>
+                        <Td width={120} height={56}>
+                            2급(2점)
+                        </Td>
+                        <Td width={80} height={56}>
+                            <CheckBox
+                                checked={formDetailData?.grade.certificateList.includes(
+                                    'COMPUTER_SPECIALIST_LEVEL_2',
+                                )}
+                            />
+                        </Td>
+                    </Row>
+                    <Row>
+                        <Td width={120} height={56}>
+                            3급(1점)
+                        </Td>
+                        <Td width={80} height={56}>
+                            <CheckBox
+                                checked={formDetailData?.grade.certificateList.includes(
+                                    'COMPUTER_SPECIALIST_LEVEL_3',
+                                )}
+                            />
+                        </Td>
+                    </Row>
+                </Column>
+            </Row>
+        </Column>
+    );
+};
+
+export default 자격증;

From 04bfccfbefd4d3c82c11a37f51b8c3d7ecda53c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EB=AA=85=EC=9E=AC?= <arkk20000@gmail.com>
Date: Wed, 20 Sep 2023 15:40:22 +0900
Subject: [PATCH 6/6] =?UTF-8?q?ADD=20::=20=EC=9E=90=EA=B2=A9=EC=A6=9D=20?=
 =?UTF-8?q?=EB=9D=BC=EC=9A=B4=EB=93=9C,=20SearchInput?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../\354\236\220\352\262\251\354\246\235.tsx"             | 8 ++++----
 packages/maru-ui/src/Input/SearchInput.tsx                | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx" "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx"
index 53e94047c..fb916a3d0 100644
--- "a/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx"
+++ "b/apps/admin/src/components/form/FormDetailContent/\354\204\261\354\240\201/\354\236\220\352\262\251\354\246\235/\354\236\220\352\262\251\354\246\235.tsx"
@@ -18,7 +18,7 @@ const 자격증 = ({ id }: Props) => {
     return (
         <Column>
             <Row>
-                <Th width={416} height={56}>
+                <Th width={416} height={56} borderTopLeftRadius={12}>
                     자격증명
                 </Th>
                 <Th width={200} height={56}>
@@ -27,7 +27,7 @@ const 자격증 = ({ id }: Props) => {
                 <Th width={120} height={56}>
                     반영점수
                 </Th>
-                <Th width={80} height={56}>
+                <Th width={80} height={56} borderTopRightRadius={12}>
                     선택
                 </Th>
             </Row>
@@ -46,7 +46,7 @@ const 자격증 = ({ id }: Props) => {
                 </Td>
             </Row>
             <Row>
-                <Td width={416} height={168}>
+                <Td width={416} height={168} borderBottomLeftRadius={12}>
                     컴퓨터활용능력
                 </Td>
                 <Td width={200} height={168}>
@@ -81,7 +81,7 @@ const 자격증 = ({ id }: Props) => {
                         <Td width={120} height={56}>
                             3급(1점)
                         </Td>
-                        <Td width={80} height={56}>
+                        <Td width={80} height={56} borderBottomRightRadius={12}>
                             <CheckBox
                                 checked={formDetailData?.grade.certificateList.includes(
                                     'COMPUTER_SPECIALIST_LEVEL_3',
diff --git a/packages/maru-ui/src/Input/SearchInput.tsx b/packages/maru-ui/src/Input/SearchInput.tsx
index 02505ab36..98bd43400 100644
--- a/packages/maru-ui/src/Input/SearchInput.tsx
+++ b/packages/maru-ui/src/Input/SearchInput.tsx
@@ -30,7 +30,7 @@ const SearchInput = ({
 export default SearchInput;
 
 const StyledSearchInput = styled.div`
-    ${flex({ alignItems: 'center' })}
+    ${flex({ alignItems: 'center', justifyContent: 'space-between' })}
     height: 40px;
     padding: 0 12px 0 16px;
     background-color: ${color.white};