/* 팝업 */
	.modal-dialog { position: fixed; inset: 0; z-index: 5000; display: none; }
	.modal-dialog .dim { position: absolute; inset: 0; z-index: 0; background: rgba(0,0,0,0.5); }
	.modal-content { position: relative; z-index: 1; width: 100%; height: 100%; display: flex; justify-content: center; align-items: flex-start; padding: 50px 16px; overflow: hidden; }
	.modal-title { margin-bottom: 30px; text-align: left; }
	.modal-title h1 { font-size: 18px; font-weight: 700; line-height: 1.3; }

	/* pop scroll */
	.modal-scroll-container { position: relative; flex-grow: 1; overflow: auto; }
	.modal-scroll-container::-webkit-scrollbar { width: 15px; height: 15px; background: transparent; }
	.modal-scroll-container::-webkit-scrollbar-track { 
		background-color: #fff;
		border-radius: 10px;
		box-shadow: inset 0px 0px 5px white;
	}
	.modal-scroll-container::-webkit-scrollbar-thumb { 
		background-color: #F3F3F3;
		border-radius: 10px;
		background-clip: padding-box;
		border: 4px solid transparent; 
	}
	.modal-scrollable { position: absolute; inset: 0; display: flex; justify-content: flex-start; align-items: stretch; flex-direction: column; }
	.modal-btn_area { flex-shrink: 0; }

	/* confirm*/
	.modal-dialog .closer { cursor: pointer; }
	.modal-alert,
	.modal-confirm { margin: auto; }
	.modal-alert { display: flex; justify-content: flex-start; align-items: flex-start; width: 100%; max-width: 400px; overflow: hidden; }
	.modal-alert { display: flex; justify-content: flex-start; align-items: stretch; flex-direction: column; padding: 30px 20px;  max-height: 100%; border-radius: 20px; background: #fff; font-size: 14px; overflow: hidden; }

	.modal-head { flex-shrink: 0; position: relative; }
	.modal-head button { position: absolute; right: 0; top: 0; border: 0; opacity: 0.5; margin: -11px -14px; }
	.modal-tool { display: flex; justify-content: flex-end; align-items: center; font-size: 16px; padding: 12px; }
	.modal-body {  }
	.modal-body { flex-grow: 1; margin-right: -20px; padding-right: 20px; overflow: auto; }
	.modal-body::-webkit-scrollbar { width: 8px; height: 8px; }
	.modal-body::-webkit-scrollbar-thumb { background: var(--thema-hover); }

	.modal-controls { flex-shrink: 0; display: flex; justify-content: center; align-items: center; margin-top: 30px; gap: 12px; }
	.modal-button { flex: 1; display: flex; justify-content: center; align-items: center; gap: 2px; padding: 0 20px; height: 40px; line-height: 1em; font-size: 14px; font-weight: 500; letter-spacing: -0.03em; border-radius: 5px; background: transparent; color: #9B9B9B; transition: all 0.3s; -webkit-transition: all 0.3s; }
	.modal-button:disabled { background: var(--gray-100); color: rgba(0,0,0,0.3); border-color: var(--gray-100); pointer-events: none; }
	.modal-button:hover { color: var(--black-100); }
	.modal-button:active { opacity: 0.8; }
	.modal-button-submit { background: var(--thema-primary); border-color: var(--thema-primary); color: #fff; }
	.modal-button-submit:hover { color: #fff; }

	.modal-body .form-field { gap: 8px; }
	.modal-body .form-field + .form-field { margin-top: 20px; }