@charset "UTF-8";
/*レスポンシブ*/
/*レイアウト*/
/*限定br指定*/
/*スマホだけbr*/
/*タブレットだけbr*/
/*パソコンだけbr*/
/*背景画像*/
/*文字サイズ*/
/*三角作る*/
/*マージン下レスポンシブ一括*/
/*アニメーション*/
/*カラーセット*/
/*グラデーション*/
/*書体*/
/*エフェクト・ぼかし*/
/*エフェクト・スクリーン*/
@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
@import url(https://use.fontawesome.com/releases/v5.6.1/css/all.css);
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400&display=swap&subset=japanese");
@import url("https://fonts.googleapis.com/css?family=Noto+Serif+JP:300,400&display=swap&subset=japanese");
@import url("https://fonts.googleapis.com/css?family=Lato:300,900&display=swap");
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  -webkit-font-feature-settings: 'liga';
          font-feature-settings: 'liga'; }

/****************************************************************************************************/
/*
/*　ブラウザスタイルをリセットする（※基本的に編集しない）
/*
/****************************************************************************************************/
/*body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,tdタグのマージン、パディングを0pxにする*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, figure, button {
  margin: 0px;
  padding: 0px;
  background: none;
  border: 0; }

/*tableタグのcellspacingとcellpaddingを0pxにする*/
table {
  border-collapse: collapse;
  border-spacing: 0px; }

/*javascriptのfieldsetタグとimg(aタグ内のimg)、abbr,acronymタグに表示されるボーダーを0pxにする*/
fieldset, img, abbr, acronym {
  border: 0px; }

/*address,caption,cite,code,dfn,em,strong,th,varタグのfontスタイルを通常にする*/
address, caption, cite, code, dfn, em, th, var {
  font-style: normal;
  font-weight: normal; }

/*ol,ulタグのリストスタイル（アローやマージンなど）を無くす*/
ol, ul, li {
  list-style: none;
  padding: 0px;
  margin: 0px; }

/*caption,thタグを左に寄せる*/
caption, th {
  text-align: left; }

/*hタグの表示を通常のテキストと同じにする*/
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

img {
  display: inline-block;
  vertical-align: middle; }

/*qタグの前後にキーワードを配置しない*/
q:before, q:after {
  content: ''; }

main {
  display: block; }

a {
  color: #176ce0; }
  a.button {
    display: block;
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #dddddd;
    text-align: center;
    -webkit-filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.1));
            filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.1));
    font-size: 1rem;
    color: #000; }
    @media screen and (max-width: 896px) {
      a.button {
        font-size: 1.88684vw; } }
    @media screen and (max-width: 480px) {
      a.button {
        font-size: 4.10565vw; } }
  a.search:before {
    content: "";
    position: absolute;
    right: 15px;
    top: 15px;
    display: block;
    width: 30px;
    height: 30px;
    background: url("/images/index/icon_search.svg");
    background-size: contain; }
    @media screen and (max-width: 896px) {
      a.search:before {
        right: 20px;
        top: 20px;
        width: 20px;
        height: 20px; } }
  a.close span {
    position: absolute;
    display: block;
    width: 20px;
    height: 20px;
    top: 28px;
    left: 25px; }
    a.close span:before, a.close span:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 1px;
      background: #000; }
    a.close span:before {
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg); }
    a.close span:after {
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg); }

input.input {
  display: block;
  position: relative;
  width: 100%;
  height: 60px;
  line-height: 60px;
  background: #f3f3f3;
  border-radius: 5px;
  border: 1px solid #dddddd;
  text-align: center;
  -webkit-box-shadow: inset 0 3px 10px rgba(0, 0, 0, 0.1);
          box-shadow: inset 0 3px 10px rgba(0, 0, 0, 0.1);
  font-size: 1rem;
  color: #000; }
  @media screen and (max-width: 896px) {
    input.input {
      font-size: 1.88684vw; } }
  @media screen and (max-width: 480px) {
    input.input {
      font-size: 4.10565vw; } }

span.close {
  position: absolute;
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer;
  top: 0;
  right: 0;
  background: #000; }
  span.close:before, span.close:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 30%;
    width: 50%;
    height: 1px;
    background: #fff;
    -webkit-transform: translateY(0) translateX(-50%);
    transform: translateY(0) translateX(-50%); }
  span.close:before {
    -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg); }
  span.close:after {
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg); }

