/* ---------- ヨーロッパ鉄道ご購入までの流れページ・注意事項 ---------- */
.attention-section {
	border-inline-start: 0 solid #FF0000;
}
.attention-title {
	font-weight: 900;
	color: #FF0000;
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	&::before {
		content: "";
		background-size: contain;
		background-position: center;
		background-repeat: no-repeat;
		background-image: url("data:image/webp;base64,UklGRnYCAABXRUJQVlA4TGoCAAAvN4APEHfDppEkR5Wd9//Z83n+mI7E/LNpJMlxsrLz/i57Pq+wbds2ZGZ0JKJCwcXgogEA8LCAi8YCYAGNxQNcPADA4gEGDSjAYACNh4uLwqABAA2AjwIM4ACgAFBwUWgsoAAFgAYsCgCNxqDg9+fz5fWyrAwjTUtVU5QkKVlOkhLFJClBSBQThEDWtU2GJMXYtm3btu2ZaFfX1lTH/7/vrMovRnsb0f8JoP/z6oGpla2L19eLreWpgaovUz16xpaHQ1Vfof2YoXttWk0HDN9r0ajdYNX1OtjIByt/DGOKZvkLzhYByg/YNuE4TipqwwflVg13bBn1xZiw4btai8JDtk2L2bfig8Jwi2ztBYgdz4caZHtXgQdD1LwDnAAP8V4TtMrAeEAawasBbYyMBCQh3GrIv4awb4phznKyBhnrmhjcR0QlL6CUwUM9lxC1MjhuSKO4mWgSFTEkYRNE5yj2s+Kwc6pmuJfF+OpBnCMiGYXBeVxKRDyF+VVcXERchdUjXFREHIWdexyLSFLh6k0hIxJXeHtS8HSeznVY8Xzzu2zOKzg685MqvsZkp4qn0Vn58T0+yukIl/TSCjtEEzjdUaL671FPRE/f4YmIaBAVTf1z4rDBrIJ7TDIjIuKCHgqyqBcSzYgxieklY84lIi3mT8hpjok6EF6AQNooeBrgBviIGQqZu2YXD3AA67lhqPjYil3DZ8TupJjCV95YseNLxo2w9W0F2ZYfWIG3y8i+aPYrzOcRdPhD672f0HXrOut1pNiyh9trIeWOfcxuO33Byp6l53CPC52l9GUbu8bm9h4f9+bHu+vpjw8=");
	}
}
.attention-body {
	line-height: 1.8;
}
.attention-button {
	display: grid;
	place-items: center;
	box-sizing: border-box;
	font-weight: bold;
	letter-spacing: 0.05em;
	background-color: #156A9A;
	color: #fff;
}
@media (width < 768px) {
	.attention-section {
		border-inline-start-width: 5px;
		padding-inline-start: 30px;
		padding-block-start: 40px;
	}
	.attention-title {
		font-size: 26px;
		line-height: 39px;
		gap: 10px;
		padding-block-end: 35px;
		border-block-end: 1px dashed #C9C9C9;
		margin-block-end: 35px;
		&::before {
			inline-size: 28px;
			block-size: 28px;
		}
	}
	.attention-body {
		font-size: 14px;
	}
	.attention-button {
		border-radius: 3px;
		font-size: 16px;
		block-size: 76px;
		margin-block-start: 35px;
	}
}
@media (width >= 768px) {
	.attention-section {
		border-inline-start-width: 10px;
		padding-inline-start: 50px;
		padding-block: 60px;
	}
	.attention-title {
		font-size: 26px;
		line-height: 35px;
		gap: 8px;
		padding-block-end: 35px;
		border-block-end: 1px solid #EDEDED;
		margin-block-end: 35px;
		&::before {
			inline-size: 26px;
			block-size: 26px;
		}
	}
	.attention-button {
		border-radius: 6px;
		font-size: 20px;
		inline-size: 460px;
		block-size: 90px;
		margin-inline: auto;
		margin-block-start: 55px;
	}
}


@scope (.attention-body) {
	p, ul, ol {
		margin-block: 1.5rem;
	}
	a {
		text-decoration: underline;
	}
	ul, ol {
		padding-inline-start: 1.5em;
	}
	ul {
		list-style: disc;
	}
	ol {
		list-style: decimal;
	}
	li {
		margin-block: 0.5rem;
		&::marker {
			color: #4E4E4E;
			font-weight: normal;
		}
	}
}