@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Old+Mincho:wght@400;500;600;700;900&family=Barlow:wght@400;500;600;700;800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0, 400..800;1,400..800&display=swap");
:root {
  --leading-trim: calc((1em - 1lh) / 2);
}

/*
======== table of content. ===============

summary:ワイヤーフレーム要素

==========================================
*/
/* Zen Old Mincho, Noto Sans Japanese, EB Garamond, Barlow */
/*----------------------------------------
inline
------------------------------------------*/
img {
  max-inline-size: 100%;
  block-size: auto;
  vertical-align: top;
}

span,
strong {
  display: inline-block;
  vertical-align: baseline;
}

/*----------------------------------------
base link color
------------------------------------------*/
a {
  display: inline-block;
  vertical-align: baseline;
  color: #555757;
  text-decoration: none;
  transition: opacity 0.5s cubic-bezier(0.23, 1, 0.32, 1), transform 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-block-start 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-inline-end 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-block-end 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-inline-start 0.5s cubic-bezier(0.23, 1, 0.32, 1), inline-size 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955), block-size 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-width 0.5s cubic-bezier(0.23, 1, 0.32, 1), border-radius 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-color 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-size 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-position 0.5s cubic-bezier(0.23, 1, 0.32, 1), color 0.5s cubic-bezier(0.23, 1, 0.32, 1), text-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1), filter 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
a::before, a::after {
  transition: opacity 0.5s cubic-bezier(0.23, 1, 0.32, 1), transform 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-block-start 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-inline-end 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-block-end 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-inline-start 0.5s cubic-bezier(0.23, 1, 0.32, 1), inline-size 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955), block-size 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-width 0.5s cubic-bezier(0.23, 1, 0.32, 1), border-radius 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-color 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-size 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-position 0.5s cubic-bezier(0.23, 1, 0.32, 1), color 0.5s cubic-bezier(0.23, 1, 0.32, 1), text-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1), filter 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}
@media screen and (hover) {
  a:hover {
    color: #2179bf;
    text-decoration: none;
  }
}
@media screen and (min-width: 768px) {
  a[href^="tel:"] {
    cursor: default;
    color: #555757;
    pointer-events: none;
    text-decoration: none;
  }
}

/*----------------------------------------
html
------------------------------------------*/
html {
  font-size: 62.5%;
}

/*----------------------------------------
body
------------------------------------------*/
body {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  position: relative;
  background: #fff;
  color: #555757;
  line-height: 1.66;
  font-size: clamp(1.1rem, 1.14285vw, 1.8rem);
  font-feature-settings: "palt";
  letter-spacing: 0.06em;
  -webkit-text-size-adjust: 100%;
}
@media screen and (max-width: 767px) {
  body {
    font-size: clamp(1rem, 4.102564vw, 1.8rem);
  }
}
body.js_humburgerOpen {
  position: fixed;
}

/*----------------------------------------
div#wrapper
------------------------------------------*/
#wrapper {
  display: block grid;
  grid-template: "header" "main" 1fr "footer";
  min-block-size: 100vh;
}

.inner {
  max-inline-size: 71.25em;
  margin: 0 auto;
  padding: 0 1.875em;
}
@media screen and (max-width: 767px) {
  .inner {
    padding-inline: 2em;
  }
}

/*----------------------------------------
content
------------------------------------------*/
main {
  position: relative;
  inline-size: 100%;
}
@media screen and (max-width: 767px) {
  main {
    inline-size: 100%;
    margin: 0;
  }
}

*:first-child {
  margin-block-start: 0;
}

.section {
  margin-block-end: 6.5em;
}
.section:last-of-type {
  margin-block-end: 0;
}
@media screen and (max-width: 767px) {
  .section {
    margin-block-end: 5em;
  }
}
.section__ttl {
  margin-block-end: calc(3em + var(--leading-trim));
  text-align: center;
}
.section__ttl span {
  margin-block: var(--leading-trim);
  font-family: "Zen Old Mincho", serif !important;
  font-size: 212.5%;
  font-weight: 600;
  letter-spacing: 0;
}

h2 {
  margin-block: var(--leading-trim) calc(3.75em + var(--leading-trim));
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  h2 {
    margin-block-end: calc(3em + var(--leading-trim));
  }
}

