@charset "utf-8";

body {background-color: whitesmoke;}

/* ページ内スムースリンク */
html {scroll-behavior: smooth;}
/* scroll-margin-top: 60px; */

a {
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}


.text-justify {text-align: justify;}
table th {width: 100px;}


.mw-1600 {max-width: 1600px;}
.mw-1200 {max-width: 1200px;}
.mw-1050 {max-width: 1050px;}
.mw-800 {max-width: 800px;}
.mw-600 {max-width: 600px;}
.mw-500 {max-width: 500px;}

.f-20 {font-size: 2rem;}
.f-15 {font-size: 1.5rem;}
.f-12 {font-size: 1.2rem;}

.f-10-15 {font-size: 1rem;}
@media screen and (max-width: 767px) {
.f-10-15 {font-size: 1.5rem;}
}


/* h3-タイトル */
.grid-box-h3 {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
}
.grid-item-h3:nth-child(1),.grid-item-h3:nth-child(2)  {
	grid-row: 1/2;
	grid-column: 1/2;
}
h3 {font-size: clamp(2rem, 1.273rem + 3.64vw, 4rem);}
/* 320px2rem 1200px4rem */
.h3-bg {
	font-size: clamp(4rem, 3.273rem + 3.64vw, 6rem);
	font-family: 'DPH特太ゴシック体';
	color: white;
}
/* 320px4rem 1200px6rem */
@font-face {
	font-family: DPH特太ゴシック体;
	src: url('font/DFJGOTEB.TTC') format("opentype");
}


/* ボタンデザイン */
.button-a {
	display: inline-block;
	font-size: 1rem;
	width: 200px;
	padding: 15px;
	margin: 10px 0px;
	text-decoration: none;
	color: #ffffff;
	text-align: center;
	font-weight: bold;
	background-color: #215ca4;
	-webkit-transition: .4s;
	transition: .4s;
	&:hover{
		text-decoration: none;
		color : #ffffff;
		background-color: #143865;
	}	
}
/* ボタン矢印デザイン */
.label-button-a {
	position: relative;
	&:before {
		position: absolute;
		content: url(image/button-6-2.svg);
		right: -25px;
		top: 8px;
	}
}		


			/* index.html */



/* top-hero */
.grid-box-hero {
	display: grid;
	grid-template-rows: 5px 37px 113px 1fr 30px;
	grid-template-columns: 150px 1fr 200px;
}
.hero-h {height: 100svh;}
@media screen and (max-width: 768px) {
.grid-box-hero {display:block;}
.hero-h {height: initial;}
}
.grid-item-hero:nth-child(1) {
	grid-row: 3/6;
	grid-column: 1/4;
}
.grid-item-hero:nth-child(2) {
	grid-row: 2/4;
	grid-column: 1/2;
	background-color: white;
}
.grid-item-hero:nth-child(3) {
	grid-row: 4/5;
	grid-column: 1/4;
}
.grid-item-hero:nth-child(4) {
	grid-row: 2/5;
	grid-column: 3/4;
}

/* hover アンダーライン */
.a-txt.line {
	font-size: 1.5rem;
	padding-bottom: 3px;
	position: relative;
}
.a-txt.line::before {
	background: #ff701e;
	content: '';
	width: 100%;
	height: 2px;
	position: absolute;
	left: 0;
	bottom: 0;
	margin: auto;
	transform-origin: right top;
	transform: scale(0, 1);
	transition: transform .3s;
}
.a-txt.line:hover::before {
	transform-origin: left top;
	transform: scale(1, 1);
}

/* topロゴ回転 */
.grid-box-logo {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
}
.grid-item-logo:nth-child(1),.grid-item-logo:nth-child(2) {
	grid-row: 1/2;
	grid-column: 1/2;
}
.load {animation: spin 13s linear infinite;}
@keyframes spin {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(-360deg);}
}

/* h2-タイトル */
h2 {
	font-size: clamp(1.5rem, -0.147rem + 8.24vw, 5rem) ;
	/* 320px1.5rem 1000px5rem */
	line-height: 0.7;
	font-weight: bold;
	.f-08em {font-size: 0.8em;}
	.color-navy {color: navy;}
}
.h2-bg {
	background-color: rgba(255, 255, 255, 0.5);
}
.h2-p-bg {
	background-color: rgba(255, 255, 255, 0.5);
	font-size: clamp(1.2rem, 0.909rem + 1.45vw, 2rem);
	/* 320px1.2rem 1200px2rem */
	font-weight: bold;
}

/* bar-募集中 */
.bar-recruit {
	background-color: #dd644a;
	color: white;
	border-radius: 10px;
}

/* bar-メニュー */
.bar-menu {
	background-color: rgba(43,43,43,0.7);
	color: white;
	border-radius: 10px;
}



/* news */
.news-box {
	border-top: solid 1px silver;
	border-bottom: solid 1px silver;
}
.news-box-lavel {
	color: white;
	background-color: #888;
	border-radius: 999px;
}
.news-box a {color: navy;}
.w-170 {width: 170px;}



/* 私たちについて */
.grid-box-about_us {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
	background: linear-gradient(rgba(43,43,43,0.8) 10%,rgba(43,43,43,1) 100%);
	color: white;
	text-shadow: 2px 2px 3px #808080;
}
.grid-item-about_us:nth-child(1),.grid-item-about_us:nth-child(2),.grid-item-about_us:nth-child(3) {
	grid-row: 1/2;
	grid-column: 1/2;
}
.mw-33-100 {max-width: 33%;}
@media screen and (max-width: 991px) {
.mw-33-100 {max-width: 95%;}
}

