모달(modal) 중앙에 위치 시키기

.body{
	width: 100%
    height: 100%
}

.modal{
	position: absolute;
 	top: 50%;
 	left: 50%;
	
	transform: translateX(-50%) translateY(-50%); /* 수평 수직으로 중앙에 위치 */
}

transform: translateX(-50%) translateY(-50%);는 요소를 수평, 수직으로 중앙에 위치시키는 역할을 하지만, 그 자체로는 요소를 위치시키지는 않음. 따라서 position속성과 함께 사용하여 요소를 정확한 위치에 배치할 수 있음.