@charset "UTF-8";
/*common*/
.pc-only { display: block !important; }
.sp-only { display: none !important; }

section, main { position: relative; display: block; }
html, body { width: 100%; overflow-x: hidden; }
img { max-width: 100%; }

@media screen and (max-width: 767px) {
    .pc-only { display: none !important; }
    .sp-only { display: block !important; }
    html, body { width: 100%; overflow-x: hidden; }
}

/*no-js*/
/*.no-js .js-scroll-fade,
.no-js .top_main_txt,
.no-js .top_main_txt .catch,
.no-js .top_main_txt .read,
.no-js .top_main_scroll { opacity: 1!important; }
.no-js body.home #loading { display: none; }
.no-js body#home #header {-webkit-transform: translateY(0);transform: translateY(0);}
.no-js body:not(.home) #loading { display: none; }*/
/*loading*/

body #loading { background: #fff; display: block; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 100010; pointer-events: none; -webkit-transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s; transition: opacity 1.5s cubic-bezier(0.16, 1, 0.3, 1) 0.5s; }

body #loading.is-animation { opacity: 0; }

/*loop*/
@keyframes loop {
    0% { transform: translateX(100%); }
  to { transform: translateX(-100%); }
}
@keyframes loop2 {
    0% { transform: translateX(0); }
  to { transform: translateX(-200%); }
}

/*fade*/
.js-scroll-fade:not(.top_about_ph):not(.hd_anime) { opacity: 0; }

.isActive:not(.top_about_ph):not(.hd_anime) { -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1); animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1); -webkit-animation-duration: 1.8s; animation-duration: 1.8s; -webkit-animation-name: fadeUp; animation-name: fadeUp; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; }

@-webkit-keyframes fadeUp {
    0% { opacity: 0; -webkit-transform: translateY(50px); transform: translateY(50px); }
  10% { opacity: 0; }
  to { opacity: 1; -webkit-transform: none; trfooter_logo_setansform: none; } 
}
@keyframes fadeUp { 
    0% { opacity: 0; -webkit-transform: translateY(50px); transform: translateY(50px); }
  10% { opacity: 0; }
  to { opacity: 1; -webkit-transform: none; transform: none; } 
}

/*header*/

