@charset "utf-8";
/* CSS Document */

.page_ttl_wrap {
	background: url("../images/company/page_ttl_back.jpg");
}

section {
	justify-content: flex-start;
}

section:not(:last-of-type) {
	background: #FBF2F4;
}


.company_ttl_wrap {
	display: inline-block;
}

.company_ttl {
	font-family: "brandon-grotesque", sans-serif;
	line-height: 100%;
	color: #B7002C;
}

.company_ttl_wrap > span {
	font-size: clamp(22px,2.7vw,37px);
	font-family: "Yu Gothic", "游ゴシック", "YuGothic", sans-serif;
	font-weight: bold;
}


.greeting_wrap {
	max-width: 570px;
	width: 90%;
	margin: 60px auto 0px;
	z-index: 1;
}

.top_img_wrap {
	top: 10%;
	left: 0px;
	width: 100%;
	position: absolute;
	display: flex;
	justify-content: space-between;
	z-index: 0;
	gap: 30px;
}

.top_img_wrap > span {
	display: flex;
	max-width: 300px;
	width: 40%;
}

.greeting_ttl {
	color: #B7002C;
	font-size: clamp(20px,3vw,30px);
	font-family: "Yu Gothic", "游ゴシック", "YuGothic", sans-serif;
	line-height: 130%;
	margin-bottom: 40px;
}

.greeting_txt {
	font-size: clamp(14px,2vw,20px);
	font-family: "Yu Gothic", "游ゴシック", "YuGothic", sans-serif;
	font-weight: bold;
	text-align: justify;
	letter-spacing: 0px;
}


section.message {
	padding-bottom: 5rem;
}

.message_wrap {
	width: 96%;
	z-index: 0;
	margin: 0px auto;
}

.message_wrap::after {
	content: '';
	background: #FFF;
	display: inline-block;
	width: 100%;
	height: 64%;
	bottom: 0px;
	position: absolute;
	z-index: -1;
	border-radius: 20px;
}

.message_inner {
	flex-wrap: wrap;
	max-width: 1500px;
	width: 90%;
	margin: 0px auto 40px;
	align-items: stretch;
	gap: 0px 5vw;
}

.message_inner > * {
	height: 100%;
	font-family: "Yu Gothic", "游ゴシック", "YuGothic", sans-serif;
	font-weight: bold;
}

.message_inner > dd {
	padding: 30px 0px;
	display: flex;
	flex-direction: column;
}

section.message .company_ttl_wrap {
	max-width: 550px;
	width: 80%;
	flex-grow: 1;
}

section.message .company_ttl {
	font-size: clamp(50px,6vw,120px);
}

section.message .company_ttl_wrap > span {
	color: #B7002C;
	top: -10px;
}

.ceo_img {
	width: 33%;
}

.message_inner > dd {
	width: 59%;
}

.ceo_ttl {
	font-size: clamp(24px,3vw,40px);
}

.ceo_txt {
	font-size: clamp(14px,1.6vw,1.6px);
	line-height: 200%;
	max-width: 800px;
	width: 100%;
	margin: 30px 0px;
	text-align: justify;
	letter-spacing: 0px;
}

.ceo_name > p {
	font-size: 12px;
}

.ceo_name > p > big {
	font-size: 24px;
	margin-left: 1em;
}


section.logo .logo_wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4vw 0px;
}

section.logo .logo_wrap > p {
	text-align: center;
	width: 100%;
}

section.logo .logo_ttl {
	color: #B7002C;
	font-size: clamp(20px,3.7vw,37px);
}

section.logo .logo_img {
	width: 225px !important;
}

section.logo .logo_txt {
	font-size: clamp(16px,2.2vw,20px);
	line-height: 200%;
}


section.profile {
	background: #FFF;
}

section.profile .inner_wrap {
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 30px;
}

section.profile .company_ttl {
	font-size: clamp(40px,9vw,90px);
	font-weight: 500;
}

.profile_table {
	max-width: 900px;
	width: 100%;
}

.profile_table tr {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

.profile_table tr > * {
	padding: 20px 10px;
}

.profile_table tr > th {
	border-top: 1px solid #B7002C;
	width: 162px;
}

.profile_table tr > td {
	border-top: 1px solid #999999;
	width: 82%;
}

.profile_table tr:last-of-type > th {
	border-bottom: 1px solid #B7002C;
}

.profile_table tr:last-of-type > td {
	border-bottom: 1px solid #999999;
}


@media screen and (max-width: 980px) {
	section {
		justify-content: flex-start;
	}
	
	section.greeting {
		padding-bottom: 10vw;
	}
	
	.greeting_wrap {
		max-width: 100%;
	}
	
	.top_img_wrap {
		top: 0px;
		height: auto;
		position: relative;
	}
	
	.top_img_wrap > span {
		width: 48% !important;
	}
	
	.top_img_wrap > span img {
		object-fit: contain;
	}
	
	.top_img_01 {
		height: 20rem;
	}
	
	.top_img_02 {
		top: 20px;
		justify-content: flex-end;
	}
	
	.greeting_wrap {
		margin: 10vw auto 5vw;
		text-align: center;
	}
	
	.greeting_ttl {
		margin-bottom: 20px;
	}
	
	.greeting_txt {
		text-align: center;
	}
	
	.ceo_name > p {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
		align-items: center;
	}
}


@media screen and (max-width: 768px) {
	.logo_img {
		width: 100px !important;
	}
	
	.message_inner > dd {
		padding: 10px 0px;
	}
}

@media screen and (max-width: 600px) {
	.ceo_img {
		width: 50%;
		margin: 0px auto 10px;
	}

	.message_inner > dd {
		width: 100%;
	}

	.ceo_txt {
		margin: 10px 0px;
	}
	
	.profile_table tr {
		flex-wrap: wrap;
	}
	
	.profile_table tr > th {
		width: 100%;
	}
	
	.profile_table tr > td {
		width: 100%;
	}
}


@media screen and (max-width: 600px) {
	.message_wrap::after {
		display: none;
	}
	
	.message_wrap dd {
		background: #FFF;
		padding: 30px;
		border-radius: 30px;
	}
}