<div class="base">
   <div class="asanoha"></div>
</div>

.base {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  height: 100vh;
  width: 100vw;
  margin: -8px;
  padding-top: 1vh;
}

.asanoha{
  height: 100%;
  width: 100%;
  background:
	linear-gradient(90deg, pink 20px, transparent 20px, transparent calc(100% - 20px), pink calc(100% - 20px)) 0 0 / 120px 70px,
	linear-gradient(0deg, darkred 2px, transparent 2px) 0 39px / 80px 69px,
	pink;
}
.asanoha:before,
.asanoha:after {
	content: '';
	position: absolute;
	top: 5px;
	left: 0;
	width: 100%;
	height: 100%;
	mix-blend-mode: multiply;
}
.asanoha:before{
  background:
	linear-gradient(90deg, darkred 2px, transparent 2px) 0 0 / 60px 140px,
	linear-gradient(30deg, transparent 50%, darkred 50%, darkred calc(50% + 2px), transparent calc(50% + 2px)) 0 0 / 120px 70px,
	linear-gradient(-30deg, transparent 50%, darkred 50%, darkred calc(50% + 2px), transparent calc(50% + 2px)) 0 0 / 120px 70px,
	linear-gradient(90deg, transparent 40px, #fff 40px, #fff calc(100% - 40px), transparent calc(100% - 40px)) 0 0 / 120px 70px,
	linear-gradient(0deg, darkred 2px, transparent 1px) 0 0 / 40px 70px;
}
.asanoha:after {
	background:
	linear-gradient(90deg, #fff 20px, transparent 20px) 20px 0 / 60px 70px,
	linear-gradient(-60deg, transparent calc(50% - 2px), darkred calc(50% - 2px), darkred calc(50% + 1px), transparent calc(50% + 1px)) 0 0 / 40px 70px,
	linear-gradient(60deg, transparent calc(50% - 2px), darkred calc(50% - 2px), darkred calc(50% + 1px), transparent calc(50% + 1px)) 0 0 / 40px 70px;
}