Skip to content

sora / achievement

Go to a project
Commit f27308c6 by Orine Matsui
Options

コンタクトフォーム、確認、完了を追加

parent 0ef72ae6
Expand all
Inline Side-by-side
Showing with 232 additions and 24 deletions
achievement-official.conohawing.com/common_previous/css/contact.css
...@@ -250,9 +250,16 @@ contact.css ...@@ -250,9 +250,16 @@ contact.css
line-height: 1.4; } } line-height: 1.4; } }
.contact-bottom-buttons button[disabled="disabled"] {
background: #ccc;
color: #363636;
border: 2px solid #ccc;
background-color: #ccc;
cursor: none;
}
.contact-bottom-buttons button[disabled="disabled"]:after {
display: none;
}
.header-contact { .header-contact {
...@@ -348,8 +355,19 @@ button { ...@@ -348,8 +355,19 @@ button {
width: 100%; width: 100%;
} }
.form_row.form_row_content .right label:not(:first-child) { .form_row .right .form_radiobox {
margin-left: 40px; margin-top: 15px;
margin-bottom: 15px;
}
.form_row .right .form_radiobox label {
display: inline-block;
margin-right: 40px;
}
.form_row_theme .right .form_radiobox label {
width: 30%;
margin-right: 0;
} }
.form_row ul { .form_row ul {
...@@ -387,7 +405,7 @@ input[type="radio"] + .label_text:before { ...@@ -387,7 +405,7 @@ input[type="radio"] + .label_text:before {
content: ""; content: "";
display: block; display: block;
position: absolute; position: absolute;
top: 4px; top: 2px;
left: 0; left: 0;
width: 15px; width: 15px;
height: 15px; height: 15px;
...@@ -398,7 +416,7 @@ input[type="radio"]:checked + .label_text::after { ...@@ -398,7 +416,7 @@ input[type="radio"]:checked + .label_text::after {
content: ""; content: "";
display: block; display: block;
position: absolute; position: absolute;
top: 7px; top: 5px;
left: 3px; left: 3px;
width: 11px; width: 11px;
height: 11px; height: 11px;
...@@ -590,6 +608,10 @@ input[type="email"] { ...@@ -590,6 +608,10 @@ input[type="email"] {
width: 144px; width: 144px;
margin-right: 10px; margin-right: 10px;
} }
#number_of_employees {
width: 144px;
margin-right: 10px;
}
#zip, #zip,
#month, #month,
#day, #day,
...@@ -629,7 +651,9 @@ input[type="email"] { ...@@ -629,7 +651,9 @@ input[type="email"] {
margin-top: 0; margin-top: 0;
} }
p + .form_checkbox {
margin-top: 0;
}
.form_select { .form_select {
margin-left: 16px; margin-left: 16px;
...@@ -666,6 +690,8 @@ input[type="email"] { ...@@ -666,6 +690,8 @@ input[type="email"] {
width: 100%; width: 100%;
color: #dc3b3a; color: #dc3b3a;
font-size: 14px; font-size: 14px;
display: none!important;
} }
.form_row .right .alert_area { .form_row .right .alert_area {
margin-top: -10px; margin-top: -10px;
...@@ -699,12 +725,13 @@ input[type="email"] { ...@@ -699,12 +725,13 @@ input[type="email"] {
margin-bottom: 20px; margin-bottom: 20px;
} }
.contact-bottom-buttons { .contact-bottom-buttons {
margin-top: 60px; margin: 60px auto 0;
display: -webkit-box; display: -webkit-box;
display: -webkit-flex; display: -webkit-flex;
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
min-height: 81px; min-height: 81px;
width: 80%;
} }
.contact-bottom-buttons .left { .contact-bottom-buttons .left {
width: 33.75%; width: 33.75%;
...@@ -765,8 +792,8 @@ input[type="email"] { ...@@ -765,8 +792,8 @@ input[type="email"] {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
} }
.form_row.form_row_content .right label:not(:first-child) { .form_row.form_row_theme .right label:not(:first-child) {
margin-left: 40px; margin-left: 0;
} }
#last_name, #last_name,
#first_name, #first_name,
...@@ -858,28 +885,34 @@ input[type="email"] { ...@@ -858,28 +885,34 @@ input[type="email"] {
confirm confirm
------------------------------------------ */ ------------------------------------------ */
#p-confirm .form_row { .p-contact-confirm .form_row {
padding-top: 15px; padding-top: 15px;
padding-bottom: 15px; padding-bottom: 15px;
} }
#p-confirm p + .form_row { .p-contact-confirm .form_row.form_row_02 .right .label_text,
margin-top: 60px; .p-contact-confirm .form_row.form_row_02 .right label {
width: auto;
} }
#p-confirm .contact-bottom-buttons { .p-contact-confirm .form_row.form_row_02 .right label + label {
border-top: 1px solid #c4c2bf; margin-left: 20px;
}
#p-confirm .contact-bottom-buttons button[type="submit"] {
margin-top: 60px;
} }
@media(max-width:768px) {
#p-confirm .contact-bottom-buttons .left button[type="submit"] { @media(max-width:768px) {
margin-bottom: 0px; .p-contact-confirm .form_row {
padding-top: 0;
}
.p-contact-confirm .form_row .left {
padding-bottom: 8px;
} }
#p-confirm .contact-bottom-buttons .right button[type="submit"] { .form_row_theme .right .form_radiobox label {
margin-top: 30px; width: 100%;
margin-left: 0;
}
.p-contact-confirm .contact-bottom-buttons .c-btn1,
.p-contact-confirm .contact-bottom-buttons .left button[type="submit"] {
margin-bottom: 0px;
} }
} }
......
achievement-official.conohawing.com/contact/form/confirm.php 0 → 100644
<?php $pageid="contact";?>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/header.php'); ?>
<div class="p-other">
<div class="c-breadcrumb pc-only">
<ul class="c-breadcrumb__inner">
<li class="c-breadcrumb__item"><a href="/"><span>TOP</span></a></li>
<li class="c-breadcrumb__item"><a href="/contact/"><span>お問い合わせ</span></a></li>
<li class="c-breadcrumb__item"><span>お問い合わせ内容の確認</span></li>
</ul>
</div>
<section class="c-mainvisual p-other-mv">
<div class="c-mainvisual__inner">
<h2 class="c-mainvisual__ttl">お問い合わせ内容の確認</h2>
</div>
</section>
<div class="container">
<main class="p-contact-content p-contact-confirm">
<section class="otherSingle2">
<form method="post" action="">
<div class="form_row form_row_content">
<div class="left"><label for="form_content">ご相談内容</label></div>
<div class="right">
<label><span class="label_text">サービス</span></label>
</div>
</div>
<div class="form_row form_row_02">
<div class="left"><label for="last_name">お名前</label></div>
<div class="right">
<label><span class="label_text">性お名前</span></label>
<label><span class="label_text">名お名前</span></label>
</div>
</div>
<div class="form_row form_row_02">
<div class="left"><label for="last_name_kana">お名前(かな)</label></div>
<div class="right">
<label><span class="label_text">セイお名前(かな)</span></label>
<label><span class="label_text">メイお名前(かな)</span></label>
</div>
</div>
<div class="form_row">
<div class="left"><label for="tel_no">電話番号</label></div>
<div class="right">
<label><span class="label_text">00000000000</span></label>
</div>
</div>
<div class="form_row">
<div class="left"><label for="regist_email">メールアドレス</label></div>
<div class="right">
<label><span class="label_text">aaa@aaa.com</span></label>
</div>
</div>
<div class="form_row">
<div class="left"><label for="office_name">会社名</label></div>
<div class="right">
<label><span class="label_text">会社名会社名会社名</span></label>
</div>
</div>
<div class="form_row">
<div class="left"><label for="position">役職</label></div>
<div class="right">
<label><span class="label_text">役職役職役職役職役職</span></label>
</div>
</div>
<div class="form_row">
<div class="left"><label for="industry">業種</label></div>
<div class="right">
<label><span class="label_text">業種業種業種業種業種業種</span></label>
</div>
</div>
<div class="form_row">
<div class="left"><label for="number_of_employees">社員数</label></div>
<div class="right">
<label><span class="label_text">00000</span><span class="label_text">人</span></label>
</div>
</div>
<div class="form_row form_row_theme">
<div class="left"><label for="form_theme">テーマとされていること</label></div>
<div class="right">
<label><span class="label_text">離職率の低下</span></label>
</div>
</div>
<div class="form_row">
<div class="left">お問合わせ内容</div>
<div class="right">
<label><span class="label_text">お問合わせ内容お問合わせ内容お問合わせ内容<br>お問合わせ内容お問合わせ内容お問合わせ内容<br>お問合わせ内容お問合わせ内容お問合わせ内容<br>お問合わせ内容お問合わせ内容お問合わせ内容</span></label>
</div>
</div>
<div class="form_row">
<div class="left">個人情報保護方針</div>
<div class="right">
<label><span class="label_text">「個人情報保護取扱いについて」及び「プライバシーポリシー」を確認のうえ、同意しました。</span></label>
</div>
</div>
<div class="contact-bottom-buttons">
<div class="left c-btn1">
<button type="submit" name="action" value="back" class="c-btn1__txt">入力内容修正</button>
</div>
<div class="right c-btn1 c-btn-faq">
<button type="submit" name="action" value="submit" class="c-btn1__txt">送信する</button>
</div>
</div>
</form>
</section>
</main>
</div>
</div>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/footer.php'); ?>
achievement-official.conohawing.com/contact/form/thanks.php 0 → 100644
<?php $pageid="contact";?>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/header.php'); ?>
<div class="p-other">
<div class="c-breadcrumb pc-only">
<ul class="c-breadcrumb__inner">
<li class="c-breadcrumb__item"><a href="/"><span>TOP</span></a></li>
<li class="c-breadcrumb__item"><a href="/contact/"><span>お問い合わせ</span></a></li>
<li class="c-breadcrumb__item"><span>送信完了</span></li>
</ul>
</div>
<section class="c-mainvisual p-other-mv">
<div class="c-mainvisual__inner">
<h2 class="c-mainvisual__ttl">送信完了</h2>
</div>
</section>
<div class="container">
<main class="p-contact-content p-contact-confirm">
<section class="otherSingle2">
<h3 class="c-title1">お問い合わせを受け付けました。</h3>
<p class="p-contact-text2">お問い合わせ内容を確認し、担当者よりご連絡を差し上げます。<br>
尚、お問い合わせの内容により、多少お時間をいただく場合がございます。<br>
予め、ご了承ください。</p>
<div class="contact-bottom-buttons">
<div class="c-btn1 c-btn-faq">
<a href="/" class="c-btn1__txt">トップページへ</a>
</div>
</div>
</section>
</main>
</div>
</div>
<?php include($_SERVER['DOCUMENT_ROOT'] . '/assets/include/footer.php'); ?>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment