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

/************** main main_visual *****************************/
section#main_visual { background-image:url(../img/top/main_bg.jpg); background-position:center bottom; background-repeat:no-repeat; background-size:cover; padding: 2.5em 0 14em 0; overflow: hidden; }
section#main_visual .inner { position:relative; }

@keyframes main_inner_before {
	0% { bottom:-8em; opacity: 0 }
	100% { bottom:-4em; opacity: 1; }
}
section#main_visual .inner::before {
	animation: main_inner_before 1.2s;
	position:absolute; bottom:-4em; left:-17em; content:""; background-image:url(../img/top/main_before.png); background-size:100%; background-repeat: no-repeat; width:15em; height:15em;
}

@keyframes main_inner_after {
	0% { top:10em; opacity: 0 }
	100% { top:6em; opacity: 1; }
}
section#main_visual .inner::after {
	animation: main_inner_after 1.2s;
	position:absolute; top:6em; right:-15em; content:""; background-image:url(../img/top/main_after.png); background-size:100%; background-repeat: no-repeat; width:17em; height:14em;
}



section#main_visual .half { text-align:center; }
section#main_visual .half h2 { position: relative; margin:0; padding: 0.6em 0 0.6em 0; font-size:4.5em; line-height: 1.6em; text-shadow: 1px 2px 3px #FFF; }
section#main_visual .half h2::before {
	animation: fadein 1.5s ease;
	position:absolute; bottom:0.4em; left:-1em; content:"";
	background-image:url(../img/top/main_spark_before.png); background-size:100%; background-repeat: no-repeat; width:1.48em; height:1.38em;
}
section#main_visual .half h2::after {
	animation: fadein 1.5s ease;
	position:absolute; top:0.2em; right:-0.5em; content:"";
	background-image:url(../img/top/main_spark_after.png); background-size:100%; background-repeat: no-repeat; width:0.93em; height:1.08em;
}
section#main_visual .half p.caption { position: relative; display: inline-block; margin: 0 0 1.5em 0; font-size: 1.4em; font-weight: bold; text-shadow: 1px 2px 3px #FFF; }
section#main_visual .half p.caption::before { content: ""; position: absolute; display: inline-block; border-left: 3px double black; width: 1em; height: 1.3em; transform: rotate(-30deg); left: -1em; }
section#main_visual .half p.caption::after { content: ""; position: absolute; display: inline-block; border-right: 3px double black; width: 1em; height: 1.3em; transform: rotate(30deg); right: -1em; }

section#main_visual a.entry_btn {
	animation: fadein 1.8s ease;
	position:relative;
    font-size: 1.7em; color: #FFF; font-weight: bold;
    display: block; width: 14em; padding: 0.8em;
    border-top-left-radius: 1.8em; border-bottom-left-radius: 1.8em; border-top-right-radius: 1.8em; border-bottom-right-radius: 1.8em;
    margin: 1em auto 1em auto; box-shadow: 0px 5px 5px -5px rgba(0,0,0,0.5);
}
section#main_visual a.entry_btn i { position:absolute; top:calc(50% - 0.4em); right:0.8em; }
section#main_visual a.entry_btn::before {
	position:absolute; top:-2.2em; left:-2.2em; content:"";
	background-image:url(../img/top/main_free_before.png); background-size:100%; background-repeat:no-repeat;
	width:3.5em; height:3.5em;
}

div.prefecture { position:relative; padding-bottom:12em; }
section#top_area dl.area_list { width:9.4em; margin: 0; }
section#top_area dl.area_list dt {
	font-size:1em; font-weight:bold; text-align:center; color:#FFF;
	width:9em; margin:0; padding:0.2em 0 0.2em 0; box-shadow: 2px 3px 4px -3px rgba(0,0,0,0.3);
	border-top-left-radius: 1em;
    border-bottom-left-radius: 1em;
    border-top-right-radius: 1em;
    border-bottom-right-radius: 1em;
}
section#top_area dl.area_list dd { margin:0; padding:0.5em 0 0.5em 0; }
section#top_area dl.area_list dd a {
	display:inline-block; border:solid 2px #E96777; background-color:#FFF;
	text-align:center; margin:0.1em; padding:0.1em; width:4em;
	border-radius:0.4em;
}

