/* base */
:root {
  /* color */
  --background-color: #050000;
  --primary-color: #dedede;
  --primary-purple-color: #874FCD;
  --primary-blue-color: #4F90CD;
  /* font-size */
  --font-size-base: 1rem; /* = 16px */
  --font-size-xxs: .6875rem; /* = 11px */
  --font-size-xs: .75rem; /* = 12px */
  --font-size-sm: .8125rem; /* = 13px */
  --font-size-md: .875rem; /* = 14px */
  --font-size-lg: 1.125rem; /* = 18px */
}
@font-face {
  font-family: "Custom Yu Gothic";
  src: local("Yu Gothic");
  font-weight: 300;
}
@font-face {
  font-family: "Custom Yu Gothic";
  src: local("Yu Gothic");
  font-weight: 500;
}
@font-face {
  font-family: "Custom Yu Gothic";
  src: local("Yu Gothic");
  font-weight: bold;
}
html {
  color: #333;
  word-wrap: break-word;
  font-feature-settings: "palt";
  font-size: 100%;
}
body {
  width: 100%;
  height: 100%;
  font-family: "Jost", YuGothic, "Custom Yu Gothic", "Yu Gothic", sans-serif;
  font-size: 0.875rem;
  line-height: 1.4;
  letter-spacing: .08em;
  -webkit-text-size-adjust: 100%;
}
.wrapper {
  background-color: var(--background-color);
}

/* container */
.article_container {
  margin-top: clamp(2rem, 4.4444vw, 6rem);
  padding: 0 clamp(2rem, 4.4444vw, 6rem);
  color: var(--primary-color);
}
.article_title {
  font-size: clamp(3rem, 4.4444vw, 5rem);
  letter-spacing: .08em;
}
.section_container {
  margin-top: clamp(2rem, 4.4444vw, 6rem);
}
@media (max-width: 767px) {
  .section_container {
    margin: clamp(2rem, 4.4444vw, 6rem) -.5rem 0;
  }
  .section_header {
    text-align: center;
  }
}
.section_header .title_ja {
  font-size: clamp(var(--font-size-md), .9722vw, var(--font-size-lg));
}
.section_header a {
  text-decoration: underline;
}
.post_container {
  width: clamp(28.5rem, 50vw, 46.25rem);
}
@media (max-width: 767px) {
  .post_container {
    width: 100%;
  }
}
.sidebar_container {
  width: clamp(12.5rem, 22.2222vw ,20rem);
  margin-top: clamp(2rem, 4.4444vw, 6rem);
  color: var(--primary-color);
}
@media (max-width: 767px) {
  .sidebar_container {
    width: 100%;
    padding: 0 2rem;
  }
}
.area_container {
  margin-top: 3rem;
}
.area_container .area_title {
  font-size: clamp(1.5rem, 2.2222vw, 2rem);
}

