@charset "utf-8";

/*-------------------------------
	ファーストビュー
-------------------------------*/
	
.firstview{
	width: 100%;
		/* aspect-ratio: 1600 / 1053; */
		max-height: 100vh;
		/*height: calc(100vh - 13.6rem);*/
		height: calc(100vh - 10.6rem + 5rem); /*--- (-header+radius)*/
    border-radius: 5rem;
    position: relative;
    overflow: hidden;
}
	.firstview::before {
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
		z-index: 4000;
		background: rgba(27, 60, 82, .3);
	}
/* -------- .scroll-area --- */	
.scroll_down{
	width: 2rem;
	height: 23rem;
	display: flex;
	flex-direction: column;
		align-items: center;
		justify-content: flex-start;
	position: absolute;
		right: 7.6rem;
		bottom: 10%; /*16rem;*/
	z-index: 5000;
}
.scroll_down span{
	font-size: 1.2rem;
		line-height: 1;
		color: #fff;		
		writing-mode: tb-rl;
}
	.scroll_down:before { /*点*/
		width: .8rem;
		height: .8rem;
		border-radius: 50%;
		position: absolute;
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			-webkit-transform: translateX(-50%);
		background: #fff;
		content: "";
		animation:
		circlemove 1.6s ease-in-out infinite,
		cirlemovehide 1.6s ease-out infinite;
	}
	.scroll_down:after{ /*線*/
		width: 1px;
		height: 16.5rem;
		content: "";
		position: absolute;
			left: 50%;
			bottom: 0;
			transform: translateX(-50%);
			-webkit-transform: translateX(-50%);
		background: #fff;
	}
	@keyframes circlemove{
		0%{		bottom: 68.5%;	}
		100%{		bottom: 0px;	}
	}
	@keyframes cirlemovehide{
		0%{		opacity:0;	}
		50%{		opacity:1;	}
		80%{		opacity:0.9;	}
		100%{		opacity:0;	}
	}
/* -------- .scroll-area --- */	


.firstview__circle{ /*-----------RECRUITくるくる------*/
	position: absolute;
		right: 4rem;
		top: 5.7rem;
	animation: 15s linear infinite rotation;
	z-index: 5000;
}
.firstview__circle img.ofi__contain{
	width: 20rem; /*26rem;*/
	height: 20rem; /*26rem;*/
	display: block;
}
	@keyframes rotation{
		0%{ transform:rotate(0);}
		100%{ transform:rotate(360deg); }
	}

.firstview__txt{	/*-----------文字-----*/
	width: 100%;
	position: absolute;
		left: 0;
		top: 68%; /*65%;*/
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
	z-index: 6000;
}
.firstview__inner{
	position: relative;
	display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-direction: column;
}
.firstview__title__jp{
	margin-bottom: 3rem; /*3.3rem;*/
	font-size: 9rem; /*10rem*/
		letter-spacing: 0.1em;
		line-height: 1.2;
		font-weight: 700;
	color: #fff;
	display: block;
}
.firstview__title__en{
	font-family: var(--en_font1);
	background: var(--gradcolor);
	height: 4.5rem;
	font-size: 2.4rem;
		padding: .4rem 4.6rem .4rem 2.32rem;
		letter-spacing: .05em;
		font-weight: 400;
	line-height: 1;
	color: #fff;
	clip-path: polygon(0 0, 100% 0, 93.33333334% 100%, 0% 100%);
}

.firstview__img{ /*-----------画像------*/
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 3000;
}
	.fv__swiper,
	.fv__swiper .swiper-img{
		width: 100%;
		height: 100%;
		display: block;
	}
	@keyframes zoomUp {
		0% {
		transform: scale(1.15);
		}
		100% {
		transform: scale(1.0);
		}
	}
	.fv__swiper .swiper-slide-active .swiper-img,
	.fv__swiper .swiper-slide-duplicate-active .swiper-img,
	.fv__swiper .swiper-slide-prev .swiper-img {
		animation: zoomUp 7s linear 0s normal both;
	}
