@charset "utf-8";
/**トップメイン**/
#KV{
	max-width: 1200px;
	width:100%;
	margin: 0 auto;
	line-height: 1px;
}
.section header{text-align: center;}
.section header h2{margin-bottom: 2em;}
.section header p{font-size: .875em;}
.section header h2 img{
	display: block;
	margin: 0 auto;
}
/**Web来場予約**/
#SEC01 picture{display: block;margin: 0 auto;}
@media only screen and (min-width: 641px) {
	#SEC01.section{padding-top: 0;}
	#CONTENT{margin-top:-5.75em;}
	#SEC01 .flexPC.flex-bt.inner div{width:calc(50% - .5em);}
}
@media only screen and (max-width: 640px) {
	#SEC01.section{padding-top: 1.25em;}
}
/**お近くのリフォームフェア会場**/
#MAP.section{background-color: #D4ECF2;}
#MAP .area-list{
	width:auto;
	margin: 2em auto 0;
}
#MAP .area-list dl:not(:first-child){margin-top:.5em;}
#MAP .area-list dl dd a,#MAP .area-list dl dt{box-sizing: border-box;}
#MAP .area-list dl dd{
	display:flex;
	flex-wrap: wrap;
	align-items: center;
}
#MAP .area-list dl dd a{
	padding: .25em .5em;
	color:#000;
	text-decoration: none;
	font-weight:bolder;
}
@media only screen and (min-width: 641px) {
	#MAP header h2 img{
		max-width: 503px;
	}
	#MAP .area-list{
		width:37em;
	}
	#MAP .area-list dl dt{padding: .25em 0;width: 9.5em;}
	#MAP .area-list dl dd{width: calc(100% - 9.5em);}
	#MAP .area-list dl dd a:hover{text-decoration: underline;}
	#MAP .area-list dl dd a:not(:first-child):before{
		content: '|';
		display: inline-block;
		margin-right: .5em;
		height: 1em;
	}
}
@media only screen and (max-width: 640px) {
	#MAP .area-list dl dt{font-size: 1.175em;}#MAP .area-list dl:not(:first-child) dt{margin-top: .75em;}
	#MAP .area-list dl dd a{width:calc(25% + 1px);text-align: center;border:1px solid #ccc;margin-left: -1px;padding: .5em;background-color:#fff;}
	#MAP .area-list dl dd a:nth-child(n + 5){margin-top: -1px;}
}
/**バナーリンク**/
#BNRs{
	background-color: #ededed;
}
@media only screen and (min-width: 641px) {
	#BNRs .flexPC a{
		width: calc(50% - 1.25em);
	}
	#BNRs .flexPC a:nth-child(n + 3){
		margin-top:2.5em;
	}
}
@media only screen and (max-width: 640px) {
	#BNRs .flexPC a:not(:first-child){
		display: block;
		margin-top:1.25em;
	}
}
/**CM**/
#CM{text-align: center;}
#CM .flexPC{margin-top: 2.8125em;}
#CM .m-ttl strong{font-size:1.25em;font-weight: 600; }
@media only screen and (min-width: 641px) {
	#CM .flexPC a img{
		max-width: 780px;
		width:100%;
	}
	#CM header h2 img{
		max-width: 400px;
	}
}
