@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: #ede9ddff;
    --scs-background_light: #ede9dd7f;
    --scs-background_lighter: #ede9dd3f;
    --scs-background_lightest: #ede9dd1f;
}
.scs-background_bg {
    background-color: #ede9ddff;
}
.scs-background_bg_f {
    background-color: #ede9ddff!important;
}
.scs-background_bg_light {
    background-color: #ede9dd7f;
}
.scs-background_bg_light_f {
    background-color: #ede9dd7f!important;
}
.scs-background_bg_lighter {
    background-color: #ede9dd3f;
}
.scs-background_bg_lighter_f {
    background-color: #ede9dd3f!important;
}
.scs-background_bg_lightest {
    background-color: #ede9dd1f;
}
.scs-background_bg_lightest_f {
    background-color: #ede9dd1f!important;
}
.scs-background_fore {
    color: #ede9ddff;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_f {
    color: #ede9ddff!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_light {
    color: #ede9dd7f;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_light_f {
    color: #ede9dd7f!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lighter {
    color: #ede9dd3f;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lighter_f {
    color: #ede9dd3f!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lightest {
    color: #ede9dd1f;
    text-shadow: 0 0 0.5px;
}
.scs-background_fore_lightest_f {
    color: #ede9dd1f!important;
    text-shadow: 0 0 0.5px;
}
.scs-background_border {
    border-color: #ede9ddff;
}
.scs-background_border_f {
    border-color: #ede9ddff!important;
}
.scs-background_border_light {
    border-color: #ede9dd7f;
}
.scs-background_border_light_f {
    border-color: #ede9dd7f!important;
}
.scs-background_border_lighter {
    border-color: #ede9dd3f;
}
.scs-background_border_lighter_f {
    border-color: #ede9dd3f!important;
}
.scs-background_border_lightest {
    border-color: #ede9dd1f;
}
.scs-background_border_lightest_f {
    border-color: #ede9dd1f!important;
}

:root {
    --scs-headline: #335e67ff;
    --scs-headline_light: #335e677f;
    --scs-headline_lighter: #335e673f;
    --scs-headline_lightest: #335e671f;
}
.scs-headline_bg {
    background-color: #335e67ff;
}
.scs-headline_bg_f {
    background-color: #335e67ff!important;
}
.scs-headline_bg_light {
    background-color: #335e677f;
}
.scs-headline_bg_light_f {
    background-color: #335e677f!important;
}
.scs-headline_bg_lighter {
    background-color: #335e673f;
}
.scs-headline_bg_lighter_f {
    background-color: #335e673f!important;
}
.scs-headline_bg_lightest {
    background-color: #335e671f;
}
.scs-headline_bg_lightest_f {
    background-color: #335e671f!important;
}
.scs-headline_fore {
    color: #335e67ff;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_f {
    color: #335e67ff!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_light {
    color: #335e677f;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_light_f {
    color: #335e677f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lighter {
    color: #335e673f;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lighter_f {
    color: #335e673f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lightest {
    color: #335e671f;
    text-shadow: 0 0 0.5px;
}
.scs-headline_fore_lightest_f {
    color: #335e671f!important;
    text-shadow: 0 0 0.5px;
}
.scs-headline_border {
    border-color: #335e67ff;
}
.scs-headline_border_f {
    border-color: #335e67ff!important;
}
.scs-headline_border_light {
    border-color: #335e677f;
}
.scs-headline_border_light_f {
    border-color: #335e677f!important;
}
.scs-headline_border_lighter {
    border-color: #335e673f;
}
.scs-headline_border_lighter_f {
    border-color: #335e673f!important;
}
.scs-headline_border_lightest {
    border-color: #335e671f;
}
.scs-headline_border_lightest_f {
    border-color: #335e671f!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: #ffffffff;
    --scs-contents-background_light: #ffffff7f;
    --scs-contents-background_lighter: #ffffff3f;
    --scs-contents-background_lightest: #ffffff1f;
}
.scs-contents-background_bg {
    background-color: #ffffffff;
}
.scs-contents-background_bg_f {
    background-color: #ffffffff!important;
}
.scs-contents-background_bg_light {
    background-color: #ffffff7f;
}
.scs-contents-background_bg_light_f {
    background-color: #ffffff7f!important;
}
.scs-contents-background_bg_lighter {
    background-color: #ffffff3f;
}
.scs-contents-background_bg_lighter_f {
    background-color: #ffffff3f!important;
}
.scs-contents-background_bg_lightest {
    background-color: #ffffff1f;
}
.scs-contents-background_bg_lightest_f {
    background-color: #ffffff1f!important;
}
.scs-contents-background_fore {
    color: #ffffffff;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_f {
    color: #ffffffff!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_light {
    color: #ffffff7f;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_light_f {
    color: #ffffff7f!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lighter {
    color: #ffffff3f;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lighter_f {
    color: #ffffff3f!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lightest {
    color: #ffffff1f;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_fore_lightest_f {
    color: #ffffff1f!important;
    text-shadow: 0 0 0.5px;
}
.scs-contents-background_border {
    border-color: #ffffffff;
}
.scs-contents-background_border_f {
    border-color: #ffffffff!important;
}
.scs-contents-background_border_light {
    border-color: #ffffff7f;
}
.scs-contents-background_border_light_f {
    border-color: #ffffff7f!important;
}
.scs-contents-background_border_lighter {
    border-color: #ffffff3f;
}
.scs-contents-background_border_lighter_f {
    border-color: #ffffff3f!important;
}
.scs-contents-background_border_lightest {
    border-color: #ffffff1f;
}
.scs-contents-background_border_lightest_f {
    border-color: #ffffff1f!important;
}
.scs-contents-background_text-bordering {
    
    text-shadow:
         2px 2px  2px #ffffffff, -2px -2px  2px #ffffffff,
        -2px 2px  2px #ffffffff,  2px -2px  2px #ffffffff,
         2px 0          2px #ffffffff, -2px -0          2px #ffffffff,
         0         2px  2px #ffffffff,  0         -2px  2px #ffffffff;

}

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

