@font-face {
    font-family: 'ChosunGu';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@1.0/ChosunGu.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'attgd';
    src: url('/fonts/aTITGD1R.eot');
    src: url('/fonts/aTITGD1R.eot?#iefix') format('embedded-opentype'),
        url('/fonts/aTITGD1R.woff') format('woff'),
        url('/fonts/aTITGD1R.ttf') format('truetype');
}

/* **** Common  **** */
* {
    margin: 0;
    padding: 0;
    list-style: none;
    font-weight: 400;
    font-family: 'attgd', san-serif;
    box-sizing: border-box;
    letter-spacing: -0.0px
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5 {
    margin: 0;
    padding: 0;
    word-wrap: break-word;
    word-break: break-all;
}

body,
html {
    width: 100%;
    color: #111;
    min-width: 1440px;
    background-color: #f5f5f5;
    font-size: 12px;
    line-height: inherit;
}

input,
select,
img {
    vertical-align: middle;
}

img {
    border: 0;
    max-width: 100%;
}

table {
    border-spacing: 1px;
    border-collapse: separate;
    width: 100%;
}

table caption {
    position: absolute;
    top: 0px;
    left: 0px;
    overflow: hidden;
    display: block !important;
    width: 0px !important;
    height: 0px !important;
    margin: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

.clear {
    clear: both;
}

.clearfix::after {
    content: "";
    display: block;
    clear: both;
}

.blind {
    position: absolute;
    top: 0px;
    left: 0px;
    overflow: hidden;
    display: inline-block !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

a {
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
    color: #111;
}

i {
    font-style: normal;
    display: inline-block;
}

select {
    height: 30px;
    border: 1px solid #444;
    border-radius: 3px;
    padding: 0 15px;
    background: #fff;
    color: #111;
    font-size: 13px;
    font-weight: 400;
}

pre {
    line-height: 1.5;
    white-space: pre-wrap;
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background: none;
}

::-webkit-scrollbar-corner {
    background-color: rgba(127, 127, 127, 0.1);
}

::-webkit-scrollbar-thumb {
    background: rgba(144, 147, 153, .5);
    border: none;
    border-radius: 5px;
}


input::-webkit-input-placeholder {
    color: #aaa;
}

input:-moz-placeholder {
    color: #aaa;
}

input::-moz-placeholder {
    color: #aaa;
}

input:-ms-input-placeholder {
    color: #aaa;
}

textarea::-webkit-input-placeholder {
    color: #d9d9d9;
}

textarea::-moz-placeholder {
    color: #d9d9d9;
}

textarea:-moz-placeholder {
    color: #d9d9d9;
}

textarea:-ms-input-placeholder {
    color: #d9d9d9;
}

button {
    cursor: pointer;
    border: 0;
}

span,
a {
    display: inline-block;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

em {
    display: inline-block;
    font-style: normal;
}

[class^="icmn-"],
[class*=" icmn-"] {
    vertical-align: middle;
}

i {
    display: inline-flex;
}

/* 공통사용 */
.mt6 {
    margin-top: 6px;
}

.mt10 {
    margin-top: 10px !important;
}

.mt15 {
    margin-top: 15px;
}

.mt20 {
    margin-top: 20px;
}

.ml5 {
    margin-left: 5px;
}

.ml10 {
    margin-left: 10px;
}

.mr5 {
    margin-right: 5px
}

.mb0 {
    margin-bottom: 0px !important
}

.mb5 {
    margin-bottom: 5px
}

.mb10 {
    margin-bottom: 10px;
}

.pb5 {
    padding-bottom: 5px;
}

.fl {
    float: left
}

.fr {
    float: right
}

.tac {
    text-align: center !important;
}

.tal {
    text-align: left !important;
}

.tar {
    text-align: right !important;
}

.pt0 {
    padding-top: 0 !important;
}

.pd10 {
    padding: 10px !important
}

.pdl10 {
    padding-left: 15px !important;
}

.btn_wrap {
    margin: 20px auto;
    text-align: center;
    display: inline-block;
    width: 100%;
    padding: 0 10px;
}

.btn_wrap_right {
    margin: 20px auto;
    text-align: right;
}

.yel {
    color: #ffcc00
}

.blue {
    color: #0090ff;
}

.lgr {
    color: #2de276 !important
}

.red {
    color: #5ccf61;
}

.big {
    padding: 10px 40px !important;
    font-size: 16px !important;
}

.hide {
    display: none
}

.pd060 {
    padding: 0 60px;
}

.mgl0 {
    margin-left: 0 !important;
}

.bb0 {
    border-bottom: 0 !important
}

.br1 {
    border-right: 1px solid #0d213f !important
}

.text-center {
    text-align: center !important;
}

.p-t-10 {
    padding-top: 10px !important;
}

.float-right {
    float: right !important;
}

.height-full {
    height: 100% !important;
}

.width-full {
    width: 100%;
}

.display-center {
    text-align: center;
}

.p-t-24 {
    padding-top: 24px
}

.p-b-48 {
    padding-bottom: 48px;
}

.fww {
    flex-wrap: wrap;
}

.btn_red {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 10px 20px;
    font-size: 13px;
    background: linear-gradient(180deg, #911e01, #610000);
    color: #fff;
    font-weight: 700;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
}

.btn_blue {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 13px;
    background: linear-gradient(180deg, #0090ff, #0069ae);
    color: #fff;
    font-weight: 700;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    cursor: pointer
}

.btn_gray {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 13px;
    background: linear-gradient(180deg, #666, #444);
    color: #fff;
    font-weight: 700;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    cursor: pointer;
}

.btn_green {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 13px;
    background: #1c8382;
    color: #fff;
    font-weight: 700;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    cursor: pointer
}

.btn_orange {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 13px;
    background: #df7834;
    color: #000;
    font-weight: 700;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    cursor: pointer
}

.btn_small {
    display: inline-flex;
    padding: 4px 5px;
    background: #0090ff;
    color: #fff;
    font-size: 12px;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    vertical-align: middle;
}

.btn_red_s {
    display: inline-flex;
    padding: 4px 5px;
    background: #c10000;
    color: #fff;
    font-size: 12px;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    vertical-align: middle;
}

.btn_lgr {
    display: inline-flex;
    padding: 10px 20px;
    font-size: 13px;
    background: linear-gradient(180deg, #3db21f, #277217);
    color: #fff;
    font-weight: 700;
    align-items: center;
    gap: 5px;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    border-radius: 3px;
    cursor: pointer
}


.clearfix {
    *zoom: 1;
}

.clearfix:before,
.clearfix:after {
    display: block;
    content: '';
    line-height: 0;
}

.clearfix:after {
    clear: both;
}

.dflexS {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dflexC {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dflexR {
    display: flex;
    align-items: center;
    justify-content: right;
    gap: 10px;
    padding: 0 10px
}

.dflexL {
    display: flex;
    align-items: center;
    justify-content: left;
    gap: 10px;
}

.mobile {
    display: none;
}

.dpnone {
    display: none;
}

.collapse {
    display: none;
}

.show {
    display: block !important;
}

/** 로그인,가입 모달 **/
.loginContainer,
.signContainer {
    z-index: 3;
    background: rgba(0, 0, 0, .51);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}

.loginContainer .wrap1,
.signContainer .formWrap {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.loginContainer .wrap1 {
    align-items: flex-start
}

.formWrap form,
.loginContainer .wrap2 {
    margin: 0 auto;
    width: 774px;
    background: #f2f2f2;
    border: 2px solid #fff;
    position: relative;
    font-size: 18px;
    border-radius: 15px;
}

.loginContainer .wrap2 {
    width: 360px;
    margin: 109px 0 0 0;
}

.loginContainer .txt {
    padding: 8px;
    text-align: center;
    cursor: pointer;
    color: #aaa;
    font-size: 16px
}

.loginContainer .txt:hover {
    color: #fff
}

.loginContainer .btn_login {
    background: linear-gradient(180deg, #00a17a, #015440);
    text-align: center;
    margin: 0 0 10px 0;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px 0;
    cursor: pointer;
    color: #fff;
    border-radius: 4px;
}

.loginContainer .btn_login[data-id=sign] {
    background: linear-gradient(180deg, #4CAF50 0, #27612a)
}

.loginContainer .btn_login[data-id=telegram] {
    background: linear-gradient(to bottom, #3953d1 0, #101991 50%, #101d63 51%);
    border-color: #2156f3;
}

.loginContainer .btn_login>[class^=icon-] {
    font-size: 18px;
    margin: 0 8px 0 0
}

.loginContainer .btn_login>[class^=icon-]:before {
    color: #fff
}

.formWrap form>div:not(#btnCloseSign),
.loginContainer .wrap2 .box {
    background: none;
    padding: 10px;
    border-radius: 0;
}

.loginContainer .wrap2 .box .col {
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    margin: 6px 0;
}

.loginContainer .wrap2 .box .col>div {
    width: 100%;
    padding: 4px 0;
    text-align: left;
}

.loginContainer .wrap2 .box .col>div label {
    display: block;
    margin: 5px 0;
}

.loginContainer .wrap2 .box .col input {
    width: 100%;
    padding: 8px;
    background: #fff;
    border: 0;
    border-radius: 3px;
    font-size: 14px;
    height: 38px;
    outline: 0;
}

.loginContainer .wrap2 .box .col input::placeholder {
    color: #333
}

.loginContainer .wrap2 .box .col>div p {
    font-size: 12px;
    margin-top: 4px;
    color: #f90
}

.loginContainer .title,
.signContainer .title {
    font-size: 24px;
    font-weight: 600;
    text-align: center;
    padding: 26px 20px 0 20px;
    color: #5ccf61;
}

.close_login {
    position: absolute;
    top: 16px;
    right: 17px;
    padding: 4px;
    cursor: pointer;
    border-radius: 4px;
    display: flex;
}

.loginContainer .wrap2.joincol {
    width: 720px;
}

.loginContainer .colWrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 1px;
    grid-row-gap: 0;
    margin: 6px 0;
    overflow: hidden;
}

.loginContainer .btnCont2 {
    display: flex;
    padding: 10px 0;
    justify-content: center;
}

.loginContainer .btnCont2 button {
    padding: 10px;
    min-width: 129px;
    margin: 0 4px;
    border-radius: 50px;
    border: solid 3px #5ccf61;
    background: #0e0e0e;
    color: #5ccf61;
    font-size: 22px;
}

.loginContainer .fi-br-cross:before {
    font-size: 25px;
}


/*** Top ****/
.all_wrap {
    width: 100%;
    margin: 0px auto;
    text-align: center;
}

.top_wrap {
    position: fixed;
    top: 0;
    text-align: center;
    z-index: 99;
    width: 100%;
    background: #f2f2f2;
}

.top_wrap .m_menu_expand_btn {
    display: none;
}

.top_wrap .m_menu_pc_btn {
    display: none;
}

.top_wrap .rtf_link {
    position: absolute;
    top: 14px;
    right: 20px;
}

.top_wrap .rtf_link a {
    padding: 7px 20px;
    font-size: 15px;
    border-radius: 14px;
}

.top_wrap .rtf_link a.info {
    background: #0090ff
}

.top_wrap .userm_wrap {
    height: 85px;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top_wrap .userm_wrap .logo {
    z-index: 99;
    position: relative;
    left: 45px;
}

.top_wrap .userm_wrap .logo img {
    height: 68px;
}

.top_wrap .userm_wrap ul {
    display: flex;
    position: relative;
}

.top_wrap .userm_wrap ul.submenu {
    display: flex;
    margin-left: auto;
    gap: 15px;
}

.top_wrap .userm_wrap ul.submenu li {
    margin-left: 5px;
    font-size: 13px;
    display: flex;
    align-items: center;
}

.top_wrap .userm_wrap ul.submenu li [class^="icmn-"] {
    font-size: 14px;
    margin-right: 4px;
}

.top_wrap .userm_wrap ul.submenu li a {
    color: #000;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.top_wrap .userm_wrap ul.submenu li a i {
    font-size: 15px;
    color: #000;
}

.top_wrap .userm_wrap ul.submenu li div.bar {
    height: 10px;
    width: 1px;
    background: #444;
}

.top_wrap .userm_wrap ul.submenu li a .menu-badge {
    display: inline-block;
    background: linear-gradient(135deg, #ff4500 0%, #ff6347 100%);
    color: #fff;
    padding: 2px 6px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: bold;
    margin-left: 4px;
    box-shadow: 0 2px 4px rgba(255, 69, 0, 0.6);
    vertical-align: middle;
}

.top_wrap .userm_wrap ul.loginmenu {
    margin-right: 15px;
    margin-left: 20px;
}

.top_wrap .userm_wrap ul.loginmenu li.logout {
    display: flex;
    border-radius: 18px;
    padding: 0px 15px;
    align-items: center;
    white-space: nowrap;
    cursor: pointer;
    background: #015440;
    gap: 4px;
    min-width: 100px;
    border: #5ccf61 solid 2px;
    font-size: 13px;
    justify-content: center;
    margin-left: 5px;
    height: 34px;
    color: #fff
}

.top_wrap .userm_wrap ul.loginmenu li.logout span {
    margin-right: 4px;
    font-size: 16px;
}

.top_wrap .userm_wrap ul.loginmenu li.logout.join {
    background: #fff;
    color: #015440;
}

.top_wrap .userm_wrap ul.loginmenu li.logout.join2 {
    background: #fff;
    color: #015440;
}

.top_wrap .userm_wrap .user_info {
    display: flex;
    position: relative;
    margin-right: 20px;
    font-size: 1.35rem;
    transform: skew(-27deg);
    background: #020202;
    height: 42px;
    border: 2px solid #151e49;
    border-radius: 6px;
    padding: 0 15px;
    align-items: center;
}

.top_wrap .userm_wrap .user_info>div {
    transform: skew(27deg);
    padding: 0 20px;
}

.top_wrap .userm_wrap .user_info>div.user_nick span {
    color: #ffcc00;
    font-size: 13px;
}

.top_wrap .userm_wrap .user_info>div ul {
    display: flex;
    justify-content: space-between;
    min-width: 180px
}

.top_wrap .userm_wrap .user_info>div ul li {
    font-size: 13px;
    line-height: 16px;
}

.top_wrap .userm_wrap .user_info>div ul li:first-child {
    flex-basis: 40%;
    text-align: left;
}

.top_wrap .userm_wrap .user_info>div ul li:first-child img {
    filter: brightness(0.7);
    margin-right: 3px;
    margin-top: -2px;
}

.top_wrap .userm_wrap .user_info>div ul li:last-child {
    flex-basis: 60%;
    text-align: right;
}

.top_wrap .userm_wrap .user_info>div ul li span.money {
    color: #ffcc00
}

.top_wrap .userm_wrap .user_info>div ul li span.point {
    color: #27be0f
}

.top_wrap .nav_wrap {
    position: relative;
    top: 0px;
    background:#fff;
    overflow: hidden;
    text-align: center;
    height: 46px;
    border-top: 3px solid #00a17a;
    border-bottom: 3px solid #00a17a;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.top_wrap .nav_wrap .navdiv {
    width: 65%;
    ;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    height: 40px;
}

.top_wrap .nav_wrap .navdiv>a {
    color: #000;
    font-size: 16px;
    margin: auto;
    font-weight: 700;
    position: relative;
    transition: 0.2s;
    text-align: center;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.top_wrap .nav_wrap .navdiv>a:hover {
    color: #5ccf61;
}

.top_wrap .nav_wrap .list_menu {
    display: inline-block;
    line-height: 36px;
}

.top_wrap .nav_wrap .list_menu span small {
    font-size: 21px;
    color: #7ac6ff;
    margin-top: -3px;
    display: inline-block;
}

.top_wrap .nav_wrap .list_menu>ul {
    display: none;
    position: absolute;
    top: 38px;
    left: 0px;
    width: 115px;
    z-index: 99;
    background: #1b1d43;
    border-radius: 4px;
    border: 1px solid #4f86b9;
}

.top_wrap .nav_wrap .list_menu>ul li {
    display: inline-block;
    width: 100%;
    color: #fff;
    font-size: 14px;
    padding: 0 10px;
    border-bottom: 1px solid #111;
    box-shadow: inset 3px 3px 10px rgb(0 0 0 / 40%);
    height: 36px;
    line-height: 35px;
}

.top_wrap .nav_wrap .list_menu>ul li a {}

.top_wrap .nav_wrap .list_menu>ul li:last-child {
    border-bottom: 0
}

/* 한줄공지 */
.scrollNotice-copy {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    color: #fee111;
    overflow: hidden;
    font-size: 14px;
    padding: 6px 10px;
    background: #002949;
    border-radius: 0;
    position: relative;
    margin-left: 55px;
    width: 350px;
}

.scrollNotice-copy:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-top: 7px solid #003a72;
    border-right: 7px solid transparent
}

.scrollNotice-copy:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 0;
    border-bottom: 7px solid #003a72;
    border-left: 7px solid transparent
}


.swiper-wrapper {
    height: inherit;
}


/*** Left ****/
.container_wrap {
    position: relative;
    width: 100%;
    margin-top: 136px;
}

.left_content {
    position: fixed;
    width: 290px;
    z-index: 2;
    left: 0px;
    top: 136px;
    bottom: 0px;
    transition: .25s ease-out;
    background: #fff;
}

.scrollFrame {
    width: 100%;
    margin: 0 auto;
    overflow-y: auto;
    height: calc(100vh - 134px);
}

.scrollFrame::-webkit-scrollbar {
    width: 0px
}

.left_content .leftMenu {
    width: 100%;
    padding: 0px 4px 0 0;
    margin: 0 auto 10px;
}

.left_content .leftMenu .menu {
    display: flex;
    flex-wrap: wrap;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.left_content .leftMenu .menu a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    font-size: 13px;
    gap: 2px;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    width: 33.3%;
    background: #eee;
    ;
    box-shadow: inset 2px 2px 2px rgba(255, 255, 255, 0.5), 7px 7px 20px rgba(0, 0, 0, 0.1), 4px 4px 5px rgba(0, 0, 0, 0.1);
}

.left_content .leftMenu .menu a.ybg {
    width: 33.33%;
    background-image: linear-gradient(180deg, #00a17a, #015440);
    color: #fff;
}

.left_content .leftMenu .menu a.mobile {
    display: none;
}


.left_content .leftMenu .keyword_search {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 40px;
    background: #181d23;
    padding: 4px;
}

.left_content .leftMenu .keyword_search input {
    color: #fff !important;
    width: 240px;
    height: 30px;
    background: #222d40;
    border: 1px solid #0a0e16;
    padding: 3px;
}

.left_content .leftMenu .keyword_search a {
    width: 34px;
    color: #fff;
}

.left_content .leftMenu .keyword_search a i {
    font-size: 14px;
}

.left_content .leftMenu .freematch {
    margin-top: 5px;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.left_content .leftMenu .freematch h4 {
    font-size: 13px;
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0px 10px;
    border-bottom: 1px solid #cfcac2;
    margin-bottom: 0;
    background: linear-gradient(180deg, #fff, #f2f2f2);
}

.left_content .leftMenu .freematch h4 i {
    font-size: 16px;
    margin-right: 5px;
    color: #dc143c;
}

.left_content .leftMenu .freematch>ul {}

.left_content .leftMenu .freematch>ul li {
    cursor: pointer
}

.left_content .leftMenu .freematch>ul li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #dc143c;
    padding: 0 10px 0 20px;
    background: #fff;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);
    color: #000
}

.left_content .leftMenu .freematch>ul li img {
    height: 20px;
}

.left_content .leftMenu .freematch>ul li span {
    margin-left: 10px
}

.left_content .leftMenu .freematch>ul li small {
    margin-left: auto;
    margin-right: 5px;
    font-size: 13px;
    display: flex;
    align-items: center;
    font-size: 12px;
    width: 40px;
    justify-content: center;
    padding: 3px;
    border-radius: 3px;
    color: #dc143c;
}

.left_content .leftMenu .freematch>ul li a:hover {
    filter: brightness(1.1);
}

.left_content .leftMenu .freematch>ul li a.bg-location-orange1 {
    background: #f2f2f2;
    height: 34px;
    padding-left: 40px;
    justify-content: left;
}

.left_content .leftMenu .freematch>ul li a.bg-location-orange1 img {
    margin-right: 5px;
}

.left_content .leftMenu .freematch>ul li a.bg-location-orange1 span {
    margin-left: auto;
    margin-right: 10px;
}

.sub-menu .bg-league-orange1 {
    height: 34px !important;
    background: rgb(0 0 0 / 25%);
    padding-left: 36px !important;
}

.sub-menu .bg-league-orange1>div {
    display: flex;
    align-items: center;
    color: #333;
}

.sub-menu .bg-league-orange1>span {
    margin-right: 10px;
}

.left_content .leftMenu .popular_game {
    margin: 0px 0px;
}

.left_content .leftMenu .popular_game h4 {
    font-size: 13px;
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0px 10px;
    margin-bottom: 0;
    justify-content: left;
    background: linear-gradient(180deg, #fff, #f2f2f2);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.4);
}

.left_content .leftMenu .popular_game h4 i {
    font-size: 16px;
    margin-right: 5px;
    color: #dc143c;
}

.left_content .leftMenu .popular_game ul li {
    display: flex;
    align-items: center;
    height: 44px;
    padding: 0 10px;
    justify-content: space-between;
    background: #fff;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.08), 0px 1px 3px rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid #dc143c;
}

.left_content .leftMenu .popular_game ul li a {
    display: flex;
    align-items: center;
    height: 100%;
}

.left_content .leftMenu .popular_game ul li img {
    height: 18px;
    margin-left: 15px;
    margin-right: 5px;
}

.left_content .leftMenu .popular_game ul li>div {
    margin-left: 15px;
    margin-right: auto;
    text-align: left;
}

.left_content .leftMenu .popular_game ul li>div>p {
    margin-bottom: 0;
    color: #b683ea;
}

.left_content .leftMenu .popular_league {
    background: #2d353c;
    border-radius: 5px;
    margin: 8px 0px;
    padding: 0 5px 5px 5px;
}

.left_content .leftMenu .popular_league h4 {
    font-size: 13px;
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0px 10px;
    margin-bottom: 0;
    justify-content: center;
}

.left_content .leftMenu .popular_league h4 i {
    font-size: 16px;
    margin-right: 5px;
    margin-top: -2px;
}

.left_content .leftMenu .popular_league ul li {
    background: rgba(0, 0, 0, 0.4);
    margin-bottom: 1px;
    display: flex;
    align-items: center;
    height: 40px;
    padding: 0 10px;
}

.left_content .leftMenu .popular_league ul li img {
    height: 22px;
    margin-left: 15px
}

.left_content .leftMenu .popular_league ul li>div {
    margin-left: 20px;
    color: #b683ea;
}

.left_content .leftMenu .popular_league ul li>div img {
    height: 14px;
    margin-left: 15px
}

.fi-ss-basketball {
    color: #e65c2b;
}


.sch_sp_box {
    padding: 10px 3px;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
    background: #f2f2f2;
}

.sch_sp_box>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    margin-bottom: 5px;
}

.sch_sp_box>div:last-child {
    margin-bottom: 0;
}

.sch_sp_box>div input {
    color: #111;
    background: #fff;
    width: 240px;
    height: 32px;
    border: 0;
    padding: 3px;
    text-align: center;
    border-radius: 50px;
}

.sch_sp_box button {
    background: #3d3d3d;
    border-radius: 50px;
    cursor: pointer;
    color: #fff;
    display: inline-flex;
    width: 30px;
    height: 30px;
    font-size: 14px;
    align-items: center;
    justify-content: center;
    background-image: linear-gradient(to top, #2f2f2f 0%, #6b6b6b 85%, #7a7a7a 100%);
    border: 1px solid #fff;
    color: #fff;
    text-shadow: 0 1px #333;
    transition: all 0.1s ease;
}

.sch_sp_box button:hover {
    box-shadow: 0 1px 2px #bbb, inset 0 0 4px #aaa;
    transform: translateY(2px);
    background-image: linear-gradient(to top, #2a2a2a 0%, #333 85%, #6a6a6a 100%);
}

.dspn {
    display: none !important;
}



/*** Right Cart ****/
.right_content {
    position: fixed;
    width: 300px;
    z-index: 2;
    right: 0px;
    top: 136px;
    bottom: 0px;
    transition: width 0.6s ease-in-out;
    padding: 0 2px 2px;
    background: #fff;
}

.right_content .rightMenu {
    width: 100%;
    padding: 0px 0px;
    margin: 0 auto 10px;
}

.right_content .login_box {
    padding: 10px;
    background: #fff;
}

.right_content .login_box>div {
    margin-bottom: 5px;
}

.right_content .login_box input {
    width: 100%;
    background: #fff;
    padding: 8px;
    border: solid 1px #ccc;
    border-radius: 0;
    font-size: 14px;
    height: 34px;
    color: #111;
    outline: 0;
    border-radius: 3px;
}

.right_content .login_box input::placeholder {
    color: #333;
}

.right_content .login_box .btnCont {
    gap: 6px;
}

.right_content .login_box .btn_login {
    width: 100%;
    border: 0;
    font-size: 14px;
    background: linear-gradient(180deg, #00a17a, #015440);
    height: 36px;
    cursor: pointer;
    border-radius: 3px;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.user_body {
    border-radius: 3px;
    background: #fff;
    margin-bottom: 10px
}

.user_body .bgy {
    background: linear-gradient(180deg, #fff, #f2f2f2);
    border-bottom: 2px solid #fff;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
    height: 40px;
    padding: 0 10px;
}

.user_body .bgy>div {
    display: flex;
    align-items: center;
    gap: 5px
}

.user_body .bgy>div i {
    color: #fff;
    font-size: 14px;
    color: #dc143c;
}

.user_body .bgy>div a {
    color: #fff;
    display: flex;
    align-items: center;
    gap: 3px
}

.user_body .bgy small {
    font-size: 9px;
    background: linear-gradient(0deg, #fc2b2f, #fe6868);
    padding: 2px 4px;
    font-weight: 700;
    border: solid 1px #a71717;
    color: #fff;
}

.user_body .usero {
    display: flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 10px;
    font-size: 13px;
}

.user_body .usero>div {
    gap: 3px;
}

.user_body .usero>div i {}

.user_body .usero>div span.mymoney {
    color: #ffcc00;
}

.user_body .usero>div span.mypoint {
    color: #dc143c;
}

.user_body .rmenu {
    padding: 0 3px;
    gap: 3px;
}

.user_body .rmenu a {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1;
    flex-wrap: wrap;
    background: #454545;
    padding: 6px 0;
    border-radius: 5px;
    min-height: 43px;
    color: #fff;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.4);
}

.user_body .rmenu a i {
    width: 100%;
    justify-content: center;
    margin-bottom: 3px;
}

.user_body .rmenu a:hover {
    filter: brightness(1.1);
}

.user_body .bgy.title {
    font-size: 14px;
    background: linear-gradient(180deg, #fff, #f2f2f2);
}

.user_body .bgy.title span {
    display: flex;
    align-items: center;
    font-size: 12px;
    gap: 5px;
    cursor: pointer;
}

.user_body .bgy.title span i {
    font-size: 16px;
}

#cart_game_list_pos {
    font-size: 12px;
    position: relative;
    margin: 3px 0;
    color: #fff;
    text-shadow: 0 0 black;
}

#cart_game_list_pos .betlistbox {
    text-align: left;
    position: relative;
    padding: 6px 8px;
    margin-bottom: 1px;
    background-color: #1f2732;
}

#cart_game_list_pos .betlistbox>div {
    line-height: 16px;
}

#cart_game_list_pos .betlistbox .betlistcolor_b_odd {
    background: #000;
    color: #ffcc00;
    padding: 1px 5px;
    border-radius: 3px;
}

#cart_game_list_pos .betlistbox .betlistclose {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 16px;
    background: #181818;
    padding: 3px;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
}

#cart_game_list_pos .betlistbox .betlistclose:hover {
    background: #5ccf61
}

#cart_game_list_pos .betlistbox .betlistcolor_b {
    color: #5ccf61;
    font-weight: 700;
}

.right_content .betinput {
    padding: 0 10px;
    height: 34px;
    background: #fff;
    margin-top: 2px;
}

.right_content .betinput input {
    background: #fff;
    border: 1px solid #dc143c;
    color: #dc143c;
    height: 28px;
    padding: 0 5px;
    text-align: right;
    border-radius: 3px;
    margin-left: auto;
    margin-right: 5px;
}

.right_content .betinput button.reset {
    font-size: 13px;
    background: #25415b;
    color: #fff;
    padding: 0 5px;
    height: 24px;
    box-shadow: none;
}

.right_content .betinput i {
    font-size: 18px;
    cursor: pointer;
}

.right_content .betmoney {
    padding: 5px 5px;
    gap: 2px;
    flex-wrap: wrap;
}

.right_content .betmoney button {
    color: #fff;
    height: 38px;
    flex: 0 32.8%;
    background: #454545;
    border-radius: 3px;
}

.right_content .betmoney button:hover {
    filter: brightness(1.1);
}

.right_content .betinput2 {
    padding: 0 10px;
    height: 32px;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);
}

.right_content .betinput2 #total_odd {
    color: #5ccf61;
    font-size: 13px;
    font-weight: 700;
}

.right_content .betinput2 #total_odd_amount {
    color: #ffdd00;
    font-size: 13px;
    font-weight: 700;
}

.betbtn_wrap {
    padding: 8px;
}

.betbtn {
    font-weight: 700;
    background: linear-gradient(180deg, #00a17a, #015440);
    color: #fff;
    height: 43px;
    border-radius: 5px;
    border: 0;
    cursor: pointer;
    width: 100%;
    font-size: 16px;
    transition: all 60ms ease-out;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.betbtn:hover {
    filter: brightness(1.1);
    color: #fff;
}


.betinfo {
    background: #fff;
}

.right_content .rightMenu .r_banner {
    position: relative;
}

.right_content .rightMenu .r_banner a {
    margin-bottom: 5px;
    position: relative;
    background: #fff;
    overflow: hidden;
    padding: 1px;
}

.right_content .rightMenu .r_banner a .effect {
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(45deg, #fff, #ccc);
    width: 100%;
    height: 100%;
    z-index: 1;
    animation: rotate 2s infinite
}

.right_content .rightMenu .r_banner a img {
    z-index: 2;
    position: relative;
}

.right_content .rightMenu .r_banner a div.text {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: right;
    padding-right: 15%;
    font-size: 18px;
    font-weight: 700;
    height: 34px;
    z-index: 2;
    color: #fff;
}

.right_content .rightMenu .r_banner a.tg span {
    position: absolute;
    left: 100px;
    bottom: 20px;
    font-size: 24px;
    font-weight: 700;
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.bc_select {
    min-height: 70px;
}

.bc_select .no_data {
    text-align: center;
    line-height: 70px;
}

.bc_select ul {
    padding: 1px 0;
}

.bc_select ul li {
    text-align: center;
    text-align: right;
    overflow: scroll;
    outline: none;
    border: none;
    background-color: #fff;
    padding: 7px;
}

/*** Center ****/
.container_wrap .contents {
    height: auto;
    overflow: hidden;
    margin: 0px 306px 0 292px;
    padding-top: 0px;
    min-height: 100vh;
}

.page_ttl {
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    margin: 0px 0;
    text-align: center;
    color: #fff;
    background: linear-gradient(180deg, #00a17a, #015440);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.9);
}

.carousel button {
    box-shadow: none;
}

.carousel-item img {
    width: 100%;
}

.container_wrap .contents .page {
    text-align: left;
    padding: 0px 0px;
    min-height: 800px;
}

.contents .page h1.page_title {
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    height: 44px;
    display: flex;
    align-items: center;
    padding: 0 14px;
    margin-bottom: 4px;
    border-radius: 4px;
    background-image: linear-gradient(180deg, hsl(207.27deg 11.34% 19.02%) 0, hsl(207.27deg 11.34% 19.02%) 50%, hsl(207 11% 18% / 1) 50%) !important;
}

.contents .page h1.page_title span {
    margin-left: 5px;
    color: #aaa;
    font-size: 18px;
}

.contents .page h1.page_title i {
    margin-right: 8px;
    font-size: 21px;
    color: #ffcc00;
}

.contents .divide {
    border-top: 1px solid #32383d;
    border-bottom: 2px solid #cfcac2;
}

.contents .mainlink {
    width: 100%;
    align-items: center;
    margin: 10px auto;
    gap: 5px;
    justify-content: space-between;
    display: flex;
}

.contents .mainlink li {
    color: #fff;
    cursor: pointer;
    clip-path: polygon(4% 0, calc(100% - 4%) 0, 100% 4%, 100% calc(100% - 4%), calc(100% - 4%) 100%, 4% 100%, 0 calc(100% - 4%), 0 4%);
    ;
    background: linear-gradient(180deg, #00a17a, #015440);
    height: 315px;
    width: 20%;
    padding: 5px;
}

.contents .mainlink li a {
    position: relative;
    transition: 0.4s;
    display: block;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(45deg, black, #913f26 250px);
    clip-path: polygon(4% 0, calc(100% - 4%) 0, 100% 4%, 100% calc(100% - 4%), calc(100% - 4%) 100%, 4% 100%, 0 calc(100% - 4%), 0 4%);
}

.contents .mainlink li a img {
    position: absolute;
    bottom: 0;
    left: 0;
}

.contents .mainlink li a:hover:before {
    opacity: 1;
}

.contents .mainlink li a:before {
    display: flex;
    width: 100%;
    height: 100%;
    opacity: 0;
    font-family: uicons-solid-rounded !important;
    content: "\f8cd";
    color: #8eb7f2;
    position: absolute;
    bottom: 0;
    padding: 3px 7px;
    justify-content: center;
    align-items: center;
    left: 0;
    box-sizing: border-box;
    font-size: 70px;
    text-shadow: 0 0 6px rgb(0 0 0);
    transition: opacity .3s;
    pointer-events: none;
    backdrop-filter: brightness(.7);
    z-index: 99;
}

.contents.in .mainlink li a img {
    width: 100%;
    border-radius: 5px;
}

.contents .mainlink li:hover {}

.contents .mainlink li span {
    position: absolute;
    width: 100%;
    text-align: center;
    letter-spacing: 1px;
}

.contents .mainlink li span.eng {
    top: 12px;
    right: 18px;
    width: auto;
    color: #5ccf61;
    font-size: 20px;
    font-weight: 700;
}

.contents .mainlink li span.txt {
    bottom: 0px;
    left: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    background: rgba(0, 0, 0, 0.6);
    height: 40px;
    line-height: 40px;
}

.contents .mainlink li span:before {
    color: #0c7bad;
    margin: 0 10px;
}

.contents .mainlink li.active {
    background: linear-gradient(90deg, #3095ff 20%, #083463);
    border-color: #fff;
}

.main_notice_area {
    justify-content: space-between;
    align-items: center;
    margin: auto;
    margin-top: 10px;
    padding: 0 0px;
    gap: 10px;
    display: flex;
}

.main_notice_area .notice_box {
    margin-top: 0px;
    text-align: left;
    width: 50%;
}

.main_notice_area .notice_box:last-child {
    border-right: 0;
}

.main_notice_area .notice_box .inn {}

.main_notice_area .notice_box h1 {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 48px;
    padding-left: 15px;
    background: linear-gradient(90deg, #00a17a, #015440);
    border-radius: 6px;
    margin-bottom: 8px;
}

.main_notice_area .notice_box h1>div {
    display: flex;
    align-items: center;
}

.main_notice_area .notice_box h1 i {
    font-size: 21px;
    margin-right: 5px;
}

.main_notice_area .notice_box h1 span {
    color: #fc0;
    margin-left: 7px;
    font-size: 13px;
}

.main_notice_area .notice_box h1 small {
    float: right;
    color: #fff;
    margin-right: 15px;
    font-size: 12px;
}

.main_notice_area .notice_box .table_wrap {
    height: 283px;
    overflow-y: auto;
}

.main_notice_area .notice_box table tr {}

.conmain_notice_areatents .notice_box table tr th {
    text-align: center;
    height: 46px;
    background: linear-gradient(180deg, #00a17a, #015440)
}

.main_notice_area .notice_box table tr td {
    height: 46px;
    padding: 0 8px;
    font-size: 13px;
    background: linear-gradient(180deg, #fff, #f2f2f2);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
}

.main_notice_area .notice_box table tr td>div {
    height: 100%;
}

.main_notice_area .notice_box table tr td>div>div {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
}

.main_notice_area .notice_box table tr td:last-child {}

.main_notice_area .notice_box table tr td span {
    font-size: 13px !important;
}

.main_notice_area .notice_box .table_wrap.deposit td:nth-child(2) {
    color: #ffdd00;
}

.main_notice_area .notice_box ul li {
    height: 40px;
    padding: 0 8px;
    font-size: 13px;
    color: #41a8f7;
    border-bottom: 1px solid #1e8cda;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.main_notice_area .notice_box ul li span {
    margin-right: 0px;
    flex-basis: 20%;
}

.main_notice_area .notice_box ul li span:nth-child(1) {
    flex-basis: 20%;
}

.main_notice_area .notice_box ul li span:nth-child(2) {
    flex-basis: 20%;
    color: #ffdd00
}

.main_notice_area .notice_box ul li span:nth-child(3) {
    flex-basis: 60%;
    text-align: right;
}




/*** Foot ****/
.footer {
    border-top: 1px solid #393939;
    width: 100%;
    padding: 20px 0;
}

.footer_logos ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    max-width: 1265px;
    margin: 0 auto;
}

.footer_logos ul li {
    background: url('../../images/footer_logos.png?v2') no-repeat;
    width: 110px;
    height: 40px;
    display: inline-block;
    transition: 0.1s;
    margin: 10px;
}

li.ft_logos_01 {
    background-position: 0px -160px !important;
}

li.ft_logos_02 {
    background-position: -110px -160px !important;
}

.ft_logos_03 {
    background-position: -220px -160px !important;
}

.ft_logos_04 {
    background-position: -330px -160px !important;
}

.ft_logos_05 {
    background-position: -440px -160px !important;
}

.ft_logos_06 {
    background-position: -550px -160px !important;
}

.ft_logos_07 {
    background-position: -660px -160px !important;
}

.ft_logos_08 {
    background-position: -770px -160px !important;
}

.ft_logos_09 {
    background-position: -880px -160px !important;
}

.ft_logos_10 {
    background-position: -990px -160px !important;
}

.ft_logos_11 {
    background-position: 0px -200px !important;
}

.ft_logos_12 {
    background-position: -110px -200px !important;
}

.ft_logos_13 {
    background-position: -220px -200px !important;
}

.ft_logos_14 {
    background-position: -330px -200px !important;
}

.ft_logos_15 {
    background-position: -440px -200px !important;
}

.ft_logos_16 {
    background-position: -550px -200px !important;
}

.ft_logos_17 {
    background-position: -660px -200px !important;
}

.ft_logos_18 {
    background-position: -770px -200px !important;
}

.ft_logos_19 {
    background-position: -880px -200px !important;
}

.ft_logos_20 {
    background-position: -990px -200px !important;
}

.ft_logos_21 {
    background-position: 0px -240px !important;
}

.ft_logos_22 {
    background-position: -110px -240px !important;
}

.ft_logos_23 {
    background-position: -220px -240px !important;
}

.ft_logos_24 {
    background-position: -330px -240px !important;
}

.ft_logos_25 {
    background-position: -440px -240px !important;
}

.ft_logos_26 {
    background-position: -550px -240px !important;
}

.ft_logos_27 {
    background-position: -660px -240px !important;
}

.ft_logos_28 {
    background-position: -770px -240px !important;
}

.ft_logos_29 {
    background-position: -880px -240px !important;
}

.ft_logos_30 {
    background-position: -990px -240px !important;
}

.ft_logos_31 {
    background-position: 0px -280px !important;
}

.ft_logos_32 {
    background-position: -110px -280px !important;
}

.ft_logos_33 {
    background-position: -220px -280px !important;
}

.ft_logos_34 {
    background-position: -330px -280px !important;
}

.ft_logos_01:hover {
    background-position: 0px 0px !important;
}

.ft_logos_02:hover {
    background-position: -110px 0px !important;
}

.ft_logos_03:hover {
    background-position: -220px 0px !important;
}

.ft_logos_04:hover {
    background-position: -330px 0px !important;
}

.ft_logos_05:hover {
    background-position: -440px 0px !important;
}

.ft_logos_06:hover {
    background-position: -550px 0px !important;
}

.ft_logos_07:hover {
    background-position: -660px 0px !important;
}

.ft_logos_08:hover {
    background-position: -770px 0px !important;
}

.ft_logos_09:hover {
    background-position: -880px 0px !important;
}

.ft_logos_10:hover {
    background-position: -990px 0px !important;
}

.ft_logos_11:hover {
    background-position: 0px -40px !important;
}

.ft_logos_12:hover {
    background-position: -110px -40px !important;
}

.ft_logos_13:hover {
    background-position: -220px -40px !important;
}

.ft_logos_14:hover {
    background-position: -330px -40px !important;
}

.ft_logos_15:hover {
    background-position: -440px -40px !important;
}

.ft_logos_16:hover {
    background-position: -550px -40px !important;
}

.ft_logos_17:hover {
    background-position: -660px -40px !important;
}

.ft_logos_18:hover {
    background-position: -770px -40px !important;
}

.ft_logos_19:hover {
    background-position: -880px -40px !important;
}

.ft_logos_20:hover {
    background-position: -990px -40px !important;
}

.ft_logos_21:hover {
    background-position: 0px -80px !important;
}

.ft_logos_22:hover {
    background-position: -110px -80px !important;
}

.ft_logos_23:hover {
    background-position: -220px -80px !important;
}

.ft_logos_24:hover {
    background-position: -330px -80px !important;
}

.ft_logos_25:hover {
    background-position: -440px -80px !important;
}

.ft_logos_26:hover {
    background-position: -550px -80px !important;
}

.ft_logos_27:hover {
    background-position: -660px -80px !important;
}

.ft_logos_28:hover {
    background-position: -770px -80px !important;
}

.ft_logos_29:hover {
    background-position: -880px -80px !important;
}

.ft_logos_30:hover {
    background-position: -990px -80px !important;
}

.ft_logos_31:hover {
    background-position: 0px -120px !important;
}

.ft_logos_32:hover {
    background-position: -110px -120px !important;
}

.ft_logos_33:hover {
    background-position: -220px -120px !important;
}

.ft_logos_34:hover {
    background-position: -330px -120px !important;
}

.copyright {
    text-align: center;
    padding: 10px 0 0;
    color: #999;
}


/*** 스포츠 ****/
.spo_type {
    margin-top: 0px;
    border-bottom: 2px solid #246cc2;
    border-right: 0;
    border-top: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.spo_type a {
    display: inline-block;
    padding: 6px 0 5px 0;
    background: linear-gradient(180deg, #252b41 51%, #151a2d 53%, #151a2d);
    border-right: 1px solid #273c5b;
    font-size: 18px;
    text-align: center;
    width: 33.33%;
    float: left;
}

.spo_type a.active {
    background: #20203e;
    color: #fff
}

.spo_type a small {
    display: block;
    color: #478ff9;
}

.spo_jong {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-bottom: 5px;
    padding: 4px;
    background: #fff;
    border: 1px solid #ccc;
}

.spo_jong a {
    font-size: 12px;
    text-align: center;
    color: #fff;
    position: relative;
    padding: 8px 16px;
}

.spo_jong a img {
    display: block;
    margin: 0 0 3px 0;
    height: 35px;
}

.spo_jong a.on {
    border: 1px solid #f90;
}

.spo_jong a small {
    position: absolute;
    right: 0px;
    top: 0px;
    background: #f2f2f2;
    color: #dc143c;
    font-size: 12px;
    padding: 1px 5px;
}

.spo_jong a div {
    color: #111;
}

.extraOdds {
    background: #fff;
    padding: 4px !important;
    border-radius: 2px;
    margin-bottom: 6px !important;
    transition: all .1s ease-out;
    -webkit-transition: all .2s ease-out;
    border: 1px solid #ccc;
}

.extraOdds .info {
    padding: 8px 4px;
    text-align: left;
    font-size: 13px;
}

.extraOdds .info em {
    color: #5ccf61
}

.extraOdds .betBox ul li {
    flex: 1 1;
}

.extraOdds .betBox ul li:nth-child(1) {
    color: #0080ff
}

.extraOdds .betBox ul li:nth-child(2) {
    color: #f316d5
}

.extraOdds .betBox ul li:nth-child(3) {
    color: #38b658
}

.extraOdds .betBox ul li:nth-child(4) {
    color: #e4a829
}

.sports-list {
    width: 100%;
    margin-top: 0px;
    padding: 0px;
    margin-bottom: 20px;
    position: relative;
}

.sports-list .league_info {
    margin-bottom: 0px;
    background: #454545;
    display: flex;
    justify-content: left;
    align-items: center;
    height: 35px;
    padding: 0 10px;
    gap: 3px;
    font-size: 13px;
    color: #fff;
    border-top: solid 1px #fff;
}

.sports-list .league_info li {
    text-align: center;
    display: flex;
}

.sports-list .league_info li.l_info {
    margin-right: auto
}

.sports-list .league_info li.l_info .icmn-arrow-down4 {
    font-size: 11px;
    color: #787bfa;
    margin: 0 5px;
}

.sports-list .league_info li.l_info img {
    margin-left: 4px;
    height: 14px;
}

.sports-list .league_info li.l_info .l_name {
    overflow: hidden;
    margin-left: 6px;
    text-align: left;
    font-size: 12px;
    color: #fff;
}

.sports-list .league_info li.spotype_ball {
    margin-left: auto;
}

.sports-list .league_info li.spotype_ball img {
    height: 24px;
}

.sports-list .league_info .mobile_time {
    display: none;
}

.sports-list .game_list {
    width: 100%;
    position: relative;
    padding: 0;
}

.sports-list .game_list ul {
    display: flex;
    margin-bottom: 0px;
}

.sports-list .game_list ul:last-child {
    margin-bottom: 0;
}

.sports-list .game_list ul>li {
    background: linear-gradient(180deg, #fff, #f2f2f2);
    border: solid 1px #ccc;
    ;
    margin-right: 0px;
    padding: 0px 5px;
    font-size: 12px;
    height: 37px;
    display: flex;
    border-bottom: 0;
    justify-content: space-between;
    align-items: center;
}

.sports-list .game_list li:last-child {
    margin-right: 0
}

.sports-list .game_list ul li.l_time {
    padding: 0px 5px;
    border-right: 0;
    width: 10%;
    justify-content: center;
    background: #fff;
}

.sports-list .game_list ul li.l_n_time {
    padding: 0px 5px;
    color: #c5d0dd;
    border-right: 0;
    width: 10%;
    justify-content: center;
    border-bottom: solid 0px #4B4E54;
    border-top: solid 0px #4B4E54
}

.sports-list .game_list li.home-t,
.sports-list .game_list li.away {
    width: 38%;
}

.sports-list .game_list li.draw {
    border-width: 1px 0 1px 0;
}

.sports-list .game_list li.vs,
.sports-list .game_list li.draw {
    width: 10%;
    justify-content: center;
}

.sports-list .game_list li.status {
    width: 8%;
    justify-content: center;
    background: #fff;
    font-weight: 700;
    font-size: 13px;
    border-left: 0;
    color: #dc143c;
    cursor: pointer;
}

.sports-list .game_list li.home-t span.home_nm {
    display: flex;
    width: 75%;
    align-items: center;
    justify-content: left;
    text-align: left;
}

.sports-list .game_list li.home-t div.home_info {
    display: flex;
    width: 25%;
    align-items: center;
    justify-content: right;
}

.sports-list .game_list li.home-t div.home_info .game_type {
    margin-right: 5px
}

.sports-list .game_list li.home-t div.home_info .game_type .arrow_up {
    color: #f32d51;
    font-size: 12px;
}

.sports-list .game_list li.away span.away_nm {
    display: flex;
    width: 75%;
    align-items: center;
    justify-content: right;
}

.sports-list .game_list li.away div.away_info {
    display: flex;
    width: 25%;
    align-items: center;
    justify-content: left;
}

.sports-list .game_list li.away div.away_info .game_type {
    margin-left: 5px
}

.sports-list .game_list li.away div.away_info .game_type .arrow_down {
    font-size: 12px;
    color: #2b7aff;
}

.sports-list .game_list li .home_odd {
    text-align: right;
}

.sports-list .game_list li .away_odd {
    text-align: left;
}

.sports-list .game_list li .away_nm {}

.sports-list .game_list li .tie_odd {
    font-size: 12px;
}

.sports-list .game_list li.normal {
    cursor: pointer
}

.sports-list .game_list li.normal:hover {
    background: linear-gradient(180deg, #f91440, #c31234) !important;
    color: #fff;
}

.sports-list .game_list li.active {
    background: linear-gradient(180deg, #f91440, #c31234) !important;
    color: #fff;
}

.sports-list .game_list li.active:hover {
    background: linear-gradient(180deg, #f91440, #c31234) !important;
}

.sports-list .game_list li .handy {
    color: #00d2ff;
    margin: 0 3px;
}

.sports-list .game_list li .over {
    color: #aa1111;
    margin: 0 3px;
}

.sports-list .game_list li .under {
    color: #2E587C;
    margin: 0 3px;
}

.sports-list .game_list li.btn-sports-vs {
    background: #ccc
}

.sports-list .game_list li.btn-sports-vs:hover {
    background: #ccc;
    border-top: 1px solid #ccc;
    box-shadow: none;
}

.sports-list.disabled {
    filter: brightness(0.5);
}

.sports-list.disabled .league_info .info {
    display: none;
}

.sports-list.disabled .game_list li.normal {
    background: rgba(0, 0, 0, 0.6);
    cursor: default;
}

.sports-list.disabled .game_list li .home_odd {
    color: #777;
}

.sports-list.disabled .game_list li .away_odd {
    color: #777;
}

.sports-list.disabled .game_list li.vs {
    background: #22222294;
    color: #777;
}

/*** 스포츠 해외  ****/
.w_europe {
    height: calc(100% - 40px);
    overflow: hidden;
}

.w_europe:after {
    content: '';
    display: block;
    clear: both;
}

.w_europe .sw_l {
    width: calc(50% - 6px);
    float: left;
    overflow-y: auto;
    height: 100%;
    border-right: 1px solid #ccc;
    padding-bottom: 50px;
}

.w_europe .sw_r {
    width: calc(50% - 0px);
    float: right;
    overflow-y: auto;
    height: 100%;
    padding: 6px 0 50px 0;
    margin: 0 0 10px 0;
    border-radius: 2px;
}

.game_pan {
    margin-bottom: 10px;
    background: #fff;
    margin: 0 0 6px 0;
}

.game_pan.on,
.game_pan.on:hover {
    background: linear-gradient(180deg, #226173 0, hsl(193 59% 28% / 1) 50%, #1d5f72 100%);
}

.game_pan .teaminfo {
    padding: 7px 8px;
    background: linear-gradient(180deg, #fff, #f2f2f2);
    margin-bottom: 4px;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.game_pan .teaminfo .teamname {
    text-align: left;
}

.game_pan .teaminfo .teamname>div {
    gap: 4px;
    font-size: 14px;
}

.game_pan .teaminfo .teamname>div em {
    font-size: 1.32rem;
    color: #fc3b43;
}

.game_pan .teaminfo .teamname>div.l_time {
    color: #fc0;
    font-size: 12px;
    margin-top: 4px;
}

.game_pan .teaminfo .add_cnt {
    cursor: pointer;
    height: 30px;
    display: block;
    border-left: solid 0.05rem #ccc;
    padding-left: 10px;
    line-height: 30px;
}

.game_pan .teaminfo .add_cnt span {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    color: #f90;
    font-weight: 700;
}

.game_pan .game_list {
    border-radius: 2px;
    position: relative;
}

.game_pan .game_list .league_info {
    justify-content: space-between;
}

.game_pan .game_list .league_info>div {
    display: flex;
    align-items: center;
}

.sports-list .game_pan .glist {}

.sports-list .game_pan .glist ul {
    width: 80%;
}

.sports-list .game_pan .glist .l_type {
    width: 20%;
    justify-content: center;
    border-right: 0;
    display: inline-flex;
    align-items: center;
    height: 37px;
    background: #fff;
    border: solid 1px #ccc;
    border-bottom: 0;
    border-right: 0;
}

.sports-list .game_pan li.home-t,
.sports-list .game_pan li.away {
    width: 50%;
}

/* 우측 */
.game_screen {
    text-align: center;
    margin-bottom: 10px;
    height: 200px;
    background: linear-gradient(135deg, #152a1e, #143727, #1e3c2b);
    border: solid 1px #131920;
    position: relative;
}

.game_screen img {
    height: 100%;
}

.game_screen .gameinfo {
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.game_screen .team-wrap {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    background: rgb(255 255 255 / 64%);
    padding: 10px 0 0 0;
    clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);
}

.game_screen .team-wrap .team {
    font-size: 1.8rem;
    color: #000;
    padding: 6px 10px;
    font-weight: 600;
}

.game_screen .team-wrap .date {
    background: rgb(0 0 0);
    padding: 8px;
    margin: 10px 0 0 0;
    width: 100%;
    text-align: center;
    font-size: 16px;
}

.game_screen .team-wrap i {
    font-style: normal;
    color: #f30;
    font-weight: 900;
    font-size: 17px;
}

.game_exp .tit {
    display: flex;
    align-items: center;
    justify-content: left;
    height: 30px;
    margin: 10px 0 0px 0;
    padding-left: 5px;
    color: #333;
}

.game_exp .tit i {
    color: #629ad9;
}

.game_exp .game_list ul {
    gap: 3px;
    margin-bottom: 3px;
}

.game_exp .game_list ul>li {}

.game_exp .game_list li.home-t,
.game_exp .game_list li.away {
    width: 45%;
    border-bottom: 1px solid #ccc;
}


.game_tab {
    display: flex;
    margin-bottom: 10px;
}

.game_tab li {
    width: 100%;
    text-align: center;
    height: 36px;
    line-height: 36px;
    font-size: 13px;
    cursor: pointer;
    border-bottom: 2px solid #517093;
}

.game_tab .active {
    border: 2px solid #517093;
    border-bottom: 0;
    border-radius: 3px 3px 0 0;
}

.game_exp .game_list.wd33 li {
    width: 33%;
}

.game_exp .game_list.wd33 li.draw {
    justify-content: space-between;
}

.game_exp .game_list.wd33 li small {
    font-size: 12px;
    color: #d9c58a;
    margin-left: 5px;
    word-break: keep-all;
}



/*** 미니게임 ****/
.mini_vendor {
    gap: 4px;
}

.mini_vendor a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    color: #fff;
    background: #37404f;
    font-size: 13px;
    font-weight: 700;
}

.mini_vendor a.active {
    background: #ffcc00;
    color: #000;
}

.mini_jong {
    gap: 1px;
    margin-top: 5px !important;
}

.mini_jong a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    color: #fff;
    background: linear-gradient(180deg, #35353f, #161622);
    font-size: 13px;
    font-weight: 700;
}

.mini_jong a:nth-child(odd) {
    border-top: 5px solid #d60000;
}

.mini_jong a:nth-child(even) {
    border-top: 5px solid #c41162;
}

.mini_jong a.active {
    background: linear-gradient(180deg, #5a45b6, #1f1c2f);
}

.minigame-list {
    width: 100%;
    margin-top: 8px;
    padding: 0px;
    text-align: center;
    background: url(/images/pbbackground.jpg)no-repeat center;
}

.minigame-list a.view_toggle {
    display: block;
    width: 100%;
    background-image: linear-gradient(180deg, #354562, #111e33);
    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .2), 0 1px 2px rgba(0, 0, 0, .05);
    height: 30px;
    line-height: 30px;
    color: #c8e1fd;
    font-size: 15px;
}

.minigame-list .minigame-view {
    text-align: center;
    height: 646px;
    margin: 0 auto;
    overflow: hidden;
}

.minigame-list .minigame-view.active {
    display: none
}

.minigame-list .minigame-view iframe {
    width: 830px;
    transform-origin: 0px 0px 0px;
    transition: all .2s;
    border: 0;
}

.minigame-list .overunderline {
    clear: both;
    padding: 0;
    margin: 10px 0 0 0;
    width: 100%;
    height: 1px;
    border-top: 2px solid #cfcac2;
    border-bottom: 1px solid #292929;
}

.minigame-list .game-wrap {
    background: #cfcac2;
    padding: 15px 17px;
    position: relative;
}

.minigame-list .game-wrap .pd10 {
    background: #242f42;
    padding: 10px;
    border-radius: 5px;
}

.minigame-list ul.game_info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    background: linear-gradient(180deg, #1e2737, #0b1423);
    border-radius: 4px;
    border: 1px solid #18202a;
    border-bottom-color: #cfcac2;
    padding: 10px 10px
}

.minigame-list ul.game_info * {
    letter-spacing: 1px;
}

.minigame-list ul.game_info li {
    display: block;
    align-items: center;
    text-align: center
}

.minigame-list ul.game_info li.l_name {
    overflow: hidden;
    padding-left: 6px;
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    text-shadow: 0 1px 1px black;
}

.minigame-list ul.game_info li.l_name .icmn-eight-ball {
    font-size: 18px;
    margin-right: 5px;
    margin-top: -2px;
    color: #5d4eb9
}

.minigame-list ul.game_info li.l_name .order {
    color: #5d4eb9;
    font-size: 18px;
    margin: 0 5px;
    font-weight: 700;
}

.minigame-list ul.game_info li.l_name .comment {
    line-height: 24px;
    margin-left: 25px;
}

.minigame-list ul.game_info li #time {
    color: #ffcc00;
    margin-left: 10px;
    font-size: 14px;
    background: rgba(0, 0, 0, 0.25);
    padding: 10px;
    border-radius: 8px;
}

.minigame-list .listwrap {
    background: #0B1423;
    border-radius: 4px;
    margin: 0;
}

.minigame-list .listwrap>div {
    padding: 15px;
}

.minigame-list .listwrap>div h1 {
    display: flex;
    align-items: center;
}

.minigame-list .listwrap>div h1 i {
    margin: 0 5px;
    color: #0080ff
}

.minigame-list ul.game_list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    text-align: center
}

.minigame-list ul.game_list li {
    display: inline-block;
    border-radius: 4px;
    width: 49%;
    height: 90px;
    font-size: 15px;
    vertical-align: top;
    margin: auto;
    background-image: linear-gradient(180deg, #354562, #111e33);
    box-shadow: inset 0 1px 0 hsla(0, 0%, 100%, .2), 0 1px 2px rgba(0, 0, 0, .05);
}

.minigame-list ul.game_list li div.circle {
    display: inline-block;
    margin: 10px auto;
    width: 70px;
    height: 70px;
    background: #000;
    border-radius: 50%;
}

.minigame-list ul.game_list li div.circle .home_nm {
    width: 100%;
    font-size: 14px;
    margin-top: 14px;
}

.minigame-list ul.game_list li div.circle .home_odd {
    width: 100%;
    font-size: 14px;
    margin-top: 8px;
    color: #fff;
    font-weight: 700;
}

.minigame-list ul.game_list li div.circle .away_odd {
    width: 100%;
    font-size: 14px;
    margin-top: 8px;
    color: #fff;
    font-weight: 700;
}

.minigame-list ul.game_list li div.circle .away_nm {
    width: 100%;
    font-size: 14px;
    margin-top: 14px;
}

.minigame-list ul.game_list li.odd {
    cursor: pointer;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    color: #0080ff;
}

.minigame-list ul.game_list li.even {
    cursor: pointer;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    color: #5ccf61
}

.minigame-list ul.game_list li.big {
    cursor: pointer;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    padding: 0 !important;
    color: #0080ff;
}

.minigame-list ul.game_list li.mid {
    cursor: pointer;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    color: #66ff00
}

.minigame-list ul.game_list li.sm {
    cursor: pointer;
    text-shadow: 0 -1px 0 rgb(0 0 0 / 25%);
    color: #5ccf61;
}

.minigame-list ul.game_list li:hover {
    filter: contrast(1.4);
}

.minigame-list ul.game_list li.selected {
    filter: contrast(1.3);
}

.minigame-list .nobet {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9;
    display: none;
}

.minigame-list .nobet img {
    margin: 3% auto 3% auto;
    height: 100px;
}

.minigame-list .nobet p {
    font-size: 18px;
    ;
}

.hoverw {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}


/*** BET365 ****/
.bet3_jong {
    gap: 1px;
    margin-top: 5px !important;
}

.bet3_jong a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    color: #fff;
    background: #2c353c;
    font-size: 15px;
    font-weight: 700;
}

.bet3_jong a:nth-child(1) {
    border-bottom: 5px solid #fff;
}

.bet3_jong a:nth-child(2) {
    border-bottom: 5px solid #1e8567;
}

.bet3_jong a:nth-child(3) {
    border-bottom: 5px solid #ffdd00;
}

.bet3_jong a img {
    height: 30px;
    margin-right: 5px;
}

.minigame-list .chleague {
    display: flex;
    align-items: center;
    border: 2px solid #222733;
    background: #191919;
    padding: 5px 10px;
}

.minigame-list .chleague a {
    color: #fff;
    line-height: 30px;
    padding: 0 10px;
}

.minigame-list .chleague a.active {
    border-bottom: 2px solid #5d4eb9;
}

.game_list .time_limit {
    position: absolute;
    right: 10px;
    top: -12px;
    padding: 5px 20px;
    background: #5d4eb9;
    border-radius: 3px;
}


/*** 베팅내역 ****/
.gametype-button {
    margin: 10px 0;
    flex-wrap: wrap;
}

.gametype-button a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    background: #fff;
    border: solid 2px #5ccf61;
    border-radius: 36px;
    min-width: 86px;
    padding: 0 10px
}

.gametype-button a.on {
    background: #5ccf61;
    color: #fff;
    font-weight: 700;
}

.sports-list .game_list .betting_title {
    align-items: center;
}

.sports-list .game_list .betting_title li {
    background: linear-gradient(180deg, #00a17a, #015440) !important;
    width: 100%;
    justify-content: center !important;
    border: 0 !important;
    color: #fff
}

.sports-list .game_list .betting_title .gdate {
    width: 70%;
    justify-content: center;
}

.sports-list .game_list .betting_title .gresult,
.sports-list .game_list .betting_title .gscore,
.sports-list .game_list .betting_title .gname,
.sports-list .game_list .betting_title .godd {
    width: 50%;
    justify-content: center !important;
}

.sports-list .game_list .betting_title .gteam {
    width: 230%
}

.sports-list .game_list .betting_title .gleague {
    width: 100%
}

.sports-list .game_list .betting_content li {
    width: 100%;
}

.sports-list .game_list .betting_content li p {
    margin: 0;
    width: 100%;
}

.sports-list .game_list .betting_content .gdate {
    width: 70%;
    justify-content: center !important;
}

.sports-list .game_list .betting_content .gresult,
.sports-list .game_list .betting_content .gscore,
.sports-list .game_list .betting_content .gname,
.sports-list .game_list .betting_content .godd {
    width: 50%;
    justify-content: center !important;
}

.sports-list .game_list .betting_content .gteam {
    width: 230%
}

.sports-list .game_list .betting_content .gname {
    background: linear-gradient(180deg, #f91440, #c31234);
    color: #fff
}

.sports-list .game_list .betting_content .gleague {
    width: 100%;
    border-left: 0 !important;
    border-right: 0 !important
}

.sports-list .game_list .betting_content .gtype {
    justify-content: center;
}

.sports-list .game_list .betting_content .gtype,
.sports-list .game_list .betting_content .godd,
.sports-list .game_list .betting_content .gresult {
    border-left: 0 !important;
    border-right: 0 !important
}

.sports-list .game_list .betting_content .gresult span {
    color: #fff
}

.sports-list .game_list .betting_content.mini li {
    justify-content: center;
}

.st_waiting {
    background: #444;
    padding: 5px;
    color: #ccc;
    border-radius: 3px;
}

.st_success {
    background: #257fdb;
    padding: 5px;
    color: #fff;
    border-radius: 3px;
}

.st_fail {
    background: #a10000;
    padding: 5px;
    color: #fff;
    border-radius: 3px;
}


.betting-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px;
    background: #137b42;
    margin-bottom: 10px;
    color: #fff;
}


.bet_vendor {
    gap: 4px;
    border-bottom: 2px solid #5d4eb9;
    --bs-gutter-x: inherit !important;
}

.bet_vendor a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    color: #fff;
    background: #37404f;
    font-size: 13px;
    font-weight: 700;
}

.bet_vendor a.active {
    background: #171c22;
    color: #fff;
    border: 2px solid #5d4eb9;
    border-bottom: 0
}

.btn__area {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 5px 0 15px 0
}

.btn__area>div a {
    background: #2c343b;
    padding: 8px 20px;
    border-radius: 3px;
    color: #fff
}

.btn__area>div a.active {
    background: #5d4eb9;
}

.btn__area>a.del {
    background: #e42e2e;
    padding: 8px 20px;
    border-radius: 3px;
    color: #fff
}

.sports-list .bet_detail {
    padding: 5px;
    background: #252c36;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sports-list .bet_detail span {
    display: inline-block;
    padding: 6px 8px;
}

.sports-list .bet_detail span.subt {
    margin-right: 40px;
    background: #100f14;
    border: 1px solid #000;
    color: #fff;
    border-radius: 4px;
    padding: 6px 18px;
}

.sports-list .bet_detail span.mr0 {
    margin-right: 0
}

.sports-list .bet_detail a {
    display: inline-block;
    float: right;
    padding: 6px 12px;
    border-radius: 4px;
    margin-right: 5px;
}

.sports-list .bet_detail a.board {
    background: #0069ae;
    color: #fff
}

.sports-list .bet_detail a.del {
    background: #c10000;
    color: #fff
}

.sports-list .league_info.bethistory li:nth-child(1) {
    width: 40%;
    margin-right: 0;
}

.sports-list .league_info.bethistory li:nth-child(2) {
    width: 60%;
    margin-right: 0;
    justify-content: left !important;
}

.sports-list .game_list li.number input {
    margin-right: 3px;
}

.mybetmodal .modal-dialog {
    max-width: 1200px;
}

.mybetmodal .modal-content {
    background-color: #111;
    text-align: left;
}

.mybetmodal .sports-list {
    display: none;
}

@media screen and (max-width:980px) {
    .mybetmodal .modal-body {
        padding: 0;
    }

    .sports-list .game_list li {
        letter-spacing: -0.5px;
    }

    .sports-list .game_list li.number,
    .sports-list .game_list li.state {
        width: 50%;
    }

    .sports-list .game_list li.state span {
        padding: 5px 3px;
    }
}





/*** 카지노 ****/
.page-image {
    position: relative;
}

.page-image img.intro {
    width: 100%;
}

.page-image .text {
    position: absolute;
    left: 20px;
    bottom: 20px;
    background: rgba(0, 0, 0, 0.3);
    padding: 8px;
    border-radius: 8px;
}

.page-image .text img.logo {
    height: 60px;
}

.page-image .text .textsmall {
    font-size: 18px;
    font-weight: 700;
    color: #ffdd00;
    text-shadow: 0 1px 1px #000;
    margin-top: 10px
}

.casino_list {
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px
}

.live-game-cont {
    width: 19.38%;
    cursor: pointer;
    position: relative;
    transition: 0.4s;
}

.live-game-cont img {
    width: 100%;
    z-index: 1;
}

.live-game-cont img.live-play {
    z-index: 3;
    opacity: 0;
    transition: 0.4s;
    height: 80px;
    width: auto;
}

.live-game-cont .live-banner-blue2 {
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0%;
    top: 0%;
    z-index: 2;
    opacity: 0;
    transition: 0.4s;
    background: rgb(0 0 0 / 60%);
}

.live-game-cont:hover .live-play {
    opacity: 1;
}

.live-game-cont:hover .live-banner-blue2 {
    opacity: 1;
}



.slot-game-cont {
    width: 19.38%;
    cursor: pointer;
}

.slot-game-cont img {
    width: 100%;
}


.slot-game-cont-orange2 {
    width: 20%;
    float: left;
    padding: 12px;
    cursor: pointer
}

.casino_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 30px 0 10px 20px
}

.casino_title .img_card img {
    height: 64px
}

.casino_title .title {
    margin-left: 15px;
    text-align: left;
}

.casino_title .title .large {
    font-size: 20px;
    font-weight: 700;
    color: #5d4eb9;
    letter-spacing: 1.5px;
}

.casino_title .title .small {
    font-size: 12px;
    letter-spacing: 1.5px;
}

.casino_title a {
    margin-left: auto;
    margin-right: 5%;
    background: linear-gradient(to bottom, #354562, #111e33);
    padding: 10px 50px;
    font-size: 16px;
    border-radius: 5px;
    color: #fff;
    letter-spacing: 1.5px;
    text-shadow: 0 1px 1px #000;
}

.casino_title a:hover {
    filter: brightness(1.1);
}

.casino_page {
    padding: 6px 10px;
}

.casino_page .slot_list {
    width: 90%;
    text-align: center;
    margin: 0 auto 10px auto;
}

.casino_page .slot_list a {
    margin-bottom: 13px;
    transition: 0.4s;
    overflow: hidden;
    position: relative;
}

.casino_page .slot_list a:before {
    content: "";
    width: 94%;
    height: 100%;
    position: absolute;
    transition: 0.3s;
}

.casino_page .slot_list a i {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: -100px;
    transition: 0.3s;
    font-size: 84px;
    color: #fff;
}

.casino_page .slot_list a:hover i {
    bottom: 100px;
}

.casino_page .slot_list a:hover:before {
    background: rgb(0 0 0 / 45%);
}


/*** 슬롯 ****/
.slot_page {
    padding: 5px;
}

.slot_page .game_choice {
    padding: 20px 10px;
}

.slot_page .game_choice .money_movebox {
    text-align: right;
    display: flex;
    align-items: center;
}

.slot_page .game_choice .money_movebox a {
    margin-left: auto;
    margin-right: 1%;
    background: linear-gradient(to bottom, #354562, #111e33);
    padding: 10px 50px;
    font-size: 16px;
    border-radius: 5px;
    color: #fff;
    letter-spacing: 1.5px;
    text-shadow: 0 1px 1px #000;
}

.slot_page .game_choice .money_movebox input {
    background: #354562;
    height: 36px;
    border: 0;
    border-radius: 4px;
    padding: 0 10px
}

.slot_page .game_choice .slot_namebox {
    display: flex;
    flex-wrap: wrap;
    width: 900px;
    gap: 3px
}

.slot_page .game_choice .slot_namebox a {
    color: #fff;
    background: #181a1c;
    text-align: center;
    padding: 10px 0;
    border-radius: 5px;
    min-width: 105px;
}

.slot_page .game_choice .slot_namebox a.active {
    background: #5d4eb9;
}

.slot_page .slot_sub_list {
    width: 100%;
    text-align: center;
    margin: 10px auto 10px auto;
}

.slot_page .slot_sub_list a {
    margin-bottom: 10px;
    position: relative;
    transition: 0.3s;
    overflow: hidden;
    color: #fff
}

.slot_page .slot_sub_list a:nth-child(6n) {
    margin-right: 0
}

.slot_page .slot_sub_list a div {
    background: #141414;
    padding: 15px 5px;
    margin-top: -2px
}

.slot_page .slot_sub_list a img {
    width: 100%;
    border-radius: 4px;
}

.slot_page .slot_sub_list a:hover {}

.slot_page .slot_sub_list a .overlay {
    width: 100%;
    height: 184px;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.6);
    padding-bottom: 15px;
    transform: translateY(-100%);
}

.slot_page .slot_sub_list a:hover .overlay {
    animation: sbOverlayAnim 1.5s ease 1 forwards;
}

.slot_page .slot_sub_list a .overlay button {
    color: #fff;
    width: 110px;
    height: 35px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 700;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
    background: #f56406;
}






/*** 게시판 ****/
.boardinput {
    background: #fff;
    color: #f8eba1;
    padding: 18px;
    margin-bottom: 10px;
}

.boardinput input {
    width: 100%;
    height: 40px;
    border-radius: 3px;
    border: 1px solid #000;
    text-align: left;
    padding: 0 10px;
    color: #fff;
    background: #1c1c1c;
}

.boardinput textarea {
    width: 100%;
    min-height: 250px;
    border-radius: 3px;
    border: 1px solid #000;
    text-align: left;
    padding: 10px;
    color: #fff;
    margin-top: 10px;
    background: #1c1c1c;
}

.boardinput input::placeholder,
.boardinput textarea::placeholder {
    color: #fff;
}

.list_area {
    margin-top: 20px
}

.list_area h4 {
    padding: 10px;
    font-size: 20px;
    letter-spacing: 1.5px;
    text-shadow: 0 1px 1px #000;
    font-weight: 700;
}

.noticedetail th:nth-child(1),
.noticedetail td:nth-child(1) {
    width: 10%
}

.noticedetail th:nth-child(2),
.noticedetail td:nth-child(2) {
    width: 10%
}

.noticedetail th:nth-child(3),
.noticedetail td:nth-child(3) {
    width: 80%
}

.customerdetail th:nth-child(1),
.customerdetail td:nth-child(1) {
    width: 15%
}

.customerdetail th:nth-child(2),
.customerdetail td:nth-child(2) {
    width: 55%
}

.customerdetail th:nth-child(3),
.customerdetail td:nth-child(3) {
    width: 10%
}

.customerdetail th:nth-child(4),
.customerdetail td:nth-child(4) {
    width: 10%
}

.customerdetail th:nth-child(5),
.customerdetail td:nth-child(5) {
    width: 10%
}

.customer_content {
    height: auto;
}

.customer_content .replyarea {
    display: flex;
    align-items: center;
    justify-content: center;
}

.customer_content .replyarea i {
    margin-right: 5px
}

.center_reply {
    background: #f2f2f2;
    padding: 20px;
    margin: 10px;
    border-radius: 5px;
}

.wr_content {
    cursor: pointer
}


/*** 공지/규정 ****/
.evwrap {
    display: flex;
    justify-content: space-between;
    height: 100%;
    gap: 5px;
    overflow: auto;
}

.evwrap #notice_list {
    flex-wrap: wrap;
    width: 40%;
    gap: 10px;
    display: block;
    padding: 10px;
    background: #fff;
}

.evwrap #notice_list .notice_detail {
    width: 49%;
    position: relative;
    cursor: pointer;
    display: inline-block;
}

.evwrap #notice_list .notice_detail img {
    width: 100%;
}

.evwrap #notice_list .notice_detail .notice-num {
    height: 30px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #015440;
    color: #fff
}

.evwrap #notice_view {
    width: 60%;
    background: #fff;
    padding: 10px;
}

.evwrap #notice_view img {
    width: 100%;
    border-radius: 0px;
}


/*** 이벤트 ****/
.evwrap #event_list {
    flex-wrap: wrap;
    width: 40%;
    gap: 10px;
    display: block;
    padding: 10px;
    background: #fff;
}

.evwrap #event_list .event_detail {
    width: 49%;
    position: relative;
    cursor: pointer;
    display: inline-block;
}

.evwrap #event_list .event_detail img {
    width: 100%;
}

.evwrap #event_list .event_detail .event-num {
    height: 30px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #015440;
    color: #fff
}

.evwrap #event_view {
    width: 60%;
    background: #fff;
    padding: 10px;
}

.evwrap #event_view img {
    width: 100%;
    border-radius: 0px;
}

/*** 충전 ****/
.forColumn {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto auto;
    grid-column-gap: 4px;
    grid-row-gap: 4px;
}

.forColumn>.col.m1,
.forColumn>.col.m2 {
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.1);
}

.forColumn>.col.m3 {
    grid-area: 2/1/3/3;
}

.content-sub-title {
    color: #102b07;
    font-size: 16px;
    font-weight: 500;
    padding: 6px 0 6px 0px;
    display: flex;
    align-items: center;
}

.rectBox {
    font-size: 14px;
    flex: 1;
    display: flex;
    padding: 0 20px 20px 20px;
}

.rectBox .payment_method {
    display: flex;
    flex-direction: column;
    flex: 1
}

.rectBox table {
    border-collapse: collapse;
    width: 100%
}

.rectBox td {
    text-align: left;
    padding: 8px;
    color: #fff
}

.rectBox th {
    text-align: left;
    padding: 8px;
    color: #d8d8d8
}

.rectBox th {
    font-weight: 700;
    text-align: center;
    width: 15%
}

.rectBox.modInfo th {
    text-align: right;
    width: auto
}

.rectBox tr.border td,
.rectBox tr.border th {
    border: solid #000;
    border-width: 1px 0
}

.rectBox input[type=number],
.rectBox input[type=password],
.rectBox input[type=text] {
    border-radius: 4px;
    border: solid 1px #868686;
    padding: 4px;
    color: red;
    width: 100%;
    font-size: 18px;
    font-weight: 600
}

.rectBox button[type=button],
.rectBox input[type=button] {
    padding: 0px 10px;
    height: 32px;
    cursor: pointer;
    border-radius: 3px;
    white-space: nowrap;
    margin-bottom: 0px;
    text-shadow: 0 0 black;
    font-size: 14px;
    background: linear-gradient(180deg, #00a17a, #015440);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.9);
}

.rectBox button[type=button]:hover,
.rectBox input[type=button]:hover {
    background: #d7d7d7;
    color: #000
}

.rectBox button[type=button].em,
.rectBox input[type=button].em {
    color: #0e2a39;
    font-weight: 700;
    border: solid 1px #167aa3
}

.payment_method .row {
    display: flex;
    border-bottom: solid .1rem #333;
    flex: 1;
    padding: 12px 0;
}

.payment_method .row .l1 {
    flex: 1 1 20%
}

.payment_method .row .l2 {
    flex: 1 1 80%
}

.payment_method .row dl {
    margin: 0;
}

.payment_method .row dt {
    margin-top: 8px;
    margin-bottom: 4px;
}

.payment_method .row dt:first-child {
    margin-top: 0;
}

.payment_method .row dd {
    margin-left: 0;
    margin-bottom: 8px;
}

.payment_method .info-txt {
    padding: 0 0 18px 0;
}

i.emp {
    color: #fff;
    font-weight: 700;
    background: linear-gradient(to bottom, rgba(150, 33, 33, 1) 1%, rgba(80, 0, 0, 1) 100%) !important;
    padding: 3px 5px;
    border-radius: 3px;
}

button[type=button].btnMid,
input[type=button].btnMid {
    padding: 0px 16px;
    height: 34px;
    font-size: 16px;
    cursor: pointer;
    vertical-align: middle;
    background: #0d0d0d;
    color: #cccad5;
    border: solid 2px #f90;
    border-radius: 40px;
    font-weight: 700;
}

.input-cont {
    padding: 10px 0;
}

.input-info {
    line-height: 18px;
}

.rectBox input[type=text] {
    border-radius: 4px;
    border: solid 1px #868686;
    padding: 4px;
    color: red;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    height: 30px;
}

.rectBox dl dd {
    padding: 8px 0 18px 0;
    color: #002201;
}

.rectBox .row {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.input-btn-cont {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}

.input-btn-cont button {
    width: 32%;
    color: #fff
}

/* 충전유형 카드 스타일 */
.receive-type-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    margin: 10px 0;
}

.receive-type-card {
    position: relative;
    background: linear-gradient(145deg, #1a1a1a 0%, #0d0d0d 100%);
    border: 2px solid #333;
    border-radius: 8px;
    padding: 12px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.receive-type-card:hover {
    transform: translateY(-2px);
    border-color: #555;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}

.receive-type-card.active {
    border-color: #f90;
    background: linear-gradient(145deg, #2a1f0d 0%, #1a1209 100%);
    box-shadow: 0 0 20px rgba(255, 153, 0, 0.3);
}

.receive-type-card .special-badge {
    position: absolute;
    top: -8px;
    right: 10px;
    background: linear-gradient(135deg, #ff4500 0%, #ff6347 100%);
    color: #fff;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: bold;
    box-shadow: 0 2px 6px rgba(255, 69, 0, 0.6);
}

.receive-type-card .bonus-blocked-badge {
    position: absolute;
    top: -6px;
    left: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    z-index: 1;
}

.receive-type-card .bonus-blocked-badge .badge-text {
    background: linear-gradient(135deg, #ffa500 0%, #ff8c00 100%);
    color: #fff;
    padding: 2px 6px;
    border-radius: 8px;
    font-size: 9px;
    font-weight: bold;
    box-shadow: 0 1px 4px rgba(255, 165, 0, 0.5);
    display: inline-block;
}

.receive-type-card .bonus-blocked-badge .reason-tag {
    padding: 3px 7px;
    border-radius: 8px;
    font-size: 10px;
    font-weight: bold;
    display: inline-block;
    color: #fff;
}

.receive-type-card .bonus-blocked-badge .reason-보 {
    background: linear-gradient(135deg, #32cd32 0%, #228b22 100%);
    box-shadow: 0 2px 4px rgba(50, 205, 50, 0.6);
}

.receive-type-card .bonus-blocked-badge .reason-환 {
    background: linear-gradient(135deg, #e91e63 0%, #c2185b 100%);
    box-shadow: 0 2px 4px rgba(233, 30, 99, 0.6);
}

.receive-type-card .bonus-blocked-badge .reason-베 {
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%);
    box-shadow: 0 2px 4px rgba(0, 188, 212, 0.6);
}

.receive-type-card .card-header {
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid #333;
}

.receive-type-card .card-header .type-name {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 2px 0;
}

.receive-type-card .card-header .special-name {
    color: #ffa500;
    font-size: 12px;
    font-weight: 500;
}

.receive-type-card .bonus-info {
    display: flex;
    justify-content: space-around;
    margin-bottom: 4px;
}

.receive-type-card .bonus-item {
    text-align: center;
    flex: 1;
    padding: 6px 4px;
    border-radius: 6px;
    transition: all 0.3s ease;
}

.receive-type-card .bonus-item.current-bonus {
    background: rgba(255, 197, 67, 0.15);
    border: 1px solid rgba(255, 197, 67, 0.4);
    box-shadow: 0 0 10px rgba(255, 197, 67, 0.2);
}

.receive-type-card .bonus-item .label {
    display: block;
    color: #888;
    font-size: 11px;
    margin-bottom: 2px;
}

.receive-type-card .bonus-item.current-bonus .label {
    color: #ffc543;
    font-weight: 600;
}

.receive-type-card .bonus-item .value {
    display: block;
    color: #ffc543;
    font-size: 14px;
    font-weight: 700;
}

.receive-type-card .bonus-item.current-bonus .value {
    color: #ffd966;
    font-size: 16px;
    text-shadow: 0 0 8px rgba(255, 197, 67, 0.5);
}

.receive-type-card .display-text {
    color: #aaa;
    font-size: 12px;
    text-align: center;
    margin-top: 4px;
    line-height: 1.3;
}

.receive-type-card .withdraw-bonus-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    margin-top: 4px;
    border-top: 1px solid #333;
}

.receive-type-card .withdraw-bonus-info .label {
    color: #888;
    font-size: 12px;
}

.receive-type-card .withdraw-bonus-info .value {
    font-size: 13px;
    font-weight: 600;
}

.receive-type-card .withdraw-bonus-info .value.allow {
    color: #4caf50;
}

.receive-type-card .withdraw-bonus-info .value.deny {
    color: #f44336;
}

.receive-type-card .card-check {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 24px;
    color: #333;
    opacity: 0;
    transition: all 0.3s ease;
}

.receive-type-card.active .card-check {
    opacity: 1;
    color: #f90;
}

/* 보너스 배지 안내 스타일 */
.bonus-badge-info {
    margin-top: 10px;
}

.bonus-badge-info dt {
    color: #ffc543;
    font-weight: 600;
    margin-top: 12px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.bonus-badge-info dt:first-child {
    margin-top: 0;
}

.bonus-badge-info .info-badge {
    color: #fff;
    padding: 3px 8px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: bold;
    display: inline-block;
}

.bonus-badge-info dt:nth-child(1) .info-badge {
    background: linear-gradient(135deg, #32cd32 0%, #228b22 100%);
    box-shadow: 0 2px 6px rgba(50, 205, 50, 0.5);
}

.bonus-badge-info dt:nth-child(2) .info-badge {
    background: linear-gradient(135deg, #e91e63 0%, #c2185b 100%);
    box-shadow: 0 2px 6px rgba(233, 30, 99, 0.5);
}

.bonus-badge-info dt:nth-child(3) .info-badge {
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%);
    box-shadow: 0 2px 6px rgba(0, 188, 212, 0.5);
}

.bonus-badge-info dd {
    color: #aaa;
    font-size: 13px;
    line-height: 1.5;
    margin-left: 0;
    margin-bottom: 8px;
    padding-left: 10px;
    border-left: 2px solid #333;
}




/* 보너스 배지 인라인 버전 (작은 크기) */
.bonus-badge-info-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
    font-size: 11px;
    color: #002201;
}

.bonus-badge-info-inline>span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.info-badge-small {
    color: #fff;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 9px;
    font-weight: bold;
    display: inline-block;
}

.bonus-badge-info-inline>span:nth-child(1) .info-badge-small {
    background: linear-gradient(135deg, #32cd32 0%, #228b22 100%);
}

.bonus-badge-info-inline>span:nth-child(2) .info-badge-small {
    background: linear-gradient(135deg, #e91e63 0%, #c2185b 100%);
}

.bonus-badge-info-inline>span:nth-child(3) .info-badge-small {
    background: linear-gradient(135deg, #00bcd4 0%, #0097a7 100%);
}

/* 충전내역 상태 배지 스타일 */
.deposit-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}

.deposit-status i {
    font-size: 13px;
}

.deposit-status-complete {
    background: rgba(76, 175, 80, 0.15);
    color: #66bb6a;
    border: 1px solid rgba(76, 175, 80, 0.3);
}

.deposit-status-cancel {
    background: rgba(244, 67, 54, 0.15);
    color: #ef5350;
    border: 1px solid rgba(244, 67, 54, 0.3);
}

.deposit-status-pending {
    background: rgba(255, 152, 0, 0.15);
    color: #ffa726;
    border: 1px solid rgba(255, 152, 0, 0.3);
}

.btnRed {
    display: inline-flex;
    align-items: center;
    border: 0;
    justify-content: center;
    height: 40px !important;
    color: #fff;
    background: linear-gradient(to bottom, #444 1%, #666 100%) !important;
    padding: 0px 20px !important;
    font-size: 16px !important;
    border-radius: 5px !important;
}

.btnRed:hover {
    filter: brightness(1.1);
}

.btnReds {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    height: 32px !important;
    color: #fff;
    background: linear-gradient(to bottom, #444 1%, #666 100%) !important;
    padding: 0px 10px !important;
    font-size: 13px !important;
    border-radius: 3px !important;
}

.btnReds:hover {
    color: #fff !important;
}

.btn_blue.large {
    height: 40px;
    float: right;
}

.coinmodal .modal-content {
    background-color: #111;
    font-size: 13px;
    text-align: left;
}

.modal_close {
    background: none;
    color: #f2f2f2;
    font-size: 18px;
    border: 0;
    margin-left: auto;
}

.modal-header,
.modal-footer {
    border-color: #333;
}

.modal-header {
    background: linear-gradient(180deg, #00a17a, #015440);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.9);
}

.coinmodal .modal-body>div {
    padding: 10px 0;
}

.coinmodal .info {
    border: 1px solid #f60;
    padding: 10px !important;
    border-radius: 0px;
}

.coinmodal .info>div {
    line-height: 20px;
}

.coinmodal .choice>div {
    flex: 1 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.coinmodal .choice>div h5 {
    width: 100%;
    margin-bottom: 3px;
    text-align: center;
}

.coinmodal .bg,
.coinmodal select,
.coinmodal input {
    width: 100%;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #222731;
    border: 1px solid #3d4453;
    border-radius: 4px;
    padding: 0 10px;
    color: #fff;
}

.coinmodal .basic h5 {
    margin-bottom: 3px;
}

.coinmodal .basic>div {
    display: flex;
    align-items: center;
    gap: 4px;
}

.coinmodal .basic>div input {
    width: 89%;
}

.coinmodal .basic>div.bg.light {
    color: #aaa;
}

.coinmodal .basic>div.bg .fi-rr-copy-alt {
    font-size: 16px;
    cursor: pointer;
}

.coinmodal .basic>div button.adcopy {
    background: #0069ae;
    color: #fff;
    border-radius: 5px;
    width: 12%;
    height: 36px;
}

.modal-footer {
    justify-content: center;
}


.coinmodal .timelimit {
    background: #2a325d;
    padding: 10px 10px !important;
    border-radius: 5px;
    margin-bottom: 40px;
}

.coinmodal .timelimit .time-bar-container {
    width: 100%;
    height: 5px;
    background-color: #eee;
    border-radius: 5px;
    margin-top: 5px;
}

.coinmodal .timelimit .time-bar {
    height: 100%;
    background-color: #4CAF50;
    border-radius: 5px;
    transition: width 0.5s ease;
    /* 부드러운 애니메이션 효과 */
}



/* 리스트  */
.list_history {
    border-spacing: 0;
    font-size: 13px;
}

.list_history th {
    background: linear-gradient(180deg, #00a17a, #015440);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(255, 255, 255, 0.9);
    ;
    color: #fff;
    height: 35px;
    text-align: center;
}

.list_history td {
    height: 36px;
    text-align: center;
    background: #fff;
    border-bottom: solid 0.05rem #dc143c;
}

.board_list {
    border-spacing: 0;
    font-size: 13px;
}

.board_list th {
    background: #f5f5f5;
    color: #333;
    height: 40px;
    text-align: center;
    border-bottom: solid 1px #ddd;
    border-top: solid 2px #333;
}

.board_list th:first-child {
    border-radius: 5px 0 0 0;
}

.board_list th:last-child {
    border-radius: 0px 5px 0 0;
}

.board_list td {
    background: #fff;
    height: 40px;
    text-align: center;
    border-bottom: solid 1px #ddd;
    padding: 10px;
    color: #333;
}

.board_list tr:last-child td:first-child {
    border-radius: 0 0 0 5px;
}

.board_list tr:last-child td:last-child {
    border-radius: 0 0 5px 0;
}


/* 페이지넘버 */
.bbs_move_icon {
    margin: 20px auto;
}

.bbs_move_icon .el-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.bbs_move_icon .el-pagination .el-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.bbs_move_icon .el-pagination .el-pager li,
.bbs_move_icon .el-pagination button {
    background: #fff;
    border: 1px solid #fff;
    color: #111;
    border-radius: 2px;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    font-size: 12px;
}

.bbs_move_icon .el-pagination .el-pager li.active {
    background: #dc143c;
    color: #fff
}


/* 포인트 */
.pointbox {
    background: #fff;
    font-size: 14px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.pointbox .status span {
    font-weight: 700;
    color: #000;
}

.pointbox .status input {
    border-radius: 4px;
    border: solid 1px #868686;
    padding: 4px;
    color: #000;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    height: 34px;
    text-align: right;
    padding: 0 10px;
}

.pointbox .status input::placeholder {
    color: #666;
}

.pointbox .status button {
    padding: 10px 16px;
    font-size: 16px;
    cursor: pointer;
    vertical-align: middle;
    background: #0d0d0d;
    color: #cccad5;
    border: solid 2px #f90;
    border-radius: 40px;
    font-weight: 700;
    display: block;
    width: 100%;
    margin-top: 5px;
}

.pointdetail th:nth-child(1),
.pointdetail td:nth-child(1) {
    width: 10%
}

.pointdetail th:nth-child(2),
.pointdetail td:nth-child(2) {
    width: 20%
}

.pointdetail th:nth-child(3),
.pointdetail td:nth-child(3) {
    width: 50%
}

.pointdetail th:nth-child(4),
.pointdetail td:nth-child(4) {
    width: 10%
}

.pointdetail th:nth-child(5),
.pointdetail td:nth-child(5) {
    width: 10%
}

.pointbox .rectBox {
    max-width: 400px;
}

.pointbox .rectBox .input-btn-cont {
    margin: 10px auto;width: 100%;
}

.pointbox .rectBox button#point_proc {
    background: linear-gradient(180deg, #00a17a, #015440);
    height: 40px;
    width: 100%;
    color: #fff
}

/* 메세지 */
.msgdetail th:nth-child(1),
.msgdetail td:nth-child(1) {
    width: 20%
}

.msgdetail th:nth-child(2),
.msgdetail td:nth-child(2) {
    width: 60%
}

.msgdetail th:nth-child(3),
.msgdetail td:nth-child(3) {
    width: 10%
}

.msgdetail th:nth-child(4),
.msgdetail td:nth-child(4) {
    width: 10%
}

.memotitle {
    cursor: pointer;
}

.memocont {
    min-height: 150px;
    ;
}

.memocont>div {
    padding: 10px;
    background: #f2f2f2;
    line-height: 24px;
    ;
}

/* 쿠폰 */
.cpmenu {
    margin: 15px auto;
    gap: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cpmenu a {
    background: #015440;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    font-size: 16px;
    flex: 1 1;
    border-bottom: 2px solid transparent;
    color: #fff
}

.cpmenu a.on {
    border-bottom: 2px solid #5f5;
    background: #137b42;
}

.couponwrap {
    flex-wrap: wrap;
    gap: 10px;
}

.coupon-box {
    position: relative;
    width: 338px;
    height: 180px;
    cursor: pointer;
}

.coupon-box img {
    position: absolute;
    left: 0;
    top: 0;
}

.coupon-box .md-text {
    position: absolute;
    left: 13px;
    top: 18px;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    width: 216px;
}

.coupon-box .coupon-title {
    position: absolute;
    left: 13px;
    top: 76px;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    color: #000;
    width: 216px;
}

.coupon-box .coupon-expire {
    position: absolute;
    left: 13px;
    top: 33px;
    text-align: center;
    font-size: 13px;
    font-weight: 700;
    color: #000;
    width: 216px;
}

.coupon-box .left-text {
    position: absolute;
    left: 13px;
    top: 48px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #000;
    width: 216px;
}

.coupon-box .sm-text {
    position: absolute;
    left: 13px;
    top: 61px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #000;
    width: 216px;
    background:
}

.coupon-box .purple1-button {
    position: absolute;
    right: 22px;
    top: 25px;
    width: 60px;
    max-width: 100%;
    left: inherit;
    background: #000;
    color: #fff;
    border-radius: 10px;
    height: 60px;
}

.coupon-box .blue-button {
    position: absolute;
    right: 22px;
    top: 25px;
    width: 60px;
    max-width: 100%;
    left: inherit;
    background: #000;
    color: #fff;
    border-radius: 10px;
    height: 60px;
}

.coupon-box .bot {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0 10px;
    background: #333;
    height: 30px;
    border-radius: 15px;
}

.coupondetail th:nth-child(1),
.coupondetail td:nth-child(1) {
    width: 10%
}

.coupondetail th:nth-child(2),
.coupondetail td:nth-child(2) {
    width: 20%
}

.coupondetail th:nth-child(3),
.coupondetail td:nth-child(3) {
    width: 50%
}

.coupondetail th:nth-child(4),
.coupondetail td:nth-child(4) {
    width: 10%
}

.coupondetail th:nth-child(5),
.coupondetail td:nth-child(5) {
    width: 10%
}


/*  출석부*/
.w_attendance .titleCont {
    display: flex;
    flex-direction: row;
    align-items: center;
    background: #141414;
    font-size: 16px;
    padding: 6px 0 6px 12px;
    flex-wrap: wrap
}

.w_attendance .titleCont .tmo {
    display: flex;
    margin-right: 10px
}

.w_attendance .titleCont .title {
    color: #efeff9;
    padding: 0 10px 0 10px;
    font-weight: 700;
    display: flex;
    align-items: center
}

.w_attendance .titleCont .att {
    height: 38px;
    width: 38px;
    margin: 0 5px 0 5px;
    cursor: pointer
}

.w_attendance .titleCont .prev {
    background: url(../../images/att-prev.png) no-repeat center;
    background-size: 80%
}

.w_attendance .titleCont .prev:hover {
    filter: brightness(130%)
}

.w_attendance .titleCont .next {
    background: url(../../images/att-next.png) no-repeat center;
    background-size: 80%
}

.w_attendance .titleCont .next:hover {
    filter: brightness(130%)
}

.w_attendance .information {
    font-size: 14px;
    color: #ffce6d;
    line-height: 1.6;
}

.calendartop {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    background: #26282b;
    color: #9b9b9b;
    font-size: 12px;
}

#date_list .wd14 {
    width: 14.28%;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #00a17a, #015440);
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.3);
}

#date_list .wd14.day {
    height: 100px;
    background: #fff;
    border-bottom: solid 1px #ccc
}

#date_list .m-t-2 {
    display: flex;
    align-items: center;
}

.bg-attendance-blue2 {
    width: 100%;
    height: 100%;
    position: relative;
}

.bg-attendance-blue2 .text-blue2 {
    padding: 5px;
    text-align: right;
    position: absolute;
    right: 0;
}

.bg-attendance-blue2 .text-blue22 {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 5px;
}

.bg-attendance-blue2 .text-blue22 img {
    height: 100%;
}

.text-red105 {
    color: #f10000
}

.text-blue2 {
    color: #333
}

@media screen and (max-width:980px) {
    #date_list .wd14.day {
        height: 70px;
    }

    .bg-attendance-blue2 .text-blue22 img {
        height: auto;
    }
}


/* 페이지버튼*/
.pagination-wrap {
    text-align: center;
    margin: 20px auto;
}

.pagination-wrap .pagination {
    display: inline-block;
    font-size: 0px
}

.pagination-wrap .pagination ul li {
    display: inline-block;
    font-size: 12px;
    width: 40px
}

.pagination-wrap .pagination ul li a {
    color: #fff;
    text-decoration: none;
    padding: 8px 0px;
    transition: background-color .3s;
    border: 1px solid rgba(255, 255, 255, 0.05);
    background-color: rgba(0, 0, 0, .20);
    width: 100%;
}

.pagination-wrap .pagination .active a {
    color: #fff;
    text-decoration: none;
    padding: 8px 16px;
    transition: background-color .3s;
    border: 1px solid rgba(255, 255, 255, 0.05);
    background-color: rgba(0, 0, 0, .50)
}




/* 팝업 */
.popup {
    position: absolute;
    min-width: 360px;
    width: 510px;
    min-height: 403px;
    z-index: 9999;
    padding: 0px;
    box-shadow: 0 0 5px #38a8ff;
    border-radius: 12px 12px 3px 3px;
    background: #0d213f;
}

.popup .top {
    border-radius: 12px 12px 0 0;
    height: 50px;
    background: linear-gradient(180deg, #018dfa, #223b7b);
    border-bottom: 1px solid #43a6f3;
}

.popup .top h2 {
    display: inline-block;
    padding: 5px 20px;
    background: rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    border: 1px solid #43a6f3;
    margin-top: 6px;
    z-index: 1;
    position: relative;
}

.popup .top h2 img {
    height: 40px
}

.popup .title {
    height: 36px;
    line-height: 36px;
    font-size: 18px;
    background: rgba(0, 0, 0, 0.3);
    margin: 86px 20px 10px 20px;
    border-radius: 17px;
}

.popup .content {
    text-align: left;
    padding: 0px;
    font-size: 14px;
}

.popup .content img {
    width: 100%
}

.popup .close {
    height: 36px;
    line-height: 36px;
    text-align: right;
}

.popup .close>a {
    margin-right: 20px;
    margin-left: 10px;
    background: #0069ae;
    color: #fff;
    height: 24px;
    line-height: 24px;
    padding: 0 10px;
    border-radius: 2px;
}

@media screen and (max-width:980px) {
    .popup {
        background-size: 100% 100%;
        width: 100% !important;
        height: inherit !important;
        left: 0 !important;
        top: 0px !important;
        min-width: 100% !important;
    }

    .popup .title {
        height: 36px;
        margin-top: 93px;
    }

    .popup .close {
        bottom: 18px;
    }

    /* 충전유형 카드 모바일 반응형 */
    .receive-type-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }

    .receive-type-card {
        padding: 10px;
    }

    .receive-type-card .card-header .type-name {
        font-size: 15px;
    }

    .receive-type-card .bonus-item {
        padding: 5px 3px;
    }

    .receive-type-card .bonus-item .value {
        font-size: 13px;
    }

    .receive-type-card .bonus-item.current-bonus .value {
        font-size: 15px;
    }

    .receive-type-card .display-text {
        font-size: 11px;
    }

    .receive-type-card .special-badge {
        font-size: 10px;
        padding: 3px 8px;
    }

    .receive-type-card .bonus-blocked-badge .badge-text {
        font-size: 8px;
        padding: 2px 5px;
    }

    .receive-type-card .bonus-blocked-badge .reason-tag {
        font-size: 9px;
        padding: 3px 6px;
    }

    .receive-type-card .withdraw-bonus-info {
        padding: 6px 0;
    }

    .bonus-badge-info dt {
        font-size: 13px;
    }

    .bonus-badge-info .info-badge {
        font-size: 10px;
        padding: 2px 6px;
    }

    .bonus-badge-info dd {
        font-size: 12px;
    }

    .bonus-badge-info-inline {
        font-size: 10px;
        gap: 6px;
    }

    .info-badge-small {
        font-size: 8px;
        padding: 1px 5px;
    }

    .receive-type-card .withdraw-bonus-info .label {
        font-size: 11px;
    }

    .receive-type-card .withdraw-bonus-info .value {
        font-size: 12px;
    }

    .deposit-status {
        padding: 5px 10px;
        font-size: 12px;
        gap: 4px;
    }

    .deposit-status i {
        font-size: 12px;
    }

    .forColumn {
        grid-template-columns: 1fr;
    }
}





/* 반응형 1080px까지, 그 밑으론 common_m.css */

@media screen and (max-width: 1860px) {
    #sidebarinner {
        display: none;
    }
}

@media screen and (min-width: 1920px) {
    #sidebar-hamburg-orange {
        display: none;
    }
}

@media screen and (max-width: 1860px) {
    #sidebar-hamburg-orange {
        display: block;
    }
}

@media screen and (max-width: 1440px) {
    .top_wrap .nav_wrap .navdiv {
        width: 100%
    }
}

@media screen and (max-width: 1080px) {
    .right_content {
        display: none;
    }

    .container_wrap .contents {
        margin-right: 0
    }

    .top_wrap .userm_wrap ul.submenu li a .menu-badge {
        font-size: 9px;
        padding: 1px 5px;
    }
}

.animated {
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig;
}

#sidebar-hamburg-orange {
    width: 50px;
    background-color: #2e343a;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-orange:hover .img-hamburg {
    content: url("/images/ico-sideMenu-on.png")
}

div#sidebar-hamburg-orange:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

#sidebar-hamburg-blue {
    width: 50px;
    background-color: #2e343a;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-blue:hover .img-hamburg {
    content: url(/images/hamburg-on.png)
}

div#sidebar-hamburg-blue:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

#sidebar-hamburg-yellow {
    width: 50px;
    background-color: #2e343a;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-yellow:hover .img-hamburg {
    content: url(/images/hamburg-on.png)
}

div#sidebar-hamburg-yellow:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

#sidebar-hamburg-yellow1 {
    width: 50px;
    background-color: #2e343a;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-yellow1:hover .img-hamburg {
    content: url(/images/hamburg-on.png)
}

div#sidebar-hamburg-yellow1:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

#sidebar-hamburg-white {
    width: 50px;
    background-color: #dedede !important;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-white:hover .img-hamburg {
    content: url(/image/Home/white/hamburg-on.png)
}

div#sidebar-hamburg-white:hover .img-sidebutton {
    content: url(/image/Home/white/side-button-on.png)
}

#sidebar-hamburg-white1 {
    width: 50px;
    background-color: #dedede !important;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-white1:hover .img-hamburg {
    content: url(/images/hamburg-on.png)
}

div#sidebar-hamburg-white1:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

#sidebar-hamburg-red {
    width: 50px;
    background-color: #2e343a;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-red:hover .img-hamburg {
    content: url(/images/hamburg-on.png)
}

div#sidebar-hamburg-red:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

#sidebar-hamburg-gold {
    width: 50px;
    background-color: #2e343a;
    height: 100%;
    border: 1px solid #111315;
    position: relative;
    overflow: hidden;
    box-shadow: inset 0 0 10px #cfcac2;
    cursor: pointer
}

div#sidebar-hamburg-gold:hover .img-hamburg {
    content: url(/images/hamburg-on.png)
}

div#sidebar-hamburg-gold:hover .img-sidebutton {
    content: url(/images/side-button-on.png)
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}

@keyframes example-orange {
    0% {
        background-color: rgba(252, 98, 0, .1)
    }

    50% {
        background-color: rgba(252, 98, 0, .2)
    }

    to {
        background-color: rgba(252, 98, 0, .3)
    }
}

@keyframes example-blue {
    0% {
        background-color: rgba(0, 98, 252, .1)
    }

    50% {
        background-color: rgba(0, 98, 252, .2)
    }

    to {
        background-color: rgba(0, 98, 252, .3)
    }
}

@keyframes fadeInLeftBig {
    0% {
        opacity: 0;
        transform: translateX(-300px)
    }

    to {
        opacity: 1;
        transform: translateX(0)
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}

@keyframes fadeInRightBig {
    0% {
        opacity: 0;
        transform: translateX(300px)
    }

    to {
        opacity: 1;
        transform: translateX(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig;
}

@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        transform: translateY(-2000px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.fadeInUpBig {
    -webkit-animation-name: fadeInUpBig;
    animation-name: fadeInUpBig;
}

@keyframes fadeInUpBig {
    0% {
        opacity: 0;
        transform: translateY(2000px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}


.ani-up {
    animation: up-animation 0.6s steps(5, start) 5 alternate;
    -webkit-animation: up-animation 0.6s steps(5, start) 5 alternate;
}

.ani-down {
    animation: down-animation 0.6s steps(5, start) 5 alternate;
    -webkit-animation: down-animation 0.6s steps(5, start) 5 alternate;
}

@keyframes up-animation {
    from {
        opacity: 1;
        color: #fd2954;
        font-weight: 700;

    }

    to {
        opacity: 0;
        color: #fd2954;
        font-weight: 700;

    }
}

@-webkit-keyframes up-animation {
    from {
        opacity: 1;
        color: #fd2954;
        font-weight: 700;
    }

    to {
        opacity: 0;
        color: #fd2954;
        font-weight: 700;
    }
}

@keyframes down-animation {
    from {
        opacity: 1;
        color: #0495e3;
        font-weight: 700;
    }

    to {
        opacity: 0;
        color: #0495e3;
        font-weight: 700;
    }
}

@-webkit-keyframes down-animation {
    from {
        opacity: 1;
        color: #0495e3;
        font-weight: 700;
    }

    to {
        opacity: 0;
        color: #0495e3;
        font-weight: 700;
    }
}

.swiper-slide img {
    width: 100%
}


.mb-0 {
    margin-bottom: 0 !important
}

#withdraw_pass::placeholder {
    font-size: 13px;
    color: #111
}

.wd50 {
    width: 50% !important
}

.wd100 {
    width: 100% !important
}

.d-none {
    display: none
}

.w_result {
    height: 100vh;
    overflow: auto;
    text-align: center !important
}

.w_result iframe {
    background: #fff;
    margin: 0 auto;
    height: 7900px;
    width: 830px !important;
}



@font-face {
    font-family: 'SEBANG_Gothic_Bold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.0/SEBANG_Gothic_Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


.mpmenu1 {
    gap: 3px;
    margin-top: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.mpmenu1 a {
    position: relative;
    flex: 1 1;
    border: 2px solid #fff;
}

.mpmenu1 a h4 {
    position: absolute;
    top: 18px;
    left: 0px;
    width: 100%;
    font-size: 18px;
    text-align: center;
    background: linear-gradient(90deg, #fbb742 0, #854c1c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    font-family: 'SEBANG_Gothic_Bold' !important;
}

.mpmenu1 a h5 {
    position: absolute;
    top: 40px;
    left: 0px;
    width: 100%;
    font-size: 30px;
    text-align: center;
    background: linear-gradient(180deg, #e16c27 0, #753312);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    font-family: 'SEBANG_Gothic_Bold' !important;
}

.mpmenu1 a i {
    position: absolute;
    bottom: 20px;
    left: 20px;
    color: #fff;
    font-size: 14px;
    background: rgba(0, 0, 0, 0.3);
    padding: 5px;
    border-radius: 18px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mpmenu1 a img {
    width: 100%
}

.mpmenu1 a p {
    margin: 0;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    transition: 0.4s;
    padding: 0 10px;
    color: #eee;
    box-shadow: inset 0 0 50px #594009;
}

.mpmenu1 a div.direct {
    display: none;
    text-align: center;
    width: 100%;
    background: rgba(255, 255, 255, 0.3);
}

.mpmenu1 a div.direct button {
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    height: 40px;
    border-radius: 20px;
    background: #015440;
    color: #fff;
    border: 0;
    font-size: 15px;
    font-family: 'SEBANG_Gothic_Bold' !important;
}

.mpmenu1 a:hover {
    filter: brightness(1.1)
}

.mpmenu1 a:hover div.direct {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    height: 100%;
    left: 0;
    top: 0;
}


.chtab {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: 40px;
}

.chtab button {
    background: #51423e;
    color: #fff;
    padding: 8px 20px;
    border-radius: 5px;
    font-size: 15px;
    font-weight: 700;
}

.chtab button.active {
    background: linear-gradient(180deg, #00a17a, #015440);
}

.tab_content {
    display: none;
}

.app_wrap {
    padding: 15px;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 8px;
    margin: 15px;
}

.app_wrap h5 {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    height: 40px;
    border-bottom: 1px solid #444;
}

.app_wrap dl {
    margin-top: 10px;
}

.appdown {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 10px;
}

.appdown a {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.appdown a img {
    height: 80px;
}

.appdown a p {
    width: 100%;
    text-align: center;
    margin-top: 5px;
}

.app_wrap2 {
    padding: 15px;
    background: rgba(0, 0, 0, 0.35);
    border-radius: 8px;
    margin: 0px 15px;
}

.app_wrap2 h5 {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    height: 40px;
    border-bottom: 1px solid #444;
}

.app_wrap2 .appdown a {
    background: #37404f;
    padding: 10px 20px;
    border-radius: 6px;
}

@media screen and (max-width:980px) {
    .chtab {
        margin-left: 20px;
    }

    .chtab button {
        padding: 8px 10px;
        font-size: 14px;
    }

    .app_wrap {
        margin: 10px;
    }

    .app_wrap2 {
        margin: 0 10px
    }

}



.cstype {
    background: #181818;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    margin-bottom: 6px !important;
    border: 1px solid #333;
}

.cstype a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1;
    height: 30px;
    font-size: 14px;
}

.cstype a.active {
    background: linear-gradient(180deg, #00a17a, #015440);
}

.cstype .spnotice {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1;
    height: 24px;
    font-size: 14px;
}


.imgmenu {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3px;
    margin-top: 5px;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.imgmenu a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 49.4%;
}

.imgmenu a img {
    width: 100%;filter: hue-rotate(135deg);
}

.imgmenu a.f100 {
    flex: 1 1;
}


.team_search {
    background: #fff;
    padding: 4px;
    margin-bottom: 6px;
    border: 1px solid #ccc;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.team_search .inner {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1 1;
}

.team_search input {
    background: #fff;
    border: 1px solid #ccc;
    width: 100%;
    max-width: 260px;
    padding: 8px;
    border-radius: 3px;
    color: #333;
}

.team_search input::placeholder {
    color: #333
}

.team_search button {
    padding: 8px;
    border-radius: 3px;
    color: #fff;
    border: 0;
    background: #328936;
}

.mpslide {
    gap: 10px;
}

.mpslide>div {
    flex: 1 1;
    overflow: hidden;
}

.mpslide .left {
    position: relative;
}

.mpslide .left img:first-child {
    width: 100%;
}

.mpslide .left img.left_tori {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 90%;
    animation: lrmove 2s linear infinite;
}

.mpslide .swiper-slide {
    position: relative;
}

.mpslide .swiper-slide img.right_tori {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 85%;
    animation: btmove 2s linear infinite;
    width: auto;
}

@keyframes lrmove {
    0% {
        right: 0;
        /* 또는 transform: translateX(0); */
    }

    50% {
        right: 20px;
        /* 또는 transform: translateX(100px); */
    }

    100% {
        right: 0;
        /* 또는 transform: translateX(0); */
    }
}

@keyframes btmove {
    0% {
        bottom: 0;
        /* 또는 transform: translateX(0); */
    }

    50% {
        bottom: 20px;
        /* 또는 transform: translateX(100px); */
    }

    100% {
        bottom: 0;
        /* 또는 transform: translateX(0); */
    }
}


@media screen and (max-width:980px) {
    .team_search .inner {
        flex: 0 100%;
    }

    .team_search input {
        max-width: 290px;
    }

    .mpslide {
        flex-wrap: wrap;
    }

    .mpslide>div {
        flex: 0 100%;
    }

    .mpslide.before {
        margin-top: 35px;
    }

    .left_content .leftMenu .menu a.mobile {
        display: flex;
    }

    .w100 {
        width: 100% !important;
    }
}

/* ========================================
   카지노 입출금 모달 (Transfer 방식)
   ======================================== */
.casino-modal-overlay {
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: none !important;
    align-items: center;
    justify-content: center;
}

.casino-modal-overlay.show {
    display: flex !important;
}

.casino-modal-content {
    background-color: #1e1e1e;
    border-radius: 10px;
    max-width: 500px;
    width: 90%;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5);
}

.casino-modal-header {
    padding: 20px;
    border-bottom: 2px solid #333;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.casino-modal-header h3 {
    margin: 0;
    color: #fff;
    font-size: 20px;
    display: flex;
    align-items: center;
}

.casino-modal-close {
    font-size: 28px;
    color: #999;
    cursor: pointer;
    line-height: 1;
    background: none;
    border: none;
    padding: 0;
}

.casino-modal-close:hover {
    color: #fff;
}

.casino-modal-body {
    padding: 20px;
}

.casino-transfer-info {
    background-color: #2a2a2a;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 20px;
}

.casino-balance-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    color: #fff;
    font-size: 16px;
}

.casino-balance-row:not(:last-child) {
    border-bottom: 1px solid #333;
}

.casino-balance-row .label {
    display: flex;
    align-items: center;
    gap: 5px;
}

.casino-balance-row .value {
    font-weight: bold;
    color: #ffd700;
}

.casino-transfer-form {
    margin-bottom: 20px;
}

.casino-form-group {
    margin-bottom: 15px;
}

.casino-form-group label {
    display: block;
    color: #fff;
    margin-bottom: 8px;
    font-size: 14px;
}

.casino-form-control {
    width: 100%;
    padding: 12px;
    background-color: #2a2a2a;
    border: 1px solid #444;
    border-radius: 5px;
    color: #fff;
    font-size: 16px;
    box-sizing: border-box;
}

.casino-form-control:focus {
    outline: none;
    border-color: #ffd700;
}

.casino-quick-amount-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.casino-btn-amount {
    padding: 10px;
    background-color: #2a2a2a;
    border: 1px solid #444;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}

.casino-btn-amount:hover {
    background-color: #3a3a3a;
    border-color: #ffd700;
}

.casino-btn-amount.btn-max {
    background-color: #444;
    font-weight: bold;
}

.casino-transfer-notice {
    background-color: #2a2a2a;
    border-left: 3px solid #ffd700;
    padding: 15px;
    border-radius: 5px;
}

.casino-transfer-notice p {
    margin: 5px 0;
    color: #ccc;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.casino-modal-footer {
    padding: 20px;
    border-top: 2px solid #333;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.casino-modal-btn {
    padding: 12px 30px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    font-weight: bold;
    transition: all 0.3s;
}

.casino-btn-cancel {
    background-color: #444;
    color: #fff;
}

.casino-btn-cancel:hover {
    background-color: #555;
}

.casino-btn-submit {
    background-color: #ffd700;
    color: #000;
}

.casino-btn-submit:hover {
    background-color: #ffed4e;
}


@media (max-width: 768px) {
    .casino-modal-content {
        width: 95%;
    }

    .casino-modal-header h3 {
        font-size: 18px;
    }

    .casino-quick-amount-buttons {
        grid-template-columns: repeat(2, 1fr);
    }

    .casino-modal-footer {
        flex-direction: column;
    }

    .casino-modal-btn {
        width: 100%;
    }
}


/* 룰렛추가 */
.roulette_tab {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px auto;
}

.roulette_tab a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    background: #333;
    color: #fff;
    flex: 1 1;
    border-radius: 5px;
}

.roulette_tab a.active {
    background: #ff6600
}

.roulette_wrap {
    background: url('../../images/rul_bg.png?v2') no-repeat top center;
    height: 1343px;
    background-size: 100%;
    position: relative;
    text-align: center;
    overflow-y: auto;
}

.roulette_circle {
    position: relative;
    z-index: 1;
    margin-top: 100px;
}

.roulette_canvas {
    position: absolute;
    z-index: 1;
    top: 193px;
    left: 0;
    right: 0;
}

.roulette_canvas canvas {
    width: 729px;
    margin-top: -90px;
}

.roulette_pin {
    position: absolute;
    z-index: 2;
    top: 6%;
    left: 0;
    right: 0;
}

.roulette_btn {
    position: absolute;
    z-index: 2;
    top: 28.5%;
    left: 0;
    right: 0;
    height: 150px;
    text-align: center;
}

.roulette_btn img {
    cursor: pointer;
    transition: 0.3s;
}

.roulette_btn img:hover {
    transform: scale(1.1);
}

.roulette_character {
    position: absolute;
    z-index: 2;
    top: 33%;
    left: 63%;height: 500px;
}

.rulette_table {
    width: 80%;
    background-color: rgba(34, 34, 34, 0.9);
    border-radius: 15px;
    padding: 20px;
    color: #fff;
    font-family: Arial, sans-serif;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    overflow-y: auto;
    margin: 40px auto;
    z-index: 9;
    position: relative;
}

.rulette_table table th {
    background-color: #c0392b;
}

.rulette_table tr:first-child th:first-child {
    border-top-left-radius: 10px;
}

.rulette_table tr:first-child th:last-child {
    border-top-right-radius: 10px;
}

.rulette_table table th,
.rulette_table table td {
    padding: 15px;
    color: #fff;
    text-align: center;
    font-size: 14px;
}


.sweet-alert {
    /* background-color: #000; */
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.sweet-alert p {
    color: #aaa !important
}

.sweet-alert button {
    background-color: #3aab3a;
}

.sweet-alert button:hover {
    background-color: #43c543;
    color: #fff
}

.sweet-alert button.cancel {
    background-color: #333;
}

.sweet-alert button.cancel:hover {
    background-color: #444;
}

.subcategory {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 5px 0px;
}

.subcategory a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    background: #015440;
    color: #fff;
    flex: 1 1;
    border-radius: 0px;
    border-bottom: 2px solid transparent;
    gap: 5px;
    box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .1), 0px 1px 3px rgba(0, 0, 0, 0.5);
}

.subcategory a.active {
    border-bottom: 2px solid #5f5;
    background: #282828;
}

@media (max-width: 768px) {
    .roulette_wrap {
        height: auto;
    }

    .roulette_circle {
        margin-top: 11%;
        margin-left: auto;
        margin-right: auto;
        width: 95%;
    }

    .roulette_pin {
        top: 7%;
    }

    .roulette_pin img {
        height: 65px;
    }

    .roulette_canvas {
        width: 100%;
        height: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: -98.6%;
        top: inherit;
    }

    .roulette_canvas canvas {
        width: 94.5%;
        height: auto;
        margin: auto;
    }

    .roulette_btn {
        top: inherit;
        width: 23%;
        height: auto;
        margin-top: -63%;
        margin-left: 38.4%;
    }

    .roulette_character {
        display: none;
    }

    .rulette_table {
        width: 100%;
        padding: 10px;
    }

    .rulette_table table th,
    .rulette_table table td {
        padding: 10px;
        font-size: 13px;
    }
}









/* Coupon Box Text Visibility Fix */
.coupon-box .bot,
.coupon-box .bot>div {
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    /* Enhance readability */
}

/* Coupon Title Size Adjustment */
.coupon-title {
    font-size: 15px !important;
    line-height: 1.2;
}