@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

section{
	width:min(100%,1240px);
	margin:0 auto;
}

#content section h2{
	border-bottom:none;
}

#rec section:not(#news):not(#oubo):not(#coment){
	padding:100px 20px 0 20px;
	font-size:16px;
}

#content section:not(#oubo) h2{
	margin-bottom:50px;
}

#content #mainphoto h2{
	margin-bottom:0;
	padding:0;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (max-width: 430px) {
	body{
		margin:150px 0 0 0;
	}	
}

/*--------------------------------


	リクルート用メニュー


--------------------------------*/

#rec_menu{
	width:100%;
	padding-top: 10px;
	display: flex;
	justify-content: flex-end;
	 position: fixed;
    top: 100px;
    left: 0;
    z-index: 999;
}

#rec_menu ul{
	display: inline-flex;
	gap:10px;
	align-items: center;
	padding:10px 10px 10px 20px;
	border-radius: 100px;
	font-size:16px;
	border:1px solid #ccc;
	background-color: rgba(255,255,255,0.6);
	backdrop-filter: blur(5px);
}

#rec_menu li:not(.rec) a{
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
	-1px 1px 0 #FFF, 1px -1px 0 #FFF,
	0px 1px 0 #FFF, 0 -1px 0 #FFF,
	-1px 0 0 #FFF, 1px 0 0 #FFF;
}

#rec_menu li.rec a{
	padding:10px 15px;
	color:#fff;
	background-color:#B72F2F;
	border-radius: 100px;
	display: inline-block;
}

#rec_menu li.rec a.nonew{
	opacity: 0.5;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (min-width: 981px) {
	#rec_menu li a{
		position: relative;
		transition: 0.3s;
	}
	
	#rec_menu li.rec a:not(.nonew):hover{
		background-color:rgba(183,47,47,0.81);
	}

	#rec_menu li:not(.rec) a:hover{
		color:var(--blue02);
	}
	
	#rec_menu li:not(.rec) a:after{
		content:'';
		width:100%;
		height: 2px;
		display: block;
		background-color:var(--blue02);
		position: absolute;
		left:0;
		bottom:-2px;
		 transform-origin: right top;
	  transform: scale(0, 1);
	  transition: transform .2s;
	}
	
	#rec_menu li:not(.rec) a:hover:after{
		 transform-origin: left top;
	  transform: scale(1, 1);
	}
}

@media screen and (max-width: 430px) {
	#rec_menu{
		width:100%;
		background-color: #fff;
		display: block;
		padding-top: 10px;
		 top: 60px;
    	left: 0;
	}
	
	#rec_menu ul{
		width:100%;
		flex:none;
		gpd:0.5em 3px;
		font-size:12px;
		border:none;
		border-top:1px solid #ccc;
		border-bottom:1px solid #ccc;
		border-radius: 0;
		justify-content: center;
		align-items: center;
		display: flex;
		flex-wrap:wrap;
		padding:5px 0;
	}
	
	#rec_menu li{
		line-height: normal;
	}
	
	#rec_menu li.rec{
		width:100%;
		text-align: center;
	}
	
	#rec_menu li.rec a{
		width:200px;
		margin:0 auto;
		padding:5px 10px;
		line-height: normal;
		text-align: center;
		display: inline-block;
	}
}

/*--------------------------------


	メインフォト


--------------------------------*/

#mainphoto{
	width:100%;
	position: relative;	
}

#mainphoto h2{
	width:auto;
	position: absolute;
	bottom:50px;
	left:50px;
	font-size:40px;
	color:#fff;
	line-height: normal;
	border-bottom:none;
	padding:0;
	margin:0;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (max-width: 430px) {
	
	#mainphoto h2{
		bottom:10px;
		left:10px;
		font-size:28px;
	}
}



/*--------------------------------


	コメント


--------------------------------*/

section#coment{
	padding:50px 20px 0 20px;
	font-size:1.8rem;
	margin-top:0;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (max-width: 430px) {
	section#coment{
		font-size:18px;
	}
}

