/*Common
-------------------------------------------------------------------*/

.slider li img {
  height: auto !important;
}

.bx-wrapper {
  margin: 0 !important;
  box-shadow: 0 0 0 #fff !important;
  border: none !important;
}

.top_googlemaparea {
  padding: 10px;
  background: #fff;
}

.map iframe {
  width: 100%;
  height: 40vh;
}

.hotel_links {
  display: flex;
  align-items: center;
  padding-top: 10px;
}

.hotel_links h3 {
  border: 1px solid rgba(69, 61, 13, 0.4);
  width: 5em;
  height: 5em;
  margin-right: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(69, 61, 13, 0.5);
  color: #fff;
}

.hotel_links ul {
  display: flex;
  flex-wrap: wrap;
  flex: 1;
}

.hotel_links li {
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 5px;
}

.hotel_links li a {
  color: #534741;
  text-decoration: none;
  display: block;
  background: url("../common/img/allow_red_LR.svg") no-repeat right 10px center;
  background-size: 7px;
  padding: 3px 25px 3px 20px;
  border: 1px solid rgba(69, 61, 13, 0.3);
  border-radius: 40px;
}

.hotel_links li a:hover {
  color: #8a1618;
  text-decoration: underline;
}

/*ホテル名で探す*/
#hotel_search {
  background: #f0edeb;
}

#hotel_search_inner {
  padding: 0 15px 15px 15px;
}

#hotel_search_inner h2 {
  position: relative;
}

#hotel_search_inner h2::after {
  content: "";
  border-bottom: 1px solid #534741;
  width: 50%;
  height: 1px;
  display: block;
  margin: 0 calc(50% - 25%);
}

.select_hotelset > div > dl > dt {
  display: flex;
  width: 6em;
  height: 2em;
  justify-content: center;
  align-items: center;
  border-top: 1px dotted #534741;
  border-bottom: 1px dotted #534741;
  line-height: 1;
  margin: 15px auto 15px;
}

.select_hotel_list,
.search_room select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  max-width: 100%;
  padding: 10px;
  border-radius: 5px;
  width: 100%;
  font-size: 100%;
  border: none;
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
    center #fff;
  background-size: 10px;
  color: #534741;
}

.search_room select {
  width: auto;
  padding-right: 30px;
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 10px
    center #fff;
  background-size: 10px;
}

.search_room dt {
  font-size: 110%;
  font-weight: bold;
  margin-bottom: 5px;
}

.search_room dt::before {
  content: "■";
  color: #978475;
  margin-right: 2px;
}

.search_room dd {
  margin-bottom: 10px;
}

.sp_layout_search_room {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.sp_layout_search_room dl {
  margin-right: 0px;
}

.btn_search_room input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #fff;
  text-align: center;
  border: none;
  font-weight: bold;
}

.planlist a {
  display: block;
  background: url("../common/img/allow_white_TD.svg") no-repeat right 20px
      center,
    #534741;
  background-size: 10px, auto;
  padding: 10px;
  border-radius: 5px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
}

.infolinklist ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  font-size: 95%;
}

.infolinklist li {
  margin-right: 20px;
  line-height: 1.2;
  margin-bottom: 7px;
}

.infolinklist a {
  display: block;
  color: #534741;
  text-decoration: none;
}

.infolinklist a::before {
  content: "\025b6";
  color: #df6968;
  font-size: 60%;
  margin-right: 2px;
  line-height: 1;
  position: relative;
  top: -2px;
}

/*エリア別でホテルを探す*/
#map_search {
  padding: 15px;
  position: relative;
}

#map_search h2::after {
  content: "";
  border-bottom: 1px solid #534741;
  width: 70%;
  height: 1px;
  display: block;
  margin: 0 calc(50% - 35%);
}

#map_search h2 {
  margin-bottom: 20px;
}

.accordion {
  margin-bottom: 10px;
}

.accordion dt.map_text_title {
  background: #ddd;
  text-align: center;
  font-weight: bold;
  border-radius: 5px;
  margin-bottom: 10px;
  padding: 10px 15px;
}

.hotelgroup_hokkaido-touhoku dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #e2d2e2;
  background-size: 10px, auto;
}

.hotelgroup_kantou dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #e0e3c9;
  background-size: 10px, auto;
}

.hotelgroup_koushinetu-hokuriku dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #a8bbb6;
  background-size: 10px, auto;
}

.hotelgroup_hokuriku dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #a8bbb6;
  background-size: 10px, auto;
}

.hotelgroup_toukai dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #f6e7c0;
  background-size: 10px, auto;
}

.hotelgroup_kinki dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #e6beb9;
  background-size: 10px, auto;
}

.hotelgroup_chuugoku-shikoku dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #c6e1e1;
  background-size: 10px, auto;
}

.hotelgroup_kyusyu-okinawa dt.map_text_title {
  background: url("../common/img/allow_brown_TD.svg") no-repeat right 20px
      center,
    #e5e5e5;
  background-size: 10px, auto;
}

.areasearchset .inner dt {
  font-weight: bold;
  font-size: 115%;
}

.areasearchset .inner dd {
  margin-bottom: 20px;
}

