@charset "utf-8";
/*//////////////////////////////////////////
	下層ページ用CSS
//////////////////////////////////////////*/
/*-----------------------------------------------------------
	こひつじクラブ申込フォーム//kohitsuji-app.html
-----------------------------------------------------------*/
form#mailformpro,
form#mailformpro * {
	box-sizing: border-box;
}
div#mfp_hidden {
	overflow: hidden;
	width: 1px;
	height: 1px;
	padding: 0px;
	margin: 0px;
}
div#mfp_hidden input {
	margin: 10px;
}
div.mfp_thanks {
	padding: 30px;
}


.mailform {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.5em;
	width: 100%;
}
	.mailform dt {
		width: 30%;
		box-sizing: border-box;
		background-color: #f5ebfc;
	}
	@media screen and (max-width: 480px) {
		.mailform dt {
			line-height: 1.8;
			padding: 8px 8px;
		}
	}
	@media screen and (min-width: 481px) {
		.mailform dt {
			line-height: 2.2;
			padding: 8px 16px;
		}
	}
	.mailform dd {
		width: calc(70% - 1em);
		margin: 0;
		padding: 0 0 0 5px;
	}
	@media screen and (min-width: 481px) {
		.mailform input[type="text"],
		.mailform input[type="tel"],
		.mailform input[type="email"],
		.mailform input[type="radio"],
		.mailform select,
		.mailform textarea {
			margin: 8px 0;
			padding: 8px;
		}
	}
	@media screen and (max-width: 480px) {
		.mailform input[type="text"],
		.mailform input[type="tel"],
		.mailform input[type="email"],
		.mailform input[type="radio"],
		.mailform select,
		.mailform textarea {
			margin: 0 5px 10px 0;
			padding: 8px;
		}
	}
	
	.mailform input[type="tel"],
	.mailform input[type="email"],
	.mailform textarea {
		width: 100%;
	}

@media screen and (min-width: 481px) {
	.mfp_rows-name input[type="text"] {
		width: calc(50% - 0.5em);
	}
	.mfp_birth select {
		width: calc(35% - 1em);
	}
	.mfp_add input[type="text"],
	.mfp_enter input[type="text"] {
		width: 100%;
	}
}

	.mailform textarea {
		width: 100% !important;
		height: 200px !important;
	}
	@media screen and (min-width: 481px) {
		.mfp_rows,
		.mfp_rows-name,
		.mfp_rows-age,
		.mfp_rows-short {
			display: flex;
			flex-wrap: wrap;
			align-items: center;
		}
	}
	@media screen and (max-width: 480px) {
		.mfp_rows,
		.mfp_rows-name,
		.mfp_rows-age,
		.mfp_rows-short {
			display: block;
			align-items: center;
		}
	}
		.mfp_rows label {
			width: 50%;
			padding: 8px;
			box-sizing: border-box;
		}
	@media screen and (max-width: 480px) {
		.mfp_rows label {
			display: block;
			width: 100%;
		}
	}
		.mfp_rows-name {
			justify-content: space-between;
			gap: 0.5em;
		}
		.mfp_rows-age {
			justify-content: flex-start;
			gap: 0.5em;
		}
			.mfp_rows-age input[type="text"] {
				width: 43%;
			}
		.mfp_rows-short {
			gap: 0.5em;
		}
			.mfp_rows-short input[type="text"] {
				width: 50%;
			}

		.check label {
			display: block;
			line-height: 2.2;
			margin: 8px 0;
		}
	.mfp_buttons {
		width: 100%;
		margin: 16px 0;
		display: flex;
		flex-wrap: nowrap;
		justify-content: center;
		gap: 1em;
	}
	.mfp_buttons button {
		width: 40%;
		text-align: center;
		color: #fff;
		margin: 0;
		padding: 16px 32px;
		box-sizing: border-box;
		background-color: #bb9bd1;
		border: #bb9bd1 2px solid;
		border-radius: 8px;
	}
		.mfp_buttons button:hover {
			color: #bb9bd1;
			background-color: #fff;
			border: #bb9bd1 2px solid;
		}


.must {
	display: inline-block;
	background-color: #C00;
	padding: 0 5px;
	box-sizing: border-box;
	font-size: 10px;
	color: #fff;
	margin: 0px 5px;
	border-radius: 5px;
}

div#mfp_thanks {
	text-align: center;
	font-size: 18px;
	padding: 20px 0px;
}
div#mfp_thanks strong {
	color: #C00;
	font-size: 24px;
}

div.mfp_err {
	display: none;
	text-align: left;
	/* margin: 5px 0px 0px 0px; */
	padding: 3px 0px 5px 17px;
	box-sizing: border-box;
	color: #F00;
	line-height: normal;
	background-image: url(../contact/mfp.statics/_images/mfp_error.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
}
@media screen and (min-width: 480px) {
	div.mfp_err {
		width: 100%;
	}
	
}
.mfp_parent_error {
	border: solid 2px #F00;
}
div#mfp_error {
	background-color: #FEE;
	border: solid 1px #F00;
	padding: 10px;
	display: none;
}
div#mfp_error p {
	padding: 0px;
	margin: 0px;
	font-size: 14px;
	text-align: center;
}
div#mfp_error p strong {
	font-size: 18px;
	color: #F00;
}
div#mfp_warning {
	background-color: #FEE;
	border: solid 1px #F00;
	padding: 10px;
	display: none;
	border-radius: 5px;
}
div#mfp_warning p {
	padding: 0px;
	margin: 0px;
	font-size: 14px;
	text-align: center;
}
div#mfp_warning p strong {
	font-size: 18px;
	color: #F00;
}
/* 確認画面 */
div#mfp_overlay {
	position: absolute;
	display: none;
	z-index: 10001;
}
div#mfp_overlay_inner {
	background-color: #FFF;
	padding: 15px;
	margin: 0px auto;
	border-radius: 5px;
	box-shadow: 0px 0px 10px #000;
	width: 640px;
	max-width: 90%;
}
div#mfp_overlay_background {
	background-color: #000;
	position: absolute;
	display: none;
	z-index: 10000;
}

div#mfp_overlay {
	position: absolute;
	display: none;
	z-index: 10001;
}
div#mfp_overlay_inner {
	background-color: #FFF;
	padding: 15px;
	margin: 0px auto;
	border-radius: 5px;
	box-shadow: 0px 0px 10px #000;
	width: 640px;
	max-width: 90%;
}
div#mfp_overlay_background {
	background-color: #000;
	position: absolute;
	display: none;
	z-index: 10000;
}
div#mfp_loading_screen {
	z-index: 20000;
	opacity: 0.8;
	display: none;
	background-color: #000;
	position: absolute;
}
div#mfp_loading {
	z-index: 20001;
	position: absolute;
	display: none;
	width: 40px;
	height: 40px;
	background-image: url(../contact/mfp.statics/_images/mfp_loading.gif);
}