@charset "UTF-8";
/* CSS Document */


#box-container {
	/*background-color: #C96;*/
	/** flexbox **/
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	box-line: multiple;
	flex-wrap: wrap;
	justify-content: center;
	/*横 中央揃え*/
	align-items: center;
	/*縦 中央揃え*/
	padding: 50px 0;
}

/** sipebox PhotoIcon **/
#box-container li {
	/*float: left;*/
	width: 23%;
	margin-right: 1%;
	margin-top: 1%;
	display: inline-block;
	/*border: thin dashed #09F;*/
}

/** リフォームQ&A **/
#box-container li:nth-child(7) {
	width: 43%;
	/*display:inline-block;*/
	padding: 2%;
	flex-direction: column;
}

/** Keiten **/
#box-container li:nth-child(7) aside.KeitenQandA {
	display: inline-block;
	vertical-align: center;
}

.KeitenQandA div {
	/*float: left;*/
	width: 100%;
	margin: 0 auto;

	/*border: thin dashed #F00;*/
}





/*===============================================
●tablet.css 画面の横幅が768pxまで
===============================================*/
@media screen and (max-width: 768px) {

	main {
		width: 90%;
		margin-right: auto;
		margin-left: auto;
		padding-bottom: 5%;
	}

	/* sipebox PhotoIcon */
	ul#box-container {
		width: 100%;
		padding-bottom: 5%;
	}

	#box-container .box {
		/*float: left;*/
		display: inline-block;
		width: 31%;
		margin-right: 1%;
		margin-top: 1%;
	}

	/** リフォームQ&A **/
	#box-container li:nth-child(7) {
		width: 100%;
		margin-top: 5%;
		/*background-color: #CCC;
		border: thin dashed #0C6;*/
	}

	/**************/
	/**  Keiten  **/
	/**************/
	.KeitenQandA {}

	.KeitenQandA dl {
		width: 100%;
	}

	.KeitenQandA dl dt {
		font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
		font-size: 1em;
		font-weight: bold;
		color: #633;
		margin-bottom: 2%;
	}

	.KeitenQandA dl dd {
		font-family: "ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
		color: #633;
	}

}