@charset "UTF-8";

/* --------------------------------------------
SUCCESSFULLY
--------------------------------------------- */
#successfully .entries{
	background-color : var( --cyan03 );
	.title02{
		&::before{
			background-image : url( "../images/ui/label/successfully.svg" );
		}
	}
	.lede{
		font-family : "Zen Kaku Gothic New" , sans-serif;
		font-size : calc( 18 * var( --remBase ) );
		line-height : 1.5;
		text-align : center;
		span{
			font-weight : 700;
			color : var( --blue );
		}
		&::after{
			display : block;
			width : auto;
			height : calc( 12 * var( --remBase ) );
			aspect-ratio : 56/12;
			margin-inline : auto;
			content : "";
			background : url( "../images/ui/parts/dots01.svg" ) left top / contain no-repeat;
		}
	}
	.btn01{
		margin-top : calc( 30 * var( --remBase ) );
	}
	@media screen and ( width <= 750px ){
		padding-block : calc( 40 * var( --remBase ) );
		.title02{
			&::before{
				height : calc( 13.98 * var( --remBase ) );
				margin-bottom : calc( 20 * var( --remBase ) );
			}
		}
		.lede{
			margin-top : calc( 19 * var( --remBase ) );
			&::after{
				margin-top : calc( 20 * var( --remBase ) );
			}
		}
	}
	@media print , screen and ( width > 750px ){
		width : min( 750px , calc( 750 * var( --viewportBase ) ) );
		padding-block : calc( 80 * var( --remBase ) );
		margin-inline : auto;
		.title02{
			&::before{
				height : calc( 18.41 * var( --remBase ) );
				margin-bottom : calc( 23.77 * var( --remBase ) );
			}
		}
		.lede{
			margin-top : calc( 10 * var( --remBase ) );
			&::after{
				margin-top : calc( 18 * var( --remBase ) );
			}
		}
	}
}

/* --------------------------------------------
ABOUT
--------------------------------------------- */
#about{
	.title01{
		&::before{
			background-image : url( "../images/ui/label/about.svg" );
		}
	}
	dl{
		background-color : white;
		border-radius : calc( 10 * var( --remBase ) );
	}
	:where( dt,dd ){
		font-size : calc( 16 * var( --remBase ) );
		line-height : 1.8;
	}
	dt{
		font-weight : 700;
	}
	dd{
		font-weight : 500;
	}
	.cyan01{
		-webkit-text-decoration : underline;
		text-decoration : underline;
		text-underline-offset : .2em;
	}
	@media screen and ( width <= 750px ){
		padding-bottom : calc( 30 * var( --remBase ) );
		.title01{
			&::before{
				height : calc( 13.98 * var( --remBase ) );
				margin-bottom : calc( 20 * var( --remBase ) );
			}
		}
		dl{
			margin-top : calc( 30 * var( --remBase ) );
		}
		:where( dt,dd ){
			padding-inline : calc( 20 * var( --contentBase ) );
		}
		dt{
			padding-top : calc( 20 * var( --remBase ) );
		}
		dd{
			padding-bottom : calc( 20 * var( --remBase ) );
			border-bottom : dashed 1px #bfc6c9;
		}
	}
	@media print , screen and ( width > 750px ){
		padding-bottom : calc( 80 * var( --remBase ) );
		.title01{
			margin-top : calc( 80 * var( --remBase ) );
			&::before{
				height : calc( 18.17 * var( --remBase ) );
				margin-bottom : calc( 20 * var( --remBase ) );
			}
		}
		dl{
			display : grid;
			grid-template-columns : calc( 200 * var( --contentBase ) ) 1fr;
			margin-top : calc( 56 * var( --remBase ) );
			:where( dt,dd ){
				padding-block : calc( 20 * var( --remBase ) );
			}
		}
		:where( dt , dd ):not( :last-of-type ){
			border-bottom : dashed 1px #bfc6c9;
		}
		dt{
			padding-left : calc( 50 * 100% / 200 );
		}
	}
}

/* --------------------------------------------
CONTACT
--------------------------------------------- */
#contact{
	background-color : #f5faff;
	p{
		font-size : calc( 18 * var( --remBase ) );
		line-height : calc( 21.6 / 18 );
		text-align : center;
		em{
			font-weight : 700;
			color : var( --blue );
		}
	}
	@media screen and ( width <= 750px ){
		padding-block : calc( 40 * var( --remBase ) );
		p{
			margin-top : calc( 14 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 750px ){
		position : relative;
		width : 100%;
		max-width : 750px;
		padding-block : calc( 80 * var( --remBase ) );
		margin-inline : auto;
		overflow-x : clip;
		background-color : #f5faff;
		p{
			margin-top : calc( 10 * var( --remBase ) );
		}
	}
}

/* --------------------------------------------
PRIVACY POLICY
--------------------------------------------- */
#privacy{
	h2{
		line-height : 1.4;
		text-align : center;
	}
	p , li{
		line-height : 1.6;
	}
	h2 + p{
		margin-top : 2em;
	}
	:where( p , ul , ol ) + h3{
		margin-top : 2em;
	}
	h3 + :where( p , ul , ol ){
		margin-top : 1.5em;
	}
	ol > li{
		position : relative;
		padding-left : 1.5em;
		counter-increment : no;
		&::before{
			position : absolute;
			top : 0;
			left : 0;
			white-space : pre;
			content : counter( no ) ". ";
		}
	}
	li + li{
		margin-top : 1em;
	}
	:where( ol , ul ) + p , p + :where( ol , ul ){
		margin-top : 1em;
	}
	p + h2{
		margin-top : 4em;
	}
	@media screen and ( width <= 750px ){
		padding-top : calc( 80 * var( --remBase ) );
		padding-bottom : calc( 100 * var( --remBase ) );
		h2{
			font-size : calc( 16 * var( --remBase ) );
		}
		h3{
			font-size : 1.2rem;
		}
		p , li{
			font-size : 1rem;
		}
	}
	@media print , screen and ( width > 750px ){
		padding-top : calc( 80 * var( --remBase ) );
		padding-bottom : calc( 100 * var( --remBase ) );
		h2{
			font-size : calc( 24 * var( --remBase ) );
		}
		h3{
			font-size : calc( 20 * var( --remBase ) );
		}
		p , li{
			font-size : calc( 16 * var( --remBase ) );
		}
	}
}