diff --git a/faq.html b/faq.html new file mode 100644 index 00000000..e69de29b diff --git a/image/facebook.png b/image/facebook.png new file mode 100644 index 00000000..561f5027 Binary files /dev/null and b/image/facebook.png differ diff --git a/image/footer.png b/image/footer.png new file mode 100644 index 00000000..1ce4fdbb Binary files /dev/null and b/image/footer.png differ diff --git a/image/header.png b/image/header.png new file mode 100644 index 00000000..9e04ecb9 Binary files /dev/null and b/image/header.png differ diff --git a/image/hotitem.png b/image/hotitem.png new file mode 100644 index 00000000..8c860b3b Binary files /dev/null and b/image/hotitem.png differ diff --git a/image/insta.png b/image/insta.png new file mode 100644 index 00000000..f014549b Binary files /dev/null and b/image/insta.png differ diff --git a/image/logo.png b/image/logo.png new file mode 100644 index 00000000..b270ec8e Binary files /dev/null and b/image/logo.png differ diff --git a/image/register.png b/image/register.png new file mode 100644 index 00000000..995d5d00 Binary files /dev/null and b/image/register.png differ diff --git a/image/search.png b/image/search.png new file mode 100644 index 00000000..b173b33c Binary files /dev/null and b/image/search.png differ diff --git a/image/twitter.png b/image/twitter.png new file mode 100644 index 00000000..0a74ad7d Binary files /dev/null and b/image/twitter.png differ diff --git a/image/youtube.png b/image/youtube.png new file mode 100644 index 00000000..473bc32f Binary files /dev/null and b/image/youtube.png differ diff --git a/index.html b/index.html new file mode 100644 index 00000000..9e8f647b --- /dev/null +++ b/index.html @@ -0,0 +1,133 @@ + + + + + + 판다마켓 + + + + + + +
+ +
+ +
+ + +
+
+
+
+

+ 일상의 모든 물건을
+ 거래해 보세요 +

+ 구경하러 가기 +
+ +
+
+
+ + +
+
+
+ + + +
+ Hot item + +

+ 인기 상품을
+ 확인해보세요 +

+ +

+ 가장 HOT한 중고거래 물품을
+ 판다 마켓에서 확인해 보세요 +

+ +
+
+
+ +
+
+ +
+ Search +

+ 구매를 원하는
+ 상품을 검색하세요 +

+ +

+ 구매하고 싶은 물품은 검색해서
+ 쉽게 찾아보세요 +

+
+ + + +
+
+ +
+
+ + + +
+ Register +

+ 판매를 원하는
+ 상품을 등록하세요 +

+ +

+ 어떤 물건이든 판매하고 싶은 상품을
+ 쉽게 등록하세요 +

+
+
+
+ + +
+
+

+ 믿을 수 있는
+ 판다마켓 중고 거래 +

+ +
+
+
+
+ + + + + \ No newline at end of file diff --git a/itmes.html b/itmes.html new file mode 100644 index 00000000..e69de29b diff --git a/login.html b/login.html new file mode 100644 index 00000000..e69de29b diff --git a/privacy.html b/privacy.html new file mode 100644 index 00000000..e69de29b diff --git a/style.css b/style.css new file mode 100644 index 00000000..fe1d4300 --- /dev/null +++ b/style.css @@ -0,0 +1,220 @@ +* { + box-sizing: border-box; +} + +body { + font-family: 'Pretendard', sans-serif; +} + +/* Banner */ +.banner_button { + margin: 9.5px auto; + width:100%; + padding: 0 200px; + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo img { + width: 153px; +} + +.logo,#login { + cursor: pointer; +} + +#login { + width: 128px; + height: 48px; + display: flex; + justify-content: center; + align-items: center; + + background: #3692FF; + border-radius: 8px; + color: #ffffff; + text-decoration: none; +} + +#login:hover { + background-color: #1967D6; +} + +/* Main - Header */ +.header-container { + display:flex; + flex-direction: column; + justify-content: end; + align-items: center; + width: 100%; + height: 540px; + background-color: #CFE5FF; +} + +.header-content { + display: flex; + align-items: center; + gap: 7px; +} + +.header-image { + width: 746px; + height:340px; +} + +.header-text { + display: flex; + flex-direction: column; + justify-content: center; + width: 357px; + height: 260px; +} + +.header-title { + font-size: 40px; + font-weight: 700; + line-height: 56px; + color: #374151; +} + +#explore-button { + display: flex; + justify-content: center; + align-items: center; + + width: 357px; + height: 56px; + + background-color: #3692FF; + color: #ffffff; + border-radius: 40px; + + font-size: 20px; + font-weight: 600; + text-decoration: none; +} + +#explore-button:hover { + background-color: #1967D6; +} + +/* Main-Body */ + +.body-container { + width: 100%; +} + +.content-section { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + width: 100%; + height: 720px; +} + +.content-card { + display: flex; + align-items: center; + justify-content: space-around; + + width: 988px; + height: 444px; +} + +.content-text { + width: 298px; + height: 238px; + +} + +.content-card img { + width: 579px; + height: 444px; +} + +.content-label { + font-size: 18px; + font-weight: 700; + color: #3692FF; +} + +.content-title { + font-size: 40px; + font-weight: 700; + color: #374151; +} + +.content-description { + font-size: 24px; + font-weight: 500; + color: #374151; +} + +/* Main-Footer */ +.content-footer { + position:relative; + + display: flex; + flex-direction: column; + justify-content: end; + align-items: center; + + width: 100%; + height: 540px; + + background-color: #CFE5FF; +} + +.cf-content { + display: flex; + align-items: center; +} + +.cf-img { + width: 746px; + height: 397px; +} + +.cf-text { + width: 295px; + height: 172px; + + font-size: 40px; + font-weight: 700; + color: #374151; +} + +/* Footer */ + +footer { + background-color: #111827; + color: #9ca3af; + display: flex; + justify-content: space-between; + align-items: center; + padding: 32px 200px 108px 200px; + font-size: 16px; +} + +.footer-menu { + text-decoration: none; + color: #E5E7EB; +} + +#footer-content { + display: flex; + gap: 30px; + color: #e5e7eb; +} + +#sns-link { + display: flex; + gap: 12px; +} + +.footer-menu, #sns-link a,.logo,#login, #explore-button { + cursor: pointer; +} \ No newline at end of file