css html arrow lr

<style>
.arrow_mp_l{
  border-bottom:2pt solid black;
  width:60pt;height:0pt;
}
.arrow_mp_l::after{
  content:"";
  right: -1pt;
  bottom: -1pt;
  border-right:10pt solid transparent;
  border-bottom:10pt solid black;
  position: absolute;
}
</style>

<div style="position:relative;width:300pt;height:170pt;">
<div class="arrow_mp_l" style="position:absolute; left:80pt;top:70pt; width:60pt;height:0pt;"></div>
</div>

図形point:(shape)
下線＋ 右三角

あえて右と下だけ設定するのがポイント
border-right:10pt solid transparent;
border-bottom:10pt solid black;

太さ調整(bold)
border-bottom:2pt solid black;

right: -1pt;
bottom: -1pt;
border-right:10pt solid transparent;
border-bottom:10pt solid black;