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

body { font-size:calc(18 * 0.2vw); }
:target { scroll-margin-top: calc(130vw / 7.2); }


.fs12vw { font-size:calc(12 * 0.21vw); }
.fs14vw { font-size:calc(14 * 0.2vw); }
.fs15vw { font-size:calc(15 * 0.2vw); }
.fs16vw { font-size:calc(16 * 0.2vw); }
.fs17vw { font-size:calc(17 * 0.2vw); }
.fs18vw { font-size:calc(18 * 0.2vw); }
.fs20vw { font-size:calc(20 * 0.19vw); }
.fs21vw { font-size:calc(21 * 0.19vw); }
.fs22vw { font-size:calc(22 * 0.19vw); }
.fs23vw { font-size:calc(23 * 0.17vw); }
.fs24vw { font-size:calc(24 * 0.16vw); }
.fs25vw { font-size:calc(25 * 0.16vw); }
.fs26vw { font-size:calc(26 * 0.16vw); }
.fs27vw { font-size:calc(27 * 0.16vw); }
.fs28vw { font-size:calc(28 * 0.16vw); }
.fs29vw { font-size:calc(29 * 0.16vw); }
.fs30vw { font-size:calc(30 * 0.16vw); }
.fs31vw { font-size:calc(31 * 0.16vw); }
.fs32vw { font-size:calc(32 * 0.16vw); }
.fs33vw { font-size:calc(33 * 0.16vw); }
.fs34vw { font-size:calc(34 * 0.16vw); }
.fs35vw { font-size:calc(35 * 0.16vw); }
.fs36vw { font-size:calc(36 * 0.15vw); }
.fs37vw { font-size:calc(37 * 0.15vw); }
.fs38vw { font-size:calc(38 * 0.15vw); }
.fs40vw { font-size:calc(40 * 0.15vw); }
.fs42vw { font-size:calc(42 * 0.15vw); }
.fs45vw { font-size:calc(45 * 0.13vw); }
.fs46vw { font-size:calc(46 * 0.13vw); }
.fs48vw { font-size:calc(48 * 0.11vw); }
.fs50vw { font-size:calc(50 * 0.11vw); }
.fs52vw { font-size:calc(52 * 0.11vw); }
.fs53vw { font-size:calc(53 * 0.11vw); }
.fs54vw { font-size:calc(54 * 0.11vw); }
.fs55vw { font-size:calc(55 * 0.11vw); }
.fs56vw { font-size:calc(56 * 0.11vw); }
.fs60vw { font-size:calc(60 * 0.11vw); }
.fs62vw { font-size:calc(62 * 0.11vw); }
.fs64vw { font-size:calc(64 * 0.11vw); }
.fs65vw { font-size:calc(65 * 0.11vw); }
.fs66vw { font-size:calc(66 * 0.11vw); }
.fs68vw { font-size:calc(68 * 0.11vw); }
.fs70vw { font-size:calc(70 * 0.1vw); }
.fs72vw { font-size:calc(72 * 0.1vw); }
.fs80vw { font-size:calc(80 * 0.1vw); }
.fs84vw { font-size:calc(84 * 0.095vw); }
.fs100vw { font-size:calc(100 * 0.07vw); }
.fs110vw { font-size:calc(100 * 0.07vw); }
.fs140vw { font-size:calc(140 * 0.1vw); }

.pc { display: none; }
.sp { display: unset; }
.sp_left { text-align:left; }

.more { width: 60vw; height: 13vw; line-height: 13vw; margin: 2em auto 2em auto; }
.more i { right: 4.5vw; line-height: 13vw;}
.more.center {  margin: 2em auto 2em auto;}



.bottom_contact .inner .email_btn { width: 60vw; height: 13vw; line-height: 13vw; margin: 2.5em auto 2em auto; }


.inner { width: 92%; max-width: unset; }
.middle_inner { width: 90%; max-width: unset; }
.inner_right { width: 90%; max-width: unset; margin-right:auto; margin-left:auto; }
.inner_left { width: 90%; max-width: unset; margin-right:auto; margin-left:auto; }

.low_inner { width: 90%; max-width: unset; }




