#one {height:inherit;}
#oney{height: 100%;}
.corner {
width:100%;
/* background-image: url(../img/operator.png); */
background-color: var(--dark);
background-repeat: no-repeat;
background-size: cover;
/* border-bottom-right-radius:10%; */
border-bottom-left-radius:10%;
/* margin-top: -10px; */
/* position: absolute; */
overflow:hidden;
position: relative;
border: 1px solid var(--dark);
}
.cornery {
width:50%;
/* background-image: url(../img/operator.png); */
background-color: var(--dark);
background-repeat: no-repeat;
background-size: cover;
/* border-bottom-right-radius:10%; */
border-bottom-left-radius:10%;
/* margin-top: -10px; */
/* position: absolute; */
/* overflow:hidden; */
position: relative;
border: 1px solid var(--dark);
}
.cornery:after, .cornery:before {
content: "";
position: absolute;
left: 100%;
width: 150px;
height: 50%;
}
.cornery:before {
top: 0px;
background: linear-gradient(to top right, var(--dark) 50%, transparent 51%);
}
.cornery:after {
bottom: 0px;
background: linear-gradient(to bottom right, var(--dark) 50%, transparent 51%);
}
.corner:after, .corner:before {
content: "";
position: absolute;
left: 100%;
width: 150px;
height: 50%;
}
.corner:before {
top: 0px;
background: linear-gradient(to top right, var(--dark) 50%, transparent 51%);
}
.corner:after {
bottom: 0px;
background: linear-gradient(to bottom right, var(--dark) 50%, transparent 51%);
}
.content_index{
/* background-color: red; */
width: 38%;
height: inherit;
/* border: 1px solid var(--dark); */
border-bottom-left-radius:10%;
}
<div class="cornery" id="oney">
<div class="corner" id="one">.
<figure class="corner2" ><span class="slide_info">Welcome</span></figure>
<figure class="corner3" >.</figure>
<figure class="corner4" >.</figure>
<figure class="corner5" >.</figure>
</div>
</div>
