#fix-box{position: relative;}

/*#about-banner**/
#about-banner{position: relative;padding:87px 0 30px;background:url(../images/about/about-back.webp) no-repeat center ;background-size: cover;}
#about-banner h2{font-size: 30px;text-align: center;color: black;margin-bottom: 40px;}
#about-banner .img-box{margin:0 auto;width: 90%;}
#about-banner img{width: 100%;}

@media(max-width:1000px){
    #about-banner{padding:35px 0;}
    #about-banner h2{font-size: 24px;}
}

@media(max-width:768px){
    #about-banner h2{font-size: 20px;}
}


#fix-menu{position: absolute;left: 8px;top: 5px;padding:22px;border-radius: 5px;border: 1px solid #ddd;background-color: #fff;z-index: 55;}
#fix-menu a{display: block;font-size: 16px;margin-bottom: 30px;}
#fix-menu a.active{color: #239564;}


@media(max-width:1000px){
    #fix-menu{transform: translateX(-100%);transition: all 0.7s ease;-webkit-transition: all 0.7s ease;border-radius:5px 0 5px 5px}
    #fix-menu::after{content:"Menu >";display: inline-block;padding:5px 10px;font-size: 12px;position: absolute;top: -1px;right: -61px;background-color: #fff;border: 1px solid #ddd;border-left: 0;border-radius: 0 5px 5px 0px;}
    #fix-menu.active{transform: translateX(0);}
}




/*about-profile*/
#company-profile{padding: 100px 0;background: #f5f5f5;}
#company-profile .con{font-size: 16px;line-height: 24px;margin:50px 0;padding:0 50px;}
#company-profile .con p{margin-bottom: 20px;font-size: 16px;line-height: 25px;}
#company-profile img{width: 100%;}

#company-profile * {line-height: 1.7;}

@media(max-width:1000px){
    #company-profile{padding: 60px 0 30px;}
    #company-profile .con{font-size: 14px;line-height: 22px;margin: 30px 0;padding: 0 5px;}
}



/*history*/
#history{padding: 100px 0;background: url(../images/about/his-back.webp) no-repeat center;background-size: cover;}
#history h2{color: #fff;}
#history .his-swi{margin-top: 80px;position: relative;}
#history .his-swi .swiper-container{width: calc( 100% - 90px );margin: 0 auto;padding:0 40px;padding-top: 10px;}
#history .his-swi .swiper-container hr{background-color: #fff;width: 100%;height: 1px;position: absolute;left:0;top:10px;}
#history .swiper-button-white{top:10px;background-color: rgba(0,0,0,0.2);width: 40px;height: 40px;border-radius: 50%;background-size: 10px auto;}
#history .swiper-button-prev{left:0;}
#history .swiper-button-next{right:0;}
#history .swiper-slide *{color: #fff;}
#history .swiper-slide .slide-con{padding:40px 0;position: relative;transform: translateY(-10px);}
#history .swiper-slide .slide-con::before{content:"";display:inline-block;position: absolute;left:0;top:0;width: 20px;height: 20px;border-radius: 50%;background-color: rgba(75, 184, 127, 1);}
#history .swiper-slide .slide-con::after{content:"";display:inline-block;position: absolute;left:6px;top:6px;width: 8px;height: 8px;border-radius: 50%;background-color: rgba(204, 253, 217, 1);}
#history .swiper-slide b{display: block;font-size: 26px;margin-bottom: 20px;}
#history .swiper-slide div{font-size: 13px;line-height: 21px;}

@media(max-width:1000px){
    #history{padding: 60px 0 30px;}
    #history .his-swi{margin-top: 35px;}
    #history .his-swi .swiper-container{padding: 10px 0px;}
}



/*#culture*/
#culture{padding: 100px 0;}
#culture .cul-box{margin-top: 60px;}
#culture .cul-box>p{float: right;width: 50%;margin-bottom: 20px;font-size: 18px;color: #666;}

#culture .cul-box .con{padding:35px 60px 60px 60px;background: url(../images/about/cul-back.webp) no-repeat center;background-size: cover;}
#culture .cul-box .con *{color: #fff;}
#culture .cul-box .con .top .img{float: left;width: 47%;margin-top: -80px;}
#culture .cul-box .con .top .img img{width: 100%;}
#culture .cul-box .con .top ul{float: right;width: 50%;}
#culture .cul-box .con .top ul li{margin-bottom: 10px;padding-bottom: 10px;border-bottom: 1px solid #5AA277;}
#culture .cul-box .con .top ul li b{font-size: 15px;display: block;margin-bottom: 5px;}
#culture .cul-box .con .top ul li p{font-size: 14px;line-height: 18px;}

