:root {
  --clr-default: #222222;
  --clr-sage: #E4E8BD;
  --clr-cream: #f9f2e5;
  --clr-olive: #3c470a;
  --clr-red: #b3312c;
  --clr-hover: #8a6d3b;
}
html, body { height: 100%; }
body {
}
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh; /* モバイルのアドレスバー分の高さブレに対応 */
  font-family: "DM Sans", "Noto Sans JP", sans-serif;
  color: var(--clr-default);
}
body > * {
  flex: 0 0 auto; /* body直下の要素は基本、自然な高さのまま */
}
body > .main {
  flex: 1 0 auto; /* main セクションだけが余白を埋めるように伸びる */
}
/* a
------------------------- */
a {
  color: var(--clr-default);
  text-decoration: none;
  transition: 0.3s;
}
a:link,
a:visited {
  color: var(--clr-default);
}
a:hover {
  color: var(--clr-hover);
  text-decoration: underline;
}
a:active {
  color: var(--clr-default);
}
/* h1 h2 h3 h4 h5 h6
------------------------- */
h1, h2, h3, h4, h5, h6, .brand-title, .display-title {
  font-family: "DM Serif Display", "Noto Serif JP", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.025em;
}
.ja :is(h1, h2, h3, h4, h6) {
  font-weight: 600;
}
.ja :is(h5, .brand-title, .display-title) {
  font-weight: 700;
}
h2 {
  color: var(--clr-olive);
}
.eyebrow {
  font-weight: 600;
  color: var(--clr-olive);
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .12em;
}
h2::after,
.eyebrow::after {
  content: "";
  display: block;
  width: 32px;
  height: 1px;
  background: var(--clr-olive);
  margin-top: .5rem;
}
/* p li dt dd .btn
------------------------- */
p, li, dt, dd, .btn {
  font-size: 1em;
}
@media screen and (max-width: 767.98px) {
  p, li, dt, dd, .btn {
    font-size: 0.875em;
  }
}
@media screen and (max-width: 479.98px) {
  p, li, dt, dd, .btn {
    font-size: 0.775em;
  }
}
/* ===== Header Logo ===== */
.header-logo {
  width: auto;
  height: 100px;
}
@media (max-width: 1298px) {
  .header-logo {
    height: 94px;
  }
}
@media (max-width: 1208px) {
  .header-logo {
    height: 90px;
  }
}
@media (max-width: 1148px) {
  .header-logo {
    height: 80px;
  }
}
@media (max-width: 1098px) {
  .header-logo {
    height: 74px;
  }
}
@media (max-width: 1048px) {
  .header-logo {
    height: 68px;
  }
}
@media (max-width: 1008px) {
  .header-logo {
    height: 64px;
  }
}
@media (max-width: 988px) {
  .header-logo {
    height: 72px;
  }
}
@media (max-width: 428px) {
  .header-logo {
    height: 60px;
  }
}
/* btn
------------------------- */
.btn {
  font-size: 1rem;
  font-weight: 600;
  padding: 0.8rem 2rem;
  border-radius: 50px;
  transition: all 0.3s ease;
}
.btn-sm {
  padding: 0.5rem 1.25rem;
  font-size: 0.875rem;
}
.btn.btn-accent {
  color: #ffffff;
  background-color: var(--clr-olive);
  border: 2px solid var(--clr-olive);
}
.btn.btn-accent:hover {
  color: var(#ffffff);
  background-color: var(--clr-hover);
  border: 2px solid var(--clr-hover);
}
.btn.btn-outline {
  color: var(--clr-olive);
  background-color: transparent;
  border: 2px solid var(--clr-olive);
}
.btn.btn-outline:hover {
  color: #ffffff;
  background-color: var(--clr-olive);
  border-color: var(--clr-olive);
}
/* ===== Language Switcher ===== */
.lang-switcher-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  margin: 0;
}
.lang-switcher {
  background: #fff;
  border: 1px solid var(--clr-default);
  border-radius: 100vmax;
  justify-content: space-between;
  margin: 0 auto;
  padding: 0.15em 0.175em;
  width: auto;
  height: auto;
  z-index: 3;
}
.lang-switcher, .lang-switcher > a {
  display: flex;
  align-items: center;
}
.lang-switcher > a {
  color: var(--clr-default);
  border-radius: 100vmax;
  font-size: 0.85rem;
  justify-content: center;
  line-height: 1.25;
  transition: all 0.4s ease;
  text-decoration: none;
  padding: 0.25em 0.75em;
}
@media (max-width: 525px) {
  .lang-switcher > a {
    font-size: 0.75rem;
    padding: 0.125em 0.35em;
  }
}
.lang-switcher > a span {
  padding: 0;
}
.lang-switcher > a:link,
.lang-switcher > a:visited {
  color: var(--clr-default);
}
.lang-switcher > a:hover {
  color: #fff;
  background: rgb(179 49 44 / 60%);
}
.lang-switcher > a:active {
  color: var(--clr-default);
}
.lang-switcher > a.current {
  background: var(--clr-red);
  color: #fff;
  pointer-events: none;
}

