@charset "UTF-8";
body {
    font-size:16px;
    font-family:"Noto Sans KR", "NanumGothic", "Malgun Gothic", "Open Sans", "Gothic", "Arial", sans-serif;
    color:#333;
}
body:after { content:none; }

.up { color:#FF0303; }
.down { color:#2A59C0; }
.same { color:#008AB7; }
.date { color:#8d8d8d; }
dt, th { font-weight:normal; }
th, td, dt, dd { padding:10px 0; }
th, td { border-right:none; }

.left_box{
    width:48%;
    float:left;
    margin-right:2%;
    box-sizing:border-box;
}
.right_box{
    width:48%;
    float:right;
    margin-left:2%;
    box-sizing:border-box;
}


/* up,down,same images */
td>span,
dd>span { position:relative; }
td>span:before,
dd>span:before {
    content:'';
    display:block;
    position:absolute;
    left:-17px;
    top:8px;
    width:15px;
    height:10px;
    background-size:contain;
}
td.up>span:before,
dd.up>span:before { background:url(../images/mark_up.png) no-repeat center; background-size:contain;}
td.down>span:before,
dd.down>span:before { background:url(../images/mark_down.png) no-repeat center; background-size:contain;}
td.same>span:before,
dd.same>span:before { display:none; }

#cur_close>span { margin-left:20px }
#cur_close>span:before {
    left:-50px;
    top:45px;
    width:40px;
    height:30px;
}
#cur_close.up>span:before { background:url(../images/mark_up.png) no-repeat center; background-size:contain; }
#cur_close.down>span:before { background:url(../images/mark_down.png) no-repeat center; background-size:contain; }
#cur_close.same>span:before { display:none; }

#index_tb>dl>dd:nth-child(2).up {
    background:url(../images/index_up.png) no-repeat center;
    background-size:auto 80px;
}
#index_tb>dl>dd:nth-child(2).down {
    background:url(../images/index_down.png) no-repeat center;
    background-size:auto 80px;
}
#index_tb>dl>dd:nth-child(2).same {
    background:none;
    color:#008AB7;
}

/* common background */
#ohlv dt,
#hoga_tb thead,
#cap_ind th,
#index_tb dt,
.minute thead,
#daliy_list thead,
#chart_set div>dt {
    background:#0e3d8a;
    color:#fff;
}

/* main current stock table */
#quote_chart {
    border:none;
    padding:0;
}
#cup {
    border-top:2px solid #333;
    padding:20px 0;
}
.current {
    width:65%;
    padding-left:0;
}
.current>dd {
    margin:0;
    font-size:72px;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight:normal;
}
.per_updown {
    width:35%;
    margin-top:30px;
    margin-left:0;
}
.per_updown dl {
    float:left;
    width:50%;
}
.per_updown dt,
.per_updown dd{
    width:100%;
    padding:0;
    font-size:17px;
    float:none;
    background:transparent;
}
.per_updown dt {
    margin-bottom:5px;
    font-weight:normal;
}
.per_updown>dt:first-child,
.per_updown>dd:nth-child(2) { margin-bottom:0; }

#ohlv {
    border-top:0;
    border-bottom:2px solid #333;
}
#ohlv>dl { border-right:0; }
#ohlv dt,
#ohlv dd { padding:20px 0; }

#hoga_tb {
    border-top:2px solid #333;
    border-bottom:2px solid #333;
}
#hoga_tb tfoot { font-size:18px; }
#hoga_tb tfoot th { font-weight:bold; }

#cap_ind table {
    border-top-color:#333;
    border-bottom:2px solid #333;
}
#cap_ind tr{ border-bottom:none; }
#cap_ind th,
#cap_ind td { text-align:center; }
#cap_ind th { padding-left:0; }
#cap_ind td { border-bottom:1px solid #ccc; }
#cap_ind tr:last-child>td { border-bottom:none; }
#cap_ind td:nth-child(2n) { width:19%; }

#index_tb {
    margin-top:59px;
    border-top-color:#333;
    border-bottom:2px solid #333;
}
#index_tb>dl>dd:nth-child(2),
#index_tb>dl>dd:nth-child(3) { font-weight:normal; }