.btn_humberger_box { position: fixed; top: 5.0rem; right: 3.5%; z-index: 10001; }
.btn_humberger_box .line { width: 5.0rem; height: 3.0rem; display: inline-block; position: relative; }
.btn_humberger_box .line > span { display: inline-block; height: 1px;background: #fff; position: absolute;-webkit-transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1); transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
.btn_humberger_box .line > span:nth-child(1) { width: 5.0rem; top: 0; right: 0; }
.btn_humberger_box .line > span:nth-child(2) { width: 4.0rem; top: calc(50% - 0.05rem); right: 0; }
.btn_humberger_box .line > span:nth-child(3) { width: 3.0rem; bottom: 0; right: 0; }
.btn_humberger_box .txt { display: block; text-align: center; position: relative; }
.btn_humberger_box .txt > span { display: block; width: 100%; text-align: center; font-size: 1.1rem; color: #fff; position: absolute; top: 0; }
.btn_humberger_box .txt .close { opacity: 0; }

body.open .btn_humberger_box .line > span:nth-child(1) { top: 50%; -webkit-transform: rotate(45deg) translate(0%,-50%); transform: rotate(45deg) translate(0%,-50%);}
body.open .btn_humberger_box .line > span:nth-child(2) { opacity: 0; }
body.open .btn_humberger_box .line > span:nth-child(3) { bottom: 50%; width: 5.0rem; -webkit-transform: rotate(-45deg) translate(0%,-50%); transform: rotate(-45deg) translate(0%,-50%);}

.op_global_nav { max-width: 500px; width: 100%; height: 100vh; background: #9E7E4D; z-index: 10000; position: fixed; right: 0; opacity: 0; pointer-events: none; -webkit-transition: opacity 1.0s cubic-bezier(0.16, 1, 0.3, 1); transition: opacity 1.0s cubic-bezier(0.16, 1, 0.3, 1); }
body.open .op_global_nav { opacity: 1; pointer-events: visible;}
.op_global_nav > .inner { width: 80%; margin: 0 auto; padding: 12.0rem 0 0; }
.op_global_nav * { color: #E4DECB; font-size: 3.0rem; }
.op_global_nav .hd { font-size: 1.4rem; margin-left: 1.0rem; }
.ancher_link { line-height: 1; padding: 0 1.0rem; }
.ancher_link li + li { margin-top: 4.0rem; }
.reservation_link { border-top: 1px solid #E4DECB; border-bottom: 1px solid #E4DECB; margin-top: 7.0rem; padding: 1.0rem 0 4.5rem; }
.reservation_link ul { display: flex; justify-content: center; align-items: center; margin-top: 1.0rem; }
.reservation_link li { line-height: 0; }
.reservation_link .ico_airbnb { width: 11.2rem; }
.reservation_link .ico_booking { width: 14.0rem; margin-left: 5.7rem; }
.sns_link { margin: 5.0rem 2.1rem 0; }
.sns_link ul { display: flex; }
.sns_link li + li { margin-left: 3.0rem; }
.sns_link a { display: block; width: 4.4rem; height: 4.4rem; border: 1px solid #E4DECB; border-radius: 50%; position: relative; }
.sns_link a img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

@media screen and (max-width: 900px) { 
    
    .op_global_nav > .inner { width: 80%; margin: 0 auto; padding: 0 0 0; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }

}

/*top*/
.fv { height: calc(100vh - 15.0rem); position: relative; padding: 0; box-sizing: border-box; text-align: center; }
.fv_mainimg img { width: 100%; height: calc(100vh - 15.0rem); object-fit: cover; }
.fv_copy { position: absolute; bottom: 10vh; left: 50%; z-index: 2; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.fv_logo { width: 19.8rem; margin: 0 auto; }
.fv_copy_en { font-size: 1.4rem; color: #fff; margin-top: 3.5rem; }
.fv_copy_ja { font-size: 2.0rem; color: #fff; margin-top: 7.0rem; letter-spacing: 0.3em; }

.common_inner { width: clamp(650px, 56.25%, 1100px); margin: 0 auto; }
.common_hd_en { font-size: 1.4rem; color: #fff; position: absolute; top: 0; left: 5.62%; display: flex;
  justify-content: center;
  align-items: center;
  width: 2em;  height: 100%; /* 親に高さが必要 */ }
.common_hd_en span { display: block; -webkit-transform: rotate(90deg); transform: rotate(90deg); transform-origin: center center; white-space: nowrap; }
.common_hd_ja { font-size: 10.0rem; line-height: 1; writing-mode: vertical-rl; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(calc(-50% + 0.25em)); transform: translateY(calc(-50% + 0.25em)); white-space: nowrap; letter-spacing: 0.5em; }
.txt_c { text-align: center; }

.sct_reservation { background: #596E63; }
.sct_reservation > .inner { height: 15.0rem; display: flex; align-items: center; }
.sct_reservation_item { display: grid; grid-template-columns: 34% 17.5rem 14.0rem; grid-column-gap: 7.2rem; align-items: center; }
.sct_reservation_item .txt { font-size: 1.4rem; color: #E4DECB; }
.sct_reservation_item img { width: 100%; }

.sct_concept { background: #9E7E4D; }
.sct_concept_head { padding: 18.0rem 0; }
.sct_concept .common_hd_ja { top: 7.0rem; -webkit-transform: translateY(0); transform: translateY(0); }
.sct_concept .common_hd_en { top: 15.8rem;align-items: flex-start; }
.sct_concept_item { display: flex; justify-content: space-between; align-items: flex-end; }
.sct_concept_item .txt { width: 38.44%; font-size: 2.0rem; color: #E4DECB; }
.sct_concept_item .ph { width: 53.44%; }
.sct_concept_item .ph img { width: 100%; }
.sct_concept .common_hd_ja { color: #E4DECB; }
.sct_concept_phlist { display: grid; grid-template-columns: repeat(3, 1fr); }
.sct_concept_phlist > div { position: relative; }
.sct_concept_phlist > div .txt { display: block; font-size: 10.0rem; color: #E4DECB; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 2; }
.sct_concept .common_hd_en span { color: #E4DECB; }

.sct_location { background: #E4DECB; }
.sct_location_head { padding: 14.0rem 0; font-size: 2.0rem; color: #9E7E4D; position: relative; }
.sct_location_head * { color: #9E7E4D; }
.sct_location_singleph img { width: 100%; }

.sct_location_set { display: flex; justify-content: space-between; padding: 15.0rem 0; }
.sct_location_set .txt { width: 46.11%; }
.sct_location_set .txt p { color: #9E7E4D; }
.sct_location_set .ph { width: 42.22%; }

.sct_facility { background: #9E7E4D; padding: 17.0rem 0 13.0rem; }
.sct_facility .common_hd_ja { top: 17.5rem; -webkit-transform: translateY(0); transform: translateY(0);  }
.sct_facility_phlist .swiper-wrapper { display: grid; grid-template-columns: repeat(3, 1fr); margin: 2.0rem 0 8.0rem; }
.sct_facility .common_hd_en { top: 35.8rem;align-items: flex-start; }
.sct_facility * { color: #E4DECB; }

.sct_facility_map { margin-bottom: 1.5rem; }
.sct_facility_map img { width: 100%; }

.sct_facility_data { display: flex; justify-content: space-between; border-top: 1px solid #E4DECB; border-bottom: 1px solid #E4DECB; }
.sct_facility_data + .sct_facility_data { border-top: none; }
.sct_facility_data > div { padding: 3.5rem 0;}
.sct_facility_data > div:nth-child(1) { width: 58.88%; margin-left: 3.33%; }
.sct_facility_data > div:nth-child(2) { width: 29.0%; margin-left: 7.55%; }
.sct_facility_data p { line-height: 1.2; }
.sct_facility_data .hd { font-size: 1.4rem; } 
.sct_facility_data .hd + p { margin-top: 3.5rem; }

.sct_facility_reservation { margin-top: 2.0rem; text-align: center; }

.sct_facility_link { display: flex; justify-content: space-between; margin-top: 7.5rem; }
.sct_facility_link > a { width: 47.77%; text-align: center; }
.sct_facility_link > a .caption { margin-top: 2.0rem; font-size: 1.4rem; color: #E4DECB; }

.sct_access { padding: 16.0rem 0 10.0rem; background: #E4DECB; }
.sct_access * { color: #9E7E4D; }
.sct_access_item { width: 88.88%; margin: 0 auto; }
.sct_access_item .address { margin-top: 2.5rem; font-size: 1.6rem; }
.googlemap { width: 100%; }
.googlemap iframe {
  width: 100%;
  aspect-ratio: 16 / 9; /* 任意の縦横比（16:9や4:3など） */
  height: auto;
  border: 0;
}

.footer_reservation { background: #596E63; padding-bottom: 9.5rem; }
.footer_reservation * { color: #E4DECB; }
.footer_reservation_item { display: grid; grid-template-columns: 17.5rem 17.5rem 14.0rem; grid-column-gap: 6.0rem; align-items: center; padding: 8.0rem 0; margin-bottom: 9.0rem; border-bottom: 1px solid #E4DECB; }
.footer_reservation_item img { width: 100%; }
.footer_reservation_item .txt { font-size: 1.4rem; line-height: 1.4; }
.footer_reservation_data { display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 3.17%; grid-row-gap: 3.0rem; font-size: 1.6rem; margin-top: 9.0rem; }
.footer_reservation_data > div { position: relative; padding-left: 2.8rem; line-height: 1.4;}
.footer_reservation_data .ico { display: block; width: 2.1rem; position: absolute; left: 0; top: 0; line-height: 0; }
.footer_reservation_data + p { margin-top: 3.0rem;}


footer { background: #9E7E4D; text-align: center; padding: 7.5rem 0; }
footer .logo { width: 9.9rem; margin: 0 auto; }
footer .copyrights  { margin-top: 3.0rem; font-size: 1.4rem; color: #E4DECB; }


@media screen and (max-width: 900px) { 
    .fv { height: calc(100vh - 13.0rem); position: relative; padding: 0; box-sizing: border-box; text-align: center; }
    .fv_mainimg img { width: 100%; height: calc(100vh - 13.0rem); object-fit: cover; }
    .fv_copy { position: absolute; bottom: auto; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.fv_logo { width: 19.8rem; margin: 0 auto; }
.fv_copy_en { font-size: 1.4rem; color: #fff; margin-top: 3.5rem; }
.fv_copy_ja { font-size: 2.0rem; color: #fff; margin-top: 7.0rem; }

    .common_inner { width: clamp(300px, 78.125%, 700px); margin: 0 auto; }
    .common_hd_en { font-size: 1.4rem; color: #fff; position: absolute; top: 1.0rem; left: 3%; display: flex;
  justify-content: center;
  align-items: flex-start;
  height: 100%; /* 親に高さが必要 */ }
    .common_hd_en span { display: block; -webkit-transform: rotate(90deg); transform: rotate(90deg); transform-origin: left bottom; position: absolute; left: 0; top: 0;}
    .common_hd_ja { font-size: 6.0rem; line-height: 1; writing-mode: vertical-rl; position: absolute; right: 0; top: 4.0rem; -webkit-transform: translateY(0); transform: translateY(0); white-space: nowrap; letter-spacing: 0.5em; }
.txt_c { text-align: center; }

.sct_reservation { background: #596E63; }
    .sct_reservation > .inner { height: 13.0rem; display: flex; align-items: center; }
    .sct_reservation .common_hd_en { top: 0; }
    .sct_reservation_item { display: grid; grid-template-columns: 10em 27.34% 21.87%; grid-column-gap: 10%; align-items: center; }
    .sct_reservation_item .txt { font-size: 1.0rem; color: #fff; }

.sct_concept { background: #9E7E4D; }
    .sct_concept_head { padding: 18.0rem 0 14.0rem; }
    .sct_concept .common_hd_ja { top: 4.0rem; -webkit-transform: translateY(0); transform: translateY(0); }
    .sct_concept .common_hd_en { top: 1.0rem; align-items: flex-start; }
    .sct_concept_item { display: flex; justify-content: space-between; align-items: flex-end; flex-direction: column-reverse; }
    .sct_concept_item .txt { width: 100%; font-size: 2.0rem; color: #E4DECB; margin-top: 9.0rem; }
    .sct_concept_item .ph { width: 77.2%; margin: 0 auto; }
.sct_concept .common_hd_ja { color: #E4DECB; }
.sct_concept_phlist { display: grid; grid-template-columns: repeat(3, 1fr); }
.sct_concept_phlist > div { position: relative; }
    .sct_concept_phlist > div .txt { display: block; font-size: 5.0rem; color: #E4DECB; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 2; }

.sct_location { background: #E4DECB; }
    .sct_location_head { padding: 13.0rem 0 6.5rem; font-size: 2.0rem; color: #9E7E4D; position: relative; }
.sct_location_head * { color: #9E7E4D; }
    .sct_location_item { width: 75%; margin-left: 15%; }

    .sct_location_set { display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 15.0rem 0 12.0rem; }
    .sct_location_set .txt { width: 100%; }
.sct_location_set .txt p { color: #9E7E4D; }
    .sct_location_set .ph { width: 76%; margin-top: 9.5rem; }

    .sct_facility { background: #9E7E4D; padding: 15.5rem 0 14.0rem; }
.sct_facility .common_hd_ja { top: 17.5rem; -webkit-transform: translateY(0); transform: translateY(0);  }
    
    .sct_facility_phlist .swiper-wrapper { display: flex; grid-template-columns: repeat(3, 1fr); margin: 8.0rem 0 11.0rem; }
    .sct_facility .common_hd_en { top: 0; align-items: flex-start; }
.sct_facility * { color: #E4DECB; }
    .sct_facility_phlist img { width: 100%; }

    .sct_facility_map { margin-bottom: 6.0rem; }
.sct_facility_map img { width: 100%; }

    .sct_facility_data { display: block; border-top: 1px solid #E4DECB; border-bottom: 1px solid #E4DECB; }
.sct_facility_data + .sct_facility_data { border-top: none; }
.sct_facility_data > div { padding: 3.5rem 0;}
    .sct_facility_data > div:nth-child(1),
    .sct_facility_data > div:nth-child(2) { width: 90%; margin-left: 5%; }
.sct_facility_data p { line-height: 1.2; }
.sct_facility_data .hd { font-size: 1.4rem; } 
.sct_facility_data .hd + p { margin-top: 3.5rem; }

.sct_facility_reservation { margin-top: 2.0rem; text-align: center; }

    .sct_facility_link { display: block; justify-content: space-between; margin-top: 6.5rem; }
    .sct_facility_link > a { display: block; width: 86%; margin: 0 auto; text-align: center; }
.sct_facility_link > a .caption { margin-top: 2.0rem; font-size: 1.4rem; color: #E4DECB; }
    .sct_facility_link > a + a { margin-top: 5.0rem;}

    .sct_access { padding: 10.0rem 0 4.0rem; background: #E4DECB; }
.sct_access * { color: #9E7E4D; }
.sct_access_item { width: 88.88%; margin: 0 auto; }
    .sct_access_item .address { margin-top: 1.5rem; font-size: 1.6rem; }
.googlemap { width: 100%; }
.googlemap iframe {
  width: 100%;
  aspect-ratio: 1 / 0.88; /* 任意の縦横比（16:9や4:3など） */
  height: auto;
  border: 0;
}

.footer_reservation { background: #596E63; padding-bottom: 4.5rem; }
.footer_reservation * { color: #E4DECB; }
    .footer_reservation_item { display: grid; grid-template-columns: 17.5rem 14.0rem; grid-column-gap: 6.0rem; align-items: center; justify-content: center; padding: 4.0rem 0 5.0rem; margin-bottom: 3.0rem; border-bottom: 1px solid #E4DECB; }
    .footer_reservation_item .txt { font-size: 1.4rem; line-height: 1.4; grid-column: span 2; text-align: center; margin-bottom: 3.0rem; }
    .footer_reservation_data { display: grid; grid-template-columns: repeat(2, 1fr); grid-column-gap: 3.17%; grid-row-gap: 2.0rem; font-size: 1.6rem; margin-top: 5.0rem; }
.footer_reservation_data > div { position: relative; padding-left: 2.8rem; line-height: 1.4;}
    .footer_reservation_data .ico { position: absolute; left: 0; top: 0.3rem; line-height: 0; }
.footer_reservation_data + p { margin-top: 3.0rem;}


footer { background: #9E7E4D; text-align: center; padding: 7.5rem 0; }
footer .logo { width: 9.9rem; margin: 0 auto; }
footer .copyrights  { margin-top: 3.0rem; font-size: 1.4rem; color: #E4DECB; }
}


/*link*/
a.link_txt { text-decoration: underline; }

@media (hover: hover) and (pointer: fine) {
    a.link_txt:hover { text-decoration: none; }
    
    .news_archive_item .ph > div img { -webkit-transition: transform 1.0s cubic-bezier(0.16, 1, 0.3, 1); transition: transform 1.0s cubic-bezier(0.16, 1, 0.3, 1); }
    .news_archive_item:hover .ph > div img { -webkit-transform: scale(1.05); transform: scale(1.05); }
    
    .ancher_link a,
    .reservation_link a,
    .sns_link a,
    .sct_reservation_item a,
    .sct_facility_link a,
    .footer_reservation_item a{ -webkit-transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1); transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1); }
    .ancher_link a:hover,
    .reservation_link a:hover,
    .sns_link a:hover,
    .sct_reservation_item a:hover,
    .footer_reservation_item a:hover { opacity: 0.5; }
    .sct_facility_link a:hover { opacity: 0.7; }

    
}