@charset "UTF-8";
@media screen and (max-width: 1239px) {
  body {
    font-size: 1rem;
  }
}

@media screen and (max-width: 767px) {
  body {
    font-size: 1rem;
  }
}

@media screen and (max-width: 374px) {
  body {
    font-size: 1rem;
  }
}

/************************************************
    キービジュアル
*************************************************/
/*.keyVisual--home {
    width: 100%;
    height: calc(100vh - 60px);
    position: relative;
    &__txt {
        text-align: center;
        padding: 327px 0 210px;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        z-index: 1;
        @include sp {
            padding: 0;
        }
    }
    &__logo {
        img {
            @include sp {
                width: 100px;
            }
        }
    }
    &__content {
        color: #fff;
        @include Arial;
        font-size: 1em;
        font-feature-settings: "palt" 1;
        letter-spacing: 0.2em;
        @include lh(1.6);
        white-space: nowrap;
        padding-left: 0.2em;
        margin-top: 3.8em;
        @include sp {
            text-shadow: 0px 0px 10px #000;
            margin-top: 2em;
        }
    }
    &__bg {
        height: 100%;
        img {
            max-width: 100%;
            max-height: 100%;
            width: auto;
            height: 100%;
            margin: 0 auto;
        }
    }
}*/
/************************************************
    SALON
*************************************************/
.home-salon {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr minmax(280px, 1120px) 1fr;
  grid-template-columns: 1fr minmax(280px, 1120px) 1fr;
  -ms-grid-rows: auto auto auto;
  grid-template-rows: auto auto auto;
  padding: 7em 30px 11em;
  position: relative;
}

@media screen and (max-width: 1239px) {
  .home-salon {
    padding: 7em 30px 11em;
  }
}

@media screen and (max-width: 767px) {
  .home-salon {
    display: block;
    padding: 3.6em 20px 5em;
  }
}

.home-salon::before {
  content: '';
  display: block;
  background-color: #f7f7f7;
  width: 640px;
  height: calc(100% - 35px);
  position: absolute;
  left: 50%;
  top: 161px;
  transform: translateX(-50%);
  z-index: -1;
}

@media screen and (max-width: 1239px) {
  .home-salon::before {
    width: 300px;
    height: 1850px;
    top: 136px;
  }
}

@media screen and (max-width: 767px) {
  .home-salon::before {
    width: 220px;
    height: 2792px;
    top: 104px;
  }
}

@media screen and (max-width: 374px) {
  .home-salon::before {
    height: 2783px;
    top: 100px;
  }
}

@media screen and (max-width: 767px) {
  .home-salon {
    text-align: center;
  }
}

.home-salon__title {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-feature-settings: "palt" 1;
  letter-spacing: 1.9em;
  line-height: 1.45455;
  text-align: left;
  -ms-grid-column: 2;
  grid-column: 2;
  -ms-grid-row: 1;
  grid-row: 1;
  -ms-grid-column-align: start;
  justify-self: start;
  margin: 0 0 -0.36364em 97px;
}

@media screen and (max-width: 1239px) {
  .home-salon__title {
    letter-spacing: 1em;
    margin-left: 57px;
  }
}

@media screen and (max-width: 767px) {
  .home-salon__title {
    letter-spacing: 0.75em;
    display: inline-block;
    padding-left: 0.75em;
    margin-left: 0;
  }
}

.home-salon__logo {
  -ms-grid-column: 2;
  grid-column: 2;
  -ms-grid-row: 1;
  grid-row: 1;
  -ms-grid-column-align: end;
  justify-self: end;
  -ms-grid-row-align: end;
  align-self: end;
  display: block;
  margin-right: 70px;
}

@media screen and (max-width: 1239px) {
  .home-salon__logo {
    margin-right: 50px;
  }
}

@media screen and (max-width: 767px) {
  .home-salon__logo {
    margin: 50px auto 0;
  }
}

.home-salon__list {
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1 / -1;
  -ms-grid-row: 2;
  grid-row: 2;
  -js-display: flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  margin: 100px -30px 0;
}

_:-ms-lang(x)::-ms-backdrop, .home-salon__list {
  justify-content: space-around;
}

@media screen and (max-width: 767px) {
  .home-salon__list {
    margin: 40px 0 0;
  }
}

.home-salon__item {
  width: calc(520 / 1280 * 100%);
  margin: 20px 0;
  overflow: hidden;
  position: relative;
}

@media screen and (max-width: 767px) {
  .home-salon__item {
    max-width: 500px;
    width: 100%;
    margin: 20px auto;
  }
}

.home-salon__item a {
  display: block;
}

.home-salon__item a:hover img {
  opacity: 1;
}

.home-salon__item__title {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 2.4em;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  display: inline-block;
  background-color: #fff;
  padding: 13px 30px 13px 20px;
  position: absolute;
  left: 0;
  bottom: 67px;
  z-index: 1;
}

_:-ms-lang(x)::-ms-backdrop, .home-salon__item__title {
  padding: 19px 30px 7px 20px;
}

@media screen and (max-width: 767px) {
  .home-salon__item__title {
    font-size: 1.92em;
    padding: 13px 20px 13px 10px;
    bottom: 59px;
  }
  _:-ms-lang(x)::-ms-backdrop, .home-salon__item__title {
    padding: 19px 20px 7px 10px;
  }
}

.home-salon__item__address {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.4em;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  display: inline-block;
  background-color: #fff;
  padding: 13px 30px 13px 20px;
  position: absolute;
  left: 0;
  bottom: 25px;
  z-index: 1;
}

_:-ms-lang(x)::-ms-backdrop, .home-salon__item__address {
  padding: 17px 30px 9px 20px;
}

