@charset "utf-8";
/*-------------------------------------------------
dhra cont Style Sheet
Version : 1.0
Author : myeong-hee park
Create date : 2017. 1. 25.
-------------------------------------------------*/
.view_divisional {
	margin-top: 12px;
	}
.wrap_min .logo a:hover {
	text-decoration: none;
	}
.wrap_min .logo a:first-child,
.header_wrap.fixed .logo a:first-child {
	width: auto;
    min-width: 79px;
    text-indent: inherit;
	}	
.wrap_min .logo a:first-child span:first-child {
    width: 79px;
    height: 30px;
    text-indent: -9999px;
    overflow: hidden;
	}
.header_wrap.fixed .logo a:first-child  span:first-child {
    width: 73px;
  	}
.wrap_min nav {
	margin: 14px 0 0 50px; 
	}
.wrap_min nav li > a {
	color: #313131;
	}
.all_nav > li {
	width: 210px;
	}	
#gnavigation {
	margin-left: 28px;
	}
#gnavigation > li {
	margin-left: 25px;
	}
#gnavigation > li .depth2 a {
    line-height: 1.5;
    white-space: normal;
    word-break: break-all;
	}
#body {	
    min-height: 806px;
    }
#content {
	float: none;
    width: 100%;
	overflow: visible;
	}
	
.path_wrap {
	margin-bottom: 30px;
	}	
.stitle {
	margin-top: 0;
	}
.content-footer	{
    margin: 60px 0 0;
	}	
.txt_info {
	margin-bottom: 10px;
	}	
.depth3_title_txt {
	margin: 28px 0 7px;
	}		
/* 국민영양통계 메인 Style
-------------------------------------------------*/
#side.dhraStat {
	overflow: visible;
	} 	
#content.mainstat {
    float: left;
    width: 1020px;
	margin-bottom: 0;
	}	
.dhraStat {
	position: relative;
	height: 772px;
	background: url(../../images/kps/nutrition/stats.jpg) no-repeat 0 0;
	}
.dhraStat h2 {
	margin: 25px 23px 15px;
	color:#fff;
	line-height: 1.2;
	font: normal 1.5em NotoL;
	}
.dhraStat h2 span {
    line-height: 1;	
	font-family:'NotoM';
	}
.menu_scrollable {
	height: 445px;
	margin: 0 10px 0 19px;
	overflow: hidden;
	}
.nutristat_stats {	
	height: 100%;
	padding-right: 10px;
	background: url(../../images/kps/dhraStat/nutristat_stats.png) repeat-y 8px 0;
	overflow: hidden;
	overflow-y: auto;
	}	
.menu_scrollable:nth-of-type(2) {
	height: 130px;
	}
.nutristat_stats > li {
	min-height: 20px;
	padding-top: 20px;
	line-height: 1.1;
	}	
.nutristat_stats > li:first-child {
	padding-top: 0;
	}
.nutristat_stats > li > a {
	position: relative;
	display: block;
	padding-left: 25px; 
	color: #fff; 
	text-decoration:none; 
	letter-spacing: 0;
	transition: all 0.5s ease;
	font-size: 1.067em; 
	font-weight: bold;
	}
.nutristat_stats > li > a:hover {	
	transition: all .3s ease;
    -webkit-transition: all .3s ease;
    }
.nutristat_stats > li > a:before {
	position: absolute;
	top: -1px;
	left: 0;
	width: 7px;
	height: 7px;
	background-color: #fc6719;
	border: solid 7px #5b7691;
	border-radius: 100%;
	content:'';
	} 	
.nutristat_stats > li.on > a {
	color: #fc6719;
	line-height: 1;
	font-size: 1.2em;
	}
.nutristat_stats > li.on > a:before {
	top: 4px;
	left: 3px;
	width: 9px;
	height: 9px;
	background-color: #5b7691;
	border: solid 2px #fc6719;
	}
.nutristat_stats > .on > a:after {
	position: absolute;
    top: 3px;
    right: 0;
    color: #2f3143;
    content: '\e93e';
    font-size: 13px;
    font-family: xeicon;
	}