/* header / frontpage */
.header_wrapper {
  width: 100%;
  height: 100vh;
  position: relative;
  color: #FFF;
}
.fp_header {
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding: clamp(2rem, 2.2222vw, 3rem) clamp(1rem, 4.4444vw, 6rem);
  position: absolute;
  bottom: 0;
  z-index: 1;
}
@media (max-width: 767px) {
  .fp_header {
    top: 0;
  }
}
.fp_header .site_name {
  font-size: clamp(4rem, 8.3333vw, 10rem);
  line-height: 1;
  letter-spacing: .08em;
}
.fp_header .sub_text {
  margin-top: .3333em;
  font-size: clamp(var(--font-size-sm), 1.6666vw, 2rem);
  letter-spacing: .08em;
}
.fp_header .sitenavi {
  margin-top: 1.5277vw;
}
@media (min-width: 768px) {
  .fp_header .sitenavi {
    position: fixed;
    right: clamp(1rem, 4.4444vw, 6rem);
  }
  .fp_header .sitenavi a {
    opacity: .1;
    transition: .3s;
  }
  .fp_header .sitenavi a:hover {
    opacity: 1;
    transition: .3s;
  }
  .fp_header .sitenavi a.default {
    opacity: 1;
  }
  .fp_header .sitenavi a.is-here {
    opacity: 1;
    border-bottom: 1px solid #FFF;
  }
}
@media (max-width: 767px) {
  .fp_header .sitenavi {
    display: none;
  }
}
.fp_header .sitenavi li {
  padding: .3333em 0;
  font-size: clamp(var(--font-size-sm), 1.6666vw, 2rem);
  text-align: right;
}
.fp_header .sitenavi li.other a {
  opacity: .1;
}
.fp_header .sitenavi li.is-here a {
  border-bottom: 1px solid #FFF;
}
.fp_header .sitenavi a::after {
  content: "";
  display: inline-block;
  margin-left: .6666em;
  width: .3333em;
  height: .3333em;
  vertical-align: middle;
  background-color: #FFF;
}
.main_visual {
  width: 100%;
  height: 100%;
  position: absolute;
}
.main_visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 767px) {
  .main_visual {
    overflow: hidden;
  }
  .main_visual img {
    width: auto;
    position: absolute;
    left: 0;
    animation: mv-round-trip 12s infinite ease-in-out;
    animation-direction: alternate;
  }
  @keyframes mv-round-trip {
    0% {
      left: 0;
    }
    100% {
      left: calc(((1920 / 1280) * 100vh - 100vw) * -1);
    }
  }

}
.main_visual .caption {
  position: absolute;
  font-size: var(--font-size-xs);
}
@media (min-width: 768px) {
  .main_visual .caption {
    top: 2rem;
    right: 4rem;
  }
}
@media (max-width: 767px) {
  .main_visual .caption {
    bottom: 2rem;
    left: 1rem;
  }
}
.main_visual .caption a {
  font-size: var(--font-size-sm);
}
.scroll_hint {
  display: flex;
  justify-content: center;
  position: fixed;
  right: 4rem;
  bottom: 5.5rem;
  font-size: var(--font-size-base);
  letter-spacing: .08em;
}
@media (max-width: 767px) {
  .scroll_hint {
    display: none;
  }
}
.scroll_hint::after {
  content: "";
  width: 1px;
  height: 5rem;
  position: absolute;
  bottom: -5.5rem;
  background-color: #FFF;
  animation: scroll-border 2s infinite linear backwards;
}
@keyframes scroll-border {
  0% {
    height: 5rem;
  }
  100% {
    height: 0;
  }
}
/* header / common */
.cmn_header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  padding: clamp(2rem, 2.2222vw, 3rem) clamp(1rem, 4.4444vw, 6rem);
  color: #FFF;
  overflow: hidden;
}
.cmn_header .site_name {
  font-size: calc(var(--font-size-xs) * 2);
  letter-spacing: .08em;
}
.cmn_header .menu_switch {
  display: none;
}
.header_navi {
  display: flex;
  align-items: center;
}
.header_navi li {
  font-size: 1rem;
  letter-spacing: .08em;
}
.header_navi li:not(:first-child)::before {
  content: "/";
  padding: 0 .5rem;
}
@media (max-width: 767px) {
  .cmn_header {
    line-height: 0;
  }
  .cmn_header .site_name {
    font-size: var(--font-size-lg);
  }
  .cmn_header .site_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .cmn_header .site_head {
    transition: .4s;
    z-index: 1;
  }
  .cmn_header .header_navi {
    justify-content: end;
    margin-right: -100%;
    transition: .4s;
  }
  .cmn_header .menu_switch {
    display: block;
  }
  .cmn_header.is-slide .site_head {
    margin-left: calc(-75vw - clamp(1rem, 4.4444vw, 6rem));
  }
  .cmn_header.is-slide .header_navi {
    margin-right: 0;
  }
}

