@charset "utf-8";
/*--------------
  reset
--------------*/

html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, caption,tr, th, td,hr{
  margin: 0;
  padding: 0;
  border: 0;
  /* font-size: 100%; */
  vertical-align:baseline;
  box-sizing: border-box;
}
header, footer, aside,nav, section,main,figure,figcaption,picture{ 
  display:block;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
ol, ul {
  list-style: none;
  list-style-type: none;
}
table{
  border-collapse: collapse;
}

/*--------------
  root
--------------*/
:root{
  --min:"Zen Old Mincho", serif;
  --base-font:"Zen Kaku Gothic New", serif;
  --roboto:"Roboto", "Zen Kaku Gothic New", serif;
  --red:#B8232F;
  --brown:#60432B;
  --white:#fff;
}

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

  基本幅のレイアウト

------------------------------ */
html{
  scroll-behavior: smooth;
  font-size: 62.5%; /* 16px × 62.5% = 10px */
}
body {
  line-height: 1.5;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  color:var(--brown);
  background:#fff url(../img/common/washi.jpg);
  font-family: var(--base-font);
  font-weight: 500;
  font-size: 1.6rem; /* スマホでは16px */
}
a{
	text-decoration:none;
  transition: 0.4s ease-in-out;
  color:var(--red);
}
a:hover{
	text-decoration:underline;
  opacity:0.85;
}
img{
  max-width:100%;
  vertical-align:bottom;
  height: auto;
}
a:hover img{
  opacity:0.85;
}
address{
   font-style:normal;
 }
 p,ul,dl,table,figcaption{
  font-family: var(--go);
  line-height:1.6;
 }
h1{
  font-weight: 500;
}
 h2,h3{
  font-family: var(--min);
  text-align:center;
  font-weight: 700;
}
th,caption{
  font-weight: 500;
}
*{
  min-height:0vw;/*safari*/
}


/*
  header　基本幅
------------------------------*/
header {
  width:100%;
  background:#333;
}
header .header-bar{
  width:100%;
  text-align:center;
  background:#fff;
  padding-top:0.2em;
}
header h1,
header h1 span{
  font-size:13px;
  font-family: var(--go);
}
.tel-link::before{
  font: var(--fa-font-solid);
  content:"\f095";
  margin-right: .15em;
  font-size: .85em;
  display: inline-block;
}
header h1,
header .header-tel{
  margin:0.25em;
  color:#333;
}
header .header-tel{
  font-family: var(--roboto);
}
header .header-tel i{
  margin-right:0.25em;
}

header .logo{
  width:100%;
  background:#C53D47;
  color:#000;
  text-align:center;
  padding:0.75em 0;
}
header .logo img{
  width:min(75%,200px);
}
header a:hover{
  opacity:1;
}
header nav{
  font-family: var(--min);
  font-weight: 500;
}
header nav ul{
  overflow: hidden;
  margin-top:0.25em;
}
header nav ul:after{
  content:"";
  display:block;
  clear:both;
}
header nav li{
  width:20%;
  float:left;
  text-align:center;
  margin:10px 0;
}
header nav li.gnav-home{
  display:none;
}
header nav li.gnav-seat{
  width:15%;
}
header nav li.gnav-access{
  width:25%;
}
header nav li a{
  color:#fff;
  display:block;
}
/*header nav li a.gnav-active,*/
header nav li a:hover{
  text-decoration:none;
  color:#FFE4B5;
}

.p-home header nav li:nth-child(1) a,
.p-foodmenu header nav li:nth-child(2) a,
.p-drinkmenu header nav li:nth-child(3) a,
.p-party header nav li:nth-child(4) a,
.p-seat header nav li:nth-child(5) a,
.p-access header nav li:nth-child(6) a{
  text-decoration:none;
  color:#FFE4B5;
}

/*
  Home 基本幅
----------------------------------------------------*/

/* ホーム 各エリアpadding */
#about,
#home-menu,
#information{ 
  padding:2.5em 0;
}

/* ホーム main写真 */
#home-mainimg{
  width:100%;
  background:#333;
  text-align:center;
}

#home-mainimg img.mainimg-s{ 
  /*width:100%;
  max-width:780px;*/
  width:min(100%,780px);
}

.bg-washi{
  background:#ccc url(../img/common/washi.jpg);
}

/* カレンダー */
#calendar{
  margin:0 auto;
  padding:3rem 0;
  width: min(90%,1000px);
  text-align: center;
  font-family: var(--roboto);
}
#calendar h2{
  font-size:2rem;
  text-align: center;
}

