@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto+Serif:ital,opsz,wght@0,8..144,100..900;1,8..144,100..900&display=swap');

/* *** */
html {
  font-size: 3.125vw;
}
@media screen and (min-width: 390px) {
  html {
    font-size: 2.5664102564vw;
  }
}
@media screen and (min-width: 576px) {
  html {
    font-size: 1.736111111vw;
  }
}
@media screen and (min-width: 768px) {
  html {
    font-size: 1.302083333vw;
  }
}
@media screen and (min-width: 992px) {
  html {
    font-size: 1.008064516vw;
  }
  a[href^="tel:"] {
    pointer-events: none;
  }
}
@media screen and (min-width: 1144px) {
  html {
    font-size: 10px;
  }
}

/* font */
body {
  background-color: #fff;
  color: var(--text-color);
  font-family: "Roboto Serif", "Noto Sans JP", serif;
  font-style: normal;
  font-weight: 400;
  font-optical-sizing: auto;
  font-feature-settings: "palt";
  word-wrap: break-word;
  overflow-wrap: break-word;
  position: relative;
}
.container {
  font-size: 1.25em;
  line-height: 1.75;
  margin: 0 auto;
  position: relative;
}
@media screen and (min-width: 576px) {
  .container {
    font-size: 1.3em;
  }
}
@media screen and (min-width: 768px) {
  .container {
    font-size: 1.4em;
  }
}
@media screen and (min-width: 992px) {
  .container {
    font-size: 1.5em;
  }
}
@media screen and (min-width: 1144px) {
  .container {
    font-size: 1.6em;
  }
}
html,
body,
.container {
  height: 100%;
}
.container-inner {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  margin: 0 auto;
  position: relative;
  /* z-index: 1; */
  overflow: hidden;
  padding-right: 1em;
  padding-left: 1em;
}
@media screen and (min-width: 576px) {
  .container-inner  {
    padding-right: 1.25em;
    padding-left: 1.25em;
  }
}
@media screen and (min-width: 768px) {
  .container-inner  {
    padding-right: 1.5em;
    padding-left: 1.5em;
  }
}
@media screen and (min-width: 992px) {
  .container-inner  {
    padding-right: 1.75em;
    padding-left: 1.75em;
  }
}
@media screen and (min-width: 1144px) {
  .container-inner {
    padding-right: 2em;
    padding-left: 2em;
  }
}
.footer {
  margin-top: auto;
}

/* *** */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 1em;
  font-style: normal;
  font-weight: normal;
  font-weight: 400;
  line-height: 1.25;
  margin: 0;
}
[class*="-heading"] > .heading-inner {
  display: inline-block;
}
em {
  font-size: 1em;
  font-style: normal;
  font-weight: bold;
}
strong {
  font-size: 1em;
  font-style: normal;
  font-weight: bold;
}
.marker {
  background-color: transparent;
  background-image: linear-gradient(transparent 77%, rgba(var(--yellow-rgb), .67) 0%);
}
.under-line {
  background-image: linear-gradient(transparent 77%, rgba(var(--red-rgb), .67) 0%);
}

/* clearfix */
[class*="-inner"]::after,
.cf::after,
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/* link && pointer */
a {
  color: var(--text-color);
  transition: all .3s ease;
  text-decoration: none;
}
@media (hover:hover) {
  a.menu_inner:hover {
    opacity: .77;
  }
}
a:focus {
  outline: 0;
  outline: none;
  outline: .125em solid rgba(var(--outline-color-rgb), .7);
}
form :focus {
  outline: 2px solid var(--outline-color);
}
.pointer {
  cursor: pointer;
}

/* img */
img {
  border: 0;
  border: none;
  width: 100%;
  height: auto;
  min-height: 1%;
  vertical-align: top;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;

  image-rendering: -webkit-optimize-contrast;
}
a img.transform {
  transition: transform .3s ease;
}
@media (hover: hover) {
  a:hover img.transform {
    opacity: .77;
    transform: scale(1.03);
  }
}

