@charset "utf-8";
::placeholder {
	color: var(--color--lightgray);
}
/* 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;
				margin: 0 auto 30px;
				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__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__general_btn_list {
						width: 100%;
						height: auto;
						display: flex;
						justify-content: center;
						align-items: center;
						gap: 20px;
					}
					.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: calc(50% - 10px);
							max-width: 370px;
							height: 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;
								padding-top: 1px;
								border: solid 1px var(--color--darkgray);
								background-color: var(--color--darkgray);
								font-size: 1rem;
								font-weight: 700;
								letter-spacing: 0.05em;
								color: #fff;
								transition: .3s;
							}
					@media (any-hover: hover) {
						.contact__btn:hover {
							background-color: var(--color--purple);
						}
					}

			/* 共通 */
			.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--purple);
					}

			/* ご利用規約 */
			.contact__agreement__heading {
				width: 100%;
				height: auto;
				margin: 0 auto 10px;
				font-size: 18px;
				line-height: 1;
				letter-spacing: 0.05em;
				text-align: center;
				position: relative;
			}
			.contact__agreement {
				width: 100%;
				height: 195px !important;
				padding: 30px 34px 30px 40px;
				overflow-y: scroll;
				box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.1);
			}
			.contact__agreement::-webkit-scrollbar {
				width: 6px;
			}
			.contact__agreement::-webkit-scrollbar-track {
				background: transparent;
			}
			.contact__agreement::-webkit-scrollbar-thumb {
				background: var(--color--purple);
				border-radius: 3px;
			}
				.contact__agreement__txt {
					width: 100%;
					height: auto;
					margin: 0 auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 1.8;
					letter-spacing: 0.04em;
				}
				.contact__agreement__txt a {
					display: inline-block;
					color: var(--color--black);
					text-decoration: underline;
				}
				.contact__agreement__txt a:hover {
					text-decoration: none;
				}
			.contact__agreement__check {
				width: 100%;
				height: auto;
			}
				.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--black);
						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: 3px;
						left: 0;
					}
					.contact__agreement__check__txt label .agree_icon,
					.contact__agreement__check__txt label .agree_icon_bk {
						opacity: 0;
						position: absolute;
						top: 10px;
						left: 8px;
						transform: translate(-50%,-50%);
						transition: .2s;
					}
					.contact__agreement__check__txt label .agree_icon {
						width: 15px;
						height: auto;
						fill: var(--color--purple);
						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_select {
				width: 100%;
				height: auto;
				padding: 0 0 60px;
				display: flex;
				justify-content: space-between;
				align-items: center;
				gap: 24px;
			}
				.contact__type_select__item {
					flex: 1;
				}
					.contact__type_select__btn {
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 56px;
						padding: 0;
						background-color: var(--color--gray);
						cursor: pointer;
						transition: .3s;
					}
				@media (any-hover: hover) {
					.contact__type_select__btn:hover {
						background-color: var(--color--purple);
						color: #ffffff;
					}
						.contact__type_select__btn:hover .contact__type_select__btn__txt,
						.contact__type_select__btn:hover small {
							color: #ffffff;
						}
				}
					.contact__type_select__btn._active {
						background-color: var(--color--purple);
						color: #ffffff;
					}
						.contact__type_select__btn__txt {
							display: block;
							font-size: 1rem;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.05em;
							color: #fff;
							transition: .3s;
						}
						._active .contact__type_select__btn__txt {
							color: #ffffff;
						}
						.contact__type_select__btn small {
							display: block;
							margin-top: 6px;
							font-size: 0.75rem;
							line-height: 1;
							color: #fff;
							transition: .3s;
						}
						.contact__type_select__btn._active small {
							color: #ffffff;
						}
							.contact__type_select__btn small br {
								display: none;
							}

			.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--purple);
									position: absolute;
									top: 12px;
									left: 0;
								}
								#contact_wrapper > dl > dt .need {
									color: var(--color--purple);
								}
								#contact_wrapper > dl > dt.not::before {
									background-color: var(--color--lightgray);
								}
									#contact_wrapper > dl > dt .note {
										display: block;
										max-width: 150px;
										margin: 2px 0 0;
										font-size: 14px;
										font-weight: 500;
										line-height: calc(24 / 14);
										letter-spacing: 0.06em;
										text-align: left;
										color: var(--color--black);
									}
							#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;
							}
								.dd_ttl {
									width: 100%;
									height: auto;
									margin: 48px auto 16px;
									font-size: 16px;
									font-weight: 700;
									line-height: 1;
									letter-spacing: 0.06em;
									color: var(--color--black);
								}
								.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);
								}
								.radio_wrap,
								.checkbox_wrap {
									width: 100%;
									height: auto;
									padding: 6px 0 0;
								}
								.radio_wrap__list,
								.checkbox_wrap__list {
									display: flex;
									flex-direction: column;
									gap: 10px;
									width: 100%;
									height: auto;
								}
								.radio_wrap__list._row,
								.checkbox_wrap__list._row {
									flex-direction: row;
									justify-content: flex-start;
									align-items: flex-start;
									flex-wrap: wrap;
									gap: 10px 25px;
									width: 95%;
								}
								.radio_wrap__item,
								.checkbox_wrap__item {
									display: flex;
									justify-content: flex-start;
									align-items: center;
								}
								.radio_wrap__item label,
								.checkbox_wrap__item label {
									display: flex;
									justify-content: flex-start;
									align-items: center;
									gap: 8px;
									font-size: 1rem;
									font-weight: 700;
									line-height: 28px;
									letter-spacing: 0.06em;
									color: var(--color--black);
									cursor: pointer;
									position: relative;
								}
									.radio_wrap__item label::before,
									.checkbox_wrap__item label::before {
										content: '';
										display: block;
										width: 18px;
										height: 18px;
										background-color: #fff;
										border: solid 1px var(--color--lightgray);
									}
									.radio_wrap__item label::before {
										border-radius: 9999px;
									}
									.radio_wrap__item label::after {
										content: '';
										display: block;
										position: absolute;
									}
									.radio_wrap__item label::after {
										width: 8px;
										height: 8px;
										border-radius: 9999px;
										background-color: var(--color--purple);
										top: 10px;
										left: 5px;
										z-index: 1;
										opacity: 0;
										transition: .3s;
									}
									.recruit_radio:checked + label::after {
										opacity: 1;
									}
									.checkbox_icon {
										opacity: 0;
										width: 17px;
										height: auto;
										fill: var(--color--purple);
										transition: .3s;
										position: absolute;
										top: 8px;
										left: 2px;
									}
									label._checked .checkbox_icon {
										opacity: 1;
									}
								#contact_wrapper > dl > dd input.recruit_radio,
								#contact_wrapper > dl > dd input.recruit_checkbox {
									display: none;
								}
								#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: 100%;
									max-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--purple);
									}
								#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,
									#contact_wrapper > dl > dd div.radio_wrap,
									#contact_wrapper > dl > dd div.checkbox_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--purple) !important;
							font-size: 1rem;
							font-weight: 700;
							text-align: center;
							color: #fff;
						}
						.robot_authentication {
							width:300px;
							margin: 40px 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--lightgray);
									}
									.back_btn:hover::after {
										left: 17px;
										border-color: var(--color--lightgray);
									}
								.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--lightgray);
										background-color: var(--color--lightgray);
									}
									#btn_area ul li input[type='button'].btn:hover {
										background-color: #fff;
										color: var(--color--lightgray);
									}

			/* お客様相談室 (一般のお客様) */
			.contact__reserve_info {
				width: 91.5%;
				height: auto;
				padding: 25px 0 30px;
				margin: 0 auto 80px;
				border-radius: 3px;
				background-color: rgba(84, 17, 211, 0.02);
				border: solid 2px rgba(84, 17, 211, 0.8);
			}
				.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__list {
					display: grid;
					grid-template-columns: 1fr 1fr 1fr;
					gap: 8px;
					width: 90%;
					height: auto;
					margin: 0 auto;
				}
					.contact__reserve_info__btn_wrap {
						height: 54px;
					}
						.contact__reserve_info__btn {
							display: flex;
							justify-content: flex-start;
							align-items: center;
							width: 100%;
							height: 100%;
							padding-left: 2px;
							border-radius: 5px;
							background-color: var(--color--darkgray);
							border: solid 1px var(--color--darkgray);
							font-size: 0.875rem;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.05em;
							color: #fff;
							position: relative;
							transition: background .3s;
						}
					@media (any-hover: hover) {
						.contact__reserve_info__btn:hover {
							background-color: #fff;
							color: var(--color--darkgray);
						}
					}
							.contact__reserve_info__btn__icon {
								display: block;
								width: 48px;
								height: auto;
							}
								.contact__reserve_info__btn__icon img {
									width: 100%;
									height: auto;
								}
							.contact__reserve_info__btn__txt {
								padding-left: 12px;
							}
							@media (any-hover: hover) {
								.contact__reserve_info__btn__txt {
									transition: .3s;
								}
							}
							.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;
							}
						@media (any-hover: hover) {
							.contact__reserve_info__btn:hover::before {
								right: 10px;
								background-color: var(--color--darkgray);
							}
							.contact__reserve_info__btn:hover::after {
								right: 10px;
								border-color: var(--color--darkgray);
							}
						}

			/* 完了ページ */
			.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 25px 100px;
			border-radius: 10px;
			background-color: #fff;
		}
			.contact__contents__heading {
				width: 100%;
				height: auto;
				padding: 0 0 18px;
				margin: 0 auto 20px;
				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__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__general_btn_list {
						width: 100%;
						height: auto;
						display: flex;
						justify-content: space-between;
						align-items: center;
					}
					.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: 49%;
							height: 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;
								padding-top: 1px;
								border: solid 1px var(--color--darkgray);
								background-color: var(--color--darkgray);
								font-size: 1rem;
								font-weight: 700;
								letter-spacing: 0.05em;
								color: #fff;
								transition: .2s;
							}
					@media (any-hover: hover) {
						.contact__btn:hover {
							background-color: var(--color--purple);
						}
					}

			/* 共通 */
			.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--purple);
					}

			/* ご利用規約 */
			.contact__agreement__heading {
				width: 100%;
				height: auto;
				margin: 0 auto 10px;
				font-size: 18px;
				line-height: 1;
				letter-spacing: 0.05em;
				text-align: center;
				position: relative;
			}
			.contact__agreement {
				width: 100%;
				height: 195px !important;
				padding: 30px 34px 30px 40px;
				overflow-y: scroll;
				box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.1);
			}
			.contact__agreement::-webkit-scrollbar {
				width: 6px;
			}
			.contact__agreement::-webkit-scrollbar-track {
				background: transparent;
			}
			.contact__agreement::-webkit-scrollbar-thumb {
				background: var(--color--purple);
				border-radius: 3px;
			}
				.contact__agreement__txt {
					width: 100%;
					height: auto;
					margin: 0 auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 1.8;
					letter-spacing: 0.04em;
				}
				.contact__agreement__txt a {
					display: inline-block;
					color: var(--color--black);
					text-decoration: underline;
				}
				.contact__agreement__txt a:hover {
					text-decoration: none;
				}
			.contact__agreement__check {
				width: 100%;
				height: auto;
			}
				.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--black);
						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: 3px;
						left: 0;
					}
					.contact__agreement__check__txt label .agree_icon,
					.contact__agreement__check__txt label .agree_icon_bk {
						opacity: 0;
						position: absolute;
						top: 10px;
						left: 8px;
						transform: translate(-50%,-50%);
						transition: .2s;
					}
					.contact__agreement__check__txt label .agree_icon {
						width: 15px;
						height: auto;
						fill: var(--color--purple);
						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_select {
				width: 100%;
				height: auto;
				padding: 0 0 60px;
				display: flex;
				justify-content: space-between;
				align-items: center;
				gap: 12px;
			}
				.contact__type_select__item {
					flex: 1;
				}
					.contact__type_select__btn {
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 56px;
						padding: 0;
						background-color: var(--color--gray);
						cursor: pointer;
						transition: .3s;
					}
				@media (any-hover: hover) {
					.contact__type_select__btn:hover {
						background-color: var(--color--purple);
						color: #ffffff;
					}
						.contact__type_select__btn:hover .contact__type_select__btn__txt,
						.contact__type_select__btn:hover small {
							color: #ffffff;
						}
				}
					.contact__type_select__btn._active {
						background-color: var(--color--purple);
						color: #ffffff;
					}
						.contact__type_select__btn__txt {
							display: block;
							font-size: 1rem;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.05em;
							color: #fff;
							transition: .3s;
						}
						._active .contact__type_select__btn__txt {
							color: #ffffff;
						}
						.contact__type_select__btn small {
							display: block;
							margin-top: 6px;
							font-size: 0.625rem;
							line-height: 1.2;
							color: #fff;
							transition: .3s;
						}
						.contact__type_select__btn._active small {
							color: #ffffff;
						}
							.contact__type_select__btn small br {
								display: none;
							}
		@media all and (min-width:600px) and (max-width:850px){
			.contact__type_select {
				gap: 8px;
			}
						.contact__type_select__btn small {
							margin-top: 3px;
							letter-spacing: -0.055em;
						}
							.contact__type_select__btn small br {
								display: inline-block;
							}
		}

			.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: 205px;
								height: auto;
								padding: 6px 0 6px 12px;
								font-size: .875rem;
								font-weight: 700;
								line-height: 28px;
								letter-spacing: 0.03em;
								position: relative;
							}
								#contact_wrapper > dl > dt::before {
									content: '';
									display: block;
									width: 3px;
									height: 16px;
									background-color: var(--color--purple);
									position: absolute;
									top: 12px;
									left: 0;
								}
								#contact_wrapper > dl > dt .need {
									color: var(--color--purple);
								}
								#contact_wrapper > dl > dt.not::before {
									background-color: var(--color--lightgray);
								}
									#contact_wrapper > dl > dt .note {
										display: block;
										margin: 2px 0 0;
										font-size: 14px;
										font-weight: 500;
										line-height: calc(24 / 14);
										letter-spacing: 0.06em;
										text-align: left;
										color: var(--color--black);
									}
							#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;
							}
								.dd_ttl {
									width: 100%;
									height: auto;
									margin: 36px auto 12px;
									font-size: 16px;
									font-weight: 700;
									line-height: 1;
									letter-spacing: 0.06em;
									color: var(--color--black);
								}
								.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);
								}
								.radio_wrap,
								.checkbox_wrap {
									width: 100%;
									height: auto;
									padding: 6px 0 0;
								}
								.radio_wrap__list,
								.checkbox_wrap__list {
									display: flex;
									flex-direction: column;
									gap: 10px;
									width: 100%;
									height: auto;
								}
								.radio_wrap__list._row,
								.checkbox_wrap__list._row {
									flex-direction: row;
									justify-content: flex-start;
									align-items: flex-start;
									flex-wrap: wrap;
									gap: 10px 25px;
								}
								.radio_wrap__item,
								.checkbox_wrap__item {
									display: flex;
									justify-content: flex-start;
									align-items: center;
								}
								.radio_wrap__item label,
								.checkbox_wrap__item label {
									display: flex;
									justify-content: flex-start;
									align-items: center;
									gap: 8px;
									font-size: 1rem;
									font-weight: 700;
									line-height: 28px;
									letter-spacing: 0.06em;
									color: var(--color--black);
									cursor: pointer;
									position: relative;
								}
									.radio_wrap__item label::before,
									.checkbox_wrap__item label::before {
										content: '';
										display: block;
										width: 18px;
										height: 18px;
										background-color: #fff;
										border: solid 1px var(--color--lightgray);
									}
									.radio_wrap__item label::before {
										border-radius: 9999px;
									}
									.radio_wrap__item label::after {
										content: '';
										display: block;
										position: absolute;
									}
									.radio_wrap__item label::after {
										width: 8px;
										height: 8px;
										border-radius: 9999px;
										background-color: var(--color--purple);
										top: 10px;
										left: 5px;
										z-index: 1;
										opacity: 0;
										transition: .3s;
									}
									.recruit_radio:checked + label::after {
										opacity: 1;
									}
									.checkbox_icon {
										opacity: 0;
										width: 17px;
										height: auto;
										fill: var(--color--purple);
										transition: .3s;
										position: absolute;
										top: 8px;
										left: 2px;
									}
									label._checked .checkbox_icon {
										opacity: 1;
									}
								#contact_wrapper > dl > dd input.recruit_radio,
								#contact_wrapper > dl > dd input.recruit_checkbox {
									display: none;
								}
								#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: 100%;
									max-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--purple);
									}
								#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--purple) !important;
							font-size: 1rem;
							font-weight: 700;
							text-align: center;
							color: #fff;
						}
						.robot_authentication {
							width:300px;
							margin: 40px 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--lightgray);
									}
									.back_btn:hover::after {
										left: 17px;
										border-color: var(--color--lightgray);
									}
								.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--lightgray);
										background-color: var(--color--lightgray);
									}
									#btn_area ul li input[type='button'].btn:hover {
										background-color: #fff;
										color: var(--color--lightgray);
									}

			/* お客様相談室 (一般のお客様) */
			.contact__reserve_info {
				width: 100%;
				height: auto;
				padding: 25px 0 30px;
				margin: 0 auto 60px;
				border-radius: 3px;
				background-color: rgba(84, 17, 211, 0.02);
				border: solid 2px rgba(84, 17, 211, 0.8);
			}
				.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__list {
					display: grid;
					grid-template-columns: 1fr 1fr;
					gap: 10px;
					width: 90%;
					height: auto;
					margin: 0 auto;
				}
					.contact__reserve_info__btn_wrap {
						height: 50px;
					}
						.contact__reserve_info__btn {
							display: flex;
							justify-content: flex-start;
							align-items: center;
							width: 100%;
							height: 100%;
							padding-left: 2px;
							border-radius: 5px;
							background-color: var(--color--darkgray);
							border: solid 1px var(--color--darkgray);
							font-size: 0.875rem;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.05em;
							color: #fff;
							position: relative;
							transition: background .3s;
						}
					@media (any-hover: hover) {
						.contact__reserve_info__btn:hover {
							background-color: #fff;
							color: var(--color--darkgray);
						}
					}
							.contact__reserve_info__btn__icon {
								display: block;
								width: 46px;
								height: auto;
							}
								.contact__reserve_info__btn__icon img {
									width: 100%;
									height: auto;
								}
							.contact__reserve_info__btn__txt {
								padding-left: 12px;
							}
							.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%;
							}
						@media (any-hover: hover) {
							.contact__reserve_info__btn:hover::before {
								right: 10px;
								background-color: var(--color--darkgray);
							}
							.contact__reserve_info__btn:hover::after {
								right: 10px;
								border-color: var(--color--darkgray);
							}
						}

			/* 完了ページ */
			.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;
				margin: 0 auto 20px;
				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__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__general_btn_list {
						width: 100%;
						height: auto;
					}
					.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--darkgray);
								font-size: 1rem;
								font-weight: 700;
								letter-spacing: 0.05em;
								color: #fff;
								transition: .2s;
							}

			/* 共通 */
			.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--purple);
					}

			/* ご利用規約 */
			.contact__agreement__heading {
				width: 100%;
				height: auto;
				margin: 0 auto 10px;
				font-size: 18px;
				line-height: 1;
				letter-spacing: 0.05em;
				text-align: center;
				position: relative;
			}
			.contact__agreement {
				width: 100%;
				height: 195px !important;
				padding: 24px 14px 24px 20px;
				overflow-y: scroll;
				box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.1);
			}
			.contact__agreement::-webkit-scrollbar {
				width: 6px;
			}
			.contact__agreement::-webkit-scrollbar-track {
				background: transparent;
			}
			.contact__agreement::-webkit-scrollbar-thumb {
				background: var(--color--purple);
				border-radius: 3px;
			}
				.contact__agreement__txt {
					width: 100%;
					height: auto;
					margin: 0 auto;
					font-size: 0.875rem;
					font-weight: 500;
					line-height: 1.8;
					letter-spacing: 0.04em;
				}
				.contact__agreement__txt a {
					display: inline-block;
					color: var(--color--black);
					text-decoration: underline;
				}
			.contact__agreement__check {
				width: 100%;
				height: auto;
			}
				.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--black);
						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: 3px;
						left: 0;
					}
					.contact__agreement__check__txt label .agree_icon,
					.contact__agreement__check__txt label .agree_icon_bk {
						opacity: 0;
						position: absolute;
						top: 10px;
						left: 8px;
						transform: translate(-50%,-50%);
						transition: .2s;
					}
					.contact__agreement__check__txt label .agree_icon {
						width: 15px;
						height: auto;
						fill: var(--color--purple);
						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_select {
				width: 100%;
				height: auto;
				padding: 0 0 40px;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				gap: 8px;
			}
				.contact__type_select__item {
					width: 100%;
				}
					.contact__type_select__btn {
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;
						width: 100%;
						height: 56px;
						padding: 0;
						background-color: var(--color--gray);
						cursor: pointer;
						transition: .3s;
					}
				@media (any-hover: hover) {
					.contact__type_select__btn:hover {
						background-color: var(--color--purple);
						color: #ffffff;
					}
						.contact__type_select__btn:hover .contact__type_select__btn__txt,
						.contact__type_select__btn:hover small {
							color: #ffffff;
						}
				}
					.contact__type_select__btn._active {
						background-color: var(--color--purple);
						color: #ffffff;
					}
						.contact__type_select__btn__txt {
							display: block;
							font-size: 1rem;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.05em;
							color: #fff;
							transition: .3s;
						}
						._active .contact__type_select__btn__txt {
							color: #ffffff;
						}
						.contact__type_select__btn small {
							display: block;
							margin-top: 6px;
							font-size: 0.625rem;
							line-height: 1;
							color: #fff;
							transition: .3s;
						}
						.contact__type_select__btn._active small {
							color: #ffffff;
						}
							.contact__type_select__btn small br {
								display: none;
							}

			.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--purple);
									position: absolute;
									top: 12px;
									left: 0;
								}
								#contact_wrapper > dl > dt .need {
									color: var(--color--purple);
								}
								#contact_wrapper > dl > dt.not::before {
									background-color: var(--color--lightgray);
								}
									#contact_wrapper > dl > dt .note {
										display: block;
										margin: 0;
										font-size: 14px;
										font-weight: 500;
										line-height: calc(24 / 14);
										letter-spacing: 0.06em;
										text-align: left;
										color: var(--color--black);
									}
							#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);
								}
								.dd_ttl {
									width: 100%;
									height: auto;
									margin: 24px auto 8px;
									font-size: 14px;
									font-weight: 700;
									line-height: 1;
									letter-spacing: 0.06em;
									color: var(--color--black);
								}
								.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);
								}
								.radio_wrap,
								.checkbox_wrap {
									width: 100%;
									height: auto;
									padding: 6px 0 0;
								}
								.radio_wrap__list,
								.checkbox_wrap__list {
									display: flex;
									flex-direction: column;
									gap: 10px;
									width: 100%;
									height: auto;
								}
								.radio_wrap__item,
								.checkbox_wrap__item {
									display: flex;
									justify-content: flex-start;
									align-items: center;
								}
								.radio_wrap__item label,
								.checkbox_wrap__item label {
									display: flex;
									justify-content: flex-start;
									align-items: center;
									gap: 8px;
									font-size: 1rem;
									font-weight: 700;
									line-height: 28px;
									letter-spacing: 0.06em;
									color: var(--color--black);
									cursor: pointer;
									position: relative;
								}
									.radio_wrap__item label::before,
									.checkbox_wrap__item label::before {
										content: '';
										display: block;
										width: 18px;
										height: 18px;
										background-color: #fff;
										border: solid 1px var(--color--lightgray);
									}
									.radio_wrap__item label::before {
										border-radius: 9999px;
									}
									.radio_wrap__item label::after {
										content: '';
										display: block;
										position: absolute;
									}
									.radio_wrap__item label::after {
										width: 8px;
										height: 8px;
										border-radius: 9999px;
										background-color: var(--color--purple);
										top: 10px;
										left: 5px;
										z-index: 1;
										opacity: 0;
										transition: .3s;
									}
									.recruit_radio:checked + label::after {
										opacity: 1;
									}
									.checkbox_icon {
										opacity: 0;
										width: 17px;
										height: auto;
										fill: var(--color--purple);
										transition: .3s;
										position: absolute;
										top: 8px;
										left: 2px;
									}
									label._checked .checkbox_icon {
										opacity: 1;
									}
								#contact_wrapper > dl > dd input.recruit_radio,
								#contact_wrapper > dl > dd input.recruit_checkbox {
									display: none;
								}
								#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--purple);
									}
								#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--purple) !important;
							font-size: 1rem;
							font-weight: 700;
							text-align: center;
							color: #fff;
						}
						.robot_authentication {
							width:300px;
							margin: 40px 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--lightgray);
										background-color: var(--color--lightgray);
									}

			/* お客様相談室 (一般のお客様) */
			.contact__reserve_info {
				width: 100%;
				height: auto;
				padding: 25px 0 30px;
				margin: 0 auto 50px;
				border-radius: 3px;
				background-color: rgba(84, 17, 211, 0.02);
				border: solid 2px rgba(84, 17, 211, 0.8);
			}
				.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__list {
					width: 90%;
					height: auto;
					margin: 0 auto;
				}
					.contact__reserve_info__btn_wrap {
						width: 100%;
						height: 46px;
					}
					.contact__reserve_info__btn_wrap:not(:last-of-type) {
						margin-bottom: 12px;
					}
						.contact__reserve_info__btn {
							display: flex;
							justify-content: flex-start;
							align-items: center;
							width: 100%;
							height: 100%;
							padding-left: 1px;
							border-radius: 5px;
							background-color: var(--color--darkgray);
							border: solid 1px var(--color--darkgray);
							font-size: 0.875rem;
							font-weight: 700;
							line-height: 1;
							letter-spacing: 0.05em;
							color: #fff;
							position: relative;
						}
							.contact__reserve_info__btn__icon {
								display: block;
								width: 42px;
								height: auto;
							}
								.contact__reserve_info__btn__icon img {
									width: 100%;
									height: auto;
								}
							.contact__reserve_info__btn__txt {
								padding-left: 12px;
							}
							.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%;
						}
}