dl.table {
  margin-bottom: 60px;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap; }
  @media screen and (max-width: 896px) {
    dl.table {
      margin-bottom: 45px; } }
  @media screen and (max-width: 480px) {
    dl.table {
      margin-bottom: 30px; } }
  dl.table dt, dl.table dd {
    padding: 10px;
    font-size: 0.75rem;
    font-weight: 100; }
    @media screen and (max-width: 896px) {
      dl.table dt, dl.table dd {
        font-size: 1.41513vw; } }
    @media screen and (max-width: 480px) {
      dl.table dt, dl.table dd {
        font-size: 3.0792375vw; } }
    dl.table dt:last-of-type, dl.table dd:last-of-type {
      border-bottom: 1px solid #dcdedc; }
  dl.table dt {
    width: 30%;
    background: #f0f3f7;
    border: 1px solid #dcdedc;
    border-bottom: 0; }
  dl.table dd {
    width: 70%;
    border: 1px solid #dcdedc;
    border-left: 0;
    border-bottom: 0; }

.item_button {
  border-top: 1px solid #dcdedc;
  margin: 0 -20px;
  padding: 20px;
  line-height: 1em;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  font-size: 0.9rem; }
  @media screen and (max-width: 896px) {
    .item_button {
      font-size: 1.698156vw; } }
  @media screen and (max-width: 480px) {
    .item_button {
      font-size: 3.695085vw; } }
  .item_button span {
    display: block;
    width: 40px;
    height: 40px;
    border: 3px solid #dcdedc;
    border-radius: 50%;
    text-align: center;
    line-height: 45px;
    position: relative; }
    .item_button span:before {
      content: "";
      position: absolute;
      width: 50%;
      height: 1px;
      background: #000;
      top: 50%;
      left: 50%;
      -webkit-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%); }
    .item_button span:after {
      content: "";
      position: absolute;
      left: 16px;
      top: 13px;
      width: 8px;
      height: 8px;
      border-right: 1px solid #000;
      border-bottom: 1px solid #000;
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg); }

.access {
  margin-bottom: 45px; }
  @media screen and (max-width: 896px) {
    .access {
      margin-bottom: 30px; } }
  @media screen and (max-width: 480px) {
    .access {
      margin-bottom: 15px; } }
  .access h4 {
    width: 100%;
    margin-bottom: 30px;
    font-size: 1rem; }
    @media screen and (max-width: 896px) {
      .access h4 {
        margin-bottom: 15px; } }
    @media screen and (max-width: 480px) {
      .access h4 {
        margin-bottom: 12px; } }
    @media screen and (max-width: 896px) {
      .access h4 {
        font-size: 1.88684vw; } }
    @media screen and (max-width: 480px) {
      .access h4 {
        font-size: 4.10565vw; } }
  .access p {
    margin-bottom: 30px;
    font-size: 0.9rem;
    line-height: 1.75em; }
    @media screen and (max-width: 896px) {
      .access p {
        margin-bottom: 15px; } }
    @media screen and (max-width: 480px) {
      .access p {
        margin-bottom: 12px; } }
    @media screen and (max-width: 896px) {
      .access p {
        font-size: 1.698156vw; } }
    @media screen and (max-width: 480px) {
      .access p {
        font-size: 3.695085vw; } }

