@charset "utf-8";
/* CSS Document */
.recruit #main.other,
.recruit #main.top{
	margin-top: -100px;
}
/* 共通 */
.recruit header p.side_btn{
	position: fixed;
	top:33.3%;
	right:0;
	z-index: 999;	
	max-height: 216px;
}
.recruit header p.side_btn a{
	display: block;
	writing-mode: vertical-rl;
	background-color: #FFE100;
	border-radius: 7px 0 0 7px;
	text-decoration: none;
	height: 100%;
	padding: 9px 0 9px 9px;
    border: solid 2px #222;
    border-right: 0;
    transform: translateX(12px);
	box-shadow: 3px 3px 0 0 rgb(34 34 34 / 100%);
	transition: transform .3s , box-shadow .3s;
	max-height: 216px;
}
.recruit header p.side_btn a:hover{
	box-shadow: 0 0 0 transparent;
    transform: translate(15px, 3px);	
}
.recruit header p.side_btn a span{
	display: block;
	font-weight: 700;
	font-size: 1.3125rem;
	color: #FFF;
	background-color: #194056;
	border: solid 2px #222;
	border-right: 0;
	border-radius: 4px 0 0 4px;	
	height: 100%;
	width: 100%;
	padding: 0 29px 0 11px;
	letter-spacing: 5px;
	text-align:center;
}
/* top */
.recruit #main.top .en_ttl{
	font-family: gill-sans-nova;
	font-weight: 600;	
	font-size: 3.125rem;
	color: #0077A7;
	position: relative;
    padding-left: 48px;
	line-height: 1;
}
.recruit #main.top .en_ttl::before {
    content: "";
    position: absolute;
    width: 34px;
    height: 34px;
    background-color: #0077A7;
    top: 12px;
    left: 0;
    clip-path: polygon(50% 0, 100% 50%, 100% 100%, 0 100%, 0 0);
}
.recruit #main.top h2{
	font-size: 1rem;
	font-weight: 700;
	color: #0077A7;
    padding-left: 48px;
    margin-top: 12px;
    letter-spacing: 1.5px;	
}
#rec_top{
	width: 100%;
	height: 100%;
	min-height: 793px;
}
#rec_top .move_cnt{
	background: url("../images/recruit/recruit_bg.webp") top center / 37px 37px repeat;
	padding: 106px 15px 73px;
	position: fixed;
    width: 100%;
    z-index: -1;	
}
#rec_top .move_cnt.active{
	position: static;
}
#rec_top .top_cnt{
	display: flex;
	max-width: 1140px;	
    width: 100%;
	margin: auto;
    gap: 45px;
    align-items: center;	
}
#rec_top .main_img{
	display: flex;
	align-items: flex-end;
	max-width: 862px;
	width: 100%;
	justify-content: space-between;
}
#rec_top .text_cnt{
	margin-bottom: 29px;
}
#rec_top .text_cnt p{
    color: #0077A7;
    font-weight: 700;
    font-size: 0.875rem;
	letter-spacing: 2px;	
}
#rec_top .text_cnt p.en_txt{
    color: #0077A7;
    font-weight: 600;
    font-size: 2.4375rem;
	font-family: gill-sans-nova;
    letter-spacing: 0;
    line-height: 1.2;
    margin-top: 8px;	
}
#rec_top .top_text{
	display: flex;
    flex-direction: row-reverse;
    gap: 33px;
    margin-left: 16px;
    margin-top: -10px;	
}
#rec_top p.rl_txt {
	width: 52px;	
}
#rec_top p.rl_txt span{
    color: #0077A7;
    font-weight: 700;
    font-size: 3.25rem;
    writing-mode: vertical-rl;
    line-height: 1;
	opacity: 0;
	will-change: opacity;
	letter-spacing: 2px;
}
#rec_top.active p.rl_txt span{
	opacity: 1;
    transition: opacity 1.5s;
}
#rec_top p.rl_txt:first-child span:nth-child(1){
	transition-delay: 0ms;
}
#rec_top p.rl_txt:first-child span:nth-child(2){
	transition-delay: 100ms;
}
#rec_top p.rl_txt:first-child span:nth-child(3){
	transition-delay: 200ms;
}
#rec_top p.rl_txt:first-child span:nth-child(4){
	transition-delay: 300ms;
}
#rec_top p.rl_txt:first-child span:nth-child(5){
	transition-delay: 400ms;
}
#rec_top p.rl_txt:first-child span:nth-child(6){
	transition-delay: 500ms;
}
#rec_top p.rl_txt:first-child span:nth-child(7){
	transition-delay: 600ms;
}
#rec_top p.rl_txt:first-child span:nth-child(8){
	transition-delay: 700ms;
}
#rec_top p.rl_txt:last-child span:nth-child(1){
	transition-delay: 900ms;
}
#rec_top p.rl_txt:last-child span:nth-child(2){
	transition-delay: 1000ms;
}
#rec_top p.rl_txt:last-child span:nth-child(3){
	transition-delay: 1100ms;
}
#rec_top p.rl_txt:last-child span:nth-child(4){
	transition-delay: 1200ms;
}
#rec_top p.rl_txt:last-child span:nth-child(5){
	transition-delay: 1300ms;
}
#rec_top p.rl_txt:last-child span:nth-child(6){
	transition-delay: 1400ms;
}
/* message */
#rec_message{
	padding: 161px 15px 167px;	
	background-color: rgba(255,255,255,0.88);
}
#rec_message .message_cnt{
	display: flex;	
	max-width: 852px;
	margin: auto;
    align-items: flex-end;
    justify-content: space-between;	
}
#rec_message h3{
	color: #0077A7;	
	font-weight: 700;
	font-size: 1.75rem;
	margin: 50px 0 19px;	
}
#rec_message p{
	line-height: 1.875;
}
#rec_message .text_cnt{
	max-width: 625px;
}
#rec_message .name_txt{
	display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 22px;
    margin-top: 34px;
}
#rec_message .name_txt p{
	font-weight: 700;
	font-size: 1.125rem;
}
#rec_message .name_txt img{
	margin-right: 5px;
    margin-top: 5px;
	max-width: 148px;
	height: auto;
}
#rec_message .img_cnt{
	margin: 0 12px 4px 0;
	overflow: hidden;
	transform: translateX(30px);
    padding: 0 30px;
	min-width: 208px;
	max-width: 208px;
}
#rec_message .img_cnt img{
	transform: translateX(180px);
	transition: .8s cubic-bezier(0.56, 0.03, 0.22, 1);
	max-width: fit-content;
    width: 100%;
	height: auto;
}
#rec_message .img_cnt.active img{
	transform: translateX(0);
}
/* about */
#rec_about{
	background: url("../images/recruit/about_bg.webp") top center / cover no-repeat;
	padding: 132px 15px 120px;	
}
#rec_about .text_cnt{
	max-width: 1108px;
	width: 100%;
	margin: auto;	
}
#rec_about .link_cnt{
	display: flex;
	gap: 25px;
	max-width: 1108px;
	width: 100%;
	margin: 44px auto 0;
	justify-content: space-between;	
}
#rec_about a{
	display: block;
	box-shadow: 0 0 12px 0 rgb(0 0 0 / 16%);
	border-radius: 0 70px 0 0;
	text-decoration: none;
	position: relative;
    margin-bottom: 23px;	
}
#rec_about .img_cnt{
	clip-path: polygon(88% 0, 100% 18%, 100% 100%, 0 100%, 0 0);
    overflow: hidden;
}
#rec_about a .img_cnt img{
	transition: .3s;
	object-fit: cover;
	width: 315px;
	height: 215px;	
}
#rec_about a:hover .img_cnt img{
	transform: scale(1.08);
}
#rec_about a > p{
	font-size: 1.125rem;
	color: #FFF;
	font-weight: 700;
	background-color: #0064B6;
	border:solid 1.5px #222;
	border-radius: 5px;
	width: fit-content;
	padding: 6px 20px;
	letter-spacing: 1px;
	box-shadow: 2px 2px 0 0 rgb(34 34 34 / 100%);
	position: absolute;
	bottom: -21px;
    left: -17px;
	transition: transform .3s, box-shadow .3s;
}
#rec_about a:hover > p {
    box-shadow: 0 0 0 transparent;
    transform: translate(2px, 2px);
}
/* interview */
#rec_interview{
	background: url("../images/recruit/interview_bg.webp") bottom right / cover no-repeat;
	padding: 69px 0 120px;
}
.scroll-text-container {
	display: flex;
	align-items: center;
	overflow: hidden;
	mix-blend-mode: multiply;
}
.scroll-text-container .animate-text {
	white-space: nowrap;
	animation: loop 80s linear infinite;
	animation-fill-mode: both;
}
#rec_interview p.animate-text{
	font-size: 7.875rem;
	font-weight: 600;
	font-family: gill-sans-nova;
	color: #E1EEF6;
	line-height: 1;
	display: inline-block;
	min-width: auto;
	will-change: transform;
	margin-right: 30px;
}
@keyframes loop {
0% {
transform: translateX(0);
}
to {
transform: translateX(-100%);
}
}

