@charset "utf-8";
/* CSS Document */
#keyVisual{
	background: url("../img/keyvisual_pc.webp") no-repeat center / cover;
}
	#keyVisual .ttl{
		letter-spacing: 1px;
	}
		#keyVisual .ttl .min{
			font-size: 0.833333em;
			font-feature-settings: "palt";
			margin-top: 15px;
		}

.flexBox{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

[id^="sec_"] .lead{
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.889;
}

[id^="sec_"] .ttl-sub{
	font-size: 5.2rem;
}

.tblStyle01 td{
	line-height: 2;
}

footer{
	margin-top: 0;
}

@media screen and (max-width: 1440px){
	#keyVisual{
		background-position: 53% center;
	}
}
@media screen and (max-width: 1200px){
	.flexBox{
		flex-wrap: wrap;
	}
}
@media screen and (max-width: 820px){
	#keyVisual{
		background-position: 48% center;
	}
	
	[id^="sec_"] .ttl-sub{
		font-size: clamp(1.8rem,8vw,3.5rem);
	}
	[id^="sec_"] .lead{
		text-align: left;
	}
	
}
@media screen and (max-width: 767px){
	#keyVisual{
		background-image: url("../img/keyvisual_sp.webp");
		background-position: 50% center;
	}
		#keyVisual .ttl .min{
			margin-top: 5px;
		}

	.tblStyle01 th{
		width: 90px;
	}
}
@media screen and (max-width: 374px){
	[id^="sec_"] .ttl-sub{
		font-size: 3rem;
	}
}


/* ------------------------------------------------------------------------ */

/*  カムバック採用制度

/* ------------------------------------------------------------------------ */

#sec_career .tblStyle01{
	margin-top: 60px;
}
#sec_career .hd01.not{
	margin-top: 40px;
	font-weight: 700;
}


/* ------------------------------------------------------------------------ */

/*  活用事例

/* ------------------------------------------------------------------------ */

#sec_case{
	margin-top: 180px;
}

#sec_case .container {
	background: #fff2f5;
	padding: 40px;
	align-items: center;
}

#sec_case .container + .container{
	margin-top: 64px;
}

#sec_case .container .iconBox{
	font-size: 1.8rem;
	font-weight: 500;
	margin-right: 40px;
	flex-shrink: 0;
}
	#sec_case .container .iconBox img{
		display: block;
		width: 202px;
		aspect-ratio: 1/1;
		margin-bottom: 15px;
		border-radius: 50%;
		border: solid 1px #1a1a1a;
	}

#sec_case .txtBox{
	width: calc(100% - 242px);
}

#sec_case .txtBox dl{
	background: #fff;
	border-radius: 10px;
	padding: 30px 40px;
	text-align: left;
}
#sec_case .txtBox dl + dl{
	margin-top: 32px;
}

#sec_case .txtBox dt{
	font-size: 2.4rem;
	font-weight: 700;
	padding-bottom: 15px;
	padding-left: 19px;
	position: relative;
	border-bottom: solid 1px #ccc;
	margin-bottom: 15px;
}
	#sec_case .txtBox dt::before{
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		background: var(--color-base);
		border-radius: 50%;
		vertical-align: middle;
		position: absolute;
		top: calc(0.5em + 4px);
		left: 0;
	}

#sec_case .txtBox dd{
	line-height: 1.75;
}

@media screen and (max-width: 820px){
	#sec_case {
		margin-top: 120px;
	}

	#sec_case .container{
		padding: 30px 20px;
		flex-direction: column;
	}
	#sec_case .container + .container {
		margin-top: 50px;
	}

	#sec_case .container .iconBox{
		font-size: 1.6rem;
		margin-right: 0;
		margin-bottom: 20px;
	}
		#sec_case .container .iconBox img{
			width: 140px;
			margin: 0 auto 5px;
		}

	#sec_case .txtBox{
		width: 100%;
	}

	#sec_case .txtBox dl{
		padding: 20px;
	}
	#sec_case .txtBox dl + dl{
		margin-top: 20px;
	}
		#sec_case .txtBox dt{
			font-size: 1.8rem;
			padding-bottom: 12px;
			padding-left: 12px;
			margin-bottom: 12px;
		}
		#sec_case .txtBox dt::before{
			width: 5px;
			height: 5px;
			top: calc(0.5em + 2px);
		}
}

/* ------------------------------------------------------------------------ */

/*  フッターリンク

/* ------------------------------------------------------------------------ */
#sec_link{
	margin-top: 120px;
	background: #f0f0f0;
	padding: 64px 0 67px;
}

#sec_link .ttl{
	font-size: 3.2rem;
	font-weight: 700;
}

#sec_link .ttl > span{
	padding: 0 14px;
	position: relative;
}
	#sec_link .ttl > span::before,
	#sec_link .ttl > span::after{
		content: "";
		display: block;
		background: url("/common/img/icon_line.svg") no-repeat center / contain;
		width: 30px;
		height: 34px;
		position: absolute;
		bottom: 6px;
	}
	#sec_link .ttl > span::before{
		right: 100%;
		transform: scale(-1,1);
	}
	#sec_link .ttl > span::after{
		left: 100%;
	}

#sec_link .link.box{
	color: var(--color-base);
	background: #fff;
	border: solid 2px var(--color-base);
	font-size: 2.4rem;
	max-width: 517px;
	padding: 40px 10px;
	margin-top: 30px;
}
#sec_link .link.box .icon-wrap .circle{
	stroke: var(--color-base);
}
#sec_link .icon-wrap .arrow,
#sec_link .icon-wrap .circle-bg{
	fill: var(--color-base);
}

#sec_link .link.box:hover{
	color: #fff;
	background: var(--color-base);
}
#sec_link .link.box:hover .icon-wrap .circle{
	stroke: #fff;
}
#sec_link .link.box:hover .icon-wrap .circle-bg{
	fill: #fff;
}

@media screen and (max-width: 820px){
	#sec_link{
		padding: 54px 0 57px;
	}
	#sec_link .ttl{
		font-size: 2rem;
	}
		#sec_link .ttl > span{
			padding: 0 9px;
		}
			#sec_link .ttl > span::before,
			#sec_link .ttl > span::after{
				width: 20px;
				height: 24px;
				bottom: 3px;
			}
	
	#sec_link .link.box{
		font-size: 1.8rem;
		margin-top: 15px;
		padding: 35px 10px;
		width: calc(100% - 20px);
	}
	#sec_link .link.box .icon-wrap{
		width: 40px;
		height: 40px;
	}
}
@media screen and (max-width: 767px){
	#sec_link .ttl{
		font-size: 1.6rem;
	}
	#sec_link .ttl > span::before{
		right: auto;
		left: -59px;
	}
}