@charset "utf-8";



/* container
====================================================================== */
#container {
	@media screen and (max-width: 743px) {
		padding-top: 7rem;
	}
}


/* ===================================================================================================================

	ABUOT

=================================================================================================================== */

/* ご挨拶
============================================================================================================ */
.message_section {
	position: relative;
	.message {
		.lead {
			margin-bottom: 1rem;
			font-size: 1.9rem;
			font-weight: var(--font-weight-bold);
		}
		p {
			font-size: 1.2rem;
			text-align: justify;
			line-height: 2;
		}
	}
	@media screen and (min-width: 744px), print {
		.contents {
			position: relative;
			width: var(--full-width);
			height: 82rem;
			margin-inline: auto;
			padding-top: 16rem;
			._w {
				position: static;
			}
		}
		header {
			.eng {
				position: absolute;
				top: calc(50% - 34.2rem / 2);
				left: -3rem;
				width: 6rem;
			}
			h2 {
				margin-bottom: 3rem;
				font-size: 3rem;
				line-height: 1.3;
			}
		}
		.ph {
			position: absolute;
			top: 0;
			bottom: 0;
			right: 0;
			width: calc(50% + var(--full-width) / 2);
			z-index: -1;
			img {
				object-position: 40%;
			}
		}
		header,
		.message {
            width: 51rem;
            margin-left: auto;
            margin-right: 9rem;
		}
		.name {
			margin-top: 1.0rem;
			text-align: right;
			font-size: 2.2rem;
			line-height: 1.5;
			margin-right: 9rem;
			.s {
				font-size: 1.2rem;
			}
		}
		.message {
			p {
				line-height: 1.8;
			}
		}
	}
	@media screen and (max-width: 743px) {
		header {
			margin-bottom: 2rem;
			text-align: center;
			.eng {
				width: 18.8rem;
				margin-inline: auto;
				img {
					width: 100%;
				}
			}
			h2 {
				font-size: 1.5rem;
				letter-spacing: 0.3em;
			}
		}
		.ph {
			margin-bottom: 2rem;
		}
		.name {
			margin-top: 4rem;
			text-align: right;
			font-weight: var(--font-weight-bold);
			font-size: 2.5rem;
			line-height: 1.5;
			letter-spacing: 0.2em;
			.s {
				font-size: 1.2rem;
			}
		}
		.message {
			.lead {
				line-height: 2.0;
			}
			p {
				line-height: 1.8;
			}
		}
	}
}

