@charset "utf-8";




/**リンクボタン****************************/
.btn_style01 {
    width: 300px;
    height: 60px;
    border-radius: 30px;
    border: 3px solid #019FE6;
    color: #019FE6 !important;
		background: rgba(255, 255, 255, 1);
		font-size: 15px;
    font-weight: 600;
		letter-spacing: 0.1em;
    display: flex;
    justify-content: center;
    align-items: center;
		margin-left: auto;
		margin-right: auto;
    transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
	position: relative;
}
.btn_style01:before {
	content: "";
	display: block;
	width: 20px;
	height: 2px;
	background: #019FE6;
	position: absolute;
	top: calc(50% - 1px);
	right: -10px;
	transition: .3s cubic-bezier(0.45, 0, 0.55, 1);
}

@media(min-width:768px){
	.btn_style01:hover {
		letter-spacing: 0.2em;
		background: rgba(233, 249, 255, 1);
	}
	.btn_style01:hover:before {
		right: -15px;
	}
}

@media(max-width:1520px){
	.image-left .cont-block {
		padding-right: 60px;
	}
	.image-right .cont-block {
		padding-left: 60px;
	}
}

@media(max-width:991px){
	.cont-block {
		width: 100%;
		height: auto;
		position: relative;
		top: auto;
		bottom: auto;
		margin-top: 20px;
		margin-bottom: 50px;
	}
	.image-left .cont-block, .image-right .cont-block  {
		padding-right: 30px;
		padding-left: 30px;
	}
	.img-block {
		width: 130%;
		aspect-ratio: 16 / 8;
		object-fit: cover;
	}
	.image-left .img-block {
		margin-right: -30%;
	}
	.image-right .img-block {
		margin-left: -30%;
	}
	.ttl-border {
    padding: 6px 0 6px 10px;
		border-left: 5px solid #019FE6;
	}
	.home .ttl-border {
		padding-bottom: 9px;
	}

}

@media(max-width:767px){
	.image-left .cont-block, .image-right .cont-block  {
		padding-right: 15px;
		padding-left: 15px;
	}
	.home .ttl-border h3 {
		font-size: 23px;
	}
	.home .ttl-border p {
		font-size: 16px;
	}
}


/************************************************************
求人サイト トップページ
************************************************************/

/*fv-recruit — ヒーロー動画 *****************************************/

#fv-recruit {
	width: 100%;
	height: 100svh;
	min-height: 560px;
	position: relative;
	overflow: hidden;
}

#fv-recruit video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.fv-copy-wrapper {
	position: absolute;
	inset: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	transform:translateY(5%);
	/* background: linear-gradient(135deg, rgba(0,66,37,0.60) 0%, rgba(1,159,230,0.30) 100%); */
}

@keyframes bgOn {
	0%   { background: rgba(0,0,0,0); }
	30%   { background: rgba(0,0,0,0); }
	100% { background: rgba(0,0,0,0.4); }
}

.fv-copy {
	display: inline-block;
	text-align: center;
	padding: 40px 50px;
	animation: bgOn 0.8s ease-out 0.8s both;
}

@keyframes fvFadeIn {
	0%   { opacity: 0; transform: translateY(24px); }
	100% { opacity: 1; transform: translateY(0); }
}

.fv-main-copy {
	font-size: 48px;
	line-height: 1.6;
	margin-bottom: 60px;
	text-shadow: 0 2px 12px rgba(0,0,0,0.4);
	animation: fvFadeIn 0.8s ease-out 0.8s both;
}

.fv-cta-btns {
	gap: 20px;
	animation: fvFadeIn 0.8s ease-out 1.2s both;
}

.fv-glass-btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px 40px;
	background: rgba(255,255,255,0.2);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255,255,255,0.75);
	box-shadow: 0 4px 24px rgba(255,255,255,0.18);
	border-radius: 8px;
	color: #fff!important;
	text-shadow: 0 1px 4px rgba(0,0,0,0.4);
	text-decoration: none;
	min-width: 260px;
	transition: filter 0.2s;
}

.fv-btn-en {
	font-size: 1.4rem;
	font-weight: 300;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	margin-bottom: 6px;
	opacity: 0.85;
}

.fv-btn-ja {
	font-size: 1.8rem;
	font-weight: 600;
	letter-spacing: 0.05em;
}
.fv-glass-btn:hover {
		filter: brightness(1.15);
	}

