@charset "utf-8";

.note {
	width: 959px;
	margin: -1em auto 2em auto;
	padding: 1em 2em 0 2em;
	font-size: 14px;
	background-color: #EEE;
	font-family: Arial, Helvetica, sans-serif;
	border: solid 1px #999;
	text-align: justify;
}

.note p {
	color: #333;
}

.to_user {
	font-weight: bold;
}

/* カラー */
.red {
	color: red;
}

/* サイズ */
.small {
	font-size: small;
}

form#mail_form {
	width: 959px;
	margin: 0 auto;
	padding: 20px 0;
	border-top: 1px solid #13b1cd;
}

form#mail_form dl {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	box-sizing: border-box;
}

form#mail_form dl dt {
	clear: both;
	width: 30%;
	float: left;
	border-top: 1px solid #cccccc;
	padding: 15px 0;
	text-align: right;
	overflow: hidden;
	box-sizing: border-box;
}

form#mail_form dl dt.form_item {
	font-weight: normal;
	color: #333;
	padding: 27px 0;
}

form#mail_form dl dd {
	width: 65%;
	float: right;
	border-top: 1px solid #cccccc;
	padding: 15px 0;
	box-sizing: border-box;
}

form#mail_form dl dt:first-child,
form#mail_form dl dt:first-child+dd {
	border: none;
}

p.separate {
	margin-top: 2em;
	padding-top: 2em;
	border-top: solid 1px #13b1cd;
}

.notice {
	margin-top: 0.5em;
	color: #13b1cd;
}

.br-pc {
	display: block;
}

.br-sp {
	display: none;
}

form#mail_form {
	font-size: 90%;
	font-family: inherit;
}

form#mail_form input[type=text],
form#mail_form input[type=email],
form#mail_form input[type=tel] {
	height: 2em;
	padding: 2px 2%;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	font-size: 100%;
	font-family: 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', Meiryo, Arial, sans-serif;
	margin-top: 7px;
}

form#mail_form input[type=text]:focus,
form#mail_form input[type=email]:focus,
form#mail_form input[type=tel]:focus,
form#mail_form textarea:focus {
	box-shadow: 0px 0px 5px #55ccff;
	border: 1px solid #55ccff;
	background: #ffffff;
}

form#mail_form ul li input[type=radio],
form#mail_form ul li input[type=checkbox] {
	margin-right: 10px;
	margin-top: 7px;
}

form#mail_form ul li:first-child input[type=radio],
form#mail_form ul li:first-child input[type=checkbox] {
	margin-top: 0px;
}

form#mail_form select {
	font-size: 100%;
	font-family: inherit;
	margin-top: 7px;
}

form#mail_form textarea {
	display: block;
	width: 100%;
	height: 200px;
	padding: 2px 2%;
	resize: vertical;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	font-size: 100%;
	font-family: inherit;
}

form#mail_form ul {
	list-style-type: none;
}

form#mail_form dl dd label {
	display: inline-block;
	font-size: 1em;
	font-weight: normal;
	margin-top: 0.75em;
	margin-right: 1em;
}

form#mail_form ul li label:hover {
	cursor: pointer;
}

form#mail_form input#postal {
	width: 20%;
}

form#mail_form input#postal+a {
	display: inline-block;
	padding: 6px 15px;
	vertical-align: middle;
	line-height: 1;
	background: #13b1cd;
	border: 1px solid #46b8da;
	border-radius: 3px;
	color: #ffffff;
	font-family: inherit;
	text-decoration: none;
	position: relative;
	top: -1px;
}

form#mail_form input#address-1,
form#mail_form input#address-2,
form#mail_form input#company {
	width: 100%;
}

form#mail_form input#family {
	width: 100%;
}

form#mail_form input#location,
form#mail_form input#size,
form#mail_form input#desired_area,
form#mail_form input#desired_size,
form#mail_form input#desired_budget,
form#mail_form input#schedule_other {
	width: 30%;
}

form#mail_form input#worry {
	width: 100%;
}

/* その他等記入欄 */
.bt_no {
	border-top: none !important;
	padding: 0 !important;
}

dd.bt_no {
	margin-bottom: 0.5rem !important;
	margin-top: -7px !important;
}

form#mail_form dl dt.bt_no {
	padding: 7px 0 !important;
}

dl.sub dt {
	width: 100% !important;
	text-align: left !important;
}

dl.sub dt span.optional {
	display: none !important;
}

dl.sub dd {
	width: 100% !important;
}

.red_small {
	color: red !important;
	font-size: small !important;
}

/* 表示・非表示切り替え */

input#knew-8~dl.knew-8-text,
input#knew-9~dl.knew-9-text,
input#inquiry-purpose-5~dl.inquiry-purpose-5-text,
input#plan-6~dl.plan-6-text,
input#land-1~dl.land-1-text,
input#land-2~dl.land-2-text,
input#land-3~dl.land-2-text,
input#schedule-4~dl.schedule-4-text,
input#inquiry-5~dl.inquiry-5-text {
	display: none;
}

input#knew-8:checked~dl.knew-8-text,
input#knew-9:checked~dl.knew-9-text,
input#inquiry-purpose-5-text:checked~dl.inquiry-purpose-5-text,
input#plan-6:checked~dl.plan-6-text,
input#land-1:checked~dl.land-1-text,
input#land-2:checked~dl.land-2-text,
input#land-3:checked~dl.land-2-text,
input#schedule-4:checked~dl.schedule-4-text,
input#inquiry-purpose-5:checked~dl,
input#inquiry-5:checked~dl.inquiry-5-text {
	display: block;
}



/* 表示・非表示切り替え  ここまで */