.areasearchset .inner dd a {
  display: block;
  padding: 10px 5px;
  color: #534741;
  text-decoration: none;
  border-bottom: 1px dotted #534741;
}

.areasearchset .inner dd a::before {
  content: "\025b6";
  font-size: 70%;
  color: #df6968;
  margin-right: 2px;
}

/*オープン予定一覧*/
#newopen {
  background: #f2f4e9;
  padding: 20px 15px;
}

#newopen dl {
  margin-top: 20px;
}

#newopen dt {
  background: #736357;
  border-radius: 5px;
  text-align: center;
  padding: 5px 0;
  margin-bottom: 7px;
  color: #fff;
}

#newopen dd {
  margin-bottom: 15px;
  line-height: 1.4;
}

#newopen dd:last-of-type {
  margin-bottom: 0;
}

.openinfo {
  clear: both;
  margin-top: 10px;
}

/*コンセプト*/
#concept {
  padding: 15px;
}
#conceptarea {
  background: #f4f2f0;
  padding: 20px;
  box-shadow: 0 0 3px 3px rgba(0, 0, 0, 0.1) inset;
  color: #7d6c4f;
  font-size: 120%;
  font-family: YuMincho, /* Mac用 */ "Yu Mincho", /* Windows用 */ serif;
  font-weight: bolder;
}

#conceptarea h3 {
  text-align: center;
  margin-bottom: 15px;
}

#conceptarea img {
  width: 200px;
}

/*新着情報*/
.parallax {
  background-position: center top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  padding: 15px;
}

.parallax.bgimg {
  background-image: url("img/news_backimg.jpg");
}

#news h2 {
  color: #fff;
}

.newslist {
  margin: 15px 0;
}

.newslist a {
  color: #534741;
  text-decoration: none;
  background: #fff;
  display: block;
  padding: 10px;
  border-radius: 3px;
  line-height: 1.3;
}

.newslist li {
  margin-bottom: 15px;
}

.newsdate {
  margin-bottom: 8px;
  color: #baa183;
  line-height: 1;
}

.newsdate span {
  font-size: 130%;
}

.newslist li h3 {
  font-size: 110%;
}

/*フッターバナー*/

#footer_banner {
  padding: 15px;
}

#footer_banner ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

#footer_banner li {
  margin: 0 2px 0;
  max-width: 285px;
  width: calc(50% - 4px);
  height: auto;
}

#footer_banner li img {
  width: 100%;
  height: auto;
}

#footer_banner li a {
  line-height: 0;
}

#hotelnews {
  padding: 15px;
}

.hotelnewsarea {
  border: 1px solid #ccc;
  padding: 15px;
}

.hotelnewsarea ul {
  margin-bottom: 15px;
}

.hotelnewsarea li {
  border-bottom: 1px dotted #999;
}

.hotelnewsarea a {
  display: block;
  text-decoration: none;
  padding: 10px 0;
}

.btn_more a {
  background: #000;
  text-align: center;
  color: #fff;
}

/* mobile only*/
@media all and (max-width: 767px) {
  .bx-prev,
  .bx-next {
    display: none;
  }

  .colorbox {
    width: 90% !important;
  }

  #slide_sp {
    min-height: 200px;
  }

  /*エリア別でホテル検索*/
  .accordion .inner,
  #hotel_search .inner {
    display: none;
  }
  .accordion > dt,
  #hotel_search .h2 {
    cursor: pointer;
    padding: 10px;
    pointer-events: all;
  }

  .accordion {
    display: block !important;
  }

  /*ホテル名で探す*/
  #hotel_search_inner h2 {
    background: url("../common/img/allow_brown_TD.svg") no-repeat right 30px
      center;
    background-size: 10px;
    padding-bottom: 5px;
    cursor: pointer;
  }

  .btn_search_room {
    margin-bottom: 10px;
  }

  .btn_search_room input {
    border-radius: 4px;
    background: url("../common/img/allow_white_TD.svg") no-repeat right 20px
        center,
      linear-gradient(
        90deg,
        rgba(156, 39, 45, 1) 0%,
        rgba(153, 40, 44, 1) 29.88%,
        rgba(143, 41, 41, 1) 53.29%,
        rgba(126, 44, 36, 1) 74.52%,
        rgba(103, 49, 29, 1) 94.33%,
        rgba(95, 50, 26, 1) 100%
      );
    background-size: 10px, auto;
    width: 100%;
    padding: 20px 10px;
    font-size: 100%;
  }

  .planlist {
    margin-bottom: 10px;
  }

  .planlist a {
    width: 100% !important;
  }

  /* .planlist a{
        width: calc(100% - 20px);
    } */

  @media (max-width: 767px) {
    #hotel_search_inner .planlist {
      margin-left: -15px;
      margin-right: -15px;
    }
    #hotel_search_inner .planlist a {
      width: calc(100% + 30px);
      border-radius: 0;
    }
  }

  /*新着情報　パララックス*/
  .parallax {
    background: url("img/news_backimg.jpg") no-repeat center center;
    background-size: cover;
  }

  .newstext {
    display: none;
  }
}