/* ===== Navbar (logo left / stacked right) ===== */
.navbar-woc {
  background: #fff;
  padding: .7rem 0;
}
.navbar-woc .brand-title {
  font-weight: 600;
  font-size: 1.05rem;
  line-height: 1.2;
  margin-bottom: 0;
}
.nav-link-woc {
  font-size: .9rem;
  font-weight: 500;
  margin: 0 .6rem;
}
a.nav-link-woc {
  color: var(--clr-default);
  text-decoration: none;
}
a.nav-link-woc:hover {
  color: var(--clr-red);
}
@media (max-width: 1298px) {
  .nav-link-woc {
    margin: 0 .4rem;
  }
}
@media (max-width: 1208px) {
  .nav-link-woc {
    margin: 0 .25rem;
  }
}
@media (max-width: 1098px) {
  .nav-link-woc {
    font-size: .85rem;
  }
}
a.nav-link.active {
  color: var(--clr-red) !important;
}

/* ===== HOME ===== */

/* ===== Hero ===== */
.hero {
  min-height: 70vh;
  background: linear-gradient(180deg, rgba(10, 15, 5, .35), rgba(10, 15, 5, .15)), url('/images/home-bg.jpg') center/cover no-repeat;
  color: #fff;
}
.hero .display-title {
  font-weight: 700;
  font-size: clamp(2rem, 5vw, 3.4rem);
  line-height: 1.15;
}
.hero p {
  font-size: 1.05rem;
}

/* ===== Gallery slider (continuous loop, no interval) ===== */
.slider-wrapper {
  display: flex; /* スライドのグループを横並び */
  overflow: hidden; /* はみ出たスライドを隠す */
  background-color: #000000;
}
.slider {
  animation: scroll-left 40s infinite linear .6s both;
  display: flex; /* スライド12枚を横並び */
}
.slide {
  width: calc(100vw / 10); /* 10はスライドの枚数 */
}
/* スライドの画像 */
.slide img {
  display: block;
  width: 100%;
}
/* CSSアニメーション */
@keyframes scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
@media(max-width:1600px) {
  .slide {
    width: calc(100vw / 8);
  }
}
@media(max-width:1400px) {
  .slide {
    width: calc(100vw / 6);
  }
}
@media(max-width:768px) {
  .slide {
    width: calc(100vw / 4);
  }
}
@media(max-width:428px) {
  .slide {
    width: calc(100vw / 3);
  }
}

/* ===== Info blocks ===== */
.card-sage {
  background: var(--clr-sage);
  padding: 2rem;
  height: 100%;
}
.card-sage h5 {
  color: var(--clr-olive);
}
.card-olive {
  background: var(--clr-olive);
  color: #ffffff;
  padding: 2rem;
  height: 100%;
}
.card-olive h5 {
  color: var(--clr-sage);
}
.card-olive a {
  color: #ffffff;
}
.card-olive a:hover {
  color: var(--clr-cream);
  text-decoration: underline;
  transition: all 0.3s ease;
}
.section-cream {
  background: var(--clr-cream);
}
.section-cream h5 {
  color: var(--clr-olive);
}
.img-cover {
  width: 100%;
  height: auto;
  min-height: 400px;
  object-fit: cover;
}
.spec-box {
  background: #fff;
  border: 1px solid #d8cdb8;
  padding: 1rem 1.25rem;
  font-size: .9rem;
  max-width: 320px;
}
.spec-box div {
  margin-bottom: .35rem;
}

