枠を付ける


<div style="
text-align: center; /* 文字を中央揃え/* 
padding-top:15px;　/* 上の余白15px/* 
padding-bottom:15px;/* 下の余白15px/* 
background-color:#333333;
color: white;
margin: 0 20px 0 20px;/* 余白　上 下 右 左/* 
">
                メディア掲載実績
            </div>

ボックスを並べる


 ul {
                padding: 0;
                justify-content: center;
                background-color: red;
                display: -webkit-flex;
                display: flex;
                list-style: none; /*黒点非表示/*
                flex-wrap: wrap; /端で折り返す/*
            }

 li {
                padding:5px;
                margin: 5px;
                background-color: white;
            }



 <div class="media-jisseki">


                <ul>
                    <li>
                        リスト1
                    </li>
                    <li>
                        リスト2
                    </li>
                    <li>
                        リスト3
                    </li>
                    <li>
                        リスト4
                    </li>
                    <li>
                        リスト5
                    </li>
                </ul>　

                

            </div>

スタイル指定

.media-jisseki {

 background-color:#F5F5F5;padding-top:15px;padding-bottom:15px;margin: 0 20px 0 20px;
            }

class="media-jisseki"
で使える。

真ん中に寄せたい

text-align: center
text-align: center !important
margin: auto