/* PC only*/
@media all and (min-width: 768px) {
  /*bx-slider start*/
  #slidearea {
    overflow: hidden;
    width: 100%;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  .slider {
    position: relative;
    left: calc((100vw - 1210px) / 2); /* (100vw - SlideWidth) / 2 */
    overflow: visible !important;
    height: 300px !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /*アコーディオン制御*/
  .accordion dt,
  #hotel_search h2 {
    pointer-events: none;
  }

  /*bx-slider END*/

  .select_hotelset > div > dl > dt {
    display: flex;
    width: 4em;
    height: 4em;
    justify-content: center;
    align-items: center;
    border: 1px solid #534741;
    border-radius: 50%;
    line-height: 1;
    margin: 0;
    margin-right: 15px;
  }

  .select_hotel_list {
    min-width: 400px;
  }

  #select_hotel {
    margin-bottom: 20px;
  }

  #searchForm {
    min-width: 800px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-right: 20px;
    flex-grow: 1;
  }

  .select_hotelset {
  }

  #hotel_search_inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 0 20px 0;
  }

  #hotel_search_inner h2 {
    text-align: left;
    position: relative;
    width: 100%;
    margin-bottom: 30px;
  }

  #hotel_search_inner h2::after {
    width: calc(100% - 7.5em);
    height: 1px;
    margin: 0;
    position: absolute;
    right: 0;
    bottom: 0.7em;
  }

  .rwith_rightarea {
    width: 340px;
  }

  .search_box {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: flex-start;
    gap: 20px;
  }

  .select_hotelset > div > dl {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }

  #search_hotel > dl {
    align-items: flex-start;
  }

  .search_room > dl {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .search_room dt {
    min-width: 9em;
  }

  #submit_button {
    cursor: pointer;
    background: url("../common/img/allow_white_TD.svg") no-repeat center bottom
      18px;
    background-size: 10px;
    border: 1px solid #9c272d;
    width: 120px;
    height: 120px;
    position: relative;
    font-size: 110%;
    display: block;
    border-radius: 50%;
    transition: 0.7s all;
    margin-left: 30px;
  }

  .btn_search_room {
    position: relative;
    z-index: 0;
    justify-self: center;
    align-self: center;
  }

  .btn_search_room::before {
    content: "";
    display: block;
    width: 114px;
    height: 114px;
    background: linear-gradient(
      143.67deg,
      rgba(156, 39, 45, 1) 0%,
      rgba(153, 40, 44, 1) 29.88%,
      rgba(143, 41, 41, 1) 53.29%,
      rgba(126, 44, 36, 1) 74.52%,
      rgba(103, 49, 29, 1) 94.33%,
      rgba(95, 50, 26, 1) 100%
    );
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 50%;
    transition: 0.5s all;
    opacity: 1;
    z-index: -1;
    margin-left: 30px;
  }

  .btn_search_room:hover::before {
    opacity: 0;
  }

  .btn_search_room::after {
    content: "";
    display: block;
    width: 114px;
    height: 114px;
    background: linear-gradient(
      143.67deg,
      rgba(97, 121, 0, 1) 0%,
      rgba(94, 119, 0, 1) 28.41%,
      rgba(84, 112, 0, 1) 50.68%,
      rgba(67, 100, 0, 1) 70.87%,
      rgba(44, 83, 0, 1) 89.72%,
      rgba(28, 72, 0, 1) 100%
    );
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 50%;
    z-index: -2;
    margin-left: 30px;
  }

  .planlist {
    margin-bottom: 20px;
  }

  .planlist a {
    width: 100%;
    background: url("../common/img/allow_white_LR.svg") no-repeat right 20px
        center,
      #534741;
    background-size: 6px, auto;
    transition: 0.5s all;
  }

  .planlist a:hover {
    background: url("../common/img/allow_white_LR.svg") no-repeat right 20px
        center,
      #9c272d;
    background-size: 6px, auto;
  }

  .infolinklist a:hover {
    text-decoration: underline;
  }

  /*エリア別でホテルを探す*/
  #area_search {
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .hotelgroup_hokkaidou-touhoku dt.map_text_title {
    background: #e2d2e2;
    background-size: 10px, auto;
  }

  .hotelgroup_kantou dt.map_text_title {
    background: #e0e3c9;
    background-size: 10px, auto;
  }

  .hotelgroup_koushinetu-hokuriku dt.map_text_title {
    background: #a8bbb6;
    background-size: 10px, auto;
  }

  .hotelgroup_hokuriku dt.map_text_title {
    background: #a8bbb6;
    background-size: 10px, auto;
  }

  .hotelgroup_toukai dt.map_text_title {
    background: #f6e7c0;
  }

  .hotelgroup_kinki dt.map_text_title {
    background: #e6beb9;
  }

  .hotelgroup_chuugoku-shikoku dt.map_text_title {
    background: #c6e1e1;
  }

  .hotelgroup_kyusyu-okinawa dt.map_text_title {
    background: #e5e5e5;
  }

  #map_search {
    padding: 0;
  }

  #map_search h2 {
    text-align: left;
    padding-bottom: 10px;
    position: relative;
    width: 11em;
    z-index: 1;
  }

  #map_search h2::after {
    width: 100%;
    margin: 0;
    margin-top: 10px;
  }

  .accordion {
    position: absolute;
    left: 0;
    top: 70px;
    z-index: 5;
    width: 300px;
    height: auto;
    /*background: rgba(204,42,45,1.00);*/
    padding: 15px;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.3);
    border-radius: 5px;
  }

  .areasearchset > dl {
    opacity: 1;
    display: none;
    background: rgba(255, 255, 255, 0.9);
  }

  .areasearchset .inner dd:last-of-type {
    margin-bottom: 0;
  }

  .mapsearch_img area {
    pointer-events: none;
  }

  .mapsearch_img {
    position: relative;
    top: -80px;
  }

  .mapsearch_img area {
    cursor: pointer;
    display: block;
    background: rgba(170, 56, 57, 1);
  }

  .btn_close_area {
    text-align: center;
    margin-top: 15px;
  }

  .btn_close {
    display: block;
    width: 40%;
    margin: 0 auto;
    padding: 5px;
    background: rgba(66, 66, 66, 0.4);
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    border-radius: 30px;
    line-height: 1;
  }

  #coordinate_search {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-left: 30px;
  }

  #coordinate_search dl {
    width: calc(33% - 20px);
    margin: 0 10px 30px;
  }

  #coordinate_search dt {
    margin-bottom: 10px;
    text-align: center;
    font-weight: bold;
    padding: 5px;
  }

  .coordinate_hokkaidou-touhoku dt {
    background: #e2d2e2;
  }

  .coordinate_kantou dt {
    background: #e0e3c9;
  }

  .coordinate_koushinetu-hokuriku dt {
    background: #a8bbb6;
  }

  .coordinate_hokuriku dt {
    background: #a8bbb6;
  }

  .coordinate_toukai dt {
    background: #f6e7c0;
  }

  .coordinate_kinki dt {
    background: #e6beb9;
  }

  .coordinate_chuugoku-shikoku dt {
    background: #c6e1e1;
  }

  .coordinate_kyusyu-okinawa dt {
    background: #e5e5e5;
  }

  #coordinate_search ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  #coordinate_search li {
    width: 97px;
    margin-bottom: 5px;
  }

  #coordinate_search li a {
    display: block;
    text-decoration: none;
    color: #fff;
    text-align: center;
    padding: 10px;
    background: #736357;
    border-radius: 5px;
    transition: 0.5s all;
    line-height: 1;
  }

  #coordinate_search li a:hover {
    background: #9c272d;
  }

  .iziModal-content {
    padding: 20px !important;
    border-radius: 5px;
    box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.1);
  }

  dt.map_text_title {
    margin-bottom: 10px;
    font-weight: bold;
    background: rgba(231, 231, 231, 1);
    border-radius: 5px;
    padding: 5px 10px;
  }

  /*オープン予定一覧*/
  #newopen {
    max-width: 1080px;
    margin: -20px auto 40px;
    /*display: flex;
        align-items: center;*/
    padding: 30px;
    position: relative;
  }

  #newopen::before {
    content: "";
    display: block;
    border: 1px solid #d1d9ad;
    position: absolute;
    top: 5px;
    left: 5px;
    width: calc(100% - 12px);
    height: calc(100% - 12px);
  }

  .infobox {
    display: flex !important;
    align-items: center;
  }

  #newopen h2 {
    padding: 0 30px;
    width: 250px;
    position: relative;
    z-index: 5;
  }
  #newopen dl {
    margin: 0;
    flex: 1;
    position: relative;
    z-index: 5;
  }

  #newopen dt {
    clear: left;
    float: left;
    width: 5em;
    padding: 2px;
  }

  #newopen dd {
    padding: 2px;
    padding-left: 6em;
    margin-bottom: 15px;
  }

  #newopen dd:last-of-type {
    margin-bottom: 0;
  }

  .openinfo {
    display: flex;
    align-items: center;
    width: 100%;
    text-align: center;
    border-top: 1px solid #b7b1a9;
    padding-top: 10px;
  }

  .openinfo p {
    width: 100%;
  }

  /*コンセプト*/
  #concept {
    padding: 0;
  }

  #conceptarea {
    text-align: center;
    padding: 80px 0;
    background: url("img/concept_leftback.svg") no-repeat left center,
      url("img/concept_rigthback.svg") no-repeat right center, #f4f2f0;
    background-size: contain, contain, auto;
  }

  #conceptarea h3 {
    margin-bottom: 30px;
  }

  #conceptarea h3 img {
    width: 250px;
  }

  #conceptarea p {
    font-size: 110%;
    line-height: 2;
  }

  /*新着情報*/

  #newsarea {
    padding: 80px 0;
    max-width: 1200px;
    margin: 0 auto;
  }

  #newsarea h2 {
    margin-bottom: 40px;
  }

  ul.newslist {
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
  }

  ul.newslist li {
    max-width: 285px;
    margin: 0 5px;
  }

  ul.newslist li a {
    display: block;
    height: calc(100% - 40px);
    padding: 20px;
    transition: 0.5s all;
  }

  ul.newslist li a:hover {
    box-shadow: 0 0 10px 5px rgba(255, 255, 255, 0.7);
    background: rgba(251, 252, 236, 1);
  }

  .newsdate {
    margin-bottom: 12px;
  }

  ul.newslist li h3 {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dotted #baa183;
  }

  .btn_more a {
    padding: 12px 20px;
    max-width: 300px;
    margin: 0 auto;
  }

  /*ホテル一覧*/

  #hotellist {
    background: #f0edeb;
  }

  #hotellistset {
    max-width: 1200px;
    margin: 0 auto;
    padding: 50px 0;
  }

  #hotellistset h2 {
    margin-bottom: 50px;
  }

  #hotellistset ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
  }

  #hotellistset li {
    width: 300px;
    margin: 0 10px 20px;
    background: #fff;
    line-height: 1.3;
  }

  #hotellistset li h4 {
    background: #7e7570;
    text-align: center;
    padding: 10px;
    line-height: 1;
    color: #fff;
    font-weight: bold;
  }

  #hotellistset li dl {
    padding: 10px;
    font-size: 90%;
  }

  #hotellistset dt {
    margin-bottom: 5px;
  }

  #hotellistset dd {
    margin-bottom: 10px;
    margin-left: 1em;
  }

  #hotellistset li dl a,
  #hotellistset li dl h5 {
    text-decoration: none;
    color: #534741;
    display: block;
    font-weight: bold;
    margin-left: 1em;
    text-indent: -1em;
  }

  #hotellistset li dl h5 {
    margin-left: 0.7em;
    text-indent: 0;
  }

  #hotellistset li dl a:hover {
    color: #df6968;
  }

  #hotellistset li dl a::before {
    content: "\025b6";
    color: #df6968;
    font-size: 60%;
    margin-right: 2px;
    line-height: 1;
    position: relative;
    top: -2px;
  }

  /*フッターバナー*/

  #footer_banner ul {
    max-width: 900px;
    margin: 0 auto;
  }

  #footer_banner li {
    margin: 0 5px;
  }

  /*お知らせ　news*/
  .hotelnewsarea {
    max-width: calc(1200px - 60px);
    margin: 0 auto;
    padding: 30px;
  }

  #hotelnews h2 {
    margin-bottom: 10px;
  }

  .hotelnewsarea a {
    transition: 0.5s all;
    padding: 8px 15px;
  }

  .hotelnewsarea li a:hover {
    background: #eceddb;
  }

  .btn_more a:hover {
    background: #932c2d;
  }
}

