@charset "UTF-8";
/* CSS Document */
.fadeInTrigger{
  opacity: 0 ;
}
.fadeInLeftTrigger{
  opacity: 0;
}
.fadeInRightTrigger{
  opacity:  0 ;
}



.section-banner{
  background-image: url("../image/concept_banner.jpg")
}



.section-beauty{
  width: 100vw;
  background-color: #F2F2F2;
  margin: 120px auto;
  position: relative;
}
.beauty-lead{
  width: 100%;
  display: flex;
  align-items:flex-start;
  flex-wrap: wrap;
}
.beauty-lead img{
  object-fit:contain;
  width:60%;
}
.beauty-lead p{
  font-size: 2rem;
  line-height: 2.8;
  margin: auto;
  text-align: left;
  z-index: 100;
}
.concept-bg1{
  position: absolute;
  bottom: -20px;
  right: 5%;
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(2rem, 10vw, 15rem);
  color: #DDDBDB;
  letter-spacing: 2rem;
  text-align: right;
}
@media(max-width:980px){
  .section-beauty{
    margin: 60px auto;
  }
  .beauty-lead img{
    width: 85%;
  }
  .beauty-lead p{
    font-size: 1.8rem;
    line-height: 4rem;
    padding: 15px;
  }
  .concept-bg1{
    top:34%;
    letter-spacing: 1.5rem;
  }
}

/*-----section-healing-----*/

.section-healing{
   width: 100vw;
  background-color: #F2F2F2;
  margin: 120px auto;
  position: relative;
}
.healing-lead{
  width: 100%;
  display: flex;
  align-items:flex-start;
  flex-wrap: wrap;
}
.healing-lead img{
  width: 60%;
}
.healing-lead p{
  font-size: 2rem;
  line-height: 2.8;
  margin: auto;
  text-align: left;
  z-index: 100;
}
.concept-bg2{
  position: absolute;
  top: -20px;
  left: 5%;
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1rem, 10vw, 15rem);
  color: #DDDBDB;
  letter-spacing: 2rem;
  text-align: left;
}
@media(max-width:980px){
  .section-healing{
    margin: 60px auto;
  }
  .healing-lead{
    align-items: flex-end;
    align-content: flex-end;
    flex-direction: column-reverse;
  }
  .healing-lead img{
    width: 85%;
  }
  .healing-lead p{
    font-size: 1.8rem;
    line-height: 4rem;
    padding: 30px;
  }
  .concept-bg2{
    top:0;
    letter-spacing: 1.5rem;
  }
}

.concept-img{
  width: 100vw;
  display: flex;
  margin-bottom: 120px;
}
.concept-img img{
  width: 25%;
  height: 100%;
}
@media(max-width:800px){
  .concept-img{
    margin-bottom: 60px;
    flex-wrap: wrap;
  }
  .concept-img img{
    width: 50%;
  }
}

.shop-img360{
  width: 70%;
  height: 500px;
  margin-bottom: 120px;
}