@charset "UTF-8";
/*　[sp]
----------------------------------------------------------------------------

	フォーム系 共通

	お問い合わせ
	資料請求
	オンライン相談申込フォーム
	お施主様専用 アフターメンテナンス
	お施主様専用 定期点検のご予約
	お施主様専用 外壁屋根無料点検申込
	協力業者様募集
	土地 お問い合わせ

	採用情報　フォーム系共通
	採用情報　新卒採用　会社説明会参加申し込みフォーム
	採用情報　キャリア採用　エントリーフォーム
	採用情報　キャリア採用 郵送してエントリー

	注文住宅に関するお問い合わせ
	お施主様専用アフターメンテナンス

--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
	フォーム系　共通
--------------------------------------------------------------------------*/
/*-------------------------------
	導入部
--------------------------------*/
@media screen and (max-width: 1200px) { #flow_list { max-width: 700px; }
  #flow_list h2 { text-align: center; }
  #flow_list ul::after { content: ''; width: 100%; }
  #flow_list ul::before { content: ''; order: 2; width: 100%; }
  #flow_list ul li { padding: 0 5px 0; width: 33.33%; }
  #flow_list ul li:nth-of-type(n+4) { order: 1; margin-top: 10px; transform: translateX(50%); } }
/*1200px*/
@media screen and (max-width: 768px) { #form_intro_area { padding-bottom: 35px; }
  #form_intro_area > p + p { margin-top: 20px; }
  #form_intro_area .bg_area { margin: 30px auto 0; padding: 15px 10px 10px; max-width: 400px; }
  #form_intro_area + #form_tel { margin-top: 40px; }
  #form_tel { padding-bottom: 40px; }
  #form_tel h2 { margin-bottom: 15px; font-size: 18px; }
  #form_tel + #form_info_text { margin-top: 35px; }
  #form_info_text { text-align: center; }
  #form_info_text h2 { margin-bottom: 15px; font-size: 18px; }
  #form_info_text ul li { background-position: left top 7px; padding: 0 0 0 15px; }
  #form_info_text + #mailform_box { margin-top: 45px; }
  #flow_list { margin-top: 40px; }
  #flow_list h2 { margin-bottom: 15px; font-size: 18px; }
  #flow_list ul { display: block; max-width: 300px; }
  #flow_list ul::after { content: inherit; }
  #flow_list ul::before { content: inherit; }
  #flow_list ul li { padding: 0; width: 100%; }
  #flow_list ul li:nth-of-type(n+2) { margin-top: 10px; transform: none; }
  #flow_list ul li > div { padding: 10px; text-align: left; }
  #flow_list ul li > div > span { width: 25px; height: 25px; font-size: 14px; }
  #flow_list ul li > div p { display: inline-block; margin-top: 0; padding: 0 0 0 10px; } }
/*768px*/
@media screen and (max-width: 640px) { #form_intro_area > p { text-align: left; }
  #form_intro_area > p .in_blo { display: inline; } }
/*640px*/
@media screen and (max-width: 480px) { #form_intro_area .bg_area { max-width: 100%; }
  #form_intro_area .bg_area p { text-align: left; }
  #form_intro_area .bg_area p:last-of-type { text-align: center; }
  #form_intro_area .bg_area p .in_blo { display: inline; } }
/*480px*/
/*-------------------------------
	入力フォーム
--------------------------------*/
@media screen and (max-width: 1000px) { #mailform_box #form_box .items > div.fValue.block_box.four label { width: 49.5%; }
  #mailform_box #form_box .items > div.fValue.block_box.four label.full_item { width: 100%; } }
/*1000px*/
@media screen and (max-width: 768px) { #mailform_box .form_title { padding: 12px 10px 10px; font-size: 14px; }
  #mailform_box #form_box { /*プライバシーポリシーの同意*/ }
  #mailform_box #form_box .top_block { margin-bottom: 30px; padding-bottom: 30px; }
  #mailform_box #form_box .items { display: block; margin: 30px 0 0 0; width: 100%; }
  #mailform_box #form_box .items > div { display: block; vertical-align: top; }
  #mailform_box #form_box .items > div.fName { width: 100%; }
  #mailform_box #form_box .items > div.fName label { display: table; width: 100%; }
  #mailform_box #form_box .items > div.fName label > span { display: table-cell; vertical-align: top; }
  #mailform_box #form_box .items > div.fName span { font-size: 14px; }
  #mailform_box #form_box .items > div.fName span.type_m, #mailform_box #form_box .items > div.fName span.type_f { width: 60px; }
  #mailform_box #form_box .items > div.fName span.type_m > span, #mailform_box #form_box .items > div.fName span.type_f > span { display: inline-block; margin-right: 15px; padding: 6px 0 4px; width: 60px; text-align: center; font-size: 12px; }
  #mailform_box #form_box .items > div.fName span br { display: none; }
  #mailform_box #form_box .items > div.fName .sub_tx { margin-top: 10px; line-height: 1.5; font-size: 12px; }
  #mailform_box #form_box .items > div.fName .sub_tx br { display: none; }
  #mailform_box #form_box .items > div.fValue { margin-top: 10px; }
  #mailform_box #form_box .items > div.fValue input { margin: 0; padding: 8px 8px; width: 100%; letter-spacing: 0.08em; font-size: 15px; }
  #mailform_box #form_box .items > div.fValue.label_list label { display: inline-block; margin: 0 0 5px; padding: 10px 12px 8px; width: 100%; height: auto; text-align: left; font-size: 13px; }
  #mailform_box #form_box .items > div.fValue.label_list label input { vertical-align: sub; width: 16px; height: 16px; margin: 0 10px 0 0; padding: 0; }
  #mailform_box #form_box .items > div.fValue.label_list.tenken label span { font-size: 16px; font-weight: 700; }
  #mailform_box #form_box .items > div.fValue.block_box { display: -webkit-flex; display: flex; flex-wrap: wrap; }
  #mailform_box #form_box .items > div.fValue.block_box label { margin: 0 0 5px; }
  #mailform_box #form_box .items > div.fValue.block_box.two label { width: 49.5%; text-align: center; }
  #mailform_box #form_box .items > div.fValue.block_box.three label { width: 32.5%; }
  #mailform_box #form_box .items > div.fValue.block_box.four label { width: 100%; }
  #mailform_box #form_box .items > div.fValue.block_box.four label.full_item { width: 100%; }
  #mailform_box #form_box .items > div.fValue.block_box.gender label { width: 118px; }
  #mailform_box #form_box .items > div.fValue textarea { margin: 0; padding: 8px 8px; width: 100%; font-size: 15px; font-weight: 500; }
  #mailform_box #form_box .items > div.fValue select { background: url(../img/arrow_down01.png) no-repeat #fff right 10px center; background-size: 8px auto; margin: 0 10px 5px 0; padding: 8px 8px; }
  #mailform_box #form_box .items > div.fValue select.office, #mailform_box #form_box .items > div.fValue select.hour { width: 180px; font-size: 13px; }
  #mailform_box #form_box .items > div.fValue select.month, #mailform_box #form_box .items > div.fValue select.day { width: 80px; }
  #mailform_box #form_box .items > div.fValue.file_send dl dt { width: 50px; }
  #mailform_box #form_box .items > div.fValue.file_send .temp_text { margin: 20px 0 0 0; font-size: 12px; }
  #mailform_box #form_box .item_privacy { margin-top: 30px; padding-top: 30px; }
  #mailform_box #form_box .item_privacy #form_privacy a { margin-bottom: 20px; }
  #mailform_box #form_btn { margin-top: 50px; }
  #mailform_box #form_btn button { display: block; margin: 0 auto 0; padding: 25px 0 22px; width: 100%; height: auto; max-width: 400px; font-size: 15px; } }
/*768px*/
@media screen and (max-width: 480px) { #mailform_box #form_box .items > div.fValue.block_box.two label { width: 100%; text-align: left; }
  #mailform_box #form_box .items > div.fValue.block_box.three label { width: 100%; } }
/*480px*/
/*-------------------------------
	送信完了共通
--------------------------------*/
@media screen and (max-width: 768px) { #mail_thanks #mailform_thanks { text-align: center; }
  #mail_thanks #mailform_thanks h2 { font-size: 20px; }
  #mail_thanks #mailform_thanks p { margin-top: 30px; }
  #mail_thanks #mailform_thanks p + p { margin-top: 20px; }
  #mail_thanks #mailform_tel { margin-top: 50px; }
  #mail_thanks .back_btn { margin-top: 50px; } }
/*768px*/
@media screen and (max-width: 480px) { #mail_thanks #mailform_thanks p { text-align: left; }
  #mail_thanks #mailform_thanks p br.sp_no { display: none; }
  #mail_thanks #mailform_thanks p .in_blo { display: inline; } }
/*480px*/
/*-------------------------------
	送信内容確認共通
--------------------------------*/
@media screen and (max-width: 1000px) { #mfp_phase_confirm .mfp_buttons { margin: 0 auto 0; max-width: 370px; }
  #mfp_phase_confirm .mfp_buttons button#mfp_button_cancel { margin: 0; }
  #mfp_phase_confirm .mfp_buttons button#mfp_button_send { margin: 30px 0 0; } }
/*1000px*/
@media screen and (max-width: 768px) { #mfp_phase_confirm { padding: 20px 10px 40px; }
  #mfp_phase_confirm h4 { font-size: 16px; }
  #mfp_phase_confirm table#mfp_confirm_table tr th { padding: 10px 5px 8px; }
  #mfp_phase_confirm table#mfp_confirm_table tr td { padding: 10px 10px 8px; }
  #mfp_phase_confirm .mfp_buttons button { margin: 20px auto 0; font-size: 15px; }
  #mfp_phase_confirm .mfp_buttons button#mfp_button_cancel { margin: 0; }
  #mfp_phase_confirm .mfp_buttons button#mfp_button_send { margin: 20px 0 0; } }
/*768px*/
/*--------------------------------------------------------------------------
	お問い合わせ
--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
	オンライン相談申込フォーム
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #appoint_meeting #ap_meeting_frm #mailform_box { margin-top: 50px; } }
/*768px*/
@media screen and (max-width: 640px) { #appoint_meeting #ap_meeting_frm #form_intro_area > p a { display: block; margin-top: 5px; text-align: center; } }
/*640px*/
/*--------------------------------------------------------------------------
	お施主様専用 アフターメンテナンス
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #after #after_frm .banner_link + #form_info_text { margin: 40px auto 0; padding-top: 35px; }
  #after #after_frm #mailform_box { margin-top: 20px; }
  .after_all #form_tel #mailform_tel.tel_areatype.tel_after > div section > div h3 { font-size: 16px; } }
/*768px*/
/*--------------------------------------------------------------------------
	お施主様専用 定期点検のご予約
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #inspection #inspection_frm #form_intro_area .bg_area { max-width: 500px; } }
/*768px*/
@media screen and (max-width: 480px) { #inspection #inspection_frm #form_intro_area .bg_area p { text-align: left; } }
/*480px*/
/*--------------------------------------------------------------------------
	お施主様専用 外壁屋根無料点検申込
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #inspection_wallroof #wallroof_frm #form_info_text { padding-bottom: 35px; }
  #inspection_wallroof #wallroof_frm #mailform_box { margin-top: 40px; } }
/*768px*/
/*--------------------------------------------------------------------------
	協力業者様募集
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #collabo #collabo_frm #collabo_main > h2 { padding-left: 15px; font-size: 14px; }
  #collabo #collabo_frm #collabo_main > h2 p span.an_eng { font-size: 25px; }
  #collabo #collabo_frm #collabo_main > h2 p span.an_jp { font-size: 14px; }
  #collabo #collabo_frm #collabo_main #fp_head article p { font-size: 15px; }
  #collabo #collabo_frm #collabo_main #fp_head > p { margin-top: 45px; font-size: 16px; }
  #collabo #collabo_frm #collabo_main #fp_head .intro { margin: 40px auto 0; }
  #collabo #collabo_frm #collabo_main #fp_head .intro p { text-align: left; }
  #collabo #collabo_frm #collabo_main #fp_head .intro .img_area { margin: 45px auto 0; }
  #collabo #collabo_frm #collabo_main #fp_head .intro .img_area .caution { margin-top: 5px; }
  #collabo #collabo_frm #collabo_main #fp_head .collabo_info { display: block; max-width: 500px; }
  #collabo #collabo_frm #collabo_main #fp_head .collabo_info > div { padding: 0; width: 100%; }
  #collabo #collabo_frm #collabo_main #fp_head .collabo_info > div:nth-of-type(n+2) { margin-top: 20px; }
  #collabo #collabo_frm #collabo_main #fp_head .collabo_info > div > div { padding: 15px; }
  #collabo #collabo_frm #collabo_main #fp_head .collabo_info > div > div h2 { padding-left: 15px; font-size: 14px; }
  #collabo #collabo_frm #collabo_main #fp_head .form_info { margin-top: 45px; line-height: 1.8; }
  #collabo #collabo_frm #collabo_main #fp_head .form_info span { font-size: 13px; } }
/*768px*/
@media screen and (max-width: 480px) { #collabo #collabo_frm #collabo_main > h2 p span.an_jp { font-size: 13px; }
  #collabo #collabo_frm #collabo_main #fp_head > p { text-align: left; }
  #collabo #collabo_frm #collabo_main #fp_head > p .sp_no { display: none; }
  #collabo #collabo_frm #collabo_main #fp_head .form_info { text-align: left; } }
/*480px*/
/*--------------------------------------------------------------------------
	土地 お問い合わせ
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #estate_contact #form_frm #mailform_box #form_box .items.select_estate .fValue > div { background-position: left top 4px; } }
/*768px*/
@media screen and (max-width: 640px) { #estate_contact_thx #mailform_thanks p { text-align: left; }
  #estate_contact_thx #mailform_thanks p .in_blo { display: inline; }
  #estate_contact_thx #mailform_thanks p br.sp_no { display: none; } }
/*640px*/
/*--------------------------------------------------------------------------
	採用情報　フォーム系共通
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #recruit_appo h2.form_t { background-position: left top; margin: 0 auto 10px; padding-left: 15px; font-size: 18px; }
  #recruit_appo #mfp_phase_confirm { margin-top: 15px; } }
/*768px*/
/*--------------------------------------------------------------------------
	採用情報　新卒採用　会社説明会参加申し込みフォーム
--------------------------------------------------------------------------*/
@media screen and (max-width: 480px) { #recruit_appo.graduates_form #mailform_box #form_box .items > div.fValue.file_send dl { display: block; }
  #recruit_appo.graduates_form #mailform_box #form_box .items > div.fValue.file_send dl dt, #recruit_appo.graduates_form #mailform_box #form_box .items > div.fValue.file_send dl dd { display: block; } }
/*768px*/
/*--------------------------------------------------------------------------
	採用情報　キャリア採用　エントリーフォーム
--------------------------------------------------------------------------*/
@media screen and (max-width: 480px) { #mailform_box #form_box .items > div.fValue.file_send dl { display: block; }
  #mailform_box #form_box .items > div.fValue.file_send dl dt, #mailform_box #form_box .items > div.fValue.file_send dl dd { display: block; } }
/*768px*/
/*--------------------------------------------------------------------------
	採用情報　キャリア採用 郵送してエントリー
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { #recruit_appo.mailing #mailing_date { margin: 0 auto 50px; padding: 20px 10px 15px; }
  #recruit_appo.mailing #mailing_date h3 { margin-bottom: 15px; font-size: 13px; font-weight: 500; }
  #recruit_appo.mailing #mailing_date dl { display: block; }
  #recruit_appo.mailing #mailing_date dl:nth-of-type(n+2) { margin-top: 20px; }
  #recruit_appo.mailing #mailing_date dl dt, #recruit_appo.mailing #mailing_date dl dd { display: block; }
  #recruit_appo.mailing #mailing_date dl dt { width: 100%; }
  #recruit_appo.mailing #mailing_date dl dt span { padding: 4px 0 0; }
  #recruit_appo.mailing #mailing_date dl dd { padding: 10px 0 0; } }
/*768px*/
/*--------------------------------------------------------------------------
	注文住宅に関するお問い合わせ・お施主様専用アフターメンテナンス　共通
--------------------------------------------------------------------------*/
@media screen and (max-width: 768px) { .contact_page .contact_page_frm section + section { margin-top: 50px; }
  .contact_page .contact_page_frm section h2 { background-size: 60px auto; padding: 70px 0 0; font-size: 20px; }
  .contact_page .contact_page_frm section .block { flex-wrap: wrap; margin: 20px auto 0; max-width: 600px; }
  .contact_page .contact_page_frm section .block > div { padding: 0; width: 100%; }
  .contact_page .contact_page_frm section .block > div:last-of-type { margin-top: 30px; padding: 0; }
  .contact_page .contact_page_frm section .block > div .item { padding: 20px 15px 20px; }
  .contact_page .contact_page_frm section .block > div .item h3 { background-position: left top; padding: 0 0 15px 15px; font-size: 16px; }
  .contact_page .contact_page_frm section .block > div .item ul { margin: 20px auto 0; max-width: 400px; }
  .contact_page .contact_page_frm section .block > div .item ul li a { font-size: 16px; }
  .contact_page .link_button { margin-top: 50px; }
  .contact_page .link_button a { font-size: 15px; } }
/*768px*/
/*--------------------------------------------------------------------------
	注文住宅に関するお問い合わせ
--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
	お施主様専用アフターメンテナンス
--------------------------------------------------------------------------*/
@media screen and (max-width: 480px) { #client_contact.contact_page .contact_page_frm section h2 { font-size: 18px; } }
/*480px*/

/*# sourceMappingURL=sp_form.css.map */