@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@900&display=swap");

.hydrolyzed {
  background-color: #efefef;

}

.hydrolyzed img {
  max-width: 100%;
}

.hydrolyzed_block1 {
  width: 100%;
  /* Permalink - use to edit and share this gradient. 固定鏈接 - 用於編輯和分享此漸變： https://colorzilla.com/gradient-editor/#895095+0,ac7eb0+47,2b2142+100 */
  background: linear-gradient(to bottom, rgba(145, 84, 158, 1) 0%, rgba(172, 126, 176, 1) 47%, rgba(43, 33, 66, 1) 80%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */


}

.hydrolyzed_block_top {
  position: relative;
  padding: 0 0 70px;
}

.hydrolyzed_s1 {
  position: absolute;
  width: 190px;
  top: 90px;
  left: 280px;
}

.hydrolyzed_s1 p {
  margin: 0;
  padding: 10px 0 0;
  font-size: 18px;
  font-weight: bold;
  text-align: justify;
  color: #fff;
}

.hydrolyzed_s2 {
  position: absolute;
  width: 260px;
  bottom: 80px;
  left: 600px;
}

.hydrolyzed_s2 p {
  margin: 0;
  padding: 10px 0 0;
  font-size: 18px;
  font-weight: bold;
  text-align: justify;
  color: #fff;
}

.hydrolyzed_s3 {
  position: absolute;
  width: 220px;
  bottom: 40px;
  left: 260px;
}

.hydrolyzed_s3 p {
  margin: 0;
  padding: 10px 0 0;
  font-size: 18px;
  font-weight: bold;
  text-align: justify;
  color: #fff;
}

.hydrolyzed_block_bottom {
  padding: 40px 0 400px;
  position: relative;

}

.hydrolyzed_block_bottom_title {
  width: 100%;
  margin: 0 0 60px;
}

.hydrolyzed_block_bottom_vs {
  position: absolute;
  width: 700px;
  top: 60%;
  left: 45%;
  transform: translate(-50%, -50%);

}

.hydrolyzed_block_bottom_l {
  font-size: 23px;
  font-weight: bold;
  color: #fff;
  width: 200px;
  text-align: center;
  position: absolute;
  bottom: 45px;
  left: 125px;
}

.hydrolyzed_block_bottom_r {
  font-size: 23px;
  font-weight: bold;
  color: #fff;
  width: 200px;
  text-align: center;
  position: absolute;
  bottom: 45px;
  left: 225px;
}

.hydrolyzed_block_bottom_r {
  font-size: 23px;
  font-weight: bold;
  color: #fff;
  width: 200px;
  text-align: center;
  position: absolute;
  bottom: 45px;
  left: 460px;
}

.hydrolyzed_block2 {
  background-color: #efefef;
}

.hydrolyzed_icon {
  text-align: center;
  padding: 25px 0;
}

.hydrolyzed_icon_row {
  display: inline-block;
  width: 280px;
}

.hydrolyzed_icon_img {
  max-width: 180px;
  margin: 0 auto;

}

.hydrolyzed_icon_row p {
  color: #e0ae50;
  font-size: 23px;
  font-weight: bold;
  padding: 15px 0 0;
}

.hydrolyzed_footer {
  text-align: center;
  padding: 40px 0 60px;

}

.hydrolyzed_footer_text {
  display: inline-block;
  width: 700px;
  text-align: left;
  font-size: 10px;
  color: #231815;

}

.hydrolyzed_block2_text {
  font-size: 35px;
  color: #898989;
  font-weight: bold;
  display: inline-block;
  vertical-align: text-top;
}

.hydrolyzed_block2_img {
  max-width: 350px;
  margin: 0 auto;
  display: inline-block;

}

.hydrolyzed_block2_text span {
  display: block;
  color: #172a88;
}

.hydrolyzed_block2_top {
  text-align: center;
}

.dk {
  display: block;
}

.mo {
  display: none;
}

@media screen and (max-width: 768px) {
  .dk {
    display: none;
  }

  .mo {
    display: block;
  }

  .hydrolyzed_s1 {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    padding: 15px;
    display: flex;
  }

  .hydrolyzed_s2 {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    padding: 15px;
    display: flex;
    bottom: inherit;
  }

  .hydrolyzed_s3 {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    padding: 15px;
    display: flex;
    bottom: inherit;
  }

  .hydrolyzed_sub {
    flex: 0 0;
    flex-basis: 121px;
  }

  .hydrolyzed_sub_text {
    flex-grow: 2;
    padding: 0 0 0 10px;
  }

  .hydrolyzed_s1 p {
    margin: 0;
    padding: 10px 0 0;
    font-size: 16px;
    font-weight: bold;
    text-align: justify;
    color: #fff;
  }

  .hydrolyzed_s2 p {
    margin: 0;
    padding: 10px 0 0;
    font-size: 16px;
    font-weight: bold;
    text-align: justify;
    color: #fff;
  }

  .hydrolyzed_s3 p {
    margin: 0;
    padding: 10px 0 0;
    font-size: 16px;
    font-weight: bold;
    text-align: justify;
    color: #fff;
  }

  .hydrolyzed_block_bottom {
    padding: 15px;
    position: relative;
  }

  .hydrolyzed_block_bottom_vs {
    position: relative;
    width: 100%;
    top: inherit;
    left: inherit;
    transform: inherit;
  }

  .hydrolyzed_block2_text {
    font-size: 24px;
    color: #898989;
    font-weight: bold;
    display: inline-block;
    vertical-align: text-top;
  }

  .hydrolyzed_block2_img {
    max-width: 150px;
    margin: 0 auto;
    display: inline-block;
  }

  .hydrolyzed_icon_row {
    display: inline-block;
    width: 100%;
    margin: 0 0 30px;
  }

  .hydrolyzed_icon_row p {
    color: #e0ae50;
    font-size: 19px;
    font-weight: bold;
    padding: 15px 0 0;
  }

  .hydrolyzed_footer {
    text-align: center;
    padding: 0px 15px 60px;
  }

  .hydrolyzed_footer_text {
    display: inline-block;
    width: 100%;
    text-align: left;
    font-size: 10px;
    color: #231815;
  }
  .hydrolyzed_sub_img{
    width:230px;
  }
  .hydrolyzed_sub_img img{
    width: 100%;
  }
}
@media screen and (max-width: 430px) {
    .hydrolyzed_sub_img{
    width: 230px;
  }
  .hydrolyzed_sub_img img{
    width: 100%;
  }
}

@media screen and (max-width:390px) {
    .hydrolyzed_sub_img{
    width: 190px;
  }
  .hydrolyzed_sub_img img{
    width: 100%;
  }
}