@charset "utf-8";
/* CSS Document */


#mfp_hidden{
	display: none;
}
div#mfp_loading {
	display: none;
}
div#mfp_loading_screen {
	display: none;
}
div#mfp_overlay_background {
	display: none;
}
div#mfp_overlay {
	display: none;
}





/*

pcやスマホのブレイクポイントは設置するサイトに合わせて変更してください。
色やレイアウトなどもその都度サイトに合わせて変更してください。

*/

/*------------------------

PC表示ここから

------------------------*/
@media screen and (min-width: 601px){
/* 医院からの説明 */
	.contact_message{}
	.contact_message p{}


/*ここから メールフォーム
-------------------------*/
	form#mailformpro {
		padding: 0!important;
	}
/*入力欄全体*/
	form#mailformpro dl.mailform{
		margin-bottom: 40px;
		/* border-bottom: 1px solid #ccc; */
	}
/*質問箇所（左エリア）*/
	form#mailformpro dl.mailform dt.mfp{
		clear: left;
		float: left;
		width: 300px;
		display: block;
		font-size: 18px;
		text-align: left;
		color: #333;
		padding: 20px 30px 20px 0;
		/* border-top: 1px solid #ccc; */
	}
/*質問箇所（左エリア）の必須項目*/
	form#mailformpro dl.mailform dt.mfp .must {
    display: inline-block;
    background: #f44646;
margin-left: 20px;
    border-radius: 4px;
    padding: 8px 8px;
    font-size: 13px;
		line-height: 1;
float: right;
    color: #fff;
	}
	form#mailformpro dl.mailform dt.mfp .small{
		font-size: 12px;
		color: #525252;
		display: block;
	}
/*入力箇所（右エリア）*/
	form#mailformpro dl.mailform dd.mfp{
		padding: 20px 0;
		margin-left: 350px;
		display: block;
		/* border-top: 1px solid #ccc; */
		font-size: 15px;
		text-align: left;
	}
	form#mailformpro dl.mailform dd.mfp .small{
		font-size: 12px;
	}
/*名前入力ボックス*/
	form#mailformpro dl.mailform dd.mfp .label-box{
		display: inline-block;
	}
	form#mailformpro dl.mailform dd.mfp .left-label{
		float: left;
		margin-right: 30px;
	}
/*チェックボックス*/
	form#mailformpro dl.mailform dd.mfp ol.check-list{}
	form#mailformpro dl.mailform dd.mfp ol.check-list li{
		/* float: left; */
		/* width: calc(100%/3); */
		margin-bottom: 10px;
		padding-left: 22px;
		text-indent: -22px;
	}
/*チェックボックス(その他)*/
	form#mailformpro dl.mailform dd.mfp ol li .sub_input{
		text-align: left;
	}
/*入力ボックス*/
	form#mailformpro dl.mailform dd.mfp input {
    border: solid 1px #CCC;
    border-radius: 3px;
    box-shadow: 0px 0px 5px #CCC inset;
    padding: 3px 8px;
    margin: 2px;
    vertical-align: middle;
	}
	form#mailformpro dl.mailform dd.mfp label{
		display: block;
	}
/*エラーメッセージ*/
	form#mailformpro dl.mailform dd.mfp .mfp_err{
    clear: both;
    display: none;
    text-align: left;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 17px;
    color: #F00;
    font-size: 12px;
    line-height: 1.5em !important;
    background-image: url(img/mfp_error.gif);
    background-repeat: no-repeat;
    background-position: 0px 3px;
	}
/*テキストエリア*/
	form#mailformpro dl.mailform textarea {
		border: solid 1px #CCC;
		border-radius: 3px;
		box-shadow: 0px 0px 5px #CCC inset;
		padding: 3px 8px;
		line-height: 1.5;
		width: 440px!important;
		height: 145px!important;
	}
/*ご予約希望日時*/
	form#mailformpro dl.mailform dd.mfp .rsvchoice{}
	form#mailformpro dl.mailform dd.mfp .rsvchoice .date{
    float: left;
	}
	form#mailformpro dl.mailform dd.mfp .rsvchoice select {
    border: solid 1px #CCC;
    border-radius: 3px;
    box-shadow: 0px 0px 5px #CCC inset;
	}
	form#mailformpro dl.mailform dd.mfp .rsvchoice .time {
    float: left;
		margin-left: 30px;
	}
/*個人情報取り扱いについて*/
	form#mailformpro .privacy{}
	form#mailformpro .privacy .lead-box{
		background: #ebf6f8;
		padding: 30px 50px;
		margin-bottom: 30px;
	}
	form#mailformpro .privacy .ttl{
		margin-bottom: 40px;
	}
	form#mailformpro .privacy .ttl span{
		font-size: 20px;
		color: #01a8c7;
		background: url(/renew_test/common/img/ft_ttl_border.png) bottom repeat-x;
		padding-bottom: 10px;
	}
	form#mailformpro .privacy .lead{
		padding: 0 50px 30px;
	}
	form#mailformpro .privacy .liner{
		background: linear-gradient(transparent 60%, #f2efee 60%);
	}
	form#mailformpro .privacy .small{
		font-size: 13px;
		color: #f1814a;
	}
	form#mailformpro .privacy .notice{}
