ソース

<div class="bdTtl">タイトル</div>

.bdTtl {
display: flex;
align-items: center;
justify-content: center;  //全幅で線を引く場合は不要。
}
.bdTtl:before,
.bdTtl:after {
border-top: 1px solid;
content: "";
flex-grow: 1; //全幅で線を引く場合。widthで線幅を短くしたい場合は不要もしくは0（初期値が0だから）
width:5em; //全幅で線を引く場合は不要。
}
.bdTtl:before {
margin-right: 1rem;
}
.bdTtl:after {
margin-left: 1rem;
}

サンプル

参考サイト

• タイトルの左右に横線を引くCSSをなるべく簡単に考えてみた – のんびりデザインしているような。