@charset "utf-8";
/* CSS Document */

.option__items{
	margin: 0;
	padding: 0;
	list-style: none;

	margin-top: -2%;
	margin-left: -2%;

	display: flex;
	flex-wrap: wrap;
}
.option__item{
	flex: 0 1 48%;
	margin-top: 2%;
	margin-left: 2%;
	box-sizing: border-box;
	border: 1px solid #999;
}
.option__radio{
	display: none;
}

@media all and (-ms-high-contrast: none){
	.option__item{
		flex-basis: 47.8%;
	}
}



.input__wrap{
	height: 100%;
	padding: 1%;
	box-sizing: border-box;

	display: flex;

}
.option__radio:checked ~ .input__wrap{
	background-color: #f5f5f5;
}
.input__image{
	margin-right: 2%;

	flex: 0 1 auto;
}
.input__body{
	flex: 1 1 auto;
}
.input__title{
	font-size: 1.25em;
	font-weight: bold;
	line-height: 1.5em;
	margin-bottom: .25em;
}
.input__note{
	color: #666;
	font-size: .8125em;
	line-height: 1.5em;
}
.input__checkmark{
	flex: 0 0 auto;
	position: relative;
	align-self: center;

	margin-left: 3%;
	width: 2em;
	height: 2em;

	border-radius: 999em;
	border: 1px solid #999;

}
.input__checkmark:before{
	content: "";
	
	visibility: hidden;

	color: #fff;
	border-style: solid;
	border-width: 0 0 3px 3px;

	display: block;

	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;

	width: 1em;
	height: .5em;

	transform: rotate(-45deg);
}
.option__radio:checked ~ .input__wrap .input__checkmark{
	display: block;
	background-color: #25296A;
}
.option__radio:checked ~ .input__wrap .input__checkmark:before{
	visibility: visible;
}

.input__label{
	cursor: pointer;
}
.input__wrap{}






.buttonFrame1{
	margin: 0;
	padding: 0;
	list-style: none;

	display: flex;
	justify-content: center;
}
.buttonFrame1__item{
	flex: 0 1 400px;
}
.buttonFrame1__item:not(:first-child){
	margin-left: 2em;
}
.button1--negative{
	background-color: #999;
}





.mv__image{
	margin: 0;
	padding: 0;
	margin-bottom: 2em;
}
.mv__note{
	text-align: center;
}




.o-title1{
	font-size: 1.5em;
	font-weight: normal;
	line-height: 1.5em;
	text-align: center;
	color: #25296A;
	padding-top: 1.25em;
	padding-bottom: 1.25em;
	margin: 0;
}
.o-input1{
	width: 100%;
	box-sizing: border-box;
}
textarea.o-input1{
	height: 7em;
}




.o-gap{
	margin-top: 3.125em;
	margin-bottom: 3.125em;
}




.must,
.error{
	color: #c00;
	font-size: .85em;
}




/*==================

  version 2026

==================*/


/* components
================== */

.c-ttl{
	line-height: 1.5;
	font-size: 1em;
	font-weight: bold;
	text-box: trim-both cap alphabetic;
	
	&:where(.c-ttl-page){
		font-size: 2em;
	}
	
	&:where(.c-ttl-section){
		font-size: 1.5em;
	}
	
	&:where(.c-ttl-center){
		text-align: center;
	}
}


.c-note{
	line-height: 1.875;
}



.c-sect{
	--offset: 5.625em;
	
	&:first-of-type + &{
		margin-top: var(--offset);
	}
}



.c-list{
	line-height: 1.5;
	margin-left: 1.25em;
	padding-left: 0;
}

@scope (.c-list--small){
	li{
		font-size: .875em;
	}
}

.c-card{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1em;
	
	&:where(ul, ol){
		list-style: none;
		padding-left: 0;
	}
}


@scope (.c-field){
	:scope{
		border: none;
		padding: 0;
	}
	
	:scope > * + *{
		margin-top: .5em;
	}
	
	legend{
		font-weight: bold;
		padding: 0;
	}
}

.c-input{
	line-height: 1.5;
	border: 1px solid #9F9673;
	border-radius: .25em;
	padding: .25em .5em;
	box-sizing: border-box;
	
	&:not([size], [cols], [width]){
		width: 100%;
	}
	
	&:where(textarea):not([rows], [height]){
		height: calc(6lh + .5em);
	}
	
	&:focus{
		outline: 2px solid #9F9673;
	}
}

