スマホのリスト表示で▢が文字に重なって表示される時の対策

スマホ（iPhone）で、リスト表示が改行されると先頭文字の下に「□に×の画像」が重なって表示される現象を確認しました。
上記の現象が起きた場合は、以下の方法で対処できます。

 
style.cssの 120行目位の /* 投稿設定*/ 部分の下記を

.doc ul, .doc ol {padding: 1em 0 0 2em;}
.doc ul li {list-style-type: disc;}

 
次のように変更してみて下さい。

.doc ul.cool, .doc ol.cool {padding: 1em 0 0 1em;}
.doc ul.cool li {list-style: none; position: relative; padding-left: 1em;}
.doc ul.cool li:before {position: absolute; left: 0; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0da";}

※文章の先頭にWEBフォントを利用しています。 cntennt:”” の部分を変更してご利用ください。
他のWEBフォントは、https://fontawesome.com/icons?d=gallery&m=freeで確認できます。

 
下記は、変更したリスト表示の表示例です。
 

<ul class="cool">
<li>表示テストです。</li>
<li>表示テストです。</li>
<li>表示テストです。</li>
<li>表示テストです。</li>
<li>表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。</li>
<li>表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。</li>
</ul>

• 表示テストです。
• 表示テストです。
• 表示テストです。
• 表示テストです。
• 表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。
• 表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。表示テストです。