﻿#main_wrap {
	width: 100%;

	background: #f7f7f7;
}

#bottom {
	padding-bottom: 100px;
	overflow: hidden;
}

#wrap {
	background: #f7f7f7;
	height: auto;
	overflow: hidden;
	//width:1208px;
	//margin:0 auto;
	padding-top: 15px;
	margin-top: 30px;
}

.wrap_in {
	width: 1208px;
	margin: 0 auto;
}

#contents {
	height: auto;
	overflow: hidden;
}

#topimg {
	background: #fff;
	background-image: url(../images/sora.png);
	height: 400px;
	position: relative;
}

#img_wrap {
	width: 220px;
	margin: 0 auto;
}

#topimg img {
	width: 220px;
	margin: 0 auto;
	display: block;
	display: none;
	position: absolute;
}

.sec {
	background: #fff;
	width: 280px;
	height: 430px;
	margin: 10px;
	box-shadow: 0 0 10px #e1e1e1;
	border: 1px solid #e1e1e1;
	float: left;
	position: relative;
}

.sec h2 {
	width: 280px;
	height: 186px;
	display: block;
	overflow: hidden;
	//background:#3485ff;
}

.sec h2 img {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.sec h2 img:hover {
	opacity: 0.7;
}

#main_wrap .sec h3 {
	margin: 13px 0 0 10px;
}

#main_wrap .sec h3 a {
	text-decoration: underline;
	font-size: 16px;
	color: #069;
}

#main_wrap .sec h3 a:hover {
	color: #ff4c4c;
}

#main_wrap .sec p {
	font-size: 12px;
	color: #565656;
	display: block;
	padding: 10px;
	padding-bottom: 20px;
}

.more1 {
	background: #3485ff;
	width: 123px;
	//height:48px;
	text-align: center;
	padding: 15px 0;
	display: block;
	position: absolute;
	bottom: 10px;
	right: 10px;
	color: #fff;
}


/*ここから施工事例*/
#seko_wrap {
	clear: both;
	padding: 2rem 0;
	background: #fff;
	overflow: hidden;
	background: #eee;
}

#seko_wrap p#seko_title {
	text-align: center;
	margin-bottom: 30px;
	margin-top: 30px;
}

#seko_wrap2 {
	width:100%;
	max-width: 1500px;
	margin: 0 auto;
	background: #eee;
	/* overflow: hidden; */
	display:grid;
	grid-template-columns: 1fr 280px 450px;
	gap:1rem;
}

#seko_nav {
	/* float: left; */
	/* margin-top:10px; */
}

#seko_nav_wrap {
	background: #fff;
	width:100%;
	max-width: 280px;
	font-size: 13pt;
	color: #565656;
}

#sekolist_title {
	padding: 5px 0 0 10px;
	border-bottom: 1px solid #e1e1e1;
	font-weight: bold;
	color: #565656;
	//font-size:13.5pt;
}

.sekolist1 {
	color: #00c72f;
	//font-weight:bold;
	border-bottom: 1px dotted #e1e1e1;
	padding: 13px 0 9px 20px;
	cursor: pointer;
	transition-property: all;
	transition: 0.2s linear;
}

.sekolist1:hover {
	background: #8dffa7;
	//color:#fff;
}

.sekolist2 {
	color: #c7c000;
	border-bottom: 1px dotted #e1e1e1;
	padding: 13px 0 9px 20px;
	cursor: pointer;
	transition-property: all;
	transition: 0.2s linear;
}

.sekolist2:hover {
	background: #fffe8d;
}

.sekolist3 {
	color: #a400c7;
	border-bottom: 1px dotted #e1e1e1;
	padding: 13px 0 9px 20px;
	cursor: pointer;
	transition-property: all;
	transition: 0.2s linear;
}

.sekolist3:hover {
	background: #ea8cfe;
}

.ul_none {
	//display:none;
	font-size: 12pt;
}

.ul_none li a {
	transition-property: all;
	transition: 0.2s linear;
}

#sekonav_yane li a:hover {
	background: #c2ffd0;
}

#sekonav_gaiheki li a:hover {
	background: #faffc2;
}

