@charset "utf-8";
/* PC ================================================== */
@media all and (min-width:1025px){
#contact {
	width: 100%;
	height: auto;
}
	.contact__inner {
		width: 90%;
		max-width: 1086px;
		height: auto;
		padding: 0 0 80px;
		margin: 0 auto;
	}
		.contact__contents {
			width: 100%;
			height: auto;
			padding: 40px 45px 100px;
			border-radius: 10px;
			background-color: #fff;
		}
			.contact__contents__heading {
				width: 100%;
				height: auto;
				padding: 0 0 18px;
				border-bottom: solid 1px var(--color--lightgray);
				font-size: 1.625rem;
				line-height: 1;
				letter-spacing: 0.05em;
				text-align: center;
				position: relative;
			}
				.contact__contents__heading::after {
					content: '';
					display: block;
					width: 50px;
					height: 1px;
					background-color: var(--color--yellow);
					position: absolute;
					bottom: -1px;
					left: 0;
				}
			/* お問い合わせTOP */
			.contact__agreement {
				width: 100%;
				height: auto;
				padding: 33px 0;
				border-bottom: solid 1px var(--color--lightgray);
			}
				.contact__agreement__txt {
					width: 90%;
					height: auto;
					margin: 0 auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
				}
				.contact__agreement__txt a {
					display: inline-block;
					color: var(--color--red);
					text-decoration: underline;
				}
				.contact__agreement__txt a:hover {
					text-decoration: none;
				}
			.contact__agreement__check {
				width: 100%;
				height: auto;
				padding: 40px 0;
				text-align: center;
			}
				.contact__agreement__check__txt {
					position: relative;
				}
					.contact__agreement__check__txt input {
						display: none;
					}
					.contact__agreement__check__txt label {
						padding-left: 27px;
						position: relative;
						cursor: pointer;
						font-size: 0.875rem;
						font-weight: 700;
						letter-spacing: 0.04em;
						color: var(--color--red);
						position: relative;
					}
					.contact__agreement__check__txt label::before {
						content: '';
						display: block;
						width: 15px;
						height: 15px;
						border-radius: 2px;
						border: solid 1px var(--color--gray);
						position: absolute;
						top: 0;
						left: 0;
					}
					.contact__agreement__check__txt label .agree_icon,
					.contact__agreement__check__txt label .agree_icon_bk {
						opacity: 0;
						position: absolute;
						top: 7px;
						left: 7px;
						transform: translate(-50%,-50%);
						transition: .2s;
					}
					.contact__agreement__check__txt label .agree_icon {
						width: 15px;
						height: auto;
						fill: var(--color--red);
						z-index: 2;
					}
					.contact__agreement__check__txt label .agree_icon_bk {
						width: 18px;
						height: auto;
						fill: #fff;
						transform: translate(-50%,-50%);
						z-index: 1;
					}
					.contact__agreement__check__txt label.active_icon .agree_icon,
					.contact__agreement__check__txt label.active_icon .agree_icon_bk {
						opacity: 1;
					}
			.contact__type {
				width: 100%;
				height: auto;
				margin-bottom: 60px;
			}
			.contact__type:last-of-type {
				margin-bottom: 0;
			}
				.contact__type__heading {
					width: 100%;
					height: auto;
					padding: 9px 15px;
					margin-bottom: 30px;
					font-size: 1.25rem;
					font-weight: 700;
					line-height: 1;
					letter-spacing: 0.06em;
					position: relative;
				}
					.contact__type__heading::before {
						content: '';
						display: block;
						width: 3px;
						height: 16px;
						background-color: var(--color--gray);
						position: absolute;
						top: 50%;
						left: 0;
						transform: translate(0%,-50%);
					}
				.contact__btn_area {
					width: 100%;
					height: auto;
				}
				.contact__btn_area.active {
					background-color: #ddd;
				}
					.contact__btn_list {
						width: 100%;
						height: auto;
						display: flex;
						justify-content: space-between;
						align-items: flex-start;
						flex-wrap: wrap;
					}
					.contact__btn_list::before,
					.contact__btn_list::after {
						content: '';
						display: block;
						width: 23.5%;
						height: 0;
					}
					.contact__btn_list::before {
						order: 1;
					}
						.contact__btn_wrap_general {
							width: 370px;
							height: auto;
							margin: 0 auto;
						}
						.contact__btn_wrap_enterprise {
							width: 23.5%;
							height: auto;
							margin-bottom: 2%;
						}
						.contact__btn_wrap_enterprise:nth-last-of-type(-n+4) {
							margin-bottom: 0;
						}
							.contact__btn {
								display: flex;
								justify-content: center;
								align-items: center;
								width: 100%;
								height: 56px;
								background-color: var(--color--orange_gray);
								font-size: 1rem;
								font-weight: 700;
								letter-spacing: 0.05em;
								color: var(--color--lightgray);
								transition: .2s;
								pointer-events: none;
							}
						.active_btn .contact__btn {
							background-color: var(--color--red);
							color: #fff;
							pointer-events: auto;
						}

			/* 共通 */
			.contact__form_explanation {
				width: 91.5%;
				height: auto;
				padding: 40px 0 45px;
				margin: 0 auto;
			}
				.contact__form_explanation__txt {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
					.contact__form_explanation__txt span {
						color: var(--color--red);
					}
			.contact__confirmation_info {
				width: 91.5%;
				height: auto;
				padding: 40px 0 45px;
				margin: 0 auto;
			}
				.contact__confirmation_info {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
					.contact__confirmation_info span {
						color: var(--color--red);
					}

			/* フォーム */
			.contact__form_container {
				width: 91.5%;
				height: auto;
				margin: 0 auto;
			}
				form#contact-form {
					width: 100%;
					height: auto;
				}
					#contact_wrapper {
						width: 100%;
						height: auto;
					}
						#contact_wrapper > dl {
							width: 100%;
							height: auto;
							margin-bottom: 30px;
							display: flex;
							justify-content: space-between;
							align-items: flex-start;
							flex-wrap: wrap;
							position: relative;
						}
						#contact_wrapper > dl.reply_el {
							display: none;
						}
						#contact_wrapper.confirm > dl {
							padding: 13px 0;
							margin-bottom: 0;
							border-bottom: solid 1px var(--color--lightgray);
						}
						#contact_wrapper.confirm > dl:first-of-type {
							border-top: 1px solid var(--color--lightgray);
						}
						#contact_wrapper > dl:last-of-type {
							margin-bottom: 0;
						}
							#contact_wrapper.confirm > dl::before {
								content: '';
								width: 1px;
								height: calc(100% - 50px);
								background-color: var(--color--lightgray);
								position: absolute;
								top: 50%;
								left: 235px;
								transform: translate(0%,-50%);
							}
							#contact_wrapper > dl > dt {
								width: 270px;
								height: auto;
								padding: 6px 0 6px 22px;
								font-size: 1rem;
								font-weight: 700;
								line-height: 28px;
								letter-spacing: 0.06em;
								position: relative;
							}
								#contact_wrapper > dl > dt::before {
									content: '';
									display: block;
									width: 3px;
									height: 16px;
									background-color: var(--color--red);
									position: absolute;
									top: 12px;
									left: 0;
								}
								#contact_wrapper > dl > dt .need {
									color: var(--color--red);
								}
								#contact_wrapper > dl > dt.not::before {
									background-color: var(--color--lightgray);
								}
							#contact_wrapper > dl > dd {
								flex: 1;
								height: auto;
								font-weight: 700;
								display: flex;
								justify-content: flex-start;
								align-items: center;
								flex-wrap: wrap;
							}
							#contact_wrapper > dl > dd.input__note {
								display: block;
								flex: none !important;
								width: calc(100% - 270px) !important;
								height: auto !important;
								margin: 10px 0 0 auto !important;
								font-size: 0.75rem !important;
								line-height: 1.6 !important;
								color: var(--color--darkgray);
							}
							#contact_wrapper.confirm > dl > dd.input__note {
								padding-top: 15px;
								border-top: 1px dotted var(--color--lightgray);
							}
								#contact_wrapper > dl > dd.input__note > span {
									padding: 0 !important;
									margin: 0 !important;
									font-size: 1em !important;
									letter-spacing: 0 !important;
									color: var(--color--red);
								}
							#contact_wrapper.confirm > dl > dd {
								padding: 6px 0;
								font-size: 0.875rem;
								font-weight: 500;
								line-height: 28px;
								letter-spacing: 0.06em;
							}
								.select_wrap {
									width: 300px;
									height: auto;
									position: relative;
								}
								.select_wrap::before,
								.select_wrap::after {
									content: '';
									display: block;
									width: 9px;
									height: 2px;
									border-radius: 1px;
									background-color: var(--color--black);
									pointer-events: none;
									position: absolute;
								}
								.select_wrap::before {
									transform: rotate(45deg);
									right: 15px;
									top: 20px;
								}
								.select_wrap::after {
									transform: rotate(-45deg);
									right: 10px;
									top: 20px;
								}
								#contact_wrapper > dl > dd select {
									width: 100%;
									height: 40px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									line-height: 40px;
									letter-spacing: 0.04em;
									color: var(--color--black);
									cursor: pointer;
								}
								#contact_wrapper > dl > dd input,
								#contact_wrapper > dl > dd textarea {
									vertical-align: bottom;
								}
								#contact_wrapper > dl > dd input {
									flex: 1;
									height: 40px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									line-height: 40px;
									letter-spacing: 0.04em;
									color: var(--color--black);
								}
								#contact_wrapper > dl > dd input.short {
									width: 100px;
									flex: none;
									margin-left: 10px;
									margin-right: 8px;
								}
								#contact_wrapper > dl > dd input.short:first-of-type {
									margin-left: 0;
								}
								#contact_wrapper > dl > dd input.mini {
									width: 150px;
									flex: none;
									margin-right: 10px;
								}
								#contact_wrapper > dl > dd input[type='date'] {
									width: 300px;
								}
								#contact_wrapper > dl > dd span {
									padding: 6px 0;
									margin-left: 30px;
									margin-right: 7px;
									font-size: 0.875rem;
									font-weight: 700;
									letter-spacing: 0.06em;
								}
									#contact_wrapper > dl > dd span:first-of-type {
										margin-left: 0;
									}
									#contact_wrapper > dl > dd span .need {
										color: var(--color--red);
									}
								#contact_wrapper > dl > dd textarea {
									width: 100%;
									height: 220px;
									border-radius: 3px;
									padding: 6px 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									letter-spacing: 0.04em;
									color: var(--color--black);
								}
									#contact_wrapper > dl > dd div {
										width: 100%;
										height: auto;
										margin-top: 8px;
										font-size: 0.875rem;
										font-weight: 500;
										line-height: 2;
										letter-spacing: 0.04em;
									}
									#contact_wrapper > dl > dd div.select_wrap {
										margin-top: 0;
									}
								.brand_wrap {
									width: 100%;
									height: auto;
									display: flex;
									justify-content: space-between;
									align-items: flex-start;
									flex-wrap: wrap;
								}
								.brand_wrap::before,
								.brand_wrap::after {
									content: '';
									display: block;
									width: 23%;
									height: 0;
								}
								.brand_wrap::before {
									order: 1;
								}
									.brand_wrap__item {
										width: 23%;
										height: auto;
									}
									.brand_wrap__item {
										margin-bottom: 8px;
									}
									.brand_wrap__item:nth-last-of-type(-n+4) {
										margin-bottom: 0;
									}
										.brand_wrap__item input {
											display: none;
										}
										.brand_wrap__item label {
											width: 100%;
											height: auto;
											cursor: pointer;
										}
											.brand_wrap__item__img {
												width: 100%;
												height: auto;
												margin: 0 0 4px !important;
												border-radius: 4px;
												overflow: hidden;
												border: solid 2px var(--color--creamgray);
												transition: border .2s;
											}
											.brand_wrap__item input[type="radio"]:checked + label .brand_wrap__item__img {
												border: solid 2px var(--color--gray);
											}
												.brand_wrap__item__img img {
													width: 100%;
													height: auto;
												}
											.brand_wrap__item label p {
												width: 100%;
												height: auto;
												font-size: 0.6875rem;
												font-weight: 700;
												line-height: 1.6;
												text-align: center;
											}
											.brand_wrap__item label:hover p {
												text-decoration: underline;
											}
									.brand_wrap__conf {
										width: 23% !important;
										height: auto;
										margin: 0 0 !important;
									}
										.brand_wrap__conf__img {
											width: 100%;
											height: auto;
											margin: 0 0 4px !important;
											border-radius: 4px;
											overflow: hidden;
											border: solid 2px var(--color--gray);
										}
											.brand_wrap__conf__img img {
												width: 100%;
												height: auto;
											}
										.brand_wrap__conf p {
											width: 100%;
											height: auto;
											font-size: 0.6875rem;
											font-weight: 700;
											line-height: 1.6;
											text-align: center;
										}
						.errormessage {
							width: 100%;
							height: auto;
							padding: 10px 0;
							margin: 40px auto;
							background-color: var(--color--red);
							font-size: 1rem;
							font-weight: 700;
							text-align: center;
							color: #fff;
						}
						.robot_authentication {
							width:300px;
							margin: 80px auto 30px;
							text-align:center;
						}
						#contact_wrapper .note {
							width: 100%;
							height: auto;
							margin: 0 auto;
							font-size: 0.875rem;
							font-weight: 500;
							line-height: 2;
							letter-spacing: 0.04em;
							text-align: center;
						}
						#btn_area {
							width: 100%;
							height: auto;
							margin-top: 75px;
						}
							#btn_area ul {
								width: 100%;
								height: auto;
								display: flex;
								justify-content: center;
								align-items: center;
								column-gap: 25px;
							}
								#btn_area ul li {
									width: 275px;
									height: 56px;
								}
								.back_btn {
									position: relative;
									transition: .3s;
								}
								.back_btn:hover {
									background-color: #fff;
								}
									.back_btn::before {
										content: '';
										display: block;
										width: 14px;
										height: 1px;
										background-color: #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										left: 20px;
										transform: translate(0%,-50%);
										transition: .3s;
									}
									.back_btn::after {
										content: '';
										display: block;
										width: 6px;
										height: 6px;
										border-top: solid 1px #fff;
										border-left: solid 1px #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										left: 20px;
										transform: rotate(-45deg) translate(0%,-50%);
										transform-origin: center 0%;
										transition: .3s;
									}
									.back_btn:hover::before {
										left: 17px;
										background-color: var(--color--orangegray);
									}
									.back_btn:hover::after {
										left: 17px;
										border-color: var(--color--orangegray);
									}
								.submit_btn {
									position: relative;
									transition: .3s;
								}
								.submit_btn:hover {
									background-color: #fff;
								}
									.submit_btn::before {
										content: '';
										display: block;
										width: 14px;
										height: 1px;
										background-color: #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										right: 20px;
										transform: translate(0%,-50%);
										transition: .3s;
									}
									.submit_btn::after {
										content: '';
										display: block;
										width: 6px;
										height: 6px;
										border-top: solid 1px #fff;
										border-right: solid 1px #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										right: 20px;
										transform: rotate(45deg) translate(0%,-50%);
										transform-origin: center 0%;
										transition: .3s;
									}
									.submit_btn:hover::before {
										right: 17px;
										background-color: var(--color--black);
									}
									.submit_btn:hover::after {
										right: 17px;
										border-color: var(--color--black);
									}
									#btn_area ul li input.btn {
										display: flex;
										justify-content: center;
										align-items: center;
										width: 100%;
										height: 100%;
										border-radius: 28px;
										font-size: 1rem;
										font-weight: 700;
										line-height: 1;
										letter-spacing: 0.05em;
										color: #fff;
										cursor: pointer;
										transition: .3s;
									}
									#btn_area ul li input[type='submit'].btn {
										border: solid 1px var(--color--black);
										background-color: var(--color--black);
									}
									#btn_area ul li input[type='submit'].btn:hover {
										background-color: #fff;
										color: var(--color--black);
									}
									#btn_area ul li input[type='button'].btn {
										border: solid 1px var(--color--orangegray);
										background-color: var(--color--orangegray);
									}
									#btn_area ul li input[type='button'].btn:hover {
										background-color: #fff;
										color: var(--color--orangegray);
									}

			/* お客様相談室 (一般のお客様) */
			.contact__reserve_info {
				width: 91.5%;
				height: auto;
				padding: 25px 0 30px;
				margin: 0 auto 80px;
				border-radius: 3px;
				background-color: var(--color--creamgray);
				border: solid 1px var(--color--yellow);
			}
				.contact__reserve_info__txt {
					width: 100%;
					height: auto;
					margin-bottom: 20px;
					font-size: 1rem;
					font-weight: 700;
					letter-spacing: 0.06em;
					text-align: center;
				}
				.contact__reserve_info__btn_wrap {
					width: 210px;
					height: 44px;
					margin: 0 auto;
				}
					.contact__reserve_info__btn {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 100%;
						border-radius: 22px;
						background-color: var(--color--black);
						border: solid 1px var(--color--black);
						font-size: 1rem;
						font-weight: 700;
						line-height: 1;
						letter-spacing: 0.05em;
						color: #fff;
						position: relative;
						transition: .3s;
					}
					.contact__reserve_info__btn:hover {
						color: var(--color--black);
						background-color: #fff;
					}
						.contact__reserve_info__btn::before {
							content: '';
							display: block;
							width: 14px;
							height: 1px;
							background-color: #fff;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: translate(0%,-50%);
							transition: .3s;
						}
						.contact__reserve_info__btn::after {
							content: '';
							display: block;
							width: 6px;
							height: 6px;
							border-top: solid 1px #fff;
							border-right: solid 1px #fff;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: rotate(45deg) translate(0%,-50%);
							transform-origin: center 0%;
							transition: .3s;
						}
						.contact__reserve_info__btn:hover::before {
							right: 10px;
							background-color: var(--color--black);
						}
						.contact__reserve_info__btn:hover::after {
							right: 10px;
							border-color: var(--color--black);
						}

			/* 完了ページ */
			.contact__completion_info {
				width: 91.5%;
				height: auto;
				padding: 40px 0 0;
				margin: 0 auto;
			}
				.contact__completion_info__txt {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
				.contact__completion_info__btn_wrap {
					width: 375px;
					height: 56px;
					margin: 50px auto 0;
				}
					.contact__completion_info__btn {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 100%;
						border-radius: 28px;
						background-color: var(--color--black);
						border: solid 1px var(--color--black);
						font-size: 1rem;
						font-weight: 700;
						line-height: 1;
						letter-spacing: 0.05em;
						color: #fff;
						position: relative;
						transition: .3s;
					}
					.contact__completion_info__btn:hover {
						color: var(--color--black);
						background-color: #fff;
					}
						.contact__completion_info__btn::before {
							content: '';
							display: block;
							width: 14px;
							height: 1px;
							background-color: #fff;
							position: absolute;
							top: 50%;
							right: 20px;
							transform: translate(0%,-50%);
							transition: .3s;
						}
						.contact__completion_info__btn::after {
							content: '';
							display: block;
							width: 6px;
							height: 6px;
							border-top: solid 1px #fff;
							border-right: solid 1px #fff;
							position: absolute;
							top: 50%;
							right: 20px;
							transform: rotate(45deg) translate(0%,-50%);
							transform-origin: center 0%;
							transition: .3s;
						}
						.contact__completion_info__btn:hover::before {
							right: 17px;
							background-color: var(--color--black);
						}
						.contact__completion_info__btn:hover::after {
							right: 17px;
							border-color: var(--color--black);
						}
}

