Spaces:

nkjoy
/

savory-eats-delight

Running

App Files Files Community

nkjoy commited on Jan 25

Commit

03a2ff7

verified ·

1 Parent(s): 26c11c6

전체 한국어로 줘요

Browse files

Files changed (1) hide show

index.html +92 -93

index.html CHANGED Viewed

@@ -31,33 +31,33 @@
     <!-- Signature Dishes -->
     <section class="py-20 bg-white">
         <div class="container mx-auto px-6">
-            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">Our Signature Dishes</h2>
-            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
                 <!-- Dish 1 -->
                 <div class="bg-white shadow-xl rounded-lg overflow-hidden transition transform hover:scale-105 duration-300">
                     <img src="http://static.photos/food/640x360/1" alt="Truffle Pasta" class="w-full h-64 object-cover">
                     <div class="p-6">
-                        <h3 class="text-2xl font-semibold mb-2">Truffle Infused Pasta</h3>
-                        <p class="text-gray-600 mb-4">Handmade pasta with black truffle and parmesan cream sauce</p>
-                        <span class="text-amber-600 font-bold text-xl">$24.99</span>
                     </div>
                 </div>
                 <!-- Dish 2 -->
                 <div class="bg-white shadow-xl rounded-lg overflow-hidden transition transform hover:scale-105 duration-300">
                     <img src="http://static.photos/food/640x360/2" alt="Beef Wellington" class="w-full h-64 object-cover">
                     <div class="p-6">
-                        <h3 class="text-2xl font-semibold mb-2">Classic Beef Wellington</h3>
-                        <p class="text-gray-600 mb-4">Premium beef tenderloin wrapped in puff pastry</p>
-                        <span class="text-amber-600 font-bold text-xl">$38.99</span>
                     </div>
                 </div>
                 <!-- Dish 3 -->
                 <div class="bg-white shadow-xl rounded-lg overflow-hidden transition transform hover:scale-105 duration-300">
                     <img src="http://static.photos/food/640x360/3" alt="Chocolate Souffle" class="w-full h-64 object-cover">
                     <div class="p-6">
-                        <h3 class="text-2xl font-semibold mb-2">Chocolate Soufflé</h3>
-                        <p class="text-gray-600 mb-4">Decadent dark chocolate soufflé with vanilla bean ice cream</p>
-                        <span class="text-amber-600 font-bold text-xl">$14.99</span>
                     </div>
                 </div>
             </div>
@@ -67,45 +67,44 @@
     <!-- Menu Section -->
     <section id="menu" class="py-20 bg-gray-100">
         <div class="container mx-auto px-6">
-            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">Our Menu</h2>
-            <!-- Appetizers -->
             <div class="mb-16">
-                <h3 class="text-2xl font-semibold mb-8 border-b-2 border-amber-600 pb-2 inline-block">Appetizers</h3>
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Bruschetta Trio</h4>
-                                <p class="text-gray-600">Toasted bread topped with tomatoes, basil, and balsamic glaze</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$12.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Crispy Calamari</h4>
-                                <p class="text-gray-600">Fried squid with lemon aioli and marinara sauce</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$14.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Truffle Fries</h4>
-                                <p class="text-gray-600">Hand-cut fries with truffle oil and parmesan</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$10.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Crab Cakes</h4>
-                                <p class="text-gray-600">Lump crab meat with cilantro lime sauce</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$16.99</span>
                         </div>
                     </div>
@@ -114,41 +113,41 @@
             <!-- Main Courses -->
             <div class="mb-16">
-                <h3 class="text-2xl font-semibold mb-8 border-b-2 border-amber-600 pb-2 inline-block">Main Courses</h3>
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Filet Mignon</h4>
-                                <p class="text-gray-600">8oz grass-fed beef with red wine reduction</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$32.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Grilled Salmon</h4>
-                                <p class="text-gray-600">Wild-caught salmon with lemon butter sauce</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$26.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Mushroom Risotto</h4>
-                                <p class="text-gray-600">Creamy arborio rice with wild mushrooms</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$22.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Lamb Chops</h4>
-                                <p class="text-gray-600">Herb-crusted with mint jus and seasonal vegetables</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$29.99</span>
                         </div>
                     </div>
