@charset "utf-8";

/* トップ共通 */
.top_main h2 {
  color: #0a0a0a;
  text-align: center;
  text-decoration: underline;
  text-decoration-color: #c9a932;
  text-underline-offset: 5px;
  margin-bottom: 20px;
}

/* トップファーストビュー */
.first_view {
  height: 375px;
  overflow: hidden;
  position: relative;
}

.first_view_item1 {
  opacity: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-animation: anime 9s 0s infinite;
  animation: anime 9s 0s infinite;
}

.first_view_item1:nth-of-type(2) {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.first_view_item1:nth-of-type(3) {
  -webkit-animation-delay: 6s;
  animation-delay: 6s;
}

/* トップニュース */
.news {
  height: 55px;
  width: 100%;
  overflow: hidden;
}

.news_content {
  display: inline-block;
  line-height: 3;
  padding-left: 100%;
  white-space: nowrap;
  animation: animate-news 20s linear infinite;
}

.news_content span {
  background-color: #c9a932;
  padding: 5px 10px;
  margin-right: 10px;
  border-radius: 15px;
}

.news_content > * {
  display: inline-block;
}

@keyframes animate-news {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-100%);
  }
}

/* トップアバウト（味処ふじわらについて） */
.top_about {
  background-image: url(../images/wallpaper01.webp);
  padding: 30px 0;
  margin-bottom: 30px;
  box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
}

.top_about_inner p {
  margin-bottom: 1em;
}

.top_about_inner span {
  color: #992626;
  font-weight: 700;
}

.owner {
  text-align: center;
}

/* トップお料理について */
.top_dishes {
  background-image: url(../images/wallpaper01.webp);
  padding-top: 30px;
  margin-bottom: 15px;
  box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
}

.top_dishes_inner p {
  margin-bottom: 1em;
}

.top_dishes_inner p:last-of-type {
  margin-bottom: 0;
}

/* トップバナー */
.top_banner {
  margin-bottom: 20px;
}

/* トップ予約のお願い */
.top_reservation {
  padding: 20px;
  background-color: #fff;
  border-radius: 30px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.16);
  margin-bottom: 40px;
}

.top_reservation span {
  color: #992626;
  font-weight: 700;
}

/* トップ店舗情報 */
.top_information_title {
  background-image: url(../images/information_title.webp);
  background-position: 0;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: 0;
}

.top_information h2 {
  color: #f8f7ee;
  text-decoration: none;
  margin-bottom: 0;
}

.top_information_background {
  background-image: url(../images/wallpaper03.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
}

.top_information_inner {
  padding-top: 30px;
  padding-bottom: 40px;
}

.top_information table tr {
  border-bottom: 1px solid #707070;
}

.top_information table th {
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  width: 24%;
  min-width: 7em;
}

.top_information table td {
  line-height: 1.5;
  width: 76%;
  padding-top: 30px;
  padding-bottom: 10px;
}

/* トップカレンダー */
.calendar {
  text-align: center;
  margin-bottom: 40px;
}

.calendar p {
  font-size: 24px;
  line-height: 2.5;
}

.calendar p::before {
  content: "";
  display: inline-block;
  width: 50px;
  height: 50px;
  background-image: url(../images/calendar.png);
  background-position: center;
  background-size: contain;
  transform: translateY(15px);
}

/* トップFacebook */
.facebook {
  text-align: center;
  margin-bottom: 40px;
}

.facebook p {
  font-size: 24px;
  line-height: 2.5;
}

/* トップgooglemap */
.googlemap iframe {
  vertical-align: bottom;
}

/* ここから料理ページ */

/* キービジュアル */
.ry_feature {
  background-image: url(../images/fujiwara52b.webp);
}

/* 料理　目次 */
.ry_index ul {
  list-style: none;
  font-family: "Noto Serif JP", serif;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background-color: #992626;
  color: #f8f7ee;
  margin-top: 20px;
  margin-bottom: 30px;
}

.ry_index li {
  height: 3em;
  display: table;
  text-align: center;
  border: 1px solid #f8f7ee;
}

.ry_index a {
  display: table-cell;
  vertical-align: middle;
}

/* 料理　予約について */
.ry_reservation {
  background-color: #ffffff;
  border-radius: 20px;
  padding: 10px 30px;
  margin: 30px auto;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.16);
}

.ry_reservation h3 {
  font-family: "Noto Serif JP", serif;
  text-decoration: underline;
  text-decoration-color: #c9a932;
  text-underline-offset: 5px;
  text-decoration-thickness: 2px;
  text-align: center;
  margin-bottom: 20px;
}

/* 料理紹介　共通 */
.ry_dish {
  margin-bottom: 30px;
  box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
}

