/*
======================================================================================
* 퍼블리싱 할 때 dist > custom_css 안에서만 사용
* dist > app.css는 건들지 말것
* 전체 테마 color변경을 원할 경우
    초기 순서 : yarn install > yarn run watch 후 src > _color.css 에서 컬러테마 변경
    작업 중간 수정 : yarn run watch 후 src > _color.css 에서 컬러테마 변경
======================================================================================
*/

/*
#=========================================#
        tab
#=========================================#
*/
.dark .nav-boxed-tabs .active {background-color: #2D3035; }
.nav-boxed-tabs .active {background-color: #fff; color:var(--title-color); font-weight:bold; }
.nav-boxed-tabs button.type02 {background-color:rgba(0, 0, 0, 0.2); }
.nav-boxed-tabs.bg-modaldark {background-color:var(--modal-darkbg); }

.nav-boxed-tabs.type02 button {background-color:var(--btn-dark); color:var(--title-color); border-radius:3px; }
.nav-boxed-tabs.type02 button.active {background-color:var(--primary-color); color:var(--standard-color); }

.dark .nav.nav-link-tabs .nav-item .nav-link {border-color:rgba(49,56,61,.6); color:inherit; }
.dark .nav.nav-link-tabs .nav-item .nav-link.active {border-color:var(--primary-color); color:var(--title-color); }
.nav.nav-link-tabs .nav-item .nav-link {border-width:0px; border-bottom-width:1px; border-color:rgba(192,196,208,.6); }
.nav.nav-link-tabs .nav-item .nav-link.active {font-weight:bold; background-image:linear-gradient(to top, rgba(59, 193, 23, 0.15), rgba(59, 193, 23, 0) 60%); }
.nav.nav-link-tabs.type02 .nav-item .nav-link {border-bottom-width:2px; }
.nav.nav-link-tabs.type02 .nav-item .nav-link.active {background:transparent; }

.dark .nav.nav-link-tabs.type03 {border-bottom:1px solid #3C404A; }
.nav.nav-link-tabs.type03 {border-bottom:1px solid #F1F3F7; }

.nav.nav-tabs {border:0 none; }
.nav.nav-tabs .nav-item .nav-link {border:0 none !important; }
.nav.nav-tabs .nav-item .nav-link:hover {background-color: var(--background-color) !important;}
.nav.nav-tabs .nav-item .nav-link.active {background-color: var(--background-color) !important;}

.nav-boxed.type03 button {background-color:var(--casino-listbg); }
.nav-boxed.type03 button .arrow svg path {fill:var(--casino-listbg); }
.nav-boxed.type03 button.active {background-color:var(--standard-color); }
.nav-boxed.type03 button.active .arrow svg path {fill:var(--standard-color); }

.tab-content .tab-pane {width:100% !important; }

.nav-inline-tabs {gap:15px; }
.nav-inline-tabs .nav-link {padding:0; color:var(--text-color); opacity:.7; }
.nav-inline-tabs .nav-link svg {fill:var(--text-color) }
.nav-inline-tabs .nav-link.active {color:var(--title-color); opacity:1; }
.nav-inline-tabs .nav-link.active svg {fill:var(--title-color); }


/*
#=========================================#
        accordion 
#=========================================#
*/
.accordion.accordion-boxed .accordion-item {border:0 none; }
.accordion.accordion-boxed .accordion-button.collapsed .arrow {transform: rotate(0); }
.accordion.accordion-boxed .accordion-button .arrow {transform: rotate(90deg); transition:all 0.4s; }
/*
#=========================================#
        dropdown
#=========================================#
*/
.dropdown-menu .dropdown-content {padding:0; }
.dark .dropdown-content {background-color: #17181b; }
.dropdown-content {background-color: #fff; }
.dropdown-menu .dropdown-content .tab-content .tab-pane { width:100% !important; }
@media all and (max-width:640px){
    .dropdown-menu.show {width:100% !important; }
}

/*
#=========================================#
        form
#=========================================#
*/
.form-control {height:42px; border-radius:3px; }
.form-control:focus {border:1px solid var(--primary-color) !important; box-shadow:none; outline:0 none; }
.form-control.nofocus:focus {border:0 none !important;}


.dark .form-control.type02 {background-color:#222328; border-color:#2d3035; }
.form-control.type02 {background-color:#fff; border:1px solid #e9eaf2; }

.dark .form-control.type03 {border-color:#67707B; }
.form-control.type03 {background-color:transparent !important; border:1px solid #98A7B5; }

.dark .form-control {background-color: var(--standard-color);}
.form-control {box-shadow:none; background-color: var(--background-color); border:0 none; color:var(--title-color); }

.dark .form-control.bg-back2 {background-color:#1a1c20; }
.form-control.bg-back2 {background-color:#fff; }

.form-control.bg-back {background-color:var(--background-color); }
.form-control.bg-backlight {background-color:var(--background-light); }

.dark .form-control.bg-modaldark {background-color:var(--modal-darkbg); }

/* checkbox */
.form-check-input[type="checkbox"] {border:1px solid var(--primary-color) !important; box-shadow:none; }
.form-check-input[type="checkbox"].grayborder {border:1px solid var(--placeholder-color) !important; }
.form-switch .form-check-input {width:28px; height:16px; padding:0; background-color:#bfc3c7; border:0 none !important; }
.form-switch .form-check-input:focus {box-shadow:none; outline:none; }
.form-switch .form-check-input:before {width:16px; height:16px; background-color: #fff;}
.form-switch .form-check-input:checked {border:0 none; background-color: #3bc11733 !important;}
.form-switch .form-check-input:checked::before {background-color: var(--primary-color) !important;}
.dark .form-switch .form-check-input {background-color: #3A4047;}
.dark .form-switch .form-check-input:before {background-color: #737c86;}

.form-check[type="checkbox"] {border:1px solid var(--title-color); background-color:transparent; border-radius:2px;}
.form-check[type="checkbox"]:checked {border-color:var(--primary-color); background:var(--primary-color) url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e"); }

.form-check-input[type="radio"] {border:1px solid var(--primary-color) !important; background-color: transparent !important;}
/* .form-check-input[type="radio"]:checked {background-color:var(--primary-color) !important; } */

/* select  */
.custom_select {position:relative; }
.custom_select > button {width:100%;}
.custom_select > button svg {transition:all 0.3s; }
.custom_select.on > button svg {transform:rotate(90deg); }
.custom_select ul {z-index:10; position:absolute; left:0; top:100%; visibility: hidden; opacity:0; width: 100%; max-height:260px; margin-top:-10px; transition:all 0.3s; }
.custom_select.on ul {visibility: visible; opacity:1; margin-top:0; }
.custom_select ul li {cursor:pointer; border-radius:4px; padding-left:8px; }
.custom_select ul li:not(.nohover):hover {background-color:var(--background-color); }
.custom_select ul li.on {position:relative; border:1px solid #3bc11766;}
.custom_select ul li.on:after {content: ""; position: absolute; width: 0.5rem; height: 0.5rem; border-radius: 50%; top: 50%; margin-top: -0.25rem; right: 0.625rem; background-color: var(--primary-color); box-shadow: 0 0 0 0.3125rem #3bc11726;}
.custom_select[data-select="count"] input[type="checkbox"]:checked + label {color:var(--text-color); }
.custom_select[data-select="count"] ul {max-height:400px; }
.custom_select.top.on > button svg {transform:rotate(-90deg); } 
.custom_select.top ul {top:auto; bottom:100%;}
.custom_select[data-select="add"] ul li.on {border:0px solid transparent; }
.custom_select[data-select="add"] ul li.on:after {display:none;}

.custom_select .date {padding-left:0 !important; }
.custom_select .date.on {border:0 none !important; }
.custom_select .date.on:after {display:none !important; }
.custom_select .date input {width:100%; height:32px !important; padding:0 23px 0 8px; background-color:transparent !important; color:var(--sub-text-color); cursor:pointer; font-size:13px;}
.custom_select .date input:not(:placeholder-shown) {border:1px solid #3bc11766; }
.custom_select .date input::placeholder {color:var(--sub-text-color) }
.custom_select .date input::-webkit-input-placeholder {color:var(--sub-text-color)}


.custom_select2 {position:relative; }
.custom_select2 > button {width:100%;}
.custom_select2 > button svg.arr {transition:all 0.3s; }
.custom_select2.on > button svg.arr {transform:rotate(90deg); }
.custom_select2 > div {z-index:10; position:absolute; left:0; top:100%; visibility: hidden; opacity:0; width: 100%; margin-top:30px; transition:all 0.3s; }
.custom_select2 > div.right {left:auto; right:0; }
.custom_select2.on > div {visibility: visible; opacity:1; margin-top:0; }
.custom_select2 ul li {cursor:pointer; border-radius:4px; padding-left:8px; }
.custom_select2 ul li:hover {background-color:var(--background-color); }
.custom_select2 ul li.on {position:relative; border:1px solid #3bc11766;}



/*
#=========================================#
        modal
#=========================================#
*/

.modal-content > div:first-of-type {transform: translateX(0px); transition:all 0.5s; }
.modal-content.on > div:first-of-type {transform: translateX(-40px); }
.modal .modal-body.modal-in {position:absolute; left:100%; top:0; width:100%; height:100%; transition:left 0.3s; }
.modal .modal-body.modal-in.open {left:0; }

.modal .modal-body {transform: translateX(0px); transition:all 0.5s; }
.modal .modal-body.on {transform: translateX(-40px);}

.modal .modal-dialog {transition:width 0.2s, margin-top 0.4s; }
.modal-content {background-color: var(--standard-color) !important;}
.modal-body {padding:0; }
.dark .modal-head {background-color: #17181b;}
.modal-head {background-color:#f5f6fa ;}

@media (min-width:640px){
    .modal .modal-dialog.modal-2lg {
        width:600px;
    }
    .modal .modal-dialog.modal-base {
        width:600px;
    }
}
@media (min-width:1024px){
    .modal .modal-dialog.modal-2lg {
        width:800px;
    }
    .modal .modal-dialog.modal-base {
        width:680px;
    }
}
@media (max-width:640px) {
    .mo_full.modal.show > .modal-dialog {margin:0; width:100%; height:100%;}
    /* .mo_full.modal.show .modal-content,
    .mo_full.modal.show .modal-body {height:100%;} */
}

.iframe.mo_full.modal.show > .modal-dialog {margin:0; width:100%; height:100%;}
/* .iframe.mo_full.modal.show .modal-content,
.iframe.mo_full.modal.show .modal-body {height:100%;} */

/* @media (orientation: landscape) {
    .mo_full.modal.show > .modal-dialog {margin:0; width:100%; height:100%;}
    .mo_full.modal.show .modal-content,
    .mo_full.modal.show .modal-body {height:100%;}
} */

/* 드래그 모달 */
.draggable_modal.show{
    scale: 1;
    z-index: 99;
}
.draggable_modal{
    position: fixed;
    top:15%;
    left: 23%; 
    z-index: -99;
    scale: 0;
}
.draggable_modal_header{
    cursor: move;
    touch-action:auto !important;
}
@media (max-width:767px){
    .draggable_modal {top:10px; left:10px; }
}


/*
#=========================================#
        table
#=========================================#
*/
.noline.table th,
.noline.table td {border:0 none !important; }

.pad-s.table th,
.pad-s.table td {padding:8px 4px; }

.pad-bl.table th {padding:8px 6px; }
.pad-bl.table td {padding:15px 6px; }

.table.rounded tr td:first-of-type,
.table.rounded tr th:first-of-type {border-top-left-radius: 5px; border-bottom-left-radius: 5px;}
.table.rounded tr td:last-of-type,
.table.rounded tr th:last-of-type {border-top-right-radius: 5px; border-bottom-right-radius: 5px;}

.dark .table.table-striped tr:nth-of-type(odd) td {background-color: rgb(var(--color-slate-400) / 0.4) !important;}
.table.table-striped tr:nth-of-type(odd) td {background-color: #fff !important;}

.dark .table.table-striped.striped-dark tr:nth-of-type(odd) td {background-color: var(--modal-darkbg) !important; }

.dark .table.table-border td,
.dark .table.table-border th {border-bottom:1px solid rgba(255,255,255,.1); }
.dark .table.table-border.table-border-type td,
.dark .table.table-border.table-border-type th {border-right:1px solid rgba(255,255,255,.1); }
.dark .table.table-border.table-border-type td:last-of-type,
.dark .table.table-border.table-border-type th:last-of-type {border-right:0 none; }
.table.table-border td,
.table.table-border th {border-bottom:1px solid #ECECF0; }
.table.table-border.table-border-type td,
.table.table-border.table-border-type th {border-right:1px solid #ececf0; }
.table.table-border.table-border-type td:last-of-type,
.table.table-border.table-border-type th:last-of-type {border-right:0 none; }


@media (max-width:640px){
    .mo_pad-s.table th,
    .mo_pad-s.table td {padding:8px 4px; }
}
/*
#=========================================#
        알림
#=========================================#
*/
.alert {z-index:10003; position:fixed; left:20px; bottom:-100px; width:450px; transition:bottom 0.4s;  }
.alert.show {bottom:20px; }
.alert .loading_svg {width:23px; height:23px; padding:3px; background-color:rgba(30,32,36,.5); border-radius:50%;}
.alert .loading_svg svg {width:100%; height:100%; transform: rotate(115deg) scaleX(-1); }
.alert .loading_svg circle {stroke:var(--primary-color); stroke-dasharray: 1px, 1px; transition-delay: 1s;}
.alert.show .loading_svg circle { stroke-dasharray: 0px, 1px; transition:stroke-dasharray 3s linear; }

@media all and (max-width:640px){
    .alert {width:calc(100% - 40px); }
}

/*
#=========================================#
        tooltip 커스텀
#=========================================#
*/
.tooltip_custom {position:relative; cursor:pointer; }
.tooltip_custom .hover_box {display:none; position:absolute; top:100%; left:50%; transform:translateX(-50%); }
.tooltip_custom .hover_box.left_side {left:0; transform:translateX(-30%); }
.tooltip_custom .hover_box.top {top:auto; bottom:100%; }
.tooltip_custom:hover .hover_box {display:block; }

/*
#=========================================#
        로그인/회원가입 모달
#=========================================#
*/
.dark .login_modal .modal-content {background-color: #1f2327 !important;}
.login_modal .modal-content {background-color: #F4F4F7 !important;}

.dark .login_modal .login-left {background:url('../custom_img/login_bg.webp') no-repeat center center / 100% auto; }
.login_modal .login-left {background:url('../custom_img/login_bg_w.png') no-repeat center center / 100% auto; }

.join_phone_box {z-index:10; position:absolute; left:0; top:calc(100% + 5px); opacity:0; visibility: hidden; width:100%; margin-top:-10px; transition:all 0.5s; }
.join_phone_box.show {opacity:1; visibility:visible; margin-top:0; }
.join_phone_box .active {border:1px solid var(--primary-color); }

/* .join_bank_box {z-index:10; position:absolute; left:0; top:calc(100% - 42px); opacity:0; visibility: hidden; width:100%; margin-top:-10px; transition:all 0.5s; } */
.join_bank_box {z-index:10; position:absolute; left:0; top:calc(100% + 5px); opacity:0; visibility: hidden; width:100%; margin-top:-10px; transition:all 0.5s; }
.join_bank_box.show {opacity:1; visibility:visible; margin-top:0; }
.join_bank_box .active {border:1px solid var(--primary-color); }

.login_modal .promotion_btn svg {transform:rotate(90deg); transition:all 0.3s; }
.login_modal .promotion_btn.on svg {transform:rotate(270deg); }


@media (max-width:640px){
    .dark .login_modal .login-left {background:url('../custom_img/login_bg_mo.webp') no-repeat center center / 100% auto; }
    .login_modal .login-left {background:url('../custom_img/login_bg_w_mo.png') no-repeat center center / 100% auto; }
}

/*
#=========================================#
        vip 클럽 모달
#=========================================#
*/
/* 탭 */
.vip-tabs.nav {display:grid; grid-template-columns: repeat(8,1fr); gap:5px; }
.vip-tabs .nav-link {padding-left:5px; padding-right:5px; }
.vip-tabs .nav-link:hover {color:var(--text-color); }
.vip-tabs .nav-link.active {font-weight:bold !important; }
.vip-tabs .nav-link.bronze.active {color:rgb(224, 154, 106); }
.vip-tabs .nav-link.silver.active {color:rgb(225, 225, 225); }
.vip-tabs .nav-link.gold.active {color:rgb(255, 195, 41); }
.vip-tabs .nav-link.plat.active {color:rgb(157, 99, 246); }
.vip-tabs .nav-link.dia.active {color:rgb(244, 80, 169); }
.vip-tabs .nav-link img {width:34px; margin:0 auto 5px; opacity:.5; }
.vip-tabs .nav-link.active img {opacity:1; }

/* 컨텐츠 */
.vip-cont .vip_flag {position:relative; height:20px; padding:0 12px 0 6px; line-height:20px; }
.vip-cont .vip_flag.small {height:16px; }
.vip-cont .vip_flag.bronze {background-color:rgb(224, 154, 106); color:#533f37; }
.vip-cont .vip_flag.silver {background-color:rgb(225, 225, 225); color:#533f37; }
.vip-cont .vip_flag.gold {background-color:rgb(255, 195, 41); color:#533f37; }
.vip-cont .vip_flag.plat {background-color:rgb(157, 99, 246); color:#fff; }
.vip-cont .vip_flag.dia {background-color:rgb(244, 80, 169); color:#fff; }
.vip-cont .vip_flag:after {content:''; position:absolute; right:0; top:0; width:7px; height:100%; border-right:7px solid var(--background-color); border-top:10px solid transparent; border-bottom:10px solid transparent; }
.vip-cont .vip_flag.small:after {border-top-width:8px; border-bottom-width:8px; }
.vip-cont .vip_flag.host {background-color: rgb(177, 202, 235); color:#fff; }
.dark .vip-cont .vip_flag.host:after {border-right-color:#2D3035; }
.vip-cont .vip_flag.host:after {border-right-color:#fff; }
.vip-info .vip-cont .vip_flag:after {border-right-color:rgb(var(--color-slate-200)); }

.vip-cont .hover_box > div {display:none; }
.vip-cont .hover_box:hover > div {display:block; }

.vip-process.primary > div {background:var(--primary-color) !important; }

.vip_grade {padding:1px; background:linear-gradient(180deg,#798DA4 0%,#627C9B 100%); }
.dark .vip_grade > div {background:linear-gradient(82.85deg,#475565 -.8%,#6F7F93 103.54%); }
.vip_grade > div {background:linear-gradient(82deg,#FFFFFF 0%,#909FB0 103%); }
.vip-process > div {background:linear-gradient(270deg,#7993B3 3.21%,#A5B6CA 108.65%); }

.dark .vip_grade.bronze {background:linear-gradient(180deg,rgba(255,255,255,.21) 0%,rgba(140,127,110,.51) 100%); }
.vip_grade.bronze {background:linear-gradient(251.99deg,#E8B88C 20.28%,#FFE2BC 86.35%); }
.dark .vip_grade.bronze > div {background:linear-gradient(82.85deg,#2D2920 -.8%,#705F4B 103.54%); }
.vip_grade.bronze > div {background:linear-gradient(82deg,#FFFFFF 0%,#F2CB99 103%); }
.bronze .vip-process > div {background:linear-gradient(270deg,#975637 3.21%,#EEC2A8 108.65%); }

.dark .vip_grade.silver {background:linear-gradient(80.86deg,#333232 -.89%,#747474 103.25%); }
.vip_grade.silver {background:linear-gradient(82deg,#FFFFFF 0%,#D9D9D9 103%); }
.dark .vip_grade.silver > div {background:linear-gradient(251.99deg,#ACA9A9 20.28%,#525050 86.35%); }
.vip_grade.silver > div {background:linear-gradient(251.99deg,#C0C0C0 20.28%,#E1E1E1 86.35%); }
.silver .vip-process > div {background: linear-gradient(270deg,#8E8E8E 3.21%,#E3E3E3 108.65%); }

.dark .vip_grade.gold {background:linear-gradient(82.85deg,#443B30 -.8%,#BD9548 103.54%); }
.vip_grade.gold {background:linear-gradient(82deg,#FFFFFF 0%,#FAC44B 103%); }
.dark .vip_grade.gold > div {background:linear-gradient(251.99deg,#E7C171 20.28%,#847153 86.35%); }
.vip_grade.gold > div {background:linear-gradient(251.99deg,#F8B31F 20.28%,#FEECC0 86.35%); }
.gold .vip-process > div {background:linear-gradient(270deg,#F7AE19 3.21%,#FDD67B 108.65%); }

.dark .vip_grade.plat {background:linear-gradient(82.85deg,#433A4F -.8%,#8051B5 103.54%); }
.vip_grade.plat {background:linear-gradient(82deg,#FFFFFF 0%,#BC95E8 103%); }
.dark .vip_grade.plat > div {background:linear-gradient(251.99deg,#A174DA 20.28%,#9073A5 86.35%); }
.vip_grade.plat > div {background:linear-gradient(251.99deg,#9E78D8 20.28%,#E2BAFE 86.35%); }
.plat .vip-process > div {background:linear-gradient(270deg,#AC85E0 3.21%,#DEB5FB 108.65%); }

.dark .vip_grade.dia {background:linear-gradient(78.9deg,#412B38 -5%,#B56691 105.74%); }
.vip_grade.dia {background:linear-gradient(82deg,#FFFFFF 0%,#BC95E8 103%); }
.dark .vip_grade.dia > div {background:linear-gradient(251.99deg,#EA84B9 20.28%,#79536A 86.35%); }
.vip_grade.dia > div {background:linear-gradient(251.99deg,#DE83B2 20.28%,#FFBDE4 86.35%); }
.dia .vip-process > div {background:linear-gradient(270deg,#D36EA1 3.21%,#F8B0D9 108.65%); }

.vip-info > div:first-of-type i svg {transform:rotate(90deg); transition:all 0.3s; }
.vip-info > div:first-of-type.on i svg {transform:rotate(270deg);}
.vip-info > div:last-of-type {height:0; }
.vip-info > div:last-of-type.open {height:auto; padding:8px; padding-bottom:0; }

.vip-bat {width:61px; height:78px; padding-top:31px; background:url('../custom_img/profile/nostage_bat.png') no-repeat center center / 100% auto; letter-spacing:-0.5px; }
.vip-bat.bronze {background-image:url('../custom_img/profile/bronze_bat.webp'); }
.vip-bat.silver {background-image:url('../custom_img/profile/silver_bat.webp'); }
.vip-bat.gold {background-image:url('../custom_img/profile/gold_bat.png'); }
.vip-bat.plat {background-image:url('../custom_img/profile/platinum_bat.png'); }
.vip-bat.dia {background-image:url('../custom_img/profile/diamond_bat.webp'); }


/*
#=========================================#
        유저정보 모달
#=========================================#
*/
.progressbar {position:relative; }
.progressbar .pointer {position:absolute; bottom:100%; width:10px; height:10px; border-bottom:5px solid var(--background-color); border-left:5px solid transparent; border-right:5px solid transparent; }
.progressbar .pointer.active {border-bottom-color:var(--primary-color); }
.progressbar .pointer:nth-of-type(1) {left:3%; }
.progressbar .pointer:nth-of-type(2) {left:26%; }
.progressbar .pointer:nth-of-type(3) {left:49%; }
.progressbar .pointer:nth-of-type(4) {left:71%; }
.progressbar .pointer:nth-of-type(5) {left:94%; }



/*
#=========================================#
        캐시버튼
#=========================================#
*/
.cash_btn_box {display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.cash_btn_box .cash_btn {position:relative; width:100%; height:50px; background-color:var(--background-color); }
.cash_btn_box .cash_btn .bonus {position:absolute; right:0; top:0; background-color:#E1810C; color:#fff; font-weight:normal;}
.dark .cash_btn_box .cash_btn.on {background:linear-gradient(100.51deg,#2F7624 6.83%,#0B0B0C 93.94%); }
.cash_btn_box .cash_btn.on {background:linear-gradient(100.51deg,#7BD962 6.83%,#FCFDFF 93.94%); border:1px solid var(--primary-color); font-weight:800;  }
.cash_btn_box .cash_btn.on:after {content:''; position:absolute; right:-1px; bottom:0; width:28px; height:18.96px; background:url('../custom_img/cash_btn_checked.png') no-repeat center center / 100% auto; }
.cash_btn_box .cash_btn.on .bonus {background-color:#FFE600; color:#393939; }

/*
#=========================================#
        아코디언 
#=========================================#
*/
.accordian_item .title .arrow {transform:rotate(90deg); transition:all 0.5s; }
.accordian_item.on .title .arrow {transform:rotate(-90deg)}

.dark .accordian_item .title .plus_btn {background:rgba(255,255,255,.2)}
.accordian_item .title .plus_btn {background:#F6F7FA}
.accordian_item .title .plus_btn .on {display:none;}
.accordian_item .title .plus_btn .off {display:block;}

.accordian_item.on .title .plus_btn {background-color: var(--primary-color) !important;}
.accordian_item.on .title .plus_btn .on {display:block;}
.accordian_item.on .title .plus_btn .off {display:none;}
/*
#=========================================#
        swiper
#=========================================#
*/
.swiper-button-next , .swiper-button-prev {top:calc(50% - 18px); width:36px; height:36px; margin:0; background:var(--background-color); }
.swiper-button-next {right:-36px; }
.swiper-button-prev {left:-36px; }
.swiper-button-next:after , .swiper-button-prev:after {display:none; }
.swiper-button-next:hover , .swiper-button-prev:hover {background:var(--placeholder-color); }

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {bottom:-25px; }
.swiper-pagination-bullet {width:10px; height:10px; opacity:1; background-color: rgba(151,151,151,.3); }
.swiper-pagination-bullet-active {width:28px; background-color:#fff; border-radius:10px;  }

@media all and (max-width:767px){
    .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {bottom:5px; }
    .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {margin:0 2px; }
    .swiper-pagination-bullet {width:5px; height:5px; }
    .swiper-pagination-bullet-active  {width:15px; border-radius:5px; }
}
/*
#=========================================#
        main_visual
#=========================================#
*/

.dark .main_visual {background:linear-gradient(180deg,#191B1E 0%,#24262B 100%); }
.main_visual {background:linear-gradient(180deg,#EAECF3 0%,#F6F7FA 100%); }
.main_visual .visual_img {width:800px;}
.main_visual .join_other {display:flex; align-items:center; justify-content: center; width:40px; height:40px; background-color:var(--btn-dark); border-radius:50%; }
.main_visual .join_other svg {fill:var(--title-color); transform:scale(1.5); }
.main_visual .join_other:hover {background-color: var(--title-color); }
.main_visual .join_other:hover svg {fill:var(--btn-dark); }
.main_visual .slide_wrap {margin-top:-200px; }

@media all and (max-width:1400px){
    .main_visual .visual_img {width:650px;}
    .main_visual .slide_wrap {margin-top:-140px; }
}
@media all and (max-width:767px){
    .main_visual .text_box {margin-top:-100px; }
    .main_visual .slide_wrap {margin-top:0; }
}
@media all and (max-width:640px){
    .main_visual {padding-top:20px; overflow:hidden; }
    .main_visual .visual_top {display:none; }
    .main_visual .slide_wrap .swiper-button-next,
    .main_visual .slide_wrap .swiper-button-prev {display:none; }
}
/*
#=========================================#
        sponsorship
#=========================================#
*/
.sponsor_link:hover {color:var(--title-color);}
.sponsor_link:hover svg {fill:var(--primary-color); }


/*
#=========================================#
        casino
#=========================================#
*/
.casino_gameinfo {position:relative; }
.casino_gameinfo .hover_box {position:absolute; left:50%; bottom:calc(100% + 5px); display:none; width:250px; transform:translateX(-50%); }
.casino_gameinfo:hover .hover_box {display:block; z-index:10; }

.casino_slide li.swiper-slide-active .hover_box {transform:translateX(-30%);} 

@media all and (min-width:1335px){
    .casino_slide li.swiper-slide-active +li+li+li+li+li+li .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:1100px) and (max-width:1334px){
    .casino_slide li.swiper-slide-active +li+li+li+li+li .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:990px) and (max-width:1199px){
    .casino_slide li.swiper-slide-active +li+li+li+li .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:815px) and (max-width:989px){
    .casino_slide li.swiper-slide-active +li+li+li .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:768px) and (max-width:814px){
    .casino_slide li.swiper-slide-active +li+li .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (max-width:767px){
    .casino_slide li.swiper-slide-active +li+li .hover_box {right:0; left:auto; transform:translateX(0); }
}

.casino_list {display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:1.25rem 0.75rem; }
.casino_list.mo_ver {--grid-num:3.2; --grid-gap:.5rem; grid-template-rows:repeat(1,1fr); grid-auto-flow:column; grid-auto-columns: calc(100% / var(--grid-num) - (var(--grid-num) - 1) * var(--grid-gap) / var(--grid-num));
    gap: var(--grid-gap); grid-template-columns:unset; }
/* .casino_list.mo_ver li {width:120px; } */

@media all and (min-width:1532px){
    .casino_list li:nth-of-type(7n+1) .hover_box {transform:translateX(-30%);}
    .casino_list li:nth-of-type(7n) .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:1360px) and (max-width:1531px){
    .casino_list li:nth-of-type(6n+1) .hover_box {transform:translateX(-30%);}
    .casino_list li:nth-of-type(6n) .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:992px) and (max-width:1361px){
    .casino_list li:nth-of-type(5n+1) .hover_box {transform:translateX(-30%);}
    .casino_list li:nth-of-type(5n) .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:820px) and (max-width:991px){
    .casino_list li:nth-of-type(4n+1) .hover_box {transform:translateX(-30%);}
    .casino_list li:nth-of-type(4n) .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (min-width:524px) and (max-width:819px){
    .casino_list li:nth-of-type(3n+1) .hover_box {transform:translateX(-30%);}
    .casino_list li:nth-of-type(3n) .hover_box {right:0; left:auto; transform:translateX(0); }
}
@media all and (max-width:523px){
    .casino_list li:nth-of-type(3n+1) .hover_box {transform:translateX(-30%);}
    .casino_list li:nth-of-type(3n) .hover_box {right:0; left:auto; transform:translateX(0); }
}

@media all and (max-width:420px){
    .casino_slide .game_tit,
    .casino_list .game_tit {width:100%; color:var(--title-color); text-align:center;}
    .casino_slide .casino_gameinfo,
    .casino_list .casino_gameinfo {display:none; }

    .casino_list {grid-template-columns: repeat(auto-fill,minmax(30%,1fr));}
}

/*
#=========================================#
        메인
#=========================================#
*/
.game_info { display: grid; grid-template-columns: repeat(4,1fr); gap: 0.9375rem;}
.game_info li {position:relative; overflow:hidden; }
.game_info li .blur { position: absolute; top: 50%; left: 50%; -webkit-transform: translate3d(-50%,-50%,0); -ms-transform: translate3d(-50%,-50%,0); transform: translate3d(-50%,-50%,0); z-index: 1; width: 109.54%; aspect-ratio: 356/196; border-radius: 22.25rem; -webkit-filter: blur(2.625rem); filter: blur(2.625rem)}
.game_info li img {position:relative; z-index:5; }

.dark .game_info li.casino {background:linear-gradient(180deg,rgba(98,22,233,.2) 0%,rgba(98,22,233,0) 100%),#1C1E22; }
.dark .game_info li.sports {background:linear-gradient(180deg,rgba(23,183,69,.2) 0%,rgba(30,130,59,0) 100%),#1C1E22}
.dark .game_info li.racing {background:linear-gradient(180deg,rgba(196,107,2,.2) 0%,rgba(196,107,2,0) 100%),#1C1E22}
.dark .game_info li.trading {background:linear-gradient(180deg,rgba(217,33,33,.2) 0%,rgba(188,34,34,0) 100%),#1C1E22}

.game_info li.casino {background:linear-gradient(180deg,#6216E9 0%,rgba(98,22,233,0) 86.82%),#FFF}
.game_info li.sports {background:linear-gradient(180deg,#1E813B 0%,rgba(30,130,59,0) 70.99%),#FFF}
.game_info li.racing {background:linear-gradient(180deg,#C66B01 0%,rgba(201,112,28,0) 70.67%),#FFF}
.game_info li.trading {background:linear-gradient(180deg,#C12929 0%,rgba(193,41,41,0) 70%),#FFF}

.game_info li.casino button {background-image:linear-gradient(91deg,#5617cb 0%,#8447f6 96.49%); }
.game_info li.sports button {background-image:linear-gradient(91deg,#1e7d3a 0%,#2cae53 100%); }
.game_info li.racing button {background-image:linear-gradient(91deg,#cc6504 0%,#eb9c53 100%); }
.game_info li.trading button {background-image:linear-gradient(91deg,#438E15 0%,#51E61D 100%); }

.game_info li.casino .blur {background: #6216e9}
.game_info li.sports .blur {background: #079234;}
.game_info li.racing .blur {background: #c46b02}
.game_info li.trading .blur {background: #f42525}

.game_info li .hover_box { position: absolute; left: 0; right: 0; bottom: -60px; z-index: 10; padding: 1.25rem .75rem; -webkit-backdrop-filter: blur(1.5625rem); backdrop-filter: blur(1.5625rem); -webkit-transition: all cubic-bezier(.42,0,.03,1) .7s; transition: all cubic-bezier(.42,0,.03,1) .7s}
.game_info li:hover .hover_box {bottom:0; }


@media all and (max-width:1024px){
    .game_info {grid-template-columns: repeat(2,1fr);}
}

/*
#=========================================#
        스포츠 리스트
#=========================================#
*/
.sports_list {display:flex; gap:10px; }
.sports_list li {flex:none; width:330px; }

/*
#=========================================#
        벳슬립 모달
#=========================================#
*/
.dark .betslip_box {background: rgba(37,39,44,.9);}
.betslip_box {background: rgba(246,247,250,.8);}
.betslip_box .top_box {background: radial-gradient(59.48% 78.95% at 51.89% 0%,rgba(255,212,60,.4) .01%,rgba(255,217,120,0) 100%); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);}
.betslip_box .mid_box .top_line:before {content:''; position:absolute; left:-18px; top:calc(50% - 12px); width:36px; height:24px; background-color:var(--modal-darkbg); border-radius:20px; }
.betslip_box .mid_box .top_line:after {content:''; position:absolute; right:-18px; top:calc(50% - 12px); width:36px; height:24px; background-color:var(--modal-darkbg); border-radius:20px; }

/*
#=========================================#
        설정
#=========================================#
*/
.dark .setting_tab button.active { background:rgba(30,32,36,.4); }
.setting_tab button.active {color:var(--title-color); background:#f5f6fa; font-weight:800; }
.setting_tab button.active > svg {fill:var(--title-color); }

.dark .setting_box_bg {background:url('../custom_img/setting_box_bg_black.png') no-repeat center center / 100% 100%; }
.setting_box_bg {background:url('../custom_img/setting_box_bg.png') no-repeat center center / 100% 100%; }

.avatar_list a {border:3px solid transparent; }
.avatar_list a.active {border-color:var(--primary-color); }



/*
#=========================================#
        jquery UI
#=========================================#
*/
.slide_type01.ui-widget.ui-widget-content {height:1px; border:0 none; background-color: var(--text-color); }
.slide_type01.ui-slider-horizontal .ui-slider-handle {top:-0.5em; width:2em; height:1em; border:0 none; background-color: var(--text-color); }

/*
#=========================================#
        빙고
#=========================================#
*/
.dark .bingo_list .bottom_box {background:linear-gradient(0deg,#1E2024 69.86%,rgba(30,32,36,.36) 100%); }
.bingo_list .bottom_box {min-height:5rem; padding:10px 0 14px; background:linear-gradient(0deg,#fff 69.86%,rgba(255,255,255,.66) 100%); }
.bingo_list li:hover .hover_box {opacity:1; }

/*
#=========================================#
        spin 모달
#=========================================#
*/
.spin_wrap {position:relative; width: 21.75rem; max-width:90%; }
.spin_wrap > div {position:absolute; left:0; top:0; width:100%; opacity:0; z-index:-100;}
.spin_wrap > div.active {opacity:1; z-index:10; }
.spin_wrap > div.spin_bronze {position:relative; }

.spin_wrap > div .zoom_box {transform: scale(0) rotate(-60deg); transition:all 2.6s cubic-bezier(0.22, 0.61, 0.36, 1); }
.spin_wrap > div.active .zoom_box {transform: scale(1) rotate(0);}
.spin_wrap > div.active .zoom_box.rolling {transform: scale(1) rotate(1440deg);}


.spin_wrap > div .spin_logo {transform: scale(0); transition:all 2.6s cubic-bezier(0.22, 0.61, 0.36, 1); }
.spin_wrap > div.active .spin_logo {transform: scale(1);}

.spin_box { background-image: linear-gradient(8deg,#31343c -16%,#1e2025 -5%,#1e2025 6%,#1d2024 40%,#1e2025 74%,#1e2025 113%);}
.spin_box .spin_btn button {background-color: rgb(25, 26, 27);}
.spin_box .spin_btn button.lucky_btn.active {background-color:rgb(101, 49, 32); }
.spin_box .spin_btn button.super_btn.active {background-color:rgb(235, 145, 6); }
.spin_box .spin_btn button.mega_btn.active {background-color:rgb(105, 14, 224); }
.spin_box .spin_btn button img {width:85%; margin:0 auto; }
.spin_box .spin_btn button.active img {display:none; }
.spin_box .spin_btn button.active img.active {display:block; }
.spin_box .spin_btn img.active {display:none; }
.spin_box .tag-img {width: 8.75rem; height: 1.875rem; margin: 0 auto; position: relative; text-align: center; line-height: 1.625rem; background: url('../custom_img/spin/tag.webp') no-repeat; background-size: 100% 100%; font-weight: 800; font-size: 1rem;}

.spin_box .spin_area {width: 100%; }
.spin_box .spin_area .spin-light.active {transform: rotate(22.5deg);}
.spin_box .spin_area .btn-txt {animation:btnzoom 2s infinite linear; }
.spin_box .spin_area .spin-item {position:absolute; left:50%; top:50%; width:5.5rem; transform-origin:-3.8124rem center; margin-top:-0.75rem; margin-left:3.875rem;}

@keyframes btnzoom {
    0% {transform: translate(-50%,-50%) rotate(-5deg) scaleZ(1);}
    50% {transform: translate(-50%,-50%) rotate(0) scale3d(1.1,1.1,1.1);}
    100% {transform: translate(-50%,-50%) rotate(-5deg) scaleZ(1);}
}


/*
#=========================================#
        보너스
#=========================================#
*/
/* 보너스 - 로그아웃시 */
.dark .bonus_visual .container {background:url('../custom_img/bonus/bg.png') no-repeat center center / auto 100%; }
.bonus_visual .container {background:url('../custom_img/bonus/bg_w.webp') no-repeat center center / auto 100%; }

.bonus_free_box div span {background:rgba(216,216,216,.3);  }
.dark .bonus_free_box div span {background:rgba(255,255,255,.1); }

.bonus_free_box .img_box {position: absolute; width: 80%; min-width: 17.5rem; height: 100%; top: 0; right: 0;  transform: translate(48%); display:flex; align-items: center;}
.bonus_free_box .img_box img {width:auto; height:55%; margin-left:5%; transform:translateY(-10%); }

.bonus_free_box .quest {background:linear-gradient(219.02deg,#FFFFFF 13.3%,#DECEFF 104.04%); }
.dark .bonus_free_box .quest {background:linear-gradient(214.28deg,#24262B 12.04%,#321869 86.72%); }
.bonus_free_box .quest span {color:#b28dff;}
.bonus_free_box .quest .img_box {background:radial-gradient(50% 50% at 50% 50%,rgba(118,54,255,.4) 0%,rgba(118,54,255,0) 100%); }
.dark .bonus_free_box .quest .img_box {background:radial-gradient(50% 50% at 50% 50%,#7636FF 0%,rgba(118,54,255,0) 100%)}

.bonus_free_box .spin {background:linear-gradient(216.13deg,#FFFFFF 12.54%,#E9CCFF 98.68%); }
.dark .bonus_free_box .spin {background:linear-gradient(214.28deg,#24262B 12.04%,#461869 86.72%); }
.bonus_free_box .spin span {color:#d763ff;}
.bonus_free_box .spin .img_box {background:radial-gradient(50% 50% at 50% 50%,rgba(203,54,255,.4) 0%,rgba(203,54,255,0) 100%); }
.dark .bonus_free_box .spin .img_box {background:radial-gradient(50% 50% at 50% 50%,#CB36FF 0%,rgba(203,54,255,0) 100%)}

.bonus_free_box .roll {background:linear-gradient(218.18deg,#FFFFFF 13.08%,#FEEDD3 103.62%); }
.dark .bonus_free_box .roll {background:linear-gradient(214.28deg,#24262B 12.04%,#563A0B 86.72%); }
.bonus_free_box .roll span {color:#f0aa32;}
.bonus_free_box .roll .img_box {background:radial-gradient(50% 50% at 50% 50%,rgba(236,156,36,.4) 0%,rgba(236,156,36,0) 100%); }
.dark .bonus_free_box .roll .img_box {background:radial-gradient(50% 50% at 50% 50%,#B8730C 0%,rgba(184,115,12,0) 100%)}

.dark .bonus_cashback {background:linear-gradient(180deg,#24262B 0%,#1D1E23 100%); }
.bonus_cashback {background:linear-gradient(180deg,#F6F7FA 0%,#FFFFFF 100%); }

.dark .bonus_cashback .cashback_box {background:linear-gradient(180deg,rgba(36,38,43,.32) 0%,rgba(64,66,84,.32) 100%); }
.bonus_cashback .cashback_box {background:linear-gradient(180deg,rgba(249,249,249,.7) 0%,rgba(223,228,244,.7) 100%); backdrop-filter:blur(8px);}

.bonus_cashback .cashback_box .cashback_bg_1 {background:radial-gradient(50% 50% at 50% 50%,#7F21F8 0%,rgba(127,33,248,0) 100%); filter:blur(2.5px); }
.bonus_cashback .cashback_box .cashback_bg_2 {background:radial-gradient(50% 50% at 50% 50%,rgba(13,143,65,.7) 0%,rgba(13,143,65,0) 100%); filter:blur(2.5px); }
.bonus_cashback .cashback_box .cashback_bg_3 {background:radial-gradient(50% 50% at 50% 50%,rgba(214,22,218,.6) 0%,rgba(214,22,218,0) 100%); filter:blur(2.5px); }

.bonus_benefit .bg_1:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:radial-gradient(50% 50% at 50% 50%,rgba(255,54,175,.7) 0%,rgba(255,54,175,0) 100%); filter:blur(12.5px); }
.bonus_benefit .bg_2:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:radial-gradient(50% 50% at 50% 50%,rgba(21,210,62,.6) 0%,rgba(21,210,62,0) 100%); filter:blur(12.5px); }
.bonus_benefit .bg_3:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:radial-gradient(50% 50% at 50% 50%,rgba(54,62,255,.9) 0%,rgba(54,62,255,0) 100%); filter:blur(12.5px); }

.bonus_bottom:before {content:''; position:absolute; left:50%; top:0; width:400px; height:340px; transform:translate3d(-50%,-60%,0); background-color:#6149ea; opacity:0.34; filter:blur(75px); }

@media all and (max-width:767px){
    .dark .bonus_visual .container {background:url('../custom_img/bonus/bg_m.png') no-repeat center center / 100% auto; }
    .bonus_visual .container {background:url('../custom_img/bonus/bg_w_m.webp') no-repeat center center / 100% auto; }
}

/* 보너스 - 로그인시 */
.vip_bonus .bg_box:before {content:''; position:absolute; left:-50%; top:0; width:250px; height:200px; }

.dark .vip_bonus .bg_1:before {background:radial-gradient(50% 50% at 50% 50%,rgba(255,89,188,.8) 0%,rgba(248,60,172,0) 100%);  }
.vip_bonus .bg_1:before {background:radial-gradient(50% 50% at 50% 50%,rgba(255,89,188,.8) 0%,rgba(248,60,172,0) 100%); }

.dark .vip_bonus .bg_2:before {background:radial-gradient(50% 50% at 50% 50%,rgba(9,148,123,.5) 0%,rgba(9,148,123,0) 100%);  }
.vip_bonus .bg_2:before {background:radial-gradient(50% 50% at 50% 50%,rgba(14,208,173,.3) 0%,rgba(14,208,173,0) 100%); }

.dark .vip_bonus .bg_3:before {background:radial-gradient(50% 50% at 50% 50%,rgba(82,54,255,.7) 0%,rgba(82,54,255,0) 100%);  }
.vip_bonus .bg_3:before {background:radial-gradient(50% 50% at 50% 50%,rgba(82,54,255,.3) 0%,rgba(82,54,255,0) 100%); }

.dark .vip_bonus .bg_4:before {background:radial-gradient(50% 50% at 50% 50%,rgba(255,54,151,.7) 0%,rgba(255,54,151,0) 100%);  }
.vip_bonus .bg_4:before {background:radial-gradient(50% 50% at 50% 50%,rgba(255,54,151,.3) 0%,rgba(255,54,151,0) 100%); }

.dark .vip_bonus .bg_5:before {background:radial-gradient(50% 50% at 50% 50%,rgba(13,147,10,.7) 0%,rgba(13,147,10,0) 100%);  }
.vip_bonus .bg_5:before {background:radial-gradient(50% 50% at 50% 50%,rgba(13,147,10,.3) 0%,rgba(13,147,10,0) 100%); }

.dark .vip_bonus .bg_6:before {background:radial-gradient(50% 50% at 50% 50%,rgba(118,54,255,.7) 0%,rgba(118,54,255,0) 100%);  }
.vip_bonus .bg_6:before {background:radial-gradient(50% 50% at 50% 50%,rgba(118,54,255,.3) 0%,rgba(118,54,255,0) 100%); }

.dark .vip_bonus .bg_7:before {background:radial-gradient(50% 50% at 50% 50%,rgba(208,73,255,.7) 0%,rgba(197,31,255,0) 100%);  }
.vip_bonus .bg_7:before {background:radial-gradient(50% 50% at 50% 50%,rgba(208,73,255,.3) 0%,rgba(197,31,255,0) 100%); }

.dark .vip_bonus .bg_8:before {background:radial-gradient(50% 50% at 50% 50%,rgba(203,127,13,.7) 0%,rgba(203,127,13,0) 100%);  }
.vip_bonus .bg_8:before {background:radial-gradient(50% 50% at 50% 50%,rgba(203,127,13,.3) 0%,rgba(203,127,13,0) 100%); }



@media all and (max-width:1279px){
    .vip_bonus .bg_box:before {left:-40%}
}


/* 롤 모달 */
.roll-modal .scroll_box {height:80px; transition:all 2s; }
.roll-modal .scroll_box.type02 {transition:all 2.7s; }
.roll-modal .scroll_box.type03 {transition:all 2.3s; }
.roll-modal .num_box span {display:block; height:80px; font-size:46px; line-height:86px; color:#000; }

/* bcd 모달 */
.dark .bcd-modal .bcd_bg {background:linear-gradient(180deg,rgba(27,162,122,.6) 0%,rgba(27,162,122,0) 100%),#1C1E22; }
.bcd-modal .bcd_bg {background:linear-gradient(180deg,rgba(27,162,122,.6) 0%,rgba(27,162,122,0) 100%),#FFFFFF; }
.bcd-modal .bcd_bg > * {position:relative; z-index:10; }
.bcd-modal .bcd_bg:before {content:''; z-index:1; position:absolute; left:0; top:0; width:100%; height:100%; background:url('../custom_img/bonus/bonus_bg.png') no-repeat center center / 100% auto; }

/* 프로모션 리스트 */
.dark .promotion_box {background-image: radial-gradient(circle at 92% -19%,#b34622,#b53e16 17%,#c44921 200%)}
.promotion_box {background-image: radial-gradient(circle at 92% -19%,#b34622,#d25c35 17%,#d05228 54%)}
.promotion_box .left:after {content: ""; position: absolute; top: 0; right: -6.25rem; bottom: 0; width: 18.25rem; background-image: radial-gradient(circle at 50% 50%,#ffa182,rgba(213,78,66,0) 69%); -webkit-filter: blur(50px); filter: blur(50px); opacity: .63;}
.promotion_box .left > * {position:relative; }
.promotion_box .right .item:nth-of-type(1) {z-index:4; }
.promotion_box .right .item:nth-of-type(2) {z-index:3; }
.promotion_box .right .item:nth-of-type(3) {z-index:2; }
.promotion_box .right .item:nth-of-type(4) {z-index:1; }
.promotion_box .right .item:nth-of-type(1) .img_box {background:url('../custom_img/bc/bg1.svg') no-repeat center bottom / 100% auto; }
.promotion_box .right .item:nth-of-type(2) .img_box {background:url('../custom_img/bc/bg2.svg') no-repeat center bottom / 100% auto; }
.promotion_box .right .item:nth-of-type(3) .img_box {background:url('../custom_img/bc/bg3.svg') no-repeat center bottom / 100% auto; }
.promotion_box .right .item:nth-of-type(4) .img_box {background:url('../custom_img/bc/bg4.svg') no-repeat center bottom / 100% auto; }

@media all and (max-width:1024px){
    .promotion_box .right .item .img_box {background-size:100% 100% !important; }
}

.promotion_box .right .item button {transform:scale(0); transition:all 0.5s; }
.promotion_box .right .item.active button,
.promotion_box .right .item:hover button {transform:scale(1); }

.promotion_box .right .item .img_box {transform:translateY(40px); transition:all 0.5s; }
.promotion_box .right .item.active .img_box,
.promotion_box .right .item:hover .img_box {transform:translateY(0); }

.promotion_box .right .item:nth-of-type(1) .mask:after {background-image:url('../custom_img/bc/mask1.png');}
.promotion_box .right .item:nth-of-type(2) .mask:after {background-image:url('../custom_img/bc/mask2.png');}
.promotion_box .right .item:nth-of-type(3) .mask:after {background-image:url('../custom_img/bc/mask3.png');}
.promotion_box .right .item:nth-of-type(4) .mask:after {background-image:url('../custom_img/bc/mask4.png');}
.promotion_box .right .item .mask {position:absolute; left:0; top:0; width:100%; height:80%; overflow:hidden; z-index:0;}
.promotion_box .right .item .mask:after {content: ""; position: absolute; top: 0; left: 0; width: 100%; padding-top: 100%; -webkit-transform: scale(2.2) translateY(18%); -ms-transform: scale(2.2) translateY(18%); transform: scale(2.2) translateY(18%);  background-repeat: no-repeat; background-position: center; background-size: cover; }
.promotion_box .right .item.active .mask:after,
.promotion_box .right .item:hover .mask:after {animation:circleround 5s linear infinite; }

.promotion_box .right .item .arrow {position:absolute; top:40%; right:-28px; width:38px; height:38px; border-radius:4px; background:#222329; z-index:30;}
.promotion_box .right .item .arrow svg {fill:#9e9e9e; transform:scale(0.6)}
.promotion_box .right .item.active .arrow svg,
.promotion_box .right .item:hover .arrow svg {fill:#ffd444;}

.promotion_box .right .item .effect_01,
.promotion_box .right .item .effect_02 {position:absolute; width:40px; opacity:0; animation:bounce 1s alternate linear infinite}
.promotion_box .right .item .effect_01 {z-index:10; right:3px; top:5px; }
.promotion_box .right .item .effect_02 {z-index:21; left:5px; bottom:8px; }

@keyframes bounce {
    0% {transform: translateY(-5px);}
    50% {transform: translateY(0px)}
    100% {transform: translateY(5px)}
}

@keyframes circleround {
    0% {transform: scale(2.2) translateY(18%) rotate(0);}
    100% {transform: scale(2.2) translateY(18%) rotate(360deg)}
}

.promotion_box .right .item:hover .effect_01,
.promotion_box .right .item:hover .effect_02,
.promotion_box .right .item.active .effect_01,
.promotion_box .right .item.active .effect_02 {opacity:1;}

.dark .promotion_speed {background: linear-gradient(to right,#dd5327,rgba(206,85,60,0) 83%);}
.promotion_speed {padding-left:1em; margin-left:-1em; background: linear-gradient(to right,#f46738,rgba(255,103,64,0) 83%);}

.dark .promotion_item:hover {background-color: #0F1013;}
.promotion_item:hover {background-color: #D7D9E0;}


@media all and (max-width:767px){
    .promotion_box .right .item .img_box {transform:translateY(20px);}
    .promotion_box .right .item .effect_01,
    .promotion_box .right .item .effect_02 {width:20px; }
    .promotion_box .right .item .arrow {right:-23px; transform:scale(0.6) }
}

/* 주간추첨 */
.dark .raffle_visual {background:url('../custom_img/bc/bg.webp') no-repeat center center / cover; }
.raffle_visual {background:url('../custom_img/bc/bg_w.png') no-repeat center center / cover; }
.raffle_visual .inner_box h3 {color:#fff; text-shadow:0px 2px #f19527; }
.raffle_visual .inner_box p {color:#ffe236; text-shadow:4px 1px #f38c00; }


@media all and (max-width:767px){
    .dark .raffle_visual {background:url('../custom_img/bc/bg_m.png') no-repeat center center / cover; }
    .raffle_visual {background:url('../custom_img/bc/bg_w_m.png') no-repeat center center / cover; }
}

.dark .raffle_item_bg {background:linear-gradient(180deg,#24262B 0%,rgba(36,38,43,0) 100%); }
.raffle_item_bg {background:linear-gradient(180deg,#F6F7FA 0%,#FFF 100%); }

.raffle_ticket {width:178px; height:48px; background:url('../custom_img/bc/ticket_win.webp') no-repeat center center / 100% 100%}

@media all and (max-width:767px){
    .raffle_ticket {width:auto; height:auto; padding:5px 2px; }
}


/* 제휴 - 로그아웃시 */
.dark .affiliate_visual {background:url('../custom_img/affiliate/banner_bg.png') no-repeat center center / cover; }
.affiliate_visual {height:360px; background:url('../custom_img/affiliate/banner_bg_w.png') no-repeat center center / cover; }

.dark .affiliate_bg1 {background:url('../custom_img/affiliate/circle.png') no-repeat center center / auto 100%; }
.affiliate_bg1 {background:url('../custom_img/affiliate/circle_w.png') no-repeat center center / auto 100%; }

@media all and (max-width:767px){
    .affiliate_visual {height:auto; background:url('../custom_img/affiliate/bg_m.png') no-repeat center center / cover !important; }
}

/* 제휴 - 로그인시 */
.dark .affiliate_visual2 {background:url('../custom_img/affiliate/invite_bg.png') no-repeat center center / cover; }
.affiliate_visual2 {height:220px; background:url('../custom_img/affiliate/invite_bg_w.png') no-repeat center center / cover; }

@media all and (max-width:767px){
    .dark .affiliate_visual2,
    .affiliate_visual2 {position:relative; height:120px; background:url('../custom_img/affiliate/invite_bg_m.png') no-repeat right center / auto 100%; }
    .affiliate_visual2:after {content:''; position:absolute; left:5%; bottom:0; width:90%; height:1px; margin:0 auto; background:linear-gradient(270deg,rgba(152,167,181,0) 0%,rgba(152,167,181,0) 0%,#98A7B5 47.4%,rgba(152,167,181,0) 100%); }
}

/* 커미션 모달 */
.comission_modal .bg1 {background:var(--background-color) url('../custom_img/affiliate/wager_1.png') no-repeat 96% 0% / auto 100%; }
.comission_modal .bg2 {background:var(--background-color) url('../custom_img/affiliate/wager_2.png') no-repeat 96% 0% / auto 100%; }
.comission_modal .bg3 {background:var(--background-color) url('../custom_img/affiliate/wager_3.png') no-repeat 96% 0% / auto 100%; }

.dark .referral_rule_modal .bg1 {background:url('../custom_img/affiliate/rule_left.png') no-repeat right center / auto 100%; }
.referral_rule_modal .bg1 {background:url('../custom_img/affiliate/rule_left_w.png') no-repeat right center / auto 100%; }
.dark .referral_rule_modal .bg2 {background:url('../custom_img/affiliate/rule_center.png') no-repeat right center / auto 100%; }
.referral_rule_modal .bg2 {background:url('../custom_img/affiliate/rule_center_w.png') no-repeat right center / auto 100%; }
.dark .referral_rule_modal .bg3 {background:url('../custom_img/affiliate/rule_right.png') no-repeat right center / auto 100%; }
.referral_rule_modal .bg3 {background:url('../custom_img/affiliate/rule_right_w.png') no-repeat right center / auto 100%; }

@media all and (max-width:767px){
    .referral_rule_modal .bg1 {background:var(--background-color) url('../custom_img/affiliate/rule_left_m.png') no-repeat right top / auto 80% !important; }
    .referral_rule_modal .bg2 {background:var(--background-color) url('../custom_img/affiliate/rule_center_m.png') no-repeat right top / auto 80% !important; }
    .referral_rule_modal .bg3 {background:var(--background-color) url('../custom_img/affiliate/rule_right_m.png') no-repeat right top / auto 80% !important; }
}


/* 로딩아이콘 */
.loading_icon {width:23px; height:23px; padding:3px; }
.loading_icon svg {width:100%; height:100%; transform: rotate(270deg) scaleX(-1); }
.loading_icon circle {stroke:var(--primary-color); stroke-dasharray: 1px, 1px; transition-delay: 1s;}
.loading_icon.on circle { stroke-dasharray: 0px, 1px; transition:stroke-dasharray 3s linear; }


/*
#=========================================#
        지갑
#=========================================#
*/
.wallet_cont .wallet_mo_top {z-index:101; position:fixed; left:0; top:0; display:none; width:100%; height:53px; }
.wallet_cont .wallet_mo_bottom {z-index:101; position:fixed; left:0; bottom:0; display:none; width:100%; height:75px; }
.mo_wallet_menu button.on {color:var(--title-color);}
.mo_wallet_menu button.on svg {fill:var(--title-color);}

@media all and (max-width:767px){
    .wallet_cont {z-index:100; overflow-y:auto; position:fixed; left:0; top:0; width:100%; height:100vh; padding:53px 0 75px; background-color:var(--tab-bg); }
    .wallet_cont.type02 .wallet_mo_bottom {display:none; }
    .wallet_cont footer {display:none; }

    .wallet_cont .wallet_mo_top {display:flex;}
    .wallet_cont .wallet_mo_bottom {display:flex;}

    .wallet_cont.type02 .container {padding-left:0; padding-right:0;}
    .wallet_pagination {position:fixed; left:0; bottom:0; width:100%;}
}

/*
#=========================================#
        카지노 디테일
#=========================================#
*/
.bookmark_btn.on {color:var(--yellow-color); }
.bookmark_btn.on svg {fill:var(--yellow-color); }
.zzim_btn.on {color:#ec4016; }
.zzim_btn.on svg {fill:#ec4016; }
.good_btn.on {color:var(--primary-color)}
.good_btn.on svg {fill:var(--primary-color)}

.comment_align:hover .hover_box {display:block; }


/*
#=========================================#
        레이싱
#=========================================#
*/
.racing_wrap {width:100%; height:calc(100vh - 64px); color:var(--text2-color); }

.racing_left {width:295px; }
.racing_center {width:calc(100vw - 595px); }
.racing_right {width:300px; }

.racing_mo_menu {z-index:50; display:none; position:fixed; left:0; bottom:0; width:100%; height:58px; border-top:1px solid var(--primary-color); background:var(--btn-dark); }
.racing_mo_menu.racing_type {z-index:49; bottom:56px; }

@media all and (max-width:1024px){
    .racing_wrap {height:auto; }
    .racing_center {width:100%; }
    .racing_left ,
    .racing_right {z-index:51; position:fixed; left:100%; top:50px; width:100%; height:calc(100% - 50px); background-color: var(--background-color); transition:left 0.5s;  }
    .racing_left.on,
    .racing_right.on {left:0;}
    .racing_mo_menu {display:flex; color:var(--text2-color); }
}

.new_race .top_tag {width:50px; height:50px; border-left:25px solid transparent; border-bottom:25px solid transparent; border-top:25px solid var(--standard-color); border-right:25px solid var(--standard-color); }


.racing_tab_scroll {overflow-x:auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; --webkit-overscroll-behavior-y: auto; overscroll-behavior-y: auto; }
.racing_tab {background-color: var(--standard-color);}
.racing_tab button {border-right:1px solid var(--btn-dark); background-color: var(--standard-color);}
.racing_tab button div {border-radius:10px; background-color:var(--btn-dark); }
.dark .racing_tab button.active {background-color:#2e3035; }
.racing_tab button.active {font-weight:normal; background-color:var(--btn-dark); }
.racing_tab button.active div {border:2px solid var(--primary-color); }
.racing_tab button.active span {color:var(--primary-color); }

.racing_btn {width:70px;}
.racing_btn span.time {transition:all 0.5s; }
.racing_btn span.dis {opacity:0; position:absolute; left:0%; top:100%; width:100%; text-align:center; transition:all 0.5s; font-size:10px; }
.racing_btn:hover span.dis {opacity:1; top:0; }
.racing_btn:hover span.time {opacity:0; }
.racing_btn.complete {color:var(--primary-color); background-color:var(--standard-color); }

.batting_btn.active {background-color:var(--primary-color); }

.racing_align_arrow {position:relative; width:24px; display:flex; flex-direction: column-reverse; gap:4px; }
.racing_up_arrow:after {content:''; width:8px; height:4px; border-bottom:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; transform:rotate(0deg);}
.racing_down_arrow:after {content:''; width:8px; height:4px; border-bottom:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; transform:rotate(180deg);}
.racing_align_arrow.on:after {transform:rotate(0deg);}

.racing_del_btn.on {background-color: var(--primary-color);}

tr.non-runner {pointer-events:none; opacity:.5; }


/*
#=========================================#
        복권
#=========================================#
*/
.lottery_wrap {padding-left:260px; }

.lottery_left {position:fixed; left:0; top:0; width:260px; height:100vh; padding-top:64px; }
.lottery_left .lottery_top {position:sticky; top:0; left:0; }
.lottery_top .lottery_top_btn button:not(.bet) svg {fill:var(--title-color); }
.lottery_top .lottery_top_btn button.bet svg ,
.lottery_top .lottery_top_btn button.bet svg path {stroke:var(--title-color); }
.lottery_top .lottery_top_btn button.on {color:var(--title-color); }
.lottery_top .lottery_top_btn button:not(.bet).on svg {fill:var(--primary-color); }
.lottery_top .lottery_top_btn button.bet.on svg ,
.lottery_top .lottery_top_btn button.bet.on svg path {stroke:var(--primary-color);}

.lottery_like_btn img:last-of-type {display:none; }
.lottery_like_btn.on img:first-of-type {display:none; }
.lottery_like_btn.on img:last-of-type {display:block; }

.jackpot-num span {display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; line-height:24px; color:#000; font-size:12px; font-weight:bold; background:url('../custom_img/lottery/ball-white.svg') no-repeat center center; border-radius:50%; }
.jackpot-num span.bonus {background:radial-gradient(64.89% 64.89% at 42.44% 32.79%,#a5ec41 0%,#4ea61e 75.65%,#81c918 100%)}

.dark .lottery_cont2 .bg1 {background:radial-gradient(201.56% 75.83% at 100% 12.03%,rgba(3,105,122,.1) 0%,rgba(1,47,135,.1) 62.78%,rgba(1,47,135,0) 100%),linear-gradient(270deg,rgba(71,76,85,.6) 0%,rgba(45,48,53,.42) 47.5%) }
.lottery_cont2 .bg1 {background:radial-gradient(201.56% 75.83% at 100% 12.03%,rgba(220,225,234,.1) 0%,rgba(211,217,228,.1) 62.78%,rgba(103,110,122,0) 100%),linear-gradient(270deg,rgba(225,232,241,.6) 0%,rgba(209,218,233,.42) 47.5%) }

.dark .lottery_cont2 .bg2 {background:radial-gradient(330.62% 123.98% at 100% 12.03%,rgba(143,255,0,.1) 0%,rgba(7,184,46,.1) 62.78%,rgba(60,135,1,0) 100%),linear-gradient(270deg,rgba(71,76,85,.6) 0%,rgba(45,48,53,.42) 47.5%) }
.lottery_cont2 .bg2 {background:radial-gradient(330.62% 123.98% at 100% 12.03%,rgba(143,255,0,.1) 0%,rgba(7,184,46,.1) 62.78%,rgba(60,135,1,0) 100%),linear-gradient(270deg,rgba(192,202,220,.6) 0%,rgba(195,207,226,.42) 47.5%) }

.dark .soon_slide_box li:nth-of-type(3n+1) {background:linear-gradient(180deg,rgba(48,223,33,.7) 0%,rgba(0,0,0,0) 135.65%)}
.soon_slide_box li:nth-of-type(3n+1) {background:linear-gradient(180deg,rgba(48,223,33,.7) 0%,rgba(245,246,250,0) 135.65%)}
.dark .soon_slide_box li:nth-of-type(3n+2) {background:linear-gradient(180deg,rgba(121,38,255,.7) 0%,rgba(0,0,0,0) 135.65%)}
.soon_slide_box li:nth-of-type(3n+2) {background:linear-gradient(180deg,rgba(121,38,255,.7) 0%,rgba(245,246,250,0) 135.65%)}
.dark .soon_slide_box li:nth-of-type(3n+3) {background:linear-gradient(180deg,rgba(0,121,255,.7) 0%,rgba(0,0,0,0) 135.65%)}
.soon_slide_box li:nth-of-type(3n+3) {background:linear-gradient(180deg,rgba(0,121,255,.7) 0%,rgba(245,246,250,0) 135.65%)}
.soon_slide_box li.grayscale {filter:grayscale(100%); background:var(--background-type-color) !important; }

#betSlip_btn {z-index:100; position:fixed; right:15px; bottom:30%; display:none; width:50px; height:50px; background-color:var(--primary-color); border-radius:50%; }
.batting_slip {z-index:40; position:fixed; left:55%; bottom:-480px; transition:all 0.5s; }
.batting_slip.on {bottom:0;}
.batting_slip.on .top_box svg {transform:rotate(90deg); }
.batting_slip .cont {height:480px; }

@media all and (max-width:767px){
    #betSlip_btn {display:block; }
    .lottery_wrap {padding-left:0;}
    .lottery_left {display:none;}
    .batting_slip {left:100%; bottom:56px; width:100%; height:calc(100% - 162px); }
    .batting_slip.on {left:0; bottom:56px; }
    .batting_slip .cont {height:calc(100% - 56px); }

    .lottery_left {z-index:40; top:154px; width:100%; height:calc(100vh - 210px); padding-top:0; }
    .lottery_left.on {display:block; }
    .lottery_left .lottery_top {position:relative; }
}

.popular_slide_box {height: 414px;}
.popular_slide_box .swiper-slide {height: calc((100% - 10px)/2);}

.lottery_detail_visual .img_box {position:relative; }
.lottery_detail_visual .img_box:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(180deg,rgba(24,255,19,.5) 27.86%,rgba(15,253,82,.393229) 40.69%,rgba(5,248,0,0) 87.94%); filter:blur(67px); transform:rotate(-5.56deg); }

.lottery_bet_btn {display:flex; flex-direction:column;  height:52px; padding:8px; background:var(--background-light); border-radius:5px; text-align:left; font-weight:600; }
.lottery_bet_btn.active {background-color:var(--primary-color); color:#fff; }

.lottery_cir_btn {display:flex; align-items:center; justify-content:center; width:40px; height:40px; background:var(--background-light); border-radius:50%; font-weight:bold; }
.lottery_cir_btn span {width:25px; height:25px; border-radius:50%; }
.lottery_cir_btn.active {color:#000; background:radial-gradient(61.22% 65.88% at 50% 29.5%,#f6fffd 0%,#beddd3 72.51%,#98c3b9 100%); }
.lottery_cir_btn.active span {background:linear-gradient(150.12deg,#ffffff 11.33%,#c4c4c4 91.69%)}
.lottery_cir_btn.bonus.active {color:#000; background:radial-gradient(64.89% 64.89% at 42.44% 32.79%,#a5ec41 0%,#4ea61e 75.65%,#81c918 100%)}
.lottery_cir_btn.bonus.active span {background:radial-gradient(70% 70% at 50% 37.48%,#88fd30 0%,rgba(220,236,164,.0001) 100%); }
.lottery_cir_btn:disabled {width:32px; height:32px; opacity:1 !important; }
.lottery_cir_btn:disabled span {width:20px; height:20px; }

@media all and (max-width:767px){
    .lottery_detail_visual .img_box {position:absolute; right:-5%; top:50%; width:50%; transform:translateY(-10%); }
    .lottery_right_bet {z-index:10; position:fixed; left:0; bottom:56px; width:100%; max-height:calc(100% - 162px); overflow-y:auto; }
}

.dark .lottery_mybet_info {background:linear-gradient(180deg,rgba(36,38,43,.32) 0%,rgba(64,66,84,.32) 100%)}
.lottery_mybet_info {background:linear-gradient(180deg,rgba(207,216,237,.32) 0%,rgba(238,239,248,.32) 100%)}

@media all and (max-width:767px){
    .dark .lottery_mybet_info,
    .lottery_mybet_info {background:transparent; }
    .dark .lottery_mybet_info > div {background:linear-gradient(180deg,rgba(36,38,43,.32) 0%,rgba(64,66,84,.32) 100%)}
    .lottery_mybet_info > div {background:linear-gradient(180deg,rgba(207,216,237,.32) 0%,rgba(238,239,248,.32) 100%)}
}

.dark .lottery_ticket_box {background:url('../custom_img/lottery/ball_bg.webp') no-repeat center center / 100% 100%; }
.lottery_ticket_box {width:235px; height:43px; background:url('../custom_img/lottery/ball_bg_white.png') no-repeat center center / 100% 100%; }
.lottery_ticket_box span {width:28px; height:28px; line-height:28px; text-align:center; color:#000; font-weight:800; background:url('../custom_img/lottery/ball.png') no-repeat center center / 100% 100%; opacity:0.4; }
.lottery_ticket_box span.active {opacity:1; }
.lottery_ticket_box span.jackpot {margin-left:10px; background:url('../custom_img/lottery/jackpot_ball.webp') no-repeat center center / 100% 100%;}

@media all and (max-width:767px){
    .lottery_ticket_box {zoom:0.6}
}

.dark .lottery_ticket {background:url('../custom_img/lottery/ticket_bg.png') no-repeat center center / 100% 100%; }
.lottery_ticket {background:url('../custom_img/lottery/ticket_bg_w.png') no-repeat center center / 100% 100%; }

.lottery_ticket .left {flex:14; }
.lottery_ticket .right {flex:11; }

.lottery_ticket .big_ticket {max-width:500px; padding:10px 0;  background:url('../custom_img/lottery/jackpot_ball_banner.png') no-repeat center center / 100% 100%; }
.lottery_ticket .big_ticket .lucky_num {width:25%; }
.lottery_ticket .big_ticket .lottery_ticket_area:nth-of-type(2) {width:61%;}
.lottery_ticket .big_ticket .lottery_ticket_area:last-of-type {width:14%;}

.lottery_ticket_area span {width:35px; height:35px; line-height:35px; text-align:center; color:#000; font-weight:800; background:url('../custom_img/lottery/ball.png') no-repeat center center / 100% 100%; }
.lottery_ticket_area span.jackpot {background:url('../custom_img/lottery/jackpot_ball.webp') no-repeat center center / 100% 100%;}


@media all and (max-width:767px){
    .dark .lottery_ticket ,
    .lottery_ticket {background:url('../custom_img/lottery/ticket_bg_m2.png') no-repeat center center / 100% 100%;}

    .lottery_ticket .big_ticket {background:url('../custom_img/lottery/ball_bg.png') no-repeat center center / 100% 100%; }
    .lottery_ticket .big_ticket .lucky_num {width:100%; padding:0 0 20px; }
    .lottery_ticket .big_ticket .lottery_ticket_area:nth-of-type(2) {width:80%;}
    .lottery_ticket .big_ticket .lottery_ticket_area:last-of-type {width:20%;}
}

.lottery_ball_box .top {position:relative; border-bottom:2px dashed var(--background-color); }
.lottery_ball_box .top:before {content:''; position:absolute; left:-6px; bottom:-6px; width:12px; height:12px; background:var(--sponsor-visual); border-radius:50%; }
.lottery_ball_box .top:after {content:''; position:absolute; right:-6px; bottom:-6px; width:12px; height:12px; background:var(--sponsor-visual); border-radius:50%; }

.lottery_jackpot_area button,
.lottery_ball_area button {width:40px; height:40px; line-height:40px; background-color:var(--background-light); border-radius:50%; }
.dark .lottery_ball_area button:hover {background-color: rgba(110,120,131,.5) ; color:#fff; }
.lottery_ball_area button:hover {background-color: rgba(110,120,131,.5) ;}
.lottery_ball_area button.active {color:#000 !important; background:url('../custom_img/lottery/ball-white.svg') no-repeat center center / 100% 100%; }

.lottery_jackpot_area button:hover,
.lottery_jackpot_area button.active {color:#000 !important; background:url('../custom_img/lottery/jackpot_ball.webp') no-repeat center center / 100% 100%; }

.lottery_gift {height:310px; background:url('../custom_img/lottery/gift-bg.webp') no-repeat center center / 100% 100%; }

.mo_lottery_ball .lottery_ball_box {width:265px; }

.mo_lottery_banner {height:127px; background:url('../custom_img/lottery/gift-bg-mobile.png') no-repeat center center / 100% 100%; }

@media all and (max-width:767px){
    .lottery_jackpot_area button,
    .lottery_ball_area button {width:30px; height:30px; line-height:30px; }
}

#lottery_play-modal .play_slide li {width:284px; padding:0 30px 15px; }
#lottery_play-modal .play_slide .prev_btn,
#lottery_play-modal .play_slide .next_btn {z-index:10; top:calc(50% - 16px); }
/*
#=========================================#
        스포츠
#=========================================#
*/
.sports_top button svg,
.sports_top a svg {fill:var(--title-color)}
.sports_top button.bet svg ,
.sports_top button.bet svg path {fill:transparent; stroke:var(--title-color); }

.sports_wrap {width:100%; height:calc(100vh - 114px); color:var(--text2-color); }

.sports_left {width:230px; }
.sports_center {width:calc(100vw - 560px); }
.sports_center2 {width:calc(100vw - 330px); }
.sports_right {width:330px; }

@media all and (max-width:1024px){
    .sports_wrap {height:auto; }
    .sports_center {width:100%; }
    .sports_center2 {width:100%; }
    .sports_left ,
    .sports_right {z-index:51; position:fixed; left:100%; top:50px; width:100%; height:calc(100% - 50px); background-color: var(--background-color); transition:left 0.5s;  }
    .sports_left.on,
    .sports_right.on {left:0;}
}


.sports_like_btn img:last-of-type {display:none; }
.sports_like_btn.on img:first-of-type {display:none; }
.sports_like_btn.on img:last-of-type {display:block; }

.pin_btn.on {color:var(--primary-color); }

.sports_bet_box button,
.sports_bet_box a {border:1px solid var(--placeholder-color); }
.sports_bet_box button.on,
.sports_bet_box a.on {border-color:var(--primary-color); color:var(--title-color); }

.sports_more_btn {border:1px solid var(--placeholder-color);}
.sports_more_btn:hover,
.sports_more_btn.on {border-color:var(--primary-color); }
.sports_more_btn.on svg {transform:rotate(180deg); }

.sports_list button {height:80px; display:flex; flex-direction:column; justify-content:space-between; border-bottom:2px solid transparent; }
.sports_list button.on {font-weight:bold; border-bottom:2px solid var(--primary-color);}
.sports_list button .num {font-size:10px; }

@media all and (max-width:767px){
    .sports_list button {border:0 none; }
    .sports_list button div {display:flex; align-items: center;justify-content: center; border:1px solid var(--placeholder-color); border-radius:50%; }
    .sports_list button div svg {width:20px; }
    .sports_list button.on {border:0 none; }
    .sports_list button.on div {border:1px solid var(--primary-color); }
    .sports_list button.on p {color:var(--primary-color);}
}

.bet_box {border-right:4px solid var(--standard-color); }
.dark .bet_btn {border-left:1px solid var(--standard-color); }
.bet_btn {height:78px; border-left:1px solid var(--shadow-color); color:#e7cf90; font-weight:bold; }
.bet_btn:first-of-type {border-left:0 none; }
.dark .bet_btn:hover {background:#9bd98a73; }
.dark .bet_btn.on {background:#3bc11773; }
.bet_btn:hover {background:#c7dbc173; }
.bet_btn.on {background:#1c7604ba; }
.bet_btn span {color:var(--text2-color); font-weight:normal; }
.bet_btn.lock {color:var(--text-color);}
.bet_btn.up {position:relative; color:var(--primary-color); }
.bet_btn.up:before {content:''; position:absolute; right:0; top:0; width:8px; height:8px; border-top:4px solid var(--primary-color); border-right:4px solid var(--primary-color); border-left:4px solid transparent; border-bottom:4px solid transparent; }
.bet_btn.down {position:relative; color:#f26f89; }
.bet_btn.down:before {content:''; position:absolute; right:0; bottom:0; width:8px; height:8px; border-bottom:4px solid #f26f89; border-right:4px solid #f26f89; border-left:4px solid transparent; border-top:4px solid transparent; }

.bet_box.type02 {border-right:0 none;}
.dark .bet_btn.type02 {border-top:1px solid var(--standard-color); }
.bet_btn.type02 {height:auto; font-weight: normal; border-top:1px solid var(--shadow-color); }

.bet_box.type03 {border-right:0 none;}
.dark .bet_btn.type03 {background-color:var(--standard-color);}
.bet_btn.type03 {height:auto; font-weight: normal; background-color:var(--shadow-color); border-radius:5px; border:0 none; }
.dark .bet_btn.type03:hover {background:#9bd98a73;}
.dark .bet_btn.type03.on {background:#3bc11773;}
.bet_btn.type03:hover {background:#c7dbc173;}
.bet_btn.type03.on {background:#1c7604ba;}

.dark .bet_info {border-right:4px solid var(--standard-color); }
.bet_info {height:78px; border-right:4px solid var(--shadow-color); }

.bet_like_btn {border-left:1px solid var(--standard-color);}

.dark .bet_more_btn { border-left:1px solid var(--standard-color); }
.bet_more_btn {position:relative; width:24px; display:flex; flex-direction: column-reverse; gap:4px; align-items:center; justify-content:center; border-left:1px solid var(--shadow-color); }
.bet_more_btn:after {content:''; width:8px; height:4px; border-bottom:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; }
.bet_more_btn:before {content:''; width:8px; height:4px; border-top:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; }

.bet_more_box {z-index:2; width:calc(100% - 24px); max-height:300px; background:var(--background-light);}
.dark .bet_more_box > div {border-bottom:1px solid var(--standard-color); }
.bet_more_box > div {border-bottom:1px solid var(--shadow-color); }
.bet_more_box .bet_btn {background:var(--background-light); }
.dark .bet_more_box .bet_btn:hover {background:#9bd98a73; }
.dark .bet_more_box .bet_btn.on {background:#3bc11773; }
.bet_more_box .bet_btn:hover {background:#c7dbc173; }
.bet_more_box .bet_btn.on {background:#1c7604ba; }

.dark .bet_case01_top > div {border-left:4px solid var(--standard-color); }
.bet_case01_top > div {border-left:4px solid var(--shadow-color); }


.mo_sports_list .mo_sports_title .arrow {transform:rotate(90deg); }
.mo_sports_list .mo_sports_cont {display:none; }
.mo_sports_list.on .mo_sports_title .arrow {transform:rotate(-90deg); }
.mo_sports_list.on .mo_sports_cont {display:block; }


.sports_score {display:flex; align-items:center; justify-content:center; max-width:617px; width:100%; }
.sports_score > div {height:50px; }
.sports_score > div:first-of-type {margin-right:-10px; }
.sports_score > div:last-of-type {margin-left:-10px; }
.sports_score .center {display:flex; align-items:center; justify-content:center; width:70px; height:70px; }
.sports_score .first-i {width:25px; height:50px; border-right:25px solid var(--background-light); border-bottom:50px solid transparent; }
.sports_score .last-i {width:25px; height:50px; border-left:25px solid var(--background-light); border-bottom:50px solid transparent; }

@media all and (max-width:767px){
    .sports_score > div {height:auto; background-color: transparent;}
    .sports_score .center {width:50px; height:50px; }
    .sports_score .first-i ,
    .sports_score .last-i {display:none; }
}

.bet_all_arrow {position:relative; width:24px; display:flex; flex-direction: column-reverse; gap:4px; align-items:center; justify-content:center; border-left:1px solid var(--standard-color); }
.bet_all_arrow:after {content:''; width:8px; height:4px; border-bottom:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; transform:rotate(180deg);}
.bet_all_arrow:before {content:''; width:8px; height:4px; border-top:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; transform:rotate(180deg);}
.bet_all_arrow.on:after,
.bet_all_arrow.on:before {transform:rotate(0deg);}

.bet_arrow {position:relative; width:24px; display:flex; flex-direction: column-reverse; gap:4px; align-items:center; justify-content:center; border-left:1px solid var(--standard-color); }
.bet_arrow:after {content:''; width:8px; height:4px; border-bottom:4px solid var(--text2-color); border-left:4px solid transparent; border-right:4px solid transparent; transform:rotate(180deg);}
.bet_arrow.on:after {transform:rotate(0deg);}


.sports_result_wrap {display:flex; height:calc(100vh - 190px); }
.sports_result_wrap .sports_depth1 {min-width:218px;}
.sports_result_wrap .sports_depth2 {min-width:228px;}
.sports_result_wrap .sports_depth3 {min-width:330px;}
.sports_result_wrap .result_content {width:calc(100% - 776px); min-width:440px; }

.sports_btn.on {color:var(--title-color); background-color: var(--btn-dark);}
.sports_btn.on > svg {transform:rotate(0)}
.sports_result_wrap .sports_depth1 .depth button.on,
.sports_result_wrap .sports_depth2 .depth2 button.on {color:var(--title-color); background-color: var(--btn-dark);}
.sports_result_wrap .sports_depth2 .depth2 button.on svg {opacity:1; }
.sports_result_wrap .sports_depth3 .depth3 button.on {background-color: var(--btn-dark);}


.spin-rolling-modal.modal-dialog {width:380px; max-width:90%;margin:4rem auto 4rem !important; }
.spin-rolling-modal .spin_img {left:-20%; top:-20%; max-width:140%; }
.spin-rolling-modal .coin_img {left:-6%; top:-18%; max-width:113%; }
.spin-rolling2-modal .ribbon_img {left:0; top:0; width:100%; }
.spin-rolling2-modal .spin_img {opacity:0.5; left:calc(50% - 100px); top:calc(34% - 100px); max-width:50%; }
.spin_prize {background-image:radial-gradient(rgba(242,187,47,.2),#191A1B 80%); background-size:100% 100%; background-position:center -8.125rem; background-repeat:no-repeat; background-color:#191a1b; }
.spin_prize .tit {color:#fff; }
.spin_prize .cont {color:#98a7b5; }
.spin_prize .prize {font-size:32px; line-height:1; font-weight:900; font-style:italic; color: transparent; background-image: linear-gradient(to bottom,#FFB03B,#FCEE21,#FFFF89,#FDDB3E,#FFDB49,#FFEB7D,#FDA60A); -webkit-filter: drop-shadow(2px 2px 0 #C55B1A); filter: drop-shadow(2px 2px 0 #C55B1A); -webkit-background-clip: text; }
.spin_prize .prize.type02 {font-size:52px; }


/*
#=========================================#
        vip
#=========================================#
*/
.dark .vip_visual {background: url('../custom_img/vip/top_banner.webp') no-repeat right center / 100% 100%;}
.vip_visual {background: url('../custom_img/vip/top_banner_w.png') no-repeat right center / 100% 100%;}

@media all and (max-width:767px){
    .dark .vip_visual {background: url('../custom_img/vip/top_banner_m.png') no-repeat center center / cover;}
    .vip_visual {height:530px; background: url('../custom_img/vip/top_banner_w_m.png') no-repeat center center / cover;}
}

.dark .vip_con01 > div {background:radial-gradient(89.39% 89.39% at 50% 10.61%,rgba(255,178,47,.2) 0%,rgba(0,0,0,0) 100%),#292B31; }
.dark .vip_con01 > div.type02 {background:radial-gradient(89.39% 89.39% at 50% 10.61%,rgba(115,77,255,.2) 0%,rgba(0,0,0,0) 100%),#292B31; }

.vip_con01 > div {background:radial-gradient(89.39% 89.39% at 50% 10.61%,rgba(255,178,47,.4) 0%,rgba(255,255,255,0) 100%),#FFFFFF; }
.vip_con01 > div.type02 {background:radial-gradient(89.39% 89.39% at 50% 10.61%,rgba(115,77,255,.4) 0%,rgba(255,255,255,0) 100%),#FFFFFF; }

/*
#=========================================#
        updating_cont
#=========================================#
*/
.updating_wrap {overflow:auto; flex-direction: column; align-items:center; justify-content:center; width:100vw; height:100vh; max-height:100vh; padding:20px 15px;  }
.updating_wrap.on {justify-content: start;}
.updating_cont {width:833px; margin:40px auto; max-width:100%; }
.updating_cont table {width:100%;}
.updating_cont table td {padding:10px 0; border:1px solid #333439; text-align:center; color:#fff; font-weight:600; }
.updating_cont table tr:nth-of-type(odd):not(:first-of-type) {background-color:var(--standard-color);}
.updating_cont .event_btn.on svg {transform:rotate(90deg); } 
.updating_cont .event_close_btn svg {transform:rotate(-90deg); } 

@media all and (max-width:767px){
    .updating_wrap {justify-content: start;}
    .updating_cont {margin-top:20px; }
}



/**
추가
*/
.s1lj7wzj {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 100vh;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    box-sizing: border-box;
    min-height: 90vh
}

@-webkit-keyframes loading_ani-s1lj7wzj {
    0% {
        -webkit-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1)
    }

    50% {
        -webkit-transform: translateY(-20px) scale(1);
        -ms-transform: translateY(-20px) scale(1);
        transform: translateY(-20px) scale(1)
    }

    to {
        -webkit-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1)
    }
}

@keyframes loading_ani-s1lj7wzj {
    0% {
        -webkit-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1)
    }

    50% {
        -webkit-transform: translateY(-20px) scale(1);
        -ms-transform: translateY(-20px) scale(1);
        transform: translateY(-20px) scale(1)
    }

    to {
        -webkit-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1)
    }
}

.s1lj7wzj img {
    width: 12.5rem;
    -webkit-animation: loading_ani-s1lj7wzj 5s infinite;
    animation: loading_ani-s1lj7wzj 5s infinite
}




.btn2 {
    display: inline-flex;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem;
    border-width: 1px;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    font-weight: 500;
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}


.empty {
    padding: 2.5rem 0;
    color: #99a4b099;
    line-height: 1;
    text-align: center;
    height: 100%;
    min-height: 16.25rem;
    position: relative
}

.empty img {
    position: absolute;
    left: 50%;
    top: 30%;
    margin: -6.875rem 0 0 -6.25rem;
    width: 12.5rem;
    height: 7.5rem
}

.empty .msg {
    position: absolute;
    z-index: 1;
    line-height: 1.25rem;
    left: 50%;
    width: 17.5rem;
    top: 25%;
    margin-top: 3.75rem;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translate(-50%)
}

.intercom-lightweight-app-launcher { bottom: 50px;}

.invalid-feedback { font-size: .875em; color: #dc3545;}
.success-feedback { font-size: .875rm; color:#3bc117;}



.e9sva {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 100%;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    box-sizing: border-box
}

.e9sva>svg {
    height: 40%;
    max-height: 1.25rem;
    max-width: 80%;
    stroke: transparent
}

.e9sva circle {
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    will-change: transform;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

.e9sva circle:nth-child(1) {
    -webkit-animation: lds-1-e9sva .6s infinite;
    animation: lds-1-e9sva .6s infinite
}

.e9sva circle:nth-child(2) {
    -webkit-animation: lds-2-e9sva .6s infinite;
    animation: lds-2-e9sva .6s infinite
}

.e9sva circle:nth-child(3) {
    -webkit-animation: lds-2-e9sva .6s infinite;
    animation: lds-2-e9sva .6s infinite
}

.e9sva circle:nth-child(4) {
    -webkit-animation: lds-3-e9sva .6s infinite;
    animation: lds-3-e9sva .6s infinite
}

@-webkit-keyframes lds-1-e9sva {
    0% {
        -webkit-transform: scale(.4) translateX(28.57%);
        -ms-transform: scale(.4) translateX(28.57%);
        transform: scale(.4) translate(28.57%);
        opacity: .3
    }

    to {
        -webkit-transform: scale(1) translateX(0%);
        -ms-transform: scale(1) translateX(0%);
        transform: scale(1) translate(0);
        opacity: 1
    }
}

@keyframes lds-1-e9sva {
    0% {
        -webkit-transform: scale(.4) translateX(28.57%);
        -ms-transform: scale(.4) translateX(28.57%);
        transform: scale(.4) translate(28.57%);
        opacity: .3
    }

    to {
        -webkit-transform: scale(1) translateX(0%);
        -ms-transform: scale(1) translateX(0%);
        transform: scale(1) translate(0);
        opacity: 1
    }
}

@-webkit-keyframes lds-2-e9sva {
    0% {
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
        transform: translate(0)
    }

    to {
        -webkit-transform: translateX(28.57%);
        -ms-transform: translateX(28.57%);
        transform: translate(28.57%)
    }
}

@keyframes lds-2-e9sva {
    0% {
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
        transform: translate(0)
    }

    to {
        -webkit-transform: translateX(28.57%);
        -ms-transform: translateX(28.57%);
        transform: translate(28.57%)
    }
}

@-webkit-keyframes lds-3-e9sva {
    0% {
        -webkit-transform: scale(1) translateX(0%);
        -ms-transform: scale(1) translateX(0%);
        transform: scale(1) translate(0);
        opacity: 1
    }

    to {
        -webkit-transform: scale(.4) translateX(-28.57%);
        -ms-transform: scale(.4) translateX(-28.57%);
        transform: scale(.4) translate(-28.57%);
        opacity: .3
    }
}

@keyframes lds-3-e9sva {
    0% {
        -webkit-transform: scale(1) translateX(0%);
        -ms-transform: scale(1) translateX(0%);
        transform: scale(1) translate(0);
        opacity: 1
    }

    to {
        -webkit-transform: scale(.4) translateX(-28.57%);
        -ms-transform: scale(.4) translateX(-28.57%);
        transform: scale(.4) translate(-28.57%);
        opacity: .3
    }
}

@media (max-width: 1024px) {
    .quick_top {
        bottom: 130px !important;
        right:12px !important;
    }
}

/* 탑 서브 메뉴 */
.nlvg9xr {
    --1q75c1r: #E9E9EC;
    --1qf91c5: #E9E9EC;
    --t0x34p: rgb(49,55,61,.7);
    --1fe6jcm: rgb(49,55,61);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2rem;
    padding: 1rem 2rem;
    cursor: pointer;
    background: var(--1q75c1r)
}

.dark .nlvg9xr {
    --1q75c1r: #2e3036;
    --1qf91c5: #202124;
    --t0x34p: rgb(152,166,181,.7);
    --1fe6jcm: rgb(152,166,181)
}

.dark .nlvg9xr button.active, .dark .nlvg9xr button:hover {
    /* color: rgba(36, 238,137, 0.7) */
    color:#5DDB1C;
}

@media screen and (max-width: 621px) {
    .nlvg9xr {
        gap:1.5rem;
        padding: 1.5rem;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .nlvg9xr .rotate {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }
}

.nlvg9xr .split {
    display: block;
    width: 1px;
    height: 1.625rem;
    background: currentcolor
}

.nlvg9xr .mobile-more {
    position: relative
}