/*--------------------------------


	お知らせ


--------------------------------*/

section#news{
	width:100%;
	border-bottom:1px solid #ccc;
	padding:10px 0;
}

#news dl{
	width:min(100%,1240px);
	min-height: 100px;
	margin:0 auto;
	padding:5px 20px;
	display: flex;
	flex-direction: column;
}

section#news dt{
	font-family: "sofia-pro", sans-serif;
  font-weight: 700;
	font-size:1.4rem;
	color:var(--gray_text);	
}

section#news dd{
	flex:1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#news_list,
section#news a.more{
	font-size:12px;
	margin-top:8px;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (max-width: 430px) {
	#news dl{
		display: block;
	}
	
	section#news dt{
		margin-bottom:20px;
	}
}

/*--------------------------------


	会社を知る


--------------------------------*/

section#company{
	padidng:50px 20px 0 20px;
}

#company_bana{
	width:100%;
	margin-top:50px;
	display: flex;
	gap:30px;
}

#company_bana .item{
	flex:1;
	border:1px solid #ccc;
	display: flex;
	flex-direction: column;
	background-color: #fff;
	border-radius: 5px;
}

section#company .item_photo{
	width:100%;
	overflow: hidden;
	line-height: 0;
	border-radius: 5px 5pc 0 0;
}

section#company .item_photo img{
	width:100%;
	aspect-ratio: 16 / 9;
}

section#company .item_text{
	flex:1;
	padding:20px 15px 10px 15px;
	font-size:25px;
	line-height: 1.4;
}

section#company .item_text p{
	font-size:1.4rem;
	color:var(--font_gray);
}


section#company .item_more{
	text-align: right;
	font-size:14px;
	padding:0 5px;
}

section#company .item_more .fa-solid{
	margin-left:5px;
}


/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (min-width: 431px) {
	#company_bana .item:hover{
		box-shadow: 0px 0px 15px -5px rgba(119,119,119,0.82);
	}
	
	section#company .item .item_photo img{
		transition: 0.3s;
		opacity: 1;
	}
		
	section#company .item:hover .item_photo img{
		transform: scale(1.1);
		opacity: 0.5;
	}
}

@media screen and (max-width: 430px) {
	#company_bana{
		flex-direction: column;
	}
	
	#company_bana .item{
		flex:none;
		width:100%;
	}
}


/*--------------------------------


	仕事を知る


--------------------------------*/

section#work article{
	width:100%;
	display: flex;
	gap:50px;
	border-bottom:1px solid #ccc;
	padding-bottom:80px;
	margin-bottom:80px;
}

section#work article:last-child{
	margin-bottom:0;
}

section#work .photo{
	width:700px;
	line-height: 0;
}

section#work .photo img{
	width:100%;
	height: 100%;
	object-fit: cover;
	border-radius: 10px;
}

section#work .photo img#cooking{
	/*object-position: top;*/
}

section#work .info{
	flex:1;
}

section#work h3{
	font-size:3.0rem;
	margin-bottom:30px;
}

section#work .interview{
	margin-top:30px;
}

section#work h4{
	font-size:14px;
	margin-bottom:30px;
}

section#work .interview ul{
	display: inline-flex;
	gap:40px;
}

section#work .interview li{
	display: inline-block;
}

section#work .interview li a{
	width:100%;
	display: block;
	line-height: normal;
	color:var(--font_gray);
	text-align: center;
	font-size:14px;
}

section#work .interview .i_photo{
	width:180px;
	aspect-ratio: 1 / 1;
	border-radius: 50% / 50%;
	overflow: hidden;
	line-height: 0;
	margin:0 auto 10px auto;
}

section#work .interview .i_photo img{
	width:100%;
	height: 100%;
}

section#work .interview p.name{
	color:#000;
	font-size:20px;
}

section#work .interview p.name_en{
	color:var(--gray_text);
	font-family: "sofia-pro", sans-serif;
  font-weight: 700;
}
section#work .interview .year{
	display: inline-block;
}

section#work .interview .year::before{
	content:"｜";
}

