@charset "utf-8";

.graph_bar {
	display: inline-block;
}

.graph_bar_view {
	width: 600px;
	padding-bottom: 30px;
	/* height: 430px; */
	height: 500px;
	/*padding-right: 30px;*/
	margin-right: 20px;
	box-sizing: border-box;
}

.graph_bar_minus {
    height: 440px;
    padding-bottom: 0;
}

@media (max-width: 640px) {
	.graph_bar {
		display: inherit;
	}

	.graph_bar_view {
		width: 100%;
		margin-right: 0;
		padding-top: 0;
		padding-bottom: 0;
		height: 260px;
		text-align: center;
	}
}

.graph_bar_view .unit {
	font-size: 10px;
}

.graph_bar_view .bar0 {
	fill: #002E77;
}

.graph_bar_view .bar1 {
	fill: #74BDE7;
}

.graph_bar_view .bar2 {
	fill: #4d91aa;
}

.graph_bar_view .bar3 {
	fill: #c8c8c8;
}

.bar_group:hover,
.bar_group.active {
	stroke: #000;
	stroke-width: 4;
}
.bar_group.active text{
	stroke: none;
}

.axis_caption_bar li {
	margin-bottom: 10px;
}

.axis_caption_bar li:before {
	display: inline-block;
	content: "";
	background: #CCC;
	width: 40px;
	position: relative;
	top: 4px;
	margin-right: 5px;
	height: 20px;
}

.axis_caption_bar li.bar0:before {
	background: #002E77;
}

.axis_caption_bar li.bar1:before {
	background: #74BDE7;
}