/*------------------------------------------------------------------------------ 
  Base
------------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
  line-height: 1.6; }

*,
*:after,
*:before {
  box-sizing: border-box; }

body {
  background: #f7efeb;
  color: #1a120f;
  font-family: "Noto Sans JP", sans-serif;
  font-size: clamp(15px, 2vw, 18px);
  letter-spacing: .05em;
  margin: 0; }

.en {
  font-family: "Playfair Display", serif; }

a {
  color: #1a120f;
  text-decoration: none;
  transition: .3s; }
  a:hover {
    opacity: .8; }

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500; }

h1 {
  font-size: clamp(25px, 3vw, 30px); }

h2 {
  font-size: clamp(23px, 3vw, 28px); }

h3 {
  font-size: clamp(20px, 3vw, 25px); }

h4 {
  font-size: clamp(19px, 2vw, 21px); }

h5 {
  font-size: clamp(17px, 2vw, 19px); }

h6 {
  font-size: clamp(15px, 2vw, 18px); }

.uppercase {
  text-transform: uppercase; }

ul,
ol {
  font-size: clamp(15px, 2vw, 18px);
  margin: clamp(25px, 3vw, 35px) 0;
  padding-left: clamp(20px, 3vw, 40px); }

.in-bl {
  display: inline-block; }

img {
  height: auto;
  max-width: 100%;
  vertical-align: bottom; }

.container {
  background: #fff;
  padding: 0 20px; }
  @media screen and (min-width: 768px) {
    .container {
      margin: 0 auto;
      padding: 0;
      width: 90%; } }

@media screen and (min-width: 1025px) {
  .sp {
    display: none; } }

@media screen and (max-width: 1024px) {
  .pc {
    display: none !important; } }

.grecaptcha-badge {
  visibility: hidden; }

/*------------------------------------------------------------------------------ 
  Common
------------------------------------------------------------------------------*/
/* Flex
-----------------------------------------------------------*/
.flex {
  align-items: center;
  display: flex;
  flex-wrap: wrap; }

.between {
  justify-content: space-between; }

/* Pc Flex
-----------------------------------------------------------*/
@media screen and (min-width: 1025px) {
  .pc-flex {
    align-items: center;
    display: flex;
    flex-wrap: wrap; } }

@media screen and (min-width: 1025px) {
  .pc-between {
    justify-content: space-between; } }

@media screen and (min-width: 1025px) {
  .pc-around {
    justify-content: space-around; } }

/* Background
-----------------------------------------------------------*/
.bg {
  background: #fff;
  margin: clamp(30px, 4vw, 50px) auto;
  padding: clamp(40px, 6vw, 60px) clamp(30px, 5vw, 70px); }

/* Button
-----------------------------------------------------------*/
.btn {
  font-size: clamp(18px, 2vw, 20px);
  margin: clamp(20px, 3vw, 40px) auto; }
  .btn a {
    background: #fff;
    border: 2px solid #ea5413 !important;
    display: block;
    font-weight: 500;
    padding: 20px !important;
    text-align: center; }
    .btn a:hover {
      background: #ea5413 !important;
      color: #fff !important;
      opacity: 1; }

.link-btn {
  margin-top: clamp(40px, 6vw, 60px);
  width: 100%; }
  @media screen and (min-width: 768px) {
    .link-btn {
      max-width: 400px;
      width: 60%; } }
  .link-btn .en {
    font-size: clamp(22px, 2vw, 25px); }

/* News
-----------------------------------------------------------*/
#news .news {
  align-items: flex-start;
  row-gap: 25px; }
  #news .news article {
    width: 46%; }
    @media screen and (min-width: 1025px) {
      #news .news article {
        width: 22%; } }
    #news .news article .thumb img {
      aspect-ratio: 4 / 3;
      object-fit: cover; }
    #news .news article time {
      display: block;
      font-size: clamp(14px, 2vw, 16px);
      margin: 10px 0; }
    #news .news article .news-ttl {
      font-size: clamp(15px, 2vw, 16px);
      font-weight: 400; }

time,
.cat {
  font-size: 16px; }

.cat {
  border: 2px solid #ea5413;
  padding: 8px 5px;
  text-align: center; }

/* Button
-----------------------------------------------------------*/
.line-qr {
  text-align: center; }
  .line-qr img {
    width: clamp(150px, 20vw, 200px); }

/* Table
-----------------------------------------------------------*/
.wp-block-table {
  margin: clamp(45px, 5vw, 60px) 0; }
  .wp-block-table table {
    border-collapse: collapse; }
    .wp-block-table table td {
      padding: 15px; }
      @media screen and (max-width: 767px) {
        .wp-block-table table td {
          display: block; } }
      @media screen and (min-width: 768px) {
        .wp-block-table table td {
          padding: 20px; } }