#culture .cul-box .con .icon-box{margin-top: 50px;display: flex;gap: 20px;}
#culture .cul-box .con .icon-list{-webkit-transition: all 0.7s ease;transition: all 0.7s ease;border: 1px solid #5AA277;flex: 1;padding:20px 30px;padding-left: 114px;background-repeat: no-repeat;background-size: 35px auto;background-position: 35px center;}
#culture .cul-box .con .icon-list:nth-child(1){background-image: url(../images/about/culicon1.webp);}
#culture .cul-box .con .icon-list:nth-child(2){background-image: url(../images/about/culicon2.webp);}
#culture .cul-box .con .icon-list:nth-child(3){background-image: url(../images/about/culicon3.webp);}
#culture .cul-box .con .icon-list:nth-child(4){background-image: url(../images/about/culicon4.webp);}
#culture .cul-box .con .icon-list b{font-size: 15px;margin-bottom: 5px;display: block;}
#culture .cul-box .con .icon-list p{font-size: 12px;line-height: 19px;color: rgba(255, 255, 255, 0.7);}
#culture .cul-box .con .icon-list:hover{background-color: #fff;}
#culture .cul-box .con .icon-list:hover *{color:#333}
#culture .cul-box .con .icon-list:hover p{color:#333}

@media (max-width: 1200px){
    #culture .cul-box>p{width: 100%;text-align: center;}
    #culture .cul-box .con .top .img{margin-top: 0;}
    #culture .cul-box .con .icon-box{flex-wrap: wrap;row-gap: 20px;column-gap: 2%;}
    #culture .cul-box .con .icon-list{flex:0 0 49%}
    
}

@media(max-width:1000px){
    #culture{padding: 60px 0 30px;}
    #culture .cul-box{margin-top: 0;}
    #culture .cul-box>p{text-align: left;}

    #culture .cul-box .con{padding: 20px }
    #culture .cul-box .con .top .img{width: 100%;}
    #culture .cul-box .con .top ul{width:100%;margin-top: 20px;}

    #culture .cul-box .con .icon-box{margin-top: 20px;}

    #culture .cul-box .con .icon-list{flex: 0 0 100%;padding: 15px 20px;padding-left: 50px;background-size: 20px;background-position: 15px;}
}



/*#honor*/
#honor-about{padding:120px 0;background-color: rgba(247, 247, 247, 1);position: relative;}
#honor-about .honor-swi{margin-top: 60px;}
#honor-about .honor-swi .swiper-slide>div{padding:10px;background-color: #fff;}
#honor-about .honor-swi .swiper-slide>div .img{padding:50px 20%;background-color: rgba(247, 247, 247, 1);}
#honor-about .honor-swi .swiper-slide>div img{width: 100%;display: block;transform: scale(1);-webkit-transition: all 0.6s ease;-transition: all 0.6s ease;}
#honor-about .honor-swi .swiper-slide>div:hover img{transform: scale(1.05);}
#honor-about .honor-swi .swiper-slide>div p{font-size: 16px;line-height: 27px;text-align: center;}
#honor-about .button-box{position: relative;margin-top: 100px;height: 50px;}
#honor-about .button-box .swiper-button-prev{background-image: url(../images/about/hop.webp);background-size: 40px;background-repeat: no-repeat;width: 40px;height: 40px;left: 45%;}
#honor-about .button-box .swiper-button-next{background-image: url(../images/about/hon.webp);background-size: 40px;background-repeat: no-repeat;width: 40px;height: 40px;right: 45%;}


@media(max-width:1000px){
    #honor-about{padding: 60px 0 30px;}
    #honor-about .honor-swi{margin-top: 0;}
    #honor-about .button-box{margin-top: 20px;}
    #honor-about .button-box .swiper-button-prev{left: 0;}
    #honor-about .button-box .swiper-button-next{right: 0;}
}


/*#staff-style*/
#staff-style h2{color: #fff;}
#staff-style {padding:80px 0;background-color: #239564;}
#staff-style img{display: block;width: 100%;height: auto;}

#staff-style .swiper-thumb{margin-top: 60px;padding:0 80px;position: relative;}
#staff-style .swiper-thumb .swiper-slide{padding:6px;justify-content: center;align-items: center;}
#staff-style .swiper-thumb .swiper-slide .img{overflow: hidden;}
#staff-style .swiper-thumb .swiper-slide .img img{transform: scale(1);-webkit-transition: all 0.6s ease;transition: all 0.6s ease;}
#staff-style .swiper-thumb .swiper-slide.swiper-slide-thumb-active .img {transform: scale(1.05);outline: 2px solid #ECFF7D;}
#staff-style .swiper-thumb .swiper-slide.swiper-slide-thumb-active .img img{transform: scale(1.05);}

#staff-style .swiper-thumb .swiper-button-white{
    background-color: rgba(0, 0, 0, 0.3);
        width: 50px;
        height: 50px;
        background-size: 16px;
}