section#top_area dl.area_list.hokkaido dd { text-align:center; }
section#top_area dl.area_list.hokkaido { position:absolute; top:0; right:8em; }
section#top_area dl.area_list.tohoku { position:absolute; top:6.5em; right:8em; }
section#top_area dl.area_list.kanto { position:absolute; top:18em; right:8em; }
section#top_area dl.area_list.tokai { position:absolute; top:32em; right:8em; }
section#top_area dl.area_list.hokuriku { position:absolute; top:7em; left:31em; }
section#top_area dl.area_list.kansai { position:absolute; top:32em; left:43em; }
section#top_area dl.area_list.shikoku { position:absolute; top:32em; left:31.7em; }
section#top_area dl.area_list.chugoku { position:absolute; top:7em; left:19.8em; }
section#top_area dl.area_list.kyusyu { position:absolute; top:19em; left:8em; }

section#top_area,
section#top_search { padding:1.5em 0 1.5em 0; }

section#top_search dl.search_tbl { margin:0; width: 100%; }
section#top_search dl.search_tbl dt { width:12em; padding:1em; font-weight: 500; }
section#top_search dl.search_tbl dd { width:calc(100% - 14em); padding:1em; font-weight: 400; }
section#top_search .border_bottom { border-bottom:solid 1px #AAAAAA; box-sizing:border-box; }
section#top_search .border_right { border-right:solid 1px #AAAAAA; box-sizing:border-box; }



section.private_job { padding:3em 0 3em 0; }
section#top_service { padding:3em 0 0 0; }
section#top_service .sub_ttl { padding:0 0 1em 0; }
section#top_service p { margin:0; padding:0 0 2em 0; }
section#top_service .to_recruiters_text {font-size: 1.8em;line-height: 1.5;margin-bottom: 1em;}
section#top_service .to_recruiters_title {font-size: 1.4em;font-weight: bold;}
section#top_service div.career { position: relative;padding: 4em 2.5em 1.5em 2.5em;margin: 1em 0 3em 0;border-radius: 1em;border: 5px solid #E96677; }
section#top_service div.career .carrer_title { position: absolute;z-index: 2;margin: auto;top: -1em;right: 0;left: 0;display: inline-block;width: 24em;padding: 0.2em 1em 0.2em 2em;font-size: 1.33em;
font-weight: bold;border-radius: 2em; }
section#top_service div.career p.c_rsn { font-size: 1.063em;padding:0;}
section#top_service div.career ul.car_adr { list-style-type: none;padding: 0; }
section#top_service div.career ul.car_adr li{ 
	font-size: 1.125em;
	border: 2px solid #E96777;
	width: 15em;
	margin: 0 auto 0.5em;
	border-radius: 2em;
	font-weight: bold;
	letter-spacing: 0.05em;
	padding: 0.12em 0; 
}
section#top_service div.career span.result { padding: 0.3em 0;width: 16em;font-size: 1.125em;border-radius: 2em;position: relative;margin:1.7em auto 3em; }
section#top_service div.career span.result::after {
	font-family: 'Font Awesome 6 Pro';
	font-weight: 900;
	content: "\f0d7";
	position: absolute;
	bottom: -1.4em;
	right: 0;
	left: 0;
	margin: auto;
	text-align: center;
	font-size: 3em;
	color: #E96777;
}
section.merit dl.merit_box dt span {
	display: inline-block;
	width: 7em;
	border-radius: 1em;
	font-weight: bold;
	font-size: 1em;
	margin-right: 1em;
	letter-spacing: 0.05em;
}
section#top_service section.merit dl.merit_box dd { font-size: 1.25em;font-weight: bold; }
section#top_service p.car_txt { font-size: 1.375em;font-weight: bold;padding-bottom: 1em; }
section#top_service p.car_txt:last-of-type { padding-bottom:2em; }
.sp_b { display:none; }
.pc_b { display:block; }

