@charset "UTF-8";


@media (min-width: 992px) {
	#mv.page__thumbnail .main-img {
		height: 100svh;
	}
	.page__thumbnail {
		position: relative;
		z-index: 2;
	}
	.page__thumbnail .page-ttl {
		padding: 1em 0;
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 2;
		transform: translate(-50%,-50%);
	}
}



#intro {
	position: relative;
}
#intro .bg {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 1000px;
  overflow-x: hidden;
  overflow-y: visible;
}
#intro .bg::before {
	content: '';
	display: block;
	width: 1000px;
	aspect-ratio: 1/1;
	border-radius: 100%;
	background: var(--l-gray);
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

@media (min-width: 576px) and (max-width: 991px) {
	#intro .container {
		overflow: hidden;
	}
}
@media (min-width: 992px) {
	#intro .bg {
		top: 50%;
		transform: translateY(-50%);
	}
	#intro .bg::before {
		top: 50%;
		transform: translate(-50%,-50%);
	}
}



@media (max-width: 991px) {
	#cont1 .txtBox {
		margin-top: -2.25rem;
	}
	#cont1 .sect-ttl[data-label] {
		display: inline-flex;
		padding-right: 3.5em;
		margin-bottom: 0;
	}
	#cont1 .sect-ttl[data-label]::before {
		left: 0;
		transform: translateX(0);
	}
	#cont1 .sect-ttl[data-label] .ttl > span {
		transform: translateX(-.4em);
	}
}




@media (min-width: 992px) {
	#container {
	    overflow: visible;
	}
	._sticky-wrap {
		position: relative;
	}
	._sticky {
		position: sticky;
		top: 160px;
	}
}




#cont3 .page__thumbnail {
	position: relative;
	z-index: 2;
}
#cont3 .page__thumbnail .page-ttl {
	padding: 1em 0;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%,-50%);
}



.flow-content {
	overflow: hidden;
	position: relative;
}
.flow-content::before {
	content: '';
	display: block;
	width: 1px;
	background: var(--border2);
	position: absolute;
	top: 0;
	left: 3px;
	bottom: 0;
	transform: translateX(50%);
}

ol.flow li {
	padding-bottom: 3rem;
}

ol.flow .headline {
	color: var(--color1);
	padding-left: 3rem;
	position: relative;
}
ol.flow .headline::before {
	content: '';
	display: block;
	width: 8px;
	height: 8px;
	border-radius: 100%;
	background: var(--color3);
	position: absolute;
	top: .65em;
	left: 0;
}

ol.flow li .row {
	row-gap: 1.5rem;
}
ol.flow li .row .copy {
	margin-bottom: 1.25rem;
}
ol.flow li .row p {
	margin-top: 1.25rem;
}

@media (max-width: 991px) {
	ol.flow li .headline {
		font-size: 118%;
	}
	ol.flow li .row {
		padding-left: 3rem;
	}
}