From 8acf38cea0edbc55e9e376e6f4662f07ff5c7607 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=ED=95=9C=EB=B3=84?=
 <78421872+2hanbyeol1@users.noreply.github.com>
Date: Sun, 19 Nov 2023 01:40:23 +0900
Subject: [PATCH] =?UTF-8?q?[CSS]=20Admin=20page=EC=99=80=20css=20=EB=8F=99?=
 =?UTF-8?q?=EC=9D=BC=ED=95=98=EA=B2=8C=20=EB=B3=80=EA=B2=BD=20(#312)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/component/order/Introduction.css |  3 --
 src/component/order/Introduction.js  | 46 ++++++++++++++++++++++++++--
 2 files changed, 44 insertions(+), 5 deletions(-)
 delete mode 100644 src/component/order/Introduction.css

diff --git a/src/component/order/Introduction.css b/src/component/order/Introduction.css
deleted file mode 100644
index 71d28f4..0000000
--- a/src/component/order/Introduction.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.content-container img {
-  width: 100%;
-}
diff --git a/src/component/order/Introduction.js b/src/component/order/Introduction.js
index fd1de57..4598e11 100644
--- a/src/component/order/Introduction.js
+++ b/src/component/order/Introduction.js
@@ -1,5 +1,47 @@
 import { useEffect, useRef } from 'react';
-import './Introduction.css';
+import styled from 'styled-components';
+
+const IntroductionContainer = styled.div`
+  text-align: center;
+
+  > p {
+    margin: 0;
+    line-height: 160%;
+  }
+
+  img {
+    width: 60%;
+  }
+
+  button {
+    appearance: auto;
+    text-rendering: auto;
+    color: buttontext;
+    letter-spacing: normal;
+    word-spacing: normal;
+    line-height: normal;
+    text-transform: none;
+    text-indent: 0px;
+    text-shadow: none;
+    display: inline-block;
+    text-align: center;
+    align-items: flex-start;
+    cursor: default;
+    box-sizing: border-box;
+    background-color: buttonface;
+    margin: 0em;
+    padding-block: 1px;
+    padding-inline: 6px;
+    border: 1px outset buttonborder;
+    border-image: initial;
+    border-radius: 3px;
+  }
+
+  ul {
+    list-style: initial;
+  }
+`;
+
 // 상품 소개
 export default function Introduction({ content }) {
   const contentRef = useRef();
@@ -12,5 +54,5 @@ export default function Introduction({ content }) {
     }
   }, [content]);
 
-  return <div className='content-container' ref={contentRef} style={{ textAlign: 'center' }}></div>;
+  return <IntroductionContainer ref={contentRef} />;
 }