@charset "utf-8";

/* 
        **공통으로 크게 쓰여지지 않는 레이아웃**
*/

/* ----------------------------------------------
            ADDDD
---------------------------------------------- */
html{background-color:#19242d}

/* ----------------------------------------------
            MAIN_VISUAL
---------------------------------------------- */
.main_visual > div {
	height:320px;
}

/*
.main_visual > div.main_bg-image{
	height:180px;
}
*/
/*.main_visual .visual_banner {display:flex; flex-direction:column; justify-content:space-between; width:60%; background-color:var(--sub-color); background-repeat:no-repeat; background-position:right center; } */
.main_visual .visual_banner {display:flex; flex-direction:column; justify-content:space-between; width:60%; background-repeat:no-repeat; background-position:right center; } 

/*.main_visual .visual_banner > div {max-width:60%; } */

 @media all and (max-width: 480px){
	 .main_visual > div {min-height: 180px; height:180px;}
  .main_bg-image {background-image: none !important; width: 100% !important;}
 }

 
.main_bg-image {
background-image:url('/dist/images/desktop-bg.webp'); 
background-repeat: repeat; 
position: relative;
width: 100%;
}
			
  
.main_visual .slide_visual {position:relative; width:60%; }
.main_visual .slide_visual .swiper-container,
.main_visual .slide_visual .swiper-wrapper {height:100%; }
.main_visual .slide_visual li {display:flex; flex-direction:column; justify-content:space-between; background-size:cover; background-repeat:no-repeat; background-position:right center}
.main_visual .slide_visual .pagination {z-index:10; position:absolute; left:24px; bottom:-10px; }/* bottom:24px;*/

@media all and (max-width:1279px){
    /* .main_visual > div {height:290px; } */
	/*.main_visual > div {height:150px; } */
	
}

@media all and (max-width:767px){
	.main_visual .visual_banner.visual_banner_hidden {display:none } 
    .main_visual .visual_banner {width:100%; }
    .main_visual .slide_visual {width:100%; }
}


/* ----------------------------------------------
            MAIN - GAME_CATEGORY
---------------------------------------------- */
.game_category > div {overflow:hidden; position:relative; background-color:rgba(16,23,29,.5); }
.game_category > div .img {z-index:2; position:absolute; bottom:0; left:50%; max-height:80%; transform:translateX(-50%); }
.game_category > div .img.left {transform:translateX(-63%);}
.game_category > div .bg_blur {position: absolute; bottom: 0; left: 50%; content: ""; width: 80%; height: 200px; filter: blur(30px); transform: translate(-50%, 0); z-index: 1; opacity: .15;}

@media all and (max-width:640px){
    .game_category > div .img {left:auto; right:0; max-width:50%; max-height:90%; transform:none; }
    .game_category > div .img.left {transform:none; }
    .game_category > div .bg_blur {width:50%; transform:none; }
}


/* ----------------------------------------------
            MAIN - PROMOTION BANNER
---------------------------------------------- */
.main_probanner {position:relative; min-height:256px; background-color:rgba(16,23,29,.5); }
.main_probanner .img {position:absolute; right:0; bottom:0; }
.main_probanner .img .banner {position:absolute; left:50%; bottom:-40px; width:280px; transform:translateX(-40%); }


@media all and (max-width:1279px){
    .main_probanner {min-height:220px; background-color:#22474f; }
    .main_probanner .img .banner {bottom:-30px; width:200px; transform:translateX(-10%);}
}

@media all and (max-width:767px){
    .main_probanner .img .banner {bottom:0; width:190px; }
}


/* ----------------------------------------------
            MODAL - JOIN
---------------------------------------------- */
#join-modal.modal .modal-dialog .modal-content {background:transparent; }
.join_body {position:relative; }
.join_body .deco {position:absolute; }
.join_body .deco_1 {left:-50px; top:270px; width:81px; }
.join_body .deco_2 {left:-80px; top:-5px; width:115px; }
.join_body .deco_3 {z-index:11; left:-150px; top:120px; width:170px; }
.join_body .deco_4 {z-index:11; left:20px; top:-100px; width:116px; }
.join_body .deco_5 {left:170px; top:-30px; width:100px; }
.join_wrap {z-index:10; position:relative;  display:flex; background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d); }
.join_wrap .left_box {position:relative; width:250px; min-height:500px; background:linear-gradient(135deg, #01DCBA, #7F30CB); border-radius:8px 125px 0 8px; }

.join_wrap .left_box2 {position:relative; width:400px; min-height:500px; background:linear-gradient(135deg, #01DCBA, #7F30CB); border-radius:8px 125px 0 8px; }
.join_wrap .right_box2 {width:300px; }

.join_wrap .right_box {width:380px; }


.join_wrap .password_tooltip {position:absolute; left:100%; top:50%; display:none; width:280px; transform:translateY(-50%); box-shadow:0 0 5px rgba(43,198,157,.2); z-index: 9;}
.join_wrap .password_tooltip.show {display:block; }
.join_wrap .password_tooltip:before {content:''; z-index:-1; position:absolute; left:-5px; top:calc(50% - 5px); width:10px; height:10px; background-color:#10171d; transform:rotate(-45deg); box-shadow:0 0 5px rgba(43,198,157,.2); }
.join_wrap .password_tooltip > div {background-color:#10171d;}
.join_wrap .password_tooltip li {position:relative; padding-left:10px; }
.join_wrap .password_tooltip li + li {margin-top:3px; }
.join_wrap .password_tooltip li:before {content:''; position:absolute; left:0; top:50%; width:5px; height:5px; background-color:var(--primary-color); border-radius:50%; transform:translateY(-50%); }


@media all and (max-width:1279px){
    #join-modal.modal {background-color:rgba(16,23,29,.7); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
    #join-modal.modal .modal-dialog {box-shadow:none; }
    /* .join_body {margin-top:40px; } */
    .join_body .deco_1 {left:20px; top:-35px; width:65px; }
    .join_body .deco_2 {left:45%; top:-55px; width:97px; }
    .join_body .deco_3 {display:none; }
    .join_body .deco_4 {right:-10px; left:auto; top:100px; width:70px; }
    .join_body .deco_5 {right:-20px; left:auto; top:-20px; width:80px; }
    
    /* .join_wrap {flex-direction:column; background:transparent; } */
	.join_wrap {flex-direction:column;}
	
    /* .join_wrap .left_box {width:100%; min-height:150px; border-radius:16px; } */
	.join_wrap .left_box {width:100%; min-height:150px; border-radius:16px; margin-top: -15px; }
    .join_wrap .right_box {width:100%; }
	
	/* .join_wrap .left_box2 {width:100%; min-height:150px; border-radius:16px; } */
	.join_wrap .left_box2 {width:100%; min-height:150px; border-radius:16px; margin-top: -15px; }
	
    .join_wrap .right_box2 {width:100%; }
	
}


/* ----------------------------------------------
            BOOSTED_ITEM
---------------------------------------------- */
/* .boosted_item {width:380px; padding:12px; background:url('../images/main/footballoddsbooster_bg.webp') no-repeat center center / cover; } */
/*
.boosted_item {width:330px; padding:12px; background:url('../images/main/footballoddsbooster_bg.webp') no-repeat center center / cover; }
*/


/* updated */
.boosted_item {
    width: 330px; 
    padding: 5px;
    background: url(../images/main/footballoddsbooster_bg.webp) no-repeat center center / cover;
}

@media (max-width:640px){
	.boosted_item{
       width: 170px !important;
    }
}

.boosted_item .btn_box {display:flex; align-items:center; justify-content:space-between; gap:4px; }
.boosted_item .btn_box button {flex-grow:1; padding:8px; font-weight:600; background:rgba(255, 255, 255, 0.2); border-radius:4px; transition:all 0.4s; }
.boosted_item .btn_box button p {display:flex; align-items:center; justify-content:flex-end; gap:4px; }
.boosted_item .btn_box button.active {background:var(--primary-color); }


/* ----------------------------------------------
            vip 프로그램
---------------------------------------------- */
/* 카지노 */
.vip_program {background:var(--box-color) url('../images/banner/casino_vip_banner.webp') no-repeat center right / contain; }
.sport_vip_program {background:var(--box-color) url('../images/banner/sport_vip_banner.webp') no-repeat center right / contain; }

.vip_level .level_point {background:var(--box-color) url('../images/vip/casino-info-reward-bg.webp') no-repeat center center / cover;}
.vip_level .sport_level_point {background:var(--box-color) url('../images/vip/sport-info-reward-bg.webp') no-repeat center center / cover;}
.vip_level .level_require {background:var(--box-color) url('../images/vip/info-require-bg.webp') no-repeat center center / cover;}

.vip_level_slide {width:190px; }
.vip_level_slide.sport {width:175px; }
.vip_level_slide li {position:relative;}
.vip_level_slide li img {width:100%; }
.vip_level_slide li .txt_box {position:absolute; left:0; bottom:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; width:100%; padding:15px 30px 20px 30px; min-height:90px; text-align:center; }
.vip_level_slide li .txt_box p {font-size:7px; font-weight:900; line-height:1.2; }
.vip_level_slide li .txt_box b {display:block; margin-top:4px; font-size:11px; font-weight:900; line-height:1.2; }
.vip_level_slide li .txt_box b br {line-height:1; }

/* .vip_level_slide li {filter:grayscale(1); transform:scale(0.85) !important; } */
.vip_level_slide li.swiper-slide-active {filter:grayscale(0); transform:scale(1.05) !important; }


@media all and (max-width:1279px){
    .vip_program {min-height:280px; background-size:cover; }
}


/* ----------------------------------------------
            추천 referrals
---------------------------------------------- */
.referrals_visual {overflow:hidden; background-image:linear-gradient(to bottom, #243c4d 20%, #285c61 48%, #2b6b69 70%); border-radius:16px; }
.referrals_visual .visual_box {height:572px; padding:64px; background:url('../images/banner/referrals-invite-bg.webp') no-repeat left center; }

.referrals_visual .num {position:absolute; right:-8px; bottom:-8px; display:flex; align-items:center; justify-content:center; width:60px; height:60px; border:8px solid #2b6b69; background-color:var(--primary-color); border-radius:50%; }

.referrals_banner {display:flex; align-items:center; justify-content:center; height:200px; padding:0 16px 0 433px; background:url('../images/banner/referrals-email-bg.webp') no-repeat center center / cover;}

@media all and (max-width:1024px){
    .referrals_visual .visual_box {height:auto; padding:16px; }
}
@media all and (max-width:767px){
    .referrals_visual {background:#0c353e;}
    .referrals_visual .visual_box {padding-top:200px; background:url('../images/banner/referrals-invite-bg.mobile.webp') no-repeat center top / 100% auto;  }
    
    .referrals_banner {padding:0 16px; background:url('../images/banner/referrals-email-bg.mobile.webp') no-repeat center center / cover;}
}


/* ----------------------------------------------
            스핀 모달
---------------------------------------------- */
.spin-tabs {position:relative; z-index:10; justify-content:center; gap:24px; flex-wrap:wrap; }
.spin-tabs li button {position:relative; min-width:176px; height:46px; padding:0; border:0 none !important; background-color:#94aeb4; text-shadow:none !important;  }
.spin-tabs li button span {font-size:16px; font-weight:500; opacity:.7; }
.spin-tabs li button svg {position:absolute; left:0; top:0; width:45px; height:45px; filter:grayscale(1); }

.spin-tabs li button.active span {opacity:1; }
.spin-tabs li button.active svg {filter:grayscale(0); }

.spin-tabs li button.active.bronze {background:linear-gradient(0deg, #a94f1b 0%, #ffab5c 100%), #fff !important; box-shadow:0 0 10px 0 rgba(141, 114, 64, 0.75) !important; }
.spin-tabs li button.active.silver {background:linear-gradient(180deg, #eff1f3 0%, #81929a 100%) !important; box-shadow:0 0 10px 0 rgba(145, 145, 145, 0.75) !important; }
.spin-tabs li button.active.gold {background:linear-gradient(180deg, #f9d779 0%, #f9b806 100%), linear-gradient(180deg, #eff1f3 0%, #81929a 100%) !important; box-shadow:0 0 10px 0 rgba(124, 124, 124, 0.75) !important; }

.wheel_wrap {position:relative; display:flex; align-items:center; justify-content:center; width:567px; height:567px; margin:60px auto; }
.wheel_wrap .wheel_box {z-index:5; position:relative; width:calc(100% - 105px); height:calc(100% - 105px); }
.wheel_wrap .wheel_box .wheel_arrow {position:absolute; top:-70px; left:50%; width:85px; height:96px; animation:wheelArrow 2s linear infinite; transform:translate(-50%,0); transition:transform 0.5s; }
.wheel_wrap .wheel_box .wheel_spin {z-index: 5; position: absolute; top: 50%; left: 50%; display: flex; justify-content: center; align-items: center; transform: translate(-50%, -50%); width: 125px; height: 125px; cursor: pointer; background:url('../images/spin/wof-button.webp') no-repeat center center / cover;transition: opacity 0.24s ease; animation:wheelSpin 2s ease-in infinite; }
.wheel_wrap .wheel_box .wheel_spin span {font-size:28px; font-weight:800; text-shadow:-3px 0px 0px #1F7764, 3px 0px 0 #1F7764, 3px -1px 0 #1F7764, -1px -1px 0 #1F7764;   }
.wheel_wrap .wheel_box .wheel_module {overflow:hidden; position:absolute; left:0; top:0; width:100%; height:100%; border-radius:50%; animation:wheelModule 2s ease-in-out infinite; }
.wheel_wrap .wheel_box .wheel_module:before {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background:radial-gradient(100.00% 100.00% at 50% 50%, #13A6C1 0%, rgba(0, 35.62, 43.08, 0) 46%, #021A20 100%); border-radius:50%; }
.wheel_wrap .wheel_box .wheel_module .wheel_segment {position:absolute; left:50%; top:-50%; width:100%; height:100%; border:3px solid rgba(0,0,0,0.47); transform-origin:0 100%; background:linear-gradient(208deg, #00A09E 0%, rgba(0, 160, 158, 0) 100%); opacity:0.3; transition:opacity 0.3s ease; }
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(1) .wheel_segment {background:linear-gradient(180deg, #005B41 0%, #00A09E 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(2) .wheel_segment {background:linear-gradient(208deg, #00A09E 0%, rgba(0, 160, 158, 0) 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(3) .wheel_segment {background:linear-gradient(256deg, #2BC69D 0%, #293840 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(4) .wheel_segment {background:linear-gradient(275deg, #005B41 0%, #00A09E 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(5) .wheel_segment {background:linear-gradient(311deg, #00A09E 0%, rgba(0, 160, 158, 0) 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(6) .wheel_segment {background:linear-gradient(260deg, #2BC69D 0%, #293840 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(7) .wheel_segment {background:linear-gradient(189deg, #005B41 0%, #00A09E 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(8) .wheel_segment {background:linear-gradient(214deg, #00A09E 0%, rgba(0, 160, 158, 0) 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(9) .wheel_segment {background:linear-gradient(213deg, #2BC69D 0%, #293840 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(10) .wheel_segment {background:linear-gradient(288deg, #005B41 0%, #00A09E 100%);}
.wheel_wrap .wheel_box .wheel_module > div:nth-of-type(11) .wheel_segment {background:linear-gradient(155deg, #00A09E 0%, rgba(0, 160, 158, 0) 100%);}

.wheel_wrap .wheel_box .wheel_module .wheel_prize {position:absolute; left:50%; top:0; width:50%; height:50%; transform-origin:0 100%; }
.wheel_wrap .wheel_box .wheel_module .wheel_prize .txt_box {position:absolute; left:0; top:0; display:flex; align-items:center; justify-content:space-between; width:100%; height:100%; margin-left:-50%; padding-left:75px; padding-right:15px; transform:rotate(-90deg)}
.wheel_wrap .wheel_box .wheel_module .wheel_prize .txt_box p {font-size:16px; font-weight:700;}
.wheel_wrap .wheel_box .wheel_module .wheel_prize .txt_box img {width:35px; height:35px; margin-left:5px; transform:rotate(90deg); }
.wheel_wrap .wheel_box .wheel_module .wheel_prize .wheel_highlight {z-index:-1; position:absolute; left:0; width:100%; height:138px; background:linear-gradient(to right, rgb(255, 174, 0) 25%, rgb(110, 76, 1) 90%); transform:translateX(5%);     -webkit-clip-path: polygon(0% 50%, 100% 0, 100% 100%); clip-path: polygon(0% 50%, 100% 0, 100% 100%); box-shadow: inset 0 0 30px rgb(0, 0, 0);}

.wheel_wrap .wheel_bg {z-index:2; position:absolute; top:0; left:0; width:100%; height:100%; background-color:#001413; border-radius:50%; }
.wheel_wrap .wheel_border {z-index:3; position:absolute; left:50%; top:50%; width:100%; transform:translate(-50%,-50%); }
.wheel_wrap .wheel_bg_effect {z-index:1; position:absolute; left:50%; top:50%; max-width:unset; transform:translate(-50%,-50%); }

.wheel_wrap .wheel_light {z-index:4; position:absolute; left:0; top:0; width:100%; height:100%; }
.wheel_wrap .wheel_light span {position:absolute; left:50%; top:5px; width:10px; height:100%; margin-left:-8px; }
.wheel_wrap .wheel_light span:before {content:''; position:absolute; left:50%; top:16px; width:10px; height:10px; margin-left:-5px; background:radial-gradient(40% 40% at 50% 50%, #FFFFFF 0, #FFFFFF 100%) no-repeat 50% 50%; border-radius:50%; box-shadow:0 0 10px 6px #1FE988; transition:box-shadow .3s ease-in-out; animation:wheelLight 1.5s ease infinite backwards; }
.wheel_wrap .wheel_light span:nth-child(2n):before {animation:wheelLight2 1.5s ease infinite backwards; }
.wheel_wrap .wheel_light span:nth-of-type(1) {transform:rotate(25deg); }
.wheel_wrap .wheel_light span:nth-of-type(2) {transform:rotate(48deg); }
.wheel_wrap .wheel_light span:nth-of-type(3) {transform:rotate(72deg); }
.wheel_wrap .wheel_light span:nth-of-type(4) {transform:rotate(96deg); }
.wheel_wrap .wheel_light span:nth-of-type(5) {transform:rotate(96deg); }
.wheel_wrap .wheel_light span:nth-of-type(6) {margin-left:-12px; transform:rotate(119deg); }
.wheel_wrap .wheel_light span:nth-of-type(7) {margin-left:-16px; transform:rotate(140deg); }
.wheel_wrap .wheel_light span:nth-of-type(8) {margin-top:-9px; transform:rotate(167deg); }
.wheel_wrap .wheel_light span:nth-of-type(9) {margin-top:-10px; transform:rotate(190deg); }
.wheel_wrap .wheel_light span:nth-of-type(10) {margin-top:-12px; transform:rotate(214deg); }
.wheel_wrap .wheel_light span:nth-of-type(11) {margin-top:-14px; margin-left:-4px; transform:rotate(238deg); }
.wheel_wrap .wheel_light span:nth-of-type(12) {margin-left:0; transform:rotate(264deg); }
.wheel_wrap .wheel_light span:nth-of-type(13) {margin-left:0; transform:rotate(288deg); }
.wheel_wrap .wheel_light span:nth-of-type(14) {margin-left:0; transform:rotate(311deg); }
.wheel_wrap .wheel_light span:nth-of-type(15) {margin-left:0; transform:rotate(335deg); }

.wheel_wrap .wheel_coin {z-index:6; position:absolute; min-width:100px; min-height:100px; animation:coinUpDown linear infinite; }
.wheel_wrap .wheel_coin_1 {top:40%; left:-160px; animation-duration:3s; }
.wheel_wrap .wheel_coin_2 {top:0; left:-150px; animation-duration:6s; }
.wheel_wrap .wheel_coin_3 {top:30%; right:-140px; animation-duration:6s; }
.wheel_wrap .wheel_coin_4 {bottom:0; right:-130px; animation-duration:3s; }

.wheel_wrap .wheel_star {z-index:1; position:absolute; width:38px; height:38px; animation:coinUpDown linear infinite; }
.wheel_wrap .wheel_star_1 {bottom:20%; left:-50px; animation-duration: 5s;}
.wheel_wrap .wheel_star_2 {bottom:55%; left:-50px; width:26px; height:26px; animation-duration: 4s;}
.wheel_wrap .wheel_star_3 {top:-30px; left:22%; animation-duration: 6s;}
.wheel_wrap .wheel_star_4 {top:40px; right:0; animation-duration: 8s;}
.wheel_wrap .wheel_star_5 {top:25%; right:-40px; width:26px; height:26px; animation-duration: 4s;}
.wheel_wrap .wheel_star_6 {bottom:15px; right:10px; animation-duration: 6s;}

.wheel_wrap .wheel_fly {position:absolute; right:206px; top:-67px; transform-origin:85% 50%; }
.wheel_wrap .wheel_fly_1 {animation:wheelfly 15s linear infinite; }
.wheel_wrap .wheel_fly_2 {animation:wheelfly2 15s linear infinite; }


@media all and (max-width:1279px){
    .wheel_wrap {zoom:0.6; }
}

@media all and (max-width:767px){
    .spin-tabs {gap:12px; }
    .spin-tabs li button {min-width:130px; }
    .wheel_wrap {zoom:0.5; }
}

@keyframes wheelModule {
    0% {transform:translateX(0) translateY(0) rotate(-3deg); }
    50% {transform:translateX(0) translateY(0) rotate(3deg); }
    100% {transform:translateX(0) translateY(0) rotate(-3deg); }
}

@keyframes wheelSpin {
    0% {transform:translateX(-50%) translateY(-50%) scale(1)}
    50% {transform:translateX(-50%) translateY(-50%) scale(1.05)}
    100% {transform:translateX(-50%) translateY(-50%) scale(1)}
}

@keyframes wheelArrow {
    0% {transform:translateX(-50%) translateY(0) rotate(0deg)}
    50% {transform:translateX(-50%) translateY(0) rotate(10deg)}
    100% {transform:translateX(-50%) translateY(0) rotate(0deg)}
}

@keyframes coinUpDown {
    0% {transform:translateY(0)}
    50% {transform:translateY(-10px)}
    100% {transform:translateY(0)}
}

@keyframes wheelfly {
    0% {transform:rotate(0)}
    100% {transform:rotate(360deg)}
}

@keyframes wheelfly2 {
    0% {transform:rotate(180deg)}
    100% {transform:rotate(540deg)}
}

@keyframes wheelLight {
    0% {box-shadow:0 0 10px 6px #1FE988; }
    50% {box-shadow:0 0 0 0 #1FE988; }
    100% {box-shadow:0 0 10px 6px #1FE988; }
}

@keyframes wheelLight2 {
    0% {box-shadow:0 0 0 0 #1FE988; }
    50% {box-shadow:0 0 10px 6px #1FE988; }
    100% {box-shadow:0 0 0 0 #1FE988; }
}


/* ----------------------------------------------
            베터 토너먼트
---------------------------------------------- */
.tournament_visual {min-height:315px; padding:50px 56px; background:url('../images/banner/tournament-banner-bg.webp') no-repeat center center / cover; }

@media all and (min-width:1280px){
    .mo_tab_content > div {display:block !important; }
}

@media all and (max-width:1279px){
    .tournament_visual {min-height:auto; padding:32px 16px; background:#1d272d url('../images/banner/tournament-banner-bg-mobile.webp') no-repeat right center / contain; }
}

/* ----------------------------------------------
            명예의 전당
---------------------------------------------- */
.hall_sub_visual,
.hall_sub_visual_sports {position:relative; width:100%; height:400px; background:rgb(24,32,38) url('../images/banner/hall-of-fame-banner-casino-bg.webp') no-repeat right center / contain; }
.hall_sub_visual_sports {background:rgb(25,35,41) url('../images/banner/hall-of-fame-banner-sport-bg.webp') no-repeat right center / contain; }

.fame_table tr.detail {display:none; background-color:rgba(16,23,29,.5); border-top:1px solid rgba(43,198,157,.1); }
.fame_table.open tr.detail {display:table-row; }
.fame_table.open {box-shadow:0 0 10px rgba(43,198,157,.5); }
.fame_table .table_open_btn {transform:rotate(0); transition:all 0.5s; }

.mo_table_box.on {box-shadow:0 0 10px rgba(43,198,157,.5); }
.mo_table_open_btn svg {transform:rotate(90deg); transition:all 0.5s; }
.fame_table.open .table_open_btn {transform:rotate(180deg); }
.mo_table_open_btn.on svg {transform:rotate(270deg); }


@media all and (max-width:1279px){
    .hall_sub_visual,
    .hall_sub_visual_sports {height:300px; }
}

/* ----------------------------------------------
            프로모션
---------------------------------------------- */
.promotion_items {position:relative; overflow:hidden; box-shadow:0 4px 23px rgba(43,198,157,.38); }
.promotion_items > div {position:relative; display:flex; flex-direction:column; justify-content:flex-end; width:100%; min-height:236px; }
.promotion_items img {z-index:1; position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; }
.promotion_items:after {content:''; z-index:2; position:absolute; left:0; bottom:0; width:100%; height:120px; background:linear-gradient(rgba(16, 23, 29, 0) 10%, #10171D 100%); border-bottom-left-radius:8px; border-bottom-right-radius:8px; }
.promotion_items .txt_box {z-index:3; position:relative; width:100%; }
.promotion_items .btn_box {display:none; }
.promotion_items:hover .btn_box {display:flex; }

.promotion_detail {position:relative; min-height:570px; background-color:rgb(17,43,70); }
.promotion_detail > img {z-index:5; position:absolute; left:0; bottom:0; max-width:100%; height:100%; object-fit:cover; }
.promotion_detail > div {z-index:10; position:relative; }
.promotion_detail .number {right:-8px; bottom:-8px; display:flex; align-items:center; justify-content:center; width:60px; height:60px; border:8px solid #112b46; background-color:var(--primary-color); border-radius:50%; }

@media all and (max-width:767px){
    .promotion_detail:before {content:''; z-index:8; position:absolute; left:0; bottom:0; width:100%; height:100%; background:linear-gradient(to top, rgb(17, 43, 70), rgba(255, 255, 255, 0)); }
}


/* ----------------------------------------------
            공급자 리스트
---------------------------------------------- */
.producer_btn:hover img {filter:brightness(0) invert(1); }
.producer_list button {border-radius:6px; }
.producer_list button span {width:calc(100% - 37px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; }
.producer_list button:hover span {color:var(--primary-color); }
.producer_list button.active {background-color:var(--sub-color); }
.producer_list button.active span {color:var(--primary-color); }

@media all and (max-width:1279px){
    .producer_btn {background:var(--block-color) url('../images/icon/simple-arrow.svg') no-repeat 97% center / 14px 14px; }
}


/* ----------------------------------------------
            CHATTING
---------------------------------------------- */
.chat_box {z-index:100; position:fixed; right:16px; bottom:16px; cursor:pointer; }
.chat_box .chat_btn {overflow:hidden; width:300px; height:60px; background-color:#22474F; }
.chat_box .chat_btn > div {height:100%; }
.chat_box .chat_btn i {display:block; height:100%; padding:15px; background: linear-gradient(135deg, #01DCBA 0%, #7F30CB 100%);}

.chat_box > div:not(.chat_btn) {width:375px; height:520px; background-color:rgba(16,23,29,1); }
.chat_box.size_lg {width:50%; height:85%;}
.chat_box.size_lg > div:not(.chat_btn) {width:100%; height:100%; }

.chat_box .chat_cont .input_form input {border:1px solid rgba(53, 68, 78, 0.20); }
.chat_box .chat_cont .chat_1 {color:rgba(0, 178, 71, 1); }
.chat_box .chat_cont .chat_2 {color:#ef5da8; }
.chat_box .chat_cont .chat_3 {color:#ffed00; }
.chat_box .chat_cont .chat_4 {color:#fff; }
.chat_box .chat_cont .chat_5 {color:#eb4d3d; }
.chat_box .chat_cont .chat_6 {color:#ff2d55; }
.chat_box .chat_cont .chat_7 {color:#7b38a5; }
.chat_box .chat_cont .chat_8 {color:#5d5fef; }
.chat_box .chat_cont .chat_9 {color:#0d6eff; }

.chat_box .chat_cont {position:relative; }
.chat_box .chat_cont .emotions_anim {z-index:100; position:absolute; right:0; bottom:0; display:none; width:100%; height:calc(100% - 45px); }
.chat_box .chat_cont .emotions_anim .emotions_item {width: 34px; height: 34px; position: absolute; bottom: 0; right: 50px; background-repeat: no-repeat; background-position: center; background-size: 100%; transform-origin: bottom right; animation-duration: 5s; animation-timing-function: linear; animation-fill-mode: forwards; background-image:url('../images/icon/thumbs_up_static.png'); }
.chat_box .chat_cont .emotions_anim.open {display:block; }
.chat_box .chat_cont .emotions_anim.open .emotions_item {animation-name:animFirst; }

@keyframes animFirst {
    0% {bottom:0; opacity:0; transform:translateX(0) scale(.5); }
    21% {opacity:.35; transform:translateX(20px) scale(.5); }
    31% {opacity:.7; transform:translateX(-6px) scale(.55); }
    38% {opacity:1; transform:translateX(-20px) scale(.55); }
    48% {opacity:1; transform:translateX(-20px) scale(.65); }
    62% {opacity:1; transform:translateX(20px) scale(1); }
    82% {opacity:.7; transform:translateX(-14px) scale(.75); }
    89% {opacity:.35; transform:translateX(20px) scale(.5); }
    100% {bottom:100%; opacity:0; transform:translateX(-20px) scale(.5); }
}

.chat_box .user_box .open svg {transform:rotate(270deg); }

.chat_box .sticker_box {display:none; }
.chat_box .sticker_box.open {display:block; }
.chat_box .sticker_box .tab-pane {height:214px; }
.chat_box .emoji_box > div:first-of-type {height:172px; }
.chat_box .emoji_box button {line-height:1.2; }
.chat_box .emoji_box .emoji_nav {height:42px; }
.chat_box .emoji_box .emoji_nav button {border-bottom:2px solid transparent; color:rgba(255, 255, 255, 0.65); }
.chat_box .emoji_box .emoji_nav button.active {border-bottom:2px solid var(--primary-color); color:var(--primary-color); }

@media all and (max-width:1279px){
    .chat_box {display:none; right:0 !important; left:0 !important; top:auto !important; bottom:60px; width:100%; }
    .chat_box.open {z-index:101; display:block; }
    .chat_box > div:not(.chat_btn) {width:100%; border-bottom-left-radius:0; border-bottom-right-radius:0; }
}


/* ----------------------------------------------
            스포츠 검색 모달
---------------------------------------------- */
.modal_search_result {box-shadow:0px 0px 1000px 0px #2BC69D; }

/* .mo_sports_search {height:calc(100vh - 120px); }*/

.mo_sports_search .search_input {padding:8px 40px; border:0 none; border-bottom:1px solid transparent; background-color:transparent; font-size:13px; }
.mo_sports_search .search_input:focus {outline:0 none; box-shadow:none; border-bottom-color:var(--primary-color); }
.mo_sports_search .search_input:focus + button svg {color:var(--primary-color); }


/* ----------------------------------------------
            스포츠 
---------------------------------------------- */
.sports_bet_wrap .bet_btn ,
.sports_body_btn .bet_btn {overflow:hidden; position:relative; border:0 none; background-color:var(--box-color); font-weight:900; box-shadow:inset 0 0 1px rgba(16, 23, 29, 0.5); }
.sports_bet_wrap .bet_btn:hover ,
.sports_body_btn .bet_btn:hover {background-color:#94AEB4; }
.sports_bet_wrap .bet_btn.active ,
.sports_body_btn .bet_btn.active {background-color:var(--primary-color);}
.sports_bet_wrap .bet_btn:before ,
.sports_body_btn .bet_btn:before { -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDMiIGhlaWdodD0iNDMiIHZpZXdCb3g9IjAgMCA0MyA0MyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgICA8cGF0aCBkPSJNMCAwVjBDNS45IDIwLjggMjIuMiAzNyA0MyA0M1Y0M0gwVjBaIiAvPg0KPC9zdmc+DQo=) no-repeat; mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDMiIGhlaWdodD0iNDMiIHZpZXdCb3g9IjAgMCA0MyA0MyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgICA8cGF0aCBkPSJNMCAwVjBDNS45IDIwLjggMjIuMiAzNyA0MyA0M1Y0M0gwVjBaIiAvPg0KPC9zdmc+DQo=) no-repeat; -webkit-mask-size: cover; mask-size: cover;}


.sports_bet_wrap .bet_btn.up:before ,
/*.sports_body_btn .bet_btn.up:before {content:''; position:absolute; right:0; top:0; width:40px; height:40px; background:linear-gradient(305deg, rgba(31,233,136,1) 0, rgba(31,233,136,0) 50% ); transform:rotate(180deg); border-bottom-left-radius:8px; } */

.sports_body_btn .bet_btn.up:before {content:''; position:absolute; right:0; top:0; width:40px; height:40px; 
background:linear-gradient(46deg, rgba(31, 233, 136, 1) 0, rgba(31, 233, 136, 0) 48%); 
transform:rotate(180deg); border-bottom-left-radius:8px; } 


/*
.sports_bet_wrap .bet_btn.up:before ,
.sports_body_btn .bet_btn.up:before {animation: opacity 1s 4; content:''; position:absolute; right:0; top:0; width:40px; height:40px; background:linear-gradient(305deg, rgba(31,233,136,1) 0, rgba(31,233,136,0) 50% ); transform:rotate(180deg); border-bottom-left-radius:8px; }
*/

.sports_bet_wrap .bet_btn.up:after,
/*.sports_body_btn .bet_btn.up:after {content:''; position:absolute; right:0; top:0; width:40px; height:40px; background:linear-gradient(55deg, rgba(31,233,136,1) 0, rgba(31,233,136,0) 50% ); transform:rotate(180deg); filter:blur(7px); border-bottom-left-radius:8px; } */

.sports_body_btn .bet_btn.up:after {content:''; position:absolute; right:0; top:0; width:40px; height:40px; 
background:linear-gradient(48deg, rgba(31,233,136,1) 0, rgba(31,233,136,0) 48% ); 
transform:rotate(180deg); border-bottom-left-radius:8px; }

.sports_bet_wrap .bet_btn.down:before,
/* .sports_body_btn .bet_btn.down:before {content:''; position:absolute; left:0; bottom:0; width:40px; height:40px; background:linear-gradient(305deg, rgba(255,78,78,1) 0, rgba(255,78,78,0) 50% ); border-bottom-left-radius:8px; } */
.sports_body_btn .bet_btn.down:before {content:''; position:absolute; left:0; bottom:0; width:40px; height:40px; background:linear-gradient(33deg, rgba(255,78,78,1) 0, rgba(255,78,78,0) 50% ); border-bottom-left-radius:8px; } 

.sports_bet_wrap .bet_btn.down:after,

/*.sports_body_btn .bet_btn.down:after {content:''; position:absolute; left:0; bottom:0; width:40px; height:40px; background:linear-gradient(55deg, rgba(255,78,78,1) 0, rgba(255,78,78,0) 50% ); filter:blur(7px); border-bottom-left-radius:8px; } */
.sports_body_btn .bet_btn.down:after {content:''; position:absolute; left:0; bottom:0; width:40px; height:40px; background:linear-gradient(48deg, rgba(255,78,78,1) 0, rgba(255,78,78,0) 48% ); border-bottom-left-radius:8px; }

.sports_body_info {display:none; }
.sports_body_info.open {display:flex; }

.sports_bet_wrap {display:none; }
.sports_bet_wrap.open {display:block; }

.sports_bet_wrap dl dd {display:none; }
.sports_bet_wrap dl dt button > svg {transform:rotate(90deg); transition:all 0.3s; }
.sports_bet_wrap dl.open dd {display:grid; }
.sports_bet_wrap dl.open dt button > svg {transform:rotate(-90deg); }

/* 모바일 상단 탭 */
.mo_sports_tab {display:flex; align-items:flex-start; gap:10px; }
.mo_sports_tab .all_btn {width:48px; }
.mo_sports_tab .sports_list {display:flex; width:calc(100% - 60px); padding-bottom:8px; }
.mo_sports_tab .all_btn,
.mo_sports_tab .sports_list a {display:flex; flex-direction:column; align-items:center; justify-content:space-between; height:50px; padding:3px 12px 5px; border-radius:8px; }
.mo_sports_tab .all_btn.active ,
.mo_sports_tab .sports_list a.active {background-color:var(--primary-color); }
.mo_sports_tab .sports_list a img {width:23px; max-width:23px; }
.mo_sports_tab .all_btn span,
.mo_sports_tab .sports_list a span {font-size:10px; }

.bet_slide_box .pagination span {width:6px; height:6px; margin:0 2px !important; }

.mo_sports_bet_wrap .bet_btn {position:relative; overflow:hidden; }
.mo_sports_bet_wrap .bet_btn > * {display:flex; align-items:center; justify-content:center; width:50%; height:100%; }
.mo_sports_bet_wrap .bet_btn.active > span {background-color:#1E6F5C; }
.mo_sports_bet_wrap .bet_btn.active > b {background-color:var(--primary-color); }
.mo_sports_bet_wrap .bet_btn:before { -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDMiIGhlaWdodD0iNDMiIHZpZXdCb3g9IjAgMCA0MyA0MyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgICA8cGF0aCBkPSJNMCAwVjBDNS45IDIwLjggMjIuMiAzNyA0MyA0M1Y0M0gwVjBaIiAvPg0KPC9zdmc+DQo=) no-repeat; mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDMiIGhlaWdodD0iNDMiIHZpZXdCb3g9IjAgMCA0MyA0MyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgICA8cGF0aCBkPSJNMCAwVjBDNS45IDIwLjggMjIuMiAzNyA0MyA0M1Y0M0gwVjBaIiAvPg0KPC9zdmc+DQo=) no-repeat; -webkit-mask-size: cover; mask-size: cover;}
.mo_sports_bet_wrap .bet_btn.up:before {content:''; position:absolute; right:0; top:0; width:40px; height:40px; background:linear-gradient(305deg, rgba(31,233,136,1) 0, rgba(31,233,136,0) 50% ); transform:rotate(180deg); border-bottom-left-radius:8px; }
.mo_sports_bet_wrap .bet_btn.up:after {content:''; position:absolute; right:0; top:0; width:40px; height:40px; background:linear-gradient(55deg, rgba(31,233,136,1) 0, rgba(31,233,136,0) 50% ); transform:rotate(180deg); filter:blur(7px); border-bottom-left-radius:8px; }
.mo_sports_bet_wrap .bet_btn.down:before {content:''; position:absolute; left:0; bottom:0; width:40px; height:40px; background:linear-gradient(305deg, rgba(255,78,78,1) 0, rgba(255,78,78,0) 50% ); border-bottom-left-radius:8px; }
.mo_sports_bet_wrap .bet_btn.down:after {content:''; position:absolute; left:0; bottom:0; width:40px; height:40px; background:linear-gradient(55deg, rgba(255,78,78,1) 0, rgba(255,78,78,0) 50% ); filter:blur(7px); border-bottom-left-radius:8px; }

.bet_slide_box .swiper-scrollbar {position:absolute; left:0; bottom:0; height:4px; background-color:transparent; }
.bet_slide_box .swiper-scrollbar .swiper-scrollbar-drag {background:var(--primary-color); opacity:.8; }

.betslip_btn {z-index:100; position:fixed; right:24px; bottom:74px; display:none; height:56px; padding:0 15px; border-radius:36px; background:linear-gradient(270deg,#4cd8b3,#2BC69D); box-shadow:0 1px 4px #2BC69D, 0px 4px 24px rgba(43, 198, 157, 0.7); }
.betslip_btn.delete {background:linear-gradient(270deg,#ff8181,#FF4E4E); box-shadow:0 1px 4px #FF4E4E,0 4px 24px rgba(255, 78, 78, 0.7); }

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

/* 스포츠 카테고리 */
.sports_category_box {flex-wrap:wrap; display:flex; align-items:center; gap:10px; margin:10px 0; }
.sports_category_box > button:nth-child(1),
.sports_category_box > button:nth-child(2) {display:none; }

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

/* ----------------------------------------------
            스포츠 디테일
---------------------------------------------- */

/* 스포츠 디테일 비쥬얼 */
/* .sports_detail_visual {overflow:hidden; position:relative; background-repeat:no-repeat; background-position:center right; background-size:100%; } */
.sports_detail_visual {overflow:hidden; position:relative; background-repeat:no-repeat; background-position:center; background-size:100%; } 
/* .sports_detail_visual:before {content:''; z-index:1; position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(33, 48, 60, 0.9);} */
.sports_detail_visual:before {content:''; z-index:1; position:absolute; left:0; top:0; width:100%; height:100%; background-color:#21303cba}

.sports_detail_visual > div {z-index:2; position:relative; }
.sports_detail_visual .visual_info {background:radial-gradient(100% 162.16% at 100% 0%, rgba(16, 23, 29, 0.5) 0%, rgba(16, 23, 29, 0.5) 100%); }

/* 스포츠 디테일 탭 */
.sport_detail_tab {}
.sport_detail_tab .analysis_btn {background:linear-gradient(to right, #01DCBA 60%, #7F30CB); background-size:300% 200%; animation:bggradient 2s ease-in infinite; }
.sport_detail_tab .analysis_btn.active {background:var(--primary-color); animation:none; }

@keyframes bggradient {
    0% {background-position:50% 0%; }
    50% {background-position:99% 300%; }
    100% {background-position:50% 0%; }
}

@media all and (max-width:1279px){
    .sports_detail_visual .visual_info {background:transparent; }
    .sports_detail_top {width:calc(100% + 20px); margin:0 -10px; background:radial-gradient(100% 200% at 0% 0%, #35444e, #19242d); }
}


/* ----------------------------------------------
            마이페이지
---------------------------------------------- */
.mypage_side {width:215px; }

.mypage_accordion.accordion .accordion-item .accordion-header .accordion-button:before {display:none !important; }
.mypage_accordion.accordion button.collapsed svg {transform:rotate(90deg); }
.mypage_accordion.accordion button svg {transform:rotate(-90deg); transition:all 0.4s; }

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

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

.mypage_bonus_table tr {cursor:pointer; }
.mypage_bonus_table tr.active:not(.detail) {border-left:1px solid var(--primary-color); }
.mypage_bonus_table .detail {display:none; }
.mypage_bonus_table .detail.active {display:table-row; }


.game_item .img_box .favs {
    position: absolute;
    right: 1px;
    top: 1px;
    align-items: center;
    padding: 4px 8px;	
    z-index: 13;
}

.main-loader__image{
	/* width: 5rem; */
}

.game_item .img_box .selected {
	position:absolute;right:5px;top:5px;
}

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