h3 {
  margin-block: var(--leading-trim) calc(2.5em + var(--leading-trim));
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  h3 {
    margin-block-end: calc(1.875em + var(--leading-trim));
  }
}

h4 {
  margin-block: calc(1.25em + var(--leading-trim));
  font-weight: 700;
}

h5 {
  margin-block: calc(1.25em + var(--leading-trim));
  font-weight: 500;
}

h6 {
  margin-block: calc(1.25em + var(--leading-trim));
  font-weight: 500;
}

.title__section {
  margin-block-end: 6.25em;
}

.page__ttl {
  padding-block: calc((15em - 2.125lh) / 2);
  background: url(/common/img/bg__texture__marble.jpg) no-repeat left top 20%/cover;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .page__ttl {
    padding-block: calc((12.5em - 1.75lh) / 2);
  }
}
.page__ttl span {
  font-size: 212.5%;
}
@media screen and (max-width: 767px) {
  .page__ttl span {
    font-size: 175%;
  }
}

.mv {
  display: block grid;
  grid-template-columns: 40vw 1fr;
  margin-block-end: 6.25em;
}
@media screen and (max-width: 767px) {
  .mv {
    grid-template-columns: none;
    grid-auto-flow: row;
    margin-block-end: 5em;
  }
}
.mv__main {
  display: block grid;
  place-content: center;
  block-size: 100%;
  padding-inline: calc(100% - 30em) 1.875em;
  background: url(/common/img/bg__texture__marble.jpg) no-repeat left -200px top -50px/1400px auto;
}
@media screen and (max-width: 767px) {
  .mv__main {
    padding: 2.5em 1em;
    background-position: left center;
    background-size: auto 143%;
  }
}
.mv__ttl {
  font-weight: 400;
  letter-spacing: 0;
}
@media screen and (max-width: 767px) {
  .mv__ttl {
    margin-block-end: calc(2.5em + var(--leading-trim));
  }
}
.mv__ttl__main {
  display: block;
  margin-block: calc(0.5em + var(--leading-trim)) var(--leading-trim);
  font-size: 250%;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .mv__ttl__main {
    font-size: 187.5%;
  }
}
.mv__ttl__sub {
  display: block;
  margin-block: var(--leading-trim);
  font-size: 187.5%;
}
@media screen and (max-width: 767px) {
  .mv__ttl__sub {
    font-size: 162.5%;
    text-align: center;
  }
}
@media screen and (min-width: 768px) {
  .mv__ttl__sub:last-child {
    text-align: end;
  }
}
.txt__lead {
  margin-block: var(--leading-trim) calc(3em + var(--leading-trim));
  font-size: 112.5%;
  font-weight: 500;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .txt__lead {
    text-align: left;
  }
}

p,
.paragraph {
  margin-block-start: calc(1em + var(--leading-trim));
}

hr {
  margin: 3.75em auto;
  border: none;
  border-block-start: 0.1rem solid #e6e6e6;
  outline: none;
}

sup {
  vertical-align: super;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 50%;
  font-weight: 700;
}

input[type=text],
input[type=tel],
input[type=email],
input[type=password],
input[type=date],
input[type=time],
input[type=number],
textarea {
  inline-size: 100%;
  margin-block: calc(-1em - var(--leading-trim) + 0.1rem);
  padding: calc(1em + var(--leading-trim) - 0.2rem) 1em;
  outline: none;
  border: 0.1rem solid #aaaaaa;
  border-radius: 0.2em;
  background-color: #fff;
  font-size: 100%;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  input[type=text],
  input[type=tel],
  input[type=email],
  input[type=password],
  input[type=date],
  input[type=time],
  input[type=number],
  textarea {
    padding: calc(1em + var(--leading-trim) - 0.2rem) 0.5em;
  }
}
@media screen and (min-width: 768px) {
  input[type=text].narrow,
  input[type=tel].narrow,
  input[type=email].narrow,
  input[type=password].narrow,
  input[type=date].narrow,
  input[type=time].narrow,
  input[type=number].narrow,
  textarea.narrow {
    inline-size: 50%;
  }
}
input[type=text]:focus,
input[type=tel]:focus,
input[type=email]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=time]:focus,
input[type=number]:focus,
textarea:focus {
  border-color: #2186a2;
  background-color: #f6f6f6;
}
input[type=text]::-moz-placeholder, input[type=tel]::-moz-placeholder, input[type=email]::-moz-placeholder, input[type=password]::-moz-placeholder, input[type=date]::-moz-placeholder, input[type=time]::-moz-placeholder, input[type=number]::-moz-placeholder, textarea::-moz-placeholder {
  color: #aec7e0;
}
input[type=text]::placeholder,
input[type=tel]::placeholder,
input[type=email]::placeholder,
input[type=password]::placeholder,
input[type=date]::placeholder,
input[type=time]::placeholder,
input[type=number]::placeholder,
textarea::placeholder {
  color: #aec7e0;
}

