@charset "utf-8";
/* CSS Document */

body{
	font-family:serif;
}


#logo_samata_iphone{
	display: none;
}





nav#drower{
	display: none;
}
#hamburger{
	display: none;
}
#trigger{
	display: none;
}






nav{
	color: white;
	font-size: 20px;
	width: 100vw;
	background-color: rgba(255,255,255,0.5);
	position: absolute;
	overflow: hidden;
	margin: 0 auto;
}

nav ul li a{
		text-decoration: none;
		color: white;
	}

#nav_PC{
	display: flex;
	
	flex-wrap: wrap;
	justify-content: space-between;
}

.logo_samata img{
	height: 40px;
	padding: 10px 0px 10px 10px;
	width:auto;
}


#nav_PC ul{
	padding-top: 10px;
	padding-right: 20px;
	display: flex;
}

.nav_top_moji{
	padding: 10px 20px 0px 0px;
}

.logo_instagram img{
	height: 30px;
	width:auto;
	padding: 5px 20px 0px 0px;
}

#yoyaku_button{
	color: white;
	font-size: 20px;
	font-weight:700;
	text-decoration: underline 1px white;
	background-color: #7B2424;
	padding: 10px;
	border: solid 1px white;
	position: fixed;
	right: 30px;
	bottom: 30px;
	z-index: 100;
}


/*↓↓↓↓↓↓↓↓↓↓スライド↓↓↓↓↓↓↓↓↓↓*/

  @keyframes slidy {
  0% { left: 0%; }
  20% { left: 0%; }
  30% { left: -100%; }
  50% { left: -100%; }
  60% { left: -200%; }
  75% { left: -200%; }
  90% { left: -300%; }
  95% { left: -300%; }
  100% { left: -400%; }
  }

  body { margin: 0; } 
  div#slider { 
  overflow: hidden; 
  }
  div#slider figure img {
  object-fit: cover;
  height: 100%;
  width: 100%; 
  }/*レスポンシブのために横幅・高さ変更？*/

  .slider_2{
  width: 100vw;
  height: 100vh;
  background-color: black;
  float: left;
  }

  div#slider figure { 
    position: relative;
    width: 600%;/*レスポンシブのために横幅・高さ変更？*/
    margin: 0;
    left: 0;
    text-align: left;
    font-size: 0;
    animation: 15s slidy infinite; 
      z-index: -100;
  }

/*↑↑↑↑↑↑↑↑↑↑スライド↑↑↑↑↑↑↑↑↑↑*/











#RESERVE{
	background:linear-gradient(#7B2424,#2E2E2E);
	color: white;
	font-size: 25px;
}

#RESERVE h1{
	padding: 75px 0px 30px 0px;
	margin:0 auto;
	text-align: center;
}

#RESERVE h2{
	padding-bottom:100px;
	margin:0 auto;
	text-align: center;
	text-decoration: underline 1px;
}


#RESERVE a{
	text-decoration: none;
	color: white;
}
















.section_top{
	font-size: 30px;
	display: flex;
}


.underline{
	width: 150px;
	border-bottom: solid 1px white;
}




section{
		overflow: hidden;
	}







#NEWS{
	padding-top: 10vh;
	background-color: #2E2E2E;
	color: white;
}

#NEWS_wrap{
	width: 70%;
	margin: 0 auto;
}

#NEWS h3{
	font-size: 23px;
	padding-bottom: 10vh
}


#snapwidget{
	display: flex;
}


#snapwidget iframe{
	margin-top: 60px;
	margin-right: 20px;
}

#NEWS_wrap h3{
	text-decoration: underline 1px;
}

#NEWS a{
	text-decoration: none;
	color: white;
}











#CONSEPT{
	background-image: url("../images/naikan.jpg");
	background-size: cover;
	background-position: left 17% bottom 50%;
	height: 110vh;
}

#CONSEPT div{
	display: flex;
	font-size: 30px;
	position: absolute;
	left: 42vw;
	padding-top: 24vh;
	z-index: 100;
}

#CONSEPT .underline{
	border-bottom: solid 1px #ffffff;
	border-image: linear-gradient(to right, #ffffff 0%, #000000 100%);
	border-image-slice: 1;
}

#CONSEPT h2{
	color: white;
}

#CONSEPT p{
	width: 430px;
	height: 600px;
	margin-top: 20vh;
	padding: 100px 30px 0px 30px;
	position: absolute;
	left: 50vw;
	background:rgba(255,255,255,0.76);
	font-size: 23px;
	line-height: 60px;
}






