* {
  margin: 0;
  padding: 0;
  text-decoration: none;
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

html {
  overflow-y: scroll; }

body {
  overflow: hidden;
  font-family: 'Lato', sans-serif; }
  body:before {
    content: "";
    position: fixed;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 0;
    z-index: 50;
    background: rgba(0, 0, 0, 0.5); }
  body.active:before {
    height: 100vh; }
  body p {
    font-weight: 100;
    letter-spacing: .05em; }
  body section {
    width: 90%;
    max-width: 896px;
    margin: 0 auto;
    margin-bottom: 90px; }
    @media screen and (max-width: 896px) {
      body section {
        margin-bottom: 60px; } }
    @media screen and (max-width: 480px) {
      body section {
        margin-bottom: 45px; } }
  body footer {
    position: relative;
    background: url("/images/common/footer_img.jpg") no-repeat #000;
    background-size: contain;
    padding: 60% 0 0; }
    body footer nav {
      display: flex;
      justify-content: space-between;
      align-items: stretch;
      flex-wrap: wrap;
      position: relative;
      width: 90%;
      margin: 0 auto 30px; }
      body footer nav a {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-wrap: no-repeat;
        padding: 15px 0;
        width: 48.5%;
        border-bottom: 1px solid #333;
        font-weight: 100;
        letter-spacing: .01em;
        color: #fff;
        font-size: 0.9rem; }
        @media screen and (max-width: 896px) {
          body footer nav a {
            font-size: 1.698156vw; } }
        @media screen and (max-width: 480px) {
          body footer nav a {
            font-size: 3.695085vw; } }
        body footer nav a:last-of-type {
          border-bottom: 0; }
        body footer nav a i.material-icons {
          font-size: 1rem;
          margin: 0 5px 0 0;
          color: #38724c; }
          @media screen and (max-width: 896px) {
            body footer nav a i.material-icons {
              font-size: 1.88684vw; } }
          @media screen and (max-width: 480px) {
            body footer nav a i.material-icons {
              font-size: 4.10565vw; } }
    body footer .copyright {
      background: #fff;
      padding: 30px 0 60px;
      font-size: 0.8rem;
      text-align: center; }
      @media screen and (max-width: 896px) {
        body footer .copyright {
          font-size: 1.509472vw; } }
      @media screen and (max-width: 480px) {
        body footer .copyright {
          font-size: 3.28452vw; } }

.index section.headline {
  padding: 120px 0 0; }
  @media screen and (max-width: 896px) {
    .index section.headline {
      padding: 60px 0 0; } }
  .index section.headline h1 {
    margin-bottom: 60px; }
    @media screen and (max-width: 896px) {
      .index section.headline h1 {
        margin-bottom: 45px; } }
    @media screen and (max-width: 480px) {
      .index section.headline h1 {
        margin-bottom: 30px; } }
    .index section.headline h1 img {
      width: 320px;
      height: 128px;
      display: block;
      margin: 0 auto; }
      @media screen and (max-width: 896px) {
        .index section.headline h1 img {
          width: 280px;
          height: 112px; } }
      @media screen and (max-width: 480px) {
        .index section.headline h1 img {
          width: 180px;
          height: 70px; } }
  .index section.headline h2 {
    margin-bottom: 30px; }
    @media screen and (max-width: 896px) {
      .index section.headline h2 {
        margin-bottom: 15px; } }
    @media screen and (max-width: 480px) {
      .index section.headline h2 {
        margin-bottom: 12px; } }
    .index section.headline h2 img {
      width: 386px;
      height: 44px;
      display: block;
      margin: 0 auto; }
      @media screen and (max-width: 896px) {
        .index section.headline h2 img {
          width: 280px;
          height: 44px; } }
      @media screen and (max-width: 480px) {
        .index section.headline h2 img {
          width: 200px;
          height: 23px; } }
  .index section.headline p {
    font-size: 1rem;
    line-height: 1.75em;
    text-align: center; }
    @media screen and (max-width: 896px) {
      .index section.headline p {
        font-size: 1.88684vw; } }
    @media screen and (max-width: 480px) {
      .index section.headline p {
        font-size: 4.10565vw; } }

.index section.search {
  margin: 0 auto; }
  .index section.search h3 {
    font-size: 1.3rem;
    margin-bottom: 60px;
    text-align: center;
    letter-spacing: .05em; }
    @media screen and (max-width: 896px) {
      .index section.search h3 {
        font-size: 2.452892vw; } }
    @media screen and (max-width: 480px) {
      .index section.search h3 {
        font-size: 5.337345vw; } }
    @media screen and (max-width: 896px) {
      .index section.search h3 {
        margin-bottom: 45px; } }
    @media screen and (max-width: 480px) {
      .index section.search h3 {
        margin-bottom: 30px; } }
  .index section.search ul {
    position: relative;
    margin-bottom: 45px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap; }
    @media screen and (max-width: 896px) {
      .index section.search ul {
        margin-bottom: 30px; } }
    @media screen and (max-width: 480px) {
      .index section.search ul {
        margin-bottom: 15px; } }
    .index section.search ul li {
      width: 30%;
      margin-bottom: 30px;
      position: relative;
      padding: 0 0 35px; }
      @media screen and (max-width: 896px) {
        .index section.search ul li {
          margin-bottom: 15px; } }
      @media screen and (max-width: 480px) {
        .index section.search ul li {
          margin-bottom: 12px; } }
      @media screen and (max-width: 896px) {
        .index section.search ul li {
          width: 50%;
          padding: 15px 0 45px;
          border-bottom: 1px solid #ddd;
          margin: 0; }
          .index section.search ul li:nth-of-type(odd) {
            border-right: 1px solid #ddd; }
          .index section.search ul li:nth-last-of-type(1), .index section.search ul li:nth-last-of-type(2) {
            border-bottom: 0; } }
      .index section.search ul li img {
        display: block;
        margin: 0 auto;
        width: 100%; }
        @media screen and (max-width: 896px) {
          .index section.search ul li img {
            width: 70%; } }
        .index section.search ul li img.fuji {
          max-width: 200px; }
          @media screen and (max-width: 896px) {
            .index section.search ul li img.fuji {
              max-width: 160px; } }
        .index section.search ul li img.summ {
          max-width: 260px;
          padding: 22px 0 0; }
        .index section.search ul li img.rock {
          max-width: 186px; }
          @media screen and (max-width: 896px) {
            .index section.search ul li img.rock {
              width: 60%;
              padding: 20px 0 0; } }
        .index section.search ul li img.risi {
          max-width: 130px;
          padding: 5px 0; }
          @media screen and (max-width: 896px) {
            .index section.search ul li img.risi {
              width: 45%;
              padding: 0; } }
        .index section.search ul li img.inaz {
          max-width: 126px; }
          @media screen and (max-width: 896px) {
            .index section.search ul li img.inaz {
              width: 45%; } }
        .index section.search ul li img.kaze {
          max-width: 207px;
          padding: 45px 0; }
          @media screen and (max-width: 896px) {
            .index section.search ul li img.kaze {
              width: 60%;
              padding: 30px 0; } }
      .index section.search ul li p {
        position: absolute;
        width: 100%;
        display: block;
        text-align: center;
        font-size: 0.9rem;
        left: 0;
        bottom: 0;
        z-index: 0; }
        @media screen and (max-width: 896px) {
          .index section.search ul li p {
            font-size: 1.698156vw; } }
        @media screen and (max-width: 480px) {
          .index section.search ul li p {
            font-size: 3.695085vw; } }
        @media screen and (max-width: 896px) {
          .index section.search ul li p {
            padding: 0 0 15px; } }
      .index section.search ul li a:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 10; }
  .index section.search a.button {
    margin-bottom: 45px; }
    @media screen and (max-width: 896px) {
      .index section.search a.button {
        margin-bottom: 30px; } }
    @media screen and (max-width: 480px) {
      .index section.search a.button {
        margin-bottom: 15px; } }
  .index section.search input.input {
    padding: 10px;
    margin-bottom: 45px;
    font-size: 0.9rem; }
    @media screen and (max-width: 896px) {
      .index section.search input.input {
        margin-bottom: 30px; } }
    @media screen and (max-width: 480px) {
      .index section.search input.input {
        margin-bottom: 15px; } }
    @media screen and (max-width: 896px) {
      .index section.search input.input {
        font-size: 1.698156vw; } }
    @media screen and (max-width: 480px) {
      .index section.search input.input {
        font-size: 3.695085vw; } }
  .index section.search input.button {
    display: block;
    position: relative;
    width: 100%;
    height: 60px;
    line-height: 60px;
    background: #fff;
    border-radius: 5px;
    border: 1px solid #dddddd;
    text-align: center;
    -webkit-filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.1));
            filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.1));
    font-size: 1rem;
    color: #000;
    cursor: pointer; }
    @media screen and (max-width: 896px) {
      .index section.search input.button {
        font-size: 1.88684vw; } }
    @media screen and (max-width: 480px) {
      .index section.search input.button {
        font-size: 4.10565vw; } }
    .index section.search input.button.green {
      color: #fff;
      background: #38724c;
      max-width: 250px;
      margin: 0 auto; }