@media (min-width: 768px) {
	.fv-glass-btn:hover {
		filter: brightness(1.2);
		background: rgba(255,255,255,0.6);
		color: #666!important;
		text-shadow: 0 1px 4px rgba(255,255,255,0.4);
	}
}

@media (max-width: 1280px) {
	.fv-main-copy {
		font-size: 3.7vw;}
}
@media (max-width: 991px) {
	.fv-main-copy { font-size: 4.5vw; margin-bottom: 6vw; }
}
@media (max-width: 767px) {
	.fv-main-copy { font-size: 6vw; }
	.fv-cta-btns { flex-direction: column; align-items: center; }
	.fv-glass-btn { width: 90%; max-width: 320px; padding: 18px 30px; }
}
@media (max-width: 500px) {
	.fv-copy {
    padding: 40px 15px;
	}
	.fv-glass-btn {
    width: 100%;
    padding: 18px 10px;
  }
}


/*recruit-search — 検索フォーム *****************************************/

#recruit-search {
	background: #fff;
}

.area-banner {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	background: #019FE6;
	color: #fff !important;
	font-size: 24px;
	font-weight: 600;
	padding: 28px 40px;
	border-radius: 8px;
	margin-bottom: 30px;
	transition: background .2s;
	letter-spacing: 0.05em;
	position: relative;
	overflow: hidden;
}

@keyframes areaBannerShine {
	0%   { transform: translateX(-120%) skewX(-20deg); }
	100% { transform: translateX(300%) skewX(-20deg); }
}

.area-banner::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 35%;
	height: 100%;
	background: linear-gradient(
		to right,
		rgba(255,255,255,0) 0%,
		rgba(255,255,255,0.35) 50%,
		rgba(255,255,255,0) 100%
	);
	pointer-events: none;
	animation: areaBannerShine 2.8s ease-in-out 1s infinite;
}

.area-banner-arrow {
	flex-shrink: 0;
}

.area-banner-txt {
	flex: 1;
	text-align: left;
}

@media (min-width: 768px) {
	.area-banner:hover { background: #007bbf; }
}
@media (max-width: 500px) {
	.area-banner-icon {
		width: 70px;
		height: 70px;
		flex-shrink: 0;
 	}
	.area-banner-arrow {
		width:24px;
		height: 24px;
	}
}

.search-form-card {
	background: #F0F7F8;
	border-radius: 16px;
	padding: 50px 60px;
}

.search-form-row {
	display: flex;
	gap: 20px;
}

.search-field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}

.search-field--keyword { flex: 1.6; }

.search-label {
	font-size: 18px;
	font-weight: 600;
	color: #133F6C;
}

.search-input,
.search-select {
	height: 52px;
	border: 2px solid #C8DFE8;
	border-radius: 8px;
	padding: 0 16px;
	font-size: 15px;
	font-family: inherit;
	color: #222;
	background: #fff;
	transition: border-color .2s;
	appearance: none;
	-webkit-appearance: none;
}

.search-select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M0 0l6 7 6-7z' fill='%23019FE6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	padding-right: 40px;
	cursor: pointer;
}

.search-input:focus,
.search-select:focus {
	outline: none;
	border-color: #019FE6;
}

.search-btn {
	width: 320px;
	height: 60px;
	font-size: 16px;
	cursor: pointer;
}

@media (max-width: 991px) {
	.search-form-card { padding: 40px 30px; }
	.search-form-row { flex-direction: column; gap: 16px; }
	.search-field--keyword { flex: 1; }
}
@media (max-width: 767px) {
	.search-form-card { padding: 30px 20px; }
	.search-btn { width: 100%; }
	.area-banner { font-size: 15px; padding: 18px 20px; gap: 10px; }
}


/*セクション共通 — 装飾見出し・ラベル *****************************************/

.recruit-bg-heading-wrapper {
	width: fit-content;
	margin-top: -1.5vw;
}

.recruit-bg-heading {
	font-size: 6.7vw;
	opacity: 0.15;
	line-height: 1;
	/* margin-top: -1.5vw; */
	margin-left: -0.7vw;
	pointer-events: none;
	user-select: none;
}

.recruit-bg-heading--right {
	text-align: right;
	margin-left: 0;
	margin-right: -0.7vw;
}

.section-en-label {
	letter-spacing: 0.2em;
	text-transform: uppercase;
	display: block;
}

@media (max-width: 991px) {
	.recruit-bg-heading {
		font-size: 12vw;
		margin-top: -2vw;
	}
}

/*recruit-features — こだわり条件 *****************************************/