.ry_dish h3,
.ry_party h3,
.ry_sake h3 {
  background-color: #c9a932;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #f8f7ee;
  font-family: "Noto Serif JP", serif;
  height: 3em;
}

.ry_party,
.ry_sake {
  margin-bottom: 0px;
  box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
}

.ry_text_box,
.ry_room_box,
.ry_sake_box {
  background-image: url(../images/wallpaper01.webp);
  background-position: center;
  background-size: auto;
  background-repeat: repeat;
  padding: 20px;
}

.ry_text_box h4,
.ry_sake_inner h4 {
  text-align: center;
  font-family: "Noto Serif JP", serif;
  text-decoration: underline;
  text-decoration-color: #c9a932;
  text-underline-offset: 5px;
  text-decoration-thickness: 2px;
  margin-bottom: 1em;
}

.ry_sake_inner img {
  margin-bottom: 10px;
}

.ry_price {
  text-align: center;
  margin-bottom: 1em;
}

.ry_description {
  font-size: 14px;
  margin-bottom: 1em;
}

.ry_sake {
  margin-bottom: 20px;
}

/*slick */
.slick-slider {
  margin-bottom: 30px;
}

.slick-slider ul {
  list-style: none;
}

/*  ここから飲み物ページ*/
.sa_feature {
  background-image: url(../images/fujiwara28b.webp);
}

/* 共通 */
.sa_1 table {
  width: 90%;
}

.sa_1 {
  margin-bottom: 30px;
  line-height: 2;
  font-size: 14px;
  padding-bottom: 10px;
  box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
  margin-top: 20px;
  background-image: url(../images/wallpaper01.webp);
}

.sa_1:last-of-type {
  margin-bottom: 0;
}

.sa_about_container {
  background-color: #ffffff;
  border-radius: 20px;
  padding: 10px 30px;
  margin: 30px auto;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.16);
}

.sa_about_container span {
  color: #992626;
}

.sa_h3 {
  font-family: "Noto Serif JP", serif;
  text-decoration: underline;
  text-decoration-color: #c9a932;
  text-underline-offset: 5px;
  text-decoration-thickness: 2px;
  text-align: center;
  margin-bottom: 20px;
}

/*  ここから地酒*/
.sa_alcohol_img {
  margin-bottom: 5px;
}

.sa_1 p {
  text-align: center;
}

.sa_1 h3 {
  background-color: #c9a932;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #f8f7ee;
  font-family: "Noto Serif JP", serif;
  height: 3em;
}

.sa_1 table {
  margin-left: 10px;
}

.alcohol p {
  margin-bottom: 5px;
  text-decoration: underline;
  text-decoration-color: #992626;
  text-underline-offset: 5px;
  text-decoration-thickness: 2px;
}

.alcohol table {
  line-height: 3;
  margin-left: 10px;
}

/* ここから地酒 */
.alcohol td:first-child {
  width: 46%;
}

/* ここから焼酎 */
.liquor td:first-child {
  width: 50%;
}

.beverage td:first-child {
  width: 64%;
}

.sa_liquor_img {
  margin-bottom: 5px;
}

.liquor p {
  margin-bottom: 5px;
  text-decoration: underline;
  text-decoration-color: #992626;
  text-underline-offset: 5px;
  text-decoration-thickness: 2px;
}

.liquor table {
  line-height: 3;
  margin-left: 30px;
}

/* ここから飲み物 */
.sa_beverage_img {
  margin-bottom: 10px;
}

.beverage table {
  line-height: 3;
  margin-left: 40px;
}

/* ここからソフトドリンク */
.soft table {
  margin-top: 5px;
}

.soft table {
  line-height: 3;
  margin-left: 40px;
}

.soft td:first-child {
  width: 64%;
}

/* アクセスページ */

/* キービジュアル */
.ac_feature {
  background-image: url(../images/fujiwara04b.webp);
}

/* 店舗名・住所 */
/* auto center repeat に変更！！！！*/
.ac_index {
  font-family: "Noto Serif JP", serif;
  background-image: url(../images/wallpaper01.webp);
  background-size: auto;
  background-position: center;
  background-repeat: repeat;
  height: 100px;
}

.ac_index table {
  display: flex;
  justify-content: center;
  /*左右中央揃え*/
  align-items: center;
  /*上下中央揃え*/
  height: 100px;
}

.ac_index table th {
  text-align: left;
  padding-right: 20px;
}

/* 写真数枚表示 */
.ac_images {
  margin-top: 30px;
  margin-bottom: 30px;
  position: relative;
  height: 220px;
}

.ac_imageitem {
  opacity: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-animation: anime 9s 0s infinite;
  animation: anime 9s 0s infinite;
}

