@charset "utf-8";
/*===================================================== 
 * Last Up Date: 2022/11/20
=====================================================*/
/**----- contents -------
1:common
2:global
3:evidence_mainvs
4:evidence_background
5:evidence_about
6:evidence_result
7:evidence_link
8:evidence_products
9:evidence_banner
----------------------*/
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;400;500&display=swap");
/*== 1:common ==================*/
html {
  width: 100%;
  overflow: auto;
  box-sizing: border-box;
  font-size: 62.5%;
}
body {
  font-family: "M PLUS Rounded 1c", "ヒラギノ角ゴシック", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #333;
  font-size: 1.2rem;
  height: 100%;
  background: #fff;
}
@media screen and (1024px <= width) {
  #tube-butter-global-header #tube-butter-global-header-menu-frame .menu_inner > ul {
    padding-left: 0;
    margin-top: 0;
  }
  #tube-butter-global-header .cd_pc_only {
    display: block;
  }
}
@media screen and (width <= 768px) {
  #tube-butter-global-header #tube-butter-global-header-sp-ctrl > ul {
    padding-left: 0;
    margin: 0 auto;
  }
}
#evidence #tube-butter-global-header li {
  list-style: none;
}
@media screen and (width <= 768px) {
  #tube-butter-global-header #tube-butter-global-header-menu-frame .menu_inner > ul {
    margin: 0 auto;
  }
  #tube-butter-global-header .cd_pc_only {
    display: block;
  }
}
/* Firefox */
@-moz-document url-prefix() {
  .ff {
    transform: rotate(0.03deg);
  }
}
img {
  display: block;
  width: 100%;
  height: auto;
}
.cont_inner {
  width: 1000px;
  margin: auto;
  box-sizing: border-box;
}
.fade_off {
  opacity: 0;
  transition: all 1s;
}
.fade_on {
  opacity: 1;
}
.fade_il::before,
.fade_il::after {
  opacity: 0;
  transition: all 1s 0.5s ease;
}
.fade_il_on::before,
.fade_il_on::after {
  opacity: 1;
}
.slide::before {
  transition: all 1s;
}
.slide_right::before {
  right: -300px !important;
}
.slide_left::before {
  left: -300px !important;
}
.slide_right.slide_act::before {
  right: 0 !important;
}
.slide_left.slide_act::before {
  left: 0 !important;
}
.on {
  display: block !important;
}
.sp {
  display: none;
}
.red {
  color: #ff0000;
}
@media screen and (max-width: 1023px) {
  .cont_inner {
    width: 91.867vw;
  }
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}
/*==============================*/
/*== 2:global ==================*/
.l-header {
  font-size: initial;
  background: #fff;
}
.l-header img {
  z-index: 9000;
}
.m-nav-product-list img {
  display: inline;
}
/*main.l-main > .l-container {
 line-height: 1;
}*/
footer img {
  display: inline;
}
.l-footer {
  line-height: 2;
}
@media screen and (width <= 768px) {
  main.l-main > .l-container {
    line-height: 1;
  }
}
/*==============================*/
/*== 3:evidence_mainvs =========*/
#evidence_mainvs {
  margin-bottom: 50px;
  background: url("../images/evidence_mainvs_bg.png") repeat-x top center;
}
#evidence_mainvs .cont_inner {
  position: relative;
  min-height: 560px;
  padding-top: 120px;
  z-index: 0;
}
#evidence_mainvs .cont_inner h1 {
  width: 629px;
  margin: 0 auto;
  opacity: 0;
  animation: fadeIn01 1s ease 0s forwards;
}
#evidence_mainvs .cont_inner .il_01 {
  position: absolute;
  top: 33px;
  left: 215px;
  width: 53px;
  animation: fadeIn01 1s ease 0.1s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_02 {
  position: absolute;
  top: 171px;
  left: 22px;
  width: 72px;
  animation: fadeIn01 1.3s ease 0.1s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_03 {
  position: absolute;
  bottom: 110px;
  left: -50px;
  width: 63px;
  animation: fadeIn01 1.5s ease 0.3s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_04 {
  position: absolute;
  bottom: 45px;
  left: 198px;
  width: 73px;
  animation: fadeIn01 1.5s ease 0.4s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_05 {
  position: absolute;
  top: 16px;
  right: 242px;
  width: 81px;
  animation: fadeIn01 1.5s ease 0.3s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_06 {
  position: absolute;
  bottom: 41px;
  right: 346px;
  width: 115px;
  animation: fadeIn01 1.5s ease 0.2s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_07 {
  position: absolute;
  top: 125px;
  right: 45px;
  width: 73px;
  animation: fadeIn01 1.3s ease 0.1s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_08 {
  position: absolute;
  bottom: 185px;
  right: 11px;
  width: 96px;
  animation: fadeIn01 1s ease 0.1s forwards;
  opacity: 0;
}
#evidence_mainvs .cont_inner .il_09 {
  position: absolute;
  bottom: 25px;
  right: 115px;
  width: 75px;
  animation: fadeIn01 1.5s ease 0.5s forwards;
  opacity: 0;
}
/*--Animation--*/
@keyframes fadeIn01 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*--//Animation--*/
@media screen and (max-width: 1023px) {
  #evidence_mainvs {
    margin-bottom: 6.66vw;
    background: url("../images/evidence_mainvs_bg_sp.png") repeat-x top center;
    background-size: contain;
  }
  #evidence_mainvs .cont_inner {
    position: relative;
    width: 100vw;
    min-height: 113.33vw;
    padding: 32vw 2vw 0;
    z-index: 0;
  }
  #evidence_mainvs .cont_inner h1 {
    width: 83.86vw;
    margin: auto;
    opacity: 0;
    animation: fadeIn01 1s ease 0s forwards;
  }
  #evidence_mainvs .cont_inner .il_01 {
    position: absolute;
    top: 7.46vw;
    left: 31vw;
    width: 8.53vw;
    animation: fadeIn01 1s ease 0.1s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_02 {
    position: absolute;
    top: 14.66vw;
    left: 8vw;
    width: 10vw;
    animation: fadeIn01 1.3s ease 0.1s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_03 {
    position: absolute;
    bottom: 7vw;
    left: 4.4vw;
    width: 10.66vw;
    animation: fadeIn01 1.5s ease 0.3s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_04 {
    position: absolute;
    bottom: 21.86vw;
    left: 22.4vw;
    width: 13.86vw;
    animation: fadeIn01 1.5s ease 0.4s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_05 {
    position: absolute;
    top: 11vw;
    right: 30vw;
    width: 11.2vw;
    animation: fadeIn01 1.5s ease 0.3s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_06 {
    position: absolute;
    bottom: 6vw;
    right: 40vw;
    width: 16.8vw;
    animation: fadeIn01 1.5s ease 0.2s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_07 {
    position: absolute;
    top: 20.4vw;
    right: 3.33vw;
    width: 11.73vw;
    animation: fadeIn01 1.3s ease 0.1s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_08 {
    position: absolute;
    bottom: 5.33vw;
    right: 4.4vw;
    width: 14.66vw;
    animation: fadeIn01 1s ease 0.1s forwards;
    opacity: 0;
  }
  #evidence_mainvs .cont_inner .il_09 {
    position: absolute;
    bottom: 17.33vw;
    right: 23.6vw;
    width: 10.66vw;
    animation: fadeIn01 1.5s ease 0.5s forwards;
    opacity: 0;
  }
}
/*==============================*/
/*== 4:evidence_background =========*/
#evidence_background .cont_inner {
  position: relative;
  padding: 70px 0 100px;
}
#evidence_background .cont_inner::before {
  position: absolute;
  bottom: 85px;
  left: 143px;
  content: "";
  width: 51px;
  height: 80px;
  background: url("../images/il_01.svg") top left no-repeat;
  background-size: 51px auto;
}
#evidence_background .cont_inner::after {
  position: absolute;
  bottom: 27px;
  right: 135px;
  content: "";
  width: 70px;
  height: 121px;
  background: url("../images/il_02.svg") top left no-repeat;
  background-size: 70px auto;
}
#evidence_background .cont_inner h2 {
  width: 204px;
  margin: 0 auto;
}
#evidence_background .cont_inner p {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.8;
  text-align: center;
}
@media screen and (max-width: 1023px) {
  #evidence_background .cont_inner {
    position: relative;
    padding: 9vw 0;
  }
  #evidence_background .cont_inner::before {
    position: absolute;
    top: 14.4vw;
    left: 4vw;
    content: "";
    width: 8.53vw;
    height: 13.33vw;
    background: url("../images/il_01.svg") top left no-repeat;
    background-size: 8.53vw auto;
    z-index: 1;
  }
  #evidence_background .cont_inner::after {
    position: absolute;
    bottom: -5vw;
    right: 3.6vw;
    content: "";
    width: 9.33vw;
    height: 16.13vw;
    background: url("../images/il_02.svg") top left no-repeat;
    background-size: 9.33vw auto;
    z-index: 1;
  }
  #evidence_background .cont_inner h2 {
    width: 32.53vw;
    margin: 0 auto;
  }
  #evidence_background .cont_inner p {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.6;
    text-align: center;
  }
}
/*==============================*/
/*== 5:evidence_about =============*/
#evidence_about {
  position: relative;
  margin-bottom: 30px;
}
#evidence_about::before {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  width: 300px;
  height: 567px;
  background: #fff5dc;
  border-radius: 0 20px 20px 0;
}
#evidence_about .cont_inner {
  position: relative;
  padding: 0 0 95px;
}
#evidence_about .cont_inner::before {
  position: absolute;
  bottom: 345px;
  left: 15px;
  content: "";
  width: 62px;
  height: 92px;
  background: url("../images/il_03.svg") top left no-repeat;
  background-size: 62px auto;
  z-index: 1;
}
#evidence_about .cont_inner h2 {
  width: 493px;
  margin: 0 auto 52px;
}
#evidence_about .cont_inner p {
  position: absolute;
  bottom: 180px;
  left: 0;
  width: 500px;
  max-height: 170px;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.8;
  padding: 20px 15px 20px 40px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.8);
  box-sizing: border-box;
}
#evidence_about .cont_inner .img {
  width: 560px;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1023px) {
  #evidence_about::before {
    position: absolute;
    top: -3vw;
    left: 0;
    content: "";
    width: 26vw;
    height: 95vw;
    background: #fff5dc;
    border-radius: 0 20px 20px 0;
  }
  #evidence_about .cont_inner {
    position: relative;
    width: 100vw;
    padding: 0 0 12.8vw;
  }
  #evidence_about .cont_inner::before {
    position: absolute;
    bottom: -2vw;
    left: 4vw;
    content: "";
    width: 10vw;
    height: 14.66vw;
    background: url("../images/il_03.svg") top left no-repeat;
    background-size: 10vw auto;
    z-index: 1;
  }
  #evidence_about .cont_inner h2 {
    width: 79.3vw;
    margin: 10.66vw auto 6.93vw;
  }
  #evidence_about .cont_inner p {
    position: static;
    width: 92vw;
    max-height: 46.66vw;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.4;
    text-align: center;
    padding: 5vw 4vw 7vw;
    margin: auto;
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.8);
    box-sizing: border-box;
  }
  #evidence_about .cont_inner .img {
    width: 82.66vw;
    margin: -5vw 0 0 auto;
  }
}
/*==============================*/
/*== 6:evidence_result ===============*/
#evidence_result {
  padding: 65px 0 50px;
  background: url("../images/evidence_result_bg.png") center center repeat;
}
#evidence_result .cont_inner {
  position: relative;
}
#evidence_result .cont_inner::before {
  position: absolute;
  top: 120px;
  right: 66px;
  content: "";
  width: 72px;
  height: 69px;
  background: url("../images/il_04.svg") top left no-repeat;
  background-size: 72px auto;
  z-index: 1;
}
#evidence_result .cont_inner h2 {
  width: 200px;
  margin: 0 auto 52px;
}
#evidence_result .cont_inner h3 {
  width: 663px;
  margin: 0 auto 52px;
}
#evidence_result .cont_inner .txt_inner {
  position: relative;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.8;
  text-align: center;
  padding: 20px 10px;
  margin-bottom: 72px;
  background: #fff;
  border-radius: 20px;
  box-sizing: border-box;
}
#evidence_result .cont_inner .txt_inner::before {
  position: absolute;
  top: -42px;
  left: 28px;
  content: "";
  width: 114px;
  height: 109px;
  background: url("../images/il_06.svg") top left no-repeat;
  background-size: 114px auto;
  z-index: 1;
}
#evidence_result .cont_inner .txt_inner span.notes {
  display: block;
  font-size: 1.2rem;
  text-align: right;
  margin-right: 148px;
}
#evidence_result .cont_inner .point .fl {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  -ms-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: flex-start;
  -ms-align-items: flex-start;
  align-items: flex-start;
}
#evidence_result .cont_inner .point .fl p {
  position: relative;
  width: 490px;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.9;
  padding: 20px 20px;
  background: #fff;
  border-radius: 20px;
  box-sizing: border-box;
}
#evidence_result .cont_inner .point .graf {
  /* width: 442px;*/
}
/*--point01--*/
#evidence_result .cont_inner .point.pt01 h3 {
  width: 686px;
  margin: 0 auto 52px;
}
#evidence_result .cont_inner .point.pt01 p::before {
  position: absolute;
  bottom: -82px;
  right: 20px;
  content: "";
  width: 66px;
  height: 110px;
  background: url("../images/il_05.svg") top left no-repeat;
  background-size: 66px auto;
  z-index: 1;
}
#evidence_result .cont_inner .point.pt01 .graf img {
  width: 410px;
  margin: auto;
}
/*-----------*/
/*--point02--*/
#evidence_result .cont_inner .point.pt02 h3 {
  width: 658px;
  margin: 45px auto 52px;
}
#evidence_result .cont_inner .point.pt02 p::before {
  position: absolute;
  bottom: -66px;
  right: 10px;
  content: "";
  width: 86px;
  height: 90px;
  background: url("../images/il_07.svg") top left no-repeat;
  background-size: 86px auto;
  z-index: 1;
}
#evidence_result .cont_inner .point.pt02 .graf img {
  width: 442px;
  margin: auto;
}
/*-----------*/
#evidence_result .cont_inner .result {
  position: relative;
  color: #122880;
  font-size: 2.5rem;
  font-weight: bold;
  text-align: center;
  line-height: 1.8;
  padding: 10px;
  margin: 50px auto 40px;
  background: #fff;
  border-radius: 20px;
  box-sizing: border-box;
}
#evidence_result .cont_inner .result::before {
  position: absolute;
  bottom: -55px;
  left: 45px;
  content: "";
  width: 74px;
  height: 111px;
  background: url("../images/il_09.svg") top left no-repeat;
  background-size: 74px auto;
  z-index: 1;
}
#evidence_result .cont_inner .result::after {
  position: absolute;
  bottom: -44px;
  right: 25px;
  content: "";
  width: 95px;
  height: 115px;
  background: url("../images/il_08.svg") top left no-repeat;
  background-size: 95px auto;
  z-index: 1;
}
#evidence_result .cont_inner .result h3 {
  position: absolute;
  top: -20px;
  left: 0;
  right: 0;
  color: #f2b814;
  font-size: 4rem;
  line-height: 1;
  font-weight: bold;
  margin: 0 auto;
}
#evidence_result .cont_inner .research {
  font-size: 1.2rem;
  text-align: center;
  text-indent: -3.5rem;
}
@media screen and (max-width: 1023px) {
  #evidence_result {
    padding: 8.66vw 0 6.66vw;
    background: url("../images/evidence_result_bg_sp.png") center center repeat;
  }
  #evidence_result .cont_inner {
    position: relative;
  }
  #evidence_result .cont_inner::before {
    position: absolute;
    top: 6vw;
    right: 2.8vw;
    content: "";
    width: 12.4vw;
    height: 12vw;
    background: url("../images/il_04.svg") top left no-repeat;
    background-size: 12.4vw auto;
    z-index: 1;
  }
  #evidence_result .cont_inner h2 {
    width: 32.53vw;
    margin: 0 auto 7vw;
  }
  #evidence_result .cont_inner h3 {
    width: 90.4vw;
    margin: 0 auto 11vw;
  }
  #evidence_result .cont_inner .txt_inner {
    position: relative;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.6;
    text-align: left;
    padding: 2.66vw 4vw;
    margin-bottom: 9.6vw;
    background: #fff;
    border-radius: 2.66vw;
    box-sizing: border-box;
  }
  #evidence_result .cont_inner .txt_inner::before {
    position: absolute;
    top: -7vw;
    left: 1.733vw;
    content: "";
    width: 12.53vw;
    height: 12vw;
    background: url("../images/il_06.svg") top left no-repeat;
    background-size: 12.53vw auto;
    z-index: 1;
  }
  #evidence_result .cont_inner .txt_inner span.notes {
    display: block;
    font-size: 1rem;
    text-align: right;
    margin: 0 0 0 auto;
  }
  #evidence_result .cont_inner .point .fl {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: column wrap;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    -webkit-justify-content: space-between;
    -ms-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: flex-start;
    -ms-align-items: flex-start;
    align-items: flex-start;
  }
  #evidence_result .cont_inner .point .fl p {
    position: relative;
    width: 100%;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 1.6;
    padding: 4.5vw 4vw;
    background: #fff;
    border-radius: 2.667vw;
    box-sizing: border-box;
  }
  #evidence_result .cont_inner .point .graf {
    width: 84vw;
  }
  /*--point01--*/
  #evidence_result .cont_inner .point.pt01 {
    margin-bottom: 10vw;
  }
  #evidence_result .cont_inner .point.pt01 h3 {
    width: 91vw;
    margin: 0 auto 2vw;
  }
  #evidence_result .cont_inner .point.pt01 p::before {
    position: absolute;
    bottom: -10.93vw;
    right: 2.66vw;
    content: "";
    width: 11.2vw;
    height: 18.66vw;
    background: url("../images/il_05.svg") top left no-repeat;
    background-size: 11.2vw auto;
    z-index: 1;
  }
  /*-----------*/
  /*--point02--*/
  #evidence_result .cont_inner .point.pt02 h3 {
    width: 85.33vw;
    margin: 0 auto 2vw;
  }
  #evidence_result .cont_inner .point.pt02 p::before {
    position: absolute;
    bottom: -14vw;
    left: 2vw;
    content: "";
    width: 15.33vw;
    height: 16vw;
    background: url("../images/il_07.svg") top left no-repeat;
    background-size: 15.33vw auto;
    z-index: 1;
  }
  /*-----------*/
  #evidence_result .cont_inner .result {
    position: relative;
    color: #122880;
    font-size: 1.6rem;
    font-weight: bold;
    text-align: center;
    line-height: 1.6;
    padding: 5vw 1.33vw;
    margin: 12vw auto 5.33vw;
    background: #fff;
    border-radius: 20px;
    box-sizing: border-box;
  }
  #evidence_result .cont_inner .result::before {
    position: absolute;
    top: -2vw;
    left: 0;
    content: "";
    width: 9.86vw;
    height: 14.8vw;
    background: url("../images/il_09.svg") top left no-repeat;
    background-size: 9.86vw auto;
    z-index: 1;
  }
  #evidence_result .cont_inner .result::after {
    position: absolute;
    bottom: -5vw;
    right: 0;
    content: "";
    width: 12.66vw;
    height: 15.33vw;
    background: url("../images/il_08.svg") top left no-repeat;
    background-size: 12.66vw auto;
    z-index: 1;
  }
  #evidence_result .cont_inner .result h3 {
    position: absolute;
    top: -3vw;
    left: 0;
    right: 0;
    color: #f2b814;
    font-size: 2.2rem;
    line-height: 1;
    font-weight: bold;
    margin: 0 auto;
  }
  #evidence_result .cont_inner .research {
    font-size: 1rem;
    text-align: center;
    text-indent: -3.5rem;
    padding-left: 5vw;
  }
}
/*-----.pt01 graf-----*/
.pt01 .graf {
  position: relative;
  width: 409px;
  height: 467px;
  background: url("../images/graf_01.png") top left no-repeat;
  background-size: 409px auto;
}
.pt01 .graf .value {
  position: absolute;
  left: 0;
  right: 0;
  display: inline-block;
  color: #122880;
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
  margin: 0 auto;
}
.pt01 .graf .inc {
  position: absolute;
  bottom: 250px;
  right: 40px;
  width: 100px;
}
.pt01 .graf .inc img {
  width: 100px !important;
}
.pt01 .graf .ya {
  position: absolute;
  bottom: 280px;
  right: 200px;
  width: 75px;
}
.pt01 .graf .ya img {
  width: 75px !important;
}
.pt01 .graf .general {
  position: absolute;
  bottom: 121px;
  left: 109px;
  width: 70px;
  height: 0;
  background: #dfdfdf;
  border-radius: 6px 6px 0 0;
  transition: all 1s;
}
.pt01 .graf .general.graf_on {
  opacity: 1;
  height: 150px;
  transition: all 1s;
}
.pt01 .graf .general .value {
  bottom: 93px;
}
.pt01 .graf .tubebutter {
  position: absolute;
  bottom: 121px;
  right: 108px;
  width: 70px;
  height: 0;
  background: #f6ce4e;
  border-radius: 6px 6px 0 0;
  transition: all 1s;
}
.pt01 .graf .tubebutter.graf_on {
  opacity: 1;
  height: 292px;
  transition: all 1s;
}
.pt01 .graf .tubebutter .value {
  bottom: 230px;
}
.pt01 .graf .fade_g {
  opacity: 0;
  transition: all 1s 1s ease;
}
.pt01 .graf .fade_g_on {
  opacity: 1;
}
@media screen and (max-width: 1023px) {
  .pt01 .graf {
    position: relative;
    width: 77.73vw !important;
    height: 81.33vw;
    margin: 5vw auto 0;
    background: url("../images/graf_01_sp.png") top left no-repeat;
    background-size: cover;
  }
  .pt01 .graf .value {
    position: absolute;
    left: 0;
    right: 0;
    display: inline-block;
    color: #122880;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
    margin: 0 auto;
  }
  .pt01 .graf .inc {
    position: absolute;
    bottom: 40vw;
    right: 2vw;
    width: 19vw;
  }
  .pt01 .graf .inc img {
    width: 19vw !important;
  }
  .pt01 .graf .ya {
    position: absolute;
    bottom: 42vw;
    right: 30vw;
    width: 14.13vw;
  }
  .pt01 .graf .ya img {
    width: 14.13vw !important;
  }
  .pt01 .graf .general {
    position: absolute;
    bottom: 13.2vw;
    left: 22vw;
    width: 13.2vw;
    height: 0;
    background: #dfdfdf;
    border-radius: 6px 6px 0 0;
    transition: all 1s;
  }
  .pt01 .graf .general.graf_on {
    opacity: 1;
    height: 28.4vw;
    transition: all 1s;
  }
  .pt01 .graf .general .value {
    bottom: 20vw;
  }
  .pt01 .graf .tubebutter {
    position: absolute;
    bottom: 13.2vw;
    right: 14.4vw;
    width: 13.2vw;
    height: 0;
    background: #f6ce4e;
    border-radius: 6px 6px 0 0;
    transition: all 1s;
  }
  .pt01 .graf .tubebutter.graf_on {
    opacity: 1;
    height: 55.46vw;
    transition: all 1s;
  }
  .pt01 .graf .tubebutter .value {
    bottom: 47vw;
  }
  .pt01 .graf .fade_g {
    opacity: 0;
    transition: all 1s 1s ease;
  }
  .pt01 .graf .fade_g_on {
    opacity: 1;
  }
}
/*-----.pt02 graf-----*/
.pt02 .graf {
  position: relative;
  width: 442px;
  height: 467px;
  background: url("../images/graf_02.png") top left no-repeat;
  background-size: 442px auto;
}
.pt02 .graf .value {
  position: absolute;
  left: 0;
  right: 0;
  display: inline-block;
  color: #122880;
  font-size: 3rem;
  font-weight: bold;
  text-align: center;
  margin: 0 auto;
}
.pt02 .graf .inc {
  position: absolute;
  bottom: 85px;
  right: 0px;
  width: 100px;
}
.pt02 .graf .inc img {
  width: 100px !important;
}
.pt02 .graf .ya {
  position: absolute;
  bottom: 111px;
  right: 167px;
  width: 91px;
}
.pt02 .graf .ya img {
  width: 91px !important;
}
.pt02 .graf .general {
  position: absolute;
  bottom: 61px;
  left: 123px;
  width: 70px;
  height: 0;
  background: #dfdfdf;
  border-radius: 6px 6px 0 0;
  transition: all 1s;
}
.pt02 .graf .general.graf_on {
  opacity: 1;
  height: 340px;
  transition: all 1s;
}
.pt02 .graf .general .value {
  bottom: 240px;
}
.pt02 .graf .tubebutter {
  position: absolute;
  bottom: 61px;
  right: 90px;
  width: 70px;
  height: 0;
  background: #f6ce4e;
  border-radius: 6px 6px 0 0;
  transition: all 1s;
}
.pt02 .graf .tubebutter.graf_on {
  opacity: 1;
  height: 14px;
  transition: all 1s;
}
.pt02 .graf .tubebutter .value {
  bottom: 10px;
}
.pt02 .graf .fade_g {
  opacity: 0;
  transition: all 1s 1s ease;
}
.pt02 .graf .fade_g_on {
  opacity: 1;
}
@media screen and (max-width: 1023px) {
  .pt02 .graf {
    position: relative;
    width: 84vw !important;
    height: 88.66vw;
    margin: 10vw auto 0;
    background: url("../images/graf_02_sp.png") top left no-repeat;
    background-size: cover;
  }
  .pt02 .graf .value {
    position: absolute;
    left: 0;
    right: 0;
    display: inline-block;
    color: #122880;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
    margin: 0 auto;
  }
  .pt02 .graf .inc {
    position: absolute;
    bottom: 15vw;
    right: 0;
    width: 19vw;
  }
  .pt02 .graf .inc img {
    width: 19vw !important;
  }
  .pt02 .graf .ya {
    position: absolute;
    bottom: 20vw;
    right: 30vw;
    width: 14.13vw;
  }
  .pt02 .graf .ya img {
    width: 18.66vw !important;
  }
  .pt02 .graf .general {
    position: absolute;
    bottom: 8.8vw;
    left: 28vw;
    width: 13.2vw;
    height: 0;
    background: #dfdfdf;
    border-radius: 6px 6px 0 0;
    transition: all 1s;
  }
  .pt02 .graf .general.graf_on {
    opacity: 1;
    height: 64.66vw;
    transition: all 1s;
  }
  .pt02 .graf .general .value {
    bottom: 46vw;
  }
  .pt02 .graf .tubebutter {
    position: absolute;
    bottom: 8.8vw;
    right: 11.4vw;
    width: 13.2vw;
    height: 0;
    background: #f6ce4e;
    border-radius: 6px 6px 0 0;
    transition: all 1s;
  }
  .pt02 .graf .tubebutter.graf_on {
    opacity: 1;
    height: 2.66vw;
    transition: all 1s;
  }
  .pt02 .graf .tubebutter .value {
    bottom: 3vw;
  }
  .pt02 .graf .fade_g {
    opacity: 0;
    transition: all 1s 1s ease;
  }
  .pt02 .graf .fade_g_on {
    opacity: 1;
  }
}

