#about_banner{
  position: relative;
}
.about_banner_tet{
  position: absolute;
  top: 15%;
  left: 10%;
}
.about_banner_tet h1{
  font-family: Montserrat;
  color: #fff;
  text-transform: uppercase;
  font-size: 3.5vw;
  line-height: 5vw;
}
.about_banner_tet h2{
  font-family: Montserrat;
  color: #fff;
  text-transform: uppercase;
  font-size: 2vw;
}
.about_banner_tet span{
  display: block;
  width: 38%;
  font-family: HarmonyOS_Sans_SC_Medium;
  color: #fff;
  font-size: 0.8vw;
  margin-top: 4%;
}

.s_img{
  position: absolute;
  top: 15%;
}
.s_img img{
  width: 90%;
}
#m-v-v{
  margin-top: 35vh;
 
}
#m-v-v .x4{
  padding: 2%;
}
.m-v-v{
  padding: 10%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  justify-content: center;
  border-radius: 8px;
}
.m-v-v:hover{
  background-color: #fff;
}
.m-v-v img{
  width: 20%;
  padding-bottom: 20%;
}
.m-v-v h1{
  font-family: Montserrat;
  font-size: 1.5vw;
  line-height: 1.8vw;
  padding-bottom: 20%;
}
.m-v-v h3{
  font-family: HarmonyOS_Sans_SC_Medium;
  width: 80%;
  font-size: 0.8vw;
  line-height: 1.5vw;
}
.about-slideshow{
  
  width: 100%;
  height: 100%;
}

.about-slideshow .about-images {
  width: 28%;
  display: flex;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  animation:about-moveSlideLeft 80s linear infinite;
}
.about-slideshow .about-images:hover{
  animation-play-state: paused;
}
 .about-images.reverse {
  animation-direction: reverse;
   margin-top: 50%;
}

.about-images img {
 width: 100%;
 padding:4%;
}
@keyframes about-moveSlideLeft {
  100% {
      transform:translateY(-100%)
  }
}
.b_s{
  position: absolute;
  right: 8%;
  bottom: 15%;
  z-index: 8;
  width: 20%;
  font-family: Montserrat;
  color: #fff;
}
.b_s h1{
  font-size: 2.5vw;
  line-height: 2.5vw;
}
.b_s h3{
  margin-top: 5%;
  font-size: 0.8vw;
  line-height: 1.2vw;
  font-family: HarmonyOS_Sans_SC_Medium;
}
.s_m h1{
  margin-top: 8%;
  margin-bottom: 8%;
  font-family: Montserrat;
  font-size: 5vw;
  color: #000;
  margin-left: 10%;
}
.s_m_list{
  padding: 1% 15%;
  background-color: #f9f9f9;
}
.s_m_list ul{
  display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.s_m_list ul li{
  width: 20%;
  float: left;
  padding: 5.5%;
  text-align: center;
}
.s_m_list ul li a{
  font-family: Montserrat;
  color: #d3d3d3;
  text-align: center;
  transition: all 1s ease; 

}
.s_m_list ul li a img{
  width: 80%;
  
}
.meiv_img{
  position: relative;
  height: 5vw;
}
.meiv_img img{
  position: absolute;
  top: 0;
  left: 13%;
  transition: opacity 0.5s ease;
}
.meiv_img_one{
  opacity: 1;
}
.meiv_img_two{
  opacity: 0;
}
.s_m_list ul li a h1{
  padding-top: 23%;
  font-size: 1.2vw;
}
.s_m_list ul li a:hover .meiv_img_one{
  opacity: 0;
}
.s_m_list ul li a:hover .meiv_img_two{
  opacity: 1;
}
.s_m_list ul li a:hover h1{
  color: black;
}

/* #youtobe a:hover img{

  content: url('/uploads/allimg/about/Group1 69.png');
}
#instagram a:hover img{
  content: url('/uploads/allimg/about/Group1 70.png');
}
#facebook a:hover img{
  content: url('/uploads/allimg/about/Group 75.png');
}
#tiktok a:hover img{
  content: url('/uploads/allimg/about/Groups 71.png');
}
#twitter a:hover img{
  content: url('/uploads/allimg/about/Group1 72.png');
} */
.about_email{
  margin-top: 4%;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: flex-start;
  align-items: center;
  position: relative;
  padding-bottom: 2%;
 
}
.about_email img{
  width: 3%;
}
.about_email h1{
  font-family: HarmonyOS_Sans_SC_Medium;
  font-size: 1.5vw;
  padding-left: 5%;
}
.dt_border{
  height: 2px;
  width: 0;
  background-color: #CCCFCE;
  position: absolute;
  left: 0;
  bottom: 0;
  animation: growLineUot 0.5s ease-in-out forwards;
}
.about_email:hover{
  cursor: pointer;
}

.about_email:hover .dt_border{
  width: 60%;
  animation: growLine 1s ease-in-out forwards;
}
#about-images-zz {
  position: relative;
}
#about-images-zz::before  {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, transparent, rgba(0, 0, 0,0.9));
  
}
@keyframes growLine {
  from {
    width: 0%;
  }
  to {
    width: 60%;
  }
}
@keyframes growLineUot {
  from {
    width: 60%;
  }
  to {
    width: 0%;
  }
}