@charset "utf-8";
/*------------------------------------------------------------
	index
------------------------------------------------------------*/
#main {
	margin-bottom: -0.1rem;
	overflow: clip;
	clip-path: inset(0 0 0.1rem 0);
}
#main p {
	line-height: 1.875;
}
#main .mainVisual {
	width: 100%;
	height: 100svh;
	position: relative;
}
#main .mainVisual .fvBox {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	left: 0;
	top: 0;
	background: url(../img/index/fv_bg.webp) no-repeat center top / cover;
	z-index: -1;
}
#main .mainVisual .fvBox::after {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: url(../img/index/noise.webp) repeat center center / 136.6rem auto;
	mix-blend-mode: soft-light;
	content: '';
}
#main .mainVisual .fvBox .fvInner {
	padding-top: 9rem;
	width: 100%;
	position: relative;
}
#main .mainVisual .fvBox .lead {
	width: calc(50% - 18.4rem);
	padding-right: 2rem;
	position: absolute;
	top: 11.4rem;
	right: 0;
	font-size: min(2rem, 2.6svh);
	font-weight: 500;
	color: #fff;
	line-height: 1.6;
	z-index: 5;
}
#main .mainVisual .fvBox .fvImg {
	margin-left: -0.6rem;
	width: 152rem;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}
#main .mainVisual .fvBox .fvImg img {
	width: 100%;
	max-height: calc(100svh - 9rem);
	object-fit: contain;
}
#main .mainVisual .fvBox .imgtext {
	margin-left: -3.3rem;
	width: 68.555%;
	max-width: 104.2rem;
	position: absolute;
	left: 50%;
	bottom: 20.4%;
	transform: translateX(-50%);
	z-index: 5;
}
#main .mainVisual .fvBox .imgtext img {
	width: 100%;
	height: auto;
	max-height: 28svh;
}
#main .linkList {
	line-height: 1.75;
	border-top: 0.1rem solid #8694A6;
}
#main .linkList li {
	border-bottom: 0.1rem solid #8694A6;
}
#main .linkList li a {
	padding: 2rem 8rem 2.2rem 3rem;
	display: block;
	font-weight: 400;
	background: url(../img/common/icon05.webp) no-repeat right 3rem center / 3.6rem;
}
#main .linkList li a:hover {
	opacity: 0.7;
}
#main .photoBox {
	width: 68.1rem;
	clip-path: polygon(8.3rem 0, 100% 0, calc(100% - 8.3rem) 100%, 0 100%);
	position: relative;
	z-index: 1;
}
#main .about {
	padding-top: 48.9rem;
	position: relative;
	color: #fff;
	background: url(../img/index/about_bg.webp) no-repeat center top / 100% 44.5rem,
		linear-gradient(#0E2250, #0E2250) no-repeat 0 44.5rem, 100% calc(100% - 44.5rem);
}
#main .about .innerBox {
	padding: 0 0 8rem;
	position: relative;
}
#main .about .innerBox::after {
	width: 85.3rem;
	height: 64.9rem;
	position: absolute;
	left: 0;
	bottom: 0;
	background: linear-gradient(40deg, #DCFAFF -1.44%, rgba(220, 250, 255, 0) 48.56%);
	content: '';
}
#main .about .content {
	position: relative;
	z-index: 10;
}
#main .about .headLine05 {
	color: #fff;
}
#main .about .headLine05 .jp::after {
	background: #fff;
}
#main .about .imgBox {
	margin: 0 -2rem 0 -4.3rem;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