@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){
	.firstview {
		aspect-ratio: 1600 / 1350;
		min-height: unset;
	}
	.scroll_down {
		bottom: 6vw;
	}

	.firstview__circle img.ofi__contain {
		width: 22vw;
		height: 22vw;
	}
	.firstview__title__jp{
        font-size: 8.5rem;
	}
}
@media screen and (max-width:960px) and (min-width: 769px){
	.firstview__title__jp {
        font-size: 9vw;
    }
}
@media screen and (max-width:768px){
	.firstview{
		width: 100%;
			aspect-ratio: 750 / 1191;
	}		
	.firstview__circle img.ofi__contain{
		width: 26rem; 
		height: 26rem; 
	}
	/* -------- .scroll-area --- */	
	.scroll_down{
		height: 20rem;
			right: 3rem;
			bottom: 5rem;
	}
	.scroll_down span {
		font-size: 1.4rem;
	}
		.scroll_down:after{ /*線*/
			height: 11rem;
		}
	/* -------- .scroll-area --- */	

	.firstview__circle{ /*-----------RECRUITくるくる------*/
			right: 3rem;
			top: 3.7rem;
		animation: 15s linear infinite rotation;
	}
	
	.firstview__txt{	/*-----------文字-----*/
        top: 70%;
	}
	.firstview__inner{
	}
	.firstview__title__jp{
		margin-bottom: 3.3rem;
        font-size: 8.5rem;
	}
	.firstview__title__en{}
	
	.firstview__img{ /*-----------画像------*/
		position: relative;
		z-index: 3000;
	}
}

/*-------------------------------
	main
-------------------------------*/
main{
	padding-top: 0 !important;
	position: relative;
}
	main::before {
		content: "";
		display: block;
		width: 100%;
		height: calc(8rem + 5rem); /*main上余白+FV radius*/
		position: absolute;
			left: 0;
			top: -5rem;
		z-index: 0;
		background: var(--bg-graycolor);
	}
	
@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}

/*-------------------------------
	topmessage
-------------------------------*/
.sec:first-child{
	padding-top: 28rem;
}
.topmessage{
	/*padding-top: 24rem;*/
	padding-bottom: 20.4rem; /*25.5rem;*/
	background: var(--bg-graycolor);
	position: relative;
	overflow: hidden;
}

	.topmessage__inner{
		position: relative;
	}
	/*------bg__circle----*/
	.topmessage .bg__circle.c-01{
		top: -10rem;
		right: -17rem; 
	}	
	.topmessage .bg__circle.c-02{
		top: 10rem;
		right: -24rem; 
		z-index: 1;
	}
	/*------bg__circle----*/

.topmessage__title{
	position: relative;
}
.topmessage-title__jp {
    margin-bottom: 15.3rem;
    font-size: 2.5rem; /*3rem;*/
		letter-spacing: 0.05em;
		line-height: 2;
		font-weight: 600;
		text-align: center;
		font-family: var(--font-Mincho);
    display: block;
	position: relative;
	z-index: 3000;
}
.topmessage-title__jp::after{
	content: "";
	display: block;
	width: 1px;
	height: 7.6rem;
	background: #333;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -9rem;
	margin-left: auto;
	margin-right: auto;
}
.topmessage-title__img{
	width: 100%;
		max-width: 62.2rem;/*77.8rem;*/
	position: absolute;
		top: -13.6rem;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
	z-index: 2000;
}
	.topmessage-title__img img{
		width: 100%;
		max-width: unset;
	}

.topmessage-block01{
	margin-bottom: 14.5rem;/*15.3rem;*/
	display: flex;
		justify-content: space-between;
		/*align-items: stretch;*/		
		align-items: center;
	position: relative;
}
	/*------bg__circle----*/
	.topmessage .bg__circle.c-03{
		top: -10rem;
		left: -50rem; 
	}
	/*------bg__circle----*/