#MENU{
	background-color: #FFFDE5;
}


.menu_gazou img{
	width: 500px;
}

#MENU .underline{
	border-bottom: solid 1px black;
}

#MENU .section_top{
	width: 70%;
	margin: 0 auto;
	padding-top: 30vh;
}


#menu_wrap{
	width: 70%;
	margin: 0 auto;
}



/*↓↓↓ランチ非表示↓↓↓*/
#MENU #LUNCH{
	display: none;
}
/*↑↑↑ランチ非表示↑↑↑*/



#MENU article h1{
	width: 170px;
	margin: 0 auto;
	padding: 10vh 0vh 0vh 0vh;
	font-size: 30px;
	text-align: center;
	border-bottom: solid 1px black;
}


.menu_gazoukomi{
	display: flex;
	flex-wrap: wrap;
	padding-top: 50px;
	margin: 0 auto;
}


.menu_gazou{
	width: 500px;
	padding-bottom: 20px;
}


#MENU .menu_naiyou{
	padding: 0px 0px 0px 20px;
	width: 300px;
}

#MENU .menu_naiyou h2{
	font-size: 20px;
	line-height: 1.5em;
}
#MENU .menu_naiyou p{
	width: 300px;
	font-size: 16px;
	line-height: 1.5em;
	padding-top: 0.5em;
}



#LUNCH{
	width: 70%;
	margin: 0 auto;
}



#DINER{
	width: 70%;
	margin: 0 auto;
}





#andmore{
	padding: 10vh 0px;
	margin: 0 auto;
	text-align: center;
	font-size: 20px;
}
























#MAP{
	background-color: #7B2424;
}



section#MAP adress{
	display: flex;
	flex-wrap: wrap;
	width: 70%;
	margin: 0 auto;
	padding-top: 15vh;
	padding-bottom: 10vh;
}

adress #child{
	margin: 0 auto;
}

#MAP div{
	color:white;
}


#MAP article{
	padding-right: 30px;
}

section#MAP #map_naiyou{
	padding-left: 30px;
}
#MAP article h1{
	font-size: 30px;
	padding-top: 30px;
}

#MAP h2{
	font-size: 20px;
	padding-top: 10px;
}

#MAP h3{
	font-size: 35px;
	padding: 10px 0px;
}

#MAP p{
	font-size: 16px;
	line-height: 1.5em;
	width: 370px;
}






	
	

	
adress .section_top{
	padding: 30px 0px;
}
	


adress iframe{
	width: 500px;
	padding: 50px 0px 0px 0px;
}
	




section#MAP small{
	color: white;
}




















	
	


	
	




































/*
ここまでPC
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
ここからタブレット横(landscape)
*/


/*============================================
想起端末　ipad pro 12.9のlandscape(ノートパソコンサイズ)横幅1366以下
============================================*/
@media screen and (max-width:1366px){

	
}/*ipad12.9のlandscape 横幅1366以下ここまで*/


/*============================================
想起端末　ipad9.7のlandscape 横幅1024以下
============================================*/
@media screen and (max-width:1024px) and (orientation:landscape){


}/*ipad9.7のlandscape 横幅1024以下ここまで*/



/*
ここまでタブレット横(landscape)
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
ここからタブレット縦(portrait)
*/



/*============================================
想起端末　ipad　pro 12.9のportrait　横幅1024以下
と
ipad9.7のlandscape 横幅1024以下
============================================*/

@media screen and (max-width:1024px){	
	
	
	#logo_samata_iphone{
		display: inline;
		position: fixed;
		top: 0;
		left: 0;
	}
	
	#logo_samata_iphone img{
		width: 120px;
		padding: 20px;
	}

	#nav_PC{
		display: none;
	}
	
	
	
nav#drower{
	width: 100vw;
	position: fixed;
	top:0px;
	right: auto;
	left: 0px;
	bottom:375px;
	height: 0vh;
	
	overflow: auto;
	transition-duration: 1000ms;
	background-image: linear-gradient(rgba(225,225,225,0.5));
	
	display: flex;
	z-index: 1000;
	color: white;
}
	
	
	
	nav#drower{
	display: block;
}
#hamburger{
	display: block;
}
#trigger{
	display: block;
	}

	
	
	
	
	
	
	
	#drower ul{
		padding-top: 60px;
		padding-left: 0px;
		list-style-type: none;
		width: 100vw;
	}
	
	#drower ul li{
		font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
		font-size: 21px;
		line-height: 50px;
		border-bottom: solid 1px white;
		width: 100vw;
	}
	
	#drower ul li a{
		padding-left: 20px;
		text-decoration: none;
		color: white;
	}
	
	#drower a img{
		width: 50px;
	}