.sec-1-left { width: 66%; }
.sec-1-right { width: 33%; }
.sec-1-left_inner {
	margin-left: auto;
	margin-right: 0;
	padding-left: 60px;
	padding-right: 30px;
	max-width: 1000px;
}

.cond-check-list {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
}

.cond-check-list li { width: 50%; }

.cond-item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 16px;
	font-weight: 500;
	color: #333;
	cursor: pointer;
	padding: 12px 0;
	border-bottom: 1px solid #E5EEF2;
	width: 100%;
}

.cond-item input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	width: 20px;
	height: 20px;
	border: 2px solid #019FE6;
	border-radius: 4px;
	background: #fff;
	position: relative;
	cursor: pointer;
	flex-shrink: 0;
}
.cond-item input[type="checkbox"]:checked {
	background: #019FE6;
	border-color: #019FE6;
}
.cond-item input[type="checkbox"]:checked::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 45%;
	width: 5px;
	height: 9px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: translate(-50%, -50%) rotate(45deg);
}

.sec-1-right img {
	display: block;
	border-radius: 0 0 0 12px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.features-photos {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 80%;
	margin-right: 0;
	margin-left: auto;
}
.features-photos img {
	display: block;
	width: 49%;
	height: auto;
	border-radius: 12px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}
.features-photos img:nth-of-type(2) {
	margin-top: 5%;
}

.features-photos-sp {
	display: none;
}
.features-photos-sp img {
	display: block;
	border-radius: 12px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}


@media (max-width: 991px) {
	.sec-1-left { width: 100%; }
	.sec-1-right { display: none; }
	.features-photos{ display: none; }
	.features-photos-sp { display: block; }
	.sec-1-left_inner {
		margin-right: auto;
		padding-left: 30px;
		padding-bottom: 30px;
		padding-top: 30px;
	}
}

@media (max-width: 500px) {
	.cond-check-list li { width: 100%; }
	.home h3.txt-46 {
		font-size: 20px;
	}
	.section-en-label.txt-28 {
		font-size: 18px;
	}
	.sec-1-left_inner {
		padding-left: 15px;
		padding-right: 15px;
	}
}


/*recruit-job-types — 職種セクション *****************************************/

.sec-2-right { width: 66%; }
.sec-2-left { width: 33%; }
.sec-2-right_inner {
	margin-right: auto;
	margin-left: 0;
	padding-right: 60px;
	padding-left: 30px;
	max-width: 1200px;
}

.sec-2-right .recruit-bg-heading-wrapper {
	margin-right: 0;
	margin-left: auto;
}

.sec-2-left img {
	display: block;
	border-radius: 0 0 12px 0;
	box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

.job-types-img {
	width: 50%;
	overflow: hidden;
	flex-shrink: 0;
}

.job-types-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.job-type-grid {
	gap: 16px;
	row-gap: 16px;
}

.job-type-card {
	width: calc(50% - 8px);
	background: rgba(1,159,230,0.2);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 2px 10px rgba(0,0,0,0.08);
	transition: transform .2s, box-shadow .2s;
}

.job-type-card a {
	display: block;
	text-align: center;
}

.job-type-img {
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.job-type-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .4s;
}

.job-type-name {
	padding: 12px 8px 16px;
	color: #222;
}

@media (min-width: 768px) {
	.job-type-card:hover {
		transform: translateY(-4px);
		box-shadow: 0 6px 20px rgba(0,0,0,0.14);
	}
	.job-type-card:hover .job-type-img img {
		transform: scale(1.06);
	}
}

@media (max-width: 991px) {
	.sec-2-right { width: 100%; }
	.sec-2-left { display: none; }
	.sec-2-right_inner {
		margin-left: auto;
		padding-right: 30px;
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.sec-2-right .recruit-bg-heading-wrapper {
    margin-right: auto;
    margin-left: 0;
	}
	
	.job-types-img { width: 100%; aspect-ratio: 16 / 7; }
	.section-en-label.flow-right {
		text-align: right;
	}
}

@media (max-width: 500px) {
	.cond-check-list li { width: 100%; }
	.home h3.txt-46 {
		font-size: 20px;
	}
	.section-en-label.txt-28 {
		font-size: 18px;
	}
	.sec-2-right_inner {
		padding-left: 15px;
		padding-right: 15px;
	}
}



/*おすすめ求人スライダー(picks-slider) — トップページ「TOP PICKS」/
  「お仕事をお探しの方へ」ページ「FIND A JOB」の2箇所で共通使用 ***********/

#recruit-picks,
#for-worker_03 { position: relative; }

.picks-slider-wrap {
	position: relative;
	padding: 0 50px;
}

.picks-slider .slick-slide {
	padding: 0 10px;
}

.picks-slider-wrap .slick-track {
	display: flex;
	align-items: stretch;
}
.picks-slider-wrap .slick-slide {
	display: flex !important;
	height: auto !important;
}
.picks-slider-wrap .slick-slide > li,
.picks-slider-wrap .slick-slide > .job-card {
	height: 100%;
	width: 100%;
}

.picks-slider .slick-prev,
.picks-slider .slick-next {
	width: 40px;
	height: 40px;
	z-index: 1;
}
.picks-slider .slick-prev { left: 0; }
.picks-slider .slick-next { right: 0; }
.picks-slider .slick-prev::before,
.picks-slider .slick-next::before {
	color: #019FE6;
	font-size: 30px;
}

@media (min-width: 768px) {

	.picks-slider .slick-next {
		right: 0;
	}
}
@media (max-width: 991px) {
#recruit-picks .recruit-bg-heading-wrapper {
	margin-bottom: 30px;
}
}
@media (max-width: 767px) {
	.picks-slider-wrap { padding: 0 10px; margin-right: 0; }
}


/*recruit-jobseeker / recruit-employer *****************************************/

#jobseeker-employer {
	background-color: #fff;
	background-image:
		linear-gradient(rgba(0,0,0,0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0,0,0,0.05) 1px, transparent 1px);
	background-size: 40px 40px;
}

.ttl-border {
	border-left: 6px solid #019FE6;
	line-height: 1.4;
	padding: 10px 0 10px 20px;
}
.home .ttl-border {
	padding-bottom: 15px;
}

.img-block, .cont-block {
	width: 50%;
}
.cont-left {
	padding-left: 50px;
}
.cont-right {
	padding-right: 50px;
}

.img-block img {
	display: block;
	border-radius: 12px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

@media (max-width: 991px) {
	#jobseeker-employer .img-block { width: 100%; }
	#jobseeker-employer .img-block img {
		margin-left: auto;
		margin-right: auto;
		aspect-ratio: 16 / 9;
		object-fit: cover;
	}
	#jobseeker-employer .cont-block {width: 100%;}
	#jobseeker-employer .cont-left { padding-left: 30px; }
	#jobseeker-employer .cont-right { padding-right: 30px; }
	#jobseeker-employer .rev { flex-direction: row; }
}
@media (max-width: 767px) {
	#jobseeker-employer .cont-left { padding-left: 0; }
	#jobseeker-employer .cont-right { padding-right: 0; }
}


/*recruit-news — お知らせセクション *****************************************/

#recruit-news { position: relative; }

.recruit-section-header { display: block; }


/*recruit-footer-cta — フッターCTA *****************************************/

.footer-cta-banner a {
	display: block;
	width: 100%;
}
.footer-cta-banner img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
}
.footer-cta-row2 { width: 100%; }