@media screen and (max-width: 767px) {
  .is-style-regular table {
    border-bottom: 1px solid #73706f; } }
.is-style-regular table td {
  border: 1px solid #73706f; }
  @media screen and (max-width: 767px) {
    .is-style-regular table td {
      border-bottom: none; } }

@media screen and (max-width: 1024px) {
  .is-style-stripes tr td:nth-of-type(odd) {
    border-bottom: 1px solid #9e9996; } }

/* Contact Form
-----------------------------------------------------------*/
.wpcf7 {
  margin: 70px auto 0; }
  .wpcf7 label {
    display: block;
    margin: 0 auto clamp(25px, 3vw, 30px); }
    @media screen and (min-width: 768px) {
      .wpcf7 label {
        max-width: 650px;
        width: 80%; } }
  .wpcf7 .wpcf7-form-control-wrap {
    display: block;
    text-align: center; }
    .wpcf7 .wpcf7-form-control-wrap input.wpcf7-form-control.wpcf7-text,
    .wpcf7 .wpcf7-form-control-wrap textarea.wpcf7-form-control.wpcf7-textarea {
      border: 1px solid #1a120f;
      margin-top: clamp(5px, 2vw, 10px);
      padding: 10px;
      width: 100%; }
  .wpcf7 textarea {
    height: 120px; }
    @media screen and (min-width: 768px) {
      .wpcf7 textarea {
        height: 250px; } }
  .wpcf7 p {
    margin: 40px 0 8px; }
  .wpcf7 .wpcf7-radio {
    display: block;
    margin-bottom: 40px; }
    .wpcf7 .wpcf7-radio .wpcf7-list-item {
      margin-top: 7px; }
  .wpcf7 input[type="checkbox"] {
    height: 20px;
    vertical-align: -3px;
    width: 25px; }
  .wpcf7 input.wpcf7-submit {
    background: #fff;
    border: 3px solid #ea5413;
    color: #1a120f;
    cursor: pointer;
    font-size: clamp(18px, 2vw, 20px);
    font-weight: bold;
    letter-spacing: 10px;
    padding: 20px 0;
    transition: .3s;
    width: 100%; }
    @media screen and (min-width: 768px) {
      .wpcf7 input.wpcf7-submit {
        display: block;
        margin: auto;
        max-width: 500px;
        width: 70%; } }
    .wpcf7 input.wpcf7-submit:hover {
      background: #ea5413;
      color: #fff; }
  .wpcf7 .recaptcha a {
    font-size: 16px;
    font-weight: 500; }
  .wpcf7 .wpcf7-response-output {
    font-size: clamp(15px, 2vw, 18px); }

/*------------------------------------------------------------------------------- 
  Header
------------------------------------------------------------------------------*/
header {
  background: #fff; }
  header h1,
  header .logo {
    font-size: 2em;
    margin: 0;
    padding: 100px 20px;
    text-align: center; }
    header h1 img,
    header .logo img {
      width: clamp(340px, 60vw, 700px); }
  header #head-nav input[type="checkbox"] {
    display: none; }
  header #head-nav input[type="checkbox"]:checked ~ .line:after {
    opacity: 1;
    visibility: visible; }
  header #head-nav input[type="checkbox"]:checked ~ .line span {
    left: 50%;
    width: 30px; }
    header #head-nav input[type="checkbox"]:checked ~ .line span:first-of-type {
      top: 57%;
      transform: translate(-50%, -50%) rotate(-45deg); }
    header #head-nav input[type="checkbox"]:checked ~ .line span:last-of-type {
      top: 57%;
      transform: translate(-50%, -50%) rotate(45deg); }
  header #head-nav input[type="checkbox"]:checked ~ #nav {
    opacity: 1;
    visibility: visible; }
  header #head-nav .line {
    height: 65px;
    position: fixed;
    right: 0;
    top: 0;
    width: 75px;
    z-index: 100; }
    @media screen and (min-width: 1025px) {
      header #head-nav .line {
        display: none; } }
    header #head-nav .line span {
      background: #1a120f;
      display: block;
      height: 2px;
      left: 25%;
      position: absolute;
      transition: .2s;
      width: 35px; }
      header #head-nav .line span:first-of-type {
        top: 40%; }
      header #head-nav .line span:last-of-type {
        bottom: 40%; }
    header #head-nav .line:after {
      content: '';
      height: 65px;
      opacity: 0;
      position: absolute;
      right: 5px;
      top: 5px;
      transition: .3s;
      visibility: hidden;
      width: 65px; }
  header #head-nav #nav {
    font-size: 30px;
    list-style: none;
    margin: 0;
    padding: 0; }
    @media screen and (max-width: 1024px) {
      header #head-nav #nav {
        background: #fff;
        left: 0;
        height: 100vh;
        opacity: 0;
        overflow-x: hidden;
        overflow-y: scroll;
        padding: 70px 20px 10px;
        position: fixed;
        top: 0;
        transition: .3s;
        visibility: hidden;
        width: 100%;
        z-index: 99; } }
    @media screen and (min-width: 1025px) {
      header #head-nav #nav {
        font-size: 28px;
        margin: auto;
        max-width: 1500px; } }
    header #head-nav #nav li {
      padding: 25px 15px; }
    header #head-nav #nav .sp {
      font-size: 28px; }
      header #head-nav #nav .sp .uppercase {
        font-size: 18px; }

