/* CSS Document */

#list{
	display: grid;
	grid-gap: clamp(24px, 4.8vw, 32px);
	width: var(--wrap);
	margin: clamp(32px, 7.2vw, 48px) auto;
	}
	#list:last-child{
		margin-bottom: clamp(64px, 14.4vw, 96px);
		}
	#list h2{
		justify-self: center;
		margin-bottom: -16px;
		color: var(--color-point);
		font-size: clamp(16px, 3vw, 20px);
		font-weight: 500;
		line-height: 1.65;
		}
	#list h2+div{
		font-size: clamp(14px, 2.4vw, 16px);
		text-align: center;
		}

#terms{
	display: grid;
	grid-gap: clamp(24px, 4.8vw, 32px);
	width: var(--wrap);
	margin: clamp(32px, 7.2vw, 48px) auto;
	padding: clamp(24px, 4.8vw, 32px);
	border: 1px solid var(--color-border);
	}
	#terms h2{
		display: grid;
		grid-template-columns: 3px auto;
		grid-gap: 10px;
		font-size: clamp(18px, 3.6vw, 24px);
		font-weight: 500;
		line-height: 1.65;
		}
		#terms h2:before{
			content: "";
			margin: 0.3em 0;
			background: var(--color-variable);
			transform: translateY(0.1em);
			}
	#terms section{
		display: grid;
		grid-template-columns: 1.5em auto;
		grid-gap: clamp(16px, 3.6vw, 24px) 0;
		line-height: 1.65;
		}
		#terms section > *{
			grid-column: 2;
			}
	#terms h3{
		grid-column: 1 / 3;
		margin-bottom: -16px;
		padding-left: 1.5em;
		text-indent: -1.5em;
		}
	#terms ol{
		display: grid;
		grid-gap: 4px;
		}
		#terms ol > li{
			margin-left: 1em;
			list-style: decimal;
			}
	#terms ul{
		display: grid;
		grid-gap: 4px;
		}
		#terms ul > li{
			padding-left: 1em;
			text-indent: -1em;
			}
	#terms dl{
		margin-top: 16px;
		}
	#terms dt{
		font-weight: 700;
		}
		#terms dt:before{
			content: "\FF1C";
			}
		#terms dt:after{
			content: "\FF1E";
			}
	@media (min-width: 576px) {
		#terms h2{
			grid-template-columns: 4px auto;
			grid-gap: 0 16px;
			}
		}

#request{
	display: flex;
	justify-content: center;
	margin: clamp(32px, 7.2vw, 48px) auto clamp(64px, 14.4vw, 96px) auto;
	}
	#request a{
		display: grid;
		grid-template-columns: 18px auto;
		align-items: center;
		justify-content: initial;
		grid-gap: 16px;
		width: min(100%, 400px);
		min-height: 60px;
		padding: 4px 24px;
		background: var(--color-point);
		color: #fff;
		font-size: clamp(16px, 2.7vw, 18px);
		text-align: center;
		line-height: 1.65;
		text-decoration: none;
		}
	#request a:before{
		content: "";
		aspect-ratio: 1;
		-webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 17"><path d="m8.27,10.93c.19.2.45.31.73.31s.54-.11.73-.31l4-4.24c.38-.4.36-1.03-.04-1.41-.4-.38-1.04-.36-1.41.04l-2.27,2.41V1c0-.55-.45-1-1-1s-1,.45-1,1v6.72l-2.27-2.41c-.38-.4-1.01-.42-1.41-.04-.4.38-.42,1.01-.04,1.41l4,4.24Zm7.73-.93c-.55,0-1,.45-1,1v4H2v-4c0-.55-.45-1-1-1s-1,.45-1,1v5c0,.55.45,1,1,1h15c.55,0,1-.45,1-1v-5c0-.55-.45-1-1-1Z"/></svg>');
		-webkit-mask-size: contain;
		background: currentColor;
		}