.scene-01 {
	display: grid;
	margin-inline: auto;
	max-width: var(--max-width);
}

.scene-01 .background {
	clip-path: polygon(0% 17%, 95% 22%, 90% 70%, 0 85%);
	grid-area: 1 / 1 / 2 / 2;
	z-index: -1;
}

.scene-01 .content {
	display: grid;
	grid-area: 1 / 1 / 2 / 2;
	padding: 5% 10%;
}

.scene-01 .headline-01 {
	color: var(--brown);
	font-size: var(--font-size-210);
	line-height: 1;
}

.scene-01 .headline-02 {
	color: var(--black);
	font-size: var(--font-size-210);
	font-weight: 500;
	line-height: 1;
}

.scene-01 .headline-03 {
	color: var(--brown);
	font-size: var(--font-size-210);
	line-height: 1;
	text-align: end;
}

.scene-01 .text-01 {
	display: grid;
	font-size: var(--font-size-40-16);
	row-gap: .5em;
	margin: 2em 0 2em auto;
	padding-inline-start: 20px;
}

.scene-01 .headline-04 {
	color: var(--brown);
	font-size: var(--font-size-300);
	font-weight: 500;
	line-height: 1;
}

.scene-01 .headline-04 .small {
	color: var(--black);
	font-size: var(--font-size-100);
	font-weight: 400;
	vertical-align: super;
}

.scene-01 .headline-05 {
	color: var(--black);
	font-size: var(--font-size-100);
	line-height: 1;
	margin-block-start: 0.5em;
	margin-inline-start: 1.25em;
}

.scene-01 .headline-06 {
	color: var(--brown);
	font-size: var(--font-size-300);
	font-weight: 500;
	line-height: 1;
}

.scene-01 .headline-06 .small {
	color: var(--black);
	font-size: var(--font-size-100);
	font-weight: 400;
}

@media (min-width: 800px) {
	.scene-01 .text-01 {
		width: 66%;
	}

	.scene-01 .headline-04 {
		margin-block-start: -.5em;
	}

	.scene-01 .headline-05 {
		margin-inline-start: calc(4% + 1.25em);
	}

	.scene-01 .headline-06 {
		margin-inline-start: 4%;
	}
}