input#trigger:checked ~ nav#drower {
	height: 700px;
}
	
	#SNS{
		padding-top: 30px;
		padding-right: 20px;
		text-align: end;
	}

	
	#trigger{
		z-index: 2000;
		position: fixed;
		display: none;
	}
	
	
	
	
	
	
	label#hamburger{
		z-index: 2000;
		position: fixed;
	}
	
	
	
label#hamburger span::before{
content:"";
width: 50px;
height: 5px;
background-color: #fff;
position: fixed;
top: 40px;
right: 20px;
bottom: auto;
left: auto;
transition-duration: 500ms;
}

label#hamburger span::after{
content:"";
width: 50px;
height: 5px;
background-color: #fff;
position: fixed;
top: 30px;
right: 20px;
bottom: auto;
left: auto;
transition-duration: 500ms;
}

input#trigger:checked + label#hamburger span::before{
top: 50px;
right: 20px;
transform: rotate(25deg);
background-color: #fff;
}

input#trigger:checked + label#hamburger span::after{
top: 50px;
right: 20px;
transform: rotate(-25deg);
background-color: #fff;
}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	


}/*ipad　pro 12.9のportrait　横幅1024以下ここまで*/



/*============================================
想起端末　ipad9.7のportrait　横幅768以下かつ高さ1024以下
============================================*/


@media screen and (max-width:768px) and (max-height:1024px){

	
}/*ipad9.7のportrait　横幅768以下かつ高さ429以下ここまで*/


/*
ここまでタブレット縦(portrait)
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
ここからスマホ横(landscape)
*/


/*============================================
想起端末　iphone12のlandscape　横幅844以下
============================================*/
@media screen and (max-width:844px){

	
	#RESERVE h2{
		font-size: 20px;
	}
	
	
	
	#snapwidget {
	flex-wrap: wrap;
	width: 70vw;
	}
	
	
html #NEWS #snapwidget iframe.snapwidget-widget{
	padding: 0px;
	height: 300px;
	}
	
	
	#NEWS h3{
		font-size: 20px;
	}
	
	
	
	
	
	
	
	
	#CONSEPT div{
		padding-top: 10vh;
		left: 10vw;
		color: white;
	}
	
	#CONSEPT .underline{
		border-image: none;
	}
	
	#CONSEPT p{
		left: 2vh;
		margin: 20vh auto;
		padding-top: 10vh;
		width: 75vw;
		height: 50vh;
		font-size: 16px;
		line-height: 3em;
	}
	
	
	
	
	
	
	
	.menu_gazou{
		width: 300px;

	}
	
	.menu_gazou img{
		width: 300px;
	}
	
	#MENU .menu_naiyou{
		padding: 20px 0px;
	}
	
	#MENU #DINER,#LUNCH{
	width: 100%;
	}
	
	
	
	
	
	section#MAP adress{
	width: 100%;
		padding-left: 10px;
}
	
	
	
		adress iframe{
	padding: 30px 30px 30px 0px;
		margin: 0 auto;
		width: 300px;
		height: 300px;
	}
	
	
	
	section#MAP #map_naiyou{
		padding-left: 0px;
	}
	
	
	
	

	
	
}/*iphone12のlandscape　横幅844以下 ここまで*/




/*============================================
想起端末　iphoneX,11proのlandscape　横幅812以下
============================================*/
@media screen and (max-width:812px){

	
}/*iphoneX,11proのlandscape　横幅812以下 ここまで*/

/*
ここまでスマホ横(landscape)
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
ここからスマホ縦（portrait）
*/

/*============================================
想起端末　iphone12proMaxのportrait　横幅428以下
============================================*/
@media screen and (max-width:428px){

}/*iphone12promaxのportrait　横幅428以下 ここまで*/


/*============================================
想起端末　一般的なAndroidのportrait　横幅360以下
============================================*/

@media screen and (max-width:360px){

	

	
}

/*一般的なAndroidのportrait　横幅360以下　ここまで*/