@charset "utf-8";

/* -----------------------------------------------------------
    MV
-------------------------------------------------------------- */
.lower-ttl-area {
	height: 550px;
}

.lower-ttl-area .int-mv-inner .img-area {
	height: 550px;
}

.lower-ttl-area .int-mv-inner .img-area img {
	object-position: top;
}

#recruit .h1-wrap h1 {
    top: 580px;
}
#recruit .breadcrumbs {
    top: 570px;
}


@media screen and (max-width: 768px) {
	.lower-ttl-area {
		height: 100%;
		margin-bottom: 0;
	}

	.lower-ttl-area .int-mv-inner .img-area {
		height:  100%;
	}
	
	.lower-ttl-area .int-mv-inner .img-area img {
		object-position: center;
	}
	
	.lower-ttl-area .txt-area {
		top: auto;
	}
	
	#recruit .h1-wrap h1 {
		top: 5px;
	}
}



/* -----------------------------------------------------------
    カテゴリーエリア
-------------------------------------------------------------- */
.interview-cate-list {
	/*background: url("../img/recruit-interview-catesearch-bg.jpg")no-repeat center / cover;*/
	padding: 40px;
	margin-bottom: 60px;
	border-radius: 20px;
	background-color: #F5F7F9;
}

.interview-cate-list .txt {
	border-bottom: solid 1px #002060;
	padding-bottom: 20px;
	margin-bottom: 20px;
	font-size: 1.6rem;
	font-weight: 700;
	color: #002060;
}