.ttl .slug::before { inset: -0.05em auto 0 -1em; clip-path: inset(0 0.4em 0 0); width: calc(47vw / 6.2); height: calc(47vw / 6.2); }









#header { height: calc(130vw / 7.2); padding:0; background-color: #FFFFFF; }
#header .header_inner { width:100%; }

#header .logo { width: calc(420vw / 6.2); height: auto; line-height: 1; }
#header .logo a.flex .logo_thumb { width: calc(90vw / 7.2); }

#google_translate_element { position: static; }
#google_translate_element .goog-te-gadget-simple { font-size: inherit; }




#header #hamburger { background: none; z-index: 9999; }
#header #hamburger .bar {
	display: block; width: calc(60vw / 6.2); height: 2px;
	transition: transform 0.3s ease, opacity 0.3s ease;transform-origin: center center; transform: none;
}

#header.is_scrolled .bar { background-color:#0E2648; }

#header #hamburger .bar_1 { margin-block-end:calc(15.25vw / 6.2); }


#header #hamburger.active .bar_1 { transform: translateY(var(--offset)) rotate(45deg); }
#header #hamburger.active .bar_2 { transform: translateY(calc(var(--offset) * -1)) rotate(-45deg); }


#header .header_nav.right { float:none; }



#header #drawer {
	position: fixed;top: 0;left: 0;width: 100%; height: 100%; display: flex; opacity:0;transition: opacity 0.3s ease; pointer-events:none;
	justify-content: flex-start; align-items: flex-start; z-index: 1000;
}
#header #drawer.open {opacity:1; pointer-events:auto;}

#header #drawer .drawer_content {width: 100%;height: 100%;transform: translateX(200%);transition: transform 0.3s ease; padding: 5em 2em 4em 2em; grid-template-rows: 20em; background-color:#FFFFFF; }
#header #drawer.open .drawer_content {transform: translateX(0);}
#header .drawer_menu .drawer_content .drawer_content_wrapper { display: block; }

#header .header_nav ul.flex { display:block; margin: 2em 0 3em 0; }

#header .header_nav ul .page { margin: 0; padding: 0.5em 0 0.5em 0; border-bottom: solid 2px #45514D }
#header .header_nav ul .page a { font-size:calc(40 * 0.15vw); }
#header .header_nav ul .page .separate { display:none; }
#header .header_nav .email_btn { display:none; }


#header .contact_block {  }
#header .contact_block .contact_block_ttl {  }
#header .contact_block .contact_block_ttl .slug { position: relative; display:block; width:max-content; margin: 0 auto; }
#header .contact_block .contact_block_ttl .slug::before {
	content: ""; position: absolute; z-index: 0; border: solid 2px #177D4A; border-radius: 100vmax;
	inset: -0.05em auto 0 -1em; clip-path: inset(0 0.4em 0 0); width: calc(47vw / 6.2); height: calc(47vw / 6.2);
}

#header .contact_block .contact_block_tel_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
#header .contact_block .contact_block_email_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
#header .contact_block .tel_icon { width: calc(28vw / 7.2); aspect-ratio: 7 / 10; margin-right:0.3em; }
#header .contact_block .email_icon { width: calc(41vw / 7.2); aspect-ratio: 41 / 26; margin-right:0.3em; }


.bottom_contact { padding: 1em 0 4em 0; }
.bottom_contact .low_inner.flex { display:block; }

.bottom_contact .bottom_contact_ttl { width: calc(100% - 3em); }
.bottom_contact .bottom_contact_ttl::before { inset: 0 auto 0 -3em; clip-path: inset(0 0.3em 0 0);  width: calc(290vw / 7.2); height: calc(290vw / 7.2); }
.bottom_contact .bottom_contact_ttl .slug { margin-block-end: 0.5em; }

.bottom_contact .text { width: 100%; padding: 3em 0 0 0; }
.bottom_contact .btn_box { display:block; }

.bottom_contact .btn_box .tel_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
.bottom_contact .btn_box .email_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
.bottom_contact .text .tel_btn .tel_icon { width: calc(28vw / 7.2); aspect-ratio: 7 / 10; margin-right:0.3em; }
.bottom_contact .text .email_btn .email_icon { width: calc(41vw / 7.2); aspect-ratio: 41 / 26; margin-right:0.3em; }



