@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@900&display=swap");
/*----------------------------------------
  対象の宿泊施設一覧
----------------------------------------*/
.p-stay {
  padding-top: min(6.9444444444vw, 100px);
  margin-bottom: min(3.8194444444vw, 55px);
}
@media (max-width: 767px) {
  .p-stay {
    padding-top: min(12.8205128205vw, 50px);
    margin-bottom: min(15.3846153846vw, 60px);
  }
}

.p-stay-column {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: min(3.1944444444vw, 46px);
}
@media (max-width: 767px) {
  .p-stay-column {
    grid-template-columns: auto;
    gap: min(7.6923076923vw, 30px);
  }
}
.p-stay-column__sidebar {
  position: sticky;
  top: min(8.6111111111vw, 124px);
  width: min(22.9166666667vw, 330px);
}
@media (max-width: 767px) {
  .p-stay-column__sidebar {
    position: static;
    width: auto;
  }
}

.p-stay-text {
  padding: 2em 0;
  text-align: center;
}

/*  SP用絞り込みボタン */
.p-stay-filter {
  display: none;
  color: #fff;
  background: var(--color-main);
}
@media (max-width: 767px) {
  .p-stay-filter {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    width: 100%;
    margin-bottom: 1em;
    padding: min(3.3333333333vw, 13px) min(6.4102564103vw, 25px);
    border-radius: min(1.2820512821vw, 5px);
    font-size: min(4.1025641026vw, 16px);
    font-weight: bold;
    text-align: left;
    color: #fff;
    background: var(--color-main);
  }
  .p-stay-filter:after {
    content: "";
    width: min(3.3333333333vw, 13px);
    aspect-ratio: 15/11;
    background: currentColor;
    -webkit-mask: url(../images/stay/icon_keydown.svg) no-repeat center/contain;
            mask: url(../images/stay/icon_keydown.svg) no-repeat center/contain;
  }
  .p-stay-filter[aria-expanded=true]::after {
    rotate: 180deg;
  }
}

#filter-content {
  display: contents;
}
@media (max-width: 767px) {
  #filter-content.is-hidden {
    display: none;
  }
  #filter-content.is-visible {
    display: block;
  }
}

