/**
 * 利用規約ページ
 * ご案内
 */

.lilac-terms-introduction {
	width: 100%;
	margin: 0;
	padding: clamp(56px, 7vw, 88px) 20px;
	background: #ffffff;
}

.lilac-terms-introduction__inner {
	width: min(100%, 960px);
	margin: 0 auto;
}

.lilac-terms-introduction__card {
	position: relative;
	padding: clamp(28px, 5vw, 48px);
	background:
		linear-gradient(
			135deg,
			#fbf9ff 0%,
			#ffffff 100%
		);
	border: 1px solid #eee8f6;
	border-radius: 24px;
	box-shadow:
		0 18px 48px
		rgba(83, 63, 110, 0.08);
	overflow: hidden;
}

.lilac-terms-introduction__card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 6px;
	height: 100%;
	background:
		linear-gradient(
			180deg,
			#7653a6 0%,
			#a98ad1 100%
		);
}

.lilac-terms-introduction__label {
	margin: 0 0 12px;
	color: #7653a6;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.12em;
}

.lilac-terms-introduction__title {
	margin: 0;
	color: #2f2935;
	font-size: clamp(26px, 3.8vw, 36px);
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.03em;
}

.lilac-terms-introduction__text {
	margin-top: 24px;
	color: #5e5764;
	font-size: 16px;
	line-height: 2;
}

.lilac-terms-introduction__text p {
	margin: 0;
}

.lilac-terms-introduction__text p + p {
	margin-top: 18px;
}

@media screen and (max-width: 767px) {

	.lilac-terms-introduction {
		padding:
			48px
			16px;
	}

	.lilac-terms-introduction__card {
		padding:
			28px
			22px
			28px
			26px;
		border-radius: 18px;
	}

	.lilac-terms-introduction__card::before {
		width: 5px;
	}

	.lilac-terms-introduction__label {
		font-size: 12px;
	}

	.lilac-terms-introduction__title {
		font-size: 26px;
	}

	.lilac-terms-introduction__text {
		margin-top: 20px;
		font-size: 15px;
		line-height: 1.9;
	}
}