@charset "utf-8";

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
企業情報
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- ページヘッダー
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.page-header-img {
	object-position: 40% center;
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- 会社概要
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.company-overview {
	--content-width: var(--content-width_medium);
}

.company-overview .heading_underline {
	margin-bottom: 1.2em;
	font-size: 32px;
	line-height: 1.5;
}

.company-overview tr {
	border-block: 1px solid var(--color_gray);
}

.company-overview th {
	position: relative;
	padding: 1.5em 1em 1.5em 0;
	white-space: nowrap;
}

.company-overview tr:first-child th::before,
.company-overview th::after {
	position: absolute;
	inset-inline: 0;
	height: 1px;
	background: var(--gradient_90deg);
	content: "";
	transform: scaleX(-1);
}

.company-overview tr:first-child th::before {
	top: 0;
}

.company-overview th::after {
	bottom: 0;
}

.company-overview td {
	padding: 1.5em 0 1.5em 3%;
}

@media (min-width: 768px) {
.company-overview .heading_underline {
	font-size: 48px;
}

.company-overview th {
	padding-block: 2.5em;
}

.company-overview td {
	padding-block: 2.5em;
}
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- メッセージ
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.company-message {
	background: var(--color_gray_lighter);
}

.company-message .inner {
	display: grid;
	row-gap: 1em;
}

.company-message .image {
	position: relative;
	z-index: 0;
	padding-bottom: 12%;
}

.company-message .image::before {
	position: absolute;
	inset: auto 18% 0 auto;
	z-index: -1;
	width: 100%;
	height: 74%;
	background: var(--color_sub_light);
	content: "";
}

.company-message .img {
	width: 100%;
	padding-top: 5px;
}

.company-message .ceo {
	position: relative;
	margin-top: 1.6em;
	padding-left: 1em;
	font-size: 20px;
	line-height: 1.5;
}

.company-message .text {
	line-height: 1.6;
}

.company-message .ceo::before {
	position: absolute;
	inset: 0 auto 0 0;
	width: 6px;
	border-radius: 100vw;
	background: var(--gradient);
	content: "";
}

.company-message .ceo-position {
	font-size: 15px;
}

@media (min-width: 768px) {
.company-message .inner {
	grid-template-columns: 43% 51%;
	justify-content: space-between;
	align-items: start;
}

.company-message .ceo {
	font-size: 28px;
}

.company-message .ceo-position {
	font-size: 18px;
}
}
