@charset "utf-8";

/*-------------------------------
	キービジュアル
-------------------------------*/

.Keyvisual{
	background-image: url(../images/job-descriptions/bg_keyvisual.jpg);
    background-image: image-set(url(../images/job-descriptions/bg_keyvisual.jpg) 1x, url(../images/job-descriptions/bg_keyvisual@2x.jpg) 2x);
}

@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){

	.Keyvisual{
		background-image: url(../images/job-descriptions/sp_bg_keyvisual.jpg);
		background-image: image-set(url(../images/job-descriptions/sp_bg_keyvisual.jpg) 1x, url(../images/job-descriptions/sp_bg_keyvisual@2x.jpg) 2x);
	}

}

/*-------------------------------
	共通パーツのここだけ設定
-------------------------------*/
.main{
	padding-top: unset;
}
.Keyvisual,
.Breadclumb{
	position: relative;
	z-index: 5000;
}

.footer{
	margin-top: -5rem;
}

@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){

}


/*-------------------------------
	こんな人と仕事がしたい導入 Job-desc-intro
-------------------------------*/
.Job-desc-intro{
	position: relative;
	overflow: hidden;
	z-index: 2000;
}
.Job-desc-intro:first-child{
	margin-top: -8.5rem;
	padding-top: calc(13.6rem + 8.5rem); /*calc(17rem + 8.5rem);*/
}
.Job-desc-List__sub-title{
	margin-bottom: 7.84rem; /*9.8rem; 0.8*/
}
.Job-desc-List__sub-title .C-sub-title__jp{
	color: var(--maincolor);
	font-size: 3.6rem;
	letter-spacing: .15em;
}
.Job-desc-List__sub-title .C-sub-title__en{
	margin-top: 0.8rem; /*1rem;*/
}
.Job-desc-intro__block{
	position: relative;
}
.Job-desc-intro__txtbox{
	position: relative;
	z-index: 2000;
}
.Job-desc-intro__sub-title{
	margin-bottom: 6.12rem; /*6.8rem;*/
	font-size: 2.7rem; /*3rem;*/
		letter-spacing: .05em;
		line-height: 1;
		font-weight: 600;
}
.Job-desc-intro__list li,
.Job-desc-intro__txt{
	font-size: 1.8rem; /*2rem;*/
		letter-spacing: .01em;
		line-height: 2.25;
		font-weight: 500;
		text-align: left;
}

.Job-desc-intro__list li{
	padding-left: 1.2em;
	position: relative;
}
	.Job-desc-intro__list li::before{
		width: 1.35rem; /*1.5rem;*/
		height: 1.35rem; /*1.5rem;*/
			border-radius: 50%;
			background: var(--gradcolor3);
		position: absolute;
			left: 0;
			top: 1.1em;
			transform: translateY(-50%);
			-webkit-transform: translateY(-50%);
		display: block;
		content: "";
	}
.Job-desc-intro__imgbox{
	width: calc(100% - 36.22222rem); /*calc(100% - 32.6rem);*/
	position: absolute;
		right: -8rem; /*-10rem;*/
		top: 50%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
	display: block;	
}
	.Job-desc-intro__imgbox::before{
		width: 66.785865633%;
		height: 26.1rem;
		background: url(../images/job-descriptions/jd-intro_txt-bf.svg) no-repeat;
			background-position: bottom center;
			background-size: contain;
		position: absolute;
			top: -26.1rem;
			right: 0;
		display: block;
		content: "";
	}
	
	.Job-desc-intro__imgbox::after{
		width: 55.5555555%;
		height: 24rem; /*25rem;*/
		background: url(../images/job-descriptions/jd-intro_txt-af.svg) no-repeat;
			background-position: top center;
			background-size: contain;
		position: absolute;
			bottom: -23rem; /*-24rem;*/
			right: 6rem;
		display: block;
		content: "";
	}