@media all and (min-width: 1200px) {
  /*bx-slider start*/

  .slider li {
    width: 1200px !important;
    height: auto !important;
    margin: 0 10px 0 0px;
  }

  .slider li img {
    height: auto !important;
  }
  .bx-prev {
    display: block;
    left: calc(50% - 615px) !important;
  }

  .bx-next {
    display: block;
    right: calc(50% - 635px) !important;
  }

  /*bx-slider END*/
}

.num_btn h3 {
  text-align: center;
}

.kyuukan_info {
  text-align: center;
  margin: 0 auto;
  margin-bottom: 30px;
  max-width: 1200px;
}

.kyuukan_info h3 {
  font-weight: bold;
  color: #e10a0d;
  font-size: 120%;
  border: 2px solid #e10a0d;
  padding: 5px 0;
  margin-bottom: 15px;
}

.kyuukan_info h4 {
  margin: 10px 0;
  font-size: 120%;
}

.kyuukan_info ul {
  max-width: 950px;
  margin-bottom: 15px;
}

.kyuukan_info li {
  line-height: 1.2;
  border: 1px solid #b3b3b3;
  padding: 5px 10px;
  width: calc(100% - 20px - 2px);
  margin-bottom: 5px;
}

.newsbtn a {
  padding: 5px !important;
}

