.container { background: #fff; }

/* Style the tab */
h1 { font-size: 20px; }
h2 { font-size: 18px; }
h3 { font-size: 15px; }
h4 { font-size: 14px; }
h5 { font-size: 13px; }
h6 { font-size: 12px; }

.rankMore {
display: none;
animation: fadeEffect 300ms; /* Fading effect takes 1 second */
}

.bold { font-weight: bold; }

.show { display: block; }
.hide { display: none; }

.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }

.loadHide{ display: none; }

.tab {
overflow: hidden;
}

.load{
cursor: pointer;
}


/* 메인 탭 */
.tab button{
background-color: inherit;
/* float: left; */
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
}

.sdContent .tab button{
padding: 16px 14px 5px;
}

.tab button:hover, .sdTab button:hover{
background-color: #f2f2f2;
}

.tabcontent, .sdTabcontent { display: none; animation: fadeEffect 0.5s; }
.tabcontent.active, .sdTabcontent.active { display: block; }

/* 서브 탭 */
.stockTab button, .rankTab button{
background-color: none;
float: left;
border: none;
outline: none;
cursor: pointer;
transition: 0.3s;
}

.stockTab button h5, .rankTab button h5{
color: #4b4b4b;
border-left: 1px solid  rgba(60, 60, 67, 0.36);
}

.stockTab button:first-child h5, .rankTab button:first-child h5{
border: 0;
}


.stockTab button:hover, .rankTab button:hover{
background-color: #f2f2f2;
}

.stockTabcontent, .rankTabcontent { display: none; animation: fadeEffect 0.5s; }
.stockTabcontent.active, .rankTabcontent.active { display: block; }

@keyframes fadeEffect { from {opacity: 0;} to {opacity: 1;} }

/* 뉴스 보기 layer */
/* .whole_menu_box_wrapper { position:fixed; top: 0; bottom: 0; width: 100%; background-color: rgba(0,0,0,0.5); z-index:10; padding-top: 50px; display: none; animation: fade-out 1s; animation-fill-mode: backwards; } */
/* .whole_menu_box_wrapper.active { display: block; animation: fade-in 1s; animation-fill-mode: forwards; } */
.whole_menu_box_wrapper { position:fixed; top: 1000px; bottom: 0; width: 100%; background-color: rgba(0,0,0,0.5); z-index:10; padding-top: 50px; opacity: 0; transition: all 1s; }
.whole_menu_box_wrapper.active { top: 0px; opacity: 1; transition: all 1s; }

.whole_menu_box_wrapper2 { position:fixed; top: 1000px; bottom: 0; width: 100%; background-color: rgba(0,0,0,0.5); z-index:10; padding-top: 50px; opacity: 0; transition: all 1s; }
.whole_menu_box_wrapper2.active { top: 0px; opacity: 1; transition: all 1s; }