.topmessage-block01__text {
	width: 48.5rem;
    font-size: 1.8rem; /*2rem;*/
		letter-spacing: .01em;
		line-height: calc(7 / 2);
    text-align: left;
}
.topmessage-block01__img{
	width: calc(100% - 48.5rem - 4rem);
		max-width: 48.6rem;
	border-radius: 1rem;
	overflow: hidden;
}

.topmessage-block02{
	display: flex;
		justify-content: space-between;
		align-items: stretch;
	position: relative;
}
	/*------bg__circle----*/
	.topmessage .bg__circle.c-04{
		top: -10rem;
		left: -60rem; 
	}
	.topmessage .bg__circle.c-05{
		top: 15rem;
		left: -45rem; 
	}
	/*------bg__circle----*/

.topmessage-block02__cont{
	width: 45.6%;
}
.topmessage-block02__sub-title {
    margin-bottom: 5.3rem;
	text-align: center;
}
.topmessage-block02__sub-title .C-sub-title__jp{
	font-size: 2.1rem; /*2.4rem;*/
		color: var(--maincolor);
		letter-spacing: .03em;
}
.topmessage-block02__p{
	line-height: 2.22222;
	letter-spacing: 0.01em;
	text-align: justify;
}

@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){
	
	.topmessage__title{
		position: relative;
	}
	.topmessage-title__jp {
		margin-bottom: 9rem;
			line-height: 1.75;
	}
	.topmessage-title__jp::after{
		width: 2px;
		height: 7.6rem;
			background: var(--blackcolor);
		position: relative;
        bottom: -4.6rem;
			left: 50%;
			transform: translateX(-50%);
			-webkit-transform: translateX(-50%);
		display: block;
		content: "";
	}
	.topmessage-block01{	
        width: 100%;
        	max-width: 75rem;	
			margin-left: auto;
			margin-right: auto;
		flex-direction: column;
			justify-content: center;
			align-items: center;
			gap: 6rem;
	}
	.topmessage-block01__text{
		width: auto;
	}
	.topmessage-block01__img{
		width: 100%;
		max-width: unset;
		border-radius: 1.5rem;
	}
}
@media screen and (max-width:768px){
	.topmessage{
		padding-bottom: calc(var(--padding-topbottom) + 5rem);
	}	
	.sec:first-child{
		padding-top: 25.8rem;
	}	
		/*------bg__circle----*/
		.topmessage .bg__circle.c-01{
			top: -8rem;
			right: -36rem;
		}	
		.topmessage .bg__circle.c-02{
			width: 45rem;
			height: 45rem;
			top: 43rem;
			right: -20rem;
		}
		/*------bg__circle----*/
	
	.topmessage__title{
		position: relative;
	}
	.topmessage-title__jp {
		margin-bottom: 21rem;
		font-size: 4rem;
			line-height: 1.75;
	}
	.topmessage-title__jp::after{
		bottom: -11.5rem;
	}
	.topmessage-title__img{
			top: -13rem;
	}
	
	
	.topmessage-block01{	
        width: 100%;
			max-width: 75rem;
		margin-bottom: 15rem;	
		flex-direction: column;
			justify-content: center;
			align-items: center;
	}
		/*------bg__circle----*/
		.topmessage .bg__circle.c-03{
			display: none;
		}
		/*------bg__circle----*/
	
		.topmessage-block01__text{
			width: auto;
			font-size: 3rem;
			line-height: calc(9 / 3);
		}
		.topmessage-block01__img{
			width: 100%;
			height: 42.7rem;
			max-width: unset;
			border-radius: 1.5rem;
			margin-top: 14.8rem;
		}
	
	.topmessage-block02{
		flex-direction: column;
			justify-content: center;
			align-items: center;
	}
		/*------bg__circle----*/
		.topmessage .bg__circle.c-04{
			top: unset;
			bottom: -5rem;
			left: -40rem;
		}
		.topmessage .bg__circle.c-05{
			top: unset;
			bottom: -36rem;
			left: -12.5rem; 
		}
		/*------bg__circle----*/
	
	.topmessage-block02__cont{
		width: 100%;
	}
	.topmessage-block02__cont + .topmessage-block02__cont{
		margin-top: 13rem;
	}
	.topmessage-block02__sub-title {
		margin-bottom: 5.5rem;
	}
	.topmessage-block02__sub-title .C-sub-title__jp{
		font-size: 3.6rem;
	}
	
}


