@charset "UTF-8";
/* =====================================================================





===================================================================== */
/*-----------------------------------
html


・201600901=>"cream_perfection","hc_gel_cleans"用(featureフォルダ内が今後増える可能性を考慮して作成)
・すべてのセクションがttl等ユニークっぽいので１つづつ作成。
・コピーできるセクションがあれば@extendで変更しつつ、ブレークポイントの対応を考える。
・creamからgelまで連番でセクションを命名する
・leadArea等のクラス名削った箇所、命名かぶってしまいそうなのでネストで作成
・sec03、05は全体が斜かかっているので戻さず作成（並行な要素に-skewをかける。）
・hc_gel_cleansはsec09〜
・skewに対するbottom等のmarginはpc＝>75px,105px  sp=>40pxを多用

*memo
$breakPoint00: "only screen and (min-width:1260px)";
$breakPoint01: "only screen and (max-width:900px)";
$breakPoint01_02: "only screen and (max-width:850px)";
$breakPoint02: "only screen and (max-width:770px)";
$breakPoint04: "only screen and (max-width:480px)";
$breakPoint05: "only screen and (max-width:320px)";

-----------------------------------*/
.uno-hairActivest .add-section, .uno-hairActivest .sectionBoxTitle, .uno-hairActivest .productTopic__ttl {
  transform: skewY(-4.5deg);
  -webkit-backface-visibility: hidden;
}

.uno-hairActivest .add-section__inner, .uno-hairActivest .sectionBoxTitle__inner {
  transform: skewY(4.5deg);
  -webkit-backface-visibility: hidden;
}