/* list */
::marker {
  color: #c97b7d;
}
nav li {
  position: relative;
}
nav li::before {
  position: absolute;
}
ul.list {
  margin: 1em 0;
  padding: 0 0 0 2em;
}
.list-before + ul.list {
  margin-top: 0;
}
ul.list > li {
  margin: 0;
  padding: 0;
}
ul.list > li:nth-child(n+2) {
  /* margin-top: .3em; */
}
ul.style-none,
ol.style-none,
ul.check-list,
ul.contact,
ul.field,
ol.field,
ul.item,
ol.item,
ul.menu,
ul.nav,
ol.step {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.style-none + .style-none {
  margin: 2em 0 1em;
}
ul.style-none > li,
ol.style-none > li,
ul.check-list > li,
ul.contact > li,
ul.field > li,
ol.field > li,
ul.item > li,
ol.item > li,
ul.menu > li,
ul.nav > li,
ol.step > li {
  margin: 0;
  padding: 0;
}
ul > li > p,
ol > li > p {
  margin: 0;
}
ul > li > p.margin,
ol > li > p.margin {
  margin: 1em 0;
}
ul.kome, ol.kome {
  list-style-type: none;
  /* margin: 2em 0 1em; */
  padding: 0;
}
ul.kome > li {
  padding-left: 1em;
  position: relative;
  display: inline-block;
}
.kome span.symbol {
  text-align: center;
  display: block;
  width: 1em;
  position: absolute;
  left: 0;
}

/* ol.num-list */
ol.num-list {
  list-style-type: none;
  counter-reset: item;
  margin: 1em 0;
  padding: 0;
}
ol.num-list > li {
  margin: 0;
  padding: 0 0 0 2em;
  position: relative;
}
ol.num-list > li:nth-child(n+2) {
  margin-top: .3em;
}
ol.num-list > li::before {
  counter-increment: item;
  content: counter(item)".";
  font-size: 1em;
  text-align: center;
  display: block;
  width: 1.5em;
  position: absolute;
  left: 0;
}
ol {
  padding: 0;
}

/* ul.check-list */
ul.check-list > li {
  line-height: 1.5;
  margin: .5em 0;
  padding-left: 2em;
  position: relative;
}
ul.check-list > li::before,
ul.check-list > li::after {
  content: "";
  position: absolute;
}
ul.check-list > li::before {
  background-color: var(--blue-dark);
  display: block;
  width: 1.4em;
  height: 1.4em;
  top: .25em;
  left: 0;
}
ul.check-list > li::after {
  border-bottom: .1875em solid #fff;
  border-left: .1875em solid #fff;
  display: block;
  width: 1.2em;
  height: .8em;
  top: .25em;
  left: .1em;
  transform: rotate(-45deg);
}

/* dl, dt, dd */
dl,
dt,
dd {
  margin: 0;
  padding: 0;
}

/* others */
.align-center {
  text-align: center;
}
.align-right {
  text-align: right;
}
.i-block,
.inline-block {
  white-space: nowrap;
  display: inline-block;
}
.d-block,
.display-block {
  display: block;
}
.d-none,
.display-none {
  display: none;
}
.nowrap {
  white-space: nowrap;
}
.narrow.before {
  display: inline-block;
  margin-left: -.5em;
}
.narrow.after {
  letter-spacing: -.5em;
}

/* .border */
.border {
  border: 1px solid var(--text-color);
}
.border .text-text {
  margin: 0;
}

/* .lang-en */
.lang-en {
  font-size: 1.23em;
}
.serif {
  font-family: "Roboto Serif", serif;
}
/* font-size */
.fz-small {
  font-size: 0.8em;
}

/* .em-px */
.em-px {
  font-size: 1em;
  display: block;
  width: 1em;
  height: 0;
  position: absolute;
}
/* .page */
.article-page > .article-inner {
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  /* padding-bottom: 5em; */
}
.article-metaheader .item-box {
  & .box-inner:first-of-type {
    background: #fff8f7;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
  }
}
.article-metaheader.article {
    margin: 0 0 2em;
  & .article-header {
    /* padding-right: 1em; */
    display: flex;
    align-items: flex-end;
    position: relative;
    &::before {
      /* background-color: white;
      content: '';
      position: absolute;
      display: block;
      width: 100%;
      height: 100%;
      padding: 0;
      opacity: .7; */
      /* z-index: ; */
      }
  & .header-inner {
    max-width: 1000px;
    margin: 0 auto;
    z-index: 5;
    &::before {
      position: absolute;
      display: inline-block;
      background-color: white;
      width: 3em;
      height: 3em;
    }
  }
  & .article-heading {
    letter-spacing: .2em;
    padding: 1.5em 0 1em;
    position: relative;
    display: flex;
    flex-direction: column;
    z-index: 10;
    &:nth-of-type(2) {
      padding-top: 0.3em;
    }
    & .heading-inner {
      text-align: center;
      display: inline-block;
      position: relative;
      z-index: 5;
      &:nth-of-type(2) {
        padding-top: 0.3em;
      }
      }
    }
    & .lang-jp {
      color:  white;
      font-weight: 500;
      letter-spacing: .15em;
      padding-left: .15em;
    }
    & .lang-jp > span {
      position: relative;
      z-index: 2;
      &::before {
        position: absolute;
        content: '';
        width: 1.8em;
        height: 1.8em;
        background-color: #ffb6a3;;
        display: inline-block;
        border-radius: 50%;
        z-index: -1;
        top: -.1em;
        left: -.425em;
      }
    }
    & .lang-en {
      font-size: 0.6em;
    }
  }
}
.article-metaheader .item-box {
  /* display: flex; */
  gap: 8em;
  align-items: center;
}
.article-metaheader .img-img {
  width: 100vw;
  margin: 0 calc(50% - 50vw);
  img {
    aspect-ratio: 3 / 2;
    object-fit: cover;
  }
}
@media screen and (min-width: 768px) {
  .article-metaheader.article {
    & .article-header {
        & .article-heading {
          letter-spacing: .2em;
          position: relative;
          display: flex;
          flex-direction: column;
          align-content: flex-start;
          z-index: 10;
        }
      }
    }
  .article-metaheader.article .item-box {
    position: relative;
    display: flex;
    justify-content: center;
    & .box-inner:first-of-type {
      background-color: #fff8f700;
      width: 100%;
      height: 6em;
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto calc(50% - 50vw);
      display: flex;
      justify-content: flex-start;
      align-items: center;
    }
  }
  .article-metaheader.article {
    & .article-header {
      & .lang-jp {
        font-size: 1.4em;
        letter-spacing: .3em;
        padding-left: .5em;
      }
      & .lang-jp > span {
        &::before {
          width: 2.5em;
          height: 2.5em;
          background-color: #ffb6a3;
          left: -.75em;
          top: 0;
          bottom: 0;
          margin: auto;
        }
      }
      & .lang-en {
        font-size: 0.7em;
      }
    }
  }
  .article-metaheader .img-img {
    & img {
      max-height: 400px;
      aspect-ratio: unset;
    }
  }
  .article-metaheader.article {
    & .article-header {
      & .article-heading {
        & .heading-inner {
          &:nth-of-type(2) {
            padding-top: 0.9em;
          }
        }
      }
    }
  }
}
/* .breadcrumb */
.breadcrumb .breadcrumb-inner .list {
  list-style-type: none;
  display: flex;
  /* margin: 1.5em 0 5em; */
  padding: 0;
}
.breadcrumb .list-inner {
  padding: 1em;
}
.breadcrumb .list-inner:nth-of-type(2) {
  position: relative;
}
.breadcrumb .list-inner:first-child {
  padding-left: 0;
}
.breadcrumb .list-inner::before,
.breadcrumb .list-inner::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 1.8em;
  left: -.2em;
  width: 7px;
  height: 1px;
  border-radius: 9999px;
  background-color: var(--dark-red);
  transform-origin: calc(100% - 0.5px) 50%;
}
.breadcrumb .list-inner::before {
  transform: rotate(45deg);
}
.breadcrumb .list-inner::after {
  transform: rotate(-45deg);
}
.breadcrumb .list-inner:first-child::before {
  display: none;
}
.breadcrumb .text-link {
  font-size: .9em;
  font-weight: bold;
  font-weight: 700;
  text-decoration: none;
}
.breadcrumb .current {
  color: rgba(var(--black-rgb), .67);
  font-weight: normal;
  font-weight: 400;
}

/* go to top */
.go-to-top {
  width: 100%;
  max-width: var(--content_max_width);
  height: 0;
  margin: 0 auto;
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 55;
}
.absolute .go-to-top {
  position: absolute;
}
.go-to-top a {
  background-color: rgba(var(--orange-rgb), .6);
  border-radius: 50%;
  color: #fff;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  display: block;
  width: 3em;
  height: 3em;
  position: absolute;
  right: 1em;
  bottom: 4em;
  opacity: 0;
  transition: all .3s ease;
}
.fadein .go-to-top a {
  opacity: 1;
  transition: all .3s ease;
}
.absolute .go-to-top a {
  bottom: 1em;
  transition: all .3s ease;
}
.go-to-top .icon-icon {
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: .5em;
}
.go-to-top .icon-path {
  fill: none;
  stroke: #fff;
  stroke-miterlimit: 10;
}
@media screen and (min-width: 768px) {
  .go-to-top a {
    bottom: .25em;
  }
  .absolute .go-to-top a {
    bottom: -3em;
  }
}
@media (hover: hover) {
  .go-to-top a:hover {
    background-color: rgba(var(--orange-rgb), .8);
  }
}
/* ---------------------------
ヘッダー・フッター
--------------------------- */
/* header */
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 70;
}
.header .nav-btn {
  width: 2em;
  height: 1.5em;
  position: fixed;
  top: 1.4em;
  right: 1em;
  cursor: pointer;
  z-index: 2;
}
@media screen and (min-width: 992px) {
  .header .nav-btn {
    display: none;
  }
  .header-nav {
    margin-left: auto;
  }
}
.header .nav-btn::before,
.header .nav-btn::after,
.header .nav-btn > .btn-inner::after {
  background-color: var(--pink);
  content: "";
  display: block;
  width: 100%;
  height: .14em;
  margin: auto;
  position: absolute;
  right: 0;
  left: 0;
}
.header .nav-btn::before {
  top: 0;
  bottom: auto;
  transition: bottom .1s linear, transform .3s ease;
}
.header .nav-btn::after {
  top: auto;
  bottom: 0;
  transition: top .1s linear, transform .3s ease;
}
.header .nav-btn > .btn-inner::after {
  top: .65em;
}

