@layer pages {
    html:has(#staldia-consultant-modal-toggle:checked) {
        overflow-y: clip;
    }
    .staldia-consultant-card-label:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 9;
    }
    .staldia-consultants-modals-section .staldia-consultant-card {
        top: 50%;
        left: 50%;
        width: calc(100% - (var(--layout-padding-horizontal-base) * 2));
        max-width: 400px;
        --max-height: calc(100svh - 110px - (var(--layout-padding-horizontal-base) * 2));
        transform: translate(-50%, -50%);
        z-index: 999;
    }
    .staldia-consultants-modals-section .staldia-consultant-card-container {
        position: relative;
        gap: 1.5rem 0;
        padding-top: 2.5rem;
    }
    .staldia-consultants-modals-section .staldia-consultant-card-content {
        max-height: var(--max-height);
        overflow-y: auto;
        padding: 40px calc(var(--layout-padding-horizontal-base) * .5);
        border-radius: 10px;
        background: var(--color-bg-white);
    }
    .staldia-consultants-controller {
        display: flex;
        justify-content: center;
        gap: .75rem;
        margin-inline: auto;
    }
    .staldia-consultants-control {
        position: relative;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: var(--color-accent);
    }
    .staldia-consultants-control:disabled {
        opacity: .25;
    }
    .staldia-consultants-control:before {
        content: "";
        position: absolute;
        width: .4rem;
        height: .4rem;
        top: 50%;
        left: 50%;
        --border: 2px solid var(--color-text-on-accent);
        --x: -40%;
        transform: translate(var(--x), -50%) rotate(45deg);
    }
    .staldia-consultants-prev:before {
        border-bottom: var(--border);
        border-left: var(--border);
    }
    .staldia-consultants-next:before {
        border-top: var(--border);
        border-right: var(--border);
        --x: -60%;
    }
    .staldia-consultants-modal-close-bg {
        position: fixed;
        width: 100%;
        height: 100%;
        background: var(--color-bg-sub);
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 900;
    }
    .staldia-consultants-modals-section .staldia-consultant-card,
    .staldia-consultants-modal-close-bg {
        visibility: hidden;
        opacity: 0;
    }
    .staldia-is-ready .staldia-consultant-card,
    .staldia-is-ready .staldia-consultants-modal-close-bg {
        transition: opacity .5s, visibility .5s;
    }
    #staldia-consultant-modal-toggle:checked ~ .staldia-consultant-list > .staldia-consultant-card:has(.staldia-consultants-modal-radio:checked),
    #staldia-consultant-modal-toggle:checked ~ .staldia-consultants-modal-close-bg {
        visibility: visible;
        opacity: 1;
    }
    .staldia-consultants-modals-section .staldia-consultant-card-header,
    .staldia-consultants-modals-section .staldia-consultant-figure {
        margin-inline: 2rem;
    }
    .staldia-consultants-modal-container {
        padding-inline: calc(var(--layout-padding-horizontal-base) * .5);
        margin-top: 2rem;
    }
    .staldia-consultants-modal-content {
        line-height: 2;
    }
    .staldia-consultants-modal-title {
        font-size: 1.5rem;
        padding-bottom: 1.5rem;
        line-height: 1;
        border-bottom: 1px solid rgb(var(--color-text-rgb) / .25);
        margin-bottom: 1rem;
    }
    .staldia-consultants-modal-title:before {
        content: attr(data-en);
    }
    .staldia-consultants-modal-list > div {
        display: grid;
        gap: .5rem;
    }
    .staldia-consultants-modal-list dt {
        position: relative;
        font-size: var(--font-size-l);
        padding-left: 1.375rem;
    }
    .staldia-consultants-modal-list dt:before {
        content: "";
        position: absolute;
        width: 1rem;
        height: 1rem;
        top: .6em;
        left: 0;
        background: var(--color-shadow-sand);
        border-radius: 50%;
    }
    .staldia-consultants-modal-list dd {
        font-size: var(--font-size-s);
        letter-spacing: .05em;
    }
    .staldia-consultants-modal-content ul {
        display: grid;
        gap: .25rem 0;
    }
    .staldia-consultant-modal-close {
        position: absolute;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        font-size: var(--font-size-s);
        gap: 1rem;
        top: 0;
        right: 0;
        padding: .5rem;
    }
    .staldia-consultant-modal-close:before {
        content: "Close";
    }
    .staldia-consultant-modal-close:after {
        content: "×"
    }
    @media (min-width: 900px) {
        .staldia-consultants-modals-section .staldia-consultant-card {
            max-width: calc(1280px - 150px);
        }
        .staldia-consultants-modals-section .staldia-consultant-card-container {
            padding: var(--layout-padding-horizontal-base);
            background: var(--color-bg-white);
            border-radius: 10px;
        }
        .staldia-consultants-modals-section .staldia-consultant-card-content {
            display: grid;
            grid-template-columns: 240px 1fr;
            grid-template-rows: auto 1fr;
            gap: 1rem 1.5rem;
            align-items: start;
            padding: 0;
            border-radius: 0;
        }
        .staldia-consultants-modals-section .staldia-consultant-card-content::-webkit-scrollbar {
            width: 4px;   /* 縦スクロールバー */
            height: 4px;  /* 横スクロールバー */
        }

        .staldia-consultants-modals-section .staldia-consultant-card-content::-webkit-scrollbar-track {
            background: #e3e3e3;
            border-radius: 99px;
        }

        .staldia-consultants-modals-section .staldia-consultant-card-content::-webkit-scrollbar-thumb {
            background: var(--color-accent);
            background-clip: padding-box;
            border-radius: 99px;
            min-height: 40px;
        }
        .staldia-consultants-modals-section .staldia-consultant-card-content::-webkit-scrollbar-button {
            display: none;
            width: 0;
            height: 0;
        }
        .staldia-consultants-modals-section .staldia-consultant-card-header,
        .staldia-consultants-modals-section .staldia-consultant-figure {
            margin-inline: 0;
        }
        .staldia-consultants-modals-section .staldia-consultant-figure {
            grid-column: 1;
            grid-row: 1;
            align-self: start;
        }
        .staldia-consultants-modals-section .staldia-consultant-card-header {
            grid-column: 1;
            grid-row: 2;
            align-self: start;
            order: 0;
        }
        .staldia-consultants-modal-container {
            grid-column: 2;
            grid-row: 1 / span 2;
            align-self: start;
            padding-inline: var(--layout-padding-horizontal-base);
            margin-top: 0;
        }
        .staldia-consultants-controller {
            position: absolute;
            width: calc(100% + 150px);
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            justify-content: space-between;
            z-index: -1;
        }
        .staldia-consultant-modal-close {
            top: 20px;
            right: 20px;
        }
        #staldia-consultant-modal-toggle:checked ~ .staldia-consultants-modal-close-bg {
            opacity: .95;
        }
    }
    @media (min-width: 900px) and (min-height: 605px) {
        .staldia-consultants-modals-section .staldia-consultant-figure,
        .staldia-consultants-modals-section .staldia-consultant-card-header {
            position: sticky;
            top: 0;
        }
        .staldia-consultants-modals-section .staldia-consultant-card-header {
            top: calc(240px + 1rem);
        }
    }
}
@layer override {
    .staldia-consultants-modals-section .staldia-consultant-card {
        position: fixed;
    }
}