/*------------------------------------------------------------------------------- 
  Front Page
------------------------------------------------------------------------------*/
#front-page {
  padding: clamp(40px, 6vw, 65px) 0; }
  #front-page h2 {
    font-size: clamp(35px, 4vw, 45px);
    margin: 0 0 clamp(40px, 6vw, 60px);
    text-align: center; }
  #front-page #tel {
    max-width: 600px;
    text-align: center; }
    @media screen and (min-width: 768px) {
      #front-page #tel {
        width: 50%; } }
    #front-page #tel p {
      font-size: clamp(25px, 3vw, 30px);
      font-weight: 600;
      margin: 0; }
      #front-page #tel p a {
        border: 2px solid #ea5413;
        display: inline-block;
        font-size: clamp(22px, 2vw, 25px);
        font-weight: 400;
        margin-top: 10px;
        padding: 10px 40px; }
  #front-page #menu .course {
    font-size: clamp(16px, 2vw, 18px);
    row-gap: clamp(20px, 2.5vw, 35px);
    margin-bottom: clamp(50px, 7vw, 90px); }
    #front-page #menu .course .wp-block-button {
      width: 100%; }
      @media screen and (min-width: 600px) {
        #front-page #menu .course .wp-block-button {
          width: 48%; } }
      @media screen and (min-width: 1025px) {
        #front-page #menu .course .wp-block-button {
          width: 32%; } }
      #front-page #menu .course .wp-block-button a {
        border: 2px solid #9e9996;
        font-weight: 400;
        padding: clamp(20px, 2vw, 25px) 10px;
        width: 100%; }
  @media screen and (min-width: 1025px) {
    #front-page #shop-info .inner {
      margin: auto;
      max-width: 1000px;
      width: 95%; } }
  #front-page #shop-info .inner .wp-block-table td:first-of-type {
    background: #f7f6f5;
    font-weight: 500; }
    @media screen and (min-width: 768px) {
      #front-page #shop-info .inner .wp-block-table td:first-of-type {
        text-align: center;
        width: 30%; } }
  #front-page #shop-info .inner .map {
    height: 0;
    margin-top: clamp(35px, 5vw, 50px);
    padding-top: 70%;
    position: relative; }
    @media screen and (min-width: 600px) {
      #front-page #shop-info .inner .map {
        padding-top: 35%; } }
    @media screen and (min-width: 1025px) {
      #front-page #shop-info .inner .map {
        height: 350px;
        padding-top: 0; } }
    #front-page #shop-info .inner .map iframe {
      height: 95%;
      position: absolute;
      top: 0;
      width: 100%; }
  #front-page #contact .link-btn {
    margin-bottom: clamp(40px, 6vw, 60px); }
  @media screen and (min-width: 1025px) {
    #front-page #contact .wpcf7 {
      max-width: 920px;
      width: 75%; } }

