@charset "UTF-8";

/*==============
PC
===============*/
@media print, screen and (min-width: 1300px) { 
.sp{display:none;}
.hamburger-menu{ display: none;}
}


body{overflow: hidden;}

.slider {
    height: 100vh;
    margin-inline: auto;
    overflow: hidden; /* 画像がはみ出ないようにする */
    width: 100vw;
  }
  .slick-img img {
    width: 100%;
  }
  @keyframes zoomUp {
    0% {
      transform: scale(1);
    }
    100% {
      transform: scale(1.15); /* 拡大率 */
    }
  }
  .add-animation {
    animation: zoomUp 10s linear 0s normal both;
  }




/* スライダー画像に黒の乗算 */
.slider {
  position: relative;
}

.slick-img {
  position: relative;
}

.slick-img img {
  width: 100%;
  display: block;
}

/* 黒の乗算レイヤー */
.slick-img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* ここで黒の乗算（透明度調整可） */
  mix-blend-mode: multiply;
  pointer-events: none; /* クリックをブロックしない */
}

/* news は影響を受けないように */
.news {
  position: relative;
  z-index: 1; /* 画像の乗算レイヤーより上に配置 */
  background: white; /* 必要なら背景をつける */
  padding: 10px;
  border-radius: 5px;
}




  header {position: absolute;top: 0;z-index: 2;display: flex;justify-content: space-between;width: 100%;align-items: flex-start;}
