@charset "UTF-8";
/* Desktop header that does not fit — non-Japanese pages only (functions.php loads this file and
   js/header-fit.js only when the locale is not ja; Japanese is untouched and still switches at
   exactly 1080px). js/header-fit.js measures the desktop header at rest and scrolled and sets:

   html.header-nav-clear  the scrolled nav's right offset is a literal sized for the booking
                          buttons (hamille-retained.css: right 396px / 332px). If a translation's
                          buttons come out wider than that, --header-top-width is their real
                          width and the nav starts there instead.
   html.header-compact    something in the desktop header still collides (Nepali: the nav bar
                          over the logo caption at rest, the nav wrapping onto the logo once
                          scrolled). The compact layout below is then used at this width too.

   The compact rules are copies of the max-width:1080px rules, in their original order, behind
   :where(html.header-compact). :where adds no specificity, and this file loads after every
   stylesheet it copies from, so each copy competes with the rest of the cascade exactly as its
   original does at 1080px. Sources — change the copy here when one of them changes:
     css/common.css            @media (max-width: 1080px), header + SPメニュー, and footer
     css/i18n-chrome.css       @media (max-width: 1080px)
     css/hamille-retained.css  @media (max-width: 1080px), hamburger and mobile placement */
@media screen and (min-width: 1081px) {
  html.header-nav-clear header.fixed .header_nav {
    right: var(--header-top-width);
  }

  /* What the >=1081px and >1580px rules do that 1080px never sees. */
  :where(html.header-compact) .fat-nav ul {
    display: block;   /* common.css hides it at >=1081px */
  }
  :where(html.header-compact) .fat-nav ul.flex {
    display: flex;
  }
  :where(html.header-compact) .header_text_br {
    display: none;    /* shown again above 1580px */
  }
  html.header-compact[lang="en-US"] .header_logo span {
    font-size: 12px;  /* common.css sets 14px at >=1081px */
  }

  /* css/common.css, header + SPメニュー */
  :where(html.header-compact) header {
    height: 120px;
  }
  :where(html.header-compact) .header_nav,
  :where(html.header-compact) .header_top {
    display: none;
  }
  :where(html.header-compact) .header_text {
    top: 0;
    left: 0;
    width: 100%;
    padding: 6px 0 5px;
    background: var(--main-color);
    border: none;
    border-radius: 0;
    font-size: 13px;
  }
  :where(html.header-compact) .header_logo {
    top: 40px;
    left: 10px;
  }
  :where(html.header-compact) .header_logo img {
    width: 98px;
    height: 52px;
  }
  :where(html.header-compact) .header_logo span {
    font-size: 12px;
  }
  :where(html.header-compact) header.fixed .header_text {
    display: block;
    border: none;
    color: #fff;
  }
  :where(html.header-compact) header.fixed {
    height: 120px;
  }
  :where(html.header-compact) header.fixed .header_logo {
    top: 40px;
    left: 10px;
  }
  :where(html.header-compact) header.fixed .header_logo img {
    width: 98px;
    height: 52px;
  }
  :where(html.header-compact) header.fixed .header_logo span {
    font-size: 12px;
  }
  :root:where(.header-compact) {
    --sp-menu-size: 56px;
    --sp-menu-top: 46px;
    --sp-menu-inset: 12px;
    --sp-header-gap: 8px;
  }
  :where(html.header-compact) .hamburger {
    display: block;
    position: fixed;
    top: var(--sp-menu-top);
    right: var(--sp-menu-inset);
    z-index: 10002;
    width: var(--sp-menu-size);
    height: var(--sp-menu-size);
    padding: 0;
    background: var(--main-color);
    touch-action: manipulation;
  }
  :where(html.header-compact) .hamburger__icon {
    position: relative;
    margin-top: 27px;
  }
  :where(html.header-compact) .hamburger__icon,
  :where(html.header-compact) .hamburger__icon::before,
  :where(html.header-compact) .hamburger__icon::after {
    width: 24px;
    height: 2px;
    position: absolute;
    top: 0;
    right: 16px;
    display: block;
    background-color: #fff;
    transition-property: background-color, transform;
    transition-duration: 0.4s;
  }
  :where(html.header-compact) .hamburger__icon::before,
  :where(html.header-compact) .hamburger__icon::after {
    content: "";
    right: 0;
  }
  :where(html.header-compact) .hamburger__icon::before {
    width: 24px;
    top: -7px;
  }
  :where(html.header-compact) .hamburger__icon::after {
    width: 24px;
    top: 7px;
  }
  :where(html.header-compact) .hamburger.active .hamburger__icon {
    background-color: transparent;
  }
  :where(html.header-compact) .hamburger.active .hamburger__icon:before,
  :where(html.header-compact) .hamburger.active .hamburger__icon:after {
    width: 24px;
    height: 2px;
  }
  :where(html.header-compact) .hamburger.active .hamburger__icon:before {
    transform: translateY(7px) rotate(45deg);
  }
  :where(html.header-compact) .hamburger.active .hamburger__icon:after {
    transform: translateY(-7px) rotate(-45deg);
  }
  :where(html.header-compact) .fat-nav {
    top: 0;
    left: 0;
    z-index: 9999;
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
  }
  :where(html.header-compact) .fat-nav_header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 120px !important;
  }
  :where(html.header-compact) .fat-nav_header .flex {
    justify-content: space-between;
  }
  :where(html.header-compact) .fat-nav_header_text {
    width: 100%;
    padding: 6px 0 5px;
    background: var(--main-color);
    border: none;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    color: #fff;
    text-align: center;
  }
  :where(html.header-compact) .fat-nav_header_logo {
    padding-top: 12px;
    padding-left: 10px;
    text-align: center;
  }
  :where(html.header-compact) .fat-nav_header_logo img {
    width: 98px;
    height: 52px;
  }
  :where(html.header-compact) .fat-nav_header_logo span {
    display: block;
    font-size: 12px;
    font-weight: 500;
  }
  :where(html.header-compact) .hum_sns_icon {
    display: block;
  }
  :where(html.header-compact) .bogo-language-switcher {
    padding-right: 92px;
    padding-left: 0;
  }
  :where(html.header-compact) .bogo-language-switcher::before {
    display: none;
  }
  :where(html.header-compact) .bogo-language-switcher li span,
  :where(html.header-compact) .bogo-language-switcher li span a {
    display: inline-block;
    font-size: 0;
    font-weight: 700;
    color: rgba(63,58,50,.5);
    text-align: center;
  }
  :where(html.header-compact) .bogo-language-switcher li:first-of-type::after {
    content: "|";
    margin-right: 4px;
    margin-left: 4px;
    color: var(--text-color);
  }
  :where(html.header-compact) .bogo-language-switcher li.current span a {
    color: var(--text-color);
    text-decoration: underline;
  }
  :where(html.header-compact) .fat-nav__wrapper {
    position: absolute;
    top: 0;
    left: 0;
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 100%;
  }
  :where(html.header-compact) .fat-nav_inner {
    width: 100%;
    height: 100%;
    padding: 129px 0 56px;
    background: rgba(255,255,255,.89);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }
  :where(html.header-compact) .fat-nav_inner li a {
    display: block;
    padding: 22px 20px;
    border-bottom: 1px solid #DDDDDD;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  :where(html.header-compact) .fat-nav_inner li:first-of-type a {
    border-top: 1px solid #DDDDDD;
  }
  :where(html.header-compact) .fat-nav_inner li a span {
    display: inline-block;
    margin-left: 8px;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.04em;
    color: rgba(79,120,207,.5);
  }
  :where(html.header-compact) .fat-nav_inner a.no_link {
    border-bottom: none;
  }
  :where(html.header-compact) .fat-nav_inner a.border_none {
    border-bottom: none;
  }
  :where(html.header-compact) .fat-nav_inner ul.child_list {
    gap: 15px 20px;
    padding: 0 20px 20px;
    border-bottom: 1px solid #DDDDDD;
  }
  :where(html.header-compact) .fat-nav_inner ul.child_list li {
    width: calc((100% - 40px) / 3);
  }
  :where(html.header-compact) .fat-nav_inner ul.child_list li:first-of-type a {
    border-top: none;
  }
  :where(html.header-compact) .fat-nav_inner ul.child_list li a {
    position: relative;
    padding: 0;
    padding-right: 10px;
    padding-left: 15px;
    border-bottom: none;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.75;
    text-align: left;
  }
  :where(html.header-compact) .fat-nav_inner ul.child_list li a::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 9px;
    height: 15px;
    background: url("../img/common/mega_arrow.svg") no-repeat center center;
    background-size: cover;
  }
  :where(html.header-compact) #sp-fixed-menu {
    display: block;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 10002;
    opacity: 1;
    transition: opacity 0.5s ease;
    width: 100%;
  }
  :where(html.header-compact) #sp-fixed-menu ul {
    align-items: center;
  }
  :where(html.header-compact) #sp-fixed-menu ul li {
    width: 33.333333333%;
    height: 56px;
  }
  :where(html.header-compact) #sp-fixed-menu ul li.sp_fixed_tel {
    background: #EDEBF7;
  }
  :where(html.header-compact) #sp-fixed-menu ul li.sp_fixed_tel a span {
    font-weight: 400;
    color: var(--main-color);
  }
  :where(html.header-compact) #sp-fixed-menu ul li.sp_fixed_web {
    background: #F0743A;
  }
  :where(html.header-compact) #sp-fixed-menu ul li.sp_fixed_line {
    background: #06C755;
  }
  :where(html.header-compact) #sp-fixed-menu ul li.sp_fixed_contact {
    background: var(--main-color);
  }
  :where(html.header-compact) #sp-fixed-menu ul li a {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    color: #fff;
    text-align: center;
  }
  :where(html.header-compact) #sp-fixed-menu ul li a span {
    display: block;
    position: absolute;
    bottom: 6px;
    left: 0;
    width: 100%;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
  }
  /* css/common.css, footer */
  :where(html.header-compact) footer {
    padding-bottom: 81px;
  }
  /* css/i18n-chrome.css */
  :where(html.header-compact) :where(body:not(.en-US)) #sp-fixed-menu ul li.sp_fixed_line a span {
    bottom: 10px;
  }
  /* css/hamille-retained.css, hamburger */
  :where(html.header-compact) .hamburger {
    border: 0;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
  }
  /* css/hamille-retained.css, mobile placement */
  :where(html.header-compact) body.no-scroll .pagetop {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  :where(html.header-compact) .pagetop {
    right: 16px;
    bottom: 76px;
    width: 50px;
    height: 50px;
  }
  :where(html.header-compact) .pagetop svg {
    width: 21px;
    height: 21px;
  }
  :where(html.header-compact) .header_inner > .language-switcher--mobile-inline {
    display: flex;
    align-items: center;
    position: absolute;
    top: var(--sp-menu-top);
    right: calc(var(--sp-menu-inset) + var(--sp-menu-size) + var(--sp-header-gap));
    height: var(--sp-menu-size);
    z-index: 2;
    margin: 0;
    padding: 0;
  }
  :where(html.header-compact) .header_inner > .language-switcher--mobile-inline::before {
    display: none;
  }
  :where(html.header-compact) .header_inner > .language-switcher--mobile-inline .language-switcher__button {
    height: 36px;
    padding-right: 2px;
    padding-left: 2px;
  }
  :where(html.header-compact) .header_inner > .language-switcher--mobile-inline .language-switcher__menu {
    top: 45px;
    right: 0;
  }
  :where(html.header-compact) .fat-nav_header .fat-nav_header_right {
    display: flex;
    align-items: center;
    gap: var(--sp-header-gap);
    position: absolute;
    top: var(--sp-menu-top);
    right: calc(var(--sp-menu-inset) + var(--sp-menu-size) + var(--sp-header-gap));
    height: var(--sp-menu-size);
    z-index: 2;
  }
  :where(html.header-compact) .fat-nav_header .fat-nav_header_right > .language-switcher {
    position: relative;
    margin: 0;
    padding: 0;
  }
  :where(html.header-compact) .fat-nav_header .fat-nav_header_right .sns_icon {
    display: block;
  }
  :where(html.header-compact) .fat-nav_header .fat-nav_header_right .sns_icon img {
    display: block;
    width: 36px;
    height: 36px;
  }
  :where(html.header-compact) .fat-nav_header .language-switcher::before {
    display: none;
  }
  :where(html.header-compact) .fat-nav_header .language-switcher__button {
    height: 36px;
    padding-right: 2px;
    padding-left: 2px;
  }
  :where(html.header-compact) .fat-nav_header .language-switcher__menu {
    top: 45px;
    right: 0;
  }
}
