@charset "utf-8";

/* ===================首页样式========================== */

.banner-lun {position: relative;}

.banner-lun > img{width: 100%;}

.banner-lun .content{position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;display: flex;align-items: center;}

.banner-control{position: absolute;width: 100%;left: 0;bottom: 80px;z-index: 3;color: #fff;}

.banner-control .contain{align-items: center;}

.banner-control .this{font-size: 17px;color: #e22017;margin-left: 15px;}

.banner-control .leng{font-size: 14px;line-height: 15px;}

.banner-control span{font-size: 14px;color: #e22017;margin: 0px 5px 0px 7px;}

.banner-control .line{width: 170px;height: 3px;background: rgba(255, 255, 255, .3);position: relative;}

.banner-control .line::after{content: "";position: absolute;width: 0;height: 100%;background: #e22017;}

.banner-control .line.on::after{animation: bannerLine 4.6s linear both;}

.banner-control .line.one.on::after{animation: bannerLine 3.6s linear both;}

@keyframes bannerLine{0%{width: 0;}100%{width: 100%;}}

.banner-btn {position: absolute;z-index: 4;left: 0px;width: 100%;bottom: 80px;}

.banner-btn .contain{display: flex;justify-content: flex-end;}

.banner-btn .btn{color: #fff;font-size: 55px;transform: rotate(-90deg);animation: backTop .6s linear infinite alternate;}

@keyframes backTop{0%{transform:translateY(0px)rotate(-90deg);}100%{transform:translateY(10px)rotate(-90deg);}}

.banner-lun .content .name{opacity: 0;}

.banner-lun .content .title{opacity: 0;}

.banner-lun .content .IndBtn{opacity: 0;}

.swiper-slide-active .banner-lun .content .name{animation: bannerRun 1s ease both .9s;}

.swiper-slide-active .banner-lun .content .title{animation: bannerRun 1s ease both 1s;}

.swiper-slide-active .banner-lun .content .IndBtn{animation: bannerRun 1s ease both 1.1s;}

@keyframes bannerRun{0%{opacity: 0;transform: translateX(280px);filter: blur(4px);}100%{opacity: 1;transform: translateX(0);filter: blur(0);}}

.banner-code {position: absolute;bottom: 150px;left: 0px;width: 100%;z-index: 3;}

.banner-code-list {flex-direction: column;}

.banner-code-list a{width: 34px;height: 34px;display: flex;justify-content: center;align-items: center;transition: all .4s ease;border-radius: 100px;background-color: #ffffff;color:#e22017;font-size: 14px;margin-bottom: 9px;    font-weight: 500;    position: relative;}

.banner-code-list a:last-child{margin-bottom: 0px;}

.banner-code-list a:hover {color: #fff;background-color: #e22017;}
.banner-code-list a span{
    position: absolute;
    width: max-content;
    left: 50px;
    color: #fff;
    transition: all 0.3s;
    opacity: 0;
}
.banner-code-list a:hover span{
    opacity: 1;
}

.indcp {background-color: #fff;padding: 0px 160px;}

.indcp-list {display: flex;flex-direction: column;align-items: center;justify-content: center;height: 155px;}

.indcp-list .img{height: 55px;display: flex;align-items: center;    overflow: hidden;}

.indcp-list .img img{max-height:100%;}

.indcp-list .title{color: #7b7e86;font-family: 'HS-R';}

.indcp-list:hover .title{color: #e22017;}













/* -------------------------PC端--------------------------- */

@media all and (max-width:1700px) {

    /* 1600 × (900) */

}



@media all and (max-width:1590px) {

    /* 1440 × (700)  */

    .indcp {padding: 0px 65px;}

    .indcp-list {height: 130px;}

    /* .indpc-cont .cont-l {height: 660px;} */

    
}



@media all and (max-width:1430px) {

    /* 1360 */

}



@media all and (max-width:1350px) {

    /* 1280 */

}



@media all and (max-width:1270px) {

    /* 1152 × (700) */

    .banner-code {display: none;}

    .banner-btn {bottom: 20px;}

    .banner-control {bottom: 25px;}

  
}



/* ------------------------平板端-------------------------- */

@media all and (max-width:1100px) {

    /* 1024 横屏 */

}



@media all and (max-width:1000px) {

    /* 720 竖屏 */

    .banner-lun > img {min-height: 200px;}

    .banner-btn {display: none;}

    .banner-control .line {width: 130px;}

    .banner-control .this {font-size: 14px;margin-left: 10px;}

    .banner-control .leng {font-size: 12px;line-height: 11px;}

    .indcp {padding: 0px 4%;}

    .indcp-list {height: 110px;}


}



/* ------------------------手机端-------------------------- */

@media all and (max-width:680px) {

    /* 移动终端 360 适配 */

    .indcp-list .img {height: 35px;}

    .indcp-list {height: 80px;}

    .banner-lun .content .title {font-size: 22px;}

    .IndBtn {width: 100px;height: 35px;}

    .IndBtn2 {width: 100px;height: 35px;}

    .IndBtn2::before {width: 98px;height: 32px;}

    .swiper-pagination-bullet {margin: 0px 15px;}

    .swiper-pagination-bullet::before {width: 18px;height: 18px;border: 1px solid #e22017;}

    .swiper-btn a {width: 35px;height: 35px;font-size: 14px;}

}