#rec_interview .link_box{
	margin-top: 77px;
	padding: 0 15px;
}
#rec_interview .link_box a{
	display: block;
	text-decoration: none;
	max-width: 728px;
	position: relative;
	padding: 149px 0 38px;
	margin: auto;
	z-index: 1;
} 
#rec_interview .link_box a .img_cnt{
	position: absolute;
	top:0;
	left:0;
	right: 0;
	width: 100%;
	height: 100%;	
	z-index: -1;
	overflow: hidden;
}
#rec_interview .link_box a .img_cnt span{
	background: url("../images/recruit/interview_link_bg.webp") top center / cover no-repeat;
	position: absolute;
	top:0;
	left:0;
	right: 0;
	width: 100%;
	height: 100%;
	transition: .3s;
}
#rec_interview .link_box a:hover .img_cnt span{
	transform: scale(1.08);
}
#rec_interview .link_box a > div p{
	font-weight: 700;
	font-size: 1rem;
	color: #FFF;
	text-align: center;
    letter-spacing: 1.5px;
    margin-left: 5px;
	line-height: 1.5;
}
#rec_interview .link_box a span.link_mark{
    position: absolute;
    right: 24px;
    bottom: 58px;
}
#rec_interview .link_box a span.link_mark::after{
	content:"";
	background: url("../images/icon/btn_circle_68.svg") top left / 68px no-repeat;
	width: 68px;
	height: 68px;
	position: absolute;
	right: 0;
    transition: .35s ease-out;
	top:0;
	bottom:0;
	margin: auto;
}
#rec_interview .link_box a:hover span.link_mark::after{
	transform: rotate(360deg);
}
#rec_interview .link_box a span.link_mark::before{
	content:"";
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 3.5px 0 3.5px 6px;
	border-color: transparent transparent transparent #FFF;
	right: 31px;
	top:0;
	bottom:0;
	margin: auto;
}
#rec_interview .link_box a:hover span.link_mark::before{
	animation: arrow_move 0.5s cubic-bezier(0.3, 0.85, 0.53, 1.09);
}
#rec_interview .link_box a::before{
	content: "";
	position: absolute;
	background: url("../images/recruit/interview_link_img.webp") top left / 273px 248px no-repeat;
	width: 273px;
	height: 248px;
	bottom:-1px;
	left: -98px;
	pointer-events: none;
}
#rec_interview .link_box a > p{
	position: absolute;
	background: url("../images/recruit/interview_link_frame.webp") top left / 345px 95px no-repeat;
	font-weight: 700;
	color: #222;
	font-size: 1.5rem;
	margin: auto;
    max-width: 345px;
    top: -37px;
    left: 0;
    right: 0;
    padding: 18px 10px 39px 98px;
}
/* last */
#rec_last{
	background: url("../images/recruit/recruit_bg.webp") top center / 37px 37px repeat;
	padding: 120px 15px 122px;
}
#rec_last .link_box {
	display: flex;
	max-width: 845px;
	margin: auto;
    justify-content: space-between;	
}
#rec_last .link_box div{
	max-width: 403px;
	width: 100%;
}
#rec_last .link_box div > a{
	text-decoration: none;
	color: #FFF;
	font-weight: 700;
	font-size: 1.5rem;
	border:solid 1.5px #222;
	max-width: 403px;
	width: 100%;
	height: 237px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 16px;	
	box-shadow: 3px 3px 0 0 rgb(34 34 34 / 100%);
	position: relative;
	transition: transform .3s , box-shadow .3s;
}
#rec_last .link_box div > a:hover{
	box-shadow: 0 0 0 transparent;
    transform: translate(3px, 3px);	
}
#rec_last .link_box div:first-child > a{
	background-color: #FFE100;
}
#rec_last .link_box div:last-child > a{
	background-color: #0E6EB8;
}
#rec_last .link_box div > a::after,
#rec_last .link_box div > a::before,
#rec_last .link_box div .frame::after,
#rec_last .link_box div .frame::before{
	content:"";
	background: url("../images/recruit/lastlink_frame.svg") top left / 11px 11px no-repeat;
	width: 11px;
	height: 11px;
	position: absolute;
}
#rec_last .link_box div > a::after{
	transform: scale(1,-1);
    top: 12px;
    left: 12px;
}
#rec_last .link_box div > a::before{
	transform: scale(-1,-1);
    top: 12px;
    right: 12px;
}
#rec_last .link_box div .frame::after{
    bottom: 12px;
    left: 12px;
}
#rec_last .link_box div .frame::before{
	transform: scale(-1,1);
    bottom: 12px;
    right: 12px;
}
#rec_last .link_box div:first-child .in_box p,
#rec_last .link_box div:last-child .in_box p{
	border: solid 1.5px #222;	
	max-width: 242px;
	border-radius: 4px;
	text-align: center;
	height: 82px;
	padding: 15px;
	display: flex;
	align-items: center;
    justify-content: center;
	margin: auto;
}
#rec_last .link_box div:first-child .in_box p{
	background-color: #0E6EB8;
}
#rec_last .link_box div:last-child .in_box p{
	background-color: #194056;
}
#rec_last .link_box div:first-child .in_box,
#rec_last .link_box div:last-child .in_box{
	border: solid 1.5px #222;
	border-radius: 7px;
	max-width: 264px;
	width: 100%;
	padding: 9px;
	margin: auto;
}
#rec_last .link_box div:first-child .in_box{
	background-color: #DCDDDD;
}
#rec_last .link_box div:last-child .in_box{
	background-color: #FFE100;
}