#calendar .calendar-content{
  display: flex;
  justify-content:center;
  flex-direction: column;
  gap:1rem;
}


#calendar > section{
  margin:0 auto;
  align-items: center；
}
#calendar table{
  text-align: center;
  margin:.25em auto .5em;
  border:2px solid var(--brown);
  width: min(100%,42rem);

}
#calendar table caption{
  background: var(--brown);
  color:#fff;
  font-size:1.1em;
  letter-spacing: .05em;
  text-indent: .05em
}
#calendar table th,
#calendar table td{
  padding:.45em;
  line-height: 1;
}
#calendar table tr:first-child th{
  border-bottom:1px solid var(--brown);
}
#calendar table th:nth-child(1){
  color:var(--red) 
}
#calendar table th:nth-child(7){
  color:#2a4d9b;
}
#calendar table .close{
  background: var(--red) ;
  color:#fff;
  border:1px solid #fff;
  font-weight: 500
}
#calendar .close-text{
  color:var(--red);
  width: min(100%,48rem);
  display: inline-block;
  text-align: left;
}
#calendar .event{
  border-radius: 50%;
  background:#3CB346;
  background:rgba(46,135,52,.25);
  margin:1px
}
#calendar .calendar-text {
  display: inline-block;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
}

#calendar .close-text02{
  margin:auto
}
.event-green{
  color:rgba(46,135,52,1);
}


/* ホーム　カードと餃子 */
.top-info{
  padding:6rem 0;

  background-image: linear-gradient(45deg, #333 25%, transparent 25%, transparent 75%, #333 75%),
  linear-gradient(45deg, #333 25%, transparent 25%, transparent 75%, #333 75%);
  background-position: 0 0, 4rem 4rem;
  background-size: 8rem 8rem;
  background-color: #3a3a3a;
}
.top-info-container{
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  gap:3rem;
  margin-left: auto;
  margin-right: auto;
  width: min(90%,1180px);
}
.top-info h2{
  position: relative;
  display: inline-block;
  margin:.75em auto 1.5em;
  font-size:2rem;
}
.top-info h2::before,
.top-info h2::after {
  content: '';
  position: absolute;
  bottom: -.45em;
  display: inline-block;
  width: 3.5em;
  height: 4px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: var(--red);
}

.top-info section{
  background: var(--white);
  padding:1.5rem;
  width: min(100%,48rem);
}
/* ホーム カード */
#card {
  margin-left: auto;
  margin-right: auto;
  flex:1;
}
#card .card-container{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:.5em;
}
#card .card-text{
  display: inline-block;
}
#card .card-text li{
  text-align: left;
}
#card .card-img {
  display: flex;
  gap:2.5%;
  text-align: center;
  align-items: center;
  justify-content: center;
}
#card .card-img figcaption {
  font-size: 0.9em;
}
#card .card-img .credit{
  width: 70%;
}
#card .card-img .pay{
  width: 29%;
}

/*冷凍餃子*/
#gyoza{
  margin-left: auto;
  margin-right: auto;
  flex:1;
  align-items: flex-start;
  border-radius: 3px;
}
#gyoza .gyoza-container{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap:1em;
}
#gyoza .gyoza-img {
  margin: auto;
  flex: 1;
  max-width: 160px;
}
#gyoza .gyoza-img a{
  display:inline-block;
  position: relative;
}

#gyoza .gyoza-img img{
  box-shadow: 0 0 3px #555;
}
#gyoza .gyoza-text {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap:.75em;
  flex:1;
}
#gyoza .henrei img{
  width: min(100%,22rem);
  margin: auto;
  display: block;
}


/* ホーム about */
#about{
  width:90%;
  max-width: 50rem;
  margin-left: auto;
  margin-right: auto;
}

#about h2{
  font-size:clamp(1.9rem,5vw,2.8rem);
  text-align:center;
  margin:1em auto 1.5em;
}
#about p{ 
  font-size:clamp(1.7rem,4.7vw,1.9rem);
  font-family: var(--min);
  font-weight: 600;
}
#about p + p{
  margin-top: 1em;
}

/* 元気祭 */
/* #genkisai{
  text-align: center;

  width:min(98%,1080px);
  margin:0 auto 2rem;
}
#genkisai h2{
  color:var(--red);
  font-size:1.8rem;
  font-family:var(--min);
  padding:1em 0 .25em;
 }
#genkisai .img-chirashi{

  width:min(100%,640px);
  margin:auto
} */



