:root {
  /* color-scheme: light !important; */
}

/*
Layout
*/
body {
  scroll-behavior: smooth;
  background-color: #F4F1EC;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  color: #2D2A26;
  /* max-width: 1080px; */
  margin: 0 auto;
  font-size: 85%;
  position: relative;
  top: 50px;
}


.container-fluid {
  max-width: 1080px;
}
a {
  color: #110c04;
}
a:hover {
  color:#6d5e4a;
  transition: 0.3s;
}
a img:hover {
  opacity: 0.8;
  transition: 0.5s;

}
h1, h2, h3, h4 {
  color: #24211D;
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
h1 {
  font-size: 500%;
}
h2 {
  font-size: 300%;
  margin-bottom: 40px;
  text-align: center;
}
h3 {
  font-size: 200%;
  margin-bottom: 40px;
  text-align: center;
  text-decoration: underline;
}

img {
  width: 100%;
  object-fit: cover;
}

section {
  padding-bottom: 5em;
}

/*
Index
*/
#index section {
    padding: 0 0 50px;
}
#index .header_txt{
    text-align: center;
}

#index .header_txt h1{
    margin-bottom: 30px;
}

#index .header_txt h2{
    margin-bottom: 10px;
}

#index .header_txt p{
    margin-top: 0px;
    margin-bottom: 70px;
    font-size: 120%;
}
#index .img{
    margin-bottom: 50px;
    text-align: center;

}
#index img{
    width: 80%
}
#index button{
/*
    text-align: center;
    border-radius: 5px;
*/
    background: none;
    padding: 0.5em 1em;
    width: 250px;
    display: block;
    margin: 0 auto 10px;
    font-size: 150%;
    border: none;
}
#index button a {
/*    color: #fff;*/
    text-decoration: none;
}
#index .fb_comment{
    font-size: 80%;
    text-align: center;
    margin-top: 50px;
}

/*
Navigation
*/
.navbar-toggler {
  border: none;;

}
nav.navbar {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 10000;
  /* background-color: #dedbd7 !important; */
  background-color: #F4F1EC !important;
}
.offcanvas {
  background: rgba(255,255,255,0.85);
}

.btn-square-little-rich {
  /* position: relative; */
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  color: #FFF;
  border: solid 1px #fff;
  /* background: #4b4531;
  border: solid 1px #181407;
  border-radius: 20px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
  text-shadow: 0 1px 0 rgba(0,0,0,0.2); */
  /* font-family: "Cormorant Garamond", serif; */
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  /* width: 100%; */
  /* max-width: 200px; */
  text-align: center;
  font-size: 100%;
  border-radius: 2px;

}

.btn-square-little-rich:active {
  /*押したとき*/
  border: solid 1px #03A9F4;
  box-shadow: none;
  text-shadow: none;
}

.navbar ul.lang {
  margin-bottom: 0;
}
.navbar ul.lang li {
  list-style: none;
  padding-top: 5px;
  font-family: "EB Garamond", serif;
  text-align: center;
  /* display: inline-block;
  position: relative;
  top:-3px; */
}

nav.reserve {
  position: fixed;
  bottom: 0;
  width: 100%;
  /* background-color: #dedbd7; */
  background-color: #534B38;
  padding: 0.5em 1em;
  z-index: 10000;
}
nav.reserve div {
  /* width: 350px; */
  margin: 10px auto;
  text-align: center;
}
nav.reserve ul,
nav.reserve p {
  display: inline-block;
    margin-bottom: 0;
}
nav.reserve li {
  list-style: none;
  display: inline-block;
  width: 40px;
  margin-left: 10px;
    position: relative;
    top:-3px;
}



#header, #treatment, #testimonial, #contact {
  background-color: #FFF;
}
#philosophy, #beforeAfter, #therapist {
    background-color: #F4F1EC;
}


#header, #philosophy {
  text-align: center;
}
/* #header, #philosophy, #treatment {
  text-align: center;
} */

#philosophy div.row , #treatment div.row  {
  margin-bottom: 70px;
}


/*
header
*/

#header p{
  margin: 10px auto;
}
#header h2{
  margin-bottom: 0px;
}
#header .italic{
  font-style:italic;
  margin: 100px auto;
  font-size: 200%;
  line-height: 150%;
}
#header p img {
  width: 65%;
}

/*
therapist,
service
*/