/*------------------------------------------------------------------------------ 
  Sub Page
------------------------------------------------------------------------------*/
#sub {
  /* Block
  -----------------------------------------------------------*/
  /* Image
  -----------------------------------------------------------*/
  /* Index ----------------------------------------------------
  -----------------------------------------------------------*/
  /* Single ---------------------------------------------------
  -----------------------------------------------------------*/
  /* Page -----------------------------------------------------
  -----------------------------------------------------------*/ }
  #sub .post-cont {
    font-size: clamp(15px, 2vw, 18px); }
    #sub .post-cont ul li,
    #sub .post-cont ol li {
      margin-bottom: 10px; }
  #sub #news .cat,
  #sub #single .cat {
    padding: 0; }
    #sub #news .cat a,
    #sub #single .cat a {
      display: block;
      padding: 10px 15px; }
  #sub .wp-block-group {
    margin: clamp(55px, 7vw, 90px) 0; }
    #sub .wp-block-group .wp-block-gallery,
    #sub .wp-block-group .wp-block-columns {
      margin: clamp(20px, 4vw, 40px) 0; }
  #sub .wp-block-buttons {
    margin: clamp(40px, 5vw, 60px) 0; }
    #sub .wp-block-buttons .wp-block-button__link {
      font-size: clamp(16px, 2vw, 18px); }
    #sub .wp-block-buttons .wp-block-button.has-custom-font-size .wp-block-button__link {
      font-size: inherit; }
    #sub .wp-block-buttons .has-background {
      padding: 15px clamp(20px, 3vw, 40px) 12px; }
  #sub .has-background {
    padding: clamp(20px, 2vw, 25px) clamp(20px, 3vw, 40px) clamp(18px, 2vw, 20px); }
  #sub .wp-block-image {
    margin: clamp(25px, 4vw, 45px) 0; }
  #sub .wp-block-gallery {
    margin: clamp(40px, 7vw, 70px) 0; }
    #sub .wp-block-gallery .wp-block-image {
      margin: 0 0 15px; }
  #sub .wp-block-columns {
    gap: 0 1em;
    margin: clamp(40px, 7vw, 70px) 0; }
    #sub .wp-block-columns .wp-block-image {
      margin: 0 0 15px; }
  #sub .wp-block-media-text {
    margin: clamp(15px, 3vw, 30px) 0; }
    @media screen and (max-width: 599px) {
      #sub .wp-block-media-text .wp-block-media-text__content p {
        margin-top: 8px; } }
    #sub .wp-block-media-text .has-normal-font-size {
      font-size: clamp(15px, 2vw, 18px); }
  #sub .archive-ttl {
    color: #1a120f;
    font-size: clamp(30px, 4vw, 40px);
    font-weight: 600;
    margin: clamp(50px, 6vw, 65px) 0;
    text-align: center;
    text-transform: uppercase; }
  #sub .cat-ttl {
    font-size: clamp(25px, 3vw, 33px);
    font-weight: 500; }
  #sub #news article .cat a:hover {
    background: #ea5413;
    color: #fff; }
  #sub #news .pagination {
    margin-top: clamp(45px, 6vw, 65px);
    text-align: center; }
    #sub #news .pagination .screen-reader-text {
      clip: rect(1px, 1px, 1px, 1px);
      clip-path: inset(50%);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
      word-wrap: normal !important; }
    #sub #news .pagination .page-numbers {
      border: 1px solid #9e9996;
      display: inline-block;
      line-height: 1;
      margin: 10px 0 10px -5px;
      padding: 14px 0;
      width: 45px; }
      #sub #news .pagination .page-numbers:hover {
        background: #9e9996;
        color: #fff;
        opacity: 1; }
    #sub #news .pagination .current {
      background: #ea5413;
      border: 1px solid #ea5413;
      color: #fff;
      font-weight: 600;
      opacity: 1; }
      #sub #news .pagination .current:hover {
        background: #ea5413;
        color: #fff; }
    #sub #news .pagination .dots {
      border: none; }
      #sub #news .pagination .dots:hover {
        background: #fff;
        color: #1a120f; }
    #sub #news .pagination .next,
    #sub #news .pagination .prev {
      border: 1px solid #73706f; }
      #sub #news .pagination .next:hover,
      #sub #news .pagination .prev:hover {
        background: #9e9996;
        color: #fff; }
    #sub #news .pagination .next {
      margin-left: 20px; }
    #sub #news .pagination .prev {
      margin-right: 20px; }
  @media screen and (min-width: 768px) {
    #sub #single {
      max-width: 1200px;
      width: 85%; } }
  #sub #single time {
    margin-right: 20px; }
  #sub #single .cat {
    display: inline-block; }
    #sub #single .cat a:hover {
      background: #ea5413;
      color: #fff; }
  #sub #single .article-ttl {
    border-bottom: 1px solid #9e9996;
    margin: clamp(35px, 4vw, 45px) 0 clamp(45px, 5vw, 55px);
    padding-bottom: clamp(30px, 3vw, 35px); }
  @media screen and (min-width: 768px) {
    #sub #single .post-cont {
      margin: auto;
      width: 95%; } }
  #sub #single .btn {
    margin-top: clamp(65px, 10vw, 130px); }
  #sub #page {
    /* Menu 
    -----------------------------------------------------------*/ }
    #sub #page .border {
      background: #fff;
      border: 5px solid #73706f;
      margin: 0 auto 23px;
      max-width: 300px;
      padding: 15px 15px 12px;
      text-align: center;
      width: 100%; }
      @media screen and (min-width: 768px) {
        #sub #page .border {
          margin: 0 0 30px; } }
    #sub #page .menu .fee {
      color: #ea5413;
      font-size: clamp(23px, 2vw, 25px);
      font-weight: 500;
      margin-bottom: clamp(35px, 4vw, 45px); }
    #sub #page .menu .wp-block-group h2 {
      border: 2px solid #ea5413;
      color: #ea5413;
      font-size: clamp(18px, 2vw, 23px);
      margin-bottom: clamp(45px, 6vw, 60px);
      max-width: 100%;
      padding: 20px;
      text-align: center;
      width: clamp(300px, 30vw, 350px); }
    @media screen and (min-width: 768px) {
      #sub #page .menu .wp-block-group .wp-block-table table {
        margin: auto;
        width: 95%; } }
    @media screen and (max-width: 767px) {
      #sub #page .menu .wp-block-group .wp-block-table table td:last-of-type {
        border-top: none; } }
    #sub #page .menu .wp-block-group .inner {
      margin: 0 0 clamp(50px, 6vw, 75px); }
      #sub #page .menu .wp-block-group .inner h3 {
        color: #73706f; }
      #sub #page .menu .wp-block-group .inner .wp-block-table {
        margin-top: clamp(20px, 3vw, 30px); }
    #sub #page .menu .anchor {
      margin-top: -50px;
      padding-top: 50px; }
    @media screen and (min-width: 768px) {
      #sub #page .menu #peeling .wp-block-table td:first-of-type {
        width: 75%; } }
    @media screen and (min-width: 768px) {
      #sub #page .menu #facial .wp-block-table td:first-of-type,
      #sub #page .menu #aroma .wp-block-table td:first-of-type,
      #sub #page .menu #care .wp-block-table td:first-of-type,
      #sub #page .menu #chiropractic .wp-block-table td:first-of-type,
      #sub #page .menu #body .wp-block-table td:first-of-type {
        width: 70%; } }

