.research {
  overflow: hidden;
}

.research_row {
  max-width: 1070px;
  margin: 0 auto;
  padding: 180px 0 30px;
  position: relative;
  z-index: 1;
}

.research_bg {
  position: relative;
}

.title {
  text-align: center;
  width: 100%;
}

.title img {
  width: 100%;
}

.research_text {
  padding: 40px 0 0px;
  width: 100%;
  color: #3E444B;
  font-size: 23px;
  font-weight: bold;
}

.research_text img {
  width: 100%;
}

.research_box {
  width: 100%;
  position: relative;
  margin: 10px 0 30px;
}

.research_box img {
  width: 100%;
}

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

.research_box_2 img {
  width: 100%;
}

.research_time {
  background-image: url(../img/time_be.png);
  background-position: center;
  position: relative;

}

.research_time_row {
  max-width: 1070px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  padding: 20px 0;
}

.timeline {
  width: 100%;
  position: relative;

}

.timeline img {
  width: 100%;
}

.timeline_position {
  position: absolute;
  width: 100%;

  max-width: 50%;
}

.timeline_position img {
  width: 100%;
}

.timeline_1 {
          max-width: 406px;
    right: 55px;
    top: 13px;
}

.timeline_2 {
     max-width: 516px;
    left: 2%;
    top: 30px;

}

.timeline_3 {
       max-width: 508px;
    right: 30px;
    top: 223px;
}

.timeline_4 {
        max-width: 538px;
    left: 0px;
    top: 276px;
}

.timeline_5 {
    max-width: 549px;
    right: -11px;
    top: 615px;
}

.timeline_6 {
    max-width: 543px;
    left: -5px;
    top: 668px;
}

.timeline_7 {
    max-width: 485px;
    right: 53px;
    top: 1710px;
}

.timeline_8 {
    max-width: 539px;
    left: -1px;
    top: 1781px;
}

.timeline_9 {
    max-width: 521px;
    right: 17px;
    top: 2350px;
}

.timeline_10 {
    max-width: 526px;
    left: 12px;
    top: 2564px;
}

.timeline_11 {
    max-width: 515px;
    right: 20px;
    top: 2665px;
}



.research_icon {
  position: absolute;

}

.research_icon_1 {
  top: -3%;
  left: -8%
}

.research_icon_2 {
  top: -5%;
  right: 0%;
}

.research_icon_3 {
  bottom: -5%;
  right: -8%;
}

.research_icon_4 {
  top: -5%;
  left: -15%;
}

.research_icon_5 {
  top: -5%;
  right: -20%;
}

.research_icon_6 {
  bottom: -5%;
  right: -8%;
}

.research_icon_7 {
  bottom: 0%;
  left: -12%;
}

.m_text {
  padding: 35px 0 0;
  font-size: 10px;
}

.m_text span {
  font-weight: bold;
}

.research_dk {
  display: block;
}

.research_mo {
  display: none;
}

.research_box_mask {
  position: absolute;
  top: 50%;
  left: 50%;
  overflow: hidden;
  height: 100%;
  width: 100%;
  z-index: 2;
  transform: translateY(-50%) translateX(-50%);
  /* background-color: aqua; */
}

.research_box_mask_img {
  width: 100%;
  margin: 0 auto;
  position: absolute;
  left: 0;
  top: 0;
  background-image: url(../img/star.png);
  animation-name: spin;
  animation-duration: 2.5s;
  /* background-size: 50%; */
  animation-iteration-count: infinite;
  animation-timing-function: steps(1, end);
  background-position: 0% 0px;
  background-size: cover;
  height: 100%;
}

.molecular {
     position: absolute;
    bottom: 50px;
    right: 12%;
    animation: float 6s ease-in-out infinite;
}

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

.footer {
  position: relative;
  min-height: 268px;
  background-color: #ad8945;
  margin-top: 0px;
}

@keyframes float {
  0% {
    transform: translatey(0px);
  }

  50% {
    transform: translatey(-20px);
  }

  100% {
    transform: translatey(0px);
  }
}

