@charset "UTF-8";
/* Generated on: Wed Apr 21 2021 14:56:04 GMT+0800 (Singapore Standard Time) */

/* ==========================================================================
   Helpers
   ========================================================================== */
.hidden {
  display: none; }
  @media (max-width: 687px) {
    .hidden--mobile {
      display: none; } }

@media (max-width: 687px) {
  .visible--mobile {
    display: block; } }

.isTransparent {
  opacity: 0; }

.graybg {
  background-color: #F8F8F8; }

.noScroll {
  overflow: hidden; }

.textCentre {
  text-align: center; }

.notResponsive {
  width: auto; }

.non-mobile-only {
  display: none; }
  @media (min-width: 768px) {
    .non-mobile-only {
      display: block; } }

/* ==========================================================================
   Typography
   ========================================================================== */
html.bstory {
  font-size: 16px; }
  @media (min-width: 992px) {
    html.bstory {
      font-size: 20px; } }

.bscontainer {
  font-family: 'Overpass', sans-serif;
  font-weight: 400;
  font-size: 1.1rem;
  line-height: 1.5rem;
  font-style: normal;
  color: #525252; }
  html[lang="zh-Hans"] .bscontainer p, html[lang="zh-Hans"] .bscontainer h3 {
    font-family: 'Source Sans Pro', "Microsoft YaHei New", "Microsoft Yahei", "微软雅黑", 黑体, SimHei, STXihei, "华文细黑", sans-serif; }
  .bscontainer h1 {
    font-family: 'Overpass', sans-serif;
    margin-top: 0;
    color: #496772;
    font-weight: bold;
    font-size: 2.9rem;
    line-height: 3rem; }
    @media (min-width: 768px) {
      .bscontainer h1 {
        font-size: 3.5rem;
        line-height: 3.3rem; } }
    @media (min-width: 1150px) {
      .bscontainer h1 {
        text-align: center; } }
  .bscontainer h2 {
    font-family: 'Overpass', sans-serif;
    font-weight: bold;
    color: #000;
    margin-bottom: 1rem;
    font-size: 2.6rem;
	text-align: left;}
  .bscontainer h3 {
    font-family: 'Overpass', sans-serif;
    font-weight: bold;
    color: #EE3D44;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    line-height: 1.4rem;
	text-align: left;}
  .bscontainer p {
    font-family: 'Overpass', sans-serif; }
  .bscontainer a {
    color: #525252;
    text-decoration: none; }
    .bscontainer a:hover {
      text-decoration: underline; }
    nav .bscontainer a {
      text-decoration: none; }
  .bscontainer sup {
    font-size: .6rem; }
  .bscontainer em {
    font-weight: bold;
    font-size: 1.4rem;
    color: #ed3c44;
    font-style: normal; }

/* ==========================================================================
   Components
   ========================================================================== */
.wraparound {
  border-radius: 50%;
  -webkit-shape-outside: circle(50% at 70% 40%);
          shape-outside: circle(50% at 70% 40%);
  /* shape-outside: ellipse(140px 140px at 0% 0%); */
  float: right;
  -webkit-transform: translateX(90px);
          transform: translateX(90px); }

.circles {
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  background-color: blueviolet;
  width: 100px;
  height: 100px; }

img.imgcircle {
  border-radius: 50%; }

.grid--4col .grid__col {
  margin-bottom: 35px; }

@media (min-width: 688px) {
  .grid {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
            justify-content: space-between; }
    .grid--4col {
      -webkit-flex-wrap: wrap;
              flex-wrap: wrap; }
      .grid--4col .grid__col {
        width: 48.5%; }
    .grid--3col .grid__col {
      width: 30%; }
    .grid--2colCentre {
      -webkit-box-pack: center;
      -webkit-justify-content: center;
              justify-content: center; }
      .grid--2colCentre .grid__col {
        width: 30%;
        margin-left: 2%;
        margin-right: 2%; }
    .grid--2col .grid__col {
      width: 48.5%; }
    .grid--1colNarrow {
      display: block; }
      .grid--1colNarrow .grid__col {
        margin: 0 auto; } }

@media (min-width: 992px) {
  .grid--4col {
    -webkit-flex-wrap: no-wrap;
            flex-wrap: no-wrap; }
    .grid--4col .grid__col {
      width: 23%; } }

@media (min-width: 1150px) {
  .grid--1colNarrow .grid__col {
    max-width: 830px; } }

.video-wrapper {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.1%;
  margin-bottom: 35px; }
  .video-wrapper iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0; }

/* ==========================================================================
   Layout
   ========================================================================== */
* {
  box-sizing: border-box; }

body {
  margin: 0;
  padding: 0;
  background-color: #f9f6f0; }

.bscontainer {
  margin: 0;
  padding: 0;
  overflow: hidden;
  padding-top: 100px;}
  .bscontainer nav ul {
    padding: 0;
    list-style: none; }
  .bscontainer button {
    cursor: pointer; }
  .bscontainer img {
    width: 100%;
    height: auto; }
    a .bscontainer img {
      border: 0; }
  .bscontainer .container {
    margin: 0 auto;
    padding-left: 12%;
    padding-right: 12%;
    padding-bottom: 25px;
    width: 100%;
    max-width: 1000px; }
    @media (min-width: 1100px) {
      .bscontainer .container {
        overflow: visible;
        padding-left: 0;
        padding-right: 0; } }
  .bscontainer section {
    position: relative; }
    .bscontainer section::after {
      display: block;
      clear: both;
      content: ""; }

.obs .toFade {
  opacity: 0;
  -webkit-transition: opacity 400ms ease-in-out 200ms;
  transition: opacity 400ms ease-in-out 200ms; }

.obs .fadedIn {
  opacity: 1; }

.s_girl__content {
  position: relative; }
  @media (min-width: 992px) {
    .s_girl__content {
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -webkit-flex-direction: row;
              flex-direction: row;
      -webkit-box-align: center;
      -webkit-align-items: center;
              align-items: center; } }

@media (min-width: 992px) {
  .s_girl__txt {
    width: 50%; } }

.s_girl__img {
  width: 18rem;
  height: 18rem;
  -webkit-shape-outside: circle(50% at 91% 64%);
          shape-outside: circle(50% at 91% 64%);
  -webkit-transform: translate3d(122px, 41px, 0px);
          transform: translate3d(122px, 41px, 0px); }
  @media (min-width: 992px) {
    .s_girl__img {
      -webkit-box-ordinal-group: 3;
      -webkit-order: 2;
              order: 2;
      float: none; } }

.s_girl__imgCircle {
  background-color: #ffc246;
  bottom: -1rem;
  left: -3rem;
  width: 11rem;
  height: 11rem; }

.s_girl__topCircle {
  background-color: #ffac9f;
  top: -5rem;
  left: 3rem;
  width: 7rem;
  height: 7rem; }

.s_alkamine {
  margin-top: 95px; }

.s_alkamine__packaging {
  float: left;
  width: 37%;
  margin-right: 25px;
  margin-bottom: 17px; }
  @media (min-width: 992px) {
    .s_alkamine__packaging {
      width: 40%; } }

.s_alkamine__circle {
  background-color: #fff;
  top: 24%;
  right: -10rem;
  width: 14rem;
  height: 14rem; }

.s_oldpackaging__circle {
  background-color: #eddfd7;
  top: 17%;
  left: -30%;
  width: 10rem;
  height: 10rem; }
  @media (min-width: 992px) {
    .s_oldpackaging__circle {
      left: -10%;
      top: 11%; } }

.s_oldpackaging__imgwrap {
  position: relative; }

.s_oldpackaging__imgCircle {
  background-color: #ff9247;
  top: -3rem;
  right: -8rem;
  width: 14rem;
  height: 14rem; }
  @media (min-width: 800px) {
    .s_oldpackaging__imgCircle {
      top: 0; } }

.s_testtube h2, .s_testtube p {
  text-align: right; }

.s_testtube p {
  padding-left: 20%; }

.s_testtube__imgwrap {
  position: relative; }

.s_testtube__img {
  -webkit-transform: translateX(-70px);
          transform: translateX(-70px);
  max-width: 540px; }

.s_testtube__txt {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  width: 60%;
  padding-left: 0 !important; }

.s_secret {
  z-index: 2; }
  .s_secret__circle {
    background-color: #f0cd7d;
    right: -8rem;
    top: -5rem;
    width: 16rem;
    height: 16rem; }

.s_hit {
  margin-top: 50px; }

.s_chain__circle {
  background-color: #c0e4e4;
  left: -9rem;
  top: -10rem;
  width: 20rem;
  height: 20rem; }

.s_chain__wrap {
  position: relative;
  -webkit-transform: translateX(32%);
          transform: translateX(32%); }
  @media (min-width: 768px) {
    .s_chain__wrap img {
      max-width: 540px; } }

.s_chain__txt {
  position: absolute;
  bottom: 30px;
  width: 58%;
  left: -32%; }
  @media (min-width: 992px) {
    .s_chain__txt {
      bottom: 35%;
      width: 43%; } }

.s_brandaward {
  z-index: 2;
  margin-top: 3rem; }
  .s_brandaward__circle {
    background-color: #f2c2bb;
    top: -5rem;
    left: 3rem;
    width: 8rem;
    height: 8rem;
    width: 8rem;
    height: 8rem; }

.s_rebrand {
  margin-top: 50px; }
  @media (min-width: 992px) {
    .s_rebrand {
      margin-top: 70px; } }
  .s_rebrand__circle {
    background-color: #f0e9d9;
    top: -8rem;
    right: -4rem;
    width: 16rem;
    height: 16rem; }

.s_collagen h2, .s_collagen p {
  text-align: right; }

.s_collagen__wrap {
  position: relative; }

.s_collagen__img {
  -webkit-transform: translateX(-17%);
          transform: translateX(-17%);
  position: relative;
  z-index: 1; }
  @media (min-width: 768px) {
    .s_collagen__img {
      max-width: 540px; } }

.s_collagen__txtwrap {
  position: absolute;
  top: 0;
  left: 0;
  padding-left: 45%;
  z-index: 3; }
  @media (min-width: 992px) {
    .s_collagen__txtwrap {
      top: 30%; } }

.s_collagen__txt {
  margin-bottom: 0; }

.s_collagen__txt + .s_collagen__txt {
  margin-top: 0; }

.s_collagen__circle {
  z-index: 2;
  background-color: #eedfd8;
  top: 8rem;
  right: -4rem;
  width: 12rem;
  height: 12rem; }

.s_premium {
  margin-top: 2rem; }
  .s_premium__wrap, .s_premium__wrap2 {
    position: relative; }
  .s_premium__wrap2 {
    margin-bottom: 50px; }
  .s_premium__inner {
    position: absolute;
    text-align: center;
    top: 37%;
    width: 100%; }
	.s_premium__inner h2, .s_premium__inner h3 {
		text-align: center;
	}
    @media (min-width: 768px) {
      .s_premium__inner {
        top: 35%; } }
    .s_premium__inner h2 {
      margin-bottom: 0; }
    .s_premium__inner h3 {
      margin-top: 1rem; }
      @media (max-width: 499px) {
        .s_premium__inner h3 {
          padding-left: 15%;
          padding-right: 15%; } }
  .s_premium__circle {
    top: -10rem;
    left: -8rem;
    width: 15rem;
    height: 15rem;
    background-color: #f3dfb0; }
  .s_premium__pic {
    display: block;
    max-width: 520px;
    margin: 0 auto; }
    @media (min-width: 768px) {
      .s_premium__pic {
        display: none; } }
  .s_premium__pic2 {
    display: none; }
    @media (min-width: 768px) {
      .s_premium__pic2 {
        display: block; } }

.s_ha h2, .s_ha p {
  text-align: right; }

.s_ha__wrap {
  position: relative; }

.s_ha__img {
  -webkit-transform: translateX(-17%);
          transform: translateX(-17%);
  position: relative;
  z-index: 1; }
  @media (min-width: 768px) {
    .s_ha__img {
      max-width: 520px; }
	.s_ha__img.CMP {
      max-width: 540px; }}

.s_ha__txt {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3; }
  @media (min-width: 992px) {
    .s_ha__txt {
      top: 30%; } }
  @media (min-width: 768px) {
    .s_ha__txt.CMP {
      top: 30%; } }
  .s_ha__txt p {
    padding-left: 25%; }
  .s_ha__txt.CMP p {
    padding-left: 30%; }
    .s_ha__txt p.s_ha__em {
      padding-left: 10%; }
@media (max-width: 767px) {
	.s_ha__txt.CMP {
	  top: 75%;
	}
	.s_ha__txt.CMP p {
	  padding-left: 5%;
	}
}

.s_ha__circle {
  z-index: 2;
  background-color: #eedfd8;
  top: 8rem;
  right: -4rem;
  width: 12rem;
  height: 12rem; }

.s_herb {
  margin-top: 3rem;
  margin-bottom: 50px; }
  .s_herb__wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex; }
    @media (min-width: 768px) {
      .s_herb__wrap {
        -webkit-box-align: center;
        -webkit-align-items: center;
                align-items: center; } }
  @media (max-width: 767px) {
    .s_herb__col--txt {
      width: 44%; } }
  .s_herb__col--img {
    -webkit-transform-origin: top left;
            transform-origin: top left; }
    @media (max-width: 767px) {
      .s_herb__col--img {
        -webkit-transform: scale(1.1);
                transform: scale(1.1);
        width: 54%;
        margin-left: 2%; } }
  .s_herb__circle {
    background-color: #e0ece8;
    top: -30%;
    right: -30%;
    width: 21rem;
    height: 21rem; }
  .s_herb__circle.CMP {
    top: 0%;
    right: -22%;
    width: 18rem;
    height: 18rem; }

.s_broculin__wrap {
  margin-bottom: -60px; }
  @media (max-width: 991px) {
    .s_broculin__wrap {
      width: 160%;
      -webkit-transform: translateX(-25%);
              transform: translateX(-25%); } }
  .s_broculin__wrap img {
    max-width: 700px;
    display: block;
    margin: 0 auto; }

.s_ph {
  margin-top: 50px; }
  .s_ph h2, .s_ph p {
    padding-left: 15%;
    text-align: right; }
  .s_ph__circle {
    background-color: #c0e4e4;
    width: 14rem;
    height: 14rem;
    top: -15%;
    left: -45%; }
    @media (min-width: 992px) {
      .s_ph__circle {
        left: -20%; } }

.s_editors {
  margin-top: 50px; }
  @media (min-width: 992px) {
    .s_editors {
      margin-top: 100px; } }
  .s_editors h2, .s_editors p {
    padding-left: 40%;
    text-align: right; }
  .s_editors__wrap {
    position: relative; }
  .s_editors__wrap {
    padding-bottom: 25%; }
    @media (min-width: 500px) {
      .s_editors__wrap {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
                flex-direction: column; } }
    @media (min-width: 992px) {
      .s_editors__wrap {
        padding-bottom: 20%; } }
  .s_editors__txt {
    position: relative;
    z-index: 2; }
  .s_editors__img {
    position: absolute;
    top: 10%;
    left: -30%;
    width: 100%;
    max-width: 320px; }
    @media (min-width: 500px) {
      .s_editors__img {
        top: 0;
        left: -10%; } }
    @media (min-width: 992px) {
      .s_editors__img {
        max-width: 400px; } }
  .s_editors__circle {
    position: relative;
    display: inline-block;
    background-color: #f0cd7d;
    width: 9rem;
    height: 9rem;
    -webkit-transform: translate(100%, 10%);
            transform: translate(100%, 10%); }
    @media (min-width: 500px) {
      .s_editors__circle {
        -webkit-transform: translate(120%, 8%);
                transform: translate(120%, 8%); } }
    @media (min-width: 768px) {
      .s_editors__circle {
        -webkit-transform: translate(100%, 50%);
                transform: translate(100%, 50%); } }

.s_glow__wrap {
  position: relative;
  padding-bottom: 13%; }
.s_glow__wrap.OPAD {
  position: relative;
  padding-bottom: 13%; }
  @media (min-width: 768px) {
    .s_glow__wrap {
      padding-bottom: 0; } }

.s_glow__img {
  display: block;
  -webkit-transform: translateX(16%);
          transform: translateX(16%); }
  @media (min-width: 768px) {
    .s_glow__img {
      margin-left: auto;
      max-width: 540px;
      -webkit-transform: none;
              transform: none; }
	.s_glow__img.OPAD {
      position: relative;
      top: 145px; }}
@media (min-width: 1100px) {
    .s_glow__img.OPAD {
      position: relative;
      top: 90px; }}

.s_glow__txt {
  z-index: 2;
  position: absolute;
  bottom: 0;
  left: 0em; }
@media (max-width: 767px) {
	.s_glow__txt.OPAD {
	  bottom: -80px; }}
@media (max-width: 550px) {
	.s_glow__txt.OPAD {
	  bottom: -130px; }}
@media (max-width: 360px) {
	.s_glow__txt.OPAD {
	  bottom: -160px; }}
  @media (min-width: 768px) {
    .s_glow__txt {
      bottom: 25%;
      width: 60%; }
	.s_glow__txt.OPAD {
      bottom: 55%;
	  width: 90%;}}
@media (min-width: 992px) {
    .s_glow__txt.OPAD {
      bottom: 55%;
	  width: 65%;}}

.s_glow__circle {
  top: -4rem;
  left: -5rem;
  width: 11rem;
  height: 11rem;
  background-color: #f8d3c6; }

h2.s_gold__header {
  position: relative;
  text-align: right;
  -webkit-transform: translateY(2.5rem);
          transform: translateY(2.5rem);
  z-index: 2; }
h2.s_gold__header.CMP {
  top: 60px; }

.s_gold__img {
  -webkit-transform: translateX(-16%);
          transform: translateX(-16%); }
  @media (min-width: 768px) {
    .s_gold__img {
      margin-left: auto;
      max-width: 540px; }
    .s_gold__img.CMP {
      position: relative;
      top: 75px; }}

.s_gold__circle {
  background-color: #efe9d9;
  bottom: 5%;
  right: -7rem;
  width: 15rem;
  height: 15rem; }
.s_gold__circle.PROF {
  background-color: #efe9d9;
  bottom: 5%;
  left: -7rem;
  width: 15rem;
  height: 15rem; }

@media (min-width: 992px) {
  .s_gold__row {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex; } }
@media (min-width: 768px) {
  .s_gold__row.PROF {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex; } }

@media (min-width: 992px) {
  .s_gold__col {
    width: 50%; }
.s_gold__wrap.PROF {
	margin-top: 8rem;}}
@media (min-width: 768px) {
  .s_gold__col.PROF {
    width: 50%; }}

@media (min-width: 768px) {
  .s_gold__wrap {
    margin-top: 1rem; }
  .s_gold__wrap.PROF {
    padding-right: 35px; }}
@media (min-width: 768px) {
  .s_gold__wrap.CMP {
    margin-top: 6rem; }}
@media (max-width: 767px) {
	.s_gold__col.PROF img {
		max-width: 420px;
	}
}
.s_glow.OPAD, .s_ha.CMP, .s_gold.PROF {
	margin-bottom: 3rem;
}
@media (max-width: 1099px) {
	.s_glow.OPAD, .s_ha.CMP, .s_gold.PROF {
		margin-bottom: 6rem;
	}
}
@media (max-width: 991px) {
	
}
@media (max-width: 767px) {
	.s_glow.OPAD {
		margin-top: 5rem;
		margin-bottom: 10rem;
	}
	.s_ha.CMP {
		margin-bottom: 10rem;
	}
	.s_gold.PROF {
		margin-top: 5rem;
	}
	.s_gold__row.PROF {
		display: flex;
        flex-direction: column-reverse;
	}
}
@media (max-width: 450px) {
	.s_gold__row.PROF {
		margin-top: 16rem;
	}
	.s_ha__txt.CMP p {
		padding-left: 5%;
	}
}
@media (max-width: 360px) {
	.s_glow.OPAD {
		margin-bottom: 14rem;
	}
}
@media (max-width: 330px) {
	.s_gold__row.PROF {
		margin-top: 20rem;
	}
}

.s_quality__img {
  display: block;
  border-radius: 50%;
  -webkit-transform: scale(1.3) translate(20%, 10%);
          transform: scale(1.3) translate(20%, 10%);
  max-width: 20rem;
  margin-left: auto; }

.s_quality__header {
  font-size: 1.8rem !important;
  line-height: 2rem !important;
  max-width: 10rem; }
.s_quality__txtwrap_bottom .s_quality__header {
  max-width: 22rem; }
  @media (min-width: 992px) {
    .s_quality__header, .s_quality__txtwrap_bottom .s_quality__header {
      max-width: none; } }

.s_quality__txtwrap_top {
    width: 75%;
    position: relative;
	top: -100px; }

.s_quality__txtwrap_bottom {
    position: relative;
	top: -50px; }

@media (max-width: 550px) {
	.s_quality__txtwrap_top {
		top: 10px;
	}
	.s_quality__txtwrap_bottom {
		top: 40px; 
	}
	.s_share {
		margin-top: 10rem;
	}
}

.s_quality__disclaimer {
  margin-top: 2rem;
  font-size: .9rem;
  line-height: 1rem; }

.s_share__wrap {
  position: relative;
  margin-top: 3rem;
  margin-bottom: 10rem; }
  @media (min-width: 500px) {
    .s_share__wrap {
      margin-bottom: 5rem; } }

.s_share__imgwrap {
  -webkit-transform: translateX(-30%);
          transform: translateX(-30%); }
  @media (min-width: 768px) {
    .s_share__imgwrap {
      -webkit-transform: translateX(-20%);
              transform: translateX(-20%); } }

.s_share__img {
  display: block;
  border-radius: 50%;
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  max-width: 20rem; }

.s_share__txt {
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  text-align: right; }
  @media (min-width: 768px) {
    .s_share__txt {
      width: 100%; } }

.s_share__txtinner {
  width: 50%;
  margin-left: auto; }

.s_share h3 {
  margin-top: 0;
  font-size: 1.8rem !important;
  line-height: 2rem !important;
  text-align: right;}

.s_share p {
  margin-bottom: 0; }

.s_share__socialmedia {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
          justify-content: flex-end;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
          align-items: flex-start;
  margin-bottom: 10px;
  font-weight: bolder; }
@media (max-width: 687px) {
    .s_share__socialmedia {
		display:block; }
	.s_share__socialmedia .contact-socialicons {
    	justify-content: right;} }

.s_share__socialicon {
  margin-right: 7px; }
  .s_share__socialicon img {
    display: block;
    max-width: 33px; }

.s_share__circle {
  background-color: #fff;
  bottom: -20%;
  right: -40%;
  width: 15rem;
  height: 15rem; }
  @media (min-width: 768px) {
    .s_share__circle {
      right: -11%;
      bottom: -40%; } }