/*-------------------------------
	共通
-------------------------------*/
.Contvisual__title{
	position: relative;
	display: flex;
		align-items: flex-start;
		justify-content: center;
		flex-direction: column;
}
.Contvisual__title__jp{
	background: var(--gradcolor);
	width: 21.6rem; /*27rem;*/
	height: 3.6rem; /* 4.5rem;*/
	font-size: 2.4rem; /*3rem;*/
	margin-bottom: 1rem;
	padding-top: .4rem;
	padding-bottom: .4rem;
		font-weight: 700;
		letter-spacing: .1em;
		line-height: 1;
		color: #fff;
	display: flex;
		align-items: center;
		justify-content: center;
	clip-path: polygon(0 0, 100% 0, 93.33333334% 100%, 0% 100%);
}
.Contvisual__title__en{
	font-family: var(--en_font1);
	font-size: 7.2rem; /*9rem*/
		letter-spacing: 0;
		line-height: 1;
		color: #fff;
	display: block;
}
.Contvisual__title__en.-gray{
	color: var(--graycolor);
}
@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

	.Contvisual__title__jp{
		width: 27rem;
		height: 4.5rem;
		font-size: 3rem;
		margin-bottom: 1rem;
		padding-top: .4rem;
		padding-bottom: .4rem;
	}
	.Contvisual__title__en{
		font-size: 9rem; 
	}
}

/*-------------------------------
	campany
-------------------------------*/
.campany{
	margin-top: -5rem;
	padding-top: 21rem;
	padding-bottom: 16.3rem;
    background-image: url(../images/index/company-bg.jpg);
    background-image: image-set(url(../images/index/company-bg.jpg) 1x, url(../images/index/company-bg@2x.jpg) 2x);
		border-top-left-radius: 5rem;
		border-top-right-radius: 5rem;
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}
	.campany::before {
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
		z-index: 3000;
		background: rgba(62, 120, 159, .3);
	}
.campany__inner{
	position: relative;
	z-index: 4000;
}
.campany .Contvisual__title{
	margin-bottom: 12.8rem; /*16rem*/
}

.company-link__block{
	display: flex;
		justify-content: center;
		align-items: stretch;
		gap: 5.2727272727%;
}
.company-link__items {
	width: calc((100% - (5.2727272727% * 2)) / 3);
	display: block;
}
.company-link__items a{
	width: 100%;
	height: 100%;
		padding: 5.7rem 2.6rem 2.6rem 2.6rem;
		border-radius: 1rem;
	background: #fff;
	display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
	position: relative;
	transition: var(--transition-time);
}
	.company-link__items a::after{
		width: 1.8rem;
		height: 1.8rem;
		background-image: url(../images/index/company-img-arrow.svg);
			background-size: contain;
			background-repeat: no-repeat;
			background-position: center;
		position: absolute;
			right: 2rem;
			top: 50%;
			transform: translateY(-50%);
			-webkit-transform: translateY(-50%);
		content: "";
		z-index: 5000;
	}
	.company-link__items a:hover{
		opacity: 1;
		transform: translateY(-0.5rem);
		background: var(--bg-bluecolor);
	}
.c-l__items__img{
	background: var(--bg-graycolor);
	width: 15.6rem;
	height: 15.6rem;
		padding: 2.8rem;
		border-radius: 50%;
	margin-bottom: 1.4rem;
	display: flex;
		align-items: center;
		justify-content: center;
	transition: var(--transition-time);
}
	.company-link__items:nth-of-type(1) .c-l__items__img{
		padding: 3.85rem;
	}
	.company-link__items a:hover .c-l__items__img{
		transform: scale(1.1);
	}