/*------------------------------------------------------------------------------ 
  Footer
------------------------------------------------------------------------------*/
footer {
  background: #fff; }
  footer #foot-in {
    padding: 55px 20px; }
    @media screen and (max-width: 1024px) {
      footer #foot-in .foot-info {
        margin-bottom: 40px; } }
    footer #foot-in .foot-info .foot-logo {
      margin-bottom: clamp(30px, 4vw, 40px); }
      @media screen and (max-width: 1024px) {
        footer #foot-in .foot-info .foot-logo {
          text-align: center; } }
      footer #foot-in .foot-info .foot-logo img {
        width: clamp(300px, 30vw, 400px); }
    @media (min-width: 600px) and (max-width: 1024px) {
      footer #foot-in .foot-info .address {
        margin: auto;
        max-width: 500px;
        width: 65%; } }
    footer #foot-in .foot-contact .tel {
      font-size: clamp(30px, 4vw, 38px);
      font-weight: 500;
      margin-bottom: 30px;
      text-align: center; }
      footer #foot-in .foot-contact .tel a {
        color: #ea5413; }
        footer #foot-in .foot-contact .tel a .en {
          font-size: clamp(18px, 2vw, 25px); }
    footer #foot-in .foot-contact .btn {
      max-width: 370px; }
      footer #foot-in .foot-contact .btn .uppercase {
        font-size: clamp(23px, 2vw, 25px);
        font-weight: 400; }
  footer #copyright {
    font-size: clamp(18px, 2vw, 20px);
    line-height: 1.3;
    padding: 5px 7px;
    text-align: center; }
  footer #goTop .up {
    background: #fff;
    border: 2px solid #ea5413;
    border-radius: 50%;
    bottom: 45px;
    height: 50px;
    padding: 12px;
    position: fixed;
    right: 10px;
    transition: .3s;
    width: 50px;
    z-index: 80; }
    footer #goTop .up:hover {
      cursor: pointer;
      opacity: .8; }
    @media screen and (min-width: 768px) {
      footer #goTop .up {
        height: 55px;
        padding: 15px;
        right: 30px;
        width: 55px; } }
    footer #goTop .up img {
      vertical-align: baseline; }
  footer #goTop .v-enter-active,
  footer #goTop .v-leave-active {
    transition: opacity .3s; }
  footer #goTop .v-enter-from,
  footer #goTop .v-leave-to {
    opacity: 0; }

/*# sourceMappingURL=style.css.map */