/* ホーム とかち年末大売出し */
#nenmatsu figure{
  max-width: 300px;
  margin: auto;
  font-size:.95em;
}


a.zoom{
  display: block;
  position: relative;
}
a.zoom::after {
  position: absolute;
  right: .25em;
  bottom:.25em;
  font: var(--fa-font-solid);
  content: "\f00e";
  color:#fff;
  font-size: 18px;
  display: inline-block;
  text-shadow: 0 0 .2em #000;
}

/* ホーム メニュー */
#home-menu{
  text-align:center;
  background:#EAC388 url(../img/common/bg-wood.jpg);
}
#home-menu h2{
  font-size:clamp(1.9rem,5vw,2.6rem);
  color:var(--brown);
  margin-bottom: .25em;
  line-height: 1.6;
}
#home-menu h2 a{
  color:var(--brown);
  text-decoration:underline;
}
#home-menu a section{
  width:100%;
  margin:1.5em auto;
  color:#fff;
  position:relative;
  border:1px solid var(--brown);
  background:var(--brown);
}
#home-menu a section .mask{
  display:none;
}

#home-menu a h3{
  font-size:2rem;
  line-height:2;
  text-indent:0.25em;
  letter-spacing:0.25em;
  font-weight:600;
  background:var(--brown);
}
#home-menu img{
  width:100%;
}
#home-menu a section .menu-more{
  position:absolute;
  bottom: 0.5%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width:80%;
  border:1px solid #999;
  background: rgba(0,0,0,0.25);
  padding:0.5em 0;
  font-family: var(--min);
}
#home-menu section p.menu-more:after{
  font: var(--fa-font-solid);
  content:"\f105";
  margin-left:0.75em;
}

/* お知らせ */
#information{
  /*width:90%;
  max-width:1000px;*/
  width:min(90%,1000px);
  margin:0 auto;
}
#information h2{
  font-size:2.6rem;
  text-align:center;
}
#information ul{
  width:min(100%,1000px);
  margin:1em auto 0;
}
#information ul > li{
  margin:.5em 0;
  padding:.75em 0;
}
#information ul > li::after{
  content:"";
  display: block;
  clear: both;
}
#information ul > li:not(:last-child){
  border-bottom: 1px dotted var(--brown)
}
#information ul li a{
  color:var(--brown);
  text-decoration: underline;
}

#information .taisaku ol{
  list-style-type:decimal;
  line-height: 1.4;
  margin-left: 2em;
  font-size: .95em;
}
#information .taisaku ol li{
  margin-top: .3em;
}

#information .job dt{
  width:4em;
  float:left;
}
#information .job dd{
  overflow: hidden
}
#information ul:first-child > li{
  padding-left: 1em;
  text-indent: -1.25em;
}
#information ul:first-child > li::before{
  content:"●";
}
#information li figure{
  float: right;
  width: min(35%,120px);
  margin:0 0 .25em 2.5%;
}
#information li figure img{
  display: block
}

#information .taisaku ol li{
  text-indent: 0;
}
#information i{
  margin-left: 1em;
  display: inline-block
}
/* map */

#home-map{
  text-align:center;
  margin:2.5em auto 0;
  padding:2em 5% 0;
  background:#333;
}
#home-map iframe{
  width:100%;
  height:350px;
  margin:auto;
}



/*
  サブページ共通 基本幅
------------------------------*/
.bread{
  text-align:left;
  margin-bottom:0.75em;
}
.bread li{
  display:inline;
  text-align:right;
  padding:0.25em;
  font-size:14px;
}

.bread li:first-child:before{
  font: var(--fa-font-solid);
  content:"\f015";
  margin-right:0.15em;
}
.bread li:first-child:after{
  font: var(--fa-font-solid);
  content:"\f105";
  margin-left:0.5em;
}

.sub h2{
  font-size:clamp(2.4rem,7.7vw,3.6rem);
  margin:0em auto 0.25em;
  text-indent:0.2em;
  letter-spacing:0.2em;
}
.sub h2 span{
  display:block;
  font-size:.75em;
  margin-top:0;
  letter-spacing:0.05em;
  color:#888
}
.sub h2 + .eng{
  font-size:.75em;
  letter-spacing:0.05em;
  color:#888;
  text-align: center;
  margin: -1.5rem auto .5rem;
}
.sub h2 span:before,
.sub h2 + .eng::before
.sub h2 span:after,
.sub h2 + .eng::after{
  content:"　―　";
}
.sub h3{
  font-size:clamp(2.2rem,6.1vw,2.6rem);
  margin:2em auto 0.5em;
  text-indent:0.2em;
  letter-spacing:0.075em;
}

