.map {
    display: flex;
    align-items: center;
    justify-content: center;
}

.map > img {
    width: 100%;
    height: 100%;
}
.mapInfo {
    font-family: 'Noto Sans KR';
    font-size: 22px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 15%;
    margin: 3% 0 10%;
}

.mapInfo > .infoBox {
    display: grid;
    grid-template-columns: .25fr 1fr;
}

@media screen and (max-width: 720px) {
	.mapInfo {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr;
		margin: 3% 0 35%;
	}
}


@media screen and (max-width: 540px) {
	.mapInfo {
		margin: 3% 0 55%;
	}
}