@charset "UTF-8";
body {
    font: var(--SiteFS, 12px) / 1.5 var(--SiteFF2), Arial, sans-serif;
    font-weight: 600;
    margin: 0;
    background: var(--body-background-color, hsl(0 0% 97%));
    color: var(--body-text-color, rgba(0 0 0/75%));
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
}
input,
select,
textarea {
    font-size: 1em;
    color: var(—color);
    /* color: #555; */
    font-family: var(--SiteFF2);
    font-weight: 600;
}
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul {
    margin: 0;
}
h1,
h2,
h3 {
    font-family: var(--SiteFF);
    font-weight: 600;
}
menu,
ol,
ul {
    padding-inline-start: 0;
}
li {
    list-style-type: none;
}
dd,
dl,
form,
menu {
    margin: 0;
}
a img {
    border: none;
}
a {
    /* color: var(--SiteTHM); */
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    outline: 0;
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 200;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-200.woff) format("woff");
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-300.woff) format("woff");
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-400.woff) format("woff");
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-500.woff) format("woff");
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-600.woff) format("woff");
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-700.woff) format("woff");
}
@font-face {
    font-family: Manrope;
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url(../font/manrope.woff2) format("woff2"),
        url(../font/manrope/font-800.woff) format("woff");
}
@supports (font-variation-settings: normal) {
    @font-face {
        font-family: Manrope;
        src: url(../font/manrope.woff2) format("woff2 supports variations"),
            url(../font/manrope.woff2) format("woff2-variations");
        font-weight: 200 800;
        font-stretch: 25% 151%;
        font-style: normal;
        font-display: swap;
    }
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 100;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/100.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 200;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/200.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 300;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/300.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 400;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/400.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 500;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/500.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 600;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/600.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 700;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/700.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 800;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/800.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Noto Sans Arabic";
    font-style: normal;
    font-weight: 900;
    font-stretch: 100%;
    font-display: swap;
    src: url(../font/notosansarabic.woff2) format("woff2"),
        url(../font/notosansarabic/900.woff) format("woff");
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41,
        U+FB50-FDFF, U+FE80-FEFC, U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC,
        U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
        U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
    --CPT-THM-R: 30;
    --CPT-THM-G: 144;
    --CPT-THM-B: 255;
    --CPT-THM-H: 16;
    --CPT-THM-S: 100%;
    --CPT-THM-L: 50%;
    --CPT-BDR: calc(var(--CPT-FS) * 1.5);
    --CPT-TST: var(--SiteTST);
    --CPT-FF: "Manrope", "Arial", "PingFang", system-ui, sans-serif;
    --SiteTHM: var(--CPT-THM);
    --SiteTHM-A0: rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B) / 0);
    --SiteTHM-A5: rgba(var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B) / 5%);
    --SiteTHM-A10: rgba(
        var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B) / 10%
    );
    --SiteTHM-A25: rgba(
        var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B) / 25%
    );
    --SiteTHM-A50: rgba(
        var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B) / 50%
    );
    --SiteTHM-A75: rgba(
        var(--CPT-THM-R) var(--CPT-THM-G) var(--CPT-THM-B) / 75%
    );
    --SiteTST: all ease 0.2s;
    --IconFF: var(--IconFF3);
    --background-color-warning: rgba(255 255 0/10%);
    --text-color-warning: rgba(255 255 0);
    --background-color-alert: rgba(255 50 50/25%);
    --text-color-alert: rgba(255 70 70);
    --background-color-complete: rgba(0 128 0/10%);
    --text-color-complete: rgba(0 128 0);
    --background-color-promotion: rgba(0 128 0/10%);
    --text-color-promotion: rgba(0 128 0);
}
.btw {
    --font-weight: 800;
}
[color="theme"] {
    --r: var(--CPT-THM-R);
    --g: var(--CPT-THM-G);
    --b: var(--CPT-THM-B);
}
:root {
    --font-family-heading-1: "Manrope";
    --font-family-content-1: "Manrope";
    --SiteFF: "Arial", system-ui, sans-serif;
    --SiteFF2: "Arial", system-ui, sans-serif;
}
body {
    --VWX: calc(var(--VW) * 1px);
    --VHX: calc(var(--VH) * 1px);
    --VWidth: var(--VWX, 100vw);
    --VHeight: var(--VHX, 100vh);
}
@supports (width: 100dvw) {
    body {
        --VWidth: min(100dvw, var(--VWX, 100vw));
        --VHeight: min(100dvh, var(--VHX, 100vh));
    }
}
body {
    --MaxContentWidth: 120em;
}
@media only screen and (max-width: 1440px) {
    body {
        --MaxContentWidth: 106.666667em;
    }
}
@media only screen and (max-width: 1280px) {
    body {
        --MaxContentWidth: 83.333334em;
    }
}
@media only screen and (max-width: 1000px) {
    body {
        --MaxContentWidth: 100%;
    }
}
[class*="cpt-"]
    > input:not([type="checkbox"], [type="radio"], [type="range"]):first-child,