.hotel header {
  padding: 25px 0;
  background: #fff; }
  @media screen and (max-width: 896px) {
    .hotel header {
      padding: 18px 0; } }
  .hotel header a {
    display: block;
    position: relative; }
    .hotel header a img {
      width: 164px;
      height: 66px;
      display: block;
      margin: 0 auto; }
      @media screen and (max-width: 896px) {
        .hotel header a img {
          width: 140px;
          height: 66px; } }

.hotel section.status {
  position: relative;
  margin: 0 auto;
  padding: 0 0 30px; }
  @media screen and (max-width: 480px) {
    .hotel section.status {
      padding: 0 0 18px; } }
  .hotel section.status:before {
    content: "";
    position: absolute;
    left: -150%;
    top: 0;
    width: 300%;
    height: 100%;
    background: #f0f3f7;
    z-index: 0; }
  .hotel section.status h1 {
    position: relative;
    z-index: 10;
    padding: 15px 0;
    font-weight: 600;
    color: #fff;
    font-size: 1.2rem;
    margin-bottom: 30px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap; }
    @media screen and (max-width: 896px) {
      .hotel section.status h1 {
        font-size: 2.264208vw; } }
    @media screen and (max-width: 480px) {
      .hotel section.status h1 {
        font-size: 4.92678vw; } }
    @media screen and (max-width: 896px) {
      .hotel section.status h1 {
        margin-bottom: 15px; } }
    @media screen and (max-width: 480px) {
      .hotel section.status h1 {
        margin-bottom: 12px; } }
    .hotel section.status h1 span {
      font-size: 0.9rem;
      font-weight: 100;
      margin: 0 0 0 10px; }
      @media screen and (max-width: 896px) {
        .hotel section.status h1 span {
          font-size: 1.698156vw; } }
      @media screen and (max-width: 480px) {
        .hotel section.status h1 span {
          font-size: 3.695085vw; } }
      @media screen and (max-width: 480px) {
        .hotel section.status h1 span {
          display: none; } }
    .hotel section.status h1 a.button {
      font-size: 0.8rem;
      font-weight: 100;
      height: 32px;
      line-height: 32px;
      max-width: 60px;
      padding: 0;
      white-space: nowrap;
      margin: 0 0 0 auto; }
      @media screen and (max-width: 896px) {
        .hotel section.status h1 a.button {
          font-size: 1.509472vw; } }
      @media screen and (max-width: 480px) {
        .hotel section.status h1 a.button {
          font-size: 3.28452vw; } }
    .hotel section.status h1:before {
      content: "";
      position: absolute;
      left: -150%;
      top: 0;
      width: 300%;
      height: 100%;
      background: #38724c;
      z-index: -1; }
  .hotel section.status > p {
    position: relative;
    z-index: 10;
    margin-bottom: 30px; }
    @media screen and (max-width: 896px) {
      .hotel section.status > p {
        margin-bottom: 15px; } }
    @media screen and (max-width: 480px) {
      .hotel section.status > p {
        margin-bottom: 12px; } }
  .hotel section.status dl {
    position: relative;
    z-index: 10;
    padding: 20px;
    background: #fff;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap; }
    .hotel section.status dl dt, .hotel section.status dl dd {
      font-size: 1rem;
      font-weight: 100;
      margin: 0 0 15px;
      padding: 0 0 15px;
      border-bottom: 1px dotted #999; }
      @media screen and (max-width: 896px) {
        .hotel section.status dl dt, .hotel section.status dl dd {
          font-size: 1.88684vw; } }
      @media screen and (max-width: 480px) {
        .hotel section.status dl dt, .hotel section.status dl dd {
          font-size: 4.10565vw; } }
      .hotel section.status dl dt:last-of-type, .hotel section.status dl dd:last-of-type {
        margin: 0;
        padding: 0;
        border: 0; }
    .hotel section.status dl dt {
      width: 15%;
      white-space: nowrap; }
      @media screen and (max-width: 480px) {
        .hotel section.status dl dt {
          width: 100%;
          margin: 0 0 5px;
          padding: 0;
          border: 0; } }
    .hotel section.status dl dd {
      width: 82.5%; }
      @media screen and (max-width: 480px) {
        .hotel section.status dl dd {
          width: 100%; } }
      .hotel section.status dl dd p {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-wrap: nowrap;
        margin: 0 0 5px; }
        .hotel section.status dl dd p:last-of-type {
          margin: 0; }
        .hotel section.status dl dd p select {
          -webkit-appearance: button;
          -moz-appearance: button;
               appearance: button;
          background: #fff;
          border: #000;
          font-size: 0.9rem;
          font-weight: 100;
          border: 1px solid #ccc;
          padding: 3px 30px 3px 3px;
          margin: 0 10px 0 0; }
          @media screen and (max-width: 896px) {
            .hotel section.status dl dd p select {
              font-size: 1.698156vw; } }
          @media screen and (max-width: 480px) {
            .hotel section.status dl dd p select {
              font-size: 3.695085vw; } }
          .hotel section.status dl dd p select option {
            font-size: 0.9rem;
            font-weight: 100; }
            @media screen and (max-width: 896px) {
              .hotel section.status dl dd p select option {
                font-size: 1.698156vw; } }
            @media screen and (max-width: 480px) {
              .hotel section.status dl dd p select option {
                font-size: 3.695085vw; } }
        .hotel section.status dl dd p span {
          font-size: 0.9rem;
          font-weight: 100;
          margin: 0 10px 0 0; }
          @media screen and (max-width: 896px) {
            .hotel section.status dl dd p span {
              font-size: 1.698156vw; } }
          @media screen and (max-width: 480px) {
            .hotel section.status dl dd p span {
              font-size: 3.695085vw; } }

.hotel section.list {
  position: relative;
  padding: 45px 0 60px; }
  @media screen and (max-width: 896px) {
    .hotel section.list {
      padding: 30px 0 45px; } }
  @media screen and (max-width: 480px) {
    .hotel section.list {
      padding: 21px 0 30px; } }
  .hotel section.list:before {
    content: "";
    position: absolute;
    left: -150%;
    top: 0;
    width: 300%;
    height: 100%;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f8f7f5+0,ffffff+100 */
    background: #f8f7f5;
    /* Old browsers */
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#f8f7f5), to(#ffffff));
    background: linear-gradient(to bottom, #f8f7f5 0%, #ffffff 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f7f5', endColorstr='#ffffff',GradientType=0 );
    /* IE6-9 */
    z-index: 0; }
  .hotel section.list h3 {
    position: relative;
    z-index: 10;
    font-size: 1.3rem;
    margin-bottom: 60px;
    text-align: center;
    letter-spacing: .05em; }
    @media screen and (max-width: 896px) {
      .hotel section.list h3 {
        font-size: 2.452892vw; } }
    @media screen and (max-width: 480px) {
      .hotel section.list h3 {
        font-size: 5.337345vw; } }
    @media screen and (max-width: 896px) {
      .hotel section.list h3 {
        margin-bottom: 45px; } }
    @media screen and (max-width: 480px) {
      .hotel section.list h3 {
        margin-bottom: 30px; } }
  .hotel section.list div.item {
    position: relative;
    z-index: 10;
    padding: 20px 20px 0;
    background: #fff;
    border-radius: 10px;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    margin-bottom: 60px; }
    @media screen and (max-width: 896px) {
      .hotel section.list div.item {
        margin-bottom: 45px; } }
    @media screen and (max-width: 480px) {
      .hotel section.list div.item {
        margin-bottom: 30px; } }
    .hotel section.list div.item:last-of-type {
      margin: 0; }
    .hotel section.list div.item div.detail {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      flex-wrap: wrap;
      margin-bottom: 60px; }
      @media screen and (max-width: 896px) {
        .hotel section.list div.item div.detail {
          margin-bottom: 45px; } }
      @media screen and (max-width: 480px) {
        .hotel section.list div.item div.detail {
          margin-bottom: 30px; } }
      .hotel section.list div.item div.detail h4 {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: nowrap;
        margin-bottom: 30px;
        font-size: 1rem; }
        @media screen and (max-width: 896px) {
          .hotel section.list div.item div.detail h4 {
            margin-bottom: 15px; } }
        @media screen and (max-width: 480px) {
          .hotel section.list div.item div.detail h4 {
            margin-bottom: 12px; } }
        @media screen and (max-width: 896px) {
          .hotel section.list div.item div.detail h4 {
            font-size: 1.88684vw; } }
        @media screen and (max-width: 480px) {
          .hotel section.list div.item div.detail h4 {
            font-size: 4.10565vw; } }
        .hotel section.list div.item div.detail h4 a.button {
          font-size: 0.75rem;
          font-weight: 100;
          height: 36px;
          line-height: 36px;
          max-width: 70px;
          padding: 0;
          white-space: nowrap;
          margin: 0 0 0 auto;
          color: #176ce0;
          border: 1px solid #176ce0; }
          @media screen and (max-width: 896px) {
            .hotel section.list div.item div.detail h4 a.button {
              font-size: 1.41513vw; } }
          @media screen and (max-width: 480px) {
            .hotel section.list div.item div.detail h4 a.button {
              font-size: 3.0792375vw; } }
      .hotel section.list div.item div.detail p.img {
        position: relative;
        width: 35%; }
        .hotel section.list div.item div.detail p.img img {
          display: block;
          width: 100%; }
      .hotel section.list div.item div.detail div.description {
        width: 60%;
        line-height: 1.65;
        font-size: 0.85rem; }
        @media screen and (max-width: 896px) {
          .hotel section.list div.item div.detail div.description {
            font-size: 1.603814vw; } }
        @media screen and (max-width: 480px) {
          .hotel section.list div.item div.detail div.description {
            font-size: 3.4898025vw; } }
        .hotel section.list div.item div.detail div.description ul {
          position: relative;
          margin: 15px 0 0;
          padding: 15px 0 0;
          border-top: 1px solid #ccc;
          display: flex;
          justify-content: flex-start;
          align-items: flex-start;
          flex-wrap: wrap; }
          .hotel section.list div.item div.detail div.description ul li {
            padding: 5px;
            line-height: 1em;
            text-align: center;
            width: 30%;
            margin: 0 5% 10px 0;
            font-size: 0.7rem;
            background: #38724c;
            color: #fff;
            letter-spacing: 0;
            white-space: nowrap; }
            @media screen and (max-width: 896px) {
              .hotel section.list div.item div.detail div.description ul li {
                font-size: 1.320788vw; } }
            @media screen and (max-width: 480px) {
              .hotel section.list div.item div.detail div.description ul li {
                font-size: 2.873955vw; } }
            .hotel section.list div.item div.detail div.description ul li:nth-of-type(3n) {
              margin: 0 0 10px; }
    .hotel section.list div.item div.recommend {
      margin-bottom: 60px; }
      @media screen and (max-width: 896px) {
        .hotel section.list div.item div.recommend {
          margin-bottom: 45px; } }
      @media screen and (max-width: 480px) {
        .hotel section.list div.item div.recommend {
          margin-bottom: 30px; } }
      .hotel section.list div.item div.recommend h4 {
        width: 100%;
        margin-bottom: 30px;
        font-size: 1rem; }
        @media screen and (max-width: 896px) {
          .hotel section.list div.item div.recommend h4 {
            margin-bottom: 15px; } }
        @media screen and (max-width: 480px) {
          .hotel section.list div.item div.recommend h4 {
            margin-bottom: 12px; } }
        @media screen and (max-width: 896px) {
          .hotel section.list div.item div.recommend h4 {
            font-size: 1.88684vw; } }
        @media screen and (max-width: 480px) {
          .hotel section.list div.item div.recommend h4 {
            font-size: 4.10565vw; } }
      .hotel section.list div.item div.recommend ul li {
        padding: 15px;
        position: relative; }
        .hotel section.list div.item div.recommend ul li a {
          display: block;
          margin: 0 0 5px;
          font-size: 0.9rem;
          color: #176ce0; }
          @media screen and (max-width: 896px) {
            .hotel section.list div.item div.recommend ul li a {
              font-size: 1.698156vw; } }
          @media screen and (max-width: 480px) {
            .hotel section.list div.item div.recommend ul li a {
              font-size: 3.695085vw; } }
          .hotel section.list div.item div.recommend ul li a:before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            display: block;
            z-index: 10; }
        .hotel section.list div.item div.recommend ul li p {
          color: #d76151;
          line-height: 1em;
          font-size: 0.9rem;
          font-weight: 100;
          position: relative;
          z-index: 0; }
          @media screen and (max-width: 896px) {
            .hotel section.list div.item div.recommend ul li p {
              font-size: 1.698156vw; } }
          @media screen and (max-width: 480px) {
            .hotel section.list div.item div.recommend ul li p {
              font-size: 3.695085vw; } }
        .hotel section.list div.item div.recommend ul li:nth-of-type(odd) {
          background: #f8f7f5; }

.modal_target {
  visibility: hidden;
  position: fixed;
  left: 50%;
  top: 50%;
  width: 90vw;
  height: 80vh;
  padding: 20px;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
  background: #fff;
  z-index: 100; }
  .modal_target.active {
    visibility: visible; }
  .modal_target h3 {
    font-size: 1.3rem;
    margin-bottom: 60px;
    text-align: center;
    letter-spacing: .05em; }
    @media screen and (max-width: 896px) {
      .modal_target h3 {
        font-size: 2.452892vw; } }
    @media screen and (max-width: 480px) {
      .modal_target h3 {
        font-size: 5.337345vw; } }
    @media screen and (max-width: 896px) {
      .modal_target h3 {
        margin-bottom: 45px; } }
    @media screen and (max-width: 480px) {
      .modal_target h3 {
        margin-bottom: 30px; } }
  .modal_target .toggle_nav {
    margin-bottom: 45px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: nowrap; }
    @media screen and (max-width: 896px) {
      .modal_target .toggle_nav {
        margin-bottom: 30px; } }
    @media screen and (max-width: 480px) {
      .modal_target .toggle_nav {
        margin-bottom: 15px; } }
    .modal_target .toggle_nav a {
      width: 50%;
      text-align: center;
      display: block;
      line-height: 51px;
      height: 51px;
      color: #000;
      font-size: 0.8rem;
      letter-spacing: .1em;
      border: 1px solid #dcdedc;
      background: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#f7f7f7));
      background: linear-gradient(0deg, #fff, #f7f7f7);
      background: -ms-linear-gradient(top, #fff, #f7f7f7);
      background: -webkit-gradient(linear, left top, right bottom, from(#fff), to(#f7f7f7)); }
      @media screen and (max-width: 896px) {
        .modal_target .toggle_nav a {
          font-size: 1.509472vw; } }
      @media screen and (max-width: 480px) {
        .modal_target .toggle_nav a {
          font-size: 3.28452vw; } }
      .modal_target .toggle_nav a:nth-of-type(1) {
        border-right: 0; }
      .modal_target .toggle_nav a.active {
        background: #fff;
        color: #38724c;
        border-bottom: 0; }
  .modal_target > dl {
    display: none;
    overflow: scroll;
    height: 50vh;
    margin: 0 0 30px; }
    .modal_target > dl.active {
      display: block; }
    .modal_target > dl dt {
      position: relative;
      display: block;
      position: relative;
      width: 100%;
      height: 60px;
      line-height: 60px;
      background: #fff;
      border-radius: 5px;
      border: 1px solid #dddddd;
      text-align: center;
      -webkit-filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.1));
              filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.1));
      font-size: 1rem;
      color: #000;
      height: 45px;
      line-height: 45px;
      padding: 0 10px;
      text-align: left;
      margin: 0 0 15px;
      cursor: pointer;
      font-size: 0.8rem; }
      .modal_target > dl dt:before {
        content: "";
        position: absolute;
        display: block;
        width: 5px;
        height: 5px;
        right: 15px;
        top: 15px;
        border-left: 3px #ccc solid;
        border-bottom: 3px #ccc solid;
        -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
        -webkit-transition: all 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95);
        transition: all 0.2s cubic-bezier(0.445, 0.05, 0.55, 0.95); }
      @media screen and (max-width: 896px) {
        .modal_target > dl dt {
          font-size: 1.88684vw; } }
      @media screen and (max-width: 480px) {
        .modal_target > dl dt {
          font-size: 4.10565vw; } }
      @media screen and (max-width: 896px) {
        .modal_target > dl dt {
          font-size: 1.509472vw; } }
      @media screen and (max-width: 480px) {
        .modal_target > dl dt {
          font-size: 3.28452vw; } }
      .modal_target > dl dt.active {
        color: #38724c;
        border: 1px solid #38724c;
        background: #ebf1ed; }
        .modal_target > dl dt.active:before {
          border-left: 3px #38724c solid;
          border-bottom: 3px #38724c solid;
          -webkit-transform: rotate(135deg);
                  transform: rotate(135deg);
          top: 20px; }
    .modal_target > dl dd {
      margin-bottom: 30px;
      display: none; }
      @media screen and (max-width: 896px) {
        .modal_target > dl dd {
          margin-bottom: 15px; } }
      @media screen and (max-width: 480px) {
        .modal_target > dl dd {
          margin-bottom: 12px; } }
      .modal_target > dl dd ul li:nth-of-type(odd) {
        background: #f8f7f5; }
      .modal_target > dl dd ul li a {
        display: block;
        padding: 10px;
        font-size: 0.9rem; }
        @media screen and (max-width: 896px) {
          .modal_target > dl dd ul li a {
            font-size: 1.698156vw; } }
        @media screen and (max-width: 480px) {
          .modal_target > dl dd ul li a {
            font-size: 3.695085vw; } }
  .modal_target.plan {
    overflow: scroll; }
    .modal_target.plan h3 {
      font-size: 1.3rem;
      margin-bottom: 60px;
      text-align: center;
      letter-spacing: .05em;
      margin-bottom: 60px;
      padding: 0 0 25px;
      border-bottom: 1px solid #000; }
      @media screen and (max-width: 896px) {
        .modal_target.plan h3 {
          font-size: 2.452892vw; } }
      @media screen and (max-width: 480px) {
        .modal_target.plan h3 {
          font-size: 5.337345vw; } }
      @media screen and (max-width: 896px) {
        .modal_target.plan h3 {
          margin-bottom: 45px; } }
      @media screen and (max-width: 480px) {
        .modal_target.plan h3 {
          margin-bottom: 30px; } }
      @media screen and (max-width: 896px) {
        .modal_target.plan h3 {
          margin-bottom: 45px; } }
      @media screen and (max-width: 480px) {
        .modal_target.plan h3 {
          margin-bottom: 30px; } }
    .modal_target.plan .access {
      margin-bottom: 60px; }
      @media screen and (max-width: 896px) {
        .modal_target.plan .access {
          margin-bottom: 45px; } }
      @media screen and (max-width: 480px) {
        .modal_target.plan .access {
          margin-bottom: 30px; } }
    .modal_target.plan a.button.map:before {
      content: "";
      display: block;
      width: 30px;
      height: 30px;
      background: url("/images/common/icon_map.svg") no-repeat;
      background-size: contain;
      position: absolute;
      left: 15px;
      top: 50%;
      -webkit-transform: translateY(-50%) translateX(0);
      transform: translateY(-50%) translateX(0); }
    .modal_target.plan div.item_list {
      margin: 0 0 30px; }
      .modal_target.plan div.item_list div.item {
        border-top: #dcdedc 1px solid;
        padding: 45px 0; }
        .modal_target.plan div.item_list div.item div.detail {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          flex-wrap: wrap;
          margin-bottom: 60px; }
          @media screen and (max-width: 896px) {
            .modal_target.plan div.item_list div.item div.detail {
              margin-bottom: 45px; } }
          @media screen and (max-width: 480px) {
            .modal_target.plan div.item_list div.item div.detail {
              margin-bottom: 30px; } }
          .modal_target.plan div.item_list div.item div.detail p.img {
            position: relative;
            width: 35%; }
            .modal_target.plan div.item_list div.item div.detail p.img img {
              display: block;
              width: 100%; }
          .modal_target.plan div.item_list div.item div.detail div.description {
            width: 60%;
            line-height: 1.65;
            font-size: 0.85rem; }
            @media screen and (max-width: 896px) {
              .modal_target.plan div.item_list div.item div.detail div.description {
                font-size: 1.603814vw; } }
            @media screen and (max-width: 480px) {
              .modal_target.plan div.item_list div.item div.detail div.description {
                font-size: 3.4898025vw; } }
            .modal_target.plan div.item_list div.item div.detail div.description h5 {
              font-size: 1.05rem;
              font-weight: 600;
              line-height: 1.5em;
              margin-bottom: 5px; }
              @media screen and (max-width: 896px) {
                .modal_target.plan div.item_list div.item div.detail div.description h5 {
                  font-size: 1.981182vw; } }
              @media screen and (max-width: 480px) {
                .modal_target.plan div.item_list div.item div.detail div.description h5 {
                  font-size: 4.3109325vw; } }
            .modal_target.plan div.item_list div.item div.detail div.description h6 {
              font-size: 0.8rem;
              margin-bottom: 30px; }
              @media screen and (max-width: 896px) {
                .modal_target.plan div.item_list div.item div.detail div.description h6 {
                  font-size: 1.509472vw; } }
              @media screen and (max-width: 480px) {
                .modal_target.plan div.item_list div.item div.detail div.description h6 {
                  font-size: 3.28452vw; } }
              @media screen and (max-width: 896px) {
                .modal_target.plan div.item_list div.item div.detail div.description h6 {
                  margin-bottom: 15px; } }
              @media screen and (max-width: 480px) {
                .modal_target.plan div.item_list div.item div.detail div.description h6 {
                  margin-bottom: 12px; } }
            .modal_target.plan div.item_list div.item div.detail div.description p.price {
              color: #f81919;
              line-height: 1.5em;
              font-size: 0.8rem; }
              @media screen and (max-width: 896px) {
                .modal_target.plan div.item_list div.item div.detail div.description p.price {
                  font-size: 1.509472vw; } }
              @media screen and (max-width: 480px) {
                .modal_target.plan div.item_list div.item div.detail div.description p.price {
                  font-size: 3.28452vw; } }
              .modal_target.plan div.item_list div.item div.detail div.description p.price span {
                font-size: 1.1rem; }
                @media screen and (max-width: 896px) {
                  .modal_target.plan div.item_list div.item div.detail div.description p.price span {
                    font-size: 2.075524vw; } }
                @media screen and (max-width: 480px) {
                  .modal_target.plan div.item_list div.item div.detail div.description p.price span {
                    font-size: 4.516215vw; } }
              .modal_target.plan div.item_list div.item div.detail div.description p.price strong {
                font-size: 1.25rem;
                font-weight: 600; }
                @media screen and (max-width: 896px) {
                  .modal_target.plan div.item_list div.item div.detail div.description p.price strong {
                    font-size: 2.35855vw; } }
                @media screen and (max-width: 480px) {
                  .modal_target.plan div.item_list div.item div.detail div.description p.price strong {
                    font-size: 5.1320625vw; } }
    .modal_target.plan a.button.orange {
      background: #f2871e;
      color: #fff; }