diff --git a/README.md b/README.md
index fa9348d6..d23b7673 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,2 @@
-13기 프론트엔드 개인 스프린트 미션1
-제출일 12월 3일
+코드잇 프론트 엔드 13기 유선향 스프린트 미션 3입니다.
+제출일 12월 27일
diff --git a/color.css b/color.css
new file mode 100644
index 00000000..1016b0a8
--- /dev/null
+++ b/color.css
@@ -0,0 +1,15 @@
+:root {
+ --gray900: #111827;
+ --gray800: #1f2937;
+ --gray700: #374151;
+ --gray600: #4b5563;
+ --gray500: #6b7280;
+ --gray400: #9ca3af;
+ --gray200: #e5e7eb;
+ --gray100: #f3f4f6;
+ --gray50: #f9fafb;
+ --blue: #3692ff;
+ --white: #ffffff;
+ --backgroundLightBlue: #cfe5ff;
+ --backgroundLightGray: #fcfcfc;
+}
diff --git a/img/OG_img.svg b/img/OG_img.svg
new file mode 100644
index 00000000..b4b8d797
--- /dev/null
+++ b/img/OG_img.svg
@@ -0,0 +1,3 @@
+
diff --git a/img/Component 2@2x.svg b/img/ic_google.svg
similarity index 100%
rename from img/Component 2@2x.svg
rename to img/ic_google.svg
diff --git a/img/Component 3@2x.svg b/img/ic_kakao.svg
similarity index 100%
rename from img/Component 3@2x.svg
rename to img/ic_kakao.svg
diff --git "a/img/\355\214\220\353\213\244 \354\226\274\352\265\264.svg" b/img/panda_logo_img.svg
similarity index 100%
rename from "img/\355\214\220\353\213\244 \354\226\274\352\265\264.svg"
rename to img/panda_logo_img.svg
diff --git a/img/root_img/.DS_Store b/img/root_img/.DS_Store
new file mode 100644
index 00000000..5008ddfc
Binary files /dev/null and b/img/root_img/.DS_Store differ
diff --git a/img/root_img/Group 19.svg b/img/root_img/Group 19.svg
deleted file mode 100644
index 763adc2c..00000000
--- a/img/root_img/Group 19.svg
+++ /dev/null
@@ -1,15 +0,0 @@
-
diff --git a/img/root_img/Img_home_01.svg b/img/root_img/Img_home_01.svg
new file mode 100644
index 00000000..56aa0038
--- /dev/null
+++ b/img/root_img/Img_home_01.svg
@@ -0,0 +1,67 @@
+
diff --git a/img/root_img/Img_home_02.svg b/img/root_img/Img_home_02.svg
new file mode 100644
index 00000000..4137dc0b
--- /dev/null
+++ b/img/root_img/Img_home_02.svg
@@ -0,0 +1,23 @@
+
diff --git a/img/root_img/Img_home_03.svg b/img/root_img/Img_home_03.svg
new file mode 100644
index 00000000..93e003c3
--- /dev/null
+++ b/img/root_img/Img_home_03.svg
@@ -0,0 +1,53 @@
+
diff --git a/img/root_img/desktop_02.svg b/img/root_img/desktop_02.svg
deleted file mode 100644
index 880f6f00..00000000
--- a/img/root_img/desktop_02.svg
+++ /dev/null
@@ -1,71 +0,0 @@
-
diff --git a/img/root_img/desktop_03.svg b/img/root_img/desktop_03.svg
deleted file mode 100644
index 4bd04dd9..00000000
--- a/img/root_img/desktop_03.svg
+++ /dev/null
@@ -1,27 +0,0 @@
-
diff --git a/img/root_img/desktop_04.svg b/img/root_img/desktop_04.svg
deleted file mode 100644
index d5e4052a..00000000
--- a/img/root_img/desktop_04.svg
+++ /dev/null
@@ -1,62 +0,0 @@
-
diff --git a/img/root_img/Img_home_bottom.svg b/img/root_img/home_bottom_img.svg
similarity index 100%
rename from img/root_img/Img_home_bottom.svg
rename to img/root_img/home_bottom_img.svg
diff --git a/img/root_img/Img_home_top.svg b/img/root_img/home_top_img.svg
similarity index 100%
rename from img/root_img/Img_home_top.svg
rename to img/root_img/home_top_img.svg
diff --git a/img/root_img/Property 1=md.svg "b/img/root_img/\355\214\220\353\213\244\353\247\210\354\274\223\355\205\215\354\212\244\355\212\270\353\241\234\352\263\240.svg"
similarity index 100%
rename from img/root_img/Property 1=md.svg
rename to "img/root_img/\355\214\220\353\213\244\353\247\210\354\274\223\355\205\215\354\212\244\355\212\270\353\241\234\352\263\240.svg"
diff --git a/index.html b/index.html
index 04acdf4a..691d1c42 100644
--- a/index.html
+++ b/index.html
@@ -6,8 +6,19 @@
name="viewport"
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale, user-scalable=no"
/>
+
+
+
+
+
@@ -17,7 +28,7 @@
@@ -30,37 +41,65 @@