@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

html {
}

body {
	margin: 0;
	/*font-family: "Zen Old Mincho", serif;*/
	font-family:"Noto Serif JP", serif;
	font-size:16px;
	font-weight: 400;
	line-height: 1.7;
	letter-spacing:1px;
	color: #222;
	text-align: left;
	background-color: #fff; }


	@media screen and (min-width:841px){ 
		.sponly-br{display:none; }
		}

@media screen and (max-width:840px){ 
	body {font-size:16px; }
	.pconly-br{display:none ;}
	}

p{margin:0;}

a{text-decoration:none;}


/* - - - - - - - - - - - - - - - - - - - - - - - - -
	sectionタイトル(金・白・金)
 - - - - - - - - - - - - - - - - - - - - - - - - - */
.section-title-WH {/* 英字 */
	position: relative;
	padding: 0 1.5em ;
	text-align: center;
	font-family: "Cinzel", serif;
	letter-spacing:3px;
	font-size: 2.5em;
	font-weight:400;
	color:#c89c3c;
	margin-bottom:1.5em;
	margin-top:0;
	
	}

.section-title-WH span { /* 日本語 */
	display: block;
	font-family: "Zen Old Mincho", serif;
	font-size: 0.5em;
	font-weight:400;
	letter-spacing:2px;
	color:#fff;
	line-height:1.2;
	}

.section-title-WH:before {
  position: absolute;
  bottom: -30px;
  left: calc(50% - 30px);
  width: 60px;
  height: 5px;
  content: '';
  border-radius: 3px;
  background: #c89c3c;
}




/* - - - - - - - - - - - - - - - - - - - - - - - - -
	sectionタイトル(金・黒・金)
 - - - - - - - - - - - - - - - - - - - - - - - - - */
.section-title-BK {/* 英字 */
	position: relative;
	padding: 0 1.5em ;
	text-align: center;
	font-family: "Cinzel", serif;
	letter-spacing:3px;
	font-size: 2.5em;
	font-weight:400;
	color:#c89c3c;
	margin-bottom:2em;
	margin-top:0;
	}

.section-title-BK span { /* 日本語 */
	display: block;
	font-family: "Zen Old Mincho", serif;
	font-size: 0.5em;
	font-weight:400;
	letter-spacing:2px;
	color:#222;
	line-height:1.2;
	}

.section-title-BK:before {
  position: absolute;
  bottom: -30px;
  left: calc(50% - 30px);
  width: 60px;
  height: 5px;
  content: '';
  border-radius: 3px;
  background: #c89c3c;
}


/* - - - - - - - - - - - - - - - - - - - - 
	ファーストビュー　画像フルスクリーン
 - - - - - - - - - - - - - - - - - - - - */
.scroll-area {
  width: 100%;
  height: 100vh;

  overflow: auto;
  -webkit-scroll-behavior: smooth;
  scroll-behavior: smooth;
  -webkit-scroll-snap-type: mandatory;
  scroll-snap-type: mandatory;
  -webkit-scroll-snap-points-y: repeat(100%);
  scroll-snap-points-y: repeat(100%);
}
.full-box {
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center; /* 縦方向中央揃え */
  justify-content: center; /* 横方向中央揃え */
  flex-direction: column;
  text-align:center;

  
}

.full-bg {
	/*position: relative;
	z-index: 10;
	clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
	background-color: transparent; */
	background-image: url(../img/main01-pc.webp); 
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment:fixed;
	} 

/* .full-box:before{ 黒スクリーン
	/*background-color: rgba(0,0,0,0.6);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	content: ' ';
	}*/


/*.full-box:before{
	content: '';
	z-index: -1;
	inset: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	background: url("../img/main01-pc.webp") center/cover no-repeat;
	background-attachment: fixed;
	}*/


/* ロゴ */
.full-bg img  {
	padding-top:50px;
	width:90%;
	max-width:500px;
	z-index:2;
	}

/* おばんざいのお店 */
.full-bg h2{
	color: #fff;
	font-size: 1.7em ;
	letter-spacing:3px;
	font-weight:300;
	z-index:2;
	}

/* お店の名前 */
.full-bg h1{
margin-top:0px;
margin-bottom:20px;
	font-size: 1.4em ;
	letter-spacing:3px;
	font-weight:400;
	z-index:2;
	border:solid 1px #fff;
	color: #fff;
	padding:10px 30px;
	}

/* 英語 */
.full-bg p{ 
	font-size:1.25em;
	line-height:1.8;
	color: #c89c3c;
	z-index:1;
	width:90%;
	font-family: "Zen Old Mincho", serif;
	}

@media screen and (max-width:840px){ 
.full-bg {	 background-image: url(../img/main01-sp.webp); background-attachment: scroll; }

/*.full-box:before{	background: url("../img/main01-sp.webp") center/cover no-repeat;	}*/

	.full-bg img  { width:80%; }
	.full-bg h2{ font-size:1.4em; }
	.full-bg h1{margin-top:10px; font-size:1.3em; }
	.full-bg p{  font-size:0.95em; }
	}



/* - - - - - - - - - - - - - - - - - - - - 
	About
 - - - - - - - - - - - - - - - - - - - - */

 #about {
		width:100% ; 
		background-image:url("../img/bg-white.webp") ;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center top;
		background-attachment:fixed;
/*position: relative;
z-index: 10;
clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
background-color: transparent;*/
	}
 