@media screen and (max-width: 767px) {
  .home-salon__item__address {
    font-size: 1.12em;
    padding: 13px 20px 13px 10px;
    bottom: 20px;
  }
  _:-ms-lang(x)::-ms-backdrop, .home-salon__item__address {
    padding: 17px 20px 9px 10px;
  }
}

.home-salon__item__photo {
  display: block;
  width: calc(100% - 20px);
  margin-left: auto;
}

@media screen and (max-width: 1239px) {
  .home-salon__item__photo {
    height: 290px;
  }
}

@media screen and (max-width: 767px) {
  .home-salon__item__photo {
    width: 100%;
  }
}

.home-salon__item__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

a:hover .home-salon__item__photo img {
  transform: scale(1.1);
}

.home-salon__item--esthetic-bridal .home-salon__item__photo img {
  -o-object-position: 10% center;
  object-position: 10% center;
}

/************************************************
    CATALOG
*************************************************/
.home-catalog {
  padding: 8.2em 10px 23em;
}

@media screen and (max-width: 767px) {
  .home-catalog {
    padding: 3.7em 5px 6em;
  }
}

.home-catalog__title {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.5em;
  line-height: 1.27273;
  text-align: center;
  pointer-events: none;
  padding-left: 0.5em;
  position: relative;
  z-index: 1;
}

.home-catalog__list {
  -js-display: flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 4em auto 0;
}

@media screen and (max-width: 1239px) {
  .home-catalog__list {
    margin-top: 3em;
  }
}

@media screen and (max-width: 767px) {
  .home-catalog__list {
    margin-top: 2em;
  }
}

.home-catalog__item {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 3.6em;
  font-weight: bold;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.05em;
  text-align: center;
  width: calc(420 / 1260 * 100%);
}

_:-ms-lang(x)::-ms-backdrop, .home-catalog__item {
  width: 33.333%;
}

@media screen and (max-width: 767px) {
  .home-catalog__item {
    font-size: 2.4em;
    width: 50%;
  }
}

.home-catalog__item a {
  color: #fff;
  display: block;
  background-color: black;
  padding: 1em 1em;
  border: 3px solid black;
  margin: 10px;
  overflow: hidden;
}

@media screen and (max-width: 767px) {
  .home-catalog__item a {
    margin: 5px;
  }
}

.home-catalog__item a img {
  width: 100%;
}

.home-catalog__item a:hover {
  color: black;
  background-color: white;
}

.home-catalog__name {
  -webkit-padding-start: 0.05em;
  padding-inline-start: 0.05em;
}

/************************************************
    INSTAGRAM
*************************************************/
.home-instagram {
  padding: 8.2em 10px 23em;
}

@media screen and (max-width: 767px) {
  .home-instagram {
    padding: 3.7em 5px 6em;
  }
}

.home-instagram__title {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.5em;
  line-height: 1.27273;
  text-align: center;
  pointer-events: none;
  padding-left: 0.5em;
  position: relative;
  z-index: 1;
}
.home-instagram__catch {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 2.4em;
  font-weight: 500;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  line-height: 1.5;
  text-align: center;
  margin-top: calc(15 / 14 * 1em);
  margin-bottom: calc(30 / 14 * 1em);
}

.home-instagram-feed{
  position: relative;
  width: 100%;
}
.home-instagram-feed #sb_instagram {
  max-width: 1612px;
}
.home-instagram-feed__follow{
  color: black;
  font-size: 2em;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.5;
  white-space: nowrap;
  display: block;
  background-color: white;
  width: fit-content;
  padding: calc(5 / 24 * 1em) calc(51.79 / 24 * 1em);
  border: 3px solid black;
  margin: calc(25 / 24 * 1em) auto 0;
}
.home-instagram-feed__follow .text {
  vertical-align: middle;
}

@media screen and (max-width: 767px) {
  .home-instagram-feed #sbi_images {
      padding: 10px;
  }
}

/************************************************
    RECRUIT and COMPANY
*************************************************/
.home-link {
  border-top: 1px solid #c9c9c9;
}

.home-link::after {
  content: '';
  display: block;
  clear: both;
}

.home-link a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 4.8em;
  font-weight: bold;
  font-feature-settings: "palt" 1;
  letter-spacing: 0.1em;
  text-indent: 0.1em;
  text-align: center;
  line-height: 37.5vw;
  background: no-repeat center / cover;
  box-sizing: border-box;
  width: 50%;
  height: 37.5vw;
  float: left;
  position: relative;
  transition: all .4s ease-in-out;
}

@media screen and (max-width: 767px) {
  .home-link a {
    font-size: 6.25vw;
  }
}

.home-link a:nth-child(n+2) {
  border-left: 1px solid #c9c9c9;
}

.home-link a::before {
  content: '';
  display: block;
  background-color: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  transition: all .4s ease-in-out;
}

.home-link a:hover {
  color: #fff;
}

.home-link a:hover::before {
  background-color: transparent;
}

.home-link a.recruit {
  background-image: url('../img/bg_link_recruit.jpg');
}

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 2dppx) {
  .home-link a.recruit {
    background-image: url('../img/bg_link_recruit@2x.jpg');
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 3), screen and (min-resolution: 3dppx) {
  .home-link a.recruit {
    background-image: url('../img/bg_link_recruit@3x.jpg');
  }
}

.home-link a.company {
  background-image: url('../img/bg_link_company.jpg');
}

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 2dppx) {
  .home-link a.company {
    background-image: url('../img/bg_link_company@2x.jpg');
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 3), screen and (min-resolution: 3dppx) {
  .home-link a.company {
    background-image: url('../img/bg_link_company@3x.jpg');
  }
}

.home-link a span {
  position: relative;
  z-index: 1;
}
/*# sourceMappingURL=../maps/front-page.css.map */