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

/* 省エネ診断設定 */

#contents #title h1 {
	background-image: url(../img/energy/diagnosis/title_ph.jpg);
}
#contents #title h1::before {
	content: "\f4d8";
}

@media print,screen and (min-width: 768px){

/* PC用設定 */

#contents #title h1 {
	background-position: right -80px;
}

#contents #diagnosis {
	padding:60px 0px;
}
#contents #diagnosis .logo {
	float:right;
	width:170px;
	margin-left:3em;
	margin-bottom:0.5em;
	padding: 10px 15px;
	border: 1px solid #CCC;
}
#contents #diagnosis .flow {
	width:80%;
	margin:0px auto;
}
#contents #diagnosis .flow ul {
	padding-top:1em;
}
#contents #diagnosis .flow li {
	float:left;
	width:30%;
	font-size: 24px;
	font-weight: bold;
	line-height: 1em;
	margin-bottom: 1.5em;
}
#contents #diagnosis .flow li:nth-child(3n-1) {
	margin-left:5%;
	margin-right:5%;
}
#contents #diagnosis .flow li:nth-child(3n+1) {
	clear:both;
}
#contents #diagnosis .flow li img {
	width:100%;
	margin-bottom:0.8em;
}
#contents #diagnosis .flow p {
	text-align: center;
}
}
@media screen and (max-width: 767px){

/* スマホ用設定 */

#contents #diagnosis {
	padding:20px 0px;
}
#contents #diagnosis .logo {
	float:right;
	width:100px;
	margin-left:1.5em;
	margin-bottom:0.5em;
	padding: 5px 10px;
	border: 1px solid #CCC;
}
#contents #diagnosis .flow {
	width:auto;
	margin:0px;
}
#contents #diagnosis .flow ul {
	padding-top:0px;
}
#contents #diagnosis .flow li {
	float:left;
	width:31%;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.4em;
	margin-bottom: 1em;
}
#contents #diagnosis .flow li:nth-child(3n-1) {
	margin-left:3.5%;
	margin-right:3.5%;
}
#contents #diagnosis .flow li:nth-child(3n+1) {
	clear:both;
}
#contents #diagnosis .flow li img {
	width:100%;
	margin-bottom:0.7em;
}
#contents #diagnosis .flow p {
	text-align: left;
}
}