/*=====================================================================*/
/* CONTENT */
/*=====================================================================*/
.icon.material { font-family: 'Material Symbols Outlined'; font-size: 24px; font-weight: 300; line-height: 1; letter-spacing: 0; }
.icon.material.chevron_left:before { content: '\e5cb'; }
.icon.material.keyboard_arrow_down:before { content: '\e313'; }
.icon.material.arrow_forward:before { content: '\e5c8'; }
.icon.material.help:before { content: '\e887'; }
.icon.material.info:before { content: '\e88e'; }
.icon.material.coffee:before { content: '\efef'; }
.icon.material.ac_unit:before { content: '\eb3b'; }
.icon.material.star:before { content: '\e838'; }
.icon.material.thumb_up:before { content: '\e8dc'; }
.icon.material.egg_alt:before { content: '\eac8'; }
.icon.material.mode_heat:before { content: '\f16a'; }
.icon.material.delete:before { content: '\e872'; }
.icon.material.remove:before { content: '\e15b'; }
.icon.material.edit:before { content: '\e3c9'; }
.icon.material.add_shopping_cart:before { content: '\e854'; }
.icon.material.fastfood:before { content: '\e57a'; }
.icon.material.timer:before { content: '\e425'; }
.icon.material.redeem:before { content: '\e8b1'; }
.icon.material.location_on:before { content: '\e0c8'; }
.icon.material.face:before { content: '\e87c'; }
.icon.material.receipt_long:before { content: '\ef6e'; }
.icon.material.calendar_today:before { content: '\e935'; }
.icon.material.draw:before { content: '\e746'; }
.icon.material.verified:before { content: '\ef76'; }
.icon.material.mail:before { content: '\e158'; }
.icon.material.mark_email_unread:before { content: '\f18a'; }
.icon.material.open_in_new:before { content: '\e89e'; }
.icon.material.schedule:before { content: '\e8b5'; }
.icon.material.call:before { content: '\e0b0'; }
.icon.material.refresh:before { content: '\e5d5'; }
.icon.material.sell:before { content: '\f05b'; }
.icon.material.percent:before { content: '\eb58'; }
.icon.material.qr_code_2:before { content: '\e00a'; }
.icon.material.overview:before { content: '\e4a7'; }
.icon.material.visibility:before { content: '\e8f4'; }
.icon.material.visibility_off:before { content: '\e8f5'; }
.icon.material.sticky_note_2:before { content: '\f1fc'; }
.icon.material.coffee_maker:before { content: '\eff0'; }
.icon.material.volunteer_activism:before { content: '\ea70'; }
.icon.material.storefront:before { content: '\ea12'; }
.icon.material.business_center:before { content: '\eb3f'; }
.icon.material.notifications:before { content: '\e7f4'; }
.icon.material.confirmation_number:before { content: '\e638'; }
.icon.material.card_membership:before { content: '\e8f7'; }
.icon.material.group_add:before { content: '\e7f0'; }
.icon.material.chat:before { content: '\e0b7'; }
.icon.material.logout:before { content: '\e9ba'; }
.icon.material.cake:before { content: '\e7e9'; }
.icon.material.badge_:before { content: '\ea67'; }
.icon.material.my_location:before { content: '\e55c'; }
.icon.material.wrong_location:before { content: '\ef78'; }
.icon.material.delete_sweep:before { content: '\e16c'; }
.icon.material.add_circle:before { content: '\e147'; }
.icon.material.room_service:before { content: '\eb49'; }
.icon.material.account_balance_wallet:before { content: '\e850'; }
.icon.material.account_balance:before { content: '\e84f'; }
.icon.material.credit_card:before { content: '\e870'; }
.icon.material.check_circle:before { content: '\e86c'; }
.icon.material.error:before { content: '\e000'; }
.icon.material.warning:before { content: '\e002'; }
.icon.material.verified_user:before { content: '\e8e8'; }
.icon.material.emoji_nature:before { content: '\ea1c'; }
.icon.material.sentiment_excited:before { content: '\f6a5'; }
.icon.material.sentiment_satisfied:before { content: '\e813'; }
.icon.material.sentiment_neutral:before { content: '\e812'; }
.icon.material.sentiment_dissatisfied:before { content: '\e811'; }
.icon.material.sentiment_sad:before { content: '\f6a3'; }
.icon.material.thumb_up:before { content: '\e8dc'; }
.icon.material.thumb_down:before { content: '\e8db'; }
.icon.material.closee:before { content: '\e5cd'; }
.icon.material.mark_email_read:before { content: '\f18c'; }
.icon.material.content_copy:before { content: '\e14d'; }
.icon.material.sharee:before { content: '\e80d'; }
.icon.material.rate_review:before { content: '\e560'; }
.icon.material.takeout_dining:before { content: '\ea74'; }
/*--*/
/*=================================*/
/*====== bottom quick button ======*/
.quickctabtn-wrap.fixedbtm-wrap { 
    padding: 0; 
    border: 1px solid #d1d8f2; border-bottom: none; border-radius: 20px 20px 0 0; 
    text-align: center; 
}
.quickctabtn-wrap ul { 
    margin-bottom: 0; padding-left: 0px; list-style: none; line-height: 0;
    justify-content: center;
}
.quickctabtn-wrap li:first-child a { border-radius: 20px 0 0 0; }
.quickctabtn-wrap li:last-child a { border-radius: 0 20px 0 0; }
/*--*/
.quickctabtn { position: relative; display: block; height: 100%; padding: 14px 3px; line-height: 1; }
.quickctabtn .icon { display: inline-block; font-weight: 400; color: var(--gigi-darkblue); }
.quickctabtn .icon.home { width: 24px; height: 28px; }
.quickctabtn .desc {
    font-size: 10px; color: #666; letter-spacing: 0.025em;
    margin-top: 0px;
}
/*--*/
.quickctabtn:hover { background-color: rgba(232,236,248,0.5); }
.quickctabtn.active { background-color: #e8ecf8; }
.quickctabtn.alertdot:before { font-size: 9px; top: 14px; right: 32%; }
.quickctabtn .badge.qtt {
    top: 8px; right: 25%; background: #ff6450;
    font-size: 9px; color: #fff; line-height: 1.45;
}
/*=================*/
/*====== ... ======*/
.poptnc .stitle { font-weight: 600; margin-bottom: 3px; }
.poptnc .desc { font-size: 14px; color: #666; letter-spacing: 0.025em; }
.poptnc ol,
.poptnc ul { margin-bottom: 0; padding-left: 14px; }
.poptnc li + li { margin-top: 8px; }


/*=====================================================================*/
/* COMBO MENU */
/*=====================================================================*/
/*=================*/
/*====== ... ======*/
.combimg_d2 { 
    max-width: 800px; width: 100%; margin: 0 auto; 
    position: relative; display: flex; align-items: flex-start;
}
.combimg_d2 img { max-width: 73%; margin-top: auto; }
.combimg_d2 img.first { 
    position: relative; /*left: 2%;*/ z-index: 1;
    filter: drop-shadow(5px 1px 3px rgba(0, 0, 0, 0.2));
    left: -2%;
}
.combimg_d2 img.last { 
    position: absolute; /*bottom: 10%; left: 25%;*/ 
    bottom: 0%; left: 29%;
}
/*--*/
.combimg_d3 { 
    max-width: 800px; width: 100%; margin: 0 auto; 
    position: relative; display: flex; align-items: flex-start;
}
.combimg_d3 img { max-width: 54%; margin-top: auto; }
.combimg_d3 img.one { position: relative; left: 0; }
.combimg_d3 img.two { position: absolute; bottom: 0%; left: 23%; }
.combimg_d3 img.three { position: absolute; bottom: 0%; left: 46%; }
/*--*/
.combimg_d5 { 
    max-width: 800px; width: 100%; margin: 0 auto; 
    position: relative; display: flex; align-items: flex-start;
}
.combimg_d5 img { max-width: 54%; margin-top: auto; }
.combimg_d5 img.one { position: absolute; top: -14%; left: 14%; }
.combimg_d5 img.two { position: absolute; top: -14%; left: 38%; }
.combimg_d5 img.three { position: relative; bottom: -9%; left: 0; }
.combimg_d5 img.four { position: absolute; bottom: -9%; left: 23%; }
.combimg_d5 img.five { position: absolute; bottom: -9%; left: 46%; }
/*--*/
[class*=cart_list] .wrap .combimg_sall { display: flex; flex-wrap: wrap; width: auto !important; max-width: none !important; aspect-ratio: inherit !important; }
[class*=cart_list] .wrap .combimg_sall img { width: auto !important; aspect-ratio: 1; border-right: 1px solid rgba(0,0,0,0.08); }
[class*=cart_list] .wrap .combimg_sall img:last-child { border-right: none; }
/*--*/
[class*=cart_list] .wrap .combimg_d2 { aspect-ratio: 1; }
[class*=cart_list] .wrap .combimg_d2 img { width: 100%; height: 100%; object-fit: contain; }
/*--*/
[class*=cart_list] .wrap .combimg { position: relative; padding: 3px; aspect-ratio: 1; }
[class*=cart_list] .wrap .combimg img { position: absolute; height: auto !important; object-fit: inherit !important; }
[class*=cart_list] .wrap .combimg img.space { position: relative; opacity: 0; visibility: hidden; }
[class*=cart_list] .wrap .combimg .leftp { width: 55% !important; left: 7%; top: 12%; }
[class*=cart_list] .wrap .combimg .middlep { width: 72% !important; bottom: 0; left: 13%; }
[class*=cart_list] .wrap .combimg .rightp { width: 63% !important; bottom: 21%; left: inherit; right: 5%; }
/*=================*/
/*====== ... ======*/
.cart_list > .combo .wrap > .left { align-content: flex-start; }
.cart_list > .combo .wrap .row-cols-2 > *,
.ratecart_list > .combo .wrap .row-cols-2 > * { width: 47%; }
/*--*/
.cart_list > .combo .wrap ul.option > li + li { border-top: 1px dotted #999; margin-top: 5px; padding-top: 5px; }
.cart_list > .combo .wrap ul.option b { font-size: 13px; font-weight: 600; }
.cart_list > .combo .wrap ul.option ul { padding-left: 0; list-style: none; }
/*=================*/
/*====== ... ======*/
.myorder_list ul.cart_list > .combo .wrap ul.option > li + li { border-top: none; }
.myorder_list ul.cart_list > .combo .wrap ul.option { margin-top: 4px; }
/*--*/
.oprocessing-wrap ul.cart_list > .combo .wrap ul.option > li + li { border-top: none; }
.oprocessing-wrap ul.cart_list > .combo .wrap ul.option { margin-top: 4px; }
/*=================*/
/*====== ... ======*/
.pickupmenu-wrap.combo .pdetail_top-wrap { padding-top: 80px; margin-top: -80px; }
.pickupmenu-wrap.combo [class*=big] label .pimg img { border-radius: 13px 13px 0 0; }
.pickupmenu-wrap.combo .pdetail_choice-wrap [class*=big] input:checked + label { padding: 0; }
/*--*/
.pdetail_choice-wrap .bigradio .choicecombo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
/*--*/
.pdetail-wrap.combo .pdetail_totaladdcart-wrap .btn-solid { border-radius: 10px; }


/*=====================================================================*/
/* COFFEE PASS */
/*=====================================================================*/
/*=================*/
/*====== ... ======*/
.cpassticket { display: flex; justify-content: center; text-align: center; }
.cpassticket .img { border: 1px solid var(--gigi-newblue); border-radius: 5px 0 0 5px; max-width: 75px; }
.cpassticket .img img { max-width: 80%; }
/*--*/
.cpassticket .detail { 
    display: flex; align-items: center; justify-content: center;
    position: relative; padding: 6px 12px;
    border: 1px solid var(--gigi-newblue); border-left: none; border-radius: 0 5px 5px 0; 
    font-size: 9px; font-weight: 600; color: var(--gigi-newblue); text-transform: uppercase; letter-spacing: 0.075em; line-height: 1.1; word-break: break-word;
}
.cpassticket .detail .cup { font-size: 21px; font-weight: 700; font-style: italic; }
.cpassticket .detail .title { font-size: 11px; }


/*=====================================================================*/
/* OTHERs */
/*=====================================================================*/
/*====================*/
/*====== Ticket ======*/
/* 
 * coupon mask generator
 * (https://coupon.codelabo.cn/) 
 */
.ticketcon-wrap { filter: drop-shadow(1px 0px 0px rgba(0,76,200,0.35)) drop-shadow(-1px 0px 0px rgba(0,76,200,0.35)); position: relative; }
.ticketcon {
    -webkit-mask-image: radial-gradient(circle at 4px, transparent 4px, rgba(255,255,255,1) 4.5px);
    -webkit-mask-position: -4px; -webkit-mask-size: 100% 15px;
    display: inline-flex; position: relative; border-radius: 14px; backface-visibility: hidden; width: 100%; background: #fff; 
}
.ticketcon .left,
.ticketcon .right { 
    width: 100%; 
    border: 1px solid #d2d9f2; border-left: none; border-right: none; 
}
/*--*/
.ticketcon .left { position: relative; padding: 6px 10px 6px 15px; }
.ticketcon .left > .row {
    align-items: center; align-content: center; gap: 12px;
    min-height: 80px; margin: 0;
}
.ticketcon .left .img { 
    width: 5em; height: 5em; border-radius: 50%; background: var(--gigi-oldblue2); overflow: hidden; 
    display: inline-flex; align-self: flex-start; justify-content: center; margin-top: 6px;
    font-size: 12px; text-align: center;
}
.ticketcon .left .img img { max-width: 115px; }
.ticketcon .left .img.bgimg { padding: 0; }
.ticketcon .left .img.bgimg > div { width: 100%; height: 100%; }
.ticketcon .left .img.bgimg img { max-width: 100%; padding: 5px; width: 100%; height: 100%; object-fit: contain; transform: rotate(-15deg); }
.ticketcon .left .detail { min-width: 50%; padding: 5px 0; }
.ticketcon .left .title { 
    font-variation-settings: "GRAD" 150, "wdth" 125;
    font-size: 15px; font-weight: 800; line-height: 1.05; letter-spacing: 0.01em;
}
.ticketcon .left .desc {
    font-size: 11px; color: #666; line-height: 1.1; 
    margin-top: 4px; 
}
.ticketcon .left .desc:last-child { margin-top: 16px; padding-right: 17px; }
.ticketcon .tnc {
    font-size: 10px; font-weight: 600; color: var(--gigi-blue); line-height: 1; letter-spacing: 0.05em;
    position: absolute; right: 2px; bottom: 6px; 
    display: inline-block; padding: 5px 8px; 
}
/*--*/
.ticketcon .right {
    position: relative; width: 27%; padding: 10px 15px 10px 12px; border-left: 1px solid #d2d9f2;
    display: inline-flex; align-items: center; justify-content: center;
    transition: 0.3s 0.8s ease-out;
}
.ticketcon [class*=btn] {
    font-variation-settings: "wdth" 25;
    font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.075em; line-height: 1; word-break: keep-all;
    padding: 5px 6px; border-radius: 0; min-width: auto; min-height: auto;
}
.ticketcon .btn-solid { color: #fff; background: var(--gigi-blue); }
.ticketcon .btn-solid:before { content: none; }
.ticketcon .btn-border { color: var(--gigi-blue); border: 1px solid; }
.ticketcon .btn-fullclaim {
    color: var(--gigi-oldblue2); text-align: center; 
    width: 3em; height: 3em; border-radius: 50%; background: #fff; border: 1px dashed #ccc; transform: rotate(-26deg);
    display: inline-flex; justify-content: center;
}
/*--*/
.ticketcon .number { position: absolute; font-size: 12px; font-weight: 600; color: var(--gigi-blue); }
.ticketcon .number.claimed { animation: numberAdded 0.5s linear; }

@keyframes numberAdded {
    from { top: 30px; }
    to { top: 0px; }
}
/*--*/
.ticketcon.bg-greyish {
    background-image: linear-gradient(to top, rgba(251,251,251,1) 0%, rgba(243,243,243,1) 100%);
    background-position: center top; background-size: 100%; background-repeat: no-repeat;
}
.ticketcon-wrap.xline { filter: none; }
.ticketcon-wrap.xline .ticketcon .left { border-color: transparent; }
.ticketcon-wrap.xline .ticketcon .right { border-color: transparent; border-left-color: #d2d9f2; }
/*--*/
.tnc_ticket-wrap .stitle { font-weight: 600; margin-bottom: 3px; }
.tnc_ticket-wrap .desc { font-size: 13px; color: #666; }
.tnc_ticket-wrap ol { margin-bottom: 0; padding-left: 14px; }
.tnc_ticket-wrap li + li { margin-top: 12px; }
/*--*/
.offcanvas .ticketcon [class*=btn] { font-size: 11px; border-radius: 0; }
.offcanvas .ticketcon .btn-border { color: var(--gigi-blue); border: 1px solid; }
/*--*/
.ticketslider-wrap .stitle { font-size: 11px; font-weight: 500; color: #666; letter-spacing: 0.025em; margin-bottom: 6px; }
.ticketslider .owl-stage-outer { padding-left: 1px; }
.ticketslider .item { position: relative; min-width: 260px; max-width: 260px; overflow: hidden; }
/*============================*/
/*====== CORP / STUDENT ======*/
.csp-profile-wrap { 
    position: relative; background: var(--gigi-darkblue); padding: 20px; border-radius: 15px; overflow: hidden; color: #fff; 
    min-height: min(50vw, 260px);
    display: flex; flex-flow: column; max-width: 430px; margin: 0 auto;
}
.csp-profile-wrap.disabled { opacity: 0.5; filter: grayscale(1); }
.csp-profile-wrap a { color: #fff; }
/*--*/
.csp-profile-wrap .bg { position: absolute; top: 0; left: 0; filter: grayscale(1) opacity(0.25); }
.csp-profile-wrap .logo { 
    position: relative; 
    font-size: 12px; color: var(--border-lightblue); text-transform: uppercase; letter-spacing: 0.1em; 
}
.csp-profile-wrap .logo img { max-width: 100px; max-height: 50px; border-radius: 7px; }
.csp-profile-wrap .date, 
.csp-profile-wrap .type { font-size: 12px; color: var(--border-lightblue); text-align: right; text-transform: uppercase; letter-spacing: 0.1em; }
.csp-profile-wrap .date { margin-bottom: 2px; }
.csp-profile-wrap .type { margin-bottom: 40px; }
.csp-profile-wrap > .position-relative { display: flex; flex-flow: column; flex: 1; }
.csp-profile-wrap > .position-relative > .col { align-content: end; margin-right: 16px; }
/*--*/
.csp-profile-wrap .name { font-size: 20px; font-weight: 600; letter-spacing: 0; position: relative; }
.csp-profile-wrap .name a.btn-edit { 
    display: inline-block; margin-left: 4px;
    font-size: 17px;  vertical-align: middle; line-height: 1;
    position: absolute; margin-top: 3px;
}
.csp-profile-wrap .name a.btn-edit .icon { font-size: 1em; }
/*--*/
.csp-profile-wrap .email { margin-top: 1px; font-size: 14px; letter-spacing: 0.025em; }
.csp-profile-wrap .email span { vertical-align: middle; }
.csp-profile-wrap .email .icon.verify.success { font-size: 1.2em; color: #00c892; }
/*--*/
.csp-profile-wrap .namedeco-bubble {
    font-size: 42px;
    position: absolute; bottom: -14px; right: -12px; border-color: transparent;
    fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-width: 16px;
    display: flex; align-items: center; justify-content: center; 
}
.csp-profile-wrap .namedeco-bubble > * { margin-top: -7px; margin-left: -5px; }
.csp-profile-wrap .namedeco-bubble img,
.csp-profile-wrap .namedeco-bubble svg { max-width: 40px; width: 100%; }
.csp-profile-wrap .namedeco-bubble .icon { font-size: 0.75em; }

.csp-profile-wrap .namedeco-bubble.corp { 
    background: #a4620d; 
    stroke: #fff; color: #fff;
}
.csp-profile-wrap .namedeco-bubble.stud { 
    background: #fef7c3;
    stroke: var(--gigi-darkblue); color: var(--gigi-darkblue);
}
/*===============================*/
/*====== dash order status ======*/
.dashorderstatus { 
    display: flex; align-items: center;
    width: 100%; background: #f3f3f3; border: 1px solid #ddd; border-radius: 20px 20px 0 0; 
    color: var(--gigi-darkblue);
    position: fixed; left: 0; bottom: 0; z-index: 1;
}
.dashorderstatus:after {
    content: '\e5cc'; font-family: 'Material Symbols Outlined'; 
    font-size: 18px; line-height: 1; letter-spacing: 0;
    position: absolute; right: 12px; top: 50%; transform: translate(0, -50%); 
}
.dashorderstatus .left,
.dashorderstatus .right { padding-top: 5px; padding-bottom: 12px; }
.dashorderstatus .left { padding-left: 5px; padding-right: 5px; min-width: 55px; }
.dashorderstatus .right { padding-left: 5px; padding-right: 25px; }
.dashorderstatus .badge.status { font-size: 9px; padding: 3px 6px; margin-bottom: 5px; border-radius: 3px; }
.dashorderstatus .badge.status.normal { background: rgba(1,47,116,0.16); color: var(--gigi-blue); }
.dashorderstatus .badge.status.success { background: rgba(0,199,146,0.3); color: var(--gigi-blue); }
.dashorderstatus .badge.status.pending { background: rgba(247,160,89,0.3); color: #ff8016; }
.dashorderstatus .badge.status.failed { background: rgba(173,173,173,0.3); color: #666; }
.dashorderstatus .no { 
    font-variation-settings: "GRAD" 50, "wdth" 25;
    font-size: 11px; font-weight: 600; letter-spacing: 0.035em; text-transform: uppercase; 
}
.dashorderstatus .desc { font-size: 11px; color: #666; letter-spacing: 0.025em; }
/*--*/
.dashorderstatus.addbtmspace { margin-bottom: -20px; }
.dashorderstatus.addbtmspace:after { top: 36%; }
.dashorderstatus.addbtmspace .left, 
.dashorderstatus.addbtmspace .right { padding-bottom: 32px; }
/*========================================*/
/*====== dash order status (slider) ======*/
.dashorderstatuslider { 
    width: calc(100% - 15px); background: var(--gigi-lblue); border-radius: 15px; margin-bottom: 6px;
    position: fixed; left: 50%; bottom: 0; z-index: 1; transform: translate(-50%,0);
}
.dashorderstatuslider.oneslide .dashorderstatus_item { padding-bottom: 10px; }
/*--*/
.dashorderstatuslider .owl-dots { position: absolute; bottom: 10px; left: 50%; transform: translate(-50%,0); line-height: 0; }
.dashorderstatuslider .owl-dots .owl-dot { vertical-align: middle; }
.dashorderstatuslider .owl-dots .owl-dot span { 
    position: relative; display: block; width: 4px; height: 4px; background: rgba(255,255,255,1); margin: 0 2px; 
    border: 0.8px solid var(--gigi-blue); border-radius: 50%; transition: .3s ease;
}
.dashorderstatuslider .owl-dots .owl-dot.active span { background: var(--gigi-blue); width: 10px; height: 2px; border-radius: 9px; }
/*--*/
.dashorderstatus_item { 
    display: flex; align-items: center; padding: 10px 0 22px;
    color: #fff;
}
.dashorderstatus_item:after {
    content: '\e5cc'; font-family: 'Material Symbols Outlined'; 
    font-size: 18px; line-height: 1; letter-spacing: 0; color: #fff;
    position: absolute; right: 10px; top: 48%; transform: translate(0, -50%); 
}
.dashorderstatus_item .left { padding-left: 5px; padding-right: 5px; min-width: 55px; }
.dashorderstatus_item .right { padding-left: 5px; padding-right: 25px; }
.dashorderstatus_item .badge.status { font-size: 9px; padding: 3px 6px; margin-bottom: 5px; border-radius: 3px; }
.dashorderstatus_item .badge.status.normal { background: rgba(1,47,116,0.4); color: #fff; }
.dashorderstatus_item .badge.status.failed { background: rgba(0,0,0,0.15); color: #ddd; }
.dashorderstatus_item .no { font-size: 12px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase;  color: #fff; }
.dashorderstatus_item .desc { font-size: 11px; color: #eee; }


/*=====================================================================*/
/* EVENTS */
/*=====================================================================*/
/*=============================*/
/*====== Event Christmas ======*/
.event-xmas2024 .menu-penguin { position: absolute; left: 50%; bottom: 28px; transform: translate(-50%, 0); max-width: 41px; }
.event-xmas2024 .menu-penguin img { animation: leftright 3s linear infinite; transform-origin: bottom; }

@keyframes leftright {
    0% { transform: rotate(0); }
    35% { transform: rotate(6deg); }
    75% { transform: rotate(4deg); }
    100% { transform: rotate(0); }
}
/*--*/
.event-xmas2024 .ticketcon .left, 
.event-xmas2024 .ticketcon .right {
    background-image: url(../../landing/the3littlebuddiesonholidays2024/draw-your-gift/assets/images/deco-dot-white.png), url(../../landing/the3littlebuddiesonholidays2024/draw-your-gift/assets/images/deco-dot-white.png), url(../../landing/the3littlebuddiesonholidays2024/draw-your-gift/assets/images/deco-dot-white.png), url(../../landing/the3littlebuddiesonholidays2024/draw-your-gift/assets/images/deco-dot-white.png), linear-gradient(to top, rgba(251, 251, 251, 1) 0%, rgba(235, 235, 235, 1) 100%);
    background-position: right 5% top 20px, right 28% top 2px, left 5% top 50px, left 30% top 8px, center top;
    background-size: 5px, 3px, 5px, 6px, 100%;
    background-repeat: no-repeat;
}
.event-xmas2024 .ticketcon .left .img.bgimg { background-color: #d61725; background-image: linear-gradient(to bottom, #ee3139 0%, #a82226 100%); }
.event-xmas2024 .ticketcon .left .title { font-family: 'STIX Two Text', serif; font-size: 15px; letter-spacing: 0; }
.event-xmas2024 .ticketcon .right .btn-solid { background-color: #d61725; }
.event-xmas2024 .ticketcon .right .btn-fullclaim { color: #d72027; }
.event-xmas2024 .ticketcon .right .deco { max-width: 40px; width: 55vw; position: absolute; left: 50%; bottom: -6px; transform: translate(-50%, 0); }
/*============================*/
/*====== Event CNY 2025 ======*/
.event-cny2025.ticketcon-wrap { filter: drop-shadow(1px 0px 0px #122337) drop-shadow(-1px 0px 0px #122337); }
.event-cny2025 .ticketcon .left, 
.event-cny2025 .ticketcon .right { border-color: var(--gigi-darkblue); }
/*--*/
.event-cny2025 .ticketcon .left {
    background-image: url(../../landing/a-pine-perous-year/main/assets/images/deco-pineapplecut.png);
    background-color: #f5c12d; background-repeat: no-repeat; background-size: min(110px, 28vw); background-position: right min(-1.2vw, -18px) bottom -3vw;
}
.event-cny2025 .ticketcon .left .img.bgimg { background-color: #f5c12e; border: 1px solid; }
.event-cny2025 .ticketcon .left .img.bgimg img {  }
.event-cny2025 .ticketcon .left .title { font-family: "Knewave", serif; font-size: 17px; font-weight: 400; letter-spacing: 0; line-height: 1.1; }
.event-cny2025 .ticketcon .left .desc { color: var(--gigi-darkblue); }
/*--*/
.event-cny2025 .ticketcon .right { background-color: #41a545; border-color: var(--gigi-darkblue); }
.event-cny2025 .ticketcon .right .btn-solid { background-color: #f5c12e; color: var(--gigi-darkblue); border: 1px solid; }
.event-cny2025 .ticketcon .right .btn-fullclaim { background-color: #e3e3e3; color: var(--gigi-darkblue); }
.event-cny2025 .ticketcon .right .btn-border { color: #fff; }
.event-cny2025 .ticketcon .right .number { color: #fff; }
/*===========================*/
/*====== Event Ramadan ======*/
.event-ramandan2025 .ticketcon .left, 
.event-ramandan2025 .ticketcon .right {
    background-image: url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-moon.png'), linear-gradient(to top, rgba(251, 251, 251, 1) 0%, rgba(235, 235, 235, 1) 100%);
    background-position: right 5% top 20px, right 28% top 2px, left 5% top 50px, left 30% top 8px, left 15% top 10px, center top;
    background-size: 5px, 3px, 5px, 6px, 20px, 100%;
    background-repeat: no-repeat;
}
.event-ramandan2025 .ticketcon .left .img.bgimg { background-color: #04452a; }
.event-ramandan2025 .ticketcon .right .btn-solid { background-color: #04452a; }
.event-ramandan2025 .ticketcon .right .btn-fullclaim { color: #04452a; }
.event-ramandan2025 .ticketcon .right .deco { max-width: 40px; width: 55vw; position: absolute; left: 50%; bottom: -26px; transform: translate(-50%, 0); }
/*--*/
.event-ramandan26 .ticketcon {
    background-color: #dde9a7;
    background-image: url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-star.png'), url('../../landing/ramadan2025/assets/images/deco-moon.png');
    background-position: right 5% top 20px, right 28% top 2px, left 2% top 50px, left 30% top 5px, right 30% top 10px;
    background-size: 5px, 3px, 5px, 6px, 16px;
    background-repeat: no-repeat;
}
.event-ramandan26 .ticketcon .right { border-left-color: #b9cb91 !important; }
.event-ramandan26 .ticketcon .right .btn-solid { background-color: #04452a; }
.event-ramandan26 .ticketcon .right .btn-border { color: #04452a; }
/*=============================*/
/*====== Event women day ======*/
.event-womenday .ticketcon .left .img.bgimg { background-color: #f9c4db; }
.event-womenday .ticketcon .right .btn-solid { background-color: #f9c4db; color: var(--gigi-darkblue); }
.event-womenday .ticketcon .right .btn-fullclaim { color: #f83188; }
.event-womenday .ticketcon .right .deco { max-width: 40px; width: 55vw; position: absolute; left: 50%; bottom: -26px; transform: translate(-50%, 0); }
/*===============================*/
/*====== Event fathers day ======*/
.event-fatherday .ticketcon .left .img.bgimg { background-color: #c4d8f9; }
.event-fatherday .ticketcon .right .btn-solid { background-color: #c4d8f9; color: var(--gigi-darkblue); }
.event-fatherday .ticketcon .right .deco { max-width: 40px; width: 55vw; position: absolute; left: 70%; bottom: -30px; transform: translate(-50%, 0) rotate(-15deg); filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.1)); }
/*=============================*/
/*====== Event pistachio ======*/
.event-pistachio.ticketcon-wrap { filter: drop-shadow(1px 0px 0px #ddd7c6) drop-shadow(-1px 0px 0px #ddd7c6); }
.event-pistachio .ticketcon .left {
    color: #334229; border: 1px solid #ddd7c6;
    background-color: #dfd9c8;
    background-image: linear-gradient(to bottom, #ddd7c6 0%, #aea380 100%);
}
.event-pistachio .ticketcon .left .img.bgimg { background-color: rgba(0,0,0,0.2); }
.event-pistachio .ticketcon .right { 
    border-left: 1px solid #ddd7c6; 
    background-position: right 5% top 20px, right 28% top 2px, left 5% top 50px, left 30% top 8px, left 15% top 10px, center top;
    background-size: 5px, 3px, 5px, 6px, 20px, 100%;
    background-repeat: no-repeat;
}
.event-pistachio .ticketcon .right .btn-solid { background-color: #334229; }
.event-pistachio .ticketcon .right .btn-border,
.event-pistachio .ticketcon .right .btn-fullclaim { color: #334229; }
.event-pistachio .ticketcon .right .deco { max-width: 40px; width: 55vw; position: absolute; left: 70%; bottom: -13px; transform: translate(-50%, 0) rotate(90deg); }
/*================================*/
/*====== Event x Ann Jaafar ======*/
.event-xaj .menu { position: absolute; left: 50%; bottom: 28px; transform: translate(-50%, 0); max-width: 50px; width: 100%; }
/*--*/
.event-xaj .ticketcon .left, 
.event-xaj .ticketcon .right { background-color: #f8f4f2; background-size: cover; background-position: center; }
.event-xaj .ticketcon .left .img.bgimg { background-color: #538cbd; }
.event-xaj .ticketcon .right .btn-solid { background-color: #538cbd; }
.event-xaj .ticketcon .right .deco { max-width: 40px; width: 55vw; position: absolute; left: 50%; bottom: -6px; transform: translate(-50%, 0); }
/*===============================*/
/*====== Event Tom & Jerry ======*/
.event-tnj .menu { position: absolute; left: 50%; bottom: 28px; transform: translate(-50%, 0); max-width: 50px; width: 100%; }
.event-tnj.quickctabtn .badge.qtt { 
    font-family: Fascinate; font-size: 30px; font-weight: 800; line-height: 0; color: #ea1b32;
    background: none; top: -10%; right: inherit; left: 52%; transform: rotate(10deg);
    -webkit-text-stroke: 0.3px; -webkit-text-stroke-color: #f7f5c0;
    filter: drop-shadow(0.5px 0.5px 0px #f7f5c0) drop-shadow(-0.5px -0.5px 0px #f7f5c0) drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.2));
}
/*--*/
.event-tnj.ticketcon-wrap { filter: none; }
.event-tnj .ticketcon { 
    background-repeat: no-repeat;
    background-size: 265px, 112px, 100%; background-position: top -190px right, bottom -26px right -14px,center;
}
.event-tnj .ticketcon .left, 
.event-tnj .ticketcon .right { background: transparent; border-color: transparent; }
.event-tnj .ticketcon .left .img.bgimg { background-color: #ffac2a; background-repeat: no-repeat; background-size: contain; }
.event-tnj .ticketcon .right { border-left-color: #beaa99; }
.event-tnj .ticketcon .right .btn-fullclaim { color: inherit; }
/*================================*/
/*====== Event Merdeka 2025 ======*/
.event-merdeka.ticketcon-wrap { filter: none; }
.event-merdeka .ticketcon { -webkit-mask-image: none; }
.event-merdeka .ticketcon .left, 
.event-merdeka .ticketcon .right { 
    background-color: #ffcf80; background-position: center; background-size: 100%;
    background-image: linear-gradient(to top, #ffcf80 0%, #ffd7bd 100%); 
    border: 1px solid #4f2c2c;
}
.event-merdeka .ticketcon .left .deco {
    max-width: 70px; width: 24vw;
    position: absolute; right: -16px; top: -15px; transform: rotate(-80deg); z-index: 1;
}
.event-merdeka .ticketcon .right .deco {
    max-width: 80px; width: 24vw;
    position: absolute; right: -11px; bottom: -13px;
}
/*--*/
.event-merdeka .ticketcon .left { border-right: none; border-radius: 12px 0 0 12px; }
.event-merdeka .ticketcon .left .img.bgimg { border: 1px solid #000; z-index: 1; }
.event-merdeka .ticketcon .left .title { padding-right: 13%; }
/*--*/
.event-merdeka .ticketcon .right { border-radius: 0 12px 12px 0; }
.event-merdeka .ticketcon .right .btn-solid { background-color: var(--gigi-oldblue2); }
.event-merdeka .ticketcon .right .btn-fullclaim { color: var(--gigi-darkblue); border-color: inherit; }
/*======================================*/
/*====== Event Avocatdo preloader ======*/
.event-avocatdo.pre_loader { background-color: #0f1408; background-repeat: no-repeat; background-position: center; background-size: auto 100%; color: #fff; }
.event-avocatdo.pre_loader .text-anniv { position: absolute; top: 26.2%; left: 49.5%; transform: translate(-50%, 0); width: 48%; }
/*--*/
/*
 * © https://codepen.io/robinrendle/pen/wvaxEMz
 * + [chatGPT]
*/
.event-avocatdo.pre_loader .title-avocatdo { position: absolute; top: 33.45%; left: 51.2%; transform: translate(-50%,0); width: 61.5%; }
.event-avocatdo.pre_loader .title-avocatdo svg [class*=text-] { animation: wiggleWiggle 2.3s steps(2, end) infinite; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-a { animation-delay: 0.15s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-v { animation-delay: 0s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-o { animation-delay: 0.3s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-c { animation-delay: 0.3s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-a2 { animation-delay: 0.1s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-t { animation-delay: 0.15s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-d { animation-delay: 0.2s; }
.event-avocatdo.pre_loader .title-avocatdo svg .text-o2 { animation-delay: 0.25s; }

@keyframes wiggleWiggle {
    20%, 100% { transform: translate(0, 3px); }
    0% { transform: translate(0, 0px); }
    10% { transform: translate(0, 3px); }
}
/*--*/
.event-avocatdo.pre_loader .title-avacatdo-decotail { 
    transform-origin: 90% 75%;
    animation: tailWave 2.3s ease-in-out infinite; animation-delay: 0.3s;
}

@keyframes tailWave {
    0%, 35% { transform: rotate(0deg); } /* start a bit earlier */
    45%     { transform: rotate(15deg); }
    55%     { transform: rotate(-10deg); }
    65%     { transform: rotate(20deg); }
    75%     { transform: rotate(-15deg); }
    85%,100%{ transform: rotate(0deg); } /* end a bit earlier */
}
/*--*/
.event-avocatdo.pre_loader .title-avacatdo-meow { position: absolute; top: 33%; right: 15.4%; width: 9.3%; }
.event-avocatdo.pre_loader .title-avacatdo-meow2 { position: absolute; top: 34.43%; right: 11.45%; width: 8.9%; transform: rotate(14deg); }
/*============================*/
/*====== Event Avocatdo ======*/
.event-avocatdo .menu { position: absolute; left: 50%; bottom: 28px; transform: translate(-50%, 0); margin-left: 15px; max-width: 58px; width: 100%; }
/*--*/
.event-avocatdo.ticketcon-wrap .deco1 { 
    max-width: 40px; width: 55vw;
    position: absolute; left: 42px; top: -7px; transform: rotate(-42deg); z-index: 1;
}
.event-avocatdo.ticketcon-wrap .deco2 {
    max-width: 50px; width: 24vw;
    position: absolute; left: 50%; bottom: -6px; transform: translate(-50%, 0); z-index: 1;
}
.event-avocatdo .ticketcon .left .img.bgimg { background-color: #65942c; }
.event-avocatdo .ticketcon .right .btn-solid { background-color: #447219; }
.event-avocatdo .ticketcon .right .btn-fullclaim { color: #447219; }
/*--*/
.event-avocatdo.promoctacon {
    background-image: linear-gradient(to bottom, #dcebe0 0%, #eff5e5 100%);
    display: flex; align-items: center; position: relative; min-height: 68px; margin-top: 15px; padding: 13px 18px; padding-right: 80px; border-radius: 10px;
    font-size: 15px; font-weight: 600; color: #052910; letter-spacing: 0.025em;
}
.event-avocatdo.promoctacon p { margin-bottom: 0; line-height: 1.2; }
.event-avocatdo.promoctacon p a { text-decoration: underline; color: #999; }
.event-avocatdo.promoctacon img { position: absolute; right: 0; top: 1px; width: 65px; border-radius: 10px; transform: rotate(15deg); }
/*=================================*/
/*====== Event Dream Holiday ======*/
[class*=dhgbox] .modal-dialog.modal-fullscreen { padding: 0; }
[class*=dhgbox] .modal-content { 
    display: flex; justify-content: center; min-height: 100%; height: auto; background: rgb(18,35,55,0.7);
    text-align: center; 
}
.pop-dhgboxopen .btn-close {
    font-size: 18px;
    width: 1.3em; height: 1.3em; border: 2px solid #fff; border-radius: 50%; position: static; opacity: 1; 
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}
/*--*/
.pop-dhgbox.show .gboxwhole { width: 170px; margin: 0 auto; animation: jump-shaking 0.83s 2 ease-in-out; }
/*--*/
.dh_imgiftcon { 
    position: relative; display: inline-block; max-width: 170px; margin: 0 auto; 
    transition: filter 0.5s ease-out;
}
.dh_imgift:before {
    content: ''; width: 160%; height: 100%;
    background: url(../images/dh-glightray.png) no-repeat; background-size: contain; background-position: center;
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: 0 0;
    opacity: 0; transition: 1s ease-out;
}
.dh_imgift:after {
    content: ''; width: 140%; height: 100%;
    background: url(../images/dh-gconfetti.png) no-repeat; background-size: contain; background-position: center;
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: 0 0;
}
.dh_imgift .deco1 { position: absolute; left: -5%; top: 30%; width: 18%; }
.dh_imgift .deco2 { position: absolute; right: -10%; top: 16%; width: 10%; }

.dh_imgift .top { position: relative; z-index: 1; }
.dh_imgift .center { position: relative; z-index: 1; width: 75%; margin-bottom: -47%; transition: margin 0.6s ease-out; }
.dh_imgift .btm { position: relative; z-index: 2; }
.dh_imgift .btmb {
    width: calc(100% - 15px);
    position: absolute; bottom: 31%; left: 50%; transform: translate(-50%, 0);
}
/*--*/
.dh_imgiftcon .textprize { 
    position: absolute; top: 43.5%; left: 50%; transform: translate(-50%, 0); z-index: 1;
    font-size: min(5vw, 14px); color: #000ac1; width: 60%; transition: top 0.6s ease-out;
}
.dh_imgiftcon .textprize small { display: inline-block; margin-bottom: 4px; font-size: min(4vw, 10px); }
.dh_imgiftcon .textprize h6 { margin-bottom: 0; font-size: min(7vw, 20px); line-height: 1; }
/*--*/
.dh_imgiftcon .btn-wrap {
    position: absolute; bottom: 17.5%; left: 50%; transform: translate(-50%, 0); z-index: 2;
    font-size: min(4vw, 13px); color: #e6e7e8;
}
.dh_imgiftcon .btn-wrap a { display: inline-block; color: #e6e7e8; letter-spacing: 0.025em; }
.dh_imgiftcon .btn-wrap .btn-solid {
    background-color: #fae6b1; background-image: linear-gradient(150deg, #fae6b1 0%, #fdc966 68%, #fcac4d 100%);
    min-width: min(55vw, 188px); min-height: auto; border-radius: 100px; border: 1px solid rgba(255,255,255,0.35); padding: 0.5em 1em; box-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
    font-size: min(5vw, 18px); letter-spacing: 0.05em; color: #603200;
}
.dh_imgiftcon .btn-wrap .btn-solid:hover { color: #603200; }
/*--*/
.dh_imgiftcon.red .textprize { color: #fc3f2b; }
.dh_imgiftcon.red .textprize small { color: #00682a; }
.dh_imgiftcon.red .btn-wrap .btn-solid {
    background-color: #aed141; background-image: linear-gradient(150deg, #aed141 0%, #e5ea98 68%, #a8ac4d 100%);
    color: #00682a;
}
/*--*/
.pop-dhgboxopen.show .dh_imgiftcon { max-width: 250px; filter: drop-shadow(2px 4px 16px rgba(255, 255, 255, 0.5)); }
.pop-dhgboxopen.show .dh_imgift:before { opacity: 1; animation: rotationCenter 50s infinite linear 0.8s; }
.pop-dhgboxopen.show .dh_imgift:after { animation: dhConfetti 1.8s infinite ease-out; }
.pop-dhgboxopen.show .dh_imgift .center { margin-bottom: -10%; }
.pop-dhgboxopen.show .dh_imgiftcon .textprize { top: 33.5%; }

@keyframes jump-shaking {
    0% { transform: translateX(0) }
    35% { transform: rotate(10deg) }
    55% { transform: rotate(-10deg) }
    65% { transform: rotate(10deg) }
    75% { transform: rotate(-10deg) }
    100% { transform: rotate(0) }
}
@keyframes rotationCenter {
    from { transform: rotate(0deg) translate(-50%, -50%); }
    to { transform: rotate(359deg) translate(-50%, -50%); }
}
@keyframes dhConfetti {
    0% { transform: scale(0) translate(-50%, -50%); opacity: 1; }
    13% { transform: scale(0.5) translate(-50%, -50%); opacity: 1; }
    100% { transform: scale(1) translate(-50%, -50%); opacity: 0; }
}
/*==========================================*/
/*====== Event Dream Holiday (xmas25) ======*/
.event-xmas25 .menu-penguin { position: absolute; left: 50%; bottom: 28px; transform: translate(-50%, 0); max-width: 41px; }
.event-xmas25 .menu-penguin img { animation: leftright 3s linear infinite; transform-origin: bottom; }

@keyframes leftright {
    0% { transform: rotate(0); }
    35% { transform: rotate(6deg); }
    75% { transform: rotate(4deg); }
    100% { transform: rotate(0); }
}
/*--*/
.event-xmas25 .ticketcon { 
    background-repeat: no-repeat;
    background-size: 112px, 5px, 3px, 5px, 6px, 100%; background-position: right -12px bottom -60px, right 5% top 20px, right 28% top 2px, left 5% top 50px, left 30% top 8px, center top;
}
.event-xmas25 .ticketcon .left, 
.event-xmas25 .ticketcon .right { background: transparent; }
.event-xmas25 .ticketcon .left .img.bgimg { background: none; border-radius: 0; }
.event-xmas25 .ticketcon .left .desc { color: inherit; }
.event-xmas25 .ticketcon .right .btn-fullclaim { color: #fe6450; }

@media only screen and (min-width: 341px) {
    .event-xmas25 .ticketcon .left .img.bgimg { position: absolute; right: -20%; transform: translate(33%, 0); }
    .event-xmas25 .ticketcon .left .img.bgimg img { padding: 0; transform: none; }
    .event-xmas25 .ticketcon .right { width: 30%; }
}
@media only screen and (max-width: 340px) {
    .event-xmas25 .ticketcon .left .img.bgimg { font-size: 16px; height: 4.5em; }
    .event-xmas25 .ticketcon .left .detail { flex: 100%; padding-top: 0; }
    .event-xmas25 .ticketcon .right { width: 0%; padding: 0; border: none; }
}