@@ -157,23 +156,23 @@
             <!-- Desserts -->
             <div>
-                <h3 class="text-2xl font-semibold mb-8 border-b-2 border-amber-600 pb-2 inline-block">Desserts</h3>
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Crème Brûlée</h4>
-                                <p class="text-gray-600">Classic vanilla bean custard with caramelized sugar</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$9.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
-                                <h4 class="text-xl font-semibold">Tiramisu</h4>
-                                <p class="text-gray-600">Layers of coffee-soaked ladyfingers and mascarpone</p>
-                            </div>
                             <span class="text-amber-600 font-bold">$10.99</span>
                         </div>
                     </div>
@@ -185,37 +184,37 @@
     <!-- Chef's Special -->
     <section class="py-20 bg-white">
         <div class="container mx-auto px-6">
-            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">Chef's Special Selection</h2>
             <div class="flex flex-col md:flex-row items-center gap-12 bg-gray-100 rounded-xl p-8 shadow-lg">
                 <div class="md:w-1/2">
-                    <img src="http://static.photos/people/640x360/5" alt="Chef Maria Rodriguez" class="w-full h-auto rounded-lg object-cover">
                 </div>
                 <div class="md:w-1/2">
-                    <h3 class="text-2xl font-semibold mb-4">Meet Chef Maria Rodriguez</h3>
-                    <p class="text-gray-600 mb-6">With over 15 years of experience in Michelin-starred restaurants across Europe, Chef Maria brings her passion for fresh, seasonal ingredients to every dish.</p>
                     <div class="bg-white p-6 rounded-lg shadow-md mb-6">
-                        <h4 class="text-xl font-semibold mb-2 text-amber-600">This Week's Special</h4>
-                        <p class="text-gray-600">Duck Confit with cherry compote and wild rice pilaf - $28.99</p>
                     </div>
                     <div class="bg-white p-6 rounded-lg shadow-md">
-                        <h4 class="text-xl font-semibold mb-2 text-amber-600">Chef's Recommendation</h4>
-                        <p class="text-gray-600">"Try our seafood tower for two - the freshest catch of the day with homemade sauces"</p>
                     </div>
                 </div>
             </div>
-        </div>
     </section>
     <!-- Reservation Section -->
     <section id="reservation" class="py-20 bg-gray-100">
         <div class="container mx-auto px-6">
-            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">Make a Reservation</h2>
-            <div class="max-w-3xl mx-auto bg-white shadow-xl rounded-lg overflow-hidden">
                 <div class="md:flex">
                     <div class="md:w-1/2 bg-cover bg-center p-8" style="background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('http://static.photos/restaurant/640x360/8');">
-                        <h3 class="text-2xl font-semibold text-white mb-4">Dining Experience</h3>
-                        <p class="text-white mb-6">Book your table now to enjoy our exceptional cuisine and service.</p>
-                        <div class="text-white">
                             <div class="flex items-center mb-4">
                                 <i data-feather="phone" class="mr-3"></i>
                                 <span>(123) 456-7890</span>
@@ -233,28 +232,28 @@
                     <div class="md:w-1/2 p-8">
                         <form id="reservationForm" class="space-y-4">
                             <div>
-                                <label for="name" class="block text-gray-700 mb-2">Full Name</label>
-                                <input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
                                 <label for="email" class="block text-gray-700 mb-2">Email</label>
                                 <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
-                                <label for="phone" class="block text-gray-700 mb-2">Phone</label>
-                                <input type="tel" id="phone" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
-                                <label for="date" class="block text-gray-700 mb-2">Date</label>
-                                <input type="date" id="date" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
-                                <label for="time" class="block text-gray-700 mb-2">Time</label>
-                                <input type="time" id="time" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
-                                <label for="guests" class="block text-gray-700 mb-2">Number of Guests</label>
-                                <select id="guests" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
                                     <option value="1">1 Person</option>
                                     <option value="2">2 People</option>
                                     <option value="3">3 People</option>
@@ -265,8 +264,8 @@
                                     <option value="8">8+ People</option>
                                 </select>
                             </div>