#sekonav_toso li a:hover {
	background: #f1c2ff;
}

.ul_none li {
	border-bottom: 1px dotted #e1e1e1;
	//padding:12px 0 9px 30px;
}

.ul_none li a {
	padding: 12px 0 9px 30px;
	display: block;
}

.ar1 {
	color: #00c72f;
	font-size: 75%;
}

.ar2 {
	color: #c7c000;
	font-size: 75%;
}

.ar3 {
	color: #a400c7;
	font-size: 75%;
}

#seko_area {
	float: left;
	position: relative;
	width: 881px;
	height: 1000px;
	margin-left: 10px;
}

.seko {
	width: 1000px;
	//height:882px;
	//background:#fff;
	position: absolute;
}

/*ここから屋根*/
#yane_seko {
	//display:none;
}

.yane_sec {
	width: 280px;
	height: 430px;
	background: #fff;
	box-shadow: 0 0 10px #e1e1e1;
	border: 1px solid #e1e1e1;
	float: left;
	margin: 10px;
	position: relative;
	//display:none;
}

#yane_seko .yane_sec h3 a {
	color: #00c72f;
	font-size: 12pt;
	margin: 10px;
	margin-bottom: 2px;
	display: block;
	text-decoration: none;
}

#yane_seko .yane_sec h4 {
	color: #00c72f;
	font-size: 12pt;
	margin-left: 10px;
	margin-bottom: 15px;
	//margin-top:10px;
}

.yanemore {
	text-align: center;
	width: 123px;
}

#yane_seko .yane_sec p {
	margin-left: 10px;
	margin-right: 10px;
}

#yane_seko .yane_sec .time {
	margin-bottom: 5px;
}

#yane_seko .yane_sec .kome {
	margin-bottom: 20px;
}

.yanemore {
	background: #00c72f;
	position: absolute;
	bottom: 10px;
	right: 0px;
}

.yanemore a {
	color: #fff;
	padding: 15px 0;
	display: block;
}

.yane_sec h2 {
	display: block;
	overflow: hidden;
	background: #00c72f;
}

.yane_sec h2 img {
	-moz-transition: -moz-transform 0.1s linear;
	-webkit-transition: -webkit-transform 0.1s linear;
	-o-transition: -o-transform 0.1s linear;
	-ms-transition: -ms-transform 0.1s linear;
	transition: transform 0.1s linear;
	//-webkit-transition: all 0.3s ease;
	//-moz-transition: all 0.3s ease;
	//-o-transition: all 0.3s ease;
	//transition: all  0.3s ease;
}

.yane_sec h2 img:hover {
	//opacity:0.7;
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

/*ここまで屋根*/

/*ここから外壁*/
.gaiheki_sec {
	width: 280px;
	height: 430px;
	background: #fff;
	box-shadow: 0 0 10px #e1e1e1;
	border: 1px solid #e1e1e1;
	float: left;
	margin: 10px;
	position: relative;
	display: none;
}

#gaiheki_seko .gaiheki_sec h3 a {
	color: #c7c000;
	font-size: 12pt;
	margin: 10px;
	margin-bottom: 2px;
	display: block;
	text-decoration: none;
}

#gaiheki_seko .gaiheki_sec h4 {
	color: #c7c000;
	font-size: 12pt;
	margin-left: 10px;
	margin-bottom: 15px;
	//margin-top:10px;
}

.gaihekimore {
	text-align: center;
	width: 123px;
}

#gaiheki_seko .gaiheki_sec p {
	margin-left: 10px;
	margin-right: 10px;
}

#gaiheki_seko .gaiheki_sec .time {
	margin-bottom: 5px;
}

#gaiheki_seko .gaiheki_sec .kome {
	margin-bottom: 20px;
}

.gaihekimore {
	background: #c7c000;
	position: absolute;
	bottom: 10px;
	right: 0px;
}

.gaihekimore a {
	color: #fff;
	padding: 15px 0;
	display: block;
}

.gaiheki_sec h2 {
	display: block;
	overflow: hidden;
}