#main .about .imgBox .photoBox {
	margin-right: -5.8rem;
}
#main .about .imgBox .photoBox img {
	width: 100%;
}
#main .about .imgBox .textBox {
	margin-top: -1.2rem;
	flex: 1;
	position: relative;
}
#main .about .imgBox .textBox::after {
	width: 92.2rem;
	height: 48.9rem;
	position: absolute;
	left: -14.6rem;
	bottom: -17.3rem;
	background: #989DBB;
	clip-path: polygon(8.3rem 0, 100% 0, calc(100% - 8.3rem) 100%, 0 100%);
	opacity: 0.2;
	mix-blend-mode: screen;
	content: '';
}
#main .about .imgBox .textBox .inner {
	position: relative;
	clip-path: polygon(14.8rem 0, 100% 0, 100% 100%, 0 100%);
	z-index: 1;
}
#main .about .lead {
	font-size: 2.7rem;
	line-height: 1.55;
	margin: 0 0 1.1rem 12.5rem;
}
#main .about .text {
	margin: 0 0 4.1rem 10.2rem;
}
#main .about .linkList li a {
	background-image: url(../img/common/icon04.webp);
}
#main .company {
	padding: 14.6rem 0 7.7rem;
	position: relative;
	background: #fff;
	z-index: 1;
}
#main .company .imgBox {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
}
#main .company .imgBox .textBox {
	flex: 1;
}
#main .company .imgBox .photoBox {
	margin: 0.4rem -4.3rem 0 -4.3rem;
	width: 68.2rem;
	z-index: 2;
}
#main .company .imgBox .photoBox img {
	width: 100%;
}
#main .company p {
	margin-bottom: 4.2rem;
}
#main .company .lead {
	margin-bottom: 1.7rem;
	font-size: 2.8rem;
	line-height: 1.39;
}
#main .company .linkList {
	clip-path: polygon(0 0, 100% 0, calc(100% - 4.4rem) 100%, 0 100%);
}
#main .company .linkList li a {
	padding-right: 14rem;
	background-position: right 5.7rem center;
}
#main .work {
	padding: 7.1rem 0 12rem;
	position: relative;
	z-index: 1;
	background: #fff;
}
#main .work .imgBox {
	margin-bottom: 11rem;
	display: flex;
	justify-content: space-between;
}
#main .work .imgBox .photoBox {
	margin: 0 -1.8rem 0 -4.3rem;
	align-self: flex-start;
	z-index: 2;
}
#main .work .imgBox .textBox {
	padding: 3.2rem 0 0;
	flex: 1;
	position: relative;
	z-index: 1;
}
#main .work .imgBox .textBox::after {
	width: 94.1rem;
	height: 55rem;
	position: absolute;
	left: -20.6rem;
	bottom: 0;
	background: #989DBB;
	clip-path: polygon(9.2rem 0, 100% 0, calc(100% - 9.2rem) 100%, 0 100%);
	opacity: 0.1;
	content: '';
	z-index: -1;
}
#main .work .subBox {
	margin-left: 7rem;
}
#main .work p {
	margin-bottom: 5rem;
}
#main .work .lead {
	margin-bottom: 1.6rem;
	font-size: 2.8rem;
	line-height: 1.42;
}
#main .work .linkList {
	clip-path: polygon(2rem 0, 100% 0, 100% 100%, 0 100%);
}
#main .work .linkList li a {
	background-position: right center;
}
#main .work h3 {
	margin-bottom: 2.5rem;
}
#main .life {
	padding-top: 12rem;
	position: relative;
	color: #fff;
	background: #0E2250;
}
#main .life::before {
	width: 85.3rem;
	height: 48.9rem;
	background: linear-gradient(150deg, #DCFAFF -17.23%, rgba(220, 250, 255, 0) 41.82%);
	position: absolute;
	left: 0;
	top: 0;
	content: '';
}
#main .life::after {
	margin-right: -23rem;
	width: 59.6rem;
	height: 37.1rem;
	position: absolute;
	right: 50%;
	bottom: 0;
	background: linear-gradient(138deg, #0E2250 38.76%, #E31F26 80.22%);
	opacity: 0.5;
	content: '';
}
#main .life .imgBox {
	padding-bottom: 0.1rem;
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 2;
}
#main .life .textBox {
	flex: 1;
	position: relative;
	z-index: 1;
}
#main .life .textBox .innerBox {
	max-width: 47.6rem;
	margin: 4.2rem 0 0 auto;
}
#main .life .headLine05 {
	margin-bottom: 4.6rem;
	color: #fff;
}
#main .life .headLine05 .jp::after {
	background: #fff;
}
#main .life p:not(.lead) {
	line-height: 2.375;
}
#main .life .lead {
	font-size: 2.8rem;
	line-height: 1.4;
	margin-bottom: 1.3rem;
}
#main .life .linkBox {
	margin-bottom: -3.6rem;
	width: calc(50% + 8.4rem);
	position: relative;
}
#main .life .linkBox::before {
	width: 108.2rem;
	height: 50.6rem;
	position: absolute;
	left: -19.7rem;
	bottom: 3.5rem;
	background: #989DBB;
	clip-path: polygon(9.7rem 0, 100% 0, calc(100% - 9.7rem) 100%, 0 100%);
	opacity: 0.1;
	content: '';
}
#main .life .list {
	display: flex;
	gap: 2.1rem;
	flex-direction: column;
	position: relative;
	z-index: 5;
}
#main .life .list li {
	clip-path: polygon(4.3rem 0, 100% 0, 100% 100%, 0 100%);
}
#main .life .list li:nth-child(1) {
	margin-left: 4.6rem;
}
#main .life .list li a {
	display: block;
	position: relative;
	overflow: hidden;
}
#main .life .list li a:hover {
	opacity: 0.7;
}
#main .life .list li a::after {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	bottom: -20%;
	background: linear-gradient(0deg, #001F6B -20%, rgba(114, 114, 114, 0) 100%);
	opacity: 0.9;
	content: '';
	z-index: 1;
}
#main .life .list li a img {
	width: 100%;
	height: 22.6rem;
	object-fit: cover;
}
#main .life .list li a .txt {
	padding-right: 5.6rem;
	display: block;
	position: absolute;
	left: 4rem;
	bottom: 2.2rem;
	color: #fff;
	font-size: 2.3rem;
	font-weight: 500;
	background: url(../img/common/icon04.webp) no-repeat right top 56% / 3.6rem;
	z-index: 2;
}
#main .recruit {
	padding: 14.5rem 0 5.1rem;
	position: relative;
	color: #fff;
	background: url(../img/index/recruit_bg.webp) no-repeat center center / cover;
}
#main .recruit::after {
	width: 77.7rem;
	height: 44.5rem;
	position: absolute;
	right: 0;
	top: 3.5rem;
	background: linear-gradient(24deg, rgba(0, 0, 0, 0) 58.32%, #001F6B 89.78%);
	opacity: 0.5;
	content: '';
}
#main .recruit .headLine02 {
	margin-bottom: 2.2rem;
	text-align: center;
}
#main .recruit p {
	margin-bottom: 3.7rem;
	text-align: center;
	line-height: 2.37;
}
#main .recruit .content {
	position: relative;
	z-index: 2;
}
@media all and (min-width: 897px) {
	#main .about .lead span {
		display: block;
	}
	#main .about .lead span:nth-of-type(1) {
		text-indent: 0.55em;
	}
	#main .about .text span {
		display: block;
	}
	#main .about .text span:nth-of-type(1) {
		text-indent: 2em;
	}
	#main .about .text span:nth-of-type(2) {
		text-indent: 1.6em;
	}
	#main .about .text span:nth-of-type(3) {
		text-indent: 1.1em;
	}
	#main .about .text span:nth-of-type(4) {
		text-indent: 0.66em;
	}
	#main .about .text span:nth-of-type(5) {
		text-indent: 0.23em;
	}
	#main .about .linkList {
		margin-right: 2rem;
	}
	#main .about .linkList li:nth-of-type(1) a {
		padding-left: 7rem;
	}
	#main .about .linkList li:nth-of-type(2) a {
		padding-left: 5rem;
	}
	#main .about .linkList li:nth-of-type(3) a {
		padding-left: 3rem;
	}
	#main .company .linkList li:nth-of-type(2) a {
		background-position: right 7.7rem center;
	}
	#main .company .linkList li:nth-of-type(3) a {
		background-position: right 9.7rem center;
	}
}
@media all and (max-width: 896px) {
	#main .mainVisual .fvBox {
		height: 100svh;
		display: block;
		background-image: url(../img/index/fv_bg_sp.webp);
	}
	#main .mainVisual .fvBox::after {
		display: none;
	}
	#main .mainVisual .fvBox .fvInner {
		padding-top: 5.8rem;
		min-height: 100%;
	}
	#main .mainVisual .fvBox .lead {
		width: 100%;
		padding: 2rem;
		top: auto;
		bottom: 5.1rem;
		right: auto;
		left: 0;
		font-size: min(2.758svh, 1.6rem);
		line-height: 1.75;
	}
	#main .mainVisual .fvBox .fvImg {
		margin-left: 1rem;
		width: 44.4rem;
	}
	#main .mainVisual .fvBox .fvImg img {
		max-height: calc(100svh - 22.6rem);
	}
	#main .mainVisual .fvBox .imgtext {
		margin: 0;
		width: 25.5rem;
		max-width: 57.44%;
		left: 8.4%;
		bottom: 6.4%;
		transform: none;
	}
	#main .mainVisual .fvBox .imgtext img {
		max-height: 23.428svh;
	}
	#main .linkList li a {
		padding: 1.9rem 4.5rem 2.3rem 0;
		background-position: right center;
	}
	#main .photoBox {
		width: auto;
		clip-path: polygon(0 0, 100% 0, calc(100% - 3rem) 100%, 0 100%);
	}
	#main .photoBox img {
		aspect-ratio: 370/191;
		object-fit: cover;
	}
	#main .about {
		padding-top: 11.5rem;
		background: url(../img/index/about_bg_sp.webp) no-repeat left top / 100% 43rem,
			linear-gradient(#0E2250, #0E2250) no-repeat left top 43rem, 100% calc(100% - 43rem);
	}
	#main .about .innerBox {
		padding: 0 0 5.8rem;
	}
	#main .about .innerBox::after {
		display: none;
	}
	#main .about .imgBox {
		margin: 0;
		display: block;
	}
	#main .about .imgBox .photoBox {
		margin: 0 0 1.8rem -2rem;
	}
	#main .about .imgBox .textBox {
		margin: 0;
	}
	#main .about .imgBox .textBox::after {
		width: auto;
		height: 30.1rem;
		right: -2rem;
		left: 5rem;
		bottom: auto;
		top: -13.9rem;
		clip-path: polygon(5.5rem 0, 100% 0, 100% 100%, 0 100%);
	}
	#main .about .imgBox .textBox .inner {
		clip-path: none;
	}
	#main .about .lead {
		width: 25rem;
		font-size: 2.5rem;
		line-height: 1.52;
		margin: 0 0 1.2rem;
	}
	#main .about .text {
		margin: 0 0 3.2rem;
	}
	#main .about .linkList {
		margin-right: 0;
	}
	#main .company {
		padding: 5.4rem 0;
	}
	#main .company .imgBox {
		display: block;
	}
	#main .company .imgBox .photoBox {
		margin: 0 0 2.9rem -2rem;
		width: auto;
	}
	#main .company p {
		margin-bottom: 3.2rem;
	}
	#main .company .lead {
		margin-bottom: 1.2rem;
		font-size: 2.5rem;
		line-height: 1.52;
	}
	#main .company .linkList {
		clip-path: none;
	}
	#main .company .linkList li a {
		padding-right: 4.5rem;
		background-position: right center;
	}
	#main .work {
		padding: 1.8rem 0 7rem;
	}
	#main .work .imgBox {
		margin-bottom: 6.2rem;
		display: block;
	}
	#main .work .imgBox .photoBox {
		margin: 0 0 0 -2rem;
	}
	#main .work .imgBox .photoBox img {
		aspect-ratio: 370/196;
	}
	#main .work .imgBox .textBox {
		padding: 2.9rem 0 6.9rem;
	}
	#main .work .imgBox .textBox::after {
		width: auto;
		height: auto;
		left: -2rem;
		right: -2rem;
		top: -1.5rem;
		bottom: 0;
		background: #F5F5F8;
		clip-path: none;
		opacity: 1;
	}
	#main .work .subBox {
		margin-left: 0;
	}
	#main .work p {
		margin-bottom: 3.2rem;
	}
	#main .work .lead {
		margin-bottom: 1.2rem;
		font-size: 2.5rem;
		line-height: 1.52;
	}
	#main .work .linkList {
		clip-path: none;
	}
	#main .work h3 {
		margin-bottom: 3.4rem;
	}
	#main .life {
		padding-top: 6.4rem;
		z-index: 3;
	}
	#main .life::before {
		width: 100%;
		height: auto;
		max-height: 100%;
		background: linear-gradient(143deg, #DCFAFF -9.9%, rgba(220, 250, 255, 0) 59.12%);
		aspect-ratio: 390/426;
	}
	#main .life::after {
		margin-right: 0;
		width: 100%;
		right: 0;
		background: linear-gradient(144deg, rgba(14, 34, 80, 0) 44%, #E31F26 95.73%);
	}
	#main .life .imgBox {
		display: block;
	}
	#main .life .textBox .innerBox {
		max-width: initial;
		margin: 0 2rem 4.2rem;
	}
	#main .life .headLine05 {
		margin-bottom: 2.6rem;
	}
	#main .life p:not(.lead) {
		line-height: 1.875;
	}
	#main .life .lead {
		margin-bottom: 1.2rem;
		font-size: 2.5rem;
		line-height: 1.52;
	}
	#main .life .linkBox {
		margin-bottom: -3.6rem;
		width: auto;
	}
	#main .life .linkBox::before {
		display: none;
	}
	#main .life .list {
		margin-left: 2rem;
		gap: 1.4rem;
	}
	#main .life .list li {
		clip-path: polygon(7.57% 0, 100% 0, 100% 100%, 0 100%);
	}
	#main .life .list li:nth-of-type(1) {
		margin-left: 8.1%;
		clip-path: polygon(8.2% 0, 100% 0, 100% 100%, 0 100%);
	}
	#main .life .list li a img {
		height: auto;
		object-position: 0 50%;
		aspect-ratio: 370/147;
	}
	#main .life .list li:nth-of-type(1) a img {
		object-position: 0 50%;
		aspect-ratio: 340/147;
	}
	#main .life .list li a .txt {
		padding-right: 3.2rem;
		font-size: 2rem;
		left: 2.5rem;
		bottom: 1.3rem;
		background-size: 2.2rem;
	}
	#main .recruit {
		padding: 9.4rem 0 6.1rem;
		background-image: url(../img/index/recruit_bg_sp.webp);
		z-index: 2;
	}
	#main .recruit::after {
		display: none;
	}
	#main .recruit .headLine02 {
		margin-bottom: 1.2rem;
		line-height: 1.52;
	}
	#main .recruit p {
		margin-bottom: 2.2rem;
		line-height: 1.875;
	}
	#main .btnList {
		gap: 1.5rem;
	}
}
@media all and (max-width: 896px) and (max-height: 520px) {
	#main .mainVisual .fvBox .fvImg > img {
		max-height: calc(100svh - 20.6rem);
	}
}