/*
#about:before{
	content: '';
	z-index: -1;
	inset: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	background: url("../img/bg-white.webp") center/cover no-repeat;
	background-attachment: fixed;
	} */



/* sectionの中のbox */
	.about_wrapper{ 
		max-width:calc( 1200px - 3em )  ; 
		padding:5em 1.75em 5em 1.75em ; 
		margin:0 auto ; 
		text-align:center;

		}

/* 2つ横並び */
.about-box2{
    display: flex;
	width:100% ; 
	max-width:1200px ; 
	margin:0 auto ; 
	}

.about-box2>div{
	width: calc( 50%  ) ; 
	text-align:left ; 
	}

	.about-box2>div:nth-child(1){text-align:center; }
	.about-box2>div:nth-child(2){text-align:center; margin-left:3em; }

.about-img{ width:100% ;  /*外観写真*/}
.about-img:nth-child(2){margin-top:1em; }

/*縦書き*/
	.about-tategaki{  
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	line-height:2.58;
	font-size:1.8em;
	font-weight:500;
	letter-spacing:3px;
	margin:0 auto;
	display: inline-block;
	text-align:left;
	margin-bottom:1em;
	}



/* 説明文 */
.about-text{
	text-align:left;

	line-height:2.3;
	}

/* 英字 */.about-text-en { margin-top:1em ; font-family: "Zen Old Mincho", serif; 	text-align:left; 	margin-bottom:2em;}


@media screen and (max-width:840px) {  
#about {background-attachment: scroll;		background-position: right top;}
	.about_wrapper{	width:calc(100% - 3.5em ) ; padding:4em 1.75em 4em 1.75em ; }
		.about-box2{flex-wrap: wrap; }   
		.about-box2>div{  width:100% ;   } 
	.about-box2>div:nth-child(2){margin-left:0; }
	
	/*spは縦書きを横書きに*/.about-tategaki{writing-mode: horizontal-tb; font-size:1.3em;text-align:center; line-height:1.8;}
	/* spは2枚目画像非表示に */
	.about-img-2{ display:none; }
	
	}


/* - - - - - - - - - - - - - - - - - - - - 
	コンセプト
 - - - - - - - - - - - - - - - - - - - - */
#concept{
	width:calc( 100% - 3em );
	padding:4em 1.5em ;
	background-image:url("../img/bg-blue01.webp") ;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	}



/* 3つ横並び */

