@charset "UTF-8";
/* 
----------------------------------------------------------------------------

	フォーム系 共通

	お問い合わせ
	見学・体験　申し込み

--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
	フォーム系　共通
--------------------------------------------------------------------------*/
/*-------------------------------
	導入部
--------------------------------*/
.form_sbj { text-align: center; }
.form_sbj span { padding: 0 0 0 30px; display: inline-block; line-height: 1.2; color: #70c0e8; background: url("../img/ar02_lb_b.png") no-repeat left top 9px; background-size: 12px auto; font-size: 24px; font-weight: 500; }

.form_intro { margin: 0 auto 70px auto; padding: 0 10px; text-align: center; }
.form_intro p.about { margin: 15px auto 0 auto; }
.form_intro p.about a { margin: 0 auto; padding: 10px 10px; border: 1px solid #3692b5; display: block; width: 100%; max-width: 500px; border-radius: 3px; }
.form_intro p.about a span { padding: 0 24px 0 0; display: inline-block; }
.form_intro p.about a:link, .form_intro p.about a:visited { color: #3692b5; background: #fff; }
.form_intro p.about a:link span, .form_intro p.about a:visited span { background: url("../img/ic_window01.png") no-repeat right center; background-size: 18px auto; }
.form_intro p.about a:active, .form_intro p.about a:hover { color: #fff; background: #3692b5; }
.form_intro p.about a:active span, .form_intro p.about a:hover span { background: url("../img/ic_window02.png") no-repeat right center; background-size: 18px auto; }

.form_tel { padding: 0 10px; }
.form_tel .form_sbj { margin: 0 auto 20px auto; }

/*-------------------------------
	入力フォーム
--------------------------------*/
#mailform_box .form_sbj { margin: 100px auto 20px auto; padding: 0 10px; }

#formMain { padding: 50px 10px; background: #f2f9fb; }
#formMain #formIn { margin: 0 auto; max-width: 900px; }
#formMain #formIn section { display: table; margin: 30px 0 0 0; width: 100%; }
#formMain #formIn section:first-of-type { margin: 0; }
#formMain #formIn section.line > div { vertical-align: top; }
#formMain #formIn section > div { display: table-cell; vertical-align: top; }
#formMain #formIn section .fName { padding: 14px 20px 0 0; width: 340px; font-size: 14px; }
#formMain #formIn section .fName h3, #formMain #formIn section .fName h4 { margin: 0; padding: 0; display: block; font-size: 17px; font-weight: 500; }
#formMain #formIn section .fName h3 span.att_multi, #formMain #formIn section .fName h4 span.att_multi { padding: 0; display: block; font-size: 13px; font-weight: 500; }
#formMain #formIn section .fName span { padding: 0 0 0 60px; display: block; }
#formMain #formIn section .fName span:first-child { margin: 7px 0 0 0; padding: 0; display: block; float: left; width: 50px; line-height: 20px; background-color: #999; color: #fff; font-size: 14px; font-weight: 500; text-align: center; letter-spacing: 0; border-radius: 3px; letter-spacing: 0; }
#formMain #formIn section .fName .c_dome { padding: 2px 0 0 0; display: block; clear: both; line-height: 1.4; color: #d23939; font-size: 12px; font-weight: 400; letter-spacing: 0; }
#formMain #formIn section .fName .c_dome br.sp { display: none; }
#formMain #formIn section .fValue input[type="text"] { padding: 10px 10px 10px 20px; border: 1px solid #fff; width: 100%; height: 60px; line-height: 1.6; background: #fff; color: #444; font-size: 15px; font-family: 'Lato', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif; font-weight: 500; border-radius: 3px; }
#formMain #formIn section .fValue input[type="text"]::placeholder { color: #999; }
#formMain #formIn section .fValue textarea { padding: 10px 10px 10px 20px; border: 1px solid #fff; width: 100%; height: 180px; line-height: 1.6; color: #444; background: #fff; font-size: 15px; font-family: 'Lato', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif; font-weight: 500; resize: vertical; border-radius: 3px; }
#formMain #formIn section .fValue textarea::placeholder { color: #999; }
#formMain #formIn section .fValue ul.select_one { display: flex; display: -webkit-flex; flex-wrap: wrap; }
#formMain #formIn section .fValue ul.select_one.col li { margin: 10px auto 0 auto; }
#formMain #formIn section .fValue ul.select_one.col li:first-of-type { margin: 0 auto; }
#formMain #formIn section .fValue ul.select_one.line02 li { width: 50%; }
#formMain #formIn section .fValue ul.select_one.line03 li { width: 33.33%; }
#formMain #formIn section .fValue ul.select_one.line04 li { width: 25%; }
#formMain #formIn section .fValue ul.select_one li { display: table; width: 100%; font-size: 15px; table-layout: fixed; }
#formMain #formIn section .fValue ul.select_one li input, #formMain #formIn section .fValue ul.select_one li > span { display: inline-block; vertical-align: top; }
#formMain #formIn section .fValue ul.select_one li input { margin: 8px 10px 0 10px; width: 20px; }
#formMain #formIn section .fValue ul.select_one li input:hover { cursor: pointer; }
#formMain #formIn section .fValue ul.select_one li input[type="checkbox"], #formMain #formIn section .fValue ul.select_one li input[type="radio"] { display: table-cell; }
#formMain #formIn section .fValue ul.select_one li input[type="checkbox"]:checked + label, #formMain #formIn section .fValue ul.select_one li input[type="radio"]:checked + label { color: #fff; background-color: #3692b5; }
#formMain #formIn section .fValue ul.select_one li label { padding: 8px 5px 8px 35px; display: table-cell; width: 100%; border-radius: 3px; }
#formMain #formIn section .fValue ul.select_one li label:hover { color: #3692b5; background-color: #d8edf5; cursor: pointer; }
#formMain #formIn section .fValue ul.select_one li label.mfp_checked { color: #fff; background-color: #3692b5; }
#formMain #formIn section .fValue p.att { margin: 10px 0 0 0; color: #d23939; font-size: 12px; }
#formMain #formIn section .fValue p.att.line { padding: 0 0 0 1em; text-indent: -1em; }
#formMain #formIn .hisu .fName span:first-child { background-color: #3692b5; }
#formMain #formIn #fm_privacy { margin: 50px 0 0 0; padding: 40px 0 0 0; border-top: 1px solid #70c0e8; }
#formMain #formIn #fm_privacy dl.privacy_about { margin: 0 0 15px 0; }
#formMain #formIn #fm_privacy dl.privacy_about dt { color: #3692b5; font-weight: 700; }
#formMain #formIn #fm_privacy dl.privacy_about dd { font-size: 14px; }
#formMain #formIn #fm_privacy ul.select_one li input[type="checkbox"]:checked + label, #formMain #formIn #fm_privacy ul.select_one li input[type="radio"]:checked + label { color: #fff; background-color: #3692b5; }
#formMain #formIn #fm_privacy ul.select_one li label { border: 1px solid #3692b5; color: #3692b5; background-color: #fff; font-size: 17px; }
#formMain #formIn #fm_privacy ul.select_one li label:hover { border: 1px solid #3692b5; background-color: #d8edf5; }
#formMain #formIn #fm_privacy ul.select_one li label.mfp_checked { border: 1px solid #3692b5; background-color: #3692b5; }

#formBtn { margin: 85px 0 0 0; text-align: center; }
#formBtn button { display: inline-block; width: 100% !important; height: 100px !important; max-width: 420px !important; font-size: 24px !important; font-weight: 700 !important; font-family: 'Lato', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif !important; font-weight: 500 !important; letter-spacing: 0.1em !important; color: #fff !important; background-color: #52b8d0 !important; border: 1px solid #52b8d0 !important; cursor: pointer !important; border-radius: 3px !important; text-shadow: none !important; }
#formBtn button:hover, #formBtn button:active { text-decoration: none !important; opacity: 0.7; }

/*-------------------------------
	送信完了共通
--------------------------------*/
#contact_thanks .frm { margin: 0 auto; text-align: center; }
#contact_thanks .frm h3 { line-height: 1.4; color: #70c0e8; font-size: 24px; font-weight: 500; letter-spacing: 0.14em; }
#contact_thanks .frm .comment { margin: 40px 0 30px 0; padding: 70px 20px; background: #f9fcfc; }
#contact_thanks .back_btn { margin: 70px auto 0 auto; }

#contact_thanks.contact .frm, #contact_thanks.appoint .frm { max-width: 900px; }

/*-------------------------------
	エラーチェック共通
--------------------------------*/
#formWrap .error { text-align: center; }
#formWrap .error .error_sbj { margin: 0 0 30px 0; line-height: 1.2; color: #52b8d0; font-size: 24px; font-weight: 700; }
#formWrap .error div { margin: 0 0 50px 0; }
#formWrap .error input { display: inline-block; width: 100%; height: 70px; max-width: 300px; border: none; cursor: pointer; background: #0093b8; color: #fff; font-size: 23px; font-weight: 500; font-family: 'Lato', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif; font-weight: 500; border-radius: 3px; }
#formWrap .error input:hover, #formWrap .error input:active { opacity: 0.7; }
#formWrap .error .error_messe { color: #d23939; font-weight: 500; }

/*-------------------------------
	送信内容確認共通
--------------------------------*/
#formWrap .last .check_sbj { margin: 0 0 30px 0; line-height: 1.2; color: #52b8d0; font-size: 24px; font-weight: 700; text-align: center; }
#formWrap .last .text { margin: 0 0 50px 0; text-align: center; }
#formWrap .last article { margin: 0 auto 50px; border-top: #999 1px solid; border-left: #999 1px solid; width: 100%; max-width: 800px; }
#formWrap .last article section { width: 100%; display: table; }
#formWrap .last article section h3, #formWrap .last article section div { border-bottom: #999 1px solid; border-right: #999 1px solid; padding: 10px 15px; display: table-cell; font-size: 14px; text-align: left; }
#formWrap .last article section h3 { width: 200px; background: #f2f9fb; }
#formWrap .last #btn { text-align: center; }
#formWrap .last #btn input[type="submit"], #formWrap .last #btn input[type="button"] { margin: 0 5px; border: none; display: inline-block; width: 100%; height: 70px; font-size: 21px; font-weight: 500; font-family: 'Lato', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif; max-width: 240px; cursor: pointer; border-radius: 3px; }
#formWrap .last #btn input[type="submit"] { color: #fff; background-color: #0093b8; }
#formWrap .last #btn input[type="submit"]:hover, #formWrap .last #btn input[type="submit"]:active { color: #fff; background-color: #52b8d0; }
#formWrap .last #btn input[type="button"] { color: #fff; background-color: #999; }
#formWrap .last #btn input[type="button"]:hover, #formWrap .last #btn input[type="button"]:active { opacity: 0.7; }
#formWrap .last_req article section h5 { width: 250px; }

/*-------------------------------
	項目選択・日時選択
--------------------------------*/
#formMain #formIn section .select_entry select { padding: 0 20px; border: 1px solid #333; background: url("../img/select_down.png") no-repeat #e7eae7 right 20px center; background-size: 10px 8px; color: #333; font-size: 16px; font-family: 'Lato', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif; font-weight: 500; width: 260px; height: 50px; -webkit-appearance: none; /* (Google Chrome、Safari用) */ -moz-appearance: none; /* (Firefox用) */ appearance: none; }
#formMain #formIn section .select_entry select#time { width: 200px; }
#formMain #formIn section .select_entry select#time option[disabled=""] { display: none; }

/*--------------------------------------------------------------------------
	お問い合わせ
--------------------------------------------------------------------------*/
#contact.contact .contact_parts { margin: 0 auto 80px auto; text-align: center; }
#contact.contact .contact_parts .contact_tel_info { margin: 50px auto 60px auto; }
#contact.contact .contact_parts .privacy { padding: 40px 20px; border: 4px solid #568dce; }
#contact.contact .contact_parts .privacy a { margin: 10px 0 0 0; display: inline-block; font-size: 16px; }
#contact.contact .contact_parts .privacy a:link, #contact.contact .contact_parts .privacy a:visited { color: #f14a42; }
#contact.contact .contact_parts .privacy a:active, #contact.contact .contact_parts .privacy a:hover { color: #2c78aa; }

/*# sourceMappingURL=sub_form.css.map */
