/*layout*/
@charset "utf-8";
@media screen and (max-width: 900px) {
  html { font-size: .875rem; }
}


.conts-width-m { width: 90%; max-width: 1200px;  margin: 0 auto; }
.conts-width { width: 90%; max-width: 1000px;  margin: 0 auto; }

.conts-section { padding: 90px 0 ; }

@media screen and (max-width: 900px) {
  .conts-section { padding: 50px 0; }
  .conts-section-t { padding-top: 50px; }
}


.header { padding: 2rem 1.5rem; position: fixed; top: 0; left: 0; right: 0; margin: auto; z-index: 999; transition: padding .3s, background .3s; }
.header .inner { display: flex; justify-content: space-between; align-items: center; }


body.scrolled .header { background: #FFF; padding: 10px 1.5rem; }

.header.home .g-navi { display: none; }

.head-menus { display: flex; align-items: center; }

.g-navi-menu  { display: flex; align-items: center; font-size: .75rem; }
.g-navi-menu  > li { position: relative; text-align: center; }
.g-navi-menu  > li + li::before { content: ''; width: 1px; height: 90%; display: block; position: absolute; left: 0; bottom: 0; top: 0; margin: auto; background: #ADA39E; }
.g-navi img { display: block; width: fit-content; margin: 0 auto .5em;  height: 2.5rem; object-fit: contain; }
.g-navi-menu  a { display: block; padding: 0 2em; }


.head-contact { display: flex; align-items: center; font-size: .75rem; font-weight: 500; }

.head-contact > li { margin-right: 2em; }
.head-contact  a { display: flex; align-items: center; }
.head-contact .img { width: 2.5em; height: 2.5em; display: inline-block; margin-right: .5em; background: #DAE9F6; border-radius: 50%; display: flex; align-items: center; justify-content: center; }


a.head-tel { color: #6DA9DA; border: 1px solid #6DA9DA; padding: .5em 1em; border-radius: 7px; font-family: 'Figtree', sans-serif; font-weight: 600; display: flex; align-items: center; background: #FFF; }
a.head-tel img { margin-right: .2em; }


.btn-hamburger { display: none ; }

.fixed-bottom-contact { display: none; }

@media screen and (max-width: 1400px) {
  .head-contact .text { display: none; }
  .head-contact .img { width: 3rem; height: 3rem; margin: 0; }
  .head-contact .img img { width: 40%; margin: 0; }
  .head-contact > li { margin-right: 1em; }
}
@media screen and (max-width: 1200px) {
  .header,
  body.scrolled .header { padding: .5rem 4.5rem .5rem 1rem; }
  .header.home .g-navi { display: block; }
  .btn-hamburger { position: fixed; top: 0; right: 0; display: block; border: none; width: 4rem; height: 4rem; display: block; z-index: 999; background: #6DA9DA; white-space: nowrap; overflow: hidden; text-indent: 200%; }
  .btn-hamburger::before,
  .btn-hamburger::after { 
    content: ''; width: 2rem; height: 1px; background: #FFF; display: block; position: absolute; inset: 0; margin: auto; transition: transform .5s; 
  }
  .btn-hamburger::before { transform: translateY(-8px); box-shadow: 0 8px 0 #FFF; }
  .btn-hamburger::after{ transform: translateY(8px); }
  
  .btn-hamburger.open::before { transform: rotate(45deg); box-shadow: none; }
  .btn-hamburger.open::after { transform: rotate(-45deg); }
  
  .header .sitename { width: 140px; }
  
  .g-navi { position: fixed; right: 0; top: 0; width: 70%; margin: auto; background: #FFF; color: #333;  opacity: 0; transition: opacity .3s, transform .3s; pointer-events: none; transform: translateX(100%); height: 100%; }
  .g-navi-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));  padding: 10em 5% 4em; z-index: 998; height: auto; gap: 10px; }
  .g-navi-menu  > li + li { margin-left: 0; border: none; }
  .g-navi-menu  > li + li::before { display: none; }
  .g-navi-menu  > li { font-weight: bold; background: #FFF; box-shadow: 0 0 6px rgba(173, 162, 158, .28); }

  .g-navi-menu  a { padding: 2rem .5rem; }
  
  .g-navi-menu  .head-contact { background: linear-gradient(to right, #3CCBFF, #0067CE); color: #FFF; text-align: center; font-size: 1rem; justify-content: center; max-width: 200px; margin: 0 auto; }
  .g-navi-menu  .head-contact .icon { filter: brightness(5); }
  
  .header.open .g-navi { opacity: 1; pointer-events: auto; transform: translateX(0); box-shadow: -5px 0 5px rgba(0,0,0,.1); }
  
  a.head-tel { width: 3rem; height: 3rem; border-radius: 50%; padding: 0; text-align: center; display: none; }
  a.head-tel img{ width: 40%; margin: 0 auto; }
  .head-tel .text { display: none; }
  
  .fixed-bottom-contact { position: fixed; left: 0; right: 0; bottom: 0; margin: auto; z-index: 98; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; background: #FFF; padding: 10px 1.5rem; }

  .fixed-bottom-contact .btn { display: flex; justify-content: center; border-radius: 7px; padding: 1rem .1em; align-items: center; }
  .fixed-bottom-contact .btn img { margin-right: .5em; }
  .fixed-bottom-contact .btn.tel { color: #6DA9DA; border: 1px solid; font-size: 1.2rem; font-family: 'Figtree', sans-serif; font-weight: 600; } 
  .fixed-bottom-contact .btn.reserve { background: #6DA9DA; color: #FFF; font-size: 1rem; padding-right: 2em; }
  .fixed-bottom-contact .btn.reserve img{ filter: brightness(25); font-weight: 500;  }
}
@media screen and (max-width: 900px) {
  .head-contact > li { margin-right: 5px; }
  
  
  .fixed-bottom-contact .btn.tel { font-size: 1.125rem; white-space: nowrap; }
  
  .fixed-bottom-contact .btn.tel img { width: .8em; height: .8em; margin-right: .2em; }
  .fixed-bottom-contact .btn.reserve img { width: 1.5em; height: 1.5em; }
}


.footer { padding: 80px 0; }
.footer .inner{ width: 90%; max-width: 1100px; margin: 0 auto; }

.footer-top { display: flex; align-items: center; }


.foot-tel { color: #6DA9DA; font-size: 2rem; display: flex; align-items: center; font-family: 'Figtree', sans-serif; white-space: nowrap; font-weight: 600; margin-right: .5em;  }
.foot-tel img { width: .8em; height: .8em; }
.footer-top .address { font-size: .8135rem; margin-left: auto; }

.foot-sub { font-size: .8135rem; color: #6DA9DA; }

@media screen and (max-width: 1200px) {
  .footer-top { flex-direction: column; }
  .footer-top .address { margin: 1em auto 0; }
}

@media screen and (max-width: 768px) {
  .foot-sub { font-size: .75rem; }
  .footer-top .address { font-size: .8rem; }
  .footer-top .address a { display: block; text-align: center; }
}


.footer-middle { display: flex; justify-content: space-between; margin: 40px 0 50px; }
.footer-middle .calendar { width: 30%; }
.footer-middle .train { width: 30%; }
.footer-middle .car { width: 35%; font-size: .8375rem; }

.footer-middle .title { font-size: .9rem; font-weight: bold; margin-bottom: .5em; }
.footer-middle .access-list { font-size: .9rem; }

.calendar table { width: 100%; font-size: .75rem; }
.calendar tr { border-bottom: 1px solid #DED8D4; }
.calendar th:first-child { width: 7em; }
.calendar thead th:not(:first-child) { text-align: center; }
.calendar tbody th { font-weight: normal; padding: .2em 0; }
.calendar tbody td { text-align: center; padding: .2em 0; }
.calendar .note { font-size: .67rem; margin-top: 1em; }

.calendar .maru { color: #6DA9DA; font-size: .8375rem; }
.calendar .sankaku { color: #ADA39E; font-size: .8375rem; }

@media screen and (max-width: 1200px) {
  .footer-middle { flex-wrap: wrap; justify-content: center; }
  .footer-middle .calendar { width: 100%; margin-bottom: 2em; }
  .footer-middle .calendar table{ max-width: 300px; margin: 0 auto; }
  .calendar .note { max-width: 300px; margin: 1em auto 0; }
  
  
.footer-middle .train { width: fit-content; max-width: 48%;  }
.footer-middle .car {  width: fit-content; max-width: 48%; margin-left: 4%;  }
  
}
@media screen and (max-width: 900px) {
  
  .calendar table { font-size: .9rem; }
  .calendar .note  { font-size: .8rem; }
}
@media screen and (max-width: 768px) {
  .footer-middle { flex-direction: column;justify-content: center; align-items: center; }
  .footer-middle .train { max-width: none; margin: 0 auto; width: 100%; font-size: .9rem; }
  .footer-middle .car { max-width: none;  margin: 2em auto 0; width: 100%;  font-size: .8rem; }
}
  
.footer-bottom { display: flex; justify-content: space-between; }
  
.foot-navi { display: flex; font-size: .75rem; }
.foot-navi > li + li { margin-left: 3em; }
.copyright { font-size: .8175rem; font-family: 'Figtree', sans-serif; }


@media screen and (max-width: 1200px) {
  .footer-bottom { flex-direction: column; justify-content: center; }
  .foot-navi  { justify-content: center; flex-wrap: wrap; }
  .copyright { margin-top: 2em; text-align: center; }
}

@media screen and (max-width: 768px) {
  .foot-navi  { display: none; }
}