﻿/**종목정보 (탭버튼 위)**/
.stock_info {padding: 6.7% 8%;background: url('../images/bg_area.png') no-repeat bottom center;background-size:contain; position:relative;}
.stock_info em {display:block;color:#999;text-align:center;font-size:1.6rem;}
.stock_info strong {display:block;text-align:center;font-size:4.1rem;color:#5177bc ;line-height:1.2;}
.stock_info .tbl {position:relative;margin:4.8% 0;text-align:center;border-top:1px solid #e5e5e5}
.stock_info .tbl tbody tr td {padding:3.8% 0;font-size:1.6rem;line-height:1;border-top:1px solid #ddd;border-bottom:1px solid #ddd;color:#999;border-right:0 none;border-left:0 none;}
.stock_info .tbl:after {
    position: absolute;
    top: 36%;
    left: 50%;
    display: block;
    width: 1px;
    height: 1rem;
    border-right: 1px solid #ddd;
    content: "";
}
.stock_info > p {color:#666;font-size:1.3rem;}
.stock_info > span {
    display: block;
    width: 2rem;
    height: 2rem;
    margin: 2.2% auto 0;
    background: url('../images/ic_open.svg') no-repeat center center;
    background-size:contain;
}
.stock_info > span.on {background-image: url('../images/ic_close.svg');}

#btnTrad {
    top: 0;
    right: 5%;
    font-size: 1rem;
    border: 1px solid #ffdc00;
    color: #333;
    background-color: #ffdc00;
    display:none;
}

#btnTrad:active, #btnTrad.active{background-color:#ffcc00;box-shadow:none;}

/**탭버튼**/
.item_info {position:relative;background:#ececec;padding-bottom:1rem;}
.cont_title{text-align:center;}
.tap_bar {background:#fff;box-shadow:0.2rem -0.2rem 0.8rem 0.2rem rgba(0,0,0,0.1);border-bottom:1px solid #ccc;}
.tap_bar > dd {width:25%;padding:4.4% 0; text-align:center;font-size:1.5rem; color:#777;}
.tap_bar > dd.on {color:#222;border-bottom:0.4rem solid #222;padding:4.1% 0 3.6% 0;}


/**탭버튼 컨텐츠**/
.tap_cont {
    position: relative;
    background: #fff;
    margin-top: 6.8%;
    padding: 17% 5% 4%;
    border-radius: 0.4rem;
    background: #fff;
}


/**탭버튼 컨텐츠 - 상품개요**/
/*.item_01 .cont_title:before {
    background: url('../images/ic_ETPinfo_01.svg') no-repeat center center;
    background-size: contain;
}*/
.item_01 .tbl .col1 {width:45%}
.item_01 .tbl .col2 {width:55%}
.item_01 .tbl thead tr th{color:#222}
.item_01 .tbl tr th{text-align:center;}
.item_01 .tbl tr td{color:#555;text-align:center;}
.item_01 .tbl tr td a {color: #5177bc}


/**탭버튼 컨텐츠 - 시세정보**/
/*.item_02 div:nth-child(1) .cont_title:before {
    background: url('../images/ic_ETPinfo_02-1.svg') no-repeat center center;
    background-size: contain;
}
.item_02 div:nth-child(2) .cont_title:before {
    background: url('../images/ic_ETPinfo_01.svg') no-repeat center center;
    background-size: contain;
}
.item_02 div:nth-child(3) .cont_title:before {
    background: url('../images/ic_ETPinfo_02-2.svg') no-repeat center center;
    background-size: contain;
}*/
.item_02 .tbl tr td {text-align:center;}
.item_02 .tbl tr td.up:before {content:"▲";margin-right:2%;}
.item_02 .tbl tr td.down:before {content:"▼";margin-right:2%;}


/**탭버튼 컨텐츠 - 구성종목**/
/*.item_03 .cont_title:before {
    background: url('../images/ic_ETPinfo_03.svg') no-repeat center center;
    background-size: contain;
}*/
.item_03 .tbl .col1 {width:25%}
.item_03 .tbl .col2 {width:25%}
.item_03 .tbl .col3 {width:25%}
.item_03 .tbl .col4 {width:25%}
.item_03 .tbl tr td {text-align:center;}
.item_03 .tbl tr td:nth-child(2),
.item_03 .tbl tr td:nth-child(3) {color:#5177bc;font-weight:bold;}

/**탭버튼 컨텐츠 - 투자지표**/
/*.item_04 div:nth-child(1) .cont_title:before {
    background: url('../images/ic_ETPinfo_04.svg') no-repeat center center;
    background-size: contain;
}
.item_04 div:nth-child(2) .cont_title:before {
    background: url('../images/ic_ETPinfo_04.svg') no-repeat center center;
    background-size: contain;
}
.item_04 div:nth-child(3) .cont_title:before {
    background: url('../images/ic_ETPinfo_02-2.svg') no-repeat center center;
    background-size: contain;
}*/

.tab_item.on{ display:block; }
.tab_item{display:none;}

#startDT, #endDT{width:35%; padding:0; text-align:center; font-size:1.1rem; padding:0;}
dl#InvIndTyp2Opt { width:100%; line-height:2rem;}
dl#InvIndTyp2Opt > dd { line-height: 2rem; }
dl#InvIndTyp2Opt > dd:first-child{width:35%;}
dl#InvIndTyp2Opt > dd:last-child{width:65%;}
.ui-datepicker-trigger{ margin-left:.3rem;}

#InvIndTyp2Flag {
    float: right;
    width: 80%;
}
#InvIndTyp2Flag > li.on {
    background: #003498;
    color: #fff;
}
#InvIndTyp2Flag > li {
    font-size:1.2rem;
    padding:1% 3%;
    box-sizing:border-box;
    border-radius:.3rem;
	color:#003498;
}
#tbl-EtpGetInvIndTyp6,
#tbl-EtpGetInvIndTyp4 {
    margin-top: 1.5rem;
}
.ui-datepicker{z-index:10;}

.tbl .up > span:after { content: "▲"; display: inline-block; color: #f20a0a; }
.tbl .down > span:after { content: "▼"; display: inline-block; color: #0977c9; }
/*#tbl-EtpGetCompWgtTyp1 colgroup .col1 { width:auto;}
#tbl-EtpGetCompWgtTyp1 colgroup .col2 { width:22%;}
#tbl-EtpGetCompWgtTyp1 colgroup .col3 { width:22%;}
#tbl-EtpGetCompWgtTyp1 colgroup .col4 { width:22%;}*/

.chart.empty {
    text-align:center;
    vertical-align:middle;
    padding-top:13rem;
}

#EtpGetInvIndTyp2Chart{ margin-bottom:3rem;}
.wrapperLnkList {
    text-align: center;
    background-color: #fff;
    margin: 0 3%;
    padding: 3%;
    border-bottom-left-radius: .4rem;
    border-bottom-right-radius: .4rem;
}
#lnkList {
    font-size:1rem;
    border: 1px solid #ffdc00;
    color: #333;
    background-color: #ffdc00;
}
#lnkList:active, #lnkList.active{background-color:#ffcc00;box-shadow:none;}

.emptyspace{width:20%; display:inline-block;}