/* .header .menu */
.header .menu a,
.header .menu .text-link-none {
  text-align: center;
  text-decoration: none;
  display: block;
}
@media screen and (max-width: 991px) {
  .header .nav-bg {
    background-color: #fff8f7;
    width: 100%;
    height: 0;
    position: fixed;
    top: 4.25em;
    left: 0;
    z-index: 5;
    opacity: 0;
    transform: translateY(-100vh);
    transition: height .2s ease, opacity .1s linear, transform .3s ease;
  }
  .sp-menu-open .header .nav-bg {
    height: 100%;
    opacity: 1;
    transform: translateY(0);
  }
  .header .menu {
    width: 100%;
    position: fixed;
    top: 6.5em;
    left: 0;
    z-index: 10;
    opacity: 0;
    transform: translateY(-100vh);
    transition: opacity .1s linear, transform .3s ease;
    & .menu_item:not(:first-of-type) {
      padding-top: 1em;
    }
    & .menu_inner {
      background-color: white;
      color: #a6847c;
      width: 15em;
      margin: 0 auto;
      border-radius: 5px;
    }
  }
  .header .list.sns,
  .header .list.banner  {
    margin-top: 1em;
  }
  .sp-menu-open .header .menu {
    opacity: 1;
    transform: translateY(0);
    padding: 0em 2em 3em;
    overflow-y: auto;
    max-height: calc(100vh - 7.75em);
  }
  .sp-menu-open .header .nav-btn::after {
    top: 0;
    bottom: 0;
    transform: rotate(-45deg);
  }
  .sp-menu-open .header .nav-btn::before {
    top: 0;
    bottom: 0;
    transform: rotate(45deg);
  }
  .sp-menu-open .header .nav-btn > .btn-inner {
    opacity: 0;
  }
  .header .menu .text-link {
    padding: 1em 0;
  }
}
@media screen and (min-width: 992px) {
  .header .nav-bg {
    display: none;
  }
  .header .menu {
    display: flex;
    gap: 1.1em;
    top: .7em;
    right: .5em;
  }
  .header .menu .sns_banner {
    display: none;
  }
  .home .header .menu a {
    color: var(--text-color);
    margin: 0;
    padding: .2em;
    position: relative;
  }
  .home .header .menu .menu_item.top a,
  .clinic .header .menu .menu_item.clinic a,
  .profile .header .menu .menu_item.profile a,
  .fujin .header .menu .menu_item.fujin a,
  .kampo .header .menu .menu_item.kampo a,
  .naika .header .menu .menu_item.naika a {
    color: #e4734c;
    pointer-events: none;
  }
}
@media screen and (min-width: 1440px)  {
  .header .menu {
    gap: 1.5em;
  }
}

/* .footer && .main */
.footer,
.main {
  min-height: 1%;
  margin-top: 4.5em;
}
.footer > .footer-inner,
.main > .main-inner {
  width: 100%;
  max-width: var(--content-max-width);
  margin: 0 auto;
}
.header p,
.footer p {
  margin: 0;
}
.page .footer {
  margin-top: 0;
}
@media screen and (min-width: 768px) {
  .footer {
    margin-top: auto;
  }
}

/* .copyright */
.copyright {
  text-align: center;
  padding: 1em;
  margin-top: 3em;
}
.copyright small {
  font-size: .87em;
}

/* common */
.serif-en {
  font-family: "Roboto Serif", serif;
  font-style: italic;
  font-weight: 500;
}
.sans-serif {
  font-family: "Noto Sans JP";
}
.contact a {
  color: #fff;
  border-radius: 10px;
  background-color: var(--pink);
  text-decoration: none;
  display: block;
  width: 100%;
  height: 100%;
}
@media screen and (hover: hover) {
  .contact a:hover {
    background-color: #ffbc95;
  }
}

/* .article */
.article {
  margin: 0 0 4em;
}
@media screen and (min-width: 768px) {
  .article {
    margin: 0 0 8em;
  }
}
.main-inner .article:last-of-type {
  margin-bottom: 0;
}
.article.article-top {
  margin-top: -4em;
}
.article-inner {
  padding: 0;
}


/* .header */
header .site-heading {
  font-size: 1em;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25;
  margin: 0;
}
.site-header {
  background-color: var(--pink-beige);
  width: 100%;
  height: 4.5em;
  padding: 1em;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
}

/* .header .contact */
.header .header-inner {
  display: flex;
  align-items: center;
}
.header .contact {
  background-color: #fff;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin: auto;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 73;
}
.header .contact-inner {
  text-align: center;
  width: 50%;
  height: 100%;
  padding: .5em;
}
.contact-tel .tel-num {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .4em;
  & .icon {
    background-color: var(--white);
    border-radius: 50%;
    color: var(--pink);
    display: inline-block;
    width: 1.7em;
    height: 1.7em;
  }
  & .fa-phone {
    font-size: 1em;
    position: relative;
    top: 0;
  }
  & .number {
    font-size: 1.2em;
  }
}
.header .contact-area {
  margin-left: 1em;
}
.header .contact-tel .tel-text p {
  font-size: 0.7em;
}
.header .contact .link-inner {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2em;
}
.header .contact .link-inner:first-of-type {
  display: flex;
  flex-direction: column;
}
.header .contact a {
  border-radius: 8px;
  font-weight: 600;
  padding: .5em;
}
@media screen and (min-width: 768px) {
  .header .contact {
    background-color: transparent;
    width: 16em;
    padding-top: 0.25em;
    position: fixed;
    top: 0;
    bottom: auto;
    left: auto;
    z-index: 1;
    & .contact-inner {
      margin-left: 1.5em;
    }
    & a {
      border-radius: 8px;
    }
  }
  .header .contact-area {
    margin-left: auto;
    padding-right: 12em;
  }
  .header .contact .contact-tel {
    display: none;
  }
}
@media screen and (min-width: 992px) {
  .header .menu .menu-item {
    font-size: 1.4em;
  }
  .header .contact {
    position: unset;
    width: auto;
    padding: 0;
  }
  .header .contact-area {
    margin-left: 1em;
    padding-right: 0;
  }
  .header .contact a {
    box-shadow: 0 2px 3px #dddddd;
    padding: .4em 1.5em;
  }
  .header .contact {
    & .contact-inner {
      width: 100%;
      padding: 0;
      margin-left: 0;
    }
  }
}

/* footer */
.footer {
  position: relative;
  margin-bottom: 4em;
  &::before {
    content: '';
    background-image: url(../img/back_fotter.webp);
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    width: 100vw;
    height: 100%;
    margin: 0 calc(50% - 50vw);
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -3;
  }
& .footer-inner {
    padding-block: 3em 0;
  }
}
.footer .nav-menu {
  display: grid;
  grid-template-columns: repeat(2, 50%);
  grid-template-rows: repeat(3, 1fr);
  place-items: center;
  margin-bottom: 2.5em;
}
.footer .menu_item {
  position: relative;
  width: 9em;
  padding: 0 0 .8em 1em;
}
.footer .menu_item::before,
.footer .menu_item::after  {
  content: "";
  position: absolute;
  top: .85em;
  left: 0;
  width: 7px;
  height: 1px;
  border-radius: 9999px;
  background-color: var(--dark-red);
  transform-origin: calc(100% - 0.5px) 50%;
}
.footer .menu_item::before {
  transform: rotate(45deg);
}
.footer .menu_item::after  {
  transform: rotate(-45deg);
}
.footer .contact {
  display: none;
}
.footer .img-box .box-inner {
  margin-top: .5em;
}
.footer .sns_banner .list-inner:first-of-type img {
  margin-left: 0;
}
.footer .sns_banner .list-inner:nth-of-type(3) img {
  margin-right: 0;
}