.sub .lead{
  text-align:center;
  width:min(94%,1000px);
  margin:auto;
  padding:0.5em;
  background:rgba(255,255,255,0.3)
}


.sub .catch{
  font-size:2.2rem;
  margin:0 auto 0.5em;
  text-align:center;
  padding-top:1em;
  width:min(94%,1000px);
  font-weight: 600;
  font-family: var(--min);
}

/* ●●メニューはこちらボタン */

.otherlist li a{
  width:90%;
  background:var(--brown);
  color:#fff;
  padding:1em 0;
  display:block;
  margin:1em auto;
  border-radius:3px;
  font-size:1.7rem;
}
.otherlist li a:hover{
  background:#fff;
  color:var(--brown);
  text-decoration:none;
}
.otherlist li a:after{
  font: var(--fa-font-solid);
  content:"\f105";
  margin-left:0.75em;
}
.text-seat{
  font-size:2rem;
  line-height:1.5;
  color:var(--brown);
  margin:1em 0;
  font-family: var(--min);
  font-weight: 600;
}
.text-seat a{
  color:var(--brown);
  text-decoration:underline;
}
.daikou a{
  width:min(100%,20em);
  color:var(--brown);
  border:1px solid #333;
  padding:15px 0.25em;
  display:block;
  line-height:1.4;
  border-radius:3px;
  margin:0.75em auto 0;
  font-size:clamp(1.6rem,4.1vw,2rem);
  font-weight: 600;
}
.daikou a span{
  color:var(--red);
}
.daikou a:hover{
  background:#fff;
  text-decoration:none;
}
.daikou a::before,
.daikou a:after{
  font: var(--fa-font-solid); 
}
.daikou a::before{
  content:"\f1ba";/* タクシー */
  margin-right:0.5em;
}
.daikou a::after{
  content:"\f105";/* > */
  margin-left:0.75em;
}
aside{
  width:min(96%,80rem);
  margin:1em auto;
  padding:1em 0;
  text-align:center;
}

/*
  お料理／お飲物／ご宴会 基本幅
------------------------------*/
.p-foodmenu .foodlist,
.p-drinkmenu .drinklist,
.p-party .partylist{
  margin:auto auto 2em;
  text-align:center;
  display: flex;
  flex-wrap: wrap;
  /*width:92%;
  max-width: 2048px;*/
  width:min(92%,2048px);
}

.p-foodmenu .foodlist li,
.p-drinkmenu .drinklist li,
.p-party .partylist li{
  margin:0 auto 1em;
  width:100%;
}

.p-foodmenu .foodlist li img,
.p-drinkmenu .drinklist li img,
.p-party .partylist li img{
  box-shadow: 1px 1px 4px #555;
}
.p-foodmenu .foodlist li a,
.p-drinkmenu .drinklist li a,
.p-party .partylist li a{
	pointer-events: none;
}

/*
  お席 基本幅
------------------------------*/
.p-seat .imgbox1-3 div{
  width:100%;
  margin:2em auto;
  text-align:center;
}
.p-seat .imgbox1-3 div img{
  width:min(100%,480px);
}
.p-seat .imgbox1-3 div p{
  text-align:left;
  margin-top:0.75em;
  display: inline-block;
}
.p-seat .imgbox1-3 span{
  font-weight:600;
  display:block;
  font-size: 1.05em;
  margin-bottom: .25em;
}

/*
  アクセス 基本幅
------------------------------*/
.p-access .shopbox-r{
  margin-top:1.5em;
}
.p-access .shopbox-r figure{
  text-align:center;
  margin:auto;
}
.p-access .shopbox-r figure figcaption{
  margin-top:0.5em;
  font-size:15px;
}
.p-access main table {
	border-collapse: collapse;
	width:100%;
}
.p-access main th.t_top {
    border-top: #333 4px solid;
}
.p-access main th {
  border-right:1px solid #bbb;
	border-bottom:  1px solid #bbb;
  border-left:1px solid #bbb;
	text-align: left;
	padding: 0.75em;
  background:#eee;
  white-space:nowrap;
}
.p-access main td.t_top {
	border-top: var(--red) 4px solid;
}
.p-access main td {
	border-bottom: #bbb 1px solid;
  border-right: #bbb 1px solid;
	text-align: left;
	padding: 0.75em;
  background:#fff;
}
.p-access .map-link a{
  display:inline-block;
  background:#666;
  color:#fff;
  margin:0.25em 0.25em;
  padding:0.5em 0.5em 0.5em 0.75em;
  border-radius:2px;
  font-size:0.9em;
  white-space:nowrap;
}
.p-access .map-link a:hover{
  text-decoration:none;
  background:#999;
  color:#fff;
}
.p-access .map-link a:after{
  font: var(--fa-font-solid);
  content:"\f3c5";
  margin-left:.5em;
}
.p-access .access-gmap{
  margin:1em auto 2em; 
}
.p-access .access-gmap iframe{
  width:100%;
  height:350px;
}
.p-access #daikou{
  margin:2em auto 0;
  padding:0.75em 0 3.5em;
  text-align:center;
}
.p-access #daikou img{
  box-shadow: 1px 1px 3px #555;
}

