@charset "utf-8";
/*@import url("../css/font.css");*/
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);

html {-webkit-text-size-adjust: none; text-size-adjust: none;} 
html,body {width:100%; height:100%; margin:0; padding:0;}
body {color:#333; background-color: #121518; font-size:13px; line-height:1; font-family:'Nanum Gothic',sans-serif; letter-spacing: -0.5px;}
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textare a,button,select{list-style:none; margin:0;padding:0}
img,fieldset,iframe,button {border:0 none;}
i,em,address {font-style:normal;}
input,select,button,textarea {vertical-align:middle; border:0 none; outline: none; font-family:'Nanum Gothic',sans-serif;}
input:focus,textarea:focus {outline:none}
table {border-collapse:collapse; border-spacing:0; vertical-align:middle;}

a:link, a:visited, a:hover, a:focus, a:active {text-decoration:none;}
textarea:focus,select:focus,input:focus {outline:none;}

/* HTML 5 Reset */
nav, section, article, header, aside, footer, figure, dialog {display:block}
time, progress, mark, output {display:inline}


/* 공통 CSS */
.fl {float: left;}
.fr {float: right;}
.cb {clear: both;}


/* 폰트 // 종류 */
.dotum {font-family: '돋움',dotum,sans-serif;}

/* 폰트 // 크기 */
.f11 {font-size: 11px;}
.f12 {font-size: 12px;}
.f13 {font-size: 13px;}
.f14 {font-size: 14px;}
.f15 {font-size: 15px;}
.f16 {font-size: 16px;}
.f17 {font-size: 17px;}
.f18 {font-size: 18px;}
.f19 {font-size: 19px;}
.f20 {font-size: 20px;}

/* 폰트 // 정렬 */
.tal {text-align: left;}
.tar {text-align: right;}
.tac {text-align: center;}

/* 폰트 // 색상 */
.t_red {color: #f82c2c;}
.t_blue {color: #2f8efc;}
.t_green {color: #9bd132;}
.t_gray {color: #999;}
.t_org {color: #ed8334;}
.t_white {color: #fff;}
.t_sky {color: #41e1ff;}
.t_yell {color: #ffce00;}
.t_brown {color: #d99a62;}
.t_viot {color: #ec5eef;}


/* 배경 */
.mbg {background: #121619 url(../images/i_bg.png) no-repeat center top; background-size: cover;}


/* 미니게임 아이콘 */
.mgicn {background: url(../images/minigame_icon3.png) no-repeat;}

/********************************************************
■ MAIN POPUP BG : 메인 팝업 배경
********************************************************/
.pop_bg {display: none;}
.pop_bg.on {position: fixed; top: 0; bottom: 0; left: 0; right: 0; display: block; width: 100%; height: 100vh; background-color: rgba(0,0,0,.6); z-index: 101;}


/********************************************************
■ NOSCROLL : 배경 잠금
********************************************************/
.noScroll {position:fixed; overflow:hidden; width:100%; height:100%;}


/********************************************************
■ botton : 버튼 세트
********************************************************/
.btn_st_n, .btn_st_s, .btn_st_xs, .btn_st_xxs, .btn_st_l, .btn_st_re {border-radius: 2px; -webkit-border-radius: 2px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);}

.btn_st_n {display: inline-block; line-height: 1; padding: 10px 14px 11px 14px; margin: 0 2px; background-color: #215991; text-align: center; cursor: pointer; vertical-align: middle;}
.btn_st_s {display: inline-block; line-height: 1; padding: 9px 14px 10px 14px; margin: 0 2px; background-color: #215991; text-align: center; cursor: pointer; vertical-align: middle;}
.btn_st_xs {display: inline-block; line-height: 1; padding: 6px 14px 7px 14px; margin: 0 2px; background-color: #215991; text-align: center; cursor: pointer; vertical-align: middle;}
.btn_st_xxs {display: inline-block; line-height: 1; padding: 8px 10px 9px 10px; margin: 0 2px; background-color: #215991; text-align: center; cursor: pointer; vertical-align: middle;}
.btn_st_l {display: inline-block; line-height: 1; padding: 15px 30px; margin: 0 5px; background-color: #4E7EC4; text-align: center; cursor: pointer; vertical-align: middle; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);}
.btn_st_re {display: inline-block; width: 86px; line-height: 1; padding: 30px 0; background-color: #4E7EC4; text-align: center; cursor: pointer; vertical-align: middle;}

.btst_r {background-color: #c10000; color: #f4f4f4;} /* 빨강 */
.btst_dr {background-color: #831b1b; color: #f4f4f4;} /* 다크빨강 */
.btst_b {background-color: #1561db; color: #f4f4f4;} /* 파랑 */
.btst_ydb {background-color: #4c5c7c; color: #f4f4f4;} /* 밝은딥블루 */
.btst_ddb {background-color: #3D4960; color: #f4f4f4;} /* 다크딥블루 */
.btst_bv {background-color: #0877be; color: #f4f4f4;} /* 남색 */
.btst_or {background-color: #a25a1c; color: #f4f4f4;} /* 주황 */
.btst_br {background-color: #71514a; color: #f4f4f4;} /* 갈색 */
.btst_ybr {background-color: #74573e; color: #f4f4f4;} /* 연갈색 */
.btst_y {background-color: #FFC600; color: #2A313E;} /* 노랑 */
.btst_g {background-color: #1f7443; color: #f4f4f4;} /* 녹색 */
.btst_bg {background-color: #006465; color: #f4f4f4;} /* 청록 */
.btst_p {background-color: #6f0e86; color: #f4f4f4;} /* 보라 */
.btst_yg {background-color: #597e03; color: #f4f4f4;} /* 연두 */
.btst_gry {background-color: #525252; color: #f4f4f4;} /* 회색 */

.btn_bx, .btn_bx20, .btn_row40 {content: ''; clear: both; display: block; overflow: hidden;}
.btn_bx {padding: 10px 10px 0 10px;}
.btn_bx210 {padding: 20px 10px 10px 10px;}
.btn_bx20 {padding: 20px 10px 0 10px;}
.btn_row30 {padding: 30px 0;}
.btn_row40 {padding: 40px 0;}
.btn_row20 {padding: 20px 0;}


/********************************************************
■ text input : 텍스트 입력폼
********************************************************/
::-webkit-input-placeholder {color: #444;} /* 크롬 4–56 */
:-moz-placeholder {color: #444; opacity: 1;}/* 파이어폭스 4–18 */
::-moz-placeholder {color: #444; opacity: 1;}/* 파이어폭스 19–50 */
:-ms-input-placeholder {color: #444;}/* 인터넷 익스플로러 10+ */
::placeholder {color: #444; opacity: 1;}/* 파이어폭스 51+, 크롬 57+ */
::-ms-clear {display:none} /* 인터넷 익스플로러 10+ 11 */

.checkbox {position: relative; cursor: pointer; overflow: hidden; display: inline-block; line-height: 18px; vertical-align: middle;}
.checkbox input.cb_box {position: absolute; top: 0; left: 0; opacity: 0; cursor: pointer; z-index: 5; width: 20px; height: 20px;}
.checkbox i {float: left; display: block; width: 20px; height: 20px; z-index: 3; background: url(../images/checkbox.png) no-repeat;}
.checkbox label {float: left; margin-left: 5px; margin-top: 1px; cursor: pointer; color: #bbb;}
.checkbox input.cb_box:checked+i {background-position: 0 -20px;}
.checkbox input.cb_box:checked+i+label {color: #BC8720;}

.select_st {padding: 9px 50px 8px 10px; border: 1px solid #111; background: #eee url(../images/select_down.png) no-repeat 90% 50%; color: #444; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
.select_st::-ms-expand {display: none;}

.input_st {line-height: 34px; padding: 0 10px; background-color: #1C2027; border: 1px solid #111; color: #ddd;}
.input_ip {border: 1px solid #111; background-color: #191919; color: #ddd; resize: none; font-size: 13px; letter-spacing: -0.5px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2) inset;}
.input_ip_w {border: 1px solid #111; background-color: #eee; color: #333; resize: none; font-size: 13px; letter-spacing: -0.5px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2) inset;}

.input_bx {display: inline-block; height: 34px; line-height: 32px; padding: 0 10px; margin: 0 3px; background-color: #eee; border: 1px solid #111; vertical-align: middle; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2) inset; box-sizing: border-box; -webkit-box-sizing: border-box;}
.input_bx input {display: inline-block; width: 100%; height: 100%; background-color: transparent; font-size: 13px; color: #333; letter-spacing: -0.5px;}


/********************************************************
■ LAYOUT : 레이아웃
********************************************************/
#warp {min-width: 1200px; position: relative;}
#header {position: relative;}
#container {position: relative; min-height: 640px;}
#content {position: relative; min-height: 640px; padding: 10px; margin: 40px 0 150px 0; background-color: rgba(18, 22, 25, 0.8);}
#content::after {content: ""; clear: both; display: block;}
#content_left {float: left; width: 930px; margin-right: 10px;}
#content_right {float: left; width: 240px;}
.row {position: relative; width: 1200px; margin: 0 auto;}
.row::after {content: ''; clear: both; display: block;}
@media (max-width: 1590px) {
    .warp_gm_mda {min-width: 1590px!important;}
}


/********************************************************
■ HEAD : 헤드
********************************************************/
/* area_gnb */
.area_gnb {border-bottom: 1px solid #121518; background-color: rgba(40, 42, 46, 0.6); text-align: left;}
.area_gnb h1.logo {display: inline-block; margin: 14px 0 0 0;}
.area_gnb h1.logo a {display: block;}
.area_gnb h1.logo a img {width: 120px; height: auto;}
.area_gnb .nav {float: right;} 
.area_gnb .nav::after {content: ''; clear: both; display: block; overflow: hidden;} 
.area_gnb .nav li {float: left;} 
.area_gnb .nav li a {display: inline-block; line-height: 70px; height: 70px; padding: 0 18px; font-size: 16px; color: #fff; letter-spacing: -1px; text-shadow: 1px 1px 1px rgba(17, 17, 17, 0.7); -webkit-transition: 0.3s; transition: 0.3s;} 
.area_gnb .nav li a:hover {color: #ffcc30;}
.area_gnb .nav li a .pnt_txt {animation:pnt_txt 1.5s infinite ease-in-out; -webkit-animation:pnt_txt 1.5s infinite ease-in-out;} 
@keyframes pnt_txt {
    0% {color:#a4dc2c}
    50% {color:#ffcc30}
    100% {color:#a4dc2c}
}

/* area_lib */
.area_lib {border-bottom: 1px solid #121518; background-color: rgba(29, 32, 40, 0.9);}
.area_lib .info_row {border-left: 1px solid #121518; border-right: 1px solid #121518; text-align: left; font-family:'NTS_R',Sans-serif;}
.area_lib .info_row > div {height: 60px; line-height: 60px; color: #9aa0af; font-size: 14px; letter-spacing: -0.5px;} 
.area_lib .info_row .info_more {display: inline-block; padding: 0 0 0 15px; font-size: 15px;}
.area_lib .info_row .info_more span {display: inline-block; padding: 0 22px;}
.area_lib .info_row .info_more span .msg {color: #eee;}
.area_lib .info_row .info_more span .money {color: #e9c043;}
.area_lib .info_row .info_more span .point {color: #ec5eef;}
.area_lib .info_row .info_user {float: right; padding: 0 15px; border-left: 1px solid #121518;}
.area_lib .info_row .info_user img {margin-right: 2px; vertical-align: middle;}
.area_lib .info_row .info_user .name {display: inline-block; color: #eee;}
.area_lib .info_row .info_user a {display: inline-block; line-height: 32px; padding: 0 13px; margin: 0 2px; font-size: 13px;}
.area_lib .info_row .info_user a.btn_edit {background-color: #3d4960; color: #fff;}
.area_lib .info_row .info_user a.btn_logout {background-color: #81262a; color: #fff;}

/* area_led */
.area_led {padding: 6px 0; border-bottom: 1px solid #121518; background-color: rgba(29, 32, 40, 0.9);}
.area_led .led_row { background-color: #121518;}
.area_led .led_row > div {overflow: hidden; height: 50px; line-height: 50px; margin: 0 20px;}
.area_led .led_row > div span {float: left; margin: 0 10px; font-size: 18px; letter-spacing: -2px;}

/* area_game */
.area_game {border-bottom: 1px solid #121518; background-color: rgba(40, 42, 46, 0.8);}
.area_game .nav_row {padding: 12px 0 0 0;}
.area_game .nav_row li {display: table-cell; width: 1%; text-align: center;}
.area_game .nav_row li a {display: inline-block;}
.area_game .nav_row li a:hover span {transform: rotateY(360deg); -webkit-transform: rotateY(360deg);}
.area_game .nav_row li a:hover em {border-bottom: 1px solid #ffc100; color: #ffc100;}
.area_game .nav_row li a span {display: inline-block; width: 70px; height: 70px; border-radius: 20px; -webkit-border-radius: 20px; -webkit-transition: 1s; transition: 1s; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);}
.area_game .nav_row li a em {display: block; padding: 10px 0; border-bottom: 1px solid transparent; color: #fff; font-size: 14px; text-shadow: 1px 1px 1px rgba(17, 17, 17, 0.7); -webkit-transition: 0.3s; transition: 0.3s;}
.area_game .nav_row li .crs {background-position: 0 0;}
.area_game .nav_row li .win {background-position: -72px 0;}
.area_game .nav_row li .hdy {background-position: -144px 0;}
.area_game .nav_row li .spc {background-position: -216px 0;}
.area_game .nav_row li .liv {background-position: -288px 0;}
.area_game .nav_row li .scr {background-position: -144px -144px;}
.area_game .nav_row li .fx {background-position: 0px -216px;}
.area_game .nav_row li .vsoc {background-position: -360px 0;}
.area_game .nav_row li .pwb {background-position: 0 -72px;}
.area_game .nav_row li .pwsdr {background-position: -72px -72px;}
.area_game .nav_row li .knsdr {background-position: -144px -72px;}
.area_game .nav_row li .imgm {background-position: -216px -72px;}
.area_game .nav_row li .ilts {background-position: -288px -72px;}
.area_game .nav_row li .txs {background-position: -360px -72px;}
.area_game .nav_row li .mtgame {background-position: 0 -144px;}
.area_game .nav_row li .ibst {background-position: -72px -144px;}
.area_game .nav_row li .jw {background-position: -216px -144px;}
.area_game .nav_row li .bac {background-position: -288px -144px;}
.area_game .nav_row li .slot {background-position: -360px -144px;}

/********************************************************
■ FOOTER : 하단
********************************************************/
#footer {text-align: center; padding-bottom: 50px;}
#footer h3 {padding: 20px 0; border-top: 1px solid #232831; font-size: 12px; color: #5f646e;}
#footer h3 span {color: #b4bac5;}
#footer .bt_chg {display: inline-block; line-height: 30px; padding: 0 16px; background-color: #2f3238; font-size: 13px; color: #a5adbb;}


/********************************************************
■ MAIN BANNER : 메인배너
********************************************************/
#main_banner {overflow: hidden; padding: 200px 0; margin: 60px 0 0 0;}
#main_banner::after {content: ''; clear: both; display: block;}
#main_banner .type_warp {display: flex; justify-content: center; font-size: 30px; align-items: center;}
#main_banner .type_warp h1 .type_title {overflow: hidden; color: #fff; font-weight: normal; text-align: center; letter-spacing: -7px; text-shadow: 0 0 150px #0089ff, 0 0 60px #0089ff, 0 0 10px #0089ff;}
#main_banner .type_warp h1 .type_text {font-weight: normal; color: #fff; text-shadow: 0 0 150px #efb700, 0 0 60px #efb700, 0 0 10px #efb700;}
#main_banner .type_warp h1 .cursor {display: inline-block; width: 4px; background-color: #ccc; margin-left: 10px; -webkit-animation: type_warp 1s infinite; animation: type_warp 1s infinite; box-shadow: 0 3px 6px #000;}
#main_banner .type_warp h1 .cursor.typing {animation: none;}
@keyframes type_warp {
    0%  {background-color: #ccc;}
    49% {background-color: #ccc;}
    50% {background-color: transparent;}
    99% {background-color: transparent;}
    100%  {background-color: #ccc;}
}


/********************************************************
■ WAVE WARP : 물결배경
********************************************************/
@keyframes move_wave {
    0% {transform: translateX(0) translateZ(0) scaleY(1)}
    50% {transform: translateX(-25%) translateZ(0) scaleY(0.55)}
    100% {transform: translateX(-50%) translateZ(0) scaleY(1)}
}
.wave_warp {overflow: hidden; position: absolute; left: 0; right: 0; bottom: 0; top: 0; margin: auto;}
.wave_line {overflow: hidden; position: absolute; bottom: -1px; width: 100%; height: 100%;}
.bg_t {z-index: 15; opacity: 0.5;}
.bg_m {z-index: 10; opacity: 0.75;}
.bg_f {z-index: 5;}
.wave {position: absolute; left: 0; width: 200%; height: 100%; background-repeat: repeat no-repeat; background-position: 0 bottom; transform-origin: center bottom;}
.wave_t {background-size: 50% 100px;}
.wave_ani .wave_t {animation: move-wave 3s; -webkit-animation: move-wave 3s; -webkit-animation-delay: 1s; animation-delay: 1s;}
.wave_m {background-size: 50% 120px;}
.wave_ani .wave_m {animation: move_wave 10s linear infinite;}
.wave_f {background-size: 50% 100px;}
.wave_ani .wave_f {animation: move_wave 15s linear infinite;}


/********************************************************
■ SCROLL : 스크롤 버튼
********************************************************/
.icon_scr {background: url(../images/icon_scroll.png) no-repeat;}
.scrtop {position: fixed; left: 50%; bottom: 180px; display: none; width: 40px; height: 40px; margin: 0 0 0 640px; background-color: #21252e; border: 1px solid #2F3541; z-index: 99;}
.scrtop .scrtop_btn {display: block; width: 21px; height: 21px; margin: 10px auto 0 auto; background-position: 0 0; text-indent: -99999px;}
.scrdown {position: fixed; left: 50%; bottom: 130px; display: none; width: 40px; height: 40px; margin: 0 0 0 640px; background-color: #21252e; border: 1px solid #2F3541; z-index: 99;}
.scrdown .scrdown_btn {display: block; width: 21px; height: 21px; margin: 10px auto 0 auto;  background-position: 0 0; text-indent: -99999px; transform: rotateX(-180deg); -webkit-transform: rotateX(-180deg);}


/********************************************************
■ NODATA : 데이터 없음
********************************************************/
.no_data {overflow: hidden; text-align: center; color: #999;}
.no_data::after {content: ''; clear: both; display: block;}
.no_data p {padding: 80px 0; font-size: 13px;}


/********************************************************
■ LINE BAR : 라인 바
********************************************************/
.line_bar {height: 1px; margin: 0 0 10px 0; background-color: #3E4253;}


/********************************************************
■ SEARCH : 검색
********************************************************/
.search {padding: 12px 10px; margin-bottom: 8px; background-color: #2B2F3B; border: 1px solid #111; text-align: left; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);}
.search::after {content: ''; display: block; clear: both;}
.search .sch_box {display: inline-block;}
.search .sch_left {float: left; width: 700px; color: #ccc;}
.search .sch_right {float: right; width: 400px; text-align: right;}


/********************************************************
■ MOVE : 페이지이동
********************************************************/
.move {margin: 50px auto 0 auto; text-align: center;}
.move .page {overflow: hidden;}
.move .page li {display: inline-block; min-width: 40px; height: 40px; line-height: 40px; margin: 0 2px; vertical-align: middle; background-color: rgba(18, 22, 25, 0.7); border: 1px solid #2A2E39; -webkit-transition: 0.3s; transition: 0.3s;}
.move .page li:hover {border-color: #406200;}
.move .page li:hover a {color: #aaf51c;}
.move .page li.on {border-color: #406200;}
.move .page li.on a {color: #aaf51c;}
.move .page li a {display: block; color: #aaa;}
.move .page li.next a, .move .page li.prev a {position: relative; width: 40px; height: 40px;}
.move .page li.next a::before, .move .page li.prev a::before {content: ''; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; border: 0 solid #aaa; border-width: 1px 1px 0 0;}
.move .page li.prev a::before {margin: -4px 0 0 -2px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg);}
.move .page li.next a::before {margin: -4px 0 0 -6px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}

.move .page li span {display: block; color: #aaa;}
.move .page li.on span {color: #aaf51c;}
.move .page li.next span, .move .page li.prev span {position: relative; width: 40px; height: 40px;}
.move .page li.next span::before, .move .page li.prev span::before {content: ''; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; border: 0 solid #aaa; border-width: 1px 1px 0 0;}
.move .page li.prev span::before {margin: -4px 0 0 -2px; -webkit-transform: rotate(-135deg); transform: rotate(-135deg);}
.move .page li.next span::before {margin: -4px 0 0 -6px; -webkit-transform: rotate(45deg); transform: rotate(45deg);}


/********************************************************
■ SUBTITLE : 서브타이틀
********************************************************/
.sub_title {position: relative; display: block;}
.sub_title span {display: inline-block; margin: 8px 8px 8px 8px; font-size: 22px; font-weight: normal; color: #fff; letter-spacing: -1px; text-shadow: 1px 1px 1px rgba(17, 17, 17, 0.7);}
.sub_title span::after {content: ''; display: block; clear: both; overflow: hidden; height: 2px; width: 100%; margin-top: 8px;
    background: -webkit-linear-gradient(left, #0064b2 0%, #0064b2 33%, #ffffff 33%, #ffffff 66%, #ca2228 66%, #ca2228 100%);
    background: -o-linear-gradient(left, #0064b2 0%, #0064b2 33%, #ffffff 33%, #ffffff 66%, #ca2228 66%, #ca2228 100%);
    background: linear-gradient(to right, left, #0064b2 0%, #0064b2 33%, #ffffff 33%, #ffffff 66%, #ca2228 66%, #ca2228 100%);
}


/********************************************************
■ CATEGORY BUTTON : 카테고리 버튼
********************************************************/
.cate_btn {padding: 5px; margin-bottom: 10px; background-color: #2b2f3b; border: 1px solid #111; text-align: center; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);}
.cate_btn ul {overflow: hidden; background-color: #1c2027; border: 1px solid #111;}
.cate_btn ul::after {content: ''; clear: both; display: block;}
.cate_btn ul li {display: table-cell; width: 1%; border-left: 1px solid #111;}
.cate_btn ul li:first-child {border-left: none;}
.cate_btn ul li a {display: block; padding: 12px 0; color: #aaa; font-size: 13px; -webkit-transition: 0.3s; transition: 0.3s}
.cate_btn ul li a p {display: block; padding-top: 5px;}
.cate_btn ul li a.on, .cate_btn ul li a:hover {background-color: #3e4253; color: #fff;}


/********************************************************
■ category menu : 카테고리 메뉴 - 1_08 추가
********************************************************/
.ct_btn {display: table; margin: 10px 0; border: 1px solid #111; text-align: left; font-size: 0; letter-spacing: -1px;}
.ct_btn a {display: table-cell; width: 1%; padding: 15px 0; background-color: #2B2F3B; border-left: 1px solid #111; font-size: 13px; color: #e6ded3; text-align: center; -webkit-transition: 0.3s; transition: 0.3s}
.ct_btn a:first-child {border-left: none;}
.ct_btn a.on, .ct_btn a:hover {background-color: #3E4253; color: #fff;}


/********************************************************
■ CATEGORY GAME ICON : 카테고리 게임 아이콘
********************************************************/
.game_cate {padding: 5px; margin-bottom: 10px; background-color: #2b2f3b; border: 1px solid #111; text-align: center; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);}
.game_cate::after {content: ''; clear: both; display: block;}
.game_cate ul {overflow: hidden; background-color: #1c2027; border: 1px solid #111;}
.game_cate ul li {display: table-cell; width: 1%; border-left: 1px solid #111; -webkit-transition: 0.3s; transition: 0.3s;}
.game_cate ul li:first-child {border-left: none;}
.game_cate ul li a {display: block; padding: 12px 0; color: #aaa; font-size: 12px; letter-spacing: -1px; -webkit-transition: 0.5s; transition: 0.5s;}
.game_cate ul li a p {display: block; width: 30px; height: 30px; margin: 0 auto 6px auto; background: url(../images/icon_cate.png) no-repeat; text-indent: -99999px; opacity: 0.3; -webkit-transition: 1s; transition: 1s;}
.game_cate ul li:hover, .game_cate ul li a.on {background-color: #3e4253;}
.game_cate ul li:hover a p, .game_cate ul li a.on p {transform: rotateY(360deg); -webkit-transform: rotateY(360deg); opacity: 0.8;}
.game_cate ul li a:hover, .game_cate ul li a.on{color: #fff;}

.game_cate li a p.cate0 {background-position: 0 0;}
.game_cate li a p.cate1 {background-position: -32px -64px; width: 30px; animation:cate_hot 2s infinite ease-in-out; -webkit-animation:cate_hot 2s infinite ease-in-out; opacity: 1;}
.game_cate li a p.cate2 {background-position: -32px 0;}
.game_cate li a p.cate3 {background-position: -64px 0;}
.game_cate li a p.cate4 {background-position: -96px 0;}
.game_cate li a p.cate5 {background-position: 0 -32px;}
.game_cate li a p.cate6 {background-position: -32px -32px;}
.game_cate li a p.cate7 {background-position: -64px -32px;}
.game_cate li a p.cate8 {background-position: -96px -32px;}
.game_cate li a p.cate9 {background-position: 0 -64px;}

@keyframes cate_hot {
    0% {transform: rotateY(0deg); -webkit-transform: rotateY(0deg);}
    100% {transform: rotateY(360deg); -webkit-transform: rotateY(360deg);}
}
.gm_hot {display: inline-block; width: 18px; height: 16px; margin: -3px 3px 0 0; background: url(../images/gm_hot.png) no-repeat; background-position: 0 0; vertical-align: middle;}
.gm_hot.on {background-position: -20px 0;}
.gm_hot.over {background-position: 0 0;}


/********************************************************
■ CART : 배팅카트
********************************************************/
#cart {position: relative; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);}

/*** CART -------------- head ***/
#cart .ct_hd {overflow: hidden; border-bottom: 1px solid #111; text-align: center;}
#cart .ct_hd::after {content: ''; display: block; clear: both;}
#cart .ct_hd a {float: right; display: block; width: 50px; height: 42px; line-height: 42px; border-left: 1px solid #111; color: #fff;}
#cart .ct_hd a.hold {background-color: #284c7e;}
#cart .ct_hd a.del {background-color: #8d1b1b;}
#cart .ct_hd .clock {float: left; width: 138px; height: 42px; line-height: 42px; background-color: #3e4253;}
#cart .ct_hd .clock span {font-size: 20px; color: #fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);}

/*** CART -------------- 배팅리스트 ***/
#cart .ct_list {padding: 5px 0 5px 0; background-color: #121619; font-size: 13px; letter-spacing: -1px;}
#cart .ct_list .crt_gm {position: relative; margin-top: 5px; background-color: #272C36;}
#cart .ct_list .crt_gm:first-child {margin-top: 0;}
#cart .ct_list .crt_gm p {height: 32px; line-height: 32px; border-bottom: 1px solid #111;}
#cart .ct_list .crt_gm p .tm {overflow:hidden; display: inline-block; width: 198px; padding: 0 5px; color: #aaa; white-space:nowrap; text-overflow:ellipsis;}
#cart .ct_list .crt_gm p .tm.cho {overflow:hidden; display: inline-block; width: 163px; padding: 0 5px; color: #87e540; white-space:nowrap; text-overflow:ellipsis;}
#cart .ct_list .crt_gm p .odd {float: right; width: 60px; padding: 0 3px; border-left: 1px solid #111; color: #e8bb40; text-align: center;}
#cart .ct_list .crt_gm p a {position: absolute; right: 0px; top: 0px; width: 32px; height: 32px; text-indent: -99999px;}
#cart .ct_list .crt_gm p a.del {border-left: 1px solid #111; background: #5a1e1e url(../images/icon_closs.png) no-repeat center; background-size: 20px 20px;}

/* 카트 쿠폰 */
#cart .ct_bet .ct_bet_cp {padding: 5px 10px; background-color: #2A2A2A; border-bottom: 1px solid #111; font-size: 13px;}
#cart .ct_bet .ct_bet_cp::after {content: ''; display: block; clear: both;}
#cart .ct_bet .ct_bet_cp li {line-height: 32px;}
#cart .ct_bet .ct_bet_cp li span {display: inline-block; color: #ddd; font-size: 12px;}
#cart .ct_bet .ct_bet_cp li.tx {float: left; width: 40%;}
#cart .ct_bet .ct_bet_cp li.num {float: right; width: 60%; text-align: right; letter-spacing: -0.5px;}
#cart .ct_bet .ct_bet_cp li.num span {color: #ffc600;}

/*** CART -------------- 카트정보 ***/
#cart .ct_bet {overflow: hidden; text-align: left; font-size: 13px;}
#cart .ct_bet .ct_bet_my {padding: 6px 10px; background-color: #333745; border-bottom: 1px solid #111;}
#cart .ct_bet .ct_bet_my::after {content: ''; display: block; clear: both;}
#cart .ct_bet .ct_bet_my li {line-height: 28px;}
#cart .ct_bet .ct_bet_my li span {display: inline-block;}
#cart .ct_bet .ct_bet_my li.tx {float: left; width: 40%; color: #aaa;}
#cart .ct_bet .ct_bet_my li.num {float: right; width: 60%; color: #aaa; text-align: right;}
#cart .ct_bet .ct_bet_my li.num span {color: #ffc600;}

#cart .ct_bet .ct_bet_if {padding: 5px 10px 8px 10px; background-color: #21252E; border-bottom: 1px solid #111;}
#cart .ct_bet .ct_bet_if::after {content: ''; display: block; clear: both;}
#cart .ct_bet .ct_bet_if li {line-height: 30px;}
#cart .ct_bet .ct_bet_if li span {display: inline-block; color: #fff;}
#cart .ct_bet .ct_bet_if li.tx {float: left; width: 40%; color: #aaa;}
#cart .ct_bet .ct_bet_if li.num {float: right; width: 60%; color: #aaa; text-align: right;}
#cart .ct_bet .ct_bet_if li.odd span {color: #ffc600;}
#cart .ct_bet .ct_bet_if li.num .bet_ipt {height: 28px; line-height: 28px; padding: 0 5px; border: 1px solid #333745; background-color: #191C23; box-shadow: inset 0 3px 3px rgba(0, 0, 0, 0.2);}
#cart .ct_bet .ct_bet_if li.num .bet_ipt input {width: 100%; height: 100%; border:none; background-color: transparent; font-size: 14px; text-align: right; color: #fff;}

/*** CART -------------- 머니버튼 ***/
#cart .ct_betbt {clear: both; overflow: hidden; padding: 5px 5px 0 5px; background-color: #21252E;}
#cart .ct_betbt > div {display: block; font-size: 0; margin-bottom: 5px;}
#cart .ct_betbt > div .betbt {display: inline-block; width: 73px; margin-left: 5px; padding: 10px 0; background-color: #333745; color: #ededed; font-size: 13px; cursor: pointer; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); outline: none; -webkit-transition: 0.3s; transition: 0.3s;}
#cart .ct_betbt > div .betbt:active {box-shadow: inset 0 0 0 1px #241F1E,inset 0 3px 20px rgba(0, 0, 0, 0.5);}
#cart .ct_betbt > div .betbt:first-child {margin-left: 0px;}
#cart .ct_betbt > div .betbt:hover {background-color: #4f5369; color: #fff;}
#cart .ct_betbt > div .cbt_re {width: 112px; padding: 10px 0; background-color: #8D1B1B; color: #fff;}
#cart .ct_betbt > div .cbt_re:hover {background-color: #af2424;}
#cart .ct_betbt > div .cbt_max {width: 112px; padding: 10px 0; background-color: #284C7E; color: #fff;}
#cart .ct_betbt > div .cbt_max:hover {background-color: #3361a0;}

/*** CART -------------- 배팅버튼 ***/
#cart .ct_foot {clear: both; overflow: hidden; padding: 0 0 5px 0; background-color: #191C23;}
#cart .ct_foot .betbt_now {display: block; width: 100%; padding: 13px 0; background-color: #2c6f0e; color: #fff; font-size: 18px; letter-spacing: -1px; cursor: pointer; outline: none; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); -webkit-transition: 0.3s; transition: 0.3s;}
#cart .ct_foot .betbt_now:hover {background-color: #378b11; color: #fff;}
#cart .ct_foot .betbt_now:active {box-shadow: inset 0 0 0 1px #241F1E,inset 0 3px 30px rgba(0, 0, 0, 0.5);}

/*** CART -------------- 배너 ***/
#cart .ct_banner {display: block; background-color: #191C23;}
#cart .ct_banner img {width: 100%; height: auto;}


/********************************************************
■ GAME : 게임
********************************************************/
/*** GAME -------------- 데이타 ***/
.game_data {font-family: "돋움",Dotum,Helvetica,'Apple SD Gothic Neo',Sans-serif;}
.game_row {display: block; font-family: "돋움",Dotum,Helvetica,'Apple SD Gothic Neo',Sans-serif;}

/*** GAME -------------- 헤드 ***/
.game_head {overflow: hidden; margin-bottom: 10px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); font-family:'Nanum Gothic',sans-serif;}
.game_head table {width: 100%; table-layout: fixed; background-color: #333745; border-bottom: 1px solid #4c5065;}
.game_head table thead th {height: 40px; color: #ccc; font-size: 13px; letter-spacing: -1px; font-weight: normal;}

/*** GAME -------------- 게임 리그 ***/
.g_head {clear: both; overflow: hidden; height: 34px; line-height: 34px; margin: 12px 0 6px 0; color: #ddd; text-align: left; letter-spacing: -1px; font-family:'Nanum Gothic',sans-serif;
    background-color: #1d2129; 
   /* background: -webkit-linear-gradient(left, #232731 0%, #1d2129 66%, transparent 77%, transparent 100%);
    background: -o-linear-gradient(left, #232731 0%, #1d2129 66%, transparent 77%, transparent 100%);
    background: linear-gradient(to right, left, #232731 0%, #1d2129 66%, transparent 77%, transparent 100%);*/
}
.g_head img {width: 26px; height: 16px; margin: -3px 0 0 5px; vertical-align: middle;}
.g_head span {display: inline-block; margin-left: 10px; font-size: 14px; letter-spacing: -0.5px;}
.g_head em {text-decoration: none; color: #aaa; font-weight: normal;}
.g_head em strong {color: #e2be7d; font-weight: normal;}

/*** GAME -------------- 리그명 컬러 ***/
.g_league_1 {color: #76d330;}
.g_league_2 {color: #f8376b;}
.g_league_3 {color: #e649fa;}
.g_league_4 {color: #fa7949;}
.g_league_5 {color: #00d3db;}
.g_league_6 {color: #00c45b;}

/*** GAME -------------- 크로스 펼침 ***/
.game_sub {display: none;}
.game_sub.on {display: block}

/*** GAME -------------- 게임 레이아웃 ***/
.g_item {overflow: hidden; display: block;}
.g_item::after {content: ''; display: block; clear: both;}
.g_item li {float: left; height: 40px; line-height: 40px; margin-bottom: 1px; letter-spacing: 0px;}
.g_item li img {display: inline-block; vertical-align: middle;}

/*** GAME -------------- 게임 레이아웃 날짜 ***/
.g_day {width: 76px; text-align: center; color: #666; font-size: 11px;}
.g_day span {color: #b19e7b;}

/*** GAME -------------- 게임 레이아웃 기본 ***/
.g_home {width: 320px; margin-right: 1px; padding: 0 5px; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s; font-weight: bold;}
.g_odd {width: 60px; margin-right: 1px; text-align: center; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s; font-weight: bold;}
.g_away {width: 320px; padding: 0 5px; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s; font-weight: bold;}

/*** GAME -------------- 게임 레이아웃 핸디 ***/
.g_home_h_s {width: 346px; margin-right: 1px; padding: 0 5px; cursor: pointer; font-weight: bold;}
.g_odd_h_s {width: 60px; margin-right: 1px; text-align: center; cursor: pointer; font-weight: bold;}
.g_away_h_s {width: 346px; padding: 0 5px; cursor: pointer; font-weight: bold;}

/*** GAME -------------- 게임 레이아웃 스코어 ***/
.g_home_sc {width: 341px; margin-right: 1px; padding: 0 5px; cursor: pointer; font-weight: bold;}
.g_odd_sc {width: 60px; margin-right: 1px; text-align: center; cursor: pointer; font-weight: bold;}
.g_away_sc {width: 341px; padding: 0 5px; cursor: pointer; font-weight: bold;}

/*** GAME -------------- 게임 레이아웃 결과 ***/
.g_home_ed {width: 310px; margin-right: 1px; padding: 0 5px; cursor: pointer; font-weight: bold;}
.g_odd_ed {width: 71px; margin-right: 1px; text-align: center; cursor: pointer; font-weight: bold;}
.g_away_ed {width: 310px; padding: 0 5px; cursor: pointer; font-weight: bold;}

/*** GAME -------------- 게임 레이아웃 공통 ***/
.g_home_nt, .g_home_n, .g_home_o, .g_home_d {width: 82%; float: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.g_away_nt, .g_away_n, .g_away_o, .g_away_d  {width: 82%; float: right; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.g_home_odd_nt, .g_home_odd_n, .g_home_odd_o, .g_home_odd_d {width: 18%; float: right; position: relative; letter-spacing: -0.5px;}
.g_away_odd_nt, .g_away_odd_n, .g_away_odd_o, .g_away_odd_d {width: 18%; float: left; position: relative; letter-spacing: -0.5px;}
.g_odd_nt, .g_odd_n, .g_odd_o, .g_odd_d, .g_odd_h {display: block;}

.g_home_nt {color: #f4f4f4; text-align: left; font-size: 12px;}
.g_home_odd_nt {color: #e8bb40; text-align: right; font-size: 12px;}
.g_odd_nt {color: #e8bb40; text-align: center; font-size: 12px;}
.g_away_odd_nt {color: #e8bb40; text-align: left; font-size: 12px;}
.g_away_nt {color: #f4f4f4; text-align: right; font-size: 12px;}

.g_home_n {color: #f4f4f4; text-align: left; font-size: 12px;}
.g_home_odd_n {color: #e8bb40; text-align: right; font-size: 12px;}
.g_odd_n {color: #e8bb40; text-align: center; font-size: 12px;}
.g_away_odd_n {color: #e8bb40; text-align: left; font-size: 12px;}
.g_away_n {color: #f4f4f4; text-align: right; font-size: 12px;}

.g_home_o {color: #000; text-align: left; font-size: 12px;}
.g_home_odd_o {color: #000; text-align: right; font-size: 12px;}
.g_odd_o {color: #000; text-align: center; font-size: 12px;}
.g_away_odd_o {color: #000; text-align: left; font-size: 12px;}
.g_away_o {color: #000; text-align: right; font-size: 12px;}
.g_home_o span, .g_away_o span {color: #000!important;}

.g_home_d {color: #777; text-align: left; font-size: 12px;}
.g_home_odd_d {color: #777; text-align: right; font-size: 12px;}
.g_odd_d {color: #777; text-align: center; font-size: 12px;}
.g_away_odd_d {color: #777; text-align: left; font-size: 12px;}
.g_away_d {color: #777; text-align: right; font-size: 12px;}

.g_odd_h {color: #FFC600; text-align: center;}

/*** GAME -------------- 게임 레이아웃 기타 ***/
.g_more {text-align: center; font-size: 13px; letter-spacing: -0.5px!important;}
.g_more img {vertical-align: middle;}
.g_more.list {width: 50px;}
.g_more.icon {width: 40px;}
.g_more.bet {width: 40px;}
.g_more.bet .mrbt {color: #999;}
.g_more.bet .mred {color: #666;}
.g_more.scr {width: 70px; color: #666;}
.g_more.win {width: 60px; color: #999;}

/*** GAME -------------- 게임 레이아웃 펼침 ***/
.g_list_hold {background-color: #711616;}
.g_list_hold span {color: #ffc600;}
.g_list_hold em {color: #e2e7f2;}
.g_list_view {background-color: #2F3541;}
.g_list_view span {color: #ffc600;}
.g_list_view em {color: #e2e7f2;}

.g_list_hold, .g_list_view {width: 49px; height: 40px; margin-left: 1px; line-height: 40px; display: inline-block; cursor: pointer; text-align: center;}
.g_list_hold span, .g_list_view span {display: inline-block; line-height: 1; font-size: 12px; margin: 0 5px 0 0;}
.g_list_hold em, .g_list_view em {display: inline-block; line-height: 1; font-size: 12px; font-weight:bold; }    

/*** GAME -------------- 게임 레이아웃 색상 ***/
.g_gr_nt {background-color: #1d3f4b;}
.g_gr_nto {background-color: #214755;}
.g_gr_nth {background-color: #152b34;}
.g_gr_n {background-color: #2F3541;}
.g_gr_o {background-color: #e8b500;}
.g_gr_c {background-color: #f2be31;}
.g_gr_d {background-color: #21252a;}
.g_gr_h {background-color: #232731;}
.g_gr_sc {background-color: #272d38;}

/*** GAME -------------- 게임 레이아웃 스코어 ***/
.score_box {display: block; margin: 3px 90px 10px 76px;}
.score_box ul {padding: 0 1px 0 0; box-sizing: border-box; -webkit-box-sizing: border-box;}
.score_box ul:last-child {padding: 0}
.score_box.end {display: block; margin: 0 131px 10px 336px;}
.score_box.mbt {display: block; margin: 0 101px 10px 247px;}

.score_line {display: table-cell; width: 1%; vertical-align: top;}
.score_line li {height: 32px; line-height: 32px; font-size: 12px; margin-bottom: 1px; padding: 0 5px; box-sizing: border-box; -webkit-box-sizing: border-box; font-weight: bold;}
.score_line li a {display: block; -webkit-transition: 0.3s; transition: 0.3s;}
 
/*** GAME -------------- 게임결과 // 리그종목 ***/
.g_evt {width: 40px; height: 36px; line-height: 36px; text-align: center;} 
.g_evt img {vertical-align: middle;}
.g_lg {width: 220px; height: 36px; line-height: 36px; text-align: left; vertical-align: middle; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.g_lg img {width: 26px; height: 16px; margin: -2px 0 0 5px; vertical-align: middle;}
.g_lg span {color: #ccc; letter-spacing: -1px;}

/*** GAME -------------- 게임결과 // 종합정보 ***/
.g_info {padding: 5px; background-color: #2B2F3B; margin-top: 5px;}
.g_info ul {display: table; background-color: #1C2027; border: 1px solid #111; color: #999;}
.g_info ul li {display: table-cell; width: 1%; height: 34px; line-height: 34px; text-align: center;}
.g_info ul li input[type="checkbox"] {vertical-align: middle; height: 34px; line-height: 34px;}



/********************************************************
■ SIDE CATE : 사이드 카테고리
********************************************************/
.side_cate {position: absolute; top: 59px; right: 50%; width: 180px; margin-right: 610px; background-color: #121619; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);}
.side_cate h3 {background-color: #2F3541; border-bottom: 1px solid #141414;}
.side_cate h3 a {display: block; line-height: 36px; padding: 0 10px; color: #ffc400; font-size: 13px; font-weight: normal;}

.cate_row {display: block;}
.cate_row .ct_tit {line-height: 30px; padding: 0 3px; background-color: #21252E; border-bottom: 1px solid #080808; cursor: pointer;}
.cate_row .ct_tit img {width: 17px; height: 17px; margin: 0 2px 0 0; vertical-align: middle;}
.cate_row .ct_tit .cate_name {color: #ccc;}

.cate_row .ct_list {overflow: hidden;}
.cate_row .ct_list::after {content: ''; clear: both; display: block;}
.cate_row .ct_list li {line-height: 30px; padding: 0 3px; border-bottom: 1px solid #080808; cursor: pointer; -webkit-transition: 0.3s; transition: 0.3s;}
.cate_row .ct_list li:hover {background-color: #2F3541;}
.cate_row .ct_list li img {width: 26px; height: 16px; margin: -2px 2px 0 0; vertical-align: middle;}
.cate_row .ct_list li span {color: #999; font-size: 12px;}
.cate_row .ct_list li em {color: #76d330; font-size: 12px;}


/********************************************************
■ VR SOCCER : 가상축구
********************************************************/
.vr_soccer {overflow: hidden; margin: 0 0 10px 0;}
.vr_soccer .vrc_iframe {margin: 0 0 10px 0; background-color: #121619; border: 1px solid #111;}
.vr_soccer .vrc_iframe iframe {display: block; margin: 0 auto;}
.vr_soccer .vrc_bar {margin: 0 0 10px 0;}
.vr_soccer .vrc_bar a {display: inline-block; line-height: 34px; padding: 0 12px; margin: 0 3px; background-color: #333745; color: #ccc; -webkit-transition: 0.3s; transition: 0.3s;}
.vr_soccer .vrc_bar a:hover, .vr_soccer .vrc_bar a.on {background-color: #284C7E; color: #fff;}


/********************************************************
■ MINIGAME IFRAME : 미니게임 아이프레임
********************************************************/
.iframe_box {height: 500px; text-align: center; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);}
.iframe_box iframe {width: 920px; height: 500px; margin: 0 auto;}

.iframe_bst {text-align: center; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);}
.iframe_bst iframe {margin: 0 auto;}

.iframe_mgm {text-align: center; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);}
.iframe_mgm iframe {margin: 0 auto;}

.iframe_lts {text-align: center; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);}
.iframe_lts iframe {margin: 0 auto;}


/********************************************************
■ GAME TAB SCROLL : 게임 가로리스트
********************************************************/
/*** GAME TAB -------------- 게임텝 ***/
.tab_menu {clear: both; overflow: hidden; width: 928px; border: 1px solid #111; margin: 10px auto; box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);}
.tab_menu .tab_h {border-collapse: collapse;} 
.tab_menu .tab_h::after {content: ''; clear: both; display: block;}
.tab_menu .tab_h li {position: relative; display: table-cell; width: 1%; text-align:center; cursor: pointer; height: 40px; line-height: 40px; border-left: 1px solid #111; border-bottom: 1px solid #111; background-color: #1C2027; color: #aaa; font-size: 13px;}
.tab_menu .tab_h li:first-child {border-left: none;}
.tab_menu .tab_h li.active {background-color: #3E4253; color: #eee!important; border-bottom-color: #3E4253;} 
.tab_menu .tab_content {clear: both; width: 918px; padding: 5px; background-color: #3E4253;} 
.tab_menu .tab_view {display: none;}  

/*** GAME TAB -------------- 가로리스트 ***/
.chart_row {clear: both; overflow: hidden;}
.chart_list {width: 918px; overflow-x: auto; display: block;}
.chart_list table {table-layout:fixed; border-collapse: collapse;}
.chart_list .chart_line {width: 46px; text-align: center;}
.chart_list .chart_line tr {height: 40px;}
.chart_list .chart_line tr th {background-color: #2B2F3B; border: 1px solid #111; font-size: 14px; color: #ccc; font-weight: normal;}
.chart_list .chart_line tr td {background-color: #21252E; border: 1px solid #111;}

/*** GAME TAB -------------- 가로리스트 볼 ***/
.ball_bg_1, .ball_bg_2, .ball_bg_3, .ball_bg_4 {position: relative; display: block; width: 34px; height: 34px; margin: 2px auto 0 auto; color: #fff; font-size: 13px; border-radius: 50px; -webkit-border-radius: 50px;}
.ball_bg_1 span, .ball_bg_2 span, .ball_bg_3 span, .ball_bg_4 span {position: absolute; left: 0; top: 11px; display: block; width: 100%; font-size: 12px; text-align: center; text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3); letter-spacing: 0px;}
.ball_bg_1 em, .ball_bg_2 em, .ball_bg_3 em, .ball_bg_4 em {display: block; width: 12px; height: 12px; line-height: 12px; background-color: #222; font-size: 9px; color: #ffd319; border-radius: 30px; -webkit-border-radius: 30px;}

.ball_bg_1 em.lem, .ball_bg_2 em.lem, .ball_bg_3 em.lem, .ball_bg_4 em.lem {position: absolute; left: 0; top: 0;}
.ball_bg_1 em.rem, .ball_bg_2 em.rem, .ball_bg_3 em.rem, .ball_bg_4 em.rem {position: absolute; right: 0; top: 0;}

.ball_bg_1 {background-color: #0467aa;}
.ball_bg_2 {background-color: #b42525;}
.ball_bg_3 {background-color: #009333;}
.ball_bg_4 {background-color: #953cbc;}


/********************************************************
■ POWER BALL : 파워볼
********************************************************/
/*** POWER BALL -------------- 파워볼 레이아웃 ***/
.pwb_title {width: 102px; text-align: center; color: #5f6b80; font-size: 12px; letter-spacing: -1px!important;}
.pwb_score {width: 131px; text-align: center; color: #5f6b80; font-size: 12px; letter-spacing: -1px!important;}

.pwb_n, .pwb_o, .pwb_d {float: left; padding: 0 5px 0 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 12px; font-weight: bold;}
.pwb_odd_n, .pwb_odd_o, .pwb_odd_d {width: 50px; float: right; text-align: right; font-size: 12px; font-weight: bold;}

.pwb_day {width: 101px; padding: 0 0 0 10px; text-align: left; color: #999; letter-spacing: 1px; font-size: 12px;}

.pwb_lg {width: 101px; padding: 0 0 0 10px; text-align: left; color: #ccc; letter-spacing: 2px;}
.pwb_lg em {color: #fddb4c;}

.pwb_n {color: #f4f4f4;}
.pwb_odd_n {color: #e8bb40; text-align: right;}
.pwb_o {color: #000;}
.pwb_odd_o {color: #000; text-align: right;}
.pwb_d {color: #777;}
.pwb_odd_d {color: #777; text-align: right;}

.pwb_t_1 {color: #e8e0f5;}
.pwb_t_2 {color: #c5b0e6;}
.pwb_t_3 {color: #a684dd;}
.pwb_t_4 {color: #9568dd;}

/*** POWER BALL -------------- 파워볼 일반 ***/
.pwb_1_1, .pwb_1_2 {width: 403px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_1_1 {margin-right: 1px;}

.pwb_2_1, .pwb_2_2, .pwb_2_3 {width: 265px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_2_1, .pwb_2_2 {margin-right: 1px;}

.pwb_3_1, .pwb_3_2, .pwb_3_3, .pwb_3_4, .pwb_3_5, .pwb_3_6 {width: 127px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_3_1, .pwb_3_2, .pwb_3_3, .pwb_3_4, .pwb_3_5 {margin-right: 1px;}

.pwb_4_1, .pwb_4_2, .pwb_4_3, .pwb_4_4 {width: 196px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_4_1, .pwb_4_2, .pwb_4_3 {margin-right: 1px;}

/*** POWER BALL -------------- 파워볼 결과 ***/
.pwb_ed_1_1, .pwb_ed_1_2 {width: 514px;}
.pwb_ed_1_1 {margin-right: 1px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_ed_1_2 {padding: 0 5px; cursor: pointer; text-align: left;}

.pwb_ed_2_1, .pwb_ed_2_2 {width: 339px; margin-right: 1px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_ed_2_3 {width: 339px; padding: 0 5px; cursor: pointer; text-align: left;}

.pwb_ed_3_1, .pwb_ed_3_2, .pwb_ed_3_3, .pwb_ed_3_4, .pwb_ed_3_5, .pwb_ed_3_6 {margin-right: 1px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_ed_3_1 {width: 164px;}
.pwb_ed_3_2 {width: 164px;}
.pwb_ed_3_3 {width: 164px;}
.pwb_ed_3_4 {width: 164px;}
.pwb_ed_3_5 {width: 164px;}
.pwb_ed_3_6 {width: 164px; margin-right: 0!important;}

.pwb_ed_4_1, .pwb_ed_4_2, .pwb_ed_4_3, .pwb_ed_4_4 {margin-right: 1px; padding: 0 5px; cursor: pointer; text-align: left;}
.pwb_ed_4_1 {width: 251px;}
.pwb_ed_4_2 {width: 252px;}
.pwb_ed_4_3 {width: 251px;}
.pwb_ed_4_4 {width: 252px; margin-right: 0!important;}

/*** POWER BALL -------------- 파워볼 결과정보 ***/
.g_pwb_info {overflow: hidden; margin-top: 5px; background-color: #20242E; border-bottom: 1px solid #2F3541;
}
.g_pwb_info p {height: 34px; line-height: 34px; text-align: right; padding-right: 20px; color: #777;}
.g_pwb_info p span {color: #ddd; margin: 0 5px;}
.g_pwb_info p em {color: #ea38c1; margin: 0 5px;}
.g_pwb_info p strong {color: #ffc400; margin: 0 5px; font-weight: normal;}


/********************************************************
■ MULTI GAME : 멀티게임
********************************************************/
/*** MULTI GAME -------------- 멀티게임 상단 ***/
.mlt_lnb {padding: 10px; margin: 0 0 15px 0; background-color: #2B2F3B; border: 1px solid #111; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);}
.mlt_lnb .mlt_guide {padding: 10px; margin-bottom: 10px; background-color: #1C2027; border: 1px solid #111;}
.mlt_lnb .mlt_guide h3 {padding: 5px 0 10px 0; margin-bottom: 10px; border-bottom: 1px dashed #565b72; color: #ddd; font-size: 18px; font-weight: normal; letter-spacing: -2px;}
.mlt_lnb .mlt_guide p {line-height: 1.6; color: #999; font-size: 14px;}
.mlt_lnb .mlt_guide span {color: #ffc422; text-decoration: underline;}

/*** MULTI GAME -------------- 멀티게임 옵션 ***/
.mlt_lnb .mlt_line {table-layout: fixed; padding: 10px; background-color: #1C2027; border: 1px solid #111;}
.mlt_lnb .mlt_line h3 {padding: 5px 0 15px 0; border-bottom: 1px dashed #565b72; color: #ddd; font-size: 18px; font-weight: normal; letter-spacing: -2px;}
.mlt_lnb .mlt_line li {display: table-cell; width: 1%; padding: 20px 0 10px 0; color: #999; font-size: 13px; text-align: center; letter-spacing: -1px;}
.mlt_lnb .mlt_line .checkbox input.cb_box:checked+i+label {color: #ffc422!important;}

/*** MULTI GAME -------------- 멀티게임 게임 ***/
.multigm {padding-bottom: 5px; background-color: #2B2F3B; text-align: center;}
.multigm .mlt_ch {display: inline-block; margin-left: 3px;}
.multigm .mlt_ch:first-child {margin-left: 0;} 
.multigm .mlt_ch h3 {padding: 15px 0 15px 0; margin: 5px 0; background-color: #1C2027; text-align: center; font-size: 18px; color: #ccc; font-weight: normal; letter-spacing: -2px;}
.multigm .mlt_ch .mlt_ifm {display: inline-block; overflow: hidden; width: 384px; max-height: 1800px; background-color: #222121; border: 1px solid #393634; box-shadow: 2px 4px 4px rgba(0, 0, 0, 0.1);}


/********************************************************
■ BUSTABIT : 부스타빗
********************************************************/
.bst_row {padding: 10px; margin: 0 0 15px 0; background-color: #2B2F3B; border: 1px solid #111; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);}
.bst_row .bst_bet {padding: 10px; background-color: #1C2027; border: 1px solid #111;}
.bst_row .bst_bet h3 {padding: 5px 0 15px 0; margin-bottom: 15px; border-bottom: 1px dashed #565b72; color: #ddd; font-size: 18px; font-weight: normal; letter-spacing: -2px;}
.bst_row .bst_bet a {display: inline-block; height: 31px; line-height: 31px; padding: 0 15px; color: #ddd; cursor: pointer;}
.bst_row .bst_bet a:active {box-shadow: inset 0 0 0 1px #111,inset 0 3px 20px rgba(0, 0, 0, 0.5);}
.bst_row .bst_bet .bst_lt {display: block;}
.bst_row .bst_bet .bst_coin {background-color: #3D4960; color: #eee; border: 1px solid #111; margin: 0 1px;}
.bst_row .bst_bet .bst_coin:hover {background-color: #4a5976;}
.bst_row .bst_bet .bst_coin_del {background-color: #81262A; color: #eee; border: 1px solid #111; margin: 0 1px;}
.bst_row .bst_bet .bst_coin_del:hover {background-color: #982d32;}
.bst_row .bst_bet .bst_coin_now {background-color: #284C7E; color: #eee; border: 1px solid #111; margin: 0 1px;}
.bst_row .bst_bet .bst_coin_now:hover {background-color: #2c558d;}
.bst_row .bst_bet .bst_num {width: 160px; height: 30px; line-height: 30px; padding: 0 10px; margin: -2px 3px 0 10px; text-align: right; border: none;}


/********************************************************
■ BOARD LIST : 게시판 리스트
********************************************************/
/*@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg);} }*/

.board_list {overflow: hidden;}
.board_list table {width: 100%; table-layout: fixed;}
.board_list table thead th {height: 44px; color: #ccc; background-color: #333745; border-bottom: 1px solid #111; letter-spacing: -1px; font-weight: normal;}
.board_list.lst table thead th {background-color: #333745;}
.board_list table tbody tr {text-align: left; border-bottom: 1px solid #2a2e39; letter-spacing: -0.5px; -webkit-transition: 0.3s; transition: 0.3s}
.board_list table tbody tr:hover {background-color: rgba(41, 44, 56, 0.5);}
.board_list table tbody tr td {height: 44px; line-height: 46px; background-color: rgba(18, 22, 25, 0.5); font-family: inherit;}
.board_list table tbody .b_notice {background-color: rgba(43, 47, 60, 0.9); border-bottom: 1px solid #111;}
.board_list table tbody .b_notice span {font-size: 14px; font-weight: bold;}
.board_list table tbody .b_notice img {vertical-align: middle;}
.board_list table tbody .b_number {text-align: center; color: #999; font-size: 12px;}
.board_list table tbody .b_number img {vertical-align: middle; -webkit-animation:spin 2s linear infinite; -moz-animation:spin 2s linear infinite; animation:spin 2s linear infinite;}
.board_list table tbody .b_number span {font-size: 16px; font-weight: normal;}
.board_list table tbody .b_subject {padding-right: 5px;}
.board_list table tbody .b_subject a {display: block; color: #fff; font-size: 14px;}
.board_list table tbody .b_subject:hover {text-decoration: none;}
.board_list table tbody .b_subject img, .b_subject_n img {display: inline-block; margin: 0 0 0 5px; vertical-align: middle; animation:sbj_icon 1.5s infinite ease; -webkit-animation:sbj_icon 1.5s infinite ease;}
.board_list table tbody .b_subject_n {padding-right: 5px;}
.board_list table tbody .b_subject_n a {font-size: 14px;}
.board_list table tbody .b_admin {color: #ccc;}
.board_list table tbody .b_name {color: #ccc;}
.board_list table tbody .b_name_1 {color: #ccc; padding-left: 10px;}
.board_list table tbody .b_name img, .b_name_1 img {margin-right: 5px; vertical-align: middle;}
.board_list table tbody .b_day {text-align: center; color: #999; font-size: 13px;}
.board_list table tbody .b_normal {text-align: center; color: #ccc;}
.board_list table tbody .td_view.hide {display: none;}
.board_list table tbody .td_view.show td {padding: 20px; line-height: 1.8; border-bottom: 1px solid #DFE0E5; background-color: #EFF0F1;}
.t_more_re {display: inline-block; padding: 0 4px; color: #97db17; font-size: 13px; letter-spacing: -0px;}

@keyframes sbj_icon {
    0% {opacity: 0.6;}
    30%{opacity: 1;}    
    70%{opacity: 1;}    
    100%{opacity: 0.6;} 
}


/********************************************************
■ BOARD VIEW : 게시판 뷰어
********************************************************/
.board_view {margin-bottom: 7px; text-align: left; border: 1px solid #111; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.board_view h3 {font-size: 16px; height: 54px; line-height: 54px; padding: 0 12px; background-color: rgba(62, 66, 83, 0.9); border-bottom: 1px solid #111; color: #f4f4f4; font-weight: normal;}
.board_view h3 span {color: #ffd800;}
.board_view_info {overflow: hidden; display: block; background-color: rgba(44, 47, 60, 0.9);}
.board_view_info dl {width: 100%; display: table; border-bottom: 1px solid #111; color: #888;}
.board_view_info dl dt {display: table-cell; height: 46px; line-height: 46px; padding: 0 10px 0 12px;}
.board_view_name {width: 50%;}
.board_view_name span {color: #ccc;}
.board_view_name img {vertical-align: middle; margin: -1px 5px 0 5px;}
.board_view_day {width: 50%; text-align: right;}
.board_view_day span {font-size: 12px; color: #ccc;}
.board_view_day em {display: inline-block; padding: 0 10px; font-style: none;}
.board_view_data {padding: 30px 20px; color: #ddd; line-height: 1.8; font-size: 14px; background-color: rgba(28, 31, 39, 0.9);}
.board_view_data img {max-width: 1000px; height: auto; margin: 0 auto;}


/********************************************************
■ BOARD COMMENT : 게시판 덧글
********************************************************/
.comment_write {padding: 10px; background-color: #2B2F3B; border: 1px solid #111; margin-top: 20px; overflow: hidden; text-align: left; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.comment_write .re_txtr {display: inline-block; width: 1060px; margin-right: 10px;}
.comment_write .re_txtr textarea {width: 100%; height: 70px; padding: 10px; box-sizing: border-box; -webkit-box-sizing: border-box; resize: none;}
.comment_re {overflow: hidden;}
.comment_re table {width: 100%; table-layout: fixed; font-size: 13px;}
.comment_re table tr {height: 44px; text-align: left; border-bottom: 1px solid #2a2e39;}
.comment_re table tr th {font-weight: normal; padding-left: 12px; color: #bbb;} 
.comment_re table tr td {color: #ccc;}


/********************************************************
■ BOARD WRITE : 게시판 글쓰기
********************************************************/
.board_write {border: 1px solid #111; border-top: none; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.board_write table {width: 100%; table-layout: fixed; text-align: left;}
.board_write table tr {border-top: 1px solid #111;}
.board_write table tr th {background-color: rgba(51, 55, 69, 0.8); border-top: 1px solid #111; border-right: 1px solid #111; text-align: center; color: #ccc; font-weight: normal;}
.board_write table tr td {background-color: rgba(36, 38, 46, 0.8);}
.board_write table tr td .write_row_bx {margin: 10px;}
.board_write table tr td .write_row_bx input {width: 100%; height: 38px; line-height: 38px; padding: 10px; box-sizing: border-box; -webkit-box-sizing: border-box;}
.board_write table tr td .write_row_bx textarea {width: 100%; height: 400px; padding: 10px; box-sizing: border-box; -webkit-box-sizing: border-box; resize: none;}
.board_write table tr td .write_row_line {margin: 10px;}


/********************************************************
■ BOARD LIST VIEW : 게시판 리스트 뷰어
********************************************************/
.bdtb_view {display: none; background-color: rgba(16, 16, 18, 0.5)!important;}
.bdtb_view.on {display:table-row; *display: block}
.bdtb_view td {text-align: left!important; line-height: 1.7!important; padding: 15px; font-size: 14px!important; color: #ccc;}
.bdtb_view td.tac {text-align: center!important; border-right: 1px solid #2a2a2a; color: #e3c000;}


/********************************************************
■ TABLE : 테이블
********************************************************/
.gidbx {margin-bottom: 10px; border: 1px solid #111; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.gidbx_hd {padding: 14px 0 14px 12px ; background-color: rgba(51, 55, 69, 0.8); border-bottom: 1px solid #111; font-size: 15px; color: #f4f4f4; text-align: left; font-weight: normal;}
.gidbx_ct {padding: 10px 10px 10px 12px; background-color: rgba(36, 38, 46, 0.6); color: #bbb; text-align: left;}
.gidbx_ct > p {line-height: 1.8; padding-bottom: 5px;}
.gidbx_ct span {color: #76d330;}

.gidbx_tb {border: 1px solid #111; border-top: none; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.gidbx_tb table {width: 100%; table-layout:fixed;}
.gidbx_tb table tr {border-top: 1px solid #111;}
.gidbx_tb table tr th {background-color: rgba(51, 55, 69, 0.8); border-top: 1px solid #111; border-right: 1px solid #111; text-align: center; color: #ccc; font-size: 13px; font-weight: normal;}
.gidbx_tb table tr td {height: 53px; padding: 0 10px; background-color: rgba(36, 38, 46, 0.6); color: #ccc; font-size: 13px;}
.gidbx_tb table tr td span {display: inline-block; margin-left: 10px;}
.gidbx_tb table tr td input {height: 34px; line-height: 34px; padding: 10px; box-sizing: border-box; -webkit-box-sizing: border-box;}
.gidbx_tb table tr td .tdx {display: inline-block; margin: 0 0 0 5px;}

.like_tb {padding: 10px 0;}
.like_tb > table {width: 100%; table-layout:fixed;}
.like_tb > table tr {border: 0!important;}
.like_tb > table td {line-height: 1.5; padding: 10px 0!important; border: 1px solid #111; text-align: center; color: #ccc; -webkit-transition: 0.3s; transition: 0.3s;}
.like_tb > table td:hover {background-color: rgba(18, 22, 25, 0.8)!important;}
.like_tb > table td:hover p {color: #76d330;}
.like_tb > table td p {color: #999;}

.rulebx {padding: 10px 0;}
.rulebx h3 {padding: 15px 10px; border-bottom: 1px solid #111; background-color: rgba(51, 55, 69, 0.8); color: #f5c526; font-weight: normal;}
.rulebx .rule_c {padding: 20px; margin-bottom: 20px; background-color: rgba(36, 38, 46, 0.6); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);}
.rulebx .rule_c p {line-height: 2; color: #bbb;}
.rulebx .rule_n {padding: 20px 0; border-bottom: 1px solid #3b3231; border-top: 1px solid #3b3231; color: #b1ff00; text-align: center;}
.rulebx .rule_n p {animation:rule_n 1.5s infinite ease-in-out; -webkit-animation:rule_n 1.5s infinite ease-in-out;}
@keyframes rule_n {
    0% {opacity: 0.5;}
    30% {opacity: 1;}
    60% {opacity: 1;}
    100% {opacity: 0.5;}
}


/********************************************************
■ roulette : 룰렛
********************************************************/
.roulette {position: relative;}
.roulette .roul_head {padding: 10px; margin: 0 0 10px 0; background-color: #2B2F3B; border: 1px solid #111; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);}
.roulette .roul_head .roul_box {padding: 10px; background-color: #1C2027; border: 1px solid #111;}
.roulette .roul_head .roul_box h3 {padding: 5px 0 15px 0; margin-bottom: 15px; border-bottom: 1px dashed #565b72; color: #ddd; font-size: 18px; font-weight: normal; letter-spacing: -1px;}
.roulette .roul_head .roul_box p {line-height: 1.6; font-size: 13px; color: #999;}
.roulette .roul_head .ch_tx1 {color: #ffce01;}

.roulette .roul_row {display: table; text-align: center; border: 1px solid #111; background-color: #1C2027;}
.roulette .roul_row span {display: table-cell; width: 1%; padding: 15px 10px; border-left: 1px solid #111; font-size: 14px; font-weight: normal; color: #ccc;}
.roulette .roul_row span:first-child {border-left: none;}
.roulette .roul_row span strong {color: #ffce01}

.roulette .roul_cont {position: relative; padding: 60px 0 60px 0; text-align: center; background: url(/images/roulette/rlt_bg.jpg) no-repeat 0 0;}
.roulette .roul_cont::before {display:block; position:absolute; top:29px; left:50%; width:708px; margin-left:-354px; height:708px; background:url(/images/roulette/roulette_bg.png) no-repeat 0 0; background-size:708px 708px; content:''; z-index:11 !important}
.roulette .roul_cont .roul_star {display: block; position: absolute; left: 50%; top: 50%; margin-top: -90px; margin-left: -90px; width: 180px; height: 180px; background: url(/images/roulette/roulette_start.png) no-repeat 0 0; background-size: 180px 180px; z-index: 12; text-indent: -99999px;}
.roulette .roul_cont .roul_body {display: block;}
.roulette .roul_cont .roul_body img {z-index: 10;}
.roulette .roul_cont .roul_body .roul_entry {z-index: 12;}
.roulette .roul_cont .roul_body .roul_entry ul {overflow: hidden;}
.roulette .roul_cont .roul_body .roul_entry ul li {position:absolute; display:block; overflow:hidden; width:150px; height:38px; line-height: 38px; font-size:38px; color:#fff!important; white-space:nowrap; text-overflow:ellipsis; text-shadow:2px 2px rgba(0, 0, 0, 0.5);}

.roulette .roul_cont .roul_body .roul_entry ul li.ety_num_1 {top:230px; left:50%; margin-left:66px;
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
.roulette .roul_cont .roul_body .roul_entry ul li.ety_num_2 {top:495px; left:50%; margin-left:60px; 
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
}
.roulette .roul_cont .roul_body .roul_entry ul li.ety_num_3 {top:500px; left:50%; margin-left:-210px; 
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
.roulette .roul_cont .roul_body .roul_entry ul li.ety_num_4 {top:220px; left:50%; margin-left:-226px;
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
}

.roulette .roul_cont .choice_icon {display: block; position: absolute; left: 50%; top: 29px; margin-left: -24px; width: 48px; height: 83px; background: url(/images/roulette/roulette_pin.png) no-repeat 0 0; background-size: 48px 83px; z-index: 12;}


/********************************************************
■ MAIN POPUP : 메인 팝업
********************************************************/
.pop_box {width: 380px; border: 1px solid #111; z-index: 102;}
.pop_warp {background-color: #1C2027; box-shadow: 2px 4px 4px rgba(0, 0, 0, 0.5);}
.pop_warp h2 {padding: 10px 10px 8px 10px; background-color: #2F3541; border-bottom: 1px solid #111; font-weight: normal; text-align: center; font-size: 18px; letter-spacing: -1px;}
.pop_warp h2 span {/*animation:pop_logo 2s infinite ease-in-out; -webkit-animation:pop_logo 2s infinite ease-in-out;*/}
.pop_warp .pop_cont {overflow-y: auto; max-height: 450px; line-height: 1.7; padding: 10px; border: 10px solid #2F3541; color: #ccc; font-size: 14px;}
.pop_warp .pop_cont img {width: 100%; height: auto; display: block;}
.pop_warp .pop_foot {overflow: hidden; height: 48px; line-height: 48px; padding: 0 10px; border-top: 1px solid #161616; background-color: #2F3541;}
.pop_warp .pop_foot label {color: #ccc!important;}
.pop_warp .pop_foot::after {content: ''; clear: both; display: block;}
.pop_warp .pop_foot .fl {float: left;}
.pop_warp .pop_foot .fr {float: right;}


/********************************************************
■ INDEX : 첫화면
********************************************************/
html,body {height: 100%;}
.ibg_warp {position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; width: 100%; height: 100%;}
.ibg_warp .ibg {
    width: 100vw;
    height: 100vh;
    background: #121619 url(../img/main_asn_01.png) no-repeat center center;
    background-size: cover;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
}
.login_warp {position: absolute; left: 50%; top: 40%; width: 300px; margin-left: -150px; margin-bottom: 40px;}
.login_warp h2 {text-align: center;}
.login_warp h2 img {width: auto;margin-top: -150px;}

@keyframes ibg {
    10% {transform: scale(1);}    
    50%{transform: scale(1.15)} 
    90% {transform: scale(1);} 
}

.lg_box {display: none; position: relative; padding: 20px 20px 13px 20px; background-color: rgba(28, 32, 39, 0.8); border: 1px solid #271b14; border-radius: 3px; -webkit-border-radius: 3px;}
.lg_box.on {display: block;}
.lg_box .login {display: block;}
.lg_box .login .lg_id {position: relative; line-height: 40px; margin-bottom: 10px; border: 1px solid #333; background-color: #ddd; border-radius: 3px; -webkit-border-radius: 3px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) inset;}
.lg_box .login .lg_pw {position: relative; line-height: 40px; margin-bottom: 10px; border: 1px solid #333; background-color: #ddd; border-radius: 3px; -webkit-border-radius: 3px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5) inset;}
.lg_box .login .input_type {width: 100%; line-height: 40px; padding: 0 20px; background-color: transparent; color: #000; font-size: 14px; box-sizing: border-box; -webkit-box-sizing: border-box;}
.lg_box .btlogin {width: 100%; background-color: #284C7E; color: #fff;}
.lg_box .btlogin:hover {background-color: #3564a5;}
.lg_box .btjoin {background-color: #2C6F0E; color: #fff;}
.lg_box .btjoin:hover {background-color: #3a9312;}
.lg_box .lg_bt {display: block; line-height: 40px; margin-bottom: 10px; font-size: 16px; text-align: center; letter-spacing: -0.5px; outline: 0; border-radius: 3px; -webkit-border-radius: 3px; cursor: pointer; transition:all .3s ease-out; -webkit-transition:all .3s ease-out; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6)}

.code_box {display: none; position: relative; padding: 20px 20px 13px 20px; background-color: rgba(28, 32, 39, 0.8); border: 1px solid #271b14; border-radius: 3px; -webkit-border-radius: 3px;}
.code_box.on {display: block;}
.code_box .code {display: block;}
.code_box .code .lg_code {position: relative; line-height: 40px; margin-bottom: 10px; border: 1px solid #a4b4c6; background-color: #fff; border-radius: 3px; -webkit-border-radius: 3px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) inset;}
.code_box .code .input_type {width: 190px; line-height: 40px; margin: 0 20px; background-color: transparent; color: #000000; font-size: 14px; font-weight:bold;}
.code_box .btok {width: 100%; background-color: #2063b2; color: #fff;}
.code_box .btok:hover {background-color: #3564a5;}
.code_box .btcancel {background-color: #8D1B1B; color: #fff;}
.code_box .btcancel:hover {background-color: #b42525;}
.code_box .lg_bt {display: block; line-height: 40px; margin-bottom: 10px; font-size: 16px; text-align: center; letter-spacing: -0.5px; outline: 0; border-radius: 3px; -webkit-border-radius: 3px; cursor: pointer; transition:all .3s ease-out; -webkit-transition:all .3s ease-out; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.6)}

.help_box {margin-top: 10px; text-align: center; background-color: rgba(28, 32, 39, 0.8); border-radius: 3px; -webkit-border-radius: 3px;}
.help_box a {display: block; padding: 15px 0; color: #fff; font-size: 16px; text-shadow: 0 2px 2px #000;}
.help_box a:hover {text-decoration: underline;}


/********************************************************
■ INDEX POPUP : 첫화면 팝업
********************************************************/
.popup {display: none; width: 460px; padding: 40px 10px 10px 10px; background-color: #1c2027; border: 5px solid #3E4253; border-radius: 3px; -webkit-border-radius: 3px;}
.popup .b-close, .popup_1 .b-close {position: absolute; top: -5px; right: -5px; width: 40px; height: 40px; background: #3E4253 url(/images/icon_closs.png) no-repeat center; background-size: 28px 28px; text-indent: -99999px;}
.popup .join_tb table {width: 100%; table-layout:fixed; border-collapse: collapse;}
.popup .join_tb table tr th {border: 1px solid #111; background-color: rgba(51, 55, 69, 0.8); text-align: center; color: #ccc; font-size: 13px; font-weight: normal;}
.popup .join_tb table tr td {height: auto; padding: 10px 10px; border: 1px solid #111; background-color: rgba(36, 38, 46, 0.6); color: #ddd; font-size: 13px;}
.popup .join_tb table tr td em {display: block; margin: 5px 0 0 0; color: #ebc317;}
.popup .join_tb table tr td p {margin: 5px 0 0 0; font-size: 12px; color: #aaa;}
.popup .join_tb table tr td > div {padding: 3px 0;}
.popup .join_tb table tr td .input_bx {padding: 0 0px!important;}
.popup .join_tb table tr td .input_bx input {margin-top: -3px; padding: 0 10px!important; height: 30px!important; line-height: 30px!important; border: 0!important; box-sizing: border-box; -webkit-box-sizing: border-box;}









/********************************************************
■ DRAGON & TIGER : 드레곤타이거
********************************************************/
.drg_tgr {position: relative; margin-bottom: 10px;}

.dt_hold {display: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.7); text-align: center;}
.dt_hold.on {display: block;}
.dt_hold h3 {padding-top: 200px; font-size: 24px; font-weight: normal; letter-spacing: -2px; text-shadow: 0 2px 4px #000; animation:title_txt 1.5s infinite ease-in-out; -webkit-animation:title_txt 1.5s infinite ease-in-out;}
@keyframes title_txt {
    0% {color:#ffd75c; opacity: 1;}
    50% {color:#caff59; opacity: 0.3;}
    100% {color:#ffd75c; opacity: 1;}
}

.dt_game {overflow: hidden; clear: both;}
.dt_game .dt_head {padding: 10px; margin-bottom: 10px; border: 1px solid #111; background-color: #2B2F3B;}
.dt_game .dt_head .dt_hd {line-height: 36px; padding: 10px; border: 1px solid #111; background-color: #1C2027; text-align: left;}
.dt_game .dt_head .dt_hd span {display: inline-block; font-size: 16px; letter-spacing: -1px; vertical-align: middle;}
.dt_game .dt_head .dt_hd span.dt_day {color: #ccc;}
.dt_game .dt_head .dt_hd span.dt_day em {color: #ffce00;}
.dt_game .dt_head .dt_hd span.dt_time {float: right; color: #ccc;}
.dt_game .dt_head .dt_hd span.dt_time em {color: #45ff00; font-size: 22px; font-weight: bold; vertical-align: middle}

.dt_game .dt_main {padding: 10px; margin-bottom: 10px; border: 1px solid #111; background-color: #2B2F3B;}
.dt_game .dt_main .dt_gm {display: table; width: 100%; table-layout: fixed; padding: 10px; border: 1px solid #111; background-color: #1C2027; box-sizing: border-box; -webkit-box-sizing: border-box;}
.dt_game .dt_main .dt_gm li {display: table-cell; width: 33.33%; text-align: center;}
.dt_game .dt_main .dt_gm li a {display: block; margin: 20px 30px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);}
.dt_game .dt_main .dt_gm li a p {line-height: 44px; background-color: #242731; border: 1px outset #3e4657; font-size: 18px; letter-spacing: -1px;}
.dt_game .dt_main .dt_gm li a p span {color: #fff;}

.dt_game .dt_main .dt_gm .dt_btn {background-color: #242731; border: 1px outset #3e4657; -webkit-transition: 0.5s; transition: 0.5s;}
.dt_game .dt_main .dt_gm .dt_btn.on {border: 1px solid #2c303c; box-shadow: inset 1px 1px 100px #000;}
.dt_game .dt_main .dt_gm .dt_btn .dt_img {width: 120px; height: 176px; margin: 30px auto; background: url(../images/drg_tgr.png) no-repeat; -webkit-transition: .5s; transition: .5s;}

.dt_game .dt_main .dt_gm .dt_btn .dt_img.drg {background-position: 0 0;}
.dt_game .dt_main .dt_gm .dt_btn.on .dt_img.drg,
.dt_game .dt_main .dt_gm .dt_btn:hover .dt_img.drg {background-position: 0 -178px;}
.dt_game .dt_main .dt_gm .drg_txt {color: #3190ff;}

.dt_game .dt_main .dt_gm .dt_btn .dt_img.tie {background-position: -121px 0;}
.dt_game .dt_main .dt_gm .dt_btn.on .dt_img.tie,
.dt_game .dt_main .dt_gm .dt_btn:hover .dt_img.tie {background-position: -121px -178px;}
.dt_game .dt_main .dt_gm .tie_txt {color: #1bff4f;}

.dt_game .dt_main .dt_gm .dt_btn .dt_img.tgr {background-position: -242px 0;}
.dt_game .dt_main .dt_gm .dt_btn.on .dt_img.tgr,
.dt_game .dt_main .dt_gm .dt_btn:hover .dt_img.tgr {background-position: -242px -178px;}
.dt_game .dt_main .dt_gm .tgr_txt {color: #ff2f2f;}