.c-l__items__mds{
	font-size: 2.1rem; /*2.4rem;*/
		letter-spacing: 0;
		height: calc((2.4rem * 1.5) * 2);
		line-height: 1.5;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 700;
		color: var(--maincolor);
		text-align: center;
	transition: var(--transition-time);
}
	.company-link__items a:hover .c-l__items__mds{
		transform: scale(1.1);
	}

@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

	.company-link__block{
		max-width: 63rem;
		margin-left: auto;
		margin-right: auto;
		flex-direction: column;
			gap: 3.4rem;
	}
	.company-link__items {
		width: 100%;
	}
	.company-link__items a {
		padding: 2.4rem 10rem 2.4rem 6rem;
		border-radius: 1.5rem;
		flex-direction: row;
		justify-content: flex-start;
		gap: 7rem;
	}
	.c-l__items__img {
		margin-bottom: 0;
	}
	.c-l__items__mds {
		font-size: 3rem;
	}
	.company-link__items a::after {
		width: 4rem;
		height: 4rem;
		right: 5rem;
	}
}
@media screen and (max-width:768px){

	.campany{
		margin-top: -5rem;
		padding-top: 15.2rem;
		padding-bottom: 15rem;
	}
	.campany .Contvisual__title{
		margin-bottom: 20.5rem;
	}
	
	.company-link__block{
		max-width: 63rem;
		margin-left: auto;
		margin-right: auto;
		flex-direction: column;
			gap: 3.4rem;
	}
	.company-link__items {
		width: 100%;
	}
	.company-link__items a {
		padding: 2.4rem 10rem 2.4rem 6rem;
		border-radius: 1.5rem;
		flex-direction: row;
		justify-content: flex-start;
		gap: 7rem;
	}
	.c-l__items__img {
		margin-bottom: 0;
		padding: 2.8rem;
	}
	.c-l__items__mds {
		font-size: 3rem;
		height: calc((3rem * 1.5) * 2);
	}
	.company-link__items a::after {
		width: 4rem;
		height: 4rem;
		right: 5rem;
	}
}





/*-------------------------------
	仕事を知る　works
-------------------------------*/
.works{
	padding-top: 16rem; /*20rem;*/
	padding-bottom: 16rem; /*20rem;*/
	background: var(--maincolor);
	position: relative;
	overflow: hidden;
}
	.works::after{
		width: 100%;
		height: 100%;
		background: #fff;
			border-bottom-right-radius: 5rem;
		position: absolute;
			left: 0;
			bottom: 0;
		display: block;
		content: "";
		z-index: 1;
	}
.works__inner{
	display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
	position: relative;
	z-index: 1000;
}
	.works .Contvisual__title{
		margin-bottom: 6.5rem;
	}
	.works__txt {
		width: 50%;
		flex: 0 0 59.4rem;
	}
	.works__txt .C-button {
		margin-left: 0;
		margin-right: auto;
	}
	.works__img {
		width: calc(100vw / 2);
		height: 48.24rem; /*53.6rem;*/
		flex: 1;
			margin-right: calc(50% - 50vw);
			border-top-left-radius: 2rem;
			border-bottom-left-radius: 2rem;
		display: block;
		overflow: hidden;
	}
@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){
	.works__inner .Contvisual__title{
		margin-bottom: 5rem;
	}
		.works__txt {
			width: 100%;
			margin-bottom: 8.5rem;
			flex: unset;
		}
		.works__img {
			width: 100vw;
			height: 53.6rem;
			flex: unset;
				margin-right: calc(50% - 50vw);
			display: block;
			overflow: hidden;
		}
}
@media screen and (max-width:768px){
	.works{
		padding-top: 15rem;
		padding-bottom: 13.5rem;
	}
	.works__inner .Contvisual__title{
		margin-bottom: 5.5rem;
	}
		.works__txt {
			width: 100%;
			margin-bottom: 8.5rem;
			flex: unset;
		}
		.works__txt .C-button {
			width: 36rem;
		}
		.works__txt .C-button + .C-button{
			margin-top: 5.4rem;
		}
		.works__img {
			width: 100vw;
			flex: unset;
				margin-right: calc(50% - 50vw);
			display: block;
			overflow: hidden;
		}
}