/*----bg__circle 基準---*/
	.Job-desc-intro__txtbox{
		position: relative;
	}
		/*----__txtbox基準---*/
	.bg__circle.c-blue.c-jd-intro-tb01{
		top: -22rem; /*-40rem;*/
		left: -46rem; /*-55rem;*/
	}
	.bg__circle-mini.c-pink.c-jd-intro-tb02{
		top: -22rem; /*-31rem;*/
		left: 55%;
		transform: translate(-50%);
		-webkit-transform: translate(-50%);
	}
	/*----__imgbox基準---*/
	.bg__circle.c-blue.c-jd-intro-ib01{
		top: -22rem; /*-35rem;*/
		right: -31rem; /*-45rem;*/
	}
	.bg__circle-mini.c-pink.c-jd-intro-ib02{
		bottom: -33rem; /*-35rem;*/
		right: -42rem; /*-35rem;*/
	}
/*----bg__circle 基準---*/

@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){
	.Job-desc-intro:first-child{
		margin-top: -5rem;
		padding-top: calc(var(--padding-topbottom) + 5rem);
	}
	.Job-desc-intro__sub-title{
		margin-bottom: 5rem;
		font-size: 4rem;
	}
	.Job-desc-intro__list li,
	.Job-desc-intro__txt{
		font-size: 3rem;
	}
	
	.Job-desc-intro__list li{
		padding-left: 1.2em;
		position: relative;
	}
		.Job-desc-intro__list li::before{
			width: 2rem;
			height: 2rem;
			top: 1em;
		}
	.Job-desc-intro__imgbox{
		width: 100%;
		position: absolute;
			right: 0;
			top: 0;
			transform: translateY(-50%);
			-webkit-transform: translateY(-50%);
		display: block;	
	}
		.Job-desc-intro__imgbox::before{
			display: none;
		}
		
		.Job-desc-intro__imgbox::after{
			width: 52%;
			height: 22rem;
			bottom: -22rem;
			right: -2rem;
		}
	/*----bg__circle 基準---*/
		.Job-desc-intro__txtbox{
			position: relative;
		}
			/*----__txtbox基準---*/
		.bg__circle.c-blue.c-jd-intro-tb01{
			top: -40rem;
			left: -55rem;
		}
		.bg__circle-mini.c-pink.c-jd-intro-tb02{
			top: -31rem;
			left: 55%;
			transform: translate(-50%);
			-webkit-transform: translate(-50%);
		}
		/*----__imgbox基準---*/
		.bg__circle.c-blue.c-jd-intro-ib01{
			top: -35rem;
			right: -45rem;
		}
		.bg__circle-mini.c-pink.c-jd-intro-ib02{
			bottom: -35rem;
			right: -35rem;
		}
	/*----bg__circle 基準---*/
	
}


/*-------------------------------
	採用情報一覧 Job-desc-List
-------------------------------*/
.Job-desc-List{
	background: var(--bg-graycolor);
	position: relative;
	position: relative;
	z-index: 2000;
}
.Job-desc-List:last-child{
	padding-bottom: calc(var(--padding-topbottom) + 5rem);
}
/*--.Job-desc-List__container*/
.Job-desc-List__container{
	margin-bottom: 12.6rem; /*14rem; 0.9*/
	width: 100%;
		max-width: 79.2rem; /*99rem;*/
		margin-left: auto;
		margin-right: auto;	
	position: relative;
	z-index: 3000;
}
	.Job-desc-List__container:nth-last-of-type(1){
		margin-bottom: 0;
	}

.Job-desc-List__item + .Job-desc-List__item{
	margin-top: 5.12rem; /*6.4rem;*/
}
.Job-desc-List__item{
	width: 100%;
	position: relative;
	transition: var(--transition-time);
}
/*---hover---*/
.Job-desc-List__item:not(.-comingsoon):hover{
	transform: var(--trans-hov-pop);
}
.Job-desc-List__item.-comingsoon{
	pointer-events: none;
}
.Job-desc-List__item.-comingsoon a::before{
	content: "COMING SOON";
	display: block;
	line-height: 1;
	font-size: 2.7rem; /*3rem;*/
	font-weight: 700;
	width: 100%;
	height: 100%;
	border-radius: 1.5rem;
	color: #fff;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 6000;
	/* background: rgba(193,193,193,1); */
	background: rgba(0,0,0,.25);
	display: flex;
	align-items: center;
	justify-content: center;
}
.Job-desc-List__item a:hover{
	opacity: 1;
}
	.Job-desc-List__item a::after{
		width: 100%;
		height: 100%;
		background: var(--gradcolor);
		border-radius: 1.5rem;
		position: absolute;
			left: 0.9rem;
			top: 0.9rem;
		display: block;
		content: "";
		z-index: -1;
	}
