@charset "UTF-8";
/* loading ---------------------------------------*/
.pace {
	-webkit-pointer-events: none;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.pace-inactive {
	display: none;
}

.pace .pace-progress {
	background: #fff;
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 100%;
	width: 100%;
	height: 2px;
}

.loading {
	position:fixed;
	left:0;
	top:0;
	width: 100%;
	height:100dvh;
	z-index:1000;
	background: #fff;
	transition: opacity .8s ease;
	opacity: 1;
	pointer-events: auto;
}

.loading.is-active {
	opacity: 0;
}

.loading-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	transform: translate(-50%, -50%);
	width: calc(172 / 1440 * 100vw);
}

.loading-logo img {
	display: block;
	width: 100%;
}


/* index ---------------------------------------*/
.indexheader {
	opacity: 0;
	transition: opacity 0.5s 0.8s ease;
}

.indexheader.is-active {opacity: 1;}

.index {
	background: var(--color-bg);
	overflow: hidden;
}

/* kv ---------------------------------------*/

.indexkv{
	position: relative;
	z-index: 2;
	background: var(--color-dark);
	color: #fff;
	padding: 0;
}

.indexkv-video {
	width: 100%;
	height: 100vh;
}

.indexkv-video video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.indexkv-title {
	position: absolute;
	top: 50%;
	left: 30%;
	z-index: 1;
	transform: translate(-50%, -50%) scale(0);
	width: calc(948 / 1440 * 100vw);
	opacity: 0;
	transition: transform 0.8s 1.1s ease;
	will-change: filter;
}

.indexkv.is-active .indexkv-title {
	animation: kvtitle-in 0.9s 1s cubic-bezier(0, 1.1, 0.3, 1.04) forwards;
}

@keyframes kvtitle-in {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0);
		filter: drop-shadow(0) brightness(0);
	}
	5% {
		transform: translate(-50%, -50%) scale(1, 0.5);
	}
	20% {
		opacity: 1;
	}
	60% {
		filter: drop-shadow(0 0 30px rgba(255, 255, 255, 0.4)) brightness(1.5);
	}
	70% {
		filter: drop-shadow(0 0 30px rgba(255, 255, 255, 0.4)) drop-shadow(0 0 30px rgba(255, 255, 255, 0.1)) brightness(2);
	}
	80% {
		transform: translate(-50%, -50%) scale(1.1, 1);
		filter: drop-shadow(0 0 30px rgba(255, 255, 255, 0.4)) brightness(1);
	}
	100% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1);
		filter: drop-shadow(0) brightness(1);
	}
}

.indexkv .kv-logo {
	opacity: 0;
	transition: opacity 0.5s 0.8s ease;
}
.indexkv.is-active .kv-logo {opacity: 1;}

.indexkv-title img {
	width: 100%;
}

.indexkv-scroll{
	position: absolute;
	bottom: 28px;
	left: 29.2%;
	transform: translateX(-50%);
	width: 103px;
	opacity: 0;
	transition: opacity 0.5s 0.8s ease;
}

.indexkv.is-active .indexkv-scroll {opacity: 1;}

.indexkv-scroll-inner {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 10;
	width: 103px;
	height: 103px;
	border-radius: 50%;
	background: #fff;
}

.indexkv-scroll-inner::after {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index: 1;
	width: 122px;
	height: 122px;
	border: 2px solid #fff;
	border-radius: 50%;
	content: '';
}

.indexkv-scroll-text{
	font-weight: 900;
	font-size: 14px;
	color: var(--color-primary);
}

