@charset "UTF-8";

/* --------------------------------------------
SETTINGS
--------------------------------------------- */
@media screen and ( width <= 781px ){
	:root{
		--headerHeight : calc( 42 * var( --remBase ) );
	}
}
@media print , screen and ( width > 781px ){
	:root{
		--headerHeight : calc( 78 * var( --remBase ) );
	}
}
html{
	scroll-padding-top : var( --headerHeight );
}
body{
	padding-top : var( --headerHeight );
	font-size : calc( 16 * var( --remBase ) );
	&:has( .block-stickyBottom ){
		padding-bottom : var( --stickyBottomHeight );
	}
	@media screen and ( width <= 781px ){
		&:has( .contacts01 ){
			padding-bottom : calc( 89.58 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
WRAPPER , CONTAINER , GRID CONTAINER
--------------------------------------------- */
@media screen and ( width <= 781px ){
	:root{
		--wrapPaddingInline : calc( var( --gutter ) * var( --viewportBase ) );
	}
}
@media print , screen and ( width > 781px ){
	:root{
		--wrapPaddingInline : max( calc( ( 100% - ( var( --contentWidth ) * 1px ) ) / 2 ) , calc( var( --gutter ) * var( --viewportBase ) ) );
		--wrapPaddingInline02 : max( calc( ( 100% - 800px ) / 2 ) , calc( 160 * var( --viewportBase ) ) );
	}
}
:root{
	--containerWidth : calc( var( --contentWidth ) * var( --viewportBase ) );
	--gridContainerGutter : calc( var( --gutter ) * var( --viewportBase ) );
	--gridContainerGridTemplateColumns : var( --gridContainerGutter ) var( --containerWidth ) var( --gridContainerGutter );
	--gridContainerColumnCenter : 2;
	--gridContainerLeftStartEnd : 3;
	--gridContainerRightEndStart : 2;
}
.wrap{
	padding-inline : var( --wrapPaddingInline );
}
.wrap-sp{
	@media screen and ( width <= 781px ){
		padding-inline : var( --wrapPaddingInline );
	}
}
.wrap-pc{
	@media print , screen and ( width > 781px ){
		padding-inline : var( --wrapPaddingInline );
	}
}
.wrap02{
	@media screen and ( width <= 781px ){
		padding-inline : var( --wrapPaddingInline );
	}
	@media print , screen and ( width > 781px ){
		padding-inline : var( --wrapPaddingInline02 );
	}
}
.container{
	width : var( --containerWidth );
	margin-inline : auto;
}
.container-sp{
	@media screen and ( width <= 781px ){
		width : var( --containerWidth );
		margin-inline : auto;
	}
}
.container-pc{
	@media print , screen and ( width > 781px ){
		width : var( --containerWidth );
		margin-inline : auto;
	}
}
.gridContainer{
	display : grid;
	grid-template-columns : var( --gridContainerGridTemplateColumns );
	grid-auto-flow : column;
	row-gap : 0;
	>*:not( .fluid , .left-start , .right-end ){
		grid-column : var( --gridContainerColumnCenter );
	}
	.fluid{
		grid-column : 1/-1;
	}
	.left-start{
		grid-column : 1 / 3;
	}
	.right-end{
		grid-column : 2 / 4;
	}
}

/* --------------------------------------------
STATE
--------------------------------------------- */
.is-sp{
	@media print , screen and ( width > 781px ){
		display : none;
	}
}
.is-pc{
	@media screen and ( width <= 781px ){
		display : none;
	}
}
.is-tb{
	@media screen and ( width <= 781px ){
		display : none;
	}
	@media print , screen and ( width >= 1160px ){
		display : none;
	}
}

/* --------------------------------------------
ACCESSIBILITY
--------------------------------------------- */
.visually-hidden{
	position : absolute;
	width : 1px;
	height : 1px;
	overflow : hidden;
	clip : rect( 0 0 0 0 );
	clip-path : inset( 50% );
	white-space : nowrap;
}
.visually-hidden-text{
	overflow : hidden;
	color : transparent;
}
[hidden]{
	display : none;
}

/* --------------------------------------------
IMAGE RENDERING
--------------------------------------------- */
.full{
	width : 100%;
	height : auto;
}
.full-sp{
	@media screen and ( width <= 781px ){
		width : 100%;
		height : auto;
	}
}
.full-pc{
	@media print , screen and ( width > 781px ){
		width : 100%;
		height : auto;
	}
}

/* --------------------------------------------
RESET WordPress Blocks
--------------------------------------------- */
.wp-block-group__inner-container{
	display : contents;
}

/* --------------------------------------------
HEADER
--------------------------------------------- */
.globalHeader{
	position : fixed;
	top : 0;
	left : 0;
	z-index : 11;
	width : 100%;
	.logo{
		display : block;
		width : fit-content;
	}
	@media screen and ( width <= 781px ){
		height : var( --headerHeight );
		padding-left : calc( 8 * var( --viewportBase ) );
		background-color : white;
		.logo{
			margin-top : calc( 3 * var( --remBase ) );
			img{
				height : calc( 31 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 781px ){
		display : grid;
		grid-template-columns : calc( 21 * 100% / 1440 ) 1fr calc( 491 * 100% / 1440 ) calc( 25 * 100% / 1440 );
		align-items : start;
		padding-inline : calc( ( 100% - 1440px ) / 2 );
		&::before{
			position : absolute;
			top : 0;
			left : 0;
			z-index : -1;
			display : block;
			width : 100%;
			height : var( --headerHeight );
			content : "";
			background-color : white;
			border-bottom : solid calc( 2 * var( --remBase ) ) var( --green );
			box-shadow : 0 calc( 4 * var( --remBase ) ) calc( 4 * var( --remBase ) ) color-mix( in sRGB , black 25% , transparent );
		}
		.logo{
			grid-column : 2;
			filter : drop-shadow( 0 calc( 4 * var( --remBase ) ) calc( 4 * var( --remBase ) ) color-mix( in sRGB , black 25% , transparent ) );
			img{
				height : calc( 132 * var( --remBase ) );
			}
		}
	}
}
body.home{
	.globalHeader{
		@media screen and ( width <= 781px ){
			background-color : white;
		}
	}
}


/* --------------------------------------------
MENU BUTTON
--------------------------------------------- */
.menuBtn{
	@media screen and ( width <= 781px ){
		position : fixed;
		top : 0;
		right : calc( 11 * var( --viewportBase ) );
		z-index : 12;
		display : grid;
		grid-auto-flow : row;
		align-content : start;
		align-items : start;
		width : calc( 45 * var( --viewportBase ) );
		height : calc( 45 * var( --remBase ) );
		padding-top : calc( 9 * var( --remBase ) );
		overflow : hidden;
		background-color : var( --green );
		border-radius : 0 0 calc( 10 * var( --remBase ) ) calc( 10 * var( --remBase ) );
		&[aria-expanded="true"]{
			overflow : hidden;
		}
		> span:nth-of-type( 1 ){
			position : relative;
			display : block;
			font-size : 0;
			> span{
				position : absolute;
				left : 0;
				display : block;
				width : 100%;
				transition : all .4s;
				&:nth-of-type( 1 ){
					top : 0;
				}
				&:nth-of-type( 4 ){
					bottom : 0;
				}
			}
		}
		&[aria-expanded="true"]{
			> span:nth-of-type( 1 ){
				span:nth-of-type( 1 ){
					scale : 0;
					translate : calc( $( top ) var( --remBase ) ) 0;
				}
				span:nth-of-type( 2 ){
					rotate : -45deg;
				}
				span:nth-of-type( 3 ){
					rotate : 45deg;
				}
				span:nth-of-type( 4 ){
					scale : 0;
					translate : calc( -$( top ) var( --remBase ) ) 0;
				}
			}
		}
		> span{
			&:nth-of-type( 1 ){
				width : calc( 21 * 100% / 45 );
				height : calc( 17 * var( --remBase ) );
				margin-inline : auto;
				> span{
					height : calc( 1 * var( --remBase ) );
					background-color : white;
					&:nth-of-type( 2 ) , &:nth-of-type( 3 ){
						top : calc( 8 * var( --remBase ) );
					}
				}
			}
			&:nth-of-type( 2 ){
				display : block;
				margin-top : calc( 7.29 * var( --remBase ) );
				text-align : center;
				img{
					height : calc( 6.03 * var( --remBase ) );
				}
			}
		}
	}
}

/* --------------------------------------------
GLOBAL NAVIGATION
--------------------------------------------- */
.globalNav{
	@media screen and ( width <= 781px ){
		position : fixed;
		top : 0;
		z-index : 11;
		width : 100%;
		height : calc( 100% - var( --headerHeight ) );
		background-color : white;
		body:has( &:not( [inert] ) ){
			overflow : hidden;
		}
		&:not( [inert] ){
			pointer-events : auto;
			visibility : visible;
			opacity : 1;
		}
		&[inert]{
			pointer-events : none;
			visibility : hidden;
			opacity : 0;
		}
		.scroll{
			height : 100%;
			overflow-y : auto;
		}
	}
	@media print , screen and ( width > 781px ){
		grid-column : 3;
		padding-top : calc( 8 * var( --remBase ) );
		.scroll{
			display : contents;
		}
	}
}
@media ( prefers-reduced-motion : no-preference ){
	.globalNav{
		@media screen and ( width <= 781px ){
			transition : opacity .4s linear , visibility 0s linear .4s allow-discrete;
			&:not( [inert] ){
				transition : opacity .4s linear , visibility 0s linear 0s;
			}
		}
	}
}
.globalNavContacts{
	a{
		display : grid;
		align-content : center;
		color : white;
	}
	.tel{
		background-color : var( --orange );
		> span{
			display : grid;
			grid-auto-flow : column;
			align-items : center;
			justify-content : center;
			&:nth-of-type( 1 ){
				font-weight : 700;
				&::before{
					display : block;
					width : auto;
					aspect-ratio : 1;
					content : "";
					background : url( "../images/ui/icon/tel.svg" ) left top / contain no-repeat;
					filter : var( --filterWhite );
				}
			}
			&:nth-of-type( 2 ){
				align-items : baseline;
				font-weight : 500;
			}
		}
	}
	.line{
		grid-auto-flow : column;
		justify-content : center;
		font-weight : 700;
		background-color : var( --lineGreen );
		&::before{
			display : block;
			width : auto;
			aspect-ratio : 1;
			content : "";
			background : url( "../images/ui/sns/line.svg" ) left top / contain no-repeat;
			filter : var( --filterWhite );
		}
	}
	@media screen and ( width <= 781px ){
		> li + li{
			margin-top : calc( 36 * var( --remBase ) );
		}
		a{
			width : calc( 329 * var( --viewportBase ) );
			height : calc( 71 * var( --remBase ) );
			margin-inline : auto;
			border-radius : 100vmax;
		}
		.tel{
			> span{
				&:nth-of-type( 1 ){
					column-gap : calc( 10 * 100% / 236 );
					font-size : calc( 26 * var( --remBase ) );
					&::before{
						height : calc( 22 * var( --remBase ) );
					}
				}
				&:nth-of-type( 2 ){
					font-size : calc( 14 * var( --remBase ) );
					span{
						font-size : calc( 10 * var( --remBase ) );
					}
				}
			}
		}
		.line{
			column-gap : calc( 10 * 100% / 236 );
			font-size : calc( 20 * var( --remBase ) );
			&::before{
				height : calc( 22 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 781px ){
		display : grid;
		grid-template-rows : calc( 56 * var( --remBase ) );
		grid-template-columns : repeat( 2 , calc( 236 * 100% / 491 ) );
		align-items : center;
		justify-content : space-between;
		li{
			width : 100%;
			height : 100%;
		}
		a{
			width : 100%;
			height : 100%;
			border-radius : calc( 20 * var( --remBase ) );
			outline : solid calc( 3 * var( --remBase ) ) white;
			outline-offset : calc( -3 * var( --remBase ) );
			box-shadow : calc( 2 * var( --remBase ) ) calc( 2 * var( --remBase ) ) 0 color-mix( in sRGB , black 19% , transparent );
		}
		.tel{
			> span{
				&:nth-of-type( 1 ){
					column-gap : calc( 10 * 100% / 236 );
					font-size : calc( 26 * var( --remBase ) );
					&::before{
						height : calc( 22 * var( --remBase ) );
					}
				}
				&:nth-of-type( 2 ){
					font-size : calc( 14 * var( --remBase ) );
					span{
						font-size : calc( 10 * var( --remBase ) );
					}
				}
			}
		}
		.line{
			column-gap : calc( 10 * 100% / 236 );
			font-size : calc( 20 * var( --remBase ) );
			&::before{
				height : calc( 22 * var( --remBase ) );
			}
		}
	}
}
.sectionContacts01{
	@media screen and ( width <= 781px ){
		position : fixed;
		bottom : 0;
		left : 0;
		z-index : 5;
		width : 100%;
		padding-top : calc( 5.43 * var( --remBase ) );
		background-color : white;
		p{
			display : grid;
			grid-auto-flow : column;
			column-gap : calc( 7.22 * var( --viewportBase ) );
			align-items : center;
			justify-content : center;
			img{
				height : calc( 20.17 * var( --remBase ) );
			}
			span{
				font-size : calc( 16 * var( --remBase ) );
				font-weight : 500;
			}
		}
		ul{
			display : grid;
			grid-template-rows : calc( 5 * var( --remBase ) ) calc( 50 * var( --remBase ) );
			grid-template-columns : calc( 60 * var( --viewportBase ) ) calc( 255 * var( --viewportBase ) ) calc( 60 * var( --viewportBase ) );
			padding-top : calc( 3 * var( --remBase ) );
			margin-top : calc( 6 * var( --remBase ) );
		}
		.contacts{
			grid-row : 2;
			grid-column : 1;
			a{
				display : block;
				display : grid;
				grid-template-columns : 1fr;
				grid-auto-flow : row;
				align-content : end;
				justify-items : center;
				width : 100%;
				height : 100%;
				padding-top : calc( 8 * var( --remBase ) );
				text-align : center;
				background-color : #00b6c3;
				border-radius : calc( 10 * var( --remBase ) ) 0 0 0;
				img{
					height : calc( 27.32 * var( --remBase ) );
					filter : var( --filterWhite );
				}
				span{
					display : block;
					align-content : center;
					height : calc( 13 * var( --remBase ) );
					font-size : calc( 8 * var( --remBase ) );
					color : white;
					text-align : center;
					text-box : trim-both cap alphabetic;
				}
			}
		}
		.tels{
			grid-row : 1/3;
			grid-column : 2;
			a{
				position : relative;
				display : block;
				.is-sp{
					display : grid;
					grid-template-rows : calc( 5 * var( --remBase ) ) calc( 13 * var( --remBase ) ) calc( 37 * var( --remBase ) );
					grid-template-columns : calc( 7 * 100% / 255 ) calc( 188 * 100% / 255 ) calc( 60 * 100% / 255 );
					> span{
						&:nth-of-type( 1 ){
							z-index : 1;
							display : block;
							grid-row : 1/3;
							grid-column : 2;
							align-content : center;
							font-size : calc( 9 * var( --remBase ) );
							color : black;
							text-align : center;
							background-color : white;
							border-radius : 100vmax;
							outline : solid 1px #b2c2b2;
							outline-offset : -1px;
							text-box : trim-both cap alphabetic;
						}
						&:nth-of-type( 2 ){
							display : grid;
							grid-row : 2/4;
							grid-column : 1/-1;
							grid-auto-flow : column;
							align-content : start;
							align-items : baseline;
							justify-content : center;
							padding-top : calc( 20 * var( --remBase ) );
							padding-right : calc( 54 * 100% / 255 );
							background-color : var( --orange );
							> span{
								&:nth-of-type( 1 ){
									font-size : calc( 16 * var( --remBase ) );
									font-weight : 500;
									color : white;
								}
								&:nth-of-type( 2 ){
									font-size : calc( 18 * var( --remBase ) );
									font-weight : 500;
									color : white;
								}
								&:nth-of-type( 3 ){
									font-size : calc( 14 * var( --remBase ) );
									font-weight : 500;
									color : white;
								}
							}
							em{
								font-size : calc( 18 * var( --remBase ) );
								font-weight : 700;
								color : #faff6b;
							}
						}
					}
					picture{
						position : absolute;
						bottom : 0;
						right : calc( 3 * 100% / 255 );
						img{
							height : calc( 58 * var( --remBase ) );
						}
					}
				}
			}
		}
		.lines{
			grid-row : 2;
			grid-column : 3;
			a{
				display : block;
				display : grid;
				grid-template-columns : 1fr;
				grid-auto-flow : row;
				align-content : end;
				align-items : end;
				justify-items : center;
				width : 100%;
				height : 100%;
				text-align : center;
				background-color : var( --lineGreen );
				border-radius : 0 calc( 10 * var( --remBase ) ) 0 0;
				> img{
					height : calc( 30 * var( --remBase ) );
					filter : var( --filterWhite );
				}
				.is-sp{
					display : block;
					align-content : center;
					height : calc( 13 * var( --remBase ) );
					font-size : calc( 8 * var( --remBase ) );
					color : white;
					text-align : center;
					text-box : trim-both cap alphabetic;
				}
			}
		}
	}
	@media print , screen and ( width > 781px ){
		height : calc( 121 * var( --remBase ) );
		padding-top : calc( 20 * var( --remBase ) );
		background-color : var( --cream );
		ul{
			display : grid;
			grid-template-columns : repeat( 2 , calc( 410 * var( --contentBase ) ) );
			column-gap : calc( 30 * var( --contentBase ) );
			justify-content : center;
		}
		.tels{
			a{
				display : block;
				filter : drop-shadow( 0 calc( 4 * var( --remBase ) ) calc( 4 * var( --remBase ) ) color-mix( in sRGB , black 25% , transparent ) );
				.is-pc{
					display : grid;
					grid-template-rows : calc( 16 * var( --remBase ) ) calc( 8 * var( --remBase ) ) calc( 62 * var( --remBase ) );
					grid-template-columns : calc( 92 * 100% / 410 ) calc( 230 * 100% / 410 ) calc( 88 * 100% / 410 );
					> span{
						border-radius : 100vmax;
						&:nth-of-type( 1 ){
							z-index : 1;
							display : block;
							grid-row : 1/3;
							grid-column : 2;
							align-content : center;
							font-size : calc( 18 * var( --remBase ) );
							font-weight : 700;
							color : white;
							color : var( --orange );
							text-align : center;
							background-color : white;
							outline : solid 1px var( --orange );
							outline-offset : -1px;
						}
						&:nth-of-type( 2 ){
							position : relative;
							display : grid;
							grid-row : 2/4;
							grid-column : 1/-1;
							grid-auto-flow : column;
							column-gap : calc( 12 * 100% / 383 );
							align-items : center;
							justify-content : start;
							padding-left : calc( 27 * 100% / 410 );
							background-color : var( --orange );
							outline : solid calc( 2 * var( --remBase ) )  var( --orange );
							outline-offset : calc( -2 * var( --remBase ) );
							> span{
								&:nth-of-type( 1 ){
									align-content : center;
									width : auto;
									height : calc( 54 * var( --remBase ) );
									aspect-ratio : 1;
									font-size : calc( 20 * var( --remBase ) );
									font-weight : 700;
									line-height : 1.1;
									color : var( --orange );
									text-align : center;
									background-color : white;
									border-radius : 50%;
								}
								&:nth-of-type( 2 ){
									font-size : calc( 26 * var( --remBase ) );
									font-weight : 700;
									color : white;
								}
							}
							img{
								position : absolute;
								top : 50%;
								right : calc( 27.95 * 100% / 410 );
								height : calc( 14.58 * var( --remBase ) );
								filter : var( --filterWhite );
								translate : 0 -50%;
							}
						}
					}
				}
			}
		}
		.lines{
			a{
				position : relative;
				display : block;
				filter : drop-shadow( 0 calc( 4 * var( --remBase ) ) calc( 4 * var( --remBase ) ) color-mix( in sRGB , black 25% , transparent ) );
				> img{
					position : absolute;
					top : calc( 24 * var( --remBase ) );
					left : calc( 29 * 100% / 410 );
					z-index : 1;
					height : calc( 50 * var( --remBase ) );
					filter : var( --filterWhite );
				}
				.is-pc{
					display : grid;
					grid-template-rows : calc( 16 * var( --remBase ) ) calc( 8 * var( --remBase ) ) calc( 62 * var( --remBase ) );
					grid-template-columns : calc( 92 * 100% / 410 ) calc( 230 * 100% / 410 ) calc( 88 * 100% / 410 );
					> span{
						border-radius : 100vmax;
						&:nth-of-type( 1 ){
							z-index : 1;
							display : block;
							grid-row : 1/3;
							grid-column : 2;
							align-content : center;
							font-size : calc( 18 * var( --remBase ) );
							font-weight : 700;
							color : white;
							color : var( --lineGreen );
							text-align : center;
							background-color : white;
							outline : solid 1px var( --lineGreen );
							outline-offset : -1px;
						}
						&:nth-of-type( 2 ){
							position : relative;
							display : grid;
							grid-row : 2/4;
							grid-column : 1/-1;
							grid-auto-flow : column;
							column-gap : calc( 26 * 100% / 305 );
							align-items : center;
							justify-content : start;
							padding-left : calc( 105 * 100% / 410 );
							background-color : var( --lineGreen );
							outline : solid calc( 2 * var( --remBase ) )  var( --lineGreen );
							outline-offset : calc( -2 * var( --remBase ) );
							> span{
								&:nth-of-type( 1 ){
									font-size : calc( 26 * var( --remBase ) );
									font-weight : 700;
									color : white;
								}
							}
							img{
								position : absolute;
								top : 50%;
								right : calc( 27.95 * 100% / 410 );
								height : calc( 14.58 * var( --remBase ) );
								filter : var( --filterWhite );
								translate : 0 -50%;
							}
						}
					}
				}
			}
		}
	}
}

/* --------------------------------------------
BREADCRUMBS
--------------------------------------------- */
.breadcrumbs{
	@media print , screen and ( width > 781px ){
		padding-block : calc( 8.5 * var( --remBase ) );
		ol{
			display : flex;
			flex-wrap : wrap;
			align-items : center;
		}
		li:first-child{
			a{
				display : grid;
				grid-auto-flow : column;
				column-gap : calc( 3 * var( --remBase ) );
				align-items : center;
				justify-content : start;
			}
		}
		li + li::before{
			font-size : calc( 16 * var( --remBase ) );
			font-weight : 700;
			color : var( --green );
			white-space : pre;
			content : "　>   ";
		}
		li , a{
			font-size : calc( 16 * var( --remBase ) );
			font-weight : 700;
			line-height : calc( 23 / 16 );
			color : var( --green );
		}
		img{
			height : calc( 17 * var( --remBase ) );
			filter : var( --filterGreen );
		}
		a{
			text-decoration : underline;
		}
	}
}

/* --------------------------------------------
PROBLEMS
--------------------------------------------- */
.sectionProblems{
	position : relative;
	overflow-x : clip;
	filter : drop-shadow( 0 calc( 4 * var( --remBase ) ) calc( 4 * var( --remBase ) ) color-mix( in sRGB , black 25% , transparent ) );
	&::after{
		position : absolute;
		top : calc( 100% - .5px );
		left : 50%;
		display : block;
		clip-path : polygon( 0 0 , 100% 0 , 50% 100% );
		content : "";
		background-color : var( --bg );
		translate : -50% 0;
	}
	@media screen and ( width <= 781px ){
		padding-top : calc( 37 * var( --remBase ) );
		padding-bottom : calc( 19.82 * var( --remBase ) );
		&::after{
			width : calc( 506 * var( --viewportBase ) );
			height : calc( 50.77 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 781px ){
		padding-top : calc( 38 * var( --remBase ) );
		padding-bottom : calc( 42 * var( --remBase ) );
		&::after{
			width : calc( 562 * var( --viewportBase ) );
			height : calc( 52 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
MERITS
--------------------------------------------- */
.merits{
	display : grid;
	grid-template-columns : repeat( 3 , auto );
	grid-auto-flow : column;
	li{
		position : relative;
		z-index : 0;
		width : auto;
		aspect-ratio : 1;
		&::before{
			position : absolute;
			top : 0;
			z-index : -2;
			display : block;
			width : 100%;
			height : 100%;
			content : "";
			border-radius : 50%;
			outline : solid calc( 2 * var( --remBase ) ) var( --lime );
			outline-offset : calc( -2 * var( --remBase ) );
			box-shadow : calc( 2 * var( --remBase ) ) calc( 4 * var( --remBase ) ) calc( 2 * var( --remBase ) ) color-mix( in srgb , #b2c2b2 100% , transparent );
		}
		picture{
			position : absolute;
			left : 50%;
			translate : -50% 0;
			z-index : -1;
		}
	}
	.merit01{
		> span{
			display : block;
			font-weight : 700;
			text-align : center;
			&:nth-of-type( 1 ){
				font-weight : 900;
				color : var( --orange );
				span{
					font-weight : 700;
				}
			}
		}
	}
	.merit02{
		> span{
			font-weight : 700;
			&:nth-of-type( 1 ){
				display : block;
				text-align : center;
			}
			&:nth-of-type( 2 ){
				display : grid;
				grid-auto-flow : column;
				align-items : center;
				justify-content : center;
				color : var( --orange );
				img{
					filter : var( --filterOrange );
				}
				>span{
					display : grid;
					grid-auto-flow : column;
					align-items : baseline;
					justify-content : start;
				}
			}
		}
	}
	.merit03{
		> span{
			display : block;
			font-weight : 700;
			text-align : center;
			&:nth-of-type( 1 ){
				color : var( --orange );
			}
		}
	}
	.merit04{
		> span{
			display : block;
			font-weight : 700;
			text-align : center;
			&:nth-of-type( 2 ){
				color : var( --orange );
			}
		}
	}
	.merit05{
		> span{
			display : block;
			font-weight : 700;
			text-align : center;
			&:nth-of-type( 2 ){
				color : var( --orange );
			}
		}
	}
	@media screen and ( width <= 781px ){
		li{
			height : calc( 105 * var( --remBase ) );
			picture{
				&:nth-of-type( 2 ){
					bottom : calc( 3 * var( --remBase ) );
					img{
						height : calc( 12 * var( --remBase ) );
					}
				}
			}
		}
		.merit01{
			padding-top : calc( 22 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -5 * var( --remBase ) );
					img{
						height : calc( 20 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 26 * var( --remBase ) );
					span{
						font-size : calc( 16 * var( --remBase ) );
					}
				}
				&:nth-of-type( 2 ){
					margin-top : calc( -1 * var( --remBase ) );
					font-size : calc( 13 * var( --remBase ) );
					line-height : calc( 20 / 13 );
				}
				&:nth-of-type( 3 ){
					font-size : calc( 16 * var( --remBase ) );
					line-height : calc( 20 / 16 );
				}
			}
		}
		.merit02{
			padding-top : calc( 22 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -6 * var( --remBase ) );
					img{
						height : calc( 17 * var( --remBase ) );
					}
				}
			}
			span{
				&:nth-of-type( 1 ){
					font-size : calc( 13 * var( --remBase ) );
				}
				&:nth-of-type( 2 ){
					column-gap : calc( 1.79 * 100% / 105 );
					img{
						height : calc( 22.38 * var( --remBase ) );
					}
					> span{
						margin-top : calc( 1 * var( --remBase ) );
						> span{
							&:nth-of-type( 1 ){
								font-size : calc( 52 * var( --remBase ) );
								letter-spacing : -.05em;
							}
							&:nth-of-type( 2 ){
								font-size : calc( 30 * var( --remBase ) );
								letter-spacing : -.05em;
							}
							&:nth-of-type( 3 ){
								font-size : calc( 46 * var( --remBase ) );
								letter-spacing : -.05em;
							}
						}
					}
				}
			}
		}
		.merit03{
			padding-top : calc( 15 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -2 * var( --remBase ) );
					img{
						height : calc( 19 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 26 * var( --remBase ) );
					line-height : calc( 29 / 26 );
					text-indent : -.05em;
					letter-spacing : -.05em;
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 2 * var( --remBase ) );
					font-size : calc( 13 * var( --remBase ) );
				}
			}
		}
		.merit04{
			padding-top : calc( 21 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -5 * var( --remBase ) );
					img{
						height : calc( 19 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 14 * var( --remBase ) );
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 11 * var( --remBase ) );
					font-size : calc( 28 * var( --remBase ) );
				}
			}
		}
		.merit05{
			padding-top : calc( 26 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -8 * var( --remBase ) );
					img{
						height : calc( 25 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 13 * var( --remBase ) );
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 8 * var( --remBase ) );
					font-size : calc( 28 * var( --remBase ) );
				}
			}
		}
	}
	@media print , screen and ( width > 781px ){
		li{
			height : calc( 145 * var( --remBase ) );
			picture{
				&:nth-of-type( 2 ){
					bottom : calc( 3.87 * var( --remBase ) );
					img{
						height : calc( 17.14 * var( --remBase ) );
					}
				}
			}
		}
		.merit01{
			padding-top : calc( 28.57 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -7.03 * var( --remBase ) );
					img{
						height : calc( 29 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 40 * var( --remBase ) );
					span{
						font-size : calc( 20 * var( --remBase ) );
					}
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 5 * var( --remBase ) );
					font-size : calc( 16 * var( --remBase ) );
				}
				&:nth-of-type( 3 ){
					margin-top : calc( 7 * var( --remBase ) );
					font-size : calc( 20 * var( --remBase ) );
				}
			}
		}
		.merit02{
			padding-top : calc( 30.57 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -8.43 * var( --remBase ) );
					img{
						height : calc( 24 * var( --remBase ) );
					}
				}
			}
			span{
				&:nth-of-type( 1 ){
					font-size : calc( 16 * var( --remBase ) );
				}
				&:nth-of-type( 2 ){
					column-gap : calc( 3 * 100% / 145.15 );
					img{
						height : calc( 27.81 * var( --remBase ) );
					}
					> span{
						> span{
							&:nth-of-type( 1 ){
								font-size : calc( 70 * var( --remBase ) );
							}
							&:nth-of-type( 2 ){
								font-size : calc( 36 * var( --remBase ) );
							}
							&:nth-of-type( 3 ){
								font-size : calc( 60 * var( --remBase ) );
							}
						}
					}
				}
			}
		}
		.merit03{
			padding-top : calc( 27.38 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -2.81 * var( --remBase ) );
					img{
						height : calc( 27 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 35 * var( --remBase ) );
					text-indent : -.05em;
					letter-spacing : -.05em;
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 6 * var( --remBase ) );
					font-size : calc( 16 * var( --remBase ) );
				}
			}
		}
		.merit04{
			padding-top : calc( 36 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -6.3 * var( --remBase ) );
					img{
						height : calc( 26 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 20 * var( --remBase ) );
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 8 * var( --remBase ) );
					font-size : calc( 35 * var( --remBase ) );
				}
			}
		}
		.merit05{
			padding-top : calc( 37 * var( --remBase ) );
			picture{
				&:nth-of-type( 1 ){
					top : calc( -11 * var( --remBase ) );
					img{
						height : calc( 34 * var( --remBase ) );
					}
				}
			}
			> span{
				&:nth-of-type( 1 ){
					font-size : calc( 20 * var( --remBase ) );
				}
				&:nth-of-type( 2 ){
					margin-top : calc( 13 * var( --remBase ) );
					font-size : calc( 35 * var( --remBase ) );
				}
			}
		}
	}
}