/* 下層共通 */
.wrap_pankuzu{
    padding: 0 15px;
	border-top:solid 1px #0077A7;
	background-color: #F7F7F7;
}
.pankuzu {
	max-width: 1108px;
    margin: 0 auto;
    padding: 22px 0;
    font-size: 0.75rem;
    display: flex;
	align-items: center;
    list-style: none;
    flex-wrap: wrap;
	gap: 5px 41px;
}
.pankuzu li,
ul.pankuzu > span{
    font-weight: 500;
	color: #0077A7;
	font-size: 0.75rem;
}
.pankuzu a {
    display: inline-block;
    position: relative;
    padding-right: 0;
    margin-right: 0;
	padding-top: 1px;
    font-weight: 500;
    color: #0077A7;
	font-size: 0.75rem;
	text-decoration: underline;
}
.pankuzu a:hover{
	text-decoration: none;
}
.pankuzu a::after {
    content: "";
    position: absolute;
    right: -25px;
    top: 7px;
	width:0;
	height:0;
	border-style:solid;
	border-width: 5.5px 0 5.5px 9px;
	border-color: transparent transparent transparent #98A6B5;
}
.pankuzu li:first-child a{
	padding-left: 23px;
}
.pankuzu li:first-child a::before{
	content: "";
	background: url("../images/icon/home.svg") top left /16px 14px no-repeat;
	width: 16px;
	height: 14px;
	position: absolute;
	top:4px;
	left:0;
}
#contents-top-recruit{
	background: url(../images/recruit/recruit_bg.webp) top center / 37px 37px repeat;
	min-height: 360px;
	display: flex;
	overflow: hidden;
}
#contents-top-recruit .top_ttl{
	flex: 1;
	margin-top: 100px;
}
#contents-top-recruit .img_cnt{
	background: url(../images/recruit/we_top.webp) top center / cover repeat;
    clip-path: polygon(0 0, 100% 0%, 100% 100%, 17% 100%);
    min-height: 360px;
    flex: 1.5;
    transform: translate(100%, 0);
    animation: img-move .5s cubic-bezier(0.18, 0.93, 0.42, 1.01) forwards;
    animation-delay: .3s;	
}
@keyframes img-move {
	0% {
		transform: translate(100%, 0);	
	}	
	100% {
		transform: translate(0, 0);	
	}
}
#contents-top-recruit h1{
	font-weight: 700;
	font-size: 1.875rem;
	color: #FFF;
    border: solid 1.5px #222;
    box-shadow: 3px 3px 0 0 rgb(34 34 34 / 100%);
	background-color: #0E6EB8;
	max-width: fit-content;
    border-radius: 5px;
    padding: 11px 31px;
    letter-spacing: 1.5px;
	margin: 70px 0 50px 130px;
	position: absolute;
    z-index: 1;
}
#contents-recruit .tile{
	background: url(../images/recruit/recruit_bg.webp) top center / 37px 37px repeat;
}
#contents-recruit h2{
	font-size: 1.25rem;
	font-weight: 700;
	position: relative;
	color: #0077A7;
    padding-left: 22px;
    letter-spacing: 2px;
	margin:0 auto 10px;
	max-width: 1108px;
}
#contents-recruit h2::before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    background-color: #0077A7;
    top: 8px;
    left: 0;
    clip-path: polygon(50% 0, 100% 50%, 100% 100%, 0 100%, 0 0);
}
#contents-recruit h3{
	font-size: 2.375rem;
	font-weight: 700;
	text-align: center;
	margin: 49px auto 60px;
}
#contents-recruit p.lead{
	font-size: 1.75rem;
	font-weight: 700;
	color: #0077A7;	
    margin: 20px auto 59px;
    letter-spacing: 2.8px;
	line-height: 1.5;
	max-width: 1108px;
}
#contents-recruit .white_box{
	max-width: 1108px;
	width: 100%;
	margin: auto;
	position: relative;
	padding: 48px 62px;
	z-index: 1;
}
#contents-recruit .white_box::before{
	content: "";
    position: absolute;
	width: calc(100% - 4px);
	height: calc(100% - 4px);
	border:solid 2px #222;
	background-color: #FFF;
	top: 0;
	left: 0;
	clip-path: polygon(40px 0%, 100% 0, 100% 100%, 0 100%, 0% 40px);
	transform: scale(-1 , 1);
	z-index: -1;
}
#contents-recruit .white_box::after{
	content: "";
	background: url("../images/recruit/white_box_frame.svg") top left / 41px 42px no-repeat;
    position: absolute;
    width: 41px;
    height: 42px;
    right: 0;
    top: 0;
}
#contents-recruit > div:last-child{
	padding-bottom: 125px;
}

