@charset "UTF-8";
/* CSS Document */


/* chormeの補完機能 カラーoff*/
input:-webkit-autofill {
    transition: background-color 5000s ease-in-out 0s !important;
}

/* ---- top updown------- */
@keyframes updown-anim{
	0%{
		transform: translateY(103%);
		opacity:0;
	}
	50%{
		opacity:0;
	}
	100%{
		transform: translateY(0);
		opacity:1;
	}
}
.updown{
  display: flex;
  overflow: hidden;
}
.updown span{
  transform: translateY(103%);
  display: block;
}
.updown.active span{
  animation: 0.6s updown-anim ease-in-out forwards;
}
.updown span:nth-child(1) {
  animation-delay: 0s;
}
.updown span:nth-child(2) {
  animation-delay: 0.025s;
}
.updown span:nth-child(3) {
  animation-delay: 0.05s;
}
.updown span:nth-child(4) {
  animation-delay: 0.075s;
}
.updown span:nth-child(5) {
  animation-delay: 0.1s;
}
.updown span:nth-child(6) {
  animation-delay: 0.125s;
}
.updown span:nth-child(7) {
  animation-delay: 0.15s;
}
.updown span:nth-child(8) {
  animation-delay: 0.175s;
}
.updown span:nth-child(9) {
  animation-delay: 0.2s;
}
.updown span:nth-child(10) {
  animation-delay: 0.225s;
}
.updown span:nth-child(11) {
  animation-delay: 0.25s;
}

/* ---- top updown end------- */


/* ---- scrool fadein------- */
.fadein {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
}
.fadein.is-active {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition: 1s;
}
/* ---- scrool anim end------- */



/* ---- mainV ------- */

.mainV{
	width:100vw;
	height:100vh;
	position:relative;
	margin-bottom:150px
}

