/* ------------------ 공통 ------------------- */
/* 페이지네이션 */
.pagination {
    width:100%;
    margin:0 auto;
    text-align: center;
    font-family: 'Roboto', sans-serif;
    margin-top:30px;
    overflow: hidden;
    cursor: pointer;
}
.pagination ul {
    display: inline-block;
}
.pagination li {
    float:left;
    margin-left:-1px;
}
.pagination li:first-child {
    margin-left:0;
}
.pagination li a {
    font-size:13px;
    background:#fff;
    color:#333;
    float:left;
    width:36px;
    height:33px;
    line-height: 33px;
    text-decoration:none;
    transition:background-color .3s;
    border:1px solid #ccc;
    box-sizing: border-box;
}
.pagination li:first-child a {
    border-radius:5px 0 0 5px;
}
.pagination li:last-child a {
    border-radius:0 5px 5px 0;
}
.pagination li a.on {
    background:#177cd2;
    color:#fff;
    border:1px solid #177cd2;
}
.pagination li a:hover:not(.on) {
    background:#e5e7e9;
}
.pagination li a.on_cstm {
    background:#777;
    color:#fff;
    border:1px solid #777;
}
.pagination li a.on_cstm:hover {
    background:#888;
    color:#fff;
    border:1px solid #888;
}
/* 버튼 --------------------------- */
.box_btnsFull {
    width:100%;
    text-align: center;
    overflow: hidden;
}
.btn_extrasmall {
    font-size: 12px;
    transition: 0.1s;
    text-align: center;
    padding: 2px 8px;
    vertical-align: middle;
    border-radius: 3px;
}
.btn_extrasmall:hover {
    cursor: pointer;
}
.btn_small {
    font-size: 12px;
    transition: 0.1s;
    text-align: center;
    padding: 5px 12px;
    vertical-align: middle;
    border-radius: 3px;
}
.btn_small img {
    vertical-align: middle;
    padding-right:3px;
    margin-top:-2px;
}
.btn_small:hover {
    cursor: pointer;
}
.btn_medium {
    font-size:13px;
    transition:0.1s;
    text-align: center;
    padding:8px 12px;
    vertical-align:middle;
    border-radius:3px;
}
.btn_medium:hover {
    cursor: pointer;
}
.btn_large {
    font-size: 15px;
    width: 120px;
    transition: 0.1s;
    padding: 10px 0;
    vertical-align: middle;
    border-radius: 3px;
}
.btn_large:hover {
    cursor: pointer;
}
.btn_extralarge {
    font-size: 15px;
    width: 140px;
    transition: 0.1s;
    padding: 15px 0;
    vertical-align: middle;
    border-radius: 4px;
}
.btn_extralarge:hover {
    cursor: pointer;
}
.btn_cstmSrch {
    font-size: 15px;
    width: 120px;
    transition: 0.1s;
    padding: 17px 0;
    vertical-align: middle;
    border-radius: 3px;
}
.btn_cstmSrch:hover {
    cursor: pointer;
}
.btn_white {
    background:#fff;
    border:1px solid #aaa;
    font-weight:600;
    color:#888;
    box-shadow: inset 0px -1.5px 1px #e0e0e0;
}
.btn_white:hover {
    border:1px solid #888;
    font-weight:600;
    color:#555;
    box-shadow: inset 0px 0px 0px #e0e0e0;
}
.btn_white_on {
    background:#fff;
    border:1px solid #ff6f6f;
    color:#ff6f6f;
    font-weight:600;
}
.btn_white_on2 {
    background:#ff6600;
    border:1px solid #ef6500;
    color:#fff;
    font-weight:600;
}
.btn_red {
    background:#f83838;
    border:1px solid #e63535;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px -2px 1px #c62828;
}
.btn_red:hover {
    background:#e63535;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px 0px 0px #e63535;
}
.btn_red_out {
    background:#fff;
    border:1px solid #f83838;
    font-weight:600;
    color:#f83838;
    box-shadow: inset 0px -2px 1px #ffdbdb;
    margin-left:5px;
}
.btn_red_out:hover {
    background:#fff;
    font-weight:600;
    color:#f83838;
    box-shadow: inset 0px 0px 0px #ffdbdb;
}
.btn_blue {
    background:#177cd2;
    border:1px solid #0776c4;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px -2px 1px #19649a;
}
.btn_blue:hover {
    background:#0776c4;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px 0px 0px #c96909;
}
.btn_deepblue {
    background:#2c5879;
    border:1px solid #26506f;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px -2px 1px #1c3c55;
}
.btn_deepblue:hover {
    background:#26506f;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px 0px 0px #c96909;
}
.btn_gray {
    background:#888;
    border:1px solid #7c7c7c;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px -2px 1px #6d6d6d;
}
.btn_gray:hover {
    background:#7c7c7c;
    font-weight:600;
    color:#fff;
    box-shadow: inset 0px 0px 0px #6d6d6d;
}
.btn-position-1{
    position:absolute;
    right:32px;
    top:30px;
}
.btn-1 {
    display: inline-block;
    min-width: 104px;
    padding: 0 10px;
    line-height: 58px;
    background: #f83838;
    color: #fff;
    font-size: 16px;
    letter-spacing: -0.01em;
    font-weight: bold;
    text-align: center;
    overflow: hidden;
    border-radius: 4px;
    -webkit-box-shadow: inset -2px -3px 3px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: inset -2px -3px 3px 0px rgba(0,0,0,0.3);
    box-shadow: inset -2px -3px 3px 0px rgba(0,0,0,0.3);
}
/* 텍스트 -------------------------- */
.infotxt_date11px {
    font-family: 'Roboto', sans-serif;
    font-size:11px;
    color:#888;
    font-weight:normal;
    letter-spacing: 0;
}
.infotxt_15px {
    font-size:15px;
}
.infotxt_15px66 {
    font-size:15px;
    color:#666;
}
.infotxt_15px33 {
    font-size:15px;
    color:#333;
}
.infotxt_16px66 {
    font-size:15px;
    color:#666;
}
.infotxt_14px33 {
    font-size:14px;
    color:#333;
}
.infotxt_13px88 {
    font-size:13px;
    color:#888;
}
.infotxt_13px66 {
    font-size:13px;
    color:#666;
}
.infotxt_13px33 {
    font-size:13px;
    color:#333;
}
.infotxt_12px33 {
    font-size:12px;
    letter-spacing: 0;
    color:#333;
}
.infotxt_12px66 {
    font-size:12px;
    font-weight:normal;
    letter-spacing: 0;
    color:#666;
}
.infotxt_12px88 {
    font-size:12px;
    font-weight:normal;
    letter-spacing: 0;
    color:#888;
}
.infotxt_12pxred {
    font-size:12px;
    color:#f83838;
}
.infotxt_13pxred {
    font-size:13px;
    color:#f83838;
}
.infotxt_16pxred {
    font-size:16px;
    color:#f83838;
}
.ratetxt_20px {
    font-family: 'Roboto', sans-serif;
    font-size:20px;
    font-weight:500;
}
.ratetxt_16px {
    font-family: 'Roboto', sans-serif;
    font-size:16px;
    font-weight:500;
}
.ratetxt_14px {
    font-family: 'Roboto', sans-serif;
    font-size:14px;
    font-weight:500;
}
.ratetxt_15px {
    font-family: 'Roboto', sans-serif;
    font-size:15px;
    font-weight:500;
    letter-spacing: 0;
}
.subtitle_16px {
    font-size:16px;
    font-weight:600;
    line-height:30px;
    color:#333;
}
.subtitle_15px {
    font-size:15px;
    font-weight:600;
    line-height:30px;
    color:#333;
}
.subtitle_14px {
    font-size:14px;
    font-weight:600;
    line-height:30px;
    color:#555;
    letter-spacing: 0;
}
.subtitle_13px {
    font-size:13px;
    font-weight:600;
    line-height:30px;
    color:#333;
}
.ml4px {margin-left: 4px;}
.mr4px {margin-right:4px;}
.ml8px {margin-left: 8px;}
.mr8px {margin-right:8px;}
.ml15px {margin-left: 15px;}
.mr15px {margin-right:15px;}
.ml20px {margin-left: 20px;}
.mr20px {margin-right:20px;}