.indexkv-scroll-line {
	position: absolute;
	top: 90px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	width: 2px;
	height: 76px;
	background: linear-gradient(to bottom, #fff 0, #fff 54%, var(--color-primary) 54%, var(--color-primary) 100%);
	animation: scroll-line 1.6s infinite ease;
}

@keyframes scroll-line {
	0% {clip-path: inset(0 0 100% 0);}
	50% {clip-path: inset(0 0 0 0);}
	51% {clip-path: inset(0 0 0 0);}
	100% {clip-path: inset(100% 0 0 0);}
}


/* section common ---------------------------------------*/

.indexvision,
.indexmission,
.indexmember,
.indexbusiness,
.indexcompany{
	position: relative;
	z-index: 1;
}


/* vision ---------------------------------------*/
.indexvision{
	padding: 154px var(--gutter) 174px;
}

.indexvision::before,
.indexvision::after {
	position: absolute;
	z-index: -1;
	content: '';
}

.indexvision::before {
	top: 0;
	left: -120px;
	width: 490px;
	height: 614px;
	background: url('../img/common/bg_deco_01.png') no-repeat center center / contain;
}

.indexvision::after {
	bottom: 60px;
	right: -40px;
	width: 413px;
	height: 529px;
	background: url('../img/common/bg_deco_02.png') no-repeat center center / contain;
}

.indexvision-diagram{
	max-width: 1080px;
	margin: 0 auto;
}

.indexvision-diagram img{
	width: 100%;
	height: auto;
}

/* mission ---------------------------------------*/
.indexmission{
	padding: 154px var(--gutter) 80px;
}

.indexmission::before,
.indexmission::after {
	position: absolute;
	z-index: -1;
	content: '';
}

.indexmission::before {
	top: 0;
	left: -120px;
	width: 490px;
	height: 614px;
	background: url('../img/common/bg_deco_01.png') no-repeat center center / contain;
}

.indexmission::after {
	bottom: 0px;
	right: 0px;
	width: 413px;
	height: 529px;
	background: url('../img/common/bg_deco_02.png') no-repeat center center / contain;
}

.indexmission-navlist{
	margin: 32px auto 40px;
}


/* culture ---------------------------------------*/
.indexculture{
	padding: 40px var(--gutter) 160px;
}

.indexculture-inner{
	position: relative;
	z-index: 2;
}

.indexculture-body{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
	background: var(--color-primary);
	border-radius: 60px;
	overflow: hidden;
	box-shadow: 40px 40px 0 rgba(235,72,39,0.2);
}

.indexculture-detail{
	margin-bottom: 32px;
	width: calc(590 / 1240 * 100%);
	padding: 96px calc(20 / 1240 * 100%) 70px calc(52 / 1240 * 100%);
}

.indexculture-navlist {
	justify-content: flex-start;
}

.indexculture-image {
	flex: 1;
}

.indexculture-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/* member ---------------------------------------*/
.indexmember{
	position: relative;
	z-index: 2;
	color: #fff;
	padding: calc(60 / 1440 * 100vw) var(--gutter) calc(100 / 1440 * 100vw);
}

.indexmember::before{
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: calc(100% - calc(60 / 1440 * 100vw));
	background: var(--color-primary);
	z-index: 0;
}

.indexmember-inner{
	position: relative;
	z-index: 2;
}

.indexmember-body{
	width: calc(530 / 1240 * 100%);
	margin-left: auto;
	margin-right: 0;
	padding: calc(94 / 1440 * 100vw) 0 0;
}

.indexmember-navlist {
	justify-content: flex-start;
}

.indexmember-image{
	position: absolute;
	left: 0;
	top: 0;
	width: min(calc(760 / 1440 * 100vw), 900px);
	overflow: hidden;
	z-index: 1;
	border-radius: 0 60px 60px 0;
}

.indexmember-image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}


/* business ---------------------------------------*/
.indexbusiness{
	padding: 240px var(--gutter) 200px;
}

.indexbusiness::before {
	position: absolute;
	top: -210px;
	left: -120px;
	z-index: -1;
	width: 490px;
	height: 614px;
	background: url('../img/common/bg_deco_01.png') no-repeat center center / contain;
	content: '';
}

.indexbusiness-inner{
	position: relative;
	z-index: 2;
}

.indexbusiness-body{
	width: 43.7%;
	max-width: 542px;
	margin-left: 0;
	margin-right: auto;
}

.indexbusiness-navlist {
	justify-content: flex-start;
}

