@charset "utf-8";
/* CSS Document */
@media only screen and (max-width: 640px) {
  /*============================
#header
============================*/
  #header {
  }
  #header .pad {
  }

  /*============================
#header_pc
============================*/
  #header_pc {
    display: none;
  }

  /*============================
#header_sp
============================*/
  #header_sp {
    display: block;
    width: 100%;
    z-index: 3;
  }

  #header_sp .name {
    width: 100%;
    box-sizing: border-box;
    padding: 18px 10px 0;
  }
  #header_sp .name a {
    display: inline-block;
    margin: 0;
  }
  #header_sp .name a img {
    width: auto;
    height: 30px;
  }

  .drawer-hamburger {
    position: absolute !important;
  }
  #header_sp button.drawer-toggle.drawer-hamburger {
    padding: 24px 20px 30px;
  }
  .drawer--right.drawer-open .drawer-hamburger {
    right: 0 !important;
  }
  #header_sp button.drawer-toggle.drawer-hamburger span.sr-only {
  }
  #header_sp button.drawer-toggle.drawer-hamburger span.drawer-hamburger-icon {
  }
  .drawer-hamburger-icon,
  .drawer-hamburger-icon:after,
  .drawer-hamburger-icon:before {
    background: #000 !important;
  }
  .drawer-open .drawer-hamburger-icon {
    background-color: transparent !important;
  }
  #header_sp button.drawer-toggle.drawer-hamburger span.menu {
    display: none;
  }

  #header_sp nav.drawer-nav {
    width: 200px !important;
    background: #f9f8f4;
    margin-top: 70px;
  }
  #header_sp nav.drawer-nav ul.drawer-menu {
    background-color: #f2f0f0;
  }
  #header_sp nav.drawer-nav ul.drawer-menu li {
    border-bottom: solid 1px #d2d0d0;
  }
  #header_sp nav.drawer-nav ul.drawer-menu li a {
    display: block;
    padding: 20px 20px 18px;
    font-size: 1em;
    color: #222;
    text-transform: uppercase;
    letter-spacing: 0.1em;
  }
  #header_sp nav.drawer-nav ul.drawer-menu li.booking a {
    background-color: #000;
    color: #fff;
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns .langJp a {
    display: block;
    width: 100%;
    border-bottom: solid 1px #d2d0d0;    
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns .sns_wrap {
    width: 100%;
    display: -webkit-box;
    display: flex;
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns .sns_wrap .sns {
    width: 33.33333%;
    border-right: solid 1px #d2d0d0;
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns .sns_wrap .sns:last-of-type {
    border-right: none;
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns .sns_wrap .sns a {
    display: block;
    padding: 14px 8px;
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns .sns_wrap .sns a img {
    display: block;
    width: 46% !important;
    margin: 0 auto;
  }



  /* #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns {
    position: relative;
  }
  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns div {
    font-size: 0.875em;
    text-align: center;
    box-sizing: border-box;
    float: left;
  }

  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns div.langJp {
    border-right: 1px solid #d2d0d0;
    width: 70%;
  }
  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns div.sns {
    width: 30%;
  }
  #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns div.sns a img {
    width: 100%;
    height: auto;
  } */
  /* #header_sp nav.drawer-nav ul.drawer-menu li.langAndSns div.sns a {
    color: #5ea9dd;
  } */
  #header_sp
    nav.drawer-nav
    ul.drawer-menu
    li.langAndSns
    div.sns
    i.fa.fa-twitter {
    font-size: 1.125em;
  }

  /*============================
#pageTitleArea
============================*/
  #topPanelArea {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    min-width: inherit;
    padding-top: 160px;
  }

  /*============================
#pageTitleArea
============================*/
  #pageTitleArea {
    padding: 10px 0;
    min-width: inherit;
  }
  #pageTitleArea .md_contents {
  }
  #pageTitleArea .md_contents .md_inner {
  }
  #pageTitleArea .md_contents .md_inner .text {
    font-size: 1.125em;
    text-align: center;
  }

  /*============================
#footer
============================*/
  #footer {
    margin-top: 60px;
    padding: 30px 0 28px;
  }
  #footer .md_contents {
  }
  #footer .md_contents .md_inner {
  }
  #footer .md_contents .md_inner .copyright {
  }
}
