.nav-custom-bg {
    background-color: #001F3F; /* 네이비 색상 */
}

.modal-content {
    width: 80%;  /* 크기 조절: 화면의 80%로 변경 */
    margin: 5% auto;  /* 중앙 위치 조절 */
    background: white;
    padding: 20px;
    border-radius: 5px;
    position: relative;  /* X 버튼 위치 설정을 위해 추가 */
}

/* 모든 화면 크기에 대해 column의 폭을 100%로 설정 */
.column {
    flex-basis: 100%;
    max-width: 100%;
}

.modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    color: black;           /* X 색상을 검은색으로 변경 */
    background-color: rgba(0, 0, 0, 0.3); /* 반투명한 검은 배경 추가 */
    border-radius: 50%;    /* 원형으로 만들기 위해 추가 */
    width: 30px;           /* 버튼 크기 조절 */
    height: 30px;
    display: flex;         /* 아이콘을 중앙에 배치하기 위한 스타일 */
    align-items: center;
    justify-content: center;
}