@charset "UTF-8";

:root {
	--primary-white: #fff;
	--primary-black: #000;
	--primary-orange: #f69529;
	--primary-green: #109e68;
	--section-padding: 64px 3.46%;
	scroll-padding: 20px;
}

html {
	font-size: 62.5%;
	min-height: 0;
	min-width: 0;
	/* max-width: 1440px; */
	margin: 0 auto;
	overflow-x: hidden;
}

body {
	font-family: "Zen Kaku Gothic New", "Archivo", Arial, sans-serif;
	font-style: normal;
	color: var(--primary-black, #000);
	background-color: var(--primary-white, #fff);
	font-size: 1.6rem;
	letter-spacing: 0.06em;
	line-height: 2;
}

.font-size-fv {
	font-size: clamp(3.2rem, 2.637rem + 2.4vw, 4.8rem);
}

.font-size-M {
	font-size: clamp(2.4rem, 1.977rem + 1.8vw, 3.6rem);
}

.font-size-20 {
	font-size: clamp(2rem, 1.648rem + 1.5vw, 3rem);
}

.font-size-S {
	font-size: clamp(1.6rem, 1.318rem + 1.2vw, 2.4rem);
}

img {
	max-width: 100%;
	height: auto;
}

a {
	text-decoration: none;
	display: inline-block;
}

.anchor {
	display: inline-block;
	transition: 0.2s cubic-bezier(0.45, 0, 0.55, 1);
}

.anchor:hover {
	opacity: 0.8;
}

.SpBr {
	display: inline-block;
}

.TABBr {
	display: inline-block;
}

.pcBr {
	display: none;
}

.white {
	color: var(--primary-white, #fff);
}

.none {
	display: none;
}

/* 共通 pc */

@media screen and (min-width: 768px) {
	.SpBr {
		display: none;
	}

	.TABBr {
		display: inline-block;
	}

	.sp {
		display: none;
	}
}

@media screen and (min-width: 1024px) {
	.TABBr {
		display: none;
	}

	.pcBr {
		display: inline-block;
	}

	:root {
		--section-padding: 120px 8.3%;
	}
}

/* <br class="sp_br"> */
.sp_br {
	display: none;
}

.pc_br {
	display: inline;
	/* <br class="pc_br"> */
}

@media screen and (max-width: 768px) {
	.sp_br {
		display: block;
	}

	.pc_br {
		display: none;
	}
}

/* ハンバーガーキット */

.hamburger {
	position: relative;
	width: 72px;
	height: auto;
	aspect-ratio: 1/1;
	margin: 0;
	border: transparent;
	cursor: pointer;
	z-index: 1;
	background-color: var(--primary-orange, #f69529);
}

.hamburger span {
	display: block;
	position: relative;
	left: 50%;
	width: 32px;
	height: 3px;
	transform: translateX(-50%);
	background-color: var(--primary-white, #fff);
	transition: all 0.5s;
}

.hamburger span:nth-of-type(1) {
	top: -7px;
}

.hamburger span:nth-of-type(2) {
	top: 1px;
	transform: translateX(-0.45deg);
}

.hamburger span:nth-of-type(3) {
	top: 9px;
	transform: translateX(-0.45deg);
}

.hamburger.is-active span:nth-of-type(1) {
	top: 0;
	transform: translateX(-50%) rotate(225deg);
}

.hamburger.is-active span:nth-of-type(2) {
	opacity: 0;
}

.hamburger.is-active span:nth-of-type(3) {
	top: -4px;
	transform: translateX(-50%) rotate(-225deg);
}

/* hamburger pc */

@media screen and (min-width: 768px) {
	.hamburger {
		height: 96px;
		width: 96px;
	}

	.hamburger span {
		width: 48px;
	}
}

/* header */

header.scroll {
	background: rgba(0, 0, 1, 0.7);
}

.header__inner {
	display: flex;
	z-index: 20;
	align-items: center;
	position: fixed;
	top: 0;
	/* max-width: 1440px; */
}

.header__wrapper {
	height: 72px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	z-index: 10;
	padding-left: 0.1em;
	/* max-width: 1440px; */
	/* width: 100vw; */
	transition: 0.3s;
	background-color: var(--primary-white, #fff);
}

.header__wrapper.scroll {
	background: rgba(0, 0, 0, 0.7);
}

.logoWrapper {
	display: block;
	text-align: center;
}

.logoImg {
	width: auto;
	height: 48px;
	padding: 5px;
	background-color: #fff;
}

.logoImg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 新卒者向けリクルートサイトのCSS */
.logo__copy {
	font-size: 0.8rem;
	letter-spacing: 0.1em;
	font-style: italic;
	font-weight: 700;
	margin-top: 2px;
	border: solid 1px #696868;
	background-color: #fff;
}

/* header pc */

@media screen and (min-width: 768px) {
	.header__wrapper {
		height: 96px;
		padding-top: 6px;
		padding-left: 1em;
		background-color: var(--primary-orange, #f69529);
		box-shadow: 8px 0px 16px -6px rgba(0, 0, 0, 0.6);
		margin-bottom: 5px;
	}

	.header__inner {
		width: 100vw;
		max-width: 1440px;
		justify-content: space-between;
		background-color: var(--primary-white, #fff);
	}

	.logoImg {
		height: 56px;
	}

	.logo__copy {
		font-size: 1rem;
		letter-spacing: 0.1em;
		margin-top: 2px;
	}
}

/* エントリーボタン */

.header__other {
	display: flex;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 15;
	box-shadow: 8px 0px 16px -6px rgba(0, 0, 0, 0.6);
}

.header__entry {
	width: 80px;
	height: 72px;
	background-color: var(--primary-green, #109e68);
	/* padding: 1em; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.entry__en {
	color: var(--primary-white, #fff);
	text-align: center;
	font-family: "Archivo";
	font-size: 1.2rem;
	font-weight: 700;
	line-height: 1.5;
}

.entry__name {
	color: var(--primary-white, #fff);
	text-align: center;
	
	font-size: 1.2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 1.5;
}

.header__entry:active {
	opacity: 0.8;
}

/* エントリーボタン　pc */

@media screen and (min-width: 768px) {
	.header__entry {
		width: 104px;
		height: 96px;
	}

	.header__entry:hover {
		opacity: 0.8;
	}

	.entry__en {
		font-size: 1.4rem;
		font-weight: 700;
		line-height: 1.5;
	}

	.entry__name {
		font-size: 1.6rem;
		letter-spacing: 0.15;
		font-style: normal;
		font-weight: 700;
		line-height: 1.5;
	}
}

/* ナビゲーション */

.header__nav {
	position: fixed;
	right: -100%;
	top: 0;
	background-color: rgb(246, 149, 41, 1);
	width: 100vw;
	padding: 64px 6.4% 24px;
	transition: 0.4s;
	z-index: 10;
	height: 100vh;
	overflow-y: scroll;
	scrollbar-width: none;
	max-width: 400px;
	box-shadow: -5px 5px 15px 0px rgba(0, 0, 0, 0.35);
}

.header__nav.is-active {
	position: fixed;
	right: 0;
}

.nav__list {
	display: none;
}

.navLink {
	cursor: pointer;
	display: flex;
	align-items: center;
	padding: 1em;
	transition: all 0.2s;
	position: relative;
}

.navImg {
	display: inline-block;
	width: 1.5em;
	height: auto;
	aspect-ratio: 1/1;
	margin-right: 0.5em;
	z-index: 1;
	transition: all 0.2s;
}

.navImg img {
	width: 100%;
	height: auto;
	aspect-ratio: 1/1;
}

.nav__item {
	line-height: 1;
}

.navEnTxt {
	color: var(--primary-white, #fff);
	font-family: "Archivo";
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
}

.navTxt {
	font-size: 1.2rem;
	font-weight: 600;
	color: #333;
	display: inline-block;
	z-index: 1;
	transition: all 0.2s;
	line-height: 1;
}

.pcNav__item {
	width: 100%;
	border-bottom: solid 1px #fff;
}

.pcNavEnTxt {
	color: #fff;
	font-family: "Archivo";
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1.5;
}

.pcNav__list {
	display: flex;
	flex-direction: column;
	position: fixed;
	width: 80%;
}

.pcNavLink {
	cursor: pointer;
	display: flex;
	align-items: center;
	padding: 1em 0;
	transition: all 0.2s;
	position: relative;
}

.pcNavImg {
	display: inline-block;
	width: 1.5em;
	height: auto;
	aspect-ratio: 1/1;
	margin-right: 0.5em;
	z-index: 1;
	transition: all 0.2s;
}

.pcNavImg img {
	width: 100%;
	height: auto;
	aspect-ratio: 1/1;
}

.pcNavTxt {
	font-weight: 700;
	color: #fff;
	display: inline-block;
	z-index: 1;
	transition: all 0.2s;
	line-height: 1;
}

/* header */

@media screen and (min-width: 768px) {
	.header__nav {
		padding: 96px 6.4% 40px;
	}

	.header__nav {
		max-width: 700px;
	}
}

@media screen and (min-width: 1024px) {
	.pcNav__list {
		z-index: 10;
		height: 96px;
		padding-right: 1em;
		margin: 0;
	}

	.nav__list {
		display: flex;
		flex-direction: row;
		z-index: 10;
		height: 64px;
		align-items: center;
		margin-right: 13.5em;
	}

	.navLink,
	.navLinkPlus {
		flex-direction: column;
		border-top: none;
		border-bottom: none;
		padding: 1em;
		justify-content: center;
		text-align: center;
	}

	.navWork__list {
		position: absolute;
		bottom: 200%;
		right: 50%;
		transform: translate(50%, 100%);
		width: 160px;
		background-color: var(--primary-white, #fff);
		transition: 0.4s cubic-bezier(0.45, 0, 0.55, 1);
		z-index: -10;
		opacity: 0;
	}

	.nav__itemPlus:hover .navWork__list {
		bottom: 0%;
		opacity: 1;
	}

	.navWorkLink {
		flex-direction: column;
		margin-left: 0;
	}

	.navImg {
		margin-right: 0;
		filter: brightness(0) saturate(100%) invert(18%) sepia(87%)
			saturate(1711%) hue-rotate(194deg) brightness(88%) contrast(103%);
	}

	.navEnTxt {
		text-align: center;
	}
}

/* お問い合わせページ */

.contact__inner {
	padding: 96px 12%;
	background-color: var(--primary-orange, #f69529);
	display: flex;
	align-items: flex-end;
	gap: 8%;
}

.contact__txtWrapper {
	width: 49%;
}

.contact__title {
	color: var(--primary-white, #fff);
	
	font-weight: 700;
}

.contact__txt {
	margin-top: 32px;
	color: var(--primary-white, #fff);
}

/* お問い合わせ sp */

@media screen and (max-width: 1023px) {
	.contact__inner {
		padding: 64px 4%;
		flex-direction: column;
	}

	.contact__txt {
		margin-top: 20px;
		text-align: left;
	}

	.contact__txtWrapper {
		width: 100%;
	}

	.contact__title {
		text-align: center;
	}
}

@media screen and (min-width: 1440px) {
	.contact__txtWrapper {
		width: 35%;
	}
}

/* お問い合わせボタン */

.contact__btnWrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 49%;
	margin: 0 auto;
	gap: 1em;
}

.contactBtn__item {
	width: 100%;
}

.contactBtn__link {
	/* max-width: 320px; */
	margin: 0 auto;
	background-color: var(--primary-white, #fff);
	width: 100%;
	padding: 16px 24px;
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.contactBtn__txtWrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	text-align: center;
}

.contactBtnImg {
	filter: brightness(0) saturate(100%) invert(79%) sepia(54%) saturate(4309%)
		hue-rotate(342deg) brightness(102%) contrast(93%);
	width: 2.4rem;
	height: auto;
	aspect-ratio: 1/1;
}

.contactBtn__txt {
	color: var(--primary-black, #000);
	font-size: 2rem;
	font-weight: 700;
}

.contactBtn__txt small {
	display: block;
	width: 100%;
	font-size: 1rem;
	font-weight: 500;
}

.contactBtn__arrow {
	display: block;
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	width: 24px;
	height: auto;
	object-fit: cover;
}

.contactBtn__link:hover {
	opacity: 0.9;
	scale: 0.99;
}

.contactBtn__link:hover .contactBtn__arrow {
	transform: translateX(10px);
}

.contactTelBtn__link {
	/* max-width: 320px; */
	margin: 0 auto;
	background-color: var(--primary-black, #000);
	width: 100%;
	padding: 16px 24px;
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.contactTelBtn__txt {
	color: var(--primary-white, #fff);
	font-weight: 700;
	font-size: 2.5rem;
}

.contactTelBtn__txt small {
	display: block;
	width: 100%;
	font-size: 1rem;
	font-weight: 500;
	color: var(--primary-white, #fff);
}

.contactTelBtn__arrow {
	filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%)
		hue-rotate(320deg) brightness(104%) contrast(103%);
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	width: 24px;
	height: auto;
	object-fit: cover;
}

.contactTelBtn__link:hover {
	opacity: 0.9;
	scale: 0.99;
}

.contactTelBtn__link:hover .contactTelBtn__arrow {
	transform: translateX(10px);
}

/* お問い合わせボタン　sp */

@media screen and (max-width: 1023px) {
	.contact__btnWrapper {
		flex-direction: column;
		width: 100%;
		margin-top: 40px;
		gap: 1em;
		align-items: center;
	}

	.contactBtn__item {
		width: 100%;
	}
}

@media screen and (min-width: 1440px) {
	.contact__btnWrapper {
		flex-direction: row;
		width: 60%;
	}
}

/* footer */

.footer__inner {
	display: flex;
	padding: 96px 10% 80px;
	background: url(../images/footer.jpg), rgba(0, 0, 1, 0.8);
	background-blend-mode: darken;
	background-size: cover;
	background-position: 50% 64%;
	gap: 5.25%;
	align-items: flex-end;
}

.footer__recruit {
	width: 40%;
}

.footer__recruit a {
	font-size: 2.2rem;
	color: var(--primary-white, #fff);
	line-height: 1.5;
	font-weight: 700;
}

.footer__recruit small {
	font-size: 1.4rem;
	font-weight: normal;
}

.footer__navWrapper {
	width: 66.25%;
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 0px;
}

.footer__information {
	width: 28.5%;
}

.footer__logo {
	width: 80%;
	height: auto;
	padding: 0.5em;
	max-width: 320px;
	filter: drop-shadow(1px 1px 10px rgba(255, 255, 255, 1));
}

.footer__logo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.footerNav__list {
	display: flex;
	gap: 2em;
	justify-content: end;
}

.footer__detail {
	margin-top: 40px;
}

.footer__address {
	color: var(--primary-white, #fff);
	font-weight: normal;
	line-height: 1.6;
}

.footer__name {
	color: var(--primary-white, #fff);
	font-weight: normal;
	line-height: 1.5;
	margin-top: 4px;
}

.footerNavTxt {
	color: var(--primary-white, #fff);
	font-weight: normal;
}

.footer__link {
	display: flex;
	justify-content: end;
	align-items: center;
}

.footer__linkTxt {
	color: #ada9a9;
	font-weight: 500;
	padding-right: 1em;
	display: inline-block;
	font-size: 1.4rem;
}

.footer__linkIcon {
	width: 24px;
	height: auto;
	object-fit: cover;
}

.copyright {
	text-align: right;
	color: #ada9a9;
	font-weight: 500;
}

/* footer sp */

@media screen and (max-width: 1200px) {
	.footer__inner {
		flex-direction: column;
		align-items: center;
		padding-bottom: 30px;
	}
	.footer__recruit {
		width: 100%;
	}
	.footer__recruit a {
		text-align: left;
	}

	.footer__navWrapper {
		width: 100%;
		margin-top: 64px;
	}

	.footer__information {
		width: 100%;
		justify-content: center;
	}

	.footer__logo {
		margin: 0 auto;
	}

	.footer__address,
	.footer__name {
		text-align: center;
	}

	.footerNav__list,
	.footer__link {
		justify-content: center;
	}

	.copyright {
		text-align: center;
	}

	.footer__recruit {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}

@media screen and (max-width: 1023px) {
	.footer__inner {
		padding: auto 8%;
	}

	.footer__recruit a {
		text-align: left;
	}

	.footerNav__list {
		flex-direction: column;
	}

	.footerNav__item {
		text-align: center;
		border-bottom: 1px solid var(--primary-white, #fff);
		width: 100%;
		margin: 0 auto;
		padding: 1em 0;
	}

	.footerNav__list {
		gap: 0;
		margin-bottom: 30px;
	}
}

@media screen and (max-width: 767px) {
	.footer__inner {
		margin-top: 64px 5.55555% 24px;
	}
	.footer__recruit a {
		text-align: center;
	}
	.footer__detail {
		margin-top: 24px;
	}

	.footer__navWrapper {
		margin-top: 40px;
		gap: 24px;
	}

	.footerNav__item {
		padding: 0.5em 0;
	}
}

/* inner */

.orange__inner {
	background-color: var(--primary-orange, #f69529);
	padding: 64px 4%;
}

.white__inner {
	background-color: var(--primary-white, #fff);
	margin: 64px 5%;
}

@media screen and (min-width: 768px) {
	.white__inner {
		margin: 100px 12%;
	}

	.orange__inner {
		padding: 100px 12%;
	}
}

/* ボタン */

.sectionButton {
	max-width: 240px;
	padding: 12px 24px;
	display: flex;
	background-color: var(--primary-white, #fff);
	align-items: center;
	justify-content: center;
	gap: 24px;
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}

.sectionButton__wrapper {
	display: flex;
	align-items: center;
	gap: 0.5em;
}

.sectionButton__wrapper .icon {
	width: 16px;
	height: auto;
	aspect-ratio: 1/1;
	object-fit: contain;
}

.sectionButton__wrapper .txt {
	color: var(--primary-black, #000);
	
	font-size: 1.6rem;
	font-weight: 500;
}

.sectionButton.black {
	background-color: var(--primary-black, #000);
}

.sectionButton__wrapper .icon.black {
	width: 2.4rem;
	height: auto;
	aspect-ratio: 1/1;
	object-fit: contain;
	filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%)
		hue-rotate(358deg) brightness(101%) contrast(106%);
}

.sectionButton__wrapper .txt.black {
	color: var(--primary-white, #fff);
}

.sectionButton__arrow.black {
	filter: brightness(0) saturate(100%) invert(95%) sepia(10%) saturate(195%)
		hue-rotate(266deg) brightness(117%) contrast(100%);
	width: 16px;
}

.sectionButton__arrow {
	display: inline-block;
	transition: 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
	width: 16px;
}

.sectionButton:active {
	opacity: 0.9;
	scale: 0.99;
}

.sectionButton:active .sectionButton__arrow {
	transform: translateX(10px);
}

/* section pc */

@media screen and (min-width: 1024px) {
	.sectionButton {
		max-width: 240px;
	}

	.sectionButton:hover {
		opacity: 0.9;
		scale: 0.99;
	}

	.sectionButton:hover .sectionButton__arrow {
		transform: translateX(10px);
	}
}

/* 下層ページ */

.inner__lowerPageFirstview {
	height: 200px;
	padding: 40px 12%;
	background-image: url(../images/lowerPageImg.jpg);
	background-color: rgba(0, 0, 0, 0.5);
	background-size: cover;
	background-blend-mode: darken;
	background-position-y: 50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.lowerPageSubcopy {
	color: var(--primary-white, #fff);
	font-family: "Archivo";
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}

.lowerPageCopy {
	color: var(--primary-white, #fff);
	
	font-weight: 700;
	line-height: 2;
	text-align: center;
}

.breadcrumb {
	display: flex;
	align-items: baseline;
	margin: 16px 12%;
	gap: 0.2em;
}

.breadcrumb__home {
	color: var(--primary-orange, #f69529);
	
	font-weight: 700;
	font-style: normal;
	line-height: 1.33;
	border-bottom: 1px solid var(--primary-orange, #f69529);
}

.breadcrumb__arrow {
	width: 12px;
	height: auto;
	aspect-ratio: 1/1;
	filter: brightness(0) saturate(100%) invert(21%) sepia(8%) saturate(1369%)
		hue-rotate(188deg) brightness(96%) contrast(89%);
}

.breadcrumb__menu {
	color: var(--primary-black, #000);
	
	font-weight: 400;
	line-height: 1.33;
	white-space: nowrap;
}

/* 下層ページ pc */

@media screen and (min-width: 768px) {
	.inner__lowerPageFirstview {
		height: 300px;
	}
}

/* 線伸びるアニメーション */

.progress {
	width: 8px;
	height: 100%;
	background: var(--primary-white, #fff);
	position: fixed;
	right: 0;
	top: 0;
	animation: progressBar 0.1s linear;
	animation-timeline: scroll();
	transform-origin: top right;
	z-index: 5;
	border: 1px solid var(--primary-black, #000);
}

@keyframes progressBar {
	0% {
		transform: scaleY(0);
	}

	100% {
		transform: scaleY(1);
	}
}