.uno-hairActivest {
  /*page common
  ---------------------*/
  /*productTopic
  ---------------------*/
  /* productLink */
  /*section common
  ---------------------*/
  /*secKV
  ---------------------*/
  /*sec01
  ---------------------*/
  /*sec02
  ---------------------*/
  /*sec03
  ---------------------*/
  /*sec04
  ---------------------*/
  /*sec05
  ---------------------*/
  /*add amazon banner
  ---------------------*/
}
.uno-hairActivest .l-wrapper {
  overflow: hidden;
  width: auto;
  z-index: 0;
}
.uno-hairActivest .l-wrapper img {
  height: auto;
  max-width: 100%;
}
.uno-hairActivest .l-wrapper:after {
  content: "";
  clear: both;
  display: table;
}
.uno-hairActivest .add-section__link img, .uno-hairActivest .sec05Title__styleBoxs img, .uno-hairActivest .productTopic__inner__img img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.uno-hairActivest .productTopic {
  margin-top: -4%;
}
.uno-hairActivest .productTopic__ttl {
  display: block;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.7;
  padding: 20px 0;
  margin-bottom: 60px;
}
.uno-hairActivest .productTopic__ttl strong {
  font-size: 32px;
}
.uno-hairActivest .productTopic__ttl:before {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  right: 0;
  left: -70%;
  width: 180%;
  background: #fff;
}
.uno-hairActivest .productTopic__inner {
  display: flex;
  max-width: 960px;
  width: 87.5%;
  margin: 0 auto 15px;
}
.uno-hairActivest .productTopic__inner__img {
  position: relative;
  z-index: 1;
  max-width: 450px;
  width: 48.9583333333%;
  margin-right: 2.0833333333%;
  transform: translateY(-40px);
}
.uno-hairActivest .productTopic__inner__wordlist {
  width: 59.375%;
  text-align: left;
}
.uno-hairActivest .wordlist__ttl {
  position: relative;
  font-size: 28px;
  margin: -1em auto 1.5rem;
  line-height: 1.75;
}
.uno-hairActivest .wordlist__ttl span {
  font-weight: bold;
  margin-right: 0.25em;
}
.uno-hairActivest .wordlist__types {
  overflow: hidden;
  position: relative;
  z-index: 2;
}
.uno-hairActivest .wordlist__type {
  float: left;
  position: relative;
  overflow: hidden;
  width: 49%;
  margin: 0 auto 1em;
}
.uno-hairActivest .wordlist__type + .wordlist__type {
  margin-left: 2%;
}
.uno-hairActivest .wordlist__type dt {
  display: block;
  text-align: center;
  border: 2px solid #000;
  border-bottom: none;
  padding: 2px 0 1px;
}
.uno-hairActivest .wordlist__type dd {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 93%;
  white-space: nowrap;
  letter-spacing: -0.25em;
  line-height: 1.15;
  width: 1%;
  height: 2.4em;
  border: 2px solid #000;
  padding: 4px 0 3px;
}
.uno-hairActivest .wordlist__type dd + dd {
  border-left: none;
}
.uno-hairActivest .wordlist__type dd.is-on {
  background: #9f9fa0;
}
.uno-hairActivest .wordlist__type dd.is-half:before, .uno-hairActivest .wordlist__type dd.is-half--b:before {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  display: inline-block;
  background: #9f9fa0;
  width: 50%;
  height: 100%;
  z-index: -1;
}
@media all and (-ms-high-contrast: none) {
  .uno-hairActivest .wordlist__type dd.is-half:before, .uno-hairActivest .wordlist__type dd.is-half--b:before {
    height: 200%;
  }
}
.uno-hairActivest .wordlist__type dd.is-half--b:before {
  left: auto;
  right: 0;
}
.uno-hairActivest .wordlist__txt {
  line-height: 1.9;
  font-size: 100%;
  margin-bottom: 1rem;
}
.uno-hairActivest .productTopic__link {
  display: flex;
  justify-content: center;
}
.uno-hairActivest .productTopic__link__btn {
  width: 46%;
  max-width: 240px;
  margin: 8px 0;
}
.uno-hairActivest .productTopic__link__btn a span {
  padding: 16px 15% 16px 6%;
}
.uno-hairActivest .productTopic__link__btn img {
  vertical-align: baseline;
  max-height: 20px;
}
.uno-hairActivest .productTopic__link__btn + .productTopic__link__btn {
  margin-left: 15px;
}
.uno-hairActivest .sectionBoxTitle {
  background: #000;
  background: linear-gradient(to right, black 0%, #333333 100%);
  text-align: center;
  margin: -4.5% auto -7%;
  padding: 100px 20px;
}
.uno-hairActivest .sectionBoxTitle__inner {
  color: #fff;
}
.uno-hairActivest .sectionBoxMain {
  background: url(../../feature/hair_activest/img/bg.jpg) no-repeat center top;
  background-size: 100% 100%;
  padding: 12% 0;
}
.uno-hairActivest .sectionBoxMain:before, .uno-hairActivest .sectionBoxMain:after {
  content: "";
  clear: both;
  display: table;
}
.uno-hairActivest .sectionBoxKv__inner {
  position: relative;
  overflow: hidden;
  padding: 0 0 54.45%;
}
.uno-hairActivest .sectionBoxKv__inner:after {
  content: "";
  display: block;
}
.uno-hairActivest .keyVisual__bg {
  display: block;
  width: 100%;
  height: 100%;
  background: url(../../feature/hair_activest/img/kv.jpg) no-repeat center top;
  background-size: 100% auto;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  position: absolute;
  top: 0;
}
.uno-hairActivest .keyVisual__ttl {
  position: absolute;
  top: 5.1470588235%;
  bottom: 9.5588235294%;
  left: 0;
  right: 0;
  width: 70.5882352941%;
  margin: auto;
}
.uno-hairActivest .keyVisual__ttl img {
  width: 75%;
  height: auto;
}
.uno-hairActivest .sectionBox01__inner {
  max-width: 960px;
  width: 87.5%;
  margin: 0 auto;
}
.uno-hairActivest .sectionBox01__serifLists {
  display: flex;
  justify-content: space-between;
}
.uno-hairActivest .sectionBox01__serifList {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 115%;
  width: 29.1666666667%;
  background: #fff;
  padding: 20px 10px 15px;
}
.uno-hairActivest .sectionBox01__serifList em {
  position: relative;
  display: inline-block;
  font-size: 136%;
  font-style: normal;
}
.uno-hairActivest .sectionBox01__serifList em:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 2px;
  background: #000;
  height: 2px;
  width: 100%;
}
.uno-hairActivest .sectionBox01__serifList:after {
  content: "";
  border: 14px solid transparent;
  border-top: 14px solid #fff;
  position: absolute;
  margin: auto;
  bottom: -28px;
}
@media all and (-ms-high-contrast: none) {
  .uno-hairActivest .sectionBox01__serifList:after {
    width: 0;
    left: 0;
    right: 0;
  }
}
.uno-hairActivest .sectionBox01__dataLists {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 250px;
  margin-bottom: 15px;
}
.uno-hairActivest .sectionBox01__dataList {
  width: 30.7291666667%;
  text-align: center;
}
.uno-hairActivest .sectionBox01__dataList .sectionBox01__serifList {
  display: none;
}
.uno-hairActivest .sectionBox01__dataList svg .timer {
  position: relative;
  text-decoration: underline;
  transform: translateY(5px);
}
.uno-hairActivest .sectionBox01__dataList svg .number {
  font-family: helvecica;
  font-size: 54px;
}
@media all and (-ms-high-contrast: none) {
  .uno-hairActivest .sectionBox01__dataList svg {
    transform: scale(1.5) translateY(10%);
  }
}
.uno-hairActivest .sectionBox01__cau {
  text-align: center;
}
.uno-hairActivest .sectionBox02 .sectionBoxTitle {
  background: linear-gradient(to right, #333333 0%, black 100%);
}
.uno-hairActivest .sectionBox03 .sectionBoxTitle {
  position: relative;
  z-index: 1;
  padding: 80px 20px;
}
.uno-hairActivest .sectionBox03 .sectionBoxMain {
  position: relative;
  padding: 12% 0;
}
.uno-hairActivest .sectionBox03 .sectionBoxMain:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 41.4285714286%;
  background: url(../../feature/hair_activest/img/sec03_bg.jpg) no-repeat right top;
  background-position: right 4vw;
  background-size: cover;
}
.uno-hairActivest .sectionBox03 .sectionBoxMain__inner {
  overflow: hidden;
  width: 91.6666666667%;
  max-width: 960px;
  margin: auto;
}
.uno-hairActivest .sectionBox03__img {
  position: absolute;
  z-index: 1;
  top: 2.8571428571%;
  bottom: -10%;
  width: 24.2857142857%;
  width: 31.5vw;
  background: url(../../feature/hair_activest/img/sec03_img.png) no-repeat left top;
  background-size: contain;
}
.uno-hairActivest .sectionBox03__main {
  position: relative;
  width: 47.9166666667%;
  float: right;
  text-align: center;
  background: #fff;
  padding: 7.4074074074% 5.5555555556%;
  margin: 1.8518518519% auto;
}
.uno-hairActivest .sectionBox03__main__txt {
  font-size: 186%;
  margin-bottom: 5.5555555556%;
}
.uno-hairActivest .sectionBox03__main__lists {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.uno-hairActivest .sectionBox03__main__lists:after {
  content: "";
  display: block;
  width: 1.15em;
  height: 1.15em;
  border-right: solid 2px #000;
  border-bottom: solid 2px #000;
  margin: 15px auto 20px;
  transform: rotate(45deg);
}
.uno-hairActivest .sectionBox03__main__list {
  width: 48%;
  font-size: 129%;
  white-space: nowrap;
  border: 2px solid #000;
  padding: 10px 0;
  margin-bottom: 10px;
}
.uno-hairActivest .sectionBox03__main__word {
  font-size: 200%;
}
.uno-hairActivest .sectionBox03__main__word strong {
  display: block;
  font-size: 40px;
}
.uno-hairActivest .sectionBox04 .sectionBoxTitle {
  position: relative;
  z-index: 1;
  background: linear-gradient(to right, #333333 0%, black 100%);
  padding: 80px 20px;
}
.uno-hairActivest .sectionBox04 .sectionBoxMain {
  position: relative;
  padding: 12% 0;
}
.uno-hairActivest .sectionBox04 .sectionBoxMain:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 21.4285714286%;
  background: url(../../feature/hair_activest/img/sec04_bg.jpg) no-repeat right top;
  background-position: right 2vw;
  background-size: cover;
}
.uno-hairActivest .sectionBox04 .sectionBoxMain__inner {
  width: 91.6666666667%;
  max-width: 960px;
  margin: auto;
}
.uno-hairActivest .sectionBox04__img {
  position: absolute;
  z-index: 1;
  top: 2.8571428571%;
  right: -50%;
  left: 45vw;
  bottom: -10%;
  width: 39.2857142857%;
  width: 50.5vw;
  background: url(../../feature/hair_activest/img/sec04_img.png) no-repeat right bottom;
  background-size: contain;
}
.uno-hairActivest .sectionBox04__main {
  position: relative;
  float: left;
  width: 47.9166666667%;
  text-align: center;
  background: #fff;
  padding: 3.7037037037% 5.5555555556% 5.5555555556%;
  margin: 1.8518518519% auto 0;
}
.uno-hairActivest .sectionBox04__main:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 10px;
  left: -25px;
  width: 24.0740740741%;
  background: url(../../feature/hair_activest/img/sec04_icon.png) no-repeat center bottom;
  background-size: 100% auto;
}
.uno-hairActivest .sectionBox04__main__txt {
  font-size: 129%;
  line-height: 2;
  margin-bottom: 5.5555555556%;
}
.uno-hairActivest .sectionBox04__main__txt:after {
  content: "";
  display: block;
  width: 1.15em;
  height: 1.15em;
  border-right: solid 2px #000;
  border-bottom: solid 2px #000;
  margin: 15px auto 20px;
  transform: rotate(45deg);
}
.uno-hairActivest .sectionBox04__main__word {
  font-size: 200%;
}
.uno-hairActivest .sectionBox04__main__word strong {
  display: block;
  font-size: 40px;
}
.uno-hairActivest .sectionBox05 .sectionBoxTitle {
  background: #000;
}
.uno-hairActivest .sec05Title {
  width: 85.9375%;
  max-width: 820px;
  margin: auto;
}
.uno-hairActivest .sec05Title__lead {
  font-size: 229%;
  margin-bottom: 10.9756097561%;
}
.uno-hairActivest .sec05Title__styleBoxs {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 12.1951219512%;
}
.uno-hairActivest .sec05Title__styleBoxs .productTopic__link__btn {
  width: 100%;
}
@media all and (-ms-high-contrast: none) {
  .uno-hairActivest .sec05Title__styleBoxs .productTopic__link__btn img {
    width: auto;
  }
}
.uno-hairActivest .sec05Title__styleBox__txt {
  font-size: 158%;
  margin-bottom: 3.6585365854%;
}
.uno-hairActivest .sec05Title__styleBox__img {
  margin-bottom: 3.2%;
}
.uno-hairActivest .sec05Title__styleBox__lists {
  display: flex;
  justify-content: space-between;
  margin-bottom: 9.756097561%;
}
.uno-hairActivest .sec05Title__styleBox__list {
  width: 32%;
}
.uno-hairActivest .sec05Title__styleBox {
  width: 47.5609756098%;
}
.uno-hairActivest .add-section {
  position: relative;
  text-align: center;
  background: #fff;
  padding: 14.7058823529% 0 6.6176470588%;
  margin: -4.5% auto 150px;
}
.uno-hairActivest .add-section__inner {
  position: relative;
  margin: auto;
}
.uno-hairActivest .add-section__ttl {
  font-size: 22px;
  margin-bottom: 50px;
}
.uno-hairActivest .add-section__link {
  max-width: 700px;
  margin: auto;
}
.uno-hairActivest .add-section__link .linkCover--red {
  display: inline-block;
  background: #000;
  padding: 10px 17.1428571429%;
}