/* component */
.list_component {
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .list_component {
    gap: clamp(2rem, 3.3333vw, 4rem);
    flex: 1;
  }
}
@media (max-width: 1023px) {
  .list_component {
    flex: 3;
  }
}
.list_component .list_item {
  width: clamp(14rem, 22.2222vw, 40rem);
}
@media (max-width: 767px) {
  .list_component {
    justify-content: space-between;
    gap: 0;
  }
  .list_component .list_item {
    width: calc(50% - .5rem);
  }
}
.list_component .thumbnail {
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.list_component .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .4s;
}
@media (min-width: 768px) {
  .list_component .anim_hover:hover img {
    transform: scale(1.1);
    opacity: .6;
  }
}
.list_component .title {
  margin-top: clamp(1rem, 1.1111vw, 2rem);
  font-size: clamp(var(--font-size-lg), 1.25vw, var(--font-size-lg) * 2);
  letter-spacing: .08em;
  text-align: justify;
  word-break: break-all;
}
.list_component .title_sub {
  display: block;
  font-size: clamp(var(--font-size-xxs), .7638vw, var(--font-size-xxs) * 2);
}
.list_component .description {
  margin-top: clamp(.5rem, .5555vw, 1rem);
  font-size: clamp(var(--font-size-sm), .9027vw, var(--font-size-sm) * 2);
}
.list_component .tag {
  display: flex;
  flex-wrap: wrap;
  margin-top: clamp(.5rem, .5555vw, 1rem);
  font-size: clamp(var(--font-size-xxs), .7638vw, var(--font-size-xxs) * 2);
}
.list_component .tag li:not(:first-child)::before {
  content: "/";
  padding: clamp(.5rem, .5555vw, 1rem);
}
.slide_container {
  margin-top: clamp(2.5rem, 2.7777vw, 4rem);
}
@media (max-width: 767px) {
  .slide_viewport {
    overflow: hidden;
  }
  .slide_container .list_component {
    flex-wrap: nowrap;
    gap: 0;
    touch-action: pan-y pinch-zoom;
    margin-left: -2rem;
  }
  .slide_container .list_item {
    transform: translate3d(0, 0, 0);
    flex: 0 0 80%;
    min-width: 0;
    padding-left: 2rem;
  }
}

/* contents / sauna */
.post_term {
  display: flex;
  margin-top: 1em;
  font-size: clamp(var(--font-size-md), .9722vw, var(--font-size-lg));
}
.post_term li:not(:first-child)::before {
  content: "/";
  padding: 0 .5rem;
}
.table_title {
  padding-bottom: 1rem;
  font-size: var(--font-size-xs);
  letter-spacing: .5em;
}
.table_data {
  display: flex;
  flex-direction: row-reverse;
  gap: clamp(2rem, 4.4444vw, 6rem);
}
.table_data .image_wrap {
  width: calc(100% - 460px - clamp(2rem, 4.4444vw, 6rem));
  height: 100%;
}
.table_data .image {
  width: 100%;
  aspect-ratio: 8 / 5;
}
.table_data .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.table_data .note {
  margin-top: 2rem;
  line-height: 1.8;
  text-align: justify;
}
.table_data .note + .note {
  margin-top: 1rem;
  font-size: var(--font-size-sm);
}
.table_data .shop_data {
  width: 460px;
  font-size: var(--font-size-md);
  border-top: 1px solid #333;
}
.table_data .shop_data li {
  padding: 1rem 0;
  border-bottom: 1px solid #333;
}
.table_data .shop_data dl {
  display: table;
  width: 100%;
}
.table_data .shop_data dt,
.table_data .shop_data dd {
  line-height: 1.8;
}
.table_data .shop_data dd + dd {
  margin-top: 1em;
  padding-top: 1em;
  border-top: 1px dashed #333;
}
.table_data .shop_data dt {
  display: table-cell;
  width: 8rem;
  font-weight: 400;
}
.table_data .shop_data a {
  text-decoration: underline;
}
.table_data .shop_data span + span:before {
  content: "／";
}
.table_data .service {
  width: calc(100% - 460px - clamp(2rem, 4.4444vw, 6rem));
  height: 100%;
}
.table_data .list_spec,
.table_data .table_spec {
  font-size: var(--font-size-md);
  border-top: 1px solid #333;
}
.table_data .table_spec {
  display: flex;
  flex-wrap: wrap;
}
.table_data ul + .table_title {
  margin-top: 3rem;
}
.table_data li {
  padding: 1rem 0;
  border-bottom: 1px solid #333;
}
.table_data .table_spec li {
  width: 33.3333%;
}
@media (min-width: 1441px) {
  .table_data .table_spec li {
    width: 25%;
  }
}
@media (max-width: 1179px) {
  .table_data .table_spec li {
    width: 50%;
  }
}
@media (max-width: 767px) {
  .table_data .table_spec li {
    width: 100%;
  }
}
.table_data dl {
  display: table;
  width: 100%;
}
.table_data dt,
.table_data dd {
  line-height: 1.8;
}
.table_data dt {
  display: table-cell;
  width: 8rem;
  font-weight: 400;
}
.table_data .table_spec dd {
  text-align: center;
}
.table_data .table_spec dd > span:not(:first-child)::before {
  content: "／";
}
@media (max-width: 1179px) {
  .table_data {
    flex-direction: column-reverse;
  }
  .table_data .image_wrap {
    order: 1;
    width: 100%;
  }
  .table_data .shop_data {
    width: 100%;
  }
  .table_data .service {
    width: 100%;
  }
}