.Job-desc-List__item a{
	position: relative;
	display: block;
}
.Job-desc-List__item__inner{
	width: 100%;
	/*padding: 2.8rem 3.5rem 2.5rem 2.5rem;*/
	padding: 2.8rem 3.5rem 2.5rem 2.5rem;
	border-radius: 1.5rem;
	border: 1px solid var(--maincolor);
	background: #fff;
	display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 3.6rem; /*4rem;*/
}
.Job-desc-List__txtbox{
	position: relative;
	padding-left: 3.6rem; /*4rem;*/
	z-index: 500;
}
	.Job-desc-List__txtbox::before{
		width: 0.585rem; /*0.65rem;*/
		height: 100%;
		background: var(--maincolor);
		position: absolute;
			left: 0;
			top: 0;
		display: block;
		content: "";
	}
	.job-desc-more__button{
		width: 6.3rem; /*7rem;*/
		height: 6.3rem; /*7rem;*/
		position: relative;
		display: block;	
	}
		.job-desc-more__button::before{
			width: 100%;
			height:	100%;
				border-radius: 50%;
				background: var(--gradcolor2);
			position: absolute;
				right:0;
				top: 0;
			content: "";
			display: block;	
			z-index: 1;
		}
		.job-desc-more__button::after{
			width: 1.98rem; /*2.2rem;*/
			height: 1.98rem; /*2.2rem;*/
				border-radius: 50%;
			background: url(../images/common/icon_arrow3--white.svg) no-repeat;
				background-size: contain;
				background-position: center;
			
			position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%,-50%);
				-webkit-transform: translate(-50%,-50%);
			content: "";
			display: block;	
			z-index: 2;
		}
	.job-desc-more__button span{
		width: 100%;
		position: absolute;
			left: 50%;
			top: -1.3em;
			transform: translateX(-50%);
			-webkit-transform: translateX(-50%);
		font-size: 1.2rem; /*1.3rem;*/
			color: var(--maincolor);
			letter-spacing: 0;
			line-height: 1;
			font-weight: 700;
			text-align: center;
		display: block;
	}
		
.Job-desc-List__txtbox h4{
	margin-bottom: 0.6em;
	font-size: 1.8rem; /*2rem;*/
		color: var(--maincolor);
		letter-spacing: 0;
		line-height: 1;
		font-weight: 700;
		text-align: left;
	display: block;
	position: relative;
}

.Job-desc-List__txtbox ul li,
.Job-desc-List__txtbox p{
	font-size: 1.3rem; /*1.4rem;*/
		letter-spacing: .06em;
		line-height: 1.875;
		text-align: left;
	display: block;
}

.Job-desc-List__txtbox ul li{
	padding-left: 1.2em;
	position: relative;
}
	.Job-desc-List__txtbox ul li::before{
		position: absolute;
			left: 0;
			top: 0.95em;
			transform: translateY(-50%);
			-webkit-transform: translateY(-50%);
		display: block;
		content: "◯";
	}
@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){
	.Job-desc-List__sub-title{
		margin-bottom: 5rem;
	}
	.Job-desc-List__sub-title .C-sub-title__jp{
		font-size: 4rem;
	}
	.Job-desc-List__sub-title .C-sub-title__en{
		margin-top: 1rem;
	}
	/*--.Job-desc-List__container*/
	.Job-desc-List__container{
		margin-bottom: 11rem;
			max-width: unset;
	}
		.Job-desc-List__container:nth-last-of-type(1){
			margin-bottom: 0;
		}
	.Job-desc-List__item__inner{
		padding: 3.5rem 3.5rem 3.5rem 2.5rem;
		border-radius: 2rem;
			gap: 2.5rem;
	}
	.Job-desc-List__item + .Job-desc-List__item{
		margin-top: 5.9rem;
	}
		.Job-desc-List__item a::after{
			border-radius: 2rem;
		}
		/*----CommingSoon---*/
		.Job-desc-List__item.CommingSoon a::before{
			border-radius: 2rem;
		}
	.Job-desc-List__txtbox{
		position: relative;
		padding-left: 2.5rem;
		width: calc(100% - 8.5rem);
	}
		.job-desc-more__button {
			width: 8.5rem;
			height: 8.5rem;
		}
			.job-desc-more__button::after{
				width: 2.8rem;
				height: 2.8rem;
			}
		.job-desc-more__button span{
				top: -1.3em;
				font-size: 1.6rem;
		}
	.Job-desc-List__txtbox h4{
        font-size: 2.8rem;
		line-height: 1.35;
	}
	
	.Job-desc-List__txtbox ul li,
	.Job-desc-List__txtbox p{
        font-size: 2.1rem;
	}
	
}


