@charset "UTF-8";
body {
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    --Spacing:3em;
}

#promotion_content{}
#promotion_content>.inner{
    display: grid;
    grid-template-columns: 1fr 1.618fr;
    min-height: var(--VHeight);
}


#promotion_intro{
    color: var(--color-text);
    background-color: var(--background-color);
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2aWV3Qm94PSIwIDAgMTkyMCAxMDAwIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPnBhdGh7b3BhY2l0eTouMTtjbGlwLXBhdGg6dXJsKCNjbGlwUGF0aCk7ZmlsbDp1cmwoI2xpbmVhckdyYWRpZW50KTt9PC9zdHlsZT48Y2xpcFBhdGggaWQ9ImNsaXBQYXRoIj48cmVjdCB3aWR0aD0iMTkyMCIgaGVpZ2h0PSIxMDAwIi8+PC9jbGlwUGF0aD48bGluZWFyR3JhZGllbnQgaWQ9ImxpbmVhckdyYWRpZW50IiB4MT0iMCUiIHkxPSIwJSIgeDI9IjkwJSIgeTI9IjAlIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9ImhzbCgwIDAlIDEwMCUvMSkiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9ImhzbCgwIDAlIDEwMCUvMCkiLz48L2xpbmVhckdyYWRpZW50PjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE5MjAsMTAwMClzY2FsZSgtMSwtMSkiPjxwYXRoIGQ9Ik0xMzg0LjUgMzQzLjJMMTkyLjcgMTUzNWwtMjEzLjUtM0wxMzgzIDEyOC4ybDEuNSAyMTV6Ii8+PHBhdGggZD0iTTE5MTkuNyA0NDguM0wxMzU5IDEwMDlsLTEwMC40LTEuNEwxOTE5IDM0Ny4xbC43IDEwMS4yeiIvPjxwYXRoIGQ9Ik0xMTc2LjcgNTE0LjNMNjE2IDEwNzVsLTEwMC40LTEuNEwxMTc2IDQxMy4xbC43IDEwMS4yeiIvPjxwYXRoIGQ9Ik02NDQuNyA0NTcuM0w4NCAxMDE4bC0xMDAuNC0xLjRMNjQ0IDM1Ni4xbC43IDEwMS4yeiIvPjxwYXRoIGQ9Ik0xMzg3LjcgNDQ4LjNMODI3IDEwMDlsLTEwMC40LTEuNEwxMzg3IDM0Ny4xbC43IDEwMS4yeiIvPjxwYXRoIGQ9Ik0xMjUwLjEgNDkzLjhsLTU0NSA1NDUtNTIuNyA0My42IDY0MS45LTY0MS45LTQ0LjIgNTMuM3oiLz48cGF0aCBkPSJNODkxLjEgNjM5LjFMLTc3OCAyMzA4LjNsLTI5OC45LTQuMkw4ODkgMzM4LjFsMi4xIDMwMXoiLz48cGF0aCBkPSJNMTg3MC40IDQxOS44TC0yOC44IDIzMTlsLTM0MC4xLTQuOEwxODY4IDc3LjNsMi40IDM0Mi41eiIvPjxwYXRoIGQ9Ik05MDguNCA0MzYuOEwtOTkwLjggMjMzNmwtMzQwLjEtNC44TDkwNiA5NC4zbDIuNCAzNDIuNXoiLz48cGF0aCBkPSJNMTYzMi40IDUxNS44TC0yNjYuOCAyNDE1bC0zNDAuMS00LjhMMTYzMCAxNzMuM2wyLjQgMzQyLjV6Ii8+PHBhdGggZD0iTTExNzYuMyA1NjcuMUwtMTQ0NS42IDMxODlsLTQ2OS41LTYuNkwxMTczIDk0LjNsMy4zIDQ3Mi44eiIvPjxwYXRoIGQ9Ik0xNDI3LjMgNTgwLjFMLTExOTQuNiAzMjAybC00NjkuNS02LjZMMTQyNCAxMDcuM2wzLjMgNDcyLjh6Ii8+PHBhdGggZD0iTTE2NDkuNSA4ODAuMkw0NTcuNyAyMDcybC0yMTMuNS0zTDE2NDggNjY1LjJsMS41IDIxNXoiLz48cGF0aCBkPSJNNjc1LjggNTIyLjJsLTI2MjEuOSAyNjIxLjktNDY5LjQtNi42TDY3Mi41IDQ5LjRsMy4zIDQ3Mi44eiIvPjxwYXRoIGQ9Ik0yNTk1LjkgNTIyLjJMLTI2IDMxNDQuMWwtNDY5LjUtNi42TDI1OTIuNiA0OS40bDMuMyA0NzIuOHoiLz48L2c+PC9zdmc+),linear-gradient(135deg,hsl(var(--offset-h1) var(--offset-s1) var(--offset-l1)),hsl(var(--offset-h2) var(--offset-s2) var(--offset-l2)));
    background-repeat: repeat-x;
    background-position: top center;
    background-size: clamp(60em,var(--VWidth),100em) auto,cover;
    /*background-attachment: fixed;*/

    --threshold: .72;
    --background-color: rgba(var(--r), var(--g), var(--b), var(--background-alpha,1));
    --red: calc(var(--r) * .2126);
    --green: calc(var(--g) * .7152);
    --blue: calc(var(--b) * .0722);
    --sum: calc(var(--red) + var(--green) + var(--blue));
    --lightness:calc(var(--sum) / 255);
    --lightness-trend: clamp(0%,calc((var(--lightness) - var(--threshold)) * -999999999%),100%);
    --color-text:hsl(0 0% var(--lightness-trend));
    --color-img-bdc:hsl(0 0% var(--lightness-trend)/5%);
    --color-img-bgc:hsl(0 0% var(--lightness-trend)/10%);
    --offset-h1: calc(var(--h) + 10);
    --offset-h2: calc(var(--h) - 10);
    --offset-s1: calc(var(--s) * .9);
    --offset-s2: calc(var(--s) * .9);
    --offset-l1: max(calc(var(--l) - 15%),10%);
    --offset-l2: min(calc(var(--l) + 15%),90%);

    animation:bganimation linear 180s infinite;
}
@keyframes bganimation{100%{background-position:calc(clamp(50em,var(--VWidth),100em) * -1) 0,top center;}}