section#work .interview p.more{
	width:100%;
	margin-top:10px;
	border:1px solid #ccc;
	padding:5px 10px;
	font-size:14px;
	color:#000;
	text-align: center;
	border-radius: 10px;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (min-width: 431px) {
	section#work .interview li .i_photo img{
		transition: transform 0.3s;
	}
	
	section#work .interview li a:hover .i_photo img{
		transform: scale(1.1);
		opacity: 0.5;
	}
	
	section#work .interview li a p.more{
		transition: transform 1s;
	}
	
	section#work .interview li a:hover p.more{
		background-color: #01245D;
		color:#fff;
	}
		
}


@media screen and (max-width: 980px) {
	section#work article{
		flex-direction: column;
	}
	section#work h3{
		font-size:2.8rem;
		margin-bottom:0px;
	}
	section#work .photo{
		order:1;
		width:100%;
	}
	
	section#work .photo img{
		width:100%;
		height: auto;
		 aspect-ratio: 16 / 10;
	}
	
	section#work .info{
		order:2;
		flex:none;
		text-align: center;
	}
	
	section#work h3,
	section#work p.text{
		text-align: left;
	}
	
	section#work p.text{
		width:100%;
	}
	
	section#work .interview{
		display: inline-block;
	}
	
	section#work .interview ul{
		/*flex-direction: column;*/
	}
	
	section#work .interview .i_photo{
		width:140px;
	}
	
	section#work .interview li{
		line-height: 1.8;
	}
	
	section#work h3{
		font-size:2.4rem;
	}
}
@media screen and (max-width: 430px) {
	section#work .interview .year{
		display: block;
	}

	section#work .interview .year::before{
		content:none;
	}
}


/*--------------------------------


	要綱


--------------------------------*/

section#youkou{
	display: flex;
	gap:20px;
	margin-bottom:80px;
}

section#youkou article{
	flex:1;
}

section#youkou article a{
	height: 100%;
	border:1px solid #ccc;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	padding:25px 30px 15px 30px;
	gap:50px;
	border-radius: 5px;
}

section#youkou h2{
	width:100%;
	margin:0!important;
	margin-bottom:0;
}

section#youkou dl{
	padding:5px 0 15px 0;
	background-color: #EBF0F5;
	display: flex;
	flex-direction: column;
	/*justify-content: center;*/
	position: relative;
	z-index: 1;
	min-height: 100px;
	border-radius: 5px;
}

section#youkou dt{
	font-size:1.4rem;
	color:#575757;
	padding:0 10px;
}

section#youkou dd{
	flex:1;
	padding:0 20px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}


section#youkou p.more{
	text-align: right;
	width:100%;
}


section#youkou p.more .fa-solid{
	margin-left:10px;
}


section#youkou .no_oubo{
	flex:1;
	background-color: #EBF0F5;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	z-index: 1;
	border-radius: 5px;
}

section#youkou .no_oubo::before{
	content:"現在募集は停止しております。";
	color:rgba(227,27,30,1.00);
	font-size:18px;
	background-color: rgba(235,240,245,0.67);
	backdrop-filter: blur(5px);
	width:100%;
	height: 100%;
	position: absolute;
	top:0;
	left:0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
}

section#youkou .no_oubo dl{
	padding:15px 20px;
}

section#youkou .no_oubo dt{
	font-size:14px;
	color:var(--font_gray);
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (min-width: 981px) {
	section#youkou article a{
		transition: transform 0.3s;
	}
	
	section#youkou article a:hover{
		box-shadow: 0px 0px 15px -5px rgba(119,119,119,0.82);
	}
}

@media screen and (max-width: 430px) {
	section#youkou{
		flex-direction: column;
		margin-bottom:30px;
	}
	
	section#youkou article{
		flex:none;
	}
	
	section#youkou article a{
		gap:30px;
	}
	
	section#youkou .y_title h3{
		font-size:25px;
	}
}

/*--------------------------------


	応募フォーム


--------------------------------*/