.mainV .image_container {
}
.mainV .image_container ol{
	display:flex;
	justify-content:space-between;
	position:fixed;
	z-index:-1;
	background-color: #fff;
	background-image: linear-gradient(#f0f0f0 1px, transparent 0),
                    linear-gradient(90deg, #f0f0f0 1px, transparent 0);
	background-size: 20px 20px;
}
.mainV .image_container ol ul{
    width:100vw;
    height: 100vh;
}
/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.mainV{
		margin-bottom:100px;
	}
}


/* ---- mainV anime.js------- */
.mainV .animation-wrapper {
}

/** Layered Animation **/

.mainV .layered-animations {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;
	filter: drop-shadow(0 5px 0px rgba(0, 0, 0, .9));
}

.mainV .layered-animations .shape {
  position: absolute;
  top: 50%;
  overflow: visible;
  width: 280px;
  height: 280px;
  margin-top: -140px;
  stroke: transparent;
  stroke-width: 1px;
  fill: url(#shapesGradient);
}

@media (min-width: 740px) {
.mainV .layered-animations .shape {
    stroke-width: .5px;
  }
}

.mainV .layered-animations .small.shape {
  width: 64px;
  height: 64px;
  margin-top: -32px;
  stroke: transparent;
 stroke-width: 1px;
  fill: currentColor;
}

.mainV .layered-animations .x-small.shape {
  width: 32px;
  height: 32px;
  margin-top: -16px;
  stroke: transparent;
	stroke-width: 1px;
  fill: currentColor;
}



/* ---- mainV company_logo------- */

.mainV .company_logo{
	left:20px;
	right:0;
	bottom:20px;
	position:absolute;
}
.mainV .company_logo.is-none {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
.mainV .company_logo.fade_image_effect.active{
	overflow:visible;
	animation: toplogo 4.8s cubic-bezier(0.6,0,0.4,1);
}
.mainV .company_logo.fade_image_effect dl{
}
.mainV .company_logo.fade_image_effect dl.main{
	width:100%;
	display:block;
	margin:0 0 0 0;
}
.mainV .company_logo.fade_image_effect dl.main .inner{
	display:flex;
	margin-bottom:4.7em;
}
.mainV .company_logo.fade_image_effect dl.main .inner:last-of-type{
	margin-bottom:0em;
}
.mainV .company_logo.fade_image_effect dl.main dt{
	font-size:100%;
	color:#000000;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend{
	animation-name:bgextendAnimeBase;
	animation-duration:1s;
	animation-fill-mode:forwards;
	position: relative;
	opacity:0;
	color:#000000;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend span{
	font-size:14rem;
}
@keyframes bgextendAnimeBase{
  from {
	    opacity:0;
  }
  to {
	    opacity:1;  
	}
}
.mainV .company_logo.fade_image_effect h1{
	font-size:1rem;
	display: flex;
    align-items: center;
	margin:1em 0 0 0;
}
.mainV .company_logo.fade_image_effect h1:after {
    content: "";
    height: 1px;
    flex-grow: 0.95;
    background-color: #666;
    margin-left: 1rem;
}
/* ----------1299px–---------- */
@media screen and (max-width: 1299px) {
	.mainV .company_logo.fade_image_effect dl.main dt.bgextend span{
		font-size:15vw;
	}
}
/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.mainV .company_logo.fade_image_effect dl.main dt.bgextend span{
		font-size:17vw;
	}
	.mainV .company_logo.fade_image_effect dl.main .inner{
		margin-bottom:3.0em;
	}
}
/* ----------768px–---------- */
@media screen and (max-width: 768px) {
	.mainV .company_logo.fade_image_effect dl.main .inner{
		margin-bottom:2.5em;
	}
}
/* ----------599px–---------- */
@media screen and (max-width: 599px) {
	.mainV .company_logo.fade_image_effect dl.main .inner{
		margin-bottom:2.0em;
	}
	.mainV .company_logo.fade_image_effect dl.main dt.bgextend span{
		font-size:16vw;
	}
	.mainV .company_logo.fade_image_effect h1{
		font-size:3vw;
	}
}
/* ----------499px–---------- */
@media screen and (max-width: 499px) {
	.mainV .company_logo.fade_image_effect dl.main .inner{
		margin-bottom:0.8em;
	}
}



/*中の要素*/
.mainV .company_logo.fade_image_effect dl.main dt.bgextend .bgappear{
	animation-name:bgextendAnimeSecond;
	animation-duration:1s;
	animation-delay: 0.7s;
	animation-fill-mode:forwards;
	opacity: 0;
}
.mainV .company_logo.fade_image_effect dl.sub dt.bgextend .bgappear{
	animation-name:bgextendAnimeSecond;
	animation-duration:1s;
	animation-delay: 4s;
	animation-fill-mode:forwards;
	opacity: 0;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(2) .bgappear{
	animation-delay: 1.0s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(3) .bgappear{
	animation-delay: 1.1s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(4) .bgappear{
	animation-delay: 1.2s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(5) .bgappear{
	animation-delay: 1.3s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(6) .bgappear{
	animation-delay: 1.4s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(7) .bgappear{
	animation-delay: 1.5s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(8) .bgappear{
	animation-delay: 1.6s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(9) .bgappear{
	animation-delay: 1.7s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(10) .bgappear{
	animation-delay: 1.8s;
}
.mainV .company_logo.fade_image_effect dl.main dt.bgextend:nth-child(11) .bgappear{
	animation-delay: 1.9s;
}

@keyframes bgextendAnimeSecond{
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
.catchttl{
	position:absolute;
	top:70px;
	right:100px;
}
.catchttl .ttl_inner{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-size:4.0vh;
	color:#000000;
}
/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.catchttl{
		position:absolute;
		right:40px;
	}
}
@media screen and (max-width: 599px) {
	.catchttl .ttl_inner{
		font-size:3.5vh;
	}
}

/* ---- mainV scroll ------- */

.scrolldown{
	position:absolute;
	right:0px;
	bottom:100px;
	height:50px;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	background:#fff;
	margin:auto;
}
.scrolldown span{
	position: absolute;
	left:-2em;
	top: 0px;
	font-size: 0.8rem;
	letter-spacing: 0.2em;
	font-weight:500;
	line-height:1em;
}
.scrolldown::after{
	content: "";
	position: absolute;
	top: 0;
	width: 2px;
	height: 0px;
	background: #000;
	animation: pathmove 1.4s ease-in-out infinite;
	opacity:0;
}
@keyframes pathmove{
	0%{
		height:0px;
		top:-50px;
		opacity: 0;
	}
	50%{
		height:50px;
		opacity: 1;
	}
	100%{
		height:0;
		top:150px;
		opacity: 0;
	}
}

/* ---- content .news_list------- */
.news_list{
	width:90%;
	max-width:900px;
	margin:0 auto 150px;
	align-items:center;
	display:flex;
	background:#fffe;
	padding:50px;
	box-sizing:border-box;
	box-shadow: 0 2rem 2rem -2rem hsl(200 50% 20% / 40%);
}
.news_list .wrap{
	height:fit-content;
	width:100%;
	justify-content:space-between;
}
.news_list .wrap .news_list_ttl{
	text-align:center;
}
.news_list .wrap .news_list_ttl h2{
	font-size:1.8rem;
}
.news_list .wrap .news_list_ttl h4{
	font-size:1.0rem;
	margin-bottom:1em;
	color:#142846;
}
.news_list .wrap ul{
	width:100%;
}
.news_list .wrap ul li{
	border-bottom:1px solid #ccc;
	padding:10px 0;
}
.news_list .wrap ul li:first-of-type{
	border-top:1px solid #ccc;
}
.news_list ul li .entry__inner{
	display:flex;
	justify-content:space-between;
}
.news_list ul li .entry__inner .entry__image{
	width:120px;
	height:80px;
	overflow:hidden;
}
.news_list ul li .entry__inner .entry__image img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.news_list ul li .entry__inner .entry__text{
	width:calc(100% - 140px);
	align-items:center;
	display:flex;
}
.news_list ul li .entry__inner .entry__text .sub_inner{
	height:fit-content;
}
.news_list ul li .entry__inner .entry__text .sub_inner .date{
	line-height:1em;
	margin-bottom:0.5em;
}
.news_list ul li .entry__inner .entry__text .sub_inner .date span{
	color:#a5310e;
}
.news_list ul li .entry__inner .entry__text .sub_inner h4{
}

/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.news_list .wrap{
		display:block;
		height:unset;
		width:100%;
		justify-content:unset;
	}
	.news_list .wrap .news_list_ttl{
		width:100%;
		margin-bottom:30px;
	}
	.news_list .wrap .news_list_ttl h2{
		text-align:center;
	}
	.news_list .wrap .news_list_ttl h4{
		text-align:center;
	}
	.news_list .wrap ul{
		width:100%;
	}
}
/* ----------768px–---------- */
@media screen and (max-width: 768px) {
	.news_list{
		padding:5%;
	}
	.news_list ul li .entry__inner .entry__text .sub_inner .date{
		font-size:0.8rem;
	}
}

/* ----------599px–---------- */
@media screen and (max-width: 599px) {
	.news_list .wrap .news_list_ttl h2{
		font-size:1.3rem;
	}
	.news_list .wrap .news_list_ttl h4{
		font-size:0.8rem;
	}
	.news_list ul li .entry__inner .entry__image{
		display:none;
	}
	.news_list ul li .entry__inner .entry__image img{
		vertical-align:bottom;
	}
	.news_list ul li .entry__inner .entry__text{
		width:100%;
		align-items:center;
		display:flex;
	}
}

/* ---- content .ep------- */
.content .ep{
	position:relative;
}
.content .ep_ttlinner{
	position:relative;
	display:flex;
	margin-bottom:100px;
	width:100%;
}
.content .ep_ttlinner h3{
	font-size:3.5vh;
	width: 2em;      
	margin:100vh auto 200px;
	writing-mode: vertical-rl;
	text-orientation: upright;
	white-space: nowrap;  
}
/* ---- scrool fadein------- */
.content .ep_ttlinner h3 .fadein {
    display: inline-block; /* ここを追加 */
    opacity: 0;
    transform: scale(2.0);
    transition: transform 1.5s ease, opacity 2.0s ease;
}
.content .ep_ttlinner h3 .fadein.is-active {
    opacity: 1;
    transform: scale(1.0);
}

/* ---- .ep_image_inner------- */
.ep_image_inner{
	position:sticky;
	height:100vh;
	width:70vw;
	top:0;
	left:0;
	align-items:center;
	display:flex;
	justify-content:space-between;
}
.ep_inner{
	width:100%;
	height:100%;
	max-width:600px;
	max-height:600px;
	position:relative;
	margin:auto;
}
.list-inner {
	width:100%;
	height:100%;
}
.ep_inner:before{
	content:"";
	display:block;
	position:absolute;
	top:0;
	left:0;
	background-image: linear-gradient(139deg, #decc99, #b08b20);
	height:80%;
	width:80%;
	z-index:-2;
	animation: rotateAnimation 10s cubic-bezier(1, 0.01, 0.31, 1) infinite;;
}
@keyframes rotateAnimation {
  0% {
    transform: rotate(0deg);
  }
	25% {
    transform: rotate(90deg);
  }
	50% {
    transform: rotate(180deg);
  }
	75% {
    transform: rotate(270deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.one {
	width: 100%;
	height:100%;
	overflow:hidden;
}
.list_bg {
	position:absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 80%;
	height: 80%;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0;
	transition: all 0.5s ease 0s;
	z-index: -1;
}
.show .list_bg {
	width: 80%;
	height: 80%;
	opacity: 1;
	box-shadow: 0 2.5rem 2rem -2rem hsl(200 50% 20% / 20%);
	border:1px solid #666;
}
.list_bg._01 {
	background-image: url("../../../../../img/recruit/ep_subimg_01.webp");
}
.list_bg._02 {
	background-image: url("../../../../../img/recruit/ep_subimg_02.webp");
}
.list_bg._03 {
	background-image: url("../../../../../img/recruit/ep_subimg_03.webp");
}
.list_bg._04 {
	background-image: url("../../../../../img/recruit/ep_subimg_04.webp");
}
.list_bg._05 {
	background-image: url("../../../../../img/recruit/ep_subimg_05.webp");
}
.list_bg._06 {
	background-image: url("./../../../../../img/recruit/ep_subimg_06.webp");
}


/* ----------768px–---------- */
@media screen and (max-width: 768px) {
	.content .ep_ttlinner h3{
		font-size:2.8vh;
		width: 2em;      
		margin:100vh auto 200px;
		writing-mode: vertical-rl;
		text-orientation: upright;
		white-space: nowrap;  
	}
	.ep_image_inner{
		height:100vh;
		top:0;
		left:0;
		align-items:center;
		display:flex;
	}
	.ep_inner{
		position:relative;
		margin:auto;
		height:70vw;
	}
}


/* ---- .content .ep_detail------- */

.content .ep_detail{
	width:90%;
	max-width:1000px;
	margin:0 auto 30vh;
	align-items:center;
	padding:0 0;
	position:relative;
}

/* ---- .content .ep_ttl_image------- */
.ep_ttl_image{
	position:relative;
}
.ep_ttl_image h6{
	font-size:2.5rem;
	color:#fff;
	display:block;
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
	height:fit-content;
	width:fit-content;
	text-align:center;
	line-height:1em;
}
.ep_ttl_image h6 em{
	margin-right:0.5em;
}
.ep_ttl_image h6 span{
	display:block;
	font-size:1.2rem;
	background: linear-gradient(-40deg, #decc99, #b08b20);;
	width:fit-content;
	margin:auto;
	line-height:1em;
	margin-top:1em;
	width:100%;
	padding:0.3em 0;
	border-radius:5px;
}
.ep_ttl_image .ep_ttl_image_inner{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
.ep_ttl_image .ep_ttl_image_inner dt{
	width:20%;
	position:relative;
}
.ep_ttl_image .ep_ttl_image_inner dt:after{
	content:"";
	display:block;
	width:100%;
	height:100%;
	background:#ccc6;
	position:absolute;
	top:0;
	left:0;
	mix-blend-mode:darken;
}
.ep_ttl_image .ep_ttl_image_inner dt img{
	width:100%;
	vertical-align:bottom;
}
/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.ep_ttl_image h6 span{
		width:fit-content;
		padding:0.3em 1em;
		font-size:2.5vw;
	}
}
/* ----------599px–---------- */
@media screen and (max-width: 599px) {
	.ep_ttl_image h6{
		font-size:16vw
	}
	.ep_ttl_image h6 em{
		margin-right:0em;
		display:block;
	}
	.ep_ttl_image h6 span{
		font-size:4.0vw;
		padding:0.5em 0
	}
	.ep_ttl_image .ep_ttl_image_inner dt{
		width:33.3333%;
		position:relative;
	}
}


/* ---- .content .ep_detail------- */
.content .ep_detail .ep_detail_wrap{
	padding:100px 70px;
	background:#fffe;
	box-shadow: 0 2.5rem 2rem -2rem hsl(200 50% 20% / 40%);
	box-sizing:border-box;

}
.content .ep_detail .ep_detail_ttl{
}
.content .ep_detail .ep_detail_ttl h4{
	font-size:1.8rem;
	margin-bottom:1em;
}
.content .ep_detail .ep_detail_text{
	line-height:2.3em;
}
.content .ep_detail .message{
	width:100%;
	padding:0;
	box-sizing:border-box;
}

.content .ep_detail .message:hover a{
  color: #fff;
}
.content .ep_detail .message:hover::after {
  transform: scale(1, 1);
}
.content .other .wrap a{
	display:flex;
	align-items:center;
}
.content .ep_detail .message{
	box-shadow: 0.5rem 1rem 1rem -1rem hsl(200 50% 20% / 40%);
	background: linear-gradient(139deg, #decc99, #b08b20);
}
.content .ep_detail .message a{
	display:flex;
	align-items:center;
	width:100%;
	height:100%;
	color:#fff;
}
.content .ep_detail .message a::after{
	content: url("../../../../../img/common/arrow_a_w.svg");
	margin:auto;
	z-index:2;
}

.content .ep_detail .message a .innner_img{
	width:50%;
	overflow:hidden;
}
.content .ep_detail .message a .innner_img img{
	width:100%;
	height:100%;
	object-fit:cover;
	vertical-align:bottom
}
.content .ep_detail .message a .innner_title{
	height:fit-content;
	margin:auto;
	z-index:2;
}
.content .ep_detail .message a .innner_title h2{
	font-size:1.5rem;
}
.content .ep_detail .message a .innner_title h6{
	font-size:1.0rem;
	margin-bottom:1em;
	border-bottom:0.5px solid #fff;
	padding-bottom:1em;
}
.content .ep_detail .message a .innner_title h4{
	font-size:1.0rem;
	line-height:2em;
}

/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.content .ep_detail .ep_detail_wrap{
		display:block;
		padding:100px 5%;
	}
	.content .ep_detail .ep_detail_ttl{
		width:100%;
		margin-bottom:50px;
	}
	.content .ep_detail .ep_detail_text{
		width:100%;
	}
}
/* ----------899px–---------- */
@media screen and (max-width: 899px) {
	.content .ep_detail .ep_detail_ttl h6{
		font-size:9.0vw;
	}
}

/* ----------599px–---------- */
@media screen and (max-width: 599px) {
	.content .ep_detail .ep_detail_wrap{
		display:block;
		padding:100px 5%;
	}
	.content .ep_detail .ep_detail_ttl{
		width:100%;
		margin-bottom:1.5em;
	}
	.content .ep_detail .ep_detail_ttl h4{
		font-size:1.3rem;
		margin-bottom:0.2em;
	}
	.content .ep_detail .ep_detail_ttl h6{
	}
	.content .ep_detail .ep_detail_text{
		font-size:100%;
	}
	.content .ep_detail .message a .innner_title h2{
		font-size:1.3rem;
	}
	.content .ep_detail .message a .innner_title h6{
		font-size:0.8rem;
	}
	.content .ep_detail .message a::after{
		content: url("../../../../../img/common/arrow_a_w.svg");
		margin:auto;
		z-index:2;
		top:unset;
		bottom:10px;
	}
	.content .ep_detail .message a{
		display:block;
		width:100%;
		height:100%;
	}
	.content .ep_detail .message a .innner_img{
		width:100%;
		height:unset;
		aspect-ratio:1 / 0.7;
		margin-right:unset;
	}
	.content .ep_detail .message a .innner_title{
		text-align:center;
		padding:50px 0;
		width:fit-content;
	}
}

	
/* ---- scroll-infinity------- */
.scroll-infinity{
	margin-bottom:30vh;
}
.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__wrap_b {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 20s infinite linear 0.5s both;
}
.scroll-infinity__list--right {
  animation: infinity-scroll-right 20s infinite linear 0.5s both;
}
.scroll-infinity__item {
  width: calc(100vw / 1);
}
.scroll-infinity__item > img {
  width: 100%;
}
@keyframes infinity-scroll-left {
	from {
	  transform: translateX(0);
	}
	  to {
	  transform: translateX(-100%);
	}
}
@keyframes infinity-scroll-right {
	from {
	  transform: translateX(-100%);
	}
	  to {
	  transform: translateX(0%);
	}
}
/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.scroll-infinity__item {
	  width: calc(100vw / 0.7);
	}
}
/* ----------599px–---------- */
@media screen and (max-width: 599px) {
	.scroll-infinity__item {
	  width: calc(100vw / 0.5);
	}
}

/* ---- content .recruit_content------- */
.recruit_content{
	width:100%;
}
.recruit_content .wrap{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
	width:90%;
	margin:auto;
	max-width:1400px;
}
.recruit_content .wrap li.entry{
	width:49%;
}
.recruit_content .wrap li.entry .entry__inner{
}
.recruit_content .wrap li.entry .entry__inner .entry__image{
}
.recruit_content .wrap li.entry .entry__inner .entry__image img{
	width:100%;
}

/* ---- content .recruit_content------- */
.content .recruit_content{
	width:90%;
	max-width:1200px;
	margin:0 auto 200px;
}

/* ---- content .recruit_content .newgraduates------ */
.content .recruit_content .newgraduates_wrap{
	height:500px;
	background:#000;
	position:relative;
	margin-bottom:200px;
	background:url("../../../../../img/recruit/newgra_img_bg.webp") center / cover;
	overflow:hidden;
	box-shadow: 0 2.5rem 2rem -2rem hsl(200 50% 20% / 40%);
	transition: .4s;
	filter:brightness(1);
	border: 10px solid;
	border-image: linear-gradient(to right, #becad0, #b89736) 1;
	box-sizing:border-box;
}
.content .recruit_content .newgraduates_wrap:hover {
  transform: translateY(10px);
  box-shadow: none;
	filter:brightness(1.5);
}
.content .recruit_content .newgraduates_wrap a{
	height:100%;
	width:100%;
	display:block;
	position:relative;
	z-index:1;
}
.content .recruit_content .newgraduates_wrap:after{
	content:"";
	height:100%;
	width:100%;
	display:block;
	position:absolute;
	top:0;
	left:0;
	background:#000;
	opacity:0.2
}
.content .recruit_content .newgraduates_wrap a.arrowbtn:after{
	width:20px;
	height:fit-content;
	position:absolute;
	right:20px;
	top:0px;
	bottom:0px;
	margin:auto;
	transition: .4s;
}
.content .recruit_content .newgraduates_wrap a.arrowbtn:hover:after{
	right:5px;
}
.content .recruit_content .newgraduates_wrap:hover:before{
	opacity:0;
}
.content .recruit_content .newgraduates_wrap .year_ttl{
	position:absolute;
	top:0px;
	bottom:0px;
	left:50px;
	height:fit-content;
	width:100%;
	margin:auto;
	font-size:3rem;
	color:#fff;
	line-height:1em;
	display: flex;
    align-items: center;
}
.content .recruit_content .newgraduates_wrap .year_ttl:after {
    content: "";
    height: 1px;
    flex-grow: 0.2;
    background-color: #fff;
	margin-left: 1rem;
}
.content .recruit_content .newgraduates_wrap .ttl{
	position:absolute;
	top:0px;
	bottom:0;
	right:70px;
	color:#fff;
	height:fit-content;
	margin:auto;
}
.content .recruit_content .newgraduates_wrap .ttl h2{
	font-size:2.2rem;
}
.content .recruit_content .newgraduates_wrap .ttl h6{
	font-size:0.8rem;
	text-align:center;
}
.content .recruit_content .newgraduates_wrap .btn{
	position:absolute;
	bottom:0;
	right:0;
	color:#fff;
	background:#fff;
}
.content .recruit_content .newgraduates_wrap:hover .year_ttl,
.content .recruit_content .newgraduates_wrap:hover .ttl h2,
.content .recruit_content .newgraduates_wrap:hover  .ttl h6{

	transition: .9s;
}
.content .recruit_content .newgraduates_wrap:hover .year_ttl:after {

	transition: .4s;
}

/* ----------959px–---------- */
@media screen and (max-width: 959px) {
	.content .recruit_content .newgraduates_wrap .ttl h2{
		font-size:4vw;
	}
	.content .recruit_content .newgraduates_wrap .ttl h6{
		font-size:1.5vw;
	}
	.content .recruit_content .newgraduates_wrap{
		height:50vh;
	}
	.content .recruit_content .newgraduates_wrap .year_ttl{
		position:absolute;
		top:10px;
		bottom:unset;
		left:10px;
		height:fit-content;
		margin:auto;
		font-size:2.5rem;
	}
	.content .recruit_content .newgraduates_wrap .ttl{
		position:absolute;
		top:unset;
		bottom:10px;
	}
	.content .recruit_content .newgraduates_wrap a.arrowbtn:after{
		top:unset;
		bottom:20px;
		margin:auto;
	}
}
/* ----------599px–---------- */
@media screen and (max-width: 599px) {
	.content .recruit_content .newgraduates_wrap .year_ttl{
		left:0px;
		right:0;
		height:fit-content;
		width:fit-content;
		margin:auto;
		font-size:3.0rem;
	}
	.content .recruit_content .newgraduates_wrap{
	}
	.content .recruit_content .newgraduates_wrap .ttl{
		position:absolute;
		left:0;
		right:0;
		margin:auto;
		width:fit-content;
	}
	.content .recruit_content .newgraduates_wrap .ttl h2{
		font-size:8vw;
	}
	.content .recruit_content .newgraduates_wrap .ttl h6{
		font-size:2vw;
	}
}


/* ---- content .recruit_content .midcareer------ */
.content .recruit_content .midcareer_wrap{
	width:100%;
	margin:auto;
}
.content .recruit_content .midcareer_wrap .ttl{
	margin-bottom:50px;
	width:100%;
}
.content .recruit_content .midcareer_wrap .ttl h2{
	font-size:1.8rem;
	display: flex;
    align-items:end
}
.content .recruit_content .midcareer_wrap .ttl h2:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #666;
    margin-left: 1rem;
}
.content .recruit_content .midcareer_wrap .ttl h6{
	font-size:1.0rem;
}
.content .recruit_content .midcareer_wrap .midcareer_inner{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap
}
.content .recruit_content .midcareer_wrap .midcareer_inner::after {
	display: block;
	content:"";
	width:33%;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry{
	width:32%;
	background:#fffe;
	margin-bottom:20px;
	overflow:hidden;
	transition: .4s;
	box-shadow: 0 2rem 2rem -2rem hsl(200 50% 20% / 40%);
	border: 5px solid;
	border-image: linear-gradient(to right, #becad0, #b89736) 1;
	box-sizing:border-box;
	padding
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry:hover {
  transform: translateY(10px);
  box-shadow: none;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner{
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__image{
	width:100%;
	overflow:hidden;
	aspect-ratio: 1 / 0.5;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__image img{
	width:100%;
	height:100%;
	object-fit:cover;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__text{
	padding:7%;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__text h2{
	font-size:1.1rem;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__text h5{
	font-size:0.7rem;
	margin:0 0 1.5em 0;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__text .btn{
	width:fit-content;
	border-radius:20px;
	margin:2em auto 0;
	background:#000;
	color:#fff;
	font-size:0.8em;
}
.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__text .btn p{
	font-size:0.8rem;
	padding:0.2em 3em 0.3em 2em;
}
/* ----------1099px–---------- */
@media screen and (max-width: 1099px) {
	.content .recruit_content .midcareer_wrap .midcareer_inner .entry a .entry__inner .entry__text{
		padding:10%;
	}
	.content .recruit_content .midcareer_wrap .midcareer_inner .entry{
		width:49.5%;
	}
}
/* ----------768px–---------- */
@media screen and (max-width: 768px) {
	.content .recruit_content .midcareer_wrap .midcareer_inner{
		display:block;
		justify-content:unset;
		flex-wrap:unset
	}
	.content .recruit_content .midcareer_wrap .midcareer_inner .entry{
		width:100%;
		max-width:500px;
		margin:0 auto 50px;
	}
	.content .recruit_content .midcareer_wrap .ttl h2{
		font-size:1.3rem;
		text-align:center;
		display:block;
	}
	.content .recruit_content .midcareer_wrap .ttl h2:after {
	    content:none;
	}
	.content .recruit_content .midcareer_wrap .ttl h6{
		font-size:0.8rem;
		text-align:center;
	}
}


/* ----------other–---------- */
.content .other{
	width:90%;
	max-width:900px;
	margin:auto;
	margin-bottom:200px;
}
.content .other > h2{
	font-size:1.3rem;
	margin-bottom:0.5em;
	display: flex;
    align-items:center;
}
.content .other h2:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #666;
    margin-left: 1rem;
}
.content .other .wrap{
	display:flex;
	justify-content:space-between;
	border-bottom:1px solid #666;
	padding:50px 0 100px;
}
.content .other .wrap > div{
	width:48%;
	position:relative;
	overflow:hidden;
	box-sizing:border-box;
	overflow: hidden;
	position: relative;
	z-index: 1;
	box-shadow: 0 2rem 2rem -2rem hsl(200 50% 20% / 40%);
}
.content .other .wrap > div::after {
	background: linear-gradient(139deg, #decc99, #b08b20);
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 100%;
	transform: scale(0, 1);
	transform-origin: left top;
	transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
	z-index: 1;
}
.content .other .wrap > div a{
	padding:40px;
	background:#fff;
}
.content .other .wrap > div a.arrowbtn::after{
	content: url("../../../../../img/common/arrow_a.svg");
	z-index:2;
	transition: 0.3s;
}
.content .other .wrap > div:hover a.arrowbtn::after{
	content: url("../../../../../img/common/arrow_a_w.svg");
	right:15px;
}
.content .other .wrap > div:hover a{
  color: #fff;
}
.content .other .wrap > div:hover::after {
  transform: scale(1, 1);
}
.content .other .wrap a{
	display:flex;
	align-items:center;
}
.content .other .wrap a dd{
	z-index:3;
	display:block;
}
.content .other .wrap a dd h2{
	font-size:1.3rem;
}
.content .other .wrap a dd h6{
	font-size:1.1rem;
}
.content .other .wrap a dt{
	width:150px;
	overflow:hidden;
	margin-right:20px;
}
.content .other .wrap a dt img{
	width:100%;
	object-fit:cover;
	height:100%;
	vertical-align:bottom;
}

/* ----------768px–---------- */
@media screen and (max-width: 768px) {
	.content .other .wrap{
		width:100%;
		max-width:unset;
		display:block;
		justify-content:unset;
	}
	.content .other .wrap > div{
		width:100%;
		margin-bottom:20px;
	}
	.content .other .wrap a dd h2{
		font-size:1.3rem;
	}
	.content .other .wrap a dd h6{
		font-size:1.1rem;
	}
}

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

/* ----------649px–---------- */
@media screen and (max-width: 649px) {
}
/* ----------599px–---------- */

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

/* ----------520px–---------- */
@media screen and (max-width: 520px) {
}