.c-require{
	color: #E24D4D;
}

.c-btnlist{
	display: flex;
	justify-content: center;
	gap: 1em;
	
	& > *{
		flex: 0 0 300px;
	}
}

.c-btn{
	--color-theme: #ccc;
	
	padding: 1em;
	display: block;
	background: var(--color-theme);
	
	&:where(button){
		width: 100%;
		border: none;
	}
	
	&:hover{
		background: oklch(from var(--color-theme) calc(l * 1.1) c h);
	}
	
}




/* project
================== */

/* hero */
.p-hero{
	text-align: center;
	text-wrap: balance;
	color: white;
	
	display: grid;
	grid-template-areas: "hero";
	
	position: relative;
	z-index: 0;
	
	& > *{
		grid-area: hero;
		place-self: center;
	}
}

@media (min-width: 769px){
	.p-hero{
		font-size: 1.333em;
	}
}



.p-hero__img{
	z-index: -1;
	width: 100%;
	height: 100%;
	max-height: 620px;
	/* min-height: 240px; */
	min-height: 214px;
	
	object-fit: cover;
	filter: brightness(.5);
	user-select: none;
}


/* application field */
.c-ttl--application-field{
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: 1em;
	
	& > img{
		border-radius: .5em;
		aspect-ratio: 1;
		width: 5.5em;
		object-fit: cover;
	}
}

.c-card--application-field{
	grid-template-columns: repeat(auto-fit, min(320px, 100%));
	justify-content: center;
	
	& > *{
		display: contents;
	}
}

@scope (.application-field-check){
	:scope{
		border: 1px solid #D9D9D9;
		border-radius: .5em;
		
		display: block;
		padding: 1em;
		
		position: relative;
		z-index: 0;
		
		&:hover{
			outline: 1px solid #9F9673;
			outline-offset: -1px;
		}
		
		&:has(:checked), &.is-active{
			outline: 3px solid #9F9673;
			outline-offset: -3px;
		}
		
		&:where(label){
			cursor: pointer;
		}
	}
	
	input{
		appearance: none;
		
		color: #6EA24E;
		background: white;
		border: 3px solid #9F9673;
		border-radius: 100vmax;
		
		display: grid;
		place-items: center;
		cursor: pointer;
		
		width: 2em;
		height: 2em;
		
		position: absolute;
		inset: 0 auto auto .5em;
		translate: 0 -50%;
		
		&:checked{
			background: white url(../img/icon-checkmark.svg) no-repeat center / 1em 1em;
		}
		
		&:not(:checked){
			display: none;
		}
	}
	
	.c-list--notice{
		list-style: "※";
	}
	
}


/* fields */
@scope (.c-sect--fields){
	:scope{
		background: #f5f2ed;
		padding-block: 0 var(--offset);
	}
	
	.c-ttl--contact-main{
		translate: 0 -50%;
		
		& + *{
			margin-top: calc(var(--stack) / 2);
		}
	}
}

/* contact field */
.c-ttl--contact-main{
	text-align: center;
	
	color: #9F9673;
	background: white;
	border: 3px solid;
	padding: 1em;
	box-sizing: border-box;
	
	
	max-width: fit-content;
	min-width: min(400px, 100%);
	margin-inline: auto;
}



.contact-field-grid{
	columns: 2;
	column-rule: 1px dashed #221E1E;
	column-gap: 2em;
	
	& > *{
		break-inside: avoid;
	}
}

@media (max-width: 768px){
	.contact-field-grid{
		columns: 1;
	}
	.contact-field-grid > * + ::before{
		content: "";
		display: block;
		border-top: 1px dashed #221E1E;
		margin-block: 2em;
	}
}

.g-recaptcha--2026{
	max-width: fit-content;
	margin-inline: auto;
}

.c-btn--submit{
	--color-theme: #9F9673;
	
	font-weight: bold;
	color: white;
	background: var(--color-theme);
	border-radius: 100vmax;
}

.c-btn--back{
	--color-theme: #ccc;
	
	font-weight: bold;
	color: white;
	background: var(--color-theme);
	border-radius: 100vmax;
	
	&:hover{
		background: oklch(from var(--color-theme) calc(l * .9) c h);
	}
}
