function MainComponent() { const services = [ "ヘアカット", "ヘアカラー", "パーマ", "トリートメント", "スタイリング" ]; return /*#__PURE__*/ React.createElement("div", { className: "w-full min-h-screen bg-[#f0f0f0] flex flex-col items-center p-8 font-roboto", __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-[#333333] font-crimson-text my-4", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, "美容室の予約"), /*#__PURE__*/ React.createElement("p", { className: "text-lg text-[#666666] font-roboto mb-8 text-center w-[80%]", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, "ご希望のサービスを選んでご予約ください。"), /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold text-[#333333] font-crimson-text mb-4", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, "サービス一覧:"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc list-inside text-left w-[80%] text-lg text-[#666666] font-roboto mx-auto", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, services.map((service, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, service))), /*#__PURE__*/ React.createElement("form", { className: "w-[80%] flex flex-col items-center mt-8", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-lg text-[#666666] font-roboto my-2 w-full", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "お名前:", /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", className: "w-full mt-1 p-2 border border-[#cccccc] rounded", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "text-lg text-[#666666] font-roboto my-2 w-full", __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, "電話番号:", /*#__PURE__*/ React.createElement("input", { type: "text", name: "phone", className: "w-full mt-1 p-2 border border-[#cccccc] rounded", __source: { fileName: "", lineNumber: 27, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("label", { className: "text-lg text-[#666666] font-roboto my-2 w-full", __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, "日時:", /*#__PURE__*/ React.createElement("input", { type: "text", name: "datetime", className: "w-full mt-1 p-2 border border-[#cccccc] rounded", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "text-lg text-white bg-[#333333] px-4 py-2 rounded mt-4", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, "予約する"))); }