/*-------------------------------
	採用情報 recruit
-------------------------------*/
.recruit{
	padding-top: 0;
	padding-bottom: 0;
	background: var(--bg-graycolor);
	position: relative;
	overflow: hidden;
}
	/*-----ドア---*/
	.door__block{
		width: 100%;
		height: 100%;
		position: absolute;
			left: 0;
			top: 0;
		display: flex;
			justify-content: space-between;
		z-index: 3000;
		transition: all 1s;
	}
	/*-----左右ドア外枠---*/
	.door__left,
	.door__right{
		width: 50%;
		height: 100%;
		/*position: relative;*/		
		position: absolute;
			top: 0;
			perspective-origin: top;
			transition-duration: .7s;
			transition-property: all;
	}
		.door__left{
			left: 0;
			transition-timing-function: cubic-bezier(.4,0,.2,1);
		}
		.door__right{
			right: 0;
			transition-timing-function: cubic-bezier(.4,0,.2,1);
		}
		
	/*-----左右ドア中枠(picture)---*/
	.door__img{
		width: 100%;
		height: 100%;
		display: block;
		position: absolute;
			transition-duration: .7s;
			transition-property: all;
		overflow: hidden;
	}	
		.door__left .door__img{
			transform-origin: left;
			transform: translate3d(-1%,0,0) rotateX(0) rotateY(0deg) rotate(0) rotate3d(0,0,0,0deg) skew(0) skewY(0) scale3d(1, 1, 1) !important;
				--tw-rotate-y: 0deg;
			transition-timing-function: cubic-bezier(.4,0,.2,1);
		}		
		.door__right .door__img{
			transform-origin: right;
			transform: translate3d(-1%,0,0) rotateX(0) rotateY(0deg) rotate(0) rotate3d(0,0,0,0deg) skew(0) skewY(0) scale3d(1, 1, 1) !important;
				--tw-rotate-y: 0deg;
			transition-timing-function: cubic-bezier(.4,0,.2,1);			
		}
		.door__img::before{
			width: 100%;
			height: 100%;
			position: absolute;
				left: 0;
				top: 0;
				transition-duration: 1s;
				transition-property: opacity;
			z-index: 10;
			opacity: 0;
			display: block;
			content: "";
		}
		.door__left .door__img::before{
			background-image: linear-gradient(90deg, rgba(0,0,0,0.0), rgba(0,0,0,0.15));
			transition-timing-function: cubic-bezier(.4,0,.2,1);
		}
		.door__right .door__img::before{
			background-image: linear-gradient(270deg, rgba(0,0,0,0.0), rgba(0,0,0,0.15));
			transition-timing-function: cubic-bezier(.4,0,.2,1);

		}
		
	/*-----左右ドア中枠内 imgタグ---*/
	.door__left .door__img img.ofi__cover,
	.door__right .door__img img.ofi__cover{
		position: absolute;
			--tw-scale-x: 1.08;
		opacity: 1;
	}		
		.door__left .door__img img.ofi__cover{
			object-position: left center;
			transform: translate(0,0) rotate(0) skew(0) skewY(0) scaleX(1.08) scaleY(1);
		}
		.door__right .door__img img.ofi__cover{
			object-position: right center;
			transform: translate(0,0) rotate(0) skew(0) skewY(0) scaleX(1.08) scaleY(1);
		}
		
	/* --door open時js .now__open--*/
		.door__block.now__open{
			z-index: 0;
		}
		/*-----左右ドア外枠---*/
		.door__block.now__open .door__left ,
		.door__block.now__open .door__right{
			width: 33%;
			perspective: 2000px;
		}
			/*.door__block.now__open .door__left {
				transform: skewY(-10deg); /* 左ドアをY軸回転させつつ、Y軸方向に伸ばす（傾ける） 
				transform-origin: left; /* 左ドアの右端を基準に回転 
			}	
			.door__block.now__open .door__right {
				transform: skewY(10deg); /* 右ドアをY軸回転させつつ、Y軸方向に伸ばす（傾ける） 
				transform-origin: right; /* 右ドアの左端を基準に回転 
			}*/
		/*-----左右ドア中枠(picture)---*/
		.door__block.now__open .door__img{
			transition-property: all;
		}	
			.door__block.now__open .door__left .door__img{
				--tw-translate-x: 0%;		
				transform: translate3d(0%,0,0) rotateX(0) rotateY(35deg) rotate(0) rotate3d(0,0,0,0deg) skew(0) skewY(0) scale3d(1, 1, 1) !important;
					--tw-rotate-y: 35deg;
			}		
			.door__block.now__open .door__right .door__img{
				--tw-translate-x: 0%;
				transform: translate3d(0%,0,0) rotateX(0) rotateY(-35deg) rotate(0) rotate3d(0,0,0,0deg) skew(0) skewY(0) scale3d(1, 1, 1) !important;
					--tw-rotate-y: -35deg;			
			}			
			.door__block.now__open .door__img::before{
				opacity: 1;
			}
			
		/*-----左右ドア中枠内 imgタグ---*/
		
	/*-----ドア---*/
		