/*
  footer 基本幅
------------------------------*/
footer{
  background:#333;
  color:#fff;
  text-align:center;
  font-size:18px;
  padding-top:3.5rem;
}
.p-home footer,
.p-access footer{
  margin-top:0;
}
footer address dl{
  /*width:97%;
  max-width:1000px;*/
  width:min(97%,1000px);
  margin:auto;
}
footer address dt img{
  /*width:80%;
  max-width:350px;*/
  width:min(80%,350px);
  margin-bottom:1em;
}
footer .map-more a{
  display:block;
  background:#fff;
  color:var(--red);
  width:50%;
  margin:0.5em auto;
  padding:0.15em 0.5em;
  border-radius:2px;
  font-size:0.85em;
  font-weight:bold;
}
footer .map-more a:hover{
  text-decoration:none;
  background:var(--red);
  color:#fff;
}
footer .map-more a:before{
  font: var(--fa-font-solid);
  content:"\f3c5";
  margin-right:0.25em;
}
footer .footer-tel{
  width:min(90%,20em);
  font-size:1.7rem;
  border-top:2px solid #ccc;
  border-bottom:2px solid #ccc;
  margin:0.5em auto;
  padding:0.25em .1em;
  font-family: var(--roboto);;
}
footer .tel-link,
footer .tel-link a{
  color:#fff;
  font-size:1.2em;
  letter-spacing:0.05em;
}
footer .footer-tel i{
  margin:0 0.2em;
  font-size:1.15em;
}
footer table{
  max-width: 96%;
  margin:1em auto;
  text-align:left;
  display: inline-block;
  font-family: var(--roboto);
}
footer table th,
footer table td{
  padding:0.25em;
}
footer table th{
  white-space:nowrap;
  text-align:left;
}

footer #footer-nav{
  width:100%;
  background:#eee;
  text-align:center;
  font-family: var(--min);
  font-weight: 600;
}
footer #footer-nav:after{
  content:"";
  display:block;
  clear:both;
}
footer #footer-nav li a{
  width:50%;
  float:left;
  color:#333;
  position:relative;
  display:block;
  padding:0.5em 0;
}
footer #footer-nav li a:after{
  font: var(--fa-font-solid);
  content:"\f105";/* > */
  position:absolute;
  top:50%;
  right:0.5em;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
footer #footer-nav li a{
  border-bottom:1px solid #ccc;
}
footer #footer-nav li:nth-child(odd) a{
  border-right:1px solid #ccc;
}
footer .more-calendar{
  font-size:.8em;
  display: inline-block;
  border-radius: 3px;
  padding:.2em .75em;
  background: #fff;
  margin-top:.5em;
}
footer .more-calendar::before{
  font: var(--fa-font-solid);
  content:"\f073";
  margin-right: .2em;
  
}
footer .more-calendar:hover{
  text-decoration: none;
  background: var(--red);
  color:#fff;
}
footer small{
  font-family: var(--min);
}

/* ページトップ */
#pagetop {
  font-size: 77%;
}
#pagetop a {
 background: #222;
  text-decoration: none;
  color: #fff;
  padding: 10px 0;
  text-align: center;
  display: block;
  border-top:1px solid #555;
  border-bottom:1px solid #555;
  margin:0 auto;
}
#pagetop a::before{
  font-size:20px;
  margin:.25em auto;
  display: block;
  font: var(--fa-font-solid);
  content:"\f106";
}
#pagetop a:hover {
  text-decoration: none;
  background: #666;
}


