/* ¸ð¹ÙÀÏ ************************************************************************************************************************************************************************/
@media only screen and (min-width:100px) and (max-width:900px) {
	
	.charts_iframe_main { text-align:center; border:0px; width:96%; height:400px; border-bottom:1px solid #d9dadb; }
	.charts_iframe { text-align:center; border:0px; width:96%; height:800px; border-bottom:1px solid #d9dadb; }
	.charts_name { text-align:center; padding-top:10px; padding-bottom:10px; }
	.charts_names { width:100%; display:inline-block; }
	.charts_names li { float:left; width:20%; cursor:pointer; }
	.charts_names_off { 
		padding:8px; border:1px solid #f5f5f5; border-radius:20px; margin-bottom:3px;
		background: linear-gradient( to top, #445aad, #152b7c);
		color:#fff; font-size:13px; font-family:NotoSansKR-Medium; letter-spacing: 0.1em; line-height:1em; 
	}
	.charts_names_off:hover { background:#444; }
	.charts_names_on { 
		padding:8px; background:#e7356f; border:1px solid #f5f5f5; border-radius:20px; margin-bottom:3px;
		color:#fff; font-size:13px; font-family:NotoSansKR-Medium; letter-spacing: 0.1em; line-height:1em; 
	}
	.charts_names li div img { height:16px; margin-right:10px; }

	.charts_logo { position:relative; display:none; }
	.charts_logos { position:absolute;  z-index:9; left:0px; top:-178px; }
	.charts_logo_main { position:relative; }
	.charts_logos_main { position:absolute;  z-index:9; left:0px; top:-86px; }
} /* ¸ð¹ÙÀÏ end */

/* PC ************************************************************************************************************************************************************************/
@media  all and (min-width : 900px)  {
	
	.charts_iframe_main { border:0px; width:100%; height:505px; border-bottom:1px solid #d9dadb; }
	.charts_iframe { border:0px; width:100%; height:950px; border-bottom:1px solid #d9dadb; }
	.charts_name { text-align:center; }
	.charts_names { width:100%; display:inline-block; margin-bottom:10px; }
	.charts_names_li_5 { float:left; width:20%; cursor:pointer; font-size:16px; }
	.charts_names_li_6 { float:left; width:16.6%; cursor:pointer; font-size:15px; }
	.charts_names_li_7 { float:left; width:14.2%; cursor:pointer; font-size:15px; }
	.charts_names_off { 
		padding:10px; border:1px solid #f5f5f5; border-radius:20px; margin-bottom:3px;
		background: linear-gradient( to top, #445aad, #152b7c);
		color:#fff; font-family:NotoSansKR-Medium; letter-spacing: 0.01em; line-height:1em; 
	}
	.charts_names_off:hover { background:#444; }
	.charts_names_on { 
		padding:10px; background:#e7356f; border:1px solid #f5f5f5; border-radius:20px; margin-bottom:3px;
		color:#fff; font-family:NotoSansKR-Medium; letter-spacing: 0.01em; line-height:1em; 
	}
	.charts_names li div img { height:16px; margin-right:10px; }

	.charts_logo { position:relative;  display:none; }
	.charts_logos { position:absolute;  z-index:9; left:0px; top:-143px; }
	.charts_logo_main { position:relative; }
	.charts_logos_main { position:absolute;  z-index:9; left:0px; top:-86px; }

} /* PC end */