@charset "utf-8";
/* ===================================================
	inquiry CSS
====================================================== */


#lead .tips {
	padding: 40px 0 35px;
    width: 92%;
    max-width: 1100px;
    border: 1px solid #959595;
    margin: 0 auto;}
#lead .tips ul { 
	padding: 0 60px 0px 60px;
    box-sizing: border-box; 
	text-align: left;}
#lead .tips ul li { 
	margin-bottom: 1rem;
	line-height: 1.5;
	text-indent: -0.5rem;}
#lead .tips ul li::before{ content: '・'; }



/* ---------------------------------------------------
form
------------------------------------------------------ */
body{ overflow: auto;}
.lead_txt{ margin-bottom: 25px;}
#form_area{ margin-bottom: 100px;}
#form_area a{ text-decoration: underline;}

/* ▼ mailform PRO のCSS上書き ▼ */
form#mailformpro label:hover { opacity: 0.7; }
form#mailformpro .mfp_area dl dt,
form#mailformpro .mfp_area dl dd { font-size: 16px; border: none; float: none; }
form#mailformpro label { white-space: normal; border-radius: 0; margin: 0; display: inline; }
form#mailformpro .mfp_area .mfp_colored { background-color: none !important;}
form#mailformpro .mfp_area .mfp_not_checked,
form#mailformpro .mfp_area .mfp_checked,
form#mailformpro .mfp_area .mfp_colored {
	margin: 7px 10px 0 0 !important; padding: 0;
	background: none !important; box-shadow: none; border: none;
}
/* ▲ mailform PRO のCSS上書き ▲ */

/* ---------------------------------------------------
 .mfp_area
------------------------------------------------------ */
/* ▼ mailform PRO のCSS上書き ▼ */
#mailformpro .mfp_area dl dt,
#mailformpro .mfp_area dl dd { font-size: 16px; border: none; float: none; }
#mailformpro label { white-space: normal; border-radius: 0; margin: 0; display: inline; }
#mailformpro .mfp_area .mfp_colored { background-color: none !important;}
#mailformpro .mfp_area .mfp_not_checked,
#mailformpro .mfp_area .mfp_checked,
#mailformpro .mfp_area .mfp_colored { margin: 7px 10px 0 0 !important; padding: 0; background: none !important; box-shadow: none; border: none;}
#mailformpro .mfp_element_button{ text-shadow: none !important;}
/* #mailformpro .mfp_buttons button{ color:#000; } */
#mailformpro label{ border: none; display: block;}
#mailformpro label.mfp_checked{ background-color: transparent !important;}

div#mfp_overlay_inner,
div#mfp_warning{ color: #000;}
/* ▲ mailform PRO のCSS上書き ▲ */


/* ▼ 共通スタイル※消さないで ▼ */
form#mailformpro .mfp_area > dl input,
form#mailformpro .mfp_area > dl select,
form#mailformpro .mfp_area > dl textarea { font-size: 15px; font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif; box-shadow: none; }

form#mailformpro .mfp_area > dl input:focus,
form#mailformpro .mfp_area > dl select:focus,
form#mailformpro .mfp_area > dl textarea:focus,
form#mailformpro .mfp_area .add_box dd > div select:focus { outline: none; border: 2px solid #aaa; }

form#mailformpro .mfp_area > dl input { max-width: 100%; /*height: 40px;*/ margin-top: -4px; padding: 5px 3px; border: 1px solid #aaa; box-sizing: border-box; }

form#mailformpro .mfp_area > dl input:not(input[type=checkbox],input[type=radio]),
form#mailformpro .mfp_area > dl select,
form#mailformpro .mfp_area > dl textarea { border-radius: 0; }
form#mailformpro .mfp_area select::-ms-expand { display: none; }

form#mailformpro .mfp_area { border-top: 1px solid #393939; border-bottom: 1px solid #393939; width: 100%; }
form#mailformpro .mfp_area > dl { width: 100%; box-sizing: border-box; display: flex; }
form#mailformpro .mfp_area > dl:last-of-type dt,
form#mailformpro .mfp_area > dl:last-of-type dd { border-bottom: none; }
form#mailformpro .mfp_area > dl dt,
form#mailformpro .mfp_area > dl dd { margin: 0; box-sizing: border-box; align-items: center; border-bottom: 1px dashed #393939; text-align: left; }
form#mailformpro .mfp_area > dl dt { width: 30%; display: flex; justify-content: flex-end; align-items: center; text-align: right; padding: 25px 25px 25px 77px; position: relative;}
form#mailformpro .mfp_area > dl dd { width: 70%; display: flex; padding: 15px 70px 15px 30px; flex-wrap: wrap; }
form#mailformpro .mfp_area > dl dd > ul { display: flex; justify-content: left; flex-wrap: wrap; width: 100%; }
form#mailformpro .mfp_area > dl dd > ul li { margin: 0 15px 10px 0; text-indent: -1.5em; padding-left: 1.5em; }
form#mailformpro .mfp_area > dl dd div p { font-size: 13px; text-align: left; display: block; width: 100%; }

