@charset "utf-8";
/*------------------------------------------------------------
	solutions
------------------------------------------------------------*/
#main .issues {
	margin-bottom: 14rem;
}
#main .issues .content {
	width: 130rem;
}
#main .issues .comList04::after {
	margin: 2.3rem auto 0;
	width: 10rem;
	aspect-ratio: 1/1;
	content: "";
	display: block;
	background: url(../img/common/icon05.png) no-repeat center center / 100%;
}
#main .issues .infoBox {
	margin: 0 1rem;
	padding: 4.8rem 2rem 5.8rem;
	border-radius: 1rem;
	position: relative;
	background: linear-gradient(180deg, #03D8B8 17.7%, #00A196 73.73%), #00A196;
	z-index: 1;
}
#main .issues .infoBox .comBox {
	margin-bottom: 0;
	width: 96.2rem;
}
#main .issues .infoBox .comBox p {
	text-align: center;
}
#main .issues .infoBox::after {
	content: "";
	position: absolute;
	left: 2px;
	top: 2px;
	bottom: 2px;
	right: 2px;
	border-radius: 0.8rem;
	background-color: #FAFAFA;
	z-index: -1;
}
#main .pillars {
	padding: 10rem 0 12rem;
	background-color: #fff;
}
#main .pillars .content {
	width: 176rem;
}
#main .pillars .headLine01 {
	margin-bottom: 4.3rem;
}
#main .pillars .headLine01 .en {
	letter-spacing: 0.055em;
}
#main .pillars .headLine01 .jp {
	margin: 2.3rem 0 0;
	font-size: 5rem;
	letter-spacing: 0.04em;
	font-weight: 600;
}
#main .pillars .comList01 {
	margin-bottom: 10rem;
	justify-content: center;
	gap: 5rem;
}
#main .pillars .comList01 li {
	width: 43rem;
}
#main .pillars .needs {
	padding: 7rem 9rem 7.4rem;
	border-radius: 1rem;
	background-color: #FAFAFA;
}
#main .pillars .needs .headLine06 {
	margin-bottom: 4.6rem;
	min-width: inherit;
	width: 100%;
}
#main .pillars .needs .textList {
	display: flex;
	flex-wrap: wrap;
	gap: 4rem 4.4rem;
}
#main .pillars .needs .textList li {
	width: calc((100% - 8.8rem) / 3);
	border-radius: 0.4rem;
	border: 1px solid #C4C4C4;
	background: #FFF;
	display: flex;
	flex-direction: column;
}
#main .pillars .needs .textList .title {
	padding: 2.6rem 1rem 2.3rem 9rem;
	font-size: 2.6rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.038em;
	flex: 1;
	background: url(../img/business/solutions/icon.png) no-repeat left 3.6rem top 2.3rem / 4rem;
}
#main .pillars .needs .textList .col {
	color: #00A196;
}
#main .pillars .needs .textList .btn {
	height: 7.8rem;
}
#main .pillars .needs .textList .btn a {
	padding: 0.5rem 2.2rem 1.5rem;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.05em;
	border-top: 1px solid #C4C4C4;
	gap: 0.5rem;
}
#main .countermeasures {
	padding: 12.1rem 0 12.4rem;
}
#main .countermeasures .content {
	width: 158.5rem;
}
#main .countermeasures .headLine04 {
	margin-bottom: 6.2rem;
}
#main .countermeasures .comBtn02,
#main .factories .comBtn02 {
	margin: 0 auto;
	width: fit-content;
}
#main .countermeasures .comBtn02 a,
#main .factories .comBtn02 a {
	letter-spacing: 0.05em;
	gap: 1.5rem;
	color: #333;
}
#main .factories {
	margin-bottom: 11.7rem;
	padding: 11rem 0 11.5rem;
	background-color: #fff;
}
#main .factories .headLine04 {
	margin-bottom: 7rem;
}
#main .factories .content {
	width: 160rem;
}
#main .factories .comList03 li {
	padding-bottom: 6.9rem;
	width: calc(50% - 4rem);
	border: 1px solid #C4C4C4;
}
#main .factories .comList03 .image {
	margin-bottom: 2.3rem;
}
#main .factories .comList03 .title {
	margin-bottom: 2.7rem;
	color: #333;
	letter-spacing: 0.093em;
}
#main .factories .comList03 .title::before {
	top: 1.6rem;
}
#main .factories .comList03 p {
	margin-right: 0;
}
@media all and (min-width: 897px) {
	#pagePath {
		margin-bottom: 1rem;
	}
	.comVisual {
		margin-bottom: 6rem;
	}
	.comVisual .mainBg {
		padding-top: 7rem;
	}
	.comVisual .mainBg .content {
		width: 180rem;
	}
	.comBox p {
		width: 100%;
	}
	.comBox {
		margin-bottom: 6.3rem;
	}
	#main .category .linkList a:hover ~ .image img {
		transform: scale(1.05);
	}
	#main .countermeasures .comBtn02 a:hover,
	#main .factories .comBtn02 a:hover {
		color: #00A196;
		border-color: currentColor;
	}
	#main .pillars .needs .textList .btn a:hover {
		color: #00A196;
	}
}
@media (min-width: 897px) and (max-width: 1650px) {
	#main .pillars .needs .textList .title {
		font-feature-settings: "palt";
	}
}
@media all and (max-width: 896px) {
	#main .issues {
		margin-bottom: 6rem;
	}
	#main .issues .textList::after {
		margin: 2.3rem auto 0;
		width: 5rem;
	}
	#main .issues .infoBox {
		margin: 0 1rem;
		padding:1.5rem 1rem;
	}
	#main .issues .infoBox .comBox {
		width: auto;
	}
	#main .issues .infoBox::after {
		left: 1px;
		top: 1px;
		bottom: 1px;
		right: 1px;
	}
	#main .pillars {
		padding: 6rem 0;
	}
	#main .pillars .headLine01 {
		margin-bottom: 3rem;
	}
	#main .pillars .headLine01 .jp {
		margin: 1.5rem 0 0;
		font-size: 2.3rem;
	}
	#main .pillars .comList01 {
		margin-bottom: 5rem;
		gap: 2rem;
		flex-direction: column;
	}
	#main .pillars .comList01 li {
		width: 100%;
	}
	#main .pillars .needs {
		margin: 0 -1rem;
		padding: 3rem 2rem;
	}
	#main .pillars .needs .headLine06 {
		margin-bottom: 2rem;
	}
	#main .pillars .needs .textList {
		gap: 2rem;
		flex-direction: column;
	}
	#main .pillars .needs .textList li {
		width:100%;
	}
	#main .pillars .needs .textList .title {
		padding: 2rem 1rem 2rem 4rem;
		font-size: 2rem;
		background: url(../img/business/solutions/icon.png) no-repeat left 1rem top 2.1rem / 2.5rem;
	}
	#main .pillars .needs .textList .btn {
		height: 5rem;
	}
	#main .pillars .needs .textList .btn a {
		padding: 0.5rem 2rem;
		font-size: 1.6rem;
	}
	#main .countermeasures {
		padding: 6rem 0;
	}
	#main .countermeasures .headLine04 {
		margin-bottom: 3rem;
	}
	#main .countermeasures .comBtn02 a,
	#main .factories .comBtn02 a {
		gap: 0.5rem;
	}
	#main .factories {
		margin-bottom: 6rem;
		padding: 6rem 0;
	}
	#main .factories .headLine04 {
		margin-bottom: 4rem;
	}
	#main .factories .comList03 li {
		padding-bottom: 4rem;
		width: 100%;
	}
	#main .factories .comList03 .image {
		margin-bottom: 1.5rem;
	}
	#main .factories .comList03 .title {
		margin-bottom: 1.5rem;
	}
	#main .factories .comList03 .title::before {
		top: 0.9rem;
	}
}