.footer .contact-web a,
.footer .contact-tel a {
  box-shadow: 0 2px 3px #dddddd;
}
.contact-sns .icon {
    width: 2.5em;
    height: 2.5em;
    margin: 0 auto;
}
.list.sns {
  background-color: rgb(var(--pink-rgb) , .1);
  width: 100vw;
  margin: 2em calc(50% - 50vw) 0;
  padding: 1.25em;
  display: flex;
  justify-content: center;
  align-items: center;
  & .list-inner {
    display: flex;
    justify-content: center;
  }
  & .banner img {
    width: 80%;
    display: block;
    margin: 0 auto;
  }
}
.list.banner {
  display: flex;
  justify-content: center;
  flex-direction: row;
  gap: 1em;
}
@media screen and (min-width: 576px) {
  .footer .nav-menu {
    grid-template-columns: repeat(3, 33.33333%);
    grid-template-rows: repeat(2, 1fr);
  }
 .footer .pkg-inner:nth-of-type(1) .box {
  display: flex;
  & .box-inner {
    width: 100%;
  }
 }
}
@media screen and (min-width: 768px) {
  .footer {
    margin-bottom: 0;
  }
  .footer .footer-inner {
    padding-block: 3em 0;
    & > .pkg {
      display: flex;
      gap: 3em;
      align-items: flex-end;
    }
    & .pkg-inner:first-of-type {
      width: 30%;
      & > .box {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
      }
    }
    & .pkg-inner:nth-of-type(2) {
      width: 70%;
    }
  }
  .footer .nav-menu {
    grid-template-columns: repeat(2, 45%);
    margin-bottom: 0;
    &::after {
      right: 0;
      left: 0;
      bottom: 3.5em;
      margin: 0 auto;
    }
  }
  .footer .contact {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5em;
    & a {
      padding: .4em 1em;
      font-weight: 600;
    }
    & .contact-inner {
      width: 50%;
      min-width: 12em;
    }
    & .text-text {
      text-align: center;
    }
  }
  .footer .contact {
    & .contact-tel {
      & .body-inner {
        position: relative;
        &::after {
          font-size: .8em;
          content: '※電話予約は初診のみ';
          display: inline-block;
          position: absolute;
          right: 0;
          padding: .3em 2.5em 0 0;
        }
      }
      & .link-inner {
        display: flex;
        justify-content: space-between;
        gap: .4em;
      }
      & .tel-num .fa-phone  {
        font-size: 1.1em;
        top: .1em;
        left: .2em;
      }
      & .text-box .text-text {
        font-size: 0.7em;
      }
    }
    .contact-tel .tel-num {
      & .icon {
        width: 1.8em;
        height: 1.8em;
      }
    }
  }
  .footer .menu_item {
    padding: 1em 0 0 1em;
    & .text-link .text-text {
      font-size: 0.8em;
    }
  }
  .footer .menu_item::before,
  .footer .menu_item::after {
    top: 1.8em;
  }
  .footer .logo {
    font-size: 1.3em;
  }
  .footer .text-address {
    margin-top: 1em;
  }
  .footer .text-tel {
    margin-top: .5em;
  }

  .footer .list.sns_banner {
    margin-top: 6em;
  }
  .footer .list.banner {
    display: flex;
    justify-content: center;
    flex-direction: row;
    gap: 1.5em;
  }
  .footer .pkg + .box .box-inner:last-of-type {
    display: flex;
    gap: 3em;
    flex-direction: row-reverse;
    justify-content:  flex-start;
    align-items: center;
    margin-top: 5em;
    & .list-inner {
      display: flex;
      justify-content: center;
      gap: unset;
    }
    & .banner img {
      width: 90%;
      margin-right: 0;
    }
  }
  .list.sns {
    margin-top: 4em;
  }
  .footer .table-box + .box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    & .box-inner:first-of-type {
      width: 70%;
    }
    & .box-inner:nth-of-type(2) {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  }
}
@media screen and (min-width: 992px) {
  .footer .footer-inner {
    padding-block: 4em 0;
    & .pkg-inner:first-of-type {
        width: 25%;
    }
    & .pkg-inner:nth-of-type(2) {
      width: 75%;
    }
  }
  .footer .nav-menu {
    grid-template-columns: repeat(2, 50%);
    margin-bottom: 0;
    /* &::after {
      display: none;
    } */
    & .menu_item {
      padding: 1em 0 0 1em;
    }
    & .text-link .text-text {
      font-size: 1em;
    }
  }
  .footer .contact {
    flex-direction: row;
    & .contact-web {
      min-width: 9em;
    }
    & .contact-sns {
      display: block;
    }
  }
  .footer .table-box + .box {
    & .box-inner:first-of-type {
      width: 50%;
    }
    & .box-inner:nth-of-type(2) {
      padding-top: 2em;
    }
  }
}

/* .logo */
.logo {
  color: var(--orange);
  font-size: 1.32em;
  font-weight: 600;
  width: 11em;
  position: relative;
  display: flex;
  flex-direction: column;
}
.heading-inner .sub-logo {
  color: var(--dark-red);
  font-size: 0.8em;
}

/* title */
.article-heading {
  padding: 1em 0;
  & .heading-inner {
  display: block;
  text-align: center;
  &:nth-of-type(2) {
    padding-top: 0.2em;
  }
  }
  & .lang-jp {
    font-size: 1.2em;
    font-family: "Noto Sans JP";
    font-weight: 200;
    letter-spacing: .1em;
  }
  & .lang-en {
    color: var(--dark-red);
    font-size: 0.8em;
    font-family: "Roboto Serif";
  }
}
 .box-heading_styleA {
    background-color: #f7efe9a6;
    padding: 1em;
    position: relative;
    &::before {
      content: '';
      background-color: var(--orange);
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
      display: block;
      width: 4px;
      height: 48%;
      margin: auto 0;
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
    }
    & .heading-inner {
      letter-spacing: .1em;
    }
  }
/* box */
.box_styleA {
  background-color: var(--light-pink);
  padding: 1em;
}
.box_styleA ul.list {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}
.box_styleA ul.list .list-inner {
  width: calc((100% - (1em * 1)) / 2);
}
.box_styleA ul.list .list-inner {
  background-color: white;
  border-radius: 0px;
  display: inline-block;
  position: relative;
  padding: .3em .2em .3em 3em;
  &::before {
    content: '';
    border: 1px solid var(--red-brown);
    border-radius: 2px;
    display: block;
    width: 1.5em;
    height: 1.5em;
    margin: auto 0;
    position: absolute;
    left: .5em;
    top: 0;
    bottom: 0;
    margin: auto 0;
  }
  &::after {
    content: '';
    display: block;
    width: 11px;
    height: 8px;
    border-left: 1px solid var(--red-brown);
    border-bottom: 1px solid var(--red-brown);
    transform: rotate(-45deg);
    position: absolute;
    top: .7em;
    left: .8em;
    margin: auto;
    @media screen and (min-width: 768px) {
      top: .8em;
      left: .9em;
    }
  }
}
.text-box_styleA {
  margin-top: 1em;
  & p {
    margin: 0;
  }
  & .box-inner {
    & .text-text {
      color: #6e5e5fd4;
      border: 3.5px dotted #c1b0ac61;
      background-color: #fff;
      font-size: 0.8em;
      line-height: 1.6;
      padding: .5em .8em;
    }
  }
}
.text-box_styleB {
  background: #f6f6f6;
  padding: 2em 2em;
  position: relative;
  z-index: 5;
  & .box-inner {
    background: white;
    padding: 2em 2em;
  }
  & p {
    margin: 0 0 1em 0;
    &:last-of-type {
      margin-bottom: 0;
    }
  }
  &::before,
  &::after {
    background-repeat: no-repeat;
    background-size: contain;
    content: '';
    display: inline-block;
    position: absolute;
    z-index: -1;
  }
  &::before {
    background-image: url(../img/back_01.webp);
    width: 19em;
    height: 12em;
    top: 0;
    left: 0;
  }
  &::after {
    background-image: url(../img/back_02.webp);
    width: 10.9em;
    height: 7.9em;
    bottom: 0;
    right: 0;
    opacity: .8s;
  }
}