/* 検索フォーム */
.p-stay-search-form {
  background: #EBF8FF;
  padding: min(1.3888888889vw, 20px);
  border-radius: min(0.3472222222vw, 5px);
}
@media (max-width: 767px) {
  .p-stay-search-form {
    padding: min(5.1282051282vw, 20px);
    border-radius: min(1.2820512821vw, 5px);
  }
}
.p-stay-search-form__inner {
  overflow-y: scroll;
  margin-right: max(-0.6944444444vw, -10px);
  padding-top: min(1.3888888889vw, 20px);
  padding-right: min(2.0833333333vw, 30px);
  max-height: calc(100vh - min(12.7777777778vw, 184px));
}
@media (max-width: 767px) {
  .p-stay-search-form__inner {
    overflow-y: auto;
    margin-right: 0;
    padding-top: min(5.1282051282vw, 20px);
    padding-right: 0;
    max-height: none;
  }
}
.p-stay-search-form__inner::-webkit-scrollbar {
  width: min(0.6944444444vw, 10px);
}
.p-stay-search-form__inner::-webkit-scrollbar-track {
  background: none;
}
.p-stay-search-form__inner::-webkit-scrollbar-thumb {
  background: #8CABBC;
  border-radius: 100vmax;
}
.p-stay-search-form__item + .p-stay-search-form__item {
  margin-top: min(3.4722222222vw, 50px);
}
@media (max-width: 767px) {
  .p-stay-search-form__item + .p-stay-search-form__item {
    margin-top: min(10.2564102564vw, 40px);
  }
}
.p-stay-search-form__label {
  margin-bottom: min(1.3888888889vw, 20px);
  padding-bottom: min(0.9722222222vw, 14px);
  font-size: min(1.25vw, 18px);
  font-weight: bold;
  color: var(--color-main);
  border-bottom: 1px solid #C0D3DE;
}
@media (max-width: 767px) {
  .p-stay-search-form__label {
    margin-bottom: min(5.1282051282vw, 20px);
    padding-bottom: min(3.5897435897vw, 14px);
    font-size: min(4.1025641026vw, 16px);
  }
}
.p-stay-search-form input[type=text] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 100%;
  padding: 0.7em 1em;
  border-radius: min(0.3472222222vw, 5px);
  font-family: inherit;
  color: inherit;
  background: #fff;
  border: 1px solid #AAAEAF;
}
@media (max-width: 767px) {
  .p-stay-search-form input[type=text] {
    font-size: 16px;
    border-radius: min(1.2820512821vw, 5px);
  }
}
.p-stay-search-form input[type=checkbox] {
  flex-shrink: 0;
  width: min(1.3888888889vw, 20px);
  height: min(1.3888888889vw, 20px);
  background: #fff;
  border: 1px solid #000;
}
@media (max-width: 767px) {
  .p-stay-search-form input[type=checkbox] {
    width: min(4.6153846154vw, 18px);
    height: min(4.6153846154vw, 18px);
  }
}
.p-stay-search-form__text {
  margin-top: min(0.6944444444vw, 10px);
  font-size: min(0.9027777778vw, 13px);
  line-height: 1.7;
}
@media (max-width: 767px) {
  .p-stay-search-form__text {
    margin-top: min(2.5641025641vw, 10px);
    font-size: min(3.3333333333vw, 13px);
  }
}
.p-stay-search-form__list {
  display: flex;
  flex-direction: column;
  gap: min(1.3888888889vw, 20px);
}
@media (max-width: 767px) {
  .p-stay-search-form__list {
    gap: min(5.1282051282vw, 20px);
  }
}
.p-stay-search-form__list.--grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.p-stay-search-form__list.--flex {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.p-stay-search-form__list > label {
  display: flex;
  align-items: center;
  gap: 1em;
  font-weight: 500;
  line-height: 1.25;
  cursor: pointer;
}
.p-stay-search-form__action {
  position: sticky;
  bottom: 0;
  margin-top: min(1.3888888889vw, 20px);
  padding-top: min(2.7777777778vw, 40px);
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: min(0.6944444444vw, 10px);
  background: linear-gradient(transparent, #EBF8FF 40%);
}
@media (max-width: 767px) {
  .p-stay-search-form__action {
    margin: min(10.2564102564vw, 40px) 0 min(5.1282051282vw, 20px);
    padding-top: 0;
    gap: min(2.5641025641vw, 10px);
  }
}
.p-stay-search-form__submit {
  display: block;
  width: 100%;
  padding: min(1.0416666667vw, 15px);
  border-radius: 100vmax;
  font-size: min-cp(18);
  font-weight: bold;
  text-align: center;
  color: #fff;
  background: var(--color-main);
  transition: background-color 0.3s;
}
@media (max-width: 767px) {
  .p-stay-search-form__submit {
    padding: min(3.3333333333vw, 13px);
    font-size: min(4.1025641026vw, 16px);
  }
}
.p-stay-search-form__submit:hover {
  background: rgb(0, 46.357615894, 100);
}
.p-stay-search-form__reset {
  font-weight: bold;
  line-height: 2.3;
  text-decoration: underline;
  color: var(--color-main);
}
.p-stay-search-form__reset:hover {
  color: rgb(0, 46.357615894, 100);
  text-decoration: none;
}

.p-stay-accordion + .p-stay-accordion {
  margin-top: min(2.0833333333vw, 30px);
}
@media (max-width: 767px) {
  .p-stay-accordion + .p-stay-accordion {
    margin-top: min(7.6923076923vw, 30px);
  }
}
.p-stay-accordion__title {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr auto;
  font-size: min(1.25vw, 18px);
  font-weight: bold;
  cursor: pointer;
}
@media (max-width: 767px) {
  .p-stay-accordion__title {
    font-size: min(4.1025641026vw, 16px);
  }
}
.p-stay-accordion__title:after {
  content: "";
  width: min(1.0416666667vw, 15px);
  aspect-ratio: 15/11;
  background: url(../images/stay/icon_keydown.svg) no-repeat center/contain;
}
@media (max-width: 767px) {
  .p-stay-accordion__title:after {
    width: min(3.3333333333vw, 13px);
  }
}
.p-stay-accordion[open] .p-stay-accordion__title:after {
  rotate: 180deg;
}
.p-stay-accordion .p-stay-search-form__list {
  margin-top: 1.5em;
}

/* 検索結果件数 */
.p-stay-result {
  display: flex;
  gap: min(0.4166666667vw, 6px);
  margin-bottom: min(2.0833333333vw, 30px);
}
@media (max-width: 767px) {
  .p-stay-result {
    gap: min(1.5384615385vw, 6px);
    margin-bottom: min(5.1282051282vw, 20px);
  }
}

/* 施設カード */
.p-stay-card-list {
  display: flex;
  flex-direction: column;
  gap: min(2.0833333333vw, 30px);
}
@media (max-width: 767px) {
  .p-stay-card-list {
    gap: min(7.6923076923vw, 30px);
  }
}

.p-stay-card {
  padding: min(1.9444444444vw, 28px);
  border-radius: min(0.3472222222vw, 5px);
  border: min(0.1388888889vw, 2px) solid var(--color-sub);
}
@media (max-width: 767px) {
  .p-stay-card {
    padding: min(5.8974358974vw, 23px);
    border-radius: min(1.2820512821vw, 5px);
    border-width: min(0.5128205128vw, 2px);
  }
}
.p-stay-card__categories {
  display: flex;
  gap: min(0.5555555556vw, 8px);
}
@media (max-width: 767px) {
  .p-stay-card__categories {
    gap: min(1.7948717949vw, 7px);
  }
}
.p-stay-card__categories span {
  padding: min(0.2777777778vw, 4px) min(1.0416666667vw, 15px);
  border-radius: 100vmax;
  font-size: min(0.9027777778vw, 13px);
  font-weight: bold;
  border: 1px solid var(--color-sub);
}
@media (max-width: 767px) {
  .p-stay-card__categories span {
    padding: min(0.7692307692vw, 3px) min(3.5897435897vw, 14px);
    font-size: min(3.0769230769vw, 12px);
  }
}
.p-stay-card__area {
  color: var(--color-sub);
}
.p-stay-card__type {
  color: #fff;
  background: var(--color-sub);
}
.p-stay-card__title {
  margin-top: 1em;
  font-size: min(1.3888888889vw, 20px);
  font-weight: bold;
  color: #000;
}
@media (max-width: 767px) {
  .p-stay-card__title {
    font-size: min(4.6153846154vw, 18px);
  }
}
.p-stay-card__info {
  margin-top: min(1.3888888889vw, 20px);
}
@media (max-width: 767px) {
  .p-stay-card__info {
    margin-top: min(4.6153846154vw, 18px);
  }
}
.p-stay-card__info dt, .p-stay-card__info dd {
  color: #000;
}
.p-stay-card__info dt:not(:first-of-type), .p-stay-card__info dd:not(:first-of-type) {
  margin-top: 1em;
}
.p-stay-card__info dt {
  float: left;
  margin-right: 0.5em;
  font-weight: 500;
}
.p-stay-card__info dd {
  overflow: hidden;
}
.p-stay-card__info dd a[href^=http] {
  color: var(--color-sub);
  font-weight: 500;
  text-decoration: underline;
  word-break: break-all;
}
.p-stay-card__info dd a[href^=http]:hover {
  text-decoration: none;
  color: rgb(3.0285714286, 115.0857142857, 155.9714285714);
}
.p-stay-card__ota {
  display: flex;
  flex-wrap: wrap;
  gap: min(0.8333333333vw, 12px);
  margin-top: min(2.4305555556vw, 35px);
}
@media (max-width: 767px) {
  .p-stay-card__ota {
    gap: min(3.0769230769vw, 12px);
    margin-top: min(6.4102564103vw, 25px);
  }
}
.p-stay-card__ota li:has(a[href^="https://www.jalan.net/"]) {
  order: 1;
}
.p-stay-card__ota li:has(a[href^="https://travel.rakuten.co.jp/"]) {
  order: 2;
}
.p-stay-card__ota li:has(a[href^="https://www.jtb.co.jp/"]) {
  order: 3;
}
.p-stay-card__ota li:has(a[href^="https://www.rurubu.travel/"]) {
  order: 4;
}
.p-stay-card__ota li:has(a[href^="https://travel.yahoo.co.jp/"]) {
  order: 5;
}
.p-stay-card__ota li:has(a[href^="https://www.ikyu.com/"]) {
  order: 6;
}
.p-stay-card__ota li:has(a[href^="https://www.japanican.com/"]) {
  order: 7;
}
.p-stay-card__logo {
  display: block;
  width: min(6.8055555556vw, 98px);
  border-radius: min(0.3472222222vw, 5px);
  border: 1px solid rgba(204, 204, 204, 0.52);
  box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);
  transition: opacity 0.3s;
}
@media (max-width: 767px) {
  .p-stay-card__logo {
    width: min(23.5897435897vw, 92px);
  }
}
.p-stay-card__logo img {
  border-radius: inherit;
}
.p-stay-card__logo:hover {
  opacity: 0.6;
}

/* ページネーション */
.p-stay-pagination {
  margin-top: min(5.5555555556vw, 80px);
}
@media (max-width: 767px) {
  .p-stay-pagination {
    margin-top: min(10.2564102564vw, 40px);
  }
}
.p-stay-pagination__wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: min(0.6944444444vw, 10px);
}
@media (max-width: 767px) {
  .p-stay-pagination__wrapper {
    gap: min(2.0512820513vw, 8px);
  }
}
.p-stay-pagination__page, .p-stay-pagination__current {
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: min(3.1944444444vw, 46px);
  height: min(3.1944444444vw, 46px);
  border-radius: 50%;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  color: var(--color-sub);
  border: min(0.1388888889vw, 2px) solid var(--color-sub);
  transition: color 0.3s, background-color 0.3s;
}
@media (max-width: 767px) {
  .p-stay-pagination__page, .p-stay-pagination__current {
    width: min(8.2051282051vw, 32px);
    height: min(8.2051282051vw, 32px);
  }
}
.p-stay-pagination__page:hover, .p-stay-pagination__current:hover {
  color: #fff;
  background: var(--color-sub);
}
.p-stay-pagination__current {
  color: #fff;
  background: var(--color-sub);
}
.p-stay-pagination__dots {
  font-weight: 500;
  line-height: 1;
  text-align: center;
  vertical-align: middle;
  color: var(--color-sub);
}
.p-stay-pagination__prev, .p-stay-pagination__next {
  display: flex;
  align-items: center;
  gap: min(0.6944444444vw, 10px);
  padding: min(0.6944444444vw, 10px) min(0.4861111111vw, 7px);
  --color-current: var(--color-text);
  color: var(--color-current);
  transition: color 0.3s;
}
@media (max-width: 767px) {
  .p-stay-pagination__prev, .p-stay-pagination__next {
    gap: min(2.0512820513vw, 8px);
    padding: min(2.0512820513vw, 8px) min(1.2820512821vw, 5px);
  }
}
.p-stay-pagination__prev::before, .p-stay-pagination__prev::after, .p-stay-pagination__next::before, .p-stay-pagination__next::after {
  flex-shrink: 0;
  width: min(0.7638888889vw, 11px);
  aspect-ratio: 11/15;
  background: var(--color-current);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  transition: background-color 0.3s;
}
@media (max-width: 767px) {
  .p-stay-pagination__prev::before, .p-stay-pagination__prev::after, .p-stay-pagination__next::before, .p-stay-pagination__next::after {
    width: min(2.3076923077vw, 9px);
  }
}
.p-stay-pagination__prev:hover, .p-stay-pagination__next:hover {
  --color-current: var(--color-sub);
}
.p-stay-pagination__prev:disabled, .p-stay-pagination__next:disabled {
  display: none;
}
.p-stay-pagination__prev::before {
  content: "";
  -webkit-mask-image: url(../images/stay/icon_prev.svg);
          mask-image: url(../images/stay/icon_prev.svg);
}
.p-stay-pagination__next::after {
  content: "";
  -webkit-mask-image: url(../images/stay/icon_next.svg);
          mask-image: url(../images/stay/icon_next.svg);
}/*# sourceMappingURL=stay.css.map */