<!-- 트리거 버튼 -->
<button id="openModalBtn" class="btn btn-primary">열기</button>

<!-- 기본 모달 구조 -->
<div id="customModal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:1050;">
  <div style="background:white; width:1920px; margin:100px auto; padding:20px; border-radius:8px; position:relative;">
    <h4>기본 모달</h4>
    <p>이것은 부트스트랩이 아닌 순수 모달입니다.</p>
    <button id="closeModalBtn" class="btn btn-secondary">닫기</button>
  </div>
</div>

<script>
  document.getElementById('openModalBtn').onclick = function() {
    document.getElementById('customModal').style.display = 'block';
  };

  document.getElementById('closeModalBtn').onclick = function() {
    document.getElementById('customModal').style.display = 'none';
  };

  // 바깥 클릭 시 닫기
  document.getElementById('customModal').onclick = function(e) {
    if (e.target === this) this.style.display = 'none';
  };
</script>
