/* Header, navigation and footer. Measurements follow the saved reference site (1000px content width). */
.site-header {background:#fff;border:0;position:relative;z-index:50}
.intro-menu {background:#fff}
.intro-inner {max-width:1040px;margin:0 auto;padding:10px 20px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px}
.info-text {margin:0;font-size:13px;line-height:1.6;color:#666}
.header-contact {display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:10px 14px;margin:0;padding:0 20px 0 0;list-style:none;font-weight:700;font-size:10px;line-height:22px;color:#666}
.header-contact .tel a {display:block}
.header-contact .tel img {display:block;width:157px;height:auto}
.header-contact .contact {font-size:12px}
.header-contact .contact a,.header-contact .pending-contact {display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:#666}
.header-contact .pending-contact {color:#999}
.header-contact .contact img {display:block;width:20px;height:auto}

.header-menu {border:1px solid #ddd;border-left:0;border-right:0;padding:30px 0}
.header-inner {max-width:1040px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:14px}
.site-header .brand {display:block;flex-shrink:0;text-decoration:none}
.site-header .brand img {display:block;height:43px;width:auto}
.desktop-nav {margin-left:auto}
.nav-menu {display:flex;align-items:flex-start;gap:10px;margin:0;padding:0;list-style:none}
.nav-menu>li {position:relative}
.menu-icon>a,.menu-icon>.menu-static {display:block;padding:0 6px;text-align:center;font-weight:700;text-decoration:none;color:#666;cursor:pointer}
.menu-icon img {display:inline-block;width:28px;height:auto}
.menu-icon .label {display:block;margin-top:5px;font-size:10px;line-height:1.2;white-space:nowrap}
.store-icons {gap:6px}
.store-icons img {width:17px}
.menu-disabled {opacity:.55}
.menu-disabled .menu-static {cursor:default}

/* Dropdowns open on hover or keyboard focus, as on the reference site. */
.nav-menu-child {display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);z-index:60;width:max-content;max-width:340px;max-height:72vh;overflow:auto;margin:0;padding:0;list-style:none;background:#eaeaea;text-align:left;font-size:13px;font-weight:700;box-shadow:0 8px 20px #0002}
.nav-menu>li:hover>.nav-menu-child,.nav-menu>li:focus-within>.nav-menu-child {display:block}
.nav-menu-child li:not(:last-child)>a,.nav-menu-child li:not(:last-child)>.pending-link {border-bottom:1px solid #ccc}
.nav-menu-child a,.nav-menu-child .pending-link {display:flex;justify-content:space-between;align-items:center;gap:18px;padding:8px 22px;color:#666;text-decoration:none;white-space:nowrap}
.nav-menu-child a:hover {background:#00915db3;color:#fff}
.nav-menu-child a:hover .dropdown-count {color:#fff}
.nav-menu-child .dropdown-count {color:#00915d;font-weight:700}
.nav-menu-child .group-title p {margin:0;padding:8px 22px;background:#666;color:#fff;text-align:center}
.nav-menu-child .group-title:nth-of-type(n+3) p {background:#999}
.pending-link {color:#999;cursor:default}
.pending-link small {display:inline-block;font-size:10px;line-height:1.4;border:1px solid #ddd;border-radius:3px;padding:1px 4px;margin-left:6px;color:#999;font-weight:400;white-space:nowrap}

.header-search {position:relative;width:184px;flex-shrink:0}
.header-search input {display:block;width:100%;height:38px;padding:6px 66px 6px 10px;border:2px solid #ccc;border-radius:5px;font-size:13px;background:#fff;color:#666;box-sizing:border-box}
.header-search button {position:absolute;top:0;bottom:0;right:0;width:60px;border:0;border-radius:0 5px 5px 0;background:#ccc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2'%3E%3Ccircle cx='6.5' cy='6.5' r='5'/%3E%3Cpath d='M10.5 10.5 15 15'/%3E%3C/svg%3E") center/16px no-repeat;cursor:pointer}
.header-search button:hover {background-color:#aaa}

.mobile-nav {display:none}
/* Collapsible menu groups: used by the header menu (<768px) and the bottom bar's メニュー panel (<992px). */
.mobile-sub {border:1px solid #ddd;border-radius:5px;background:#fff;margin-top:10px;padding:0 15px}
.mobile-sub>summary {cursor:pointer;padding:13px 0;font-weight:700}
.mobile-sub ul {margin:0;padding:0 0 8px;list-style:none;border-top:1px solid #ddd}
.mobile-sub li+li {border-top:1px solid #eee}
.mobile-sub li a,.mobile-sub li .pending-link {display:flex;justify-content:space-between;padding:10px 0;color:#666;text-decoration:none;font-size:13px}
.mobile-sub .group-title p {margin:8px 0 0;padding:6px 10px;background:#999;color:#fff;font-size:12px}
.mobile-sub-link {display:none}
.dropdown-count {color:#00915d}

/* Phone/tablet bottom bar and its slide-up panels (live site: #bottomFixMenu, shown below 992px). */
.bottom-bar,.sp-panel {display:none}
@media(max-width:991px){
  .bottom-bar {display:block;position:fixed;left:0;right:0;bottom:0;z-index:998;background:#fff;border-top:1px solid #d3d3d3}
  .bottom-bar ul {display:flex;margin:0;padding:8px 10px;list-style:none}
  .bottom-bar li {flex:1 1 0;min-width:0}
  .bar-btn {display:block;width:100%;margin:0;padding:0;border:0;background:none;font:inherit;font-size:10px;line-height:1.2;color:#666;text-align:center;cursor:pointer}
  .bar-btn img {display:block;width:28px;height:auto;margin:0 auto 5px}
  .bar-btn[aria-expanded="true"] {color:#00915d;font-weight:700}
  .bar-disabled {opacity:.55}
  .bar-disabled .bar-btn {cursor:default}
  .copy-right {padding-bottom:88px}  /* keep the copyright line clear of the fixed bar */

  .sp-panel {display:block;position:fixed;top:0;left:0;right:0;bottom:0;box-sizing:border-box;padding:20px 15px 88px;overflow-y:auto;background:#f7f7f7;z-index:990;visibility:hidden;transform:translateY(100%);transition:transform .3s ease,visibility 0s linear .3s}
  .sp-panel.is-open {visibility:visible;transform:none;transition:transform .3s ease}
  .sp-panel h2 {margin:0 0 14px;padding:12px 15px 0;font-size:1.4em;text-align:center;color:#666}
  .sp-list {margin:0;padding:4px 15px;list-style:none;background:#fff;border:1px solid #ddd;border-radius:5px}
  .sp-list li:not(:last-child) {border-bottom:1px solid #ccc}
  .sp-list a,.sp-list .pending-link {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 7px;color:#666;text-decoration:none;font-size:14px}
  .sp-list .group-title p {margin:8px 0;padding:6px 10px;background:#999;color:#fff;font-size:12px;text-align:center}
  .sp-panel.sp-search {top:auto;padding:25px 15px 88px;background:#f2f2f2;z-index:991}
  .sp-search-box {position:relative;background:#fff;border:1px solid #aaa;border-radius:4px}
  .sp-search-box input {display:block;width:100%;box-sizing:border-box;padding:12px 56px 12px 12px;border:0;background:transparent;font-size:16px;color:#666}
  .sp-search-box input:focus {outline:2px solid #00915d;outline-offset:-2px}
  .sp-search-box button {position:absolute;top:0;bottom:0;right:0;width:52px;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23666' stroke-width='2'%3E%3Ccircle cx='6.5' cy='6.5' r='5'/%3E%3Cpath d='M10.5 10.5 15 15'/%3E%3C/svg%3E") center/18px no-repeat;cursor:pointer}
  html.sp-lock {overflow:hidden}
}
@media(prefers-reduced-motion:reduce){.sp-panel,.sp-panel.is-open {transition:none}}
@media print{.bottom-bar,.sp-panel {display:none}}

.site-footer {background:#f7f7f7;color:#666;text-align:left;padding:0;border:0;font-size:14px}
.site-footer a {text-decoration:none;color:#666}
.site-footer a:hover {text-decoration:underline}
.footer-container {max-width:1040px;margin:0 auto;padding:40px 20px 50px}
.footer-inner {display:flex;flex-wrap:wrap;gap:35px 45px}
.site-footer dl {margin:0;flex:1 1 185px;min-width:0}
.site-footer dt {font-size:15px;border-bottom:1px solid #666;padding-bottom:5px;margin-bottom:15px}
.site-footer dd {margin:0}
.site-footer dd ul {margin:0;padding:0;list-style:none;font-size:12px;font-weight:700}
.site-footer dd li+li {margin-top:10px}
.footer-note {max-width:1040px;margin:0 auto;padding:0 20px 24px;color:#999;font-size:12px}
.copy-right {margin:0;padding:20px 0;background:#fff;text-align:center;font-size:10px;color:#666}
.page-top-btn {position:fixed;right:20px;bottom:80px;z-index:40;opacity:0;pointer-events:none;transition:opacity .25s}
.page-top-btn.is-visible {opacity:1;pointer-events:auto}
.page-top-btn img {display:block;width:75px;height:auto}

@media(max-width:991px){
  .header-menu {padding:10px 20px}
  .header-inner {padding:0}
  .site-header .brand img {height:36px}
  .header-search {width:150px}
  .intro-inner {padding:8px 20px}
  .info-text {font-size:12px}
}
@media(max-width:767px){
  .intro-menu,.desktop-nav,.header-search,.store-icons {display:none}
  .header-menu {padding:10px 20px}
  .site-header .brand img {width:125px;height:auto}
  .mobile-nav {display:block;border-bottom:1px solid #ddd;font-size:14px}
  .mobile-nav>summary {cursor:pointer;padding:12px 20px;font-weight:700;color:#666}
  .mobile-nav-body {padding:0 20px 16px}
  html.has-bottom-bar .mobile-nav {display:none}  /* the bottom bar's メニュー button replaces it */
  .footer-container {padding:30px 20px 40px}
  .site-footer dl {flex-basis:100%}
  .site-footer dt {font-size:18px}
  .site-footer dd ul {font-size:14px}
  .page-top-btn {display:none}
}