textarea {
  width: 100%;
  min-height: 10em;
  padding: 0.25em 0.5em;
  outline: none;
  border: 0.1rem solid #aaaaaa;
  border-radius: 0.2em;
  background-color: #fff;
  font-size: 100%;
  line-height: 1.5;
}
textarea:focus {
  border-color: #2186a2;
  background-color: #f6f6f6;
}

.select__wrap {
  position: relative;
  margin-block: calc(-1em - var(--leading-trim) + 0.1rem);
  padding-inline-end: 1em;
  border: 0.1rem solid #aaaaaa;
  border-radius: 0.2em;
  background-color: #fff;
  vertical-align: middle;
}
.select__wrap::before {
  content: "";
  position: absolute;
  inset-block: 0;
  inset-inline-end: 1em;
  inline-size: 0;
  block-size: 0;
  margin: auto 0;
  border-width: 0.5em 0.35em 0 0.35em;
  border-style: solid;
  border-color: #555757 transparent transparent transparent;
}
.select__wrap select {
  inline-size: calc(100% + 1em);
  margin-inline-end: -1em;
  padding-inline: 1em 2em;
  padding-block: calc(1em + var(--leading-trim) - 0.2rem);
  outline: none;
  font-size: 100%;
  line-height: 1.5;
}

/*.hr_full { position: relative; margin: 0 -3.1828vw; }

table { inline-size: 100%; margin-block-start: 1.7857%; border-collapse: collapse; border-spacing: 0; }
tr.odd td { background-color: #f5f5f5; }
th, td { padding: 1.5rem; border-bottom: 1px solid #e0e0e0;}
*/
/* ページトップに戻る*/
#btnPagetop {
  position: fixed;
  inset: auto 1.5em 2.5em auto;
  opacity: 0;
  z-index: 5;
  transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), filter 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}
@media screen and (max-width: 767px) {
  #btnPagetop {
    inset-block-end: 5em;
  }
}
.scrolled #btnPagetop {
  opacity: 1;
}
#btnPagetop a {
  display: block;
  position: relative;
  inline-size: 3em;
  block-size: 3em;
  border-radius: 50%;
  background-color: #1da4c7;
  text-align: center;
  text-decoration: none;
}
@media screen and (max-width: 767px) {
  #btnPagetop a {
    inline-size: 2.625em;
    block-size: 2.625em;
  }
}
#btnPagetop a::after {
  content: "";
  display: inline-block;
  position: relative;
  inset-block-start: -0.1em;
  inline-size: 1em;
  block-size: 1em;
  border-block-start: 0.2rem solid #fff;
  border-inline-end: 0.2rem solid #fff;
  vertical-align: baseline;
  transform: rotate(-45deg);
  z-index: 2;
  transition: opacity 0.5s cubic-bezier(0.23, 1, 0.32, 1), transform 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-block-start 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-inline-end 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-block-end 0.5s cubic-bezier(0.23, 1, 0.32, 1), inset-inline-start 0.5s cubic-bezier(0.23, 1, 0.32, 1), inline-size 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955), block-size 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955), border-width 0.5s cubic-bezier(0.23, 1, 0.32, 1), border-radius 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-color 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-size 0.5s cubic-bezier(0.23, 1, 0.32, 1), background-position 0.5s cubic-bezier(0.23, 1, 0.32, 1), color 0.5s cubic-bezier(0.23, 1, 0.32, 1), text-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1), filter 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  position: absolute;
  inset: 0;
  margin: auto;
  transform: translateY(0.35em) rotate(-45deg);
}
@media screen and (min-width: 768px) {
  #btnPagetop a:hover {
    background-color: #2179bf;
    color: #fff;
  }
}/*# sourceMappingURL=base.css.map */