@charset "utf-8";

.artpost { margin-bottom: 4rem; }
.wrapper { width: 96vw; max-width: 950px; margin: 0 auto; }
.artpost section { margin-bottom: 4rem; }
.artpost article {
	margin: 2rem auto 2rem;
}
.artpost p:not(:last-of-type) { margin: 0 auto 1.0rem; }
.artpost h2 {
	background: #42BDD8;
	margin: 0 auto 2rem;
	font-weight: normal;
	padding: 1.5rem 0;
	color: #FFFFFF; font-size: 1.8rem; line-height: 1.4em;
	text-align: center;
}
.artpost h3 {
	color: #323232;
	font-size: 1.6rem;
	font-weight: normal;
	line-height: 1.2;
	text-align: center;
	margin: 0 auto 2.0rem;
}
.artpost .imagebox { margin: 1.5rem auto;}
.aircon { background:url(../images/aircon_img07.jpg) no-repeat 0px 0px; background-size: cover; background-position: 0; }
.headarea02.aircon .headbox02 h1 { color: #323232; }

article.leftimage { display: flex; }
article.leftimage .images { width: 40%; margin-right: 1.5rem; order: 1; }
article.leftimage .mainbody { width: 60%; order: 2; }

article.rightimage { display: flex; }
article.rightimage .images { width: 40%; margin-left: 1.5rem; order: 2; }
article.rightimage .mainbody { width: 60%; order: 1; }

@media (max-width: 768px) {
	.artpost h2 { font-size: 1.2rem; line-height: 1.4em; }
	.artpost h3 { font-size: 1.2rem; margin: 0 auto 1.5rem; font-weight: bold; }

	article.leftimage { display: block; margin: 1rem auto; }
	article.leftimage .images { width: 80%; margin: 0.5rem auto; }
	article.leftimage .mainbody { width: 90%; margin: 0.5rem auto; }

	article.rightimage { display: block; margin: 1rem auto; }
	article.rightimage .images { width: 80%; margin: 0.5rem auto; }
	article.rightimage .mainbody { width: 90%; margin: 0.5rem auto; }

}
.artpost .images img { max-width: 100%; }

.artpost a.btn01 { margin: 2rem auto; }
@media(min-width:640px){
	#menu li { margin: 10px 0px 0px 23px; letter-spacing: -0.05rem; }
}

/* ******************************************* */
/*		  リスト汎用・テーブル汎用
/* ******************************************* */
@media(min-width:1000px){
	ul.col_2, ul.col_3, ul.col_4, ul.col_5 { display: flex; align-items: stretch; flex-wrap: wrap; margin: 0px -10px 40px; }
	ul.col_2 li { width: calc( 50% - 20px ); margin: 10px; }
	ul.col_3 li { width: calc( 33% - 20px ); margin: 10px; }
	ul.col_4 li { width: calc( 25% - 20px ); margin: 10px; }
	ul.col_5 li { width: calc( 20% - 20px ); margin: 10px; }
}
@media(max-width:999px){
	ul.col_2, ul.col_3, ul.col_4, ul.col_5 { display: flex; align-items: stretch; flex-wrap: wrap; margin: 0px -10px 30px; }
	ul.col_2 li { width: calc( 50% - 20px ); margin: 10px; }
	ul.col_3 li { width: calc( 33% - 20px ); margin: 10px; }
	ul.col_4 li { width: calc( 33% - 20px ); margin: 10px; }
	ul.col_5 li { width: calc( 33% - 20px ); margin: 10px; }
}
@media(max-width:768px){
	ul.col_2, ul.col_3, ul.col_4, ul.col_5 { margin: 20px -5px 20px; }
	ul.col_2 li { width: calc( 100% - 10px ); margin: 5px; }
	ul.col_3 li { width: calc( 100% - 10px ); margin: 5px; }
	ul.col_4 li { width: calc( 50% - 10px ); margin: 5px; }
	ul.col_5 li { width: calc( 50% - 10px ); margin: 5px; }
}
