diff --git a/images/content2.png b/images/content2.png new file mode 100644 index 000000000..63e694a13 Binary files /dev/null and b/images/content2.png differ diff --git a/images/content3.png b/images/content3.png new file mode 100644 index 000000000..239a9f493 Binary files /dev/null and b/images/content3.png differ diff --git a/images/facebook.png b/images/facebook.png new file mode 100644 index 000000000..9b00e7de0 Binary files /dev/null and b/images/facebook.png differ diff --git a/images/insta.png b/images/insta.png new file mode 100644 index 000000000..2eb9b1ad0 Binary files /dev/null and b/images/insta.png differ diff --git a/images/login.png b/images/login.png new file mode 100644 index 000000000..989a69fce Binary files /dev/null and b/images/login.png differ diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 000000000..8ac1a78db Binary files /dev/null and b/images/logo.png differ diff --git a/images/panda.png b/images/panda.png new file mode 100644 index 000000000..11478951d Binary files /dev/null and b/images/panda.png differ diff --git a/images/panda2.png b/images/panda2.png new file mode 100644 index 000000000..ea4d4a895 Binary files /dev/null and b/images/panda2.png differ diff --git a/images/x.png b/images/x.png new file mode 100644 index 000000000..effd5caaa Binary files /dev/null and b/images/x.png differ diff --git a/images/youtube.png b/images/youtube.png new file mode 100644 index 000000000..64b4a4bf5 Binary files /dev/null and b/images/youtube.png differ diff --git a/index.html b/index.html new file mode 100644 index 000000000..4b86261f3 --- /dev/null +++ b/index.html @@ -0,0 +1,102 @@ + + + + + + 판다마켓 + + + + +
+ + + + 로그인 +
+
+ + +
+
+ +
+ Hot item +

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

+

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

+
+
+
+ Search item +

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

+

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

+ +
+
+ +
+ Register +

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

+

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

+
+
+ + +
+ + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 000000000..f40ec6962 --- /dev/null +++ b/style.css @@ -0,0 +1,134 @@ + +html { + font-family: Pretendard, sans-serif; +} + +body{ + margin:0; +} + +.gnb { + display: flex; + justify-content: space-between; + align-items: center; + margin:0 200px; +} +.gnb .logo { + width: 153px; + height: 51px; +} +.gnb .login { + border-radius: 8px; + background-color: #3692FF; + color: #ffffff; + font-size: 16px; + font-weight: 600; + padding:12px 20px 12px 20px; + gap:10px; + text-decoration: none; + cursor: pointer; +} + +.main-banner { + background-color: #CFE5FF; + width: 100%; + height: 540px; + display: flex; + justify-content: center; + align-items: center; +} +.banner { + display: flex; + flex-direction: column; +} +.banner-panda { + margin-top:93px; +} +.banner-text { + font-size: 40px; + font-weight: 700; + width: 355px; +} +.banner-link { + border-radius: 40px; + background-color: #3692FF; + font-size: 20px; + font-weight: 600; + color: #ffffff; + text-decoration: none; + padding:16px; + gap: 32px; + text-align: center; + cursor: pointer; +} + +.section1 { + width: 1200px; + display: flex; + align-items: center; + gap: 64px; + margin-top:138px; + margin-left:360px; + margin-bottom:138px; +} +.section2 { + width:1200px; + display: flex; + align-items: center; + gap:64px; + margin-top: 138px; + margin-left: 591px; + text-align: right; +} + +.content-text span { + color:#3692FF; + font-size: 18px; + font-weight: 700; +} +.content-text h2 { + color: #374151; + font-size: 40px; + font-weight: 700; +} +.content-text p { + color: #374151; + font-size: 24px; + font-weight: 500; +} + +.footer { + width: auto; + height: 160px; + background-color: #111827; + padding:32px 200px 32px 200px; +} +.bottom-banner { + display: flex; + justify-content: space-between; + align-items: center; + gap:30px; +} +.bottom-banner .codeit { + color: #9CA3AF; + font-size: 16px; + font-weight: 400; + text-align: center; +} +.bottom-banner .faq { + color: #E5E7EB; + font-size: 16px; + font-weight: 400; + text-align: center; + text-decoration: none; + display: flex; + gap:30px; + cursor: pointer; +} +.bottom-banner .sns { + display: flex; + gap:12px; + width: 20px; + height: 20px; + cursor: pointer; +} \ No newline at end of file