@font-face {
        font-family: spottaCardFont;
        src: url('https://content.jorte.com/api/v1/files/font/preset/JorteGothic.woff2') format('woff'), url('https://content.jorte.com/api/v1/files/font/preset/JorteGothic.ttf') format('truetype');
        font-display: swap;
    }
    body, body *, option {
        font-family: spottaCardFont, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, sans-serif;
    }


:root {
    --scs-background: #000000ff;
    --scs-background_light: #0000007f;
    --scs-background_lighter: #0000003f;
    --scs-background_lightest: #0000001f;
}
.scs-background_bg {
    background-color: #000000ff;
}
.scs-background_bg_f {
    background-color: #000000ff!important;
}
.scs-background_bg_light {
    background-color: #0000007f;
}
.scs-background_bg_light_f {
    background-color: #0000007f!important;
}
.scs-background_bg_lighter {
    background-color: #0000003f;
}
.scs-background_bg_lighter_f {
    background-color: #0000003f!important;
}
.scs-background_bg_lightest {
    background-color: #0000001f;
}
.scs-background_bg_lightest_f {
    background-color: #0000001f!important;
}
.scs-background_fore {
    color: #000000ff;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_f {
    color: #000000ff!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_light {
    color: #0000007f;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_light_f {
    color: #0000007f!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lighter {
    color: #0000003f;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lighter_f {
    color: #0000003f!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lightest {
    color: #0000001f;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lightest_f {
    color: #0000001f!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_border {
    border-color: #000000ff;
}
.scs-background_border_f {
    border-color: #000000ff!important;
}
.scs-background_border_light {
    border-color: #0000007f;
}
.scs-background_border_light_f {
    border-color: #0000007f!important;
}
.scs-background_border_lighter {
    border-color: #0000003f;
}
.scs-background_border_lighter_f {
    border-color: #0000003f!important;
}
.scs-background_border_lightest {
    border-color: #0000001f;
}
.scs-background_border_lightest_f {
    border-color: #0000001f!important;
}

:root {
    --scs-headline: #000000ff;
    --scs-headline_light: #0000007f;
    --scs-headline_lighter: #0000003f;
    --scs-headline_lightest: #0000001f;
}
.scs-headline_bg {
    background-color: #000000ff;
}
.scs-headline_bg_f {
    background-color: #000000ff!important;
}
.scs-headline_bg_light {
    background-color: #0000007f;
}
.scs-headline_bg_light_f {
    background-color: #0000007f!important;
}
.scs-headline_bg_lighter {
    background-color: #0000003f;
}
.scs-headline_bg_lighter_f {
    background-color: #0000003f!important;
}
.scs-headline_bg_lightest {
    background-color: #0000001f;
}
.scs-headline_bg_lightest_f {
    background-color: #0000001f!important;
}
.scs-headline_fore {
    color: #000000ff;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_f {
    color: #000000ff!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_light {
    color: #0000007f;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_light_f {
    color: #0000007f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lighter {
    color: #0000003f;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lighter_f {
    color: #0000003f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lightest {
    color: #0000001f;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lightest_f {
    color: #0000001f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_border {
    border-color: #000000ff;
}
.scs-headline_border_f {
    border-color: #000000ff!important;
}
.scs-headline_border_light {
    border-color: #0000007f;
}
.scs-headline_border_light_f {
    border-color: #0000007f!important;
}
.scs-headline_border_lighter {
    border-color: #0000003f;
}
.scs-headline_border_lighter_f {
    border-color: #0000003f!important;
}
.scs-headline_border_lightest {
    border-color: #0000001f;
}
.scs-headline_border_lightest_f {
    border-color: #0000001f!important;
}

