.block-notice .notice-close {
    position: absolute;
    top: 12px;
    right: 14px;
    z-index: 3;
    display: inline-grid;
    width: 32px;
    height: 32px;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 50%;
    color: inherit;
    background: rgba(15, 23, 42, .22);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.block-notice .notice-close:hover,
.block-notice .notice-close:focus-visible {
    background: rgba(15, 23, 42, .5);
}

.notice-popup-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1070;
    background: rgba(7, 12, 24, .68);
}

body.notice-popup-open {
    overflow: hidden;
}

.block-notice.notice-mode-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1080;
    display: block;
    width: min(680px, calc(100vw - 32px));
    max-height: min(720px, calc(100vh - 48px));
    margin: 0;
    transform: translate(-50%, -50%);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .45);
}

.block-notice.notice-mode-popup .content-notice {
    max-height: min(720px, calc(100vh - 48px));
    overflow: auto;
}

.block-notice.notice-mode-closable.is-dismissed {
    display: none;
}

@media (max-width: 575.98px) {
    .block-notice.notice-mode-popup {
        width: calc(100vw - 20px);
        max-height: calc(100vh - 24px);
    }

    .block-notice.notice-mode-popup .content-notice {
        max-height: calc(100vh - 24px);
    }
}