.indexbusiness-image{
	position: absolute;
	right: 0;
	top: 120px;
	width: min(calc(760 / 1440 * 100vw), 760px);
	z-index: 1;
}

.indexbusiness-image::before {
	position: absolute;
	bottom: -30px;
	left: -40px;
	z-index: -1;
	height: 100%;
	aspect-ratio: 1/1;
	background: rgba(235,72,39,0.2);
	border-radius: 50%;
	content: '';
}

.indexbusiness-image img {
	width: 100%;
}

/* company ---------------------------------------*/
.indexcompany{
	position: relative;
	padding: calc(50 / 1440 * 100vw) var(--gutter) calc(160 / 1440 * 100vw);
}

.indexcompany-inner{
	position: relative;
	z-index: 3;
}

.indexcompany-body{
	position: relative;
	width: calc(923 / 1240 * 100%);
	margin-left: auto;
	margin-right: 0;
	background: var(--color-primary);
	border-radius: 60px;
	z-index: 2;
	box-shadow: 40px 40px 0 rgba(235,72,39,0.2);
}

.indexcompany-body-inner{
	width: calc(560 / 923 * 100%);
	margin-left: auto;
	margin-right: 0;
	padding: calc(100 / 1440 * 100vw) calc(30 / 1440 * 100vw) calc(100 / 1440 * 100vw);
}

.indexcompany-navlist {
	justify-content: flex-start;
}

.indexcompany-image{
	position: absolute;
	left: 0;
	top: 0;
	width: min(calc(760 / 1440 * 100vw), 760px);
	z-index: 4;
}

.indexcompany-image img{
	width: 100%;
	display: block;
}

/* large pc ---------------------------------------*/
@media screen and (min-width: 1921px){
	.indexmember {
		padding: calc(60 / 1440 * 100vw) var(--gutter) calc(200 / 1440 * 100vw);
	}

	.indexmember-image {
    width: 1000px;
	}

	.indexcompany-body {
    width: 90%;
	}

	.indexcompany-body-inner {
    width: 560px;
		padding: calc(100 / 1440 * 100vw) calc(30 / 1440 * 100vw) calc(200 / 1440 * 100vw);
	}

	.indexcompany-image {
    width: 1000px;
	}
}

@media screen and (min-width: 2401px){
	.indexmember {
		padding: 100px var(--gutter) 334px;
	}
	
	.indexmember-image {
    width: 1200px;
	}

	.indexcompany-body {
    width: 100%;
	}

	.indexcompany-body-inner {
		padding: calc(100 / 1440 * 100vw) calc(30 / 1440 * 100vw) 420px;
	}

	.indexcompany-image {
    width: 1200px;
	}
}