#contents-recruit table{
	max-width: 918px;
	width: 100%;
	margin: auto;
	border-collapse:collapse;
}
#contents-recruit table th,
#contents-recruit table td{
	border-bottom:solid 1px #CECECE;
    line-height: 1.75;	
}
#contents-recruit table th,
#contents-recruit table th *{
	font-size: 1rem;
	font-weight: 700;
	text-align: left;
}
#contents-recruit table th{
	vertical-align: top;
    padding: 15.5px 17px 17.5px 34px;	
    width: 23.6%;
}
#contents-recruit table td{
	padding: 15.5px 43px 17.5px 17px;
}
#contents-recruit table td,
#contents-recruit table td *{
	font-size: 1rem;	
}
/* 働く環境 */
#benefits{
	background-color: #F7F7F7;
	padding: 108px 15px 126px;
	overflow: hidden;
}
#benefits .benefits_list{
	max-width: 1108px;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;	
	gap:34px 15px;
	margin: auto;
}
@media screen and (max-width: 1155px){	
	#benefits .benefits_list{
		max-width: 750px;
	}
}
#benefits .benefits_list > div{
	border:solid 2px #222;
	max-width: 348px;
	width: 100%;
	min-height: 257px;
	border-radius: 15px;
	position: relative;
	padding: 35px 36px 25px;
    transform: translate3d(0, 20%, 0) rotate(-15deg);
	transform-origin: right bottom;
	opacity: 0;	
}
@keyframes list_move {
  0% {
    transform: translate3d(0, 20%, 0) rotate(-15deg);
	opacity: 0;
	}
  80% {
    transform: translate3d(0, 0, 0);
  }	
  100% {
    transform: translate3d(0, 0, 0) rotateY(0);
	opacity: 1;
  }
}
#benefits .benefits_list > div.active{
    animation: list_move 1s ease-in-out forwards;	
}
#benefits .benefits_list > div:nth-child(2){
	animation-delay: 0.15s;
}
#benefits .benefits_list > div:nth-child(3){
	animation-delay: 0.3s;
}
#benefits .benefits_list > div:nth-child(4){
	animation-delay: 0.45s;
}
#benefits .benefits_list > div:nth-child(5){
	animation-delay: 0.6s;
}
#benefits .benefits_list > div:nth-child(6){
	animation-delay: 0.75s;
}
#benefits .benefits_list > div:nth-child(7){
	animation-delay: 0.9s;
}
#benefits .benefits_list > div:nth-child(8){
	animation-delay: 1.05s;
}
#benefits .benefits_list > div:nth-child(9){
	animation-delay: 1.2s;
}
#benefits .benefits_list > div:nth-of-type(4n - 3){
	background-color: #FFF;
}
#benefits .benefits_list > div:nth-of-type(4n - 2){
	background-color: #E6EEF3;
}
#benefits .benefits_list > div:nth-of-type(4n - 1){
	background-color: #E6D6C3;
}
#benefits .benefits_list > div:nth-of-type(4n){
	background-color: #E4E4E4;
}
#benefits .benefits_list .dots:before,
#benefits .benefits_list .dots:after,
#benefits .benefits_list > div::after,
#benefits .benefits_list > div::before{
	content:"";
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #222;
}
#benefits .benefits_list > div::after{
	top:10px;
	right:10px;
}
#benefits .benefits_list > div::before{
	top:10px;
	left:10px;
}
#benefits .benefits_list .dots:before{
	bottom:10px;
	right:10px;
}
#benefits .benefits_list .dots:after{
	bottom:10px;
	left:10px;
}
#benefits .benefits_list h3{
	text-align: left;
	font-size: 1.125rem;
	font-weight: 700;
	color: #0077A7;
	margin: 0;	
	margin-bottom: 10px;
}
#benefits .benefits_list p{
	font-weight: 600;
    line-height: 1.88;
}
#benefits .benefits_list p a{
	color: #0077A7;
	padding-left: 22px;
	position: relative;
}
#benefits .benefits_list p a::before{
	content:"";
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 5.5px 0 5.5px 9px;
	border-color: transparent transparent transparent #98A6B5;
	left:4px;
	top:8px;
}
#benefits .benefits_list p a:hover{
	text-decoration: none;
}
#qualification{
	padding: 74px 15px 107px;
}
#qualification .ttl_cnt{
	display: flex;
	max-width: 1108px;
	margin: auto;
	justify-content: space-between;
	align-items: center;
	overflow: hidden;
}
#qualification .ttl_cnt > div:first-child{
	max-width: 646px;
	margin-top: 50px;
}
#qualification .ttl_cnt::after{
	content: "";
	display: block;
	background: url("../images/recruit/qualification_img.webp") top left / 341px 247px no-repeat;
	width: 341px;
	height: 247px;
	padding-right: 26px;
    transform: translateY(100%);
    transition: transform .8s cubic-bezier(0.56, 0.03, 0.19, 1.00);
}
#qualification .ttl_cnt.active::after{
    transform: translateY(0);	
}
#qualification .qualification_list{
	display: flex;
    flex-wrap: wrap;
    gap: 14px 10px;
}
#qualification .qualification_list p{
	border:solid 2px #222;
	background-color: #0E6EB8;
	border-radius: 4px;
	color: #FFF;
	font-size: 1.125rem;
	max-width: fit-content;
	padding: 8px 20px;
}
#career{
	padding: 126px 15px 125px;
	background-color: #F7F7F7;
}
#career .career_cnt{
	max-width: 852px;
	margin: auto;
	padding: 10px 0 0;
}
#career .figure{
	display: flex;
	margin-bottom: 28px;
	gap: 10px 82.5px;
	flex-wrap: wrap;
	justify-content: flex-start;	
}
#career .figure p{
	width: 151px;
	height: 151px;
	border-radius: 50%;
	border:solid 2px #222;
	color: #0077A7;
	font-size: 1.4375rem;
	font-weight: 700;
	display: flex;
	align-items: center;
    justify-content: center;
	background-color: #FFF;
	position: relative;
	opacity: 0;
	transition: opacity .8s;
}
#career .figure.active p{
	opacity: 1;
}
#career .figure p:nth-of-type(1){
	transition-delay: .4s;	
}
#career .figure p:nth-of-type(2){
	background-color: #E6EEF3;
	transition-delay: 1.2s;
}
#career .figure p:nth-of-type(3){
	background-color: #FFE100;
	transition-delay: 2s;
}
#career .figure p:nth-of-type(4){
	background-color: #0E6EB8;
	color: #FFF;
	transition-delay: 2.8s;
}
#career .figure p:not(:last-child)::after{
	content:"";
	position: absolute;
	width:0;
	height:0;
	border-style:solid;
	border-width: 13px 0 13px 22px;
	border-color: transparent transparent transparent #222222;
	right:-45px;
	top:0;
	bottom:0;
	margin: auto;
	opacity: 0;
	transition: .5s;	
}
#career .figure.active p::after{
	opacity: 1;
	right:-55px;	
}
#career .figure p:nth-of-type(1)::after{
	transition-delay: .8s;	
}
#career .figure p:nth-of-type(2)::after{
	transition-delay: 1.6s;
}
#career .figure p:nth-of-type(3)::after{
	transition-delay: 2.4s;
}
#career .career_cnt > p{
	line-height: 1.85;
}
/* インタビュー */
#interview_faq{
	background-color: #F7F7F7;
	position: relative;
	overflow: hidden;
	padding: 52px 15px 125px;
}
#interview_faq .scroll-text-container{
	mix-blend-mode: normal;
	position: absolute;
	pointer-events: none;
}
#interview_faq p.animate-text{
	font-size: 9.5rem;
	font-weight: 600;
	font-family: gill-sans-nova;
	color: #FFF;
	line-height: 1;
	display: inline-block;
	min-width: auto;
	will-change: transform;
	margin-right: 30px;
	pointer-events: none;
	letter-spacing: 13px;
}
#interview_faq .profile_cnt{
	position: relative;
	z-index: 1;
	display: flex;
	gap: 33px;
	margin: 6px auto 0;
	max-width: 1108px;
	overflow: hidden;
}
#interview_faq .profile_cnt .img_cnt{
    display: flex;
	align-items: flex-end;
    min-height: 300px;
    min-width: 370px;
    max-width: 370px;	
    justify-content: flex-end;
	overflow: hidden;
}
#interview_faq .profile_cnt .img_cnt img{
	max-width: fit-content;
	width: 100%;
	height: auto;
	transform: translateY(100%);
	transition: transform .8s cubic-bezier(0.56, 0.03, 0.19, 1.00);	
}
#interview_faq .profile_cnt .img_cnt.active img{
	transform: translateY(0);
}
#interview_faq .profile_cnt .text_cnt{
	max-width: 629px;
	width: 100%;
	margin-top: 54px;
}
#interview_faq .profile_cnt h2{
    font-size: 1.625rem;
    color: #222222;
    padding-left: 0;
    letter-spacing: 0;
    margin: 0;
}
#interview_faq .profile_cnt h2:before{
	content: none;
}
#interview_faq .profile_cnt h2 + p{
	margin: 7px 0;
    letter-spacing: 2px;
}
#interview_faq .profile_box{
	border-top: solid 1px #0077A7;
	border-bottom: solid 1px #0077A7;
	background-color: #FFF;
	padding: 19px 10px 16px;
	position: relative;
	margin: 45px 0 30px;
}
#interview_faq .profile_box::before{
	position: absolute;
	content:"PROFILE";
	color: #0077A7;
	font-size: 1rem;
	top:-9px;
	left: 17px;
	line-height: 1;
    background: linear-gradient(transparent 53%, #FFF 0%);	
	padding: 0 7px;
}
#interview_faq .profile_box p{
	line-height: 1.85;
}
#interview_faq div.faq{
	counter-reset: cnt;
	padding: 0 44px 25px 32px;
	position: relative;
}
#interview_faq div.faq > .faq_cnt{
	position: relative;
	list-style: none;
	counter-increment: cnt;
	min-height: 86px;
	padding-left: 113px;
	margin-bottom: 59px;
}
#interview_faq div.faq > .faq_cnt:before{
	position: absolute;
	top: 0;
	left: 0;
	content: "Q" counter(cnt);
	font-size: 1.625rem;
	font-weight: 600;
	font-family: gill-sans-nova;
	color: #FFF;
	background-color: #222;
	border-radius: 10px;
	min-width: 86px;
	min-height: 86px;
	display: flex;
    justify-content: center;
    align-items: center;
	letter-spacing: 3px;
}
#interview_faq div.faq > .faq_cnt:after{
	content:"";
	position: absolute;
	width: 72px;
	height: 72px;
	border:solid 1px #FFF;
    top: 6px;
    left: 6px;
	border-radius: 1px;	
}
#interview_faq div.faq > .faq_cnt > p{
    font-size: 1.5rem;
    font-weight: 700;
    padding: 8px 0 24px;
    letter-spacing: 2.4px;
    line-height: 1.5;
    min-height: 104px;
    display: flex;
    align-items: center;
	
}
#interview_faq div.faq > .faq_cnt .answer p{
	color: #0077A7;
    font-size: 1.125rem;
    font-weight: 700;
	line-height: 1.75;
}
#interview_faq div.faq > .img_cnt ~ .faq_cnt:nth-of-type(n+5):nth-of-type(-n+9){
	max-width: 510px;
	float: left;
}
#interview_faq div.faq > .faq_cnt:nth-of-type(10){
	clear: both;
}
#interview_faq div.faq > .img_cnt{
    float: right;
    min-height: 890px;
    max-height: 890px;
    max-width: 331px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