form#mail_form p#form_submit {
	width: 100%;
	margin: 0 auto;
	padding: 15px 0;
	border-top: 1px solid #cccccc;
	text-align: center;
}

form#mail_form input[type=button] {
	width: 10%;
	padding: 9px 15px;
	vertical-align: middle;
	line-height: 1;
	background: #13b1cd;
	border: 1px solid #13b1cd;
	border-radius: 3px;
	color: #ffffff;
	font-family: inherit;
	-webkit-appearance: none;
	font-size: 100%;
}

form#mail_form input[type=button]:hover {
	cursor: pointer;
}

p#back {
	width: 100%;
	text-align: center;
}

#back button {
	width: 15%;
	padding: 9px 15px;
	vertical-align: middle;
	line-height: 1;
	background: #999;
	border: 1px solid #999;
	border-radius: 3px;
	color: #ffffff;
	font-family: inherit;
	-webkit-appearance: none;
	font-size: 100%;
}

#back button:hover {
	cursor: pointer;
}

@media screen and (max-width: 512px) {

	#back button {
		width: 50%;
	}

}

/* -- for JavaScript ここから -------------------------------------------------------------------------------- */

form#mail_form dl dt span.required,
form#mail_form dl dt span.optional {
	display: inline-block;
	float: left;
	color: #ffffff;
	line-height: 1;
	padding: 8px;
	border-radius: 3px;
	margin-top: -6px;
}

form#mail_form dl dt span.required {
	background: #d9534f;
	border: 1px solid #d43f3a;
}

form#mail_form dl dt span.optional {
	background: #337ab7;
	border: 1px solid #2e6da4;
}

form#mail_form dl dd span.error_blank,
form#mail_form dl dd span.error_format,
form#mail_form dl dd span.error_match {
	display: block;
	color: #ff0000;
	margin-top: 3px;
}

span.loading {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border-top: 5px solid rgba(255, 255, 255, 0.2);
	border-right: 5px solid rgba(255, 255, 255, 0.2);
	border-bottom: 5px solid rgba(255, 255, 255, 0.2);
	border-left: 5px solid #ffffff;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-animation: load-circle 1.0s linear infinite;
	animation: load-circle 1.0s linear infinite;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -30px;
	margin-left: -30px;
}

@-webkit-keyframes load-circle {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes load-circle {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */



/* -- responsive -------------------------------------------------------------------------------- */

/* 1000pixel start */
@media screen and (max-width: 959px) {

	.note {
		width: 100%;
		margin: -1em auto 2em auto;
		padding: 1em 2em 0 2em;
	}

	form#mail_form {
		width: 100%;
	}

	form#mail_form dl dd label {
		margin-left: 0.75em;
	}

	form#mail_form dl {
		overflow: visible;
	}

	form#mail_form dl dt {
		width: 100%;
		float: none;
		text-align: left;
		padding: 0px 0 8px 0px;
		font-weight: normal;
		border-top: none;
	}

	form#mail_form dl dt.form_item {
		padding: 20px 0 5px 0;
	}

	form#mail_form dl dd {
		width: 100%;
		max-width: 100%;
		float: none;
		border-top: none;
		padding: 0;
	}

	form#mail_form dl dd {
		width: 100%;
		max-width: 100%;
		float: none;
		border-top: none;
		padding: 5px;
		margin-bottom: 1em;
		border-radius: 3px;
		background-color: #ddd;
	}

	dl.sub {
		padding: 10px !important;
	}

	form#mail_form dl dt.bt_no {
		padding: 10px !important;
	}

	form#mail_form input#name_1,
	form#mail_form input#read_1,
	form#mail_form input#mail_address,
	form#mail_form input#phone,
	form#mail_form input#area form#mail_form textarea {
		width: 100%;
		margin-top: 0.25em;
	}

	form#mail_form input#postal {
		width: 50%;
		margin-top: 0.25em;
	}

	form#mail_form input#address,
	form#mail_form input#company {
		width: 100%;
		margin-top: 0.25em;
	}

	form#mail_form input#family {
		width: 100%;
		margin-top: 0.25em;
	}

	form#mail_form input#location,
	form#mail_form input#size,
	form#mail_form input#desired_area,
	form#mail_form input#desired_size,
	form#mail_form input#desired_budget,
	form#mail_form input#schedule_other {
		width: 50%;
		margin-top: 0;
	}

	form#mail_form input[type=button] {
		width: 50%;
	}

	form#mail_form input#form_submit_button {
		margin: 0 auto;
	}

	.br-pc {
		display: none;
	}

	.br-sp {
		display: block;
	}

	form#mail_form input[type=text],
	form#mail_form input[type=email],
	form#mail_form input[type=tel] {
		margin-top: 0px;
		width: 100%;
	}

	form#mail_form input#form_submit_button {
		margin-left: auto;
	}

	form#mail_form select {
		margin-top: 0;
	}

	/* -- for JavaScript ここから -------------------------------------------------------------------------------- */
	form#mail_form dl dt span.required,
	form#mail_form dl dt span.optional {
		margin-right: 1em;
		margin-bottom: 0.5em;
	}

	/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */

}

/* 1000pixel end */


/* -- 元のスタイル変わってしまうのを修正 -------------------------------------------------------------------------------- */
.s-btn--white-brd {
	color: #fff !important;
	background: transparent;
	border-width: 0.0625rem;
	border-style: solid;
	border-color: #fff;
	text-decoration: none !important;
}

.s-btn--white-brd:focus,
.s-btn--white-brd:hover {
	color: #222324 !important;
	background: #fff;
	border-color: #fff;
}