.year_menu {
	display: none; 
	position: absolute; 
	top: 0; 
	left: 200px; 
	width: 280px; 
	height: 642px; 
	padding-top: 130px; 
	background: #1c2d44 url(../../images/kps/nutrition/stats_menu.png) no-repeat center 30px;
	z-index: 10;
	}
.nutristat_stats .on .year_menu {
	display: block;
	}
.year_menu > li {
	}	
.year_menu > li > a {
	display: block;  
	margin: 0 20px;
	padding: 18px 0; 
	border-bottom: solid 1px rgba(255, 255, 255, .07);
	color :#cbd0d4; 
	line-height: 1.2;
	}
.nutristat_stats .depth02 {
	display: none;
	margin: 0 20px;
	padding: 10px 0; 
	border-bottom: solid 1px rgba(255, 255, 255, .07);
	letter-spacing: -0.05em;
	font-size: 0.933em; 
	}
.nutristat_stats .depth02 > li {
	margin-top: 10px;
	padding-left: 10px;
	background: url(../../images/kps/dhraStat/side_depth2.gif) no-repeat 0 8px;
	}
.nutristat_stats .depth02 > li:first-child {
	margin-top: 0;
	}
.nutristat_stats .depth02 > li.on {	
	background: url(../../images/kps/dhraStat/side_depth2_on.gif) no-repeat 0 10px;
	}
.nutristat_stats .depth02 a {
	color: #707685;
	}
.nutristat_stats .depth02 a:hover {
	color: #fc6719;
	font-weight: normal;
	}
.nutristat_stats .year_menu > .on > a {
	margin: 0; 
	padding: 18px 20px;
	background-color:#fc6719; 
	border: none; 
	color: #fff;
	}
.nutristat_stats .year_menu .on .depth02 {
	display: block;
	}	
.several_times {/* 기수별 통계*/
	}	
/* 메인 콘텐츠 */
.dhraStat_title {
	position: relative;
	margin: -4px 0 28px;
	color: #000;
	line-height: 1;
	font-size: 2.267em;
	font-family: NotoR; 
	}
.dhraStat_title:after {
	display: block;
	position: absolute;
    top: 50%;
    left: 125px;
	width: 100%;
	height: 3px;
    margin-top: -2px;
	background: url(../../images/kps/nutrition/main_title.png) repeat-x 0 0;
	content:'';
	} 	
.dhraStat_title span {
	font: 700 1.088em Montserrat;
	}
.ranking {/* 전체 다빈도 음식*/
	float: left; 
	width: 760px; 
	height: 160px; 
	background-color: #f2f6fa;
	box-sizing: border-box;
	}	
.ranking a {
	display: block;
	position: relative;
	height: 100%;
	padding: 30px 0 30px 38px; 
	text-decoration: none;
	box-sizing: border-box;
	}
.ranking h2 {
	float: left; 
	width: 136px;
	margin-top: 16px;
	color: #313131; 
	letter-spacing: -0.1em; 
	line-height: 1.2;
	font: normal 2em NotoL;
	}
.ranking h2 span {
	display: block; 
	line-height: 1;
    font-family: NotoB;
	}
.ranking ul {
	float:left;
	}
.ranking li {
	position:relative; 
	float: left; 
	width: 100px; 
	height: 100px; 
	margin-right: 48px; 
	border-radius: 100%; 
	background-color:#b8c6d6; 
	text-align:center;
	}
.ranking li span {
	display:block; 
	padding:15px 0 0; 
	font-size:0.933em; 
	color:#6d7483;
	}
.ranking li strong {
	color:#fff; 
	text-shadow: 1px 1px 0 #a4b1c0;
	font: normal 1.267em NotoM; 
	}
.ranking li:after {
	position: absolute;
	top: 50%; 
	right: -40px; 
	width: 30px;
	height: 6px; 
	margin-top:-3px; 
	background:url(../../images/kps/nutrition/ranking.gif) no-repeat; 
	content:'';
	}