/*---------------------*/
/*---------------------*/
/*---------------------*/
/*---------------------*/
@media only screen and (max-width:900px) {
  .uno-hairActivest .productTopic__ttl {
    font-size: 2.15vw;
  }
  .uno-hairActivest .productTopic__ttl strong {
    font-size: 3.8vw;
  }
  .uno-hairActivest .productTopic__inner {
    display: block;
  }
  .uno-hairActivest .productTopic__inner__img {
    margin: auto;
  }
  .uno-hairActivest .productTopic__inner__wordlist {
    width: 88.8888888889%;
    margin: auto;
  }
  .uno-hairActivest .sectionBox01__dataLists {
    min-height: 25.5vw;
  }
  .uno-hairActivest .sectionBox01__serifList {
    font-size: 1.45vw;
  }
  .uno-hairActivest .sectionBox01__serifList em {
    font-size: 2.25vw;
  }
  .uno-hairActivest .sectionBox03__main__list {
    font-size: 1.85vw;
  }
  .uno-hairActivest .sectionBox03__main__txt {
    font-size: 2.75vw;
  }
  .uno-hairActivest .sectionBox04__main__txt {
    font-size: 1.95vw;
  }
  .uno-hairActivest .sectionBox03__main__word,
.uno-hairActivest .sectionBox04__main__word {
    font-size: 3.25vw;
  }
  .uno-hairActivest .sectionBox03__main__word strong,
.uno-hairActivest .sectionBox04__main__word strong {
    font-size: 4.25vw;
  }
  .uno-hairActivest .sec05Title__styleBox__txt {
    font-size: 2.3vw;
  }
}
@media only screen and (max-width:770px) {
  .uno-hairActivest {
    /*productTopic
    ---------------------*/
    /*secKv
    ---------------------*/
    /*section common
    ---------------------*/
    /*sec01
    ---------------------*/
    /*sec02
    ---------------------*/
    /*sec03
    ---------------------*/
    /*sec04
    ---------------------*/
    /*sec05
    ---------------------*/
    /*add-section
    ---------------------*/
  }
  .uno-hairActivest .l-wrapper__inner {
    margin: 10px;
  }
  .uno-hairActivest .productTopic {
    margin-top: 8.5%;
  }
  .uno-hairActivest .productTopic__ttl {
    font-feature-settings: "palt";
    text-align: center;
    font-size: 10px;
    font-size: 2.65vw;
    line-height: 1.85;
    width: 115%;
    margin: 7.2% -8% 15%;
    padding: 3.3333333333% 0;
  }
  .uno-hairActivest .productTopic__ttl strong {
    display: block;
    font-size: 20px;
    font-size: 4.9vw;
  }
  .uno-hairActivest .productTopic__ttl:before {
    left: 0;
    width: 97%;
  }
  .uno-hairActivest .productTopic__inner {
    display: block;
  }
  .uno-hairActivest .productTopic__inner__img {
    width: 80%;
    max-width: 420px;
    float: none;
    text-align: center;
    margin: -40% auto 0;
    transform: translateX(5%);
  }
  .uno-hairActivest .productTopic__inner__img img {
    width: auto;
  }
  .uno-hairActivest .productTopic__inner__wordlist {
    width: auto;
    text-align: center;
    margin: auto;
  }
  .uno-hairActivest .wordlist__ttl {
    text-align: center;
    font-size: 16px;
    font-size: 4.45vw;
  }
  .uno-hairActivest .wordlist__ttl span {
    display: block;
    font-size: 16px;
    font-size: 4.45vw;
    margin-right: 0;
  }
  .uno-hairActivest .wordlist__types {
    margin: auto;
    max-width: 500px;
  }
  .uno-hairActivest .wordlist__type {
    font-size: 108%;
    float: none;
    width: auto;
  }
  .uno-hairActivest .wordlist__type dd {
    letter-spacing: -0.15em;
    padding: 8px 0 6px;
    height: auto;
  }
  .uno-hairActivest .wordlist__type + .wordlist__type {
    margin-top: 15px;
    margin-left: 0;
  }
  .uno-hairActivest .wordlist__txt {
    max-width: 500px;
    font-size: 12px;
    font-size: 3.45vw;
    display: inline-block;
    text-align: center;
  }
  .uno-hairActivest .wordlist__txt li {
    text-align: left;
    line-height: 1.7;
  }
  .uno-hairActivest .wordlist__btn {
    display: block;
    text-align: center;
  }
  .uno-hairActivest .wordlist__btn__01 {
    display: block;
    text-align: left;
    width: 80%;
    max-width: 216px;
    margin: 8px auto;
  }
  .uno-hairActivest .wordlist__btn__01 a span {
    padding: 12px 42px 12px 12px;
  }
  .uno-hairActivest .wordlist__btn__01 + .wordlist__btn__01 {
    margin-left: auto;
  }
  .uno-hairActivest .productTopic__link {
    display: block;
  }
  .uno-hairActivest .productTopic__link__btn {
    display: block;
    width: 62.5%;
    max-width: 250px;
    margin: 0 auto;
  }
  .uno-hairActivest .productTopic__link__btn + .productTopic__link__btn {
    margin: 3.125% auto 0;
  }
  .uno-hairActivest .sectionBoxKv__inner {
    padding-bottom: 96.875%;
  }
  .uno-hairActivest .keyVisual__bg {
    background: url(../../feature/hair_activest/img/kv_sp.jpg) no-repeat center top;
    background-size: 100% auto;
  }
  .uno-hairActivest .keyVisual__ttl {
    display: none;
  }
  .uno-hairActivest .sectionBoxTitle {
    margin: -4.6875% auto -12.5%;
    padding: 12.5% 3.125% 15.625%;
  }
  .uno-hairActivest .sectionBoxTitle__inner {
    margin: auto;
  }
  .uno-hairActivest .sectionBoxMain {
    background: url(../../feature/hair_activest/img/bg_sp.jpg) no-repeat center top;
    background-size: 100% 100%;
    padding: 30% 0 25%;
  }
  .uno-hairActivest .sectionBox01 .sectionBoxTitle__inner {
    width: 75%;
  }
  .uno-hairActivest .sectionBox01__serifLists {
    display: none;
  }
  .uno-hairActivest .sectionBox01__serifList {
    font-size: 4vw;
    min-height: 20vw;
    padding: 3.125% 10px;
  }
  .uno-hairActivest .sectionBox01__serifList em {
    font-size: 5vw;
  }
  .uno-hairActivest .sectionBox01__serifList:after {
    content: "";
    border: 4vw solid transparent;
    border-top: 4vw solid #fff;
    position: absolute;
    margin: auto;
    bottom: -8vw;
  }
  .uno-hairActivest .sectionBox01__dataLists {
    display: block;
    min-height: 0;
    margin-bottom: 0;
  }
  .uno-hairActivest .sectionBox01__dataList {
    width: auto;
    min-height: 90vw;
  }
  .uno-hairActivest .sectionBox01__dataList .sectionBox01__serifList {
    display: flex;
    width: 68.75%;
    margin: 0 auto -6.25%;
  }
  .uno-hairActivest .sectionBox01__dataList + .sectionBox01__dataList {
    margin-top: 4.6875%;
  }
  .uno-hairActivest .sectionBox02 .sectionBoxTitle__inner {
    width: 93.75%;
  }
  .uno-hairActivest .sectionBox03 .sectionBoxTitle {
    padding: 12.5% 3.125% 14.0625%;
  }
  .uno-hairActivest .sectionBox03 .sectionBoxTitle__inner {
    width: 85.9375%;
  }
  .uno-hairActivest .sectionBox03 .sectionBoxMain:before {
    content: "";
    display: inline-block;
    position: relative;
    width: 100%;
    background: url(../../feature/hair_activest/img/sec03_bg_sp.jpg) no-repeat right top;
    background-position: center top;
    background-size: cover;
    padding-bottom: 85%;
    margin: -4% 0 -30%;
  }
  .uno-hairActivest .sectionBox03__img {
    top: 3.2%;
    width: 49.8%;
    background: url(../../feature/hair_activest/img/sec03_img_sp.png) no-repeat left top;
    background-size: contain;
  }
  .uno-hairActivest .sectionBox03__main {
    z-index: 1;
    float: none;
    width: 85.9375%;
    max-width: 500px;
    background: rgba(255, 255, 255, 0.75);
    margin-bottom: 12.5%;
  }
  .uno-hairActivest .sectionBox03__main__txt {
    font-size: 4.25vw;
  }
  .uno-hairActivest .sectionBox03__main__lists:after {
    margin: 3.125% auto 6.25%;
  }
  .uno-hairActivest .sectionBox03__main__list {
    font-size: 2.85vw;
    width: 47%;
    border: 3px solid #000;
    margin-bottom: 1.5625%;
    padding: 6px 0;
  }
  .uno-hairActivest .sectionBox03__main__word {
    font-size: 4.45vw;
  }
  .uno-hairActivest .sectionBox03__main__word strong {
    font-size: 5.95vw;
  }
  .uno-hairActivest .sectionBox04 .sectionBoxTitle {
    padding: 12.5% 3.125% 14.0625%;
  }
  .uno-hairActivest .sectionBox04 .sectionBoxTitle__inner {
    width: 75%;
  }
  .uno-hairActivest .sectionBox04 .sectionBoxMain:before {
    content: "";
    display: inline-block;
    position: relative;
    width: 100%;
    background: url(../../feature/hair_activest/img/sec04_bg_sp.jpg) no-repeat right top;
    background-position: center top;
    background-size: cover;
    padding-bottom: 85%;
    margin: -4% 0 -40%;
  }
  .uno-hairActivest .sectionBox04__img {
    top: 3.2%;
    width: 70%;
    left: -5%;
    right: 0;
    margin: auto;
    background: url(../../feature/hair_activest/img/sec04_img_sp.png) no-repeat center top;
    background-size: contain;
  }
  .uno-hairActivest .sectionBox04__main {
    z-index: 1;
    float: none;
    width: 85.9375%;
    max-width: 500px;
    background: rgba(255, 255, 255, 0.75);
    padding: 7.2727272727% 5.4545454545%;
    margin-bottom: 12.5%;
  }
  .uno-hairActivest .sectionBox04__main:before {
    left: -5.4545454545%;
  }
  .uno-hairActivest .sectionBox04__main__txt {
    font-size: 3.25vw;
  }
  .uno-hairActivest .sectionBox04__main__word {
    font-size: 4.45vw;
  }
  .uno-hairActivest .sectionBox04__main__word strong {
    font-size: 5.95vw;
  }
  .uno-hairActivest .sec05Title__lead {
    font-size: 5vw;
  }
  .uno-hairActivest .sec05Title__styleBoxs {
    display: block;
    margin-bottom: 17.2413793103%;
  }
  .uno-hairActivest .sec05Title__styleBox {
    width: auto;
  }
  .uno-hairActivest .sec05Title__styleBox + .sec05Title__styleBox {
    margin-top: 17.2413793103%;
  }
  .uno-hairActivest .sec05Title__styleBox__list {
    width: 31%;
  }
  .uno-hairActivest .sec05Title__styleBox__txt {
    font-size: 4.15vw;
    margin-bottom: 5.1724137931%;
  }
  .uno-hairActivest .add-section {
    margin-bottom: 0;
  }
  .uno-hairActivest .add-section__ttl {
    font-size: 14px;
    font-size: 4.25vw;
    margin-bottom: 6.6666666667%;
  }
  .uno-hairActivest .add-section__link {
    width: 87.5%;
  }
  .uno-hairActivest .add-section__link .linkCover--red {
    display: inline-block;
    background: #000;
    padding: 10px 6.25%;
  }
}
@media only screen and (max-width:770px) and (-ms-high-contrast: none) {
  .uno-hairActivest .add-section__link img {
    width: 100%;
    height: auto;
  }
}
@media only screen and (max-width:770px) and (-ms-high-contrast: none) {
  .uno-hairActivest .sectionBox01__dataList svg {
    position: absolute;
    width: 100%;
    transform: scale(1.5) translateY(10vw);
  }
  .uno-hairActivest .sectionBox01__dataList .js-ignitionPoint {
    position: relative;
    padding-bottom: 40%;
  }
}