/* others */
.pc-only {
  display: none;
  @media screen and (min-width: 768px) {
    display: block;
  }
}
.sp-only {
  display: block;
  @media screen and (min-width: 768px) {
    display: none;
  }
}

/* table-診療時間の装飾 */
.table {
  width: 95%;
  margin: 0 auto;
}
.table th,
.table td {
  font-weight: 400;
  text-align: center;
  padding: .5em;
}
.table thead th {
  background-color: var(--brown);
  color: #fff;
  font-weight: 400;
}
.table-box {
  background-color: #fff;
  border: 1px solid var(--brown);
  padding: 0 .3em;
  margin-top: 3em;
  & .box-inner {
    position: relative;
    top: -1em;
  }
  & p {
    margin: 0;
  }
  & .text-text {
  font-size: 0.9em;
  }
  & .text-box {
    padding: 1em 0 0 1.6em;
    &:first-of-type {
    position: relative;
      &::before {
        content: '';
        display: block;
        border: .5px solid var(--gray);
        width: 95%;
        position: absolute;
        top: .3em;
        left: 0;
        right: 0;
        margin: 0 auto;
      }
    }
    &:nth-of-type(2) {
      padding-top: 0.5em;
      font-size: 0.8em;
    }
    & .text-inner:nth-of-type(2) .text-text {
      font-size: 0.8em;
    }
  }
}
.table .thead th:first-of-type {
  width: 8em;
}
.table .tbody .tr:nth-of-type(1) .td {
  padding-top: 1em;
}
.table .tbody .tr:nth-of-type(2) .td {
  padding-top: 0;
}
.table .tbody td:nth-of-type(5),
.table .tbody td:nth-of-type(8) {
  color: var(--brown);
}
.table .tbody td {
  position: relative;
}
.td.open span {
  border: 1.5px solid var(--brown);
  border-radius: 50%;
  display: inline-block;
  width: 1em;
  height: 1em;
}
@media screen and (min-width: 576px) {
  .table td {
    padding: 1em .5em .5em .5em;
  }
  .table-box {
    padding: 1em 2em 0;
    & .box-inner {
      top: -2em;
    }
    & .text-box {
        padding: 1.5em 0 0 2em;
    }
  }
}
@media screen and (min-width: 768px) {
  .table th,
  .table td {
    padding: 1em;
  }
  .table tr:first-of-type td {
    padding-top: 1.6em;
  }
  .table .thead th:first-of-type {
    width: 12em;
  }
  .table .tbody .tr:nth-of-type(2) .td {
    padding-top: .5em;
  }
  .table-box {
    width: 100%;
    margin: 3em 0 0 0;
    & .text-box {
        padding: 2em 2em 0em 3em;
      &:nth-of-type(2) {
        padding-left: 3em;
      }
    }
    & .box-inner {
      top: -2.5em;
    }
  }
  .table-box .text-box {
    width: 95%;
    margin: 0 auto;
  }
  .table-box .text-box .text-inner:first-of-type {
    display: flex;
    & .text-text:nth-of-type(2) {
      margin-left: auto;
      position: relative;
      &::before {
        content: "\f005";
        color: var(--brown);
        font: var(--fa-font-solid);
        position: absolute;
        top: .45em;
        left: -1.3em;
      }
    }
  }
}
@media screen and (min-width: 992px) {
  .table {
    width: 90%;
    & .table-box {
      & .box-inner {
        top: 3em;
      }
    }
  }
  .table .tbody {
    & .tr:nth-of-type(1) .td {
      padding: 2em 1.4em 1.4em 1.4em;
    & .tr:nth-of-type(2) .td {
      padding: .5em 1.4em 1.4em 1.4em;
      }
    }
  }
  .table-box {
    padding: 1em 3em 0;
  }
  .table-box .text-box {
    width: 90%;
    margin: 0 auto;
    &::before {
      top: 1.1em;
    }
  }
  .table-box .text-box:first-of-type::before {
    width: 100%;
 }
}

/* table .footer-診療時間の装飾*/
.footer .table-box {
  margin: 3em 0 2em;
}
@media screen and (min-width: 768px) {
	.footer .table-box {
	    margin: 0;
	    padding: 0em 1em;
	    & .box-inner {
	      top: -1em;
	    }
	    & .table th {
	      padding: .5em;
	    }
	    & .table td {
	      padding: .6em .3em .3em .3em;
	      }
	    & .text-box {
	      padding: 1.5em 1em 0 2em;
	    }
	  }
	  .footer .table .thead th:first-of-type {
	    width: 10em;
	  }
  }
  @media screen and (min-width: 992px) {
  	.footer .table-box {
    & .table td {
        padding: 1em;
    }
    .table .tbody {
      & .tr:nth-of-type(1) .td {
          padding: 1em 1em 0 1em;
      }
    }
  }
}

/* btn */
.btn-btn {
  & .btn-inner {
    width: 100%;
    height: 100%;
  }
}

/*
 .home #id-mainvisual
*/
.mainvisual-heading {
  margin-block: 0;
}
#id-mainvisual.article {
  margin: 0 0 2em;
}
.main-img {
  width: 100vw;
  margin: 0 calc(50% - 50vw);
}
.mainvisual {
  position: relative;
  z-index: -2;
}
.mainvisual-heading .heading-inner {
  position: absolute;
  top: 1.1em;
  width: 49%;
}
.mainvisual+.text-box .text-text {
  font-size: 0.7em;
  text-align: right;
  margin-top: 3.5em;
}
#id-mainvisual .article-body .box {
  display: flex;
  flex-direction: column;
  position: relative;
  right: 0;
  /* margin-left: auto; */
  top: -5em;
  & .box-inner:nth-of-type(2) p {
    text-align: center;
    line-height: 1.6;
    font-size: 1em;
  }
}
#id-mainvisual .article-body ul.list {
  display: flex;
  gap: .5em;
}
#id-mainvisual .article-body .box .box-inner {
  text-align: center;
  margin: 0 auto;
}

