﻿/*banner背景图片动画*/
@-webkit-keyframes scale-bg {
  from {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes scale-bg {
  from {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  to {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
/*banner */
.index_main {
  background: #f7f7f7;
}
.index_main .section1 {
  position: relative;
}
.index_main .section1 .index_banner .item {
  background-size: cover;
  -webkit-background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 100vh;
  position: relative;
}
.index_main .section1 .index_banner .item.slick-current .scaleBg {
  visibility: visible;
  /*
	-webkit-animation:scale-bg 6s linear forwards;
	animation:scale-bg 6s linear forwards;
*/
}
.index_main .section1 .index_banner .items {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.index_main .section1 .index_banner .items:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
/*background: rgba(0, 0, 0, 0.45);*/
  background: linear-gradient(to right,#000028 0,rgba(0,0,40,.55) 40%,rgba(0,0,40,.2) 65%,rgba(255,255,255,0) 100%);

}

.index_main .section1 .index_banner .scaleBg {
    position: relative;
    overflow: hidden;
}
.index_main .section1 .index_banner .scaleBg img {
    max-height: 100%;
    min-height: 100%;
    max-width: 120%;
    min-width: 120%;
    
    position: absolute;
    object-fit: cover;
}



.index_main .section1 .index_banner .scaleBg video { 
/*
    width: 100%;
    height: 100%;
*/
    max-height: 100%;
    min-height: 100%;
      max-width: 100%;
    min-width: 100%;
}
 
.index_main .section1 .index_banner .item .inner .block_txt {
  position: absolute;
  left: 10%;
  top: 23%;
  width: 80%;
  color: #fff;
  opacity: 0;
}
.index_main .section1 .index_banner .item.active .inner .block_txt {
  opacity: 1;
  /*
	-webkit-transform: translateY(0); 
	transform: translateY(0); 
	-webkit-transition-delay: 100ms; 
	transition-delay: 100ms;
	animation: slideIn 1s ease-in forwards;
*/
  -webkit-animation: slideIn 0.2s ease-in forwards;
  animation: slideIn 0.2s ease-in forwards;
}
@-webkit-keyframes slideIn {
  0% {
    transform: translateX(200px);
    opacity: 0
  }
  90% {
    transform: translateX(200px);
    opacity: 0
  }
  to {
    transform: none;
    opacity: 1;
    order: -1
  }
}
@keyframes slideIn {
  0% {
    transform: translateX(250px);
    opacity: 0
  }
  90% {
    transform: translateX(250px);
    opacity: 0
  }
  to {
    transform: none;
    opacity: 1;
    order: -1
  }
}
.fooTxtBox .txt01 {
  margin-bottom: 30px;
  letter-spacing: 1px;
  font-size: 42px;
  line-height: 75px;
  font-weight: bold;
}
.fooTxtBox .txt02 {
    margin-bottom: 70px;
    font-size: 17px;
    line-height: 28px;
    width: 570px;
    letter-spacing: 1.2px;
}
.fooTxtBox .txtLink {}
.fooTxtBox .txtLink a {
  display: block;
  text-decoration: none;
  color: #3667E6;
  width: 135px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  font-size: 18px;
  border-radius: 35px;
  background: #fff;
  margin-left: 10px;
}
.index_main .section1 .slick_txt {
  width: 30%;
  height: 100%;
  background-color: transparent;
  transition: all 500ms ease;
  -webkit-transition: all 500ms ease;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  font-size: 0;
  outline: none;
  border: 0;
}
.index_main .section1 .left {
  left: 0;
}
.index_main .section1 .right {
  right: 0;
}
.index_main .section1 .slick_txt:hover .slick_arrow {
  opacity: 1;
  visibility: visible;
}
.index_main .section1 .slick_txt .slick_arrow {
  width: 20px;
  height: 36px;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: -18px;
  position: absolute;
  top: 50%;
  cursor: pointer;
  transition: all 500ms ease;
  -webkit-transition: all 500ms ease;
  opacity: 0;
  visibility: hidden;
}
.index_main .section1 .slick_txt .prev {
  /* background-image: url(http://www.yiban.com.cn/templets/default/image/ban_prev.png); */
  left: 60px;
}
.index_main .section1 .slick_txt .next {
  /* background-image: url(http://www.yiban.com.cn/templets/default/image/ban_next.png); */
  right: 60px;
}
.index_main .section1 .slick_txt .prev:hover {
  /* background-image: url(http://www.yiban.com.cn/templets/default/image/ban_prev_hover.png); */
}
.index_main .section1 .slick_txt .next:hover {
  /* background-image: url(http://www.yiban.com.cn/templets/default/image/ban_next_hover.png); */
}
.index_main .section1 .number {
  width: 80%;
  position: absolute;
  bottom: 12%;
  left: 10%;
  display: table;
  /*	width: auto;*/
  text-align: left;
  /*
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
*/
}
.index_main .section1 .number span {
  padding: 0;
  box-sizing: border-box;
  margin: 0 5% 0 1.6%;
  width: 13%;
  height: 68px;
  line-height: 68px;
  font-size: 18px;
  color: #fff;
  display: block;
  cursor: pointer;
  position: relative;
  float: left;
}
.index_main .section1 .number span:last-child {
  margin-right: 0;
}
.progress-bar {
  width: 24px;
  height: 3px;
  background-color: hsla(0, 0%, 100%, .48);
  border-radius: 2px;
  overflow: hidden;
}
.progress-bar-slide {
  background-color: #009eff;
  width: 0;
  height: 100%;
}
.active .progress-bar {
  -webkit-animation: widthTrans linear forwards;
  animation: widthTrans linear forwards;
  background: #fff;
}
.active .progress-bar-slide {
  -webkit-animation: expansion 8s linear forwards;
  animation: expansion 8s linear forwards;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
@-webkit-keyframes widthTrans {
  0% {
    width: 12%
  }
  40% {
    width: 110%
  }
  80% {
    width: 95%
  }
  to {
    width: 100%
  }
}
@keyframes widthTrans {
  0% {
    width: 12%
  }
  40% {
    width: 110%
  }
  80% {
    width: 95%
  }
  to {
    width: 100%
  }
}
@-webkit-keyframes expansion {
  to {
    width: 100%
  }
}
@keyframes expansion {
  to {
    width: 100%
  }
}
@media only screen and (max-width: 992px) {
  .index_main .section1 .index_banner .item {
    height: 100vh;
  }
  .index_main .section1 .index_banner .item .inner .block_txt {
    left: 0;
    right: 0;
    margin: 0 auto;
    padding: 0 20px;
    top: 42%;
  }
  .index_main .section1 .index_banner .slick-arrow {
    display: none !important;
  }
  .index_main .section1 .index_banner .slick-dots {
    position: absolute;
    bottom: 12px;
  }
  .index_main .section1 .index_banner .slick-dots li {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #fff;
  }
  .index_main .section1 .index_banner .slick-dots li button {
    display: none;
  }
  .index_main .section1 .index_banner .slick-dots li.slick-active {
    background: #fff;
  }
  .index_main .section1 .number {
    bottom: 12%;
    display: none;
  }
  .index_main .section1 .number span {
    margin-right: 22px;
  }
  .index_main .section1 .number span:after {
    bottom: -14px;
  }
}
.responsive .slick-slide img {
  display: inline-block;
  margin-top: 14px;
}
.responsive .slick-slide {
  text-align: center;
}
@media all and (min-width: 768px) and (max-width: 1600px)  {
      .index_main .section1 .index_banner .item .inner .block_txt {
        left: 13%;
      }
      .index_main .section1 .number {
        left: 13%;
      }
    
    /*.index_main .section1 .index_banner .scaleBg img {*/
    /*    position: absolute;*/
    /*    top: 50%;*/
    /*    left: 50%;*/
    /*    transform: translate(-50%, -50%);*/
    /*    max-height: 100%;*/
    /*    min-height: 100%;*/
        
    /*    min-width: 130%;*/
    /*    max-width: 130%;*/
    /*    margin-left: -15%;*/
    /*}*/

    .index_main .section1 .index_banner .scaleBg video { 
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        max-height: 100%;
        min-height: 100%;
        
        min-width: 130%;
        max-width: 130%;
        margin-left: -15%;
    }
    
}

@media only screen and (max-width: 767px) {
    .index_main .section1 .index_banner .item {
        height: 280px;
    }
    
    .fooTxtBox .txt01 {
        margin-bottom: 8px;
        font-size: 16px;
        line-height: 30px;
    }
    
    .fooTxtBox .txt02 {
        margin-bottom: 15px;
        font-size: 13px;
        line-height: 20px;
        width: auto;
        letter-spacing: 0.5px;
    }

    .fooTxtBox .txtLink a {
        width: 100px;
        height: 30px;
        line-height: 30px;
        font-size: 13px;
        margin-left: 0;
    }

    .index_main .section1 .index_banner .item .inner .block_txt {
        padding: 0 10px;
        top: 30%;
    }
    
    .index_main .section1 .index_banner .slick-dots li {
        width: 17px;
        height: 3px;
        border-radius: 0;
        border: 1px solid #fff;
        margin: 0 3px;
    }
    
    /*.index_main .section1 .index_banner .scaleBg img {*/
    /*    max-width: 150%;*/
    /*}*/
    
    
    
    
    
    
    
    
    
    
    
    
    
}







@media only screen and (max-width: 340px) {}
@media only screen and (max-width: 320px) {}