/* RISH SAVE — layout primitives (self-contained; replaces the framework CSS) */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Hiragino Kaku Gothic ProN', 'Yu Gothic', Meiryo, sans-serif;
  font-size: 16px; line-height: 1.7; -webkit-font-smoothing: antialiased;
}
img, svg { vertical-align: middle; }
img { max-width: 100%; }
button { font: inherit; }
h1, h2, h3, h4, p { margin: 0; }
ul { margin: 0; padding: 0; }

/* --- containers --- */
.container-xl, .container-fluid {
  width: 100%; margin-inline: auto;
  padding-left: 17px; padding-right: 17px;
}
@media (min-width: 1240px) { .container-xl { max-width: 1204px; } }
@media (min-width: 576px) { .container-xl, .container-fluid { padding-left: 24px; padding-right: 24px; } }
@media (min-width: 992px) { .container-fluid { padding-left: 40px; padding-right: 40px; } }

/* --- utilities used by the markup --- */
.mb-0 { margin-bottom: 0; }
.p-0 { padding: 0; }
.px-0 { padding-left: 0; padding-right: 0; }
.fs-8 { font-size: 13px; }
.list-unstyled { list-style: none; margin: 0; padding: 0; }
.justify-content-end { justify-content: flex-end; }
@media (min-width: 768px) {
  .d-md-none { display: none !important; }
  .mx-md-3 { margin-left: 1rem; margin-right: 1rem; }
  .ms-md-3 { margin-left: 1rem; }
}

/* --- header --- */
.header { position: relative; }
.navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1035;
  display: flex; align-items: center; min-height: 88px;
}
.navbar > .container-fluid { display: flex; align-items: center; gap: 24px; padding-left: 17px; padding-right: 17px; }
@media (min-width: 576px) { .navbar > .container-fluid { padding-left: 24px; padding-right: 24px; } }
@media (min-width: 992px) { .navbar > .container-fluid { padding-left: 40px; padding-right: 40px; } }
.navbar-brand { display: inline-flex; align-items: center; text-decoration: none; margin-right: auto; }
.navbar-toggler {
  display: none; align-items: center; gap: 8px;
  padding: 8px 4px; background: none; border: 0; cursor: pointer;
  font-size: 11px; font-weight: 700; letter-spacing: .14em;
}
.navbar-toggler-icon { position: relative; display: block; width: 26px; height: 14px; }
.navbar-toggler-icon::before, .navbar-toggler-icon::after {
  content: ""; position: absolute; left: 0; width: 26px; height: 2px;
  background: currentColor; transition: transform .3s, top .3s;
}
.navbar-toggler-icon::before { top: 0; }
.navbar-toggler-icon::after { top: 12px; }
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before { top: 6px; transform: rotate(45deg); }
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after { top: 6px; transform: rotate(-45deg); }

/* --- desktop nav --- */
@media (min-width: 992px) {
  .navbar-collapse { display: flex !important; flex-grow: 1; align-items: center; }
  .offcanvas-body { display: flex; align-items: center; width: 100%; }
  .accordion { display: flex; align-items: center; }
  .accordion-item { position: relative; }
  .accordion-header { margin: 0; }
  .accordion-button, .accordion-button-link {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 4px; background: none; border: 0; cursor: pointer;
    font-size: 14px; font-weight: 700; letter-spacing: .04em;
    text-decoration: none; white-space: nowrap;
  }
  .accordion-button .icon, .accordion-button-link .icon { display: none; }
  .accordion-collapse {
    position: absolute; top: 100%; right: 0; min-width: 240px;
    padding: 8px 0; opacity: 0; visibility: hidden;
    transform: translateY(6px); transition: opacity .28s, transform .28s, visibility .28s;
  }
  .accordion-item:hover > .accordion-collapse,
  .accordion-collapse.show { opacity: 1; visibility: visible; transform: translateY(0); }
  .accordion-body ul { display: flex; flex-direction: column; }
  .accordion-body a {
    display: block; padding: 11px 22px; font-size: 13.5px;
    text-decoration: none; transition: color .25s, background .25s;
  }
  .btn-close { display: none; }
}

/* --- mobile drawer --- */
@media (max-width: 991px) {
  .navbar { min-height: 72px; }
  .navbar-toggler { display: inline-flex; }
  .offcanvas {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: 1045;
    width: min(360px, 86vw); overflow-y: auto;
    transform: translateX(100%); transition: transform .38s cubic-bezier(.2,.7,.3,1);
    visibility: hidden;
  }
  .offcanvas.show { transform: translateX(0); visibility: visible; }
  .offcanvas-body { padding: 88px 28px 40px; }
  .accordion-item { border-bottom: 1px solid currentColor; }
  .accordion-header { margin: 0; }
  .accordion-button, .accordion-button-link {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    width: 100%; padding: 20px 4px; background: none; border: 0; cursor: pointer;
    font-size: 15px; font-weight: 700; letter-spacing: .04em; text-align: left; text-decoration: none;
  }
  .accordion-button:not(.accordion-button-link)::after {
    content: ""; flex: none; width: 9px; height: 9px; margin-right: 4px;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-3px); transition: transform .3s;
  }
  .accordion-button:not(.collapsed)::after { transform: rotate(-135deg) translateY(-3px); }
  .accordion-collapse { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s cubic-bezier(.2,.7,.3,1); }
  .accordion-collapse.show { grid-template-rows: 1fr; }
  .accordion-body { overflow: hidden; }
  .accordion-body a { display: block; padding: 13px 4px 13px 18px; font-size: 14px; text-decoration: none; }
  .btn-close {
    display: inline-flex; align-items: center; gap: 10px;
    margin-top: 32px; padding: 12px 4px; background: none; border: 0; cursor: pointer;
    font-size: 11px; font-weight: 700; letter-spacing: .16em;
  }
  .btn-close-icon { position: relative; display: block; width: 16px; height: 16px; }
  .btn-close-icon::before, .btn-close-icon::after {
    content: ""; position: absolute; left: 0; top: 7px; width: 16px; height: 2px; background: currentColor;
  }
  .btn-close-icon::before { transform: rotate(45deg); }
  .btn-close-icon::after { transform: rotate(-45deg); }
  .rs-backdrop {
    position: fixed; inset: 0; z-index: 1040;
    background: rgba(20,24,27,.5); opacity: 0; transition: opacity .3s;
  }
  .rs-backdrop.show { opacity: 1; }
  body.rs-nav-open { overflow: hidden; }
}

/* --- footer --- */
.footer { position: relative; }
.footer-top { padding-top: 72px; }
.footer-bottom { padding: 24px 0 28px; text-align: center; }
.footer-bottom p { margin: 0; }
.footer a { text-decoration: none; }

/* --- mobile fixed CTA --- */
.mobile-footer-cta { display: none; }
@media (max-width: 767px) { .mobile-footer-cta { display: grid !important; } }