/* Tablet ================================================== */
@media all and (min-width:600px) and (max-width:1024px){
#contact {
	width: 100%;
	height: auto;
}
	.contact__inner {
		width: 90%;
		max-width: 1086px;
		height: auto;
		padding: 0 0 80px;
		margin: 0 auto;
	}
		.contact__contents {
			width: 100%;
			height: auto;
			padding: 35px 45px 100px;
			border-radius: 10px;
			background-color: #fff;
		}
			.contact__contents__heading {
				width: 100%;
				height: auto;
				padding: 0 0 18px;
				border-bottom: solid 1px var(--color--lightgray);
				font-size: 1.5rem;
				line-height: 1;
				letter-spacing: 0.05em;
				text-align: center;
				position: relative;
			}
				.contact__contents__heading::after {
					content: '';
					display: block;
					width: 50px;
					height: 1px;
					background-color: var(--color--yellow);
					position: absolute;
					bottom: -1px;
					left: 0;
				}
			/* お問い合わせTOP */
			.contact__agreement {
				width: 100%;
				height: auto;
				padding: 33px 0;
				border-bottom: solid 1px var(--color--lightgray);
			}
				.contact__agreement__txt {
					width: 100%;
					height: auto;
					margin: 0 auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
				}
				.contact__agreement__txt a {
					display: inline-block;
					color: var(--color--red);
					text-decoration: underline;
				}
				.contact__agreement__txt a:hover {
					text-decoration: none;
				}
			.contact__agreement__check {
				width: 100%;
				height: auto;
				padding: 40px 0;
				text-align: center;
			}
				.contact__agreement__check__txt {
					position: relative;
				}
					.contact__agreement__check__txt input {
						display: none;
					}
					.contact__agreement__check__txt label {
						padding-left: 27px;
						position: relative;
						cursor: pointer;
						font-size: 0.875rem;
						font-weight: 700;
						letter-spacing: 0.04em;
						color: var(--color--red);
						position: relative;
					}
					.contact__agreement__check__txt label::before {
						content: '';
						display: block;
						width: 15px;
						height: 15px;
						border-radius: 2px;
						border: solid 1px var(--color--gray);
						position: absolute;
						top: 0;
						left: 0;
					}
					.contact__agreement__check__txt label .agree_icon,
					.contact__agreement__check__txt label .agree_icon_bk {
						opacity: 0;
						position: absolute;
						top: 7px;
						left: 7px;
						transform: translate(-50%,-50%);
						transition: .2s;
					}
					.contact__agreement__check__txt label .agree_icon {
						width: 15px;
						height: auto;
						fill: var(--color--red);
						z-index: 2;
					}
					.contact__agreement__check__txt label .agree_icon_bk {
						width: 18px;
						height: auto;
						fill: #fff;
						transform: translate(-50%,-50%);
						z-index: 1;
					}
					.contact__agreement__check__txt label.active_icon .agree_icon,
					.contact__agreement__check__txt label.active_icon .agree_icon_bk {
						opacity: 1;
					}
			.contact__type {
				width: 100%;
				height: auto;
				margin-bottom: 65px;
			}
			.contact__type:last-of-type {
				margin-bottom: 0;
			}
				.contact__type__heading {
					width: 100%;
					height: auto;
					padding: 9px 15px;
					margin-bottom: 20px;
					font-size: 1.25rem;
					font-weight: 700;
					line-height: 1;
					letter-spacing: 0.06em;
					position: relative;
				}
					.contact__type__heading::before {
						content: '';
						display: block;
						width: 3px;
						height: 16px;
						background-color: var(--color--gray);
						position: absolute;
						top: 50%;
						left: 0;
						transform: translate(0%,-50%);
					}
				.contact__btn_area {
					width: 100%;
					height: auto;
				}
				.contact__btn_area.active {
					background-color: #ddd;
				}
					.contact__btn_list {
						width: 100%;
						height: auto;
						display: flex;
						justify-content: space-between;
						align-items: flex-start;
						flex-wrap: wrap;
					}
					.contact__btn_list::before {
						order: 1;
					}
						.contact__btn_wrap_general {
							width: 370px;
							height: auto;
							margin: 0 auto;
						}
						.contact__btn_wrap_enterprise {
							width: 49%;
							height: auto;
							margin-bottom: 2%;
						}
						.contact__btn_wrap_enterprise:nth-last-of-type(-n+2) {
							margin-bottom: 0;
						}
							.contact__btn {
								display: flex;
								justify-content: center;
								align-items: center;
								width: 100%;
								height: 56px;
								background-color: var(--color--orange_gray);
								font-size: 1rem;
								font-weight: 700;
								letter-spacing: 0.05em;
								color: var(--color--lightgray);
								transition: .2s;
								pointer-events: none;
							}
						.active_btn .contact__btn {
							background-color: var(--color--red);
							color: #fff;
							pointer-events: auto;
						}

			/* 共通 */
			.contact__form_explanation {
				width: 100%;
				height: auto;
				padding: 35px 0;
				margin: 0 auto;
			}
				.contact__form_explanation__txt {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
					.contact__form_explanation__txt span {
						color: var(--color--red);
					}
			.contact__confirmation_info {
				width: 100%;
				height: auto;
				padding: 35px 0;
				margin: 0 auto;
			}
				.contact__confirmation_info {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
					.contact__confirmation_info span {
						color: var(--color--red);
					}

			/* フォーム */
			.contact__form_container {
				width: 100%;
				height: auto;
				margin: 0 auto;
			}
				form#contact-form {
					width: 100%;
					height: auto;
				}
					#contact_wrapper {
						width: 100%;
						height: auto;
					}
						#contact_wrapper > dl {
							width: 100%;
							height: auto;
							margin-bottom: 30px;
							display: flex;
							justify-content: space-between;
							align-items: flex-start;
							flex-wrap: wrap;
						}
						#contact_wrapper > dl.reply_el {
							display: none;
						}
						#contact_wrapper.confirm > dl {
							padding: 13px 0;
							margin-bottom: 0;
							border-bottom: solid 1px var(--color--lightgray);
						}
						#contact_wrapper.confirm > dl:first-of-type {
							border-top: 1px solid var(--color--lightgray);
						}
						#contact_wrapper > dl:last-of-type {
							margin-bottom: 0;
						}
							#contact_wrapper > dl > dt {
								width: 270px;
								height: auto;
								padding: 6px 0 6px 14px;
								font-size: 1rem;
								font-weight: 700;
								line-height: 28px;
								letter-spacing: 0.06em;
								position: relative;
							}
								#contact_wrapper > dl > dt::before {
									content: '';
									display: block;
									width: 3px;
									height: 16px;
									background-color: var(--color--red);
									position: absolute;
									top: 12px;
									left: 0;
								}
								#contact_wrapper > dl > dt .need {
									color: var(--color--red);
								}
							#contact_wrapper > dl > dd {
								flex: 1;
								height: auto;
							}
							#contact_wrapper > dl > dd.input__note {
								display: block;
								flex: none !important;
								width: calc(100% - 270px) !important;
								height: auto !important;
								margin: 10px 0 0 auto !important;
								font-size: 0.75rem !important;
								line-height: 1.6 !important;
								color: var(--color--darkgray);
							}
							#contact_wrapper.confirm > dl > dd.input__note {
								padding-top: 15px;
								border-top: 1px dotted var(--color--lightgray);
							}
								#contact_wrapper > dl > dd.input__note > span {
									padding: 0 !important;
									margin: 0 !important;
									font-size: 1em !important;
									letter-spacing: 0 !important;
									color: var(--color--red);
								}
							#contact_wrapper.confirm > dl > dd {
								padding: 6px 0;
								font-size: 0.875rem;
								font-weight: 500;
								line-height: 28px;
								letter-spacing: 0.06em;
							}
								.select_wrap {
									width: 100%;
									max-width: 300px;
									height: auto;
									position: relative;
								}
								.select_wrap::before,
								.select_wrap::after {
									content: '';
									display: block;
									width: 9px;
									height: 2px;
									border-radius: 1px;
									background-color: var(--color--black);
									pointer-events: none;
									position: absolute;
								}
								.select_wrap::before {
									transform: rotate(45deg);
									right: 15px;
									top: 20px;
								}
								.select_wrap::after {
									transform: rotate(-45deg);
									right: 10px;
									top: 20px;
								}
								#contact_wrapper > dl > dd select {
									width: 100%;
									height: 40px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									line-height: 40px;
									letter-spacing: 0.04em;
									color: var(--color--black);
									cursor: pointer;
								}
								#contact_wrapper > dl > dd input,
								#contact_wrapper > dl > dd textarea {
									vertical-align: bottom;
								}
								#contact_wrapper > dl > dd input {
									width: 100%;
									height: 40px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									line-height: 40px;
									letter-spacing: 0.04em;
									color: var(--color--black);
								}
								#contact_wrapper > dl > dd input.short {
									width: 100px;
									flex: none;
									margin-left: 10px;
									margin-right: 8px;
								}
								#contact_wrapper > dl > dd input.short:first-of-type {
									margin-left: 0;
								}
								#contact_wrapper > dl > dd input.mini {
									width: 150px;
									flex: none;
									margin-right: 10px;
								}
								#contact_wrapper > dl > dd input[type='date'] {
									width: 300px;
								}
								#contact_wrapper > dl > dd span {
									width: 100%;
									height: auto;
									padding: 6px 0;
									margin-top: 10px;
									margin-right: 7px;
									font-size: 0.875rem;
									line-height: 28px;
									font-weight: 700;
									letter-spacing: 0.06em;
								}
								#contact_wrapper > dl > dd span:first-of-type {
									margin-top: 0;
								}
									#contact_wrapper > dl > dd span:first-of-type {
										margin-left: 0;
									}
									#contact_wrapper > dl > dd span .need {
										color: var(--color--red);
									}
								#contact_wrapper > dl > dd textarea {
									width: 100%;
									height: 220px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									letter-spacing: 0.04em;
									color: var(--color--black);
								}
								.brand_wrap {
									width: 100%;
									height: auto;
									display: flex;
									justify-content: space-between;
									align-items: flex-start;
									flex-wrap: wrap;
								}
									.brand_wrap__item {
										width: 48%;
										height: auto;
									}
									.brand_wrap__item {
										margin-bottom: 11px;
									}
									.brand_wrap__item:nth-last-of-type(-n+2) {
										margin-bottom: 0;
									}
										.brand_wrap__item input {
											display: none;
										}
										.brand_wrap__item label {
											width: 100%;
											height: auto;
											cursor: pointer;
										}
											.brand_wrap__item__img {
												width: 100%;
												height: auto;
												margin: 0 0 4px !important;
												border-radius: 4px;
												overflow: hidden;
												border: solid 2px var(--color--creamgray);
												transition: border .2s;
											}
											.brand_wrap__item input[type="radio"]:checked + label .brand_wrap__item__img {
												border: solid 2px var(--color--gray);
											}
												.brand_wrap__item__img img {
													width: 100%;
													height: auto;
												}
											.brand_wrap__item label p {
												width: 100%;
												height: auto;
												font-size: 0.6875rem;
												font-weight: 700;
												line-height: 1.6;
												text-align: center;
											}
						.errormessage {
							width: 100%;
							height: auto;
							padding: 10px 0;
							margin: 40px auto;
							background-color: var(--color--red);
							font-size: 1rem;
							font-weight: 700;
							text-align: center;
							color: #fff;
						}
						.robot_authentication {
							width:300px;
							margin: 80px auto 30px;
							text-align:center;
						}
						#contact_wrapper .note {
							width: 100%;
							height: auto;
							margin: 0 auto;
							font-size: 0.875rem;
							font-weight: 500;
							line-height: 2;
							letter-spacing: 0.04em;
							text-align: center;
						}
						#btn_area {
							width: 100%;
							height: auto;
							margin-top: 60px;
						}
							#btn_area ul {
								width: 100%;
								height: auto;
								display: flex;
								justify-content: center;
								align-items: center;
								column-gap: 25px;
							}
								#btn_area ul li {
									width: 275px;
									height: 56px;
								}
								.back_btn {
									position: relative;
									transition: .3s;
								}
								.back_btn:hover {
									background-color: #fff;
								}
									.back_btn::before {
										content: '';
										display: block;
										width: 14px;
										height: 1px;
										background-color: #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										left: 20px;
										transform: translate(0%,-50%);
										transition: .3s;
									}
									.back_btn::after {
										content: '';
										display: block;
										width: 6px;
										height: 6px;
										border-top: solid 1px #fff;
										border-left: solid 1px #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										left: 20px;
										transform: rotate(-45deg) translate(0%,-50%);
										transform-origin: center 0%;
										transition: .3s;
									}
									.back_btn:hover::before {
										left: 17px;
										background-color: var(--color--orangegray);
									}
									.back_btn:hover::after {
										left: 17px;
										border-color: var(--color--orangegray);
									}
								.submit_btn {
									position: relative;
									transition: .3s;
								}
								.submit_btn:hover {
									background-color: #fff;
								}
									.submit_btn::before {
										content: '';
										display: block;
										width: 14px;
										height: 1px;
										background-color: #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										right: 20px;
										transform: translate(0%,-50%);
										transition: .3s;
									}
									.submit_btn::after {
										content: '';
										display: block;
										width: 6px;
										height: 6px;
										border-top: solid 1px #fff;
										border-right: solid 1px #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										right: 20px;
										transform: rotate(45deg) translate(0%,-50%);
										transform-origin: center 0%;
										transition: .3s;
									}
									.submit_btn:hover::before {
										right: 17px;
										background-color: var(--color--black);
									}
									.submit_btn:hover::after {
										right: 17px;
										border-color: var(--color--black);
									}
									#btn_area ul li input.btn {
										display: flex;
										justify-content: center;
										align-items: center;
										width: 100%;
										height: 100%;
										border-radius: 28px;
										font-size: 1rem;
										font-weight: 700;
										line-height: 1;
										letter-spacing: 0.05em;
										color: #fff;
										cursor: pointer;
										transition: .3s;
									}
									#btn_area ul li input[type='submit'].btn {
										border: solid 1px var(--color--black);
										background-color: var(--color--black);
									}
									#btn_area ul li input[type='submit'].btn:hover {
										background-color: #fff;
										color: var(--color--black);
									}
									#btn_area ul li input[type='button'].btn {
										border: solid 1px var(--color--orangegray);
										background-color: var(--color--orangegray);
									}
									#btn_area ul li input[type='button'].btn:hover {
										background-color: #fff;
										color: var(--color--orangegray);
									}


			/* お客様相談室 (一般のお客様) */
			.contact__reserve_info {
				width: 100%;
				height: auto;
				padding: 25px 0 30px;
				margin: 0 auto 60px;
				border-radius: 3px;
				background-color: var(--color--creamgray);
				border: solid 1px var(--color--yellow);
			}
				.contact__reserve_info__txt {
					width: 100%;
					height: auto;
					margin-bottom: 20px;
					font-size: 1rem;
					font-weight: 700;
					letter-spacing: 0.06em;
					text-align: center;
				}
				.contact__reserve_info__btn_wrap {
					width: 210px;
					height: 44px;
					margin: 0 auto;
				}
					.contact__reserve_info__btn {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 100%;
						border-radius: 22px;
						background-color: var(--color--black);
						border: solid 1px var(--color--black);
						font-size: 1rem;
						font-weight: 700;
						line-height: 1;
						letter-spacing: 0.05em;
						color: #fff;
						position: relative;
					}
						.contact__reserve_info__btn::before {
							content: '';
							display: block;
							width: 14px;
							height: 1px;
							background-color: #fff;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: translate(0%,-50%);
						}
						.contact__reserve_info__btn::after {
							content: '';
							display: block;
							width: 6px;
							height: 6px;
							border-top: solid 1px #fff;
							border-right: solid 1px #fff;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: rotate(45deg) translate(0%,-50%);
							transform-origin: center 0%;
						}

			/* 完了ページ */
			.contact__completion_info {
				width: 100%;
				height: auto;
				padding: 40px 0 0;
				margin: 0 auto;
			}
				.contact__completion_info__txt {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
				.contact__completion_info__btn_wrap {
					width: 375px;
					height: 44px;
					margin: 50px auto 0;
				}
					.contact__completion_info__btn {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 100%;
						border-radius: 22px;
						background-color: var(--color--black);
						border: solid 1px var(--color--black);
						font-size: 1rem;
						font-weight: 700;
						line-height: 1;
						letter-spacing: 0.05em;
						color: #fff;
						position: relative;
					}
						.contact__completion_info__btn::before {
							content: '';
							display: block;
							width: 14px;
							height: 1px;
							background-color: #fff;
							position: absolute;
							top: 50%;
							right: 20px;
							transform: translate(0%,-50%);
						}
						.contact__completion_info__btn::after {
							content: '';
							display: block;
							width: 6px;
							height: 6px;
							border-top: solid 1px #fff;
							border-right: solid 1px #fff;
							position: absolute;
							top: 50%;
							right: 20px;
							transform: rotate(45deg) translate(0%,-50%);
							transform-origin: center 0%;
						}
}