#footer .middle_inner.flex { display:block; }
#footer .site_info { width: 100%; }
#footer .site_info .logo { width: calc(420vw / 6.2); height: calc(64vw / 7.2); }
#footer .site_info .logo a.flex .logo_thumb { width: calc(90vw / 7.2); }


#footer .footer_nav { width: 100%; }
#footer .footer_nav ul.flex { display:block; }
#footer .footer_nav ul.flex li { margin:1em 0 1em 0; }
#footer .footer_nav ul .page .separate { display:none; }

#footer .copy { padding: 2em 0 2em 0; margin: 0 auto; text-align: center; }





#fv { aspect-ratio: 9 / 12; background-size: calc(1595vw / 6.3); background-position: center top; overflow: hidden; }
#fv .fv_illust { inset: 5em 0 0 0; width: 100%; aspect-ratio: 1072 / 1393; }
#fv .fv_recruit { inset: auto 1em 18em auto; width: calc(320vw / 10.2); }
#fv .catch { inset: auto auto calc(100vw / 12.2) calc(60vw / 19.2); }


.illust1 { width: calc(282vw / 12.2);  height: calc(794vw / 12.2); }
.illust2 { width: calc(283vw / 12.2); height: calc(795vw / 12.2); }


#top_about { top: -3em; }
#top_about .top_about_wrapper { border-top-right-radius: 3em; border-top-left-radius: 3em; padding: 3em 0 2em 0; }

#top_about .top_about_wrapper::before { width: calc(115vw / 12.2); border-top-left-radius: 3em;}
#top_about .top_about_wrapper::after { inset: calc(55vw / 12.2) 0 0 calc(55vw / 12.2); width: calc(65vw / 12.2); }


#top_about .text { width:100%; float:none; }
#top_about .thumb { display: block; width:100%; float:none; margin-block-start: 3em; }

#top_our_business .text { width:100%; float:none; }
#top_our_business .thumb { display: block; width:100%; float:none; margin-block-start: 3em; }


#top_our_business .top_our_business_wrapper { border-bottom-right-radius: 3em; border-bottom-left-radius: 3em; }


#top_recruit {
	padding: 4em 0 4em 0;
	background: linear-gradient(to bottom, #FED516 0, #FED516 calc(800vw / 7.2), transparent calc(800vw / 7.2));
}
#top_recruit .text { border-radius: 2.5em; padding: 0.5em 2em 2em 2em; inset: auto 0 -3em 0;}
#top_recruit .top_recruit_illust { width: calc(727vw / 14.2); }
#top_recruit::after { top: calc(800vw / 7.2); height: calc(240vw / 7.2); }

#top_about .illust1 { inset: auto 0 -7em auto; }



.page_header { display: block; height: calc(806vw / 8.2); overflow:hidden; }
.page_header .page_header_ttl { margin: 2.5em 0 0 0; }
.page_header .page_header_illust { inset: 5em 0 auto auto; }

#page_header_about .page_header_illust { width: calc(839vw / 11.2); inset: 4em -3em auto auto; }
#page_header_business .page_header_illust { width: calc(1241vw / 11.2); inset: 5em -1em auto auto; }
#page_header_contact .page_header_illust { width: calc(921vw / 11.2); inset: 4em -5em auto auto; }
#page_header_recruit .page_header_illust { width: calc(1280vw / 12.2); }
#page_header_recruit_entry .page_header_illust { width: calc(1280vw / 12.2); }



#page_header_recruit { height: calc(806vw / 8.2); }
#page_header_recruit .page_nav { width: 100%; justify-content: space-between; gap: 0; }
#page_header_recruit .page_nav .page_nav_btn { width: 32.5%; height: calc(80vw / 7.2); padding: 0 calc(60vw / 19.2); font-size: calc(18 * 0.18vw); }

#page_header_recruit .page_nav .page_nav_btn .circle .triangle_icon { width: calc(20vw / 8.2); }
#page_header_recruit .page_nav .page_nav_btn .circle { width: calc(56vw / 14.2); height: calc(56vw / 14.2); }