.footer-cta-inquiry {
	border: 3px solid #019FE6;
	color: #019FE6 !important;
	background: rgba(255, 255, 255, 1);
	padding: 0 30px;
	column-gap: 15px;
	height: 70px;
	border-radius: 35px;
	letter-spacing: 0.1em;
	transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
	position: relative;
}

.footer-cta-icon {
	width: 38px;
}

.footer-cta-txt {
	width: calc( 100% - 56px );
	text-align: center;
}

.footer-cta-inquiry:before {
	content: "";
	display: block;
	width: 20px;
	height: 2px;
	background: #019FE6;
	position: absolute;
	top: calc(50% - 1px);
	right: -10px;
	transition: .3s cubic-bezier(0.45, 0, 0.55, 1);
}

@media(min-width:768px){
	.footer-cta-inquiry:hover {
		letter-spacing: 0.15em;
		background: rgba(233, 249, 255, 1);
	}
	.footer-cta-inquiry:hover:before {
		right: -15px;
	}
}


@media (max-width: 991px) {
	#recruit-footer-cta .flex-between { gap: 20px; }
	.footer-cta-inquiry:before { display: none; }
}
@media (max-width: 767px) {
	.footer-cta-inquiry { height: 64px; }
	.footer-cta-banner img { border-radius: 8px; }
	.footer-cta-icon { width: 30px; }
	.footer-cta-txt { width: calc( 100% - 45px ); }
}
@media (max-width: 500px) {
	.footer-cta-row2 br {
		display: none;
	}
	.footer-cta-row2 p {
		text-align: left;
		font-size: 17px;
	}
}