@charset "utf-8";
::placeholder {
	color: #ADACAC;
}
#contact {
	width: 100%;
	height: auto;
	padding: 30px 0 0;
}
	.contact__page_heading__txt {
		width: 149px;
	}
	.contact__inner {
		width: 90%;
		max-width: 900px;
		height: auto;
		padding: 0 0 45px;
		margin: 0 auto;
	}
		.contact__wrap {
			width: 100%;
			height: auto;
			padding: 50px 0 60px;
		}
			.contact__txt {
				width: 100%;
				height: auto;
				margin: 0 auto 80px;
				font-size: 16px;
				font-weight: 700;
				line-height: 2;
				letter-spacing: 0.04em;
				text-align: center;
			}
			#form {
				width: 100%;
				height: auto;
			}
				.form__list_container {
					width: 100%;
					height: auto;
				}
					.form__wrap {
						width: 100%;
						height: auto;
					}
						.form__list {
							width: 100%;
							height: auto;
						}
							.form__item {
								display: flex;
								justify-content: flex-start;
								align-items: flex-start;
								width: 100%;
								height: auto;
							}
							.form__item:not(:last-of-type) {
								margin-bottom: 22px;
							}
								.form__item_heading {
									display: flex;
									justify-content: flex-start;
									align-items: center;
									width: 270px;
									height: 35px;
									font-size: 18px;
									font-weight: 700;
									line-height: 35px;
									letter-spacing: 0.02em;
								}
									.form__item_heading .mandatory {
										padding: 5px;
										margin-top: -1px;
										margin-right: 11px;
										border-radius: 3px;
										background-color: var(--color--red);
										font-size: 12px;
										font-weight: 700;
										line-height: 1;
										letter-spacing: 0.04em;
										color: var(--color--white);
									}
									.form__item_heading .any {
										padding: 5px;
										margin-top: -1px;
										margin-right: 11px;
										border-radius: 3px;
										background-color: #C9C9C9;
										font-size: 12px;
										font-weight: 700;
										line-height: 1;
										letter-spacing: 0.04em;
										color: var(--color--white);
									}
								.form__item_inputbox {
									flex: 1;
									height: auto;
								}
/* 内容入力ページ */
									.form__item_inputbox input,
									.form__item_inputbox textarea {
										width: 100%;
										border-radius: 5px;
										background-color: #F5F5F5;
										font-size: 16px;
										font-weight: 500;
										line-height: 1.6;
										letter-spacing: 0.02em;
										color: var(--color--black);
									}
									.form__item_inputbox input {
										height: 35px;
										padding: 0 19px;
										line-height: 35px;
									}
									.form__item_inputbox textarea {
										height: auto;
										padding: 8px 19px;
									}
									.form__item_inputbox__select_wrap {
										width: 325px;
										position: relative;
									}
									.form__item_inputbox__select_wrap::before {
										content: '';
										width: 0;
										height: 0;
										border-style: solid;
										border-width: 8px 6px 0 6px;
										border-color: #B7B7B7 transparent transparent transparent;
										position: absolute;
										top: 52%;
										right: 23px;
										transform: translate(50%,-50%);
										pointer-events: none;
									}
									.form__item_inputbox select {
										width: 100%;
										height: 35px;
										padding: 0 19px;
										border-radius: 5px;
										border: solid 1px #B7B7B7;
										line-height: 35px;
										cursor: pointer;
									}
						.poricy_agree {
							width: 100%;
							height: auto;
							margin: 48px auto 0;
							font-size: 18px;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.02em;
							text-align: center;
						}
							input#p_agree {
								display: none;
							}
							.p_agree__checkbox {
								display: inline-flex;
								justify-content: center;
								align-items: center;
								padding-left: 31px;
								cursor: pointer;
								position: relative;
							}
								.p_agree__checkbox::before {
									content: '';
									display: block;
									width: 20px;
									height: 20px;
									border: solid 1px var(--color--black);
									position: absolute;
									top: 0;
									left: 0;
								}
								.p_agree__checkbox::after {
									content: '';
									display: block;
									width: 14px;
									height: 9px;
									border-bottom: solid 4px var(--color--red);
									border-left: solid 4px var(--color--red);
									position: absolute;
									top: 8px;
									left: 10px;
									transform: translate(-50%,-50%) rotate(-45deg);
									opacity: 0;
									transition: .4s;
								}
								.poricy_agree input:checked + .p_agree__checkbox::after {
									opacity: 1;
								}
								.poricy_agree a {
									color: var(--color--red);
									text-decoration: underline;
								}
						.submit__container {
							width: 100%;
							height: auto;
							margin: 35px auto 0px;
						}
							button[name="btn_submit"] {
								display: flex;
								justify-content: center;
								align-items: center;
								width: 320px;
								height: 56px;
								margin: 0 auto;
								border-radius: 5px;
								background-color: var(--color--black);
								font-size: 20px;
								font-weight: 700;
								line-height: 1;
								letter-spacing: 0.04em;
								color: var(--color--white);
								cursor: pointer;
								position: relative;
							}
							button[name="btn_submit"][disabled] {
								background-color: grey;
								cursor: not-allowed;
								opacity: 1 !important;
							}
								button[name="btn_submit"]::after {
									content: '';
									display: block;
									width: 15.32px;
									height: 15.72px;
									background-image: url('../image/icon-btn_arrow.svg');
									background-position: center;
									background-repeat: no-repeat;
									background-size: contain;
									position: absolute;
									top: 50%;
									right: 17.5px;
									transform: translate(0%,-50%);
								}

