@charset "UTF-8";
:root {
	--border-thin: 1px solid #cccccc;
	--field-spacer: var(--base-font-size);
	--link-color: #0071bc;
}
/* 入力要素各種 */
input[type="text"], input[type="tel"], input[type="email"], input[type="number"], input[type="date"], select, textarea {
	font-size: 16px;
	line-height: 1.5;
	inline-size: min(100%, 300px);
	box-sizing: border-box;
	padding: 0.25em 0.75em;
	border: 1px solid #ccc;
	border-radius: 0;
	background-color: #f5f5f5;
	appearance: none;
	&.input-full {
		inline-size: min(100%, 460px);
	}
}
input:focus, select:focus, textarea:focus {
	background-color: #fff;
	border-color: var(--link-color);
}
textarea {
	inline-size: 100%;
}
input[type="date"] {
	height: calc(1lh + calc(0.25em + 1px) * 2);
}
.select-box {
	position: relative;
	display: inline-block;
	inline-size: min(100%, 300px);
	&::before, &::after {
		content: "";
		inline-size: 0.5em;
		block-size: 0.36em;
		aspect-ratio: 1;
		position: absolute;
		right: 8px;
		background-color: #aaa;
	}
	&::before {
		clip-path: polygon(50% 0, 100% 100%, 0 100%);
		inset-block-start: calc(50% - 7.5px);
	}
	&::after {
		clip-path: polygon(0 0, 100% 0, 50% 100%);
		bottom: calc(50% - 7.5px);
	}
	& select {
		inline-size: 100%;
	}
}
a {
	color: var(--link-color);
}
@media(any-hover:hover) {
	label {
		cursor: pointer;
	}
}
.nowrap {
	display: inline-block;
}
.form-header {
	margin: 70px var(--base-inline-margin) 70px;
}
.form-body {
	margin: 0 var(--base-inline-margin);
}
.lead-copy {
	font-size: 1em;
	line-height: 1.75;
	margin-block-end: 1.75em;
	text-align: justify;
}
.inquiry-info {
	font-size: 1em;
	border: var(--border-thin);
	text-align: start;
	background-color: #fff;
	& dt {
		font-weight: var(--font-regular);
		justify-content: center;
		align-items: center;
		display: flex;
		background-color: #f2f2f2;
		border-block-end: var(--border-thin);
		padding: 0.15em;
	}
	& dd {
		display: flex;
		justify-content: center;
		padding: 1em 1em;
		line-height: 1.75;
		& strong {
			font-size: calc(21 / 16 * 1em);
			font-weight: inherit;
			display: block;
		}
	}
}
@media (768px <=width), print {
	.inquiry-info {
		display: flex;
		& dt {
			border-block-end: none;
			border-right: var(--border-thin);
			inline-size: min(25%, 15.5em);
		}
		& dd {
			flex: auto;
		}
	}
}
@media (1024px <=width), print {
	.inquiry-info {
		& dt {
			inline-size: 15.5em;
		}
		& dd {
			justify-content: flex-start;
			padding-inline: 5em;
		}
	}
}
.form-group {
	border: none;
	border-block-end: var(--border-thin);
	margin-block-start: var(--field-spacer);
	padding-block-end: 1em;
	& .form-label {
		display: block;
		font-feature-settings: 'palt';
		line-height: 1.75;
		margin-block-end: 0.75em;
	}
	& .input-container {
		margin-inline: 1em;
	}
}
@media (768px <=width), print {
	.form-group {
		--_label-width: calc(200 / 16 * 1em);
		display: flex;
		align-items: center;
		border: none;
		border-block-end: var(--border-thin);
		padding-block-end: var(--field-spacer);
		& .form-label {
			padding: calc(5px - 0.125em) 1.25em;
			display: block;
			inline-size: var(--_label-width);
			line-height: 1.75;
			flex: none;
			align-self: flex-start;
			margin-block-end: 0;
			& .note {
				display: block;
			}
		}
		& .input-container {
			margin-inline: 0;
			min-height: calc(1em * 1.5 + 10px);
			flex: auto;
		}
	}
	fieldset.form-group {
		display: block;
		& .form-label {
			float: left;
		}
		& .input-container {
			margin-inline-start: var(--_label-width);
		}
		&::after {
			content: "";
			display: block;
			clear: both;
		}
	}
}
@media (1024px <=width), print {
	.form-group {
		--_label-width: calc(280 / 16 * 1em)
	}
}
.radio-group-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0 2em;
	align-items: center;
}
.select-wrapper-block {
	display: flex;
	flex-direction: column;
	margin-block-start: 2em;
	gap: 0.15em;
}
.required {
	color: #f15a24;
	margin-inline-start: 0.66666666em;
}
.footnote {
	margin-block-start: 0.5em;
}
.form-group-l.inquire-type {
	border: none;
	border-block-end: var(--border-thin);
	& .form-label {
		padding-inline: 0;
	}
	& .radio-group-row {
		inline-size: 100%;
		font-size: calc(18 / 16 * 1em);
		display: flex;
		flex-wrap: wrap;
		padding-inline-start: 1em;
		padding-block: 1em;
		position: relative;
		margin-inline-start: 0;
	}
	& .radio-group-row::before {
		content: "";
		inline-size: 100%;
		block-size: 1px;
		border-block-start: var(--border-thin);
		display: block;
		position: absolute;
		inset-block-start: 0;
		left: 0;
	}
}
@media (1024px <=width), print {
	.form-group-l.inquire-type {
		& .form-label {
			padding-inline: 0;
		}
		& .radio-group-row {
			padding-inline-start: 2em;
			padding-block: 1.5em;
			font-size: calc(21 / 16 * 1em);
		}
	}
}
.birth-inputs {
	display: flex;
	flex-direction: column;
	gap: 0.75em;
	& input {
		inline-size: 8em;
	}
	& span {
		padding-inline: 0.33333333em 0.66666666em;
	}
}
@media (768px <=width), print {
	.birth-inputs {
		flex-direction: row;
		gap: 0;
	}
}
.select-box:has(.select-year) {
	inline-size: 6em;
}
.address-group {
	display: flex;
	flex-direction: column;
	gap: 1.3em 0;
	& .address-label {
		inline-size: 5em;
		padding-right: 0.75em;
		display: inline-block;
	}
	& .address-label.compact {
		inline-size: auto;
	}
	& input {
		inline-size: min(100%, 400px);
	}
	& #postal_code {
		inline-size: 10em;
	}
}
.qualification-group, .trigger-group {
	display: flex;
	flex-direction: column;
	gap: 0.33333333em 0;
}
/* form-foot */
.privacy-policy-section {
	padding: calc(30 / 16 * 1em) 0;
	& p {
		text-align: center;
		line-height: 2;
	}
	& label {
		inline-size: calc(200 / 16 * 1em);
		margin: 2em auto 0;
		padding: 0.15em 1em;
		line-height: 1.5;
		background-color: #cccccc;
		color: var(--white);
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		&::after {
			font-size: 0.75em;
			content: "▶︎";
			margin-inline-start: 1.33333333em;
		}
	}
	& .check-agree {
		appearance: none;
	}
	& label:has(:checked) {
		background-color: #808080;
	}
}
/* 確認画面・送信完了画面 */
.form-container {
	margin: 70px var(--base-inline-margin);
	& h3 {
		font-size: calc(28 / 16 * 1em);
		font-weight: var(--font-medium);
		color: var(--gray80);
		border-block-end: var(--border-thin);
		padding-block-end: 0.5em;
		margin-block-end: 1.5em;
	}
}
.form-lead {
	margin-block-end: 2em;
	line-height: 1.75;
}
.form-table {
	inline-size: 100%;
	border-collapse: collapse;
	margin-block-end: 2.5em;
	& th, & td {
		padding: 0.75em 1em;
		border-block-end: var(--border-thin);
		text-align: start;
		vertical-align: top;
		line-height: 1.75;
	}
	& th {
		background-color: var(--grayF2);
		font-weight: var(--font-regular);
		white-space: nowrap;
		inline-size: 10em;
	}
}
@media (768px <=width), print {
	.form-table {
		& th {
			inline-size: calc(200 / 16 * 1em);
		}
	}
}
@media (1024px <=width), print {
	.form-table {
		& th {
			inline-size: calc(280 / 16 * 1em);
		}
	}
}
.form-btn {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
	justify-content: center;
	padding-block-start: calc(60 / 16 * 1em);
	border-block-start: var(--border-thin);
	& input[type="button"], & input[type="submit"] {
		inline-size: calc(200 / 16 * 1em);
		block-size: calc(60 / 16 * 1em);
		border: 2px solid var(--grayCC);
		background-color: transparent;
		cursor: pointer;
		font-size: 1em;
		font-family: inherit;
		appearance: none;
		text-align: center;
	}
	& input[type="button"] {
		background-color: #f2f2f2;
	}
	& input[type="submit"] {
		background-color: #333333;
		color: var(--white);
		border-color: #333333;
	}
}
.err-message {
	color: #c00;
	margin-block-end: 1.5em;
	line-height: 1.75;
}
.back-home-btn {
	margin-block-start: 2.5em;
	text-align: center;
	& a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		inline-size: calc(240 / 16 * 1em);
		block-size: calc(60 / 16 * 1em);
		border: 2px solid var(--grayCC);
		text-decoration: none;
		color: inherit;
		&::after {
			font-size: 0.75em;
			content: "▶︎";
			margin-inline-start: 1.33333333em;
		}
	}
}
.submit-section {
	border-block-start: var(--border-thin);
	padding-block-start: calc(60 / 16 * 1em);
	& button {
		margin-inline: auto;
		inline-size: calc(200 / 16 * 1em);
		block-size: calc(60 / 16 * 1em);
		display: flex;
		align-items: center;
		justify-content: center;
		border: 2px solid #cccccc;
		&::after {
			font-size: 0.75em;
			content: "▶︎";
			margin-inline-start: 1.33333333em;
		}
	}
}
@media(any-hover:hover) {
.submit-section {
	& button{
		transition:background-color 200ms,
		color 200ms,
		border-color 200ms;
	}
	& button:hover{
		background-color: var(--blue);
		color:var(--white);
		border-color:var(--blue);
	}
	}
}
.category-heading {
	font-size: calc(14 / 16 * 1rem);
	color: var(--blue);
	line-height: 1.5;
	margin-block: calc(var(--spacer-unit) * 2) 0.25em;
	font-weight: var(--font-bold);
	font-feature-settings: 'palt';
}
.checkbox-group .sub-group {
	& label {
		display: block;
		line-height: 1.3;
		padding: 0.275em 0;
		break-inside: avoid;
	}
	& label:has(input[type="checkbox"]) {
	margin-inline-start: 1.155em;
	text-indent: -1.155em;
}
}
@media (768px <=width), print {
	.checkbox-group .sub-group.column {
		column-count: 2;
		column-gap: 2em;
	}
}
@media (1132px <=width), print {
	.checkbox-group .sub-group.column {
		column-count: 3;
	}
}