.ac_imageitem:nth-of-type(2) {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.ac_imageitem:nth-of-type(3) {
  -webkit-animation-delay: 6s;
  animation-delay: 6s;
}

/* タイトルのアンダーライン */
.ac_title h3 {
  font-family: "Noto Serif JP", serif;
  text-decoration: underline;
  text-decoration-color: #992626;
  text-underline-offset: 5px;
  text-decoration-thickness: 2px;
  margin-bottom: 20px;
}

/* 電車でお越しの方 */
.ac_train {
  text-align: center;
  margin-bottom: 40px;
}

.ac_bytrain {
  font-family: "Noto Serif JP", serif;
  background-image: url(../images/linedecoration1.png);
  background-size: 100% 100%;
  /*coverから100％に変更*/
  background-position: center;
  background-repeat: no-repeat;
  height: 140px;
}

.ac_train h3 {
  margin-top: 15px;
}

.ac_train p {
  margin-bottom: 20px;
}

/* お車でお越しの方 */
.ac_car {
  text-align: center;
  margin-bottom: 30px;
}

.ac_bycar {
  font-family: "Noto Serif JP", serif;
  background-image: url(../images/linedecoration2.png);
  background-size: 100% 100%;
  /*coverから100％に変更*/
  background-position: center;
  background-repeat: no-repeat;
}

.ac_car h3 {
  margin-top: 15px;
}

.ac_car p {
  margin-bottom: 20px;
}

/* 電車・車　共通 */
.ac_title {
  display: flex;
  justify-content: center;
  align-items: center;
}

/*ここまでアクセス*/

/* メディアクエリ */
@media (min-width: 768px) {
  /* トップ共通 */
  .top_main h2 {
    margin-bottom: 60px;
  }

  /* ファーストビュー */
  .first_view {
    height: 650px;
  }

  /* トップアバウト（味処ふじわらについて） */
  .top_about {
    padding: 90px 0;
  }

  .top_about_inner {
    width: min(67%, 962px);
    line-height: 1.7;
  }

  .top_about_owner {
    display: flex;
    gap: 20px;
    margin-top: 50px;
  }

  .top_about_owner .img_box {
    width: 40%;
  }

  .top_about_owner .text_box {
    width: 60%;
    padding-left: 30px;
  }

  .owner {
    text-align: left;
  }

  .top_slider {
    width: 90%;
    max-width: 1296px;
    margin-inline: auto;
  }

  /* SPスライドをgridに変更 */
  .top_grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(30%, auto));
    gap: 2vw;
    justify-content: center;
    background-image: url(../images/wallpaper01.webp);
    background-position: center;
    background-size: auto;
    background-repeat: repeat;
    box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
    padding: 2vw;
    margin-bottom: 30px;
    list-style: none;
  }

  /* トップお料理について */
  .top_dishes {
    padding-top: 90px;
    margin-bottom: 40px;
  }

  .top_dishes_inner {
    width: min(67%, 962px);
  }

  /* トップバナー */
  .top_banner {
    width: min(80%, 1144px);
    margin-inline: auto;
    margin-bottom: 40px;
  }

  /* トップ予約のお願い */
  .top_reservation {
    width: min(67%, 962px);
    padding: 90px 80px;
  }

  .top_reservation_inner p {
    margin-bottom: 1em;
  }

  /* トップ店舗情報 */
  .top_information_inner {
    width: min(67%, 962px);
    padding-top: 30px;
    padding-bottom: 40px;
  }

  .top_information h2 {
    margin-bottom: 0;
  }

  .top_information table th {
    width: 50%;
  }

  .top_information table td {
    width: 50%;
    padding-top: 30px;
    padding-bottom: 20px;
  }

  .top_calendar_facebook_container {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    width: 700px;
    margin-inline: auto;
  }

  .googlemap iframe {
    height: 336px;
  }

  /* 料理ページ */

  /* commonで共通？ */
  .feature {
    height: 220px;
  }

  h2 {
    font-size: 36px;
  }

  .ry_wrapper {
    width: 80%;
  }

  /* 料理　目次 */
  .ry_index {
    max-width: 680px;
  }

  .ry_index ul {
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: 20px;
    margin-bottom: 30px;
  }

  /* 料理　予約について */
  .ry_reservation {
    text-align: center;
  }

  /* 料理紹介　共通 */

  /* 全体のボックスシャドウを消す */
  .ry_dish,
  .ry_party,
  .ry_sake {
    box-shadow: revert;
  }

  .ry_container {
    display: grid;
    grid-template-columns: 10vw 1fr 1fr 2fr;
    grid-template-rows: max-content 1fr 3vw;
    /* h3の高さはコンテンツに合わせ、下のはみ出した部分は2vwで固定 */
  }

  .ry_container h3 {
    grid-column: 1 / 4;
    grid-row: 1 / 2;
    height: 4vw;
  }

  .ry_img_box {
    grid-column: 1 / 4;
    grid-row: 2 / 3;
    z-index: 50;
  }

  .ry_description {
    font-size: clamp(16px, 1.1vw, 20px);
  }

  /* お子さまの案内の画像をずらすために追加 */
  .ry_child {
    grid-column: 1 / 4;
    grid-row: 1 / 2;
    height: 4vw;
  }

  .ry_img_box_child {
    grid-column: 1 / 4;
    grid-row: 1 / 3;
    z-index: 50;
  }

  .ry_text_box,
  .ry_room_box {
    grid-column: 2 / 5;
    grid-row: 2 / 4;
    box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }

  .ry_text_inner {
    width: 47%;
    justify-self: end;
  }

  /* 単品料理写真を並べて表示 */
  .wrapper_pc {
    width: 80%;
    margin: auto;
  }

  .ry_grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(30%, auto));
    gap: 2vw;
    justify-content: center;
    background-image: url(../images/wallpaper01.webp);
    background-position: center;
    background-size: auto;
    background-repeat: repeat;
    box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
    padding: 2vw;
    margin-bottom: 30px;
    list-style: none;
  }

  /* 宴会の店内写真、お酒のメニュー */
  .ry_room,
  .ry_sake_box {
    display: flex;
    justify-content: center;
  }

  .ry_room img {
    width: 30%;
    margin: 10px;
  }

  .ry_party,
  .ry_sake {
    margin-bottom: 10px;
  }

  .ry_sake_box {
    box-shadow: 5px 5px 6px rgba(0, 0, 0, 0.16);
  }

  .ry_button {
    margin: 30px auto;
    padding: 0;
  }

  /* お酒のページ */
  /* ここからお酒について */
  .sa_about_container p {
    text-align: center;
  }

  /* ここからmain_visual */
  .sa_feature {
    height: 220px;
  }

  .sa_1 {
    width: 768px;
    margin-bottom: 80px;
    font-size: clamp(16px, 1.1vw, 20px);
  }

  .sa_1 table {
    margin-left: 60px;
  }

  /* ここから地酒 */
  .alcohol td:first-child {
    width: 42%;
  }

  .sa_alcohol_img {
    width: 768px;
    margin-bottom: 10px;
  }

  .alcohol p {
    margin-bottom: 10px;
  }

  /* ここから焼酎 */
  .liquor td:first-child {
    width: 44%;
  }

  .sa_liquor_img {
    width: 768px;
    margin-bottom: 10px;
  }

  .liquor p {
    margin-bottom: 10px;
  }

  /* ここから飲み物 */
  .beverage td:first-child {
    width: 64%;
  }

  .sa_beverage_img {
    width: 768px;
    margin-bottom: 10px;
  }

  /* ここからソフトドリンク */
  .soft td:first-child {
    width: 64%;
  }

  .soft table {
    margin-top: 10px;
  }

  /* ここからボタン */
  .pc_sa_button_area {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .pc_sa_button {
    width: 300px;
  }

  /* アクセスページ */
  .feature {
    height: 220px;
  }

  /* 店舗名・住所 */
  .ac_index {
    height: 220px;
  }

  .ac_index table {
    height: 220px;
    line-height: 3;
  }

  .ac_index table th {
    padding-right: 200px;
  }

  /* 写真数枚表示 */
  .ac_images {
    margin-top: 50px;
    margin-bottom: 70px;
    height: 400px;
    width: 90%;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 2fr;
    grid-template-rows: 400px;
  }

  .ac_imageitem {
    position: relative;
  }

  .ac_imageitem1 {
    grid-row: 1;
    grid-column: 1/3;
  }

  .ac_imageitem2 {
    grid-row: 1;
    grid-column: 2/5;
  }

  .ac_imageitem3 {
    grid-row: 1;
    grid-column: 4/6;
  }

  /* 電車でお越しの方 */
  .ac_train {
    margin-bottom: 70px;
  }

  .ac_bytrain {
    height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .ac_trainmap {
    width: 500px;
    height: 500px;
  }

  /* お車でお越しの方 */
  .ac_car {
    margin-bottom: 70px;
  }

  .ac_bycar {
    height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .ac_carmap {
    width: 500px;
    height: 500px;
  }

  /* 共通 */
  .ac_broff {
    display: none;
  }

  /* グーグルマップ */
  .googlemap iframe {
    height: 336px;
  }

  /* メディアクエリ↑この上に書く */
}
