/* 共通スタイル */
.responsive-img {
  max-width: 70%;   /* 7割 */
  height: auto;
  display: block;
}

/* 800px以上の時 → 左寄せ */
@media (min-width: 800px) {
  .responsive-img {
    margin-left: 0;
    margin-right: auto;
  }
}

/* 800px未満の時 → 中央寄せ＋左右20px */
@media (max-width: 799px) {
  .responsive-img {
    max-width: calc(100% - 40px); /* 両側20pxずつ余白 */
    margin-left: auto;
    margin-right: auto;
  }
}
