@charset "utf-8";
.contents_wrap{
	max-width: 1200px;
    margin: 0 auto;
}
.combined_with_store{
	width:100%;
}
.main_vis{
	width:100%;
	text-align: center;
}
.main_title{
	width:80%;
	margin:5% auto;
	text-align: center;
}
.main_title h3{
	font-size: 255%!important;
	margin: 60px auto;
}
.main_title p{
	display: inline-block;
	font-size: 150%;
	padding: 2% 0%;
	text-align: left;
}

/* 店舗併用住宅のメリット */
.merit{
	width: 70%;
	margin: 0 auto;
}
.merit h3{
	font-size: 230%!important;
    padding-top: 100px!important;
    padding-bottom: 50px!important;
	text-align: center;
}
.merit ul{
	width: 100%;
	display: flex;
	justify-content: space-between;
}
.merit ul li{
	width: 26%;
	padding: 3%;
	border-bottom:1px solid rgb(238, 238, 238);
	box-shadow:rgba(238, 238, 238, 0.509804) 9px 9px 10px -4px;
	-webkit-box-shadow:rgba(175, 175, 174, 1) 9px 9px 10px 2px;
}
.merit ul li h4{
	text-align: center;
	font-size: 205%;
	font-family: emoji;
	font-weight: 400;
	color: #dc9d89;
	margin-bottom: 20px;
}
.merit ul li h4 span{
	font-size: 75%;
	text-align: center;
	border-bottom: solid #fff100 5px;
	width: 60%;
	color: #000
}
.merit ul li p{
	font-size: 100%;
	letter-spacing: 0.02em;
}

/* 施工事例 */
.sp_only img{
	display: none;
}
.pc_only img{
	display: block;
}
.construction_box{
}
.construction_box h3{
	font-size: 230%!important;
    padding-top: 170px!important;
    padding-bottom: 100px!important;
	text-align: center;
}
.construction_box dl.construction{
	width: 80%;
	display: flex;
	justify-content: space-between;
	margin: 0 auto 200px;
}
.construction_box dl.construction dt{
	width: 48%;
}
.construction_box dl.construction dd{
	width: 48%;
}
.construction_box dl.construction dd h4{
	font-size: 187%;
	font-weight: bold;
	padding-bottom: 20px;
}
.construction_box dl.construction dd h4 em{
			font-size: 78%;
		}
.construction_box dl.construction dd span{
	font-family: emoji;
	font-size: 178%;
}
.construction_box dl.construction dd p{
	padding-bottom: 10px;
}
.box {
    position: relative;
	z-index: 10;
}
.img {
	position: absolute;
	z-index: -1;
	right: 0;
	transform: translateY(-50%);
	width: 46%;
}


/* reverse */
.construction_box dl.construction_reverse{
	width: 80%;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	margin: 0 auto 200px;
}
.construction_box dl.construction_reverse dt{
	width: 48%;
}
.construction_box dl.construction_reverse dd{
	width: 48%;
}
.construction_box dl.construction_reverse dd h4{
	font-size: 200%;
	font-weight: bold;
	padding-bottom: 20px;
}
.construction_box dl.construction_reverse dd h4 em{
			font-size: 80%;
		}
.construction_box dl.construction_reverse dd span{
	display: block;
	font-family: emoji;
	font-size: 178%;
}
.box_reverse {
   position: relative;
	z-index: 10;
}
.img_reverse {
	position: absolute;
	z-index: -1;
	right: 0;
	transform: translateY(-50%);
	width:46%;
}

/* 店舗併用住宅施工事例集 */
.information{
	margin: 0 0 80px;
}
.information dl.request_form{
	width: 70%;
	padding: 5%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom:1px solid rgb(238, 238, 238);
	box-shadow:rgba(238, 238, 238, 0.509804) 9px 9px 10px -4px;
	-webkit-box-shadow:rgba(175, 175, 174, 1) 9px 9px 10px 2px;
}

.information dl.request_form dt{
	width: 35%;
}
.information dl.request_form dt img{
	width: 80%;
}
.information dl.request_form dd{
	width: 65%;
}
.information dl.request_form dd h3{
	text-align: left!important;
	font-size: 190%!important;
	padding: 0 0 20px!important;
}
.information dl.request_form dd h3 span{
	font-size: 70%;
}
.information dl.request_form h5.btn{
	color: #fff;
	font-size: 120%;
	font-weight: bold;
	border: 2px solid #820000;
	background-color: #820000;
	text-align: center;
	margin-top: 30px;
	padding: 1% 3%;
}


@media screen and (max-width:959px) {
.main_contents {
	width: 90%;
	margin: 0 auto;
}
.merit{
	width: 100%;
}
.sp_only img{
	display: block;
	width: 100%;
}
.pc_only img{
	display: flex;
}
.construction_box h3{
	padding-top: 100px!important;
	padding-bottom: 50px!important;
}
.construction_box dl.construction{
	display: block;
	width: 100%;
	margin: 0 auto 100px;
}
.construction_box dl.construction dt{
	display: none;
}
.construction_box dl.construction dd{
	width: 100%;
}
.img{
	transform: none;
	width: 20%;
	top: -3%;
}
.text div.sp_only,.text_reverse div.sp_only{
	margin: 0 0 20px;
}
.construction_box dl.construction_reverse{
	display: block;
	width: 100%;
	margin: 0 auto 100px;
}
.construction_box dl.construction_reverse dt{
	display: none;
}
.construction_box dl.construction_reverse dd{
	width: 100%;
}
.img_reverse {
	transform: none;
	width: 20%;
	top: -3%;
}
.information dl.request_form{
	width: 100%;
	box-sizing: border-box;
}
}

@media screen and (max-width:768px) {
.main_title h3{
	font-size: 225%;
	margin: 30px auto;
}
.main_title p{
	font-size: 105%;
}
.merit ul{
	display: block;
}
.merit ul li{
	width: 100%;
	margin-bottom: 20px;
	box-sizing: border-box;
	padding: 5%;
}
.information dl.request_form{
	width: auto;
}
}
	
@media screen and (max-width:599px) {
.construction_box dl.construction{
	margin-bottom: 60px;
}
.construction_box dl.construction_reverse{
	margin-bottom: 60px;
}
.img{
	width: 27%;
}
.img_reverse{
	width: 27%;
}
.information{
	margin: 100px auto 40px
}
.information dl.request_form{
	display: block;
	padding: 10% 5%;
}
.information dl.request_form dt{
	width: 50%;
	margin: 0 auto 30px;
	text-align: center;
}
.information dl.request_form dd{
	width: 90%;
	margin: 0 auto;
}
}

@media screen and (max-width:450px) {
.main_title {
	width: 90%;
}
.construction_box dl.construction dd h4{
	font-size: 173%;
}
.construction_box dl.construction_reverse dd h4{
	font-size: 173%;
}
}

@media screen and ( max-width:380px) {
.main_title h3{
	font-size: 200%!important;
	margin: 30px auto;
}
.merit h3{
	font-size: 200%!important;
	padding: 50px 0;
}
.construction_box h3{
	font-size: 200%!important;
	padding: 100px 0 50px!important;
}
.construction_box dl.construction dd h4{
	font-size: 145%!important;
}
.construction_box dl.construction_reverse dd h4{
	font-size: 145%!important;
}
.information{
	margin-top: 50px;
}
}