:root {
    --scs-headline-text: #ffffffff;
    --scs-headline-text_light: #ffffff7f;
    --scs-headline-text_lighter: #ffffff3f;
    --scs-headline-text_lightest: #ffffff1f;
}
.scs-headline-text_bg {
    background-color: #ffffffff;
}
.scs-headline-text_bg_f {
    background-color: #ffffffff!important;
}
.scs-headline-text_bg_light {
    background-color: #ffffff7f;
}
.scs-headline-text_bg_light_f {
    background-color: #ffffff7f!important;
}
.scs-headline-text_bg_lighter {
    background-color: #ffffff3f;
}
.scs-headline-text_bg_lighter_f {
    background-color: #ffffff3f!important;
}
.scs-headline-text_bg_lightest {
    background-color: #ffffff1f;
}
.scs-headline-text_bg_lightest_f {
    background-color: #ffffff1f!important;
}
.scs-headline-text_fore {
    color: #ffffffff;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_f {
    color: #ffffffff!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_light {
    color: #ffffff7f;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_light_f {
    color: #ffffff7f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_lighter {
    color: #ffffff3f;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_lighter_f {
    color: #ffffff3f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_lightest {
    color: #ffffff1f;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_fore_lightest_f {
    color: #ffffff1f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline-text_border {
    border-color: #ffffffff;
}
.scs-headline-text_border_f {
    border-color: #ffffffff!important;
}
.scs-headline-text_border_light {
    border-color: #ffffff7f;
}
.scs-headline-text_border_light_f {
    border-color: #ffffff7f!important;
}
.scs-headline-text_border_lighter {
    border-color: #ffffff3f;
}
.scs-headline-text_border_lighter_f {
    border-color: #ffffff3f!important;
}
.scs-headline-text_border_lightest {
    border-color: #ffffff1f;
}
.scs-headline-text_border_lightest_f {
    border-color: #ffffff1f!important;
}

:root {
    --scs-contents-background: #00254f99;
    --scs-contents-background_light: #00254f4c;
    --scs-contents-background_lighter: #00254f26;
    --scs-contents-background_lightest: #00254f13;
}
.scs-contents-background_bg {
    background-color: #00254f99;
}
.scs-contents-background_bg_f {
    background-color: #00254f99!important;
}
.scs-contents-background_bg_light {
    background-color: #00254f4c;
}
.scs-contents-background_bg_light_f {
    background-color: #00254f4c!important;
}
.scs-contents-background_bg_lighter {
    background-color: #00254f26;
}
.scs-contents-background_bg_lighter_f {
    background-color: #00254f26!important;
}
.scs-contents-background_bg_lightest {
    background-color: #00254f13;
}
.scs-contents-background_bg_lightest_f {
    background-color: #00254f13!important;
}
.scs-contents-background_fore {
    color: #00254f99;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_f {
    color: #00254f99!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_light {
    color: #00254f4c;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_light_f {
    color: #00254f4c!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lighter {
    color: #00254f26;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lighter_f {
    color: #00254f26!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lightest {
    color: #00254f13;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lightest_f {
    color: #00254f13!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_border {
    border-color: #00254f99;
}
.scs-contents-background_border_f {
    border-color: #00254f99!important;
}
.scs-contents-background_border_light {
    border-color: #00254f4c;
}
.scs-contents-background_border_light_f {
    border-color: #00254f4c!important;
}
.scs-contents-background_border_lighter {
    border-color: #00254f26;
}
.scs-contents-background_border_lighter_f {
    border-color: #00254f26!important;
}
.scs-contents-background_border_lightest {
    border-color: #00254f13;
}
.scs-contents-background_border_lightest_f {
    border-color: #00254f13!important;
}
.scs-contents-background_text-bordering {
    
    text-shadow:
         2px 2px  2px #00254f99, -2px -2px  2px #00254f99,
        -2px 2px  2px #00254f99,  2px -2px  2px #00254f99,
         2px 0          2px #00254f99, -2px -0          2px #00254f99,
         0         2px  2px #00254f99,  0         -2px  2px #00254f99;

}

