@charset "UTF-8";

:root {
	--site-color: #3f73ab;
	--information-color: #0084ff; */
	--header-bg-color: #83ccd2;
	--recruit-text-color: #2f5d8f;
	--recruite-bg-color: #f4f8fc;
}

form.gsc-search-box { margin:0 !important; }

body { line-height:1.8; }
@media (max-width:780px) {
	body { line-height:1.6; }
}
figure { margin:0; }

/* fonts */
.comfortaa { font-family:"Comfortaa", sans-serif; }

/* common override */
.button.blue { border:none; background:var(--site-color); color:white; }

/* ContactForm7 */
.wpcf7 { width:100%; max-width:860rem; margin-left:auto; margin-right:auto; font-size:16rem; }
.wpcf7 form.submitting { opacity:0.5;  }
.wpcf7 p { margin:16rem 0; }
.wpcf7 .wpcf7-radio { display:flex; justify-content:flex-start; column-gap:1em; }
.wpcf7 .wpcf7-radio label { display:inline-flex; }
.wpcf7 .wpcf7-form-control-wrap { display:block; }
.wpcf7 .wpcf7-list-item.first { margin-left:0; }
.wpcf7 p:has(input[type=submit]) { text-align:center; margin-top:40rem; width:100%; display:flex;}
.wpcf7 input[type=submit] { border:none; background:var(--site-color); color:white; }
.wpcf7 .wpcf7-tel { max-width:50%; }
.wpcf7 *[data-name=your-age] input { max-width:25%; }
.wpcf7 *[data-name=your-age]::after { content:'歳'; margin-left:0.5em; }
.wpcf7 *[data-name=acceptance] { text-align:center; margin-top:40rem; }
.wpcf7 dl { display:grid; grid-template-columns:200rem 1fr; align-items:flex-start; }
.wpcf7 dl dt { padding-left:40rem; }
.wpcf7 dl dt::before { content:'任意'; position:absolute; left:-20rem; top:24rem; height:24rem; padding:0.5em; background:#ccc; color:white; display:flex; font-size:16rem; }
.wpcf7 dl dt p { line-height:40rem; }
.wpcf7 dl.required dt::before { content:'必須'; background:var(--site-color); }
.wpcf7 dl.noRequiredIcon dt::before { content:none; }
.wpcf7 dl dd { line-height:40rem; }
.wpcf7 .privacypolicy { width:100%; height:240rem; overflow-y:scroll; padding:20rem; border:1rem solid #ccc; margin-top:40rem; font-size:14rem; }
.wpcf7 .privacypolicy h4 { font-size:18rem; }
.wpcf7 .wpcf7-response-output { position:sticky; left:0; bottom:-60rem; background:white; width:860rem; margin:40rem 0 0 !important; pointer-events:none; transition:bottom 0.66s; }
.wpcf7 .wpcf7-submit:disabled { opacity:0.3; }
.wpcf7 .wpcf7-turnstile { display:flex; margin-top:40rem; }
.wpcf7 span.wpcf7-spinner { position:absolute; left:50%; bottom:18rem; transform:translateX(-50%); margin:0; }
html.ready .wpcf7 .wpcf7-response-output { bottom:20rem; }
@media (max-width:780px) {
	.wpcf7 { padding:0 12rem; }
	.wpcf7 dl { display:block; }
	.wpcf7 dl dt { padding-left:60rem; }
	.wpcf7 dl dt::before { left:0; top:calc(50% - 12rem); height:24rem; font-size:15rem; }
	.wpcf7 dl dt p { line-height:40rem; margin:0; }
	.wpcf7 dl.required dt::before { content:'必須'; background:var(--site-color); }
	.wpcf7 dl.noRequiredIcon dt::before { content:none; }
	.wpcf7 dl dd { line-height:40rem; }
	.wpcf7 dl dd > p:first-child { margin-top:0; }
	.wpcf7 .privacypolicy { padding:12rem; }
	.wpcf7 .privacypolicy { height:320rem; padding:12rem; margin-top:20rem; }
	.wpcf7 .wpcf7-tel { max-width:100%; }
}

/*==========================================================

	HEADER

===========================================================*/

/*	トップヘッダー
----------------------------------------------------------*/
.topBanners { display:flex; border-top:10rem solid var(--site-color); padding:10rem 40rem; }
.topBanners .logo { display:block; width:400rem; margin-right:40rem; }
.topBanners .banners { display:flex; column-gap:20rem; margin-left:auto; }
.topBanners .banners a img { width:auto; height:80rem; }
.topBanners .banners .inquiryTel { display:none; }
@media (max-width:780px) {
	.topBanners { justify-content:flex-start; padding:0; border:none; }
	.topBanners .logo { display:none; }
	.topBanners .banners { column-gap:10rem; position:fixed; left:0; bottom:0; width:100%; height:80rem; background:#fffffff8; z-index:1002; }
	.topBanners .banners div { display:none; }
	.topBanners .banners a img { height:64rem }
	.topBanners .banners .inquiryTel { display:initial; }
}

/*	ヘッダー
----------------------------------------------------------*/
header { display:flex; flex-wrap:wrap; position:sticky; right:0; top:0; z-index:999; color:#fff; background: var(--site-color); overflow:hidden; }
header .logo { display:none; }
header .information { width:100%; height:0; background: var(--information-color); color:white; overflow:hidden; transition:height 0.5s; display:flex; }
header.sticked .information { height:40rem; }
@media (max-width:780px) {
	header { justify-content:flex-start; align-items:center; background:white; height:60rem; border-top:5rem solid var(--site-color); box-shadow:0 0 10rem #00000040; }
	header .logo { display:block; margin-left:12rem; }
	header .logo figure { width:240rem; height:auto; }
}

/*	NAVIGATION
----------------------------------------------------------*/
header nav { display:flex; }
header nav > * { display:flex; flex-direction:column; padding:0 20rem; height:80rem; background-repeat:no-repeat; background-size:60rem auto; background-position:left center; }
header nav span { display:block; text-align:center; }
header nav .jpn { font-size:18rem; font-weight:700; }
header nav .about { background-image:url(../images/renew/menu-about-icon.svg); }
header nav .area { background-image:url(../images/renew/menu-area-icon.svg); }
header nav .flow { background-image:url(../images/renew/menu-flow-icon.svg); }
header nav .inquiry { background-image:url(../images/renew/menu-inquiry-icon.svg); }
header nav .csr { background-image:url(../images/renew/menu-csr-icon.svg); }
header nav .office { background-image:url(../images/renew/menu-office-icon.svg); }
@media (max-width:780px) {
	header nav { display:none; }
}

@media (max-width:780px) {
	.hamburgerMenuIcon { top:-4rem; }
	.hamburgerMenuFrame { background:var(--site-color); color:#fff;}
	.hamburgerMenuFrame > * { height:60rem;  transition:opacity 1s, transform 1s; opacity:0; transform:translateY(20rem); }
	html.slideMenuActive .hamburgerMenuFrame > * { opacity:1; transform:translateY(0); }
	.hamburgerMenuFrame > * .jpn { font-size:20rem; font-weight:500; }
	.hamburgerMenuFrame > * .eng { margin-left:auto; color:#ccc; }
}


/*	パンくず
----------------------------------------------------------*/
.breadcrumb { display:flex; justify-content:flex-start; background:#ffffffe0; padding-right:40rem; width:100%; z-index:10; color:#66788c; }

.breadcrumb .recruitMenu { display:flex; flex-wrap:wrap; margin-left:auto; }
.breadcrumb .recruitMenu > * { display:flex; padding:0 20rem; height:60rem; }
.breadcrumb .recruitMenu > *:last-child { font-weight:bold; }
@media (max-width:780px) {
	.breadcrumb { display:none; }
	.breadcrumb .recruitMenu { display:none; }
}


/*==========================================================

	FOOTER

===========================================================*/
footer .footerBox { background:#4288dc; color:#fff; padding-top:40rem; }
footer .banners { display:flex; flex-wrap:wrap; gap:20rem; }
footer .banners > .inquiry img { width:100%; }
footer .banners > *:not(.inquiry) img { width:auto; height:80rem; }
footer .links { display:grid; grid-template-columns:1fr 1fr; grid-gap:20rem; justify-content:flex-start; align-items:stretch; text-align:left; margin-top:40rem; }
footer .links .title { font-size:20rem; line-height:1; }
footer .links hr { margin-bottom:16rem; }
footer .links .content .items { display:grid; grid-template-columns:1fr 1fr; align-items:flex-start; grid-gap:20rem; }
footer .links .content .widget-title { font-size:18rem !important; line-height:2em !important; font-weight:600 !important; border-bottom:1rem solid #ffffffc0 !important; margin-bottom:6rem; }
footer .links .content ul { margin:0 0 0 10rem; }
footer .links .content li { line-height:1.6; font-weight:normal; }
footer .links .info { display:grid; grid-template-columns:1fr 1fr; grid-gap:20rem; align-items:flex-start; }
footer .links .info .search { grid-column: 1 / 3; }
footer .company { margin-top:40rem; font-size:15rem; display:grid; grid-template-columns:1fr 1fr; padding-top:40rem; border-top:1rem solid white; }
footer .company .textwidget p { margin-bottom:0.75em; }
footer .logo a { display:block; width:480rem; margin:20rem auto 60rem;  }
footer .copyright { font-size:14rem; line-height:2; margin-top:40rem; background: var(--site-color); text-align:center; }
@media (max-width:780px) {
	footer .footerBox { padding-top:20rem; padding-bottom:80rem; }
	footer .banners { gap:12rem; }
	footer .banners > *:not(.inquiry) img { height:52rem; }
	footer .links { grid-template-columns:1fr; grid-gap:20rem; margin-top:40rem; }
	footer .links .widget-title { margin-bottom:12rem; }
	footer .links hr { margin-bottom:12rem; }
	footer .links .content .items { grid-template-columns:1fr; grid-gap:12rem; }
	footer .links .content .widget-title { font-size:18rem !important; line-height:2em !important; font-weight:600 !important; border-bottom:1rem solid #ffffffc0 !important; }
	footer .links .info { grid-template-columns:1fr; grid-gap:20rem; }
	footer .links .info form.gsc-search-box { max-width:none; }
	footer .links .info .search { grid-column:auto; }
	footer .company { grid-template-columns:1fr; padding:40rem 0 0; }
	footer .links .info .company .textwidget p { margin-bottom:0.75em; }
	footer .logo a { display:block; width:320rem; margin:20rem auto;  }
	footer .copyright { margin-top:20rem; }
}


/*==========================================================

	SECTIONS

===========================================================*/
section.pageTitle { margin:60rem 0 40rem; display:flex; text-align:left; }
section.pageTitle .title { font-size:32rem; letter-spacing:0.05; font-weight:500; }
@media (max-width:780px) {
	section.pageTitle { margin:30rem 0; padding:0 12rem; }
	section.pageTitle .title { font-size:24rem; }
}

section.pageContent { padding-bottom:100rem; }
section.pageContent .catch { display:flex; text-align:left; margin:20rem auto; font-size:18rem; font-weight:normal; }
@media (max-width:780px) {
	section.pageContent { padding-bottom:60rem; }
	section.pageContent .catch { margin:20rem auto; font-size:15rem; padding:0 12rem; }
}

section .comment,
section .comments { font-size:18rem; margin-top:28rem; }
section .comments * + p { margin-top:0.75em; }
@media (max-width:780px) {
	section .comment,
	section .comments { font-size:16rem; margin-top:16rem; }
}


/*==========================================================

	採用ページ

===========================================================*/
#recruit { background:var(--recruite-bg-color); }
#recruit .button.white { color:var(--recruit-text-color); }
#recruit .blackShadow { box-shadow: 0 10rem 26rem rgba(0,0,0,.18); }
#recruit .blueShadow { box-shadow: 0 10rem 26rem rgba(63,115,171,.18); }

#recruit section { padding:80rem 0; text-align:left; color:var(--recruit-text-color); }
#recruit section h2 { font-size:48rem; line-height: 1.25; letter-spacing: -.03em; font-weight:700; }
#recruit section .sectionTitle { margin-bottom:34rem; }
#recruit section .kicker { font-size:15rem; letter-spacing:0.12em; font-weight:bold; margin-bottom:0.5em; }
#recruit section.center { text-align:center; }
#recruit section.blueBack { background:var(--site-color); color:white; }
#recruit section.whiteBack { background:white; }
@media (max-width:780px) {
	#recruit section { padding:40rem 0 60rem; }
	#recruit section h2 { font-size:27rem; line-height:1.5; }
}

#recruit section.fv { position: relative; display: grid; place-items: center; color: white; background: linear-gradient(120deg, rgba(25,55,88,.94), rgba(63,115,171,.76)), url('../images/renew/recruit-fv.webp') center/cover; }
#recruit section.fv::after { content: ""; position: absolute; inset: auto 0 0 0; height: 150rem; background: linear-gradient(to bottom /* in oklch */, transparent, var(--recruite-bg-color)); }
#recruit section.fv h1 { margin: 0 0 24rem; font-size:80rem; line-height: 1.2; letter-spacing: -.04em; font-weight:700; width:1160rem; }
#recruit section.fv .container { padding-bottom:140rem; text-align:center; }
#recruit section.fv .eyebrow { display:inline-block; padding: 4rem 16rem; border: 1rem solid #ffffff84; border-radius: 6rem; font-weight:500; letter-spacing: .08em; margin-bottom: 26rem; background:#ffffff23; }
#recruit section.fv .copy { font-size:28rem; font-weight: 700; margin-bottom: 22rem; }
#recruit section.fv .sub { font-size:17rem; margin-bottom:36rem; }
#recruit section.fv .badges { display:flex; flex-wrap:wrap; gap:10rem; margin-top:32rem; }
#recruit section.fv .badges > * { background:#ffffff23; padding:4rem 16rem; border-radius:6rem; font-weight:700; border:1rem solid #ffffff38; }
#recruit section.fv .buttons { margin-top:60rem; }
@media (max-width:780px) {
	#recruit section.fv::after { height: 80rem; }
	#recruit section.fv h1 { margin: 0 0 24rem; font-size:32rem; width:auto; }
	#recruit section.fv .container { padding-bottom:60rem; }
	#recruit section.fv .copy { font-size:20rem; margin-bottom: 22rem; }
	#recruit section.fv .badges > * { padding:2rem 8rem; border-radius:4rem; font-size:15rem; }
	#recruit section.fv .buttons { margin-top:40rem; }
}

#recruit section.work .gridBox { display:grid; grid-template-columns:1fr 1fr; gap:40rem; }
#recruit section.work .sectionTitle { margin-bottom:0; }
#recruit section.work .photo { border-radius:12rem; overflow:hidden; }
@media (max-width:780px) {
	#recruit section.work .gridBox { grid-template-columns:1fr; gap:20rem; }
}

#recruit section.cases .cardGrid { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:18rem; }
#recruit section.cases .cardGrid .card { display:flex; align-items:flex-end; aspect-ratio:3 / 4; background-position:center; background-size:cover; border-radius:24rem; overflow:hidden; }
#recruit section.cases .cardGrid .card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 25%, rgba(0,0,0,.78)); }
#recruit section.cases .cardGrid .card .text { color:white; padding:0 20rem 20rem; z-index:2; }
#recruit section.cases .cardGrid .card .text h3 { font-size:24rem; font-weight:500; }
#recruit section.cases .cardGrid .card .text p { font-size:14rem; opacity:0.9; }
@media (max-width:780px) {
	#recruit section.cases .cardGrid { grid-template-columns:1fr 1fr; gap:10rem; }
}

#recruit section.uniquework { background: linear-gradient(#2f5d8fc0, #2f5d8fc0), url('../images/renew/uniquework-bg.webp') center/cover; }
#recruit section.uniquework .gridBox { display:grid; grid-template-columns:520rem 1fr; gap:40rem; align-items:flex-start; }
#recruit section.uniquework .listBox > * { padding:18rem 20rem; border:1rem solid #d9e6f2; border-radius:6rem; background:white; color:var(--recruit-text-color); }
#recruit section.uniquework .listBox > * + * { margin-top:1em; }
#recruit section.uniquework .listBox > *.pickup { border-color:#d9e6f2; background:#f4f8fc; }
#recruit section.uniquework .listBox > * strong { font-size:17rem; line-height:1.6; margin-bottom:0.5em; }
@media (max-width:780px) {
	#recruit section.uniquework .gridBox { grid-template-columns:1fr; gap:20rem; }
	#recruit section.uniquework .gridBox .sectionTitle { margin-bottom:0; }
}

#recruit section.fit .cardGrid  { display: grid; grid-template-columns:1fr 1fr; gap:20rem; color:#333; }
#recruit section.fit .cardGrid > * { padding:24rem; border-radius:6rem; background:white; border-top:5rem solid var(--site-color); }
#recruit section.fit .cardGrid > * h3 { font-size:18rem; margin-bottom:0.75em; }
#recruit section.fit .checkList  { display: grid; grid-template-columns:1fr 1fr; gap:20rem; margin-top:32rem; color:#333; }
#recruit section.fit .checkList > * { padding:12rem 14rem; border-radius:6rem; background:white; border: 1rem solid #d9e6f2; }
#recruit section.fit .checkList > *::before { content: '\2713'; color: var(--primary); margin-right: 8rem; font-weight: 900; }
@media (max-width:780px) {
	#recruit section.fit .cardGrid  { grid-template-columns:1fr; gap:10rem; font-size:15rem; }
	#recruit section.fit .cardGrid > * { padding:16rem; border-top-width:4rem; }
	#recruit section.fit .checkList  { grid-template-columns:1fr; gap:10rem; margin-top:20rem; }
}

#recruit section.beginner .gridBox { display:grid; grid-template-columns:1fr 1fr; gap:40rem; align-items:flex-start; }
#recruit section.beginner .photo { border-radius:24rem; overflow:hidden; }
@media (max-width:780px) {
	#recruit section.beginner .gridBox { display:flex; flex-direction:column-reverse; gap:10rem; }
	#recruit section.beginner .gridBox .sectionTitle { margin-bottom:0; }
}

#recruit section.flow .gridBox { display:grid; grid-template-columns:1fr 1fr 1fr 1fr 1fr; gap:12rem; align-items:stretch; }
#recruit section.flow .gridBox > * { padding:20rem; border-radius:6rem; background:white; border-top:5rem solid var(--site-color); }
#recruit section.flow .gridBox > * span { display:block; font-size:20rem; font-weight:500; }
#recruit section.flow .gridBox > * h3 { color:#333; }
#recruit section.flow .gridBox > * p { margin-top:20rem; color:#333; }
@media (max-width:780px) {
	#recruit section.flow .gridBox { grid-template-columns:1fr; gap:10rem; }
	#recruit section.flow .gridBox > * { padding:12rem 16rem; }
	#recruit section.flow .gridBox > * > *:first-child { display:flex; justify-content:flex-start; gap:16rem; }
	#recruit section.flow .gridBox > * p { margin-top:10rem; font-size:15rem; }
}

#recruit section.reqruitments table { width: 100%; background: #fff; border-radius: 6rem; overflow: hidden; box-shadow: 0 4rem 14rem rgba(0,0,0,.08); line-height:1.8; }
#recruit section.reqruitments table tr { border-bottom:1rem solid #d9e6f2; }
#recruit section.reqruitments table th,
#recruit section.reqruitments table td { padding: 15rem 18rem; text-align: left; vertical-align: top; }
#recruit section.reqruitments table th { width: 28%; background:var(--recruite-bg-color); color:var(--site-color); }
#recruit section.reqruitments table td { color:#333; }
@media (max-width:780px) {
	#recruit section.reqruitments table { line-height:1.6; font-size:15rem; }
	#recruit section.reqruitments table th { width: 32%; }
}

#recruit section.entry .comment { max-width:none; }

#recruit-form .job { font-size:20rem; text-align:center; margin-bottom:20rem; }