#promotion_intro:not([color]){
    --r:255;
    --g:255;
    --b:255;
    --h:0;
    --s:0%;
    --l:100%;
    background:linear-gradient(135deg,rgba(0 0 0/0%),rgba(0 0 0/5%));
}



#promotion_intro>.inner{
    max-width: 40em;
    padding:var(--Spacing);
    margin-inline-start: auto;
    box-sizing: border-box;
    position: sticky;
    top: 0;
    z-index: 1;
}

#promotion_info{}
#promotion_info>.inner{
    max-width: 80em;
    padding:var(--Spacing);
    margin-inline-end: auto;
    box-sizing: border-box;
}

@media only screen and (max-width:1000px){
    body{--Spacing:2em;}
    #promotion_content>.inner{display: block;}
    #promotion_intro>.inner{max-width:60em;margin:0 auto;}
    #promotion_info>.inner{max-width:60em;margin:0 auto;}
}
@media only screen and (max-width:800px){
    #promotion_content>.inner{display: block;}
    #promotion_intro>.inner{max-width:50em;}
    #promotion_info>.inner{max-width:50em;}
}














#promotion_intro .logo{}
#promotion_intro .logo a{display: block;color:currentColor;width:calc(91 / 21 * var(--size));height:var(--size);--size:2em;overflow: hidden;}
#promotion_intro .logo svg{vertical-align: top;width: 100%;height: 100%;opacity: .5;}
#promotion_intro .logo span{display:none;}

#promotion_intro .title{margin:var(--Spacing) 0;}
#promotion_intro .title h1{font-size:2.666667em;font-weight:750;text-transform: uppercase;line-height:1.333334;word-break:break-word;}

#promotion_countdown{max-width:30em;margin:var(--Spacing) 0;}
#promotion_countdown_title{}
#promotion_countdown_title>span{font-size:1.25em;font-weight:800;text-transform:uppercase;display:flex;align-items:center;gap:1em;opacity:.5;}
#promotion_countdown_title>span::before{content:'history_toggle_off';display:block;font-size:2em;width:1em;height:1em;line-height:1;overflow:hidden}
#promotion_countdown_title:only-child>span{opacity:1}
#promotion_countdown_title:only-child>span::before{content:'sentiment_very_dissatisfied'}
#promotion_timer{display:grid;grid-template-columns:repeat(4,1fr);gap:1em;padding:1em;margin-block-start:1em;border-radius:.5em;background-color:var(--color-img-bgc);}
#promotion_timer>div{font-size:2.5em;font-weight:800;line-height:1.25;text-align:center;}
#promotion_timer>div::after{content:attr(data-title);display:block;font-size:.75rem;font-weight:600;text-transform:uppercase;opacity:.5;}




#promotion_coupons{margin:0 0 var(--Spacing);}
#promotion_coupons>.title{margin: var(--Spacing) 0;}
#promotion_coupons>.title h3{font-size:1.5em;font-weight:800;margin:1em 0;}
#promotion_coupons>.title p{opacity:.7;}
#promotion_coupons .cpoList{display:grid;grid-template-columns:repeat(auto-fill,minmax(19em,1fr));gap:1.5em;}
#promotion_coupons .cpoList>li{}
#promotion_coupons .cpoList .coupon{--coupon-txsize:2em;--spacing:1.5em;padding:0;}
#promotion_coupons .cpoList .coupon .title{box-shadow:var(--coupon-bdc,var(--coupon-bdc-default)) 0 0 0 1px,rgba(0 0 0/5%) 0 0 1em;}
#promotion_coupons .cpoList .coupon .func{box-shadow:var(--coupon-bdc,var(--coupon-bdc-default)) 0 0 0 1px,rgba(0 0 0/5%) 0 0 1em;}
#promotion_coupons .cpoList .coupon .func .limit{white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis;}