.interview-cate-list ul {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
.interview-cate-list ul li a {
	padding: 20px 25px;
	display: block;
	background: #fff;
	font-size: 1.8rem;
	font-weight: 600;
	text-align: center;
	box-shadow: 0px -1px 20px -5px rgb(81 45 10 / 9%);
	min-width: 360px;
	position: relative;
	border-radius: 40px;
}

.interview-cate-list ul li a::after {
    content: "\f105";
    color: #fff;
    font: 900 1.3rem/1 'Font Awesome 5 Free';
    position: absolute;
	top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 15px;
    z-index: 2;
    background: #002060;
    border-radius: 50%;
    width: 19px;
    height: 19px;
    text-align: center;
    transition: all .4s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.interview-cate-list ul li a:hover::after {
    right: 10px;
}

/*選択時　ボタン色反転*/
.case1 .interview-cate-list ul li:nth-child(1) a,
.case2 .interview-cate-list ul li:nth-child(2) a,
.case3 .interview-cate-list ul li:nth-child(3) a,
.case4 .interview-cate-list ul li:nth-child(4) a,
.case5 .interview-cate-list ul li:nth-child(5) a,
.case6 .interview-cate-list ul li:nth-child(6) a,
.case7 .interview-cate-list ul li:nth-child(7) a,
.case8 .interview-cate-list ul li:nth-child(8) a,
.case9 .interview-cate-list ul li:nth-child(9) a,
.case10 .interview-cate-list ul li:nth-child(10) a {
	background: #E05334;
	color: #fff;
}

.case1 .interview-cate-list ul li:nth-child(1) a::after,
.case2 .interview-cate-list ul li:nth-child(2) a::after,
.case3 .interview-cate-list ul li:nth-child(3) a::after,
.case4 .interview-cate-list ul li:nth-child(4) a::after,
.case5 .interview-cate-list ul li:nth-child(5) a::after,
.case6 .interview-cate-list ul li:nth-child(6) a::after,
.case7 .interview-cate-list ul li:nth-child(7) a::after,
.case8 .interview-cate-list ul li:nth-child(8) a::after,
.case9 .interview-cate-list ul li:nth-child(9) a::after,
.case10 .interview-cate-list ul li:nth-child(10) a::after {
    color: #E05334;
    background: #fff;
}


.interview-cate-list ul li {
	font-weight: 600;
	font-size: 1.8rem;
}

@media screen and (max-width: 768px){
	.interview-cate-list {
		padding: 15px;
	}

	.interview-cate-list .txt {
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	.interview-cate-list ul {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}
	
	.interview-cate-list ul li a {
		padding: 10px 25px 10px 15px;
		font-size: 1.6rem;
		min-width: 100%;
	}

	.interview-cate-list ul li a::after {
		font: 900 1rem/1 'Font Awesome 5 Free';
		right: 5px;
		width: 13px;
		height: 13px;
	}
	.interview-cate-list ul li a:hover::after {
		right: 10px;
	}
}




/* -----------------------------------------------------------
    社員紹介一覧
-------------------------------------------------------------- */
.interview-list-area {
	margin: 80px auto;
	padding-bottom: 80px;
}

.interview-list-area .interview-list {
	display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7rem 4.5rem;
}

.interview-list-area .interview-list li {
	
}

.interview-list-area .interview-list a {
	display: block;
	position: relative;
	border-radius: 20px;
}
.interview-list-area .interview-list a:hover {
	box-shadow: none;
}

.interview-list-area .interview-list .img-wrap {
	width: 100%;
	height: 415px;
	border-radius: 20px;
}

.interview-list-area .interview-list .img-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.interview-list a .txt-box {
	padding: 30px 0px 50px;
	position: relative;
}

.interview-list a .txt-box .catch {
	font-size: 2rem;
	color: #002060;
}

.interview-list a .job-cate {
	background-color: #00CCFF;
	padding: 5px 20px;
	border-radius: 10px;
	color: #fff;
	font-size: 2rem;
	font-weight: 700;
	position: absolute;
	top: -15px;
	left: -10px;
}
.interview-list a .job-cate p {
	font-weight: 700;
}
.interview-list a .job-cate:before {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 20px;
    border: 8px solid transparent;
    border-top: 10px solid #00CCFF;
    z-index: 0;
}

.interview-list a .name {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: 4rem;
	color: #002060;
	margin: 20px 0 20px;
}

.interview-list a .post-join {
	display: flex;
	align-items: center;
    gap: 20px;
}

.interview-list a .post-join .post {
	position: relative;
}
/*.interview-list a .post-join .post::after {
	content: "";
	width: 1px;
	height: 10px;
	display: inline-block;
	background-color: #333;
	margin-left: 18px;
}*/

.more-txt {
	font-family: "Space Grotesk", sans-serif;
	font-weight: 700;
	font-size: 1.4rem;
	text-align: right;
	padding: 0 10px 15px 0;
	border-bottom: solid 1px #333;
	display: inline-block;
	position: absolute;
	right: 0px;
	bottom: 0px;
	display: flex;
    align-items: center;
    gap: 15px;
}
.more-txt::after {
	content: "\f105";
    font: 900 1.3rem/1 'Font Awesome 5 Free';
    z-index: 2;
    transition: all .4s;
    display: block;
	right: 0px;
	position: relative;
}
.interview-list-area .interview-list a:hover .more-txt::after {
	right: -5px;
}


@media screen and (max-width: 1350px) {
	.inner.w-1400 {
	}
}


@media screen and (max-width: 768px) {
	.interview-list-area {
		margin: 40px auto;
		padding-bottom: 40px;
	}

	.interview-list-area .interview-list {
		display: flex;
		flex-direction: column;
    	align-items: center;
		gap: 20px;
	}

	.interview-list-area .interview-list li {

	}

	.interview-list-area .interview-list li:first-child {
		margin-top: 0px;
	}
	.interview-list-area .interview-list li:nth-child(2) {
		margin-top: 0px;
	}

	.interview-list-area .interview-list a {
		display: block;
		position: relative;
	}

	.interview-list-area .interview-list .img-wrap {
		height: 220px;
	}

	.interview-list-area .interview-list .img-wrap img {
	}
	
	.interview-list a .name-area {
		left: -10px;
	}
	}


/* -----------------------------------------------------------
    
-------------------------------------------------------------- */


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