/*top_blog*/
section#top_blog {padding-block: 2em 3.25em;}
section#top_blog .inner {}
section#top_blog .sub_ttl {}
section#top_blog .sub_ttl i {margin-right: 0.24em;}
section#top_blog .view_content {inline-size: min(1170px,100%);box-sizing: border-box;border: 8px solid #48bdce;margin: 0 auto 3.5em auto;border-radius: 1em;box-shadow: 5px 5px 0 #e5e5e5;}
section#top_blog .view_content .blog_link1 {display: block;color: #fff;font-weight: bold;background-color: #48bdce;font-size: 1.75em;padding: 0 0.25em 0.35em 0.75em;}
section#top_blog .view_content .text {margin: 0;display: block;box-sizing: border-box;padding: 1.25em 23% 1em 2em;letter-spacing: 0.04em;background-image: url(../img/top/top_blog_bg.jpg);background-position: bottom center;background-repeat: no-repeat;background-size: cover;color: #858585;border-radius: 0 0 0.75em 0.75em;}
section#top_blog .view_content .img1 {inset: auto 0.25em -1.75em auto;inline-size: min(385px,34%);}
section#top_blog .headline {background-color: #48bdce;color: #fff;box-sizing: border-box;margin-block: 0 1.055em;font-weight: bold;font-size: 1.188em;letter-spacing: 0.03em;padding: 0.35em 0.5em 0.5em 3.8em;border-radius: 0.5em 0.5em 0 0;}
section#top_blog .fa-circle-arrow-right {margin-inline-start: 2em;}
section#top_blog .headline .icon {inline-size: min(48px,2.55em);inset: 50% auto auto 0.8em;transform: translateY(-50%);}
section#top_blog .post {inline-size: min(370px,30%);}
section#top_blog .post .post_thumbnail {display: block;inline-size: 100%;}
section#top_blog .post .post_thumbnail a {display: block;inline-size: 100%;position: relative;block-size: auto;aspect-ratio: 370 / 223.85;overflow: hidden;border-radius: 0.5em;}
section#top_blog .post .post_thumbnail a img {inline-size: 100%;block-size: auto;border-radius: 0.5em;position: absolute;margin: auto;inset: 0;object-fit: cover;}
section#top_blog .post .post_thumbnail.no_img a img {box-sizing: border-box;border: 2px solid #EEE;}
section#top_blog .post .post_date {font-size: 0.875em;letter-spacing: 0.03em;font-weight: bold;color: #e96677;box-sizing: border-box;padding: 1em 0.5em 0.5em 3.25em;margin-block-start: 1em;}
section#top_blog .post .post_date:before {content: "";position: absolute;background-image: url(../img/top/blog_icon.png);inline-size: min(38px, 2.65em);block-size: auto;aspect-ratio: 95 / 89;inset: 50% auto auto 0;transform: translateY(-50%);background-position: center;background-size: cover;}
section#top_blog .post .post_title {font-size: 1.313em;display: block;margin-block: 0.05em 0.5em;line-height: 1.65em;}
section#top_blog .post .post_title a {}
section#top_blog .post .post_content {color: #878787;}
section#top_blog .blog_link2 {background-color: #e96777;color: #fff;font-size: 1.375em;inline-size: fit-content;padding: 0.6em 4.35em 0.75em 4.65em;border-radius: 4em;box-shadow: 5px 5px 0 #e5e5e5;margin-block-start: 1.875em;font-weight: bold;}
section#top_blog .blog_link2 .fa-circle-arrow-right {inset: 50% 1em auto auto;transform: translateY(-50%);}



@media (min-width: 1024px) and (max-width: 1280px) {
    section#top_blog .view_content .text {padding: 1.25em 32% 1em 2em;}
}
@media (min-width: 768px) and (max-width: 1023px) {
    section#top_blog .view_content .text {padding: 1.25em 35% 1em 1em;}
}