@media all and (min-width: 1200px) {
  .kyuukan_info ul {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: auto;
    margin: 0 auto 10px;
  }

  .kyuukan_info li {
    display: inline-block;
    margin: 0 5px 5px;
    width: calc(23% - 10px);
  }
}

/* ▼▼▼ ホテル検索モーダル・ボタン スタイル（最終確定版） ▼▼▼ */

/* --- 人数選択ボタン --- */
.pax-selector-button {
  margin-left: 30px;
  display: inline-flex;
  align-items: center;
  padding: 8px 15px;
  border: 1px solid #ccc;
  border-radius: 8px;
  background-color: #fff;
  cursor: pointer;
  font-size: 16px;
  color: #333;
  background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path fill="%23534741" d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px;
  padding-right: 40px;
}
.pax-selector-button .pax-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  background-color: #534741;
  -webkit-mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/></svg>');
  mask-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z"/></svg>');
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* --- モーダル本体 --- */

/* デフォルトでは非表示 */
.people-modal {
  display: none;
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  background: rgba(0, 0, 0, 0.6) !important;
}
/* is-visibleクラスが付いたら強制的に表示 */
.people-modal.is-visible {
  display: block !important;
}

.people-modal__panel {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: min(560px, calc(100% - 32px)) !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.2) !important;
  padding: 12px 24px !important;
}