header h1 {}
header h1 a {
    display: block;
    background: #4d2e0d;
    width: 16em;
    height: 16em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
header h1 a img {width: 56%;}
header ul.menu {display: flex;margin: 1em 1em 0 0;align-items: center;}
header ul.menu li {margin: 1em;font-size: calc(0.25vw + 0.9rem);}
header ul.menu li a {color: #fff;font-weight: 500;}
header ul.menu li.instagram {
}
header ul.menu li.instagram a {background: #fff;display: flex;justify-content: center;align-items: center;padding: 0.5em;border-radius: 50%;font-size: calc(1.25vw + 0.9rem);}
header ul.menu li.instagram a i.fa-brands.fa-instagram {color: #c64e99;}
div.top01 {position: relative;}
div.top01 div.slider {
}
div.top01 div.slider div.slick-img {
}
div.top01 div.slider div.slick-img img {
}
div.top01 img.logo {position: absolute;top: 40%;left: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform:translateY(-50%) translateX(-50%); width: 16%;}
div.top01 dl.news {border-radius: 150px;background: #fff;position: absolute;bottom: 5vh;width: 80%;/* max-width: 1200px; */margin: 0 auto;left: 50%;transform: translateY(-50%) translateX(-50%);-webkit- transform: translateY(-50%) translateX(-50%);display: flex;padding: 2em 0;justify-content: center;font-size: calc(0.25vw + 0.9rem);align-items: center;}
div.top01 dl.news dt {color: #4d2e0d;font-weight: 700;}
div.top01 dl.news dt i.fa-solid.fa-utensils {margin: 0 1em;font-size: calc(0.9vw + 0.9rem);}
div.top01 dl.news dd {
    font-weight: 600;
}
 div.top01 dl.news dd:before{} 

 .top02 {
  position: relative;
  /* overflow: hidden; */ /* はみ出し防止 */
}

/* 縦書き h2 */
.top02 .mnc {
  writing-mode: vertical-rl; /* 縦書き */
  display: inline-block;
}

/* 各文字のアニメーション */
@keyframes fadeInUp {
  from {
      opacity: 0;
      transform: translateY(10px);
  }
  to {
      opacity: 1;
      transform: translateY(0);
  }
}




div.top02 {position: relative;}
div.top02 dl {display: flex;justify-content: flex-end;position: relative;}
div.top02 dl dt {-ms-writing-mode: tb-rl;writing-mode: vertical-rl;padding: 3em 4% 0 0;height: 81vh;}
div.top02 dl dt h2.mnc {font-size: calc(1.7vw + 0.5rem);color: #4d2e0d;font-weight: 500;margin: 0 0 0 1em;}
div.top02 dl dt p {font-size: calc(0.6vw + 0.5rem);line-height: 2;}
div.top02 dl dd {width: 59%;z-index: 0;position: relative;}
div.top02 dl dd::before{content:"";display:block;width:500px;height:500px;background:#4d2e0d;right: 0;top: 0;position: absolute;}
div.top02 img.dog{
    position: absolute;
    right: 0;
    bottom: -7em;
}  
div.top02 dl dd img {border-radius: 0 0 0 50px;width: 90%;z-index: 2;position: absolute;top: 5%;right: 5%;}
div.top02 i
  mg.dog {position: absolute;top: 63vh;right: 0;width: 16%;}
div.top03 {position: relative;margin: 8em 0;}
 div.top03:after{content:"";background: #f0e4d8;width: 40%;display: block;height: 131vh;border-radius: 0 50px 0 0;position: absolute;top: -3em;z-index: -2;} 
div.top03 h2 {text-align: center;display: flex;justify-content: center;font-size: calc(0.8vw + 0.5rem);align-items: center;color: #4d2e0d;font-weight: 300;}
div.top03 h2 img {margin: 0 1em 0 0;width: auto;border: none;}
div.top03 img {
    width: 60%;
    margin: 0 auto;
    display: block;
    border: 10px solid #FFF;
    height: auto;
}
div.top03 h3 {text-align: center;font-size: calc(1vw + 0.5rem);font-weight: 600;margin: 1em 0 0.5em 0;color: #4d2e0d;}
div.top03 p {font-size: calc(0.6vw + 0.5rem);text-align: center;color: #4d2e0d;}
div.top04 {
}
div.top04 ul {width: 80%;margin: 0 auto;max-width: 1400px;}
div.top04 ul li {width: 30%;margin: 0 1%;}
div.top04 ul li a {
}
div.top04 ul li a h3 {font-size: 3em;}
div.top04 ul li a p {font-weight: 400;font-size: calc(0.5vw + 0.5rem);}
div.top05 {width: 80%;margin: 0 auto;max-width: 1300px;}
div.top05 dl {display: flex;flex-wrap: wrap;justify-content: space-between;margin: 4em 0;color: #4f2e0f;}
div.top05 dl dt {width: 25%;font-size: calc(0.7vw + 0.5rem);display: flex;justify-content: flex-start;align-items: center;color: #4d2e11;}
div.top05 dl dt img {margin: 0 1em 0 0;}
div.top05 dl dd {width: 70%;}
div.top05 dl dd dl.inner {align-items: flex-start;}
div.top05 dl dd dl.inner dt.date {font-size: calc(0.6vw + 0.5rem);width: 15%;font-weight: 800;margin: 0 0 1.5em 0;}
div.top05 dl dd dl.inner dd.title {font-size: calc(0.6vw + 0.5rem);width: 85%;margin: 0 0 1.5em 0;}
div.top_instagram {
}
footer {background: #4d2f0d;display: flex;justify-content: space-between;}
footer img {
}
footer dl {width: 45%;display: flex;padding: 3em 5% 3em 0;align-items: center;justify-content: space-between;}
footer dl dt {text-align: center;width: 30%;}
footer dl dt img {
}
footer dl dt i.fa-brands.fa-instagram {font-size: calc(1.6vw + 0.5rem);color: #fff;margin: 0 0 0.5em 0;}
footer dl dt p {font-size: calc(0.3vw + 0.5rem);color: #fff;}
footer dl dd {color: #fff;width: 65%;}
footer dl dd h3 {font-size: calc(1.2vw + 0.5rem);font-weight: 500;margin: 0 0 0.2em 0;}
footer dl dd p.add {font-size: calc(0.6vw + 0.5rem);}
footer dl dd p.tel {
}
footer dl dd p.tel a {font-size: calc(1.6vw + 0.5rem);color: #fff;font-weight: 600;letter-spacing: 0.1em;display: flex;align-items: center;background: none;padding: 0;margin: 0;}
footer dl dd p.tel a i.fa-solid.fa-phone {margin: 0 0.5em 0 0;font-size: 0.9em;}
footer dl dd a {
    background: red;
    color: #fff;
    padding: 0.5em 2em;
    display: inline-block;
    margin: 1em 0;
}
footer dl dd table {font-size: calc(0.6vw + 0.5rem);}
footer dl dd table tbody {
}
footer dl dd table tbody tr {
}
footer dl dd table tbody tr th {
    white-space: nowrap;
    padding: 0.5em 1em 0.5em 0;
    vertical-align: text-top;
}
footer dl dd table tbody tr td {padding: 0.5em;font-weight: 100;}
footer dl dd table tbody tr td span {
}
.top04 ul {
  list-style: none;
  display: flex;
  justify-content: center;
  padding: 0;
}

.top04 li {
  position: relative;
  width: 200px; /* 画像のサイズ調整 */
  text-align: center;
}

.top04 a {
  display: block;
  text-decoration: none;
  color: white;
  position: relative;
}

.img-wrapper {
  position: relative;
  overflow: hidden;
  border-radius: 10px; /* 角丸 */
}

.img-wrapper img {
  width: 100%;
  height: 34em;
  display: block;
  transition: transform 0.3s ease, filter 0.3s ease;
  object-fit: cover;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* 暗いオーバーレイ */
  transition: opacity 0.3s ease;
}

.top04 h3, 
.top04 p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  width: 100%;
  font-size: 18px;
  font-weight: bold;
  z-index: 2;
}

.top04 p {
  top: 60%;
  font-size: 14px;
}

.top04 li:hover .img-wrapper img {
  transform: scale(1.1); /* 画像を拡大 */
  filter: brightness(1); /* 明るくする */
}

.top04 li:hover .overlay {
  opacity: 0; /* オーバーレイを消す */
}

footer div.f_image{
    width: 47%;
    position: relative;
}
footer div.f_image img{
    position: absolute;
    top: -1em;
}

.second_h2 {
  position: relative;
  width: 100%;
  /* height: 5vw; */ /* 高さはお好みで調整 */
  overflow: hidden;
  color: white; /* テキストが見やすくなるように白色に設定 */
   /* テキストの余白調整 */
  margin: 0 0 0 0;
  padding: 10vw 0 6vw 0;
}

.background-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('../images/slide01.webp'); /* 使用する画像のパス */
  background-size: cover;
  background-position: center;
  z-index: -1; /* 背景として画像を配置 */
  filter: brightness(0.5); /* 画像の明るさを調整 */
}

/* 黒のオーバーレイを追加して、画像を暗くしすぎないようにする */
.second_h2::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3); /* 黒のオーバーレイ、透明度を調整 */
  z-index: -1;
}

.second_h2 p, .second_h2 h2 {
  position: relative; /* テキストを前面に表示 */
  z-index: 1; /* テキストが背景より前面に表示されるように設定 */
  text-align: center;
}

.second_h2 p{}

.second_h2 h2{
    font-size: calc(1.5vw + 0.9rem);
    font-weight: 500;
}



div.about {width: 80%;margin: 5em auto;max-width: 1300px;text-align: center;}
div.about h3 {-ms-writing-mode: tb-rl;writing-mode: vertical-rl;display: flex;justify-self: center;font-size: calc(0.7vw + 0.9rem);color: #4d2e0d;align-items: baseline;font-weight: 500;}
div.about h3 i {margin: 0.5em 0 0 0;font-size: calc(1.5vw + 0.9rem);}
div.about img {margin: 3em 0 1em 0;}
div.about h4 {text-align: left;font-size: calc(0.7vw + 0.9rem);}
div.about p {font-size: calc(0.3vw + 0.9rem);text-align: left;line-height: 2;margin: 1em 0 5em 0;}
div.about.about02 {
}
div.about.about02 h3 {
}
div.about.about02 h3 i.fa-solid.fa-heart {
}
div.about.about02 img {
}
div.about.about02 h4 {
}
div.about.about02 p {
}
div.about.about03 {
}
div.about.about03 h3 {
}
div.about.about03 h3 i.fa-solid.fa-leaf {
}
div.about.about03 img {
}
div.about.about03 h4 {
}
div.about.about03 p {
}

div.menu_page{background: url(../images/kabu.svg) no-repeat;background-position-x: -8vw;background-position-y: 44vw;background-size: 34%;}
div.menu01 {position: relative;background: url(../images/onigiri.svg) no-repeat;background-position-x: 50vw;background-position-y: -6vw;background-size: 62%;padding: 7em 0 0 0;}
div.menu01 dl {display: flex;align-items: center;}
div.menu01 dl dt {width: 50%;}
div.menu01 dl dt img {width: 100%;];border-radius: 0 20px 20px 0;height: auto;position: relative;object-fit: unset;bottom: auto;left: auto;}
div.menu01 dl dd {padding: 0 4% 0 10%;width: 34%;}
div.menu01 dl dd h3 {color: #6a523c;font-size: calc(1.5vw + 0.9rem);font-weight: 500;}
div.menu01 dl dd h4 {color: #6a523c;font-size: calc(1.1vw + 0.9rem);margin: 0.5em 0;}
div.menu01 dl dd p {color: #6a523c;font-size: calc(0.4vw + 0.9rem);line-height: 2;}
div.menu01 img {width: 300px;height: 300px;object-fit: cover;border-radius: 50%;position: absolute;bottom: -5vw;left: 37vw;}
div.menu01.menu02 {background: none;}
div.menu01.menu02 dl {justify-content: center;margin: 5em 0 0 0;}
div.menu01.menu02 dl dt {order: 2;width: 40%;padding: 0 5% 0 0;}
div.menu01.menu02 dl dt img {width: 95%;margin: 0 5% 0 0;object-fit: cover;border-radius: 20px;height: 43vw;}
div.menu01.menu02 dl dd {order: 1;}
div.menu01.menu02 dl dd h3 {
}
div.menu01.menu02 dl dd h4 {
}
div.menu01.menu02 dl dd p {
}
div.menu01.menu02 dl dd img {width: auto;height: 19vw;object-fit: unset;border-radius: 20px;bottom: auto;left: auto;width: 41%;position: relative;object-fit: cover;display: block;margin: 0 0 0 auto;}
div.menu03 {padding: 5em 10%;margin: 3em 0 0 0;background: #fff1e6 url(../images/corn.svg) no-repeat;background-position-;background-position-y: 42vw;background-position-x: -8vw;background-size: 34%;position: relative;}
div.menu03 h3 {font-size: calc(1.5vw + 0.9rem);font-weight: 800;color: #4d2e0d;text-align: center;margin: 1em 0 1em 0;letter-spacing: 0.2em;}
div.menu03 h3 i {color: #b18c64;display: block;}
div.menu03 img.onion{
    width: 19%;
    position: absolute;
    right: -5vw;
    top: -9vw;
}
div.menu03 div.menu04 {
}
div.menu03 div.menu04 img {width: 40%;border-radius: 20px;}
div.menu03 div.menu04 {
  position: relative;
  display: inline-block; /* 画像の幅に合わせる */
  text-align: center;
  margin: 0 0 4em 0;
}

div.menu03 div.menu04::before {
  content: "";
  position: absolute;
  top: 11vw;
  left: 50%;
  width: 100%;
  height: 100%;
  background: #ece398;
  transform: translate(-50%, -50%) rotate(2deg);
  z-index: 0; /* img の下にくるように設定 */
  width: 40%;
  height: 23vw;
  border-radius: 20px;
}

div.menu03 div.menu04 img {
  position: relative; 
  z-index: 1; /* 背景より前に表示 */
  /* display: block; */ /* 余計な隙間をなくす */
}

div.menu03 div.menu04 h4 {position: relative;font-size: calc(0.6vw + 0.9rem);color: #6a523c;font-weight: 600;margin: 1em 0 0.5em 0;}
div.menu03 div.menu04 h4 span {display: inline;background: #fff;font-size: calc(0.6vw + 0.9rem);color: #6a523c;font-weight: 600;}
div.menu03 div.menu04 p {color: #6a523c;font-size: calc(0.3vw + 0.9rem);line-height: 1.5;}
div.menu03 ul.menu05 {display: flex;flex-wrap: wrap;justify-content: center;}
div.menu03 ul.menu05 li {width: 34%;margin: 2%;}

div.menu03 ul.menu05 li div.menu04::before {
    width: 100%;
    background: #f69999;
    height: 19vw;
    top: 9vw;
}
div.menu03 ul.menu05 li div.menu04 {
}
div.menu03 ul.menu05 li div.menu04 img {width: 100%;height: 18vw;object-fit: cover;}
div.menu03 ul.menu05 li div.menu04 h4 {
}
div.menu03 ul.menu05 li div.menu04 h4 span {
}
div.menu03 ul.menu05 li div.menu04 p {text-align: left;font-size: calc(0.2vw + 0.9rem);}
div.menu03 h3 i.fa-solid.fa-mug-saucer {
}
div.menu03 ul.menu05.menu06 {
}
div.menu03 ul.menu05.menu06 li {width: 29%;}
div.menu03 ul.menu05.menu06 li div.menu04 {
}
div.menu03 ul.menu05.menu06 li div.menu04 img {}
div.menu03 ul.menu05.menu06 li div.menu04::before{
    background: #98cbec;
}
div.menu03 ul.menu05.menu06 li div.menu04 h4 {
}
div.menu03 ul.menu05.menu06 li div.menu04 h4 span {
}
div.menu03 ul.menu05.menu06 li div.menu04 p {text-align: center;}

div.menu03 p.menu07 {text-align: right;}

div.access01 {margin: 5em auto;width: 80%;max-width: 1300px;}
div.access01 dl {display: flex;}
div.access01 dl dt {width: 55%;}
div.access01 dl dt img {
}
div.access01 dl dd {width: 45%;padding: 0 0 0 5%;color: #4d2f0d;}
div.access01 dl dd h3 {font-size: calc(1.2vw + 0.5rem);font-weight: 600;color: #4d2f0d;}
div.access01 dl dd p.add {font-size: calc(0.8vw + 0.5rem);}
div.access01 dl dd a.tel {font-size: calc(1.8vw + 0.5rem);font-weight: 800;display: flex;color: #4d2f0d;align-items: center;}
div.access01 dl dd a.tel i.fa-solid.fa-phone {margin: 0 0.5em 0 0;}
div.access01 dl dd a.link {display: flex;font-size: calc(0.4vw + 0.5rem);align-items: center;background: red;color: #fff;padding: 0.5em 1em;justify-content: space-between;width: 37%;margin: 1em 0;}
div.access01 dl dd a.link i.fa-solid.fa-chevron-right {margin: 0 0 0 0.5em;}
div.access01 dl dd table {font-size: calc(0.7vw + 0.5rem);}
div.access01 dl dd table tbody {
}
div.access01 dl dd table tbody tr {
}
div.access01 dl dd table tbody tr th {white-space: nowrap;width: 20%;padding: 0.5em 0;vertical-align: text-top;}
div.access01 dl dd table tbody tr td {padding: 0.5em 0;}
div.access01 dl dd table tbody tr td span {font-size: calc(0.5vw + 0.5rem);}
div.access02 {width: 80%;margin: 5em auto;max-width: 1300px;}
div.access02 iframe {
    width: 100%;
    height: 40vw;
}
div.access02 p {text-align: center;font-size: calc(0.7vw + 0.5rem);color: #4d2f0d;background: #f3efea;padding: 1em;margin: 1em 0 0 0;}