/* contents / post */
.post_content_wrapper {
  display: flex;
  gap: 1rem;
  width: clamp(48rem, 86.6666vw, 78rem);
  margin: auto;
}
@media (max-width: 767px) {
  .post_content_wrapper {
    flex-direction: column;
    width: 100%;
  }
}
.post_date {
  font-size: var(--font-size-md);
}
.post_title {
  font-size: 2rem;
  letter-spacing: .08em;
}
.post_body {
  font-size: var(--font-size-base);
  line-height: 1.8;
  text-align: justify;
}
.post_body h2,
.post_body h3 {
  margin-top: 3rem;
  font-size: var(--font-size-lg);
  font-weight: 700;
}
.post_body p,
.post_body figure {
  margin-top: 1rem;
}
.post_body img {
  width: 100%;
}

/* contents / sidebar */
.popular_list {
  margin-top: 1.5rem;
}
.popular_list .popular_item:not(:first-child) {
  margin-top: 2rem;
}
.popular_body {
  flex: 1;
}
.popular_title {
  font-size: var(--font-size-sm);
  line-height: 1.8;
}
.popular_term {
  display: flex;
  margin-top: .5rem;
  font-size: var(--font-size-sm);
}
.popular_term li:not(:first-child)::before {
  content: "/";
  padding: 0 .5rem;
}

/* archive */
.archive_template {
  display: flex;
  justify-content: space-between;
  gap: clamp(2rem, 4.4444vw, 6rem);
}
@media (max-width: 767px) {
  .archive_template {
    flex-direction: column;
  }
}
.filter_wrap {
  max-width: clamp(13.625rem, 22vw, 22.5rem);
}
.filter {
  padding: clamp(1rem, 1.6666vw, 3rem);
  font-size: clamp(var(--font-size-sm), 1.1111vw, var(--font-size-base) * 2);
  border-radius: .5rem;
}
.filter + .filter {
  margin-top: 2.5rem;
}
.filter dt {
  font-weight: 400;
}
.filter dd {
  font-weight: 700;
}
.filter .term_list {
  margin-top: clamp(1rem, 1.1111vw, 2rem);
}
.filter .term_list li:not(:first-child) {
  margin-top: clamp(.5rem, .5555vw, 1rem);
}
.filter .term_list li.is-here a {
  border-bottom: 1px solid var(--primary-color);
}
.filter .term_list li.is-here a::before {
  content: "■";
  display: inline-block;
  padding-right: clamp(1rem, 1.1111vw, 2rem);
  font-size: clamp(.5rem, .5555vw, 1rem);
  vertical-align: middle;
}
@media (max-width: 767px) {
  .select_filter li + li {
    margin-top: 1rem;
  }
  .select_filter .form_unit dd {
    margin-top: .5rem;
  }
  .select_filter .select_item {
    position: relative;
  }
  .select_filter .select_item::after {
    content: "▼";
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--primary-color);
    font-size: var(--font-size-xxs);
    line-height: 1;
    pointer-events: none;
  }
  .select_filter select {
    width: 100%;
    padding: .5rem 1rem;
    color: var(--primary-color);
    font-size: var(--font-size-md);
    font-weight: 500;
    background-color: var(--background-color);
    border-bottom: 1px solid var(--primary-color);
  }
}