/*送信ボタン*/
	form#mailformpro .mfp_buttons {
		text-align: center;
	}
	form#mailformpro .mfp_buttons dt.mfp{
		color: #01a8c7;
		text-align: center;
	}
	form#mailformpro .mfp_buttons dd{
		text-align: center;
	}
	form#mailformpro .mfp_buttons button {
		font-size: 16px;
		width: auto;
		padding: 10px 40px;
		background-color: #ffd801;
		color: #fff;
		cursor: pointer;
	border-radius: 50px;
	border: none;
	}
	form#mailformpro .mfp_buttons button:hover{
		opacity: 0.7;
	}
	form#mailformpro .mfp_buttons button:first-child{
		margin-right: 20px;
	}


/*ここから 確認画面
-------------------------*/
	#mfp_phase_confirm{}
/*確認画面タイトル(入力内容をご確認ください)*/
	#mfp_phase_confirm h4{
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: bold;
    color: #333;
    text-align: center;
	}
	#mfp_phase_confirm #mfp_confirm_table{
/*		border-bottom: 1px solid #ccc;*/
		margin: 0 auto 40px;
		width: 600px;
	}
	#mfp_phase_confirm #mfp_confirm_table tr{
/*		border-top: 1px solid #ccc;*/
	}
	#mfp_phase_confirm #mfp_confirm_table th{
		width: 50%;
		font-weight: bold;
		text-align: left;
		color: #333;
		border-bottom: 1px solid #ccc;
		padding: 5px 20px;
	}
	#mfp_phase_confirm #mfp_confirm_table td{
		width: 50%;
		text-align: left;
		border-bottom: 1px solid #ccc;
		padding: 5px 20px;
	}
/*送信ボタン*/
	#mfp_phase_confirm .mfp_buttons {
		text-align: center;
	}
	#mfp_phase_confirm .mfp_buttons dt.mfp{
		color: #01a8c7;
	}
	#mfp_phase_confirm .mfp_buttons button {
		font-size: 16px;
		width: auto;
		padding: 10px 40px;
			background-color: #ffd801;
		color: #fff;
	border-radius: 50px;
		cursor: pointer;
		border: 1px solid #fff;
	}
	#mfp_phase_confirm .mfp_buttons button:hover{
		opacity: 0.7;
	}
	#mfp_phase_confirm .mfp_buttons button:first-child{
		margin-right: 20px;
	}
/*サンクスページ*/
	.thanks_message{}
}
/*------------------------

PC表示ここまで

------------------------*/



/*------------------------

SP表示ここから

------------------------*/
@media screen and (max-width: 600px){
/* 医院からの説明 */
	.contact_message{}
	.contact_message p{}





/*ここから メールフォーム
-------------------------*/
	form#mailformpro {
		padding: 0!important;
		margin-bottom: 60px;
	}
/*入力欄全体*/
	form#mailformpro dl.mailform{
		margin-bottom: 40px;
		/* border-bottom: 1px solid #ccc; */
	}
/*質問箇所（左エリア）*/
	form#mailformpro dl.mailform dt.mfp{
		display: block;
		padding: 20px 0;
		/* border-top: 1px solid #ccc; */
		font-size: 15px;
		text-align: left;
		color: #333;
	}
/*質問箇所（左エリア）の必須項目*/
	form#mailformpro dl.mailform dt.mfp .must {
    float: left;
    display: block;
    background: #f00;
    border-radius: 4px;
		padding: 8px;
    font-size: 10px;
		line-height: 1;
    color: #fff;
		margin-right: 10px;
	}
	form#mailformpro dl.mailform dt.mfp .small{
		font-size: 12px;
		color: #525252;
		display: block;
	}
/*入力箇所（右エリア）*/
	form#mailformpro dl.mailform dd.mfp{
		padding: 20px 0;
		display: block;
		font-size: 15px;
		text-align: left;
	}
	form#mailformpro dl.mailform dd.mfp .small{
		font-size: 12px;
	}
/*名前入力ボックス*/
	form#mailformpro dl.mailform dd.mfp .label-box{}
	form#mailformpro dl.mailform dd.mfp .left-label{}
/*チェックボックス*/
	form#mailformpro dl.mailform dd.mfp ol.check-list{}
	form#mailformpro dl.mailform dd.mfp ol.check-list li{
		float: left;
		width: calc(100%/2);
		margin-bottom: 10px;
		padding-left: 22px;
		text-indent: -22px;
	}
/*チェックボックス(その他)*/
	form#mailformpro dl.mailform dd.mfp ol li .sub_input{
		text-align: left;
	}