-                            <button type="submit" class="w-full bg-amber-600 hover:bg-amber-700 text-white font-semibold py-3 rounded-lg transition duration-300">Book Table</button>
-                        </form>
                     </div>
                 </div>
             </div>
@@ -278,31 +277,31 @@
         <div class="container mx-auto px-6">
             <div class="flex flex-col md:flex-row">
                 <div class="md:w-1/2 mb-10 md:mb-0 md:pr-8">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-8">Our Location</h2>
-                    <div id="map" class="h-96 w-full rounded-xl shadow-lg"></div>
                 </div>
                 <div class="md:w-1/2 md:pl-8">
-                    <h2 class="text-3xl md:text-4xl font-bold mb-8">Opening Hours</h2>
-                    <div class="bg-gray-100 p-8 rounded-xl shadow-lg">
                         <div class="space-y-6">
                             <div class="flex justify-between border-b border-gray-300 pb-2">
-                                <span class="font-semibold">Monday - Thursday</span>
-                                <span>11:00 AM - 10:00 PM</span>
-                            </div>
                             <div class="flex justify-between border-b border-gray-300 pb-2">
-                                <span class="font-semibold">Friday - Saturday</span>
-                                <span>11:00 AM - 11:00 PM</span>
-                            </div>
                             <div class="flex justify-between">
-                                <span class="font-semibold">Sunday</span>
-                                <span>10:00 AM - 9:00 PM</span>
-                            </div>
                         </div>
                         <div class="mt-8">
-                            <h3 class="text-xl font-semibold mb-4">Special Notes</h3>
-                            <p class="text-gray-600">Brunch served Saturday and Sunday from 10:00 AM to 2:00 PM</p>
-                            <p class="text-gray-600">Happy Hour Monday-Friday 4:00 PM to 6:00 PM</p>
-                        </div>
                     </div>
                 </div>
             </div>

     <!-- Signature Dishes -->
     <section class="py-20 bg-white">
         <div class="container mx-auto px-6">
+            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">시그니처 요리</h2>
+<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
                 <!-- Dish 1 -->
                 <div class="bg-white shadow-xl rounded-lg overflow-hidden transition transform hover:scale-105 duration-300">
                     <img src="http://static.photos/food/640x360/1" alt="Truffle Pasta" class="w-full h-64 object-cover">
                     <div class="p-6">
+                        <h3 class="text-2xl font-semibold mb-2">트러플 페이스트</h3>
+                        <p class="text-gray-600 mb-4">수제 파스타에 블랙 트러플과 파르메산 크림 소스</p>
+<span class="text-amber-600 font-bold text-xl">$24.99</span>
                     </div>
                 </div>
                 <!-- Dish 2 -->
                 <div class="bg-white shadow-xl rounded-lg overflow-hidden transition transform hover:scale-105 duration-300">
                     <img src="http://static.photos/food/640x360/2" alt="Beef Wellington" class="w-full h-64 object-cover">
                     <div class="p-6">
+                        <h3 class="text-2xl font-semibold mb-2">클래식 비프 웰링턴</h3>
+                        <p class="text-gray-600 mb-4">프리미엄 쇠고기 안심을 퍼프 페이스트리로 감싸 완성</p>
+<span class="text-amber-600 font-bold text-xl">$38.99</span>
                     </div>
                 </div>
                 <!-- Dish 3 -->
                 <div class="bg-white shadow-xl rounded-lg overflow-hidden transition transform hover:scale-105 duration-300">
                     <img src="http://static.photos/food/640x360/3" alt="Chocolate Souffle" class="w-full h-64 object-cover">
                     <div class="p-6">
+                        <h3 class="text-2xl font-semibold mb-2">초콜릿 수플레</h3>
+                        <p class="text-gray-600 mb-4">진한 다크 초콜릿 수플레에 바닐라 빈 아이스크림</p>
+<span class="text-amber-600 font-bold text-xl">$14.99</span>
                     </div>
                 </div>
             </div>
     <!-- Menu Section -->
     <section id="menu" class="py-20 bg-gray-100">
         <div class="container mx-auto px-6">
+            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">메뉴</h2>
+<!-- Appetizers -->
             <div class="mb-16">
