/*!*******************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/style.css ***!
  \*******************************************************************************************************************************************************************/
[class*='is-style-arrow-'] {
	--arrow-length: calc(100% - 20vw);
	--arrow-width: 3rem;

	position: relative;

	&::before {
		content: '';
		display: block;
	}

	&::after {
		content: '';
		position: absolute;
		display: block;
		clip-path: polygon(0% 0%, 0% 100%, 100% 100%);
	}
}

.is-style-arrow-right {
	height: var(--arrow-width);

	&::before {
		width: var(--arrow-length);
		height: 50%;
		background-color: red;
		transform: translateY(50%);
	}

	&::after {
		height: 100%;
		width: var(--arrow-width);
		background-color: red;
		left: var(--arrow-length);
		top: 0;
		transform: translateX(-50%) rotate(-135deg);
	}
}


/*# sourceMappingURL=style-index.css.map*/