모달 정중앙에 fixed하기

//뒷배경
const BackgroundDim = styled.div`
  position: fixed;
  top:0;
  left:0;
  width:100vw;
  height:100vh;
  background-color: rgba(0,0,0,0.5);
  z-index:1000;
`

const ModalContainer = styled.div`
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  background-color: white;
  width: 500px;
  height: 300px;
`

1. top: 50%; left: 50%; ⇒ 모달의 좌상단 꼭짓점이 화면의 정중앙에 위치

2. transform: translate(-50%,-50%); ⇒ 모달의 중심이 정중앙에 위치하도록 모달의 50%를 다시 땡김