/* ILPDialog: 모달 경고창/정보창. 사용법은 ILP/assets/js/ilp-dialog.js 참고.
   app.css 의 `* { border-radius: 0 !important }` 때문에 둥근 모양은 !important 로 덮는다. */
.ilp-dialog { z-index: 100000; }
/* custom.css 의 `.modal-dialog { padding-top: 5% }`(모바일 15%)가 세로 중앙 정렬을 아래로 밀므로 0 으로 덮는다 */
.ilp-dialog .modal-dialog { max-width: 340px; margin-left: auto; margin-right: auto; padding-top: 0; }
.ilp-dialog .modal-content { text-align: center; border: 0; }
.ilp-dialog__body { padding: 28px 24px 12px; }
.ilp-dialog__icon {
    width: 48px; height: 48px; margin: 0 auto 14px; line-height: 48px;
    font: bold 28px/48px Arial, sans-serif; color: #fff; background: #ed1d24;
    border-radius: 50% !important;
}
.ilp-dialog[data-type="warning"] .ilp-dialog__icon:before { content: "!"; }
.ilp-dialog[data-type="info"] .ilp-dialog__icon { background: #2a7fc1; font-family: Georgia, serif; }
.ilp-dialog[data-type="info"] .ilp-dialog__icon:before { content: "i"; }
.ilp-dialog[data-type="confirm"] .ilp-dialog__icon { background: #2a7fc1; }
.ilp-dialog[data-type="confirm"] .ilp-dialog__icon:before { content: "?"; }
.ilp-dialog__title { margin-bottom: 8px; font-size: 17px; font-weight: bold; color: #333; }
.ilp-dialog__message { font-size: 14px; line-height: 1.6; color: #555; white-space: pre-line; word-break: keep-all; overflow-wrap: anywhere; }
.ilp-dialog__footer { padding: 16px 24px 24px; }
.ilp-dialog__ok {
    min-width: 96px; padding: 8px 20px; font-size: 14px; color: #fff;
    background: #ed1d24; border: 1px solid #ed1d24; cursor: pointer;
}
.ilp-dialog[data-type="info"] .ilp-dialog__ok, .ilp-dialog[data-type="confirm"] .ilp-dialog__ok { background: #2a7fc1; border-color: #2a7fc1; }
.ilp-dialog__cancel {
    display: none; min-width: 96px; margin-left: 8px; padding: 8px 20px; font-size: 14px; color: #555;
    background: #fff; border: 1px solid #ccc; cursor: pointer;
}
.ilp-dialog[data-mode="confirm"] .ilp-dialog__cancel { display: inline-block; }
.ilp-dialog__cancel:hover, .ilp-dialog__cancel:focus { background: #f5f5f5; outline: 0; box-shadow: 0 0 0 3px rgba(0, 0, 0, .1); }
.ilp-dialog__ok:hover, .ilp-dialog__ok:focus { opacity: .9; outline: 0; box-shadow: 0 0 0 3px rgba(0, 0, 0, .15); }
@media (max-width: 575.98px) {
    .ilp-dialog .modal-dialog { width: auto; max-width: none; margin: 16px; min-height: calc(100% - 32px); }
}