@charset "UTF-8";


/* ---------------------------------- 店舗 ---------------------------------- */  

#sec01 {
  overflow: hidden;
}

#sec01 .shop-flex {
  position: relative;
}


#sec01 .blur-1 {
  position: absolute;
  z-index: -1;
  top: -120%;
  right: -50%;
}
#sec01 .blur-2 {
  position: absolute;
  z-index: -1;
  top: -60%;
  left: -66%;
}


.shop-kind .shop {
    width: 95%;
  margin: 0 auto;
  max-width: 1000px;

  opacity: 0;
  filter: blur(10px);
  transition: 1s ease all;
}
.shop-kind .shop.active {
  opacity: 1;
  filter: blur(0);
}

.shop {
  font-size: min(3.255vw,30px);
  line-height: 2;
  font-family: "Zen Old Mincho", serif;
}


.shop-flex {
  display: flex;
  width: 90%;
  max-width: 890px;
  margin: 0 auto;
  gap: 3em;
}

.flex-item-1 {
  width: 55%;
}
.flex-item-2 {
  display: flex;
  flex-direction: column;
  gap: 1em;
  width: 45%;

  opacity: 0;
  filter: blur(10px);
  transition: 1s ease all;
}
.flex-item-2.active {
  opacity: 1;
  filter: blur(0);
}




.map {
  width: 100%;
  height: auto;
  aspect-ratio: 5 / 3;
  box-shadow: .11em .27em .55em rgba(34, 73, 105, 0.2) ;
}

.map iframe {
  width: 100%;
  height: 100%;
}


table {
    line-height: 2;
    font-family: "Zen Old Mincho", serif;

    opacity: 0;
    transform: translateY(1em);
    transition: 1s ease all;
}
table.active {
  opacity: 1;
  transform: translateY(0);
}

.shop-flex table tr:nth-of-type(2n+1) {
  background: initial;
}

.shop-flex table tr {
  border-bottom: solid 1px #333333;
}
.shop-flex table tr:last-child {
  border-bottom: initial;
}

.shop-flex table:not(.has-border-color) :where(th, td) {
  border: initial;
  padding: .25em .5em .25em 1em;
}
.shop-flex table td:nth-child(1) {
  border-right: solid 1px #333333;
}

.table-bar {
  padding: 0.5em 1em;
  color: #fff;
  border-radius: 1em 0 0 1em;
  margin-bottom: .5em;
  background: linear-gradient(to right, #34771E 0%, rgba(52, 119, 30, 0) 100%);

  opacity: 0;
  transform: translateX(-1em);
  transition: 1s ease all;
}
.table-bar.active {
  opacity: 1;
  transform: translateX(0);
}


.table-bar p {
    line-height: 1;
}
p.shop-item {
  line-height: 1.5;
  padding: 0 .8em;

  opacity: 0;
  transform: translateY(1em);
  transition: 1s ease all;
}
p.shop-item.active {
  opacity: 1;
  transform: translateY(0);
} 

#shop-access .flex {
  display: flex;
  gap: 3em;
}

.shop02 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  width: 50%;
  padding: 2em;
  background: #fff;
}
.shop02 .shop {
  line-height: 1;
}


.shop02 table tr:nth-of-type(2n+1) {
  background-color: initial;
}
.shop02 table:not(.has-border-color) :where(th, td) {
  border: initial;
}
.shop02 table tr {
  border-bottom: solid 1px #333333;
}
.shop02 table tr:last-child {
  border-bottom: initial;
}
.shop02 table td:nth-child(1) {
  border-right: solid 1px #333333;
  width: 26%;
}
.shop02 table tr td {
  padding: .25em .5em .25em .5em;
  font-size: min(1.8vw , 1em);
}


.shop02-flex {
  display: flex;
  margin-bottom: 1.5em;
  align-items: center;

  opacity: 0;
  filter: blur(10px);
  transition: 1s ease all;

}
.shop02-flex.active {
  opacity: 1;
  filter: blur(0);
}

.reservation {
  background: #D9D9D9;
  margin-left: 1.5em;
  align-content: center;
  padding: 0 1em;
  font-size: .8em;
}


.btn-2 {
  position: relative;
  display: inline-block;
  padding: .8em 2.5em .8em 2em;
  max-width: 12em;
  background-color: #34771E;
  background: #34771E url(../images/external-link-w.webp) no-repeat 90% 50% / 1em;
  text-align: center;
  transition: .2s ease all;
  border: 1px solid #34771E;

  opacity: 0;
  transform: translateY(1em);
  transition: 1s ease all;
}
.btn-2.active {
  opacity: 1;
  transform: translateY(0);
}

.btn-2 a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.btn-2:hover {
  background: #fff url(../images/external-link.webp) no-repeat 95% 50% / 1em;
}

.btn-2 p {
  color: #fff;
  line-height: 1;
}
.btn-2:hover p {
  color: #34771E;
}



#shop-access .sec-in {
  max-width: 1000px;
}


table th, table td {
  font-size: 1em !important;
}

.flex-img-wrap  {
  margin-bottom: 1em;
}



/*768px以下*/
@media screen and (max-width: 768px){

  .hero-img#access .inner h2 {
    transform: translate(0 , 8%);
  }

  .shop-kind .shop {
    width: 100%;
    /* margin: 0 auto; */
    font-size: min(6.875vw,28px);
  }

  .shop-kind table {
    width: 90%;
    margin: 0 0 20px auto;
  }

  #shop-access .shop {
    font-size: min(6.875vw,28px);
  }

  #shop-access .flex {
    display: block;

  }
  
  .shop-flex {
    flex-direction: column;
    width: 100%;
    gap: 1em;
  }

  .shop02 {
    width: 100%;
    margin-bottom: 2em;
  }
  .shop02:last-child {
    margin-bottom: initial;
  }

  .flex-item {
    width: 100%;
  }

  .shop-kind table {
    margin: 0 auto 1em auto;
  }


  .flex-item-2 img.shop-img {
    display: none
  }

  #shop-access .sec-in {
    max-width: 600px;
  }
  

}