@charset "UTF-8";



/* ===== ベース ===== */
  body{
    margin:0;
    background:#EFEAE0;
    font-family:'Noto Sans JP',sans-serif;
    color:#22221F;
  }
  a{color:inherit;text-decoration:none;cursor:pointer}
  a:hover{opacity:.72}

.site-header {
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
padding:20px 44px;
border-bottom:1px solid #CBC0A0;
background:#EFEAE0;
z-index:30;

}
.header-logo {
   display:flex;
   align-items:baseline;
   gap:11px;
}
.header-title {
  font-family:'Shippori Mincho',serif;
  font-size:21px;
  letter-spacing:.1em;
}
.logo-sub {
   font-family:'Cormorant Garamond',serif;
   font-style:italic;
   font-size:12.5px;
   letter-spacing:.16em;
   color:#B08A4E;
}

.nav-toggle {
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  pointer-events:none;
}
.nav-btn {
display:none;
flex-direction:column;
justify-content:center;
align-items:center;
gap:5px;
width:34px;
height:34px;
cursor:pointer;
flex-shrink:0;

}
.nav-btn span {
  display:block;
  height:2px;
  width:23px;
  background:#22221F;
  border-radius:2px;
  transition:transform .28s ease,opacity .2s ease;
}
.site-nav {
  display:flex;
  gap:19px;
  font-size:12px;
  letter-spacing:.02em;
  color:#4C4A40;
  flex-wrap:wrap;
  justify-content:flex-end;
}


  /* ===== スマホ表示（768px 以下） ===== */
  @media (max-width:768px){
    .mpx{padding-left:20px!important;padding-right:20px!important}
    .nav-btn{display:flex!important}
    .site-nav{display:none!important;position:absolute;top:100%;left:0;right:0;flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch;justify-content:flex-start!important;gap:0!important;background:#EFEAE0;border-bottom:1px solid #CBC0A0;padding:6px 20px 14px!important;box-shadow:0 16px 26px rgba(34,34,31,.13)}
    #nav:checked ~ .site-nav{display:flex!important}
    .site-nav span{font-size:14px!important;padding:14px 2px;border-bottom:1px solid #E0D6BE;color:#22221F}
    #nav:checked ~ .nav-btn span:nth-child(1){transform:translateY(7px) rotate(45deg)}
    #nav:checked ~ .nav-btn span:nth-child(2){opacity:0}
    #nav:checked ~ .nav-btn span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  }