.page_second_wrapper { border-top-right-radius: 3em; border-top-left-radius: 3em; padding: 3em 0 6em 0; }
.page_second_wrapper::before { width: calc(115vw / 12.2); border-top-left-radius: 3em; }
.page_second_wrapper::after { inset: calc(55vw / 12.2) 0 0 calc(55vw / 12.2); width: calc(120vw / 12.2); }


#message { background: linear-gradient(to bottom, transparent calc(100% - (270vw / 7.2)), #FED516 calc(100% - (270vw / 7.2))); padding-bottom: calc(150vw / 7.2); }
#message .text { width:100%; float:none; }
#message .thumb { display: block; width:80%; float:none; margin: 0 auto 3em auto; }
#message .illust1 { inset: 13em 0 auto auto; }

#message .page_second_wrapper { border-bottom-right-radius: 3em; border-bottom-left-radius: 3em; }



#company_profile .company_profile_wrapper { border-radius: 3em; padding: 3em 0 6em 0; }
#company_profile .company_profile_wrapper::before { width: calc(115vw / 12.2); border-top-right-radius: 3em; }
#company_profile .company_profile_wrapper::after { inset: calc(55vw / 12.2) calc(55vw / 12.2) auto auto; width: calc(120vw / 12.2); }


#company_profile .content .text { width:100%; float:none; }
#company_profile .content .thumb { display: block; width:100%; float:none; margin-block-end: 3em; }
#company_profile .content .table dt { width: 6em; }


#business {
	background: linear-gradient(to bottom, transparent calc(100% - (270vw / 7.2)), #FED516 calc(100% - (270vw / 7.2)));
	padding-bottom: calc(150vw / 7.2);
}
#business .page_second_wrapper { border-bottom-right-radius: 3em; border-bottom-left-radius: 3em; }
#business .text { width:100%; float:none; }
#business .thumb { display: block; width:100%; float:none; margin-block-end: 3em; }

#business .map { width: calc(120vw / 7.2); margin: 3em 0 0 1em; }


#business .illust1 { inset: 10em 0 auto auto; }




#recruit {
	background: linear-gradient(to bottom, transparent calc(100% - (240vw / 7.2)), #FED516 calc(100% - (240vw / 7.2)));
	padding-bottom: 3em;
}
#recruit .page_second_wrapper { border-bottom-right-radius: 3em; border-bottom-left-radius: 3em; }




#recruit .text { width:100%; float:none; }
#recruit .thumb { display: block; width:100%; float:none; margin-block-end: 3em; }

#recruit .illust_intro {
    inset: 12em 0 auto auto;
}
#recruit .illust_skill { inset: calc(1800vw / 7.2) auto auto 0; z-index: 0; }
#recruit .illust_eval { inset: auto 0 auto auto; z-index: 0; }


#recruit .tag_list.col3 { display: block; }
#recruit .tag_list.col3 .tag { width: 100%; padding: 0.75em 0.5em 0.75em 2.8em; }
#recruit .tag.bg_yellow::before { inset: 0 auto 0 calc(22vw / 7.2); width: calc(26vw / 7.2); height: calc(26vw / 7.2); }

.tag_list.col5 .tag { width: 49%; margin-right: 2%; margin-bottom: 0.5em; }
.tag_list.col5 .tag:nth-of-type(2n) { margin-right: 0; }
.tag_list.col5 .tag:nth-of-type(5n) { margin-right: 2%; }



#flow .flow_wrapper { border-radius: 3em; padding: 8em 0 6em 0; }
#flow .flow_wrapper::before { width: calc(115vw / 12.2); border-top-right-radius: 3em; }
#flow .flow_wrapper::after { inset: calc(55vw / 12.2) calc(55vw / 12.2) auto auto; width: calc(120vw / 12.2); }



#flow .content .ttl { top: -4.75em; }
#flow .content .ttl .ja { width: 7em; }
#flow .flow_illust { width: calc(420vw / 16.2); nset: calc(-336vw / 14.6) auto auto 0; }

#flow .illust2 { z-index: 0; }