/* intraday */
#cur_top_box{
    border-top:none;
    border-bottom:none;
    padding:0;
}
#cur_top_box>#cup {
    border-bottom:2px solid #333;
    padding:10px 0;
}
.intraday_chart h4 {
    margin-bottom:15px;
    text-align:center;
    font-weight:bold;
    font-size:25px;
}
.minute {
    border-top:2px solid #333;
    border-bottom:2px solid #333;
}
.minute th,
.minute td { text-align:center; }

.minute.mb_view { display:none; }
.minute.pc_view { display:table; }

.form_select label {
    display:inline-block;
    width:120px;
    border-radius:20px;
    padding:6px 0;
    background:#888888;
    color:#fff;
    text-align:center;
    transition:0.5s;
    cursor:pointer;
}
.form_select label:hover { background:#0e3d8a; }

/* daily */
#chart_coc.daily_chart { margin-bottom:15px; }
#chart_coc.daily_chart + #btn_check { margin-bottom:40px; }
#daliy_list th,
#daliy_list td { text-align:center; }
.daily_chart h4 {
    margin-bottom:15px;
    text-align:center;
    font-weight:bold;
    font-size:25px;
}
.daily {
    border-top:2px solid #333;
    border-bottom:2px solid #333;
}

.daily.mb_view { display:none; }
.daily.pc_view { display:table; }

/* chart analysis */
#chart_set {
    border-top:2px solid #333;
    border-bottom:2px solid #333;
}
#chart_set dt { padding:20px 0; }
#chart_set div>dt {
    border-right-color:#0e3d8a;
    border-bottom-color:#0e3d8a;
}
#chart_set div:last-child>dt { border-bottom:1px solid #0e3d8a; }
#chart_set div>dd {
    height:65px;
    padding-top:20px;
}
#chart_set div>dd>label { margin-right:20px; }
.select_setting dd { position:relative; }
a.chart_btn {
    position:absolute;
    right:10px;
    top:50%;
    width:80px;
    margin-left:0;
    margin-top:-18px;
    border-radius:20px;
    padding:6px 10px;
    text-align:center;
    font-weight:normal;
    background:#888888;
    transition:0.5s;
}
a.chart_btn:hover,
a.chart_btn:focus { background:#0e3d8a; }

/* foreign */
.foregin.mb_view { display:none; }
.foregin.pc_view { display:table; }
.foreign_list {
    border-top-color:#333;
    border-bottom:2px solid #333;
}
.foreign_list thead {
    background:#0e3d8a;
    color:#fff;
}
.foreign_list td,
.foreign_list th { text-align:center; }

/* main  stock */
#mainStock_wrap {
    padding:10px 0;
    background:#e9e9e9;
}
#mainStock_wrap dl {
    width:50%;
    float:left;
}
#mainStock_wrap dt,
#mainStock_wrap dd {
    display:inline-block;
    margin-right:10px;
    padding:0;
    background:transparent;
}
#mainStock_wrap dt { margin-right:20px; }
#mainStock_wrap .main_updown {
    border-radius:15px;
    min-width:100px;
    padding:0 20px;
    background:#fff;
    box-sizing:border-box;
}
.main_name { font-size:17px; }
.main_updown { font-size:18px; }
.main_stock {
    font-size:24px;
    font-weight:bold;
}
.main_updown>img {
    width:10px;
    height:auto;
    margin-top:10px;
}


@media all and (min-width:768px) and (max-width:1024px) {
    body { font-size:14px; }
    .current { width:60%; }
    .current>dd { font-size:46px; }
    .per_updown {
        width:40%;
        margin-top:10px;
    }
    .per_updown dt, .per_updown dd { font-size:15px; }
    #cur_close>span:before {
        width:30px;
        height:20px;
        left: -40px;
        top: 30px;
    }
    #index_tb { margin-top:48px; }

    /* intraday */
    #ohlv dt,
    #ohlv dd { padding:12px 0; }

    /* chart */
    #chart_set div>dd { height:61px; }
}

