@charset "UTF-8";
/* ------------------------------------------------------------
	00. RESET SETTING CSS
   ------------------------------------------------------------ */

.articleInner{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.articleInner > div{
	width: 48%;
	margin-top: 50px;
}
.articleInner > div:nth-child(-n+2){
	margin-top: 0;
}
.chartLabel{
	color: #006AB4;
    font-size: 22px;
    font-weight: bold;
	height: 76px;
}
.chartUnit{
	text-align: right;
	font-size: 14px;
}
.chartRenderColumn{
	width: 100%;
	height: 400px;
	margin-top: 10px;
}
.chartTable table{
	width: 100%;
	table-layout: fixed;
}
.chartTable th,
.chartTable td{
	border: 1px solid #e6e6e6;
	border-collapse: collapse;
	width: 25%;
	padding: 6px;
}
.chartTable th{
	text-align: center;
	background-color: #f0f5f9;
}
.chartTable td{
	text-align: right;
}

@media screen and (max-width:640px) {

	.articleInner{
		display: block;
	}
	.articleInner > div{
		width: 100%;
		margin-top: 20px;
	}
	.articleInner > div:nth-child(2){
		margin-top: 20px;
	}	
	.chartLabel{
		height: auto;
	}
	
	.chartRenderColumn {
		height: 200px;
	}
	
}


/* ------------------------------------------------------------
	以下カラバリ用 / .color_green（緑）
   ------------------------------------------------------------ */
/* 文字色 */
.color_green .chartLabel{
    color: #1BBF20;
}

/* 背景色 */
.color_green .chartTable th {
    background-color: #edfaed;
}
/* ------------------------------------------------------------
	以下カラバリ用 / .color_red（赤）
   ------------------------------------------------------------ */
/* 文字色 */
.color_red .chartLabel{
    color: #D3023C;
}

/* 背景色 */
.color_red .chartTable th {
    background-color: #fff0f4;
}


/* ------------------------------------------------------------
	以下カラバリ用 / .color_white（白）
   ------------------------------------------------------------ */
.color_white .chartLabel{
    color: #434343;
}

/* 背景色 */
.color_white .chartTable th {
    background-color: #f5f5f5;
}