@charset "utf-8";

	
	#page_title:after{
		content:url("grp/page_title_img.png") !important;
	}

	#top_com{
		text-align: left;
	}

	.sub_titles{
		font-size: 1.2em;
		text-align:left;
		margin:50px 0 20px 0;
		padding:0 0 0 20px;
		color:rgb(var(--mainColor));
		position:relative;
		font-weight: 500;
		&::before{
			content:"";
			width:5px;
			height:10px;
			position:absolute;
			left:0;
			top:50%;
			margin-top:-5px;
			background:rgb(var(--mainColor));
		}
	}
	
	#mizumawari{/*水回りのスマイルエコ*/
		article{
			border-top:1px dotted silver;
			padding:30px 20px;
			h3{
				text-align: left;
				font-size: 1.2em;
				color:#148ed8;
				svg{
					fill:#148ed8;
					height:1em;
					width:1em;
					vertical-align: -2px;
				}
			}
			p{
				margin:10px auto 0 auto;
				text-align: left;
			}
			ol{
				display:grid;
				grid-template-columns: repeat(2,1fr);
				gap:20px;
				margin:20px auto 0 auto;
				li{
					p{
						font-size: .9rem;
						margin:.5em auto 0 auto;
					}
				}
			}
			&:last-child{
				padding-bottom:30px;
				border-bottom:1px dotted silver;
			}
			@media (max-width: 480px) {
				ol{
					display:block;
					li{
						margin-top:20px;
					}
				}
			}
		}
	}

	#madomawari{/*窓まわりのスマイルエコ*/
		> * + *{
			margin-top:20px;
		}
		article{
			border:1px solid #eee;
			padding:30px;
			background:url(grp/mado_bg.png) bottom 10px right 10px no-repeat;
			display:grid;
			grid-template-columns: 300px 1fr;
			gap:20px;
			border-radius: 15px;
			figure{
				figcaption{
					display:block;
					margin:.5em auto 0 auto;
					font-size: .9rem;
					text-align: left;
				}
			}
			div{
				min-width:0;
				text-align: left;
				p{
					margin:10px auto 0 auto;
				}
			}
		}
		@media (max-width: 768px) {
			article{
				display:block;
				figure{
					figcaption{
						width:min(300px,100%);
					}
				}
			}
		}
	}
		
				
	#kabe_genkan{/*壁・玄関まわりのスマイルエコ*/
		> * + *{
			margin-top:20px;
		}
		article{
			border:1px solid #eee;
			padding:30px;
			border-radius: 15px;
			> h3{
				margin-top:0;
				text-align: left;
			}
			> p{
				text-align: left;
			}
			ol{
				margin:20px auto 0 auto;
				display:grid;
				grid-template-columns: repeat(2,1fr);
				gap:20px;
				li{
					> * + *{
						margin-top:10px;
					}
					p{
						text-align: left;
					}
					aside{
						text-align: left;
						font-size: .9rem;
					}
				}
			}
		}
		@media (max-width: 768px) {
			article{
				ol{
					display:block;
					li{
						margin-top:20px;
						aside{
							width:min(300px,100%);
							margin:.5em auto 0 auto;
						}
					}
				}
			}
		}
	}
		
	#ekusute{/*エクステリアのスマイルエコ*/
		> * + *{
			margin-top:20px;
		}
		article{
			display:grid;
			grid-template-columns: 300px 1fr;
			gap:20px;
			border:1px solid #eee;
			padding:30px;
			border-radius: 15px;
			figure{
				figcaption{
					font-size: .9rem;
					margin:.5em auto 0 auto;
					text-align: left;
				}
			}
			> div{
				text-align: left;
				> h3.ar_title{
					margin-top:0;
				}
				p{
					margin:.5em auto 0 auto;
				}
			}
		}
		@media (max-width: 768px) {
			article{
				display:block;
					figure{
						margin-top:20px;
						figcaption{
							width:min(300px,100%);
							margin:.5em auto 0 auto;
						}
					}
			}
		}
	}