/*入力ボックス*/
	form#mailformpro dl.mailform dd.mfp input {
    border: solid 1px #CCC;
    border-radius: 3px;
    box-shadow: 0px 0px 5px #CCC inset;
    padding: 3px 8px;
    margin: 2px;
    vertical-align: middle;
	}
	form#mailformpro dl.mailform dd.mfp label{
		display: block;
	}
/*エラーメッセージ*/
	form#mailformpro dl.mailform dd.mfp .mfp_err{
    clear: both;
    display: none;
    text-align: left;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 17px;
    color: #F00;
    font-size: 12px;
    line-height: 1.5em !important;
    background-image: url(img/mfp_error.gif);
    background-repeat: no-repeat;
    background-position: 0px 3px;
	}
/*テキストエリア*/
	form#mailformpro dl.mailform textarea {
		border: solid 1px #CCC;
		border-radius: 3px;
		box-shadow: 0px 0px 5px #CCC inset;
		padding: 3px 8px;
		line-height: 1.5;
		width: 100%!important;
		height: 90px!important;
	}
/*ご予約希望日時*/
	form#mailformpro dl.mailform dd.mfp .rsvchoice{}
	form#mailformpro dl.mailform dd.mfp .rsvchoice .date{
		text-align: left;
		margin-bottom: 10px;
	}
	form#mailformpro dl.mailform dd.mfp .rsvchoice select {
    border: solid 1px #CCC;
    border-radius: 3px;
    box-shadow: 0px 0px 5px #CCC inset;
	}
	form#mailformpro dl.mailform dd.mfp .rsvchoice .time {
		margin-bottom: 10px;
	}
/*個人情報取り扱いについて*/
	form#mailformpro .privacy .lead-box{
		background: #ebf6f8;
		padding: 6%;
		margin-bottom: 30px;
	}
	form#mailformpro .privacy .ttl{
		margin-bottom: 40px;
	}
	form#mailformpro .privacy .ttl span{
		font-size: 18px;
		color: #01a8c7;
		background: url(../common/img/ft_ttl_border.png) bottom repeat-x;
		padding-bottom: 10px;
	}
	form#mailformpro .privacy .lead{
		padding: 0 50px 30px;
	}
	form#mailformpro .privacy .liner{
		background: linear-gradient(transparent 60%, #f2efee 60%);
	}
	form#mailformpro .privacy .small{
		font-size: 13px;
		color: #f1814a;
	}
	form#mailformpro .privacy .notice{}
/*送信ボタン*/
	form#mailformpro .mfp_buttons {
		text-align: center;
	}
	form#mailformpro .mfp_buttons dt.mfp{
		text-align: center;
		color: #01a8c7;
	}
	form#mailformpro .mfp_buttons dd{
		text-align: center;
	}
	form#mailformpro .mfp_buttons button {
		font-size: 16px;
		width: auto;
		padding: 4px 15px;
    background-color: #ffd801;
		border-radius: 50px;
		color: #fff;
		cursor: pointer;
border: none;
	}
	form#mailformpro .mfp_buttons button:hover{
		opacity: 0.7;
	}
	form#mailformpro .mfp_buttons button:first-child{
		margin-right: 20px;
	}

	form#mailformpro dl.mailform dd.mail_box input{
		width: 80%;
	}

/*ここから 確認画面
-------------------------*/
/*確認画面タイトル(入力内容をご確認ください)*/
	#mfp_phase_confirm{
		margin-bottom: 40px;
	}
	#mfp_phase_confirm h4{
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: bold;
    color: #1974bc;
    text-align: center;
	}
	#mfp_phase_confirm #mfp_confirm_table{
		/* border-bottom: 1px solid #ccc; */
		margin: 0 auto 40px;
		width: 100%;
	}
	#mfp_phase_confirm #mfp_confirm_table tr{
		/* border-top: 1px solid #ccc; */
	}
/*左エリア*/
	#mfp_phase_confirm #mfp_confirm_table th{
		text-align: left;
		color: #01a8c7;
		display: block;
		width: 100%;
		float: left;
	}
/*右エリア*/
	#mfp_phase_confirm #mfp_confirm_table td{
		text-align: right;
		display: block;
		width: 100%;
		float: left;
	}
/*送信ボタン*/
	#mfp_phase_confirm .mfp_buttons {
		text-align: center;
	}
	#mfp_phase_confirm .mfp_buttons dt.mfp{
		color: #01a8c7;
	}
	#mfp_phase_confirm .mfp_buttons button {
		font-size: 16px;
		width: auto;
		padding: 4px 15px;
		background-color: #7BD2E2;
		color: #fff;
		box-shadow: 0 0 0px 1px #45b5ca;
		cursor: pointer;
		border: 1px solid #fff;
	}
	#mfp_phase_confirm .mfp_buttons button:hover{
		opacity: 0.7;
	}
	#mfp_phase_confirm .mfp_buttons button:first-child{
		margin-right: 20px;
	}
/*サンクスページ*/
	.thanks_message{}
}
/*------------------------

SP表示ここまで

------------------------*/