/*
  他　基本幅
------------------------------*/
.inner100-1000{
  width:min(100%,1000px);
  margin:0 auto;
}
.inner90-1080{
  width:min(90%,1080px);
  margin:0 auto;
}
.inner90-700{
  width: min(90%,700px);
  margin:0 auto;
}
.inner94-700{
  width:min(94%,700px);
  margin:0 auto;
}
.max600{max-width: 600px}
.bg-wood{
  background:#EAC388 url(../img/common/bg-wood.png);
}
.underline{text-decoration: underline;
}
.marker-green{
  background:linear-gradient(transparent 75%, #b2ffb2 75%);
  font-weight:bold; 
}
.marker-yellow{
  background:linear-gradient(transparent 75%, #ffff7d 75%);
  font-weight:bold; 
}
.list-kome,
.list-mark{
  line-height: 1.4;
}
.list-kome > li,
.list-mark > li{
  margin-left: 1em;
  text-indent: -1em;
}
.list-kome > li:not(:last-child),
.list-mark > li:not(:last-child){
  margin-bottom: .5em;
}
.list-kome > li::before{
  content:"※";
}
.gothic{
  font-family: var(--base-font);
}
.roboto{
  font-family: var(--roboto);
}
.font12{font-size:12px}
.font13{font-size:13px}
.font14{font-size:14px}
.font15{font-size:15px}
.font16{font-size:16px}
.font12rem{font-size: 1.2rem}
.font13rem{font-size: 1.3rem}
.font14rem{font-size: 1.4rem}
.font15rem{font-size: 1.5rem}
.left{text-align:left!important}
.center{text-align:center!important}
.right{text-align:right!important}
.white{color:#fff}
.red{color:var(--red)!important}
.bol,.bold{font-weight:bold;}
.fw400{font-weight: 400}
.fw600{font-weight: 600}
.nowrap{
  white-space: nowrap;
  font-weight: inherit;
}
hr.dotted {
  border-top: 1px dotted;
}
.pc-only,
.pctab-only,
.pctb-only{
  display:none;
}

br.sp480-only{
  display: inline-block
}
.block{display: block}
.cf:after{
  content:"";
  display:block;
  clear:both;
}
.mt0{margin-top:0}
.mt-5em{margin-top: .5em}
.mt1em{margin-top:1em}
.mt2em{margin-top:2em}
.mr5{margin-right:5px}
.mr1em{margin-right:1em}
.mb-5em{margin-bottom: .5em}
.mb1em{margin-bottom: 1em}
.pt0{padding-top:0}
.pt10{padding-top:10px}
.pt2em{padding-top:2em}


/* ====================================

  340px以下

======================================*/

@media (max-width: 340px) {
  html {
    font-size: 56.25%; /* 15px × 56.25% = 10px */
  }
}

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

  480pxから

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

@media only screen and (min-width:480px) {

  #gyoza .gyoza-container{
    flex-direction: row;
  }
  br.sp480-only{
      display:none;
  }

}

/* ------------------------------ 　　　　　　　　　　　　　　　　　　　　　　　　　　
  
  568px幅から

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

@media only screen and (min-width: 568px) {

  /*
    ヘッダー 568px幅から
  ------------------------------*/ 
  header h1,
  header .header-tel{
    display:inline;
  }
  header h1{
    margin-right:1em;
  }


  /*
    ホーム 568px幅から
  ------------------------------*/
  #calendar .calendar-content.col-2{
    flex-direction: row;
  }
  #home-menu a section{
    float:left;
    width:48%;
    margin:1em 1%;
    color:#fff;
    background:#333;
  }
  #home-menu a section#party{
    clear:both;
    float:none;
    margin:1em auto;
  }

  /*
    サブページ共通 568px幅から
  ------------------------------*/
  .otherlist li a{
    width:48%;
    margin:0 1% 1em;
    float:left;
  }
  
  /*
    お料理／お飲物/ご宴会 568px幅から
  ------------------------------*/
  .p-foodmenu .foodlist,
  .p-drinkmenu .drinklist{
    width:98%;
  } 
  .p-foodmenu .foodlist li,
  .p-drinkmenu .drinklist li{
    width:46%;
    margin:0 auto 1em; 
  }
  .p-foodmenu .foodlist.col1 li,
  .p-drinkmenu .drinklist.col1 li{
    min-width:400px;
  }
  .p-foodmenu .foodlist li a,
  .p-drinkmenu .drinklist li a,
  .p-party .partylist li a{
    pointer-events: auto;
  }
  .p-foodmenu .foodlist li,
  .p-drinkmenu .drinklist li,
  .p-party .partylist li{
    position:relative;
  }
  .p-foodmenu .foodlist li:before,
  .p-drinkmenu .drinklist li:before,
  .p-party .partylist li:before{
    position:absolute;
    right:0;
    top:0;
    font: var(--fa-font-solid);
    content:"\f00e";
    background: rgba(0,0,0,0.35);
    color:#fff;
    z-index:100;
    padding:0.25em 0.5em;
    font-size:18px;
  }

  .p-foodmenu .foodlist a:hover img,
  .p-drinkmenu .drinklist a:hover img,
  .p-party .partylist a:hover img{
    opacity:1;
  }

  .p-foodmenu .foodlist li a:hover img,
  .p-drinkmenu .drinklist li a:hover img,
  .p-party .partylist li a:hover img{
    -webkit-transform: scale(1.005);
    -moz-transform: scale(1.005);
    -o-transform: scale(1.005);
    -ms-transform: scale(1.005);
    transform: scale(1.005);
  }


  /*
    お席 568px幅から
  ------------------------------*/
  .p-seat .imgbox1-3 div:nth-child(2),
  .p-seat .imgbox1-3 div:nth-child(3){
    float:left;
    width:47%;
    margin:2em 1.5%;
  }
  

  /*
    footer 568px幅から
  ------------------------------*/
  footer .map-more a{
    display:inline-block;
    margin:0.25em 0 0.25em 0.75em;
    width:auto;
  }
  

}
  
