擬似要素を使った斜めの区切り

上側

section {
	position: relative;
	&::before {
		content: "";
		position: absolute;
		top: -100px;
		border-color: transparent #000 transparent transparent;
		border-style: solid;
		border-width: 100px 100vw 0 0;
	}
}

下側

section {
	position: relative;
	&::after {
		content: "";
		position: absolute;
		bottom: -100px;
		border-color: #000 transparent transparent transparent;
		border-style: solid;
		border-width: 100px 100vw 0 0;
	}
}