.ranking li:first-child {
	background-color:#fc6719;
	}
.ranking li:first-child span {
	color:#ffeb3b;
	}
.ranking li:first-child strong {
	text-shadow:1px 1px 0 #dd601f;
	}
.ranking li:last-child {
	margin-right: 0;
	}	
.ranking li:last-child:after {
	display:none;
	}
.square_cont {
	float: left; 
	width: 194px; 
	height: 160px;
	margin: 24px 24px 0 0; 
	background-color: #f2f6fa;
	color: #707685;
	text-align: center;
	}
.square_cont a {
	display: block;
	position: relative;
	height: 100%;
	text-decoration: none;
	}	
.square_cont a:before,
.ranking a:before {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
    height: 0;
	content:'';
	opacity: 0;
    transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    z-index: 1
	}	
.square_cont a:hover:before,
.ranking a:hover:before {	
	width: 100%;
    height: 160px;
    border: solid 3px #f8602b;
	box-sizing: border-box;
	opacity: 1; 
	}
.line_square a:hover:before {
	top: -3px;
	left: -3px;
	width: 103%;
    height: 103%;
	}	
.square_cont a.motion:hover:before {
	background: rgba(249, 83, 25, .89) url(../../images/kps/main/thumb_more.png) no-repeat center 46px;
	border: none;
	}	
.square_cont a.motion:hover:after {
	position: absolute;
	top: 99px;
	left: 0;
	width: 100%;
    height: 100%;
	color: #fff;
	content:'자세히보기';
    text-align: center;
	transition: animation 1s ease .2s,opacity .5s ease-out .3s;
	-webkit-transition:-webkit-animation 1s ease .2s,opacity .5s ease-out .3s;
	-moz-transition:-moz-animation 1s ease .2s,opacity .5s ease-out .3s;
	z-index: 10;
	}	
.line_square {
	background-color: #fff;
	border: solid 3px #f0f2f5;
	box-sizing: border-box;
	}	
.square_cont:before {
	display: block;
	clear: both;
	content:'';
	}	
.square_cont .subject {
	padding: 37px 0 18px; 
	color:#313131;
	line-height: 1.1;
	font-size: 1.067em; 
	font-weight: normal; 
	}
.line_square .subject {
	padding-top: 34px;
	}
.square_cont .subject span {
	display: block; 
	color: #6d7483;
	font-size: 0.867em; 
	}
.square_cont .number {
	font-size: 1.333em;
	font-family: NotoL;
	}
.square_cont .point01 {
	color: #fc6719;
	}
.square_cont .point02 {
	color: #037bc1;
	}
.square_cont .point03 {
	color: #16b6c6;
	}
.square_cont .number strong {	
	font: 700 2.5em/1 Montserrat;
	vertical-align: bottom;
	}
.fat_intake {/*식품군별 영양소 */
	float: right; 
	width: 236px;
	margin: 0;
	background-color:#0a4e8f;
	color: #fff; 
	}
.fat_intake .subject {
	padding: 39px 0 17px; 
	color:#ffeb3b;
	line-height: 1.4;
	font-size: 1.067em;
	}
.fat_intake .subject span {
	color:#ffeb3b;
	}
.fat_intake .number {
	color: #fff;
	font-size: 1.733em; 
	}
.fat_intake .number strong {
	line-height: 1.2;
    font-size: 1.308em;
	}	

.food_intake {/* 식품섭취량 */
	float: left; 
	width: 324px; 
	background-color:#037bc1;
	color: #fff;
	}
.food_intake .subject {
	padding: 22px 0 35px;
	color: #fff;
	}	
.food_intake .number {
	color: #fff;
	font-size: 0.933em;
	font-family: "맑은 고딕", Malgun Gothic;
	}	
.food_intake .number > li {
    position: relative;
	float: left;
	width: 50%;
	}
.food_intake .number > li:first-child:after {	
    position: absolute;
    top: 3px;
    right: 0;
    width: 1px;
    height: 60px;
	border-right: solid 1px rgba(0, 58, 76, .15);
	content: '';
	}