/*==============================*/
/*== 7:evidence_link =========*/
#evidence_link .cont_inner {
  padding: 70px 0 100px;
}
#evidence_link .cont_inner p {
  color: #ffa355;
  font-size: 2.6rem;
  font-weight: bold;
  text-align: center;
  margin: 0 auto 15px;
}
#evidence_link .cont_inner a {
  display: block;
  width: 633px;
  margin: 0 auto;
  transition: all 1s;
}
#evidence_link .cont_inner a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 1023px) {
  #evidence_link .cont_inner {
    padding: 9.33vw 0 13.33vw;
  }
  #evidence_link .cont_inner p {
    color: #ffa355;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
    margin: 0 auto 2vw;
  }
  #evidence_link .cont_inner a {
    display: block;
    width: 84.26vw;
    margin: 0 auto;
  }
}
/*==============================*/
/*== 8:evidence_products =========*/
#evidence_products {
  padding: 50px 0 45px;
  margin-top: 100px;
  background: #fff2df url("../images/evidence_products_bg.png") center center no-repeat;
}
#evidence_products h2 {
  width: 201px;
  margin: 0 auto 55px;
}
#evidence_products .cont_inner {
  width: 960px;
  background: #fff;
  border: #eebf25 3px solid;
  border-radius: 20px;
  box-shadow: 0 0 2px #e0e0e0;
}
#evidence_products .cont_inner .normal {
  position: relative;
  padding: 45px 0 40px 20px;
  box-sizing: border-box;
}
#evidence_products .cont_inner .normal h3 {
  width: 408px;
  margin: 0 0 0 88px;
}
#evidence_products .cont_inner .normal h4 {
  width: 582px;
}
#evidence_products .cont_inner .normal .point {
  width: 583px;
}
#evidence_products .cont_inner .normal .normal_img {
  position: absolute;
  top: -20px;
  right: 12px;
  width: 347px;
}
#evidence_products .cont_inner .garlic {
  position: relative;
  background: #ffeabe;
}
#evidence_products .cont_inner .garlic_img {
  position: absolute;
  top: -32px;
  /* left: 30px; */
  left: 0;
  right: 0;
  width: 599px;
  margin: 0 auto;
}
#evidence_products .cont_inner .garlic p {
  font-size: 1.6rem;
  text-align: center;
  font-weight: bold;
  padding: 80px 0 35px 140px;
  box-sizing: border-box;
}
#evidence_products .cont_inner .btn a {
  display: block;
  color: #000;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  width: 256px;
  padding: 10px 0;
  margin: 35px auto 40px;
  background: #eebf25 url("../images/icon_win.svg") center right 20px no-repeat;
  background-size: 17px auto;
  border-radius: 30px;
  box-sizing: border-box;
  transition: all 1s;
}
#evidence_products .cont_inner .btn a:hover {
  opacity: 0.7;
}
@media screen and (max-width: 1023px) {
  #evidence_products {
    padding: 6.667vw 0 6vw;
    background: #fff2df;
  }
  #evidence_products h2 {
    width: 32.53vw;
    margin: 0 auto 7.33vw;
  }
  #evidence_products .cont_inner {
    width: 92vw;
    background: #fff;
    border: #eebf25 3px solid;
    border-radius: 20px;
    box-shadow: 0 0 2px #e0e0e0;
  }
  #evidence_products .cont_inner .normal {
    padding: 6vw 2vw 12vw;
    box-sizing: border-box;
  }
  #evidence_products .cont_inner .normal h3 {
    width: 78.13vw;
    margin: 0 auto;
  }
  #evidence_products .cont_inner .normal h4 {
    width: 82.66vw;
    margin: 3vw auto 0;
  }
  #evidence_products .cont_inner .normal .point {
    width: 78.4vw;
    margin: 4vw auto 0;
  }
  #evidence_products .cont_inner .normal .normal_img {
    position: static;
    width: 54.4vw;
    margin: 3vw auto 0;
  }
  #evidence_products .cont_inner .garlic {
    position: relative;
    background: #ffeabe;
  }
  #evidence_products .cont_inner .garlic_img {
    position: absolute;
    top: -32px;
    left: 0;
    right: 0;
    width: 82.66vw;
    margin: 0 auto;
  }
  #evidence_products .cont_inner .garlic p {
    font-size: 1.2rem;
    text-align: center;
    font-weight: bold;
    padding: 43vw 0 4vw;
    box-sizing: border-box;
  }
  #evidence_products .cont_inner .btn a {
    display: block;
    color: #000;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    width: 50vw;
    padding: 1.33vw 0;
    margin: 4.66vw auto 5.33vw;
    background: #eebf25 url("../images/icon_win.svg") center right 5vw no-repeat;
    background-size: 3vw auto;
    border-radius: 30px;
    box-sizing: border-box;
    transition: all 1s;
  }
}
/*==============================*/
/*== 9:evidence_banner ==============*/
#evidence_banner {
  padding: 110px 0 0;
}
#evidence_banner .cont_inner div {
  width: 528px;
}
#evidence_banner .cont_inner div.bnr_butter {
  margin: 0 auto 0 0;
}
#evidence_banner .cont_inner div.bnr_recipe {
  margin: -105px 0 0 auto;
}
#evidence_banner .cont_inner div a img {
  transition: all 1s;
}
#evidence_banner .cont_inner div a:hover img {
  opacity: 0.7;
}
@media all and (-ms-high-contrast: none) {
  /*ie10*/
  *::-ms-backdrop,
  #evidence_banner {
    margin-bottom: 120px;
  }
}
@media screen and (max-width: 1023px) {
  #evidence_banner {
    padding: 14vw 0 0;
  }
  #evidence_banner .cont_inner {
    width: 100vw;
  }
  #evidence_banner .cont_inner div {
    width: 70.66vw;
  }
  #evidence_banner .cont_inner div.bnr_butter {
    margin: 0 auto 0 0;
  }
  #evidence_banner .cont_inner div.bnr_recipe {
    margin: 2vw 0 0 auto;
  }
}
/*==============================*/