/* -------------------------------- 

  768px幅から

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

@media only screen and (min-width: 768px) {
  html {
    font-size: 66.7%; /* 16px × 66.7% = 約10.67px */
  }

  /*
    header　768pxから
  ------------------------------*/ 
  header .header-bar{
    text-align:right;
    background:#111;
  }
  header h1,
  header .header-tel{
    display:inline;
    margin-right:1em;
    color:#fff;
  }
  header .tel-link a{
    color:#fff;
  }
  header .logo{
    width:200px;
    position:absolute;
    left:7%;
    top:0;
    box-shadow: 1px 1px 6px #111;
  }
  header nav ul{
    margin-left:300px;
  }


  /*
    ホーム　768pxから
  ------------------------------*/ 

  /* ホーム 各エリアpadding */
  #about,
  #home-menu,
  #information{ 
    padding:3em 0;
  }
  .top-info-container{
    flex-direction: row;
  }
  .top-info .card-gyoza{
    flex-direction: row;
  }

  .top-info .card-gyoza > section {
    flex:1;
  }



  /* ホーム main写真 */
  #home-mainimg img.mainimg{ 
    display:inline;
    width:100%;
    max-width:1760px;
  }


  /* ホーム　メニュー */
  #home-menu a section,
  #home-menu a section#party{
    clear:none;
    float:left;
    width:31.33333%;
    margin:1em 1%;
    box-sizing:border-box;
  }

  #home-map iframe{
    height:400px;
  }

  /*
    サブページ共通　768pxから
  ------------------------------*/ 
  .bread{
    text-align:right;
    margin-right:0.75em;
  }

  /*
    お料理/お飲物/ご宴会　768pxから
  ------------------------------*/ 
  .p-foodmenu .foodlist li,
  .p-drinkmenu .drinklist li{
    width:31.33333%;
  }


  /*
    アクセス 768px幅から
  ------------------------------*/
  .p-access main table{
    font-size:17px;
  }
  .p-access .access-gmap iframe{
    height:400px;

  }

  /*
    その他 768px幅から
  ------------------------------*/
  .pctb-center{
    text-align: center;
  }
  .sp-only{
      display:none;
  }
  .pctb-only,
  .pctab-only{
    display:inline-block;
  }

}
  