.food_intake .number > li strong {
	margin-bottom: 10px;
	font-size: 2.433em;
	}
	
.food_ranking {/*다빈도 식품 */
	float: right;
	width: 236px;
	margin-right: 0;
	background: none;
	text-align: left;
	}
.food_ranking h2 {
	margin-bottom:10px; 
	font-size:1.067em; 
	color:#313131;
	}
.food_ranking ul {
	height: 123px;
	overflow: hidden;
	}
.food_ranking li {
	display:inline-block;
	width: 79px;
	height: 100%;
	margin-left: -5px;
	border: 1px solid #e2e6eb;
	box-sizing: border-box;
	border-left: none;
	color:#313131;
	text-align: center;
	overflow: hidden;
	}
.food_ranking li:first-child {
	width: 78px;
	margin-left: 0;
	border-left: 1px solid #e2e6eb;
	}
.food_ranking li:nth-child(2) {
	height: 65%;
	}
.food_ranking li:nth-child(3) {
	height: 35%;
	}		
.food_ranking li .rank {
	display: block;
    margin-top: 3px;
    line-height: 1;
	color: #6d7483;
	font-size: 0.933em;
	}	
.food_ranking li strong {
	display: block;
	color: #333;
	font-size: 1.2em;
	}	
.group_wrap {
	width: 584px;
	margin-right:0;
	background: none;
	overflow: hidden;
	}
.group_wrap li {
	position: relative;
	display: table;
	float: left; 
	width: 180px; 
	height: 160px; 
	margin-left: 22px;
	}
.group_wrap li:after {
	position:absolute; 
	left: 0; 
	bottom: 37px; 
	width: 100%; 
	height: 8px;
	background: url(../../images/kps/nutrition/link_arrow.png) no-repeat center; 
	content:''; 
	}
.group_wrap li:first-child {
	margin-left:0;
	}
.group_wrap a {
	display: table-cell; 
	padding-bottom: 35px; 
	background-color:#5b65e8;
	color:#fff; 
	line-height: 120%;
	text-align:center; 
	vertical-align:middle; 
	font-size: 1.467em;
	}
.group_wrap li:nth-child(2) a {
	background-color: #33b294; 
	}
.group_wrap li:nth-child(3) a {
	background-color: #ec9326; 
	}
.group_wrap a strong { 
	display: block;
	}
.group_wrap a:after {
	font-size: 0.682em;
	}	
.alcohol_intake {
	width: 236px;
	margin-right: 0;
	}
.alcohol_intake .number {
	color: #313131;
	font-size: 1.733em;
	}
.alcohol_intake .number strong {
	line-height: 1.2;
	font-size: 1.308em;
	}
.stat_cont {
	position: relative;
    float: left;
    width: 194px;
    height: 160px;
    margin: 24px 24px 0 0;
    box-sizing: border-box;
	line-height:1.5;
    text-align: center;
	overflow: hidden;
	}	
.health_stat {
	background-color: transparent;
    border: solid 3px #f0f2f5;
	}
.health_stat:after {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 157px;
    background: url(../../images/kps/nutrition/about.png) no-repeat right bottom / 60%;
    content: '';
    z-index: -1;
	}	
.stat_cont h2 {
	margin: 22px 0 16px; 
	color:#313131; 
	line-height: 1;
	font: normal 1.667em NotoL;
	}
.stat_cont h2 strong {
	display: block;
	font-family: NotoB;
	}
.stat_cont p {
	font-size: 0.933em;
	}
.youth_stat {	
    background-color: #f2f6fa;
    }
	
.dhra_kcal {
	width: 324px;
	margin: 24px 24px 0 0; 
	background-color:#16b6c6; 
	text-align:center;
	}
.dhra_kcal .subject {
	padding: 23px 0 20px; 
	color:#fff; 
	}
.dhra_kcal ul {
	color: #fff; 
	overflow: hidden;
	}	