+                <h3 class="text-2xl font-semibold mb-8 border-b-2 border-amber-600 pb-2 inline-block">애피타이저</h3>
+<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">브루스케타 트리오</h4>
+                                <p class="text-gray-600">구운 빵 위에 토마토, 바질, 발사믹 글레이즈</p>
+</div>
                             <span class="text-amber-600 font-bold">$12.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">바삭한 오징어 튀김</h4>
+                                <p class="text-gray-600">레몬 아이올리와 마리나라 소스가 곁들여진 오징어 튀김</p>
+</div>
                             <span class="text-amber-600 font-bold">$14.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">트러플 감자튀김</h4>
+                                <p class="text-gray-600">수제 감자튀김에 트러플 오일과 파르메산</p>
+</div>
                             <span class="text-amber-600 font-bold">$10.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">크랩 케이크</h4>
+                                <p class="text-gray-600">통게살에 코리앤더 라임 소스</p>
+</div>
                             <span class="text-amber-600 font-bold">$16.99</span>
                         </div>
                     </div>
             <!-- Main Courses -->
             <div class="mb-16">
+                <h3 class="text-2xl font-semibold mb-8 border-b-2 border-amber-600 pb-2 inline-block">메인 코스</h3>
+<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">필레 미뇽</h4>
+                                <p class="text-gray-600">8온스 초식 쇠고기에 레드 와인 소스</p>
+</div>
                             <span class="text-amber-600 font-bold">$32.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">그릴 연어</h4>
+                                <p class="text-gray-600">야생 연어에 레몬 버터 소스</p>
+</div>
                             <span class="text-amber-600 font-bold">$26.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">버섯 리조또</h4>
+                                <p class="text-gray-600">크리미한 아르보리오 쌀과 야생 버섯</p>
+</div>
                             <span class="text-amber-600 font-bold">$22.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">램 립</h4>
+                                <p class="text-gray-600">허브 크러스트에 민트 주스와 계절 야채</p>
+</div>
                             <span class="text-amber-600 font-bold">$29.99</span>
                         </div>
                     </div>
             <!-- Desserts -->
             <div>
+                <h3 class="text-2xl font-semibold mb-8 border-b-2 border-amber-600 pb-2 inline-block">디저트</h3>
+<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">크렘 브륄레</h4>
+                                <p class="text-gray-600">클래식 바닐라 빈 커스터드에 카라멜라이즈드 설탕</p>
+</div>
                             <span class="text-amber-600 font-bold">$9.99</span>
                         </div>
                     </div>
                     <div class="bg-white p-6 shadow-md rounded-lg">
                         <div class="flex justify-between items-start">
                             <div>
+                                <h4 class="text-xl font-semibold">티라미수</h4>
+                                <p class="text-gray-600">커피에 적신 레이디핑거와 마스카르포네 층층이</p>
+</div>
                             <span class="text-amber-600 font-bold">$10.99</span>
                         </div>
                     </div>
     <!-- Chef's Special -->
     <section class="py-20 bg-white">
         <div class="container mx-auto px-6">
+            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">셰프의 시그니처 메뉴</h2>
             <div class="flex flex-col md:flex-row items-center gap-12 bg-gray-100 rounded-xl p-8 shadow-lg">
                 <div class="md:w-1/2">
+                    <img src="http://static.photos/people/640x360/5" alt="마리아 로드리게스 셰프" class="w-full h-auto rounded-lg object-cover">
                 </div>
                 <div class="md:w-1/2">
+                    <h3 class="text-2xl font-semibold mb-4">마리아 로드리게스 셰프를 소개합니다</h3>
+                    <p class="text-gray-600 mb-6">유럽의 미쉐린 스타 레스토랑에서 15년 이상의 경력을 쌓은 마리아 셰프는 신선한 제철 재료에 대한 열정으로 모든 요리에 정성을 다합니다.</p>
                     <div class="bg-white p-6 rounded-lg shadow-md mb-6">
+                        <h4 class="text-xl font-semibold mb-2 text-amber-600">이번 주 특선</h4>
+                        <p class="text-gray-600">체리 컴포트와 야생 밥을 곁들인 오리 콩피 - 28,900원</p>
                     </div>
                     <div class="bg-white p-6 rounded-lg shadow-md">