#staff-style .swiper-big{width: 80%;margin:0 auto;margin-top: 100px;}
#staff-style .swiper-big .slide-con{overflow: hidden;position: relative;background-color: #D7E5CD;}
#staff-style .swiper-big .slide-con .img{float: left;width: 50%;}
#staff-style .swiper-big .slide-con .con{width: 50%;display: flex;justify-content: center;align-items: center;height: 100%;position: absolute;right: 0;top: 0;}


@media(max-width:1000px){
    #staff-style{padding: 60px 0 30px;}
    #staff-style .swiper-thumb{margin-top: 0;}
    #staff-style .swiper-thumb .swiper-button-white{width: 35px;height: 35px;background-size: 10px;}

    #staff-style .swiper-big{width: 100%; margin-top: 30px;}
    #staff-style .swiper-big .slide-con{display: block;}
    #staff-style .swiper-big .slide-con .img{width: 100%;}
    #staff-style .swiper-big .slide-con .con{width: 100%;padding:25px;position: relative;}
}



/*#contact-form*/
#contact-form{padding:80px 0 30px;}
#contact-form .form-box{display: flex;width: 80%;margin:60px auto 40px;}

#contact-form .form-box .contact-icon{width: 50%;background-color: #239564;padding:80px 47px;}
#contact-form .form-box .contact-icon .icon-list{padding-left: 100px;background-repeat: no-repeat;background-position: 20px 0px;background-size: 52px auto;padding-bottom: 20px;}
#contact-form .form-box .contact-icon .icon-list:nth-child(1){background-image: url(../images/about/form_email.webp);margin-bottom:100px;}
#contact-form .form-box .contact-icon .icon-list:nth-child(2){background-image: url(../images/about/form_add.webp);}
#contact-form .form-box .contact-icon .icon-list *{color: #fff;}
#contact-form .form-box .contact-icon .icon-list p{line-height: 27px;}

#contact-form .form-box .contact-icon .icon-list .icon-share a{background-image: url(../images/about/icon-share.webp);display: inline-block;margin-right:15px;width: 26px;height: 26px;background-repeat: no-repeat;background-size: auto 26px;}
#contact-form .form-box .contact-icon .icon-list .icon-share a:nth-child(1){background-position: 0 0;}
#contact-form .form-box .contact-icon .icon-list .icon-share a:nth-child(2){background-position: -46px 0;}
#contact-form .form-box .contact-icon .icon-list .icon-share a:nth-child(3){background-position: -97px 0;}
#contact-form .form-box .contact-icon .icon-list .icon-share a:nth-child(4){background-position: -145px 0;}
#contact-form .form-box .contact-icon .icon-list .icon-share a:nth-child(5){background-position: -190px 0;}
#contact-form .form-box .contact-icon .icon-list .icon-share a:nth-child(6){background-position: -236px 0;}

#contact-form .form-box .form-con{width: 50%;padding:40px 80px;background-color: #F2F2F2;}
#contact-form .form-box .form-con>hr{background-color: #239564;width: 100px;height: 7px;margin-bottom: 25px;}
#contact-form .form-box .form-con b{font-size: 20px;}
#contact-form .form-box .form-con p{margin-bottom: 50px;margin-top: 25px;}

#contact-form .form-box .form-con input{display: block;margin-bottom: 20px;width: 100%;border: 1px solid #D4D4D4;height: 50px;line-height: 50px;padding-left: 10px;background-color: transparent;}
#contact-form .form-box .form-con textarea{display: block;margin-bottom: 20px;width: 100%;border: 1px solid #D4D4D4;background-color: transparent;padding: 10px;}
#contact-form .form-box .form-con button{width: 256px;height: 44px;line-height: 44px;border: 0;background-color: #239564;color: #fff;text-align: center;}


@media(max-width:1000px){
    #contact-form{padding: 60px 0 30px;}

    #contact-form .form-box{width: 100%;display: block;margin-top: 0;margin-bottom: 0;}

    #contact-form .form-box .contact-icon{width: 100%;padding: 20px;}
    #contact-form .form-box .contact-icon .icon-list{padding-left: 35px;background-position: 0px 4px;background-size: 23px auto;padding-bottom: 10px;}
    #contact-form .form-box .contact-icon .icon-list:nth-child(1){margin-bottom: 15px;}
    #contact-form .form-box .contact-icon .icon-list p{font-size: 13px;line-height: 22px;}
    #contact-form .form-box .contact-icon .icon-list .icon-share a{margin-right: 5px;}

    #contact-form .form-box .form-con{width: 100%;padding: 20px;}
    #contact-form .form-box .form-con p{margin-top: 10px;margin-bottom: 20px;}
}










