.show-about .header-menu-main-line{
  left: 5px;
}
.show-equipment .header-menu-main-line{
  left: 137px;
}
.show-works .header-menu-main-line{
  left: 270px;
}
.show-news .header-menu-main-line{
  left: 405px;
}
.show-contact .header-menu-main-line{
  left: 540px;
}
.index-banner-box .index-banner-list span{
  opacity: 0.2;
  transform: scale(1.2) translate(-40px , 0px);

}
.index-banner-list:nth-child(even).slick-active span{
  animation: banner-slick2 3s ease-out 0s 1 forwards;
}
.index-banner-list.slick-active span{
  animation: banner-slick 3s ease-out 0s 1 forwards;
}

.index-banner-slong-box{
 
  width: 100%;
}
.index-banner-slong-slick-list.slick-active .index-banner-slong{
   animation:fadeInUp 2s ease .2s 1 both;
}
.index-banner-slong-slick-list.slick-active .index-banner-slong-logo-box{
  animation: fadeInLeft2 1.5s ease-out 0s 1 both;
}

@keyframes fadeInLeft2 {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-150px, 0, 0);
    transform: translate3d(-150px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes banner-slick{
  from {
      opacity: 0.2;
      transform: scale(1.2) translate(-40px , 0px);
  }
  to {
      opacity: 1;
      transform: scale(1) translate(0px , 0px);
  }
}

@keyframes banner-slick2 {
  from {
      opacity: 0.2;
      transform: scale(1.2) translate(0px , -40px);
  }
  to {
      opacity: 1;
      transform: scale(1) translate(0px , 0px);
  }
}



/*-----------------------------------*/
.about-info-box,
.about-p-box,
.equipment-menu-class-box,
.equipment-title-box span,
.about-title-box span,
.equipment-list-box,
.news-title-box span,
.news-list-box,
.more-box,
.contact-title-box span,
.contact-p,
.contact-info-form,
.equipment-title{
  opacity: 0;
}
/*.equipment-title,
.about-title,
.news-title,
.contact-title{
  transform: perspective(400px) rotateX(90deg);
}*/

.about-info-border-lint-top{
  transform: scale(0,1);
  transition: all .5s ease;
  transform-origin: left;
  transition-delay: .5s ;
}
.about-info-border-lint-left{
  transform: scale(1,0);
  transition: all .5s ease;
  transform-origin: top;
  transition-delay: .5s ;
}

.about-box.active .about-info-box{
  animation: fadeInLeft .8s ease-out 0s 1 both;
}


.about-box.active .about-info-border-lint-top,
.about-box.active .about-info-border-lint-left{
  transform: scale(1,1);
}
.about-box.active .about-title{
  animation: flipInX .8s linear .5s 1 both;
}
.about-box.active .about-title-box span{
  animation: fade .8s ease .8s 1 both;
}

.about-box.active .about-p-box,
.news-box.active .news-list-box{
  animation: fadeInUp .5s ease-out .8s 1 both;
}

.equipment-box.active .equipment-title,
.news-box.active .news-title,
.contact-info-box.active .contact-title,
.works-box.active  .equipment-title{
  animation: flipInX .8s linear .5s 1 both;
}
.equipment-box.active .equipment-title-box span,
.news-box.active .news-title-box span,
.contact-info-box.active .contact-title-box span,
.works-box.active .equipment-title-box span{
  animation: fade .8s ease 0s 1 both;
}
.equipment-menu-class-box.active{
  animation: fade .8s ease 0s 1 both;
}
.equipment-box.active .equipment-page-box,
.more-box.active{
  animation: fade .8s ease 0s 1 both;
}

.equipment-box.active .equipment-list-box{
 animation: fade .8s ease .5s 1 both;
}

.contact-info-box.active .contact-p{
  animation: fade .8s ease .7s 1 both;
}
.contact-info-box.active .contact-info-form{
  animation: fadeInRight .8s ease .7s 1 both;
}