要素を中央配置するにはこれ！

HTML

<div class="main">
   <div class="container">
   <div>
</div>

CSS

.main {
  position: relative;
}

.container {
  position: absolute;   
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

上記のように、position: relative;とposition: absolute;を使うことによって、要素を中央配置することができます！