@keyframes spin {
  0% {
    background-position: 0px 0%;
  }

  10% {
    background-position: 0px 100%;
  }

  20% {
    background-position: 0px 0%;
  }

  30% {
    background-position: 0px 100%;
  }

  40% {
    background-position: 0px 0%;
  }

  50% {
    background-position: 0px 100%;
  }

  60% {
    background-position: 0px 0%;
  }

  70% {
    background-position: 0px 100%;
  }

  80% {
    background-position: 0px 0%;
  }

  90% {
    background-position: 0px 100%;
  }

  100% {
    background-position: 0px 0px;
  }


}

.research_box .kv_shine {
  width: 3.5vw;
  position: absolute;
  animation: flare linear 1s infinite alternate;
}

.research_box .kv_shine2 {
  width: 4vw;
  position: absolute;
  animation: flare linear 1s infinite alternate;
}

.kv_shine_an {
  top: 4%;
  left: 12%;

}

.kv_shine_an2 {
    top: 2%;
    left: 14%;
}

.kv_shine_an3 {
  top: 36%;
  left: 18%;

}

.kv_shine_an4 {
    top: 34%;
    left: 20.5%;
}

.kv_shine_an5 {
  top: 69%;
  left: 15%;
}

.kv_shine_an6 {
    top: 73.5%;
    left: 18%;
}

@keyframes flare {
  0% {
    transform: scale(0.5);
  }

  100% {
    transform: scale(1.3);
  }
}

/* .kv_shine img{
  width: 100%;
} */
@media screen and (max-width: 1440px) {
     .kv_shine_an2 {
        top: 4%;
        left: 15%;
    }
  .kv_shine_an4 {
  top: 35.5%;
        left: 21%
  }

  .kv_shine_an6 {
           top: 74%;
        left: 19%;
  }
}

@media screen and (max-width: 960px) {
  .molecular {
    position: absolute;
    bottom: 0;
    right: 2%;
    animation: float 6s ease-in-out infinite;
    width: 110px;
  }

  .research_box_2 {
    position: relative;
    padding: 15px 0;
    margin: 0 0 25px;
  }

  .research_text {
    padding: 25px 0 0;
    width: 100%;
    color: #3E444B;
    font-size: 19px;
    font-weight: bold;
  }

  .research_box_mask_img {
    width: 100%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(../img/m/star1m.png);
    animation-name: spin;
    animation-duration: 2.5s;
    /* background-size: 50%; */
    animation-iteration-count: infinite;
    animation-timing-function: steps(1, end);
    background-position: 0% 0px;
    background-size: cover;
    height: 100%;
  }

  .research_text {
    padding: 15px 0;
    width: 100%;
  }

  .research {
    overflow: hidden;
    padding: 0 15px;
  }

  .research_dk {
    display: none;
  }

  .research_mo {
    display: block;
  }

  .research_row {
    max-width: 1170px;
    margin: 0 auto;
    padding: 80px 0 0;
    position: relative;
    z-index: 1;
  }

  .research_time_bg {
    background-image: url(../img/m/line_bg.png);
    background-repeat: repeat-y;
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
    margin: 15px 0 0;
  }

  .research_icon_1 {
    top: 0%;
    left: -3.5%;
    z-index: 0;
  }

  .research_icon_2 {
    top: 14%;
    right: -10%;
  }

  .research_icon_3 {
    top: 35%;
    left: -9%;
  }

  .research_icon_4 {
    top: 14%;
    right: -14%;
    left: inherit;
  }

  .research_icon_5 {
    top: 72%;
    right: -12%;
  }

  .m_text {
    padding: 15px 0 0;
    font-size: 10px;
    color: #888;
  }

  .timeline_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  .timeline_line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
  }

  .research_box .kv_shine {
    width: 7.3vw;
    position: absolute;
    animation: flare linear 1s infinite alternate;
  }

  .research_box .kv_shine2 {
    width: 8.3vw;
    position: absolute;
    animation: flare linear 1s infinite alternate;
  }

  /* .kv_shine_an {
       

  } */

  .kv_shine_an2 {
     top: 9%;
        left: 15%;
  }

  /* .kv_shine_an3 {
    top: 35%;
    left: 7%;

  } */

  .kv_shine_an4 {
  top: 38%;
        left: 15%;
  }

  /* .kv_shine_an5 {
    top: 85%;
    left: 16%;
  } */

  .kv_shine_an6 {
 top: 73%;
        left: 15%;
  }

  .timeline_positionm {
    padding: 0 0 15px;
  }

  .research_box {
    width: 100%;
    position: relative;
    margin: 10px 0 0;
  }
}