#therapist h3,
#service h3 {
  text-decoration: none;
  text-align: left;
  margin-bottom: 0;
}
#therapist h4,
#service h4  {
    font-size: 120%;
    margin-bottom: 15px;
}

/*
contact
*/
#contact .row {
  margin-bottom: 70px;
}

#contact .row p{
  text-align: center;
}
#contact p img{
  width: 100px;
}
#contact .gift {
  width: 330px;
  text-align: center;
  border: 1px solid #8a8175;
  background-color: #F4F1EC;
  border-radius: 10px;
  padding: 1em;
  margin: 20px auto 40px;
  font-size: 120%;
  font-family: "Zen Old Mincho", serif;
  font-family: "EB Garamond", serif;
}
#contact .gift p:last-of-type{
  margin-bottom: 0;
}

#treatment .offer {
  text-align: center;
  background-color: #F4F1EC;
  margin-top: 50px;
}
#treatment .offer h4 {
  margin-top: 20px;
}
/*
carousel
*/
#carouselHeader {
  margin:  0 auto 40px;
  width: 700px;
}
#testimonial .carousel-item div {
    min-height: 400px;
    padding: 70px 100px;
    background-color: #F4F1EC;
}
#testimonial .carousel-item div p.name{
  text-align: center;
  font-weight: bold;
}
#testimonial .carousel-indicators [data-bs-target] {
    background-color: #000;
}

#testimonial .carousel-control-next-icon,
#beforeAfter .carousel-control-next-icon {
    background-image: url(../img/carousel_arrow_right_black.svg);
}
#testimonial .carousel-control-prev-icon,
  #beforeAfter .carousel-control-prev-icon {
  background-image: url(../img/carousel_arrow_left_black.svg);
}


/*
ja
*/

#ja {
  font-family: "Sawarabi Gothic", sans-serif;
  font-family: "Montserrat", sans-serif;
}

#ja h1,
#ja h2,
#ja h3,
#ja h4 {
  font-family: "Zen Old Mincho", serif;
  font-family: "EB Garamond", serif;
}

#ja #header .italic{
  font-style:italic;
  margin: 100px auto;
  font-size: 150%;
  line-height: 150%;
}

#ja #service {
  background-color: #FFF;
}
#ja #contact{
    background-color: #F4F1EC;
}

#service h3 {
  margin-top: 80px;
}
#service h4 {
  text-decoration: underline;
  margin: 15px 0 0;
}

#ja #contact .gift{
  background-color: #fff;
}

/*
fr
*/

#fr {
}


/*
Under 600px
*/
@media (max-width: 600px) {
    #index .header_txt h1{
        font-size: 200%;
    }

  .row {
    padding:15px;
  }
  section {
    padding-top: 0;
    padding-bottom:0;
  }
  #philosophy div.row , #treatment div.row  {
    margin-bottom: 0;
  }
  #header, #treatment, #testimonial, #contact ,#philosophy, #beforeAfter, #therapist, #service {
    padding: 50px 0;
  }

  h1 {
    font-size: 250%;
  }
  h2 {
    font-size: 180%;
    margin-bottom: 15px;
  }
  h3 {
    font-size: 150%;
    margin-bottom: 15px;
  }

  #header p img {
    width: 100%;
  }

  #philosophy h3 , #treatment h3  {
    padding-top: 40px;
  }

  #treatment h4 {
    margin-top:50px;
  }

  #treatment .col-md-7 p:first-of-type {
      padding-top: 10px;
  }


  #testimonial .carousel-item div {
      min-height: 400px;
      padding: 50px 50px;
  }

  #therapist h3{
    margin: 20px 0 0;
  }
  #therapist h4{
    margin: 0 0 15px;
  }
  #contact {
      padding-bottom: 100px;
  }
  #contact .row {
    margin-bottom: 0;
  }
  #contact p img{
    width: 65px;
  }

#ja #treatment .offer h4 {
  font-size: 130%;
}
#ja #treatment .offer strong {
  text-decoration: underline;
}

#service h3:first-of-type {
  margin-top: 0px;
}

#fr h1 {
    font-size: 200%;
  }

#fr #treatment .offer h4 {
  font-size: 130%;
}

}

/*
.cormorant-garamond-<uniquifier> {
  font-family: "Cormorant Garamond", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
} */

/* .montserrat-<uniquifier> {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
} */


/**
 * Bootstrap "Journal code" icon
 * @link https://icons.getbootstrap.com/icons/journal-code/
 */