/* ヘッダー */
.people-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 0 10px;
  border-bottom: 1px solid #eee;
}
.people-modal__header h3 {
  font-size: 1.1rem;
  margin: 0;
}
.people-modal__close {
  appearance: none;
  background: none;
  border: none;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #888;
}

/* ボディ */
.people-modal__body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 24px;
  row-gap: 16px;
  padding: 16px 0 12px;
}
.people-modal__body > .people-field {
  grid-column: span 2;
}
.people-modal__body > .people-split {
  grid-column: span 2;
}
.people-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.people-field {
  margin: 0;
}
.people-field h4 {
  margin: 0 0 8px;
  font-size: 1rem;
}
.people-field label {
  display: block;
  margin-bottom: 6px;
  font-size: 0.9rem;
  color: #555;
}
.people-field select {
  width: 100%;
  height: 44px;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-radius: 8px;
  background: #fff;
  font-size: 1rem;
}

/* プレビュー */
.people-preview {
  grid-column: 1 / -1;
  order: 99;
  margin-top: 8px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #f7f7f7;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.95rem;
}

/* フッター */
.people-modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 12px 0 4px;
  border-top: 1px solid #eee;
}
.people-btn {
  min-height: 44px;
  padding: 8px 24px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1;
  cursor: pointer;
  transition: filter 0.15s ease;
}
.people-btn--ghost {
  background: #fff;
  border: 1px solid #ccc;
  color: #333;
}
.people-btn--primary {
  background: #f7931e;
  border: none;
  color: #fff;
}
.people-btn--ghost:hover {
  background: #f5f5f5;
}
.people-btn--primary:hover {
  filter: brightness(1.05);
}

/* ▲▲▲ ここまで ▲▲▲ */

/* =========================================================
 * 入力UI 統一（ホテル/CI/CO/部屋数/人数）— 既存CSS前提・副作用最小
 * 作用範囲：.ttf-* と .sp_layout_search_room のみ
 * PC/SP でトークンを分離し、SPはメディアクエリ内で差し替える
 * ========================================================= */

/* ===== Base Tokens (PC) ===== */
:root {
  /* サイズ */
  --ttc-input-h: 54px;
  --ttc-radius: 4px;
  --ttc-pad-x: 10px;
  --ttc-icon-gap: 14px;

  /* 色/装飾 */
  --ttc-border: #e5ded7;
  --ttc-border-focus: #b79783;
  --ttc-bg: #fff;
  --ttc-text: #4b4038;
  --ttc-placeholder: #b7ada6;
  --ttc-shadow: 0 1px 0 rgba(0, 0, 0, 0.02) inset;

  /* 室数 select 幅/間隔 */
  --ttc-rooms-w: 120px;
  --ttc-rooms-gap: 6px;

  /* タイポ */
  --ttc-font-size: 16px;

  /* ラベル/グリッド間隔 */
  --ttc-grid-col-gap: 16px;
  --ttc-grid-row-gap: 18px;
  --ttc-dt-mb: 8px;
}

/* ===== SP Tokens override ===== */
@media (max-width: 767.98px) {
  :root {
    --ttc-input-h: 56px; /* タップしやすさ優先 */
    --ttc-radius: 4px;
    --ttc-pad-x: 12px;
    --ttc-icon-gap: 12px;

    --ttc-font-size: 15px;

    --ttc-rooms-w: 108px;
    --ttc-rooms-gap: 4px;

    --ttc-grid-col-gap: 14px;
    --ttc-grid-row-gap: 16px;
    --ttc-dt-mb: 6px;
  }
}

/* ラッパの基準化（見た目は変えない） */
.ttf-hotel-wrap,
.ttf-ci-wrap,
.ttf-co-wrap,
.ttf-people-wrap,
.ttf-rooms-wrap {
  position: relative;
  display: block;
}

/* 共通の見た目 */
.ttf-hotel,
.ttf-hotel-wrap select,
.ttf-ci,
.ttf-ci-wrap input[type="text"],
.ttf-co,
.ttf-co-wrap input[type="text"],
.ttf-rooms,
.ttf-rooms-wrap select,
.ttf-people,
.ttf-people-wrap > a,
.ttf-people-wrap > button,
.ttf-people-wrap select {
  display: block;
  width: 100%;
  height: var(--ttc-input-h);
  line-height: calc(var(--ttc-input-h) - 2px);
  border-radius: var(--ttc-radius);
  border: 1px solid var(--ttc-border);
  background: var(--ttc-bg);
  color: var(--ttc-text);
  padding: 0 calc(var(--ttc-pad-x) + 14px) 0 calc(var(--ttc-pad-x) + 14px);
  box-shadow: var(--ttc-shadow);
  font-size: var(--ttc-font-size);
  text-align: left;
  box-sizing: border-box;
}

/* placeholder */
.ttf-ci,
.ttf-co,
.ttf-ci-wrap input[type="text"],
.ttf-co-wrap input[type="text"] {
  cursor: text;
}
.ttf-ci::placeholder,
.ttf-co::placeholder,
.ttf-ci-wrap input::placeholder,
.ttf-co-wrap input::placeholder {
  color: var(--ttc-placeholder);
}