.whole_menu_box_head { width: 100%; height: 50px; position: absolute; top: 0px; }
#whole_menu_box { width: 100%; height: 100%;  }
.whole_menu_box { height: 100%; width: 100%; }
.whole_menu_box .box_white_cont {width:100%; height:100%; background:#ffffff; overflow-y: scroll; }
#popBg{position: absolute; top: 0; left: 0; background: #000; opacity: 0.5; width: 100%; height: 100%; z-index: 0; display: none;}


.blankLine{ height: 16px; width: 100%; background: #f2f2f2; }

/* topNav */
.topNav{ padding-top: 20px; width: 90%; margin: 0 auto; }

.logo{ width: 30%; margin-bottom: 10px; }

.tab{ background:none; border: 0; border-bottom: 2px solid #f2f2f2; }

.tab button h2, .tab button h3{ color: #a8a8a8; }

.tab button{ letter-spacing: -1px; }
.tab button.active{ background: none; border-bottom: 2px solid #212121; }

.tab button.active h2, .tab button.active h3{
color: #212121;
font-weight: bold;
}

.kwPick{
width: 90%;
margin: 0 auto;
}

.contnetTit{
margin: 0 auto;
padding: 18px 0;
border-bottom: 1px solid #f2f2f2;
}

.contnetTit:after{
content:"";
display: block;
clear: both;
}

.ctTit{ color: #4b4b4b; float: left; padding: 2px 0; }

.ctTit b{ color: #4b4b4b; }

.ctTime{
float: right;
font-size: 0;
}

.iconIng .ctTimeIcon{ width: 10px; height: 10px; background: #51cf66; border-radius: 50%; display: inline-block; vertical-align: middle; margin-right: 8px; }
.iconEnd .ctTimeIcon{ width: 10px; height: 10px; background: #FFB123; border-radius: 50%; display: inline-block; vertical-align: middle; margin-right: 8px; }

.iconEnd .ctTimeRefresh{
display: none;
}

.ctTime h4 { color: #7d7d7d; display: inline-block; vertical-align: middle; }
.ctTime h6 { color: #7d7d7d; display: inline-block; vertical-align: middle; }

.pickList{
padding: 10px 8px;
font-size: 0;
}

.pickList::after{
clear: both;
content:"";
display: block;
}

.pickListLeft { float: left; padding: 5px 0; }
.pickListLeft h5 { display: inline-block; font-size: 16px; }
.pickListLeft h5 b { color: #4b4b4b; }

.pickListRight { float: right; }
.pickListRight h6 { color: #a8a8a8; display: inline-block; margin-right: 14px; vertical-align: middle; width: 41px; }
.pickListRight .rank_sign { display: inline-block; }
.pickListRight .rank_sign.plus { color: #ff3838; }
.pickListRight .rank_sign.minus { color: #0068b7; }
.pickListRight .rank_value { display: inline-flex; float: right;}
.pickListRight .rank_value.plus { color: #ff3838; }
.pickListRight .rank_value.minus { color: #0068b7; }
.pickListRight input[type="radio"] { display: none; }
.pickListRight input[type="radio"]+ .outRadio { display: inline-block; vertical-align: middle; width: 24px; height: 24px; border: 1px solid #cecece; border-radius: 50%; background: #fff; }
.pickListRight input[type="radio"]+ .outRadio+ .inRadio { display: inline-block; vertical-align: middle; width: 12px; height: 12px; border: 1px solid #cecece; border-radius: 50%; position: absolute; top: 6px; left: 6px; }
.pickListRight input[type="radio"]:checked+ .outRadio+ .inRadio { background: #4b4b4b; border: 1px solid #4b4b4b; }

.main_radio_input{
width: 26px;
height: 26px;
position: relative;
display: inline-block;
text-align: center;
}

.pickLabel { cursor: pointer; background: #fff; display: block; animation: fade-in 1s; animation-fill-mode: forwards; }
.pickLabel.hide { display: none; }

.load, .close{
padding: 19px;
text-align: center;
}

#news-close-btn { float: right; margin-right: 10px; margin-top: 12px; }
#goto-top-btn { position: fixed; bottom: 20px; z-index: 1000; right: 20px; background-color: #00000099; }
#goto-top-btn.hide { display: none; }

#what-is-lead-stock { border-radius: 20px; border: 1px solid #ddd; padding: 5px 10px; background-color: white; }
#what-is-lead-stock * { color: #4b4b4b; }
#what-is-lead-stock img { vertical-align: top; }
#what-is-lead-stock span { margin-left: 5px; font-size: 14px; }
.what-is-lead-stock_tooltip { position: absolute; background-color: #F0F0F0; left: 15px; padding: 10px 15px; border-radius: 5px; color: #4b4b4b; font-weight: bold; right: 16px; box-shadow: 2px 2px 5px #000; display: none; margin-top: 40px;
    animation-name: show_info;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
}
.what-is-lead-stock_tooltip.active { display: block; }
@keyframes show_info {
    from {margin-top: 50px; }
    to {margin-top: 40px; }
}

.load h5, .close h5{
color: #4b4b4b;
display: inline-block;
}

.load span img, .close span img{
vertical-align: middle;
}

.kwNews{
width: 90%;
margin: 0 auto;
/* height: 352px; */
}

.newsListTime{
font-size: 0;
margin-bottom: 8px;
}

.newsListTime h4{
display: inline-block;
padding-left: 10px;
color: #a8a8a8;
}

.newsListTime h4:first-child{
border-right: 1px solid #c4c4c4;
color: #7d7d7d;
padding-left: 0;
padding-right: 10px;
}

.newsListTit{
font-size: 0;
margin-bottom: 8px;
}
.newsListTit h3{
width: 100%;
color: #4b4b4b;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.newsKeyword{
font-size: 0;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.newsKeyword h5{
display: inline-block;
margin-right: 4px;
color: #6C6C6C;
}

.newsKeyword h5 b{
color: #4b4b4b;
}

.select{
padding: 10px 0;
border-bottom: 1px solid #dadada;
}

.newsMore{
padding: 19px 0;
font-size: 0;
text-align: center;
}

.newsMore h6{
color:#4b4b4b;
display: inline-block;
vertical-align: middle;
}

.newsMore img{
vertical-align: middle;
display: inline-block;
}

.kwStock { width: 90%; margin: 0 auto; padding-bottom: 63px; }

.stockTab, .rankTab{
background: #f2f2f2;
width: 100%;
border-radius: 9px;
display: block;
padding: 2px;
box-sizing: border-box;
margin-top: 8px;
}

.stockTab::after, .rankTab::after{
clear:both;
content: "";
display: block;
}

.stockTablinks, .rankTablinks {
width: 33.3%;
font-size: 0;
padding: 6px 0;
text-align: center;
background: none;
}

.stockTab button.active+button h5, .rankTab button.active+button h5{
border-left: 0;
}

.stockTab button.active, .rankTab button.active{
background:#fff;
border-radius: 8px;
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.12), 0px 3px 1px rgba(0, 0, 0, 0.04);
}
.stockTab button.active h5, .rankTab button.active h5{
border: 0;
font-weight: 700;
}

.stockInfo{
font-size: 0;
}
.stockInfo::after{
clear: both;
content: "";
display: block;
}

.stockName{
float: left;
}

.stockImg{
display: inline-block;
border-radius:50%;
overflow: hidden;
vertical-align: middle;
margin-right: 10px;
}

.stockTxt{
display: inline-block;
font-size: 0;
vertical-align: middle;
}

.stockTxt h2{
color: #4b4b4b;
margin-bottom: 4px;
}

.stockTxt h5{
color: #a8a8a8;
}

.A_color { color: #ff0d07; }
.B_color { color: #4B4B4B; }
.C_color { color: #1AACFF; }

.stockPrice { float: right; font-size: 0; padding: 4px 0; }
.stockPrice h2 { display: inline-block; }
.stockPrice h5 { display: inline-block; padding: 8px 8px; background: #FFF0EE; border-radius: 16px; margin-left: 8px; }
.stockPrice h5.minus { background: #EEF0FF; }
.stockPrice h5 b { color: #ff3838; }
.stockPrice h5 b.minus{ color: #0068b7; }

.stockKeyword{
font-size: 0;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 10px;
}

.stockKeyword h5{
display: inline-block;
margin-right: 4px;
color: #6C6C6C;
}

.stockKeyword h5 b{
color: #6c6c6c;
}

.stockList{
padding-top: 24px;
padding-bottom: 18px;
border-bottom: 1px solid #dadada;
}

.ctTimeRefresh{
display: inline-block;
vertical-align: middle;
margin-left: 14px;
}


/* keywrod */

/*total*/

.waitBn{
background: #212121;
position: fixed;
bottom:0;
width: 100%;
font-size: 0;
}

.waitIcon{
display: inline-block;
padding: 14px 0;
width: 15%;
box-sizing: border-box;
text-align: center;
vertical-align: middle;
}

.waitTxt { display: inline-block; text-align: left; vertical-align: middle; width: 85%; }
.waitTxt h5{ line-height: 120%; color:#fff; }
.waitTxt.hide { display: none; }

.warnTxt h5 { line-height: 130%; color:#fff; width: 85%; margin-left: 14px; margin-right: 14px; margin-bottom: 10px; }
.warnTxt.hide { display: none; }

.copyTxt h5 { line-height: 130%; color:#fff; width: 85%; margin: 0 14px }
.copyTxt.hide { display: none; }

/* rank */

.rankMap{
width: 90%;
margin: 0 auto;
}

.mapContent img{
width: 100%;
}

.mapContent{
padding-bottom: 8px;
}

.rankInfo{
font-size: 0;
}

.rankInfo::after{
clear: both;
content: "";
display: block;
}

.rankName{
float: left;
}

.rankPrice{
float: right;
font-size: 0;
padding: 4px 0;
}

.rankImg{
display: inline-block;
border-radius:50%;
overflow: hidden;
vertical-align: middle;
margin-right: 10px;
}

.rankTxt{
display: inline-block;
font-size: 0;
vertical-align: middle;
}

.rankTxt h2{
color: #4b4b4b;
margin-bottom: 4px;
}

.rankTxt h5{
color: #a8a8a8;
}

.rankPrice h2{
display: inline-block;
}

.rankPrice h5{
display: inline-block;
padding: 8px 8px;
background: #FFF0EE;
border-radius: 16px;
margin-left: 8px;
}

.rankPrice h5 b{
color: #ff3838;
}

.rankKeyword{
font-size: 0;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 10px;
}

.rankKeyword h5{
display: inline-block;
margin-right: 4px;
color: #6C6C6C;
}

.rankKeyword h5 b{
color: #6c6c6c;
}

.rankList{
padding-top: 24px;
padding-bottom: 18px;
border-bottom: 1px solid #dadada;
}

.newsCtrl{ padding:18px 0; width: 90%; margin: 0 auto; }

.newsCtrl::after{
content: "";
display: block;
clear: both;
}

.btn_layer_refresh{
float: left;
}
.btn_layer_close{
float: right;
}

.newsView{
width: 100%;
margin: 0 auto;
border-top: 1px solid silver;
}

.newsView .newsList{
padding: 16px 0;
width: 90%;
margin: 0 auto;

}

.newsView .newsKeyword{
padding-bottom: 8px;
border-bottom: 1px solid #dadada;
}

.newsDetail {
background: #f2f2f2;
padding: 16px 0;
}

.newsLink{
width: 90%;
margin: 0 auto;
}

.newsLink a{
width: 100%;
display: block;
}

.linkTxt{
color: #3477FA;
line-height: 18px;
width: 100%;
word-break: break-all;
}

.linkTxt b{
color: #3477FA;
}

.newsImg{
width: 90%;
margin: 8px auto;
}

.newsImg img{
width: 100%;
margin: 0 auto;
}

.newsTxtTit b{
margin-bottom: 8px;
display: block;
line-height: 21px;
color: #4b4b4b;
}

.newsTxt h4{
line-height: 24px;
letter-spacing: -0.04em;
color: #4b4b4b;
}

.newsTxt{
width: 90%;
margin: 0 auto;
}

.newsStock { width: 90%; margin: 0 auto; }
.newsStock.hide { display: none; }

.stockAnaly{
margin-top: 12px;
}

.stockAnaly::after{
content: "";
display: block;
clear: both;
}

.stockChart{
float: left;
width: 70%;
height: 100px;
}

.stockChart img{
width: 100%;
}

.stockAi{
float: right;
font-size: 0;
text-align: center;
width: 25%;
}

.stockAiTit{
margin-bottom: 8px;
}

.stockAiTit b{
color: #212121;
}

.stockAiScore{
margin-bottom: 8px;
color: #7d7d7d;
}

.aiMore{
padding: 4px 16px;
border-radius: 100px;
background: #f2f2f2;
display: inline-block;
}

.aiMore b{
color: #6c6c6c;
}

.newsStockTit{
padding: 16px 0 0 0;
}

.newsStockTit b{
color: #4b4b4b;
}


/* stockDetail */
.sub_header { width: 100%; margin: 0 auto; margin-top: 20px; display: block; }
.sub_header img{ width: 30px; vertical-align: text-bottom; }
.sub_header_title { padding-left: 10px; }

.sub_header_stock_info { position: fixed; left: 0; top: 0; width: 100%; margin: 0 auto; padding: 5px 0; background-color: rgba(0,0,0,0.5); }
.sub_header_stock_info img{ width: 10%; vertical-align: text-bottom; }

.sdTop { width: 90%; margin: 0 auto; margin-top: 28px; }
.sdTop.stock_info { margin-top: 60px; }

.sdNum h6{
display: inline-block;
color: #a8a8a8;
line-height: 140%;
}

.perUp h1 b, .perUp h5{
color: #ff3838;
}

.perDown h1 b, .perDown h5{
color: #3477FA;
}

.sdPrice h1, .sdPrice h5{
display: inline-block;
line-height: 140%;
}

.sdPer {
font-size: 15px;
}

.sdPer img{
width: 1em;
display: none;
vertical-align: middle;
}

.sdPer h5{
display: inline-block;
vertical-align: middle;
line-height: 140%;
}

.sdInfo .perUp .perIcon_up{
display: inline-block;
}

.sdInfo .perDown .perIcon_down{
display: inline-block;
}

.sdInfo{
width: 65%;
display: inline-block;
}

.sdEval{
width: 35%;
display: inline-block;
border-radius: 5px;
border: 1px solid #c4c4c4;
box-sizing: border-box;
padding: 10px 0;
}

.sdInfoWrap{
font-size: 0;
}

.sdEval h5{
text-align: center;
color: #6c6c6c;
margin-bottom: 10px;
}

.eval_A{

background: #ff3838;
border-radius: 50%;
display: inline-block;
text-align: center;
}

.eval_B{

background: #7d7d7d;
border-radius: 50%;
display: inline-block;
text-align: center;
}

.eval_C{

background: #3477FA;
border-radius: 50%;
display: inline-block;
text-align: center;
}

.eval_A h3, .eval_B h3, .eval_C h3{
color: #fff;
font-weight: bold;
width: 20px;
height: 20px;
line-height: 18px;
}

.evalScore{
font-size: 0;
text-align: center;
}

.evalDay, .evalMid, .evalLong{
display: inline-block;
width: 30%;
text-align: center;
}

.evalScore h6{
color: #6c6c6c;
font-size: 10px;
margin-top: 4px;
}

.sdKeyword {
margin-top: 16px;
margin-bottom: 16px;
}

.sdKeyword h5{
color: #6B8DC0;
display: inline-block;
margin-right: 8px;
}

.sdChart img{
width: 100%;
}

.sdContentWrap{
width: 90%;
margin: 0 auto;
}
.sdContentTit{
margin-top: 40px;
font-weight: bold;
color: #4b4b4b;
}

.aiBox{
margin-top: 20px;
background: #fafafa;
border: 1px solid #cecece;
border-radius:10px;
padding: 25px 20px;
}

.aiBoxScore{
font-size: 0;
}

.aiboxDay, .aiboxMid, .aiboxLong{
width: 33.3%;
border-right: 1px solid #00000033;
display: inline-block;
text-align: center;
box-sizing: border-box;
}

.aiboxLong{
border: none;
}

.aiboxScore_A, .aiboxScore_B, .aiboxScore_C{
margin-top: 12px;
}

.aiboxScore_A h1{
color: #FF3838;
display: inline-block;
margin-right: 4px;
font-weight: bold;
vertical-align: middle;
}

.aiboxScore_B h1{
color: #7D7D7D;
display: inline-block;
margin-right: 4px;
font-weight: bold;
vertical-align: middle;
}

.aiboxScore_C h1{
color: #3477FA;
display: inline-block;
margin-right: 4px;
font-weight: bold;
vertical-align: middle;
}
.aiboxScore_A h6{
background-color: #ff38381a;
color:#FF3838;
border-radius: 5px;
text-align: center;
display: inline-block;
padding: 5px;
font-weight: bold;
vertical-align: middle;
}

.aiboxScore_B h6{
background-color: #7D7D7D1a;
color:#7D7D7D;
border-radius: 5px;
text-align: center;
display: inline-block;
padding: 5px;
font-weight: bold;
vertical-align: middle;
}

.aiboxScore_C h6{
background-color: #3477FA1a;
color:#3477FA;
border-radius: 5px;
text-align: center;
display: inline-block;
padding: 5px;
font-weight: bold;
vertical-align: middle;
}

.aiboxTxt{
margin-top: 20px;
line-height: 120%;
}

.aiBoxTable{
margin-top: 30px;
}

.ab_tblTd{
border-bottom: 1px solid #a8a8a820;
font-size: 0;
padding: 15px 0;
}

.ab_tblTit{
width: 30%;
display: inline-block;
border-right: 2px solid #a8a8a850;
vertical-align: top;
box-sizing: border-box;
}

.ab_tblTit h5{
color: #a8a8a8;
font-weight: bold;
text-align: center;
}

.ab_tblInfo{
width: 70%;
display: inline-block;
padding: 0 0 0 10px;
box-sizing: border-box;
}


.ab_tblInfo h5{
display: inline-block;
line-height: 140%;
}

.ab_tblTd:last-child{
border-bottom: none;
}

.rateWrap{
font-size: 0;
margin-top: 20px;
margin-bottom: 40px;
}

.rateToday, .rate5day, .rate20day{
width: 32%;
display: inline-block;
margin-right: 2%;
}

.rate20day{
margin-right: 0;
}

.rateTit{
background: #f2f2f2;
text-align: center;
padding: 6px 0;
margin-bottom: 4px;
border-radius: 5px;
}

.rateTit h5{
color: #6c6c6c;
text-align: center;
}

.rateInfo{
background: #fafafa;
padding: 4px 0 10px;
text-align: center;
border-radius: 5px;
}

.rateInfo h2{
font-weight: bold;
text-align: center;
}

.down { color: #3477fa; }
.up { color: #ff3838; }

.down .smaller { color: #3477fa; }
.up .smaller { color: #ff3838; }

.rateInfo h6{ font-size: 10px; color: #a8a8a8; line-height: 190%; }

.ratePer{ margin-bottom: 8px; }

.compInfoWrap{ margin-top: 10px; margin-bottom: 40px; }

.compInfo{ border-bottom: 1px solid #c4c4c4; }

.compInfo::after{ clear: both; content: ""; display: block; }

.compInfo_R, .compInfo_L{ width: 48%; margin: 10px 0; }

.compInfo_R::after, .compInfo_L::after{ clear:both; content:""; display: block; }

.compInfo_R{
float: right;
}

.compInfo_L{
float: left;
}

.compInfoTit{
float: left;
}

.compInfoTxt{
float: right;
}

.compInfoTit h6{
color: #a8a8a8;
font-size: 11px;
}

.compInfoTit h6 b{
color: #a8a8a8;
}

.compInfoTxt h5{ color: #4b4b4b; }

@media only screen and (max-width: 360px) {
    .compInfoTit h6 { font-size:11px; }
    .compInfoTxt h5 { font-size:12px; }
}

@media only screen and (max-width: 320px) {
    .compInfoTit h6 { font-size:10px; }
    .compInfoTxt h5 { font-size:11px; }
}

.diagScore_A, .diagScore_B, .diagScore_C{
display: inline-block;
width: 28px;
height: 28px;
border-radius: 50%;
text-align: center;
margin-left: 8px;
}
.diagScore_A h2, .diagScore_B h2, .diagScore_C h2{
color:#fff;
font-weight: bold;
line-height: 28px;
}

.diagScore_A{
background: #ff3838;
}

.diagScore_B{
background: #7d7d7d;
}

.diagScore_C{
background-color: #3477FA;
}

.daySign{
background: #f2f2f2;
margin-top: 20px;
width: 100%;
box-sizing: border-box;
padding: 16px;
border-radius: 10px;
}

.signSmaile, .signGloomy{
display: inline-block;
width: 25%;
font-size: 0;
vertical-align: middle;
}

.signSmaile img, .signGloomy img{
width: 50%;
vertical-align: middle;
}

.signSmaile h5, .signGloomy h5{
display: inline-block;
width: 50%;
text-align: center;
vertical-align: middle;
}

.signScore{
display: inline-block;
width: 50%;
text-align: center;
vertical-align: middle;
}

.daySign{
font-size: 0;
}

.signScore h5{
background: #fafafa;
border-radius: 30px;
display: inline-block;
padding: 5px 10px;
margin-top: 4px;
}

.signScore h5{ border: 1px solid #999; }
.signScore h5.up{ border: 1px solid #ff3838; }
.signScore h5.down{ border: 1px solid #3477FA; }

.signTxtWrap{
font-size: 0;
margin-top: 15px;
border-bottom: 1px solid #00000020;
padding-bottom: 15px;
}


.signTime{
display: inline-block;
width: 30%;
vertical-align: top;

}

.signTime h3{
color: #7d7d7d;
}

.signTxt{
display: inline-block;
width: 70%;
vertical-align: top;
}

.signTxtTit{
font-weight: bold;
}

.signTxtInfo{
color: #7d7d7d;
}

.signTxt h3{
line-height: 140%;
}

.radar_chart{
margin-top: 20px;
}

.radarWrap img { width: 50px; height: auto; }

.radarTit{
background: #f2f2f2;
text-align: center;
border-radius: 10px;
margin-bottom: 10px;
}

.radarTit h3{
font-weight: bold;
line-height: 34px;
}

.radarContent{
font-size: 0;
margin-bottom: 50px;
}

.trend, .majip, .volume{
width: 33.3%;
border-right: 1px solid #00000020;
text-align: center;
display:inline-block;
box-sizing: border-box;
}

.volume{
border-right: 0;
}

.trend img, .majip img, .volume img{
margin: 5px 0;
}

.mesu, .mSubject, .sSelling{
width: 33.3%;
border-right: 1px solid #00000020;
text-align: center;
display:inline-block;
box-sizing: border-box;
}

.sSelling{
border-right: 0;
}

.mesu img, .mSubject img, .sSelling img{
margin: 5px 0;
}

.status_sunny{
color: #ff3838;
font-weight: bold;
}

.status_rain{
color: #3477fa;
font-weight: bold;
}

.status_cloud, .status_question{
color: #7d7d7d;
font-weight: bold;
}

.radarSubtit{
color: #7d7d7d;
}

.radar_money .radarContent, .radar_value .radarContent {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}

.radar_money .radarContent div{
width: 50%;
border-right: 1px solid #00000020;
box-sizing: border-box;
text-align: center;
padding: 20px 0;
border-bottom: 1px solid #00000020;
}

.radar_money .radarContent div:nth-child(2n){
border-right: 0;
}

.radar_money .radarContent div:nth-child(3){
border-bottom: 0;
}

.radar_money .radarContent div:nth-child(4){
border-bottom: 0;
}


.radar_value .radarContent div{
width: 50%;
border-right: 1px solid #00000020;
box-sizing: border-box;
text-align: center;
padding: 20px 0;
border-bottom: 1px solid #00000020;
}

.radar_value .radarContent div:nth-child(2n){
border-right: 0;
}

.radar_value .radarContent div:nth-child(3){
border-bottom: 0;
}

.radar_value .radarContent div:nth-child(4){
border-bottom: 0;
}

.per h2, .pbr h2{
line-height: 60px;
font-weight: bold;
}

.radar_value .radarContent .valueNotice{
width: 100%;
border: 0;
}

.valueNotice h5{
color:#7d7d7d
}

.valueNotice img{
width: 20px;
vertical-align: middle;
}

.long_chart_ex{
width: 100%;
}

.longScoreWrap{
font-size: 0;
background: #f2f2f2;
border-radius: 5px;
}

.longScore{
width: 20%;
display: inline-block;
box-sizing: border-box;
border-right:1px solid #fff;
text-align: center;
padding: 10px 0;
}

.longScore:last-child{
border-right: 0;
}

.longScore h5{
color: #212121;
}

.longScore h3{
font-weight: bold;
color: #7d7d7d;
}

.longScore img{
width: 80%;
margin: 4px 0;
}

#footer { background-color: #212121; width: 100%; position:fixed; bottom: 0; color: white; }

.text_center { text-align: center; }
.text_right { text-align: right; }

.chart_button-wrapper { padding-bottom: 20px; padding-top: 20px; }
.chart_button { border: none; margin: 0 2px; width: 45px; border-radius: 5px; padding: 3px 0; }
.chart_button.active { background-color: gray; color: white; }

.notosans { font-family: 'Noto Sans KR', sans-serif !important; }

.diagnose_percent { width: 100%; height: 40px; }

.progress_wrapper { width: 100%; background-color: #f1f1f1; height: 18px; border-radius: 20px; margin-top: 20px; margin-bottom: 10px; }
.progress { height: 100%; border-radius: 20px; text-align: center; color: white; }
.progress.bad { background-color: #0068b7; }
.progress.neutrality { background-color: #999; }
.progress.good { background-color: #FF3838; }

.diagnose-dot-wrapper { width: 100%; height: 12px; background-image: url(../images/bg-diagnose.jpg); }
.diagnose-dot-wrapper .blue-dot { width: 12px; height: 12px; border-radius: 12px; background-color: #0068b7; float: left;}
.diagnose-dot-wrapper .red-dot { width: 12px; height: 12px; border-radius: 12px; background-color: #FF3838; float: right; }
.diagnose-dot-wrapper .gray-dot { width: 12px; height: 12px; border-radius: 12px; background-color: silver; position: absolute; }

.diagnose-txt-wrapper { width: 100%; margin-top: 10px; margin-bottom: 40px; }
.diagnose-txt-wrapper span { display: inline-flex; }
.diagnose-txt-wrapper .bad { position: absolute; }
.diagnose-txt-wrapper .mid { position: absolute; }
.diagnose-txt-wrapper .good { position: absolute; }

@keyframes fade-in {
    from { opacity: 0; } to { opacity: 1; }
}

@keyframes fade-out {
    from { opacity: 1; } to { opacity: 0; }
}

.smaller { font-size: smaller; }

.loading-wrapper { padding: 70px 0;}
.loading-wrapper-stock { padding-top: 70px; padding-bottom: 300px;}
.loaing { width:30px; height: auto; }

.no-data { width: 80px; height: auto; margin-bottom: 20px; }
.data-error { width: 80px; height: auto; margin-bottom: 20px; }