@charset "UTF-8";

/* ▼ 社長挨拶・経営理念
----------------------------------------*/
#section1 .flex_box div:first-of-type {
	width: 36%;
	margin: 0 2%;
}

#section1 .flex_box div:last-of-type {
	width: 51%;
	margin: 0 3%;
}

#section1 .lead {
	margin-bottom: 30px;
	font-size: 26px;
}

#section1 .detail {
	font-size: 17px;
	margin-bottom: 17px;
}
.name-right{
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	text-align: right;
	padding-top: 10px
}
.name-size{
	font-size: 30px;
	font-family:'ＭＳ Ｐ明朝','MS PMincho','Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
}


/* ▼ これまでの宮本建設
----------------------------------------*/
#section2 .history {
	background-color: rgba(255, 255, 255, 0.7);
	width: 55%;
	margin: 0 1.4%;
	padding: 35px 3%;
	border-radius: 28px;
}

#section2 .history dl {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

#section2 .history dt,
#section2 .history dd {
	padding: 23px 7px;
	justify-content: center;
}

#section2 .history dt {
	width: 30%;
}

#section2 .history dd {
	width: 70%;
}

#section2 .container ul {
	display: flex;
	width: 36%;
	margin: 0 2%;
	flex-direction: column;
	justify-content: space-between;
}

/* ▼ 会社概要
----------------------------------------*/
#section3 dl {
	display: flex;
	border-bottom: 2px solid #9EA186;
	width: 86%;
	margin: 0 auto;
}

#section3 dl dt,
#section3 dl dd {
	padding: 30px 4.3%;
}

#section3 dl dt {
	width: 17%;
}

/* ▼ アクセス
----------------------------------------*/
#section3 .container {
	width: 89%;
}

.map_container {
	width: 70%;
	position: relative;
	padding-top: 40%;
	margin: 0 auto 100px;
}

.google {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
}


#section4 .flex_box .inner {
	background-color: rgba(255, 255, 255, 0.6);
	border-radius: 37px;
	width: 54%;
	padding: 2% 4%;
}

#section4 .flex_box .inner dl {
	display: flex;
}

#section4 .flex_box .inner dl dt {
	display: flex;
	flex: 0.5;
	justify-content: center;
	padding: 0 10%;
}


#section4 .flex_box .inner dl dd {
	flex: 1.8;
	padding: 7% 0%;
}

#section4 .flex_box div:last-of-type {
	width: 41%;
}

/* ▼▼▼ 480px〜768px
======================================================*/
@media screen and (max-width: 768px) {

	h2.page_title {
		width: 100%;
	}

	h2.page_title span {
		width: 100%;
		font-size: 26px;
		padding: 0 50px;
		height: 70px;
		line-height: 70px;
		text-align: center;
	}

	#section1 .flex_box div:first-of-type {
		width: 100%;
		margin: 0 auto;
	}

	#section1 .flex_box div:last-of-type {
		width: 100%;
		margin: 0 auto;
	}

	#section1 .lead {
		margin-top: 30px;
		font-size: 20px;
	}

	#section1 .detail {
		font-size: 16px;
	}

	#section2 .history {
		width: 100%;
		margin: 0 auto;
		padding: 50px 6% 70px;
		margin-bottom: 20px;
		border-radius: 28px;

	}

	#section2 .history dt {
		width: 24%;
	}

	#section2 .history dd {
		width: 76%;
	}

	#section2 .history dt,
	#section2 .history dd {
		padding: 10px 0;
	}

	#section2 .container ul {
		width: 80%;
		margin: 0 auto;
	}

	#section2 .container ul li {
		margin-bottom: 10px;
	}

	#section3 .container {
		width: 100%;
	}

	#section3 dl {
		width: 100%;
		border-bottom: 1px solid #9EA186;
	}

	#section3 dl dt {
		width: 80px;
	}

	#section3 dl dt,
	#section3 dl dd {
		padding: 20px 4.3%;
	}

	.map_container {
		width: 100%;
		padding-top: 60%;
		margin: 0 auto 50px;
	}

	#section4 .flex_box .inner {
		border-radius: 27px;
		width: 100%;
		padding: 8%;
		margin-bottom: 40px;
	}

	#section4 .flex_box .inner dl dd {
		flex: 2;
		margin-left: 20px;
	}

	#section4 .flex_box div:last-of-type {
		width: 100%;
	}
}