.recruit__inner{
	width: 40%;
		padding-top: 14.4rem; /*18rem;*/
		padding-bottom: 10.4rem; /*13rem;*/
		margin-left: auto;
		margin-right: auto;
	display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
}
.recruit__inner .Contvisual__title {
    margin-bottom: 6.08rem; /*7.6rem*/
    align-items: center;
}
.recruit__inner .Contvisual__title__en{
	background: var(--gradcolor);
		-webkit-background: var(--gradcolor);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
}
.recruit__text{
	margin-bottom: 1.8em;
	font-size: 2.1rem; /*2.4rem;*/
		line-height: 2.083333;
		letter-spacing: 0;
		text-align: center;
}
@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){
	.recruit{
	}
		/*-----左右ドア外枠---*/
		/*-----左右ドア中枠(picture)---*/
		
		/*-----左右ドア中枠内 imgタグ---*/
			.door__left .door__img img.ofi__cover{
				object-position: center;
				transform: translate(0,0) rotate(0) skew(0) skewY(0) scaleX(1.08) scaleY(1);
			}
			.door__right .door__img img.ofi__cover{
				object-position: center;
				transform: translate(0,0) rotate(0) skew(0) skewY(0) scaleX(1.08) scaleY(1);
			}
			
		/* --door open時js .now__open--*/
			/*-----左右ドア外枠---*/
			.door__block.now__open .door__left ,
			.door__block.now__open .door__right{
				width: 19.46%;
			}
			/*-----左右ドア中枠(picture)---*/
				.door__block.now__open .door__left .door__img{
					transform: translate3d(-1%,0,0) rotateX(0) rotateY(25deg) rotate(0) rotate3d(0,0,0,0deg) skew(0) skewY(0) scale3d(1, 1, 1) !important;
						--tw-rotate-y: 25deg;
				}		
				.door__block.now__open .door__right .door__img{
					transform: translate3d(-1%,0,0) rotateX(0) rotateY(-25deg) rotate(0) rotate3d(0,0,0,0deg) skew(0) skewY(0) scale3d(1, 1, 1) !important;
						--tw-rotate-y: -25deg;			
				}
				
			/*-----左右ドア中枠内 imgタグ---*/
			
		/*-----ドア---*/
			
	.recruit__inner{
		width: 60%;
			padding-top: 16rem;
			padding-bottom: 10rem;
		display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
	}	
	.recruit__inner .Contvisual__title {
		margin-bottom: 7.6rem;
	}
	.recruit__text{
		font-size: 2.8rem;
	}
	.recruit__inner .C-button{
		width: 40rem;
	}
}




/*-------------------------------
	ファーストビュー
-------------------------------*/


@media screen and (min-width:769px) , print{

}
@media screen and (max-width:1240px) and (min-width: 769px){

}
@media screen and (max-width:960px) and (min-width: 769px){

}
@media screen and (max-width:768px){

}