@media screen and (min-width: 576px) {
  #id-mainvisual.article {
    margin: 0 0 -2em;
  }
  .home .main::before {
    content: '';
    background-image: url(../img/back_firstview.webp);
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    width: 87%;
    height: 100%;
    margin-top: -9%;
    margin-left: -12em;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -3;
  }
  .main-img {
    width: calc(100vw - 10%);
    margin-left: 16%;
  }
  .mainvisual-heading {
    & .heading-inner {
      top: 1.5em;
      width: 44%;
    }
  }
  #id-mainvisual .article-body .box {
    width: 32em;
    margin-left: auto;
    top: -8em;
    & .box-inner:nth-of-type(2) p {
      text-align: center;
    }
  }
  .mainvisual+.text-box .text-text {
    font-size: 1em;
    text-align: right;
    margin-top: 5.5em;
  }
  .br {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .home .main::before {
    width: 60%;
    margin-left: -1.5em;
    margin-top: -13%;
  }
  .mainvisual-heading {
    & .heading-inner {
      top: 6em;
    }
  }
  .mainvisual+.text-box .text-text {
    font-size: .9em;
    margin-top: 5.5em;
  }
  #id-mainvisual .article-body .box {
    width: 31em;
    top: -7em;
    & .box-inner:nth-of-type(2) p {
      font-size: .9em;
    }
  }
}
@media screen and (min-width: 992px) {
  #id-mainvisual.article {
    margin: 0 0 -3em;
  }
  .home .main::before {
    width: 57.5%;
    margin-top: -16%;
  }
  .mainvisual-heading {
    & .heading-inner {
      width: 41%;
      top: 6em;
      left: 3em;
    }
  }
  .mainvisual+.text-box .text-text {
    font-size: 1.05em;
  }
  #id-mainvisual .article-body .box {
    width: 35em;
    margin-right: 2em;
    & .box-inner:nth-of-type(2) p {
      font-size: 1em;
    }
  }
}
@media screen and (min-width: 1024px) {
  .mainvisual+.text-box .text-text {
    font-size: 1.1em;
    margin-top: 4.5em;
  }
}
@media screen and (min-width: 1200px) {
  .home .main::before {
    width: 57%;
    margin-top: -23%;
    margin-left: -1.5em;
  }
  .main-img {
    width: calc(100vw - 17%);
    margin-left: 15%;
  }
  .mainvisual-heading {
    & .heading-inner {
      width: 47%;
      top: 6em;
      }
    }
  #id-mainvisual .article-body .box {
    width: 38em;
    margin-right: -1em;
  }
  .mainvisual-heading .heading-inner {
    left: -1em;
  }
}
@media screen and (min-width: 1300px) {
  .home .main::before {
    width: 56%;
    margin-top: -25%;
  }
  .main-img {
    width: calc(100vw - 20%);
    margin-left: 11%;
  }
}
@media screen and (min-width: 1400px) {
  #id-mainvisual.article {
    margin: 0 0 -4.5em;
  }
  .home .main::before {
    width: 61%;
    margin-top: -37.5%;
    margin-left: -7%;
  }
  .main-img {
    width: calc(100vw - 22%);
    margin-left: 8%;
  }
  .mainvisual-heading {
    & .heading-inner {
      width: 52%;
      top: 7em;
      left: -6em;
    }
  }
  .sub-copy .img-img {
    right: -5em;
  }
  #id-mainvisual .article-body .box {
    width: 43em;
    margin-right: -5.5em;
    top: -10em;
    & .box-inner:nth-of-type(2) p {
      font-size: 1.2em;
    }
  }
}
@media screen and (min-width: 1500px) {
  .home .main::before {
    width: 61%;
    margin-top: -41%;
    margin-left: -7.5%;
  }
  .main-img {
    width: calc(100vw - 25%);
  }
}
@media screen and (min-width: 1600px) {
  .home .main::before {
    width: 55%;
  }
  .main-img {
    width: calc(100vw - 30%);
    margin-left: 3%;
  }
  #id-mainvisual .article-body .box {
    width: 47em;
    margin-left: 24em;
    top: -10em;
    & .box-inner:nth-of-type(2) p {
      font-size: 1.3em;
    }
  }
  .mainvisual-heading .heading-inner {
    width: 58%;
    left: -9em;
  }
}
@media screen and (min-width: 1800px) {
  .home .main::before {
    width: 53%;
  }
  .main-img {
    width: calc(100vw - 39%);
    margin-left: -1%;
  }
  #id-mainvisual .article-body .box {
    width: 51em;
    margin-left: 22em;
  }
  .mainvisual-heading .heading-inner {
    width: 60%;
    top: 9em;
    left: -12em;
  }
}

/*
 .home #id-message
*/
#id-message {
  position: relative;
  & .article {
    margin: 0 0 2em;
    }
  & .article-inner {
    padding-top: 1.5em;
  }
  & .article-heading {
    text-align: left;
    position: absolute;
    top: -20em;
  }
  & .heading-inner {
    text-align: left;
  }
}
@media screen and (min-width: 390px) {
  #id-message {
  & .article-heading {
    top: -23.5em;
    }
  }
}
#id-message .btn-btn {
  & .btn-inner {
    text-align: center;
  }
  & .text-link {
    border: .8px solid var(--text-color);
    border-radius: 4px;
    text-align: center;
    font-weight: 300;
    padding: .8em 2.5em .8em 1em;
  }
  & .text-link {
    position: relative;
    &::before,
    &::after {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      right: 1em;
      width: 7px;
      height: 1px;
      margin: auto 0;
      border-radius: 9999px;
      background-color: var(--text-color);
      transform-origin: calc(100% - 0.5px) 50%;
    }
  }
}
.text-link::before {
  transform: rotate(45deg);
}
.text-link::after  {
  transform: rotate(-45deg);
}
#id-message .item-box {
  & .text-box p {
    padding-bottom: 2em;
  }
}
@media screen and (min-width: 576px) {
  #id-message .article {
   margin: 0 0 4em;
  }
  #id-message .article-inner {
    padding-top: 0;
  }
  #id-message .item-box {
    margin-top: 1em;
    display: flex;
    gap: 2.5em;
    align-items: center;
    & .article-heading {
      padding: 0 0 1em;
      position: unset;
    }
  #id-message .item-box .text-box {
    & p {
      margin-top: 0;
      padding-bottom: 1em;
      }
    }
  }
  #id-message .btn-btn {
    & .btn-inner {
      text-align: left;
    }
  }
  #id-message .item-box .img-box{
    & .img-img {
      width: 24em;
    }
  }
  #id-message .i-block {
    white-space: unset;
  }
}
@media screen and (min-width: 768px) {
  #id-message .item-box {
    gap: 3em;
    align-items: center;
    & .text-box p {
      padding-bottom: 1em;
    }
  }
  #id-message .item-box .img-box {
    & .img-img {
        width: auto;
    }
  }
  #id-message .btn-btn .btn-inner:hover .text-link {
    background-color: #b1a8a8;
    color: white;
    border: unset;
    &::before,
    &::after {
      background-color: var(--white);
    }
  }
  #id-message .i-block {
    white-space: nowrap;
  }
}
@media screen and (min-width: 992px) {
  #id-message .item-box {
    gap: 3em;
    align-items: center;
    justify-content: center;
    & > .box-inner:nth-of-type(1) {
      width: 50%;
    }
    & .article-body {
      width: 40%;
    }
    & .text-box p {
      padding-bottom: 2em;
    }
    & .article-heading {
      padding-bottom: 2em;
    }
  }
}

/*
 .home #id-info
*/
#id-info.article {
  margin: 0;
}
#id-info .article-body {
  padding: .1em 0 3em;
  position: relative;
  &::before {
    content: '';
    background-image: url(../img/back_info.webp);
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    width: 100vw;
    height: 100%;
    margin: 0 calc(50% - 50vw);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -3;
  }
}
@media screen and (min-width: 992px) {
  #id-info .article-body {
    padding: 2em 0 4em;
  }
}