#interview_faq div.faq > .img_cnt img{
	max-width: fit-content;
	width: 100%;
}
#work_flow{
	padding: 125px 15px;
}
#work_flow .schedule{
	position: relative;
	margin-top: 32px;
}
#work_flow .schedule::before{
	content:"";
    position: absolute;
    top: 8px;
    left: 1px;
    right: 0;
    margin: auto;
    height: calc(100% - 8px);
    width: 3px;
    background: url("../images/recruit/schedule_line.webp") top left / 3px 7px repeat-y;
}
#work_flow .schedule > div{
	display: flex;
	margin: auto;
	max-width: 918px;
	gap: 81px;
	justify-content: center;
	overflow: hidden;
}
#work_flow .img_cnt{
	max-width: 359px;
    display: block;
    height: auto;
    width: 100%;
}
#work_flow .img_cnt img{
	border-radius: 15px;
	overflow: hidden;
	max-width: 359px;
	max-height: 254px;
}
#work_flow .text_cnt{
	max-width: 460px;
	width: 100%;
}
#work_flow .schedule > div:nth-child(even) .text_cnt{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
#work_flow .schedule > div:nth-child(even) .text_cnt .schedule_list{
	flex-direction: row-reverse;
}
#work_flow .schedule_list{
	max-width: 365px;
	width: 100%;	
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 35px;
    position: relative;
    padding-left: 0;
}
#work_flow .schedule > div:last-child .schedule_list:last-child::before{
	content: "";
    width: 5px;
    height: calc(100% + 30px);
	min-height: 254px;
    background-color: #FFF;
    position: absolute;
	top: 5px;
    left: 8px;
    margin: auto;
    border-radius: 0;
}
#work_flow .schedule > div:nth-child(even):last-child .schedule_list:last-child::before{
    left: inherit;
	right: 7px
}
#work_flow .schedule_list > div{
	max-width:264px;
	width: 100%;
}
#work_flow .schedule_list p{
	line-height: 1.2;
}
#work_flow .schedule_list > p.time{
	display: none;
	font-size: 1.25rem;
	font-weight: 600;
	font-family: gill-sans-nova;	
}
#work_flow .schedule_list > div p.time{
	font-size: 1.125rem;
	font-weight: 700;	
	color: #0077A7;
}
#work_flow .schedule_list > div p.time span{
	font-size: 1.25rem;
	font-weight: 600;
	font-family: gill-sans-nova;
	color: #222;
	padding-right: 8px;
}
#work_flow .schedule_list .circle{
    display: block;
    width: 20px;
    height: 20px;
    background-color: #0077A7;
    border-radius: 50%;
    position: relative;
    margin-top: 5px;
}
#work_flow .schedule_list .circle::before{
	content: "";
	position: absolute;
    width: 8px;
    height: 8px;
    background-color: #FFF;
    border-radius: 50%;
	top: 6px;
    left: 6px;	
	z-index: 1;
}
#work_flow .schedule_list .circle::after{
	content: "";
	position: absolute;
    width: 78px;
    height: 2px;
    background-color: #0077A7;
    top: 9px;
    left: 10px;
}
#work_flow .schedule > div:nth-child(even) .schedule_list .circle::after{
    top: 9px;
    left: inherit;
	right: 10px;
}
#work_flow #sp_img{
	display: none;
}
#work_flow #sp_img img{
	border-radius: 15px;
    overflow: hidden;
	width: 100%;
	max-width: fit-content;
}
/* number */
#number {
	background-color: #F7F7F7;	
	padding: 107px 15px;
}
#number .number_list {
    max-width: 1108px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 31px 15px;
    margin: auto;
}
@media screen and (max-width: 1140px){	
	#number .number_list{
		max-width: 728px;
		justify-content: center;		
	}
}
#number .number_list > div {
    border: solid 2px #222;
    max-width: 348px;
    width: 100%;
    min-height: 313px;
    border-radius: 15px;
    position: relative;
    padding: 45px 36px 25px;
    transform: translate3d(0, 20%, 0) rotate(-15deg);
	transform-origin: right bottom;
	opacity: 0;	
}
#number .number_list > div.active{
    animation: list_move 1s ease-in-out forwards;	
}
#number .number_list > div:nth-child(2){
	animation-delay: 0.15s;
}
#number .number_list > div:nth-child(3){
	animation-delay: 0.3s;
}
#number .number_list > div:nth-child(4){
	animation-delay: 0.45s;
}
#number .number_list > div:nth-child(5){
	animation-delay: 0.6s;
}#number .number_list > div:nth-child(6){
	animation-delay: 0.75s;
}
#number .number_list > div:nth-child(7){
	animation-delay: 0.9s;
}
#number .number_list > div:nth-child(8){
	animation-delay: 1.05s;
}
#number .number_list > div:nth-child(9){
	animation-delay: 1.2s;
}
#number .number_list > div:nth-child(10){
	animation-delay: 1.35s;
}
#number .number_list > div:nth-child(11){
	animation-delay: 1.5s;
}
#number .number_list > div.two_cnt{
	max-width: 728px;
}
#number .number_list .dots:before,
#number .number_list .dots:after,
#number .number_list > div::after,
#number .number_list > div::before{
	content:"";
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #222;
}
#number .number_list > div::after{
	top:10px;
	right:10px;
}
#number .number_list > div::before{
	top:10px;
	left:10px;
}
#number .number_list .dots:before{
	bottom:10px;
	right:10px;
}
#number .number_list .dots:after{
	bottom:10px;
	left:10px;
}
#number .number_list h3{
	font-size: 1.375rem;
    margin: 0;
}
#number .number_list > div > .number_cnt + p,
#number .number_list > div > .number + p{
	line-height: 1.9;
    margin-top: 3px;	
}
#number .number_list .number_cnt{
	display: flex;
	justify-content: center;
	gap: 62px;
}
#number .number_list .number{
	font-size: 2.125rem;
	font-weight: 700;
	text-align: center;
	margin-top: 5px;
}
#number .number_list .number span{
	font-size: 7.9375rem;
	font-weight: 600;
	font-family: gill-sans-nova;
	line-height: 1;
	vertical-align: -5px;
}
#number .number_list .nyusha .number{
	color: #00ADEC;	
	font-size: 2rem;
	margin-right: -8px;
}
#number .number_list .nyusha .number span{
	font-size: 8rem;
	vertical-align: -7px;
	padding-right: 5px;
}
#number .number_list .syain .number:first-child{
	color: #23ABAF;
}
#number .number_list .syain .number:first-child span{
	padding-right: 13px;	
}
#number .number_list .syain .number:last-child{
	color: #6F93CC;
}
#number .number_list .syain .number:last-child span{
	padding-right: 9px;	
}
#number .number_list .zaisyoku .number{
	color: #A2C86C;
	margin-right: -17px;	
}
#number .number_list .zaisyoku .number span{
	padding-right: 13px;	
}
#number .number_list .syouyo .number{
	color: #E470A5;	
	margin-right: -102px;
}
#number .number_list .syouyo .number span{
	font-size: 7.875rem;
}
#number .number_list .mendan .number{
	color: #00ADEC;	
	margin-right: -37px;
}
#number .number_list .mendan .number span{
	padding-right: 3px;
	font-size: 7.875rem;
}
#number .number_list .kyuka .number:first-child{
	color: #E470A5;
}
#number .number_list .kyuka .number:first-child span{
	font-size: 8rem;
	padding-right: 0;
}
#number .number_list .kyuka .number:last-child{
	color: #FDB242;
}
#number .number_list .kyuka .number:last-child span{
	padding-right: 8px;
}
#number .number_list .zangyo .number{
	color: #A2C86C;
	margin-right: -71px;
}
#number .number_list .zangyo .number span{
	padding-right: 3px;
	font-size: 7.875rem;
}
#number .number_list .torihiki .number{
	color: #6F93CC;
	margin-right: -39px;
}
#number .number_list .torihiki .number span{
	padding-right: 5px;
}
#number .number_list .koutu .number{
	color: #23ABAF;
	margin-right: -37px;	
}
#number .number_list .koutu .number span{
	padding-right: 3px;
}
#number .number_list .kouhuku .number{
	color: #FDB242;
	margin-right: -37px;	
}
#number .number_list .kouhuku .number span{
	padding-right: 3px;
}
/* 募集要項 */
#description{
	background-color: #F7F7F7;	
	padding: 108px 15px;
}
#description .white_box h3{
	margin: 49px auto 46px;
}
#description .white_box table + h3{
	margin: 77px auto 46px;
}
#description ul li{
	position: relative;
	padding-left: 15px;
	margin-bottom: 3px;
}
#description ul li:last-child{
	margin-bottom: 0;	
}
#description ul li::before{
	position: absolute;
	content:"";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: #0077A7;
	left:0;
	top:10px;
}
#description .white_box{
	padding: 48px 62px 78px;
}
@media print {
	.recruit header p.side_btn{
		display: none;
	}
	#rec_top .move_cnt{
		position: static;
	}
	#rec_top p.rl_txt span{
		opacity: 1;
	}
	#rec_message .img_cnt img{
		transform: translateX(0);
	}
	#rec_message .message_cnt{
		align-items: flex-start;
	}
	#contents-top-recruit .img_cnt{
    	transform: translate(0, 0);
    	animation: none !important;	
	}
	#benefits .benefits_list > div{
    	transform: translate3d(0, 0, 0) rotate(0);
		opacity: 1;
    	animation: none !important;		
	}
	#qualification .ttl_cnt::after{
    	transform: translateY(0);
	}
	#career .figure p{
		opacity: 1;
	}
	#career .figure p:not(:last-child)::after{
		right:-55px;
		opacity: 1;
	}
	#interview_faq .profile_cnt .img_cnt img{
		transform: translateY(0);
	}
	#work_flow #sp_img{
		display: flex;
		gap:16px;
    	align-items: center;
		margin-top: 20px;
		justify-content: space-around;
	}	
	#number .number_list > div {
    	transform: translate3d(0, 0, 0) rotate(0);
		opacity: 1;	
	}
	#number .number_list {
        justify-content: center;
    }
	
}
