Скругленная рамка (скруглы) для блока на CSS

.corners {
color: #000;
margin: 0;
overflow: hidden;
position: relative;
}
.text {
background: #fff;
border: 2px solid #9b9b9b;
padding: 1em;
}
.arc-top,
.arc-bottom {
position: absolute;
width: 100%;
height: 12px;
left: 0;
}
.arc-top { top: 0 }
.arc-bottom { bottom: 0 }
.arc-top:before,
.arc-top:after,
.arc-bottom:before,
.arc-bottom:after {
content: '';
position: absolute;
width: 24px;
height: 24px;
background-color: #fff;
border: 2px solid #9b9b9b;
border-radius: 50%;
}
.arc-top:before {
top: -12px;
left: -12px;
}
.arc-top:after {
top: -12px;
right: -12px;
}
.arc-bottom:before {
bottom: -12px;
left: -12px;
}
.arc-bottom:after {
bottom: -12px;
right: -12px;
}

<div class="corners">
<div class="arc-top"></div>
<div class="text">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <a title="#" href="#">Aenean commodo</a> ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
</div>
<div class="arc-bottom"></div>
</div>

.corners {
 background: radial-gradient(circle at top left, transparent 15px, #58a 0) top left, radial-gradient(circle at top right, transparent 15px, #58a 0) top right, radial-gradient(circle at bottom right, transparent 15px, #58a 0) bottom right, radial-gradient(circle at bottom left, transparent 15px, #58a 0) bottom left;
 background-size: 50% 50%;
 background-repeat: no-repeat;
 padding: 1em;
}

<div class="corners">
 Далеко-далеко за словесными горами в стране гласных и согласных живут рыбные тексты. Вдали от всех живут они в буквенных домах на берегу Семантика большого языкового океана. Маленький ручеек Даль журчит по всей стране
</div>