.gaiheki_sec h2 img {
	-moz-transition: -moz-transform 0.1s linear;
	-webkit-transition: -webkit-transform 0.1s linear;
	-o-transition: -o-transform 0.1s linear;
	-ms-transition: -ms-transform 0.1s linear;
	transition: transform 0.1s linear;
}

.gaiheki_sec h2 img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

/*ここまで外壁*/

/*ここから塗装*/
.toso_sec {
	width: 280px;
	height: 430px;
	background: #fff;
	box-shadow: 0 0 10px #e1e1e1;
	border: 1px solid #e1e1e1;
	float: left;
	margin: 10px;
	position: relative;
	display: none;
}

#toso_seko .toso_sec h3 a {
	color: #a400c7;
	font-size: 12pt;
	margin: 10px;
	margin-bottom: 2px;
	display: block;
	text-decoration: none;
}

#toso_seko .toso_sec h4 {
	color: #a400c7;
	font-size: 12pt;
	margin-left: 10px;
	margin-bottom: 15px;
	//margin-top:10px;
}

.tosomore {
	text-align: center;
	width: 123px;
}

#toso_seko .toso_sec p {
	margin-left: 10px;
	margin-right: 10px;
}

#toso_seko .toso_sec .time {
	margin-bottom: 5px;
}

#toso_seko .toso_sec .kome {
	margin-bottom: 20px;
}

.tosomore {
	background: #a400c7;
	position: absolute;
	bottom: 10px;
	right: 0px;
}

.tosomore a {
	color: #fff;
	padding: 15px 0;
	display: block;
}

.toso_sec h2 {
	display: block;
	overflow: hidden;
}

.toso_sec h2 img {
	-moz-transition: -moz-transform 0.1s linear;
	-webkit-transition: -webkit-transform 0.1s linear;
	-o-transition: -o-transform 0.1s linear;
	-ms-transition: -ms-transform 0.1s linear;
	transition: transform 0.1s linear;
}

.toso_sec h2 img:hover {
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

/*ここまで塗装*/
/*ここまで施工事例*/

/*ここから声とバナー*/
#yanekabekoubou {
	text-align: center;
	margin-bottom: 35px;
}

#koe_banner_wrap {
	width: 1185px;
	height: 800px;
	margin: 0 auto;
	margin-bottom: 100px;
	overflow: hidden;
}

#koe_wrap {
	background: #fff;
	width: 705px;
	height: 680px;
	float: left;
	overflow: hidden;
	//box-shadow:0 0 10px #e1e1e1;
}

#koe_wrap_center div#koe_area_title {
	padding-top: 20px;
	width: 159px;
	margin: 0 auto;
}

#koe_wrap_center p#koe_wrap_top_mes {
	text-align: center;
}

.interveiw {
	float: left;
	margin: 35px;
	width: 280px;
}

.interveiw p a {
	font-size: 10pt;
	font-weight: bold;
	color: #3485ff;
	text-align: center;
	display: block;
	margin-top: 5px;
}

.interveiw p {
	//color:#565656;
	//text-align:center;
}

#banner_wrap {
	/* //background:#afa; */
	width:100%;
	max-width: 449px;
	/* height: 555px; */
	/* float: right; */
}

#contact_area {
	width: 449px;
	height: 150px;
	background-image: url(../images/tel.webp);
	background-repeat: no-repeat;
	position: relative;
	margin-bottom: 25px;
}

#contact_area div a {
	text-indent: -9999px;
}

.contact_area_wrap {
	position: absolute;
	bottom: 10px;
	right: 10px;
}

#contact_area a {
	display: block;
	padding: 3px 0;
}

.cont {
	//background:#acc;
	width: 170px;
	margin-bottom: 7px;
}

.siry {
	//background:#fae;
	width: 170px;
	margin-bottom: 7px;
}

.mitu {
	//background:#eef;
	width: 170px;
	margin-bottom: 2px;
}

#bottom_banner_area a {
	display: block;
	float: left;
	margin-bottom: 20px;
}

#bottom_banner_area a:nth-child(odd) {
	margin-right: 11px;
}

/*ここまで声とバナー*/
footer {
	clear: both;
}