:root {
    --scs-link-text: #3f74aaff;
    --scs-link-text_light: #3f74aa7f;
    --scs-link-text_lighter: #3f74aa3f;
    --scs-link-text_lightest: #3f74aa1f;
}
.scs-link-text_bg {
    background-color: #3f74aaff;
}
.scs-link-text_bg_f {
    background-color: #3f74aaff!important;
}
.scs-link-text_bg_light {
    background-color: #3f74aa7f;
}
.scs-link-text_bg_light_f {
    background-color: #3f74aa7f!important;
}
.scs-link-text_bg_lighter {
    background-color: #3f74aa3f;
}
.scs-link-text_bg_lighter_f {
    background-color: #3f74aa3f!important;
}
.scs-link-text_bg_lightest {
    background-color: #3f74aa1f;
}
.scs-link-text_bg_lightest_f {
    background-color: #3f74aa1f!important;
}
.scs-link-text_fore {
    color: #3f74aaff;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_f {
    color: #3f74aaff!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_light {
    color: #3f74aa7f;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_light_f {
    color: #3f74aa7f!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lighter {
    color: #3f74aa3f;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lighter_f {
    color: #3f74aa3f!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lightest {
    color: #3f74aa1f;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_fore_lightest_f {
    color: #3f74aa1f!important;
    text-shadow: 0 0 0.5px;
}
.scs-link-text_border {
    border-color: #3f74aaff;
}
.scs-link-text_border_f {
    border-color: #3f74aaff!important;
}
.scs-link-text_border_light {
    border-color: #3f74aa7f;
}
.scs-link-text_border_light_f {
    border-color: #3f74aa7f!important;
}
.scs-link-text_border_lighter {
    border-color: #3f74aa3f;
}
.scs-link-text_border_lighter_f {
    border-color: #3f74aa3f!important;
}
.scs-link-text_border_lightest {
    border-color: #3f74aa1f;
}
.scs-link-text_border_lightest_f {
    border-color: #3f74aa1f!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;
}