@charset "utf-8";

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
事業内容
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
共通
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- イントロ
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.business-intro {
	padding-bottom: 0;
}

.business-intro .inner {
	display: grid;
	gap: 30px 7%;
}

.business-intro .img {
	width: 100%;
}

.business-intro .text {
	position: relative;
}

.business-intro .text::before {
	position: absolute;
	inset: -80px auto -40px 80px;
	z-index: -1;
	width: 100vw;
	background: var(--color_gray_light);
	content: "";
}

.business-intro .heading {
	margin-bottom: 1.2em;
	font-size: 24px;
	letter-spacing: var(--letter-spacing);
}

@media (min-width: 768px) {
.business-intro .inner {
	grid-template-columns: 1fr 42%;
	align-items: center;
}

.business-intro .image {
	margin-left: -140px;
}

.business-intro .img {
	height: 373px;
	object-fit: cover;
}

.business-intro .text::before {
	inset: 60px auto -110px -160px;
}

.business-intro .heading {
	font-size: 29px;
}
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- 製品紹介
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.business-product-ul {
	display: grid;
	row-gap: 40px;
}

.business-product-li .image {
	display: grid;
	grid-template-columns: 47% 47%;
	justify-content: space-between;
}

.business-product-li .img {
	width: 100%;
}

.business-product-li .heading {
	margin-block: 1em;
	padding-bottom: 0.5em;
	border-bottom: 1px solid;
	font-size: 19px;
	letter-spacing: var(--letter-spacing);
}

.business-product-li .list {
	display: flex;
	column-gap: 2em;
	flex-flow: wrap;
}

.business-product-li .ul {
	margin-block: 0;
}

.business-product-li dt {
	font-weight: 700;
	font-size: 16px;
}

.business-product-li dt:not(:first-child) {
	margin-top: 1em;
}

@media (min-width: 768px) {
.business-product-ul {
	grid-template-columns: 45% 45%;
	justify-content: space-between;
}
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- 納入実績
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.business-performance {
	background: var(--color_main);
}

.business-performance .heading_bar {
	color: #fff;
}

.performance-post-ul {
	display: grid;
	grid-template-columns: 48% 48%;
	row-gap: min(4vw, 26px);
	justify-content: space-between;
}

.performance-post-li .wp-post-image {
	aspect-ratio: 320 / 350;
}

.performance-post-li:first-child .wp-post-image {
	aspect-ratio: 670 / 450;
}

@media (min-width: 768px) {
.performance-post-ul {
	grid-template-columns: 44% 24% 24%;
}

.performance-post-li:first-child {
	grid-row: 1 / 4;
}

.performance-post-li .post-image {
	height: 100%;
}

.performance-post-li .wp-post-image {
	aspect-ratio: 242 / 198;
}

.performance-post-li:first-child .wp-post-image {
	aspect-ratio: 444 / 646;
}
}

@media (max-width: 767.9px) {
.performance-post-li:first-child {
	grid-column: 1 / 3;
}
}

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
HOME
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/

/*+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+
- メイン
+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+*/
.business-li:not(:last-child) {
	margin-bottom: var(--padding-block);
}

.business-li .heading {
	margin-bottom: 0.3em;
	font-size: 24px;
}

@media (min-width: 768px) {
.business-li {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.business-li:nth-child(2n) {
	flex-flow: row-reverse;
}

.business-li .img {
	width: 54%;
	height: 352px;
	object-fit: cover;
}

.business-li .text {
	width: 42%;
}

.business-li .heading {
	font-size: 44px;
}

.business-li:nth-child(2n+1) .button {
	margin-right: 0;
}

.business-li:nth-child(2n) .button {
	margin-left: 0;
}
}

@media (max-width: 767.9px) {
.business-li .img {
	width: 100%;
	margin-bottom: 20px;
}
}