/*
 .home #id-reservation
*/
#id-reservation {
  padding: 2.5em 0;
  &.article {
    margin: 0;
  }
}
#id-reservation .contact {
  padding: 1em 0 2em;
  display: flex;
  justify-content: center;
  gap: .5em;
  a {
    border-radius: 9px;
    box-shadow: 0 2px 3px #dddddd;
    font-weight: 600;
    padding: .7em;
  }
  & .contact-inner {
    width: 50%;
    max-width: 14em;
  }
  & .tel-num .link-inner {
    gap: .4em;
    padding-left: .5em;
  }
  & .link-inner {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
  }
    & p {
      margin: 0;
    }
}
#id-reservation .text-box {
  display: flex;
  justify-content: center;
}
#id-reservation ul.kome {
  display: flex;
  justify-content: center;
  flex-direction: column;
  & .list-inner {
    text-align: left;
  }
}
@media screen and (min-width: 375px) {
  #id-reservation .contact {
    gap: 1em;
  }
}
#id-reservation .article-body .text-box {
  &:nth-of-type(2) .text-text {
    padding: .5em 0 0 0;
  }
  & .text-text {
    font-size: 0.9em;
    text-align: center;
  }
}
#id-reservation {
  position: relative;
  &::before,
  &::after {
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    width: 100vw;
    height: 100%;
    margin: 0 calc(50% - 50vw);
    position: absolute;
    top: 0;
    z-index: -3;
  }
  &::before {
    background-image: url(../img/back_reservation_left.webp);
    left: 0;
  }
  &::after {
    background-image: url(../img/back_reservation_right.webp);
    background-position: right;
    right: 0;
  }
}
@media screen and (min-width: 576px) {
  #id-reservation {
    padding: 5.5em 0;
  }
  #id-reservation.article {
    margin: 0;
  }
}
@media screen and (min-width: 768px) {
  #id-reservation {
    padding: 7.5em 0;
  }
}
@media screen and (min-width: 992px) {
  #id-reservation {
    padding: 9.5em 0;
  }
}

/*
 .home #id-access
*/
#id-access {
  position: relative;
  &::before {
    content: '';
    background-image: url(../img/back_access.webp);
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    width: 100vw;
    height: 100%;
    margin: 0 calc(50% - 50vw);
    position: absolute;
    top: 0;
    left: 21em;
    opacity: .7;
    z-index: -3;
  }
}
#id-access.article {
  margin-bottom: 9em;
}
#id-access .article-inner {
  position: relative;
  padding: 2em 0 0;
  & .item-box .box-box {
    position: absolute;
    bottom: -11em;
  }
}
#id-access header + .text-box {
  & .text-text {
    text-align: center;
  }
}
.map-map .map-inner {
  width: 100%;
  height: 24em;
}
#id-access .text-address {
  margin-top: 0;
  & a {
    background-color: var(--pink-beige);
    position: relative;
    width: 100%;
    height: auto;
    max-width: 25em;
    padding: .5em .5em .5em 4em;
    text-align: left;
    line-height: 1.5;
    &::before,
    &::after {
      display: inline-block;
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto 0;
      width: 2em;
      height: 2em;
    }
    &::before {
      content: '';
      background-color: #fff;
      border-radius: 50%;
      left: 1em;
      }
    &::after {
      content:'\f3c5';
      color: var(--light-orange);
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      left: 1.6em;
      top: .5em;
    }
  }
}
#id-access .text-address,
#id-access .text-address::before {
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 576px) {
  #id-access {
    &::before {
      left: 28em;
    }
  }
  #id-access.article {
    margin-bottom: 9em;
  }
  #id-access .map-map {
    & .map-inner {
      width: 100%;
      height: 23em;
    }
    & .text-address a {
      padding: .7em .7em .7em 4em;
    }
  }
  #id-access .article-inner {
    & .item-box .box-box {
      bottom: -9.5em;;
    }
  }
}
@media screen and (min-width: 768px) {
  #id-access {
    &::before {
        left: 24em;
      }
    }
  #id-access.article {
    margin-bottom: 0;
    & .article-inner {
      padding: 3em 0;
    }
  }
  #id-access .item-box {
    display: flex;
    justify-content: space-between;
    gap: 3em;
    align-items: center;
    & > .box-inner {
      width: 50%;
    }
    & .text-address {
      margin: 2em 0;
      justify-content: left;
    }
    & .box-box {
      position: unset;
    }
  }
  #id-access header + .text-box {
    & .text-text {
      text-align: left;
    }
  }
  #id-access .article-inner .item-box .box-box {
    position: unset;
  }
}
@media screen and (min-width: 992px) {
  #id-access {
    &::before {
        left: 29em;
    }
  }
  #id-access.article {
    margin-bottom: 0;
    & .article-inner {
      padding: 4.5em 0;
    }
  }
}
@media screen and (min-width: 1200px) {
  #id-access {
    &::before {
        left: 34em;
    }
  }
}
@media screen and (min-width: 1400px) {
  #id-access {
      &::before {
          left: 43em;
      }
  }
}
@media screen and (min-width: 1600px) {
  #id-access {
    &::before {
        left: 59em;
    }
  }
}


/*
 .clinic
*/
#id-clinic.article {
  /* margin: 0; */
}
#id-clinic .article-inner {
  padding: 2em;
}
#id-clinic .article-inner {
  &::before {
    content: '';
    background-image: url(../img/back_yellow.webp);
    background-size: cover;
    background-repeat: no-repeat;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: .4;
    z-index: -3;
  }
}
#id-clinic .article-inner .text-box {
  background-color: white;
  padding: 1em;
}
#id-features .img-box {
  padding: 2em 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: .8em  ;
  & .img-img {
    width: calc((100% - (.8em * 1)) / 2);
  }
}
.clinic .text-box_styleA {
  margin: 2em 1em;
}
@media screen and (min-width: 768px) {
  #id-features .article-body .text-box_styleB {
    text-align: center;
  }
  #id-clinic .article-inner .text-box {
    padding: 1em 2em 2em;
  }
  #id-features .img-box {
    gap: 1.5em  ;
    & .img-img {
      width: calc((100% - (1.5em * 3)) / 4);
    }
  }
  .clinic .text-box_styleA {
    margin: 6em;
  }
}

/*
 .profile
*/
#id-profile .article-body {
  margin: 2em 0;
  & .body-inner {
    margin-bottom: 2em;
  }
}
#id-profile .body-inner {
  & p {
    margin: 0;
  }
  & .line-1st {
    font-weight: 300;
  }
  & .line-2nd {
    & .lang-ja {
      color: #c98f81;
      font-size: 1.5em;
      margin-bottom: .5em;
    }
    & .lang-en {
      color: #c088657a;
      font-size: .9em;
      font-family: 'Noto Sans JP';
      font-weight: 700;
      letter-spacing: .1em;
      margin-left: .3em;
      position: relative;
      top: 0.1em;
    }
  }
}
#id-profile .text-box {
  line-height: 1.3;
  margin-bottom: .2em;
}
#id-profile .article-body .box.sikaku {
  margin: 1em 0;
}
#id-profile .article-body .list {
  & .list-inner {
    padding: .5em 0em 0 1em;
  }
}
@media screen and (min-width: 576px) {
  #id-profile .dl-inner {
    display: flex;
    gap: 1em;
    align-items: flex-start;
  }
  #id-profile .dt-inner {
    width: 7em;
  }
}
@media screen and (min-width: 768px) {
  #id-profile.article {
    margin-bottom: 0;
  }
  #id-profile .item-box {
    display: flex;
    gap: 2em;
  }
  #id-profile .item-box .box-inner:nth-of-type(1) {
    width: 45%;
  }
  #id-profile .item-box .box-inner:nth-of-type(2) {
    width: 55%;
  }
  #id-profile .article-body .box.sikaku {
    margin: 0 0 1em 0;
  }
}

