<h1 class="cp_h1title">見出しテキスト</h1>
.cp_h1title {
color: #fff;
background-color: #4CAF50;
position: relative;
overflow: hidden;/*●がはみ出ないように「hidden」に設定*/
text-shadow: 1px 1px 0px rgba(0,0,0,0.3);/*文字を読みやすくするために影を追加*/
}
.cp_h1title:before,
.cp_h1title:after {
position: absolute;
content: '';
display: block;
}
.cp_h1title:before{/*左上の●*/
background-color: #fff;
border-radius: 100px 100px 100px 100px;
opacity: 0.5;
bottom: 9px;
left: 0px;
width: 100px;
height: 100px;
}
.cp_h1title:after{/*左下の●*/
background-color: #fff;
border-radius: 50px 50px 50px 50px;
opacity: 0.6;
bottom: -8px;
left: 70px;
width: 50px;
height: 50px;
}