@charset "utf-8";
/* CSS Document */
/*==================================================
TOP画像
===================================*/
#underlayer_mv{
	background: url("../img/underlayer_mv.png");
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 8em 2em 8em;
}
#underlayer_mv h2{
    color: #fff;
    text-align: center;
    line-height: 2;
    padding: 0.5em 0;
}
/*==================================================
共通
===================================*/
#sealing .wrap,#water .wrap,
#repair .wrap,#exterior .wrap{
	width: 80%;
}

#sealing .ttl{
	width: 45%;
    border-right: 12px solid #2382cb;
    margin-bottom: 5em;
}
#water .ttl{
	width: 30%;
    border-right: 12px solid #2382cb;
    margin-bottom: 5em;
}
#repair .ttl{
	width: 40%;
    border-right: 12px solid #2382cb;
    margin-bottom: 5em;
}
#exterior .ttl{
	width: 55%;
    border-right: 12px solid #2382cb;
    margin-bottom: 5em;
}
/*==================================================
工事内容
===================================*/
#details{
	margin-top: 5em;
	overflow: hidden;
}

/*==================================================
シーリング工事
===================================*/
#sealing{
	background: url("../img/about_bg.png");
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	margin: 1em 0 0;
    padding: 11em 0 11em;
	overflow: hidden;
}
/*==================================================
防水工事
===================================*/
#water{
	background: url("../img/business_bg.png");
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
    margin: 1em 0 0;
    padding: 11em 0 11em;
	overflow: hidden;
}
/*==================================================
下地補修工事
===================================*/
#repair{
	background: url("../img/about_bg.png");
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
    margin: 1em 0 0;
    padding: 11em 0 11em;
	overflow: hidden;
}
/*==================================================
外壁タイル補修工事
===================================*/
#exterior{
	background: url("../img/business_bg.png");
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
    margin: 1em 0 0;
    padding: 11em 0 11em;
	overflow: hidden;
}


















/*==================================================
 SP
===================================*/

/* 1280px以下に適用されるCSS（スクエアモニター用） */
@media screen and (max-width: 1286px) {
	#sealing .ttl {
		width: 55%;
	}
	#water .ttl {
		width: 40%;
	}
	#repair .ttl {
		width: 50%;
	}
	#exterior .ttl {
		width: 65%;
	}
}

@media screen and (min-width: 1024px) and (max-width: 1260px)  {

}

@media screen and (max-width: 1024px) {
	#underlayer_mv {
		padding: 4em 2em 4em;
	}
	
	#sealing .wrap,#water .wrap,
	#repair .wrap,#exterior .wrap {
		width: 90%;
	}
	
	#sealing .ttl {
		width: 60%;
		margin-bottom: 2em;
	}
	#water .ttl {
		width: 40%;
		margin-bottom: 2em;
	}
	#repair .ttl {
		width: 55%;
		margin-bottom: 2em;
	}
	#exterior .ttl {
		width: 70%;
		margin-bottom: 2em;
	}
	
	#sealing,#water,#repair,#exterior{
		padding: 6em 0 6em;
	}
}
@media screen and (max-width: 912px) {
	#exterior .ttl {
		width: 80%;
	}
}
/* 850px以下に適用されるCSS（タブレット用） */
@media screen and (max-width: 850px) {
	#sealing .ttl {
		width: 75%;
	}
	#water .ttl {
		width: 50%;
	}
	#repair .ttl {
		width: 65%;
	}
	#exterior .ttl {
		width: 90%;
	}
}
@media screen and (max-width: 768px) {

}
@media screen and (max-width: 540px) {
	#underlayer_mv {
		padding: 1em 2em 1em;
	}
}
/* 480px以下に適用されるCSS（スマホ用） */
@media screen and (max-width: 480px) {
	#details {
		margin: 1em 0 5em;
	}
	#sealing,#water,#repair,#exterior{
		padding: 0 0 6em;
	}
	
	#sealing .ttl {
		width: 70%;
	}
	#water .ttl {
		width: 50%;
	}
	#repair .ttl {
		width: 60%;
	}
	#exterior .ttl {
		width: 80%;
	}
}
@media screen and (max-width: 391px) {

}