.main{width: 100%;color: #2C2C48;}
.banner{width: 100%;height: 100vh;overflow: hidden;position: relative;}
.banner img{width:100%;height:auto;min-height:100%;transition:1s linear 2s;transform:scale(1.1,1.1);}
.banner .swiper-slide-active img,.swiper-slide-duplicate-active img{transition:6s linear;transform:scale(1,1);}
.banner .text_h1{position: absolute;top: 3rem;font-size: 0.8rem;font-weight: bolder;color: #fff;text-align: center;width: 100%;z-index: 15;letter-spacing: 0.05rem;}
.banner .text_h2{position: absolute;top: 4.6rem;font-size: 0.3rem;font-weight: bolder;color: #fff;text-align: center;width: 100%;z-index: 15;letter-spacing: 0.05rem;}
.banner .downward{position: absolute;bottom: 0.2rem;width: 100%;display: flex;flex-wrap: wrap;justify-content: center;z-index: 15;}
.banner .downward .img{width: 100%;text-align: center;}
.banner .downward .img img{width: 0.3rem;transition: 0.5s;position: relative;animation: mouse 1s linear infinite;}
.banner .downward .txt{width: 100%;text-align: center;font-size: 0.14rem;color: #fff;margin-top: 0.1rem;}
@keyframes mouse {
    from{
        top: 0;
    }
    to{
        top: -0.1rem;
    }
}

.introduction{width: 100%;height: 8rem;background: url("../images/culture.jpg")no-repeat bottom;background-size: 100%;position: relative;}
.introduction .text_box{width: 100%;height: 67%;background: linear-gradient(to bottom,#fff 40%, rgba(255, 255, 255, 0));padding: 1rem 2rem;box-sizing: border-box;}
.introduction .text_box .about_en{width: 100%;font-size: 0.6rem;font-weight: bolder;position: relative;z-index: 10;}
.introduction .text_box .about_en::after{position: absolute;bottom: 0;left: 0;width: 2rem;height: 0.2rem;background: linear-gradient(to bottom,#fff,#00b750);content: '';z-index: -1;}
.introduction .text_box .about_cn{width: 100%;font-size: 0.36rem;font-weight: bolder;margin-top: 0.2rem;}
.introduction .text_box .about_desc{width: 100%;line-height: 0.34rem;font-size: 0.18rem;margin-top: 0.28rem;}
.introduction .num_box{position: absolute;bottom: -1rem;width: 100%;display: flex;justify-content: center;}
.introduction .num_box .item{width: 3rem;height: 2.6rem;background: #fff;overflow: hidden;border-radius: 0.2rem;margin: auto 0.1rem;box-shadow: 0 0 0.1rem 0.01rem #2c2c4894;}
.introduction .num_box .item .t1{color:#00b750; width: 100%;font-size: 0.18rem;height: 50%;font-weight: bolder;padding: 0.2rem;box-sizing: border-box;display: flex;justify-content: center;align-items: flex-end;line-height: 1;}
.introduction .num_box .item .t1 span{font-size: 0.5rem;}
.introduction .num_box .item .t2{width: 100%;font-size: 0.18rem;height: 50%;padding: 0.2rem;box-sizing: border-box;text-align: center;}
.introduction .video_btn{position: absolute;top: 5rem;width: 100%;display: flex;justify-content: center;z-index: 15;}
.introduction .video_btn .img_box{
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.5s;
    border-radius: 0.08rem;
    z-index: 15;
}


.introduction .video_btn .img_box .btn{
    width: 0.77rem;
    height: 0.77rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 15;
    transition: 0.5s;
    cursor: pointer;

}

.introduction .video_btn .img_box .btn::after{
    content: '';
    background: url("../images/xunhuan.png") no-repeat center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: 1s;
    animation: bofang 3s linear infinite;
    background-size: 100% 100%;
    z-index: 14;
}

.introduction .video_btn .img_box .btn img{
    width: 49%;
}
@keyframes bofang {
    from{
        transform: rotate(0);
    }
    to{
        transform: rotate(360deg);
    }
}

.culture{width: 100%;height: 7rem;margin-top: 2rem;overflow: hidden;}
.culture .top{width: 100%;display: flex;justify-content: center;flex-wrap: wrap;background: #fff;height: 2rem;align-content: flex-start;}
.culture .top .about_en{font-size: 0.6rem;font-weight: bolder;position: relative;z-index: 10;}
.culture .top .about_en::after{position: absolute;bottom: 0;left: 50%;transform: translateX(-50%); width: 2rem;height: 0.2rem;background: linear-gradient(to bottom,#fff,#00b750);content: '';z-index: -1;}
.culture .top .about_cn{width: 100%;font-size: 0.36rem;font-weight: bolder;margin-top: 0.2rem;text-align: center;}
.culture .list{background: #fff;width: 100%;display: flex;justify-content: center;height: 5rem;}
.culture .list .item{width: 3rem;height: 4rem;display: flex;align-content: center;flex-wrap: wrap;justify-content: center;margin: auto 0.2rem;box-shadow: 0 0.05rem 0.08rem 0.02rem #2c2c4859;overflow: hidden;}
.culture .list .item .img{width: 1rem;height: 1rem;border-radius: 1rem;border:0.04rem solid #2C2C48;display: flex;justify-content: center;align-items: center;transition: 0.5s;overflow: hidden;}
.culture .list .item .img img{width: 0.5rem;}
.culture .list .item .title{width: 100%;font-size: 0.2rem;font-weight: bolder;text-align: center;margin-top: 0.18rem;transition: 0.5s;overflow: hidden;line-height: 1;}
.culture .list .item .desc{transition: 0.5s; display: none;align-content: center;flex-wrap: wrap; width: 100%;height: 100%;background: #2c2c4838;color: #fff;padding: 0.5rem 0.5rem;box-sizing: border-box;text-align: center;line-height: 0.34rem;font-size: 0.18rem;}
.culture .list .item:hover{background-size: 100% 100%;background: url("../images/culture.jpg") no-repeat fixed;}
.culture .list .item:hover .img{height: 0;border: none;}
.culture .list .item:hover .title{height: 0;margin: 0;}
.culture .list .item:hover .desc{height: 100%;display: flex;}

.honor{width: 100%;height: 7rem;background: url("../images/honor.jpg")no-repeat center;background-size: cover;background-attachment: fixed;position: relative;}
.honor .text_box{width: 6rem;height: 100%;position: absolute;right: 0;background: linear-gradient(to right, #fff0,#fff 50%);padding: 1rem 2rem 0 0;box-sizing: border-box;}
.honor .text_box .top{width: 100%;display: flex;justify-content: flex-end;flex-wrap: wrap;height: 2rem;align-content: flex-start;}
.honor .text_box .top .about_en{font-size: 0.6rem;font-weight: bolder;position: relative;z-index: 10;}
.honor .text_box .top .about_en::after{position: absolute;bottom: 0;right: 0; width: 1.5rem;height: 0.2rem;background: linear-gradient(to bottom,#fff,#00b750);content: '';z-index: -1;}
.honor .text_box .top .about_cn{width: 100%;font-size: 0.36rem;font-weight: bolder;margin-top: 0.2rem;text-align: right;}
.honor .text_box .desc{width: 100%;font-size: 0.18rem;line-height: 0.34rem;text-align: justify;}
.honor .text_box .desc span{font-weight: bolder;}

.news{width: 100%;height: 9.8rem;padding: 0.5rem 2rem;box-sizing: border-box;}
.news .top{width: 100%;display: flex;justify-content: flex-start;flex-wrap: wrap;height: 2rem;align-content: flex-start;}
.news .top .about_en{font-size: 0.6rem;font-weight: bolder;position: relative;z-index: 10;}
.news .top .about_en::after{position: absolute;bottom: 0;left: 0; width: 1rem;height: 0.2rem;background: linear-gradient(to bottom,#fff,#00b750);content: '';z-index: -1;}
.news .top .about_cn{width: 100%;font-size: 0.36rem;font-weight: bolder;margin-top: 0.2rem;text-align: left;}
.news .list{width: 100%;margin-top: 0.5rem;position: relative;height: 6rem;}
.news .list .item{width: 4.5rem;height: 5rem;background-color: #fff;border-radius: 0.04rem;box-shadow: 0 0.05rem 0.08rem 0.02rem #2c2c4859;overflow: hidden;display: block;margin-bottom: 0.2rem;}
.news .list .item .img{width: 100%;height: 3rem;overflow: hidden;}
.news .list .item .img img{width: 100%;height: 100%;object-fit: cover;transition: 0.5s;}
.news .list .item .txt{width: 100%;height: 2rem;padding: 0.2rem;box-sizing: border-box;}
.news .list .item .txt .title{width: 100%;white-space: nowrap;font-size: 0.2rem;font-weight: bold;text-overflow: ellipsis;overflow: hidden;}
.news .list .item .txt .desc{width: 100%;height: 0.84rem; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;font-size: 0.16rem;line-height: 0.3rem;margin-top: 0.16rem;margin-bottom: 0.1rem;}
.news .list .item .txt .date{font-size: 0.14rem;opacity: 0.5;}
.news .list .item:hover .img img{transform: scale(1.5)}
.news .list .item:hover .title{color: #00b750;}
.news .list .swiper-scrollbar-drag{background: #00b750!important;}

.footer{
    width: 100%;
    height: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    background-color: #00b750;
}
.footer .p{
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 0.18rem;
    line-height: 0.4rem;
}
.video_layer{display:none;}
.pinpai{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0.2rem 2rem;
    box-sizing: border-box;
    background-color: #00b75008;
}
.pinpai .img{width: 0.7rem;height: 0.7rem;display: flex;justify-content: center;align-items: center;}
.pinpai .img img{width: 100%}
.pinpai .txt{font-size: 0.2rem;max-width: 90%;}
.pinpai .txt #affiche{margin: auto;}

@media only screen and (max-width:768px){
    .banner{height: 4.2rem;}
    .banner .text_h1{top: 1.5rem;font-size: 0.6rem;}
    .banner .text_h2{top: 2.5rem;}
    .introduction .text_box{padding: 0.5rem;}
    .introduction{height: auto;background-size: cover;}
    .introduction .num_box{position: relative;justify-content: space-between;}
    .introduction .video_btn{top: 4.8rem;}
    .introduction .num_box .item{width: 1.8rem;margin: auto;}
    .introduction .num_box .item .t1 span{font-size: 0.4rem;}
    .introduction .num_box .item .t2{font-size: 0.24rem;}
    .introduction .text_box .about_desc{font-size: 0.24rem;text-align: justify;}
    .culture .list{flex-wrap: wrap;align-content: flex-start;height: auto;}
    .culture{height: auto;padding-bottom: 0.5rem;}
    .culture .list .item{margin-bottom: 0.2rem;}
    .culture .list .item .title{font-size: 0.34rem;}
    .honor .text_box{padding: 0.5rem 0.5rem;}
    .honor .text_box .desc{font-size: 0.26rem;line-height: 0.5rem;}
    .honor{height: 8rem;}
    .news{padding: 0.5rem;}
    .news .top{height: auto;}
    .news .list .item{width: 100%;height: 5.5rem;}
    .news .list .item .txt .title{font-size: 0.3rem;}
    .news .list .item .txt .desc{font-size: 0.24rem;line-height: 0.4rem;}
    .news .list .item .txt .date{font-size: 0.22rem;}
    .footer .p{font-size: 0.24rem;}
    .pinpai{padding: 0.2rem 0.5rem;}
}