/*main*/
/* width */
::-webkit-scrollbar {
  height: 0px;
}
/* Track */
::-webkit-scrollbar-track {
}
/* Handle */
::-webkit-scrollbar-thumb {
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
}
body,
html {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  background-color: #FEF3F7;
  font-family: sans-serif;
  scroll-behavior: smooth;
  overflow: hidden;
  width: 657px;
  height: 1100px;
}
/*home*/
h1,h2,h3,h4,h5,h6{
  margin-bottom: 0;
  font-family: sans-serif;
}
a {
  cursor: pointer;
  text-decoration: none;
  transition: 0.3s ease-in-out !important;
}
a:hover {
  text-decoration: none;
  transition: 0.3s ease-in-out !important;
}
p {
  margin-bottom: 0px;
  font-size: 11.5px;
  font-family: sans-serif;
}
input:focus, textarea:focus {
  outline: 0;
  box-shadow: none !important;
}
button{
  box-shadow: none !important;
  border: none;
}
button:focus {
  box-shadow: none !important;
  outline: 0;
}
#content {
  display: block;
  height: 1100px;
  position: relative;
}
#loader {
  position: absolute;
  left: 0;
  top: 0;
  width: 657px;
  height: 1100px;
  background: #FEF3F7;
  display: flex;
  align-items: center;
  justify-content: center;
}
#content video{
  width: 657px;
  height: auto;
  position: absolute;
  z-index: 1;
  top: 50%;
  transform: translateY(-50%);
}
/*splash*/
#content .splash{
  padding: 49px;
  position: absolute;
  z-index: 2;
  width: 493px;
  height: 913px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0;
  border: 3px solid #fff;
  border-radius: 59px;
  top: 50%;
  transform: translate(-50%, -50%);
  left: 50%;
}
.logo {
  width: 308px;
  height: 82px;
  position: relative;
  background: url("../img/logo-0.png") center/cover no-repeat;
  overflow: hidden;
  animation: scale-in-hor-centers 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
  transform: translateY(20px);
}
@keyframes scale-in-hor-centers {
  0% {
    width: 0;
    opacity: 1;
  }
  100% {
    width: 308px;
    opacity: 1;
  }
}
.logo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("../img/logo-1.png") center/cover no-repeat;
  animation: color-change-2x 2s linear 1.2s infinite alternate both;
}
@keyframes color-change-2x {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
#content .splash img{
  animation: scale-in-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
#content .splash img:nth-child(3){
  margin-top: 7px;
  width: 330px;
}
@keyframes scale-in-center {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
#content .splash .tap-area{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#content .splash .tap-area img{
  animation: pulsate-bck 2s ease-in-out infinite both;
  width: 255px;
}
@keyframes pulsate-bck {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}
/*splash end*/
/*manu*/
#content .head-txt{
  animation: scale-in-center1 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s both;
}
@keyframes scale-in-center1 {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
#content .item-list{
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#content .item-list a{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 25px;
  animation: pulsate-bck1 0.7s ease-in-out 0.5s both;
  -webkit-tap-highlight-color: transparent !important;
  filter: brightness(1);
}
#content .item-list a:focus-visible,
#content .item-list a:focus,
#content .item-list a:active,
#content .item-list a:hover{
  outline: none;
  filter: brightness(1.3);
}
@keyframes pulsate-bck1 {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
/*manu end*/
/*product options*/
#content .product-set{
  padding-top: 0;
  position: relative;
  z-index: 2;
  width: 657px;
  height: 1067px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin-top: auto;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
#content #section3.product-set{
  padding-top: 49px;
  gap: 0;
  justify-content: flex-start;
}
#content .product-set.serum-sec{
  gap: 19px;
}
#content .product-set.serum-sec .logo{
  transform: translateY(0);
  width: 246px;
}
#content .product-set.serum-sec .header ul{
  padding: 0;
  margin: 0;
}
#content .product-set.serum-sec video{
  position: relative;
  width: 67%;
  height: auto;
  border-radius: 47px;
  top: unset;
  transform: unset;
}
#content .product-set .head-txt{
  animation: scale-in-center1 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.2s both;
}
@keyframes scale-in-center1 {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
#content .product-set .footer{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 33px 25px;
  width: 95%;
  position: absolute;
  bottom: 0;
  z-index: 3;
  left: 50%;
  transform: translateX(-50%);
}
#content .product-set .footer > ul{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
}
#content .product-set .footer > ul li a{
  display: inline-block;
}