@charset "UTF-8";


/* =================================
CONTACT PAGE
================================= */


.contact-page {
	background:#f7f8fc;
}



/* =================================
MV
================================= */


.contact-mv {

	padding:14rem 0 7rem;

	text-align:center;

}


.contact-mv__sub-title {

	margin-bottom:1.5rem;

	color:#e57ead;

	font-size:1.3rem;

	font-weight:700;

	letter-spacing:.2em;

}


.contact-mv__title {

	color:#17265b;

	font-size:4.2rem;

	font-weight:700;

}


.contact-mv__text {

	margin-top:2rem;

	color:#65708a;

	font-size:1.4rem;

	line-height:2;

}




/* =================================
FORM AREA
================================= */


.contact-form {

	padding-bottom:10rem;

}



.contact-form__inner {

	max-width:90rem;

	margin:0 auto;

	padding:7rem;


	background:#fff;


	border-radius:2.4rem;


	box-shadow:
	0 20px 50px rgba(20,40,80,.06);

}




/* =================================
FORM ITEM
================================= */


.contact-form__item {

	margin-bottom:4rem;

}




/* 項目名 + 必須/任意 */

.contact-form__head {


	display:flex;


	align-items:center;


	gap:1rem;


	margin-bottom:1.5rem;


}


/* 項目タイトル */

.contact-form__label {


	display:inline-flex;


	align-items:center;


	color:#17265b;


	font-size:1.5rem;


	font-weight:700;


	line-height:1;


}




/* =================================
REQUIRED / OPTIONAL
================================= */


.contact-form__required,
.contact-form__optional {


	display:inline-flex;


	align-items:center;


	justify-content:center;


	flex:none;


	height:2.2rem;


	padding:0 1rem;


	border-radius:999px;


	font-size:1.1rem;


	font-weight:700;


	line-height:1;


	white-space:nowrap;


}



.contact-form__required {


	background:linear-gradient(
	90deg,
	#dd72b0,
	#ee9a91
	);


	color:#fff;


}



.contact-form__optional {


	background:#eef1f7;


	color:#66718a;


}




/* =================================
INPUT
================================= */


.contact-form__field input,
.contact-form__field textarea {


	width:100%;


	border:1px solid #e4e8f1;


	border-radius:1rem;


	background:#fff;


	color:#17265b;


	font-size:1.5rem;


}


.contact-form__field input {


	height:5.8rem;


	padding:0 2rem;


}


.contact-form__field textarea {


	min-height:22rem;


	padding:2rem;


	resize:none;


}



.contact-form__field input:focus,
.contact-form__field textarea:focus {


	outline:none;


	border-color:#e57ead;


	box-shadow:
	0 0 0 .4rem rgba(229,126,173,.15);


}




/* =================================
RADIO
================================= */


.contact-form__radio {


	display:block;


}



.contact-form__radio .wpcf7-radio {


	display:flex;


	align-items:center;


	flex-wrap:wrap;


	gap:2rem 3rem;


}



.contact-form__radio .wpcf7-list-item {


	margin:0;


}



.contact-form__radio label {


	display:flex;


	align-items:center;


	gap:.8rem;


	color:#17265b;


	font-size:1.4rem;


}


.contact-form__radio input {


	width:1.8rem;


	height:1.8rem;


	accent-color:#e57ead;


}




/* =================================
CHECKBOX
================================= */


.contact-form__checkbox {


	display:block;


}



.contact-form__checkbox .wpcf7-checkbox {


	display:flex;


	flex-wrap:wrap;


	gap:1.5rem 2.5rem;


}



.contact-form__checkbox .wpcf7-list-item {


	margin:0;


}



.contact-form__checkbox label {


	display:flex;


	align-items:center;


	gap:.8rem;


	color:#17265b;


	font-size:1.4rem;


}


.contact-form__checkbox input {


	width:1.8rem;


	height:1.8rem;


	accent-color:#e57ead;


}




/* =================================
PRIVACY
================================= */


.contact-form__privacy {


	margin-top:5rem;


	text-align:center;


}



.contact-form__privacy a {


	color:#e57ead;


	text-decoration:underline;


}




/* =================================
SUBMIT
================================= */


.contact-form__submit {


	margin-top:4rem;


	text-align:center;


}



.contact-form__submit input {


	width:30rem;


	height:6rem;


	border:none;


	border-radius:999px;


	background:linear-gradient(
	90deg,
	#dd72b0,
	#ee9a91
	);


	color:#fff;


	font-size:1.5rem;


	font-weight:700;


	cursor:pointer;


}




/* =================================
CF7 RESET
================================= */


/* CF7初期余白解除 */

.wpcf7-form-control-wrap {

	display:block;

}



/* CF7 checkbox radio margin */

.wpcf7-list-item {

	margin:0;

}



/* =================================
SP
================================= */

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


/* =========================
CONTACT MV
========================= */


.contact-mv {

	padding:9rem 2rem 4rem;

}


.contact-mv__sub-title {

	margin-bottom:1rem;

	font-size:1.1rem;

}


.contact-mv__title {

	font-size:2.8rem;

}


.contact-mv__text {

	margin-top:1.5rem;

	font-size:1.3rem;

	line-height:1.8;

}




/* =========================
FORM
========================= */


.contact-form {

	padding:0 1.5rem 6rem;

}



.contact-form__inner {

	padding:4rem 2rem;


	border-radius:1.6rem;

}




/* =========================
ITEM
========================= */


.contact-form__item {

	margin-bottom:3rem;

}




/* 項目名＋必須任意 */

.contact-form__head {

	gap:.8rem;

	margin-bottom:1rem;

}



.contact-form__label {

	font-size:1.4rem;

}




.contact-form__required,
.contact-form__optional {

	height:2rem;

	padding:0 .8rem;

	font-size:1rem;

}




/* =========================
INPUT
========================= */


.contact-form__field input {


	height:5rem;


	padding:0 1.5rem;


	font-size:1.4rem;


}



.contact-form__field textarea {


	min-height:18rem;


	padding:1.5rem;


	font-size:1.4rem;


}




/* =========================
RADIO
========================= */


.contact-form__radio .wpcf7-radio {


	flex-direction:column;


	align-items:flex-start;


	gap:1.2rem;


}



.contact-form__radio label {


	font-size:1.3rem;


}




/* =========================
CHECKBOX
========================= */


.contact-form__checkbox .wpcf7-checkbox {


	flex-direction:column;


	align-items:flex-start;


	gap:1.2rem;


}



.contact-form__checkbox label {


	font-size:1.3rem;


}




.contact-form__radio input,
.contact-form__checkbox input {


	width:1.7rem;


	height:1.7rem;


}




/* =========================
PRIVACY
========================= */


.contact-form__privacy {


	margin-top:3.5rem;


	font-size:1.3rem;


}




/* =========================
BUTTON
========================= */


.contact-form__submit {


	margin-top:3rem;


}



.contact-form__submit input {


	width:100%;


	height:5.5rem;


	font-size:1.4rem;


}



}