.dhra_kcal li {
	position: relative; 
	float: left; 
	width: 50%; 
	overflow: hidden;
	}
.dhra_kcal li:first-child:after {
    position: absolute;
    top: 12px;
    right: 0;
    width: 1px;
    height: 60px;
    background: rgba(0, 58, 76, .15);
    content:'';
	}	
.dhra_kcal li strong {
	font: 700 2.433em/1.3 Montserrat;
	}
.dhra_kcal li span {
	font-size: 0.933em;
	}
	
/* 국민영양통계 서브 콘텐츠 Style
-------------------------------------------------*/
.title_mint {
	color:#16b6c6;
	font: normal 1.733em NotoD;
	}
.paragraph {
	margin-top:25px;
	}
.stats_sort {
	position:relative; 
	margin-bottom: 30px; 
	z-index: 10;
	}
.stats_sort .select {
	position:absolute;
	top:0; 
    bottom: 0;
	left: 0; 
	width: 125px;
    margin-bottom: 10px;
	background-color: #fc6719; 
	z-index: 2;
	}
.stats_sort .select a {
	display: block; 
	padding: 5px 10px; 
	background-color: #fc6719; 
	box-sizing: border-box;
	color: #fff;
	}
.stats_sort .select .label {
	position: relative;
	width: 100%;
	height: 100%;
	background: 0 none;
	}	
.stats_sort .select .label:before {
	display: inline-block;
	width: 0;
	height: 100%;
	vertical-align: middle;
	content: '';
	}	
.stats_sort .select .label > span {
	display: inline-block;
	position: relative;
	width: 100%;
    padding-right: 10px;
    box-sizing: border-box;
    letter-spacing: 0;
	line-height: 1.3;
	text-align: center;
	vertical-align: middle;
	font: normal 1.067em NotoM;
	}
.stats_sort .select .label > span:after {
	display: inline-block;
	position: absolute;
    top: 9px;
    right: 0;
   	width: 0;
	height: 0;
	border-top: 5px solid #fff;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	content: '';
	}
.stats_sort .select ul {
	display: none; 
	position:absolute;
	top:100%;
	left:0;
	width:100%;
	margin-top: 1px;
	font-size: 0.933em;
	}
.stats_sort .select ul > li {
	border-bottom: solid 1px #fff;
	}
.stats_sort .select ul > li a {
	padding: 5px 15px;
	}	
.stats_sort .select.active ul {
	display:block;
	}
.stats_sort .tab_menu {
	padding-left: 140px;
	overflow: hidden;
	}
.stats_sort.noyear .tab_menu {
	width:100%;
	}	
.stats_sort.noyear .tab_menu {
	padding-left:0px;
	}		
.stats_sort + .normal_tab {
	margin-top: -20px;
	}
.stats_sort + .btn_area_right,
.normal_tab + .btn_area_right {
	margin-bottom: 10px;
	}
.multi_btn > span {
	display: block;
	}
.multi_btn > span:first-child {
	margin-top: 13px;
	} 	
.multi_btn > span .btn_brownSmall {
	padding: 6px 20px 5px;
	border: none;
	border-bottom: solid 2px #5f4d3b;
	}
.multi_btn > span .btn_brownSmall i {
	margin-right: 5px;
	}
.tab_menu > li > a {
	padding: 12px 5px 13px;
	}	

/* 통계 테이블 */ 
.stats_sort + form {
	margin: -25px 0 12px;
	}
.normal_tab + form {
	margin: 12px 0;
	}
.articles_search .btn_brownSmall {
    padding: 6px 20px;
	background: #7f6c58;
	border-bottom: solid 2px #5f4d3b;
	text-shadow: 2px 1px 1px #5f4d3b;
	font-size: 0.933em;
	}
.articles_search [class*="fa-"] {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 2px;
	background: url(../../images/kps/common/icon_strip.png) no-repeat -87px -332px;
	}	
.articles_search .fa-minus {
	background-position: -87px -373px;
	}