.food-box3{
    display: flex;
	width:100% ; 
	max-width:1200px ; 
	margin:0 auto ; 
}
.food-box3>div{
	width: calc(50% - 23px) ; /* 33.3% - 23px */
    padding: 15px;
	margin:10px ; 
	text-align:left ; 
	}


	.food-box3>div div{  width:100% ;  text-align:center; margin-bottom:20px ;  }
	.food-box3>div div img{ width:100% ;max-width:500px ;  margin:0 auto ; border-radius:25px;  }

	.food-box3>div h3{ color:#c89c3c; font-size:1.25em; text-align: center; letter-spacing:3px; font-weight:500; }

	.food-box3>div p { line-height:2 ; color:#fff; letter-spacing:3px; font-weight:400; }

@media screen and (max-width:1000px){ 	
	#concept{ padding:3em 1.5em ; }
		.food-box3{flex-wrap: wrap; }   
		.food-box3>div{  width:calc( 50% - 40px  ) ;   margin: 0 0 20px 0  ; padding:15px 20px; } 
}

 @media screen and (max-width:640px){ 	
		.food-box3{flex-wrap: wrap; }   
		.food-box3>div{  width:86% ;  margin:0 auto ; padding:15px 10px; } 
		.food-box3>div:nth-child(2){margin-top:1em;}
} 


/* - - - - - - - - - - - - - - - - - - - - 
	フロア
 - - - - - - - - - - - - - - - - - - - - */

 #floor {
		width:100% ; 
		background-image:url("../img/bg-brown.webp") ;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center top;
		background-attachment:fixed;
	/*position: relative;
	z-index: 10;
	clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
	background-color: transparent;*/
	}



/*#floor:before{
	content: '';
	z-index: -1;
	inset: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	background: url("../img/bg-brown.webp") center/cover no-repeat;
	background-attachment: fixed;
	}*/

.floor-text-white{ color:#fff; margin-top:100px;  }



@media screen and (max-width:840px) { 
  #floor {background-attachment: scroll;}
.floor-text-white .about-tategaki { margin-top:20px; }

}

/* - - - - - - - - - - - - - - - - - - - - - - - - -
	アクセス
 - - - - - - - - - - - - - - - - - - - - - - - - - */
 #access{
	width:calc( 100% - 3em );
	padding:4em 1.5em ;
	background-color:#fff;
	}
	

/* 2つ横並び */
.access-box2{
    display: flex;
	width:100% ; 
	max-width:1200px ; 
	margin:0 auto ; 
	}

.access-box2>div{
	width: calc( 50%  ) ; 
	text-align:left ; 
	}

	.access-box2>div:nth-child(2){margin-left:4em; }

.access-box2 p { line-height:2.25; }

 .access-smallbtn { display:inline-block; margin-left:10px ; color: #c89c3c; font-size:0.8em; border:solid #c89c3c 1px ; padding:0 8px; }

	.access-box2 p a i, .open-hours a i { margin-right:5px;  }

/* 営業時間横並び */
.open-hours dt{	  float: left; color: #c89c3c; font-weight:600;}

.open-hours dd{
	margin-left: 100px;
	margin-bottom:10px;
}

.tenpo-gaikan{ width:100% ;  /*外観写真*/}




@media screen and (max-width:840px) {   
	#access{ padding:3em 1.5em ; }
		.access-box2{flex-wrap: wrap; }   
		.access-box2>div{  width:100% ;   } 
	.access-box2>div:nth-child(2){margin-left:0; }
	}


/* インスタこちら */
.btn_arrow {
    display: table;
    position: relative;
    padding: 1em 2.5em;
    min-width: 15em;
    border: 2px solid currentColor;
    color: #fff;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
    transition: 0.25s;
	margin-left:0 ; 
	    background-color: #222;
	margin:1em 0 1.5em 0  ;
}
.btn_arrow::after {
    position: absolute;
    top: 50%;
    right: 1em;
    width: 0.5em;
    height: 0.5em;
    transform: translateY(-50%) rotate(45deg);
    border-right: 2px solid currentColor;
    border-top: 2px solid currentColor;
    content: "";
}
.btn_arrow:hover {
    background-color: #c89c3c;
    color: #fff;
}

/* Google Map */
.map {
	position: relative;
	width: 100%;

	height:500px;
	margin:0 auto ; 

	}

.map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}

@media screen and (max-width:840px) {   
	.map { height:400px; }
	}

/* - - - - - - - - - - - - - - - - - - - - - - - - -
	フッター
 - - - - - - - - - - - - - - - - - - - - - - - - - */
#footer{ 
	width:100%  ; 
	background-color:#c89c3c;
	padding: 1em 0 ; 
	color:#fff;
	font-family: "Zen Old Mincho", serif;
	text-align:center;
	margin:0 ;
	font-size:13px;
	}
	