:root {
    --scs-text: #ebebebff;
    --scs-text_light: #ebebeb7f;
    --scs-text_lighter: #ebebeb3f;
    --scs-text_lightest: #ebebeb1f;
}
.scs-text_bg {
    background-color: #ebebebff;
}
.scs-text_bg_f {
    background-color: #ebebebff!important;
}
.scs-text_bg_light {
    background-color: #ebebeb7f;
}
.scs-text_bg_light_f {
    background-color: #ebebeb7f!important;
}
.scs-text_bg_lighter {
    background-color: #ebebeb3f;
}
.scs-text_bg_lighter_f {
    background-color: #ebebeb3f!important;
}
.scs-text_bg_lightest {
    background-color: #ebebeb1f;
}
.scs-text_bg_lightest_f {
    background-color: #ebebeb1f!important;
}
.scs-text_fore {
    color: #ebebebff;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_f {
    color: #ebebebff!important;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_light {
    color: #ebebeb7f;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_light_f {
    color: #ebebeb7f!important;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_lighter {
    color: #ebebeb3f;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_lighter_f {
    color: #ebebeb3f!important;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_lightest {
    color: #ebebeb1f;
    text-shadow: 0 0 0.5px;
}
.scs-text_fore_lightest_f {
    color: #ebebeb1f!important;
    text-shadow: 0 0 0.5px;
}
.scs-text_border {
    border-color: #ebebebff;
}
.scs-text_border_f {
    border-color: #ebebebff!important;
}
.scs-text_border_light {
    border-color: #ebebeb7f;
}
.scs-text_border_light_f {
    border-color: #ebebeb7f!important;
}
.scs-text_border_lighter {
    border-color: #ebebeb3f;
}
.scs-text_border_lighter_f {
    border-color: #ebebeb3f!important;
}
.scs-text_border_lightest {
    border-color: #ebebeb1f;
}
.scs-text_border_lightest_f {
    border-color: #ebebeb1f!important;
}

:root {
    --scs-link-text: #ebebebff;
    --scs-link-text_light: #ebebeb7f;
    --scs-link-text_lighter: #ebebeb3f;
    --scs-link-text_lightest: #ebebeb1f;
}
.scs-link-text_bg {
    background-color: #ebebebff;
}
.scs-link-text_bg_f {
    background-color: #ebebebff!important;
}
.scs-link-text_bg_light {
    background-color: #ebebeb7f;
}
.scs-link-text_bg_light_f {
    background-color: #ebebeb7f!important;
}
.scs-link-text_bg_lighter {
    background-color: #ebebeb3f;
}
.scs-link-text_bg_lighter_f {
    background-color: #ebebeb3f!important;
}
.scs-link-text_bg_lightest {
    background-color: #ebebeb1f;
}
.scs-link-text_bg_lightest_f {
    background-color: #ebebeb1f!important;
}
.scs-link-text_fore {
    color: #ebebebff;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_f {
    color: #ebebebff!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_light {
    color: #ebebeb7f;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_light_f {
    color: #ebebeb7f!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lighter {
    color: #ebebeb3f;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lighter_f {
    color: #ebebeb3f!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lightest {
    color: #ebebeb1f;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lightest_f {
    color: #ebebeb1f!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_border {
    border-color: #ebebebff;
}
.scs-link-text_border_f {
    border-color: #ebebebff!important;
}
.scs-link-text_border_light {
    border-color: #ebebeb7f;
}
.scs-link-text_border_light_f {
    border-color: #ebebeb7f!important;
}
.scs-link-text_border_lighter {
    border-color: #ebebeb3f;
}
.scs-link-text_border_lighter_f {
    border-color: #ebebeb3f!important;
}
.scs-link-text_border_lightest {
    border-color: #ebebeb1f;
}
.scs-link-text_border_lightest_f {
    border-color: #ebebeb1f!important;
}