/* small pc ---------------------------------------*/
@media screen and (max-width: 999px){
	/* culture ---------------------------------------*/
	.indexculture{
		padding: 0 var(--gutter) 150px;
	}

	.indexculture .section-title,
	.indexculture .section-lead,
	.indexculture .section-text,
	.indexculture .btn-wrapper {text-align: center;}

	.indexculture-body{
		flex-direction: column;
		position: relative;
		border-radius: 20px;
		box-shadow: unset;
		overflow: visible;
	}

	.indexculture-body::before {
		position: absolute;
		top: 40px;
		left: 20px;
		z-index: -1;
		width: 100%;
		height: calc(100% - 10px);
		background: rgba(235,72,39,0.2);
		border-radius: 20px 0 0 20px;
		content: '';
	}

	.indexculture-detail{
		width: 100%;
		padding: 80px 21px 100px;
		margin-bottom: 0;
	}

	.indexculture-navlist {
		justify-content: center;
	}

	.indexculture-image {
		aspect-ratio: 1.1 / 1;
		border-radius: 0 0 20px 20px;
		overflow: hidden;
	}

	/* member ---------------------------------------*/
	.indexmember{
		padding: calc(calc(304 / 390 * 100vw) + 80px) var(--gutter) 85px;
	}

	.indexmember::before{
		height: calc(100% - calc(65 / 390 * 100vw));
	}

	.indexmember .section-title,
	.indexmember .section-lead,
	.indexmember .section-text,
	.indexmember .btn-wrapper {text-align: center;}

	.indexmember-body{
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}

	.indexmember-navlist {
		justify-content: center;
	}

	.indexmember-image{
		width: calc(350 / 390 * 100vw);
		border-radius: 0 20px 20px 0;
	}


	/* business ---------------------------------------*/
	.indexbusiness{
		padding: calc(calc(240 / 390 * 100vw) + 40px) var(--gutter) 120px;
		overflow: hidden;
	}

	.indexbusiness .section-title,
	.indexbusiness .section-lead,
	.indexbusiness .section-text,
	.indexbusiness .btn-wrapper {text-align: center;}

	.indexbusiness::before {
		top: -14px;
		left: 0;
		width: 180px;
		height: 226px;
	}

	.indexbusiness-body{
		width: 100%;
		max-width: unset;
	}

	.indexbusiness-navlist {
		justify-content: center;
	}

	.indexbusiness-image{
		top: calc(-48 / 390 * 100vw);
		width: calc(223 / 390 * 100vw);
	}

	.indexbusiness-image::before{
		bottom: -10px;
		left: -12px;
	}


	/* company ---------------------------------------*/
	.indexcompany{
		padding: calc(170 / 390 * 100vw) var(--gutter) 150px;
	}

	.indexcompany .section-title,
	.indexcompany .section-lead,
	.indexcompany .section-text,
	.indexcompany .btn-wrapper {text-align: center;}

	.indexcompany-body{
		width: 100%;
		margin: 0 auto;
		border-radius: 20px;
		box-shadow: unset;
	}

	.indexcompany-body::before {
		position: absolute;
		top: 40px;
		left: 20px;
		z-index: -1;
		width: 100%;
		height: calc(100% - 10px);
		background: rgba(235,72,39,0.2);
		border-radius: 20px 0 0 20px;
		content: '';
	}

	.indexcompany-body-inner{
		width: 100%;
		margin: 0 auto;
		padding: calc(calc(210 / 390 * 100vw) + 80px) 20px 80px;
	}

	.indexcompany-image{
		width: calc(350 / 390 * 100vw);
	}

	.indexcompany-navlist {
		justify-content: center;
	}
}

@media screen and (min-width: 768px) and (max-width: 900px){
	.indexcompany .section-title-en {
    font-size: 58px;
	}
}


/* sp only ---------------------------------------*/

@media screen and (max-width: 767px){
	/* loading ---------------------------------------*/
	.loading-logo {
		width: calc(147 / 390 * 100vw);
	}


	/* kv ---------------------------------------*/
	.indexkv{
		overflow: visible;
	}

	.indexkv-title {
		top: 40%;
		left: 50%;
		width: calc(390 / 390 * 100vw);
	}

	.indexkv-scroll{
		bottom: 20px;
		left: 50%;
		width: 82px;
	}

	.indexkv-scroll-inner {
		width: 82px;
		height: 82px;
	}
	
	.indexkv-scroll-inner::after {
		width: 96px;
		height: 96px;
	}

	.indexkv-scroll-text{
		font-size: 11px;
	}

	.indexkv-scroll-line {
		top: 58px;
		height: 72px;
		background: linear-gradient(to bottom, #fff 0, #fff 61%, var(--color-primary) 61%, var(--color-primary) 100%);
	}

	/* vision ---------------------------------------*/
	.indexvision{
		padding: 118px var(--gutter) 100px;
	}

	.indexvision::before {
		left: 0;
		width: 180px;
		height: 226px;
	}

	.indexvision::after {
		display: none;
	}

	.indexvision-diagram{
		max-width: unset;
	}


	/* mission ---------------------------------------*/
	.indexmission{
		padding: 118px var(--gutter) 120px;
	}

	.indexmission::before {
		display: none;
	}

	.indexmission::after {
		bottom: 10px;
		width: 152px;
		height: 195px;
	}

	.indexmission-navlist{
		margin: 22px auto 40px;
	}

}