/* ------------------------------

  1025px以上

------------------------------ */
@media only screen and (min-width: 1025px) {

  html {
    font-size: 70.3%; /* 16px × 70.3% = 約11.25px */
  }


  /*
    header　1024pxから
  ------------------------------*/
  header .header-tel{
    font-size:18px;
  }
  header .logo{
    width: 300px;
    position: absolute;
    padding: 1em 0;
  }
  header .logo img{
    max-width: 300px;
  }

  header nav ul{
    margin-left:40%;
  }

  header nav li a{
    font-size:20px;
    letter-spacing:0.1em;
    line-height:32px;
  }
  header nav li,
  header nav li.gnav-seat,
  header nav li.gnav-access{
    width:16%;
  }
  header nav li.gnav-home{
    display:block;
  }

  #pagetop {
    display:none;
    position: fixed;
    bottom: 80px;
    right: 20px;
    font-size: 77%;
    margin:0;
  }

  #pagetop a {
    width:7em;
    border-radius: 5px;
    border:1px solid #ccc;
  }
  #pagetop i{
    display:block;
    margin:0;
  }

  /*
    ホーム　1025pxから
  ------------------------------*/
  .p-home{
    background:none;
  }
  #home-wrap{
    background: url(../img/top/bg-photo.jpg) center center / cover no-repeat fixed;
  }
  .top-info section{
    padding:2rem;
  }
  #about {
    max-width: inherit;
  }
  #about p{
    line-height: 2;
  }
  #gyoza .gyoza-img {
    flex: inherit;
    width: min(45%,160px);
  }

  /* ホーム 各エリアpadding */
  #about,
  #home-menu,
  #information{ 
    padding:3.5em 0;
  }
  #about{
    padding-top:2em
  }

  /* ホーム　menu */
  #home-menu a section .mask{
    display:block;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    opacity:0;
    background-color:	rgba(0,0,0,0.5);
    border:1px solid #333;
  }
  #home-menu a section .mask p{
  font-size:22px;
  line-height:2;
  width:100%;
  position:absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align:center;
  color:#fff;
  padding:0 0.25em;
  }

  #home-menu a:hover .mask {
  opacity:1;
  }

  #home-menu a:hover .menu-more{
  background-color:	rgba(255,255,255,0.3);
  }

  /* ホーム　information */

  .info-inner{
  margin:3rem auto 0;
  padding:6rem 0;
  background: rgba(255,255,255,0.8);
  }

  /* ホーム map */

  #home-map{
    border-top:1px solid #bbb;
    padding:0;
    filter: grayscale(100%);
    transition: .5s;
  }
  #home-map:hover {
    filter: none;
  }
  #home-map iframe{
  height:500px;
  }

  /*
  サブページ共通 1025px幅から
  ------------------------------*/

  /*
  お料理／お飲物 1025px幅から
  ------------------------------*/
  .p-foodmenu .foodlist li,
  .p-drinkmenu .drinklist li{
    width:23%;
  }


  /*
  ご宴会 1024px幅から
  ------------------------------*/
  .p-party .lead{
    text-align:left;
  }
  .p-party .partylist{
    width:100%;
  }
  .p-party .partylist li{
    width:74%;
    margin:0 auto; 
  }

  /*
  お席 1024px幅から
  ------------------------------*/
  .p-seat .imgbox1-3 div,
  .p-seat .imgbox1-3 div:nth-child(1),
  .p-seat .imgbox1-3 div:nth-child(2),
  .p-seat .imgbox1-3 div:nth-child(3){
    width:31.33333%;
    margin:2em 1%;
    float:left;
  }

  /*
  アクセス 1024px幅から
  ------------------------------*/
  .p-access .shopbox-l{
    float:left;
    width:56%;
  }
  .p-access main table{
    font-size:18px;
  }
  .p-access th,
  .p-access td{
    padding:0.5em 0.75em;
  }
  .p-access .shopbox-r{
    float:right;
    width:40%;
    margin-top:0;
  }

  .p-access .shopbox-r figure,
  .p-access .shopbox-r figure:nth-child(odd),
  .p-access .shopbox-r figure:nth-child(even){
    float:none;
    width:100%;
    margin:0 auto 1em;
  }
  .p-access .access-gmap iframe{
    height:400px;
  }


  /*
    footer 1024px幅から
  -------------------------------*/

  footer #footer-nav li{
    display:inline;
    margin:0.25em 1em;
  }
  footer #footer-nav li a{
    width:auto;
    float:none;
    color:#333;
    display:inline-block;
    padding:0.5em 0;
  }
  footer #footer-nav li a:after{
    display:none;
  }
  footer #footer-nav li a{
    border-bottom:none;
  }
  footer #footer-nav li:nth-child(odd) a{
    border-right:none;
  }


  /*
    その他 1024px幅から
  -------------------------------*/
  .pc-only{
    display:inline-block;
  }
  .pc-center{
    text-align: center!important
  }
  .pc-none,
  .sptab-only{
    display: none;
  }


}


/* ------------------------------
  
  1280px以上　

------------------------------ */
@media only screen and (min-width: 1280px) {
  /*
    お料理/お飲物/宴会 1280px幅から
  --------------------------------*/
  .p-foodmenu .foodlist li{
    width:14%;
  }
  .p-drinkmenu .drinklist li{
    width:15.667%;
  }
  .p-access .access-gmap iframe{
    height:450px;
  }

}