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

.contact_page .sp_logo_flex {
	padding-right: 0;
}

/*--------
-------
	utility
---------------*/

a {
	color: #22549e;
}

a:hover {
	color: #2e68be;
}

span.red {
	color: #cc0000;
}

span.bold {
	font-weight: bold;
}


/*--------
-------
	エラー時アラート（フォーム送信エラー等）
---------------*/

div.error_list {
   margin: 20px auto;
   background: #ffc6c6;
   border-radius: 5px;
   width: 80%;
}

div.error_list ul {
	padding: 1rem 2rem;
}

div.error_list ul li {
	color: #cc0000;
	font-weight: bold;
}


/*--------
-------
	h1
---------------*/

.index_h1 {
	margin-top: 25px;
}

.index_h1::before{
	background: url("../../img/apartments_icon.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.index_h1 .title_sub_en{
	color: #f4b25b;
}

@media screen and (min-width: 768px) {
	.index_h1 {
		margin-top: 50px;
	}
}

/*--------
-------
	h2
---------------*/

.contact_h2 {
	border-left: 4px solid #f4b25b;
	color: #1F2833;
	padding: 0;
	margin: 0 auto;
	line-height: 1.5;
	text-align: left;
	background: none;
	font-weight: 500;
	font-size: 2.6rem;
	padding-left: 20px;
	margin-bottom: 30px;
}


/*--------
-------
	contact promise
---------------*/

.contact_txt {
	padding-left: 2rem;
}

.contact_promise {
	margin: 2.5rem 1rem 3rem 3rem;
   	font-size: 1.4rem;
}
.contact_promise li {
	list-style: none;
   	color: #736761;
}
.i_check {
	color: #736761;
	padding: 0 .5rem;
}

@media screen and (min-width: 768px) {
	.promise_box {
		max-width: 1024px;
		margin: 0 auto;
   		padding-top: 2.5rem;
	}
}


/*--------
-------
	contents
---------------*/

.contact_form_box {
	max-width: 1024px;
	margin: 0 auto;
}

.price-flex{
	width: 100%;
   	margin: 4rem 0;
}

.kind {
	margin: 0.5rem;
}

/*select*/
select.notice_def, textarea.notice_def, input.notice_def,select.sel_2col, textarea.sel_2col, input.sel_2col {
	width: 100%;
	border: none;
	background: #f5f5f5;
	color: #757575;
	cursor: pointer;
	margin-top: 1rem;
	margin-bottom: 1rem;
}
select.notice, textarea.notice, input.notice {
	/* margin-top: 3rem; */
}

input:focus::placeholder {
	color: transparent;
}

select,input,textarea {
	width: 100%;
	border: none;
	background: #f5f5f5;
	padding: .5rem;
	color: #707070;
}
:focus {
	outline: -webkit-focus-ring-color auto 1px;
	outline-color: -webkit-focus-ring-color;
	outline-style: auto;
	outline-width: 1px;
}
.submit_li {
	margin: 0 auto;
	text-align: center;
}
.contact_submit {
	-webkit-appearance: none;
	border-radius: 30px;
	background: #fff;
	color: #1E3562;
	font-weight: bold;
	max-width: 250px;
	border: 2px solid #1E3562;
	transition : all 0.5s ease 0s;
	padding: 1rem 0;
	display: block;
   	margin: 0 auto;
}
.contact_submit:hover {
	background: #1E3562;
	color: #fff;
	border-radius: 30px;
	font-weight: bold;
	max-width: 250px;
	border: 2px solid #1E3562;
	cursor: pointer;
}

.price-flex h3{
	color: #707070;
	font-weight: bold;
	font-size: 1.6rem;
	line-height: 1.2;
	margin-bottom: 1rem;
}
.price-flex ul{
	display: block;
}
.price-flex ul.ul01{
	margin-top: 2rem;
}
.price-flex li{
	flex-grow: 1;
	width: 100%;
	margin-bottom: 2rem;
}
.half_flex {
	display: block;
}
.half_tab {
	width: 100%;
}

.contact_privacy_box {
	margin: 5rem 0;
	text-align: left;
	text-indent: 1rem;
	padding: 0;
	display :inline-block;
}
.privacy_link {
	color: #1E3562;
	font-weight: bold;
}

input:-webkit-autofill {
	box-shadow: 0 0 0px 1000px #f5f5f5 inset;
	-webkit-text-fill-color: #757575 !important;
}

@media screen and (min-width: 768px) {

	.half_flex {
		display: flex;
		justify-content: space-between;
	}

	.contact_privacy_box {
		text-align: center;
	}
	.half_tab {
		width: 50%;
		margin: 0 .5rem;
	}
	.price-flex{
		max-width: 85%;
   		margin: 0 auto;
	}
	.price-flex ul{
		flex-wrap:wrap;
	}
}

@media screen and (min-width: 1240px) {

	.price-flex{
		min-width: 100%;
		margin: 4rem auto;
	}
}



/*--------
-------
	confirm.jsp
---------------*/

.confirm_thanks {
	max-width: 900px;
	margin: 0 auto;
}

.contact_top_box {
	background: #F8F7F3;
	max-width: 1024px;
	text-align: center;
	color: #726761;
	padding: 2rem 3rem;
	margin-top: 3rem;
	margin-bottom: 1rem;
}
.contact_top_box h2 {
	font-weight: bold;
}

.contact_note_box {
	margin: 0 auto;
	margin-bottom: 2rem;
	max-width: 1024px;
	padding-left: 3rem;
	padding-right: 3rem;
}

.contact_note {
	display: flex;
	justify-content: center;
	margin-bottom: 2rem;
}

.confirmation {
	text-align: left;
}

.li01 p{
	padding-left :1rem;
	text-indent :-1rem;
	display: inline;
	color: #8C837E;
}

/*-----------ボタン------------*/

.confirm_form {
	position: relative;
	margin: 2rem 0;
}
.confirm_form input:hover {
	cursor: pointer;
}
.confirm_form form {
	border-radius: 32px;
	transition: all 0.5s ease 0s;
	padding: 3rem 2rem;
}
.confirm_form input {
	background: none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	pointer-events: auto;
	content: "";
	background-color: transparent;
}

/* 修正ボタン */

.form_fix {
	border: solid 2px #18650A;
}
.form_fix:hover {
	background: #18650A;
}
.form_fix input {
	color: #18650A;
}
.form_fix input:hover {
	color: #fff;
}

/* 送信ボタン */
.form_submit {
	border: solid 2px #1F3564;
}
.form_submit input {
	color: #1F3564;
}
.form_submit:hover {
	background: #1F3564;
}
.form_submit input:hover {
	color: #fff;
}

/*-----------ボタン------------*/

@media screen and (min-width: 768px) {

	.contact_top_box {
		padding: 2rem 12rem;
	}
	.contact_note_box {
		padding-left: 12rem;
		padding-right: 10rem;
		padding-bottom: 1rem;
	}

	.confirm_form {
		margin: .5rem auto;
		max-width: 400px;
	}
}

/*--------
-------
	thanks.jsp
---------------*/

.thanks {
	min-height: 90vh;
	width: 100%;
	margin: 0 auto;
}
.site_link {
	position: relative;
	padding: 2rem;
	display: block;
	margin-top: 2rem;
	margin-bottom: 12rem;
}
.site_link a {
	transition: all 0.5s ease 0s;
	border: solid 2px #726761;
	border-radius: 30px;
	max-width: 400px;
	margin: 2rem auto;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
	pointer-events: auto;
	content: "";
	background-color: transparent;
	color: #726761;
	padding: 3rem;
	line-height: 0;
	font-weight: bold;
}
.site_link a:hover {
	color: #fff;
	background: #726761;
}


.contact-headder {
	font-weight: bold;
	font-size: 1.2em;
	padding-top: 1rem;
	padding-bottom: 10px;
}