/* contact form */
.form_wrap li {
  margin-top: 1.5rem;
}
.form_wrap dt {
  font-size: var(--font-size-sm);
  font-weight: 400;
}
.form_wrap dt.required p::after {
  content: "必須";
  display: inline-block;
  margin-left: .5rem;
  padding: 0 .25rem;
  color: #FFF;
  font-size: var(--font-size-xxs);
  line-height: 1rem;
  background: var(--primary-purple-color);
  border-radius: .25rem;
}
.form_wrap dd {
  margin-top: .5rem;
}
.form_wrap input[type="text"],
.form_wrap input[type="email"],
.form_wrap textarea {
  width: 100%;
  padding: .5rem 1rem;
  color: #333;
  font-size: var(--font-size-base);
  line-height: 1.8;
  background-color: var(--primary-color);
  border-radius: .5rem;
}
.form_wrap textarea {
  resize: vertical;
}
.form_wrap .wpcf7-not-valid-tip {
  margin-top: .5rem;
  color: #FFF;
  font-size: var(--font-size-sm);
}
.form_wrap .wpcf7-not-valid-tip::before {
  content: "!";
  display: inline-block;
  width: 1rem;
  margin-right: .5rem;
  color: #FFF;
  font-size: var(--font-size-xxs);
  font-weight: 700;
  line-height: 1rem;
  text-align: center;
  background: var(--primary-purple-color);
  border-radius: 50%;
}
.form_wrap input[type="submit"],
.form_wrap input[type="button"] {
  margin: 2rem 0;
  padding: 1rem 2rem;
  font-size: var(--font-size-md);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .08em;
  text-align: center;
  border-radius: .5rem;
}
.form_wrap input[type="submit"] {
  background-color: var(--primary-purple-color);
}
.form_wrap input[type="button"] {
  color: #333;
  background-color: var(--primary-color);
}
.form_wrap .wpcf7-spinner {
  vertical-align: middle;
}
.wpcf7 form .wpcf7-response-output {
  border: 1px solid var(--primary-blue-color);
  border-radius: .25rem;
  font-size: var(--font-size-sm);
  text-align: center;
}
.form_wrap._confirm dd {
  border-bottom: 1px solid var(--primary-color);
}
.form_wrap._confirm a {
  color: var(--primary-purple-color);
  text-decoration: underline;
}
.form_wrap._confirm .button_text {
  margin-top: 2rem;
  font-size: var(--font-size-sm);
  text-align: center;
}
.form_wrap._confirm .button_wrap {
  display: flex;
  gap: 2rem;
}
.button_wrap._complete a {
  display: inline-block;
  margin: 2rem 0;
  padding: 1rem 2rem;
  font-size: var(--font-size-md);
  font-weight: 600;
  line-height: 1;
  letter-spacing: .08em;
  text-align: center;
  background-color: var(--primary-purple-color);
  border-radius: .5rem;
}

/* footer */
.footer {
  width: 100%;
  padding: 4rem clamp(1rem, 4.4444vw, 6rem) .5rem;
  color: #FFF;
  text-align: center;
}
.footer_sitename {
  font-size: calc(var(--font-size-xs) * 2);
  letter-spacing: .08em;
}
.footer_navi {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 1.5rem;
}
@media (max-width: 767px) {
  .footer_navi {
    flex-direction: column;
  }
}
.footer_navi li {
  font-size: 1rem;
  letter-spacing: .08em;
}
@media (min-width: 768px) {
  .footer_navi li:not(:first-child)::before {
    content: "/";
    padding: 0 .5rem;
  }
}
@media (max-width: 767px) {
  .footer_navi a {
    display: block;
    padding: .5rem 0;
  }
}
.copyright {
  margin-top: 4rem;
  font-size: var(--font-size-xxs);
}

/* utility */
.d-none {
  display: none;
}
@media (min-width: 768px) {
  .d-pc {
    display: block;
  }
}
@media (max-width: 767px) {
  .d-sp {
    display: block;
  }
}
.c-categories {
  background-color: var(--primary-purple-color);
}
.c-area {
  background-color: var(--primary-blue-color);
}
.disp_template {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 9999;
  padding: 0 .5em;
  color: #FFF;
  font-size: var(--font-size-xxs);
  background-color: var(--primary-purple-color);
}