/* 送信ボタン */
#form_area form#mailformpro .mfp_buttons {
	margin: 63px auto 20px; width: 96%;
	text-align: center; border-radius: 0;
}
#form_area form#mailformpro .mfp_buttons button {
	width: 35%; padding: 20px 0;
	color: #fff; font-size: 16px; background: #845a83; border: none;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-shadow: none; border-radius: 0;
}
#form_area form#mailformpro .mfp_buttons button:hover { opacity: 0.7; box-shadow: none; }

/* エラー表示 */
#form_area form#mailformpro div.mfp_err { margin: 5px 0px 0px 15px; padding: 3px 0px 5px 17px; background-position: 0px 6px; text-indent: 0;}
#form_area form#mailformpro label.mfp_checked { padding: 0; border: none; box-shadow: none; opacity: 1; }
#form_area form#mailformpro .pii_check div.mfp_err { /*width: 25%;*/ margin: 4px auto 0px; }
#form_area form#mailformpro .mfp_not_checked { opacity: 1; padding: 0;}
/* ▲ 共通スタイル※消さないで ▲ */


/* 必須入力項目と任意入力項目 */
.box_must { margin: 0 0 15px; text-align: left;}
.required,
.free{ color: #fff; padding: 1px 0; font-size: 12px; letter-spacing: 0.08em; margin-right: 10px; width: 42px; box-sizing: border-box; display: inline-block; text-align: center;}
form#mailformpro .mfp_area > dl dt .required,
form#mailformpro .mfp_area > dl dt .free{ position: absolute; top: 0; bottom: 0; left: 25px; margin: auto 0; display: block; height: 1.8em;}

/* 必須入力項目 */
.required{ background-color: #cd0404;}

/* 任意入力項目 */
.free{ background-color: #999;}

/* テキストボックス */
form#mailformpro .mfp_area .text_box dd { padding: 30px 70px 30px 30px; }
form#mailformpro .mfp_area .text_box textarea { padding: 5px 3px; width: 87%; max-width: 100%; height: 225px; border: 1px solid #aaa; -webkit-box-sizing: border-box; box-sizing: border-box; }
/* ▲ 選択スタイル※不要なスタイルは削除 ▲ */


@media screen and (max-width: 600px) {
	
	
	#lead .tips {
	padding: 30px 0 15px;
    max-width: 800px;
    border: 1px solid #959595;
    margin: 0 auto;
	width: 100%;}
	#lead .tips ul { 
	padding: 0 40px 0px 40px;
    box-sizing: border-box; 
	text-align: left;}
	
	
	#form_area{ margin-bottom: 15vw;}
	input:not([type="checkbox"]) { width: 100%; }

	form#mailformpro .mfp_area > dl input,
	form#mailformpro .mfp_area > dl select,
	form#mailformpro .mfp_area > dl textarea { font-size: 16px; }

	form#mailformpro .mfp_area input:not([type="checkbox"]),
	form#mailformpro .mfp_area textarea { -webkit-appearance: none; }

	form#mailformpro .mfp_area { border-bottom: none; border-top: none;}
	form#mailformpro .mfp_area > dl { flex-wrap: wrap; border-bottom: none; margin-bottom: 10px; }
	form#mailformpro .mfp_area > dl dt,
	form#mailformpro .mfp_area > dl dd { width: 100%; padding: 10px 0; border-bottom: none; }
	form#mailformpro .mfp_area > dl dt { justify-content: space-between; padding: 8px 2%; background: #f1ece0; }
	form#mailformpro .mfp_area > dl dd { display: block;}
	form#mailformpro .mfp_area > dl dd > ul li { width: 100%; margin-bottom: 10px; }
	form#mailformpro .mfp_area > dl dd > ul li:last-child { margin-bottom: 0; }

	/* 送信ボタン */
	#form_area form#mailformpro .mfp_buttons { margin: 30px auto 20px; }
	#form_area form#mailformpro .mfp_buttons button { width: 100%; }

	/* エラー表示 */
	#form_area form#mailformpro .pii_check div.mfp_err { width: 100%; }

	/* 必須入力項目と任意入力項目 */
	form#mailformpro .mfp_area > dl dt .required,
	form#mailformpro .mfp_area > dl dt .free{ left: inherit; right: 2%;}

	/* テキストボックス */
	form#mailformpro .mfp_area .text_box dd { padding: 15px 0; }
	form#mailformpro .mfp_area .text_box textarea { width: 100%; }

}