スマホの画像が右に寄る

スマホで見たときに、画像が真ん中に来ないで、右にずれます。
さんざんググって一通り試しましたが直りません。
以前作ったサイトをコピペしてベースにしているんですが、
以前のサイトは普通に真ん中に来るのに、右に寄ります
直接　HTML側に<ul class=”box” align=”center” >　をやってもダメです。
ご教示ください。

WordPress 5.8.2
ロリポップサーバー
テーマ　独自
CSS
body {
overflow-x: hidden;
-webkit-font-size-adjust: none;
margin: 0px; padding: 0px;
}
html {
margin: 0px; padding: 0px; }

.box { 
 overflow: auto;
    width: 80%;
  margin-left: auto;
  margin-right: auto; 
    }
 .box img{
  display: block; 
    margin: 0 auto;
 }

HTML

<ul class="box" >
<li><a href="https://shj-co.com/kigyou"><img  src="https://shj-co.com/wp-content/themes/sample/images/menu_1.jpg" alt="" border="0" /></a></li>
			   	<li><img class="pconly" src="https://shj-co.com/wp-content/themes/sample/images/space.gif" width="110" alt="" border="0"/></li>
			   	<li><a href="https://shj-co.com/"><img  src="https://shj-co.com/wp-content/themes/sample/images/menu_2.jpg" alt="" border="0" /></a></li>
</ul>