#promotion_itemList{margin: var(--Spacing) 0;}
#promotion_itemList>.title{margin: var(--Spacing) 0;}
#promotion_itemList>.title h3{font-size:1.5em;font-weight:800;margin:1em 0;}
#promotion_itemList>.title p{opacity:.7;}
#promotion_itemList .ItemList{display: grid;grid-template-columns: repeat(auto-fill,minmax(13em,1fr));gap:1.5em;margin:var(--Spacing) 0;}
#promotion_itemList .ItemList>li{}
#promotion_itemList .ItemList>li>a{padding: 0;}
#promotion_itemList .ItemList .name{}

#promotion_terms{margin: var(--Spacing) 0;}
#promotion_terms h3{font-size:1.5em;font-weight:800;margin:1em 0;}
#promotion_terms p{margin:1em 0;}
#promotion_terms ul{margin:2em 0;padding-inline-start:2em;}
#promotion_terms ul>li{margin:1em 0;list-style:disc outside;}
#promotion_terms ol{margin:2em 0;padding-inline-start:2em;}
#promotion_terms ol>li{margin:1em 0;list-style:decimal outside;}
#promotion_terms img{display:block;max-width:min(40em,calc(100% - var(--Spacing) * 2));margin:1em auto;}

@media only screen and (max-width:1000px){
    #promotion_intro .logo a{--size:1.5em;}
    #promotion_intro .title h1{font-size:2em;line-height:1.5;text-align:center;margin:1.5em 0;}
    #promotion_countdown{margin:var(--Spacing) auto 0;text-align:center;}
    #promotion_countdown_title>span{font-size:1em;justify-content:center;}
    #promotion_timer{background:#fff;color:#000;box-shadow:rgba(0 0 0/10%) 0 0 2em;margin-block-end:calc(var(--Spacing) * -1 + -2em);}
    #promotion_timer>div{font-size:2em;}
    #promotion_timer>div::after{font-size:.5em;}
    #promotion_itemList .ItemList{grid-template-columns:repeat(auto-fill,minmax(12em,1fr));}
    #promotion_itemList .ItemList.card .img{--W:8em;}
    #promotion_itemList .ItemList.topup .img{--W:9em;}
}
@media only screen and (max-width:800px){
    #promotion_coupons>.title h3{font-size:1.25em;}
    #promotion_itemList>.title h3{font-size:1.25em;}
    #promotion_itemList .ItemList{grid-template-columns: repeat(auto-fill,minmax(10em,1fr));}
    #promotion_itemList .ItemList.card .img{--W:7em;}
    #promotion_itemList .ItemList.topup .img{--W:8em;}
    #promotion_itemList .ItemList .name{font-size:.8em;}
}
@media only screen and (max-width:480px){
    #promotion_timer{margin-block-end:calc(var(--Spacing) * -1 + -2em);}
    #promotion_coupons .cpoList{display:flex;gap:1em;overflow:hidden;overflow-x:auto;margin:calc(var(--Spacing) * -1);padding:var(--Spacing);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-color:transparent;scrollbar-width:none;}
    #promotion_coupons .cpoList::-webkit-scrollbar{height:0;width:0;display:none}
    #promotion_coupons .cpoList>li{flex:none;width:min(22.5em,calc(var(--VWidth) - 6em));scroll-snap-align:center;}
    #promotion_coupons .cpoList .coupon{--spacing:1.333334em}
    #promotion_itemList .ItemList{display:flex;flex-wrap:nowrap;gap:1em;overflow:hidden;overflow-x:auto;margin:calc(var(--Spacing) * -1);padding:var(--Spacing);scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-color:transparent;scrollbar-width:none;}
    #promotion_itemList .ItemList::-webkit-scrollbar{height:0;width:0;display:none}
    #promotion_itemList .ItemList>li{flex:none;width:10em;scroll-snap-align:center;}
}



#promotion_footer{display:flex;justify-content:space-between;align-items:center;margin-block-start:calc(var(--Spacing) * 2);padding-block-start:var(--Spacing);border-top:1px rgba(0 0 0/10%) solid;}
#promotion_footer .copyright{font-weight:800;opacity:.7;}
#promotion_footer .sns_list{display:flex;gap:.5em;}
#promotion_footer .sns_list>li{}
#promotion_footer .sns_list a.btw{--shadow-color:transparent;--CPT-BDR:.5em;}
#promotion_footer .sns_list a.btw:not(:hover){background:unset;color:inherit;opacity:.7;}
@media only screen and (max-width:1000px){
    #promotion_footer{flex-direction:column-reverse;gap:var(--Spacing);}
}