/*-------------------------------
	採用情報 Job-desc-Detail
-------------------------------*/
.Job-desc-Detail{
	margin-top: -8.5rem;
		background: var(--bg-graycolor);
	position: relative;
	overflow: hidden;
	z-index: 2000;
}
.Job-desc-Detail:first-child{
	padding-top: calc(10.4rem + 8.5rem); /*calc(13rem + 8.5rem);*/
}
.Job-desc-Detail:last-child{
	padding-bottom: calc(var(--padding-topbottom) + 5rem);
}
.Job-desc-Detail____title {
    margin-bottom: 3.6rem; /*4rem;*/
}
	.Job-desc-Detail____title .C-title__jp{
		font-size: 3.6rem; /*4rem;*/
	}
	.Job-desc-Detail____title .C-title__en{
		font-size: 2.2rem; /*2.6rem;*/
	}
.Job-desc-Detail____txt{
	margin-bottom: 1.2em;
	font-size: 1.6rem; /*1.8rem;*/
		letter-spacing: 0;
		line-height: calc(3.5 / 1.8);
		font-weight: 500;
		text-align: center;
	display: block;
}
.Job-desc-Detail__container{
	width: 100%;
		max-width: 99rem;
		margin-left: auto;
		margin-right: auto;	
		padding: 5.5rem 5.5rem 11.2rem 5.5rem;
		background: #fff;
		border-radius: 5rem;
		box-shadow: 0px 3px 6px rgba(0,0,0,0.16);
}
	.Job-desc-Detail__block + .Job-desc-Detail__block{
		margin-top: 10.48rem; /*13.1rem;*/
	}
	.Job-desc-Detail__block + .C-button{
		margin-top: 7.76rem; /*9.7rem;*/
	}
.Job-desc-Detail__block h3{
	margin-bottom: 8.55rem; /*9.5rem;*/
	width: 100%;
		padding: 0.75em 1em;
		border-radius: 9999px;
		background: var(--maincolor);
	font-size: 2.2rem; /*2.5rem;*/
		letter-spacing: 0;
		line-height: 1.3;
		font-weight: 700;
		text-align: center;
		color: #fff;
	display: block;
}
.Job-desc-Detail__block.-guideline h3{
	margin-bottom: 4.77rem; /*5.3rem;*/
}

.Job-desc-Detail__block h4{
	margin-bottom: 4.77rem; /*5.3rem;*/
	padding-bottom: 0.8em;
	font-size: 2.2rem; /*2.4rem;*/
		letter-spacing: 0.03em;
		line-height: 1.3;
		font-weight: 700;
		text-align: left;
		color: var(--maincolor);
	display: block;
	position: relative;
}
	.Job-desc-Detail__block h4::after{
		width: 3.6rem; /*4rem;*/
		height: 1px;
			background: var(--maincolor);
		position: absolute;
			left: 0;
			bottom: 0;
		display: block;
		content: "";
	}
.Job-desc-Detail__block h5{
	width: 100%;
	margin-bottom: 0.5em;
	font-size: 1.6rem; /*1.8rem;*/
		letter-spacing: 0.01em;
		line-height: 1.3;
		font-weight: 700;
		text-align: left;
		color: var(--maincolor);
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
}
	.Job-desc-Detail__block h5::before{
		display: block;
		content: "◯";
	}
.Job-desc-Detail__block h6{
	margin-bottom: 0.5em;
	font-size: 1.6rem; /*1.8rem;*/
		letter-spacing: 0.01em;
		line-height: 1.3;
		font-weight: 700;
		text-align: left;
		color: var(--maincolor);
	display: block;
}
.Job-desc-Detail__block p{
	font-size: 1.6rem; /*1.8rem;*/
		letter-spacing: 0.01em;
		line-height: calc(3.5 / 1.8);
		font-weight: 500;
		text-align: left;
	display: block;
}
	.Job-desc-Detail__block p + h3,
	.Job-desc-Detail__block p + h4,
	.Job-desc-Detail__block p + h5,
	.Job-desc-Detail__block p + h6{
		margin-top: 3.6rem; /*4rem;*/
	}
	.Job-desc-Detail__block p + p{
		margin-top: 1.8rem; /*2rem;*/
	}