/* SP ================================================== */
@media all and (max-width:599px){
#contact {
	width: 100%;
	height: auto;
}
	.contact__inner {
		width: 90%;
		height: auto;
		padding: 0 0 80px;
		margin: 0 auto;
	}
		.contact__contents {
			width: 100%;
			height: auto;
			padding: 25px 5% 80px;
			border-radius: 10px;
			background-color: #fff;
		}
			.contact__contents__heading {
				width: 100%;
				height: auto;
				padding: 0 0 18px;
				border-bottom: solid 1px var(--color--lightgray);
				font-size: 1.25rem;
				line-height: 1;
				letter-spacing: 0.05em;
				text-align: center;
				position: relative;
			}
				.contact__contents__heading::after {
					content: '';
					display: block;
					width: 50px;
					height: 1px;
					background-color: var(--color--yellow);
					position: absolute;
					bottom: -1px;
					left: 0;
				}
			/* お問い合わせTOP */
			.contact__agreement {
				width: 100%;
				height: auto;
				padding: 25px 0;
				border-bottom: solid 1px var(--color--lightgray);
			}
				.contact__agreement__txt {
					width: 100%;
					height: auto;
					margin: 0 auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
				}
				.contact__agreement__txt a {
					display: inline-block;
					color: var(--color--red);
					text-decoration: underline;
				}
			.contact__agreement__check {
				width: 100%;
				height: auto;
				padding: 40px 0;
				text-align: center;
			}
				.contact__agreement__check__txt {
					position: relative;
				}
					.contact__agreement__check__txt input {
						display: none;
					}
					.contact__agreement__check__txt label {
						padding-left: 27px;
						position: relative;
						cursor: pointer;
						font-size: 0.875rem;
						font-weight: 700;
						letter-spacing: 0.04em;
						color: var(--color--red);
						position: relative;
					}
					.contact__agreement__check__txt label::before {
						content: '';
						display: block;
						width: 15px;
						height: 15px;
						border-radius: 2px;
						border: solid 1px var(--color--gray);
						position: absolute;
						top: 0;
						left: 0;
					}
					.contact__agreement__check__txt label .agree_icon,
					.contact__agreement__check__txt label .agree_icon_bk {
						opacity: 0;
						position: absolute;
						top: 7px;
						left: 7px;
						transform: translate(-50%,-50%);
						transition: .2s;
					}
					.contact__agreement__check__txt label .agree_icon {
						width: 15px;
						height: auto;
						fill: var(--color--red);
						z-index: 2;
					}
					.contact__agreement__check__txt label .agree_icon_bk {
						width: 18px;
						height: auto;
						fill: #fff;
						transform: translate(-50%,-50%);
						z-index: 1;
					}
					.contact__agreement__check__txt label.active_icon .agree_icon,
					.contact__agreement__check__txt label.active_icon .agree_icon_bk {
						opacity: 1;
					}
			.contact__type {
				width: 100%;
				height: auto;
				margin-bottom: 60px;
			}
			.contact__type:last-of-type {
				margin-bottom: 0;
			}
				.contact__type__heading {
					width: 100%;
					height: auto;
					padding: 9px 14px;
					margin-bottom: 18px;
					font-size: 1.125rem;
					font-weight: 700;
					line-height: 1;
					letter-spacing: 0.06em;
					position: relative;
				}
					.contact__type__heading::before {
						content: '';
						display: block;
						width: 3px;
						height: 16px;
						background-color: var(--color--gray);
						position: absolute;
						top: 50%;
						left: 0;
						transform: translate(0%,-50%);
					}
				.contact__btn_area {
					width: 100%;
					height: auto;
				}
				.contact__btn_area.active {
					background-color: #ddd;
				}
					.contact__btn_list {
						width: 100%;
						height: auto;
					}
						.contact__btn_wrap_general,
						.contact__btn_wrap_enterprise {
							width: 100%;
							height: auto;
							margin-bottom: 10px;
						}
						.contact__btn_wrap_general:last-of-type,
						.contact__btn_wrap_enterprise:last-of-type {
							margin-bottom: 0;
						}
							.contact__btn {
								display: flex;
								justify-content: center;
								align-items: center;
								width: 100%;
								height: 56px;
								background-color: var(--color--orange_gray);
								font-size: 1rem;
								font-weight: 700;
								letter-spacing: 0.05em;
								color: var(--color--lightgray);
								transition: .2s;
								pointer-events: none;
							}
						.active_btn .contact__btn {
							background-color: var(--color--red);
							color: #fff;
							pointer-events: auto;
						}

			/* 共通 */
			.contact__form_explanation {
				width: 100%;
				height: auto;
				padding: 30px 0;
				margin: 0 auto;
			}
				.contact__form_explanation__txt {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
					.contact__form_explanation__txt span {
						color: var(--color--red);
					}
			.contact__confirmation_info {
				width: 100%;
				height: auto;
				padding: 30px 0;
				margin: 0 auto;
			}
				.contact__confirmation_info {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
					text-align: center;
				}
					.contact__confirmation_info span {
						color: var(--color--red);
					}

			/* フォーム */
			.contact__form_container {
				width: 100%;
				height: auto;
				margin: 0 auto;
			}
				form#contact-form {
					width: 100%;
					height: auto;
				}
					#contact_wrapper {
						width: 100%;
						height: auto;
					}
						#contact_wrapper > dl {
							width: 100%;
							height: auto;
							margin-bottom: 30px;
						}
						#contact_wrapper > dl.reply_el {
							display: none;
						}
						#contact_wrapper.confirm > dl {
							padding: 11px 0 15px;
							margin-bottom: 0;
							border-bottom: solid 1px var(--color--lightgray);
						}
						#contact_wrapper.confirm > dl:first-of-type {
							border-top: 1px solid var(--color--lightgray);
						}
						#contact_wrapper > dl:last-of-type {
							margin-bottom: 0;
						}
							#contact_wrapper > dl > dt {
								width: 100%;
								height: auto;
								padding: 6px 0 6px 14px;
								margin-bottom: 2px;
								font-size: 1rem;
								font-weight: 700;
								line-height: 28px;
								letter-spacing: 0.06em;
								position: relative;
							}
								#contact_wrapper > dl > dt::before {
									content: '';
									display: block;
									width: 3px;
									height: 16px;
									background-color: var(--color--red);
									position: absolute;
									top: 12px;
									left: 0;
								}
								#contact_wrapper > dl > dt .need {
									color: var(--color--red);
								}
							#contact_wrapper > dl > dd {
								width: 100%;
								height: auto;
							}
							#contact_wrapper > dl > dd.input__note {
								margin: 10px 0 0 auto !important;
								font-size: 0.75rem !important;
								line-height: 1.6 !important;
								color: var(--color--darkgray);
							}
							#contact_wrapper.confirm > dl > dd.input__note {
								padding: 8px 0 10px;
								border-top: 1px dotted var(--color--lightgray);
							}
								#contact_wrapper > dl > dd.input__note > span {
									padding: 0 !important;
									margin: 0 !important;
									font-size: 1em !important;
									letter-spacing: 0 !important;
									color: var(--color--red);
								}
								.select_wrap {
									width: 100%;
									height: auto;
									position: relative;
								}
								.select_wrap::before,
								.select_wrap::after {
									content: '';
									display: block;
									width: 9px;
									height: 2px;
									border-radius: 1px;
									background-color: var(--color--black);
									pointer-events: none;
									position: absolute;
								}
								.select_wrap::before {
									transform: rotate(45deg);
									right: 15px;
									top: 20px;
								}
								.select_wrap::after {
									transform: rotate(-45deg);
									right: 10px;
									top: 20px;
								}
								#contact_wrapper > dl > dd select {
									width: 100%;
									height: 40px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									line-height: 40px;
									letter-spacing: 0.04em;
									color: var(--color--black);
									cursor: pointer;
								}
								#contact_wrapper > dl > dd input,
								#contact_wrapper > dl > dd textarea {
									vertical-align: bottom;
								}
								#contact_wrapper > dl > dd input {
									width: 100%;
									height: 40px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									line-height: 40px;
									letter-spacing: 0.04em;
									color: var(--color--black);
								}
								#contact_wrapper > dl > dd input.short {
									width: 100px;
									flex: none;
									margin-left: 10px;
									margin-right: 8px;
								}
								#contact_wrapper > dl > dd input.short:first-of-type {
									margin-left: 0;
								}
								#contact_wrapper > dl > dd input.mini {
									width: 70%;
									max-width: 150px;
									flex: none;
									margin-right: 10px;
								}
								#contact_wrapper > dl > dd input[type='date'] {
									width: 100%;
								}
								#contact_wrapper > dl > dd span {
									width: 100%;
									height: auto;
									padding: 6px 0;
									margin-top: 8px;
									margin-right: 7px;
									font-size: 0.875rem;
									line-height: 28px;
									font-weight: 700;
									letter-spacing: 0.06em;
								}
								#contact_wrapper > dl > dd span:first-of-type {
									margin-top: 0;
								}
									#contact_wrapper > dl > dd span:first-of-type {
										margin-left: 0;
									}
									#contact_wrapper > dl > dd span .need {
										color: var(--color--red);
									}
								#contact_wrapper > dl > dd textarea {
									width: 100%;
									height: 220px;
									border-radius: 3px;
									padding: 0 15px;
									background-color: #fff;
									border: solid 1px var(--color--lightgray);
									font-size: 0.875rem;
									font-weight: 500;
									letter-spacing: 0.04em;
									color: var(--color--black);
								}
								.brand_wrap {
									width: 100%;
									height: auto;
									display: flex;
									justify-content: space-between;
									align-items: flex-start;
									flex-wrap: wrap;
								}
									.brand_wrap__item {
										width: 48%;
										height: auto;
									}
									.brand_wrap__item {
										margin-bottom: 11px;
									}
									.brand_wrap__item:nth-last-of-type(-n+2) {
										margin-bottom: 0;
									}
										.brand_wrap__item input {
											display: none;
										}
										.brand_wrap__item label {
											width: 100%;
											height: auto;
											cursor: pointer;
										}
											.brand_wrap__item__img {
												width: 100%;
												height: auto;
												margin: 0 0 4px !important;
												border-radius: 4px;
												overflow: hidden;
												border: solid 2px var(--color--creamgray);
												transition: border .2s;
											}
											.brand_wrap__item input[type="radio"]:checked + label .brand_wrap__item__img {
												border: solid 2px var(--color--gray);
											}
												.brand_wrap__item__img img {
													width: 100%;
													height: auto;
												}
											.brand_wrap__item label p {
												width: 100%;
												height: auto;
												font-size: 0.6875rem;
												font-weight: 700;
												line-height: 1.6;
												text-align: center;
											}
						.errormessage {
							width: 100%;
							height: auto;
							padding: 10px 0;
							margin: 40px auto;
							background-color: var(--color--red);
							font-size: 1rem;
							font-weight: 700;
							text-align: center;
							color: #fff;
						}
						.robot_authentication {
							width:300px;
							margin: 80px auto 30px;
							text-align:center;
						}
						#contact_wrapper .note {
							width: 100%;
							height: auto;
							margin: 0 auto;
							font-size: 0.875rem;
							font-weight: 500;
							line-height: 2;
							letter-spacing: 0.04em;
							text-align: center;
						}
						#btn_area {
							width: 100%;
							height: auto;
							margin-top: 60px;
						}
							#btn_area ul {
								width: 100%;
								height: auto;
							}
								#btn_area ul li {
									width: 100%;
									height: 56px;
									margin-bottom: 25px;
								}
								#btn_area ul li:last-of-type {
									margin-bottom: 0;
								}
								.back_btn {
									position: relative;
								}
									.back_btn::before {
										content: '';
										display: block;
										width: 14px;
										height: 1px;
										background-color: #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										left: 20px;
										transform: translate(0%,-50%);
									}
									.back_btn::after {
										content: '';
										display: block;
										width: 6px;
										height: 6px;
										border-top: solid 1px #fff;
										border-left: solid 1px #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										left: 20px;
										transform: rotate(-45deg) translate(0%,-50%);
										transform-origin: center 0%;
									}
								.submit_btn {
									position: relative;
								}
									.submit_btn::before {
										content: '';
										display: block;
										width: 14px;
										height: 1px;
										background-color: #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										right: 20px;
										transform: translate(0%,-50%);
									}
									.submit_btn::after {
										content: '';
										display: block;
										width: 6px;
										height: 6px;
										border-top: solid 1px #fff;
										border-right: solid 1px #fff;
										pointer-events: none;
										position: absolute;
										top: 50%;
										right: 20px;
										transform: rotate(45deg) translate(0%,-50%);
										transform-origin: center 0%;
									}
									#btn_area ul li input.btn {
										display: flex;
										justify-content: center;
										align-items: center;
										width: 100%;
										height: 100%;
										border-radius: 28px;
										font-size: 1rem;
										font-weight: 700;
										line-height: 1;
										letter-spacing: 0.05em;
										color: #fff;
										cursor: pointer;
									}
									#btn_area ul li input[type='submit'].btn {
										border: solid 1px var(--color--black);
										background-color: var(--color--black);
									}
									#btn_area ul li input[type='button'].btn {
										border: solid 1px var(--color--orangegray);
										background-color: var(--color--orangegray);
									}

			/* お客様相談室 (一般のお客様) */
			.contact__reserve_info {
				width: 100%;
				height: auto;
				padding: 25px 0 30px;
				margin: 0 auto 50px;
				border-radius: 3px;
				background-color: var(--color--creamgray);
				border: solid 1px var(--color--yellow);
			}
				.contact__reserve_info__txt {
					width: 100%;
					height: auto;
					margin-bottom: 20px;
					font-size: 1rem;
					font-weight: 700;
					letter-spacing: 0.06em;
					text-align: center;
				}
				.contact__reserve_info__btn_wrap {
					width: 90%;
					height: 44px;
					margin: 0 auto;
				}
					.contact__reserve_info__btn {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 100%;
						border-radius: 22px;
						background-color: var(--color--black);
						border: solid 1px var(--color--black);
						font-size: 1rem;
						font-weight: 700;
						line-height: 1;
						letter-spacing: 0.05em;
						color: #fff;
						position: relative;
					}
						.contact__reserve_info__btn::before {
							content: '';
							display: block;
							width: 14px;
							height: 1px;
							background-color: #fff;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: translate(0%,-50%);
						}
						.contact__reserve_info__btn::after {
							content: '';
							display: block;
							width: 6px;
							height: 6px;
							border-top: solid 1px #fff;
							border-right: solid 1px #fff;
							position: absolute;
							top: 50%;
							right: 13px;
							transform: rotate(45deg) translate(0%,-50%);
							transform-origin: center 0%;
						}

			/* 完了ページ */
			.contact__completion_info {
				width: 91.5%;
				height: auto;
				padding: 40px 0 0;
				margin: 0 auto;
			}
				.contact__completion_info__txt {
					width: 100%;
					height: auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 2;
					letter-spacing: 0.04em;
				}
				.contact__completion_info__btn_wrap {
					width: 100%;
					height: 56px;
					margin: 50px auto 0;
				}
					.contact__completion_info__btn {
						display: flex;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 100%;
						border-radius: 28px;
						background-color: var(--color--black);
						border: solid 1px var(--color--black);
						font-size: 1rem;
						font-weight: 700;
						line-height: 1;
						letter-spacing: 0.05em;
						color: #fff;
						position: relative;
					}
						.contact__completion_info__btn::before {
							content: '';
							display: block;
							width: 14px;
							height: 1px;
							background-color: #fff;
							position: absolute;
							top: 50%;
							right: 20px;
							transform: translate(0%,-50%);
						}
						.contact__completion_info__btn::after {
							content: '';
							display: block;
							width: 6px;
							height: 6px;
							border-top: solid 1px #fff;
							border-right: solid 1px #fff;
							position: absolute;
							top: 50%;
							right: 20px;
							transform: rotate(45deg) translate(0%,-50%);
							transform-origin: center 0%;
						}
}