.flow_step .step_no { width: calc(110vw / 7.2); }
.flow_step .step_no .step_num { width: calc(72vw / 7.2); height: calc(72vw / 7.2); }
.flow_step:not(:last-child)::after { border-left: calc(24vw / 7.2) solid transparent; border-right: calc(24vw / 7.2) solid transparent; border-top: calc(28vw / 7.2) solid #FED516; }
#flow .flow_step::before { inset: auto 0 0 calc(55vw / 7.2); width: 90%; }
#flow .flow_step .step_text { margin: 0 0 0 0.5em; display: flex; align-items: center; line-height: 1.5; }
#flow .flow_frame { width: 100%; }


#recruitment {
	
}
#recruitment .recruitment_wrapper { border-radius:3em; padding: 8em 0 3em 0; }
#recruitment .recruitment_wrapper::before { width: calc(115vw / 12.2); border-top-left-radius: 3em; }
#recruitment .recruitment_wrapper::after { inset: calc(55vw / 12.2) 0 0 calc(55vw / 12.2); width: calc(120vw / 12.2); }

#recruitment .content .ttl { top: -5.2em; }
#recruitment .content .ttl .ja { width: 7em; }
#recruitment .recruitment_illust { width: calc(420vw / 16.2); inset: calc(-336vw / 14.6) 0 auto auto; }

#recruitment .illust1 { inset: calc(720vw / 7.2) 0 auto auto; z-index: 0; }

.recruitment_frame .table { display:block; }
.recruitment_frame .table dt { display:block; width:100%; padding: 1.5em 0 0 0; }
.recruitment_frame .table dd { display:block; }

#recruitment .recruitment_frame { width: 100%; }
#recruitment::after { bottom: calc(25vw / 7.2); border-left: calc(120vw / 7.2) solid transparent; border-right: calc(120vw / 7.2) solid transparent; border-top: calc(80vw / 7.2) solid #177D4A; }


#entry_bottom_contact .btn_box { display:block; }

#entry_bottom_contact .btn_box .tel_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
#entry_bottom_contact .btn_box .email_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
#entry_bottom_contact .text .tel_btn .tel_icon { width: calc(28vw / 7.2); aspect-ratio: 7 / 10; margin-right:0.3em; }
#entry_bottom_contact .text .email_btn .email_icon { width: calc(41vw / 7.2); aspect-ratio: 41 / 26; margin-right:0.3em; }

#entry_bottom_contact .entry_catch {
    margin: 3em auto 1em auto;
}


#contact_hero .content .tel_btn {
	display: flex; justify-content: center; align-items: center; margin: 1em auto 1em auto;
	width: 90%; height: calc(90vw / 7.2); border: solid 2px #45514D; border-radius: 50vmax;
}
#contact_hero .content .tel_btn .tel_icon { width: calc(28vw / 7.2); aspect-ratio: 7 / 10; margin-right:0.3em; }


#contact_hero .page_second_wrapper { padding: 6em 0 0 0; }


#contact .content { margin-block-start: 0; position: relative; padding:0.5em 0.5em 5em 0.5em; }
#contact .contact_wrapper { padding: 0 0 6em 0; border-bottom-right-radius: 3em; border-bottom-left-radius: 3em; }

.form .box { display:block; }
.form .box dt { display:block; width:100%; padding: 2em 0 0.5em 0; }
.form .box dd{ display:block; margin:0; padding: 1em 0 1.5em 0; }

.form .next {width: 90%; height: calc(90vw / 7.2); }
.form .back_btn {width: 90%; height: calc(90vw / 7.2); float:none; margin:0 auto;}
.form .send_btn {width: 90%; height: calc(90vw / 7.2); float:none; margin: 0 auto 3em auto; }

.form .send_box { width:100%; }


.entry_form .tab_btns { display: block; }
.entry_form .tab_btn { width: 100%; height: calc(70vw / 7.2); margin: 0 0 1em 0; }
.entry_form .tab_btn .upload_icon { width: calc(42vw / 7.2); }
.entry_form .tab_btn .pen_icon { width: calc(28vw / 7.2); }

.entry_form .tab_btn .tab_btn_inner { font-size: calc(20 * 0.18vw); }