@charset "utf-8";
/*------------------------------------------------------------
	about
------------------------------------------------------------*/
#main {
	padding-bottom: 37rem;
}
#main .message {
	margin-bottom: 13rem;
	padding-bottom: 11.1rem;
	position: relative;
}
#main .message::before {
	position: absolute;
	top: 5.9rem;
	right: 0;
	width: calc(50% + 78rem);
	bottom: 0;
	background: #eef1f5;
	content: '';
}
#main .message::after {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 107.9rem;
	height: 50rem;
	background: url(../img/about/img01.png) no-repeat left top / 100%;
	content: '';
	mix-blend-mode: overlay;
}
#main .message .inner .lBox {
	width: calc(100% - 55rem);
}
#main .message .inner .lBox .title {
	margin-bottom: 4.5rem;
	font-size: 4.4rem;
	font-weight: 700;
	line-height: 1.72;
	letter-spacing: 0.15em;
	font-feature-settings: "palt";
	-moz-font-feature-settings: "palt";
}
#main .message .inner .lBox .title .color {
	color: #172a4f;
}
#main .message .inner .lBox .textBox .text {
	margin-bottom: 3.2rem;
	line-height: 2;
}
#main .message .inner .photo {
	margin-top: 20.9rem;
	width: 48rem;
}
#main .outline .headLine03 {
	margin-bottom: 5.6rem;
}
#main .outline .tableBox {
	margin-bottom: 12rem;
}
#main .outline .tableBox table {
	width: 100%;
	border-collapse: collapse;
}
#main .outline .tableBox th,
#main .outline .tableBox td {
	padding: 3.2rem 1rem 3.5rem;
	text-align: left;
	vertical-align: top;
	box-sizing: border-box;
	word-break: break-all;
	border-top: 1px solid #172a4f;
	line-height: 2;
	letter-spacing: 0.05em;
}
#main .outline .tableBox th {
	color: #172a4f;
	width: 20.8%;
}
#main .outline .tableBox tr:last-child th,
#main .outline .tableBox tr:last-child td {
	border-bottom: 1px solid #172a4f;
}
#main .outline .inner {
	margin-left: auto;
	width: calc(50% + 60rem);
}
#main .outline .inner .map,
#main .outline .inner .photo {
	width: 50%;
}
#main .outline .inner .map iframe {
	width: 100%;
	height: 100%;
}
#main .outline .inner .photo {
	aspect-ratio: 78 / 50;
}
#main .outline .inner .photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
@media all and (min-width: 897px) and (max-width: 1660px) {
	#main .message::before {
		left: 3rem;
		width: auto;
	}
}
@media all and (max-width: 896px) {
	#main {
		padding-bottom: 20rem;
	}
	#main .message {
		margin-bottom: 5rem;
		padding-bottom: 15rem;
	}
	#main .message::before {
		top: 2.5rem;
		left: 1.5rem;
		right: 0;
		width: auto;
	}
	#main .message::after {
		width: 27rem;
		height: 12.5rem;
	}
	#main .message .inner {
		padding-left: 1.5rem;
		display: block;
	}
	#main .message .inner .lBox {
		width: auto;
	}
	#main .message .inner .lBox .title {
		margin-bottom: 3rem;
		font-size: 2rem;
	}
	#main .message .inner .lBox .textBox .text {
		margin-bottom: 2rem;
	}
	#main .message .inner .photo {
		margin-top: 5rem;
		width: auto;
	}
	#main .message .inner .photo img {
		width: 100%;
	}
	#main .outline .headLine03 {
		margin-bottom: 4rem;
	}
	#main .outline .tableBox {
		margin-bottom: 6rem;
	}
	#main .outline .tableBox th,
	#main .outline .tableBox td {
		padding: 0.8rem 1rem;
		display: block;
		width: 100% !important;
		border: none !important;
	}
	#main .outline .tableBox th {
		padding-bottom: 0;
		border-top: 1px solid #172a4f !important;
	}
	#main .outline .tableBox tr:last-child td {
		border-bottom: 1px solid #172a4f !important;
	}
	#main .outline .inner {
		margin: 0 1.5rem;
		width: auto;
	}
	#main .outline .inner .map,
	#main .outline .inner .photo {
		width: 100%;
	}
	#main .outline .inner .map {
		margin-bottom: 2rem;
		aspect-ratio: 3 / 2;
	}
}