@charset "UTF-8";
:where( ul , ol ){
	&.sepalate01{
		display : flex;
		flex-wrap : wrap;
		li:not( :first-child )::before{
			content : "・";
		}
	}
}

/* --------------------------------------------
AREA
--------------------------------------------- */
#areaContent{
	@media screen and ( width <= 768px ){
		#linkArea{
			margin-top : calc( 68 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		#linkArea{
			grid-template-columns : calc( 80 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 62 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 80 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 62 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 8 * 100% / 1080 ) calc( 144 * 100% / 1080 ) 1fr calc( 80 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 144 * 100% / 1080 ) calc( 80 * 100% / 1080 );
			width : calc( 1080 * var( --contentBase ) );
			margin-inline : auto;
			margin-top : calc( 60 * var( --remBase ) );
			picture{
				left : calc( ( 156 + 76 ) * 100% / 1080 );
			}
		}
	}
}
:root:has( #areaContent dialog[open] ){
	overflow : hidden;
}
#areaContent dialog{
	position : fixed;
	inset : 0;
	margin : auto;
	&[open]{
		z-index : 100;
		display : block;
		overflow-y : visible;
		&::backdrop{
			pointer-events : auto;
			background-color : color-mix( in sRGB , black 40% , transparent );
		}
	}
	.dialogContent{
		position : relative;
		background-color : white;
	}
	button{
		position : absolute;
		display : block;
		align-items : center;
		line-height : 1;
		text-align : center;
	}
	h2{
		font-weight : 500;
	}
	a{
		display : block;
		align-items : center;
		width : fit-content;
		font-weight : 500;
		color : white;
		text-align : center;
		background-color : var( --blue03 );
		outline : solid 1px var( --blue03 );
		outline-offset : -1px;
	}
	p{
		font-weight : 500;
		border-top : solid 1px currentColor;
	}
	ul{
		display : flex;
		flex-wrap : wrap;
	}
	@media screen and ( width <= 768px ){
		width : calc( 432 * var( --viewportBase ) );
		.dialogContent{
			padding-block : calc( 28 * var( --remBase ) );
			padding-inline : calc( 24 * 100% / 432 );
			border-radius : calc( 12 * var( --remBase ) );
		}
		button{
			top : calc( 14 * var( --remBase ) );
			right : calc( 20 * 100% / 432 );
			width : calc( 28 * 100% / 432 );
			height : calc( 40 * var( --remBase ) );
			font-size : calc( 24 * var( --remBase ) );
		}
		h2{
			font-size : calc( 20 * var( --remBase ) );
			line-height : calc( 30 / 20 );
		}
		h2 + a{
			margin-top : calc( 12 * var( --remBase ) );
		}
		a{
			padding-block : calc( 8 * var( --remBase ) );
			padding-inline : calc( 18 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
			border-radius : calc( 6 * var( --remBase ) );
		}
		p{
			padding-top : calc( 18 * var( --remBase ) );
			margin-top : calc( 18 * var( --remBase ) );
			font-size : calc( 19 * var( --remBase ) );
			line-height : calc( 28 / 19 );
		}
		ul{
			row-gap : calc( 6 * var( --remBase ) );
			column-gap : calc( 6 * 100% / 384 );
			height : calc( 300 * var( --remBase ) );
			margin-top : calc( 12 * var( --remBase ) );
			overflow-y : auto;
		}
	}
	@media print , screen and ( width > 768px ){
		width : calc( 730 * var( --viewportBase ) );
		.dialogContent{
			padding-block : calc( 24 * var( --remBase ) );
			padding-inline : calc( 24 * 100% / 730 );
			border-radius : calc( 10 * var( --remBase ) );
		}
		button{
			top : calc( 12 * var( --remBase ) );
			right : calc( 16 * 100% / 730 );
			width : calc( 24 * 100% / 730 );
			height : calc( 36 * var( --remBase ) );
			font-size : calc( 24 * var( --remBase ) );
		}
		h2{
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
		h2 + a{
			margin-top : calc( 10 * var( --remBase ) );
		}
		a{
			padding-block : calc( 8 * var( --remBase ) );
			padding-inline : calc( 16 * var( --remBase ) );
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 24 / 16 );
			border-radius : calc( 6 * var( --remBase ) );
		}
		p{
			padding-top : calc( 16 * var( --remBase ) );
			margin-top : calc( 16 * var( --remBase ) );
			font-size : calc( 17 * var( --remBase ) );
			line-height : calc( 26 / 17 );
		}
		ul{
			row-gap : calc( 6 * var( --remBase ) );
			column-gap : calc( 6 * 100% / 682 );
			margin-top : calc( 10 * var( --remBase ) );
		}
	}
}
@media ( hover : hover ){
	#areaContent dialog a:hover{
		color : var( --blue03 );
		background-color : white;
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#areaContent dialog a{
		transition : color .3s linear , background-color .3s linear;
	}
}

