/* CSS Document */


/* ■　ヘッドライン　■ */
.headLine > h2 {
	width:100%;
	font-size:18px;
	border:0px;
	margin-top:10px;
	text-align:center;
	background:#3f7937;
	color:#fff;
}
.headLine > h2:before {
	display:none;
}
.headLine > a {
	padding:0;
	border:none;
}
.containerInner {
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
	justify-content:flex-start;
	width:100%;
	margin-top:20px;
	margin-bottom:20px;
}
.articleBox {
	border:1px solid #c0def9;
	display:block;
	width:100%;
	margin:10px;
}
dl.headLineBox > dd {
	width:100%;
	border:none;
}
dl.headLineinBOX {
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
	justify-content: flex-end;
}
dl.headLineinBOX > dd.articleTitle {
	width:calc( 100% - 20px );
	height:110px;
	font-family: 'Noto Serif JP', serif;
	font-size:18px;
	line-height:1.7;
	font-weight:bold;
	margin-left:10px;
	margin-right:10px;
	padding-top:20px;
	padding-bottom:0px;
}
dl.headLineinBOX > dd.articleComment {
	width:100%;
	height:150px;
	font-size:16px;
	margin-top:0px;
	margin-bottom:10px;
	font-family: 'Noto Serif JP', serif;
    line-height: 1.7;
}
.postTime {
		font-family: 'Noto Serif JP', serif;
    line-height: 1.7;
}
.mainPage {
	width:100%;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
}
#leftContents {
	width:80%;
}
/* Example3 */

.bxslider3 {
	margin-top: 10px;
	margin-left:-1px;
	overflow: hidden;
	height:180px;
}
.bxslider3 .bxslider {
	max-width: 430px;
	width: 100%;
	margin: 0 auto;
	margin-left: -20;
}
.bxslider3 ul li img {
	width: 100%;
	height: auto;
}
.bxslider3 ul li {
	opacity: 0.5;
}
.bxslider3 ul li.active {
	opacity: 1;
}
.bxslider3 .bx-viewport {
	overflow: visible !important;
	height:180px;
}
.bx-controls {
	display:none;
}
.scroll {
	width:80%;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
}
.articleBoxWide {
	width:calc( 100% / 3 );

}
dl.articleBoxWide > dd.postTime, .siteName, dd.siteUrl, dd.type {
	width:100%;
	padding:5px;
}
div.articleBoxWide > a > div.headImages {
	width:100%;
	height: 200px;
}
div.articleBoxWide > a > div.headImages > img {
	width:100%;
	height:100%;
	margin:auto;
	display:block;
	object-fit: cover;
}
div.articleBoxWide:hover {
	background-color:#ddd;
	transition:transform 0.3s ease;
}
div.pageNation {
	width:100%;
	display:flex;
	flex-direction: row;
}
div.pageNation > div {
	width:30px;
	height:30px;
	font-weight: bold;
	text-align:center;
	margin:10px;
	padding:0px;
}
div.pageNation > div > a {
	width:30px;
	height:30px;
	padding:0px;
	display:inline-block;
}
div.pageNation > div > a:hover {
	background-color:rgb(104, 141, 241);
	color:#e2e2e2;
}
.nowPage {
	background-color:rgb(0, 67, 250);
	color:#e2e2e2;
	width:30px;
	height:30px;
	padding:0px;
	display:inline-block;
}

/* ■■■■■■■■■■■■■■■      Moile CSS @media screen and (max-width: 800px)   ■■■■■■■■■■■■■■■*/
@media screen and (max-width: 800px) {
	
.scroll {
	width:100%;
	display:flex;
	flex-direction:column;
	flex-wrap:wrap;
}
.articleBoxWide {
	width:calc( 100% );

}
dl.headLineBox > a > dd.articleTitle {
	font-size:14px;
	line-height:150%;
	font-weight:bold;
	padding-top:10px;
	padding-bottom:10px;
}
dl.headLineBox > dl.headLineinBOX > dd.articleComment {
    line-height: 1.7;
	font-size:18px;
}
div.articleBoxWide > a > div.headImages {
	width:100%;
	height: 200px;
}
}