@charset "UTF-8";
#contentHeader {
	background : url("/wp/wp-content/themes/pgg_bogo/merit/img/bg_main.jpg") 50% 50% no-repeat;
	background-size : cover;
}

/* ======================================
   about
====================================== */

#about {
	width : 100%;
	max-width : 1220px;
	margin : 0 auto 100px;
	padding : 0 32px;
}

#about .hl03_l {
	color : #00297b;
}
#about .aboutBox {
	display : flex;
	justify-content : space-around;
	align-items : center;
	margin-bottom : 90px;
}
#about .aboutBox > div {
	padding : 0 40px;
}

#about .aboutBox.reverse {
	flex-direction : row-reverse;
}


@media screen and (max-width: 767px) {
	#about {
		width : 100%;
		padding : 50px 0 0;
	}
	#about .aboutBox {
		display : block;
		margin : 0;
		padding : 0 0 60px;
	}
	#about .aboutBox img {
		width : 100%;
	}
	#about .aboutBox.reverse {
		flex-direction : column;
		padding-bottom : 80px;
	}
	#about .aboutBox.reverse > div:nth-of-type(2) {
		width : 100%;
		margin : 40px 0 0 0;
	}
	#about .aboutBox > div:first-of-type {
		width : 100%;
	}
	#about .aboutBox > div:nth-of-type(2) {
		width : 100%;
		margin : 40px 0 0 0;
	}
	#about .aboutImage-01 {
		margin-bottom : 80px;
	}
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	#about .aboutBox {
		flex-direction : column;
		margin : 0;
		padding : 0 20px 60px;
	}
	#about .aboutBox.reverse {
		flex-direction : column;
		padding-bottom : 100px;
	}
	#about .aboutBox.reverse > div:nth-of-type(2) {
		width : 100%;
		margin : 40px 0 0 0;
	}
	#about .aboutBox > div:first-of-type {
		width : 100%;
	}
	#about .aboutBox > div:nth-of-type(2) {
		width : 100%;
		margin : 40px 0 0 0;
	}
}