[class*="cpt-"] > textarea {
    padding-inline-start: calc(var(--CPT-INPTPD) * 1.5);
    padding-inline-end: calc(var(--CPT-INPTPD) * 1.5);
}
[class*="cpt-"] > select:first-child {
    padding-inline-start: calc(var(--CPT-INPTPD) * 1.5);
}
.cpt-select::after {
    margin-inline-end: 1em;
}
.cpt-select option {
    color: var(--body-text-color);
    background: var(--background-color-L1);
}
.cpt-checkbox > span::before {
    border-color: var(--body-text-color-a25, rgba(0 0 0/25%));
    border-radius: 0.333334em;
}
[lang*="ar"] {
    direction: rtl;
    --inline-start: right;
    --inline-end: left;
    --translate-reverse: -1;
    --angle-reverse: -1;
    --font-family-heading-1: "Manrope", "Noto Sans Arabic";
    --font-family-content-1: "Manrope", "Noto Sans Arabic";
    --CPT-FF: "Manrope", "Noto Sans Arabic", "Arial", system-ui, sans-serif;
}
[lang*="ar"] [icon-only="arrow_back"]::before,
[lang*="ar"] [icon-only="arrow_circle_left"]::before,
[lang*="ar"] [icon-only="arrow_circle_right"]::before,
[lang*="ar"] [icon-only="arrow_forward"]::before,
[lang*="ar"] [icon-only="chevron_left"]::before,
[lang*="ar"] [icon-only="chevron_right"]::before,
[lang*="ar"] [icon-only="logout"]::before,
[lang*="ar"] [icon-only="navigate_before"]::before,
[lang*="ar"] [icon-only="navigate_next"]::before,
[lang*="ar"] [icon-only="search"]::before,
[lang*="ar"] [icon-only="send"]::before,
[lang*="ar"] [icon="arrow_back"]::before,
[lang*="ar"] [icon="arrow_circle_left"]::before,
[lang*="ar"] [icon="arrow_circle_right"]::before,
[lang*="ar"] [icon="arrow_forward"]::before,
[lang*="ar"] [icon="chevron_left"]::before,
[lang*="ar"] [icon="chevron_right"]::before,
[lang*="ar"] [icon="logout"]::before,
[lang*="ar"] [icon="navigate_before"]::before,
[lang*="ar"] [icon="navigate_next"]::before,
[lang*="ar"] [icon="search"]::before,
[lang*="ar"] [icon="send"]::before,
[lang*="ar"] [icon="sort"]::before {
    transform: scaleX(-1);
}
body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-width: 320px;
    min-height: var(--VHeight);
}
#content {
    flex: auto;
}
#content > .inner {
    margin: 0 auto;
    max-width: var(--MaxContentWidth);
    padding: 0 2em;
    box-sizing: border-box;
}
#site_header {
    background: var(--background-color-L2, #fff);
    position: sticky;
    top: calc(var(--global-nav-height) * -1px);
    z-index: 9;
}
#site_header.float {
    box-shadow: rgba(0 0 0/5%) 0 0 1em;
}
#global_nav {
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 -1px 0 inset;
}
#global_nav > .inner {
    margin: 0 auto;
    max-width: var(--MaxContentWidth);
    min-height: 4em;
    padding: 0 2em;
    box-sizing: border-box;
    position: relative;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 4em;
}
#global_nav > .inner > .global_nav_ctrl {
    display: none;
}
#global_nav .nav > .inner {
    display: flex;
    align-items: center;
    column-gap: 2em;
    flex-wrap: wrap;
    height: 1.5em;
    overflow: hidden;
}
#global_nav .nav > .inner > a {
    display: block;
    color: currentColor;
}
#global_nav .nav > .inner > a:hover {
    text-decoration: underline;
    opacity: 1;
}
#global_nav .nav > .inner > a > span::before {
    display: none;
}
#global_nav .settings {
    display: flex;
    gap: 2em;
    align-items: center;
}
#global_nav .language_currency {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75em;
    align-items: center;
    color: currentColor;
    padding: 0.75em 0;
    white-space: nowrap;
    cursor: pointer;
}
#global_nav .language_currency::before {
    --h: 1.5em;
}
#global_nav .language_currency > span {
    display: flex;
    align-items: center;
}
#global_nav .language_currency > span > b {
    font-weight: 800;
}
#global_nav .language_currency > span > b ~ b::before {
    content: "/";
    display: inline-block;
    vertical-align: top;
    margin: 0 0.25em;
    opacity: 0.25;
}
#global_nav .download_app {
    display: block;
    border-radius: 2em;
    background-color: var(--body-text-color-a5, rgba(0 0 0/0%));
    color: currentColor;
    white-space: nowrap;
    padding: 0.25em 1em;
    padding-inline-start: 0.5em;
    transition: background 0.3s, color 0.3s;
}
#global_nav .download_app:hover {
    background: var(--SiteTHM);
    color: #fff;
}
#global_nav .download_app > span {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.5em;
    align-items: center;
    font-weight: 800;
    text-transform: uppercase;
}
#global_nav .download_app > span::before {
    content: attr(icon);
    display: block;
    font-size: 1.5em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
}
@media only screen and (max-width: 1000px) {
    #global_nav > .inner {
        padding: 0 1.5em;
        gap: 0 2em;
    }
    #global_nav > .inner > .global_nav_ctrl {
        display: block;
        width: 3em;
        height: 3em;
        padding: 0.75em;
        margin: 0.5em 0;
        box-sizing: border-box;
    }
    #global_nav > .inner > .global_nav_ctrl::before {
        content: attr(icon);
        display: block;
        font-size: 1.5em;
        width: 1em;
        height: 1em;
        line-height: 1;
        overflow: hidden;
        opacity: 0.5;
    }
    #global_nav > .inner > .global_nav_ctrl.on::before {
        content: "close";
        opacity: 1;
        transform: rotate(270deg);
        transition: 0.3s;
    }
    #global_nav .nav {
        display: none;
        grid-area: 2/1/3/3;
        position: relative;
    }
    #global_nav .nav.show {
        display: block;
    }
    #global_nav .nav::before {
        content: "";
        display: block;
        background: var(--background-color-L3, hsl(0 0% 97%));
        width: 1em;
        height: 1em;
        position: absolute;
        inset-block: 0;
        inset-inline-start: 0;
        z-index: 2;
        margin: -0.25em 1em 0;
        transform: rotate(45deg);
    }
    #global_nav .nav > .inner {
        column-gap: 1.5em;
        height: auto;
        margin: 0 -1.5em;
        padding: 1.5em 2em;
        background: var(--background-color-L3, hsl(0 0% 97%));
    }
    #global_nav .nav > .inner > a {
        padding: 0.5em 0;
        text-decoration: none !important;
    }
    #global_nav .nav > .inner > a > span {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 1em;
        align-items: center;
        opacity: unset;
    }
    .light #global_nav .nav > .inner > a > span .dark-image {
        display: grid !important;
    }
    .dark #global_nav .nav > .inner > a > span .light-image {
        display: grid !important;
    }
    #global_nav .nav > .inner > a > span::before {
        display: block;
        font-size: 2em;
        width: 1em;
        height: 1em;
        line-height: 1;
        overflow: hidden;
    }
    #global_nav .nav > .inner > a > span[icon]::before {
        content: attr(icon);
    }
    #global_nav .download_app {
        padding: 0.25em;
    }
    #global_nav .download_app > span {
        display: block;
        width: 1.5em;
        height: 1.5em;
        overflow: hidden;
    }
}
@media only screen and (max-width: 480px) {
    #global_nav > .inner {
        padding: 0 1em;
    }
    #global_nav .nav > .inner {
        margin: 0 -1em;
        padding: 1.5em;
    }
}
#nav_logo a {
    display: block;
    color: currentColor;
}
#nav_logo svg {
    vertical-align: top;
    --h: 1.666667em;
    height: var(--h);
    width: calc(104 / 24 * var(--h));
}
#nav_logo svg circle {
    transform-origin: 50%;
    opacity: 0;
    fill: var(--SiteTHM);
}
@media (hover: hover) {
    #nav_logo a:hover svg circle {
        animation: logo_wave ease-out 1s 1 forwards;
    }
}
@keyframes logo_wave {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(1.2);
    }
}
#nav_zone > li > a {
    display: block;
    color: currentColor;
    text-transform: uppercase;
    font-weight: 800;
    padding: 0.75em 1.75em;
    border-radius: 3em;
    transition: background 0.3s;
    outline: 0;
}
#nav_zone > li > a > span {
    display: block;
    white-space: nowrap;
}
#nav_zone .dropmenu {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));
    column-gap: 2em;
}
#nav_zone .dropmenu a {
    display: block;
    color: currentColor;
}
#nav_zone .dropmenu span {
    display: grid;
    grid-template-columns: 2.5em 1fr;
    align-items: center;
    gap: 1em;
    height: 3em;
}
#nav_zone .dropmenu span::before {
    display: block;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
    margin: 0 auto;
}
#nav_zone .dropmenu span[data-platform]::before {
    content: "";
    font-size: 2em;
    background-image: url(../image/platform_icons-ed9f794459.svg);
    background-repeat: no-repeat;
    background-size: 10em 5em;
    background-position: calc((var(--x, 10) - 1) * -1em)
        calc((var(--y, 5) - 1) * -1em);
    opacity: 0.5;
    filter: brightness(var(--brightness-filter, 0));
}
#nav_zone .dropmenu span[data-category-icon]::before {
    content: "";
    font-size: 2em;
    background-image: url(../image/category_icons-bda5098a45.svg);
    background-repeat: no-repeat;
    background-size: 10em 5em;
    background-position: calc((var(--x, 10) - 1) * -1em)
        calc((var(--y, 5) - 1) * -1em);
}
#nav_zone .dropmenu span > b {
    display: block;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#main_nav .menu {
    display: flex;
    justify-content: flex-end;
    gap: 2em;
    align-items: center;
    position: relative;
}
#main_nav .search > .btw {
    display: none;
}
#header_search {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    width: 25em;
}
#header_search:not(:focus-within) {
    background-color: var(--body-text-color-a5, rgba(0 0 0/3%));
    border-color: transparent;
}
#header_search > .btw {
    opacity: 0.5;
}
#site_header #login-btn {
    cursor: pointer;
}
#site_header #login-btn > span {
    /* display: block; */
    width: auto;
    height: auto;
    padding: 0.75em 0;
    font-weight: 800;
}
#site_header #headCart {
    display: block;
    color: currentColor;
    position: relative;
    cursor: pointer;
}
#site_header
    #headCart[data-cart-counter]:not(
        [data-cart-counter=""],
        [data-cart-counter="0"]
    )::after {
    content: attr(data-cart-counter);
    display: block;
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    z-index: 1;
    background: var(--background-color-L2, #fff);
    min-width: 1.5em;
    height: 1.5em;
    line-height: 1.5;
    text-align: center;
    font-weight: 800;
    border-radius: 2em;
    padding: 0 0.25em;
    box-sizing: border-box;
    transform-origin: var(--inline-end, right) top;
    transform: scale(0.777778);
    box-shadow: var(--body-text-color-a25, rgba(0 0 0/10%)) 0 0 0 1px inset,
        var(--background-color-L2, #fff) 0 0 0 0.25em;
}
#site_header #headCart > span {
    display: block;
    width: 3em;
    height: 3em;
    overflow: hidden;
}
#site_header #headCart > span::before {
    content: attr(icon);
    display: block;
    font-size: 2em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
    margin: 0.25em;
}
#site_header #user-btn {
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
#site_header #user-btn > .avatar {
    width: 2.5em;
    height: 2.5em;
    margin: 0.25em;
    border-radius: 100%;
    overflow: hidden;
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    box-shadow: var(--body-text-color-a10, rgba(0 0 0/5%)) 0 0 0 0.25em;
}
#site_header #user-btn > .avatar > img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}
#site_header
    #user-btn[data-msg-counter]:not(
        [data-msg-counter=""],
        [data-msg-counter="0"]
    )::after {
    content: attr(data-msg-counter);
    display: block;
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    z-index: 1;
    background: var(--SiteTHM);
    color: var(--background-color-L2, #fff);
    min-width: 1.5em;
    max-width: 3em;
    height: 1.5em;
    line-height: 1.5;
    text-align: center;
    font-weight: 800;
    border-radius: 2em;
    padding: 0 0.25em;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transform-origin: var(--inline-end, right) top;
    transform: scale(0.777778);
    box-shadow: var(--background-color-L2, #fff) 0 0 0 0.25em;
}
#user_dropdown .user_menu_info {
    display: grid;
    grid-template-columns: 3em calc(100% - 4em);
    align-items: center;
    gap: 1em;
    padding-block-end: 2em;
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 1px 0;
    color: currentColor;
}
#user_dropdown .user_menu_info .avatar {
    width: 3em;
    height: 3em;
    border-radius: 100%;
    overflow: hidden;
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    box-shadow: var(--body-text-color-a10, rgba(0 0 0/5%)) 0 0 0 1px;
}
#user_dropdown .user_menu_info .avatar > img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}
#user_dropdown .user_menu_info .name > i,
#user_dropdown .user_menu_info .name > span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#user_dropdown .user_menu_info .name > span {
    font-weight: 800;
}
#user_dropdown .user_menu_info .name > i {
    font-style: normal;
    opacity: 0.5;
}
#user_dropdown .user_menu_info .func {
    display: none;
}
#user_dropdown .user_menu {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5em;
    padding-block-start: 2em;
}
#user_dropdown .user_menu > ul {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));
    gap: 0 2em;
}
#user_dropdown .user_menu a {
    color: currentColor;
    text-decoration: none;
    display: grid;
    grid-template-columns: 3em 1fr;
    align-items: center;
    gap: 1em;
    padding: 0.5em 0;
}
#user_dropdown .user_menu a::before {
    content: attr(icon);
    display: block;
    font-size: 2em;
    width: 1em;
    height: 1em;
    line-height: 1;
    margin-inline: auto;
    overflow: hidden;
}
#user_dropdown
    .user_menu
    a[data-msg-counter]:not([data-msg-counter=""], [data-msg-counter="0"]) {
    grid-template-columns: 3em 1fr auto;
}
#user_dropdown
    .user_menu
    a[data-msg-counter]:not(
        [data-msg-counter=""],
        [data-msg-counter="0"]
    )::after {
    content: attr(data-msg-counter);
    background: var(--SiteTHM);
    color: var(--background-color-L1, #fff);
    min-width: 1.5em;
    max-width: 3em;
    height: 1.5em;
    line-height: 1.5;
    text-align: center;
    font-weight: 800;
    border-radius: 2em;
    padding: 0 0.333334em;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    transform-origin: var(--inline-end, right) center;
    transform: scale(0.8);
}
#user_dropdown .user_menu a > span {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
#user_dropdown .welcome {
    text-align: center;
    margin: 0 1em;
}
#user_dropdown .welcome img {
    vertical-align: top;
    width: 100%;
    height: auto;
    max-width: 18em;
    aspect-ratio: 3/2;
    object-fit: contain;
}
#user_dropdown .welcome h3 {
    font-size: 1em;
    font-family: inherit;
    margin: 1.5em 0;
    font-weight: 400;
}
#user_dropdown .welcome .btc {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1em;
}
#user_dropdown .welcome .btc .btw {
    text-transform: uppercase;
    min-width: 8em;
}
@media only screen and (min-width: 1001px) {
    #site_header.float #main_nav > .inner {
        max-width: min(100%, 1920px);
        transition: max-width 0.3s;
    }
    #site_header.float #nav_logo svg {
        display: none;
    }
    #main_nav > .inner {
        margin: 0 auto;
        max-width: var(--MaxContentWidth);
        padding: 0 2em;
        height: 8em;
        box-sizing: border-box;
        position: relative;
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 2em;
        align-items: center;
    }
    #main_nav .nav > .inner {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
        gap: 2em;
    }
    #main_nav .user {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 2em;
    }
    #main_nav .nav_ctrl_off,
    #main_nav .nav_ctrl_on,
    #main_nav .user_dropdown_ctrl_off {
        display: none;
    }
    #nav_zone {
        display: flex;
        align-items: center;
        position: relative;
    }
    #nav_zone > li {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        border-radius: 3em;
        transition: background 0.3s;
    }
    #nav_zone > li:focus-within,
    #nav_zone > li:hover {
        background: var(--background-color-L1, rgba(0 0 0/5%));
    }
    #nav_zone > li > .dropmenu_ctrl {
        order: 9;
        border-radius: 3em;
        opacity: 0.5;
        cursor: pointer;
        margin-inline-end: 0.75em;
        transition: background 0.3s, color 0.3s, opacity 0.3s;
        -webkit-tap-highlight-color: transparent;
    }
    #nav_zone > li > .dropmenu_ctrl::before {
        content: "expand_more";
        display: block;
        font-size: 1.5em;
        width: 1em;
        height: 1em;
        line-height: 1;
        overflow: hidden;
    }
    #nav_zone > li > .dropmenu_ctrl.on {
        background: var(--body-text-color-a5, rgba(0 0 0/5%));
        opacity: 1;
    }
    #nav_zone > li > .dropmenu_ctrl:hover {
        background: var(--SiteTHM);
        color: #fff;
        opacity: 1;
    }
    #nav_zone > li > .dropmenu_ctrl ~ a {
        padding-inline-end: 0.75em;
    }
    #nav_zone .dropmenu {
        position: absolute;
        top: calc(100% + 1em);
        inset-inline-start: 0;
        z-index: 1;
        width: 100%;
        max-width: 40em;
        box-sizing: border-box;
        visibility: hidden;
        opacity: 0;
        transform: translateY(-1em);
        background: var(--background-color-L1, #fff);
        border-radius: 1em;
        box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
        padding: 2em;
    }
    #nav_zone .dropmenu.show {
        visibility: visible;
        opacity: 1;
        transform: none;
        transition: opacity 0.3s, transform 0.3s;
        display: grid !important;
    }
    #user_dropdown {
        position: absolute;
        z-index: 1;
        inset-inline-end: 0;
        top: calc(100% + 1em);
        width: 35em;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-1em);
    }
    #site_header #login-btn ~ #user_dropdown {
        width: 25em;
    }
    #user_dropdown.show {
        opacity: 1;
        visibility: visible;
        transform: none;
        transition: 0.3s;
    }
    #user_dropdown > .inner {
        background: var(--background-color-L1, #fff);
        border-radius: 1em;
        box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
        padding: 2em;
    }
    @media only screen and (max-width: 1280px) {
        #main_nav > .inner {
            height: 6em;
        }
        #nav_logo a {
            width: 2.5em;
            height: 2.5em;
        }
        #nav_logo svg {
            display: none;
        }
        #nav_zone > li > a {
            padding: 0.75em 1.5em;
        }
        #header_search {
            width: 15em;
        }
        #site_header #login-btn > span {
            width: 2em;
            height: 2em;
            overflow: hidden;
            padding: 0;
            margin: 0.75em;
        }
        #site_header #login-btn > span::before {
            content: attr(icon);
            font-size: 2em;
            width: 1em;
            height: 1em;
            line-height: 1;
            overflow: hidden;
        }
        #user_dropdown {
            width: 25em;
        }
    }
}
@media only screen and (max-width: 1000px) {
    #main_nav > .inner {
        height: 6em;
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 1.5em;
        align-items: center;
        padding: 0 1.5em;
    }
    #main_nav .menu {
        gap: 1.5em;
    }
    body.show_main_nav {
        overflow: hidden;
    }
    #main_nav .nav {
        position: fixed;
        inset: 0;
        z-index: 999;
        background: var(--background-color-mask-a75, rgba(255 255 255/75%));
        visibility: hidden;
        opacity: 0;
    }
    #main_nav .nav.show {
        opacity: 1;
        visibility: visible;
        transition: opacity 0.3s;
    }
    #main_nav .nav.show > .inner {
        margin-inline-start: 0;
        transition: margin-inline-start 0.3s;
    }
    #main_nav .nav > .nav_ctrl_off {
        position: absolute;
        inset: 0;
        z-index: -1;
    }
    #main_nav .nav > .inner {
        width: calc(100% - 5em);
        max-width: 25em;
        height: 100%;
        margin-inline-start: -2em;
        padding: 0;
        box-sizing: border-box;
        border-radius: 0;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        gap: 0;
        align-items: stretch;
        position: relative;
        background: var(--background-color-L1, #fff);
        box-shadow: rgba(0 0 0/10%) 0 0 2em;
    }
    #nav_logo {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
        padding: 1em 2em;
        box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 1px 0;
    }
    #nav_logo > .close {
        opacity: 0.5;
        margin-inline-end: -1em;
    }
    #nav_logo svg {
        --h: 1.333334em;
    }
    #nav_zone {
        display: flex;
        flex-direction: column;
        overflow: hidden;
        overflow-y: auto;
        padding: 1em;
    }
    #nav_zone > li {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
    }
    #nav_zone > li > .dropmenu_ctrl {
        padding: 0.75em;
        cursor: pointer;
    }
    #nav_zone > li > .dropmenu_ctrl::before {
        content: "expand_more";
        display: block;
        font-size: 1.5em;
        width: 1em;
        height: 1em;
        line-height: 1;
        overflow: hidden;
        opacity: 0.5;
    }
    #nav_zone > li > .dropmenu_ctrl.on::before {
        content: "close";
        transform: rotate(180deg);
        transition: 0.3s;
    }
    #nav_zone > li > a {
        padding: 0.75em 1em;
        order: -1;
    }
    #nav_zone > li > a > span {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 1.5em;
        align-items: center;
    }
    #nav_zone > li > a > span > span > img {
        display: grid !important;
    }
    #nav_zone .dropmenu {
        grid-column: span 2;
        padding: 0.75em 1em;
        margin-block: 1em;
        border-radius: 1em;
        background: var(--background-color-L3, rgba(0 0 0/5%));
        display: none;
    }
    #nav_zone .dropmenu.show {
        display: block;
    }
    #header_search {
        margin-inline-start: auto;
        width: 20em;
    }
    #main_nav .user {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 1.5em;
    }
    #site_header #headCart[data-cart-counter=""],
    #site_header #headCart[data-cart-counter="0"] {
        display: none;
    }
    #site_header #login-btn > span {
        width: 2em;
        height: 2em;
        overflow: hidden;
        padding: 0;
        margin: 0.5em;
    }
    #site_header #login-btn > span::before {
        content: attr(icon);
        font-size: 2em;
        width: 1em;
        height: 1em;
        line-height: 1;
        overflow: hidden;
    }
    body.show_user_dropdown {
        overflow: hidden;
    }
    #user_dropdown.show {
        visibility: visible;
        opacity: 1;
        transition: opacity 0.3s;
    }
    #user_dropdown.show > .inner {
        margin-inline-end: 0;
        transition: margin 0.3s;
    }
    #user_dropdown {
        position: fixed;
        inset: 0;
        z-index: 999;
        background: var(--background-color-mask-a75, rgba(255 255 255/75%));
        visibility: hidden;
        opacity: 0;
    }
    #user_dropdown > .user_dropdown_ctrl_off {
        position: absolute;
        inset: 0;
        z-index: -1;
    }
    #user_dropdown > .inner {
        width: calc(100% - 5em);
        max-width: 25em;
        height: 100%;
        margin-inline-start: auto;
        margin-inline-end: -2em;
        padding: 0;
        box-sizing: border-box;
        border-radius: 0;
        display: grid;
        grid-template-rows: auto 1fr;
        background: var(--background-color-L1, #fff);
        box-shadow: rgba(0 0 0/10%) 0 0 2em;
        position: relative;
    }
    #user_dropdown > .inner > .close {
        position: absolute;
        inset-block-start: 0;
        inset-inline-end: 0;
        z-index: 1;
        margin: 0.5em;
    }
    #user_dropdown .welcome {
        margin: 0;
        padding: 3em 2em;
        overflow: hidden;
        overflow-y: auto;
    }
    #user_dropdown .welcome .btc {
        flex-direction: column;
    }
    #user_dropdown .user_menu_info {
        padding: 1.5em;
        padding-inline-end: 1em;
        box-sizing: border-box;
        overflow: hidden;
        grid-template-columns: 3em calc(100% - 8em) 3em;
    }
    #user_dropdown .user_menu_info .func {
        display: block;
        opacity: 0.5;
    }
    #user_dropdown .user_menu {
        overflow: hidden;
        overflow-y: auto;
        padding: 0 1.5em;
        display: block;
    }
    #user_dropdown .user_menu > ul {
        margin-block: 1.5em;
    }
}
@media only screen and (max-width: 480px) {
    #global_nav .download_app {
        display: none;
    }
    #main_nav > .inner {
        height: 5em;
        padding: 0 1em;
        gap: 1em;
    }
    #nav_logo {
        padding: 1em 2em;
    }
    #main_nav .search form {
        display: none;
    }
    #main_nav .search > .btw {
        display: block;
        width: 3em;
        margin-inline-start: auto;
    }
}
#site_footer {
    margin-block-start: auto;
}
#site_footer > .inner {
    margin: 0 auto;
    max-width: var(--MaxContentWidth);
    padding: 3em 2em;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: 1fr 28em;
    gap: 2em;
    align-items: flex-start;
    position: relative;
}
#site_footer > .inner::before {
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    inset-inline: 0;
    inset-block-start: 0;
    margin: 0 2em;
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
}
@media only screen and (max-width: 1000px) {
    #site_footer > .inner {
        grid-template-columns: 1fr;
    }
    #footer_payments_wrp {
        order: -2;
    }
    #footer_nav_wrp {
        order: -1;
    }
    #footer_copyright {
        order: 9;
    }
}
#footer_payments_wrp .channel_list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
}
#footer_payments_wrp .channel_list img {
    vertical-align: top;
    width: auto;
    height: 2em;
    padding: calc(var(--brightness-filter, 0) * 1px);
    box-sizing: border-box;
    background: var(--body-text-color);
    border-radius: calc(var(--brightness-filter, 0) * 0.333334em);
    overflow: hidden;
}
#footer_payments_wrp .channel_list a.btw {
    order: 99;
}
#footer_sns_wrp {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1em;
    align-items: center;
    justify-content: center;
}
#footer_sns_wrp > h3 {
    font-size: 1em;
    opacity: 0.7;
}
#footer_sns {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
#footer_sns .btw {
    box-shadow: unset;
}
#footer_sns .btw:not(:hover) {
    --color: currentColor;
    --background-color: transparent;
}
#footer_nav {
    display: flex;
    flex-wrap: wrap;
    gap: 3em;
}
#footer_nav dl {
    max-width: 12.5em;
}
#footer_nav dt {
    font-weight: 800;
    margin-block-end: 1em;
}
#footer_nav dd {
    margin-block-start: 0.5em;
}
#footer_nav a {
    color: currentColor;
    opacity: 0.7;
}
#footer_nav a:hover {
    text-decoration: underline;
}
#footer_app a.download {
    display: grid;
    grid-template-columns: var(--W) 1fr;
    align-items: center;
    gap: 1em;
    --W: 5em;
    padding: 0.75em 1.5em;
    border-radius: 1em;
    box-sizing: border-box;
    color: var(--color, #fff);
    background: var(--SiteTHM)
        linear-gradient(
            calc(135deg * var(--angle-reverse, 1)),
            hsl(calc(var(--h) - 10) var(--s) var(--l)),
            hsl(calc(var(--h) + 10) var(--s) var(--l))
        );
    --r: var(--CPT-THM-R);
    --g: var(--CPT-THM-G);
    --b: var(--CPT-THM-B);
    --h: var(--CPT-THM-H);
    --s: var(--CPT-THM-S);
    --l: var(--CPT-THM-L);
}
#footer_app a.download::before {
    content: "";
    display: block;
    width: var(--W);
    height: var(--W);
    background: url(../demo/app.webp) no-repeat center/cover;
}
#footer_app a .text > div {
    font-size: 1.166667em;
    font-weight: 800;
}
#footer_app a .text > p {
    opacity: 0.5;
    margin: 0;
}
#footer_copyright {
    display: grid;
    align-items: center;
    grid-template-columns: auto 1fr;
    gap: 2em;
    align-self: center;
}
.dark #footer_copyright::before {
    content: "";
    display: block;
    --h: 1.25em;
    width: calc(182 / 42 * var(--h));
    height: var(--h);
    background: url(../demo/logo_ritokey_darkmode.png) no-repeat center/contain;
    filter: brightness(var(--brightness-filter, 0));
    opacity: 0.25;
}
#footer_copyright::before {
    content: "";
    display: block;
    --h: 1.25em;
    width: calc(182 / 42 * var(--h));
    height: var(--h);
    background: url(../demo/logo_rito.png) no-repeat center/contain;
    filter: brightness(var(--brightness-filter, 0));
    opacity: 0.25;
}
#footer_copyright h3 {
    font-size: 1em;
    opacity: 0.7;
}
#footer_trustpilot .trustpilot-widget {
    width: fit-content;
    margin-inline-start: auto;
    background: #fff;
    color: #000;
    border-radius: 0.5em;
    overflow: hidden;
}
#footer_trustpilot .trustpilot-widget > a {
    display: block;
    height: 3em;
    padding: 0.75em 1.5em;
    box-sizing: border-box;
    color: currentColor;
}
#footer_trustpilot .trustpilot-widget > iframe {
    height: 3em !important;
    padding-block: 0.5em;
    box-sizing: border-box;
}
@media only screen and (max-width: 1000px) {
    #footer_app a.download {
        max-width: fit-content;
    }
    #footer_sns_wrp {
        max-width: fit-content;
        order: 8;
    }
    #footer_trustpilot .trustpilot-widget {
        margin-inline: 0 auto;
    }
}
@media only screen and (max-width: 480px) {
    #footer_nav {
        all: unset;
    }
    #footer_nav dl {
        max-width: unset;
        border-top: 1px var(--body-text-color-a5, rgba(0 0 0/5%)) solid;
    }
    #footer_nav dl:last-of-type {
        border-bottom: 1px var(--body-text-color-a5, rgba(0 0 0/5%)) solid;
    }
    #footer_nav dt {
        margin: 0;
        padding: 1em 0;
    }
    #footer_nav dt span {
        display: grid;
        grid-template-columns: 1fr auto;
        align-items: center;
    }
    #footer_nav dt span::before {
        content: attr(icon);
        display: block;
        font-size: 1.166667em;
        width: 1em;
        height: 1em;
        line-height: 1;
        overflow: hidden;
        order: 9;
    }
    #footer_nav dd {
        display: none;
        margin: 0;
        padding: 0.5em 0;
    }
    #footer_nav dl.show {
        padding-block-end: 1em;
    }
    #footer_nav dl.show dt > span::before {
        transform: rotate(225deg);
        transition: 0.3s;
    }
    #footer_nav dl.show dd {
        display: block;
    }
    #footer_app {
        text-align: center;
    }
    #footer_app a.download {
        margin: 0 auto;
        padding: 1em 2em;
        display: inline-grid;
        vertical-align: top;
        grid-template-columns: var(--W) auto;
        justify-content: center;
        --W: 4em;
    }
    #footer_app a .text {
        text-align: initial;
    }
    #footer_app a .text > div {
        font-size: 1em;
    }
    #footer_sns_wrp {
        margin: 0 auto;
        grid-template-columns: 1fr;
        text-align: center;
    }
    #footer_copyright {
        display: block;
        text-align: center;
    }
    #footer_copyright::before {
        content: none !important;
    }
    #footer_trustpilot .trustpilot-widget {
        margin-inline: auto;
    }
}
.pager_wrp {
    margin: 2em 0;
}
.pager {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5em;
}
.pager a {
    display: block;
    color: currentColor;
    padding: 0.5em;
    border-radius: 0.5em;
}
.pager a > span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2em;
    height: 2em;
}
.pager a:not(.preview, .next, .on) {
    background-color: var(--background-color-L3, #fff);
    font-weight: 800;
}
.pager a:not(.on):hover {
    background-color: var(--SiteTHM);
    color: #fff;
}
.pager a.on {
    opacity: 0.5;
    pointer-events: none;
}
.pager a.next,
.pager a.preview {
    border-radius: 100%;
}
.pager a.next > span,
.pager a.preview > span {
    display: block;
    width: 2em;
    height: 2em;
    overflow: hidden;
}
.pager a.next > span::before,
.pager a.preview > span::before {
    content: attr(icon);
    display: block;
    font-size: 2em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
}
@media only screen and (max-width: 480px) {
    .pager {
        gap: 2em;
    }
    .pager::before {
        content: attr(data-title);
        white-space: nowrap;
    }
    .pager > li:first-of-type {
        order: -99;
    }
    .pager > li:last-of-type {
        order: 99;
    }
    .pager > li:not(:first-of-type, :last-of-type) {
        display: none;
    }
}
.ItemList {
    display: grid;
    grid-template-columns: repeat(
        auto-fill,
        minmax(var(--itemlist-column, 16em), 1fr)
    );
    gap: var(--itemlist-gap, 1.5em 2em);
    --W: 5em;
}
.ItemList > li > a {
    color: currentColor;
    text-decoration: none;
    display: grid;
    grid-template-columns: var(--W) 1fr;
    gap: 1.5em;
    align-items: center;
}
.ItemList .img {
    --H: var(--W);
    width: var(--W);
    height: var(--H);
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 0 0 1px;
    border-radius: 25%;
    overflow: hidden;
    position: relative;
    align-self: start;
}
.ItemList .img img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}
.ItemList .img img[src*="mobile-recharge/operator"],
.ItemList .img img[src*="operator-logo.transferto.com"] {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    margin: auto;
    padding: 15%;
    box-sizing: border-box;
    background: #fff;
    object-fit: contain;
}
.ItemList .name {
    word-break: break-word;
    font-weight: 800;
}
.ItemList .info {
    opacity: 0.5;
}
.ItemList .info span {
    display: inline-block;
    vertical-align: top;
}
.ItemList .info span:not(:last-child)::after {
    content: " / ";
    opacity: 0.25;
}
.ItemList .sku {
    opacity: 0.5;
}
@media (any-hover) {
    .ItemList > li > a:focus .img,
    .ItemList > li > a:hover .img {
        transition: transform 0.3s;
        transform: scale(1.05);
    }
}
.ItemList.card {
    --itemlist-column: 12em;
    --W: 10em;
    justify-content: space-evenly;
}
.ItemList.topup {
    --itemlist-column: 12em;
    --W: 11.5em;
    justify-content: space-evenly;
}
.ItemList.card > li > a,
.ItemList.topup > li > a {
    display: block;
}
.ItemList.card .img {
    border-radius: calc(var(--W) / 10);
}
.ItemList.topup .img {
    border-radius: calc(var(--W) / 11.5);
}
.ItemList.card .img[region]::before {
    --h: calc(var(--W) * 0.15);
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    margin: calc(var(--W) * 0.05);
}
.ItemList:not(.card) .img[region]::before {
    display: none;
}
.ItemList.card .img {
    --H: calc(var(--W) * 1.333334);
}
.ItemList.card .T,
.ItemList.topup .T {
    margin-block-start: 1em;
}
.ItemList.card .name,
.ItemList.topup .name {
    max-height: 3em;
    overflow: hidden;
    font-weight: inherit;
}
.ItemLink {
    display: grid;
    grid-template-columns: var(--W) 1fr;
    gap: 1.5em;
    align-items: center;
    color: currentColor;
    --W: 5em;
}
.ItemLink .img {
    --H: var(--W);
    width: var(--W);
    height: var(--H);
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 0 0 1px;
    border-radius: 25%;
    overflow: hidden;
    position: relative;
    transition: transform 0.3s;
    align-self: start;
}
.ItemLink .img img {
    vertical-align: top;
    width: 100%;
    height: 100%;
}
.ItemLink .img img[src*="mobile-recharge/operator"],
.ItemLink .img img[src*="operator-logo.transferto.com"] {
    position: absolute;
    inset: 0;
    margin: auto;
    padding: 15%;
    box-sizing: border-box;
    background: #fff;
    object-fit: contain;
}
.ItemLink .name {
    word-break: break-word;
    font-weight: 800;
}
.ItemLink .info {
    opacity: 0.5;
}
.ItemLink .info span {
    display: inline-block;
    vertical-align: top;
}
.ItemLink .info span:not(:last-child)::after {
    content: " / ";
    opacity: 0.25;
}
.ItemLink .sku {
    opacity: 0.5;
}
@media (any-hover) {
    a.ItemLink:focus .img,
    a.ItemLink:hover .img {
        transform: scale(1.05);
    }
}
[review-star] {
    display: block;
    width: calc(var(--RateStarSize, 1em) * 5);
    height: var(--RateStarSize, 1em);
    overflow: hidden;
    position: relative;
}
[review-star]::after,
[review-star]::before {
    content: "";
    display: block;
    font-size: var(--RateStarSize, 1em);
    height: 1em;
    overflow: hidden;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCA5NiI+PHBhdGggZmlsbD0icmdiYSgwIDAgMC8xMCUpIiBkPSJtMTIgNS4yIDEuNCAzLjIuNSAxLjEgMS4xLjEgMy41LjMtMi42IDIuMy0uOS44LjMgMS4yLjggMy40LTMtMS44LTEtLjYtMSAuNi0zIDEuOC44LTMuNEw5IDEzbC0uOS0uOC0yLjYtMi4zTDkgOS42bDEuMi0uMS41LTEuMUwxMiA1LjJNMTIgMCA4LjggNy42bC04LjIuNyA2LjIgNS40LTEuOSA4IDcuMS00LjIgNy4xIDQuMi0xLjktOCA2LjItNS40LTguMi0uN0wxMiAweiIvPjxwYXRoIGZpbGw9IiNGRjQ1MDAiIGQ9Im0xMiAyNCAzLjIgNy42IDguMi43LTYuMiA1LjQgMS45IDgtNy4xLTQuMi03LjEgNC4yIDEuOS04LTYuMi01LjQgOC4yLS43eiIvPjxwYXRoIGZpbGw9InJnYmEoMjU1IDI1NSAyNTUvMjUlKSIgZD0ibTEyIDUzLjIgMS40IDMuMi41IDEuMSAxLjIuMSAzLjUuMy0yLjYgMi4zLTEgLjguMyAxLjIuOCAzLjQtMy0xLjgtMS0uNi0xIC42LTMgMS44LjgtMy40TDkgNjFsLS45LS44LTIuNi0yLjMgMy41LS4zIDEuMi0uMS41LTEuMSAxLjMtMy4ybTAtNS4yLTMuMiA3LjYtOC4yLjcgNi4yIDUuNC0xLjkgOCA3LjEtNC4yIDcuMSA0LjItMS45LTggNi4yLTUuNC04LjItLjdMMTIgNDh6Ii8+PHBhdGggZmlsbD0iIzBCRiIgZD0ibTEyIDcyIDMuMiA3LjYgOC4yLjctNi4yIDUuNCAxLjkgOC03LjEtNC4yLTcuMSA0LjIgMS45LTgtNi4yLTUuNCA4LjItLjd6Ii8+PC9zdmc+);
    background-repeat: repeat-x;
    background-position: 0 0;
    background-size: 1em;
}
[review-star]::after {
    background-position-y: -1em;
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    z-index: 0;
    width: calc(var(--RateStar, 0) * 1em);
}
[review-star="1"] {
    --RateStar: 1;
}
[review-star="2"] {
    --RateStar: 2;
}
[review-star="3"] {
    --RateStar: 3;
}
[review-star="4"] {
    --RateStar: 4;
}
[review-star="5"] {
    --RateStar: 5;
}
[data-star-level] {
    --fs: 3em;
}
[data-star-level]::before {
    display: block;
    font-size: var(--fs);
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
    background: url(../images/star_icon-764628d046.svg) no-repeat center/contain;
    filter: hue-rotate(calc(-15deg * var(--i)));
}
[data-star-level="1"] {
    --i: 0;
}
[data-star-level="2"] {
    --i: 1;
}
[data-star-level="3"] {
    --i: 2;
}
[data-star-level="4"] {
    --i: 3;
}
[currency]::before,
[region]::before {
    content: "";
    display: block;
    --w: calc(var(--h) * 4 / 3);
    --h: 2em;
    width: var(--w);
    height: var(--h);
    border-radius: var(--h);
    background-color: #fff;
    background-image: url("../image/flag_sprite_20220623_w32.webp");
    background-image: -webkit-image-set(
        url("../image/flag_sprite_20220623_w32.webp") 1x,
        url("../image/flag_sprite_20220623_w64.webp") 2x,
        url("../image/flag_sprite_20220623_w128.webp") 3x
    );
    background-position: calc(var(--x, 9) * var(--w) * -1)
        calc(var(--y, 29) * var(--h) * -1);
    background-size: calc(var(--w) * 10) calc(var(--h) * 30);
    background-repeat: no-repeat;
    box-shadow: inset rgb(0 0 0 / 10%) 0 0 0 1px;
    margin: 0 auto;
}
[currency=""]::before,
[region=""]::before {
    content: none;
}
[region="ad"] {
    --x: 0;
    --y: 0;
}
[currency="AED"],
[region="ae"] {
    --x: 1;
    --y: 0;
}
[currency="AFN"],
[region="af"] {
    --x: 2;
    --y: 0;
}
[region="ag"] {
    --x: 3;
    --y: 0;
}
[region="ai"] {
    --x: 4;
    --y: 0;
}
[region="al"] {
    --x: 5;
    --y: 0;
}
[currency="AMD"],
[region="am"] {
    --x: 6;
    --y: 0;
}
[currency="AOA"],
[region="ao"] {
    --x: 7;
    --y: 0;
}
[currency="ARS"],
[region="ar"] {
    --x: 8;
    --y: 0;
}
[region="as"] {
    --x: 9;
    --y: 0;
}
[region="at"] {
    --x: 0;
    --y: 1;
}
[currency="AUD"],
[region="au"] {
    --x: 1;
    --y: 1;
}
[currency="AWG"],
[region="aw"] {
    --x: 2;
    --y: 1;
}
[region="ax"] {
    --x: 3;
    --y: 1;
}
[currency="AZN"],
[region="az"] {
    --x: 4;
    --y: 1;
}
[region="ba"] {
    --x: 5;
    --y: 1;
}
[currency="BBD"],
[region="bb"] {
    --x: 6;
    --y: 1;
}
[currency="BDT"],
[region="bd"] {
    --x: 7;
    --y: 1;
}
[region="be"] {
    --x: 8;
    --y: 1;
}
[region="bf"] {
    --x: 9;
    --y: 1;
}
[currency="BGN"],
[region="bg"] {
    --x: 0;
    --y: 2;
}
[currency="BHD"],
[region="bh"] {
    --x: 1;
    --y: 2;
}
[currency="BIF"],
[region="bi"] {
    --x: 2;
    --y: 2;
}
[region="bj"] {
    --x: 3;
    --y: 2;
}
[region="bl"] {
    --x: 4;
    --y: 2;
}
[currency="BMD"],
[region="bm"] {
    --x: 5;
    --y: 2;
}
[currency="BND"],
[region="bn"] {
    --x: 6;
    --y: 2;
}
[currency="BOB"],
[region="bo"] {
    --x: 7;
    --y: 2;
}
[region="bq"] {
    --x: 8;
    --y: 2;
}
[currency="BRL"],
[region="br"] {
    --x: 9;
    --y: 2;
}
[currency="BSD"],
[region="bs"] {
    --x: 0;
    --y: 3;
}
[currency="BTN"],
[region="bt"] {
    --x: 1;
    --y: 3;
}
[region="bv"] {
    --x: 2;
    --y: 3;
}
[currency="BWP"],
[region="bw"] {
    --x: 3;
    --y: 3;
}
[currency="BYR"],
[region="by"] {
    --x: 4;
    --y: 3;
}
[currency="BZD"],
[region="bz"] {
    --x: 5;
    --y: 3;
}
[currency="CAD"],
[region="ca"] {
    --x: 6;
    --y: 3;
}
[region="cc"] {
    --x: 7;
    --y: 3;
}
[region="cd"] {
    --x: 8;
    --y: 3;
}
[region="cf"] {
    --x: 9;
    --y: 3;
}
[currency="CDF"],
[region="cg"] {
    --x: 0;
    --y: 4;
}
[currency="CHF"],
[region="ch"] {
    --x: 1;
    --y: 4;
}
[region="ci"] {
    --x: 2;
    --y: 4;
}
[region="ck"] {
    --x: 3;
    --y: 4;
}
[currency="CLP"],
[region="cl"] {
    --x: 4;
    --y: 4;
}
[region="cm"] {
    --x: 5;
    --y: 4;
}
[currency="CNY"],
[region="cn"] {
    --x: 6;
    --y: 4;
}
[currency="COP"],
[region="co"] {
    --x: 7;
    --y: 4;
}
[currency="CRC"],
[region="cr"] {
    --x: 8;
    --y: 4;
}
[region="cu"] {
    --x: 9;
    --y: 4;
}
[currency="CVE"],
[region="cv"] {
    --x: 0;
    --y: 5;
}
[region="cw"] {
    --x: 1;
    --y: 5;
}
[region="cx"] {
    --x: 2;
    --y: 5;
}
[region="cy"] {
    --x: 3;
    --y: 5;
}
[currency="CZK"],
[region="cz"] {
    --x: 4;
    --y: 5;
}
[currency="DEM"],
[region="de"] {
    --x: 5;
    --y: 5;
}
[currency="DJF"],
[region="dj"] {
    --x: 6;
    --y: 5;
}
[currency="DKK"],
[region="dk"] {
    --x: 7;
    --y: 5;
}
[currency="DOP"],
[region="dm"] {
    --x: 8;
    --y: 5;
}
[region="do"] {
    --x: 9;
    --y: 5;
}
[currency="DZD"],
[region="dz"] {
    --x: 0;
    --y: 6;
}
[currency="ECS"],
[region="ec"] {
    --x: 1;
    --y: 6;
}
[region="ee"] {
    --x: 2;
    --y: 6;
}
[currency="EGP"],
[region="eg"] {
    --x: 3;
    --y: 6;
}
[region="eh"] {
    --x: 4;
    --y: 6;
}
[currency="ERN"],
[region="er"] {
    --x: 5;
    --y: 6;
}
[region="es"] {
    --x: 6;
    --y: 6;
}
[currency="ETB"],
[region="et"] {
    --x: 7;
    --y: 6;
}
[region="fi"] {
    --x: 8;
    --y: 6;
}
[currency="FJD"],
[region="fj"] {
    --x: 9;
    --y: 6;
}
[currency="FKP"],
[region="fk"] {
    --x: 0;
    --y: 7;
}
[region="fm"] {
    --x: 1;
    --y: 7;
}
[region="fo"] {
    --x: 2;
    --y: 7;
}
[currency="FRF"],
[region="fr"] {
    --x: 3;
    --y: 7;
}
[region="ga"] {
    --x: 4;
    --y: 7;
}
[currency="GBP"],
[region="gb"] {
    --x: 5;
    --y: 7;
}
[region="gd"] {
    --x: 6;
    --y: 7;
}
[currency="GEL"],
[region="ge"] {
    --x: 7;
    --y: 7;
}
[region="gf"] {
    --x: 8;
    --y: 7;
}
[region="gg"] {
    --x: 9;
    --y: 7;
}
[currency="GHS"],
[region="gh"] {
    --x: 0;
    --y: 8;
}
[currency="GIP"],
[region="gi"] {
    --x: 1;
    --y: 8;
}
[region="gl"] {
    --x: 2;
    --y: 8;
}
[currency="GMD"],
[region="gm"] {
    --x: 3;
    --y: 8;
}
[currency="GNF"],
[region="gn"] {
    --x: 4;
    --y: 8;
}
[region="gp"] {
    --x: 5;
    --y: 8;
}
[region="gq"] {
    --x: 6;
    --y: 8;
}
[region="gr"] {
    --x: 7;
    --y: 8;
}
[region="gs"] {
    --x: 8;
    --y: 8;
}
[currency="GTQ"],
[region="gt"] {
    --x: 9;
    --y: 8;
}
[region="gu"] {
    --x: 0;
    --y: 9;
}
[region="gw"] {
    --x: 1;
    --y: 9;
}
[currency="GYD"],
[region="gy"] {
    --x: 2;
    --y: 9;
}
[currency="HKD"],
[region="hk"] {
    --x: 3;
    --y: 9;
}
[region="hm"] {
    --x: 4;
    --y: 9;
}
[currency="HNL"],
[region="hn"] {
    --x: 5;
    --y: 9;
}
[currency="HRK"],
[region="hr"] {
    --x: 6;
    --y: 9;
}
[currency="HTG"],
[region="ht"] {
    --x: 7;
    --y: 9;
}
[currency="HUF"],
[region="hu"] {
    --x: 8;
    --y: 9;
}
[currency="IDR"],
[region="id"] {
    --x: 9;
    --y: 9;
}
[currency="IEP"],
[region="ie"] {
    --x: 0;
    --y: 10;
}
[currency="ILS"],
[region="il"] {
    --x: 1;
    --y: 10;
}
[region="im"] {
    --x: 2;
    --y: 10;
}
[currency="INR"],
[region="in"] {
    --x: 3;
    --y: 10;
}
[region="io"] {
    --x: 4;
    --y: 10;
}
[currency="IQD"],
[region="iq"] {
    --x: 5;
    --y: 10;
}
[currency="IRR"],
[region="ir"] {
    --x: 6;
    --y: 10;
}
[currency="ISK"],
[region="is"] {
    --x: 7;
    --y: 10;
}
[currency="ITL"],
[region="it"] {
    --x: 8;
    --y: 10;
}
[region="je"] {
    --x: 9;
    --y: 10;
}
[currency="JMD"],
[region="jm"] {
    --x: 0;
    --y: 11;
}
[currency="JOD"],
[region="jo"] {
    --x: 1;
    --y: 11;
}
[currency="JPY"],
[region="jp"] {
    --x: 2;
    --y: 11;
}
[currency="KES"],
[region="ke"] {
    --x: 3;
    --y: 11;
}
[currency="KGS"],
[region="kg"] {
    --x: 4;
    --y: 11;
}
[currency="KHR"],
[region="kh"] {
    --x: 5;
    --y: 11;
}
[region="ki"] {
    --x: 6;
    --y: 11;
}
[currency="KMF"],
[region="km"] {
    --x: 7;
    --y: 11;
}
[region="kn"] {
    --x: 8;
    --y: 11;
}
[currency="KPW"],
[region="kp"] {
    --x: 9;
    --y: 11;
}
[currency="KRW"],
[region="kr"] {
    --x: 0;
    --y: 12;
}
[currency="KWD"],
[region="kw"] {
    --x: 1;
    --y: 12;
}
[currency="KYD"],
[region="ky"] {
    --x: 2;
    --y: 12;
}
[currency="KZT"],
[region="kz"] {
    --x: 3;
    --y: 12;
}
[region="la"] {
    --x: 4;
    --y: 12;
}
[currency="LBP"],
[region="lb"] {
    --x: 5;
    --y: 12;
}
[region="lc"] {
    --x: 6;
    --y: 12;
}
[region="li"] {
    --x: 7;
    --y: 12;
}
[currency="LKR"],
[region="lk"] {
    --x: 8;
    --y: 12;
}
[region="lr"] {
    --x: 9;
    --y: 12;
}
[currency="LSL"],
[region="ls"] {
    --x: 0;
    --y: 13;
}
[currency="LTL"],
[region="lt"] {
    --x: 1;
    --y: 13;
}
[region="lu"] {
    --x: 2;
    --y: 13;
}
[currency="LVL"],
[region="lv"] {
    --x: 3;
    --y: 13;
}
[currency="LYD"],
[region="ly"] {
    --x: 4;
    --y: 13;
}
[currency="MAD"],
[region="ma"] {
    --x: 5;
    --y: 13;
}
[region="mc"] {
    --x: 6;
    --y: 13;
}
[currency="MDL"],
[region="md"] {
    --x: 7;
    --y: 13;
}
[region="me"] {
    --x: 8;
    --y: 13;
}
[region="mf"] {
    --x: 9;
    --y: 13;
}
[currency="MGA"],
[region="mg"] {
    --x: 0;
    --y: 14;
}
[region="mh"] {
    --x: 1;
    --y: 14;
}
[currency="MKD"],
[region="mk"] {
    --x: 2;
    --y: 14;
}
[region="ml"] {
    --x: 3;
    --y: 14;
}
[currency="MMK"],
[region="mm"] {
    --x: 4;
    --y: 14;
}
[currency="MNT"],
[region="mn"] {
    --x: 5;
    --y: 14;
}
[currency="MOP"],
[region="mo"] {
    --x: 6;
    --y: 14;
}
[region="mp"] {
    --x: 7;
    --y: 14;
}
[region="mq"] {
    --x: 8;
    --y: 14;
}
[currency="MRO"],
[region="mr"] {
    --x: 9;
    --y: 14;
}
[region="ms"] {
    --x: 0;
    --y: 15;
}
[region="mt"] {
    --x: 1;
    --y: 15;
}
[currency="MUR"],
[region="mu"] {
    --x: 2;
    --y: 15;
}
[currency="MVR"],
[region="mv"] {
    --x: 3;
    --y: 15;
}
[currency="MWK"],
[region="mw"] {
    --x: 4;
    --y: 15;
}
[currency="MXN"],
[region="mx"] {
    --x: 5;
    --y: 15;
}
[currency="MYR"],
[region="my"] {
    --x: 6;
    --y: 15;
}
[currency="MZN"],
[region="mz"] {
    --x: 7;
    --y: 15;
}
[currency="NAD"],
[region="na"] {
    --x: 8;
    --y: 15;
}
[region="nc"] {
    --x: 9;
    --y: 15;
}
[region="ne"] {
    --x: 0;
    --y: 16;
}
[region="nf"] {
    --x: 1;
    --y: 16;
}
[currency="NGN"],
[region="ng"] {
    --x: 2;
    --y: 16;
}
[currency="NIO"],
[region="ni"] {
    --x: 3;
    --y: 16;
}
[currency="ANG"],
[region="nl"] {
    --x: 4;
    --y: 16;
}
[currency="NOK"],
[region="no"] {
    --x: 5;
    --y: 16;
}
[currency="NPR"],
[region="np"] {
    --x: 6;
    --y: 16;
}
[region="nr"] {
    --x: 7;
    --y: 16;
}
[region="nu"] {
    --x: 8;
    --y: 16;
}
[currency="NZD"],
[region="nz"] {
    --x: 9;
    --y: 16;
}
[currency="OMR"],
[region="om"] {
    --x: 0;
    --y: 17;
}
[currency="PAB"],
[region="pa"] {
    --x: 1;
    --y: 17;
}
[currency="PEN"],
[region="pe"] {
    --x: 2;
    --y: 17;
}
[region="pf"] {
    --x: 3;
    --y: 17;
}
[currency="PGK"],
[region="pg"] {
    --x: 4;
    --y: 17;
}
[currency="PHP"],
[region="ph"] {
    --x: 5;
    --y: 17;
}
[currency="PKR"],
[region="pk"] {
    --x: 6;
    --y: 17;
}
[currency="PLN"],
[region="pl"] {
    --x: 7;
    --y: 17;
}
[region="pm"] {
    --x: 8;
    --y: 17;
}
[region="pn"] {
    --x: 9;
    --y: 17;
}
[region="pr"] {
    --x: 0;
    --y: 18;
}
[region="ps"] {
    --x: 1;
    --y: 18;
}
[region="pt"] {
    --x: 2;
    --y: 18;
}
[region="pw"] {
    --x: 3;
    --y: 18;
}
[currency="PYG"],
[region="py"] {
    --x: 4;
    --y: 18;
}
[currency="QAR"],
[region="qa"] {
    --x: 5;
    --y: 18;
}
[region="re"] {
    --x: 6;
    --y: 18;
}
[currency="RON"],
[region="ro"] {
    --x: 7;
    --y: 18;
}
[currency="RSD"],
[region="rs"] {
    --x: 8;
    --y: 18;
}
[currency="RUB"],
[region="ru"] {
    --x: 9;
    --y: 18;
}
[currency="RWF"],
[region="rw"] {
    --x: 0;
    --y: 19;
}
[currency="SAR"],
[region="sa"] {
    --x: 1;
    --y: 19;
}
[currency="SBD"],
[region="sb"] {
    --x: 2;
    --y: 19;
}
[currency="SCR"],
[region="sc"] {
    --x: 3;
    --y: 19;
}
[currency="SDG"],
[region="sd"] {
    --x: 4;
    --y: 19;
}
[currency="SEK"],
[region="se"] {
    --x: 5;
    --y: 19;
}
[currency="SGD"],
[region="sg"] {
    --x: 6;
    --y: 19;
}
[region="sh"] {
    --x: 7;
    --y: 19;
}
[currency="SIT"],
[region="si"] {
    --x: 8;
    --y: 19;
}
[region="sj"] {
    --x: 9;
    --y: 19;
}
[region="sk"] {
    --x: 0;
    --y: 20;
}
[currency="SLL"],
[region="sl"] {
    --x: 1;
    --y: 20;
}
[region="sm"] {
    --x: 2;
    --y: 20;
}
[region="sn"] {
    --x: 3;
    --y: 20;
}
[currency="SOS"],
[region="so"] {
    --x: 4;
    --y: 20;
}
[region="sr"] {
    --x: 5;
    --y: 20;
}
[region="ss"] {
    --x: 6;
    --y: 20;
}
[region="st"] {
    --x: 7;
    --y: 20;
}
[region="sv"] {
    --x: 8;
    --y: 20;
}
[region="sx"] {
    --x: 9;
    --y: 20;
}
[currency="SYP"],
[region="sy"] {
    --x: 0;
    --y: 21;
}
[currency="SZL"],
[region="sz"] {
    --x: 1;
    --y: 21;
}
[region="tc"] {
    --x: 2;
    --y: 21;
}
[region="td"] {
    --x: 3;
    --y: 21;
}
[region="tf"] {
    --x: 4;
    --y: 21;
}
[region="tg"] {
    --x: 5;
    --y: 21;
}
[currency="THB"],
[region="th"] {
    --x: 6;
    --y: 21;
}
[currency="TJS"],
[region="tj"] {
    --x: 7;
    --y: 21;
}
[region="tk"] {
    --x: 8;
    --y: 21;
}
[region="tl"] {
    --x: 9;
    --y: 21;
}
[currency="TMT"],
[region="tm"] {
    --x: 0;
    --y: 22;
}
[currency="TND"],
[region="tn"] {
    --x: 1;
    --y: 22;
}
[currency="TOP"],
[region="to"] {
    --x: 2;
    --y: 22;
}
[currency="TRY"],
[region="tr"] {
    --x: 3;
    --y: 22;
}
[region="tt"] {
    --x: 4;
    --y: 22;
}
[region="tv"] {
    --x: 5;
    --y: 22;
}
[currency="NTD"],
[region="tw"] {
    --x: 6;
    --y: 22;
}
[currency="TZS"],
[region="tz"] {
    --x: 7;
    --y: 22;
}
[currency="UAH"],
[region="ua"] {
    --x: 8;
    --y: 22;
}
[currency="UGX"],
[region="ug"] {
    --x: 9;
    --y: 22;
}
[region="um"] {
    --x: 0;
    --y: 23;
}
[currency="USD"],
[region="us"] {
    --x: 1;
    --y: 23;
}
[currency="UYU"],
[region="uy"] {
    --x: 2;
    --y: 23;
}
[currency="UZS"],
[region="uz"] {
    --x: 3;
    --y: 23;
}
[region="va"] {
    --x: 4;
    --y: 23;
}
[region="vc"] {
    --x: 5;
    --y: 23;
}
[currency="VEF"],
[region="ve"] {
    --x: 6;
    --y: 23;
}
[region="vg"] {
    --x: 7;
    --y: 23;
}
[region="vi"] {
    --x: 8;
    --y: 23;
}
[currency="VND"],
[region="vn"] {
    --x: 9;
    --y: 23;
}
[currency="VUV"],
[region="vu"] {
    --x: 0;
    --y: 24;
}
[region="wf"] {
    --x: 1;
    --y: 24;
}
[currency="WST"],
[region="ws"] {
    --x: 2;
    --y: 24;
}
[region="ye"] {
    --x: 3;
    --y: 24;
}
[region="yt"] {
    --x: 4;
    --y: 24;
}
[currency="ZAR"],
[region="za"] {
    --x: 5;
    --y: 24;
}
[currency="ZMW"],
[region="zm"] {
    --x: 6;
    --y: 24;
}
[currency="ZWL"],
[region="zw"] {
    --x: 7;
    --y: 24;
}
[region="global"] {
    --x: 8;
    --y: 24;
}
[currency="EUR"],
[region="eu"] {
    --x: 9;
    --y: 24;
}
[region="apac"] {
    --x: 0;
    --y: 25;
}
[region="sea"] {
    --x: 1;
    --y: 25;
}
[region="latam"] {
    --x: 2;
    --y: 25;
}
[region="mena"] {
    --x: 3;
    --y: 25;
}
[region="asia"] {
    --x: 4;
    --y: 25;
}
[region="europe"] {
    --x: 5;
    --y: 25;
}
[region="north-america"] {
    --x: 6;
    --y: 25;
}
[region="south-america"] {
    --x: 7;
    --y: 25;
}
[region="oceania"] {
    --x: 8;
    --y: 25;
}
[region="africa"] {
    --x: 9;
    --y: 25;
}
[region="aq"] {
    --x: 0;
    --y: 26;
}
[currency="XAF"],
[region="central-african"] {
    --x: 1;
    --y: 26;
}
[currency="XOF"],
[region="west-african"] {
    --x: 2;
    --y: 26;
}
[data-category-icon="01"] {
    --x: 1;
    --y: 1;
}
[data-category-icon="02"] {
    --x: 2;
    --y: 1;
}
[data-category-icon="03"] {
    --x: 3;
    --y: 1;
}
[data-category-icon="04"] {
    --x: 4;
    --y: 1;
}
[data-category-icon="05"] {
    --x: 5;
    --y: 1;
}
[data-category-icon="06"] {
    --x: 6;
    --y: 1;
}
[data-category-icon="07"] {
    --x: 7;
    --y: 1;
}
[data-category-icon="08"] {
    --x: 8;
    --y: 1;
}
[data-category-icon="09"] {
    --x: 9;
    --y: 1;
}
[data-category-icon="10"] {
    --x: 10;
    --y: 1;
}
[data-category-icon="11"] {
    --x: 1;
    --y: 2;
}
[data-category-icon="12"] {
    --x: 2;
    --y: 2;
}
[data-category-icon="13"] {
    --x: 3;
    --y: 2;
}
[data-category-icon="14"] {
    --x: 4;
    --y: 2;
}
[data-category-icon="15"] {
    --x: 5;
    --y: 2;
}
[data-category-icon="16"] {
    --x: 6;
    --y: 2;
}
[data-category-icon="17"] {
    --x: 7;
    --y: 2;
}
[data-category-icon="18"] {
    --x: 8;
    --y: 2;
}
[data-category-icon="19"] {
    --x: 9;
    --y: 2;
}
[data-category-icon="20"] {
    --x: 10;
    --y: 2;
}
[data-category-icon="21"] {
    --x: 1;
    --y: 3;
}
[data-category-icon="22"] {
    --x: 2;
    --y: 3;
}
[data-category-icon="23"] {
    --x: 3;
    --y: 3;
}
[data-category-icon="24"] {
    --x: 4;
    --y: 3;
}
[data-category-icon="25"] {
    --x: 5;
    --y: 3;
}
[data-category-icon="26"] {
    --x: 6;
    --y: 3;
}
[data-category-icon="27"] {
    --x: 7;
    --y: 3;
}
[data-category-icon="28"] {
    --x: 8;
    --y: 3;
}
[data-category-icon="29"] {
    --x: 9;
    --y: 3;
}
[data-category-icon="30"] {
    --x: 10;
    --y: 3;
}
[data-category-icon="31"] {
    --x: 1;
    --y: 4;
}
[data-category-icon="32"] {
    --x: 2;
    --y: 4;
}
[data-category-icon="33"] {
    --x: 3;
    --y: 4;
}
[data-category-icon="34"] {
    --x: 4;
    --y: 4;
}
[data-category-icon="35"] {
    --x: 5;
    --y: 4;
}
[data-category-icon="36"] {
    --x: 6;
    --y: 4;
}
[data-category-icon="37"] {
    --x: 7;
    --y: 4;
}
[data-category-icon="38"] {
    --x: 8;
    --y: 4;
}
[data-category-icon="39"] {
    --x: 9;
    --y: 4;
}
[data-category-icon="40"] {
    --x: 10;
    --y: 4;
}
[data-category-icon="41"] {
    --x: 1;
    --y: 5;
}
[data-category-icon="42"] {
    --x: 2;
    --y: 5;
}
[data-category-icon="43"] {
    --x: 3;
    --y: 5;
}
[data-category-icon="44"] {
    --x: 4;
    --y: 5;
}
[data-category-icon="45"] {
    --x: 5;
    --y: 5;
}
[data-category-icon="46"] {
    --x: 6;
    --y: 5;
}
[data-category-icon="47"] {
    --x: 7;
    --y: 5;
}
[data-category-icon="48"] {
    --x: 8;
    --y: 5;
}
[data-category-icon="49"] {
    --x: 9;
    --y: 5;
}
[data-category-icon="50"] {
    --x: 10;
    --y: 5;
}
[data-category-icon="01"],
[data-category-icon="15"],
[data-category-icon="22"],
[data-category-icon="25"],
[data-category-icon="31"],
[data-category-icon="32"] {
    --r: 13;
    --g: 204;
    --b: 242;
    --h: 190;
    --s: 90%;
    --l: 50%;
    --hex: #0dccf2;
}
[data-category-icon="02"],
[data-category-icon="13"],
[data-category-icon="18"],
[data-category-icon="19"],
[data-category-icon="21"] {
    --r: 255;
    --g: 170;
    --b: 0;
    --h: 40;
    --s: 100%;
    --l: 50%;
    --hex: #ffaa00;
}
[data-category-icon="03"],
[data-category-icon="14"],
[data-category-icon="16"],
[data-category-icon="17"],
[data-category-icon="36"] {
    --r: 244;
    --g: 71;
    --b: 37;
    --h: 10;
    --s: 90%;
    --l: 55%;
    --hex: #f44725;
}
[data-category-icon="04"],
[data-category-icon="11"],
[data-category-icon="23"],
[data-category-icon="34"] {
    --r: 38;
    --g: 217;
    --b: 38;
    --h: 120;
    --s: 70%;
    --l: 50%;
    --hex: #26d926;
}
[data-category-icon="12"],
[data-category-icon="24"],
[data-category-icon="26"],
[data-category-icon="27"],
[data-category-icon="33"] {
    --r: 153;
    --g: 61;
    --b: 245;
    --h: 270;
    --s: 90%;
    --l: 60%;
    --hex: #993df5;
}
[data-platform="1"] {
    --x: 1;
    --y: 1;
}
[data-platform="2"] {
    --x: 2;
    --y: 1;
}
[data-platform="3"] {
    --x: 3;
    --y: 1;
}
[data-platform="4"] {
    --x: 4;
    --y: 1;
}
[data-platform="5"] {
    --x: 5;
    --y: 1;
}
[data-platform="6"] {
    --x: 6;
    --y: 1;
}
[data-platform="7"] {
    --x: 7;
    --y: 1;
}
[data-platform="8"] {
    --x: 8;
    --y: 1;
}
[data-platform="9"] {
    --x: 9;
    --y: 1;
}
[data-platform="10"] {
    --x: 10;
    --y: 1;
}
[data-platform="11"] {
    --x: 1;
    --y: 2;
}
[data-platform="12"] {
    --x: 2;
    --y: 2;
}
[data-platform="13"] {
    --x: 3;
    --y: 2;
}
[data-platform="14"] {
    --x: 4;
    --y: 2;
}
[data-platform="15"] {
    --x: 5;
    --y: 2;
}
[data-platform="16"] {
    --x: 6;
    --y: 2;
}
[data-platform="17"] {
    --x: 7;
    --y: 2;
}
[data-platform="18"] {
    --x: 8;
    --y: 2;
}
[data-platform="19"] {
    --x: 9;
    --y: 2;
}
[data-platform="20"] {
    --x: 10;
    --y: 2;
}
[data-platform="21"] {
    --x: 1;
    --y: 3;
}
[data-platform="22"] {
    --x: 2;
    --y: 3;
}
[data-platform="23"] {
    --x: 3;
    --y: 3;
}
[data-platform="24"] {
    --x: 4;
    --y: 3;
}
[data-platform="25"] {
    --x: 5;
    --y: 3;
}
[data-platform="26"] {
    --x: 6;
    --y: 3;
}
[data-platform="27"] {
    --x: 7;
    --y: 3;
}
[data-platform="28"] {
    --x: 8;
    --y: 3;
}
[data-platform="29"] {
    --x: 9;
    --y: 3;
}
[data-platform="30"] {
    --x: 10;
    --y: 3;
}
[data-platform="31"] {
    --x: 1;
    --y: 4;
}
[data-platform="32"] {
    --x: 2;
    --y: 4;
}
[data-platform="33"] {
    --x: 3;
    --y: 4;
}
[data-platform="34"] {
    --x: 4;
    --y: 4;
}
[data-platform="35"] {
    --x: 5;
    --y: 4;
}
[data-platform="36"] {
    --x: 6;
    --y: 4;
}
[data-platform="37"] {
    --x: 7;
    --y: 4;
}
[data-platform="38"] {
    --x: 8;
    --y: 4;
}
[data-platform="39"] {
    --x: 9;
    --y: 4;
}
[data-platform="40"] {
    --x: 10;
    --y: 4;
}
[data-platform="41"] {
    --x: 1;
    --y: 5;
}
[data-platform="42"] {
    --x: 2;
    --y: 5;
}
[data-platform="43"] {
    --x: 3;
    --y: 5;
}
[data-platform="44"] {
    --x: 4;
    --y: 5;
}
[data-platform="45"] {
    --x: 5;
    --y: 5;
}
[data-platform="46"] {
    --x: 6;
    --y: 5;
}
[data-platform="47"] {
    --x: 7;
    --y: 5;
}
[data-platform="48"] {
    --x: 8;
    --y: 5;
}
[data-platform="49"] {
    --x: 9;
    --y: 5;
}
[data-platform="50"] {
    --x: 10;
    --y: 5;
}
div.load {
    display: block;
    padding: 1em;
    text-align: center;
    pointer-events: none;
}
div.load .loading {
    display: inline-flex;
    align-items: center;
    gap: 1em;
    vertical-align: top;
    position: relative;
    white-space: nowrap;
    color: var(--body-text-color-a50, rgba(0 0 0/50%));
}
div.load .loading::after,
div.load .loading::before {
    content: "";
    display: block;
    font-size: 2em;
    width: 1em;
    height: 1em;
    border-radius: 100%;
    background: var(--SiteTHM);
    opacity: 0;
    animation: loadingdot 1.5s 0s ease-out infinite;
}
div.load .loading::after {
    position: absolute;
    inset-inline-start: 0;
    inset-block: 50%;
    margin-block: -0.5em;
    z-index: 1;
    animation-delay: 750ms;
}
@keyframes loadingdot {
    0% {
        transform: scale(0.25);
    }
    30% {
        opacity: 1;
    }
    100% {
        transform: scale(1);
    }
}
#search_empty {
    text-align: center;
    margin: 0 auto;
    padding: 2em;
    width: 100%;
    max-width: 40em;
    box-sizing: border-box;
}
#search_empty img {
    vertical-align: top;
    width: 100%;
    max-width: 30em;
    height: auto;
    aspect-ratio: 4/3;
    object-fit: contain;
}
#search_empty h3 {
    font-size: 1em;
    margin: 1em 0;
    font-weight: 800;
}
#tukitip_wrp {
    position: fixed;
    inset-inline: 0;
    inset-block-start: 0;
    z-index: 10000;
    height: 0;
    margin: 1em;
    display: flex;
    flex-direction: column;
    justify-content: start;
    align-items: center;
    gap: 1em;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-2em);
}
#tukitip_wrp.show {
    visibility: visible;
    opacity: 1;
    transform: none;
    transition: transform 0.3s, opacity 0.3s;
}
#tukitip {
    max-width: 40em;
    min-width: 15em;
    padding: 2em;
    text-align: center;
    background: var(--background-color-L1, #fff);
    border-radius: 1em;
    box-sizing: border-box;
    box-shadow: rgba(0 0 0/10%) 0 1em 2em;
}
#tukitip [icon] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.5em;
    align-items: center;
}
#tukitip [icon]::before {
    content: attr(icon);
    display: block;
    font-size: 2.5em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
    align-self: start;
}
#tukitip.alert {
    font-weight: 800;
    text-align: start;
    color: var(--text-color-alert);
    background-image: linear-gradient(
        var(--background-color-alert),
        var(--background-color-alert)
    );
}
#tukitip.success {
    font-weight: 800;
    text-align: start;
    color: var(--text-color-complete);
    background-image: linear-gradient(
        var(--background-color-complete),
        var(--background-color-complete)
    );
}
#tukitip .load {
    padding: 0;
}
body.tukibox_overlay {
    overflow: hidden;
}
#tukibox_overlay.show {
    visibility: visible;
    opacity: 1;
}
#tukibox_overlay.show > .inner {
    transform: none;
}
#tukibox_overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--background-color-mask-a75, rgba(255 255 255/75%));
    visibility: hidden;
    opacity: 0;
    transition: 0.3s;
    --pd: 2em;
    --MxHeight: calc(var(--VHeight) - var(--pd) * 2);
}
#tukibox_overlay > .inner {
    padding: var(--pd);
    transform: scale(0.9);
    transition: transform cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s,
        opacity cubic-bezier(0.5, 0, 0.5, 1.5) 0.3s;
}
.tukibox {
    position: relative;
}
.tukibox > .close {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    z-index: 1;
    margin: calc(var(--pd) / 2);
    opacity: 0.7;
}
@media only screen and (max-width: 480px), (max-height: 480px) {
    #tukibox_overlay {
        --pd: 1em;
    }
}
.tukibox_loading {
    width: 30em;
    height: 8em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-weight: 800;
    text-transform: uppercase;
}
.tukibox_content {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) / 2);
    padding-block: var(--spacing);
    --spacing: clamp(1.75em, 4vw, 3em);
}
.tukibox_content > .header {
    margin-inline: var(--spacing);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--spacing);
}
.tukibox_content > .content {
    padding: calc(var(--spacing) / 2) var(--spacing);
    flex: auto;
    overflow: hidden;
    overflow-y: auto;
}
.tukibox_content > .footer {
    margin-inline: var(--spacing);
}
.tukibox_content h3 {
    font-size: 1.333334em;
    font-weight: 800;
}
.tukibox_content .btc {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 1.5em;
}
.tukibox_content_orderconfirmation {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
    padding-block: var(--spacing);
    --spacing: clamp(1.75em, 4vw, 3em);
}
.tukibox_content_orderconfirmation > .content {
    padding-inline: var(--spacing);
    flex: auto;
    overflow: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
.tukibox_content_orderconfirmation > .footer {
    margin-inline: var(--spacing);
}
.tukibox_content_orderconfirmation .art {
    width: 90%;
    max-width: 30em;
    margin-inline: auto;
}
.tukibox_content_orderconfirmation .art > img {
    vertical-align: top;
    width: 100%;
    height: auto;
    aspect-ratio: 5/2;
    object-fit: contain;
}
.tukibox_content_orderconfirmation article {
    width: 90%;
    max-width: 30em;
    padding-block: 1em;
    margin-inline: auto;
    text-align: center;
}
.tukibox_content_orderconfirmation h3 {
    font-size: 1.333334em;
    font-weight: 800;
    text-transform: uppercase;
}
.tukibox_content_orderconfirmation .SKU_confirmation {
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.tukibox_content_orderconfirmation .ItemLink {
    grid-template-columns: auto 1fr auto;
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    padding: 1.5em;
    border-radius: 1em;
    --W: 4em;
}
.tukibox_content_orderconfirmation .ItemLink .C {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    align-items: center;
}
.tukibox_content_orderconfirmation .ItemLink .pri {
    color: var(--SiteTHM);
    font-weight: 800;
}
.tukibox_content_orderconfirmation .ItemLink .qtt {
    display: block;
    padding: 0.25em 1em;
    font-weight: 800;
    background: var(--body-text-color-a10, rgba(0 0 0/5%));
    border-radius: 1em;
}
.tukibox_content_orderconfirmation .promotion {
    color: var(--text-color-promotion);
    font-weight: 800;
    margin-inline: 1em;
}
.tukibox_content_orderconfirmation .order_data {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 0.5em 1.5em;
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    padding: 1.5em;
    border-radius: 1em;
    word-break: break-word;
}
.tukibox_content_orderconfirmation .order_data > .T {
    min-width: 4em;
}
.tukibox_content_orderconfirmation .order_data > .C {
    font-weight: 800;
}
.tukibox_content_orderconfirmation .btc {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 1.5em;
}
.tukibox_content_report {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    background: var(--background-color-L1, #fff);
    border-radius: 1em;
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    overflow: hidden;
    overflow-y: auto;
}
.tukibox_content_report .inner {
    padding-block: 2em;
    padding-inline: clamp(2em, 3vw, 3em);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
.tukibox_content_report h3 {
    font-size: 1.5em;
    font-weight: 800;
}
.tukibox_content_report .list {
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
}
.tukibox_content_report .list > li {
    flex: auto;
    min-width: calc(100% / 2 - 1em / 2);
}
.tukibox_content_report .cpt-checkbox > span > i {
    font-weight: 800;
}
.tukibox_content_report .comment {
    display: flex;
    flex-direction: column;
    background: var(--body-text-color-a5, #fff);
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/10%)) 0 0 0 1px;
    border-radius: 1em;
    overflow: hidden;
    transition: background 0.3s, box-shadow 0.3s;
    transform: translate3d(0, 0, 0);
}
.tukibox_content_report .comment:focus-within {
    background-color: var(--SiteTHM-A5);
    box-shadow: var(--SiteTHM) 0 0 0 2px;
}
.tukibox_content_report .comment > textarea {
    margin: 0;
    padding: 1.5em;
    border: unset;
    outline: 0;
    background: unset;
    color: currentColor;
    resize: none;
    height: calc(var(--h, 0) * 1px);
    min-height: 6em;
    max-height: 15em;
    line-height: 1.5;
    box-sizing: border-box;
    font-size: 1em;
    font-weight: 800;
}
.tukibox_content_report .comment > span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-inline: 1.5em;
    padding-block: 1em;
    box-shadow: var(--body-text-color-a10, rgba(0 0 0/10%)) 0 1px 0 inset;
    opacity: 0.5;
}
.tukibox_content_report .comment > span::after {
    content: attr(data-word-count) " / " attr(data-maxlength);
}
.tukibox_content_report .btc {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5em;
}
.tukibox_content_GoldMachine {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    text-align: center;
    background: var(--background-color-L1, #fff);
    border-radius: 1em;
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    overflow: hidden;
}
.tukibox_content_GoldMachine > .inner {
    padding-block: clamp(2em, 4vw, 3em);
    padding-inline: clamp(2em, 5vw, 4em);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.tukibox_content_GoldMachine .art img {
    max-width: 25em;
    width: 100%;
    height: auto;
    aspect-ratio: 300/180;
    object-fit: contain;
}
.tukibox_content_GoldMachine h3 {
    font-size: 1.333334em;
    font-weight: 800;
}
.tukibox_content_GoldMachine #affiliate_link_input {
    margin: 0;
    border: none;
    outline: 0;
    background: var(--background-color-L3, #fff);
    box-shadow: var(--body-text-color-a10, rgba(0 0 0/10%)) 0 0 0 1px inset;
    resize: none;
    width: 100%;
    height: 6em;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.5em;
    border-radius: 0.5em;
    color: currentColor;
    line-height: 1.5;
    font-family: inherit;
    font-size: 1em;
    font-weight: 800;
    text-align: center;
    word-break: break-word;
    transition: background 0.3s, box-shadow 0.3s;
}
.tukibox_content_GoldMachine #affiliate_link_input:focus {
    background: var(--SiteTHM-A10);
    box-shadow: var(--SiteTHM) 0 0 0 2px inset;
}
@media only screen and (max-width: 480px) {
    .tukibox_content_GoldMachine .art {
        width: calc(100% - 2em);
        margin-inline: auto;
    }
    .tukibox_content_GoldMachine #affiliate_link_input {
        height: 7.5em;
    }
}
.tukibox_content_redeemconfirmation {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
    padding-block: var(--spacing);
    --spacing: clamp(1.75em, 4vw, 3em);
}
.tukibox_content_redeemconfirmation > .content {
    padding-inline: var(--spacing);
    flex: auto;
    overflow: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
.tukibox_content_redeemconfirmation > .footer {
    margin-inline: var(--spacing);
}
.tukibox_content_redeemconfirmation h3 {
    font-size: 1.333334em;
    font-weight: 800;
}
.tukibox_content_redeemconfirmation .SKU_confirmation {
    display: flex;
    flex-direction: column;
    gap: 1em;
}
.tukibox_content_redeemconfirmation .ItemLink {
    grid-template-columns: auto 1fr auto;
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
    padding: 1.5em;
    border-radius: 1em;
}
.tukibox_content_redeemconfirmation .price_wrp {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1.5em;
    align-items: center;
    margin-inline: 1.5em;
}
.tukibox_content_redeemconfirmation .price_wrp .C {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.5em;
    color: var(--SiteTHM);
}
.tukibox_content_redeemconfirmation .price_wrp .C::before {
    font-size: 2em;
}
.tukibox_content_redeemconfirmation .price_wrp .pri {
    font-size: 1.25em;
    font-weight: 800;
    line-height: 1;
}
.tukibox_content_redeemconfirmation .btc {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 1.5em;
}
.tukibox_content_redeemconfirmation .btc .alert {
    flex: auto;
    color: var(--text-color-alert);
    font-weight: 800;
}
.tukibox_content_redeemconfirmation .btc .alert[icon] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1em;
    align-items: center;
}
.tukibox_content_redeemconfirmation .btc .alert[icon]::before {
    content: attr(icon);
    display: block;
    font-size: 2em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
    align-self: start;
}
.tukibox_content_redeemcoupon {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
.tukibox_content_redeemcoupon > .content {
    padding-inline: var(--spacing);
    flex: auto;
    overflow: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 1em;
    text-align: center;
    padding-block: var(--spacing);
    --spacing: clamp(2em, 4vw, 3em);
}
.tukibox_content_redeemcoupon h3 {
    font-size: 1.333334em;
    font-weight: 800;
}
.tukibox_content_redeemcoupon .art {
    width: 90%;
    max-width: 30em;
    margin-inline: auto;
}
.tukibox_content_redeemcoupon .art > img {
    vertical-align: top;
    width: 100%;
    height: auto;
    aspect-ratio: 2/1;
    object-fit: contain;
}
.tukibox_content_redeemcoupon .cpt-text {
    width: 100%;
    max-width: 20em;
    margin-inline: auto;
    font-size: 1.25em;
}
.tukibox_content_redeemcoupon .cpt-text > input {
    text-align: center;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5em;
}
.tukibox_content_redeemcoupon .btc {
    text-align: center;
}
.tukibox_content_prepaid_frame {
    width: 50em;
    height: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    transform: translate3d(0, 0, 0);
    display: flex;
    flex-direction: column;
}
.tukibox_content_prepaid_frame > .inner {
    flex: auto;
    position: relative;
}
.tukibox_content_prepaid_frame > .inner .close {
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    z-index: 2;
    border-radius: 0;
    border-end-start-radius: 1em;
}
.tukibox_prepaid_iframe {
    display: block;
    vertical-align: top;
    width: 100%;
    height: 100%;
    border: none;
}
.tukibox_content_prepaid_form {
    width: 35em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    transform: translate3d(0, 0, 0);
    display: flex;
    flex-direction: column;
    gap: var(--spacing);
    --spacing: clamp(1.75em, 4vw, 3em);
    padding: var(--spacing);
}
.tukibox_content_prepaid_form > .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
}
.tukibox_content_prepaid_form > .title h3 {
    font-size: 1.166667em;
    font-weight: 800;
}
.tukibox_content_prepaid_form > .title .close {
    margin: -0.75em;
}
.tukibox .prepaid_topup_form {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: var(--pd);
}
.tukibox .prepaid_topup_form .T span {
    display: block;
    font-weight: 800;
}
.tukibox .prepaid_topup_form .F {
    grid-column: 1/-1;
    text-align: end;
}
.tukibox_content_prepaid_list {
    width: 50em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    overflow: hidden;
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    transform: translate3d(0, 0, 0);
    display: flex;
    flex-direction: column;
    --spacing: clamp(1.75em, 4vw, 2.5em);
}
.tukibox_content_prepaid_list > .title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    padding: var(--spacing);
}
.tukibox_content_prepaid_list > .title h3 {
    font-size: 1.166667em;
    font-weight: 800;
}
.tukibox_content_prepaid_list > .title .close {
    margin: -0.75em;
}
.tukibox_content_prepaid_list > .content {
    flex: auto;
    padding-inline: var(--spacing);
    overflow: hidden;
    overflow-y: auto;
}
.tukibox_content_prepaid_list > .footer {
    padding: var(--spacing);
    text-align: end;
}
.tukibox_content_prepaid_list > .footer .btw {
    text-transform: uppercase;
}
.tukibox .prepaid_topup_list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12em, 1fr));
    gap: 1em;
}
.tukibox .prepaid_topup_list input[type="radio"] {
    position: absolute;
    inset: 100%;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.tukibox .prepaid_topup_list input[type="radio"] + div {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1em;
    align-items: center;
    padding: 1em;
    background: var(--background-color-L3, #fff);
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 0 0 1px inset;
    border-radius: 0.5em;
    cursor: pointer;
    transition: background 0.3s, box-shadow 0.3s;
}
.tukibox .prepaid_topup_list input[type="radio"] + div::before {
    content: "";
    display: block;
    width: 1.5em;
    height: 1.5em;
    overflow: hidden;
    background-color: var(--body-text-color-a10, rgba(0 0 0/10%));
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTkuMiAxNi4ybC0yLjktMi44Yy0uNC0uNC0uNC0xIDAtMS40LjQtLjQgMS0uNCAxLjQgMGwxLjQgMS40Yy40LjQgMSAuNCAxLjQgMGw1LjctNS43Yy40LS40IDEtLjQgMS40IDAgLjQuNC40IDEgMCAxLjRsLTcgNy4xYy0uNC40LTEgLjQtMS40IDB6IiBmaWxsPSJyZ2JhKDAgMCAwLzUlKSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAyKSIvPjxwYXRoIGQ9Ik05LjIgMTYuMmwtMi45LTIuOGMtLjQtLjQtLjQtMSAwLTEuNC40LS40IDEtLjQgMS40IDBsMS40IDEuNGMuNC40IDEgLjQgMS40IDBsNS43LTUuN2MuNC0uNCAxLS40IDEuNCAwIC40LjQuNCAxIDAgMS40bC03IDcuMWMtLjQuNC0xIC40LTEuNCAweiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==);
    background-size: 0;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 0.5em;
    transition: background-size cubic-bezier(0.5, 0, 0.5, 2) 0.3s,
        background-color 0.3s;
    align-self: start;
}
.tukibox .prepaid_topup_list b {
    font-size: 1.166667em;
    font-weight: 800;
    line-height: 1;
}
.tukibox .prepaid_topup_list i {
    font-style: normal;
    opacity: 0.7;
}
.tukibox .prepaid_topup_list input[type="radio"]:checked + div {
    background: var(--SiteTHM-A5);
    box-shadow: var(--SiteTHM) 0 0 0 2px inset;
}
.tukibox .prepaid_topup_list input[type="radio"]:checked + div::before {
    background-color: var(--SiteTHM);
    background-size: 100%;
}
.tukibox_content_CardExport {
    display: grid;
    grid-template-rows: auto 1fr auto;
    background: var(--background-color-L1, #fff);
    box-shadow: rgba(0 0 0/10%) 0 0.5em 2em;
    border-radius: 1em;
    overflow: hidden;
    width: 70em;
    max-width: calc(var(--VWidth) - var(--pd) * 2);
    max-height: calc(var(--VHeight) - var(--pd) * 2);
}
.tukibox_content_CardExport .header {
    padding: calc(var(--pd) / 1.5) var(--pd);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--pd);
}
.tukibox_content_CardExport .header h3 {
    font-size: 1em;
}
.tukibox_content_CardExport .header .close {
    margin-inline-end: -1em;
}
.tukibox_content_CardExport .content {
    overflow: auto;
    box-shadow: var(--body-text-color-a10, rgba(0 0 0/10%)) 0 0 0 1px;
}
.tukibox_content_CardExport .footer {
    padding: calc(var(--pd) / 1.5) var(--pd);
    display: flex;
    justify-content: end;
}
.tukibox_content_CardExport .footer .btc {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1em;
}
.tukibox_content_CardExport .pin_list {
    vertical-align: top;
    width: 100%;
    border-collapse: collapse;
    background: var(--background-color-L3, #fff);
}
.tukibox_content_CardExport .pin_list td,
.tukibox_content_CardExport .pin_list th {
    vertical-align: top;
    padding: 0.75em 1em;
    white-space: nowrap;
}
.tukibox_content_CardExport .pin_list th {
    padding-block: 1em;
    text-align: start;
    color: var(--body-text-color-a50, rgba(0 0 0/50%));
    background: var(--body-text-color-a5, rgba(0 0 0/5%));
}
.tukibox_content_CardExport .pin_list td {
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 1px 0 inset;
}
.tukibox_content_CardExport .pin_list td:first-child,
.tukibox_content_CardExport .pin_list th:first-child {
    padding-inline-start: var(--pd);
}
.tukibox_content_CardExport .pin_list td:last-child,
.tukibox_content_CardExport .pin_list th:last-child {
    padding-inline-end: var(--pd);
}
.tukibox_content_CardExport .pin_list code {
    font-family: var(--SiteFF);
    font-weight: 800;
}
.tukibox_content_coupon_promotion {
    width: 50em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    border-radius: 1em;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    --spacing: clamp(1.5em, 4vw, 2em);
    color: #fff;
    background-color: var(--background-color-L1, #fff);
    background-image: url(https://seagm-media.seagmcdn.com/art/v5/coupon_popup_bg0.png?x-oss-process=image/resize,w_1200),
        linear-gradient(var(--CouponPromotionBgAngle, 0deg), #3a6db0, #eb79a0);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    animation: CouponPromotionBg 30s linear infinite;
}
@property --CouponPromotionBgAngle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}
@keyframes CouponPromotionBg {
    0% {
        --CouponPromotionBgAngle: 0deg;
    }
    100% {
        --CouponPromotionBgAngle: 360deg;
    }
}
.tukibox_content_coupon_promotion .header {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 1em;
    padding: var(--spacing);
}
.tukibox_content_coupon_promotion .header h2 {
    font-size: 1.5em;
    font-weight: 800;
}
.tukibox_content_coupon_promotion .content {
    display: flex;
    flex-direction: column;
}
.tukibox_content_coupon_promotion .content::before {
    content: "";
    display: block;
    aspect-ratio: 1.75/1;
    background: url(https://seagm-media.seagmcdn.com/art/v5/coupon_popup_bg1.png?x-oss-process=image/resize,w_720)
        no-repeat center/contain;
    width: min(30em, calc(100% - var(--spacing) * 2));
    margin-inline: auto;
}
.tukibox_content_coupon_promotion .content::after {
    content: "";
    display: block;
    aspect-ratio: 4/1;
    background: url(https://seagm-media.seagmcdn.com/art/v5/coupon_popup_bg2.png?x-oss-process=image/resize,w_1200)
        no-repeat center bottom/contain;
}
.tukibox_content_coupon_promotion .coupon {
    width: min(30em, calc(100% - var(--spacing) * 2));
    box-sizing: border-box;
    margin-inline: auto;
}
.tukibox_content_downloadinvoice {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    background: var(--background-color-L1, #fff);
    border-radius: 1em;
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    overflow: hidden;
    overflow-y: auto;
}
.tukibox_content_downloadinvoice .inner {
    padding-block: 2em;
    padding-inline: clamp(1.5em, 3vw, 2.5em);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 1.5em;
}
.tukibox_content_downloadinvoice h3 {
    font-size: 1.5em;
    font-weight: 800;
}
.tukibox_content_downloadinvoice .details {
    display: grid;
    grid-template-columns: auto 1fr;
    background: var(--body-text-color-a5, rgba(0 0 0 / 5%));
    border-radius: 1em;
}
.tukibox_content_downloadinvoice .details > div {
    padding: 1em 1.5em;
}
.tukibox_content_downloadinvoice .details .C ~ .C,
.tukibox_content_downloadinvoice .details .T ~ .T {
    box-shadow: var(--body-text-color-a5, rgba(0 0 0 / 5%)) 0 1px 0 inset;
}
.tukibox_content_downloadinvoice .details .iid {
    font-weight: 800;
}
.tukibox_content_downloadinvoice .details .pid:not(:last-child)::after {
    content: " ,";
}
.tukibox_content_downloadinvoice .btc {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5em;
}
.tukibox_content_luckydraw {
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
    background-color: #9078f0;
    background-image: url(https://seagm-media.seagmcdn.com/art/v5/prize_bg.png?x-oss-process=image/resize,w_640,limit_0),
        radial-gradient(#9078f0, #6c48f8);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: #fff;
    border-radius: 1em;
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    overflow: hidden;
    overflow-y: auto;
}
.tukibox_content_luckydraw > .inner {
    padding: clamp(2em, 3vw, 4em);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5em;
    text-align: center;
}
.tukibox_content_luckydraw .art {
    max-width: 30em;
    width: 75%;
    aspect-ratio: 5/3;
}
.tukibox_content_luckydraw .art > img {
    width: 100%;
    height: 100%;
    aspect-ratio: 5/3;
    object-fit: contain;
    filter: drop-shadow(0 0.5em 1em rgba(0 0 0/25%));
}
.tukibox_content_luckydraw h3 {
    font-size: 1.25em;
    font-weight: 800;
}
.tukibox_content_luckydraw .btc .btw {
    font-size: 1.166667em;
    text-transform: uppercase;
}
.tukibox_content_luckydraw_winner {
    display: flex;
    flex-direction: column;
    gap: var(--pd);
    width: 40em;
    max-width: calc(var(--VWidth) - 2 * var(--pd));
    max-height: calc(var(--VHeight) - 2 * var(--pd));
    box-sizing: border-box;
}
.tukibox_content_luckydraw_winner .close {
    margin-inline-start: auto;
}
.tukibox_content_luckydraw_winner .art {
    width: 100%;
    aspect-ratio: 825/706;
    background: url(https://seagm-media.seagmcdn.com/art/v5/winner_bg2.png?x-oss-process=image/resize,w_960,limit_0)
        no-repeat center/contain;
    filter: drop-shadow(
        0 0.5em 1em var(--body-text-color-a50, rgba(0 0 0 / 25%))
    );
}
.tukibox_content_luckydraw_winner .btc {
    text-align: center;
}
.tukibox_content_luckydraw_winner .btw {
    font-size: 1.166667em;
    text-transform: uppercase;
}
.youtube-player {
    border-radius: 1em;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    margin-block: 1em;
    background: var(--background-color-L3, #fff)
        url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA2OCA0OCc+PHBhdGggZmlsbD0ncmdiYSgwLDAsMCwuMSknIGQ9J002Ni41Miw3Ljc0Yy0wLjc4LTIuOTMtMi40OS01LjQxLTUuNDItNi4xOUM1NS43OSwuMTMsMzQsMCwzNCwwUzEyLjIxLC4xMyw2LjksMS41NSBDMy45NywyLjMzLDIuMjcsNC44MSwxLjQ4LDcuNzRDMC4wNiwxMy4wNSwwLDI0LDAsMjRzMC4wNiwxMC45NSwxLjQ4LDE2LjI2YzAuNzgsMi45MywyLjQ5LDUuNDEsNS40Miw2LjE5IEMxMi4yMSw0Ny44NywzNCw0OCwzNCw0OHMyMS43OS0wLjEzLDI3LjEtMS41NWMyLjkzLTAuNzgsNC42NC0zLjI2LDUuNDItNi4xOUM2Ny45NCwzNC45NSw2OCwyNCw2OCwyNFM2Ny45NCwxMy4wNSw2Ni41Miw3Ljc0eicvPjxwYXRoIGQ9J00gNDUsMjQgMjcsMTQgMjcsMzQnIGZpbGw9J3doaXRlJy8+PC9zdmc+)
        no-repeat center/5em 5em;
    box-shadow: var(--body-text-color-a5, rgba(0 0 0/5%)) 0 0 0 1px;
    aspect-ratio: 16/9;
}
.youtube-player > iframe,
.youtube-player > video {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    margin: 0;
    object-fit: cover;
}
.Breadcrumbs.hide {
    display: none;
}
.livechat_container {
    position: fixed;
    inset-inline-end: 0;
    inset-block-end: 0;
    z-index: 8;
    margin-inline: 2em;
}
.livechat_container .livechat_btw {
    border-start-start-radius: 1em;
    border-start-end-radius: 1em;
    background: var(--SiteTHM);
    color: var(--body-background-color, #fff);
    box-shadow: var(--CPT-THM-A10) 0 0 0 1px, var(--CPT-THM-A10) 0 0 0 0.5em;
    font-weight: 800;
    cursor: pointer;
    padding: 0.75em 1.5em;
}
.livechat_container .livechat_btw > span {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1em;
    align-items: center;
}
.livechat_container .livechat_btw > span::before {
    content: attr(icon);
    display: block;
    font-size: 2em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
}
.livechat_container .livechat_btw.btwloading > span::before {
    content: "";
    border-radius: 100%;
    background: currentColor;
    opacity: 0;
    animation: btwloadingdot 0.75s 0s ease-out infinite;
}
@media only screen and (max-width: 1000px) {
    .livechat_container {
        margin-inline: 0;
    }
    .livechat_container .livechat_btw {
        border-start-end-radius: 0;
        padding: 0.75em 1em;
    }
    .livechat_container .livechat_btw > span {
        display: block;
        width: 2em;
        height: 2em;
        overflow: hidden;
    }
}
#cookies_announcement {
    position: fixed;
    inset-inline: 0;
    inset-block-end: 0;
    z-index: 9;
    display: flex;
    align-items: end;
    width: 100%;
    max-width: min(calc(var(--VWidth) - var(--spacing)), 40em);
    margin-inline: auto;
    margin-block: calc(var(--spacing) / 2);
    --spacing: clamp(2em, 3vw, 3em);
}
#cookies_announcement > .inner {
    background: var(--background-color-L1, #fff);
    box-shadow: rgb(0 0 0 / 10%) 0 1em 2em;
    padding: var(--spacing);
    border-radius: 1em;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 2em;
}
#cookies_announcement .intro {
    display: grid;
    gap: 1em;
    max-width: 60em;
}
#cookies_announcement .intro h3 {
    font-size: 1.5em;
    font-weight: 800;
    text-transform: uppercase;
}
#cookies_announcement .intro p {
    margin: 0;
}
#cookies_announcement .intro p.alert {
    color: var(--SiteTHM);
    font-weight: 800;
}
#cookies_announcement .btc {
    display: flex;
    flex-direction: row-reverse;
    gap: 1em 2em;
    align-items: center;
    justify-content: space-between;
}
#cookies_announcement .btw.accept {
    text-transform: uppercase;
}
#cookies_announcement a.policy {
    color: currentColor;
}
#cookies_announcement a.policy > span {
    display: flex;
    gap: 1em;
    align-items: center;
    justify-content: center;
    font-weight: 800;
}
#cookies_announcement a.policy > span::before {
    content: attr(icon);
    display: block;
    font-size: 1.5em;
    width: 1em;
    height: 1em;
    line-height: 1;
    overflow: hidden;
}
@media only screen and (max-width: 480px) {
    #cookies_announcement .intro h3 {
        font-size: 1.333334em;
    }
    #cookies_announcement .btc {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
}
body.dark {
    --CPT-THM-R: 0;
    --CPT-THM-G: 187;
    --CPT-THM-B: 255;
    --CPT-THM-H: 196;
    --CPT-THM-S: 100%;
    --CPT-THM-L: 50%;
    --body-background-color: hsl(
        var(--CPT-THM-H, 0) calc(var(--CPT-THM-S, 100%) / 10) 10%
    );
    --background-color-L1: hsl(
        var(--CPT-THM-H, 0) calc(var(--CPT-THM-S, 100%) / 10) 21%
    );
    --background-color-L2: hsl(
        var(--CPT-THM-H, 0) calc(var(--CPT-THM-S, 100%) / 10) 18%
    );
    --background-color-L3: hsl(
        var(--CPT-THM-H, 0) calc(var(--CPT-THM-S, 100%) / 10) 15%
    );
    --body-text-color: rgba(255 255 255 / 100%);
    --body-text-color-a75: rgba(255 255 255 / 75%);
    --body-text-color-a50: rgba(255 255 255 / 50%);
    --body-text-color-a25: rgba(255 255 255 / 25%);
    --body-text-color-a10: rgba(255 255 255 / 10%);
    --body-text-color-a5: rgba(255 255 255 / 5%);
    --body-text-color-a2: rgba(255 255 255 / 2%);
    --body-text-color-a0: rgba(255 255 255 / 0);
    --background-color-warning: rgba(255 255 0 / 10%);
    --text-color-warning: rgba(255 255 0);
    --background-color-alert: rgba(255 50 50 / 25%);
    --text-color-alert: rgba(255 70 70);
    --background-color-complete: rgb(154 205 50 / 10%);
    --text-color-complete: rgba(154 205 50);
    --color: #ffffff;
    --CPT-CLR: #fff !important;
    --CPT-INPTBG: rgba(255 255 255 / 5%);
    --CPT-INPTCL: #fff;
    --CPT-INPTTP: rgba(255 255 255 / 75%);
    --CPT-INPTPH: rgba(255 255 255 / 50%);
    --CPT-FBDCL: rgba(0 0 0 / 50%);
    --CPT-FBDBG: rgba(0 0 0 / 5%);
    --brightness-filter: 1;
    color-scheme: dark;
}