@charset "utf-8";




@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}


/*スライドSlickここから*/
.full a {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100vh;
  margin: 0;
}
.full a.img01 {
  background-image: url(https://125naroom.com/demo/img/simple01.jpg);
}
.full a.img02 {
  background-image: url(https://125naroom.com/demo/img/simple02.jpg);
}
.full a.img03 {
  background-image: url(https://125naroom.com/demo/img/simple03.jpg);
}
.full .slick-dots {
	bottom: 4%;
	z-index: +1;
}


/*理念スマホここから*/
.rinenBoxCovar{
	width: 100%;
	height: 500px;
	  margin: 40px 0 0 0;/*左右設定することでセンターに*/


 	 background: url(../img/top/gaikan_img_sp.jpg) center  top / cover no-repeat;
 /* background-attachment: fixed; */
 /*背景を固定してスクロールで止まるようにしている*/


/* IE11でバグがおこるのでこのぶぶんのflexやめた

		display: flex;


		display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -ms-flexbox;
  display: -o-flex;
*/
/*
  -webkit-flex-direction: row;



		  flex-direction: row;


			justify-content: center;
	align-items: flex-end;
*/





	}


.rinenBox{
			width: 100%;
		height: 500px;
			  margin: 0 auto;

		display: flex;

	display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -ms-flexbox;
  display: -o-flex;
  -webkit-flex-direction: column;


		flex-direction: column;

		justify-content: flex-end;

	}

	.rinenBoxIN{

					  /*確認用背景*/
			background:rgba(255,255,255,0.5);
			margin: 20px 20px 20px 20px;
			padding: 20px;

			flex-basis: 50%;

						display: flex;
				flex-direction: column;

	}

	p.rinenText{

	font-size: 14px;


	}



	span.rinenTitle{

		font-size: 30px;
			display: inline-block;
	width: 100%;
	text-align: center;
	color: #764a27;

	}


	p.rinenButtan{
margin-bottom: 0px;
	font-size: 14px;
flex-basis: 10%;
text-align: center;
	}


		p.rinenButtan img{
	max-height: 60px;
	}

.ryouriBL_PC{
	display: none;
}
/*理念スマホここまで*/


/*料理スマホここまで*/
.ryouriBox{
	padding: 30px;
}



.ryouriBoxIMGSP{
	display: block;
}
.ryouriText{

	text-align: justify;
  /* IE11対策　display: flexを指定している要素の子要素に min-height: 0%を指定すると画像の下の隙間がなくなりました。 */
    /* min-height: 0%; */
}

.ryouriTitle{
	display: inline-block;
	width: 100%;
	text-align: center;
font-size: 30px;
	color: #764927;
}


	p.ryouriButtan{
margin-bottom: 0px;
	font-size: 14px;
text-align: center;
	}

	p.ryouriButtan img{
width: 90%;
	}

.ryouri_IMG_PC{
	display: none;
}

.ryouri_MenuBox{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	margin-top: 20px;
}


	.ryouri_MenuBoxIN{

		margin-top: 10px;



}



/*料理スマホここまで*/

/*感染対策スマホここから*/
.kansen_taisakuBox,.blogBox {
	padding: 30px;
}

.kansen_taisaku_title,.blog_title{
	font-size: 28px;
	text-align: center;
}

.kansen_taisaku_text,.blog_text{
	text-align: left;
}

.kansen_taisaku_button,.blog_button{
	text-align: center;
}

p.kansen_taisaku_button img{
	max-height: 55px;
}

/*感染対策スマホここまで*/


/*LINEここから*/	
	.LineWrappar {
		margin: 0 30px 30px 30px;
	}
	
	.LineBox {
		display: grid;
		grid-template-columns: 1fr 1fr;/*横*/
		border: 1px solid #ccc;
		padding: 20px;
		gap: 0 30px;
	}


/*LINEここまで*/	


/*お知らせスマホここから*/
.oshiraseBigWrapper{
	margin-top: 30px;
	padding-top: 30px;


  	background-color:rgba(201,188,156,0.4);


}

.oshiraseBigBox{
		display: flex;
	flex-wrap: wrap;
	flex-direction: column;
}


.oshiraseTitle{
	font-size: 28px;
	text-align: center
}

.oshiraseBox{


	border: solid 1px #ccc;
	padding: 20px;

	background-color: #fff;

}





.oshiraseBigBL{
	margin: 0 30px;
}

.oshiraseBigBR{
	margin-top: 30px;
}


.oshiraseBox p{
	border-bottom: dotted 1px #ccc;
	text-align: left;
}




.banarBox{
	padding: 0px;
text-align: center;
margin: 30px 20px 0px;
padding-bottom: 20px;

}



.infoDay{
font-size: 13px;
}


/* ////////////////////////
タブレット以上
//////////////////////// */
@media (min-width:768px){



/*理念タブレット以上ここから*/
	.rinenBoxCovar{
		  /*確認用背景*/
  background-color:aliceblue;
  width: 100vw;/*要素の縦幅は画面の横幅と同じ幅になります。*/
  position: relative;
  left:50%;/*左右設定することでセンターに*/
  right:50%;/*左右設定することでセンターに*/
  margin: 0 -50vw 30px -50vw;/*左右設定することでセンターに*/

	height: auto;

	 background: url(../img/top/gaikan_img_pc.jpg) center  top / cover no-repeat;


    background-attachment: fixed;

	 }


		.rinenBox{


			  margin: 0 auto;
		height: auto;
		display: flex;
		  flex-direction: row;
	justify-content: flex-end;
		align-items: stretch;
				min-height: 300px;


	}

	.rinenBoxIN{

					  /*確認用背景*/
			background:rgba(255,255,255,0.5);
			margin: 20px 0px 20px 0px;
			padding: 20px;

			flex-basis: 40%;


						display: flex;
				flex-direction: column;
			justify-content: flex-end;



	height: 400px;


	}

	p.rinenText{

			-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	font-size: 14px;


	}



	span.rinenTitle{
		font-size: 23px;
		width: 15%;

			padding-right:5px;
	}


	p.rinenButtan{
margin-bottom: 0px;
	font-size: 14px;
flex-basis: 10%;
text-align: center;
	}


		p.rinenButtan img{
		max-height: 60px;
	}



/*理念タブレット以上ここまで*/


/*料理タブレット以上ここから*/

	.ryouriBox{
	padding: 0px;
		display: flex;
		  justify-content: space-between;

}

		.ryouriBL_PC{
	display: block;
	flex-basis: 42%;
			margin-right: 10px;
}



		.ryouriBR_PC{
		display: flex;
		flex-direction: column;
		flex-basis: 50%;
	}


			p.ryouriButtan {
		margin-bottom: 0px;
		text-align: left;

    /* IE11対策　display: flexを指定している要素の子要素に min-height: 0%を指定すると画像の下の隙間がなくなりました。 */
  /* min-height: 0%; */
}

		p.ryouriButtan img{
width: 55%;
	}





.ryouriTitle{
	display: inline-block;
	font-size: 23px;
	width: 15%;
	text-align: center;
}


	.ryouriBoxIMGSP{
	display: none;
}

		p.ryouriText{

			-ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
	font-size: 14px;

	height: 250px;
	padding-right: 50px;
	line-height: 1.8em;
	}

.ryouri_IMG_PC{
	display: block;
	margin-top: 20px;
}


	.ryouri_MenuBox{
	flex-direction: row;
				margin-left: -20px;

}

	.ryouri_MenuBoxIN{
/*確認用背景*/
background-color: whitesmoke;
width: calc( (100% / 3) - 20px );/*3分割*/
		margin-top: 0px;
		margin-left: 19px;/*これをいれて隙間をつくってる*/

}
	/*料理タブレット以上ここまで*/



/*感染対策タブレット以上ここから*/
	.kansen_taisaku_BlogWrappar{
		display: flex;
  flex-direction: row;
		margin-top: 30px;
		margin-left: -24px;

	}

	.kansen_taisaku_BlogBox{
width: calc( (100% / 2) - 24px );/*2分割して　下でつくった隙間分幅を小さく*/
margin-left: 24px;/*これをいれて隙間をつくってる*/
		margin-bottom: 30px;
	}

	.blogBox {
		border-left :solid 1px #ccc;
	}

	p.kansen_taisaku_button img{
	max-height: 55px;
}


/*感染対策タブレット以上ここまで*/

/*LINEここから*/	
	.LineWrappar {
			display: grid;
		grid-template-columns: 1fr 5fr 1fr;/*横*/
		margin: 0 0 30px 0;
	}
	
	.LineBox {
		display: grid;
		grid-template-columns: 1fr 3fr;/*横*/
		border: 1px solid #ccc;
		padding: 20px;
		gap: 0 30px;
		
		grid-column: 2;
	}


/*LINEここまで*/	

/*お知らせ以上ここから*/
	.oshiraseBigWrapper{
	margin-top: 30px;
	padding-top: 30px;
		padding-bottom: 50px;

  width: 100vw;/*要素の縦幅は画面の横幅と同じ幅になります。*/
  position: relative;
  left:50%;/*左右設定することでセンターに*/
  right:50%;/*左右設定することでセンターに*/
  margin: 0 -50vw 0px -50vw;/*左右設定することでセンターに*/

}



	.oshiraseBigBox{

		flex-direction: row;
		 justify-content: center;
justify-content: space-between;
		padding-bottom: 30px;
}


.oshiraseTitle{
	font-size: 28px;
	text-align: center
}


.oshiraseBigBL{
	flex-basis: 60%;
		margin: 0px;
}

.oshiraseBigBR{
	flex-basis: 38%;
	margin-top: 0px;
}






.banarBox{
	display: flex;
flex-direction: row;

	margin: 0px 0px 0px;
	justify-content: space-between;


}


	.banarBox p {
	flex-basis: 24%;

}




	/*お知らせ以上ここまで*/
}

/* ////////////////////////
パソコン以上
//////////////////////// */
@media screen and (min-width: 1200px) {


/*理念ここから*/

	.rinenBoxIN{
		flex-basis: 30%;
	}

/*料理ここから*/
	.ryouriBox{
	width: 85%;
	margin: auto;
}

	.kansen_taisaku_text,.blog_text {
		text-align: center;
	}


		p.ryouriText{

	height: 200px;
	padding-right: 50px;
	line-height: 1.8em;
	}




}


	



/*LINEここまで*/	

/* ////////////////////////
大画面パソコン以上
//////////////////////// */
@media screen and (min-width: 1400px) {

/*理念ここから*/

		.rinenBoxIN{
			flex-basis: 35%;

	}



	p.rinenText{
	font-size: 18px;
	}



	span.rinenTitle{
		font-size: 26px;
	}



	/*料理ここから*/
	.ryouriBox{
	width: 75%;
	margin: auto;
	}




	p.ryouriText{
	font-size: 18px;

			height: 300px;
	padding-right: 50px;
	line-height: 1.8em;



	}

	span.ryouriTitle{
		font-size: 26px;
	}


	/*px指定してない部分　全体のフォントサイズ変更*/
	main{
		font-size: 1.2rem;
	}

	/*LINEここから*/	
	.LineWrappar {
			display: grid;
		grid-template-columns: 1fr 3fr 1fr;/*横*/
	}

}
