html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
}

html.safari {
  -webkit-font-feature-settings: "pkna";
  font-feature-settings: "pkna";
}

body {
  color: #524E4B;
}

/*Typo*/
@font-face {
  font-family: 'ArcherSemibold';
  src: url("../fonts/Archer-Semibold.eot");
  src: url("../fonts/Archer-Semibold.eot?#iefix") format("embedded-opentype"), url("../fonts/Archer-Semibold.woff2") format("woff2"), url("../fonts/Archer-Semibold.woff") format("woff"), url("../fonts/Archer-Semibold.ttf") format("truetype"), url("../fonts/Archer-Semibold.svg#Archer-Semibold") format("svg");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ArcherSemiboldItalic';
  src: url("../fonts/Archer-SemiboldItalic.eot");
  src: url("../fonts/Archer-SemiboldItalic.eot?#iefix") format("embedded-opentype"), url("../fonts/Archer-SemiboldItalic.woff2") format("woff2"), url("../fonts/Archer-SemiboldItalic.woff") format("woff"), url("../fonts/Archer-SemiboldItalic.ttf") format("truetype"), url("../fonts/Archer-SemiboldItalic.svg#Archer-SemiboldItalic") format("svg");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'ArcherBookItalic';
  src: url("../fonts/Archer-BookItalic.eot");
  src: url("../fonts/Archer-BookItalic.eot?#iefix") format("embedded-opentype"), url("../fonts/Archer-BookItalic.woff2") format("woff2"), url("../fonts/Archer-BookItalic.woff") format("woff"), url("../fonts/Archer-BookItalic.ttf") format("truetype"), url("../fonts/Archer-BookItalic.svg#Archer-BookItalic") format("svg");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

header .toggle {
  cursor: pointer;
  width: 40px;
  height: 21px;
}

header .toggle div {
  width: 100%;
  height: 1px;
  background: #555555;
  transform-origin: center;
  transition: opacity 0.3s, transform 0.3s cubic-bezier(0.73, 0.29, 0, 1);
}

header .toggle .top {
  transform: rotate(0deg) translateY(0px);
}

header .toggle .middle {
  opacity: 1;
}

header .toggle .bottom {
  transform: rotate(0deg) translateY(0px);
}

.open .toggle .top {
  transform: rotate(-35deg) translateY(11px);
  margin: 0;
}

.open .toggle .middle {
  opacity: 0;
}

.open .toggle .bottom {
  transform: rotate(35deg) translateY(-13px);
  margin: -1px 0 0;
}

img.full {
  width: 100%;
  height: auto;
}

.navi {
  opacity: 0;
  transform: translate(100%, 0);
  transition: opacity 0.3s, transform 0.3s cubic-bezier(0.73, 0.29, 0, 1);
}

.navi .navi-main h1 {
  font-size: 2.4vw;
  font-weight: normal;
  line-height: 1;
  padding: 0 0 5% 0;
}

@media screen and (max-width: 768px) {
  .navi .navi-main h1 {
    font-size: 6vw;
    padding: 0 0 8% 0;
  }
}

.navi .navi-main span {
  letter-spacing: .08em;
}

.navi .navi-main em {
  font-style: normal;
}

.navi .navi-main img {
  width: auto;
  height: 1.5em;
  margin: 0 20px 0 0;
}

.navi .navi-main small {
  font-size: 1vw;
}

@media screen and (max-width: 768px) {
  .navi .navi-main small {
    font-size: .55rem;
  }
}

.open.navi {
  opacity: 1;
  transform: translate(0, 0);
}

.second-main2 h1 {
  font-size: 2.4vw;
  font-weight: normal;
  line-height: 1;
  padding: 5% 0 3% 5%;
  display: inline-block;
}

@media screen and (max-width: 768px) {
  .second-main2 h1 {
    font-size: 6vw;
    padding: 5% 0 8% 5%;
  }
}

.second-main2 h1 span {
  letter-spacing: .08em;
}

.second-main2 h1 em {
  font-style: normal;
}

.second-main2 h1 img {
  width: auto;
  height: 1.5em;
  margin: 0 20px 0 0;
}

.second-main2 h1 small {
  font-size: 1vw;
}

@media screen and (max-width: 768px) {
  .second-main2 h1 small {
    font-size: .55rem;
  }
}

@media screen and (max-width: 768px) {
  .second-main {
    margin-bottom: 80px;
  }
}

@media screen and (max-width: 768px) {
  .second-main .text-box {
    top: 84%;
  }
}

.second-main h1 {
  font-size: 2.4vw;
  font-weight: normal;
  line-height: 1;
  padding: 5% 0 3% 5%;
  display: inline-block;
}

@media screen and (max-width: 768px) {
  .second-main h1 {
    font-size: 6vw;
    padding: 5% 0 8% 5%;
  }
}

.second-main h1 span {
  letter-spacing: .08em;
}

.second-main h1 em {
  font-style: normal;
}

.second-main h1 img {
  width: auto;
  height: 1.5em;
  margin: 0 20px 0 0;
}

.second-main h1 small {
  font-size: 1vw;
}

@media screen and (max-width: 768px) {
  .second-main h1 small {
    font-size: .55rem;
  }
}

.second-main .main {
  width: 70%;
  height: 30%;
}

@media screen and (max-width: 768px) {
  .second-main .main {
    width: 80%;
    height: 400px;
    background: url("../images/yoga_main_image.jpg") 0 0 no-repeat;
    background-size: cover;
  }
  .second-main .main .full {
    display: none;
  }
}

@media screen and (max-width: 768px) {
  .index-main {
    margin-bottom: 100px;
  }
}

.index-main h1 {
  font-size: 7.4vw;
  font-weight: normal;
  padding: 0 5% 0 0;
}

@media screen and (max-width: 768px) {
  .index-main h1 {
    top: 45%;
  }
}

.index-main h1 span {
  letter-spacing: .08em;
}

.index-main h1 em {
  font-style: normal;
}

@media screen and (max-width: 768px) {
  .index-main h1 em {
    color: #524E4B;
  }
}

.index-main h1 img {
  width: auto;
  height: 1.2em;
  margin: 0 30px 0 0;
}

@media screen and (max-width: 768px) {
  .index-main h1 img {
    height: 2em;
    margin: 23px 17px 0 0;
  }
}

.index-main .main {
  width: 70%;
}

@media screen and (max-width: 768px) {
  .index-main .main {
    width: 80%;
    height: 400px;
  }
  .index-main .main .full {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

.index-about .rin {
  right: -20px;
  top: -130px;
}

@media screen and (max-width: 768px) {
  .index-about .rin {
    right: 30px;
    top: -110px;
  }
}

.index-about .catch {
  max-width: 180px;
  width: 30%;
}

.index-about .text-box {
  max-width: 520px;
  width: 90%;
}

.index-about .tryangle {
  max-width: 480px;
  width: 90%;
}

.index-content ul li figure {
  width: 55%;
}

@media screen and (max-width: 768px) {
  .index-content ul li figure {
    width: 100%;
  }
}

.index-content ul li figure img {
  width: 92%;
  height: 92%;
}

@media screen and (max-width: 768px) {
  .index-content ul li figure .yoga-menu-img {
    width: 100%;
  }
}

.index-content ul li figure figcaption {
  width: 8%;
}

.index-content ul li figure figcaption span {
  display: block;
  transform: rotate(90deg) translate(0%, -150%);
  transform-origin: 0 0;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
  .index-content ul li figure figcaption span {
    transform: rotate(90deg) translate(0%, -90%);
  }
}

.index-content ul li .text-box {
  width: 45%;
}

@media screen and (max-width: 768px) {
  .index-content ul li .text-box {
    width: 100%;
  }
}

.link-border {
  max-width: 200px;
}

.link-border-w {
  max-width: 300px;
}

.content04 figure {
  height: 480px;
  overflow: hidden;
  background: url("../images/image_content04.jpg") center bottom;
  background-size: cover;
}

.content04 figure img {
  max-width: 30px;
  width: 30px;
  height: auto !important;
}

.contact {
  background: url("../images/bg_contact.jpg") center center no-repeat;
  background-size: cover;
}

footer .logo {
  width: 40px;
}

.class-content img {
  width: 100%;
  height: 100%;
}

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