@charset "UTF-8";

/* =====================================================
  CONTAINER / MAIN
===================================================== */

.fd-container{
  width:min(100%, var(--fd-container));
  margin-inline:auto;
  padding-inline:var(--fd-pad-pc);
}

.fd-main{
  min-height:60vh;
}

.fd-section{
  padding:96px 0;
}

.fd-section--intro{
  padding:72px 0 48px;
}

.fd-page{
  padding:72px 0 96px;
}


/* =====================================================
  FLOAT MENU BUTTON
===================================================== */

.fd-menu-float{
  position:fixed;
  top:0;
  right:0;
  z-index:210;

  width:48px;
  height:48px;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;

  background:#1f2a44;
  color:#fff;

  border-radius:0;
}

.fd-menu-float__label{
  display:none;
}

.fd-menu-float__bars{
  width:16px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.fd-menu-float__bars span{
  display:block;
  width:100%;
  height:1px;
  background:#fff;
}

.fd-menu-float__bars span:nth-child(3){
  display:none;
}


/* =====================================================
  DRAWER
===================================================== */

.fd-drawer{
  position:fixed;
  inset:0;
  z-index:200;

  background:#fff;

  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transition:
    opacity .3s ease,
    visibility .3s ease;
}

.fd-drawer.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

.fd-drawer__inner{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.fd-drawer__head{
  min-height:72px;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  border-bottom:1px solid var(--fd-line);
}

.fd-drawer__title,
.fd-menu-close{
  font-size:12px;
  line-height:1;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.fd-drawer__nav{
  padding-top:56px;
  padding-bottom:56px;
}

.fd-drawer__menu{
  display:flex;
  flex-direction:column;
  gap:0;

  border-top:0px solid var(--fd-line);
}

.fd-drawer__menu li{
  border-bottom:0px solid var(--fd-line);
}

.fd-drawer__menu a{
  display:block;

  padding:18px 0;

  font-size:16px;
  line-height:1.6;

  letter-spacing:.08em;
  text-transform:uppercase;
}


/* =====================================================
  FOOTER
===================================================== */

.fd-footer{
  border-top:1px solid var(--fd-line);
  background:#fff;
}

.fd-footer__inner{
  padding-top:28px;
  padding-bottom:28px;

  display:grid;
  gap:18px;
}

.fd-footer__logo{
  display:inline-block;

  color:var(--fd-text);

  font-size:12px;
  line-height:1;

  letter-spacing:.16em;
  text-transform:uppercase;
}

.fd-footer__menu{
  display:flex;
  flex-wrap:wrap;

  gap:10px 18px;
}

.fd-footer__menu a{
  font-size:12px;
  line-height:1.7;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.fd-footer__copy small{
  display:block;

  color:var(--fd-text-soft);

  font-size:11px;
  letter-spacing:.08em;
}


/* =====================================================
  ENTRY
===================================================== */

.fd-entry{
  max-width:900px;
}

.fd-entry__title{
  margin-bottom:24px;

  font-size:28px;
  line-height:1.4;

  font-weight:500;
  letter-spacing:.06em;
}

.fd-entry__body > * + *{
  margin-top:1.2em;
}


/* =====================================================
  MOBILE
===================================================== */

@media (max-width:767px){

  .fd-container{
    padding-inline:var(--fd-pad-sp);
  }

  .fd-section{
    padding:72px 0;
  }

  .fd-section--intro{
    padding:56px 0 32px;
  }

  .fd-page{
    padding:56px 0 72px;
  }

  .fd-menu-float{
    width:48px;
    height:48px;
    gap:4px;
  }

  .fd-menu-float__bars{
    width:16px;
    gap:4px;
  }

  .fd-drawer__nav{
    padding-top:36px;
    padding-bottom:36px;
  }

  .fd-drawer__menu a{
    padding:16px 0;
    font-size:15px;
  }

}

body.is-menu-open{
  overflow:hidden;
}