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

html {scroll-behavior: smooth;}
:target { scroll-margin-top: 6vw; }

body {
	color:#111111; font-size:calc(20 * 0.052vw); line-height: 1.8; letter-spacing: 0;
	font-family: "Zen Kaku Gothic New", "Yu Gothic", "Meiryo", "Hiragino Kaku Gothic ProN", sans-serif; font-weight:500;
	margin: 0 auto; height: 100%; overflow-x:hidden;
}

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box;-o-box-sizing: border-box;  -ms-box-sizing: border-box;box-sizing: border-box;}

.inter { font-family: "Inter", serif; font-weight:600; }
.train { font-family: "Train One", system-ui; font-weight:400; }



.rl { -ms-writing-mode: tb-rl; writing-mode: vertical-rl;}

button,input,textarea,select { appearance: none; -webkit-appearance: none; border:none; font-family: inherit; font-size: inherit; font-weight:600; letter-spacing: 0.1vw; }

strong,.bold { font-weight:900; }


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


img { border: none; vertical-align: middle; }

img.top { vertical-align: top; }
img.bottom { vertical-align: bottom; }
img.banner { border: solid 1px #DDD; }


address, em { font-style: normal; }

a { color:#111111; text-decoration: none; }

a:hover,input[type="submit"]:hover, input[type="reset"]:hover {opacity: 0.9; filter: alpha(opacity=90); -ms-filter: "alpha( opacity=90 )";}


.position_r { position:relative; z-index:1; }
.position_a { position:absolute; z-index:2; }

/*********** class ****************************************/


/********** float ************/
.c-both { clear: both; }
.clearfix::after { content: ""; clear: both; display: block; }
.left { float: left; }
.right { float: right; }
.center { display: block; margin-left: auto; margin-right: auto; text-align: center; }
.text_right { margin-left:auto; margin-right:0; text-align:right; }


/******* end float **********/

/******* flex box ***********/
.flex {display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;justify-content: space-between;}
.height {justify-content: space-evenly; flex-wrap: wrap; align-items: stretch;}

/* image parent cover *******/
.fit { object-fit: cover; font-family: 'object-fit: cover;'; max-width: 100%; }
.cover { width: 100%; height:100%; object-fit:cover; }

/****** layout ********/
.inner { width: calc(1800vw / 19.2); margin: 0 auto;}
.middle_inner { width: calc(1640vw / 19.2); margin: 0 auto;}
.inner_right { width: calc(1730vw / 19.2); margin: 0 0 0 auto; }
.inner_left { width: calc(1730vw / 19.2); margin: 0 auto 0 0; }

.low_inner { width: calc(1360vw / 19.2); margin: 0 auto;}
.minimum_inner { width: calc(800vw / 19.2); margin: 0 auto;}

.heading { width: 100%; }

/* image parent cover *******/
.fit { object-fit: cover; font-family: 'object-fit: cover;'; max-width: 100%; }

dl.table { display:table; width:100%; }
dl.table dt,dl.table dd { display:table-cell; }

/****** display ********/

.pc { display: unset; }
.sp { display: none; }
.grid { display: grid; }


.black { color:#111111; }
.white { color:#FFFFFF; }
.yellow { color:#FED516; }
.green { color:#177D4A; }
.red { color:#F84545; }



.bg_dark_blue { background-color:#0E2648; }
.bg_black { background-color:#111111; }
.bg_white { background-color:#FFFFFF; }
.bg_red { background-color:#F84545; }
.bg_yellow { background-color:#FED516; }
.bg_green { background-color:#177D4A; }




.ttl { position:relative; margin-block-start: 1em; margin-block-end: 2em; }

.ttl .slug { position:relative; display:block; margin-block-end: 1em; width: max-content; }
.ttl .slug::before {
	content:""; position:absolute; z-index: 0; inset:-0.1em auto 0 -1.3em; clip-path: inset(0 0.3em 0 0);
	border:solid 2px #177D4A; border-radius:100vmax; width:calc(47vw / 19.2); height: calc(47vw / 19.2);;
}
.ttl .ja { font-weight:bold; }

.ttl.center .slug { margin-right: auto; margin-left: auto; }




.more {
	position:relative; display: flex; justify-content: center; align-items: center; width:calc(270vw / 19.2); height:calc(60vw / 19.2); margin-block-start: 2.5em; margin-block-end: 1em; border:solid 2px #45514D; border-radius:50vmax;
}
.more::after {
	content:""; display:block; position:absolute; inset:0 -1.11em 0 auto; margin:auto; width:2.22em; height:1px; background-color:#45514D;
	transform:translateX(0); transition: opacity 0.6s ease, transform 0.6s ease;
}

.more:hover::after { transform:translateX(1.11em); }



.more.border_white { border:solid 1px #FFFFFF; }
.more.border_white::after { background-color:#FFFFFF; }

.circle { border-radius:100vmax; }

.indent { text-indent:-1em; margin-left:1em; }


/**** animation ***************/


.fade_in { opacity: 0;transition: opacity 1s ease; }
.fade_in.active { opacity: 1; }

.fade_up { opacity: 0; transform:translateY(2vw); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade_up.active { opacity: 1; transform:translateY(0); }


.fade_right { opacity: 0; transform:translateX(-30vw); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade_right.active { opacity: 1; transform:translateX(0); }

.fade_left { opacity: 0; transform:translateX(30vw); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade_left.active { opacity: 1; transform:translateX(0); }


.fade_zoom { opacity: 0; transform: scale(0.3); transition: opacity 0.6s ease, transform 0.4s ease;}
.fade_zoom.active { opacity: 1; transform: scale(1); }


.scale_in {overflow: hidden;}
.scale_in img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; overflow:hidden; }
.scale_in img:hover { -webkit-transform: scale(1.05); transform: scale(1.05); }
.text_mask {
	color: transparent; /* 文字色は透明にして背景で塗る */
	-webkit-background-clip: text;
	background-clip: text;
	
	background-image: linear-gradient(90deg, var(--text-color) 0%, var(--text-color) 50%, transparent 50%, transparent 100%);
	background-size: 200% 100%;
	background-position: 100% 0;
	background-repeat: no-repeat;
}

.text_mask.active { animation: bg_reveal 1s linear forwards; }

@keyframes bg_reveal {
	from { background-position: 100% 0; }
	to   { background-position: 0% 0; }
}


.text_curtain { display: block; width: max-content; overflow: hidden; }
.text_curtain span { display: inline-block; padding: 0.2em 0.4em; clip-path: inset(0 100% 0 0); transition: clip-path 1s ease; }
.text_curtain.active span { clip-path: inset(0 0 0 0); }

.text_curtain em { display: inline-block; padding: 0.2em 0.4em; clip-path: inset(0 100% 0 0); transition: clip-path 1s ease; }
.text_curtain.active em { clip-path: inset(0 0 0 0); }

.text_curtain strong { display: inline-block; padding: 0.2em 0.4em; clip-path: inset(0 100% 0 0); transition: clip-path 1s ease; }
.text_curtain.active strong { clip-path: inset(0 0 0 0); }







#header { position:fixed; inset: 0; border-top:solid 5px #FED516; z-index: 999; height:calc(115vw / 19.2); }
#header .header_wrapper { border-bottom-right-radius:2.5em; border-bottom-left-radius:2.5em; height: 100%; }
#header .header_inner { height: 100%; align-items: center; }


#header .logo { position:relative; z-index: 1001; margin: 0; width: calc(420vw / 19.2); height:calc(64vw / 19.2); font-weight: bold; }
#header .logo a.flex { justify-content: space-between; align-items: center; }
#header .logo a.flex .logo_thumb { width: calc(90vw / 19.2); aspect-ratio:90 / 64; }




#header .header_nav { width: calc(620vw / 19.2); }
#header .header_nav ul { list-style-type:none; margin: 0; padding: 0; justify-content: space-between; align-items: center; }
#header .header_nav ul li {  }



#header .email_btn { width: calc(70vw / 19.2); aspect-ratio: 1 / 1; place-content:center; transform:rotate(0deg); transition: transform 0.6s ease }
#header .email_btn:hover { transform:rotate(15deg); }
#header .email_btn .email_icon { width: calc(41vw / 19.2); aspect-ratio: 41 / 26;; }



#header .drawer_menu .drawer_content .drawer_content_wrapper { align-items: center; }
#header .drawer_menu .drawer_content .drawer_content_wrapper .link_list { position:relative; padding: 2em 0 0 0; }
#google_translate_element { position:absolute; inset: 0 0 auto auto; }
#google_translate_element .goog-te-gadget-simple { cursor: pointer; font-size: calc(14vw / 19.2); }




.bottom_contact {
	padding:5em 0 10em 0;
}
.bottom_contact .bottom_contact_ttl { position:relative; width: calc(370vw / 19.2); margin-left: 3em; }
.bottom_contact .bottom_contact_ttl::before {
	content:""; position:absolute; z-index: 0; inset:0 auto 0 -3em; clip-path: inset(0 0.3em 0 0);
	border:solid 10px #FED516; border-radius:100vmax; width:calc(290vw / 19.2); height: calc(290vw / 19.2);;
}
.bottom_contact .bottom_contact_ttl .slug { position:relative; z-index:1; display:block; margin-block-end: 1em; }
.bottom_contact .bottom_contact_ttl .ja { position:relative; z-index:1; display:block; background-color: #FFFFFF; padding: 0.75em 0 0.75em 0; }

.bottom_contact .text { width: calc(760vw / 19.2); padding: 4em 0 0 0; }
.bottom_contact .text .summary { margin-block-end:2.5em; }

.bottom_contact .text .tel_btn { display: flex; justify-content: center; align-items: center; width:calc(360vw / 19.2); height:calc(60vw / 19.2); border:solid 2px #45514D; border-radius:50vmax; }
.bottom_contact .text .tel_btn .tel_icon { width: calc(28vw / 19.2); aspect-ratio: 7 / 10; margin-right:0.3em; transform:rotate(0deg); transition: transform 0.6s ease }
.bottom_contact .text .tel_btn:hover .tel_icon { transform:rotate(-10deg); }

.bottom_contact .text .email_btn { display: flex; justify-content: center; align-items: center; width:calc(360vw / 19.2); height:calc(60vw / 19.2); border:solid 2px #45514D; border-radius:50vmax; }
.bottom_contact .text .email_btn .email_icon { width: calc(41vw / 19.2); aspect-ratio: 41 / 26; margin-right:0.3em; transform:rotate(0deg); transition: transform 0.6s ease }
.bottom_contact .text .email_btn:hover .email_icon { transform:rotate(-10deg); }





#footer { padding:5em 0 5em 0; }

#footer .site_info { width:calc(400vw / 19.2); margin-block-end:2em; }

#footer .site_info .logo { position:relative; width: calc(420vw / 19.2); height:calc(64vw / 19.2); margin-block-start: 0; margin-block-end:2em; font-weight: bold; }
#footer .site_info .logo a.flex { justify-content: space-between; align-items: center; }
#footer .site_info .logo a.flex .logo_thumb { width: calc(90vw / 19.2); aspect-ratio:90 / 64; }

#footer .site_info .location { display:block; }


#footer .footer_nav { width:calc(690vw / 19.2); padding: 1.5em 0 0 0; }
#footer .footer_nav ul { list-style-type:none; margin: 0 0 4em 0; padding: 0; justify-content: space-between; align-items: center; }

#footer .copy { padding:0.5vw 0 0.5vw 0; }

#ptop { position: fixed; bottom: 5vw; right: 5vw; z-index: 100; display: flex; align-items: center; justify-content: center; width: 4.166666vw; height: 4.166666vw; line-height: 1vw; padding: 1vw; text-align: center; border-radius:100vmax; }


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



#fv { width:100%; aspect-ratio: 960 / 520; background-image:url(../img/home/fv_bg.webp); background-size:calc(1595vw / 19.2); background-position:right top; background-repeat:no-repeat; }
#fv .fv_illust { position:absolute; z-index:0; inset:0; width:calc(895vw / 19.2); aspect-ratio: 895 / 940; }
#fv .fv_recruit { position:absolute; z-index:0; inset:auto 1em 7em auto; width:calc(320vw / 19.2); aspect-ratio: 32 / 35; }
#fv .catch { position: absolute; z-index: 2; inset: auto auto calc(100vw / 19.2) calc(60vw / 19.2); }
#fv .catch .text_curtain { display:block; width:max-content; margin-block-end:0.1em; }
#fv .catch .bg_white { border:solid 2px #45514D; padding:0.01em 0.5em 0.1em 0.5em; font-weight: bold; }


#top_about { top:-6em; z-index: 3; }
#top_about .top_about_wrapper { border-top-right-radius:6em; border-top-left-radius:6em; padding: 6em 0 2em 0; }
#top_about .top_about_wrapper::before { content:""; position:absolute; inset:0; background-color:#177D4A; width:calc(115vw / 19.2); aspect-ratio:1 / 1; border-top-left-radius:6em; }
#top_about .top_about_wrapper::after { content:""; position:absolute; z-index:2; inset:calc(55vw / 19.2) 0 0 calc(55vw / 19.2); background-color:#FFFFFF; width:calc(65vw / 19.2); aspect-ratio:1 / 1; border-top-left-radius:50vmax; }


#top_about .text { width:calc(760vw / 19.2); }
#top_about .thumb { width:calc(760vw / 19.2); aspect-ratio: 760 / 513; margin-block-start: 5em; }
#top_about .illust1 { inset:auto 0 -15em auto; z-index:0; }


#top_our_business { z-index: 1; }
#top_our_business .top_our_business_wrapper { border-bottom-right-radius: 6em; border-bottom-left-radius: 6em; padding: 0 0 6em 0; }
#top_our_business .text { width:calc(760vw / 19.2); }
#top_our_business .thumb { width:calc(760vw / 19.2); aspect-ratio: 760 / 503; margin-block-start: 5em; }


#top_recruit { padding: 4em 0 18em 0; background: linear-gradient(to bottom, #FED516 0, #FED516 calc(800vw / 19.2), transparent calc(800vw / 19.2)); }
#top_recruit::after { content:""; position:absolute; top: calc(800vw / 19.2); width:100%; height:calc(240vw / 19.2); background-color:#177D4A; clip-path: ellipse(100% 50% at 50% 37%); }

#top_recruit .ttl { top: -6em; }

#top_recruit .thumb { width:100%; aspect-ratio: 1800 / 641; }
#top_recruit .top_recruit_content { inset:4em 0 0 0; }
#top_recruit .top_recruit_illust { width:calc(727vw / 19.2); aspect-ratio: 727 / 965; inset:0 0 auto auto; }

#top_recruit .text { border:solid 2px #45514D; border-radius:2.5em; padding:0.5em 2em 2em 2em; z-index: 3; inset: auto 0 -19em 0; }
#top_recruit .text .catch { font-weight:bold; }



.page_header {
	width:100%; height:calc(806vw / 19.2); background-image:url(../img/page_header_bg.webp); background-size:cover; place-content: center; overflow: hidden;
}
.page_header .page_header_ttl { z-index: 3; }
.page_header .page_header_ttl .text_curtain { display:block; width:max-content; margin-block-end:0.1em; }
.page_header .page_header_ttl .slug { display:block; }
.page_header .page_header_ttl .ja .bg_white { border:solid 2px #45514D; padding:0.01em 0.5em 0.1em 0.5em; font-weight: bold; }


.page_header .page_header_illust { inset:auto 0 0 auto; }

#page_header_business .page_header_illust { width:calc(1241vw / 19.2); aspect-ratio: 1241 / 806; }
#page_header_contact .page_header_illust { width:calc(921vw / 19.2); aspect-ratio: 921 / 806; }

.page_second { top:-6em; z-index: 3; }
.page_second_wrapper { border-top-right-radius:6em; border-top-left-radius:6em; padding: 6em 0 6em 0; }
.page_second_wrapper::before { content:""; position:absolute; inset:0; background-color:#177D4A; width:calc(115vw / 19.2); aspect-ratio:1 / 1; border-top-left-radius:6em; }
.page_second_wrapper::after {
	content:""; position:absolute; z-index:2; inset:calc(55vw / 19.2) 0 0 calc(55vw / 19.2); background-color:#FED516;
	width:calc(120vw / 19.2); aspect-ratio:1 / 1; border-radius:50vmax; border: solid 1px #45514D;
}








#contact_hero {  }


#contact_hero .summary {  }
#contact_hero .notice {  }

#contact_hero .content { border:solid 2px #45514D; border-radius:2.5em; padding:0.5em 2em 4em 2em; margin-block-start: 4em; }
#contact_hero .content .ttl { top: -2em; margin-block-end: 0; }
#contact_hero .content .ttl .slug { width: 10em; }
#contact_hero .content .ttl .slug::before { inset: -0.1em auto 0 2em; }

#contact_hero .content .tel_btn { display: flex; justify-content: center; align-items: center; width:calc(420vw / 19.2); height:calc(70vw / 19.2); border:solid 2px #45514D; border-radius:50vmax; }
#contact_hero .content .tel_btn .tel_icon { width: calc(28vw / 19.2); aspect-ratio: 7 / 10; margin-right:0.3em; transform:rotate(0deg); transition: transform 0.6s ease }
#contact_hero .content .tel_btn:hover .tel_icon { transform:rotate(-10deg); }


#contact .contact_wrapper { padding:0 0 8em 0; border-bottom-right-radius:6em; border-bottom-left-radius:6em; }

#contact .content { border:solid 2px #45514D; border-radius:2.5em; padding:0.5em 2em 5em 2em; margin-block-start: 4em; }

#contact .content .ttl { top: -2em; margin-block-end: 0; }
#contact .content .ttl .slug { width: 13em; }
#contact .content .ttl .slug::before { inset: -0.1em auto 0 2em; }

#contact .illust1 { inset:5em 0 auto auto; z-index:0; }

.form { z-index:2; }
.form .box { margin:0; border-bottom:solid 1px #CFD3D2; }
.form .box dt { margin:0; padding:2em 1em 2em 0; width:15em; vertical-align: top; }
.form .box dt .field { line-height:1; }
.form .box dt .required { display: inline-block; line-height: 1; padding: 0.3em 0.6em 0.4em 0.6em; border-radius: 5px; }
.form .box dt .any { display: inline-block; line-height: 1; padding: 0.3em 0.6em 0.4em 0.6em; border-radius: 5px; border:solid 1px #177D4A; }
.form .box dd { margin:0; padding:1em 0 1em 1em; }


.form .box dd input[type="text"], .form .box dd input[type="tel"], .form .box dd input[type="email"] {
	width: 100%; padding:1em; border: solid 1px #45514D; background-color:#FFFCDD; border-radius: 5px;
}
.form .box dd textarea {
	width: 100%; padding:1em; border: solid 1px #45514D; background-color:#FFFCDD; border-radius: 5px; height: 12em;
}

.form .next {
	display: flex; justify-content: center; align-items: center; width:calc(420vw / 19.2); height:calc(70vw / 19.2); border:solid 2px #45514D; border-radius:50vmax;
	margin-block-start: 4em; cursor: pointer;
}

.form .send_box { width:calc(980vw / 19.2); margin: 4em auto 0 auto; }
.form .send_btn {
	display: flex; justify-content: center; align-items: center; width:calc(420vw / 19.2); height:calc(70vw / 19.2); border:solid 2px #45514D; border-radius:50vmax;
	cursor: pointer;
}
.form .back_btn {
	display: flex; justify-content: center; align-items: center; width:calc(420vw / 19.2); height:calc(70vw / 19.2); border:solid 2px #177D4A; border-radius:50vmax;
	cursor: pointer;
}

.form .error { display:block; }






.sub_ttl { position:relative; font-weight:900; padding-left: 1.6em; margin-block-end: 0.8em; line-height: 1.4; }
.sub_ttl::before {
	content:""; position:absolute; inset:0.35em auto auto 0; width:0.9em; height:0.9em;
	border:solid 2px #177D4A; border-radius:50%;
}




/********** business **********/
#business {
	background: linear-gradient(to bottom, transparent calc(100% - (270vw / 19.2)), #FED516 calc(100% - (270vw / 19.2)));
	padding-bottom: calc(150vw / 19.2);
}
#business .page_second_wrapper { border-bottom-right-radius:6em; border-bottom-left-radius:6em; }

#business .content .ttl { margin-block-end: 2.5em; }
#business .content .ttl .ja { line-height: 1.5; }

#business .text { width:calc(760vw / 19.2); }
#business .thumb { width:calc(760vw / 19.2); aspect-ratio: 760 / 503; margin: 0; }

#business .map { width:calc(120vw / 19.2); aspect-ratio: 1 / 1; margin: 0 0 1em 1.5em; }

#business .illust1 { inset: calc(220vw / 19.2) 0 auto auto; z-index: 0; }

#business .box { margin-block-end: 2.5em; }
#business .box:last-child { margin-block-end: 0; }




/********** about **********/
#page_header_about .page_header_illust { width:calc(839vw / 19.2); aspect-ratio: 839 / 806; }


/* message */
#message {
	background: linear-gradient(to bottom, transparent calc(100% - (270vw / 19.2)), #FED516 calc(100% - (270vw / 19.2)));
	padding-bottom: calc(150vw / 19.2);
}
#message .page_second_wrapper { border-bottom-right-radius:6em; border-bottom-left-radius:6em; }

#message .content .ttl { margin-block-end: 2.5em; }

#message .text { width:calc(760vw / 19.2); }
#message .text p { margin-block: 1.5em; }

#message .thumb { width:calc(600vw / 19.2); margin: 1em 4em 0 0; }
#message .thumb img { width:100%; aspect-ratio: 1 / 1; object-fit:cover; border-radius:50%; display:block; border: solid 2px #45514D; }
#message .thumb figcaption { margin-block-start: 1.2em; line-height: 1.4; }
#message .thumb figcaption .name { margin-left: 0.5em; }

#message .illust1 { inset: calc(220vw / 19.2) 0 auto auto; z-index: 0; }


/* company_profile */
#company_profile { top:-6em; z-index: 1; padding-bottom: calc(150vw / 19.2); }
#company_profile .company_profile_wrapper { border-radius:6em; padding: 6em 0 6em 0; }
#company_profile .company_profile_wrapper::before {
	content:""; position:absolute; inset:0 0 auto auto; background-color:#177D4A; width:calc(115vw / 19.2); aspect-ratio:1 / 1; border-top-right-radius:6em;
}
#company_profile .company_profile_wrapper::after {
	content:""; position:absolute; z-index:2; inset:calc(55vw / 19.2) calc(55vw / 19.2) auto auto; background-color:#FED516;
	width:calc(120vw / 19.2); aspect-ratio:1 / 1; border-radius:50vmax; border: solid 1px #45514D;
}

#company_profile .content .thumb { width:calc(700vw / 19.2); aspect-ratio: 760 / 503; margin: 0; }
#company_profile .content .text { width:calc(820vw / 19.2); }

#company_profile .content .table { border-bottom:solid 1px #CFD3D2; margin:0; }
#company_profile .content .table:first-child { border-top:solid 1px #CFD3D2; }
#company_profile .content .table dt { width:9em; padding:1.1em 1em 1.1em 0; vertical-align: top; font-weight:bold; }
#company_profile .content .table dd { padding:1.1em 0 1.1em 0; margin:0; vertical-align: top; }

#company_profile .gmap { width:100%; height: calc(540vw / 19.2); min-height:300px; margin-block-start: 4em; }

#company_profile .illust2 { inset: calc(480vw / 19.2) auto auto 0; z-index: 0; }




/********** recruit **********/

/* page header（このページ専用：高さ920・専用背景／イラストの裏に現場写真／重なり順をz-indexで制御） */
#page_header_recruit { height: calc(920vw / 19.2); background-image: url(../img/page_header_recruit_bg.webp); align-content: start; padding-top: calc(160vw / 19.2); }
#page_header_recruit .inner { position:relative; z-index: 3; }
#page_header_recruit .page_header_thumb { width:calc(1440vw / 19.2); aspect-ratio: 1440 / 640; inset: calc(90vw / 19.2) 0 auto auto; z-index: 0; }
#page_header_recruit .page_header_illust { width:calc(1280vw / 19.2); aspect-ratio: 1280 / 900; z-index: 1; }

/* page header nav */
#page_header_recruit .page_nav { position:relative; z-index: 3; justify-content: flex-start; width: max-content; margin-block-start: calc(160vw / 19.2); gap: calc(40vw / 19.2); }
#page_header_recruit .page_nav .page_nav_btn {
	position:relative; display:flex; align-items:center; justify-content:center; text-align:center;
	width:calc(430vw / 19.2); height:calc(80vw / 19.2); padding: 0 calc(60vw / 19.2);
	border:solid 2px #45514D; border-radius:50vmax; font-weight:bold; line-height:1;
}
#page_header_recruit .page_nav .page_nav_btn .circle {
	position:absolute; inset:0 calc(10vw / 19.2) 0 auto; margin:auto;
	display:flex; align-items:center; justify-content:center;
	width:calc(56vw / 19.2); height:calc(56vw / 19.2); border-radius:50%;
}
#page_header_recruit .page_nav .page_nav_btn .circle .triangle_icon { width:calc(20vw / 19.2); aspect-ratio: 20 / 10; }

/* 共通：見出し・スラッシュ装飾 */
.block_ttl { font-weight:900; line-height:1.4; margin-block-end: 1.5em; }

.lead, .slash { position:relative; display:block; width:max-content; max-width:100%; padding: 0 1.8em; }
.lead { font-weight:900; margin: 2.5em auto 1.6em auto; }
.lead::before, .lead::after, .slash::before, .slash::after {
	content:""; position:absolute; top:0; bottom:0; margin:auto; width:2px; height:1.2em; background:#177D4A;
}
.lead::before, .slash::before { left:0; transform: rotate(-22deg); }
.lead::after, .slash::after { right:0; transform: rotate(22deg); }

/* #recruit 本文 */
/* 下部の左右に背景の黄色を見せる（#business同様）。この黄色は #flow の黄色へ連続する */
#recruit {
	background: linear-gradient(to bottom, transparent calc(100% - (240vw / 19.2)), #FED516 calc(100% - (240vw / 19.2)));
	padding-bottom: 6em;
}
#recruit .page_second_wrapper { border-bottom-right-radius:6em; border-bottom-left-radius:6em; }
#recruit .middle_inner { position:relative; z-index: 1; }

/* 装飾イラスト */
#recruit .illust1, #recruit .illust2 { z-index: 1; }
#recruit .illust_intro { inset: calc(120vw / 19.2) calc(-30vw / 19.2) auto auto; }
#recruit .illust_skill { inset: calc(1800vw / 19.2) auto auto calc(-30vw / 19.2); z-index: 3; }
#recruit .illust_eval  { inset: calc(2680vw / 19.2) calc(-30vw / 19.2) auto auto; }

#recruit .content .ttl { margin-block-end: 2.5em; }
#recruit .content .ttl .ja { line-height:1.5; }
#recruit .text { width:calc(760vw / 19.2); }
#recruit .thumb { width:calc(760vw / 19.2); aspect-ratio: 760 / 503; margin: 0; }
#recruit .text .catch { font-weight:bold; margin-block-end: 1em; }

/* 枠付きブロック（こんな方／スキル） */
.recruit_frame {
	border:solid 2px #45514D; border-radius:2.5em;
	padding: calc(60vw / 19.2) calc(70vw / 19.2) calc(70vw / 19.2);
	margin-block-start: 4em;
}
.recruit_frame .lead:first-of-type { margin-block-start: 1em; }

/* タグ（ピル）：flex start で左開始、nth-of-type で回り込み制御 */
.flex.start { justify-content: flex-start; }
.tag_list { display:flex; flex-wrap:wrap; justify-content:flex-start; margin:0; padding:0; list-style:none; }
.tag {
	position:relative; display:flex; align-items:center; justify-content:flex-start;
	min-height:calc(64vw / 19.2); margin: 0 calc(24vw / 19.2) calc(24vw / 19.2) 0;
	padding: 0.4em 1.2em; border-radius:50vmax;
	font-weight:bold; line-height:1.3; text-align:left;
}
.tag.bg_yellow { padding-left: 2.8em; border:solid 1px #45514D; }
.tag.bg_yellow::before {
	content:""; position:absolute; inset:0 auto 0 calc(22vw / 19.2); margin:auto;
	width:calc(26vw / 19.2); height:calc(26vw / 19.2); border-radius:50%; background:#FFFFFF;
}
.tag.outline { background:#FFFFFF; border:solid 2px #177D4A; justify-content:center; text-align:center; }
.tag_list.col3 .tag { width:calc((100% - 2 * (24vw / 19.2)) / 3); }
.tag_list.col3 .tag:nth-of-type(3n) { margin-right: 0; }
.tag_list.col5 .tag { width:calc((100% - 4 * (24vw / 19.2)) / 5); }
.tag_list.col5 .tag:nth-of-type(5n) { margin-right: 0; }

/* 評価／環境（サムネ＋テキスト） */
.recruit_feature { margin-block-start: 5em; }
.recruit_feature .thumb { width:calc(700vw / 19.2); aspect-ratio: 700 / 660; margin: 0.5em 0 0 0; }
.recruit_feature .text { width:calc(820vw / 19.2); }
.recruit_feature .box { margin-block-end: 2.5em; }
.recruit_feature .box:last-child { margin-block-end: 0; }
.recruit_feature .feature_ttl { line-height:1.4; margin-block-end: 0.6em; }


#recruit .skill_content { z-index:0; }

/* #flow（セクションが黄色／wrapperが白）。-6emで #recruit の黄色へ重ねて連続させる */
#flow { inset: -6em 0 0 0; z-index: 3; background:#FED516;; padding: calc(80vw / 19.2) 0 calc(120vw / 19.2); }
/* flow_illust は flow_wrapper の外（middle_inner直下）。カードより背面、上にはみ出す */
#flow .flow_illust { width:calc(420vw / 19.2); aspect-ratio: 420 / 440; inset: calc(-336vw / 19.2) auto auto calc(-30vw / 19.2); z-index: 1; }


#flow .flow_wrapper { border-radius:6em; padding: 10em 0 6em 0; }
#flow .flow_wrapper::before {
	content:""; position:absolute; inset:0 0 auto auto; background-color:#177D4A; width:calc(115vw / 19.2); aspect-ratio:1 / 1; border-top-right-radius:6em;
}
#flow .flow_wrapper::after {
	content:""; position:absolute; z-index:2; inset:calc(55vw / 19.2) calc(55vw / 19.2) auto auto; background-color:#FED516;
	width:calc(120vw / 19.2); aspect-ratio:1 / 1; border-radius:50vmax; border: solid 1px #45514D;
}

#flow .content { z-index: 2; border:solid 2px #45514D; border-radius:2.5em; padding: 0 calc(80vw / 19.2) 0; }
#flow .content .ttl { top: -6em; margin-block-end: 0; }
#flow .content .ttl .ja { display: inline-block; width:8em; background-color:#FFFFFF; }


#flow .illust2 { inset:10em auto auto 0; }

/* illustより前面に出すため flow_frame に z-index */
#flow .flow_frame { position:relative; z-index: 2; top: -6em; }
#flow .flow_list { list-style:none; margin:0; padding:0; }

#flow .flow_step .step_text { margin: 1.4em 0 0 1em; font-weight:bold; }
#flow .flow_step { position:relative; padding: 0; justify-content: start; margin-block-start: 3em; }
#flow .flow_step::before {
	content:""; position:absolute; inset:auto 0 0 calc(55vw / 19.2); width:100%; height:2px;
	background:#FED516;
}


.flow_step:not(:last-child)::after {
	content:""; position:absolute; left:50%; bottom: -2em; transform:translateX(-50%);
	border-left: calc(24vw / 19.2) solid transparent; border-right: calc(24vw / 19.2) solid transparent; border-top: calc(28vw / 19.2) solid #FED516;
}
.flow_step .step_no { width:calc(110vw / 19.2); text-align:center; line-height:1; }
.flow_step .step_no .step_label { display:block; color:#45514D; font-weight:bold; margin-block-end:0.3em; }
.flow_step .step_no .step_num {
	display:flex; align-items:center; justify-content:center; margin: 0 auto;
	width:calc(72vw / 19.2); height:calc(72vw / 19.2); border-radius:50%; background:#FED516; color:#111111;
}


/* #recruitment（#flow と同じ作り：黄背景＋白角丸パネル＋枠カード） */
#recruitment { inset: -6em 0 0 0; z-index: 3; padding: calc(20vw / 19.2) 0 calc(170vw / 19.2); }
/* 下の緑▼（#entryへ）240×80 */
#recruitment::after {
	content:""; position:absolute; z-index:3; left:50%; bottom: calc(125vw / 19.2); transform: translateX(-50%);
	border-left: calc(120vw / 19.2) solid transparent; border-right: calc(120vw / 19.2) solid transparent; border-top: calc(80vw / 19.2) solid #177D4A;
}
#recruitment .recruitment_wrapper { border-radius:6em; padding: 10em 0 6em 0; }
#recruitment .recruitment_wrapper::before {
	content:""; position:absolute; inset:0 auto auto 0; background-color:#177D4A; width:calc(115vw / 19.2); aspect-ratio:1 / 1; border-top-left-radius:6em;
}
#recruitment .recruitment_wrapper::after {
	content:""; position:absolute; z-index:2; inset:calc(55vw / 19.2) auto auto calc(55vw / 19.2); background-color:#FED516;
	width:calc(120vw / 19.2); aspect-ratio:1 / 1; border-radius:50vmax; border: solid 1px #45514D;
}
/* 黄リング（右・中ほど） */
#recruitment .illust1 { inset: calc(720vw / 19.2) calc(-30vw / 19.2) auto auto; z-index: 2; }
/* worker は content の外。右上にはみ出す・カードより背面 */
#recruitment .recruitment_illust { width:calc(420vw / 19.2); aspect-ratio: 420 / 534; inset: calc(-336vw / 19.2) calc(-30vw / 19.2) auto auto; z-index: 1; }

#recruitment .content { z-index: 2; border:solid 2px #45514D; border-radius:2.5em; padding: 2em calc(80vw / 19.2) calc(20vw / 19.2); }
#recruitment .content .ttl { top: -6em; margin-block-end: 0; }
#recruitment .content .ttl .ja { display: inline-block; background-color:#FFFFFF; padding: 0 0.8em; }

#recruitment .recruitment_frame { position:relative; z-index: 2; top: -6em; }
.recruitment_frame .table { border-bottom:solid 1px #CFD3D2; margin:0; }
.recruitment_frame .table:first-child { border-top:solid 1px #CFD3D2; }
.recruitment_frame .table dt { width:13em; padding:1.5em 1em 1.5em 0; vertical-align: top; font-weight:bold; }
.recruitment_frame .table dd { padding:1.5em 0 1.5em 0; margin:0; vertical-align: top; }
.recruitment_frame .table dd span { display:block; }
.recruitment_frame .table dd .gap { margin-block-start: 1.2em; }

/* #entry_bottom_contact（求人応募） */
#entry_bottom_contact { padding-top:0; }
#entry_bottom_contact .entry_catch { margin: 0 auto 1.6em 0; }
#entry_bottom_contact  .text { padding: 1em 0 0 0; }
#entry_bottom_contact .text .summary { margin-block-end: 2.5em; }


/********** recruit entry（求人応募フォーム） **********/
#page_header_recruit_entry .page_header_illust { width:calc(1280vw / 19.2); aspect-ratio: 1280 / 806; }

/* フォーム内サブ見出し */
.entry_form .form_subttl { font-weight:900; margin: 2.5em 0 1em; padding-bottom: 0.4em; border-bottom: solid 3px #FED516; }
.entry_form .form_subttl:first-of-type { margin-top: 0; }

/* select / radio / file */
.form select { padding: 0.9em 2.5em 0.9em 1em; border: solid 1px #45514D; background-color:#FFFCDD; border-radius:5px; cursor:pointer; line-height:1.2; }
.form .select_date { display:inline-flex; align-items:center; gap:0.4em; flex-wrap:wrap; }
.form .select_date select { min-width: 6em; }
.form .radio_list { display:inline-flex; gap: 2.5em; }
.form .radio_list .radio { display:inline-flex; align-items:center; gap:0.4em; cursor:pointer; line-height: 1; }
.form .radio_list input[type="radio"] {
	width: 1.2em; height: 1.2em; border: solid 2px #45514D; border-radius: 100vmax; accent-color: #455140;
	appearance: auto; -webkit-appearance: auto;
}




.form .up_file { list-style:none; margin:0; padding:0; }
.form .up_file li { margin-block-end: 1em; }
.form .up_file li:last-child { margin-block-end: 0; }
.form .up_file .up_file_label { display:inline-block; min-width:7em; font-weight:bold; }

/* 応募書類タブボタン 660×70 */
.entry_form .tab_btns { justify-content: center; gap: calc(40vw / 19.2); margin: 1em 0 0; }
.entry_form .tab_btn {
	display:flex; align-items:center; justify-content:center;
	width:calc(660vw / 19.2); height:calc(70vw / 19.2);
	border:solid 2px #45514D; border-radius:50vmax; background:#FFFFFF; cursor:pointer; font-weight:bold;
}
.entry_form .tab_btn input { position:absolute; opacity:0; width:0; height:0; }
.entry_form .tab_btn .tab_btn_inner { display:flex; align-items:center; justify-content:center; line-height:1.2; }
.entry_form .tab_btn .tab_icon { margin-right:0.6em; }
.entry_form .tab_btn .upload_icon { width:calc(42vw / 19.2); aspect-ratio:1 / 1; }
.entry_form .tab_btn .pen_icon { width:calc(28vw / 19.2); aspect-ratio:28 / 42; }
.entry_form .tab_btn:has(input:checked) { background:#FED516; border-color:#45514D; }

/* :has によるタブパネル／送信ボタンの表示制御 */
.entry_form .tab_panel { display:none; }
.entry_form #send_box { display:none; margin-block-start: 3em; }
.entry_form:has(input[value="resume_btn"]:checked) #upload { display:block; }
.entry_form:has(input[value="work_btn"]:checked) #fill_in { display:block; }
.entry_form:has(input[name="resume_btn"]:checked) #send_box { display:block; }

/* 送信ボタン */
.entry_form .send_btn { display:flex; align-items:center; justify-content:center; width:calc(420vw / 19.2); height:calc(70vw / 19.2); border-radius:50vmax; margin: 0 auto; cursor:pointer; }


@media (min-width: 768px) and (max-width: 1080px) {
	#google_translate_element { position: absolute; inset: 6em 0 auto auto; }
}