/* フォーカス */
.ttf-hotel:focus,
.ttf-hotel-wrap select:focus,
.ttf-ci:focus,
.ttf-ci-wrap input[type="text"]:focus,
.ttf-co:focus,
.ttf-co-wrap input[type="text"]:focus,
.ttf-rooms:focus,
.ttf-rooms-wrap select:focus,
.ttf-people:focus,
.ttf-people-wrap > a:focus,
.ttf-people-wrap > button:focus,
.ttf-people-wrap select:focus {
  outline: none;
  border-color: var(--ttc-border-focus) !important;
  box-shadow: 0 0 0 3px rgba(183, 151, 131, 0.15);
}

/* ▼（select系） */
.ttf-hotel,
.ttf-hotel-wrap select,
.ttf-rooms,
.ttf-rooms-wrap select,
.ttf-people-wrap select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%236a5a50' d='M7 10l5 5 5-5z'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right calc(var(--ttc-pad-x) + 6px) center !important;
  background-size: 18px 18px !important;
  padding-right: calc(var(--ttc-pad-x) + 28px) !important;
}

/* 人数が a/button の場合の▼ */
.ttf-people,
.ttf-people-wrap > a,
.ttf-people-wrap > button {
  position: relative;
  cursor: pointer;
}
.ttf-people::after,
.ttf-people-wrap > a::after,
.ttf-people-wrap > button::after {
  content: "";
  position: absolute;
  right: calc(var(--ttc-pad-x) + 8px);
  top: 50%;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  pointer-events: none;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%236a5a50' d='M7 10l5 5 5-5z'/></svg>")
    no-repeat center/contain;
}

/* CI/CO 入力の左カレンダー（テキスト入力のみ） */
.ttf-ci,
.ttf-ci-wrap input[type="text"],
.ttf-co,
.ttf-co-wrap input[type="text"] {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%236a5a50' d='M7 2a1 1 0 0 1 1 1v1h8V3a1 1 0 1 1 2 0v1h1a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h1V3a1 1 0 1 1 2 0v1zm-2 6v10h14V8H5zm3 3h2v2H8v-2zm4 0h2v2h-2v-2z'/></svg>");
  background-repeat: no-repeat;
  background-position: left calc(var(--ttc-pad-x) + 2px) center;
  background-size: 20px 20px;
  padding-left: calc(var(--ttc-pad-x) + 28px) !important;
}

/* チェックアウトの下に余白を確保 */
.sp_layout_search_room {
  margin-top: 22px;
}

/* 室数・人数のレイアウト */
.sp_layout_search_room {
  display: grid !important;
  grid-template-columns: max-content 1fr;
  column-gap: var(--ttc-grid-col-gap);
  row-gap: var(--ttc-grid-row-gap);
  align-items: start;
  justify-content: start;
}
.sp_layout_search_room > dl {
  margin: 0 !important;
  min-width: 0;
}
.sp_layout_search_room dl {
  display: block !important;
}
.sp_layout_search_room dl dt {
  display: block !important;
  margin: 0 0 var(--ttc-dt-mb) 0 !important;
  font-size: 110%;
  font-weight: 700;
  white-space: nowrap;
}
.sp_layout_search_room dl dt::before {
  content: "■";
  color: #978475;
  margin-right: 6px;
}

/* 室数：「1 ▼ 室」を常に1行で */
.ttf-rooms-wrap {
  display: inline-flex;
  align-items: center;
  gap: var(--ttc-rooms-gap);
  white-space: nowrap;
  vertical-align: middle;
}
.ttf-rooms,
.ttf-rooms-wrap select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  flex: 0 0 var(--ttc-rooms-w);
  width: var(--ttc-rooms-w) !important;
  min-width: var(--ttc-rooms-w) !important;
  max-width: var(--ttc-rooms-w) !important;
  padding-right: calc(var(--ttc-pad-x) + 28px) !important;
  background-color: #fff;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%236a5a50' d='M7 10l5 5 5-5z'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right calc(var(--ttc-pad-x) + 6px) center !important;
  background-size: 18px 18px !important;
}

/* 無効状態 */
.ttf-hotel:disabled,
.ttf-hotel-wrap select:disabled,
.ttf-ci:disabled,
.ttf-ci-wrap input[type="text"]:disabled,
.ttf-co:disabled,
.ttf-co-wrap input[type="text"]:disabled,
.ttf-rooms:disabled,
.ttf-rooms-wrap select:disabled,
.ttf-people:disabled,
.ttf-people-wrap > button:disabled,
.ttf-people-wrap select:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* （任意）STEPバッジの楕円化対策 */
.step-circle,
.step_round,
.step-badge,
.stepBadge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  padding: 0;
  box-sizing: content-box;
  line-height: normal;
}

/* ボタン右マージン（必要なら） */
.btn_search_room input[type="submit"],
.btn_search_room input[type="button"],
.btn_search_room button {
  margin-right: 24px !important;
}

/* 濃さノブ：ここだけ調整すれば全体に反映 */
:root {
  --tt-overlay: rgba(0, 0, 0, 0.32);
}

