スマートフォンの場合、横スクロールいたします

・横幅100％の設定にしたTableタグで表を作る
・＜div class=”sp-scroll-table”＞～～＜/div＞
・CSS設定

@media (max-width: 480px) {
.sp-scroll-table table{
border-collapse: collapse;
margin: 2em 0;
max-width: 100%;
}
.sp-scroll-table th{

　text-align: center;
color: #FFFFFF ;
padding: 1em;
}
.sp-scroll-table td{
border: solid 1px #ccc ;
padding: 1em;
white-space: nowrap;
}
.sp-scroll-table {
overflow-x: auto;
margin-bottom: 1em;
max-width: 770px;
}
}

参考になりました、ありがとうございます。

Tableをスマホで見たときに、横スクロールで表示する方法