section#oubo{
	padding-top:0;
	margin-top:30px;
	border:1px solid #ccc;
	padding:40px 25px;
	text-align: center;
	font-size:16px;
	border-radius: 5px;
} 

#content section#oubo h2{
	width:100%;
	margin:0;
	
}

section#oubo ul{
	display: inline-block;	
	text-align: left;
}

section#oubo li{
	paddin-left:1em;
	text-indent: -1em;
	font-size:1.25rem;
}

section#oubo a{
	display: block;
	width:200px;
	margin:30px auto;
	padding:20px 15px;
	background-color:#B72F2F;
	color:#fff;
	border-radius: 10px;
}

section#oubo a .fa-solid{
	margin-left:10px;
}



/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (min-width: 981px) {
	section#oubo a{
		transition: transform 0.3s;
	}
	
	section#oubo a:hover{
		background-color:#B72F2F;	
	}
}

@media screen and (max-width: 430px) {
	section#oubo{
		width:calc(100% - 40px);
		margin:30px auto 0 auto;
	}
}

/*--------------------------------




	応募要項




--------------------------------*/


#rec_youkou{
	width:min(95%,1000px);
	margin: 0 auto;
	padding-top:150px;
	font-size:16px;
	padding-bottom:80px;
}

#rec_youkou section{
	margin-top:0!important;
	padding-top:0!important;
}


#rec_youkou p{
	line-height: 0;
}

/*-------------------------------


	応募用メニュー


-------------------------------*/

#rec_youkou_menu{
	width:100%;
	/*border-top:1px solid #d53a33;
	border-bottom:1px solid #d53a33;*/
	border:1px solid #d53a33;
	display: flex;
	margin-bottom:50px;
}

#rec_youkou_menu li{
	flex:1;
	padding:20px 5px;
	text-align: center;
	cursor: pointer;
}

#rec_youkou_menu li:nth-child(n+2){
	border-left:1px solid #d53a33;
}

#rec_youkou_menu li.act{
	/*color:#d53a33;*/
	background-color: #d53a33;
	color:#fff;
	pointer-events: none;
	cursor: text;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (min-width: 981px) {
	#rec_youkou_menu li{
		transform: 0.3s;
	}
	
	#rec_youkou_menu li:hover{
		color:#d53a33;
	}
}
/*-------------------------------


	メイン


-------------------------------*/

#rec_youkou section h2{
	width:100%;
	color:#d53a33;
	font-size:2rem;
	border-bottom:1px solid #d53a33;
	margin-bottom:30px;
}


#rec_youkou section table{
	width:100%;
	border-top:1px solid #ccc;
}

#rec_youkou section th,
#rec_youkou section td{
	padding:20px 0;
	border-bottom:1px solid #ccc;
	line-height: 1.8;
	font-size:16px;
}

#rec_youkou section th{
	width:180px;
	vertical-align: top;
	text-align: left;
}

#rec_youkou section td li{
	padding-left:1em;
	text-indent: -1em;
}

#rec_youkou section:not(.act){
	display: none;
}

/*--------------------------------

	レスポンシブ

--------------------------------*/

@media screen and (max-width: 430px) {
	#rec_youkou section th,
	#rec_youkou section td{
		display: block;
		width:100%;
		line-height: 1.6;
		padding:0;
	}
	
	#rec_youkou section th{
		padding:20px 0 10px 0!important;
		border-bottom:none;
	}
	
	#rec_youkou section td{
		padding:0 0 20px 1em!important;
	}
}
/*-------------------------------


	ボタン


-------------------------------*/

#form_bottan{
	display: block;
	width:200px;
	padding:15px 15px;
	background-color:#B72F2F;
	color:#fff;
	border-radius: 10px;
	margin-top:30px;
	text-align: center;
}

#form_bottan .fa-solid{
	margin-left:10px;
}

#form_bottan.stop{
	pointer-events: none;
	text-decoration:none;
	cursor: text;
	opacity: 0.5;
}

@media screen and (min-width: 431px) {
	#form_bottan{
		transition: transform 0.3s;
	}
	
	#form_bottan:hover{
		background-color:#D76565;
	}
}

