疑似要素で指定
.area {
display: flex;
}
<!-- スマホの場合、仕切り用の縦罫線は不要なため、画面サイズ指定 -->
@media(min-width:769px){.area::after {
position: absolute; /*--positionを追加--*/
top: 0;
left: 100%;
margin: 0 1rem;
content: "";
width: 1px; /*--縦線の太さ(幅)--*/
height: 100%;
background-color: #333; /*--縦線の色--*/
}}
参考ページ