
.index_main {
	margin: 20px auto 0 auto;
	width: 800px;
	display: flex;
}
.index_main img {
	width: 100%;
}
header {
	flex: 1 1 50%;
	position: relative;
}
div#news {
	flex: 1 1 50%;
}
#contents {
	position: absolute;
	width: 100%;
	bottom: 50px;
	color: white;
	font-size: 150%;
	text-align: center;
}
#contents a {
	color: yellow;
	font-size: 180%;
}

div#news img {
	margin: auto;
	overflow: hidden;
	position: relative;

	/* 図形のCSS */
	width: 100%;
	height: auto;
	border-radius: 50%/55% 55% 45% 45%;
	border: 5px solid #FF3333;
}

@media (max-width: 500px) {	
	.index_main {
		margin: 5px 70px 0 70px;
		width: auto;
		display: block;
	}
	h1  {
		position: static;
	}
	#contents {
		margin-top: 0px;
		position: static;
		font-size: 80%;
	}

	#news {
		position: static;
		margin: 20px auto 0 auto;
		width: 80%
	}
}


/*--- 201910add ---*/
/* 読み込む画像の高さにより表示崩れが発生していたので対応 ブレイクポイントは896pxで設定*/
h1 {
	position: static;
}
#contents {
	position: static;
	margin-top: -90px;
}
.over_text {
	margin-top: 30px;
}
.under_text {
	margin-top: 20px;
}
a {
	display: inline;
}
#contents a.leave {
	color: #ccc;
}

@media (min-width: 897px) {
	.index_main {
		display: table;
		table-layout: fixed;
		min-height: 543px;
	}
	.index_main > * {
		display: table-cell;
	}
	#news {
		vertical-align: middle;
	}
}

