+                        <h4 class="text-xl font-semibold mb-2 text-amber-600">셰프 추천</h4>
+                        <p class="text-gray-600">"홈메이드 소스와 함께하는 오늘의 신선한 해산물 타워를 2인분으로 즐겨보세요"</p>
                     </div>
                 </div>
             </div>
+</div>
     </section>
     <!-- Reservation Section -->
     <section id="reservation" class="py-20 bg-gray-100">
         <div class="container mx-auto px-6">
+            <h2 class="text-3xl md:text-4xl font-bold text-center mb-16">예약하기</h2>
+<div class="max-w-3xl mx-auto bg-white shadow-xl rounded-lg overflow-hidden">
                 <div class="md:flex">
                     <div class="md:w-1/2 bg-cover bg-center p-8" style="background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('http://static.photos/restaurant/640x360/8');">
+                        <h3 class="text-2xl font-semibold text-white mb-4">다이닝 경험</h3>
+                        <p class="text-white mb-6">탁월한 요리와 서비스를 즐기기 위해 지금 테이블을 예약하세요.</p>
+<div class="text-white">
                             <div class="flex items-center mb-4">
                                 <i data-feather="phone" class="mr-3"></i>
                                 <span>(123) 456-7890</span>
                     <div class="md:w-1/2 p-8">
                         <form id="reservationForm" class="space-y-4">
                             <div>
+                            <label for="name" class="block text-gray-700 mb-2">성함</label>
+<input type="text" id="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
                                 <label for="email" class="block text-gray-700 mb-2">Email</label>
                                 <input type="email" id="email" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
+                            <label for="phone" class="block text-gray-700 mb-2">전화번호</label>
+<input type="tel" id="phone" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
+                            <label for="date" class="block text-gray-700 mb-2">날짜</label>
+<input type="date" id="date" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
+                            <label for="time" class="block text-gray-700 mb-2">시간</label>
+<input type="time" id="time" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500" required>
                             </div>
                             <div>
+                            <label for="guests" class="block text-gray-700 mb-2">인원 수</label>
+<select id="guests" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
                                     <option value="1">1 Person</option>
                                     <option value="2">2 People</option>
                                     <option value="3">3 People</option>
                                     <option value="8">8+ People</option>
                                 </select>
                             </div>
+                                <button type="submit" class="w-full bg-amber-600 hover:bg-amber-700 text-white font-semibold py-3 rounded-lg transition duration-300">예약하기</button>
+</form>
                     </div>
                 </div>
             </div>
         <div class="container mx-auto px-6">
             <div class="flex flex-col md:flex-row">
                 <div class="md:w-1/2 mb-10 md:mb-0 md:pr-8">
+            <h2 class="text-3xl md:text-4xl font-bold mb-8">위치</h2>
+<div id="map" class="h-96 w-full rounded-xl shadow-lg"></div>
                 </div>
                 <div class="md:w-1/2 md:pl-8">
+            <h2 class="text-3xl md:text-4xl font-bold mb-8">영업시간</h2>
+<div class="bg-gray-100 p-8 rounded-xl shadow-lg">
                         <div class="space-y-6">
                             <div class="flex justify-between border-b border-gray-300 pb-2">
+                                <span class="font-semibold">월요일 - 목요일</span>
+                                <span>오전 11:00 - 오후 10:00</span>
+</div>
                             <div class="flex justify-between border-b border-gray-300 pb-2">
+                                <span class="font-semibold">금요일 - 토요일</span>
+                                <span>오전 11:00 - 오후 11:00</span>
+</div>
                             <div class="flex justify-between">
+                                <span class="font-semibold">일요일</span>
+                                <span>오전 10:00 - 오후 9:00</span>
+</div>
                         </div>
                         <div class="mt-8">
+                            <h3 class="text-xl font-semibold mb-4">특별 안내</h3>
+                            <p class="text-gray-600">주말 브런치는 토,일 오전 10:00 - 오후 2:00</p>
+                            <p class="text-gray-600">해피아워 월-금 오후 4:00 - 6:00</p>
+</div>
                     </div>
                 </div>
             </div>