プラグイン一覧とリスト表示

追加オリジナルCSSで作成したプラグイン一覧のリスト表（ul li ）です。

html 詳細はソースコード表示でご覧下さい。 
<div class="list_flex plugin_list" style="float: left; width: 49%; margin-right: 5px;">
<p>プラグイン一覧（１）</p>
<ul>
<li>1</li>
<li>AccessCounters</li>
<i>アクセスカウンター</li>
</ul>
<!-- 略 -->
<div>

CSS
/* ========== List_Flex ========== */
.list_flex ul, li {
list-style-type:none;
}
.list_flex{
   width:100%％;}
.list_flex ul{
  display: flex;
  flex-wrap: wrap;}
.list_flex li {
 /*   width: 25%; ％指定で列を自由に設定可能 */
   box-sizing: border-box;
   padding-left:5px;}

.list_flex li:nth-child(n+1) {
   border-top: 1px solid #000;}
.list_flex ul:last-child li {
   border-bottom: 1px solid #000;}
.list_flex li:nth-child(n+1) {
   border-left: 1px solid #000;}
.list_flex li:last-child {
   border-right: 1px solid #000;}

.list_flex_4col li{width:25%;} /* ４列にする　*/
.list_flex_3col li{width:33%;} /* ３列にする　*/

     /* ========== List_Flex Bootstrap置換 ========== */
.list_flex ul{
  margin-bottom:0;
  padding-inline-start: 0px;
}
     /* ========== プラグイン一覧 ========== */
.plugin_list li:first-child {width: 8%;}
.plugin_list li:nth-child(2) {width: 42%;}
.plugin_list li:last-child {width: 50%;}
.list_flex li:first-child {
   padding-left:0px;
   text-align:center;}
.list_flex.plugin_list ul{line-height: 30px;}