/* 会社概要
============================================================================================================ */
.profile_section {
	position: relative;
	margin-top: 20rem;
	.info {
		display: grid;
		grid-template-columns: 6em 1fr;
		gap: 1rem 4rem;
		dt {
			font-weight: var(--font-weight-bold);
			text-align: justify;
			text-align-last: justify;
			text-justify: inter-ideograph;
		}
	}
	@media screen and (min-width: 744px), print {
		width: var(--full-width);
		margin-inline: auto;
		.contents {
			position: static;
			display: flex;
			justify-content: end;
			gap: 15rem;
			min-height: 68rem;
			padding-bottom: 15rem;
			background: url(../img/line.png) no-repeat 50% 100%;
			background-size: 100%;
		}
		header {
			.eng {
				position: absolute;
				top: -9rem;
				left: -3rem;
				width: 6rem;
			}
			h2 {
				font-size: 3rem;
				line-height: 1.3;
				letter-spacing: 0.7em;
			}
		}
		.img {
			position: absolute;
			top: 21rem;
			right: calc(50% + 8rem);
			width: 30rem;
		}
		.txt {
			width: 67rem;
			padding-top: 0.3em;
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 9rem;
		.contents {
			padding-block: 10rem;
			background-image: url(../img/line_sp.png), url(../img/line_sp.png);
			background-position: 50% 0, 50% 100%;
			background-repeat: no-repeat;
			background-size: 100%;
		}
		header {
			margin-bottom: 3rem;
			text-align: center;
			.eng {
				width: 18.6rem;
				margin-inline: auto;
				img {
					width: 100%;
				}
			}
			h2 {
				font-size: 1.5rem;
				letter-spacing: 0.3em;
			}
		}
		.img {
			width: 22rem;
			margin-inline: auto;
			margin-bottom: 3rem;
		}
		.txt {
			font-size: 1.4rem;
			line-height: calc(18 / 14);
			.info {
				grid-template-columns: 4em 1fr;
				gap: 2rem 2rem;
			}
		}
	}
}

/* ミッション / ヴィジョン
============================================================================================================ */
.mission_block {
	position: relative;
	margin-top: 20rem;
	padding-bottom: 20rem;
	background: url(../img/line.png) no-repeat 50% 100%;
	background-size: 100%;
	header {
		margin-bottom: 3.5rem;
		text-align: center;
		font-size: 2rem;
		.eng {
			width: 37.6rem;
			margin-inline: auto;
		}
		h2 {
			margin-top: 0.2rem;
			letter-spacing: 0.3em;
		}
	}
	.back {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #f4f1df;
		border-radius: 100%;
		z-index: -1;
	}
	.img {
		position: relative;
		width: 39.6rem;
		margin-inline: auto;
		margin-bottom: 3rem;
		z-index: 2;
	}
	.lead {
		margin-bottom: 1rem;
		font-size: 2.5rem;
		line-height: calc(40 / 25);
		text-align: center;
		font-weight: var(--font-weight-bold);
	}
	@media screen and (min-width: 744px), print {
		display: flex;
		justify-content: space-between;
		& > section {
			width: 59rem;
			padding-inline: 3rem;
			text-align: center;
		}
		.sp-center {
			text-align: left;
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 11rem;
		padding-bottom: 10rem;
		background-image: url(../img/line_sp.png);
		& > section + section {
			margin-top: 8rem;
		}
		header {
			margin-bottom: 2rem;
			font-size: 1.5rem;
			.eng {
				width: 24.4rem;
			}
			h2 {
				margin-top: 0;
				letter-spacing: 0.3em;
			}
		}
		.img {
			display: block;
			width: 27.2rem;
			height: 27.2rem;
			margin-bottom: 2rem;
		}
		.lead {
			width: 110%;
			margin-left: -5%;
			font-size: 2rem;
			line-height: calc(30 / 20);
		}
		.sp-center {
			text-align: justify;
		}
	}
}

/* 関連企業
============================================================================================================ */
.associated_section {
	position: relative;
	margin-top: 20rem;
	font-weight: var(--font-weight-bold);
	section:nth-child(1) {
			margin-bottom: 15rem;
	}
	h3 {
		margin-bottom: 1.5rem;
		line-height: 1.3;
	}
	.info {
		display: grid;
		grid-template-columns: 4em 1fr;
		gap: .5rem 1rem;
		line-height: 1.75;
		dt {
			font-weight: var(--font-weight-bold);
		}
		dd ,
		a {
			letter-spacing: .1em;
		}
	}
	@media screen and (min-width: 744px), print {
		/* padding-inline: 16rem; */
		padding-left: 6rem;
		padding-right: 21rem;
		display: flex;
		justify-content: space-between;
		h2 {
			font-size: 3rem;
			line-height: 1.3;
			letter-spacing: 0.7em;
		}
		section {
			display: flex;
			align-items: flex-end;
			gap: 4rem;
			div {
				width: 43rem;
			}
			.assosiated_logo-01 {
				margin-bottom: 2.4rem;
				width: 41.4rem;
				flex-shrink: 0;
			}
			.assosiated_logo-02 {
				margin-bottom: 2.4rem;
				width: 31.3rem;
				flex-shrink: 0;
			}
		}
		.assosiated_pic {
			width: 25.5rem;
		}
		h3 {
			font-size: 2.1rem;
		}
	}
	@media screen and (max-width: 743px) {
		margin-top: 9rem;
		.assosiated_pic {
			margin: 0 auto 4rem;
			width: 27.5rem;
		}
		h2 {
			margin-bottom: 4rem;
			font-size: 1.8rem;
			line-height: 1.3;
			letter-spacing: 0.3em;
			text-align: center;
		}
		.assosiated_logo-01 {
			width: 27.3rem;
			margin-inline: auto;
			margin-bottom: 1.6rem;
			img {
				width: 100%;
			}
		}
		.assosiated_logo-02 {
			width: 25.7rem;
			margin-inline: auto;
			margin-bottom: 1.6rem;
			img {
				width: 100%;
			}
		}
		.txt {
			width: fit-content;
			margin-inline: auto;
			width: 27.5rem;
		}
		h3 {
			font-size: 1.7rem;
			text-align: center;
		}
		.info {
			font-size: 1.4rem;
		}
	}
}