.bd-heading a::before {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: .25rem;
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23999' viewBox='0 0 16 16'%3E%3Cpath d='M4 1h8a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2h1a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1H2a2 2 0 0 1 2-2z'/%3E%3Cpath d='M2 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H2zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H2zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H2z'/%3E%3Cpath fill-rule='evenodd' d='M8.646 5.646a.5.5 0 0 1 .708 0l2 2a.5.5 0 0 1 0 .708l-2 2a.5.5 0 0 1-.708-.708L10.293 8 8.646 6.354a.5.5 0 0 1 0-.708zm-1.292 0a.5.5 0 0 0-.708 0l-2 2a.5.5 0 0 0 0 .708l2 2a.5.5 0 0 0 .708-.708L5.707 8l1.647-1.646a.5.5 0 0 0 0-.708z'/%3E%3C/svg%3E");
  background-size: 1em;
}

/* stylelint-disable-next-line selector-max-universal */
.bd-heading + div > * + * {
  margin-top: 3rem;
}

/* Table of contents */
.bd-aside a {
  padding: .1875rem .5rem;
  margin-top: .125rem;
  margin-left: .3125rem;
  color: var(--bs-body-color);
}

.bd-aside a:hover,
.bd-aside a:focus {
  color: var(--bs-body-color);
  background-color: rgba(121, 82, 179, .1);
}

.bd-aside .active {
  font-weight: 600;
  color: var(--bs-body-color);
}

.bd-aside .btn {
  padding: .25rem .5rem;
  font-weight: 600;
  color: var(--bs-body-color);
}

.bd-aside .btn:hover,
.bd-aside .btn:focus {
  color: var(--bs-body-color);
  background-color: rgba(121, 82, 179, .1);
}

.bd-aside .btn:focus {
  box-shadow: 0 0 0 1px rgba(121, 82, 179, .7);
}

.bd-aside .btn::before {
  width: 1.25em;
  line-height: 0;
  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ccc' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
  transition: transform .35s ease;

  /* rtl:raw:
  transform: rotate(180deg) translateX(-2px);
  */
  transform-origin: .5em 50%;
}

.bd-aside .btn[aria-expanded="true"]::before {
  transform: rotate(90deg)/* rtl:ignore */;
}


/* Examples */
.scrollspy-example {
  height: 200px;
}

[id="modal"] .bd-example .btn,
[id="buttons"] .bd-example .btn,
[id="tooltips"] .bd-example .btn,
[id="popovers"] .bd-example .btn,
[id="dropdowns"] .bd-example .btn-group,
[id="dropdowns"] .bd-example .dropdown,
[id="dropdowns"] .bd-example .dropup,
[id="dropdowns"] .bd-example .dropend,
[id="dropdowns"] .bd-example .dropstart {
  margin: 0 1rem 1rem 0;
}

/* Layout */
@media (min-width: 1200px) {
  body {
/*
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 1fr 4fr 1fr;
    gap: 1rem;
*/
  }

  .bd-header {
    position: fixed;
    top: 0;
    /* rtl:begin:ignore */
    right: 0;
    left: 0;
    /* rtl:end:ignore */
    z-index: 1030;
    grid-column: 1 / span 3;
  }

  .bd-aside,
  .bd-cheatsheet {
    padding-top: 4rem;
  }

  /**
   * 1. Too bad only Firefox supports subgrids ATM
   */
  .bd-cheatsheet,
  .bd-cheatsheet section,
  .bd-cheatsheet article {
    display: inherit; /* 1 */
    grid-template-rows: auto;
    grid-template-columns: 1fr 4fr;
    grid-column: 1 / span 2;
    gap: inherit; /* 1 */
  }

  .bd-aside {
    grid-area: 1 / 3;
    scroll-margin-top: 4rem;
  }

  .bd-cheatsheet section,
  .bd-cheatsheet section > h2 {
    top: 2rem;
    scroll-margin-top: 2rem;
  }

  .bd-cheatsheet section > h2::before {
    position: absolute;
    /* rtl:begin:ignore */
    top: 0;
    right: 0;
    bottom: -2rem;
    left: 0;
    /* rtl:end:ignore */
    z-index: -1;
    content: "";
  }

  .bd-cheatsheet article,
  .bd-cheatsheet .bd-heading {
    top: 8rem;
    scroll-margin-top: 8rem;
  }

  .bd-cheatsheet .bd-heading {
    z-index: 1;
  }
}