/* ===== REGISTRATION / HOTEL blocks ===== */
.registration-img,
.travel-img {
  background-image: url("/images/registration.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  min-height: 360px;
}
.travel-img {
  background-image: url("/images/travel-info.jpg");
}

/* ===== PAGE ===== */
/* ===== PAGE HEADER ===== */
.page-header {
  background: linear-gradient(180deg, rgba(10, 15, 5, .35), rgba(10, 15, 5, .15)), url('/images/page-header.jpg') right/contain no-repeat;
  color: #fff;
  background-color: #000700;
}
.page-header .display-title {
  font-weight: 600;
  font-size: clamp(1.5rem, 5vw, 2rem);
  line-height: 1.15;
}

/* ===== NEWSLETTER / CONTACT blocks ===== */
.bottom-bar {
  background: var(--clr-sage);
}
.bottom-bar .panel {
  position: relative;
  min-height: 120px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1.5rem 2rem;
}
.bottom-bar .panel.newsletter {
  position: relative;
  background: linear-gradient(180deg, rgba(10, 15, 5, .15), rgba(10, 15, 5, .25)), url('/images/newsletter-bg.jpg') left/cover no-repeat;
}
.bottom-bar .panel.contact {
  position: relative;
  background: linear-gradient(180deg, rgba(10, 15, 5, .25), rgba(10, 15, 5, .05)), url('/images/contact-bg.jpg') right/cover no-repeat;
}
.bottom-bar .panel.contact:hover {
  background: linear-gradient(180deg, rgba(10, 15, 5, .05), rgba(10, 15, 5, 0)), url('/images/contact-bg.jpg') right/cover no-repeat;
  transition: .3s;
}
.bottom-bar .panel a {
  color: #fff;
  transition: .3s;
}
.bottom-bar .panel a:link,
.bottom-bar .panel a:visited {
  color: #fff;
}
.bottom-bar .panel a:hover {
  color: var(--clr-hover);
}
.bottom-bar .panel a:active {
  color: #fff;
}

/* ===== Footer ===== */
footer.footer-woc {
  background: linear-gradient(180deg, rgba(20, 25, 10, .75), rgba(20, 25, 10, .55)), url('/images/footer-bg.jpg') center/cover no-repeat;
  color: #ffffff;
  padding: 2.5rem 0 1.25rem;
}
footer.footer-woc a {
  color: #ffffff;
  text-decoration: none;
}
footer.footer-woc small {
  color: #ffffff;
}

/* ===== REGISTRATION / HOTEL blocks ===== */
.offcanvas {
  background-color: var(--clr-cream);
}
.offcanvas .nav-link {
  font-size: 1rem;
  padding: .6rem 0;
}
.offcanvas a.nav-link:hover {
  color: var(--clr-hover);
  text-decoration: none;
}
/* ===== Contact Section ===== */
.contact-wrapper .contact-form-panel {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.contact-wrapper .form-container {
  /*background-color: var(--surface-color);
  border-radius: 20px;
  padding: 35px;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.06);*/
}
.contact-wrapper .form-container p {
  font-size: 15px;
  color: color-mix(in srgb, var(--clr-default), transparent 15%);
  margin-bottom: 25px;
}
.contact-wrapper .form-container .btn-submit {
  background-color: var(--clr-olive);
  color: #ffffff;
  border: 2px solid var(--clr-olive);
  padding: 15px 25px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 16px;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.contact-wrapper .form-container .btn-submit:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 20px color-mix(in srgb, var(--clr-olive), transparent 75%);
  background-color: #ffffff;
  color: var(--clr-olive);
}
.contact-wrapper .form-container .btn-submit i {
  transition: transform 0.3s ease;
}
.contact-wrapper .form-container .btn-submit:hover i {
  transform: translateX(5px);
}
@media (max-width: 767.98px) {
  .contact-wrapper .contact-info-panel {
    padding: 30px 25px;
  }
  .contact-wrapper .form-container {
    padding: 30px 25px;
  }
}
.form-container label
  color: var(--clr-olive);{
  font-weight: 500;
  position: relative;
}
.form-container .form-control,
.form-container .form-select,
.form-container .form-check-input {
  border-color: #ccc;
}
.form-container .form-control:focus,
.form-container .form-select:focus {
  box-shadow: none;
  border-color: var(--clr-olive);
}
.form-container input::placeholder,
.form-container select::placeholder,
.form-container textarea::placeholder {
  color: #aaaaaa !important;
}
.form-container .select2-selection__placeholder {
  color: #aaaaaa !important;
}