/* 完了ページ */
		.thanks__wrap {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			width: 100%;
			height: calc(100vh - 60px - 198.34px - 45px - 197.5px);
			padding: 0;
		}
			.thanks__heading {
				width: 100%;
				height: auto;
				margin: 0 auto 22px;
				font-size: 24px;
				font-weight: 700;
				line-height: 1;
				letter-spacing: 0.04em;
				color: var(--color--red);
				text-align: center;
			}
			.thanks__txt {
				width: 100%;
				height: auto;
				font-size: 14px;
				font-weight: 700;
				line-height: 2;
				letter-spacing: 0.04em;
				color: var(--color--black);
				text-align: center;
			}

/* PC ================================================== */
@media all and (min-width:720px){
							button[name="btn_submit"] {
								opacity: 1;
								transition: .4s;
							}
							button[name="btn_submit"]:hover {
								opacity: 0.7;
							}
								button[name="btn_submit"]::after {
									transition: .4s;
								}
								button[name="btn_submit"]:hover::after {
									right: 14.5px;
								}
								button[name="btn_submit"][disabled]:hover::after {
									right: 17.5px;
								}	
							.poricy_agree a:hover {
								text-decoration: none;
							}
}

/* SP ================================================== */
@media all and (max-width:719px){
#contact {
	padding: 10px 0 0;
}
	.contact__page_heading__txt {
		width: 111.75px;
	}
	.contact__inner {
		max-width: initial;
		padding: 0 0 45px;
	}
		.contact__wrap {
			padding: 10px 0 40px;
		}
			.contact__txt {
				margin: 0 auto 60px;
				font-size: 14px;
				line-height: 1.6;
				text-align: left;
			}
							.form__item {
								display: block;
							}
							.form__item:not(:last-of-type) {
								margin-bottom: 30px;
							}
								.form__item_heading {
									display: flex;
									justify-content: flex-start;
									align-items: center;
									width: 100%;
									height: auto;
									margin: 0 auto 8px;
									font-size: 16px;
									line-height: 1;
								}
									.form__item_heading .mandatory {
										margin-top: 0px;
										margin-right: 8px;
									}
									.form__item_heading .any {
										padding: 5px;
										margin-top: 0px;
										margin-right: 8px;
									}
								.form__item_inputbox {
									flex: initial;
									width: 100%;
								}

/* 内容入力ページ */
									.form__item_inputbox input {
										padding: 0 12px;
									}
									.form__item_inputbox textarea {
										padding: 8px 12px;
									}
									.form__item_inputbox__select_wrap {
										width: 100%;
									}
									.form__item_inputbox select {
										padding: 0 12px;
									}
						.poricy_agree {
							margin: 40px auto 0;
							font-size: 16px;
						}
							.p_agree__checkbox {
								padding-left: 28px;
								cursor: pointer;
								position: relative;
							}
								.p_agree__checkbox::before {
									width: 18px;
									height: 18px;
									top: -1px;
								}
								.p_agree__checkbox::after {
									width: 12px;
									height: 7px;
									border-bottom: solid 3px var(--color--red);
									border-left: solid 3px var(--color--red);
									top: 6px;
									left: 9px;
								}
						.submit__container {
							margin: 45px auto 0px;
						}
							button[name="btn_submit"] {
								width: 100%;
							}

/* 完了ページ */
		.thanks__wrap {
			display: block;
			height: auto;
		}
			.thanks__heading {
				margin: 0 auto 30px;
				font-size: 20px;
				line-height: 1.5;
			}
}