.banner{
  height:476px;
  background:url(/static/index/img/tbk/banner.png) no-repeat;
}

.advantage li:hover{
  -webkit-animation: pulse;
  animation: pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
div:focus {
  outline: none;
}
/* 对接平台 */
.docking{
  background:url(/static/index/img/tbk/bg1.png) no-repeat;
  padding:56px 24px 67px;
  text-align: center;
}
.docking .span-box{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.docking .title{
  font-size: 38px;
  font-weight: bold;
  color: #333333;
}
.docking .english{
  font-size: 18px;
  font-weight: 400;
  color: #666666;
}
.docking .lm-box{
  width:856px;
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin:61px auto;
}
/* 三大优势 */
.advantage{
  padding:93px 24px 24px;
  text-align: center;
}
.advantage-box{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom:36px;
}
.advantage-box .advantage-title{
  font-size: 40px;
  font-weight: bold;
  color: #333333;
}
.advantage-box .advantage-english{
  font-size: 18px;
  font-weight: 400;
  color: #666666;
}
.one-box{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.one-box .left{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-justify-content: space-around;
      -ms-flex-pack: distribute;
          justify-content: space-around;
  padding:50px 0;
}
.one-box .left img{
  width:483px;
}
.one-box .left .option,.one-box .left .two-option{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  width:640px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.one-box .left li,.one-box .left li{
  width:200px;
  height:200px;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
}
.one-box .left li span,.one-box .lef li span{
  font-size: 16px;
  color: #FFFFFF;
}
.one-box .left .option li:nth-child(1){
  background:url(/static/index/img/tbk/01.png) no-repeat;
  padding:150px 34px 24px;
}
.one-box .left .option li:nth-child(2){
  background:url(/static/index/img/tbk/购买级别拿佣金.png) no-repeat;
  padding:150px 34px 24px;
}
.one-box .left .option li:nth-child(3){
  background:url(/static/index/img/tbk/购物满额拿佣金.png) no-repeat;
  padding:150px 34px 24px;
}
.one-box .left .two-option li:nth-child(1){
  background:url(/static/index/img/tbk/001.png) no-repeat;
  padding:150px 34px 24px;
}
.one-box .left .two-option li:nth-child(2){
  background:url(/static/index/img/tbk/002.png) no-repeat;
  padding:150px 34px 24px;
}
.one-box .left .two-option li:nth-child(3){
  background:url(/static/index/img/tbk/003.png) no-repeat;
  padding:150px 34px 24px;
}
.three-box .three-top{
  width:979px;
  margin-right:165px;
}
.three-box .three-bottom{
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.three-box .three-bottom ul{
  padding:90px 0 103px;
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-right:90px;
}
.three-box .three-bottom li{
  width:540px;
  padding:27px 0 29px 19px;
  background:#FD6A04;
  -webkit-box-shadow: 0px 4px 20px 0px rgba(161, 162, 163, 0.09);
          box-shadow: 0px 4px 20px 0px rgba(161, 162, 163, 0.09);
  border-radius: 12px 0px 12px 12px;
  text-align: left;
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 18px;
  font-weight: 400;
  color: #FFFFFF;
}
.three-box .three-bottom li img{
  margin-right:14px;
}
.three-box .three-bottom li span{
  font-weight: bold;
}
/* 页面展示 */
.swiper{
  padding:75px 24px 67px;
  background:#F9F9F9;
  text-align: center;
}
.swiper-container {
  width: 1212px;
  height: 760px !important;
}
.swiper-wrapper{
  height:760px !important;
}
.swiper-slide {
  text-align: center;
  font-size: 18px;
}
.swiper-slide img{
  width:100%;
  height:100%;
  position: absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
}
.swiper-slide .img1{
  width:85%;
  height:94%;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
  background-image:url(/static/index/img/tbk/left1.png) !important;
}
.swiper-button-prev:hover, .swiper-container-rtl .swiper-button-next:hover{
  background-image:url(/static/index/img/tbk/left2.png) !important;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
  background-image:url(/static/index/img/tbk/right1.png) !important;
}
.swiper-button-next:hover, .swiper-container-rtl .swiper-button-prev:hover{
  background-image:url(/static/index/img/tbk/right2.png) !important;
}
.swiper-box{
  position: relative;
  width:1350px;
  margin:0 auto;
}
.swiper-button-prev{
  position: absolute;
  top:50%;
}
@media only screen and (max-width: 1024px){
  .banner{
    width:100%;
    height:200px;
    background-size:100% 100% !important;
    background:url(/static/index/img/tbk/mobile-bg.png) no-repeat;
  }
  .docking{
    padding:30px 12px;
  }
  .docking .lm-box{
    width:100%;
    margin: 24px auto;
  }
  .docking .lm-box img{
    width:112px;
    height:32px;
  }
  .docking .image{
    width:100%;
  }
  .advantage{
    padding:30px 12px;
  }
  .one-box{
    width:100%;
    display:block;
  }
  .one-box .left{
    padding:0 0 12px;
  }
  .one-box .left img{
    width:90%;
  }
  .one-box .left .option, .one-box .left .two-option{
    width:100%;
    margin-top:12px;
  }
  .one-box .one-img{
    width:80%;
    margin:0 auto;
    display:block;
  }
  .three-box .three-bottom{
    display:block;
  }
  .three-box .three-bottom ul{
    padding:24px;
    margin:0;
  }
  .three-box .three-top{
    width:80%;
  }
  .three-box .three-top2{
    width:100%;
    margin-top:8px;
  }
  .three-box .three-bottom li img{
    width:20px;
    height:20px;
  }
  .three-box .three-img{
    width:80%;
    margin:0 auto;
  }
  .swiper{
    padding:0 24px 24px;
  }
  .swiper-box{
    width:100%;
  }
  .swiper-container{
    width:80%;
  }
  .swiper-button-next, .swiper-container-rtl .swiper-button-prev{
    right:-23px !important;
  }
  .swiper-button-prev, .swiper-container-rtl .swiper-button-next{
    left:-23px !important;
  }
  .swiper-container{
    height:755px !important;
  }
  .swiper-slide{
    height:100% !important;
  }
  .one-box .left .option, .one-box .left .two-option{
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
  }
  .three-box .three-bottom li{
    margin-top:12px;
  }
}
@media only screen and (max-width: 420px){
  .swiper-container{
    height:600px !important;
  }
  .swiper-slide{
    height:80% !important;
  }
  .swiper-container{
    width:100%;
  }
  .docking .title{
    font-size:24px;
  }
  .docking .english{
    font-size: 16px;
  }
  .advantage-box .advantage-title{
    font-size:24px;
  }
  .advantage-box .advantage-english{
    font-size:16px;
  }
  .one-box .left li, .one-box .left li{
    width:110px;
    height:110px;
    font-size: 12px;
    font-weight: bold;
    color: #FFFFFF;
    background-size:100% 100% !important;
  }
  .one-box .left .option li,.one-box .left .two-option li{
    padding: 75px 10px 12px !important;
  }
  .one-box .left li span, .one-box .lef li span{
    font-size:12px ;
  }
  .three-box .three-bottom li{
    width:100%;
    font-size:12px;
    padding: 10px 0 10px 5px;
    margin-top:12px;
  }
}
@media only screen and (max-width: 320px){
  .swiper-container{
    height:500px !important;
  }
  .docking .lm-box img{
    width:100px;
  }
  .swiper-slide{
    height:66% !important;
  }
  .swiper-container{
    width:100%;
  }
  .three-box .three-bottom ul{
    padding:24px 0;
  }
  .docking .title{
    font-size:24px;
  }
  .docking .english{
    font-size: 16px;
  }
  .advantage-box .advantage-title{
    font-size:24px;
  }
  .advantage-box .advantage-english{
    font-size:16px;
  }
  .one-box .left li, .one-box .left li{
    width:90px;
    height:100px;
    font-size: 12px;
    font-weight: bold;
    color: #FFFFFF;
    background-size:100% 100% !important;
  }
  .one-box .left .option li,.one-box .left .two-option li{
    padding: 75px 0px 12px !important;
  }
  .one-box .left li span, .one-box .lef li span{
    font-size:12px ;
  }
  .three-box .three-bottom li{
    width:100%;
    font-size:12px;
    padding: 10px 0 10px 5px;
    margin-top:12px;
  }
}