.Job-desc-Detail__block dl{
	width: 100%;
		border-bottom: 1px solid #707070;
	display: flex;
		align-items: stretch;
		justify-content: center;
		flex-wrap: wrap;
	position: relative;
}
	.Job-desc-Detail__block dl:nth-of-type(1){
		border-top: 1px solid #707070;
	}
.Job-desc-Detail__block dl dt{
	/*padding: 2.3rem 2rem 2rem;*/
	padding: 2.07rem 1.8rem 1.8rem;
	width: 20.2rem;
		background: #F0F4F7;
	font-size: 1.5rem; /*1.7rem;*/
		letter-spacing: 0.01em;
		line-height: 1.76470588235;
		font-weight: 700;
		text-align: left;
	display: block;
}
.Job-desc-Detail__block dl dd{
	/*padding: 2.3rem 0 2rem 3.6rem;*/
	padding: 2.07rem 0 1.8rem 3.24rem;
	width: calc(100% - 20.2rem);
	font-size: 1.6rem; /*1.8rem;*/
		letter-spacing: 0.01em;
		line-height: 1.94444444;
		font-weight: 500;
		text-align: left;
	display: block;
}
.Job-desc-Detail__block dl dd span{
	line-height: calc(3.5 / 1.8);
	display: block;
}


@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){

	.Job-desc-Detail{
		margin-top: -5rem;
	}
	.Job-desc-Detail:first-child{
		padding-top: calc(var(--padding-topbottom) + 5rem);
	}
	.Job-desc-Detail____title {
		margin-bottom: 11.2rem;
	}
		.Job-desc-Detail____title .C-title__jp{
			font-size: 4rem;
		}
		.Job-desc-Detail____title .C-title__en{
			font-size: 2.6rem;
		}
	.Job-desc-Detail____txt{
		margin-bottom: 2em;
		font-size: 2.8rem;
		line-height: calc(6 / 2.8);
	}
	.Job-desc-Detail__container{
		width: 100%;
			max-width: unset;
			padding: 3.5rem 3.5rem 6.5rem 3.5rem;
	}
		.Job-desc-Detail__block + .Job-desc-Detail__block{
			margin-top: 8.2rem;
		}
		.Job-desc-Detail__block + .C-button{
			margin-top: 7rem;
		}
		.Job-desc-Detail__container .C-button{
			width: 100%;
		}
	.Job-desc-Detail__block h3{
		margin-bottom: 4.5rem;
			padding: 2.5rem;
		font-size: 3rem;
		line-height: 1.5;
	}
	.Job-desc-Detail__block.-guideline h3{
		margin-bottom: 5rem;
	}
	.Job-desc-Detail__block h4{
		margin-bottom: 5.3rem;
		padding-bottom: 0.8em;
		font-size: 3rem;
	}
		.Job-desc-Detail__block h4::after{
			width: 4rem;
		}
	.Job-desc-Detail__block h5{
		font-size: 2.8rem;
	}
	.Job-desc-Detail__block h6{
		font-size: 2.8rem;
	}
	.Job-desc-Detail__block p{
		font-size: 2.8rem;
		line-height: calc(6 / 2.8);
	}
		.Job-desc-Detail__block p + h3,
		.Job-desc-Detail__block p + h4,
		.Job-desc-Detail__block p + h5,
		.Job-desc-Detail__block p + h6{
			margin-top: 6rem;
		}
		.Job-desc-Detail__block p + p{
			margin-top: 3rem;
		}
	
	.Job-desc-Detail__block dl dt{
        padding: 2rem 2.5rem;
		width: 100%;
			font-size: 2.8rem;
			border-bottom: 1px solid #707070;
	}
	.Job-desc-Detail__block dl dd{
        padding: 2.5rem 2.5rem 3rem;
		width: 100%;
		font-size: 2.8rem;
	}
	

}