*{margin:0;padding:0;box-sizing:border-box;}
body{background:#f5f1ec;font-family:"Yu Mincho","Hiragino Mincho ProN",serif;}
img{display:block;width:100%;height:auto;}
main{max-width:590px;margin:auto;}

.header,.footer{
  position:fixed;left:50%;transform:translateX(-50%);
  max-width:590px;width:100%;z-index:999;
  opacity:0;transition:.5s;
}
.header{top:0;}
.footer{bottom:0;}
.show-bar{opacity:1;}

/* FVスライダー：pictureタグ対応 */
.fv-slider{position:relative;max-width:590px;margin:auto;aspect-ratio:590/900;overflow:hidden;}
.fv-slider picture{position:absolute;inset:0;width:100%;height:100%;}
.fv{
  position:absolute;inset:0;width:100%;height:100%;
  opacity:0;
  transition:opacity 1.5s ease;
  object-fit:cover;
}
.fv.active{opacity:1;}

/* フェードアップ：will-changeでGPU合成を促進 */
.fade-up{
  opacity:0;
  transform:translateY(40px);
  transition:opacity 1s ease,transform 1s ease;
  will-change:opacity,transform;
}
.fade-up.show{
  opacity:1;
  transform:translateY(0);
}

.accordion-wrap{
  max-width:590px;
  margin:auto;
  background:#f5f5f6;
}
.accordion-btn{
  width:100%;
  padding:22px;
  border:none;
  background:#f5f5f6;
  display:flex;
  justify-content:center;
  align-items:center;
  font-size:14px;
  letter-spacing:.15em;
  cursor:pointer;
  color:#003b75;
  text-align:center;
  gap:8px;
}
.icon{font-size:24px;}
.accordion-content{
  max-height:0;
  overflow:hidden;
  transition:max-height .6s ease;
}

/* 事前予約リンク：スクロール後に表示 */
.fv-reserve{
  position:fixed;
  right:15%;
  top:55%;
  color:#fff;
  text-decoration:underline;
  z-index:20;
  white-space:nowrap;
  font-size:18px;
  letter-spacing:.08em;
  opacity:0;
  transition:.5s;
  pointer-events:none;
}
.fv-reserve.show-bar{
  opacity:1;
  pointer-events:auto;
}

/* SNSフッター + コピーライト */
.sns-footer{
  max-width:590px;
  margin:0 auto;
  background:#f1f0ee;
  padding:32px 24px 200px;
  text-align:center;
}
.sns-footer-icons{
  display:flex;
  justify-content:center;
  gap:28px;
  margin-bottom:40px;
}
.sns-footer-icons a{
  display:flex;
  align-items:center;
  justify-content:center;
  width:52px;
  height:52px;
  border-radius:50%;
  border:1.5px solid #8c7f76;
  color:#8c7f76;
  text-decoration:none;
  transition:background .2s,color .2s;
}
.sns-footer-icons a:hover,
.sns-footer-icons a:focus{
  background:#8c7f76;
  color:#f1f0ee;
  outline:none;
}
.sns-footer-icons svg{
  width:24px;
  height:24px;
  display:block;
}
.copyright{
  font-size:10px;
  letter-spacing:.08em;
  color:#8c7f76;
  font-family:"Yu Mincho","Hiragino Mincho ProN",serif;
}

/* 地図セクション */
.map-section{
  max-width:590px;
  margin:0 auto;
  padding:40px;
  background-color:#d5cec6;
}
.map-wrap{
  width:100%;
  overflow:hidden;
  line-height:0;
}
.map-wrap iframe{
  display:block;
  width:100%;
  height:450px;
  border:0;
}

/* PC：WebPをfirst choice、JPGをフォールバック */
@media (min-width:769px){
  body{
    background-image:url('../img/Background.webp'),url('../img/Background.jpg');
    background-size:cover;
    background-position:center top;
    background-attachment:fixed;
    background-repeat:no-repeat;
  }
  main,
  .fv-slider,
  .accordion-wrap{
    width:590px;
    max-width:590px;
    margin-left:auto;
    margin-right:80px;
    background:transparent;
  }
  .map-section{
    width:590px;
    max-width:590px;
    margin-left:auto;
    margin-right:80px;
  }
  .header,.footer{
    left:auto;
    right:80px;
    transform:none;
    width:590px;
    max-width:590px;
  }
  .fv-reserve{
    right:calc(80px + 15%);
  }
}