@charset "utf-8";

:root {
    --primary-color:#2bc69d;
    --block-color:#151f27;
    --sub-color:#22474f;
    --light-color:#94aeb4; 
    --modal-color:#1F2931;
    --modal2-color:#10171D; 
    --sports-color:#151E24;
    --betslip-color:#1D2832;
    --aggregate-color:#35444e;
    --search-color:#584E2A;
    --result-color:#1a252d;
    --dblue-color:#466580;
    --box-color:rgba(16,23,29,0.5);
    --box-color-2:rgba(16,23,29,0.2);
    --table-color:rgba(53, 68, 78, 0.2); 

    --gold-color:linear-gradient(80deg, rgba(87, 98, 101, 0.5) 10%, rgba(158, 161, 161, 0.5) 25%, rgba(132, 139, 138, 0.5) 50%, rgba(87, 98, 101, 0.5) 55%, rgba(87, 98, 101, 0.5) 80%, rgba(117, 122, 123, 0.5) 90%, rgba(87, 98, 101, 0.5) 100%), #FFBD3A;
    --silver-color:linear-gradient(80deg, rgba(87, 98, 101, 0.4) 10%, rgba(158, 161, 161, 0.4) 25%, rgba(132, 139, 138, 0.4) 50%, rgba(87, 98, 101, 0.4) 55%, rgba(87, 98, 101, 0.4) 80%, rgba(117, 122, 123, 0.4) 90%, rgba(87, 98, 101, 0.4) 100%), radial-gradient(100% 100% at 100% 0%, #D4E0EF 0%, #9FAAB9 100%); 
    --bronze-color:linear-gradient(80deg, rgba(87, 98, 101, 0.4) 10%, rgba(158, 161, 161, 0.4) 25%, rgba(132, 139, 138, 0.4) 50%, rgba(87, 98, 101, 0.4) 55%, rgba(87, 98, 101, 0.4) 80%, rgba(117, 122, 123, 0.4) 90%, rgba(87, 98, 101, 0.4) 100%), radial-gradient(100% 100% at 100% 0%, #E0B994 0%, #976F48 100%); 
}

body {font-family: "Noto Sans KR", sans-serif; color:#fff; background:radial-gradient(100% 1000% at 0% 0%, #35444e, #19242d); }
.roboto {font-family:Roboto; }
.mont {font-family: "Montserrat", sans-serif;}
.fs10 {font-size:10px; }
.fs13 {font-size:13px; }
.fs15 {font-size:15px; }

/* svg 공통 */
.svg-icon {fill:currentColor !important; }
/* 스크롤바 커스텀 */
.scrollbar {scrollbar-color: rgba(43,198,157,.5) rgba(0,0,0,0); scrollbar-width: thin; }
.noscrollbar::-webkit-scrollbar {display:none; }
.scrollbar_hover {scrollbar-color: transparent transparent; scrollbar-width: thin; }
.scrollbar_hover:hover {scrollbar-color: rgba(43,198,157,1) rgba(0,0,0,0);}

/* 색상 */
.text-sub {color:var(--sub-color); }
.text-light {color:var(--light-color); }
.\!text-light {color:var(--light-color) !important; }
.text-gradient-yellow {background: -webkit-linear-gradient(rgba(255, 255, 255, 0.5), #F7C23C); -webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0); }
.text-primary-shadow {text-shadow: 0 0 10px rgb(var(--color-primary)); }
.text-gold {background:var(--gold-color); -webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0);}
.text-silver {background:var(--silver-color); -webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0);}
.text-bronze {background:var(--bronze-color); -webkit-background-clip: text; -webkit-text-fill-color: rgba(0, 0, 0, 0);}

.bg-light {background-color:var(--light-color);}
.bg-light-opacity-20 {background-color: rgba(53, 68, 78, 0.2);}
.bg-block {background-color:var(--block-color); }
.bg-sub {background-color:var(--sub-color); }
.bg-modal {background-color:var(--modal-color); }
.bg-modal2 {background-color:var(--modal2-color); }
.\!bg-sub {background-color:var(--sub-color) !important; }
.bg-box {background:var(--box-color);}
.hover\:bg-box:hover {background:var(--box-color);}
.bg-box2 {background:var(--box-color-2);}
.bg-table {background:var(--table-color);}
.\!bg-table {background:var(--table-color) !important;}
.bg-sports {background-color:var(--sports-color); }
.bg-betslip {background-color:var(--betslip-color); }
.\!bg-betslip {background-color:var(--betslip-color) !important; }
.bg-aggregate {background-color:var(--aggregate-color); }

/*.bg-search {background-color:var(--search-color); } */

.bg-search {
	/* background-color:var(--search-color); */ 
	background-color: #687f77;
    border-radius: 0.25rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
}
.bg-result {background-color:var(--result-color); }

.bg-gold {background:var(--gold-color); }
.bg-silver {background:var(--silver-color); }
.bg-bronze {background:var(--bronze-color); }

.border-table {border-color:var(--table-color); }
.\!border-table {border-color:var(--table-color) !important; }
.border-box {border-color:var(--box-color); }
.border-dblue {border-color:var(--dblue-color); }

@media (min-width:1280px){
    .xl\:bg-box {background-color:var(--box-color);}
    .xl\:bg-sub {background-color:var(--sub-color);}
    .xl\:bg-block {background-color:var(--block-color);}
    .xl\:bg-table {background-color:var(--table-color);}
}
@media (min-width:767px){
    .md\:bg-table {background-color:var(--table-color);}
	.inquiry_wrap_1 {
		max-height: 535px !important;
	}
}

/* zoom */
.zoom-80 {zoom:0.8; }

.hover_scale_img {overflow:hidden; }
.hover_scale_img img {transform:scale(1); transition:transform 0.2s; }
.hover_scale_img:hover img {transform:scale(1.1); }

/* 말줄임표 */
.truncate-2 {-webkit-line-clamp: 2; display: -webkit-box; word-wrap: break-word;-webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}
.truncate-3 {-webkit-line-clamp: 3; display: -webkit-box; word-wrap: break-word;-webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}
.truncate-4 {-webkit-line-clamp: 4; display: -webkit-box; word-wrap: break-word;-webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;}

.dots {display:flex; align-items:center; gap:6px; }
.dots i {width:6px; height:6px; background-color:#fff; opacity:.3; border-radius:50%; }


.sr-container .rating-1-text { fill: #000; }
.sr-container .rating-1-shape { fill: #9ccad4; stroke: #22474f; }
.sr-container .rating-2-text { fill: #000; }
.sr-container .rating-2-shape { fill: #7ea9b3; stroke: #22474f; }
.sr-container .rating-3-text { fill: #fff; }
.sr-container .rating-3-shape { fill: #5f8992; stroke: #22474f; }
.sr-container .rating-4-text { fill: #fff; }
.sr-container .rating-4-shape { fill: #416870; stroke: #22474f; }
.sr-container .rating-5-text { fill: #fff; }
.sr-container .rating-5-shape { fill: #22474f; stroke: #22474f; }
.sr-container .rating-0-text { fill: #000; }
.sr-container .rating-0-shape { fill: #99b1c6; stroke: #22474f; }
.sr-line:before {content:''; z-index:0; position:absolute; left:0; top:calc(50% - 1px); width:100%; height:2px; background-color:#22474f;}
.sr-line > * {z-index: 1;}


/* 
        **레이아웃 및 공통으로 쓰여지는 레이아웃**
        CONTENT
        버튼 커스텀
        폼 커스텀
        테이블 커스텀
        HEADER
        QUICK_MENU
        SIDE-NAV

        MAIN-LOADER
        FOOTER

        CASHBACK_POPUP
        SWIPER - PAGINATION

        HEIGHT-FIXED
        AGREE_BOX
        MODAL
        DROPDOWN
        CUSTOM_TOGGLE
        TAB

        INPUT_WRAP
        CHECKBOX / RADIO
        CUSTOM_TOOLTIP
        ACCORDION
        CUSTOM_SELECT
        PROGRESS

        SUB_VISUAL
        INPUT_CUSTOM
        GAME_ITEM
        BETTING_SLIP
        3xl:
*/


/* ----------------------------------------------
            CONTENT
---------------------------------------------- */
.sports .content {padding:10px; }

/* add */
.live .content {padding:10px; }

.content {padding:30px 35px 35px; }
.box {padding:32px; border-radius:16px; background:rgba(16,23,29,.3); }

@media all and (max-width:1279px){
    .sports .content {padding:10px; }
    /*.content {padding:15px 15px 0 15px; }*/
	.content {padding:8px 8px 0 8px; }
    .box {padding:0; padding-bottom:30px; border-radius:0; background:transparent; }
}


/* ----------------------------------------------
            버튼 커스텀
---------------------------------------------- */
.btn-primary {text-shadow: 0 0 2px #104839; }
.btn-outline-primary:hover:not(:disabled) {background-color: rgb(var(--color-primary) / 1); color:#fff; }


/* ----------------------------------------------
            폼 커스텀
---------------------------------------------- */
.form-control {border:0 none; }


/* ----------------------------------------------
            테이블 커스텀
---------------------------------------------- */
/* table-striped 색상변경 */
.table.table-striped tr:nth-of-type(even) td {background-color:#2b373f; }
.table.table-striped tr:nth-of-type(odd) td {background-color:transparent; }

.table.table-striped.striped_type02 tr:nth-of-type(even) td {background-color:#1c252c; }
.table.table-striped.striped_type02 tr:nth-of-type(odd) td {background-color:#212b32; }

.table.table-striped.striped_type03 > tbody > tr:nth-of-type(even) > td ,
.table.table-striped.striped_type03 > tbody > tr:nth-of-type(even) > td td{background-color:#1a242b; }
.table.table-striped.striped_type03 > tbody > tr:nth-of-type(odd) > td,
.table.table-striped.striped_type03 > tbody > tr:nth-of-type(odd) > td td {background-color:#131b23; }

/* table border 삭제 */
.table.no-border th,
.table.no-border td {border-bottom-width:0;}

.table.no-border.table-border-r th,
.table.no-border.table-border-r td {border-right:1px solid rgba(217, 217, 217, 0.3)}
.table.no-border.table-border-r th:last-of-type,
.table.no-border.table-border-r td:last-of-type {border-right:0 none; }

.table.thead-py-big thead th {padding-top:20px; padding-bottom:20px; }

.table.thead-px-sm thead th{padding-right:10px; padding-left:10px; }
.table.tbody-px-sm tbody td{padding-right:10px; padding-left:10px; }

.table.table-pd-sm thead th,
.table.table-pd-sm tbody td {padding:8px 5px; }

.table.table-hover tr td {border-bottom:1px solid #10171d; background:#141d22; }
.table.table-hover tr td.border-r {border-right:1px solid #10171d; }
.table.table-hover tr:hover td {color:#fff; background:#202b31; }

.nav.nav-link-tabs .nav-item .nav-link.active {color:rgb(var(--color-primary)); }
.nav.nav-link-tabs .nav-item .nav-link.active svg {}

@media all and (max-width:1279px){
    .table.mo_hide {display:none; }
}

/* tab_content */
.tab-content > div {width:100% !important; }

/* ----------------------------------------------
            HEADER
---------------------------------------------- */
header {z-index:100; position:sticky; top:0; left:0; display:flex; align-items:center; justify-content:space-between; width:100%; height:75px; padding:0 32px; background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d); }
header .left_box {display:flex; align-items:center; gap:30px; }
header h1.logo:first-of-type {padding-right:15px; }
header h1.logo a {display:flex; align-items:center; gap:6px; }
header ul.gnb {display:flex; align-items:center; gap:10px;  }
header ul.gnb li {position:relative; }
header ul.gnb li a {padding:10px 20px; color:#fff; font-weight:500; white-space:nowrap; }
header ul.gnb li a.gnb_dot {display:none; font-size:8px; }
header ul.gnb .gnb_list {display:none; position:absolute; left:0; top:100%; min-width:200px; padding:10px 0; background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d); border-radius:8px; }
header ul.gnb .gnb_list li {padding:10px 25px; }
header ul.gnb .gnb_list li a {padding:0; }
/* header ul.gnb .gnb_list li {display:none; } */
header ul.gnb .gnb_list.open {display:block; }

header .right_box {display:flex; align-items:center; gap:20px; }
header .right_box .ham_btn {display:none; }
header .right_box .profile_btn {position:relative; width:40px; height:40px; background:var(--sub-color); border:2px solid rgb(var(--color-primary) / 1); border-radius:50%;  }
header .right_box .profile_btn .deco {position:absolute; right:-5px; bottom:-5px; display:flex; align-items:center; justify-content:center; width:16px; height:16px; background-color: rgb(var(--color-primary) / 1); color:#10171d; border-radius:50%; }
header .right_box .balance_btn {display:flex; align-items:center; justify-content:center; gap:12px; height:40px; padding:0 16px; background-color:#22474f; border-radius:8px; }
header .right_box .balance_btn p {display:flex; align-items:center; gap:6px; font-weight:600; letter-spacing:0.025em; }
header .right_box .balance_btn > span svg {transform:rotate(90deg); transition:all 0.3s; }
header .right_box .balance_btn[aria-expanded="true"] > span svg {transform:rotate(-90deg); }

header .right_box .mo_cash_wrap {align-items:center; }
header .right_box .mo_cash_wrap .mo_balance_btn {display:flex; align-items:center; gap:8px; height:32px; font-size:12px; padding:0 8px; background-color:#22474f; border-radius:8px 0 0 8px; }
header .right_box .mo_cash_wrap .mo_balance_btn p {display:flex; align-items:center; gap:8px; font-weight:600; letter-spacing:0.025em; }
header .right_box .mo_cash_wrap .mo_balance_btn > span svg {transform:rotate(90deg); }
header .right_box  .cash_btn {width:32px; height:32px; background-color:rgb(var(--color-primary) / 1); border-radius:0 8px 8px 0; }


@media all and (max-width:1650px){
    header ul.gnb li a.gnb_dot {display:block;}
    header ul.gnb li.hide_3 {display:none; }
    header ul.gnb li.show_3 {display:block; }
}
@media all and (max-width:1550px){
    header ul.gnb li.hide_2 {display:none; }
    header ul.gnb li.show_2 {display:block; }
}
@media all and (max-width:1500px){
    header ul.gnb li.hide_1 {display:none; }
    header ul.gnb li.show_1 {display:block; }
}
@media all and (max-width:1450px){
    header ul.gnb li.hide_4 {display:none; }
    header ul.gnb li.show_4 {display:block; }
}

@media all and (max-width:1279px){
    header {height:60px; padding:0 16px; }
    header h1.logo img:last-of-type {display:none; }
    header ul.gnb {display:none; }

    header .right_box {gap:12px; }
    header .right_box .lang {display:none; }
    header .right_box button {height:32px; font-size:12px; }
    header .right_box .ham_btn {display:block; margin-left:6px; }

    header .right_box .balance_btn {gap:8px; height:32px; padding:0 8px; border-radius:8px 0 0 8px; }
}


/* ----------------------------------------------
            QUICK_MENU
---------------------------------------------- */
.quick_menu {z-index:100; position:fixed; left:0; bottom:0; display:none; width:100%; height:60px; }
.quick_menu .quick_bg {z-index:9; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(16,23,29,0.5); backdrop-filter:blur(24px); }
.quick_menu.active .quick_bg {display:block; }

/*.quick_menu > ul {position:relative; z-index:10; display:flex; align-items:center; height:100%; padding-bottom:10px; background-color:var(--sub-color); } */
.quick_menu > ul {position:relative; z-index:10; display:flex; align-items:center; height:100%; background-color:var(--sub-color); }

.quick_menu.active > ul {outline:3px solid rgba(16, 23, 29, 0.5); }
.quick_menu > ul > li {flex-grow:1; height:100%; }
.quick_menu > ul > li.active {color:rgb(var(--color-primary))}

.quick_menu > ul > li > a.active {
	height: 50px !important;
    outline: 3px solid rgba(16, 23, 29, 0.5);
    background-color: rgb(var(--color-primary));
    border-radius: 0 0 15px 15px;
}/* -- add -- */

.quick_menu > ul > li > a,
.quick_menu > ul > li.type02 div > a {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; width:100%; height:100%; }
.quick_menu > ul > li.type02 {text-align:center; }
.quick_menu > ul > li.type02 div {position:relative; display:inline-flex; width:60px; height:100%; }
.quick_menu > ul > li.type02.active_open > div {height:43px !important; outline:3px solid rgba(16, 23, 29, 0.5); background-color:rgb(var(--color-primary)); border-radius:0 0 15px 15px; }

.quick_menu .depth {display:none; position:absolute; left:0; bottom:100%; width:150px; padding:5px 0; border-radius:15px 15px 15px 0; background-color:rgb(var(--color-primary)); }
.quick_menu .active_open .depth {display:block; }
.quick_menu .depth li a {display:flex; align-items:center; gap:12px; height:40px; padding:0 20px; }

/*
.quick_menu .live,
.quick_menu .mybet,
.quick_menu .sport {display:none; }
.sports .quick_menu .live,
.sports .quick_menu .mybet,
.sports .quick_menu .sport {display:block; }

.sports .quick_menu .sports,
.sports .quick_menu .casino,
.sports .quick_menu .promotion {display:none; }
*/

@media all and (max-width:1279px){
    .quick_menu {display:block; }
}

/* ----------------------------------------------
            SIDE-NAV
---------------------------------------------- */
.side_menu {padding:15px 0 15px 32px; }
.side-nav {z-index:90; position:sticky; top:90px; left:0; width:calc(15vw - 35px); height:calc(100vh - 105px); padding:15px 5px 15px 0; }
.side-nav .mo_topinfo,
.side-nav .login_menu {display:none; }
.side-nav > ul > li + li {margin-top:25px; }
.side-nav > ul > li > .side-menu .side-menu__title {margin-left:0; color:#fff !important; opacity:0.5; }
.side-nav .side-menu {padding-left:0; }
.side-nav .side-menu .side-menu__title {justify-content:space-between; }
.side-nav .side-menu .side-menu__title .count {display:flex; align-items:center; justify-content:center; width:20px; height:20px; background-color:rgb(var(--color-primary)); font-size:12px; font-weight:500; text-shadow:0 0 2px #104839; border-radius:50%; }
.side-nav .side-menu .side-menu__title .side-menu__sub-icon svg {width:12px; height:12px; transform:rotate(90deg); }

/* updated
.side-nav > ul li > .side-menu.live .side-menu__icon {color:#ff4e4e; filter:drop-shadow(0px 0px 16px currentColor);  }
.side-nav > ul li > .side-menu.live .side-menu__title {overflow:hidden; color:#ff4e4e; text-shadow:0 0 16px #ff4e4e; }
*/

.side-nav > ul ul {padding:25px 0; }
.side-nav > ul ul li + li {margin-top:24px; }

.side-nav > ul li ul li:hover .side-menu__icon ,
.side-nav > ul li ul li:hover .side-menu__title {color:rgb(var(--color-primary)); }

.side-nav > ul li ul .side-menu__icon ,
.side-nav > ul li ul .side-menu__title {color:var(--light-color); }
.side-nav > ul li.navigation ul .side-menu__icon ,
.side-nav > ul li.cs_center ul .side-menu__icon ,
.side-nav > ul li.navigation ul .side-menu__title ,
.side-nav > ul li.cs_center ul .side-menu__title {color:#fff; }
.side-nav > ul > li.faq_menu {display:none; }

.side-nav > ul > li li.cate_more_list {display:none; }

/* 로그인 전/후 메뉴 변경 */
.side-nav .logout_menu {display:none; }
.logout .side-nav .logout_menu {display:block; }
.logout .side-nav .login_menu {display:none; }

/* body 에 클래스 faq 붙었을때 */
.faq .side-nav-event {display:none; }
.faq .side-nav > ul > li {display:none; }
.faq .side-nav > ul > li.faq_menu {display:block; }

/* body 에 클래스 slot, casino 붙었을떄 */
.slot .gnb li.slots a,
.casino .gnb li.casino a {color:rgb(var(--color-primary)); }
.slot .side-nav > ul > li,

/*
.casino .side-nav > ul > li {display:none; }
*/

.slot .side-nav > ul > li.slots,
.slot .side-nav > ul > li.casino,
.casino .side-nav > ul > li.slots,
.casino .side-nav > ul > li.casino {display:block; }

.slot .side-nav > ul > li.slots li.more_list,
.slot .side-nav > ul > li.casino li.more_list,
.casino .side-nav > ul > li.slots li.more_list,
.casino .side-nav > ul > li.casino li.more_list {display:none; }

.slot .side-nav > ul > li.slots li.cate_more_list,
.slot .side-nav > ul > li.casino li.cate_more_list,
.casino .side-nav > ul > li.slots li.cate_more_list,
.casino .side-nav > ul > li.casino li.cate_more_list  {display:block; }

/* body 에 클래스 referrals 붙었을때 */
.referrals .side-nav .referrals .side-menu__title,
.referrals .side-nav .referrals .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 bettors 붙었을때 */
.bettors header .gnb .bettors a,
.bettors .side-nav .bettors .side-menu__title,
.bettors .side-nav .bettors .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 fame 붙었을때 */
.fame header .gnb .fame a,
.fame .side-nav .fame .side-menu__title,
.fame .side-nav .fame .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 promotion 붙었을때 */
.promotion header .gnb .promotion a,
.promotion .side-nav .promotion .side-menu__title,
.promotion .side-nav .promotion .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }
.promotion .side-nav .promotion .side-menu__title span {color:#fff; }


/* body 에 클래스 result 붙었을때 */
.result header .gnb .result a,
.result .side-nav .result .side-menu__title,
.result .side-nav .result .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 mini 붙었을때 */
.mini header .gnb .mini a,
.mini .side-nav .mini .side-menu__title,
.mini .side-nav .mini .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }


/* body 에 클래스 help 붙었을때 */
.help header .gnb .help a,
.help .side-nav .help .side-menu__title,
.help .side-nav .help .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 notice 붙었을때 */
.notice header .gnb .notice a,
.notice .side-nav .notice .side-menu__title,
.notice .side-nav .notice .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 sports 붙었을때 */
.sports .side-nav .sports .side-menu__title,
.sports .side-nav .sports .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 slot 붙었을때 */
.slot .side-nav .slot .side-menu__title,
.slot .side-nav .slot .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }


/* body 에 클래스 casino 붙었을때 */
.casino .side-nav .casino .side-menu__title,
.casino .side-nav .casino .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

/* body 에 클래스 live 붙었을때 */
.live .side-nav .live .side-menu__title,
.live .side-nav .live .side-menu__icon {color:rgb(var(--color-primary)); font-weight:600; }

.sports:not(.live):not(.result) header .gnb .sports a {color:rgb(var(--color-primary)); font-weight:600; }
.sports .side-nav {display:none; }

.sports.live header .gnb .live a {color:rgb(var(--color-primary)); font-weight:600; }
.sports.result header .gnb .result a {color:rgb(var(--color-primary)); font-weight:600; }


.mo_menu_bg {display:none; }

@media all and (max-width:1279px){
    .mo_menu_bg.open {z-index:101; position:fixed; left:0; top:0; width:100%; height:100%; display:block; background:rgba(16,23,29,.5); backdrop-filter:blur(10px); }
    .side_menu {z-index:102; position:fixed; right:-360px; top:0; width:360px; height:100%; padding:0; background:radial-gradient(100% 200% at 0% 0%, #35444e 0%, #10171D 100%); transition:all 0.3s; }
    .side_menu.open {right:0;}
    .side-nav .mo_topinfo,
    .side-nav .login_menu {display:block; }
    .side_menu .side-nav {position:relative; top:0; left:0; width:100%; height:100%; padding:24px 24px 60px; }
    .side-nav .side-menu {padding-left:0; }
    .side-nav > ul > li.faq_menu {display:none !important; }

    /* body 에 클래스 faq 붙었을때 */
    .faq .side-nav-event {display:block; }
    .faq .side-nav > ul > li {display:block; }
    .faq .side-nav > ul > li.faq_menu {display:none; }

    /* body 에 클래스 slot 붙었을떄 */
    .slot .side-nav > ul > li {display:block; }
    .slot .side-nav > ul > li.slots,
    .slot .side-nav > ul > li.casino {display:block; }
    .slot .side-nav > ul > li.slots li.more_list,
    .slot .side-nav > ul > li.casino li.more_list {display:block; }
    .slot .side-nav > ul > li.slots li.cate_more_list,
    .slot .side-nav > ul > li.casino li.cate_more_list {display:none; }

    .sports .side-nav {display:block; }
	.live .side-nav {display:block; }
}

@media all and (max-width:400px){
    .side_menu {right:-88%; width:88%; }
}

.side-nav .side-nav-event a,
.side-nav .side-nav-event button {overflow:hidden; position:relative; width:100%; height:52px; background:linear-gradient(135deg, #01DCBA 0%, #7F30CB 100%); color:#fff; border-radius:8px; background-size:200% 200%; background-position:0 100%; font-weight:700; }
.side-nav .side-nav-event a {display:flex; align-items:center; justify-content:center; }
.side-nav .side-nav-event a {margin-top:16px; }
.side-nav .side-nav-event a > img,
.side-nav .side-nav-event button > img {position:absolute; left:0; bottom:0; height:100%; }
.side-nav .side-nav-event button .wheel {position:absolute; left:-25px; top:10px; width:70px; height:70px; }
.side-nav .side-nav-event button .wheel .frame {z-index:2; position:relative; }
.side-nav .side-nav-event button .wheel .bg {z-index:1; position:absolute; right:3px; top:3px; width:65px; height:65px; animation:wheel-rotate 4s linear infinite; }

@keyframes wheel-rotate {
    100% {transform:rotate(1turn); }
}

/* update for live */
.live .side_menu {padding-left:5px; }
.side_menu .sports_nav {display:none; }
.live .side_menu .sports_nav {z-index:90; position:sticky; top:90px; left:0; display:flex; }

.live:not(.sports):not(.result) header .gnb .live a {color:rgb(var(--color-primary)); font-weight:600; }


/* end update for live */

.sports .side_menu {padding-left:5px; }
.side_menu .sports_nav {display:none; }
.sports .side_menu .sports_nav {z-index:90; position:sticky; top:90px; left:0; display:flex; }
.side_menu .sports_nav .category { width:65px; height:calc(100vh - 105px); padding:0 5px 15px; }
.side_menu .sports_nav .category a {display:block; padding:6px 4px; text-align:center; border-radius:6px; }
.side_menu .sports_nav .category a + a {margin-top:4px; }
.side_menu .sports_nav .category a svg {max-width:20px; margin:0 auto 6px;}
.side_menu .sports_nav .category a img {max-width:20px; margin:0 auto 6px; filter:grayscale(100%); }
.side_menu .sports_nav .category a span {display:block; font-size:9px; color:#fff; line-height:1.2; }
.side_menu .sports_nav .category a:hover img,
.side_menu .sports_nav .category a.active img {filter:grayscale(0); }
.side_menu .sports_nav .category a:hover svg,
.side_menu .sports_nav .category a.active svg {color:rgb(var(--color-primary)); }
.side_menu .sports_nav .category a.active {background-color: rgba(16, 23, 29, 0.5); box-shadow:0 0 20px rgba(0, 0, 0, 0.1); }

.side_menu .sports_nav .sport_tab {width:calc(14vw - 15px); height:calc(100vh - 105px); padding:0 5px 15px;  }
.side_menu .sports_nav .sports_filter_top input[type="checkbox"] {display:none} 
.side_menu .sports_nav .sports_filter_top input[type="checkbox"] + span {display:block; width:16px; height:16px; border:2px solid #94AEB4; }
.side_menu .sports_nav .sports_filter_top input[type="checkbox"]:checked + span {position:relative; border-color:#fff; }
.side_menu .sports_nav .sports_filter_top input[type="checkbox"]:checked + span:before {content:''; position:absolute; left:0; top:-2px; right:0; bottom:0; width:9px; height:5px; margin:auto; border-bottom:2px solid #fff; border-left:2px solid #fff; transform:rotate(-45deg); }

.side_menu .sports_nav .sports_filter_list {}
.side_menu .sports_nav .sports_filter_list > ul {}
.side_menu .sports_nav .sports_filter_list > ul > li {padding:10px; }
.side_menu .sports_nav .sports_filter_list > ul > li + li {margin-top:10px; }
.side_menu .sports_nav .sports_filter_list > ul > li:hover,
.side_menu .sports_nav .sports_filter_list > ul > li.open {background-color:rgba(16, 23, 29, 0.5); }
.side_menu .sports_nav .sports_filter_list > ul > li ul {display:none; }
.side_menu .sports_nav .sports_filter_list > ul > li.open ul {display:block; }
.side_menu .sports_nav .sports_filter_list > ul > li > button svg {transition:all 0.5s; }
.side_menu .sports_nav .sports_filter_list > ul > li.open > button svg {transform:rotate(270deg); }


@media all and (max-width:1800px){
    .side_menu .sports_nav .sport_tab {width:calc(14vw - 15px); }
}
@media all and (max-width:1600px){
    .side_menu .sports_nav .sport_tab {width:calc(16vw - 15px); }
}


/* @media all and (max-width:1279px){  ///update*/ 

@media all and (max-width:1279px){
    .side_menu .sports_nav .sport_tab {width:calc(16vw - 15px); }
}

@media all and (max-width:767px){	
	
	
    .sports .side_menu .sports_nav {display:none; }
}

/* ----------------------------------------------
            MAIN-LOADER
---------------------------------------------- */
/* .main-loader {z-index:99999; position:fixed; left:0; top:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d);  } */
.main-loader {z-index:99; position:fixed; left:0; top:0; right:0; bottom:0px; display:flex; align-items:center; justify-content:center; background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d);  } 
.main-loader.hide {display:none; }



/* ----------------------------------------------
            FOOTER
---------------------------------------------- */
footer {padding:32px; background:#10171d; border-radius:16px; }
footer .footer_top {display:flex; flex-direction: column; gap:20px; }

/* footer .footer_top .fnb {display:flex; flex-wrap:wrap; align-items: flex-start; justify-content: space-between; gap:10px 0; } */

footer .footer_top .fnb {flex-wrap:wrap; align-items: flex-start; justify-content: center; gap: 0; } 

footer .footer_top .fnb ul {padding:0 8px; }
footer .footer_top .fnb ul li.title {margin-bottom:20px; font-size:18px; font-weight:700; color:#fff; opacity:1; }
footer .footer_top .fnb ul li {margin-bottom:14px; font-size:12px; color:#fff; opacity:.5; }

footer .footer_currency {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:20px; background-color:rgba(53,68,78,.2); border-radius:8px; }
footer .footer_currency .tit {color:var(--light-color); }
footer .footer_currency .img_list {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:16px; }
footer .footer_currency .img_list img {height:30px; }


@media all and (max-width:1279px){
    .content.\!p-0 footer {width:100%; margin:0; }
    /*footer {width:calc(100% + 30px); margin:0 -15px; padding:16px 16px 66px 16px; border-radius:0; } */
	footer {width:calc(100%); margin:0; padding:16px 16px 66px 16px; border-radius:0; } 
    footer .footer_top {flex-direction: column-reverse; }

    footer .footer_currency .tit {order:1; max-width:50%; min-width:50%; }
    footer .footer_currency .img_list {order:3; width:100%; margin-top:20px; }
    footer .footer_currency .btn_box {order:2; max-width:50%; min-width:50%; }
}

/* 모바일에서 상단으로 올라가는 버튼 */
.totop_btn {z-index:100; position:fixed; left:10px; bottom:80px; visibility:hidden; opacity:0; display:none; align-items:center; justify-content:center; width:40px; height:40px; background-color:rgb(var(--color-primary)); border-radius:50%; transition:opacity 0.3s; }
.totop_btn.on {visibility:visible; opacity:1; }


@media all and (max-width:1279px){
    .totop_btn {display:flex; }
}

/* ----------------------------------------------
            CASHBACK_POPUP
---------------------------------------------- */
.cashback_popup {z-index:100; overflow:hidden; position:fixed; bottom:20px; left:50%; opacity:0; visibility:hidden; display:flex; gap:16px; align-items:center; justify-content:space-between; width:1180px; max-width:calc(100% - 16px); height:90px; background:linear-gradient(135deg, #01DCBA 0%, #7F30CB 100%); border-radius:8px; box-shadow:0px 2px 10px rgba(28, 66, 121, 0.50); transform:translateX(-50%); }
.cashback_popup.open {visibility:visible; opacity:1; bottom:30px; transition:bottom 0.3s, opacity 0.3s;  }
.cashback_popup .close_btn {position:absolute; right:10px; top:10px; opacity:.5; }
.cashback_popup > img {height:100%; max-width:120px; }
.cashback_popup .info_list {padding-right:40px; }

@media all and (max-width:1279px){
    .cashback_popup.open {bottom:60px; }
}

@media all and (max-width:1000px){
    .cashback_popup .info_list {padding-right:10px; }
}
@media all and (max-width:767px){
    .cashback_popup {height:auto; max-height:130px; }
    .cashback_popup > img {position:absolute; right:0; bottom:0; height:70%; }
    .cashback_popup .txt_box {padding:10px; }
    .cashback_popup .info_list > div {display:none; }
}



/* ----------------------------------------------
            SWIPER - PAGINATION
---------------------------------------------- */
.pagination .swiper-pagination-bullet {width:12px; height:12px; background-color:#fff; border-radius:50%; opacity:0.2; }
.pagination .swiper-pagination-bullet-active {background-color:rgb(var(--color-primary)); opacity:1; }



/* ----------------------------------------------
            HEIGHT-FIXED
---------------------------------------------- */
.height_fixed > div {overflow:hidden; height:220px; }
.height_fixed.open > div {height:auto; }


/* ----------------------------------------------
            AGREE_BOX
---------------------------------------------- */
.agree_box h1 {font-size:40px; line-height:1.3; font-weight:800; margin-bottom:16px; }
.agree_box h2 {font-size:24px; line-height:1.3; font-weight:700; margin:20px 0; }
.agree_box h3 {margin:15px 0; font-size:18px; font-weight:700; }
.agree_box p {font-size:16px; line-height:1.8; color:var(--light-color); }
.agree_box p + p {margin-top:15px; }
.agree_box ul {margin:15px 0 15px 30px; padding:0 0 0 20px; }
.agree_box ul li {position:relative; font-size:16px; }
.agree_box ul li + li {margin-top:20px; }
.agree_box ul li:after {content:''; position:absolute; left:-20px; top:10px; width:8px; height:8px; border-radius:50%; background-color:rgb(var(--color-primary)); }
.agree_box ol {margin:15px 0; padding:0 0 0 15px; counter-reset:start; }
.agree_box ol li {position:relative; counter-increment:start; padding:0 8px 0 30px; font-size:16px; }
.agree_box ol li + li {margin-top:20px; }
.agree_box ol li:before {content: counter(start) "."; font-weight: 700; position: absolute; left: 0; top: 4px;}

@media (max-width:767px){
    .agree_box h2 {font-size:18px; }
    .agree_box h3 {font-size:16px; }
    .agree_box p,
    .agree_box ul li,
    .agree_box ol li {font-size:14px; }
    .agree_box p + p {margin-top:12px; }
    .agree_box ul li + li,
    .agree_box ol li + li {margin-top:15px; }
}

/* ----------------------------------------------
            MODAL
---------------------------------------------- */
.modal {overflow:hidden; overflow-y:auto; overflow-x:hidden; background-color:rgba(0,0,0,.3); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); scrollbar-color: rgba(43,198,157,.5) rgba(0,0,0,0); scrollbar-width: thin; }
.modal.nobg {background-color:transparent !important; backdrop-filter:blur(0); }
.modal .modal-dialog {display:flex; align-items:center; min-height:100%; padding:30px 0; margin-top:0 !important; margin-bottom:0 !important; } 
/*.modal .modal-dialog {display:flex; align-items:center; min-height:100%;} */


.modal .modal-dialog.modal-top {align-items:flex-start; }
.modal .modal-dialog.modal-bottom {align-items:flex-end; }
.modal .modal-dialog .modal-content {background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d); box-shadow:0 0 200px #2bc69d; border-radius:8px; }
.modal .modal-dialog .modal-content.modal-transparent {background:transparent; box-shadow:none; }
.modal .modal-dialog .modal-content.modal-dark {background:#10171D;}
.modal .modal-dialog.confirm_modal .modal-content {border:1px solid var(--primary-color); }
.modal .modal-header {border:0 none; }
.modal .modal-header .close_btn {position:absolute; right:10px; top:10px; }
.modal .modal-body {position:relative; }
.modal .modal-body .close_btn {z-index:20; position:absolute; left:calc(100% + 2px); bottom:calc(100% + 2px); }
.modal .modal-body .close_btn.inner {left:auto; bottom:auto; right:10px; top:10px; }
.modal .modal-body .modal_top_bg { background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d); box-shadow:0 0 100px rgba(43,198,157,.5); }

.modal.type02 {position:absolute; width:100%; height:100%; }
.modal.type02 .modal-dialog {width:90%; }

@media all and (max-width:1279px){
    .modal .modal-body .close_btn {left:auto; bottom:auto; right:10px; top:10px; }
}

@media (max-width:767px){
    .modal .modal-dialog.mo_full {width:100% !important; max-width:100% !important; height:100% !important; max-height:100vh !important; margin-top:0; margin-bottom:0; padding:0; }
    .modal .modal-dialog.mo_full .modal-content {height:100%; padding:0; }
    .modal .modal-dialog.w_full {width:100% !important; max-width:100% !important; }
    .modal .modal-dialog.mo_fit {width:100% !important; max-width:100% !important; height:calc(100% - 120px) !important; max-height:calc(100% - 120px) !important; margin-top:0 !important; margin-bottom:0; padding:0; }
    .modal .modal-dialog.mo_fit .modal-content {height: calc(100% - 120px); padding:0; border-radius:0; box-shadow:none; }
}

@media (min-width:640px){
    .modal .modal-dialog {width:720px; max-width:90%; padding:15px 0; }
    .modal .modal-dialog.modal-3xs {width:290px; max-width:80%; }
    .modal .modal-dialog.modal-xxxs {width:430px; max-width:80%; }
    .modal .modal-dialog.modal-xxs {width:480px; max-width:80%; }
    .modal .modal-dialog.modal-xs {width:520px; max-width:80%; }
    .modal .modal-dialog.modal-sm {width:630px; max-width:90%; }
    .modal .modal-dialog.modal-md {width:690px; max-width:90%; }
    .modal .modal-dialog.modal-lg {width:780px; max-width:90%; }
    .modal .modal-dialog.modal-xl {width:900px; max-width:90%; }
	.modal .modal-dialog.modal-xxl {width:1024px; max-width:90%; }
}
@media (min-width: 1024px) {
    /* .modal .modal-dialog.modal-xl {} */
	.modal .modal-dialog.modal-xxl {width:1024px; max-width:90%; }
}


/* ----------------------------------------------
            DROPDOWN
---------------------------------------------- */
.dropdown-menu.show > .dropdown-content {margin-top:10px; }
.dropdown-menu .dropdown-content {margin-top:10px; padding:0; background-color:#10171d; box-shadow:0 4px 100px rgba(43,198,157,.5); border-radius:8px; }
.dropdown-menu .dropdown-content .mo_tit {display:none; }


@media all and (max-width:1279px){
    .dropdown-menu {position:fixed !important; left:0 !important; top:0 !important; display:none; width:100% !important; height:100%; background: rgba(16, 23, 29, .7); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); transform:none !important; }
    .dropdown-menu.type02 {top:60px !important; height:calc(100% - 120px); }
    /*.dropdown-menu.type02 .dropdown-content {overflow-y:auto; height:100%; }*/
	.dropdown-menu.type02 .dropdown-content {overflow-y:auto; height:95%; }
    .dropdown-menu.show {display:flex; align-items:flex-end; }
    .dropdown-menu .dropdown-content {background: radial-gradient(100% 200% at 0% 0%, #35444e, #19242d);}
    .dropdown-menu .dropdown-content .mo_tit {display:block; }
}


/* ----------------------------------------------
            PROFILE_WRAP
---------------------------------------------- */
.profile_wrap {position:relative; width:40px; height:40px; background:var(--sub-color); border:2px solid rgb(var(--color-primary) / 1); border-radius:50%; }



/* ----------------------------------------------
            CUSTOM_TOGGLE
---------------------------------------------- */
.custom_toggle > button svg {transform:rotate(90deg); transition:all 0.3s; }
.custom_toggle.open > button svg {transform:rotate(-90deg); }
.custom_toggle > div {display:none;}
.custom_toggle.open > div {display:block;}


/* ----------------------------------------------
            TAB
---------------------------------------------- */
.nav.nav-boxed-tabs .nav-item .nav-link {color:#fff; text-shadow: 0 0 2px #104839; }


/* ----------------------------------------------
            INPUT_WRAP
---------------------------------------------- */
.input_wrap {position:relative; display:flex; flex-direction: column; justify-content:flex-end; height:48px; border:1px solid transparent; padding:0 4px 0 16px; background:#1C252D; border-radius:8px; }
.input_wrap.on {border:1px solid rgb(var(--color-primary) / 1); }
.input_wrap.on label {color:rgb(var(--color-primary) / 1); opacity:1 !important;  }
.input_wrap.on input + label,
.input_wrap input:focus + label {top:30%; font-size:11px; opacity:.5; }
.input_wrap.on textarea + label,
.input_wrap textarea:focus + label {top:5px; font-size:11px; opacity:.5; }
/*.input_wrap label {position:absolute; left:16px; top:50%; color:var(--light-color); font-weight:700; transform:translateY(-50%); transition:all 0.15s; } */

.input_wrap label {position:absolute; left:16px; top:30%; color:var(--light-color); font-weight:700; transform:translateY(-50%); transition:all 0.15s; font-size: 11px; }

.input_wrap textarea + label {top:10px; transform:none; }

.input_wrap.error {border:1px solid #ff4e4e; color:#FF4E4E; }
.input_wrap.error label {color:#FF4E4E; }

/* .input_wrap .form-control {height:36px; margin-bottom:-2px; border:0 none; padding:0; } */
.input_wrap .form-control {height:36px; border:0 none; padding:0; }

.input_wrap .form-control:focus {box-shadow:none; outline:none; }

.input_wrap .password_btn {position:absolute; right:0; top:0; width:48px; height:48px; }

.form-control {background-color:transparent; color:#fff; }



/* ----------------------------------------------
            CHECKBOX / RADIO
---------------------------------------------- */
.form-switch .form-check-input[type="checkbox"] {width:60px; height:32px; border:0 none; background-color:#e9e9ea; }
.form-switch .form-check-input[type="checkbox"]:checked {background-color:rgb(var(--color-primary) / 1);}
.form-switch .form-check-input:before {width:27px; height:27px; }
.form-switch .form-check-input:checked::before {margin-left:29px; }

.form-switch .form-check-input[type="checkbox"].sm {width:46px; height:28px; }
.form-switch .form-check-input[type="checkbox"].sm:before {width:24px; height:24px; }
.form-switch .form-check-input.sm:checked::before {margin-left:18px; }

.form-switch .form-check-input[type="checkbox"].xs {width:25px; height:18px; }
.form-switch .form-check-input[type="checkbox"].xs:before {width:14px; height:14px; }
.form-switch .form-check-input.xs:checked::before {margin-left:8px; }

.form-check-input[type="checkbox"] {width:20px; height:20px; border:2px solid #94aeb4; background-color:transparent; }

.custom_check[type="checkbox"] {display:none; }
.custom_check[type="checkbox"] + label {position:relative; display:block; width:100%; font-size:15px; }
.custom_check[type="checkbox"]:checked + label:before {content:''; position:absolute; right:12px; top:12px; width:18px; height:18px; background:url('../images/icon/check.svg') no-repeat center center; }

.form-check-input[type="radio"] {position:relative; width:24px; height:24px; border:2px solid #94aeb4; background-color:transparent; }
.form-check-input[type="radio"]:before {content:''; position:absolute; left:3px; top:3px; width:14px; height:14px; background-color:transparent; border-radius:50%; }
.form-check-input[type="radio"]:checked {border-color:rgb(var(--color-primary)); background-color:transparent; }
.form-check-input[type="radio"]:checked:before {background-color:rgb(var(--color-primary));}

.form-check-input[type="radio"]:disabled:not(:checked) {background-color:transparent; opacity:.5;}
.form-check-input[type="radio"]:disabled:not(:checked) + label {opacity:.5; }

.form-check-input[type="radio"].type02 {width:18px; height:18px; border:1px solid rgb(var(--color-primary)); background-color:#fff; }
.form-check-input[type="radio"].type02:before {width:10px; height:10px; }

.form-check-input[type="radio"].type03 {display:none; }
.form-check-input[type="radio"].type03 + label {position:relative; display:block; width:100%; padding:12px 12px 12px 40px; border:1px solid #94AEB4; border-radius:3px; }
.form-check-input[type="radio"].type03 + label:before {content:''; position:absolute; left:14px; top:14px; width:16px; height:16px; border:2px solid #94aeb4; border-radius:50%; }
.form-check-input[type="radio"].type03:checked + label {border:1px solid rgb(var(--color-primary)); }
.form-check-input[type="radio"].type03:checked + label:before {border-color:rgb(var(--color-primary) / 1); }
.form-check-input[type="radio"].type03:checked + label:after {content:''; position:absolute; left:18px; top:18px; width:8px; height:8px; background-color:rgb(var(--color-primary)); border-radius:50%; }

.custom_radio[type="radio"] {display:none; }
.custom_radio[type="radio"] + label {position:relative; cursor:pointer; }
.custom_radio[type="radio"] + label:before {content:''; position:absolute; right:0; bottom:0; width:14px; height:14px; border-radius:50%; }
.custom_radio[type="radio"]:checked + label:before {background:rgb(var(--color-primary)) url('../images/icon/radio_check.svg') no-repeat center center / 20px 20px;}

/* ----------------------------------------------
            HOVER_CUSTOM
---------------------------------------------- */
.hover_custom {position:relative; }
.hover_custom .hover_cont {position:absolute; right:2px; top:2px; visibility:hidden; opacity:0; padding:8px; background-color:#F6C23C; border-radius:4px; transition:all 0.2s; }
.hover_custom:hover .hover_cont {visibility: visible; opacity:1; }


/* ----------------------------------------------
            ACCORDION
---------------------------------------------- */
.accordion .accordion-item:not(:last-child) {border:0 none; }
.accordion .accordion-item .accordion-header .accordion-button {position:relative; padding:0; }
.accordion .accordion-item .accordion-header .accordion-button:before {content:'+'; position:absolute; right:20px; top:calc(50% - 5px); width:10px; height:10px; font-size:20px; line-height:10px; opacity:1;}
.accordion .accordion-item .accordion-header .accordion-button:not(.collapsed) {color:#fff; }
.accordion .accordion-item .accordion-header .accordion-button:not(.collapsed):before {content:'-'; }
.accordion .accordion-collapse {color:#fff; }


/* ----------------------------------------------
            CUSTOM_SELECT
---------------------------------------------- */
.custom_select {z-index:5; position:relative; }
.custom_select > button:not(.nostyle) {display:flex; align-items:center; justify-content:space-between; width:100%; height:48px; padding:5px 16px; background:#1c252d; border-radius:8px; }
.custom_select > button .arrow {position:absolute; right:16px; top:50%; font-size:20px; color:var(--light-color); transform:translateY(-50%) rotate(90deg); }
.custom_select > div:not(.nodiv) {position:absolute; left:0; top:calc(100% + 10px); overflow-y:auto; overflow-x:hidden; display:none; width:100%; max-height:320px; padding:10px 0; background:#10171d; box-shadow:0 4px 100px rgba(43,198,157,.2); border-radius:8px; }
.custom_select ul li {display:flex; align-items:center; justify-content:space-between; padding:13px 12px; min-height:44px; color:var(--light-color); font-weight:700; }
.custom_select ul li:hover {background:rgba(53,68,78,.2); color:#fff; cursor:pointer; }
.custom_select.open {z-index:10; }
.custom_select.open > button .arrow {transform:translateY(-50%) rotate(-90deg); }
.custom_select.open > div:not(.nodiv) {display:block; }


/* ----------------------------------------------
            PROGRESS
---------------------------------------------- */
.progress {width:100%; height:16px; border-radius:8px; background-color:#22474f; padding:2px; }
.progress span {display:block; min-width:12px; height:12px; background-color:rgb(var(--color-primary)); border-radius:6px; }


/* ----------------------------------------------
            SUB_VISUAL
---------------------------------------------- */
.sub_visual {overflow:hidden; positioN:relative; width:100%; height:320px; margin-bottom:24px; border-radius:8px; background-color:#10171d; }
.sub_visual > img {position:absolute; z-index:1; right:0; top:0; width:auto; height:100%; }
.sub_visual .txt_box {position:relative; z-index:2; height:100%; }

@media all and (max-width:1279px){
    .sub_visual {height:250px; }
}

@media all and (max-width:767px){
    .sub_visual {height:155px; }
}


/* ----------------------------------------------
            INPUT_CUSTOM
---------------------------------------------- */
.input_custom {position:relative; height:50px; }
.input_custom input {width:calc(100% - 40px); height:50px; border:0 none; font-size:15px; background-color:rgba(28,37,45,0.5); border-radius:8px; }
.input_custom input:focus {box-shadow:none;}
.input_custom .right_box {position:absolute; right:0; top:0; display:flex; align-items:center; height:100%; padding:0 10px; }

@media all and (max-width:1279px){
    .input_custom input {height:40px; }
}

/* ----------------------------------------------
            GAME_ITME
---------------------------------------------- */
.game_item.swiper-slide {width:164px; } 
.game_item .img_box {position:relative; }
.game_item .img_box img {width:100%; height:100%; }
.game_item .img_box .players {position:absolute; right:8px; top:8px; display:flex; align-items:center; gap:4px; padding:4px 8px; border-radius:16px; background-color:#0D1D34B2; font-size:12px; font-weight:700; }
 .game_item .img_box .hover_box {opacity:0; position:absolute; left:0; top:0; display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; padding:32px 8px 8px; background-color:rgba(34,71,79,.9); transition:all 0.5s; } 
/*.game_item .img_box .hover_box {opacity:0; position:absolute; left:0; top:0; display:flex; flex-direction:column; align-items:center; justify-content:center; width:100%; height:100%; padding:32px 8px 8px; background-color: rgb(34 71 79 / 32%); transition:all 0.5s; } */

.game_item:hover .img_box .hover_box {opacity:1; }
.game_item .img_box .hover_box .btn {max-width:90%; min-width:70%; }
/*.game_item .img_box .hover_box .bookmark {position:absolute; right:10px; top:10px; } */
.game_item .img_box .hover_box .bookmark {position:absolute; right:5px; top:5px; } 

.game_item .img_box .demo_band {
    position: absolute;
    left: 8px;
    top: 8px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 8px;
    border-radius: 16px;
    background-color: #0D1D34B2;
    font-size: 12px;
    font-weight: 700;
}

/*
.game_item .img_box .hover_box {
	padding:0;
}
*/
.game_item .img_box .hover_box_layer {
	opacity:1; 
	position:absolute; 
	left:0; 
	top:0; 
	display:flex; 
	flex-direction:column; 
	align-items:center; 
	justify-content:center; 
	width:100%;
	height:100%; 
	padding:32px 8px 8px; 
	/*background-color: #dc1caae6; */
	transition:all 0.5s; 
} 

.game_item:hover .img_box .hover_box_layer {	
	opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    transition-duration: .5s, 0s;
    transition-delay: 0s, .3s;
}

@media all and (max-width:767px){
    .game_item.swiper-slide {width:144px; } 
	/*.game_item.swiper-slide {width:110px; } */
	
}

/* ----------------------------------------------
            BETTING_SLIP
---------------------------------------------- */
.right_bet {width:18vw; min-width:330px; padding-right:15px; }
.right_bet .tab_btn {position:absolute; right:calc(100% + 30px); top:10px; display:flex; align-items:center; justify-content:center; gap:5px; width:140px; height:30px; background-color:rgb(var(--color-primary)); font-size:14px; border-radius:8px 8px 0 0; box-shadow:0px 4px 48px rgba(255, 255, 255, 0.15), 0px 4px 48px rgba(43, 198, 157, 0.4); transform-origin:top right; transform:rotate(-90deg); }
.right_bet_wrap {z-index:90; position:sticky; top:90px; height:calc(100vh - 105px);}
.right_bet_slip {background-color:#19232A; box-shadow:0 0 5px rgba(0, 0, 0, 0.3); border-radius:6px; }
.right_bet_slip .nav-link-tabs button {color:#fff !important; }
.right_bet_slip .bet_check input + label {border:1px solid transparent; }
.right_bet_slip .bet_check input:checked + label {border:1px solid rgb(var(--color-primary)); }
.right_bet_slip .bet_check input:disabled + label p:not(.text-primary),
.right_bet_slip .bet_check input:disabled + label span,
.right_bet_slip .bet_check input:disabled + label img {filter:grayscale(1); color:var(--light-color); }
.right_bet_slip .bet_check input:disabled + label .text-primary {opacity:.5; }
.right_bet_slip .accordion .accordion-button:before {display:none; }
.right_bet_slip .accordion .accordion-button.collapsed svg {transform:rotate(90deg); }
.right_bet_slip .accordion .accordion-button svg {transform:rotate(270deg); transition:all 0.3s; }

@media all and (max-width:1400px){
    .right_bet {z-index:50; position:fixed; top:75px; left:calc(100% - 10px); width:330px; height:calc(100% - 75px); padding-right:0; background-color:#19232A; }
    .right_bet.open {left:calc(100% - 330px); }
    .right_bet.open .tab_btn {width:30px; }
    .right_bet.open .tab_btn span {display:none; }
    .right_bet.open .tab_btn svg {transform:rotate(180deg); }
    .right_bet_wrap {height:100%; border-radius:0; }
}
@media all and (max-width:1279px){
    .right_bet {display:none; }
    .right_bet .tab_btn {display:none; }
    .right_bet.open {display:block; z-index:100; position:fixed; left:0; right:0; top:60px; width:100%; height:calc(100% - 120px); }
    .right_bet .right_bet_slip {height:100%;}
    .right_bet .right_bet_slip > .tab-content ,
    .right_bet .right_bet_slip > .tab-content > div {height:100%;}
    .right_bet .betslip_wrap .tab-content {height:calc(100% - 110px); }
    .right_bet .betslip_wrap .tab-content > div {height:100%; }
}

/* ----------------------------------------------
            3xl:
---------------------------------------------- */
@media (min-width:1750px){
    .\33xl\:block {display:block; }
}
/* ----------------------------------------------
            add:
---------------------------------------------- */
@media (min-width:1750px){
    .\33xl\:flex {display:flex; }
}



.main-loader_mo {
    z-index: 99999;
    position: fixed;
    left: 0;
    top: 60px;
    right: 0;
    bottom: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(100% 200% at 0% 0%, #35444e, #19242d);
}
.main-loader_mo.hide {display:none; }