console
<style>
*{
margin:0;
padding:0;
}
ul{
padding: 30px;
counter-reset: section;
}
li{
position: relative;
list-style: none;
padding: 20px 0px;
display: flex;
align-items: flex-start;
}
li::before{
counter-increment: section;
content: counter(section);
width:20px;
height: 20px;
border-radius: 50%;
background-color: red;
color: #fff;
text-align: center;
line-height: 20px;
margin-right: 10px;
margin-top:2px;
flex:none;
}
li::after{
position: absolute;
left:9px;
top:22px;
display: block;
content: '';
width:2px;
height: 100%;
background-color: pink;
z-index:-1;
}
li:last-of-type::after{
display: none;
}
</style>
<ul>
<li>
<span class="text">申請活動請聯繫</span>
</li>
<li>
<span class="text">申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫</span>
</li>
<li>
<span class="text">申請申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫活動請聯繫</span>
</li>
<li>
<span class="text">申請申請活動請聯繫申請活動請聯繫申請活動請聯繫申請活動請聯繫活動請聯繫</span>
</li>
</ul>