css) css 글자 오른쪽에 중간선 그리기

<style>
	.titleAreaMain {
		width: 100%;
	}

	.titleArea2 {
		display: flex;
		flex-basis: 100%;
		font-size: 1.2rem;
		font-weight: bold;
		line-height: 1.8rem;
		margin: 8px 0;
		align-items: center;
		width: 250px;
		float: left;
	}

	.titleArea2::after {
		content: '';
		flex-grow: 1;
		margin: 0 10px;
		background-color: black;
		height: 1px;
	}

	.titleArea3 {
		color: #555;
		display: flex;
		font-size: 1.2rem;
		float: left;
		line-height: 1.5rem;
		margin: 8px 0;
		text-align: left;
	}
</style>

<div class="col-10 mx-auto text-left mt-2" style="clear:both;">
    <div class="titleAreaMain">
        <div class="titleArea2">
            &bull; LED Media Wall
        </div>
        <div class="titleArea3">13M*4.5M의 와이드한 미디어월을 활용하여 다양한 구성 연출이 가능하고 각 행사마다 특별한 분위기를 제공합니다.</div>
    </div>
</div>
<div class="col-10 mx-auto text-left" style="clear:both;">
    <div class="titleAreaMain">
        <div class="titleArea2">
            &bull; Array Speaker
        </div>
        <div class="titleArea3">대형 공연용 사운드 장비로 풍성한 사운드 출력을 자랑합니다.</div>
    </div>
</div>
<div class="col-10 mx-auto text-left" style="clear:both;">
    <div class="titleAreaMain">
        <div class="titleArea2">
            &bull; Spacious Lobby Area
        </div>
        <div class="titleArea3">연회장 앞 36M * 10M의 넓은 로비공간은 최대 40개까지 대량의 부스설치가 가능하여 공간 활용도를 높여줍니다.</div>
    </div>
</div>