.grid-item-about_us h3 {font-size: clamp(5rem, 3.182rem + 9.09vw, 10rem);}/* 320px5rem 1200px10rem */
.grid-item-about_us h2 {font-size: clamp(2.5rem, 1.955rem + 2.73vw, 4rem);}/* 320px2.5rem 1200px4rem */
.grid-item-about_us hgroup p {font-size: clamp(1rem, 0.636rem + 1.82vw, 2rem);}/* 320px1rem 1200px2rem */



/* 店舗でのシーン */
.grid-box-work {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
}
.grid-item-work:nth-child(1),.grid-item-work:nth-child(2) {
	grid-row: 1/2;
	grid-column: 1/2;
}
.work-box {
	width: 70%;
	z-index: 1;
}
.work-box h3 {
	font-size: clamp(2rem, 0.182rem + 9.09vw, 7rem);/* 320px2rem 1200px7rem */
	line-height: 0.7;
	.color-red {color: red;}
}
.scene-box {
	max-width: 450px;
	text-align:justify;
}
.scene-box h5 {font-size: clamp(2rem, 1.636rem + 1.82vw, 3rem);}/* 320px2rem 1200px7rem */
.scene-box p span {line-height: 2;}
.pt-10p {padding-top: 10%;}



/* お問い合わせ */
.contact-box {border: solid 1px silver;}
.h-100-80 {height: 100px;}
.border-c-9 {border-right: solid 1px silver;}
@media screen and (max-width: 575px) {
.h-100-80 {height: 80px;}
.border-c-9 {border-right: initial;}
}




/* トップに戻る */
.go-top-base {
	background-color: rgba(43,43,43,0.8);
	width: fit-content;
	border-radius: 100vw;
	margin-bottom: -25px;
}
.go-top {
	width: 20px;
	aspect-ratio: 1/1;
	border-top: solid 2px white;
	border-right: solid 2px white;
	transform: rotate(315deg);
}



/* footer */
footer {background: linear-gradient(rgba(43,43,43,0.8) 10%,rgba(43,43,43,1) 100%);}
footer p img {background-color: white; border-radius: 5px;}



		/* recruit.html */



/* サークル拡大 */
.grid-box-circle {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
}
.grid-item-circle:nth-child(1) {
	grid-row: 1/2;
	grid-column: 1/2;
}
.grid-item-circle:nth-child(2) {
	grid-row: 1/2;
	grid-column: 1/2;
}
.h-0 {height: 0px;}/* 注意 */
.anime-expansion {
	width: 40%;
	aspect-ratio: 1/1;
	background-image:  radial-gradient( red, yellow );
	border-radius: 50%;
	z-index: -1;
	animation: anime-a 5s 1;
	animation-fill-mode: forwards;
}
@keyframes anime-a {
	0% {transform: scale(1, 1);}
	100% {transform: scale(5, 5);}
}
/* リクルートh2 */
.h2-recruit {
	color: white;
	font-size: clamp(1.3rem, 0.227rem + 6.36vw, 5rem);
	line-height: 1;
	.f-08em {font-size: 0.8em;}
}



/* コーテーションマーク */
.quotation-box {
	background: url(image/icon-quotation-1.svg) top/contain no-repeat,url(image/icon-quotation-2.svg) bottom/contain no-repeat;
	p {font-size: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);}
	/* 320px1rem 1200px1.5rem */
}



/* スタッフイメージ */
.staff p {font-size: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);}
/* 320px1rem 1200px1.5rem */
.staff h5 {font-size:clamp(1.5rem, 1.136rem + 1.82vw, 2.5rem);}
/* 320px1.5rem 1200px2.5rem */
.staff-box {
	transform: rotate(4deg);
	background-color: #c4d7d1;
	border-radius: 20px;
}
.staff-img {
	background-color: antiquewhite;
	transform: rotate(-2deg);
	border-radius: 20px;
}



/* 環境育成 */
.environment h5 {font-size:clamp(1.5rem, 1.136rem + 1.82vw, 2.5rem);}



/* 就職までのステップ */
/* 左破線 */
.l-t-border {border-left: dashed 1px silver;}
@media screen and (max-width: 768px) {
.l-t-border {
	border-left: initial;
	border-top: dashed 1px silver;
}
}
/* 三角形 */
.label-triangle {
    position: relative;
}
.label-triangle::before {
	position: absolute;
	content: url(image/step-triangle-x.svg);
    left: 0px;
    top: 50%;
	transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
	.label-triangle::before {
	position: absolute;
	content: url(image/step-triangle-y.svg);
    left: 50%;
    top: 0px;
	transform: translateX(-50%);
}
}
/* mobile時の三角形の隙間 */
@media screen and (max-width: 768px) {
	.pt-0-20 {padding-top: 20px;}
}



/* 応援します */
.grid-box-support {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
}
.grid-item-support:nth-child(1),.grid-item-support:nth-child(2) {
	grid-row: 1/2;
	grid-column: 1/2;
}
.grid-item-support p span {
	font-size: clamp(1.2rem, 0.182rem + 5.09vw, 4rem);
	font-weight: bold;
	background-color: rgba(255, 255, 255, 0.7);
}



			/* otoiawase.html */



/* labelの色 */
.mail-label-bg {
	background-color: lavender;
	/* 文頭の矢印 */
	&:before {
		content: "";
		display: inline-block;
		content: url("image/icon-mail-arrow.svg");
		vertical-align: middle;
		padding-right: 5px;
	}
}



			/* thanks.html */



.grid-box-thanks {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr;
	height: 100svh;
}
.grid-item-thanks:nth-child(1),.grid-item-thanks:nth-child(2) {
	grid-row: 1/2;
	grid-column: 1/2;
}