.articles_search .btn_colorExcel {
    padding: 6px 20px 5px;
    line-height: 1.2;
    font-weight: normal;  
	}
.articles_search .btn_colorExcel:after {
	display: none;
	}	
.basic_searchForm .input_smallBlack {
	margin-left: -5px;
	}
.basic_searchForm button.input_smallBlack {
	height: 29px;
	margin-left: -1px;
	}
.basic_searchForm .icon_reset {
	display: inline-block;
	width: 18px;
	height: 19px;
	background: url(../../images/kps/common/icon_strip.png) no-repeat -87px -445px;
	vertical-align: top;
	}		
.dhraStat_area {
	position: relative;
	height: 816px;
	border-top: solid 2px #45474d;
	border-bottom: solid 1px #8f9194;
	font-size: 0.933em;
	} 
.dhraStat_area table {
	margin-left: -1px;
	text-align: center;
	}
.dhraStat_area table tbody tr:nth-child(even),
.dhraStat_area.toggle_table tbody tr[class*="grouping"]:nth-child(even) {
	background: #fcf7f5;
	}
.dhraStat_area.toggle_table tbody tr:nth-child(even) {
	background: none;
	}	
.dhraStat_area tr[class*="grouping"] {
	display: none;
	}
.dhraStat_area tr.grouping01 {
	display: table-row;
	}
.dhraStat_area thead th {
	padding: 10px 15px;
	background: #fafafb;
	color: #2f3743;
	overflow: hidden;
	z-index: 5;
	}	
.dhraStat_area thead th:before {
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 100px;
	background: #e4e7ec;
	content:'';
	}
.dhraStat_area thead th:after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #e4e7ec;
	content:'';
	}
.dhraStat_area thead .bline:after,
.dhraStat_area thead tr:last-child th:after {
	background: #8f9194;
	} 	
.dhraStat_area td {
	padding: 10px;
	border-left: solid 1px #e4e7ec;
	border-bottom: solid 1px #e4e7ec;
    white-space: nowrap;
	}	
.dhraStat_area .icon_toggle {
	margin: 5px 0;
	font-size: 1.067em;
	font-weight: bold;
	}	
.dhraStat_area .icon_toggle i {
    display: inline-block;	
	width: 29px;
	height: 29px;
	margin-right: 5px;
    background: url(/resources/images/kps/dhraStat/icon_toggle.gif) no-repeat 0 0;
    vertical-align: middle;    
    }	
.dhraStat_area .icon_toggle i.btn_minus {
	background-position: 0 bottom;
	}   
.dhraStat_area .icon_toggle span {
	width: 1px;
	overflow: hidden;
	opacity: 0;
	} 	
.articles_search .basic_searchForm .input_long02,
.basic_searchForm .input_smallBlack {
	vertical-align: top;
	}	
