function MainComponent() { const handleSubmit = (e)=>{ e.preventDefault(); const formData = new FormData(e.target); const queryString = new URLSearchParams(formData).toString(); window.location.href = `mailto:takiguchi.yuji@makeshop.co.jp?subject=フォームからのお知らせ&body=${queryString}`; }; return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center min-h-screen py-12 bg-gradient-to-br from-[#2389ca] to-[#000080]", style: { padding: '50px 0' }, __source: { fileName: "", lineNumber: 10, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-4/5 bg-white rounded-lg shadow-lg p-8 flex flex-col lg:flex-row", style: { width: '80%' }, __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "lg:w-1/2", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-[#121212] mb-4 flex flex-col items-center", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-6xl mb-2", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "makeshop"), /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-2xl mb-4", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, "15日間無料体験をはじめる！"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto mb-6", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, "ご利用形態は正しくご入力ください。ご利用いただける決済サービスが異なります。")), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "w-full", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4 border-b border-gray-300 pb-4 flex items-center", __source: { fileName: "", lineNumber: 19, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "name", className: "font-roboto text-[#121212] text-sm inline-block mr-2", __source: { fileName: "", lineNumber: 20, columnNumber: 15 }, __self: this }, "お名前"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "name", name: "name", className: "font-roboto text-xs border border-gray-200 p-2 outline-none flex-1", required: true, __source: { fileName: "", lineNumber: 21, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4 border-b border-gray-300 pb-4 flex items-center", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "font-roboto text-[#121212] text-sm inline-block mr-2", __source: { fileName: "", lineNumber: 24, columnNumber: 15 }, __self: this }, "メールアドレス"), /*#__PURE__*/ React.createElement("input", { type: "email", id: "email", name: "email", className: "font-roboto text-xs border border-gray-200 p-2 outline-none flex-1", required: true, __source: { fileName: "", lineNumber: 25, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4 border-b border-gray-300 pb-4 flex items-center", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "desiredId", className: "font-roboto text-[#121212] text-sm inline-block mr-2", __source: { fileName: "", lineNumber: 28, columnNumber: 15 }, __self: this }, "ご希望のショップID"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "desiredId", name: "desiredId", className: "font-roboto text-xs border border-gray-200 p-2 outline-none flex-1", required: true, __source: { fileName: "", lineNumber: 29, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4 border-b border-gray-300 pb-4 flex items-center", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "password", className: "font-roboto text-[#121212] text-sm inline-block mr-2", __source: { fileName: "", lineNumber: 32, columnNumber: 15 }, __self: this }, "パスワード"), /*#__PURE__*/ React.createElement("input", { type: "password", id: "password", name: "password", className: "font-roboto text-xs border border-gray-200 p-2 outline-none flex-1", required: true, __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", id: "agreement", name: "agreement", required: true, className: "mr-2", __source: { fileName: "", lineNumber: 36, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "agreement", className: "font-roboto text-[#121212] text-sm", __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this }, "下記内容について確認・同意し、申し込みます")), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center space-x-2 mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "https://www.makeshop.jp/main/company/makeshop_license.html", target: "_blank", className: "text-[10px] text-blue-600 hover:underline font-roboto", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this }, "利用規約"), /*#__PURE__*/ React.createElement("a", { href: "https://www.makeshop.co.jp/privacy/p001/", target: "_blank", className: "text-[10px] text-blue-600 hover:underline font-roboto", __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, "個人情報の取り扱いについて")), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 43, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "font-roboto py-2 px-4 bg-[#2389ca] text-white rounded text-xs", __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this }, "無料体験をはじめる")))), /*#__PURE__*/ React.createElement("div", { className: "lg:w-1/2 flex justify-center", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://www.makeshop.jp/main/images/top_new_ver/function_deposit-main.svg", alt: "Payment service illustration", className: "max-w-xs lg:max-w-md", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this })))); }