/*
 .naika
*/
.naika .article-metaheader.article {
  & .article-header {
    & .lang-jp > span:nth-of-type(3) {
      padding-left: 0.2em;
    }
  }
}
.naika .article-metaheader .img-box {
  & .img-img img {
    object-position: 100%;
  }
}
.naika .text-box.emergency {
margin-bottom: 8em;
  .text-text{
    text-align: center;
    & > span {
      position: relative;
      padding-left: 1.15em;
      /* padding-left: 1em; */
      display: inline-block;
    }
  }
}
.naika .emergency .img-box {
  display: flex;
  gap: .5em;
  flex-wrap: wrap;
  width: 100%;
  padding: 2em 0 0;
  margin: 0 auto;
}
.naika .emergency .img-box .img-img {
  width: calc((100% - (.5em * 2)) / 3);
}

.naika .emergency .img-box .box-inner {
  background-color: white;
  display: flex;
  gap: .8em;
  width: 80%;
  padding: 1em;
  margin: 0 auto;
}
.naika .text-box_styleB {
  &::before {
    background-image: url(../img/back_03.webp);
    opacity: .8;
  }
  & .box-inner {
    padding: 2em 1em;
  }
}

.naika .text-box_styleB {
  &::after {
    background-image: unset;
  }
}


@media screen and (min-width: 768px) {
  .naika .box_styleA ul.list {
    gap: 2em;
  }
  .naika .box_styleA ul.list .list-inner {
    width: calc((100% - (2em * 1)) / 2);
  }
  .naika .article-naika .box_styleA ul.list .list-inner {
    width: calc((100% - (2em * 1)) / 2);
  }
  .naika .emergency .img-box {
    width: 70%;
    gap: 1em;
  }
  .naika .emergency .img-box .img-img {
    width: calc((100% - (1em * 2)) / 3);
  }
}

/*
 .kampo
*/
.kampo .article-metaheader .img-box {
  & .img-img img {
    object-position: 80% 90%;
  }
}
.article-sick .box {
  margin-top: 4em;
  &:first-of-type {
    margin-top: 1em;
  }
  & .box-header {
    & .heading-inner {
      border-bottom: .5px solid brown;
      background-color: white;
      font-size: 1.1em;
      font-weight: 300;
      letter-spacing: .05em;
      padding: 1em;
      margin-bottom: 1em;
      display: block;
      position: relative;
      &::before {
        content: '';
        background-color: var(--orange);
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        display: block;
        width: 4px;
        height: 48%;
        margin: auto 0;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
      }
    }
  }
}
.article-sick .table-box {
  border: .5px solid brown;
  padding: 0;
}
.article-sick .table {
  width: 100%;
  & .th {
    border-bottom: .5px solid brown;
    border-right: .5px solid brown;
    font-weight: 500;
    color: #9A5B5B;;
    background-color: #FAF1F4;
    width: 40%;
    height: 6.5em;
  }
  & .td {
    border-bottom: .5px solid brown;
    background-color: #fff;
    text-align: left;
    width: 70%;
  }
}
.article-sick .table .tr:last-of-type .th,
.article-sick .table .tr:last-of-type .td {
  border-bottom: unset;
}
@media screen and (max-width:575px) {
  .article-sick .table .tr:last-of-type .th {
    border-bottom: .5px solid brown;
  }
}
.article-sick .table .tbody .tr .td {
  padding: 1em;
}
.article-sick .table ul.list {
  margin: 0;
}
.kampo .aside .menu,
.fujin .aside .menu  {
  background-color: #faf1f4;
  padding: 1.5em 1em;
  margin-bottom: 3em;
  display: flex;
  flex-wrap: wrap;
  gap: .6em;
  & .menu-inner {
    width: calc((100% - (.6em * 1)) / 2);
    a:hover {
      color: var(--pink);
    }
  }
  & .text-link {
    background-color: var(--white);
    border-radius: 5px;
    display: block;
    padding: .3em 1.5em .3em .5em;
    position: relative;
    &::before {
      position: absolute;
      content: '';
      display: inline-block;
      width: 13px;
      height: 8px;
      background: #ee774d;
      clip-path: polygon(0 0, 100% 0%, 50% 100%);
      top: 0;
      right: .3em;
      bottom: 0;
      margin: auto 0;
      transform: unset;
    }
  }
  & .link-inner .text-text {
    display: block;
    font-size: .8em;
    /* letter-spacing: .175em; */
    display: block;
    /* padding-left: .175em; */
  }
}
@media screen and (min-width: 576px) {
  .kampo .aside .menu,
  .fujin .aside .menu {
    & .menu-inner {
      width: calc((100% - (.6em * 3)) / 4);
    }
    & .link-inner .text-text {
      font-size: .7em;
    }
  }
}
@media screen and (min-width: 768px) {
  .kampo .aside .menu,
  .fujin .aside .menu {
    & .menu-inner {
        width: calc((100% - (.6em * 4)) / 5);
    }
    & .link-inner .text-text {
      /* letter-spacing: .175em;  */
      display: block;
      /* padding-left: .175em; */
      font-size: .7em;
    }
  }
}
@media screen and (min-width: 992px) {
  .kampo .aside .menu,
  .fujin .aside .menu {
    padding: 1.5em 2em;
    & .link-inner .text-text {
      font-size: 0.8em;
      letter-spacing: .06em;
    }
  }
  .kampo .aside .menu {
    & .menu-inner {
      width: calc((100% - (.6em * 5)) / 6);
    }
  }
}
@media screen and (max-width: 575px) {
  .article-sick .table {
    & .th {
      border-right: unset;
      border-bottom: .5px solid brown;
      width: 100%;
      height: unset;
      padding: 1em;
      display: block;
    }
    & .td {
      width: 100%;
      display: block;
    }
  }
}
.fujin .td.sp-only {
  display: block;
  @media screen and (min-width: 576px) {
    display: none;
  }
}

/*
 .fujin
 */
.fujin .text-box_styleB {
  & .box-inner {
    text-align: left;
  }
}
.fujin .article-sick .table {
  & th[colspan="2"] {
    color: #a43b3b;
    background-color: #e7d8e0;
    border-right: unset;
    border-bottom: .5px solid brown;
  }
}
.fujin #id-seiri_sikyu tr:nth-of-type(2),
.fujin #id-seiri_sikyu tr:nth-of-type(3),
.fujin #id-seiri_sikyu tr:nth-of-type(4) {
  & .th {
    line-height: 1.3;
  }
  & .sub-text {
    line-height: 1.2;
    & .fz-small {
    color: #a18b8c;
    font-weight: 400;
    }
  }
}
.fujin .article-sick {
  & .table-box + p {
    text-align: right;
    padding-top: .3em;
    margin: 0;
  }
}
@media screen and (min-width: 768px) {
  .fujin .text-box_styleB {
    & .box-inner {
      text-align: center;
    }
  }
  .fujin .article-sick #id-kansensho .table {
    & .th {
      height: 4.5em;
      }
    }
  .fujin .article-sick .table .tbody {
    & .tr {
      height: 4.5em;
    }
  }
}
