.header-style1.header2{
  background-color: #FFF;
  padding: 10px 0;
  border-bottom: 1px solid #b1b1b1;
}

.header-style1.header2 .header-logo{
  width: 150px;
}
.header-style1.header2 .header-menu{
  width: calc(100% - 150px);
}

.index-banner-mask.active{
  animation: bottom .8s ease .5s 1 both;
}


/*--------------------------*/
.promotion-list-box,
.main-title,
.condition-info-title,
.condition-info-list,
.service-list-box,
.problem-title,
.problem-list-box,
.contact-article-p,
.contact-article-p2,
.contact-article-link-box,
.contact-info-form{
  opacity: 0;
}
.main-title.active{
  animation: fade .8s linear 0s 1 both;
}

.promotion-list-box.active{
  animation: fadeInUp .8s ease 0s 1 both;
}

.condition-info.active .condition-info-title,
.problem-title.active{
  animation: fade .8s linear 0s 1 both;
}
.condition-info.active  .condition-info-list:nth-child(odd){
  animation: fadeInLeft .8s ease 0s 1 both;
}
.condition-info.active  .condition-info-list:nth-child(even){
  animation: fadeInRight .8s ease 0s 1 both;
}
.condition-box.active .condition-info-mask-left-bg{
  animation: fadeInLeft2 .8s ease 0s 1 both;
}
.condition-box.active .condition-info-mask-right-bg{
   animation: fadeInRight2 .8s ease 0s 1 both;
}
.service-list-box.active,
.problem-list-box.active{
  animation: fadeInUp .8s ease 0s 1 both;

}
.contact-article-p.active,
.contact-article-p2.active,
.contact-article-link-box.active{
  animation: fade .8s linear 0s 1 both;
}
.contact-info-form.active{
  animation: fadeInRight2 .8s ease 0s 1 both;
}







.condition-info-mask-left-bg{
  opacity: 0;
  transform: translate3d(100px, 0, 0);
}

.condition-info-mask-right-bg{
  opacity: 0;
  transform: translate3d(-100px, 0, 0);
}

/*右邊快速進入*/
@-webkit-keyframes fadeInRight2 {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

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

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
/*左邊進入*/
@-webkit-keyframes fadeInLeft2 {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100px, 0, 0);
    transform: translate3d(-100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

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

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}