:root {
    --scs-error-text: #e61e64ff;
    --scs-error-text_light: #e61e647f;
    --scs-error-text_lighter: #e61e643f;
    --scs-error-text_lightest: #e61e641f;
}
.scs-error-text_bg {
    background-color: #e61e64ff;
}
.scs-error-text_bg_f {
    background-color: #e61e64ff!important;
}
.scs-error-text_bg_light {
    background-color: #e61e647f;
}
.scs-error-text_bg_light_f {
    background-color: #e61e647f!important;
}
.scs-error-text_bg_lighter {
    background-color: #e61e643f;
}
.scs-error-text_bg_lighter_f {
    background-color: #e61e643f!important;
}
.scs-error-text_bg_lightest {
    background-color: #e61e641f;
}
.scs-error-text_bg_lightest_f {
    background-color: #e61e641f!important;
}
.scs-error-text_fore {
    color: #e61e64ff;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_f {
    color: #e61e64ff!important;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_light {
    color: #e61e647f;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_light_f {
    color: #e61e647f!important;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_lighter {
    color: #e61e643f;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_lighter_f {
    color: #e61e643f!important;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_lightest {
    color: #e61e641f;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_fore_lightest_f {
    color: #e61e641f!important;
    text-shadow: 0 0 0.5px;
}
.scs-error-text_border {
    border-color: #e61e64ff;
}
.scs-error-text_border_f {
    border-color: #e61e64ff!important;
}
.scs-error-text_border_light {
    border-color: #e61e647f;
}
.scs-error-text_border_light_f {
    border-color: #e61e647f!important;
}
.scs-error-text_border_lighter {
    border-color: #e61e643f;
}
.scs-error-text_border_lighter_f {
    border-color: #e61e643f!important;
}
.scs-error-text_border_lightest {
    border-color: #e61e641f;
}
.scs-error-text_border_lightest_f {
    border-color: #e61e641f!important;
}

:root {
    --scs-button-basic-normal-background: #fffcfaff;
    --scs-button-basic-normal-text: #606060ff;
    --scs-button-basic-normal-border: #606060ff;
    --scs-button-basic-active-background: #c8c8c8ff;
    --scs-button-basic-active-text: #ffffffff;
    --scs-button-basic-active-border: #606060ff;
}
.scs-button-basic {
    background-color: #fffcfaff;
    color: #606060ff;
    border-color: #606060ff;
    text-shadow: 0 0 0.5px;
}
.scs-button-basic:active {
    background-color: #c8c8c8ff;
    color: #ffffffff;
    border-color: #606060ff;
    text-shadow: 0 0 0.5px;
}

:root {
    --scs-button-action-normal-background: #3a72b2ff;
    --scs-button-action-normal-text: #f8f8f8ff;
    --scs-button-action-normal-border: #6e82dcff;
    --scs-button-action-active-background: #6acedeff;
    --scs-button-action-active-text: #0050ffff;
    --scs-button-action-active-border: #6e82dcff;
}
.scs-button-action {
    background-color: #3a72b2ff;
    color: #f8f8f8ff;
    border-color: #6e82dcff;
    text-shadow: 0 0 0.5px;
}
.scs-button-action:active {
    background-color: #6acedeff;
    color: #0050ffff;
    border-color: #6e82dcff;
    text-shadow: 0 0 0.5px;
}

:root {
    --scs-button-caution-normal-background: #b85454ff;
    --scs-button-caution-normal-text: #f8f8f8ff;
    --scs-button-caution-normal-border: #c88282ff;
    --scs-button-caution-active-background: #ffd9deff;
    --scs-button-caution-active-text: #ff3a11ff;
    --scs-button-caution-active-border: #c88282ff;
}
.scs-button-caution {
    background-color: #b85454ff;
    color: #f8f8f8ff;
    border-color: #c88282ff;
    text-shadow: 0 0 0.5px;
}
.scs-button-caution:active {
    background-color: #ffd9deff;
    color: #ff3a11ff;
    border-color: #c88282ff;
    text-shadow: 0 0 0.5px;
}


    
            body.scs-background-image::before {
                background: url('https://storage.jorte.com/api/v1/files/6375d39bdaf7bd1873449b26') no-repeat center;
                background-size: cover;
                content: '';
                display: block;
                position: fixed;
                top: 0;
                left: 50%;
                transform: translate(-50%, 0);
                z-index: -1;
                width: 100%;
                height: 100vh;
            }
        
    .scs-root-text {
        
    text-shadow:
         2px 2px  2px #00254f99, -2px -2px  2px #00254f99,
        -2px 2px  2px #00254f99,  2px -2px  2px #00254f99,
         2px 0          2px #00254f99, -2px -0          2px #00254f99,
         0         2px  2px #00254f99,  0         -2px  2px #00254f99;

    }
    .scs-root-icon {
        filter: 
    drop-shadow(0 0 2px #00254f99) drop-shadow(0 0 2px #00254f99) drop-shadow(0 0 2px #00254f99)
;
        opacity: 1!important;
    }