<div class="container">
　<div class="inner">インナー
　　<div class="contants">コンテンツ</div>
　</div>
</div>

.container {
  background-color: #ccc;
  overflow: hidden;/*横スクロール対策*/
  text-align: center;
  width: 100%;
}
.inner {
  margin-inline: auto;
  max-width: 400px;
  width: 100%;
}
.contents {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.contents {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  /*背景のみ*/
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}