/* --------------------------------------------
PRICE
--------------------------------------------- */
#price02 , #installmentpayment04{
	position : relative;
	overflow-x : clip;
	background-color : #dcf8ff;
	&::after{
		position : absolute;
		top : 100%;
		left : 0;
		display : block;
		width : 100%;
		margin-top : -1px;
		clip-path : ellipse( 75% 100% at 50% 0% );
		font-size : 0;
		content : "";
		background : url( "../images/top/reason/bg.svg" ) center top / cover no-repeat;
		background-color : #dcf8ff;
	}
	.box{
		background-color : white;
	}
	.box:not( #price0202 ) > p{
		font-weight : 500;
		em{
			font-weight : 700;
			color : var( --orange );
		}
		span{
			color : var( --blue03 );
		}
	}
	.merit{
		li{
			font-weight : 700;
			color : white;
			background-color : var( --green );
		}
	}
	@media screen and ( width <= 768px ){
		padding-top : calc( 32 * var( --remBase ) );
		margin-top : calc( 88 * var( --remBase ) );
		margin-bottom : calc( 64 * var( --remBase ) );
		&::after{
			height : calc( 64 * var( --remBase ) );
		}
		.box{
			padding-block : calc( 48 * var( --remBase ) );
			padding-inline : calc( 12 * var( --contentBase ) );
			border-radius : calc( 32 * var( --remBase ) );
		}
		#pageStaff{
			+ p{
				margin-top : calc( 32 * var( --remBase ) );
			}
		}
		.box:not( #price0202 ) > p{
			font-size : calc( 22 * var( --remBase ) );
			line-height : calc( 32 / 22 );
			+ p{
				margin-top : calc( 44 * var( --remBase ) );
			}
		}
		.merit{
			column-gap : calc( 4 * 100% / 1004 );
			margin-top : calc( 68 * var( --remBase ) );
			li{
				width : fit-content;
				padding-block : calc( 2 * var( --remBase ) );
				padding-inline : calc( 15 * var( --remBase ) );
				font-size : calc( 34 * var( --remBase ) );
				line-height : calc( 50 / 34 );
				border-radius : calc( 10 * var( --remBase ) );
				+ li{
					margin-top : calc( 16 * var( --remBase ) );
				}
			}
			+p{
				margin-top : calc( 44 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		padding-top : calc( 60 * var( --remBase ) );
		margin-top : calc( 140 * var( --remBase ) );
		margin-bottom : calc( 146 * var( --remBase ) );
		&::after{
			height : calc( 146 * var( --remBase ) );
		}
		.box{
			padding-block : calc( 60 * var( --remBase ) );
			padding-inline : calc( 38 * 100% / 1080 );
			border-radius : calc( 30 * var( --remBase ) );
		}
		#pageStaff{
			+ p{
				margin-top : calc( 60 * var( --remBase ) );
			}
		}
		.box:not( #price0202 ) > p{
			font-size : calc( 19.2 * var( --remBase ) );
			line-height : calc( 28.8 / 19.2 );
			+ p{
				margin-top : calc( 38 * var( --remBase ) );
			}
		}
		.merit{
			display : flex;
			flex-wrap : wrap;
			column-gap : calc( 4 * 100% / 1004 );
			margin-top : calc( 60 * var( --remBase ) );
			li{
				padding-block : calc( 1.5 * var( --remBase ) );
				padding-inline : calc( 15 * var( --remBase ) );
				font-size : calc( 30 * var( --remBase ) );
				line-height : calc( 45 / 30 );
				border-radius : calc( 10 * var( --remBase ) );
			}
			+p{
				margin-top : calc( 38 * var( --remBase ) );
			}
		}
	}
}
#pageStaff{
	display : grid;
	justify-content : space-between;
	picture{
		overflow : hidden;
		img{
			width : 100%;
			height : 100%;
			object-fit : cover;
			object-position : center top;
		}
	}
	.name{
		font-weight : 500;
		text-align : center;
	}
	@media screen and ( width <= 768px ){
		grid-template-columns : repeat( 2 , calc( 210 * 100% / 432 ) );
		row-gap : calc( 12 * var( --remBase ) );
		margin-top : calc( 48 * var( --remBase ) );
		picture{
			height : calc( 156 * var( --remBase ) );
			border-radius : calc( 12 * var( --remBase ) );
		}
		.name{
			margin-top : calc( 8 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
	}
	@media print , screen and ( width > 768px ){
		grid-template-columns : repeat( 3 , calc( 302 * 100% / 1004 ) );
		row-gap : calc( 48 * var( --remBase ) );
		margin-top : calc( 42 * var( --remBase ) );
		picture{
			height : calc( 230 * var( --remBase ) );
			border-radius : calc( 10 * var( --remBase ) );
		}
		.name{
			margin-top : calc( 8 * var( --remBase ) );
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 24 / 16 );
		}
	}
}
#price0202{
	@media screen and ( width <= 768px ){
		margin-top : calc( 32 * var( --remBase ) );
		.title02 + p{
			margin-top : calc( 28 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		margin-top : calc( 60 * var( --remBase ) );
		.title02 + p{
			margin-top : calc( 30 * var( --remBase ) );
		}
	}
}
#price04{
	background-color : #fef8e8;
	.box{
		background-color : white;
		> p{
			font-weight : 500;
		}
		.sub{
			margin-top : calc( 42 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
	}
	@media screen and ( width <= 768px ){
		padding-block : calc( 32 * var( --remBase ) );
		margin-top : calc( 32 * var( --remBase ) );
		.box{
			padding-block : calc( 45 * var( --remBase ) );
			padding-inline : calc( 12 * var( --contentBase ) );
			border-radius : calc( 32 * var( --remBase ) );
			.lede{
				margin-top : calc( 28 * var( --remBase ) );
				font-size : calc( 24 * var( --remBase ) );
				line-height : calc( 34 / 24 );
			}
		}
		#linkArea{
			margin-top : calc( 68 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		padding-block : calc( 60 * var( --remBase ) );
		margin-top : calc( 60 * var( --remBase ) );
		.box{
			padding-block : calc( 60 * var( --remBase ) );
			border-radius : calc( 30 * var( --remBase ) );
			> p{
				text-align : center;
			}
			.lede{
				margin-top : calc( 32 * var( --remBase ) );
				font-size : calc( 26 * var( --remBase ) );
				line-height : calc( 39 / 26 );
			}
		}
		#linkArea{
			grid-template-columns : calc( 80 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 62 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 80 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 62 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 8 * 100% / 1080 ) calc( 144 * 100% / 1080 ) 1fr calc( 80 * 100% / 1080 ) calc( 10 * 100% / 1080 ) calc( 144 * 100% / 1080 ) calc( 80 * 100% / 1080 );
			width : calc( 1080 * var( --contentBase ) );
			margin-inline : auto;
			margin-top : calc( 60 * var( --remBase ) );
			picture{
				left : calc( ( 156 + 76 ) * 100% / 1080 );
			}
		}
	}
}

/* --------------------------------------------
INSTALLMENTPAYMENT
--------------------------------------------- */
#installmentpayment02{
	background-color : #fef8e8;
	@media screen and ( width <= 768px ){
		padding-block : calc( 32 * var( --remBase ) );
	}
	@media print , screen and ( width > 768px ){
		padding-block : calc( 60 * var( --remBase ) );
	}
}
:where( #installmentpayment0201 , #installmentpayment0202 ){
	> p:nth-of-type( 1 ){
		display : grid;
		grid-template-rows : 1fr auto auto 1fr;
		margin-inline : auto;
		background-color : color-mix( in sRGB , white 60% , transparent );
		box-shadow : 0 0 0 calc( 8 * var( --remBase ) ) rgb( 200 200 255 / .1 ) , 0 0 calc( 20 * var( --remBase ) ) rgb( 180 180 255 / .3 );
		span{
			text-align : center;
			&:nth-of-type( 1 ){
				grid-row : 2;
				grid-column : 1;
				font-weight : 500;
			}
			&:nth-of-type( 2 ){
				grid-row : 3;
				grid-column : 1;
				font-weight : 700;
				color : indigo;
			}
		}
		&::after{
			display : block;
			grid-row : 1/-1;
			grid-column : 2;
			aspect-ratio : 399.373 / 422.922;
			font-size : 0;
			content : "";
			background : url( "../images/price/installmentpayment/char01.svg" ) left top / contain no-repeat;
		}
	}
	@media screen and ( width <= 768px ){
		> p:nth-of-type( 1 ){
			column-gap : calc( 24 * var( --contentBase ) );
			padding-block : calc( 16 * var( --remBase ) );
			padding-inline : calc( 32 * var( --contentBase ) );
			margin-top : calc( 28 * var( --remBase ) );
			border-radius : calc( 24 * var( --remBase ) );
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 18 * var( --remBase ) );
					line-height : calc( 27 / 18 );
				}
				&:nth-of-type( 2 ){
					font-size : calc( 32 * var( --remBase ) );
					line-height : calc( 48 / 32 );
				}
			}
			&::after{
				height : calc( 200 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		> p:nth-of-type( 1 ){
			column-gap : calc( 32 * var( --remBase ) );
			width : fit-content;
			padding-block : calc( 30 * var( --remBase ) );
			padding-inline : calc( 60 * var( --remBase ) );
			margin-top : calc( 32 * var( --remBase ) );
			border-radius : calc( 20 * var( --remBase ) );
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 24 * var( --remBase ) );
					line-height : calc( 36 / 24 );
				}
				&:nth-of-type( 2 ){
					font-size : calc( 44 * var( --remBase ) );
					line-height : calc( 64 / 44 );
				}
			}
			&::after{
				height : calc( 220 * var( --remBase ) );
			}
		}
	}
}
#installmentpayment0201{
	h3{
		font-weight : 700;
		background-color : #f2f2f2;
	}
	> p:nth-of-type( 2 ){
		display : grid;
		justify-content : space-between;
		> span{
			&:not( :nth-of-type( 3 ) ){
				background-color : white;
				box-shadow : 0 calc( 2 * var( --remBase ) ) calc( 6 * var( --remBase ) ) color-mix( in sRGB , black 50% , transparent );
				> span{
					&:nth-of-type( 1 ){
						display : block;
						align-content : center;
						width : fit-content;
						margin-inline : auto;
						font-weight : 700;
						color : white;
						text-align : center;
						background-color : var( --green );
						border-radius : 100vmax;
					}
					&:nth-of-type( 2 ){
						display : block;
						font-weight : 700;
						text-align : center;
						&::before{
							display : block;
							width : auto;
							aspect-ratio : 228/163;
							margin-inline : auto;
							font-size : 0;
							content : "";
							background : url( "../images/price/installmentpayment/money.svg" ) center / contain no-repeat;
						}
					}
				}
			}
			&:nth-of-type( 3 ){
				align-self : center;
				color : #999;
			}
		}
	}
	ul{
		position : relative;
		margin-inline : auto;
	}
	li{
		display : block;
		align-content : center;
		font-weight : 500;
		color : var( --blue03 );
		text-align : center;
		background-color : white;
		border-radius : 100vmax;
	}
	@media screen and ( width <= 768px ){
		h3{
			padding-block : calc( 12 * var( --remBase ) );
			padding-inline : calc( 20 * var( --contentBase ) );
			margin-top : calc( 64 * var( --remBase ) );
			font-size : calc( 24 * var( --remBase ) );
			line-height : calc( 32 / 24 );
		}
		> p:nth-of-type( 2 ){
			grid-template-columns : calc( 122 * var( --contentBase ) ) calc( 122 * var( --contentBase ) ) auto calc( 122 * var( --contentBase ) );
			margin-top : calc( 32 * var( --remBase ) );
			> span{
				&:not( :nth-of-type( 3 ) ){
					padding-block : calc( 8 * var( --remBase ) );
					border-radius : calc( 24 * var( --remBase ) );
					> span{
						&:nth-of-type( 1 ){
							padding-block : calc( 8 * var( --remBase ) );
							padding-inline : calc( 14 * var( --remBase ) );
							font-size : calc( 14 * var( --remBase ) );
							line-height : calc( 20 / 14 );
						}
						&:nth-of-type( 2 ){
							margin-top : calc( 16 * var( --remBase ) );
							font-size : calc( 18 * var( --remBase ) );
							line-height : calc( 27 / 18 );
							&::before{
								height : calc( 76 * var( --remBase ) );
								margin-bottom : calc( 8 * var( --remBase ) );
							}
						}
					}
				}
				&:nth-of-type( 3 ){
					font-size : calc( 36 * var( --remBase ) );
				}
			}
		}
		ul{
			width : calc( 364 * var( --contentBase ) );
			margin-inline : auto;
			margin-top : calc( 60 * var( --remBase ) );
			&::after{
				bottom : 0;
				display : block;
				width : auto;
				height : calc( 282 * var( --remBase ) );
				aspect-ratio : 292/312;
				margin-inline : auto;
				margin-top : calc( 28 * var( --remBase ) );
				font-size : 0;
				content : "";
				background-image : url( "../images/ui/parts/char05.webp" );
				background-repeat : no-repeat;
				background-position : 0 0;
				background-size : contain;
			}
		}
		li{
			padding-block : calc( 12 * var( --remBase ) );
			font-size : calc( 24 * var( --remBase ) );
			line-height : calc( 36 / 24 );
			+ li{
				margin-top : calc( 24 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		h3{
			padding-block : calc( 12 * var( --remBase ) );
			padding-inline : calc( 20 * 100% / 1080 );
			margin-top : calc( 72 * var( --remBase ) );
			font-size : calc( 25 * var( --remBase ) );
			line-height : calc( 37.5 / 25 );
		}
		> p:nth-of-type( 2 ){
			grid-template-columns : calc( 316 * 100% / 1080 ) calc( 316 * 100% / 1080 ) auto calc( 316 * 100% / 1080 );
			margin-top : calc( 32 * var( --remBase ) );
			> span{
				&:not( :nth-of-type( 3 ) ){
					padding-block : calc( 16 * var( --remBase ) );
					border-radius : calc( 20 * var( --remBase ) );
					> span{
						&:nth-of-type( 1 ){
							padding-block : calc( 12 * var( --remBase ) );
							padding-inline : calc( 24 * var( --remBase ) );
							font-size : calc( 24 * var( --remBase ) );
							line-height : calc( 36 / 24 );
						}
						&:nth-of-type( 2 ){
							margin-top : calc( 24 * var( --remBase ) );
							font-size : calc( 24 * var( --remBase ) );
							line-height : calc( 36 / 24 );
							&::before{
								height : calc( 82 * var( --remBase ) );
								margin-bottom : calc( 12 * var( --remBase ) );
							}
						}
					}
				}
				&:nth-of-type( 3 ){
					font-size : calc( 32 * var( --remBase ) );
				}
			}
		}
		ul{
			width : calc( 452 * 100% / 1008 );
			margin-inline : auto;
			margin-top : calc( 64 * var( --remBase ) );
			&::before , &::after{
				position : absolute;
				bottom : 0;
				display : block;
				width : auto;
				height : calc( 250 * var( --remBase ) );
				aspect-ratio : 292/312;
				font-size : 0;
				content : "";
				background-repeat : no-repeat;
				background-position : 0 0;
				background-size : contain;
			}
			&::before{
				left : calc( -225 * 100% / 452 );
				background-image : url( "../images/ui/parts/char05.webp" );
			}
			&::after{
				right : calc( -225 * 100% / 452 );
				background-image : url( "../images/ui/parts/char03.webp" );
			}
		}
		li{
			padding-block : calc( 16 * var( --remBase ) );
			font-size : calc( 29 * var( --remBase ) );
			line-height : calc( 44 / 29 );
			+ li{
				margin-top : calc( 30 * var( --remBase ) );
			}
		}
	}
}
#installmentpayment0202{
	> p:nth-of-type( 1 ){
		position : relative;
		&::before{
			position : absolute;
			left : 50%;
			display : block;
			aspect-ratio : 2/1;
			clip-path : polygon( 0 0 , 100% 0 , 50% 100% );
			font-size : 0;
			content : "";
			background-color : var( --blue02 );
			translate : -50%;
		}
	}
	> p:nth-of-type( 2 ){
		&::after{
			display : block;
			width : auto;
			aspect-ratio : 292/312;
			margin-inline : auto;
			font-size : 0;
			content : "";
			background : url( "../images/ui/parts/char04.webp" ) left top / contain no-repeat;
		}
		strong{
			display : grid;
			grid-auto-flow : column;
			align-items : baseline;
			justify-content : center;
			font-weight : 700;
			color : var( --green );
			text-align : center;
			&::before , &::after{
				font-weight : 100;
				line-height : 1;
			}
			&::before{
				content : "\\";
			}
			&::after{
				content : "/";
			}
		}
	}
	> p:nth-of-type( 3 ){
		font-weight : 500;
	}
	@media screen and ( width <= 768px ){
		margin-top : calc( 92 * var( --remBase ) );
		> p:nth-of-type( 1 ){
			&::before{
				top : calc( 100% + 20 * var( --remBase ) );
				height : calc( 40 * var( --remBase ) );
			}
		}
		> p:nth-of-type( 2 ){
			margin-top : calc( 80 * var( --remBase ) );
			strong{
				column-gap : calc( 24 * var( --contentBase ) );
				font-size : calc( 32 * var( --remBase ) );
				line-height : calc( 48 / 32 );
				&::before , &::after{
					align-self : center;
					font-size : calc( 52 * var( --remBase ) );
				}
			}
			&::after{
				height : calc( 280 * var( --remBase ) );
				margin-top : calc( 18 * var( --remBase ) );
			}
		}
		> p:nth-of-type( 3 ){
			display : grid;
			grid-template-columns : auto 1fr;
			align-items : start;
			margin-top : calc( 20 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
	}
	@media print , screen and ( width > 768px ){
		margin-top : calc( 100 * var( --remBase ) );
		> p:nth-of-type( 1 ){
			&::before{
				top : calc( 100% + 20 * var( --remBase ) );
				height : calc( 40 * var( --remBase ) );
			}
		}
		> p:nth-of-type( 2 ){
			margin-top : calc( 80 * var( --remBase ) );
			strong{
				column-gap : calc( 24 * 100% / 1008 );
				font-size : calc( 48 * var( --remBase ) );
				line-height : calc( 72 / 48 );
				&::before , &::after{
					align-self : center;
					font-size : calc( 66 * var( --remBase ) );
				}
			}
			&::after{
				height : calc( 250 * var( --remBase ) );
				margin-top : calc( 16 * var( --remBase ) );
			}
		}
		> p:nth-of-type( 3 ){
			margin-top : calc( 20 * var( --remBase ) );
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 24 / 16 );
			text-align : center;
		}
	}
}
#installmentpayment03{
	ol{
		li{
			position : relative;
			overflow : hidden;
			&::before{
				position : absolute;
				top : 0;
				left : 0;
				z-index : 1;
				align-content : center;
				font-weight : 700;
				color : white;
				text-align : center;
				border-radius : 0 100vmax 100vmax 0;
			}
			&:nth-child( 1 ){
				&::before{
					content : "Before";
					background-color : var( --green );
				}
			}
			&:nth-child( 2 ){
				&::before{
					content : "After";
					background-color : var( --blue );
				}
			}
		}
		img{
			width : 100%;
			height : 100%;
			object-fit : cover;
		}
	}
	.box{
		background-color : #fef8e8;
	}
	figure{
		img{
			width : 100%;
			height : auto;
		}
	}
	figcaption{
		display : flex;
		flex-wrap : wrap;
		column-gap : .5em;
		align-items : center;
		justify-content : center;
		font-weight : 500;
		span:nth-of-type( 3 ){
			width : 100%;
			text-align : center;
		}
	}
	h4{
		font-weight : 700;
		color : var( --blue03 );
	}
	dl{
		> div{
			display : grid;
			align-items : start;
		}
	}
	dt{
		align-content : center;
		font-weight : 500;
		color : white;
		text-align : center;
		background-color : var( --blue03 );
	}
	dd{
		font-weight : 500;
	}
	li > p{
		font-weight : 500;
	}
	@media screen and ( width <= 768px ){
		margin-top : calc( 92 * var( --remBase ) );
		> ul{
			margin-top : calc( 92 * var( --remBase ) );
			> li + li{
				margin-top : calc( 92 * var( --remBase ) );
			}
		}
		ol{
			display : grid;
			grid-template-columns : repeat( 2 , calc( 222 * var( --contentBase ) ) );
			justify-content : space-between;
			margin-top : calc( 28 * var( --remBase ) );
			li{
				border-radius : 0 calc( 8 * var( --remBase ) ) calc( 8 * var( --remBase ) ) calc( 8 * var( --remBase ) );
				&::before{
					width : calc( 112 * 100% / 212 );
					height : calc( 42 * var( --remBase ) );
					font-size : calc( 24 * var( --remBase ) );
				}
			}
			picture{
				height : calc( 242 * var( --remBase ) );
			}
		}
		.box{
			padding-block : calc( 34 * var( --remBase ) );
			padding-inline : calc( 34 * var( --contentBase ) );
			margin-top : calc( 24 * var( --remBase ) );
			border-radius : calc( 12 * var( --remBase ) );
		}
		figure{
			img{
				display : block;
				width : calc( 225 * 100% / 388 );
				height : auto;
				margin-inline : auto;
			}
		}
		figcaption{
			margin-top : calc( 12 * var( --remBase ) );
			span{
				font-size : calc( 20 * var( --remBase ) );
				line-height : calc( 30 / 20 );
			}
		}
		h4{
			margin-top : calc( 24 * var( --remBase ) );
			font-size : calc( 20 * var( --remBase ) );
			line-height : calc( 30 / 20 );
		}
		dl{
			margin-top : calc( 12 * var( --remBase ) );
			> div{
				display : grid;
				grid-template-columns : calc( 138 * 100% / 388 ) 1fr;
				column-gap : calc( 22 * 100% / 388 );
				+ div{
					margin-top : calc( 12 * var( --remBase ) );
				}
			}
		}
		dt{
			padding-block : calc( 3.5 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
			border-radius : calc( 4 * var( --remBase ) );
		}
		dd{
			padding-top : calc( 3.5 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
		li > p{
			margin-top : calc( 36 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
	}
	@media print , screen and ( width > 768px ){
		margin-top : calc( 100 * var( --remBase ) );
		> ul{
			padding-inline : calc( 10 * 100% / 1080 );
			margin-top : calc( 100 * var( --remBase ) );
			> li{
				display : grid;
				grid-template-rows : auto calc( 32 * var( --remBase ) ) auto calc( 16 * var( --remBase ) ) auto;
				grid-template-columns : calc( 702 * 100% / 1060 ) calc( 318 * 100% / 1060 );
				justify-content : space-between;
				+ li{
					margin-top : calc( 140 * var( --remBase ) );
				}
			}
		}
		h3{
			grid-row : 1;
			grid-column : 1/-1;
		}
		ol{
			display : contents;
			> li{
				grid-column : 2;
				border-radius : 0 calc( 10 * var( --remBase ) ) calc( 10 * var( --remBase ) ) calc( 10 * var( --remBase ) );
				&::before{
					width : calc( 100 * 100% / 318 );
					height : calc( 38 * var( --remBase ) );
					font-size : calc( 22 * var( --remBase ) );
				}
				&:nth-child( 1 ){
					grid-row : 3;
				}
				&:nth-child( 2 ){
					grid-row : 5;
				}
			}
			picture{
				height : calc( 364 * var( --remBase ) );
			}
		}
		.box{
			display : grid;
			grid-template-rows : auto 1fr;
			grid-template-columns : calc( 200 * 100% / 644 ) 1fr;
			grid-row : 3;
			grid-column : 1;
			row-gap : calc( 12 * var( --remBase ) );
			column-gap : calc( 20 * 100% / 644 );
			align-self : start;
			padding-block : calc( 30 * var( --remBase ) );
			padding-inline : calc( 30 * 100% / 702 );
			border-radius : calc( 10 * var( --remBase ) );
		}
		figure{
			grid-row : 1/-1;
			grid-column : 1;
		}
		figcaption{
			margin-top : calc( 12 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
		h4{
			grid-row : 1;
			grid-column : 2;
			font-size : calc( 24 * var( --remBase ) );
			line-height : calc( 36 / 24 );
		}
		dl{
			grid-row : 2;
			grid-column : 2;
			> div{
				display : grid;
				grid-template-columns : calc( 130 * 100% / 424 ) 1fr;
				column-gap : calc( 20 * 100% / 424 );
				+ div{
					margin-top : calc( 10 * var( --remBase ) );
				}
			}
		}
		dt{
			padding-block : calc( 2 * var( --remBase ) );
			font-size : calc( 17 * var( --remBase ) );
			line-height : calc( 26 / 17 );
			border-radius : calc( 4 * var( --remBase ) );
		}
		dd{
			font-size : calc( 20 * var( --remBase ) );
			line-height : calc( 30 / 20 );
		}
	}
	li > p{
		grid-row : 5;
		grid-column : 1;
		font-size : calc( 20 * var( --remBase ) );
		line-height : calc( 30 / 20 );
	}
}
#installmentpayment05{
	background-color : var( --green );
	.box{
		background-color : white;
	}
	:where( dt,dd ){
		outline : solid 1px #ddd;
		outline-offset : -1px;
		box-shadow : 0 calc( 4 * var( --remBase ) ) calc( 12 * var( --remBase ) ) rgb( 0 0 0 / .08 );
	}
	dt , dd{
		position : relative;
		display : grid;
		grid-template-columns : 1fr;
		align-items : center;
		&::before{
			position : absolute;
			top : 50%;
			display : block;
			align-content : center;
			width : auto;
			aspect-ratio : 1;
			font-family : Jost , sans-serif;
			font-weight : 700;
			line-height : 1;
			color : white;
			text-align : center;
			border-radius : 50%;
			translate : 0 -50%;
		}
	}
	dt{
		font-weight : 700;
	}
	dt::before{
		content : "Q";
		background-color : var( --blue );
	}
	dd{
		font-weight : 500;
	}
	dd::before{
		content : "A";
		background-color : var( --orange );
	}
	li{
		display : grid;
		grid-template-columns : auto 1fr;
		column-gap : .5em;
		align-items : start;
		justify-content : start;
		&::before{
			font-weight : 900;
			content : "・";
		}
	}
	@media screen and ( width <= 768px ){
		padding-block : calc( 88 * var( --remBase ) );
		margin-top : calc( ( 64 + 32 ) * var( --remBase ) );
		.box{
			padding-block : calc( 44 * var( --remBase ) );
			padding-inline : calc( 12 * var( --contentBase ) );
			border-radius : calc( 32 * var( --remBase ) );
		}
		dl{
			margin-top : calc( 28 * var( --remBase ) );
		}
		dd , dd + dt{
			margin-top : calc( 28 * var( --remBase ) );
		}
		dt , dd{
			min-height : calc( 112 * var( --remBase ) );
			padding-block : calc( 24 * var( --remBase ) );
			padding-left : calc( 106 * 100% / 432 );
			padding-right : calc( 24 * 100% / 432 );
			border-radius : calc( 24 * var( --remBase ) );
			&::before{
				left : calc( 24 * 100% / 432 );
				height : calc( 64 * var( --remBase ) );
				font-size : calc( 22 * var( --remBase ) );
			}
		}
		dt{
			font-size : calc( 26 * var( --remBase ) );
			line-height : calc( 40 / 26 );
		}
		dd{
			font-size : calc( 22 * var( --remBase ) );
			line-height : calc( 32 / 22 );
			ul{
				margin-top : calc( 8 * var( --remBase ) );
			}
			li , .small{
				font-size : calc( 18 * var( --remBase ) );
				line-height : calc( 27 / 18 );
			}
			li{
				+ li{
					margin-top : calc( 8 * var( --remBase ) );
				}
			}
			ul + .small{
				margin-top : calc( 8 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		padding-block : calc( 140 * var( --remBase ) );
		margin-top : calc( ( 146 + 60 ) * var( --remBase ) );
		.box{
			padding-block : calc( 60 * var( --remBase ) );
			padding-inline : calc( 38 * 100% / 1080 );
			border-radius : calc( 30 * var( --remBase ) );
		}
		dl{
			margin-top : calc( 30 * var( --remBase ) );
		}
		dd , dd + dt{
			margin-top : calc( 24 * var( --remBase ) );
		}
		dt , dd{
			min-height : calc( 98 * var( --remBase ) );
			padding-block : calc( 20 * var( --remBase ) );
			padding-left : calc( 94 * 100% / 1004 );
			padding-right : calc( 20 * 100% / 1004 );
			border-radius : calc( 20 * var( --remBase ) );
			&::before{
				left : calc( 20 * 100% / 1004 );
				height : calc( 58 * var( --remBase ) );
				font-size : calc( 19 * var( --remBase ) );
			}
		}
		dt{
			font-size : calc( 24 * var( --remBase ) );
			line-height : calc( 36 / 24 );
		}
		dd{
			font-size : calc( 19 * var( --remBase ) );
			line-height : calc( 28.8 / 19 );
			ul{
				margin-top : calc( 8 * var( --remBase ) );
			}
			li , .small{
				font-size : calc( 16 * var( --remBase ) );
				line-height : calc( 24 / 16 );
			}
			li{
				+ li{
					margin-top : calc( 8 * var( --remBase ) );
				}
			}
			ul + .small{
				margin-top : calc( 8 * var( --remBase ) );
			}
		}
	}
}

/* --------------------------------------------
COMPANY
--------------------------------------------- */
#companyContents{
	> dl{
		> dt{
			display : block;
			align-content : center;
			font-weight : 700;
			color : white;
			text-align : center;
			background-color : var( --blue02 );
		}
		> dd{
			font-weight : 500;
			background-color : #f9f9f9;
			ul{
				font-size : 0;
				> li{
					display : inline;
					em{
						font-weight : 700;
					}
				}
				> li:not( :last-child )::after{
					content : "、";
				}
			}
		}
		a[target="_blank"]{
			color : #4da6ff;
		}
	}
	dl dl dd + dt{
		margin-top : calc( 12 * var( --remBase ) );
	}
	> ul{
		picture{
			background-color : #eeeeef;
			img{
				width : 100%;
				height : 100%;
				object-fit : contain;
				object-position : center;
			}
		}
		span{
			display : block;
			font-weight : 500;
			text-align : center;
		}
	}
	@media screen and ( width <= 768px ){
		>dl{
			> dt , > dd{
				padding-block : calc( 18 * var( --remBase ) );
				padding-inline : calc( 18 * var( --contentBase ) );
				font-size : calc( 18 * var( --remBase ) );
				line-height : calc( 27 / 18 );
			}
			> dd + dt{
				margin-top : calc( 12 * var( --remBase ) );
			}
			li{
				font-size : calc( 18 * var( --remBase ) );
				line-height : calc( 27 / 18 );
			}
		}
		> ul{
			display : grid;
			grid-template-columns : repeat( 2 , calc( 200 * var( --contentBase ) ) );
			row-gap : calc( 18 * var( --remBase ) );
			column-gap : calc( 18 * var( --contentBase ) );
			justify-content : space-between;
			justify-content : center;
			margin-top : calc( 32 * var( --remBase ) );
			picture{
				height : calc( 182 * var( --remBase ) );
			}
			span{
				padding-block : calc( 12 * var( --remBase ) );
				font-size : calc( 18 * var( --remBase ) );
				line-height : calc( 27 / 18 );
			}
		}
	}
	@media print , screen and ( width > 768px ){
		> dl{
			display : grid;
			grid-template-columns : calc( 292 * 100% / 1000 ) 1fr;
			row-gap : calc( 8 * var( --remBase ) );
			column-gap : calc( 8 * 100% / 1000 );
			padding-inline : calc( 140 * var( --contentBase ) );
			> dt , > dd{
				padding-block : calc( 16 * var( --remBase ) );
				font-size : calc( 16 * var( --remBase ) );
				line-height : calc( 24 / 16 );
			}
			> dt{
				padding-inline : calc( 16 * 100% / 292 );
			}
			> dd{
				padding-inline : calc( 16 * 100% / 700 );
			}
			li{
				font-size : calc( 16 * var( --remBase ) );
				line-height : calc( 24 / 16 );
			}
		}
		> ul{
			display : flex;
			flex-wrap : wrap;
			row-gap : calc( 16 * var( --remBase ) );
			column-gap : calc( 16 * 100% / 1080 );
			justify-content : center;
			padding-inline : calc( 100 * var( --contentBase ) );
			margin-top : calc( 32 * var( --remBase ) );
			> li{
				width : calc( 230 * 100% / 1080 );
			}
			picture{
				height : calc( 162 * var( --remBase ) );
			}
			span{
				padding-top : calc( 8 * var( --remBase ) );
				padding-bottom : calc( 10 * var( --remBase ) );
				font-size : calc( 16 * var( --remBase ) );
				line-height : calc( 24 / 16 );
			}
		}
	}
}

/* --------------------------------------------
CONTACT
--------------------------------------------- */
#contacts{
	@media print , screen and ( width > 768px ){
		> h2{
			margin-top : calc( 100 * var( --remBase ) );
		}
	}
}
#contact{
	@media screen and ( width <= 768px ){
		padding-inline : calc( 12 * var( --viewportBase ) );
	}
	@media print , screen and ( width > 768px ){
		width : calc( 1080 * var( --viewportBase ) );
		padding-inline : calc( 165 * var( --viewportBase ) );
		padding-top : calc( 30 * var( --remBase ) );
		padding-bottom : calc( 76 * var( --remBase ) );
		margin-inline : auto;
		border-radius : calc( 30 * var( --remBase ) );
	}
}

/* --------------------------------------------
THANKS
--------------------------------------------- */
#thanksContent{
	padding-bottom : calc( 120 * var( --remBase ) );
	>h3{
		font-weight : 700;
		background-color : #f2f2f2;
	}
	> p{
		font-weight : 500;
	}
	@media screen and ( width <= 768px ){
		margin-top : calc( 60 * var( --remBase ) );
		> h3{
			padding-block : calc( 12 * var( --remBase ) );
			padding-inline : calc( 18 * var( --contentBase ) );
			margin-top : calc( 64 * var( --remBase ) );
			font-size : calc( 24 * var( --remBase ) );
			line-height : calc( 36 / 24 );
		}
		> p{
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
		> h3 + p{
			margin-top : calc( 28 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		width : calc( 1080 * var( --viewportBase ) );
		margin-inline : auto;
		margin-top : calc( 72 * var( --remBase ) );
		> h3{
			padding-block : calc( 12 * var( --remBase ) );
			padding-inline : calc( 20 * 100% / 1080 );
			margin-top : calc( 70 * var( --remBase ) );
			font-size : calc( 25 * var( --remBase ) );
			line-height : calc( 37.5 / 25 );
		}
		> p{
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 24 / 16 );
		}
		> h3 + p{
			margin-top : calc( 30 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
PRIVACY POLICY
--------------------------------------------- */
#policy{
	:where( p , li ){
		font-weight : 500;
	}
	ul{
		list-style : disc;
		list-style-position : inside;
	}
	@media screen and ( width <= 768px ){
		margin-top : calc( 92 * var( --remBase ) );
		>h2{
			&:nth-of-type( n+2 ){
				margin-top : calc( 100 * var( --remBase ) );
			}
		}
		:where( p , li ){
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
		h2 + :where( p , ul , ol ){
			margin-top : calc( 28 * var( --remBase ) );
		}
		li + li , :where( ul , ol ) :where( ul , ol ) , p + p{
			margin-top : calc( 10 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		margin-top : calc( 100 * var( --remBase ) );
		>h2{
			&:nth-of-type( n+2 ){
				margin-top : calc( 100 * var( --remBase ) );
			}
		}
		:where( p , li ){
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 24 / 16 );
		}
		h2 + :where( p , ul , ol ){
			margin-top : calc( 30 * var( --remBase ) );
		}
		li + li , :where( ul , ol ) :where( ul , ol ) , p + p{
			margin-top : calc( 8 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
LAW
--------------------------------------------- */
#datalist-law{
	dt{
		display : block;
		align-content : center;
		font-weight : 700;
		color : white;
		text-align : center;
		background-color : var( --blue02 );
	}
	dd{
		font-weight : 500;
		background-color : #f9f9f9;
	}
	a{
		color : #4da6ff;
	}
	@media screen and ( width <= 768px ){
		margin-top : calc( 32 * var( --remBase ) );
		> div{
			display : grid;
			grid-template-columns : calc( 128 * var( --contentBase ) ) 1fr;
			column-gap : calc( 8 * var( --contentBase ) );
			+ div{
				margin-top : calc( 8 * var( --remBase ) );
			}
		}
		dt , dd{
			padding-block : calc( 18 * var( --remBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 27 / 18 );
		}
		dt{
			padding-inline : calc( 18 * 100% / 128 );
		}
		dd{
			padding-inline : calc( 18 * 100% / 320 );
		}
	}
	@media print , screen and ( width > 768px ){
		width : calc( 1000 * var( --viewportBase ) );
		margin-inline : auto;
		margin-top : calc( 60 * var( --remBase ) );
		> div{
			display : grid;
			grid-template-columns : calc( 292 * 100% / 1000 ) 1fr;
			column-gap : calc( 8 * 100% / 1000 );
			+ div{
				margin-top : calc( 8 * var( --remBase ) );
			}
		}
		dt , dd{
			padding-block : calc( 16 * var( --remBase ) );
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 24 / 16 );
		}
		dt{
			padding-inline : calc( 16 * 100% / 292 );
		}
		dd{
			padding-inline : calc( 16 * 100% / 700 );
		}
	}
}

/* --------------------------------------------
SITE MAP
--------------------------------------------- */
#list-sitemap{
	> li{
		border-inline : dotted 1px #e5e5e5;
		border-top : solid calc( 3 * var( --remBase ) ) #e5e5e5;
		border-bottom : dotted 1px #e5e5e5;
	}
	a{
		display : block;
		font-weight : 500;
		color : #4da6ff;
		text-decoration : underline;
		text-decoration-color : transparent;
	}
	@media screen and ( width <= 768px ){
		a{
			padding-inline : calc( 12 * var( --contentBase ) );
			font-size : calc( 18 * var( --remBase ) );
			line-height : calc( 36 / 18 );
		}
	}
	@media print , screen and ( width > 768px ){
		width : calc( 700 * var( --viewportBase ) );
		margin-inline : auto;
		a{
			padding-inline : calc( 10 * 100% / 700 );
			font-size : calc( 16 * var( --remBase ) );
			line-height : calc( 32 / 16 );
		}
	}
}
@media ( hover : hover ){
	#list-sitemap a:hover{
		text-decoration-color : currentColor;
		opacity : .8;
	}
}
@media ( prefers-reduced-motion : no-preference ){
	#list-sitemap a{
		transition : text-decoration .3s linear , opacity .3s linear;
	}
}

/* --------------------------------------------
CONTACTS
--------------------------------------------- */
.contentContacts{
	@media screen and ( width <= 768px ){
		margin-top : calc( 32 * var( --remBase ) );
	}
	@media print , screen and ( width > 768px ){
		margin-top : calc( 52 * var( --remBase ) );
	}
}