#contentArea::before,
#contentArea::after{content:"";display:block;clear:both;}
#chart_div{ width: 900px; height: 660px;float:left;}
.select_div{float:right;width:340px;}
.select dt { display: block; color:#333; font-size:16px; padding:10px 0;}
.mutliSelect li{overflow:hidden;padding:5px 10px;}
.mutliSelect li label{float:left;width:50%;color:#333;font-size:13px;}
.mutliSelect li:nth-child(odd){background-color:#fbfcfd;}
.mutliSelect li:nth-child(even){background-color:#f2f5f7;}
.graph-search input{width:100%;display:block;background-color:#fc6719;color:#fff;font-size:16px;padding:8px 0 10px;margin-top:10px;}
.note.warning{clear:both;margin-left:70px;font-size:11px;color:#999;}

/* 셀렉트박스  형태 */
.dropdown dd .title{display:block;width:100%;cursor:pointer;border:1px solid #e3e6e8;padding:10px 15px;font-size:13px;}
.dropdown dd .mutliSelect{opacity:0;visibility:hidden;max-height:0;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.dropdown dd.active .mutliSelect{opacity:1;visibility:visible;max-height:1000px;}

/* 건강영양통계 */
.map_area {position: relative; height: 800px; margin: 0 auto; padding: 30px; border:1px #ddd solid; overflow: hidden;}
.map_area svg {width: 100%; height: 100%;}
.map_color_none{fill:#ffffff; stroke:#000000;}
.map_color01{fill:#f4f4f4; stroke:#ffffff;}
.map_color02{fill:#e3effa; stroke:#ffffff;}
.map_color03{fill:#cfe4f6; stroke:#ffffff;}
.map_color04{fill:#b9d8f1; stroke:#ffffff;}
.map_color05{fill:#a1caec; stroke:#ffffff;}
.map_color06{fill:#85bae7; stroke:#ffffff;}
.map_color07{fill:#7ab2e2; stroke:#ffffff;}
.map_color08{fill:#69abe2; stroke:#ffffff;}
.map_text{font-size: 0.667em;}
.map_text_color{fill:#124066;}
.map_line{fill:none;stroke:#e6e6e6;}
.map_circle{fill:#bcbcbc;}

.map_bgcolor{position: absolute; right: 30px; bottom: 30px; border-top: 1px #333 solid; border-bottom: 1px #333 solid;}
.map_bgcolor li{padding: 3px 10px 5px; border-bottom: 1px #ddd solid; overflow: hidden;}
.map_bgcolor li:last-child{ border-bottom: 0;}
.map_bgcolor [class^="bgcolor"]{ display: inline-block; width: 40px; height: 16px; margin-right: 10px; vertical-align: middle;}
.map_bgcolor .bgcolor01{ background: #f4f4f4; }
.map_bgcolor .bgcolor02{ background: #e3effa; }
.map_bgcolor .bgcolor03{ background: #cfe4f6; }
.map_bgcolor .bgcolor04{ background: #b9d8f1; }
.map_bgcolor .bgcolor05{ background: #a1caec; }
.map_bgcolor .bgcolor06{ background: #85bae7; }
.map_bgcolor .bgcolor07{ background: #7ab2e2; }
.map_bgcolor .bgcolor08{ background: #69abe2; }

/* 스크롤되는 형태 */
.scroll dt{overflow:hidden;}
.scroll dt button{float:right;}
.scroll dd{height:280px;overflow:auto;}

/* 메인 메뉴바 스크롤 디자인 */
/*IE*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.nutristat_stats {
	margin: 0 -10px -32px 0;
	/* ie scrollbar color properties */
	scrollbar-base-color: #e3e3e3;
	scrollbar-face-color: #b3b3b3;
	scrollbar-3dLight-color: #e3e3e3;
	scrollbar-highlight-color: #e3e3e3;
	scrollbar-track-color: #e3e3e3;
	scrollbar-arrow-color: #b3b3b3;
	scrollbar-shadow-color: #e3e3e3;
	scrollbar-darkShadow-color: #e3e3e3;	
	}
.menu_scrollable:nth-of-type(2) .nutristat_stats {
	margin-top: 0;
	}
.nutristat_stats:after {
	display: block;
	height: 32px;
	content: "";
    }
}
/*Edge*/
@supports (-ms-ime-align:auto)  {
.nutristat_stats {
	margin-top: -16px;
	margin-bottom: -16px;
	margin-right: -10px;
	padding: 16px 0;
	}  
.nutristat_stats:after {
    display: block;
    height: 16px;
    content: "";
	}
}
/*Chrome*/	
.nutristat_stats::-webkit-scrollbar {width: 5px; height: 5px; border: 2px solid #fff; }
.nutristat_stats::-webkit-scrollbar-button:start:decrement, .nutristat_stats::-webkit-scrollbar-button:end:increment {display: block; height: 10px; background: url('./images/bg.png') #efefef}
.nutristat_stats::-webkit-scrollbar-track {background: #efefef; -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.2)}
.nutristat_stats::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(0,0,0,.2); -webkit-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.1)}
/*Firefox*/
.nutristat_stats {scrollbar-width: thin; scrollbar-color: #b3b3b3 #e3e3e3;}