@media all and (max-width:767px){
    body { font-size:14px; }
    /* common arrow images */
    td>span:before,
    dd>span:before {
        width:10px;
        height:8px;
        left:-13px;
    }
    #cur_close.up>span,
    #cur_close.down>span,
    #cur_close.same>span {
        padding-left:10px;
        box-sizing:border-box;
    }
    #cur_close>span:before {
        width:15px;
        height:10px;
        top:20px;
        left:-10px;
        background-size:auto 10px !important;
    }

    /* current */
    .current,
    .per_updown { width:50%; }
    .per_updown { margin-top:0; }
    .current>dd {
        text-align:left;
        font-size:30px;
    }
    .per_updown dt,
    .per_updown dd { font-size:14px; }
    #ohlv dt,
    #ohlv dd {
        padding:10px 0;
    }

    #hoga_tb tfoot { font-size:16px; }

    #cap_ind th {
        padding-left:7px;
        text-align:left;
    }
    #cap_ind td {
        padding-right:7px;
        text-align:right;
    }
    #cap_ind td:nth-child(2n) { width:50%; }

    #index_tb>dl>dd:nth-child(2){ font-size:13px; }
    #index_tb>dl>dd:nth-child(2).up,
    #index_tb>dl>dd:nth-child(2).down,
    #index_tb>dl>dd:nth-child(2).same { background-size:auto 60px; }
    #index_tb>dl>dd:nth-child(3){
        letter-spacing:-0.05em;
        font-size:13px;
    }
    .index_updown>span:before{
        left:-13px;
        top:6px;
    }

    /* intraday */
    .intraday_chart h4 { font-size:20px; }
    .intraday_chart>div {
        width:100%;
        margin:0;
        float:none;
    }
    a.btn { margin-left:10px; }

    .minute.mb_view { display:table; }
    .minute.pc_view { display:none; }
    .minute tr:nth-child(2n) { border-bottom-color:#333; }

    #btn_check { text-align:center;}
    .form_select label {
        width:70px;
        border-radius:15px;
        padding:4px 0;
    }

    /* daily */
    .daily.mb_view { display:table; }
    .daily.pc_view { display:none; }
    .daily tr:nth-child(2n) { border-bottom-color:#333; }
    .daily thead th:nth-child(4), .daily tbody td:nth-child(4) { display:table-cell; }

    /* chart analysis */
    #chart_set { margin-bottom:70px; }
    #chart_set dt { padding:10px 0; }
    #chart_set div>dt {
        padding-left:0;
        text-align:center;
    }
    #chart_set div>dd {
        padding-left:0;
        text-align:center;
    }
    #chart_set div>dd>label { margin-right:10px; }
    #chart_set div>dd>select {
        width:200px;
        padding-left:10px;
        text-align:center;
        box-sizing:border-box;
    }
    .select_setting { position:relative; }

    #chart_set .select_setting dd>a.btn { margin-left:-50px; }
    a.chart_btn {
        position:absolute;
        top:inherit;
        left:50%;
        bottom:-55px;
    }

    /* foreign */
    .foregin.mb_view { display:table; }
    .foregin.pc_view { display:none; }
    .foregin th,
    .foregin td {
        text-align:center;
    }

    .foregin .frg_date {
        width:17%;
        padding-right:5px;
        box-sizing:border-box;
        border-bottom:1px solid #333;
    }
    .foregin tr:nth-child(2n) { border-bottom:1px solid #333 !important; }

    .foregin tr>th:nth-child(2),
    .foregin tr>th:nth-child(3),
    .foregin tr>td:nth-child(2),
    .foregin tr>td:nth-child(3) { width:auto; }
    .foregin thead th:nth-child(4),
    .foregin thead th:nth-child(6),
    .foregin thead th:nth-child(7) { display:table-cell; }
    .foregin tbody td:nth-child(4),
    .foregin tbody td:nth-child(6),
    .foregin tbody td:nth-child(7) { display:table-cell; }

    /* main stock */
    #mainStock_wrap dl {
        width:100%;
        float:none;
    }
    #mainStock_wrap dl:first-child { margin-bottom:10px; }
    #mainStock_wrap dt,
    #mainStock_wrap dd {
        display:block;
        width:29%;
        float:left;
        text-align:right;
    }
    #mainStock_wrap dt {
        width:calc(46% - 20px);
        margin-right:10px;
    }
    #mainStock_wrap .main_stock { width:25%; }
    #mainStock_wrap .main_updown {
        min-width:60px;
        margin-right:0;
        text-align:left;
    }
    .main_name,.main_updown { font-size:13px; }
    .main_stock { font-size:15px; }
    .main_updown>img {
        width:8px;
        margin-top:8px;
    }
}






































/*  */
