﻿/* --- 팝업(모달) 관련 CSS 시작 --- */
.footer-links a{cursor:pointer;}
    /* 팝업 배경 (어두운 영역) */
    .modal-overlay {
        display: none; /* 기본적으로 숨김 */
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.6); /* 반투명 검정 배경 */
        z-index: 1000; /* 다른 요소보다 위에 배치 */
		color:#333;
        
        /* Flexbox를 이용한 정중앙 정렬 */
        justify-content: center;
        align-items: center;
    }

    /* 팝업 활성화 클래스 */
    .modal-overlay.active {
        display: flex;
    }

    /* 팝업 박스 스타일 */
    .modal-content {
        background-color: #fff;
        padding: 25px;
        border-radius: 10px;
        box-shadow: 0 4px 15px rgba(0,0,0,0.3);
        
        /* 크기 설정 (반응형 + 최대크기 500) */
        width: 90%; 
        max-width: 500px;
        
        /* 내용이 길어질 경우 내부 스크롤 */
        max-height: 80vh; 
        overflow-y: auto;
        position: relative;
    }

    /* 팝업 제목 및 닫기 버튼 */
    .modal-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 15px;
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

    .modal-header h3 {
        margin: 0;
        font-size: 18px;
    }
.modal-body p{font-size:14px;}
    .close-btn {
        background: none;
        border: none;
        font-size: 14px!important;;
        cursor: pointer;
        line-height: 1;
    }