.mt6px {margin-top:6px;}
.mb6px {margin-bottom:6px;}

.mt8px {margin-top:8px;}
.mb8px {margin-bottom:8px;}

.mt10px {margin-top:10px;}
.mt20px {margin-top:20px;}
.mt30px {margin-top:30px;}
.mt40px {margin-top:40px;}

.mb10px {margin-bottom:10px;}
.mb15px {margin-bottom:15px;}
.mb20px {margin-bottom:20px;}
.mb30px {margin-bottom:30px;}
.mb40px {margin-bottom:40px;}
.mb50px {margin-bottom:50px;}

.lh18px {line-height:18px;}
.lh20px {line-height:20px;}
.lh33px {line-height: 33px;}
.txtcolorblack {color:#000;}

/* 체크박스 : 흰배경 ------------------------- */
input[type=checkbox].checkbox {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}
input[type=checkbox].checkbox + label.chkbx-label {
    padding-left:20px;
    height:15px;
    display:inline-block;
    line-height:15px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:13px;
    vertical-align:middle;
    cursor:pointer;
    margin-bottom:-13px;
}
input[type=checkbox].checkbox:checked + label.chkbx-label {
    background-position: 0 -15px;
}
label.chkbx-label {
    background-image:url(../img/img_checkbg.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* 체크박스 : 어두운배경 ------------------------- */
input[type=checkbox].checkbox {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}
input[type=checkbox].checkbox + label.chkbx-label-dark {
    padding-left:20px;
    height:15px;
    display:inline-block;
    line-height:15px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:13px;
    vertical-align:middle;
    cursor:pointer;
}
input[type=checkbox].checkbox:checked + label.chkbx-label-dark {
    background-position: 0 -15px;
}
label.chkbx-label-dark {
    background-image:url(../img/img_checkbg_dark.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* 체크박스 : 포트만들기 ------------------------- */
input[type=checkbox].chk_np {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}
input[type=checkbox].chk_np + label.chkbx_labe_np {
    padding-left:20px;
    height:15px;
    display:inline-block;
    line-height:15px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:14px;
    color:#666;
    vertical-align:middle;
    cursor:pointer;
}
input[type=checkbox].chk_np:checked + label.chkbx_labe_np {
    background-position: 0 -15px;
}
label.chkbx_labe_np {
    background-image:url(../img/img_checkbg.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* 체크박스 : 찜하기 ------------------------- */
input[type=checkbox].checkbox {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}
input[type=checkbox].checkbox + label.chkbx-label-fav {
    padding-left:20px;
    height:14px;
    display:inline-block;
    line-height:14px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:13px;
    vertical-align:middle;
    cursor:pointer;
}
input[type=checkbox].checkbox:checked + label.chkbx-label-fav {
    background-position: 0 -14px;
}
label.chkbx-label-fav {
    background-image:url(../img/icn_fav.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* 라디오버튼 ------------------------ */
input[type=radio].css-radiobtn {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}
input[type=radio].css-radiobtn + label.css-label, input[type=radio].css-radiobtn + label.css-label.clr {
    padding-left:22px;
    height:17px;
    display:inline-block;
    line-height:17px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:13px;
    vertical-align:middle;
    cursor:pointer;
}
input[type=radio].css-radiobtn:checked + label.css-label {
    background-position: 0 -17px;
}
label.css-label {
    margin-right:40px;
    background-image:url(../img/btn_radio.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* 라디오 - 새포트만들기 ------------------------------- */
input[type=radio].css-radioTrade {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}
input[type=radio].css-radioTrade + label.css-labelTrade, input[type=radio].css-radioTrade + label.css-labelTrade.clr {
    padding-left:22px;
    height:17px;
    display:inline-block;
    line-height:17px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:15px;
    letter-spacing: 0;
    cursor:pointer;
}
input[type=radio].css-radioTrade:checked + label.css-labelTrade, input[type=radio].css-checkbox + label.css-labelTrade.chk {
    background-position: 0 -17px;
}
label.css-labelTrade {
    margin-right:40px;
    background-image:url(../img/btn_radio.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* 테이블 ---------------------------------------- */
.tbl_vertical {
    width:100%;
    border-collapse: collapse;
    border:1px solid #ddd;
    letter-spacing: 0;
}
.tbl_vertical th {
    text-align: center;
    background:#f1f3f5;
    border-bottom:1px solid #ddd;
    font-size:13px;
    font-weight:600;
    color:#424242;
    padding:10px;
}
.tbl_vertical th.buy {
    background:#fcecec;
}
.tbl_vertical th.sell {
    background:#e1f1f8;
}
.tbl_vertical th.tradeLst {
    background:#143b58;
    color:#fff;
    border:1px solid #143b58;
}
.tbl_vertical tr.tradeLst_02 th {
    background:#d3d9de;
    border:1px solid #cacaca;
}
.tbl_vertical th.title {
    background:#efefef;
}
.tbl_vertical th.subtitle {
    background:#fcfcfc;
}
.tbl_vertical th.blR {
    border-right:1px solid #ddd;
}
.tbl_vertical th.taL {
    text-align: left;
}
.tbl_vertical th.divide {
    border-bottom:2px solid #ccc;
}
.tbl_vertical tr.bg_chngDate {
    background:#e1f1f8;
}
.tbl_vertical td.taC {
    text-align: center;
}
.tbl_vertical td.taR {
    text-align: right;
    padding-right:14px;
}
.tbl_vertical td.taL {
    text-align: left;
    padding:10px 14px;
}
.tbl_vertical td.blR {
    border-right:1px solid #ddd;
}
.tbl_vertical td.divide {
    border-bottom:2px solid #ccc;
}
.tbl_vertical td.bg_vi {
    background:#fcd8d8;
}
.tbl_vertical td.bg_buy {
    background:#f03636;
    color:#fff;
}
.tbl_vertical td.bg_sell {
    background:#177cd2;
    color:#fff;
}
.tbl_vertical td.bg_newstep1 {
    height:70px;
}
.tbl_vertical td.emptyLst {
    padding:20px 0;
}
.tbl_vertical td {
    box-sizing:content-box;
    padding:8px 0;
    border-bottom:1px solid #ddd;
    line-height:18px;
    color:#333;
    background:#fff;
}
.tbl_vertical td.stockRank {
    padding:10px 12px;
}
.tbl_vertical td img {
    margin-bottom:-3px;
    padding-left:4px;
}
.tbl_vertical td span.tblRate {
    font-family:'Roboto', sans-serif;
    font-size:16px;
    letter-spacing: 0;
}
.tbl_vertical td span.top {
    display:block;
    color:#666;
    margin-bottom:10px;
}
.tbl_vertical td span.tdU {
    text-decoration: underline;
    cursor: pointer;
}
.tbl_vertical td em {
    font-size:14px;
    font-weight:600;
    color:#555;
}
.tbl_vertical input[type=text] {
    border:1px solid #ccc;
    padding:8px 10px;
}
.num_rank {
    display:inline-block;
    font-family: Tahoma;
    font-size:10px;
    color:#fff;
    text-align: center;
    width:9px;
    height:9px;
    line-height:9px;

    border-radius:50px;
    -webkit-border-radius:50px;
    -moz-border-radius:50px;
    -ms-border-radius:50px;
    -o-border-radius:50px;
}
.tbl_vertical td span.stockName {
    font-weight: 600;
    padding-left:2px;
}
.tbl_vertical td span.stockCode {
    color:#777;
    font-size:12px;
    letter-spacing: -1px;
}
.tbl_horizon {
    width:100%;
    border-collapse: collapse;
    border:1px solid #ddd;
}
.tbl_horizon th {
    background:#f1f3f5;
    font-size:13px;
    font-weight:600;
    color:#424242;
    padding:20px 10px;
}
.tbl_horizon th.buy {background:#ffe8e8;}
.tbl_horizon th.blg_rgt {border-right: 1px solid #bbb;}
.tbl_horizon th.trade {padding:12px;}
.tbl_horizon th.blB {border-bottom:1px solid #ddd;}
.tbl_horizon td {
    padding:14px 14px;
    color:#333;
    letter-spacing: 0;
    border:1px solid #ddd;
}
.tbl_horizon td.taC {text-align: center;}
.tbl_horizon td.taL {text-align: left;}
.tbl_horizon td.taR {text-align: right;}
.tbl_horizon td.bg_gray {background:#f5f7f9;}
.tbl_horizon td.blg_bttm {border-bottom: 1px solid #bbb;}
.tbl_horizon td.blg_rgt {border-right: 1px solid #bbb;}
.tbl_horizon td.trade {padding:12px;}
/* 인풋타입 ---------------------------------*/
input[type=text].text_extrasmall {
    width:60px;
    height:33px;
    padding:6px 10px;
    border:1px solid #bbb;
    color:#333;
    box-sizing: border-box;
    border-radius:3px;
}
input:-ms-input-placeholder {
    color:#888 !important;
}
input[type=text].text_small {
    width:70px;
    padding:8px 10px;
    border:1px solid #bbb;
    color:#333;
    box-sizing: border-box;
    border-radius:3px;
}
input[type=text].text_medium {
    width:100px;
    padding:8px 10px;
    border:1px solid #bbb;
    color:#333;
    border-radius:3px;
}
input[type=number].text_extrasmall {
    width:120px;
    padding:6px 10px;
    border:1px solid #bbb;
    color:#333;
    vertical-align:top;
    border-radius:3px;
}
input[type=number].text_extrasmall::-webkit-inner-spin-button {
    opacity:1;
}
input[type=text].text_condInput {
    width:40px;
    padding:8px 7px;
    border:1px solid #bbb;
    color:#333;
    border-radius:3px;
}
select.slct_newport {
    display: inline-block;
    border:1px solid #bbb;
    padding:7px 10px;
    color:#333;
    vertical-align:top;
    border-radius:3px;
}

/* 박스 ------------------------------ */
.box_common20 {
    width:100%;
    border:1px solid #ddd;
    padding:20px;
    box-sizing: border-box;
}

.box_common30 {
    width:100%;
    border:1px solid #ddd;
    padding:30px;
    box-sizing: border-box;
}

/* 라인 ------------------------------ */
.divideLn {
    width:100%;
    border-top:2px dashed #bbb;
    margin:40px 0;
}
/* ------------- 공통 팝업 ------------ */
#wrap_commonPop {
    border:1px solid #263e59;
    background:#fff;
    /*box-shadow: 2px 2px 2px #ccc;*/
}
/* 타이틀부분 */
.commonPop_top {
    overflow: hidden;
    line-height:45px;
    background:#263e59;
    padding:0 15px;
}
.commonPop_top p.title {
    font-size:16px;
    font-weight:600;
    color:#fff;
}
.commonPop_top p img {
    margin-bottom:-5px;
}
/* 내용부분 */
.commonPop_cont {
    padding:23px;
    padding-bottom:60px;
    overflow: hidden;
}
.commonPop_cont .section_scroll {
    height:200px;
    overflow-y: auto;
    border: 1px solid #ddd;
}
.commonPop_cont ul {
    overflow: hidden;
}
.ERLabel {
    line-height: 18px;
    color: #333;
    text-align:center;
    padding: 10px 14px;
}
.div-shareList-bodyCover3 {
    width: 100%;
    height: auto;
    max-height: 183px;
    overflow-y: scroll;
    border-bottom: 1px solid #dddee2;
}
.tbl-shareList-body {
    width: 100%;
    table-layout: fixed;
}