/* 先出し用の軽量オーバーレイ（クリックは通す） */
body.tt-pick-open::after,
#pax_modal.people-modal.tt-pick-open::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2147483000; /* カレンダー以下/ネイティブUIの下扱い */
  background: var(--tt-overlay);
  pointer-events: none; /* 触れない＝UIはそのまま操作可 */
  opacity: 1;
  /* 遅延を感じさせないためトランジションを切る */
  transition: none;
}

/* 改行が見えない症状の暫定リセット（テスト用） */
.contentsarea,
.contentsarea * {
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}
.contentsarea p {
  display: block !important;
  margin: 1em 0 !important;
  line-height: 1.6 !important;
}
.contentsarea br {
  display: inline !important;
}



/* ホテル選択プルダウン　アイコン */
.search_box .select_hotelset #select_hotel select.select_hotel_list[name="hotel_list"]{
  background-image: url("../common/img/hotel-icon.svg") !important;
  background-repeat: no-repeat !important;
  background-position: 12px center !important; /* 位置 */
  background-size: 22px 22px !important;       /* 大きさ（少し大きめ） */
  padding-left: 44px !important;               /* 文字と被らない最小限の余白 */
}


/* ========== Scoped to .tt-tax-table ========== */
.tt-tax-table {
    max-width: 640px;
    color: #222;
    margin: 2rem 0;
}
.tt-tax-table__wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
/* Table base */
.tt-tax-table__table {
    width: 100%;
    table-layout: fixed;                 /* 文字が長くてもカラム幅を詰めやすく */
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #bbb;              /* 外枠（濃いめ） */
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    font-size: 14px;                     /* 横長に見せる用に小さめ */
    line-height: 1.4;
}
/* Header */
.tt-tax-table__head-top {
    background: #ddd;
}  /* 一番上の行だけ薄グレー */
.tt-tax-table__head-sub th {
    background: #fafafa;
    font-weight: normal;
}
/* Cells */
.tt-tax-table__th, .tt-tax-table__td {
    padding: 10px 12px;
    border-bottom: 1px solid #ccc;       /* 内側ボーダー（濃いめ） */
    vertical-align: middle;
}
/* 縦の区切り線 */
.tt-tax-table__th + .tt-tax-table__th, .tt-tax-table__td + .tt-tax-table__td {
    border-left: 1px solid #ccc;
}
/* 左カラム：PCは折り返さず狭めに見せる */
.tt-tax-table__th--price {
    text-align: left;
    width: 30%;
    white-space: nowrap;
}
.tt-tax-table__th--tax {
    text-align: center;
}
.tt-tax-table__th {
    text-align: center;
}
.tt-tax-table__td--price {
    text-align: left;
    white-space: nowrap;
}
/* --- 仕上げ：最後の行の下線は外枠で代替（任意） --- */
.tt-tax-table__table tbody tr:last-child .tt-tax-table__td {
    border-bottom: 0;
}

/* ========== Responsive (～480px) ========== */
@media (max-width: 480px) {
/* 文字が詰まり過ぎないよう微調整 */
.tt-tax-table__table {
    font-size: 13px;
}
.tt-tax-table__th, .tt-tax-table__td {
    padding: 8px 10px;
}
/* スマホでは左カラムを折り返し可に（右端切れ対策） */
.tt-tax-table__th--price, .tt-tax-table__td--price {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    width: auto;                        /* PCの30%指定を解除 */
}
}


.an_title {
    color: #000000;
    font-weight: normal;
    font-size: 120%;
    display: block;
    padding: 10px 0;
    background-color: #FFDA9C;
    text-align: center;
    line-height: 1.5em;
    margin-bottom: 1em;
}
.announcement {
  background-color: #fff;
    display: block;
    padding: 0 10px;
	max-width: 1200px;
	margin: 20px auto 0 !important;
}
.announcement p{
    text-align: center;
    font-size: 16px;
}
.br01 {
    display: none;		
	}
.br02 {
    display: inherit;		
	}
@media screen and (max-width: 767px) {
	.br01 {
    display: inherit;		
	}
	.br02 {
    display: none;		
	}
	.announcement p{
    text-align: left;	
}
}
.pc_top_announce{
	width: calc(100% - 20px - 4px) !important;
	margin: 20px auto 0px!important;
	padding: 20px 20px 0;
	background: #fff;
	border:1px solid #ccc;
}

.pc_top_announce h2{
	margin-top: 0;
}

.tax-table {
  width: min(640px, 100%); /* 上限を付けつつレスポンシブ */
  margin: 0 auto 1rem; /* ★中央寄せのキモ */
  border-collapse: collapse;
  font-size: clamp(14px, 1.6vw, 16px);
}
.tax-table th,
.tax-table td {
  border: 1px solid #e5e7eb;
  padding: 0.75em 1em;
}
.tax-table thead th {
  background: #f8fafc;
}
.tax-table tbody th {
  background: #fcfdff;
  white-space: nowrap;
}
.tax-table tbody td {
  text-align: left;
}
@media (max-width: 480px) {
  .tax-table tbody td {
    text-align: left;
  }
}

.bold {
  font-weight: bold;
}