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

#rec{
	width:min(95%,1200px);
	margin:0 auto 80px auto;
}

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

#rec section:not(#news) .s_title{
	line-height: 1.4;
}

#rec section:not(#news) .s_title h3{
	font-size:22px;
}

#rec section:not(#news) .s_title span{
	font-size:14px;
	color:#5F5F5F;
}

#rec section p,
#rec section,
#rec div,
#rec dt,
#rec dd{
	font-size:16px;
}

@media screen and (max-width: 430px) {
	.distap{
		display: none;
	}
}

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


	リクルート用メニュー


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

#rec_menu{
	width:100%;
	padding-top: 10px;
	display: flex;
	justify-content: flex-end;
}

#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.5);
	backdrop-filter: blur(5px);
}

#rec_menu li:not(.rec) a:hover{
	color:#0f3670
}

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

#rec_menu li.rec a:hover{
	background-color:rgba(183,47,47,0.81);
}


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

	レスポンシブ

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

@media screen and (max-width: 430px) {
	#rec_menu{
		width:100%;
		background-color: #fff;
		display: block;
	}
	
	#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;
	}
}

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


	メインフォト


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

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

#mainvew img{
	width:100%;
	height: auto;
	aspect-ratio: 10 / 4;
	object-fit: cover;
}

#mainvew h2{
	position: absolute;
	bottom:50px;
	left:50px;
	font-size:40px;
	color:#fff;
	line-height: normal;
}

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

	レスポンシブ

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

@media screen and (max-width: 430px) {
	#mainvew img{
		aspect-ratio: 5 / 4;
	}
	
	#mainvew h2{
		bottom:10px;
		left:10px;
		font-size:28px;
	}
}



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


	コメント


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

section#coment{
	padding:100px 20px 100px 20px;
	font-size:20px;
}

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

	レスポンシブ

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

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

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


	お知らせ


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

section#news{
	width:100%;
}

#news_main{
	width:100%;
	border:1px solid #ccc;
	border-radius: 100px;
	padding:5px 15px 5px 30px;
}

section#news h3{
	font-size:12px;
	color:#5F5F5F;
}

section#news ul{
	padding:10px 10px 10px 20px;
	font-size:18px;
}

#news_list,
section#news a.more{
	font-size:12px;
	margin-top:8px;
}


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


	会社を知る


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

section#company .s_title{
	margin-bottom:30px;
}
#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;
}

section#company .item_photo{
	width:100%;
	overflow: hidden;
	line-height: 0;
}

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

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

section#company .item_text p{
	font-size:14px;
	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: transform 0.3s;
	}
	
	section#company .item:hover .item_photo img{
		transform: scale(1.1);
	}
}

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


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


	仕事を知る


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

section#work .s_title{
	margin-bottom:80px;
}

section#work .w_item{
	display: flex;
	gap:50px;
	border-bottom:1px solid #ccc;
	padding-bottom:80px;
	margin-bottom:80px;
}

section#work .w_item: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 .info h4{
	font-size:30px;
	margin-bottom:30px;
}

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

section#work h5{
	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.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);
	}
	
	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 .w_item{
		flex-direction: column;
	}
	
	section#work .photo{
		order:2;
		width:100%;
	}
	
	section#work .photo img{
		width:100%;
		height: auto;
	}
	
	section#work .info{
		order:1;
		flex:none;
		text-align: center;
	}
	
	section#work h4,
	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#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;
}

section#youkou .y_title{
	line-height: 1.4;
}

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

section#youkou .y_title h3{
	font-size:40px;
}

section#youkou .now{
	flex:1;
	background-color: #EBF0F5;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

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

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


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


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

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

	レスポンシブ

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

@media screen and (min-width: 431px) {
	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: 431px) {
	section#youkou{
		flex-direction: column;
	}
	
	section#youkou article{
		flex:none;
	}
	
	section#youkou article a{
		gap:30px;
	}
	
	section#youkou .y_title h3{
		font-size:25px;
	}
}

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


	応募フォーム


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

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

section#oubo h3{
	font-size:30px;
	margin-bottom:30px;
}

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

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

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;
}

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



	応募要項



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

#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 section p,
#rec_youkou section,
#rec_youkou div,
#rec_youkou dt,
#rec_youkou dd,
#rec_youkou li,
rec_youkou th,
rec_youkou td{
	font-size:16px;
}

#rec_youkou p{
	line-height: 0;
}
#rec_youkou_title{
	width:100%;
	line-height: 1.4;
	margin-bottom:50px;
}

#rec_youkou_title p{
	font-size:16px;
	color:var(--font_gray);
	line-height: 1.4;
}

#rec_youkou_title h2{
	font-size:30px;
}

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


	応募用メニュー


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

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

#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;
}

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


	メイン


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

#rec_youkou section h3{
	width:100%;
	color:#d53a33;
	font-size:16px;
	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;
}

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

