@charset "utf-8";

html,body {background:#222}

body.popup-open { overflow:hidden; height:100%; }

/* main header */
#header { position:fixed; top:0; left:0; right:0; background:#000; z-index: 300; text-align:left;padding:0 0 20px 0}
#header .logo {position:relative;top:12px;font-size: 16px; text-align: center; }
#header .logo img { width: 135px; }
#header .logo .title { font-size: 22px; color:#fff; }
#header .left_box { position:absolute; top:12px; left:5%; width: 20vw; text-align: left; z-index: 1; }
#header .left_box a { color: #fff; font-size: 1.8rem; }
#header .right_box { position:absolute; top:12px; right:5%; width: 20vw; text-align: right; }
#header .right_box a { color: #fff; font-size: 2.5rem; }

#content { background:#fff}

.bbs_type1 .subject {max-width:100%; font-size:1em}
.bbs_type1 {border-top:1px solid #d5d5d5}
.bbs_type1 .datebox {margin-top:10px;}

.record_box_wrap.highlight_list .info_table .name .thum,
.record_box_wrap.highlight_list .info_table .name .thum + p{display:inline-block; vertical-align: middle}
.record_box_wrap.highlight_list .info_table b {color:#333; }

/* main */
.main .btn_wrap {clear:both; display:block; margin-top:20px;}
.main .btn_wrap a.btn { background:#ff7f27;padding:15px 30px; display:block;}
.main .btn_wrap a.btn span {color:#333; font-size: 1.1em; font-weight: 700; background:url("https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/common/icon_arrow.png") right center no-repeat; background-size:10px; display:block; text-align: center}

/*.main {background:url("http://static.cuesco.co.kr/np/img/main/bg.png") top center no-repeat; background-size: 100%}*/
.main .big_banner {padding:20px 5%; z-index: 200; position:relative;}
.main .big_banner .box {width:100%; background:#393939; }
.main .big_banner .box a {display:block;position:relative;}
.main .big_banner .box .bg {width:100%; margin-bottom: -4px;}
.main .big_banner .box .bg.cover {display:block; position:absolute;top:0;left:0;}
.main .big_banner .box .text_box {width:90%; display:block; position:absolute; top:14%; left:5%}
.main .big_banner .box .text_box .title {font-size:2em; line-height: 1.1em; color:#ff7f27; font-weight: 700}
.main .big_banner .box .text_box .text {font-size:1em; color:#fff; margin-top:10px;}
.main .big_banner .box .text_box .next {margin-top:20px;}
.main .big_banner .box .text_box .next img {width:34px}
.main .big_banner .box .btn_play {position:absolute; top:50%;left:50%; margin-top:-22px;margin-left:-22px;}
.main .big_banner .box .btn_play img {width:44px}
.main.main_umb .big_banner .box .text_box {top:auto; bottom:14%}

.cuesco_tab .list {margin-top:20px;}
.main .title_wrap {margin-bottom:10px; overflow: hidden}
.main .title_wrap .title { color:#333; font-size:1.2em;float:left; vertical-align: middle; min-width: 50%; word-break: break-all;font-weight: 700}
.main .title_wrap .text { color:#333; font-size:0.8em; font-weight: normal;display:block;}
.main .title_wrap .right_box {float:right; vertical-align: middle;width: 40%;  color:#333; font-size:1em;}
.main .title_wrap .right_box span {color:#fff; font-size:1em}
.main .title_wrap .right_box .date {color:#999; font-size:0.8em; margin-right:5px;}

/*.main .selectbox {  border-left:2px solid #ff7f27;}*/

.cuesco_tab .list .live_list {padding-right:5%}
.cuesco_tab .list .live_list .table_box + .table_box {margin-top:20px;}
.cuesco_tab .list .live_list .table_box .table_cell {width:75%;text-align: center}
.cuesco_tab .list .live_list .table_box .table_cell:first-child { width:15%;}

.cuesco_tab .list .live_list .table_box .table_cell .num { font-size: 2em; color:#fff; opacity: 0.4;font-weight: 700 }
.cuesco_tab .list .live_list .table_box .table_cell .en { font-size: 1em; color:#fff; opacity: 0.4 }

.cuesco_tab .ranking {padding:40px 0; background:#2d2d2d; margin-top:40px;}
.cuesco_tab .ranking .title_wrap .right_box {padding-top:5px;width: 50%; }

.cuesco_tab .ranking_tab {padding-top:40px; }
.cuesco_tab .ranking_tab .menu ul {border-bottom:2px solid #3b3b3b}
.cuesco_tab .ranking_tab .menu ul li{border-color:#323232;}
.cuesco_tab .ranking_tab .menu ul li.active{border-color:#ff7f27;}

.ranking_table table tbody td.name {padding:10px 10px 5px 10px; }

/**/
.big_banner.theme1{background:#222 url(https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/bg.png) bottom center no-repeat;background-size:100% auto;max-height: 350px;overflow: hidden}/*20-09-18*/
.cuesco_tab .list{margin-top:0}

.color1{color:#d82f24}
.color2{color:#028dfe}
.color3{color:#ffb21e}
.color4{color:#fff}

.align_top{vertical-align:top}
.align_middle{vertical-align:middle}
.align_bottom{vertical-align:bottom}
.align_left{text-align:left}
.align_center{text-align:center}
.align_right{text-align:right}

.title_wrap .title_bonus1{display:inline-block;width:100%}
.title_wrap .title_bonus1>*{display:inline-block;vertical-align:middle}
.title_wrap .title_bonus1 .txt1{font-size:1em;color:#ff7f27;font-weight:700}
.title_wrap .title_bonus1 .space{height:10px;width:2px;background-color:#999999;margin:0 10px}
.title_wrap .title_bonus1 .txt2{font-size:1em;color:#999;font-weight:700}

.structure_wrap.structure1 .structure_container{margin:0 -20px}
.structure_wrap.structure1 .table_wrap{border-spacing:20px 0;border-collapse:separate}
.structure_wrap.structure1 + .title_wrap{margin-top:20px}

.btn_wrap.btn1{height:35px;width:35px;background:url(https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/ic_1.png) center right no-repeat;background-size:40% auto;display:inline-block;margin:-7px 0 -7px 0}
.btn_wrap.btn2{background-color:#4e4e4e;box-shadow:2px 5px 20px rgba(0,0,0,0.1);color:#fff;font-weight:300;font-size:1em;padding:10px 0;box-sizing:border-box;margin:0}
.btn_wrap.btn2 .highlight{font-weight:700;position:relative}
.btn_wrap.btn2 .highlight .dot1{width:8px;height:8px;position:absolute;right:-7px;top:-3px;display:inline-block;background-color:#d72f24;border-radius:999px}

.table_wrap{width:100%;display:table}
.table_td{display:table-cell}

.slider_wrap{width:100%;overflow:hidden;position:relative;z-index: 10}/*20-09-18*/
.slider_wrap .slider_slide{display:inline-block}

.slider_wrap.slider1 .slick-dots{font-size:0em;position:absolute;bottom:20px;left:0;right:0;text-align:center}
.slider_wrap.slider1 .slick-dots li{display:inline-block;vertical-align:middle;padding:0 5px}
.slider_wrap.slider1 .slick-dots button{border:none;background-color:#dcdcdc;border-radius:999px;padding:0;margin:0;width:6px;height:6px;font-size:0em}
.slider_wrap.slider1 .slick-dots li.slick-active button,
.slider_wrap.slider1 .slick-dots li button:hover{background-color:#ff7f27}

.slider_wrap.slider2 .contain{padding-right:0}
.slider_wrap.slider2 .slider_container{margin:0 ;width:140%}
.slider_wrap.slider2 .slider_slide{padding:0 4px}

.slider_wrap.slider2-2 .contain{padding-right:0}
.slider_wrap.slider2-2 .slider_container{margin:0 ;width:185%}
.slider_wrap.slider2-2 .slider_slide{padding:0 4px}

.slider_wrap.slider2-2 .block_wrap.block1 {position:relative;}
.slider_wrap.slider2-2 .block_wrap.block1 .thumbnail img {opacity: 0.5; }
.slider_wrap.slider2-2 .block_wrap.block1 .info {padding:0}
.slider_wrap.slider2-2 .block_wrap.block1 .info .tit {position:absolute; top:10px;left:20px;}
.slider_wrap.slider2-2 .block_wrap.block1 .info .bot {position:absolute; bottom:15px; left:20px}
.slider_wrap.slider2-2 .slider_container .player_thumbnail img {width:40px; height:40px;}
.slider_wrap.slider2-2 .slider_container p {color:#d5d5d5; font-size:1em; line-height: 1.1em; margin-left:5px }
.slider_wrap.slider2-2 .slider_container .name {font-weight: 700}
.slider_wrap.slider2-2 .slider_container .thum,
.slider_wrap.slider2-2 .slider_container .text {display:inline-block; vertical-align: middle}

.slider_wrap.slider2-2 .progress {width:100%; height: 5px; background:#5b5b5b; margin:0!important}
.slider_wrap.slider2-2 .progress .active {display:block;width:1px; height:5px; background:#ff7f27}

/* xscroll */
.content_wrap .xscroll {overflow-x: auto;margin-left:5%;width:140%;z-index: 10;position: relative;}/*20-09-18*/
.content_wrap .xscroll .inner {display:flex; width:190%;}
.content_wrap .xscroll .slider_slide {width:30%;margin-right:10px; padding:0}

.content_wrap.type2 .xscroll .inner {display:flex; width:390%;}
/*.content_wrap.type2 .xscroll .slider_slide {width:50%;margin-right:10px;}*/

.content_wrap.type2 .xscroll .contain{padding-right:0}

.content_wrap.type2 .xscroll .block_wrap.block1 {position:relative;}
.content_wrap.type2 .xscroll .block_wrap.block1 .thumbnail img {opacity: 0.5; }
.content_wrap.type2 .xscroll .block_wrap.block1 .info {padding:0}
.content_wrap.type2 .xscroll .block_wrap.block1 .info .tit {position:absolute; top:10px;left:20px;}
.content_wrap.type2 .xscroll .block_wrap.block1 .info .bot {position:absolute; bottom:15px; left:20px}
.content_wrap.type2 .xscroll .player_thumbnail img {width:40px; height:40px;}
.content_wrap.type2 .xscroll  p {color:#d5d5d5; font-size:1em; line-height: 1.1em; margin-left:5px }
.content_wrap.type2 .xscroll .name {font-weight: 700}
.content_wrap.type2 .xscroll .thum,
.content_wrap.type2 .xscroll .text {display:inline-block; vertical-align: middle}

.content_wrap.type2 .xscroll .progress {width:100%; height: 5px; background:#5b5b5b; margin:0!important}
.content_wrap.type2 .xscroll .progress .active {display:block;width:1px; height:5px; background:#ff7f27}

.main .scroll .contain{padding-right:0; padding-bottom: 15px;}

.main .scroll .slider_container{margin:0 ;width:140%;white-space:nowrap;overflow-x:scroll;}
.main .scroll .slider_slide{padding:0 4px;width:33%; display: inline-block}

.slider3 .contain{padding-right:0}
.slider3 .slider_container{margin:0 -10px;width:120%}
.slider3 .slider_slide{padding:0 10px}

.list_wrap.list1 .list_item{display:inline-block;vertical-align:top;width:100%}
.list_wrap.list1 .list_item + .list_item{margin-top:20px}

.list_wrap.list2 table{background-color:#323232;box-shadow:2px 5px 20px rgba(0,0,0,0.1)}
.list_wrap.list2 tr{border-bottom:1px solid #474747}
.list_wrap.list2 tr:last-child{border-bottom:none}
.list_wrap.list2 td.date{padding:10px 0;white-space:nowrap}
.list_wrap.list2 td.date .frt{font-size:1.1em;color:#4e4e4e;font-weight:400}
.list_wrap.list2 td.date .lst{font-size:1.2em;color:#4e4e4e;font-weight:900}
.list_wrap.list2 td.tit{padding:10px 20px 10px 0}
.list_wrap.list2 td.tit{font-size:1em;color:#999999;font-weight:300}

.list_wrap.list3 tr{border-bottom:1px solid #474747}
.list_wrap.list3 th{border-right:1px solid #5d5d5d}
.list_wrap.list3 td{border-right:1px solid #474747}
.list_wrap.list3 th:last-child,
.list_wrap.list3 td:last-child{border-right:none}
.list_wrap.list3 thead th{background-color:#4e4e4e;padding:10px 0;color:#fff;font-weight:700;font-size:1em}
.list_wrap.list3 tbody td{padding:10px 0;font-weight:900;font-size:1em}

.list_wrap.list4 + .list_wrap.list4{margin-top:20px}
.list_wrap.list4 .detail_bar{margin-bottom:10px}
.list_wrap.list4 .detail_bar .table_td{color:#999999;font-size:1em;font-weight:500}
.cuesco_tab .list .live_list.list_wrap.list4{padding-right:0}
.cuesco_tab .list .live_list.list_wrap.list4 .table_box .score_box .score .btn_play{border-radius:999px;background-color:#ff253e}

.block_wrap + .title_wrap{margin-top:20px}
.block_wrap.block1 .thumbnail img{width:100%;display:block}
.block_wrap.block1 .info{padding:10px 0}
.block_wrap.block1 .tit>*{display:inline-block;vertical-align:middle}
.block_wrap.block1 .tit .txt1{font-size:1em;color:#333;font-weight:700}
.block_wrap.block1 .tit .space{height:10px;width:2px;background-color:#999999;margin:0 10px}
.block_wrap.block1 .tit .txt2{font-size:1em;color:#999;font-weight:700}
.block_wrap.block1 .desc .txt1{font-size:0.9em;color:#cccccc}

.block_wrap.block2{border-radius:12px;overflow:hidden;box-shadow:2px 5px 20px rgba(0,0,0,0.1)}
.block_wrap.block2 .table{width:100%;table-layout:auto}
.block_wrap.block2 .type{font-size:1em;color:#fff;font-weight:700;text-align:center;background-color:#6a4846;padding:10px 10px}
.block_wrap.block2 .info{background-color:#4e4e4e}
.block_wrap.block2 .info .part1{border-bottom:1px solid #606060}
.block_wrap.block2 .info .table_td{padding:10px 10px}
.block_wrap.block2 .info .name .en{font-size:1.3em;color:#fff;font-weight:700}
.block_wrap.block2 .info .name .kr{font-size:1.2em;color:#999999;font-weight:700}
.block_wrap.block2 .info .score{font-size:2.7em;font-weight:700;padding-left:0;padding-right:0}
.block_wrap.block2 .info .part2 *{color:#999999;font-size:1em;font-weight:300}
.block_wrap.block2 .info .part2 .highlight{color:#fff;font-size:1.1em;font-weight:700}
.block_wrap.block2 .info .part2 .data2{padding-left:0}

.block_wrap.profile1 .thumbnail{text-align:center;padding:0 5px;box-sizing:border-box}
.block_wrap.profile1 .thumbnail img{display:inline-block}
.block_wrap.profile1 .name{font-size:1em;color:#fff;margin:5px 0 0 0;font-weight:700}
.block_wrap.profile1 .nationality{font-size:0.9em;color:#666;font-weight:700}

.block_wrap.player1{width:100%;border-radius: 70%;background: #ccc}

.content_wrap {clear:both}
.content_wrap.s1{padding:40px 0}
.content_wrap.s1 + .content_wrap.s1{padding-top:0}
.content_wrap.s2{background-color:#f8f8f8;padding:40px 0}

.content_wrap.bd_t {border-top:1px solid #d5d5d5;padding:40px 0}

/*tab*/
.main .slider-nav {z-index: 200; background:#fff}
.main .slider-nav .slick-slide {border-bottom:2px solid #d5d5d5; font-size:0.9em; color:#333; text-align: center;padding:10px 0; }
.main .slider-nav .slick-slide.slick-current.slick-active {border-color:#ff7f27; color:#ff7f27;}

/* 큐스코>클럽 */
.score_btn_wrap {margin-top:20px; overflow: hidden}
.score_btn_wrap a { display:block;width:49%; float:left; padding:5px 0}
.score_btn_wrap a + a { float:right}
.club3 .record_box_wrap {margin-top:20px}

.main .club_box_wrap {padding-bottom:0}

.cuve .btn_box {padding:20px 0 0}
.cuve .menu.type2 ul li.new a span {position:relative}
.cuve .menu.type2 ul li.new a span::after { position:absolute; right:-8px;top:2px; width:5px; height:5px; background:#ff7f28; display:block; content: ""; border-radius: 5px}

/* 마이큐니 */
.main_my_top .inner {border:1px solid #d5d5d5; background:#fff; padding:20px;}
.main_my_top .top {border-bottom:1px dashed #d5d5d5; padding-bottom:10px;}
.main_my_top .top ul {display:table; table-layout: fixed; width:100%}
.main_my_top .top ul li {display:table-cell; vertical-align: middle;width:50%}
.main_my_top .top ul li .thum {width:60px;}
.main_my_top .top ul li .thum img { width:50px; height:50px; border-radius: 50px; background:#999;}
.main_my_top .top ul li .cate span {padding:2px 4px; background:#ff7f27; color:#333; font-size:0.8em; font-weight: 700; display:inline-block}
.main_my_top .top ul li .name {color:#333; font-size:1em; font-weight: 700;}
.main_my_top .top ul li .label {color:#999; font-size:0.9em; text-align:right }
.main_my_top .top ul li .label span.num { font-size:0.9em; color:#333; font-weight: 700; text-align: right; max-width:50%}

.main_my_top .bot {padding-top:20px;}
.main_my_top .bot .table_box {display:table; table-layout: fixed; width:100%}
.main_my_top .bot .table_box .table_cell {display:table-cell; vertical-align: middle}
.main_my_top .bot .table_box .table_cell.left {width:30%; text-align: center}
.main_my_top .bot .table_box .table_cell.left .num {color:#ff7f27; font-size:2em; font-weight: 700}
.main_my_top .bot .table_box .table_cell.left .en {color:#999; font-size:1em; font-weight: 700;padding:2px 0; line-height: 1em;border-top:1px solid #d5d5d5}
.main_my_top .bot .table_box .table_cell.left .ko span {color:#999; font-size:0.9em; font-weight: 700; padding:2px 0; display:block; background:#f8f8f8}

.list.my .race_top {margin-bottom:20px;}

.list.my .cuenie_top .none {color:#333; font-size:1em; font-weight: 700; margin:10px auto 0; text-align: center}
.list.my .btns_box {margin-top:20px; }
.list.my .btns_box a {display:block}

.list.my .report_box .report .bot {padding:10px 0}

.list.my .s2 .cuenie_box ul {width:95%; margin:0 auto}
.list.my .s2 .cuenie_box ul li {text-align:center}
.list.my .s2 .cuenie_box ul li a  {margin:0 auto}

.main_my_top .bot .table_box .table_cell .inner {background:#f8f8f8 ; border:0; border-left:10px solid #fff; text-align: center; padding:30px 10px }
.main_my_top .bot .table_box .table_cell .inner span {display:inline-block;width:45%;}
.main_my_top .bot .table_box .table_cell .inner span.num { color:#333; font-weight:700; font-size:1.4em}
.main_my_top .bot .table_box .table_cell .inner span.coin span {color:#999; font-weight: 700; font-size:1em; background:url("https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/btn_plus.png") right center no-repeat;background-size:20px; padding-right:40px; }

/* umb */
.main.main_umb .big_banner.theme1 {background-image:url("https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/bg2.png"); background-color:#111;}
.main.main_umb #header {background-color:#111}
.main_umb #content { background:#222}
.main.main_umb .title_wrap .title,
.main_umb .block_wrap.block1 .tit .txt1{color:#fff}
.main_umb .btn_wrap.btn1{background-image:url(https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/ic_2.png)}

.main_umb .content_wrap {margin:30px auto;}
.main_umb .bg_darkgray2 {padding:40px 0;margin-top:50px;}

@media screen and (max-width:1280px) {

}

@media screen and (max-width:781px) {

}

/* 메인 */
#content .main-nav { position: relative; background: #222; padding-bottom:20px; font-size: 20px; }
#content .main-nav ul { display: table; margin: 0 auto; }
#content .main-nav ul li { position: relative; display: table-cell; padding:0 5px; color:#fff; opacity: 0.6; }
#content .main-nav ul li a { display:block; color:#fff; }
#content .main-nav ul li.active { opacity: 1; }
#content .main-nav ul li.active::before { content: ''; position: absolute; bottom:-5px; width:6px; height: 6px; border-radius: 100%; background: #fff; left:50%; transform:translateX(-50%); }
#content { padding-top:65px; }
#content .top_ad_img { position:relative; width:100%; }
/*#content .top_ad_img::before { content: ''; position: absolute; width:100%; height: 75%; background: #222; }*/
#content .top_ad_img img { width:320px; height: 160px; border-radius: 5px; }
.swiper-container { width: 100%; }
.swiper-slide {
    background-position: center;
    background-size: cover;
    width: 320px;
}
.top_ad_img .swiper-slide {
    background-position: center;
    background-size: cover;
    width: 320px;
    height: 160px;
    overflow:hidden;
    border-radius: 8px;
}
.swiper-pagination { position: relative; width:320px !important; margin:10px auto 0 auto; text-align:left; }
.swiper-pagination-bullet { width:5px; height:5px; opacity: 0.3; }
.swiper-pagination-bullet-active { opacity: 1; background: #000; }

#content .user-info { position: relative; text-align: center; z-index: 1; }
#content .user-info::before { content: ''; position: absolute; left:-5%; top:-15px; width: 110%; height: 43%; background: #222; z-index: -1; border-radius: 0 0 70% 70%; }
#content .user-info .grade { font-size: 15px; color:#FF7F27; }
#content .user-info .grade img { width:26px; vertical-align: middle; margin-right: 5px; }
#content .user-info .title { font-size: 26px; color:#fff; }
#content .user-info .title span { font-size: 16px;}
#content .user-info .sub-txt { font-size: 18px; color:#fff; margin-top:5px; }
#content .user-info .sub-txt img { width:18px; }
#content .user-info .log-in .sub-txt { opacity: 0.7; }
#content .user-info .sub-txt2 { font-size: 16px; text-align: center; }
#content .user-info .sub-txt2 a { color:#000; text-decoration: underline; }
#content .user-info .img { position: relative; width: 100px; margin:30px auto 0 auto; }
#content .user-info .log-in .img { margin:10px auto 0 auto; }
#content .user-info .img img { width:100px; height: 100px; border-radius: 100%; }
#content .user-info .img span { position: absolute; bottom:0; right:-15px; width:52px; height:22px; font-size: 10px; background:#FF7F27; border-radius: 100%; color:#fff; padding:15px 0; line-height: 15px; }
#content .user-info .img span em { display: block; font-size: 18px; font-weight: bold; font-style: normal; }
#content .user-info .img .btn { position: absolute; width:74px; font-size:14px; padding:1px 0; background:#333; border-radius: 50px; line-height: 22px; }
#content .user-info .img .btn.left { left: -240px; top: 10px; padding-left:20px; }
#content .user-info .img .btn.left i { position: absolute; width:20px; height:20px; top:2px; left:2px; background: #fff; border-radius: 100%; line-height: 20px; }
#content .user-info .img .btn.left i img { width:10px; height:10px; -webkit-transform:rotate(180deg); }
#content .user-info .img .btn.right { right: -110px; top: 10px; padding-right:20px; }
#content .user-info .img .btn.right i { position: absolute; width:20px; height:20px; top:2px; right:2px; background: #fff; border-radius: 100%; line-height: 20px; }
#content .user-info .img .btn.right i img { width:10px; height:10px; }
#content .user-info .btn { width:285px; margin:35px auto; }
#content .user-info .btn a { font-size: 16px; line-height: 16px; }
#content .user-info .btn a img { width:14px; vertical-align:middle; }

#content .user-info .point-wrap { position: relative; padding:0 20px; }
#content .user-info .point-wrap ul { overflow: hidden; margin:20px 0; }
#content .user-info .point-wrap ul li { float: left; width:33.3%; text-align: center; }
#content .user-info .point-wrap ul li a { font-size: 15px; color:#999999; }
#content .user-info .point-wrap ul li a span { display:block; border-right:solid 1px #EEEEEE; }
#content .user-info .point-wrap ul li:last-child a span { border:0; }
#content .user-info .point-wrap ul li img { width:10px; }
#content .user-info .point-wrap ul li img.icon { width:auto; height:40px; }
#content .user-info .point-wrap ul li em { display: block; font-size: 18px; font-weight: bold; color:#222; font-style: normal; }
#content .user-info .point-wrap > a { position: relative; display:block; font-size: 15px; text-align: center; padding:10px 0; border-radius:5px; border:solid 1px #DDDDDD; color:#222; }
#content .user-info .point-wrap > a::before { content: ''; position: absolute; width:14px; height:14px; right:14px; top:14px; background: url('/static/img/cuesco/arrow_right_gray.png') no-repeat; background-size:14px; }

.premium #header { background: #26548F; }
.premium #content .main-nav { background: #26548F; }
.premium #content .user-info::before { background: #26548F; }

#content .match-total { position:relative; padding-bottom:35px; }
#content .match-total h2 { text-indent: 20px; font-size:20px; margin-bottom:20px; font-weight:600; }
#content .match-total .report_box { border:solid 1px #999; }
#content .match-total .report_box .report .bot { padding:25px 0; }
#content .match-total.panel_box .box_desc { background:#F8F8F8; margin:0; }
#content .match-total.panel_box .box_desc .desc { text-align: center; font-size: 17px; }
#content .match-total.panel_box .box_desc .desc em { font-size: 22px; font-style: normal; }

#content .my-match { position:relative; padding:35px 20px; background: #F8F8F8; }
#content .my-match h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .my-match .btn { text-align: center; margin-top:40px; }
#content .my-match .btn a { position: relative; display:inline-block; width:160px; font-size: 14px; text-align: center; padding:5px 0; border-radius:40px; border:solid 1px #DDDDDD; color:#222; }
#content .my-match .btn a::before { content: ''; position: absolute; width:14px; height:14px; right:8px; top:8px; background: url('/static/img/cuesco/arrow_right_gray.png') no-repeat; background-size:14px; }

#content .challenge-list { position:relative; width:100%; margin-top:20px; padding:35px 0 15px 0; }
#content .challenge-list h2 { padding:0 20px 20px 20px; }
#content .challenge-list h2 img { width:60px; vertical-align: middle; margin-top:-25px; margin-right: 10px; }
#content .challenge-list .btn { padding: 0 20px; }
#content .challenge-list h2 + .btn a { position: relative; text-indent: 15px; text-align: left; box-shadow: 0px 0px 10px -8px #000; color:#222; font-weight: normal; }
#content .challenge-list h2 + .btn a em { font-style: normal; font-size: 16px; font-weight: bold; text-decoration: underline; color:#FF7F27; margin-left: 10px; }
#content .challenge-list h2 + .btn a::before { content: ''; position: absolute; right:15px; top:17px; width:14px; height: 14px; background: url('/static/img/cuesco/arrow_right_orange.png') no-repeat; background-size: 14px; }

#content .challenge-list .list { position: relative; margin:10px 20px 0 20px; box-shadow: 0px 0px 10px -8px #000; background: #fff; border-radius: 5px 5px 0 0; }
#content .challenge-list .list > p { width:100%; padding-top:25px; font-size: 18px; font-weight: bold; text-align: center; }
#content .challenge-list .list ul { white-space: nowrap; overflow-x: auto; }
#content .challenge-list .list ul li { display: inline-block; padding:20px 0; margin-left: 15px; }
#content .challenge-list .list ul li p { position: relative; width:75px; margin: 0 auto; }
#content .challenge-list .list ul li p.name { width:auto; }
#content .challenge-list .list ul li p img { width:75px; height: 75px; border-radius: 100%; }
#content .challenge-list .list ul li p > span { position: absolute; width:28px; height: 35px; right:-5px; top:-5px; background:url('/static/img/cuesco/lv_bg.png') no-repeat; background-size: 28px 35px; font-size: 14px; font-weight: bold; border-radius:13px; color:#222; display: block; text-align:center; line-height: 35px; }
#content .challenge-list .list + .btn a { border-radius: 0 0 5px 5px; }
#content .challenge-list .list + .btn a img { width:14px; vertical-align: middle; margin-top:-3px; }

#content .club-list { position:relative; width:100%; padding:15px 0 15px 0; border-top:solid 10px #fff; ; background: #F8F8F8;}
#content .club-list h2 { text-indent:20px; font-size:20px; margin-bottom:20px; font-weight:600; }
#content .club-list h2 span { float: right;border: 1px solid #DDDDDD;border-radius: 5px;font-size: 0.5rem;line-height: 20px;margin: 0px 20px 0 0;text-indent: 0;padding: 3px 10px; }
#content .club-list h2 .my-position-btn { font-size: 13px; }
#content .club-list h2 .my-position-btn span { position: relative; padding-left:20px; }
#content .club-list h2 .my-position-btn span::before { content: ''; position: absolute; left:3px; top:6px; width:12.5px; height:12.5px; background:url("/static/img/cuesco/new/icon_arrow.png") no-repeat; background-size:100%; }
#content .club-list .club-info { overflow-x:auto; overflow-y:hidden; padding-bottom:20px; }
#content .club-list .club-info > div { table-layout: fixed; width: auto; display: block; white-space: nowrap; }
#content .club-list .club-info .club { display: inline-block; width:240px; margin-right:20px; border:solid 1px #d5d5d5; border-radius: 5px; box-shadow:-1px 4px 13px -4px #a7a7a7; min-height: 260px;}
#content .club-list .club-info .club:first-child { margin:0 20px; }
#content .club-list .club-info .club .img { position:relative; width:240px; height:135px; overflow:hidden; }
#content .club-list .club-info .club .img .overlay { position:absolute; bottom:0px; left:0px; width:100%; height:30px; background:#222; opacity:0.8; }
#content .club-list .club-info .club .img img { width:240px; height: 180px; border-radius: 5px; }
#content .club-list .club-info .club .img .addr { position:absolute; bottom:10px; left:0px; font-size:10px; font-weight:bold; color:#fff; text-indent:10px; }
#content .club-list .club-info .club .img .addr img { width:7px; margin-right:5px; vertical-align:middle; }
#content .club-list .club-info .club .info { padding:10px; color:#222; background-color: #fff;}
#content .club-list .club-info .club .info .name { font-size: 16px; margin-top:5px; overflow: hidden; text-overflow: ellipsis; }
#content .club-list .club-info .club .info .addr { position: relative; min-height: 40px; color:#999; margin:5px 0 10px 0; font-size:13px; line-height: 20px; white-space: normal; padding-left: 18px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
#content .club-list .club-info .club .info .addr::before { content: ''; background: url('/static/img/cuesco/addr_icon.png'); background-size: 16px; position: absolute; width: 16px; height: 16px; left:0px; top:2px; }
#content .club-list .club-info .club .info .addr img { width:16px; vertical-align: text-bottom; }
#content .club-list .club-info .club .info .tel { font-size: 14px; text-align:right; }

#content .club-list.franchise .club-info .club { margin-top:10px; }
#content .club-list.franchise .club-info .club.event { position: relative; }
#content .club-list.franchise .club-info .club.event::before { content: ''; background: url('/static/img/cuesco/new/flag_event.png') no-repeat; background-size: 100%; position: absolute; width: 45px; height: 33px; right:10px; top:-5px; z-index: 1; }
#content .club-list.franchise .club-info .club .info .addr { padding-left:47px; }
#content .club-list.franchise .club-info .club .info .addr span { position: absolute; left:0px; top:18px; font-size: 9px; color:#333; font-weight: bold; }
#content .club-list.franchise .club-info .club .info .addr::before { content: ''; background: url('/static/img/cuesco/new/icon_addr_red.png'); background-size: 100%; position: absolute; width: 10px; height: 12px; left:14px; top:5px; }

#content .challenge-ground-list { position:relative; padding:35px 0px; background: #fff; }
#content .challenge-ground-list h2 { font-size:20px; font-weight:600; padding: 0 20px; }
#content .challenge-ground-list .item-wrap { display: flex; align-items: center; overflow-x: auto; overflow-y: hidden; padding: 20px 0 20px 20px; }
#content .challenge-ground-list .item { width:350px; box-shadow: #ccc 0px 0 8px 0px; border-radius: 5px; flex: 0 0 auto; margin-right: 10px; }
#content .challenge-ground-list .item .info-wrap { padding: 15px; display: flex; justify-content: space-evenly; align-items: center; }
#content .challenge-ground-list .item .info-wrap .date { width: 86px; font-size: 11px; text-align: center; padding: 19px 0; background: #F8F8F8; border-radius: 5px; }
#content .challenge-ground-list .item .info-wrap .date em { font-size: 26px; font-weight: bold; font-style: normal; display: block; }
#content .challenge-ground-list .item .info-wrap .info { width: calc(100% - 106px); margin-left: 20px; }
#content .challenge-ground-list .item .info-wrap .info .place { display: flex; justify-content: space-between; align-items: center; }
#content .challenge-ground-list .item .info-wrap .info .place p { font-size: 14px; color: #777777; }
#content .challenge-ground-list .item .info-wrap .info .place p:first-child { color: #222; }
#content .challenge-ground-list .item .info-wrap .info .place p em:first-child { font-weight: bold; font-style: normal; }
#content .challenge-ground-list .item .info-wrap .info .place p em:last-child { opacity: 0.5; font-style: normal; }
#content .challenge-ground-list .item .info-wrap .info .club { font-size: 18px; font-weight: bold; margin-top: 10px; }
#content .challenge-ground-list .item .info-wrap .info .player { font-size: 12px; color: #777777; display: flex; margin-top: 5px; }
#content .challenge-ground-list .item .info-wrap .info .player span { height: 10px; display: flex; align-items: center; border-right: solid 1px #EEEEEE; margin-right: 5px; padding-right: 5px; }
#content .challenge-ground-list .item .btn { background: #028DFE; border-radius: 0 0 5px 5px; }
#content .challenge-ground-list .item .btn a { display: block; font-size: 15px; font-weight: bold; color: #fff; text-align: center; padding: 10px 0; }

#content .cueuny-player { position:relative; padding:35px 20px; background: #fff; }
#content .cueuny-player h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .cueuny-player .calender { background: #fff; padding: 20px 0; box-shadow: #ccc 0px 0 8px 0px; border-radius: 10px; }
#content .cueuny-player .calender .week { display: flex; align-items: center; overflow-x: auto; overflow-y: hidden; }
#content .cueuny-player .calender .week .day { width: 40px; margin: 0 5px; flex: 0 0 auto; }
#content .cueuny-player .calender .week .day .day-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 55px; }
#content .cueuny-player .calender .week .day .day-wrap .txt { font-size: 10px; color: #999999; }
#content .cueuny-player .calender .week .day .day-wrap .num { font-size: 20px; }
#content .cueuny-player .calender .week .day .day-wrap .num.red { color: #D0090B; }
#content .cueuny-player .calender .week .day .day-wrap .num.blue { color: #26548F; }
#content .cueuny-player .calender .week .day .day-wrap .bullet { display: flex; min-height: 5px; justify-content: space-evenly; align-items: center; }
#content .cueuny-player .calender .week .day .day-wrap .bullet span { display: block; width: 10px; height: 5px; margin-right: 2px; background: #ff0000; border-radius: 5px; }
#content .cueuny-player .calender .week .day .day-wrap .bullet span:last-child { margin-right: 0; }
#content .cueuny-player .calender .week .day .day-wrap .bullet span.orange { background: #FF7F27; }
#content .cueuny-player .calender .week .day .day-wrap .bullet span.blue { background: #028DFE; }
#content .cueuny-player .calender .week .day .day-wrap .bullet span.yellow { background: #FFD21D; }
#content .cueuny-player .calender .week .day.active .day-wrap { background: #BFBFBF; text-align: center; border-radius: 18px; }
#content .cueuny-player .calender .week .day.active .day-wrap .txt { font-weight: bold; }
#content .cueuny-player .item-list01 { margin-top: 30px; }
#content .cueuny-player .item-list01 .item { background: #fff; padding: 10px 15px; margin-top: 10px; box-shadow: #ccc 0px 0 8px 0px; border-radius: 10px; }
#content .cueuny-player .item-list01 .item .top { position: relative; padding-bottom: 15px; }
#content .cueuny-player .item-list01 .item .top .player { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
#content .cueuny-player .item-list01 .item .top .player .info .class { font-size: 12px; }
#content .cueuny-player .item-list01 .item .top .player .info .name { font-size: 18px; }
#content .cueuny-player .item-list01 .item .top .player .info .time { font-size: 14px; color: #777; }
#content .cueuny-player .item-list01 .item .top .player .info .price { color: #777; font-size:13px; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; }
#content .cueuny-player .item-list01 .item .top .player .info .price em { font-size: 22px; font-style: normal; font-weight: bold; color: #ff7f28;}
#content .cueuny-player .item-list01 .item .top .player .photo img { width: 80px; height: 80px; border-radius: 100%; }
#content .cueuny-player .item-list01 .item .bottom { display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding-top: 15px; border-top: dotted 1px #ddd; }
#content .cueuny-player .item-list01 .item .bottom .club { font-size: 14px; }
#content .cueuny-player .item-list01 .item .bottom .club .addr { color: #999999; }
#content .cueuny-player .item-list01 .item .bottom .club .tel { color: #999999;  }
#content .cueuny-player .item-list01 .item .bottom .location { font-size: 12px; font-weight: bold; text-align: center; }
#content .cueuny-player .item-list01 .item .bottom .location img { width: 15px; }
#content .cueuny-player .more-btn { text-align: center; margin-top: 10px; }
#content .cueuny-player .more-btn a { display: block; width: 150px; margin: 0 auto; padding: 8px 0; border-radius: 50px; font-size: 14px; border:solid 1px #222; }

#content .main-box-menu { position:relative; padding:10px 20px; background: #fff; }
#content .main-box-menu h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .main-box-menu .list2 ul { display: flex; justify-content: space-between; align-items: center; }
#content .main-box-menu .list2 ul li { width: 31.3%; background: #222; border-radius: 10px; text-align: left; font-size: 14px; }
#content .main-box-menu .list2 ul li img { position: absolute; right: 10px; bottom: 10px; width: 7px; height: 10px; margin-top: 5px; }
#content .main-box-menu .list2 ul li a { position: relative; display: block; padding: 10px 15px 20px 15px; color: #fff; }
#content .main-box-menu .list ul li { overflow:hidden; font-size: 16px; font-weight: bold; padding:20px 0; border-bottom:solid 1px #DDDDDD; }
#content .main-box-menu .list ul li p { float:left; position: relative; }
#content .main-box-menu .list ul li p span { position: absolute; right:-25px; top:-20px; display: block; width:39px; height:31px; font-size: 12px; color:#FF7F27; background:url('/static/img/cuesco/new/txt_bubble02.png'); background-size: 100%; text-align: center; line-height: 23px; }
#content .main-box-menu .list ul li a { display: block; float: right; width: 90px; text-align: center; padding:3px 0; font-size: 14px; font-weight: bold; background: #dedede; border-radius: 50px; }
#content .main-box-menu .list ul li a img { width:14px; vertical-align: middle; margin-bottom: 2px; }

#content .possible-race { position:relative; padding:10px 20px; background: #fff; }
#content .possible-race h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .possible-race .round-date { display: flex; justify-content: space-between; align-content: center; border-bottom: solid 1px #DDDDDD; padding-bottom: 5px; }
#content .possible-race .race-swiper-wrap { display: flex; align-items: center; }
#content .possible-race .race-swiper-wrap .btn-prev img { width: 5vw; }
#content .possible-race .race-swiper-wrap .btn-next img { width: 5vw; }
#content .possible-race .swiper-race { overflow: hidden; }
#content .possible-race .player_wrap { display: flex; justify-content: space-around; align-content: center; margin: 10px 0; }
#content .possible-race .player_wrap .vs { width: 10vw; align-self: center; text-align: center; }
#content .possible-race .player_wrap .player { width: 45vw; position:relative; }
#content .possible-race .player_wrap .player .player_thumbnail {float:left; width:33%; text-align: center;}
#content .possible-race .player_wrap .player .player_thumbnail img {height:40px; width:40px;}
#content .possible-race .player_wrap .player .name_flag {float:left; margin-left:5px; width:calc(67% - 5px);}
#content .possible-race .player_wrap .player .name_flag p { margin-left:5px; font-size:12px; padding-top:5px; color:#222; font-weight:500; text-align:left; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#content .possible-race .player_wrap .player .name_flag .flag { position: absolute; left:30px; bottom:-5px; text-align:left; margin: 0; }
#content .possible-race .player_wrap .player .name_flag .flag img { width:16px; border:solid 2px #fff; border-radius:16px; }
#content .possible-race .player_wrap .player .name_flag.left { margin: 0 5px 0 0; }
#content .possible-race .player_wrap .player .name_flag.left p { margin: 0 5px 0 0; font-size:12px; padding-top:5px; text-align: right; }
#content .possible-race .player_wrap .player .name_flag.left .flag { position: absolute; right:30px; left: auto; bottom:-5px; z-index: 1; }

#content .stat-race { position:relative; padding:10px 20px; background: #fff; }
#content .stat-race h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .stat-race { position: relative; }
#content .stat-race .rank-list { background: #f8f8f8; border-radius: 5px; }
#content .stat-race .rank-list .no-data { font-size: 14px; color:#999999; text-align: center; padding:20px 0; }
#content .stat-race .rank-list .no-data img { width:24px; vertical-align: middle; }
#content .stat-race .rank-list .item { position:relative; padding:0 10px; }
#content .stat-race .rank-list .item ul { display: flex; justify-content: center; align-content: center; padding:10px 0; }
#content .stat-race .rank-list .item ul li { display: flex; align-self: center; width:65%; }
#content .stat-race .rank-list .item ul li.player { display: flex; justify-content: center; align-content: center; }
#content .stat-race .rank-list .item ul li:first-child { width:15%; }
#content .stat-race .rank-list .item ul li:last-child { text-align: center; width:20%; }
#content .stat-race .rank-list .item ul li i { display: block; width:30px; height:30px; line-height: 30px; font-style: normal; font-size: 15px; font-weight: bold; text-align: center; }
#content .stat-race .rank-list .item ul li i.rank01 { background: url('../img/rank_bg01.png') no-repeat; background-size:100%; }
#content .stat-race .rank-list .item ul li i.rank02 { background: url('../img/rank_bg02.png') no-repeat; background-size:100%; }
#content .stat-race .rank-list .item ul li i.rank03 { background: url('../img/rank_bg03.png') no-repeat; background-size:100%; }
#content .stat-race .rank-list .item ul li > div { float: left; }
#content .stat-race .rank-list .item ul li > div.img { width:25%; margin-right:10px; padding:2px 0; vertical-align: middle; }
#content .stat-race .rank-list .item ul li > div.name { width:calc(75% - 10px); }
#content .stat-race .rank-list .item ul li .img img { width:40px; height:40px; border-radius: 100%; }
#content .stat-race .rank-list .item ul li .name { align-self: center; font-size: 16px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#content .stat-race .rank-list .item ul li .point { color:#222; font-size: 14px; }

#content .community-list { position:relative; padding:35px 20px 0; background: #fff; }
#content .community-list h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .community-list h2 a { overflow:hidden; display: block; }
#content .community-list h2 img { float:right; width:14px; padding-top:8px; }
#content .community-list table { border-top:solid 1px #DDDDDD; }
#content .community-list table td { font-size: 14px; color:#666666; padding:10px 0; border-bottom:solid 1px #f3f3f3; }
#content .community-list table td p a {display: -webkit-box;height: 20px;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 1;-webkit-box-orient: vertical;padding-left: 94px;}
#content .community-list table td p span { display: inline-block; width: 84px; padding: 3px 0; text-align: center; color: #fff; border-radius: 30px;color: #fff; position: absolute;max-height: 22px; overflow: hidden;text-overflow: ellipsis;white-space: nowrap; font-size: 0.8rem;}
#content .community-list table td p span.type01 { background: #FF7F27;}
#content .community-list table td p span.type02 { background: #26548F;}
#content .community-list table td p span.type03 { background: #F5C82F;}
#content .community-list table td p span.type04 { background: #05B4C1;}
#content .community-list table td p span.type05 { background: #111;}
/*#content .community-list table td:last-child { text-align: right; width:20%; color:#999999; }*/

#content .notice-list { position:relative; padding:35px 20px 0; background: #fff; }
#content .notice-list h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .notice-list h2 a { overflow:hidden; display: block; }
#content .notice-list h2 img { float:right; width:14px; padding-top:8px; }
#content .notice-list table { border-top:solid 1px #DDDDDD; }
#content .notice-list table td { font-size: 14px; color:#666666; padding:15px 0; border-bottom:solid 1px #DDDDDD; }
#content .notice-list table td p { display: -webkit-box; height:20px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
#content .notice-list table td:last-child { text-align: right; width:30%; color:#999999; }

#content .cuesco-event { position:relative; padding:35px 20px; background: #fff; }
#content .cuesco-event h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .cuesco-event .item { width:100%; box-sizing: border-box; border-radius: 5px; overflow: hidden;}
#content .cuesco-event .item .title { font-size: 20px; color:#222; }
#content .cuesco-event .item .cont { float:left; width:calc(100% - 120px); height: 104px; font-size: 14px; color:#999999; background: url('/static/img/cuesco/event_arrow.png') no-repeat; background-size:32px; background-position: 0px 80px; }
#content .cuesco-event .item .img { float: right; }
#content .cuesco-event .item img { width:100%; display: block; }
#content .cuesco-event .item.img { padding:0; }
#content .cuesco-event .item.img a { display: block; }
#content .cuesco-event .item.img a img { width:100%; vertical-align: bottom; }

#content .main-top-menu { position:relative; padding:0 20px; margin-top: 20px; }
#content .main-top-menu ul { overflow:hidden; }
#content .main-top-menu ul li { float:left; width:calc(33.3% - 7px); margin-right: 10px; text-align:center; padding-bottom:10px; background:#222; border-radius: 10px; }
#content .main-top-menu ul li a { position: relative; display:block; color:#fff; font-size: 3.7vw; }
#content .main-top-menu ul li:last-child { margin-right: 0px; }
#content .main-top-menu ul li i { display:block; width:15.5vw; height:15.5vw; line-height: 18.5vw; border-radius: 100%; margin:0 auto; }
#content .main-top-menu ul li i img { width:10.5vw; height: 10.5vw; vertical-align: middle; }

#content .main-menu { position:relative; padding:0 20px; margin-bottom: 20px; }
#content .main-menu ul { overflow:hidden; background:#fff; }
#content .main-menu ul li { float:left; width:25%; text-align:center; margin-top:20px; }
#content .main-menu ul li a { display:block; color:#222; font-size: 3.7vw; }
#content .main-menu ul li i { display:block; width:18.5vw; height:18.5vw; line-height: 18.5vw; border-radius: 100%; border:solid 1px #EEEEEE; margin:0 auto 10px auto; }
#content .main-menu ul li i img { width:10.5vw; height: 10.5vw; vertical-align: middle; }
#content .main-menu ul li span { display:block; width:50px; height:55px; margin:0 auto; }
#content .main-menu ul li:nth-child(1) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-58px -7px; background-size:500px; }
#content .main-menu ul li:nth-child(2) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-224px -7px; background-size:500px; }
#content .main-menu ul li:nth-child(3) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-390px -7px; background-size:500px; }
#content .main-menu ul li:nth-child(4) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-58px -129px; background-size:500px; }
#content .main-menu ul li:nth-child(5) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-224px -129px; background-size:500px; }
#content .main-menu ul li:nth-child(6) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-390px -129px; background-size:500px; }
#content .main-menu ul li:nth-child(7) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-58px -247px; background-size:500px; }
#content .main-menu ul li:nth-child(8) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-224px -247px; background-size:500px; }
#content .main-menu ul li:nth-child(9) span { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/main_menu_icon.png') no-repeat; background-position:-390px -247px; background-size:500px; }

#content .main-menu.my { background:#F8F8F8; padding-bottom: 20px; }
#content .main-menu.my ul { background:#F8F8F8; }
#content .main-menu.my ul li i { background:#fff; }

#content #tab-content .my-cueuny-date { font-size: 20px; font-weight: bold; font-family: Montserrat; text-align: center; margin: 15px 0; }

#content #tab-content .my-race { margin: 0 20px; background: #333; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; border-radius: 13px; }
#content #tab-content .my-race .race-box { background: #fff; border-radius: 13px; overflow: hidden; }
#content #tab-content .my-race .race-box .level { width: 107px; height: 55px; margin: 0 auto; text-align: center; background: url('/static/img/main/bg_level.png') no-repeat; background-size: 100%; padding: 30px 0; }
#content #tab-content .my-race .race-box .level p { color: #fff; font-size: 11px; font-family: Montserrat; }
#content #tab-content .my-race .race-box .level p.num { color: #fff; font-size: 34px; font-weight: bold; font-family: Montserrat; }
#content #tab-content .my-race .race-box .race-info { display: flex; flex-direction: row; justify-content: center; background:#fff; padding: 0; }
#content #tab-content .my-race .race-box .race-info .rank { font-size: 14px; font-weight: bold; background: none; margin: 0 10px 0 0; }
#content #tab-content .my-race .race-box .race-info .rank em { font-size: 24px; font-style: normal; font-family: Montserrat; }
#content #tab-content .my-race .race-box .race-info .exp { width: 200px; height:26px; background:#E6E6E6; font-family: Montserrat; border-radius: 26px; }
#content #tab-content .my-race .race-box .race-info .exp > div { position: relative; }
#content #tab-content .my-race .race-box .race-info .exp > div .num { position: absolute; top: 0; right: 10px; text-align: right; font-size: 14px; color: #a8a8a8; line-height: 26px; z-index: 2; }
#content #tab-content .my-race .race-box .race-info .exp > div .num em { font-weight: bold; font-style: normal; color: #222; }
#content #tab-content .my-race .race-box .race-info .exp > div .active { position: absolute; height: 26px; left:0; top: 0; background: #FF7F27; line-height: 26px; border-radius: 26px; padding-left: 10px; font-size: 14px; z-index: 1; }
#content #tab-content .my-race .race-btn a { display: block; font-size: 14px; font-weight: bold; text-align: center; padding: 10px 0; color: #fff; }
#content #tab-content .my-race .race-btn a img { width: 14px; vertical-align: middle; margin-left: 10px; margin-top: -2px; }

#content #tab-content .my-lotto { margin: 30px 20px 0 20px; padding: 0; background: #333; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; border-radius: 13px; }
#content #tab-content .my-lotto .lotto-box { position: relative; background: #fff; border-radius: 13px; height: 80px; }
#content #tab-content .my-lotto .lotto-box .lotto-cnt { position: absolute; left: 10px; top: 10px; width: 100px; height: 60px; text-align: center; background: #028DFE; border-radius: 13px; padding: 20px 0; z-index: 1; }
#content #tab-content .my-lotto .lotto-box .lotto-cnt p { font-weight: bold; font-size: 11px; color: #fff; }
#content #tab-content .my-lotto .lotto-box .lotto-cnt p.num { font-size: 40px; margin-top: 5px; }
#content #tab-content .my-lotto .lotto-box .recent { float: right; width: calc(100% - 130px); padding-right: 10px; }
#content #tab-content .my-lotto .lotto-box .recent p { font-size: 11px; font-weight: bold; text-align: center; margin: 10px 0; }
#content #tab-content .my-lotto .lotto-box .ball { display: flex; flex-direction: row; justify-content: space-between; }
#content #tab-content .my-lotto .lotto-box .ball .lotto-ball { width: 30px; height: 30px; font-size: 14px; font-family: Montserrat; line-height: 30px; }
#content #tab-content .my-lotto .lotto-box .ball .lotto-ball span { width: 30px; height: 30px; }
#content #tab-content .my-lotto .lotto-btn { display: flex; flex-direction: row; justify-content: flex-end; }
#content #tab-content .my-lotto .lotto-btn a { width: calc(50% - 60px); display: block; font-size: 14px; font-weight: bold; text-align: center; padding: 10px 0; color: #fff; }
#content #tab-content .my-lotto .lotto-btn a img { width: 14px; vertical-align: middle; margin-left: 10px; margin-top: -2px; }

#content #tab-content .my-stamp { margin: 30px 20px 0 20px; padding: 0; background: #333; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; border-radius: 13px; }
#content #tab-content .my-stamp .stamp-box { position: relative; background: #26548F; border-radius: 13px; padding-bottom: 50px; }
#content #tab-content .my-stamp .stamp-box .stamp-cnt { display: flex; flex-direction: row; justify-content: space-between; }
#content #tab-content .my-stamp .stamp-box .stamp-cnt > div { width: 50%; text-align: center; color: #fff; margin: 20px 0; border-right: solid 1px rgba(255, 255, 255, 0.2); }
#content #tab-content .my-stamp .stamp-box .stamp-cnt > div p { font-weight: bold; font-size: 11px; }
#content #tab-content .my-stamp .stamp-box .stamp-cnt > div p.num { font-size: 30px; }
#content #tab-content .my-stamp .stamp-box .recent-product { position: absolute; left: 0; bottom: -50px; width: calc(100% - 20px); display: flex; flex-direction: row; justify-content: space-between; align-content: center; background: #fff; border-radius: 13px; margin: 0 10px; padding: 15px 0; }
#content #tab-content .my-stamp .stamp-box .recent-product img { width: 66px; height:66px; border-radius: 100%; border: solid 1px #ccc; }
#content #tab-content .my-stamp .stamp-box .recent-product > div { width: 30%; text-align: center; }
#content #tab-content .my-stamp .stamp-box .recent-product .info { width: 70%; text-align: left; }
#content #tab-content .my-stamp .stamp-box .recent-product .info > p { font-size: 11px; font-weight: bold; margin-bottom: 10px; text-indent: 10px; }
#content #tab-content .my-stamp .stamp-box .recent-product .info .product p { font-size: 16px; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
#content #tab-content .my-stamp .stamp-box .recent-product .info .product p.date { font-size: 14px; font-weight: normal; font-family: Montserrat; }
#content #tab-content .my-stamp .stamp-btn { margin-top: 50px; }
#content #tab-content .my-stamp .stamp-btn a { display: block; font-size: 14px; font-weight: bold; text-align: center; padding: 10px 0; color: #fff; }
#content #tab-content .my-stamp .stamp-btn a img { width: 14px; vertical-align: middle; margin-left: 10px; margin-top: -2px; }

#content .gold-bar-event { position: relative; padding:30px 20px 20px 20px; }
#content .gold-bar-event > div { position: relative; background: #fff; border:solid 1px #DDDDDD; border-radius:13px; color: #fff; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; }
#content .gold-bar-event > div > div { background: #333; padding:20px; border-radius: 13px; }
#content .gold-bar-event > div > div > p { width:100%; text-align: center; }
#content .gold-bar-event > div > div > span { display: block; width:100%; text-align: center; color:#FF7F27; font-size: 12px; }
#content .gold-bar-event > div > .gold-bar-state { margin: 10px 0; padding: 5px; background: #fff; font-size:16px; text-align: center;font-weight: bold ;color: #1f2c36;}
#content .gold-bar-event > div > .gold-bar-state > table { margin-top:10px }
#content .gold-bar-event > div > .gold-bar-state > table td { height: 30px; text-align: center; border-right: solid 1px #EEEEEE; }
#content .gold-bar-event > div > .gold-bar-state > table td:last-child { border: 0; }
#content .gold-bar-event > div > .gold-bar-state > table img { width: 10px; vertical-align: middle; margin-right: 1px;}
#content .gold-bar-event .tit01 { font-size: 14px; }
#content .gold-bar-event .tit02 { font-size: 25px; font-weight: bold; }
#content .gold-bar-event .gold-bar { width:220px; margin:20px auto 10px auto; }
#content .gold-bar-event .gold-bar ul { overflow:hidden; }
#content .gold-bar-event .gold-bar ul li { float:left; width:36px; height:60px; background:url("/static/img/cuesco/new/goldbar_off.png") no-repeat; background-size: 100%; margin-right:10px; opacity: 0.2; }
#content .gold-bar-event .gold-bar ul li:last-child { margin-right:0; }
#content .gold-bar-event .gold-bar ul li.active { background:url("/static/img/cuesco/new/goldbar.png") no-repeat; background-size: 100%; opacity: 1; }
#content .gold-bar-event .help-btn { position: absolute; right:10px; top:10px; }
#content .gold-bar-event .help-btn img { width:24px; }

#content .cuesco-competition-ranking { position:relative; padding:35px 20px 0; background: #fff; }
#content .cuesco-competition-ranking h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .cuesco-competition-ranking .swiper-container2 {}
#content .cuesco-competition-ranking .swiper-container2 .swiper-wrapper {}
#content .cuesco-competition-ranking .swiper-container2 .swiper-wrapper .swiper-slide { padding: 10px 0; border-radius: 10px; background: #028DFE; }
#content .cuesco-competition-ranking .swiper-container2 .swiper-wrapper .swiper-slide > p { padding-left: 20px; font-size: 16px; font-weight: bold; color: #fff; }
#content .cuesco-competition-ranking .ranking_card .card { border-radius: 10px; }
#content .cuesco-competition-ranking .ranking_card ul .card { padding: 10px 0; }
#content .cuesco-competition-ranking .ranking_card ul li:first-child { padding-top: 20px; }
#content .cuesco-competition-ranking .ranking_card ul li:last-child { padding-top: 20px; }

#help-popup { position: fixed; width:100%; height:100%; top:0; left:0; background: rgba(0, 0, 0, 0.7); z-index: 99999; display: none; }
#help-popup > div { position: relative; background:#fff; width:90%; margin:calc(20% - 50px) auto 0 auto; padding:40px 0 20px 0;}
#help-popup > div a { position: absolute; right:10px; top:10px; }
#help-popup > div a img { width:24px; }
#help-popup > div p { text-align: center; }
#help-popup > div p:nth-child(2) { font-size: 14px; }
#help-popup > div p:nth-child(3) { font-size: 25px; font-weight: bold; }
#help-popup > div p:nth-child(4) { font-size: 14px; color:#666666; margin:20px 0; }
#help-popup > div p:nth-child(4) em { color:#222; font-weight: bold; font-style: normal; }
#help-popup > div p:nth-child(5) img { width:174px; }
#help-popup > div p:nth-child(6) { font-size: 12px; color:#999999; text-align: left; padding-left:10px; margin-top:20px; }

#content .cueuny-history { position:relative; padding:35px 20px; background: #fff; }
#content .cueuny-history h2 { font-size:20px; margin-bottom:20px; font-weight:600; }
#content .cueuny-history table { border-top:solid 1px #222; }
#content .cueuny-history table td { text-align: center; font-size: 14px; border-bottom:solid 1px #E6E6E6; padding:20px 0; }
#content .cueuny-history table td:first-child { width:23vw; }
#content .cueuny-history table td:last-child { text-align: left; padding-left:10px; }
#content .cueuny-history table td p { font-size: 14px; font-weight: bold; }
#content .cueuny-history table td p.flag { width:84px; margin:0 auto; text-align: center; font-size: 12px; color:#fff; border-radius: 30px; padding:4px 0; }
#content .cueuny-history table td p.flag.race { background:#05B4C1; }
#content .cueuny-history table td p.flag.lotto { background:#26548F; }
#content .cueuny-history table td p.flag.mileage { background:#FF7F27; }
#content .cueuny-history table td p.flag.stamp { background:#F5C82F; }
#content .cueuny-history table td p.flag.premium, #content .cueuny-history table td p.flag.coupon { background:#E2100F; }
#content .cueuny-history table td p.flag.event { background:#521CB1; }
#content .cueuny-history table td p.flag.goldbar { background: gold; }
#content .cueuny-history table td p.flag.candy { background: #c150c3; }

#content .cube-live { position:relative; width:100%; background:#f8f8f8; padding:10px 0px;}
#content .cube-live h2 { text-indent:15px; font-size:25px; padding-bottom:25px; font-weight:600; background:#fff; padding-top:20px;}
#content .cube-live .player-list { position:relative; width:100%; padding-left:10px; overflow-x:auto; overflow-y:hidden; background:#fff; padding-bottom:20px;}
#content .cube-live .player-list ul { overflow:hidden; }
#content .cube-live .player-list ul li { float:left; width:70px; margin-right:15px; }
#content .cube-live .player-list ul li .img { width:60px; height:60px; margin:0 auto; }
#content .cube-live .player-list ul li .img img { width:60px; height:60px; border-radius:60px; background:#ccc; }
#content .cube-live .player-list ul li .name { font-size:15px; text-align:center; font-weight:400; color:#222; }
#content .cube-live .player-list ul li .nation { font-size:13px; text-align:center; font-weight:bold;  color:#a9a9a9; }

#content .my-info { position:relative; background:#f8f8f8;}
#content .my-info .my-box { padding:20px 10px; background:#fff; }
#content .my-info .my-box .top { overflow:hidden; margin-bottom:10px; padding-bottom:10px; border-bottom:dashed 2px #ededed;}
#content .my-info .my-box .top .player { float:left; width:55%; }
#content .my-info .my-box .top .player .img { float:left; }
#content .my-info .my-box .top .player .img img { width:70px; height:70px; border-radius:70px; background:#ccc; }
#content .my-info .my-box .top .player .right { float:left; padding:12px 10px; }
#content .my-info .my-box .top .player .right .level { padding:0 5px; background:#ff7f27; font-weight:bold; }
#content .my-info .my-box .top .player .right .name { font-size:18px; }
#content .my-info .my-box .top .avg { float:right; width:45%; padding:8px 0; }
#content .my-info .my-box .top .avg p { text-align:right; font-size:20px; font-weight:400px; }
#content .my-info .my-box .top .avg p span { float:left; font-size:15px; color:#999; padding:3px 0; }
#content .my-info .my-box .bottom { overflow:hidden; }
#content .my-info .my-box .bottom .handi { float:left; width:25%; }
#content .my-info .my-box .bottom .handi .num {font-size:50px; font-weight:bold; color:#ff7f27; text-align:center; line-height:60px; border-bottom:solid 2px #ededed; }
#content .my-info .my-box .bottom .handi .title { text-align:center; color:#999; letter-spacing:7px; font-weight:500; }
#content .my-info .my-box .bottom .handi .title span { display:block; background:#ededed; }
#content .my-info .my-box .bottom .score { float:left; width:70%; background:#f8f8f8; margin-left:5%; padding:28.5px 0; }
#content .my-info .my-box .bottom .score > div { float:left; width:33%; text-align:center; }
#content .my-info .my-box .bottom .score .score1 { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/line.png') no-repeat; background-size:1px; background-position:right; }
#content .my-info .my-box .bottom .score .score2 { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/line.png') no-repeat; background-size:1px; background-position:right; }
#content .my-info .my-box .bottom .score .score3 { background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/line.png') no-repeat; background-size:1px; background-position:right; }
#content .my-info .my-box .bottom .score .title { color:#999; margin-bottom:5px; }
#content .my-info .my-box .bottom .score .num { font-weight:bold; }

#content .banner { position:relative; }
#content .banner img { width:100%; display: block; }

#content .rank { position:relative; margin-top:35px;padding-bottom:10px;background:#f8f8f8;}
#content .rank .lv-rank { overflow:hidden; background:#fff; padding:0 15px;}
#content .rank .lv-rank .chart { float:left; width:40%; }
#content .rank .lv-rank .chart .round_chart { width:90px; height:90px; position: relative; border-radius: 50%; transition: 0.3s;
    background: conic-gradient(rgb(213, 213, 213) 0%, rgb(213, 213, 213) 43%, rgb(255, 127, 39) 43%, rgb(255, 172, 62) 100%);
    display:inline-block; }
#content .rank .lv-rank .chart .round_chart span { background: #fff; display : block; position: absolute; top:50%; left:50%; width:80px; height:80px; border-radius: 50%; text-align:center; line-height: 80px; transform: translate(-50%, -50%); }
#content .rank .lv-rank .chart p { width:90px; text-align:center; color:#999; }
#content .rank .lv-rank .info { float:left; width:60%; }
#content .rank .lv-rank .info p { font-weight:bold; text-align:right; margin-top:5px; }
#content .rank .lv-rank .info p span { float:left; color:#999; }
#content .rank .lv-rank .info .etc { color:#999; font-weight:normal; font-size:12px; margin-top:10px; text-align:left; }
#content .rank .ck-rank { overflow:hidden;background:#fff; padding:30px 15px 20px 15px;}
#content .rank .ck-rank .icon { float:left; width:40%; }
#content .rank .ck-rank .icon img { width:90px; }
#content .rank .ck-rank .info { float:left; width:60%; }
#content .rank .ck-rank .info p { font-weight:bold; text-align:right; margin-top:5px; }
#content .rank .ck-rank .info p span { float:left; color:#999; }
#content .rank .ck-rank .info .etc { color:#999; font-weight:normal; font-size:12px; margin-top:10px; text-align:left; }

#content .notice { position:relative; width:100%; margin-top:35px; }
#content .notice h2 { text-indent:15px; font-size:25px; margin-bottom:25px; font-weight:600; background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/arrow.png') no-repeat; background-size:8px; background-position:right; margin-right:15px; }
#content .notice .list { overflow-x: auto; overflow-y: hidden; }
#content .notice .list .scroll { overflow:hidden; padding-left:15px; }
#content .notice .list .noti { float:left; width:300px; border-top:solid 1px #d5d5d5; border-bottom:solid 1px #d5d5d5; padding:20px 0; margin-right:15px; }
#content .notice .list .noti .title {height:48px;}
#content .notice .list .noti > div { font-size:13px; color:#999; }
#content .notice .list .noti > div .date { float:left; margin-right:20px; }
#content .notice .list .noti > div .view-cnt {}

#content .youtube { position:relative; width:100%; margin-top:35px; }
#content .youtube h2 { text-indent:15px; font-size:25px; margin-bottom:25px; font-weight:600; background:url('https://s3.ap-northeast-2.amazonaws.com/static.cuesco.co.kr/np/img/main/arrow.png') no-repeat; background-size:8px; background-position:right; margin-right:15px; }
#content .youtube .list { overflow-x: auto; overflow-y: hidden; }
#content .youtube .list .scroll { overflow:hidden; padding-left:15px; }
#content .youtube .list .scroll .video { float:left; margin-right:15px; }
#content .youtube .list .scroll .video .img img { width:150px; }
#content .youtube .list .scroll .video .type { font-weight:bold; }
#content .youtube .list .scroll .video .title { color:#999; font-size:13px; }

#content .highrun { position:relative; width:100%; margin-top:35px; }
#content .highrun h2 { text-indent:15px; font-size:25px; margin-bottom:25px; font-weight:600; }
#content .highrun table {}
#content .highrun table th { background:#d5d5d5; text-align:center; padding:15px 0; font-weight:normal; }
#content .highrun table td { text-align:center; padding:10px 0; border:solid 1px #d5d5d5; }
#content .highrun table td.rank { color:#999; background:#f8f8f8; border-left:0px; }
#content .highrun table td.hrname {text-align:left; padding-left:5px;overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
#content .highrun table td img { width:40px; height:40px; border-radius:40px; background:#999; vertical-align:middle; }
#content .highrun table td span { padding:5px 20px; background:#d5d5d5;}
#content .highrun table td span a {color:#222; }

#content .race-info { position: relative; background: #222; padding-bottom:80px; }
#content .race-info > p { font-size: 20px; font-weight: bold; text-align: center; color:#fff; }
#content .race-info .season-rank { overflow: hidden; }
#content .race-info .season-rank > div { float: left; }
#content .race-info .season-rank .left-btn { width:12%; padding-top:84px; text-align:center; }
#content .race-info .season-rank .left-btn a { font-size: 13px; color:#666666; }
#content .race-info .season-rank .left-btn a span { display: block; }
#content .race-info .season-rank .left-btn img { width:30px; }
#content .race-info .season-rank .right-btn { width:12%; padding-top:84px; text-align:center; }
#content .race-info .season-rank .right-btn a { font-size: 13px; color:#666666; }
#content .race-info .season-rank .right-btn a span { display: block; }
#content .race-info .season-rank .right-btn img { width:30px; }
#content .race-info .season-rank .chart { width:76%; min-height: 235px; }
#content .race-info .season-rank .chart .epie-chart { position: relative; }
#content .race-info .season-rank .chart .epie-chart canvas { display: block; margin: 0 auto; }
#content .race-info .season-rank .chart .epie-chart > div { position: absolute; padding-top:30px; width:100%; text-align: center; }
#content .race-info .season-rank .chart .epie-chart > div p { display: block; width:100%; text-align: center; }
#content .race-info .season-rank .chart .epie-chart .level { width: 56px; height:38px; font-size: 14px; margin:0 auto; background: url('/static/img/cuesco/lv_bg.png') no-repeat; background-size: 100%; padding:16px 0; line-height: 16px; }
#content .race-info .season-rank .chart .epie-chart .level em { display: block; font-size: 20px; font-weight: bold; font-style: normal; }
#content .race-info .season-rank .chart .epie-chart .rank { font-size: 18px; font-weight: bold; color:#fff; background: none; margin-top:15px; }
#content .race-info .season-rank .chart .epie-chart .rank em { font-size: 24px; font-style: normal; }
#content .race-info .season-rank .chart .epie-chart .exp { font-size: 16px; color:#CCCCCC; }

#content .next-level { position: relative; background: #F8F8F8; height: 200px; }
#content .next-level > div { position: absolute; left:0px; top:-70px; width:100%; padding:0 20px; box-sizing: border-box; }
#content .next-level h2 { font-size:20px; font-weight: bold; color:#fff; }
#content .next-level table { border-collapse:inherit; margin-top:15px; border:solid 1px #ff7f27; border-radius: 5px; background:#fff; box-sizing: border-box; }
#content .next-level table td { padding:8px 0; font-size: 14px; text-align: center; }
#content .next-level table td img { width:26px; }
#content .next-level table td.title { color:#999999; text-align: left; text-indent: 10px; }
#content .next-level table td.premium { background: #ECF5FB; }
#content .next-level table td i { display: inline-block; width:40px; height: 40px; text-align: center; border-radius: 100%; background: #F8F8F8; text-indent:0; line-height: 40px; }
#content .next-level table td i img { vertical-align: middle; }
#content .next-level table td em { font-size: 18px; font-weight: bold; font-style: normal; }

#content .my-rank { position: relative; background: #F8F8F8; padding:0 20px; }
#content .my-rank h2 { font-size:20px; font-weight: bold; padding:20px 0; }
#content .my-rank > div { position: relative; }
#content .my-rank > div ul { overflow: hidden; }
#content .my-rank > div ul li { float: left; width:50%; background: #fff; border-radius: 5px; margin-bottom:7px; padding:15px; box-sizing: border-box; font-size: 14px; }
#content .my-rank > div ul li:nth-child(odd) { width:calc(50% - 7px); margin-right:7px; }
#content .my-rank > div ul li .title { font-size: 16px; }
#content .my-rank > div ul li .c_rank { font-weight: bold; font-size: 20px; margin-top:15px; }
#content .my-rank > div ul li .c_rank em { font-size: 26px; font-style: normal; }
#content .my-rank > div ul li .b_rank { color:#999999; }
#content .my-rank > div ul li .up,
#content .my-rank > div ul li .down { position: relative; float:right; font-weight: bold; text-align: right; padding-left:15px; }
#content .my-rank > div ul li .up { color:#E62E2E; }
#content .my-rank > div ul li .up::before { content: ''; position: absolute; width:10px; height: 8px; left:0px; top:5px; background: url('/static/img/cuesco/rank_bullet_red.png') no-repeat; background-size: 100%; }
#content .my-rank > div ul li .down { color:#157ACE; }
#content .my-rank > div ul li .down::before { content: ''; position: absolute; width:10px; height: 8px; left:0px; top:5px; background: url('/static/img/cuesco/rank_bullet_blue.png') no-repeat; background-size: 100%; }
#content .my-rank .btn { text-align: center; padding:40px 0; }
#content .my-rank .btn a { position: relative; display:inline-block; width:160px; font-size: 14px; text-align: center; padding:5px 0; border-radius:40px; border:solid 1px #DDDDDD; color:#222; background: #fff; }
#content .my-rank .btn a::before { content: ''; position: absolute; width:14px; height:14px; right:8px; top:8px; background: url('/static/img/cuesco/arrow_right_gray.png') no-repeat; background-size:14px; }

.lotto #header { background: #016F85; }
.lotto #content .main-nav { background: #016F85; }
.lotto #content .lotto-info::before { background: #016F85; }

#content .lotto-info { position: relative; text-align: center; padding:0 20px 30px 20px; z-index: 1; background: #222;}
#content .lotto-info::before { content: ''; position: absolute; left:-5%; top:0px; width: 110%; height: 65%; background: #222; z-index: -1; border-radius: 0 0 90% 90%; }
#content .lotto-info > p { font-size: 20px; font-weight: bold; color:#fff; }
#content .lotto-info .reward-info { margin-top:30px; background: #fff; border-radius: 5px; }
#content .lotto-info .reward-info .title { font-size: 20px; font-weight: bold; padding-top:20px; }
#content .lotto-info .reward-info .sub-txt { font-size: 15px; color:#999999; padding:10px 0 20px 0; }
#content .lotto-info .reward-info .total { font-size: 36px; font-weight: bold; }
#content .lotto-info .reward-info .total img { width:32px; vertical-align: middle; display: inline-block; margin-top:-4px; }
#content .lotto-info .reward-info .btn {border-radius: 0 0 5px 5px; overflow: hidden; margin-top:20px; display: flex; flex-direction: row; }
#content .lotto-info .reward-info .btn a { display: block; width: 50%; padding:10px 0; border-top:solid 1px #eee; font-size: 15px; font-weight: bold; color:#222;}
#content .lotto-info .reward-info .btn a img { width:14px; display: inline-block; vertical-align: middle; margin-top: -3px;}

#content .lotto-info .reward-info h3 { font-size: 16px; font-weight: bold; padding:25px 20px 0 20px; }
#content .lotto-info .reward-info .win-num { margin:25px 20px 0 20px; }
#content .lotto-info .reward-info .win-num p { font-size: 18px; margin-bottom:15px; }
#content .lotto-info .reward-info .total-reward { border:solid 1px #FFDDC6; background: #FFF8F3; padding:20px 0; text-align: center; border-radius: 5px; margin:20px 20px 0px 20px; }
#content .lotto-info .reward-info .total-reward p { font-size: 16px; }
#content .lotto-info .reward-info .total-reward p.reward { font-size: 30px; font-weight: bold; line-height: 34px; }
#content .lotto-info .reward-info .total-reward p img { width: 34px; vertical-align: text-bottom; }

#content .lotto-info .reward-info .last-lotto { margin:20px 20px 0 20px; border-top:solid 1px #eee; }
#content .lotto-info .reward-info .last-lotto select { position: relative; padding-right:20px; border:0; margin-top:15px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url('/static/img/cuesco/select_arrow_icon.png') no-repeat 100% 50%; background-size: 20px; font-size: 16px; }

#content .my-lotto { position: relative; background: #222; padding:0 20px 20px 20px; }
#content .my-lotto h2 { font-size:20px; font-weight: bold; padding:20px 0; color:#fff; }
#content .my-lotto .count { font-size: 24px; font-weight:bold; background: #333333; color:#FF7F27; padding:10px 0; text-align: center; border-radius: 5px; }
#content .my-lotto .count em { font-size: 30px; font-style: normal; }
#content .my-lotto .list { position: relative; margin-top:30px; }
#content .my-lotto .list ul li { overflow: hidden; padding:20px 0; border-bottom:solid 1px #333333; }
#content .my-lotto .list ul li:last-child { border:0; }
#content .my-lotto .list ul li > div { float: left; }
#content .my-lotto .list ul li .num { width:15%; font-size: 15px; color:#999999; line-height: 40px; }
#content .my-lotto .list ul li .num.win { color: #fff;text-align: center;}
#content .my-lotto .list ul li .num.edit a { display: block; width:40px; height: 40px; border:solid 1px #666666; border-radius:7px; text-align: center; }
#content .my-lotto .list ul li .num.edit a img { width:16px; vertical-align: middle; }
#content .my-lotto .list ul li .ball { width:85%; }
#content .my-lotto .list ul li .ball > span { margin-right:2px; }
#content .my-lotto > .btn { text-align: center; padding:40px 0; }
#content .my-lotto > .btn a { position: relative; display:inline-block; width:160px; font-size: 14px; text-align: center; padding:10px; border-radius:40px; border:solid 1px #666; color:#fff; }
#content .my-lotto > .btn a::before { content: ''; position: absolute; width:14px; height:14px; right:8px; top:13px; background: url('/static/img/cuesco/arrow_right_gray.png') no-repeat; background-size:14px; }
#content .my-lotto .no-data { position: relative; padding:0 25px; background: #333333; border-radius: 5px; }
#content .my-lotto .no-data .msg { padding:30px 0 40px 0; font-size: 15px; color:#AAAAAA; text-align: center; border-top:solid 1px #000; }
#content .my-lotto .no-data .msg .img { width:80px; height:80px; border-radius: 100%; line-height: 80px; background: #EEEEEE; text-align: center; margin: 0 auto 20px auto; }
#content .my-lotto .no-data .msg .img img { width:30px; vertical-align: middle; }
#content .my-lotto .no-data .btn { text-align: center; padding-bottom:40px; }
#content .my-lotto .no-data .btn a { position: relative; display:block; width:100%; font-size: 16px; font-weight: bold; text-align: center; padding:15px 0; border-radius:5px; border:solid 1px #FF7F27; color:#FF7F27; }
#content .my-lotto .no-data .btn a img { width:14px; }

#content .my-lotto .winner-table { background: #fff; border-radius: 5px; color:#333; }
#content .my-lotto .winner-table tr th,
#content .my-lotto .winner-table tr td { text-align: center; }
#content .my-lotto .winner-table tr th { padding:10px 0; border-bottom:solid 2px #eee; }
#content .my-lotto .winner-table tr td { padding:10px 0; }
#content .my-lotto .winner-table tr ~ tr td { border-top:solid 1px #eee; }
#content .my-lotto .winner-table tr td.text-right { text-align: right; padding-right:10px; }
#content .my-lotto .winner-table tr td em { font-style: normal; font-weight: bold; color:#222; }

#content .my-lotto .list .receipt { padding: 10px; margin: 10px 0 ; background: #fff; border:1px solid #ccc;border-radius: 5px; }
#content .my-lotto .list .receipt table td { height: 25px; }
#content .my-lotto .list .receipt table td.text-right { text-align: right; }
#content .my-lotto .list .receipt table td.etc { color: #a1a1a1;text-align: right; height: 20px; font-size: 12px; padding:5px 0 10px 0; }
#content .my-lotto .list .receipt table td em { font-weight: bold;font-size:22px; font-style: normal; }
#content .my-lotto .list .receipt table td button { display: inline-block; width: 100%; margin-top:10px; }
#content .my-lotto .list .receipt table td strike img { width: 22px;vertical-align: middle; margin-right: 5px; }

#content .lotto-plus-info { padding:0 20px; background:#222; }
#content .lotto-plus-info > div { background:#fff; border-radius: 10px; }
#content .lotto-plus-info > div > p { font-size: 17px; font-weight: bold; text-align: center; padding: 10px 0; margin: 0 20px; border-bottom:solid 1px #D5D5D5; }
#content .lotto-plus-info > div > p img { width:25px; vertical-align: middle; margin-right: 5px; }
#content .lotto-plus-info .reward-info { padding-bottom: 20px; }
#content .lotto-plus-info .reward-info > p { font-size: 18px; font-weight: bold; text-align: center; margin: 10px 0; }
#content .lotto-plus-info .reward-info > p em { font-size: 40px; font-style: normal; color:#FF7F27; }
#content .lotto-plus-info .reward-info .last-amount { display: flex; flex-direction: row; justify-content: space-between; padding:0 5px; }
#content .lotto-plus-info .reward-info .last-amount > div {}
#content .lotto-plus-info .reward-info .last-amount > div p { font-size: 14px; text-align: center; margin-top: 5px; }
#content .lotto-plus-info .reward-info .last-amount > div p.ball { width:51px; height:51px; background:url('/static/img/main/ball_bg_off.png') no-repeat; background-size: 100%; font-size: 14px; font-weight: bold; line-height: 51px; text-align: center; font-family: 'Montserrat'; }
#content .lotto-plus-info .reward-info .last-amount > div.active p.ball { background:url('/static/img/main/ball_bg_on.png') no-repeat; background-size: 100%; }
#content .lotto-plus-info .unwinnable-info { padding-top: 20px;  background:#FFBD3A; overflow: hidden; }
#content .lotto-plus-info .unwinnable-info > p { font-size: 18px; font-weight: bold; text-align: center; }
#content .lotto-plus-info .unwinnable-info .unwinnable-amount { width:104px; height:30px; font-size: 14px; color:#fff; text-align: center; background: url('/static/img/main/price_bg.png') 0 -5px no-repeat; background-size: 100%; margin:0 auto; line-height: 25px; }
#content .lotto-plus-info .unwinnable-info .winning { display: flex; flex-direction: row; justify-content: space-between; margin: 20px 10px;  padding-top: 20px; border-top:solid 1px #8D8D8D;}
#content .lotto-plus-info .unwinnable-info .winning5 { width: 50%; text-align: center; border-right: solid 1px #8D8D8D; }
#content .lotto-plus-info .unwinnable-info .winning4 { width: 50%; text-align: center; }
#content .lotto-plus-info .unwinnable-info .winning .title { font-size: 16px; }
#content .lotto-plus-info .unwinnable-info .winning .title em { font-weight: bold; font-style: normal; }
#content .lotto-plus-info .unwinnable-info .winning .amount { font-size: 14px; font-weight: bold; }
#content .lotto-plus-info .unwinnable-info .winning .amount em { font-family: 'Montserrat'; font-size: 23px; font-style: normal; }
#content .lotto-plus-info .unwinnable-info .winning .amount img { width:24px; height:24px; vertical-align: sub; }
#content .lotto-plus-info .unwinnable-info .winning .user-count { position: relative; margin: 15px 0; }
#content .lotto-plus-info .unwinnable-info .winning .user-count span { position: relative; display: block; width:85px; font-size: 16px; font-weight: bold; text-align: center; background:#fff; border-radius: 30px; padding: 7px 0; margin:0 auto; line-height: 15px; }
#content .lotto-plus-info .unwinnable-info .winning .user-count span.img { text-indent: 15px; }
#content .lotto-plus-info .unwinnable-info .winning .user-count span img { position: absolute; left:-10px; top:-4px; width: 33px; height:33px; border:solid 2px #FF7F27; border-radius: 100%; }
#content .lotto-plus-info .unwinnable-info .winning4 {}
#content .lotto-plus-info .unwinnable-info .btn { padding-bottom: 15px; }
#content .lotto-plus-info .unwinnable-info .btn a { display: block; font-size: 16px; padding:15px 0; margin: 0 20px; border-radius: 10px; color: #f2f2f2;}

.main .sub-tab-menu { position: relative; padding:0 20px; border-bottom: solid 1px #DDDDDD; }
.main .sub-tab-menu ul { overflow: hidden; }
.main .sub-tab-menu ul li { float: left; width: 33.3%; text-align: center; }
.main .sub-tab-menu ul li a { display: block; padding: 14px 0; color:#222; font-size: 14px; }
.main .sub-tab-menu ul li.active a { color:#FF7F27; border-bottom: solid 2px #FF7F27; font-weight: bold;}
.main .sub-tab-menu.fixed { position: fixed; width: calc(100% - 40px); background: #fff; z-index: 1; }

.main #tab-content .noti-txt { padding: 15px 20px; font-size: 14px; color: #777777; text-align: center; }
.main #tab-content h2 { font-size: 16px; font-weight: bold; }

.main .best-record { padding: 20px; }
.main .best-record .record { display: flex; flex-direction: row; justify-content: space-between; align-content: center; margin-top: 10px; flex-wrap: wrap; }
.main .best-record .record.left { justify-content: flex-start; }
.main .best-record .record div { width: 27vw; height: 27vw; text-align: center; background: #fff; border-radius: 10px; box-shadow: 1px 3px 8px -7px #000, 0px -1px 10px -10px #000; display: flex; flex-direction: column; justify-content: center; }
.main .best-record .record div.small { width: calc(25% - 5px); height: 8vw; margin-right: 5px;float: left; margin-bottom: 5px;}
.main .best-record .record div.small.active { background: #f26522; }
.main .best-record .record div.small.active p{ color: #fff; }
.main .best-record .record div p { font-size: 11px; color: #999999; }
.main .best-record .record div em { font-style: normal; font-size: 26px; font-weight: bold; }

.main .cuesco-handi { padding: 20px; }
.main .cuesco-handi h2 a { margin-left: 20px; }
.main .cuesco-handi h2 a img { width: 24px; vertical-align: middle; }
.main .cuesco-handi .cuesco-handi-box { margin-top: 10px; background: #fff; border-radius: 13px; box-shadow: 1px 3px 8px -7px #000, 0px -1px 10px -10px #000; overflow: hidden; }
.main .cuesco-handi .cuesco-handi-box .handi-warp { border-radius: 13px; overflow: hidden; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type00 { background: #414141; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type01 { background: #414141; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type10 { background: #ed1c24; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type11 { background: #f26522; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type12 { background: #e6a200; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type13 { background: #00a651; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type14 { background: #0072bc; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type15 { background: #8560a8; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type16 { background: #8560a8; }
.main .cuesco-handi .cuesco-handi-box .handi-warp.type17 { background: #ed1c24; }

.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box { display: flex; flex-direction: row; padding: 25px 0; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi { width: 40%; color: #fff; text-align: center; display: flex; flex-direction: column; justify-content: center; border-right: solid 1px rgba(255, 255, 255, 0.55); margin-right: 15px; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi p { font-size: 15px; font-weight: bold; opacity: 0.6; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi .level { display: flex; flex-direction: row; justify-content: center; align-items: flex-end; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi .level > em { font-size: 50px; font-weight: bold; font-style: normal; line-height: 50px; margin-right: 5px; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi .level > div {  }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi .level > div p { font-weight: normal; font-size: 14px; color: #fff; opacity: 1; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .handi .level > div img { width:28px; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .txt { width: 60%; color: #fff; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .txt p { font-size: 20px; font-weight: bold; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .handi-box .txt span { font-size: 14px; opacity: 0.6; }
.main .cuesco-handi .cuesco-handi-box .handi-warp .btn-down { background: #222; display: flex;justify-content: space-between;align-items: center;}
.main .cuesco-handi .cuesco-handi-box .handi-warp .btn-down a { display: block; color: #fff; padding: 10px 0; font-size: 15px; font-weight: bold; text-align: center; flex: 1;}
.main .cuesco-handi .cuesco-handi-box .handi-warp .btn-down a img { width: 12px; margin-left: 10px; }
.main .cuesco-handi .cuesco-handi-box .score-warp { padding-bottom: 30px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .title { text-align: center; }
.main .cuesco-handi .cuesco-handi-box .score-warp .title p { position: relative; font-size: 14px; font-weight: 300; margin: 5px 0 20px 0; }
.main .cuesco-handi .cuesco-handi-box .score-warp .title p:first-child { font-size: 16px; font-weight: bold; margin: 20px 0 0 0; }
.main .cuesco-handi .cuesco-handi-box .score-warp .title p a { position: absolute; margin-left: 20px; margin-top: -3px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .title p a img { width: 24px; vertical-align: middle; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont { display: flex; flex-direction: row; justify-content: center; padding: 0 22px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .score { width: 25%; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .score span { font-size: 18px; font-weight: bold; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .score span em { font-style: normal; font-size: 30px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .score p { font-size: 15px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap { width: 75%; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .graph { position: relative; height: 35px; background: url('/static/img/main/handi_graph.png') no-repeat; background-size: 100%; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .graph > div { position: absolute; top: 0; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .graph > div img { width: 29px; border-radius: 100%; margin-top: -20px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .graph > div span { display: block; width: 2px; height: 20px; background: #222; margin: -5px auto  0 auto; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .score-info { display: flex; flex-direction: row; justify-content: center; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .score-info div { display: flex; flex-direction: row; justify-content: center; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .score-info div p { color: #999; font-size: 14px; margin-right: 5px; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .score-info div span { color: #777777; font-size: 15px; font-weight: bold; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .score-info div span em { font-size: 20px; font-style: normal; }
.main .cuesco-handi .cuesco-handi-box .score-warp .cont .graph-wrap .score-info > span { font-size: 20px; font-weight: bold; color: #DDDDDD; margin: 0 10px; }

.main .score-transition { padding: 20px; }

.main .score-statistics { padding: 20px; }
.main .score-statistics .statistics_box { margin-top: 10px; padding: 15px; border-radius: 13px; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; overflow: hidden; }
.main .score-statistics .statistics_box .menu { display: flex; flex-direction: row; justify-content: space-between; background: #fff; }
.main .score-statistics .statistics_box .menu a { display: block; width: 24%; font-size: 14px; background: #ddd; padding: 8px 0; text-align: center; border-radius: 18px; }
.main .score-statistics .statistics_box .menu a.active { background: #FF7F27; }
.main .score-statistics .statistics_box .statistics { padding: 0 7px; }
.main .score-statistics .statistics_box .statistics .box_desc { font-size: 14px; color: #777777; margin: 30px 0 10px 0; }
.main .score-statistics .statistics_box .statistics .top { display: flex; flex-direction: row; justify-content: space-between; }
.main .score-statistics .statistics_box .statistics .top div { width: 50%; }
.main .score-statistics .statistics_box .statistics .top div .label { font-size: 15px; font-weight: bold; color: #AAAAAA; text-align: center;}
.main .score-statistics .statistics_box .statistics .top div .count { font-size: 30px; font-weight: bold; text-align: center;}
.main .score-statistics .statistics_box .statistics .bot { display: flex; flex-direction: row; justify-content: space-between; margin-top: 15px; padding-top: 10px; border-top:solid 1px rgba(34, 34, 34, 0.1); }
.main .score-statistics .statistics_box .statistics .bot div .label { font-size: 14px; color: #AAAAAA; }
.main .score-statistics .statistics_box .statistics .bot div .count { font-size: 18px; font-weight: bold; color: #777777; }

.main .my-score { position: relative; padding: 20px; }
.main .my-score .s-menu { position: absolute; right:20px; top: 20px; background: #E6E6E6; border-radius: 26px; width: 140px; }
.main .my-score .s-menu a { display: inline-block; width: 72px; text-align: center; padding: 3px 0px; font-size: 14px; color: rgba(34, 34, 34, 0.5); }
.main .my-score .s-menu a:last-child { margin-left: -10px; }
.main .my-score .s-menu a.active { color: #fff; background: #333; border-radius: 26px; }
.main .my-score .score-box { margin-top: 10px; padding: 20px; border-radius: 13px; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; }
.main .my-score .score-box .title { text-align: center; }
.main .my-score .score-box .title p { font-size: 30px; font-weight: bold; }
.main .my-score .score-box .title p:first-child { font-size: 15px; color: #777777; }
.main .my-score .score-box .chart { display: flex; flex-direction: row; justify-content: space-between; }
.main .my-score .score-box .chart > div { width: 18%; display: flex; flex-direction: column; justify-content: flex-end; }
.main .my-score .score-box .chart > div > div { width: 100%; height: 224px; background: #fff; border-radius: 30px; display: flex; flex-direction: column; justify-content: flex-end; }
.main .my-score .score-box .chart > div > div > div { background: #26548F; border-radius: 30px; font-size: 14px; font-weight: bold; color: #fff; text-align: center; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 20px; }
.main .my-score .score-box .chart > div > div > div.active { background: #FF7F27; }
.main .my-score .score-box .chart > div > p { font-size: 11px; color: #777777; text-align: center; margin-top: 10px; }

.main .skill-compare { position: relative; padding: 20px; }
.main .skill-compare .s-menu { position: absolute; right:20px; top: 15px; }
.main .skill-compare .s-menu a { display: block; }
.main .skill-compare .s-menu a img { width: 73px; }
.main .skill-compare .s-menu a.active { color: #fff; background: #333; border-radius: 26px; }
.main .skill-compare .chart-box { border-radius: 13px; box-shadow: 1px 3px 10px -7px #000, 0px -1px 10px -10px #000; padding: 15px 20px 40px; margin-top: 15px; }
.main .skill-compare .chart-box .search-box { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; }
.main .skill-compare .chart-box .search-box > div { font-size: 15px; font-weight: bold; color: #AAAAAA; }
.main .skill-compare .chart-box .search-box > div img { width: 40px; border-radius: 100%; }
.main .skill-compare .chart-box .search-box > div.thumb img { height: 40px; }
.main .skill-compare .chart-box .search-box > div:last-child { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: calc(100% - 80px); height: 40px; font-size: 14px; color: #222; font-weight: normal; border: solid 1px #DDDDDD; border-radius: 10px; padding: 0 20px; }
.main .skill-compare .chart-box .search-box > div:last-child img { width: 20px; }
.main .skill-compare .chart-box .search-box > div.vs { margin: 0 10px; }
.main .skill-compare .chart-box .chart {}
.main .skill-compare .chart-box .chart .item { display: flex; flex-direction: row; justify-content: space-between; padding: 15px 0; border-bottom: solid 1px #EEEEEE; }
.main .skill-compare .chart-box .chart .item:last-child { border: 0; }
.main .skill-compare .chart-box .chart .item .title { width: 20%; }
.main .skill-compare .chart-box .chart .item .title p { font-size: 11px; }
.main .skill-compare .chart-box .chart .item .title em { position: relative; display: block; font-size: 14px; font-weight: bold; font-style: normal; padding-left: 10px; }
.main .skill-compare .chart-box .chart .item .title em span { font-size: 11px; font-weight: normal; }
.main .skill-compare .chart-box .chart .item .title em.up { color: #FF7F27; }
.main .skill-compare .chart-box .chart .item .title em.up:before { content: ''; position: absolute; left: 0; top: 6px; width: 7px; height: 7px; background: url('/static/img/main/icon_up.png') no-repeat; background-size: 100%; }
.main .skill-compare .chart-box .chart .item .title em.down { color: #26548F; }
.main .skill-compare .chart-box .chart .item .title em.down:before { content: ''; position: absolute; left: 0; top: 6px; width: 7px; height: 7px; background: url('/static/img/main/icon_down.png') no-repeat; background-size: 100%; }
.main .skill-compare .chart-box .chart .item .graph { width: 80%; padding-top: 2px; }
.main .skill-compare .chart-box .chart .item .graph div { height: 12px; font-size: 14px; font-weight: bold; margin-bottom: 3px; color: #777777; }
.main .skill-compare .chart-box .chart .item .graph div span { display: inline-block; max-width: 80%; height: 100%; background: #ccc; border-top-right-radius: 20px; border-bottom-right-radius: 20px; }
.main .skill-compare .chart-box .chart .item .graph div.up { color: #FF7F27; }
.main .skill-compare .chart-box .chart .item .graph div.up span { background: #FF7F27; }
.main .skill-compare .chart-box .chart .item .graph div.down { color: #26548F; }
.main .skill-compare .chart-box .chart .item .graph div.down span { background: #26548F; }

.winning-pop { position: fixed; width:100%; height: 100%; top:0px; left:0px; background: rgba(0,0,0,0.7); z-index: 999; display: none; }
.winning-pop > div { position: absolute; width:335px; top:100px; left:calc(50% - 167px); background: #fff; border-radius: 5px; box-sizing: border-box; text-align: center; }
.winning-pop .close-btn { position: absolute; right:20px; top:20px; }
.winning-pop .close-btn img { width:24px; }
.winning-pop h3 { font-size: 16px; font-weight: bold; margin:25px 20px 0 20px; }
.winning-pop .win-num { margin:25px 20px 0 20px; }
.winning-pop .win-num p { font-size: 18px; margin-bottom:15px; }
.winning-pop .total-reward { border:solid 1px #FFDDC6; background: #FFF8F3; padding:20px 0; text-align: center; border-radius: 5px; margin:20px 20px 0px 20px; }
.winning-pop .total-reward p { font-size: 16px; }
.winning-pop .total-reward p.reward { font-size: 30px; font-weight: bold; line-height: 34px; }
.winning-pop .total-reward p img { width: 34px; vertical-align: text-bottom; }
.winning-pop .rank-reward { padding:20px; }
.winning-pop .rank-reward table { font-size: 15px; }
.winning-pop .rank-reward table tr td { padding:10px 0; text-align: center; }
.winning-pop .rank-reward table tr td:first-child { text-align: left; }
.winning-pop .rank-reward table tr td:last-child { text-align: right; }
.winning-pop .rank-reward table tr:first-child td { border-bottom:solid 1px #EEEEEE; }
.winning-pop .rank-reward table tr td em { font-size: 17px; font-weight: bold; font-style: normal; }
.winning-pop .btn { position: relative; }
.winning-pop .btn a { display: block; background:#FF7F27; color:#222; font-size: 15px; font-weight: bold; padding:15px 0; border-radius: 0 0 5px 5px; }
.winning-pop .btn a img { width:14px; }
.winning-pop .btn.ea2 a { display: inline-block; float: left; width:50%; }
.winning-pop .btn.ea2 a:first-child { background: #26548F; border-radius: 0 0 0 5px; color:#fff; }
.winning-pop .btn.ea2 a:last-child { background: #FF7F27; border-radius: 0 0 5px 0; }

.editing-pop { position: fixed; width:100%; height: 100%; top:0px; left:0px; background: rgba(0,0,0,0.7); z-index: 999; display: none; }
.editing-pop > div { position: absolute; width:335px; top: 50px; left:calc(50% - 167px); background: #fff; border-radius: 5px; box-sizing: border-box; text-align: center; }
.editing-pop .close-btn { position: absolute; right:20px; top:20px; }
.editing-pop .close-btn img { width:24px; }
.editing-pop h3 { font-size: 16px; font-weight: bold; margin:25px 20px 0 20px; }
.editing-pop .win-num { margin:25px 20px 0 20px; }
.editing-pop .win-num p { font-size: 18px; margin-bottom:15px; }
.editing-pop .total-reward { border:solid 1px #FFDDC6; background: #FFF8F3; padding:20px 0; text-align: center; border-radius: 5px; margin:20px 20px 0px 20px; }
.editing-pop .total-reward p { font-size: 16px; }
.editing-pop .total-reward p.reward { font-size: 30px; font-weight: bold; line-height: 34px; }
.editing-pop .total-reward p img { width: 34px; vertical-align: text-bottom; }
.editing-pop .rank-reward { padding:20px; }
.editing-pop .rank-reward table { font-size: 15px; }
.editing-pop .rank-reward table tr td { padding:10px 0; text-align: center; }
.editing-pop .rank-reward table tr td:first-child { text-align: left; }
.editing-pop .rank-reward table tr td:last-child { text-align: right; }
.editing-pop .rank-reward table tr:first-child td { border-bottom:solid 1px #EEEEEE; }
.editing-pop .rank-reward table tr td em { font-size: 17px; font-weight: bold; font-style: normal; }
.editing-pop .btn { position: relative; }
.editing-pop .btn a { display: block; background:#FF7F27; color:#222; font-size: 15px; font-weight: bold; padding:15px 0; border-radius: 0 0 5px 5px; }
.editing-pop .btn a img { width:14px; }
.editing-pop .btn.ea2 a { display: inline-block; float: left; width:50%; }
.editing-pop .btn.ea2 a:first-child { background: #26548F; border-radius: 0 0 0 5px; color:#fff; }
.editing-pop .btn.ea2 a:last-child { background: #FF7F27; border-radius: 0 0 5px 0; }

.lotto-ball { position: relative; display: inline-block; width:40px; height: 40px; border-radius: 100%; line-height: 40px; text-align: center; overflow: hidden; font-size: 17px; font-weight: bold; z-index: 1; background: #969696; color: #676767;}
.lotto-ball.none { background: #fff;}
.lotto-ball span { position: absolute; display: block; width:40px; height: 40px; border-radius: 100%; left:-5px; top:-5px; z-index: -1; }
.lotto-ball.ball-01 { background: #FFBE93;  color: #000;}
.lotto-ball.ball-01 span { background: #FFCEAA;}
.lotto-ball.ball-02 { background: #C8E491; color: #000;}
.lotto-ball.ball-02 span { background: #D6ECA8; }
.lotto-ball.ball-03 { background: #F2AEAD; color: #000;}
.lotto-ball.ball-03 span { background: #F6C1C0; }
.lotto-ball.ball-04 { background: #8EBDFF; color: #000;}
.lotto-ball.ball-04 span { background: #A5CDFF; }
.lotto-ball.ball-05 { background: #E09CFF; color: #000;}
.lotto-ball.ball-05 span { background: #E9B2FF; }


#goldbar { padding: 10px 20px; }
#goldbar .result-info { width: 100%; height:72vw; background: url('/static/img/goldbar_bg.png') no-repeat; background-size: cover; border-radius: 10px; }
#goldbar .result-info .title { color:#fff; font-size: 6vw; font-weight: bold; text-align: center; padding-top: 4vw; }
#goldbar .result-info .goldbar-noti { color:#fff; font-size: 3.8vw; text-align: center; padding-top: 3vw; }
#goldbar .result-info .goldbar-noti span { color: #ffff00; font-size: 5vw; font-weight: bold; }
#goldbar .result-info .result-user-list { display: flex; justify-content: space-evenly; align-items: center; padding-top: 3vw; }
#goldbar .result-info .result-user-list img { width: 16vw; border-radius: 5px; }
#goldbar .result-info .result-user-list .result-user-info { text-align: center; }
#goldbar .result-info .result-user-list .result-user-info .name { color: #ffff00; font-size: 7vw; font-weight: bold; }
#goldbar .result-info .result-user-list .result-user-info .tel { color: #ffff00; font-size: 4.5vw; }
#goldbar .result-info .result-user-list .result-user-info .date { color: #fff; font-size: 4.5vw; padding-top: 2vw; }




/* ============= */