.main{ line-height: 30px; padding: 3% 0;}
body {
    --theme-bg: #0b448c;
}


@media screen and (max-width:768px){
    .row{ margin: 0;}
}
.img-cover-4by3{ width: 100%; height: 0; padding-bottom: 50%; position: relative; overflow: hidden;}
.abs-center{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;}
/*.shuiyin{ position: absolute; left: 0; top: 0; z-index: 1; background: url("../images/shuiyin.png") no-repeat center; width: 100%; height: 100%; background-size: 50%;}*/

.my-button-disabled{opacity: 1!important;pointer-events:visible!important; cursor: pointer!important;}
.jw-controlbar { width: 100% !important;}

#dituContent label {
    max-width: unset!important;
    text-align: center;
}
@media screen and (max-width:1200px){
}

@media screen and (max-width:991px){
    .layui-layer{ width: 94% !important; left: 3% !important;}
    .p15{ padding-left: 15px; padding-right: 15px;}
}


@keyframes fn1 {
    0% {
        opacity: 0;
        clip-path: inset(100% 0 0 0);
        transform: translate3d(0%, 20px, 0);
    }
    100% {
        opacity: 1;
        clip-path: inset(0 0 0 0);
        transform: none;
    }
}
.fn1 {
    animation-name: fn1;
    animation-duration: 1.2s;
    animation-timing-function: cubic-bezier(0.49, 0.54, 0.16, 1);
}


.canshu_nr{ overflow: hidden;}



/*头部*/
#top_index{ height: auto; margin: 0 auto; transition: 0.3s; width: 100%; z-index: 99; position: fixed; border-bottom: 1px solid rgba(255,255,255,0.2);}
#top_index_zy{ height: auto; margin: 0 auto; position: relative; transition: 0.3s; background: #fff; border-bottom: 1px solid rgba(0,0,0,0.1); box-shadow: 0 0 10px rgba(0,0,0,0.1);}
#logo{ text-align: center; transition: 0.3s; padding: 15px;}
#logo a{ display: block;}
#logo a img{ max-width: 100%; transition:0.5s;}
#logo .show{ display: inline-block;}
#logo .hidden{ display: none;}
.top_tel{ color: #fff; font-size: 24px;}
.top_tel svg{ width: 30px; margin-right: 10px;}
.top_tel path{ fill: #fff; }
@media screen and (max-width:1600px){
    .top_tel p{ font-size: 20px;}
    .top_tel i{ font-size: 24px;}
}
@media screen and (max-width:1440px){
}
@media screen and (max-width:768px){
}

#nav{ height: auto; transition:0.3s; text-align: center;}
#nav li{ display: inline-block; font-size: 16px; text-align: center; transition:0.5s; padding: 3% 0;}
#nav li .big{ display: block; position: relative; z-index: 1; line-height: 22px; color: #fff;}
/*#nav li:before{ position: absolute; left: 50%; bottom: 0; content: ''; background: #fff; height: 3px; width: 0; transition: 0.3s;}*/
/*#nav li:hover:before{ width: 20%; left: 40%;}*/

#nav li .navson{display: none; position: absolute; left: 0; overflow: hidden; border-top: 1px solid #ededed; background: url("../images/rybj.jpg") no-repeat center top #fff; box-shadow: 0 10px 10px rgba(0,0,0,0.05); color: #333; top: 100%; z-index: 99999; width: 100vw;}
#nav li .navson .main{ padding: 50px 0;}
#nav li .navson .nav_font{ width: 100%; text-align: left; line-height: 30px;}
#nav li .navson .nav_font h4{ color: var(--theme-bg); font-size: 26px; height: 50px; font-weight: bold !important; position: relative;}
#nav li .navson .nav_font h4:before{ position: absolute; left: 0; bottom: 0; content: ''; width: 3%; height: 3px; background: var(--theme-bg);}
#nav li .navson .nav_font .font{ color: #999999; font-size: 16px; padding: 2% 0; width: 60%;}
#nav li .navson .nav_font dl{ margin: 0;}
#nav li .navson .nav_font dl dd{ float: left; margin-right: 3%; text-align: left; transition: 0.3s;}
#nav li .navson .nav_font dl dd svg{ width: 16px; margin-right: 5px;}
#nav li .navson .nav_font dl dd a{ color: #333333; font-size: 16px;}
#nav li .navson .nav_font dl dd:hover a{ color: var(--theme-bg);}
#nav li .navson .nav_font .ly{ margin-top: 3%; height: 50px; line-height: 50px; background: var(--theme-bg); width: 12%; color: #fff; text-align: center; transition: 0.3s;}
#nav li .navson .nav_font .ly:hover{ background: #014397;}


.top_index_active{ background: #fff !important; box-shadow: 0 0 20px rgba(0,0,0,0.2);}
.top_index_active #logo .show{ display: none;}
.top_index_active #logo .hidden{ display: inline-block;}
.top_index_active #nav li .big{ color: #333;}
.top_index_active .top_tel{ color: var(--theme-bg);}
.top_index_active .top_tel path{ fill: var(--theme-bg); }

.top_bj_active{ width: 100%; z-index: 20; background: rgba(0,0,0,0.4); top: 0; box-shadow: 0 0 20px rgba(0,0,0,0.1); position: fixed !important;}
.top_bj_active #logo{ padding: 0.2% 0;}
.top_bj_active #logo img{ transform: scale(0.8);}
.top_bj_active #nav li{ padding: 1% 0;}

@media screen and (max-width:1800px){
}
@media screen and (max-width:1700px){
}
@media screen and (max-width:1600px){
    #nav li .big p{ display: none;}
    #nav li{ padding: 3% 0;}
}
@media screen and (max-width:1440px){
    #logo a img{ max-width: 100%;}
    .top_tel{ font-size: 20px;}
    .top_tel i{ display: none;}
}
@media screen and (max-width:1350px){
}
@media screen and (max-width:1300px){
}
@media screen and (max-width:1200px){
    #nav li{ font-size: 14px;}
}
@media screen and (max-width:991px){
    #top_index{ padding: 0; width: 100%;}
    #top_index .row{ margin: 0 !important;}
    #logo{ text-align: left; padding: 2%;}
}
@media screen and (max-width:768px){
    #logo a img{ max-width: 85%;}
    #logo{ padding: 2%;}
    .top_bj_active #logo{ padding: 2%;}
    .top_bj_active #logo img{ transform: scale(1);}
}


.banner {position: relative;height: auto !important;z-index: 1;top:0;}
.banner .swiper-wrapper{height: auto !important;}
.banner .swiper-slide {position: relative;height: auto !important;float: left;}
.banner .swiper-slide a{display:block;width:100%;height: auto !important;}
.banner .swiper-slide a img{ width: 100%; height: auto;}
.banner .swiper-pagination {position: absolute;font-size:0;left: 0;height: 20px;text-align: center;bottom: 6% !important;width: 100%;z-index: 9999;}
.banner .swiper-pagination-bullet{transition:.4s; opacity: 1; width: 10px; height: 10px; background: #fff;}
.banner .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{bottom: 25px;}
.banner .swiper-pagination-bullet-active{width: 50px;height: 10px;border-radius:20px;background:#fff;}
#swiper-slide1{position: relative;}
#swiper-slide1 .bannera{position: absolute;z-index: 3;width: 100%;height: 100%;background: rgba(0,0,0,.3);text-align: center;padding-top: 12%;}
#swiper-slide1 .bannera img{max-width: 100%;}
#swiper-slide1 .bannera span{display: block;font-size: 70px;line-height: 100px;color:#fff;margin-top: 2%;font-weight: bold;}
#swiper-slide1 .bannera em{display: block;width: 40px;height: 4px;background: #fff;margin:2rem auto 3rem;}
#swiper-slide1 .bannera p{font-size: 30px;letter-spacing: 1px; line-height: 80px;color:#fff;text-align: center;text-transform: uppercase;font-family: fz;}
#swiper-slide1 .bannera i{display: block; font-size: 34px;font-weight: 50;color: rgba(255,255,255,.8);letter-spacing: 1px;}

#swiper-slide2{position: relative;}
#swiper-slide2 .bannerb{position: absolute;z-index: 3;width: 100%;height: 100%;background: rgba(0,0,0,.3);text-align: center;padding-top: 12%;}
#swiper-slide2 .bannerb img{max-width: 100%;}
#swiper-slide2 .bannerb span{display: block;font-size: 70px;line-height: 100px;color:#fff;margin-top: 2%;font-weight: bold;}
#swiper-slide2 .bannerb em{display: block;width: 40px;height: 4px;background: #fff;margin:2rem auto 3rem;}
#swiper-slide2 .bannerb p{font-size: 30px;letter-spacing: 1px; line-height: 80px;color:#fff;text-align: center;text-transform: uppercase;font-family: fz;}
#swiper-slide2 .bannerb i{display: block; font-size: 34px;font-weight: 50;color: rgba(255,255,255,.8);letter-spacing: 1px;}


.banner-swiper img{ width: 100%;}

@media screen and (max-width:1440px){
}
@media screen and (max-width:1200px){
}
@media screen and (max-width:768px){
}

#mobile_banner img{ width: 100%;}
#mobile_banner .swiper-pagination-bullet-active{ background: #d33f23;}




/*底部*/
#end_bj{ background: url("../images/endbj.jpg") no-repeat center; width: 100%; text-align: left; position: relative; color: #fff;}
#end_logo{ padding: 3% 0 5%;}
#end_logo .end_logo1{ width: 70%;}
#end_logo .end_logo1 span{ display: block; padding-left: 30px; font-size: 38px; font-weight: 100 !important;}
#end_logo .end_tel p{ font-size: 18px;}
#end_logo .end_tel span{ font-size: 30px; font-family: cursive;}

.end_nav ul li.big{ font-size: 18px; height: 45px; color: #fff;}
.end_nav ul li{ height: 35px; line-height: 35px;}
.end_nav ul li a{ color: rgba(255,255,255,0.5); font-size: 16px; transition: 0.3s;}

.ewm span{ display: block; height: 50px; line-height: 50px; color: #999999; font-size: 16px;}
.ewm img{ max-width: 45%;}
.end_lx{ padding-top: 30px !important;}
.end_lx li{ color: rgba(255,255,255,0.5); line-height: 35px;}

#end_line{ height: auto; padding: 10px 0; line-height: 30px; color: rgba(255,255,255,0.3); border-top: 1px solid rgba(255,255,255,0.2); text-align: center; }
#end_line a{ color: rgba(255,255,255,0.3);}
#end_line a:hover{ color: #fff;}
@media screen and (max-width:1440px){
}
@media screen and (max-width:1200px){
    #end_logo .end_logo1 span{ font-size: 22px;}
}
@media screen and (max-width:991px){
    #end_nr_bj .main .ewm{ margin-top: 3% !important;}
    #end_logo .end_logo1 span{ display: none;}
}
@media screen and (max-width:768px){
    #end_logo .end_tel{ display: none;}
}



.footer_zx{ height:60px; overflow: hidden; right:0; bottom:0; z-index: 20; width:100%; line-height: 25px; position: fixed; background-color:#1e2830;}
.footer_zx a{ color:#fff !important; display: block; width: 50%; height: 100%; float: left; text-align: center; background-color:#1e2830;}
.footer_zx a:last-of-type{ background: var(--theme-bg);}
.footer_zx svg{ width: 28px; padding: 2% 0 1%; font-weight: normal;}
.footer_zx svg path{ fill: #fff;}
.footer_zx p{font-size: 13px;}
.kb50{ height: 60px;}

@media screen and (max-width:1440px){
}
@media screen and (max-width:1200px){
}
@media screen and (max-width:991px){
}
@media screen and (max-width:768px){
    .footer_zx i{ padding: 2% 0 1%;}
}





/*首页*/
.tit_in{ position: relative;}
.tit_in:before{  text-transform: uppercase; content: attr(data-title); position: absolute; right: 0; margin: auto; top: 12%; display: block; width: 100%; height: 80px; line-height: 80px; text-align: right;  background-image: linear-gradient(to bottom, #939eb0, #dbe2ea); background-clip:text; -webkit-background-clip:text; color: transparent; font-size: 72px; font-weight: bold; opacity: 0.2;}
.tit_in h2{ position: relative; color: #000; font-size: 36px; font-weight: bold !important;}
.tit_in h2 svg{ width: 30px;}
.tit_in h2 svg path{ fill: #05c7ff;}
.tit_in p{ color: #828282; font-size: 16px; padding-top: 5px;}
@media screen and (max-width:1440px){
    .tit_in h2{ font-size: 30px;}
    .tit_in p{ font-size: 14px;}
}
@media screen and (max-width:1200px){
    .tit_in:before{ font-size: 50px; top: 0;}
}
@media screen and (max-width:991px){
    .tit_in h2{ font-size: 22px;}
    .tit_in p{ font-size: 12px; padding: 0;}
    .tit_in h2 svg{ width: 20px;}
    .tit_in:before{ font-size: 30px;}
}

#cpclass{ width: 70%;}
#cpclass .swiper-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 20px;
}
#cpclass .swiper-slide {
    text-align: center;
    transition: 0.3s;
    padding: 20px 0 10px;
    /* Center slide text vertically */
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#cpclass .swiper-slide .pic{ }
#cpclass .swiper-slide .pic img{}
#cpclass .swiper-slide .tit{ font-size: 16px; height: 40px; line-height: 40px; transition: 0.3s; white-space: nowrap; text-overflow:ellipsis; overflow: hidden;}
#cpclass .swiper-slide:hover{ background: #fff; box-shadow: 0 0 15px rgba(0,0,0,0.1);}



.cp_ul li{ width: 19%; padding: 3% 0 0;overflow: hidden; text-align: center; position: relative; transition: 0.3s;}
.cp_ul li:before{ position: absolute; left: 0; top: 0; width: 100%; height: 90%; content: ''; background-image: linear-gradient(to right, #e5e9ec, #bfc3cc); border-radius: 15px; transition: 0.5s;}
.cp_ul li:after{ position: absolute; width: 100%; height: 100px; line-height: 100px; left: 0; bottom: 7%; content: 'Yangbo'; font-size: 100px; text-transform: uppercase; color: rgba(255,255,255,0.3); font-weight: bold; opacity: 0; transition: 0.5s;}
.cp_ul li .pic{ margin-top: 20px; height: auto; width: 100%; position: relative; z-index: 1; overflow: hidden; transition:0.3s;}
.cp_ul li .pic img{ margin-left: -25%; height: 100%; text-align: center; transition:0.3s; transform: translatey(-30px) scale(0.8);}
.cp_ul li .tit{ color: #303030; font-size: 20px; position: relative; height: 40px; white-space: nowrap; overflow:hidden; text-overflow: ellipsis;}
.cp_ul li:hover:before{}
.cp_ul_li{ width: 16% !important;}
.cp_ul_li_active{ width: 30% !important;}
.cp_ul_li_active .pic img{ transform: translatey(20px) scale(1.1)!important; margin-left: 0 !important;}
.cp_ul_li_active:after{ opacity: 1 !important;}
@media screen and (max-width:1440px){
    .cp_ul li .pic img{ margin-left: -45%;}
    .cp_ul_li_active .pic img{ margin-left: -10% !important;}
}
@media screen and (max-width:1200px){
    .cp_ul li .pic img{ margin-left: -75%;}
    .cp_ul_li_active .pic img{ margin-left: -10% !important;}
    .cp_ul li .tit{ font-size: 18px;}
}
@media screen and (max-width:991px){
    .cp_ul li{ float: left; width: 32%; margin: 0 0.5%;}
    .cp_ul li .pic img{ width: 100%; margin: 0 !important;}
    .cp_ul_li{ width: 32% !important;}
    .cp_ul_li_active{ width: 32% !important;}
    .cp_ul_li_active .pic img{ transform: translatey(-25px) scale(1.1)!important;}
    .cp_ul li:after{ bottom: 0; font-size: 50px;}
    .cp_ul li .tit{ font-size: 16px;}
}
@media screen and (max-width:768px){
    #cpclass{ width: 100%;}
    .cp_ul li{ width: 49%;}
    .cp_ul_li{ width: 49% !important;}
    .cp_ul_li_active{ width: 49% !important;}
    .cp_ul li:after{ font-size: 40px;}
}





#albj{ background: url("../images/albj.jpg") no-repeat center;}
#scsl{ margin-top: 3%; padding: 0 28%; position: relative;}
#scsl .swiper-container {
    width: 100%;
    height: 100%;
    position: relative;
}
#scsl .swiper-slide {
    text-align: left;
    transition:0.3s;
    position: relative;

    /* Center slide text vertically */
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#scsl .swiper-slide .pic{ display: block; width: 100%; height: 0; padding-bottom: 65%; border-radius: 15px; overflow: hidden; position: relative; overflow: hidden;}
#scsl .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; border-radius: 15px; left: 0; position: absolute; transition:0.3s;}
#scsl .swiper-slide .pic p{ position: absolute; left: 0; bottom: 30px; z-index: 2; width: 100%; height: auto; transition:0.4s; opacity: 1; text-align: center; color: #fff; font-size: 18px;}
#scsl .swiper-slide .pic .bj{ position: absolute; left: 0; bottom: 0; width: 100%; height: 50%; content: ''; background-image: linear-gradient(to top, rgba(0,0,0,0.7), rgba(255,255,255,0.01)); z-index: 1;}
#scsl .swiper-button-next,#scsl .swiper-button-prev{ width: 50px; height: 50px; background: #05c7ff; border-radius: 100%; transition: 0.3s;}
#scsl .swiper-button-next:after,#scsl .swiper-button-prev:after{ color: #fff; font-size: 20px;}
#scsl .swiper-button-next:hover,#scsl .swiper-button-prev:hover{ background: var(--theme-bg);}
#scsl .swiper-button-next{ right: 30%;}
#scsl .swiper-button-prev{ left: 30%;}
@media screen and (max-width:1440px){
    #scsl{ padding: 0 20%;}
    #scsl .swiper-button-next{ right: 15%;}
    #scsl .swiper-button-prev{ left: 15%;}
}
@media screen and (max-width:1200px){
}
@media screen and (max-width:991px){
    #scsl{ padding: 0 13%;}
}
@media screen and (max-width:768px){
    #scsl{ padding: 0;}
    #scsl .swiper-button-next{ right: 0;}
    #scsl .swiper-button-prev{ left: 0;}
}


.index-all-pro{ height: auto; overflow: hidden; text-align: center;}
.index-all-pro li{ float: left; width: 13%; overflow: hidden; height: 700px; position: relative; transition: all 0.5s; }
.index-all-pro li .pic{width: 100%; height: 100%; position: relative; overflow: hidden; background: #000000; transition: 0.3s;}
.index-all-pro li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition: all 2.5s; opacity: 0.4;}
.index-all-pro li .content{ transition: 0.5s; text-align: center; z-index: 9; bottom: 0; left:0; position: absolute; width: 100%; height: 100%; color: #fff; padding: 45% 5% 0;}
.index-all-pro li .content a{ color: #fff !important;}
.index-all-pro li .content .tit h5{ font-size: 30px; width: 100%; letter-spacing: 7px; position: relative; height: auto; writing-mode: vertical-lr; padding-left: 43%; transition: 0.3s;}
.index-all-pro li .content .tit span{ opacity: 0; font-size: 18px; text-transform: uppercase; transition: 0.3s;}
.index-all-pro li .content .nr{ font-size: 16px; padding: 7%; line-height: 40px; opacity: 0; transition: 0.5s;}
.index-all-pro li .content i{ opacity: 0; width: 68px; height: 68px; line-height: 68px; border: 1px solid #fff; text-align: center; color: #fff; font-size: 40px; font-weight: 100 !important; border-radius: 100%; margin: 5% auto 0; transition: 0.3s;}

.index-all-pro li:hover .pic{ background: #000;}
.index-all-pro li:hover .pic img{  transform: scale(1.1); opacity: 0.7; }
.index-all-pro li:hover .content{ padding-top: 25%;}
.index-all-pro li:hover .content .nr,.index-all-pro li:hover .content i{ opacity: 1;}
.index-all-pro li:hover .content .tit span{ opacity: 1;}
.index-all-pro li:hover .content .tit h5{ padding-left: 0; writing-mode: horizontal-tb; letter-spacing: 0;}

.index-all-pro .youshi_li{ width: 10%;}
.index-all-pro .youshi_li_active{ width: 30%;}


@media screen and (max-width:1440px){
    .index-all-pro li .content .nr{ font-size: 14px; line-height: 30px; padding: 7% 0;}
    .index-all-pro li{ height: 650px;}
    .index-all-pro li .content .tit h5{ font-size: 24px;}
    .index-all-pro li .content .tit span{ font-size: 14px;}
}
@media screen and (max-width:1200px){
    .index-all-pro li{ height: 600px;}
    .index-all-pro li .content .tit h5{ font-size: 18px;}
    .index-all-pro li .content i{ width: 50px; height: 50px; line-height: 50px;}
}
@media screen and (max-width:991px){
    .index-all-pro li{ height: 450px;}
    .index-all-pro li .num{ display: none;}
    .index-all-pro li .content .nr{ display: none;}
    .index-all-pro li .content .tit h5{ font-size: 16px;}
    .index-all-pro li:hover .content{ padding-top: 50%;}
}
@media screen and (max-width:768px){
    .index-all-pro li{ width: 50%; height: 250px;}
    .index-all-pro .youshi_li{ width: 50%;}
    .index-all-pro .youshi_li_active{ width: 50%;}
    .index-all-pro li .content{ padding-top: 10%;}
    .index-all-pro li:hover .content{ padding-top: 18%;}
    .index-all-pro li .content .tit span{ font-size: 12px;}
    .index-all-pro li .content i{ width: 40px; height: 40px; line-height: 40px; font-size: 30px;}
}


#ysbj{ background: url("../images/ysbj.jpg") no-repeat right top; background-size: auto 100%;}
#ysbj .main{ padding: 5% 0;}
#ysbj ul{ margin-top: 5% !important;}
#ysbj ul li{ margin-bottom: 50px;}
#ysbj ul li svg{ width: 100px;}
#ysbj ul li svg path{ fill: #2c2c2c;}
#ysbj ul li .float-start{ padding-left: 20px;}
#ysbj ul li .float-start p{ color: var(--theme-bg); font-size: 20px; font-weight: bold;}
#ysbj ul li .float-start span{ padding-top: 5px; display: block; font-size: 16px; color: #7c7c7c;}
@media screen and (max-width:1600px){
}
@media screen and (max-width:1440px){
    #ysbj{ background-size: 120% 100%;}
}
@media screen and (max-width:1200px){
    #ysbj{ background: url("../images/ysbj.jpg") no-repeat 80% top; background-size: 140% 100%;}
}
@media screen and (max-width:991px){
    #ysbj{ background: none;}
    #ysbj ul li .float-start span{ font-size: 12px;}
    #ysbj ul li .float-start p{ font-size: 16px; padding: 0; line-height: 25px;}
}



#gsjj_bj{ background: url("../images/jjbj.jpg") no-repeat center top; color: #fff;}
#gsjj_bj .tit_in span,#gsjj_bj .tit_in p{ color: #fff;}
#gsjj_bj #gsjj{ width: 65%; padding: 5%;}
#gsjj_bj #gsjj .tit{ font-size: 30px;}
#gsjj_bj #gsjj .con{ font-size: 16px; margin: 5% 0; line-height: 35px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;}
#gsjj_bj #gsjj .more{ transition: 0.3s; color: #fff; height: 50px; line-height: 50px; border: 1px solid rgba(255,255,255,0.2); width: 30%; text-align: center;}
#gsjj_bj #gsjj .more:hover{ background: var(--theme-bg);}
#gsjj_bj ul{ height: 100%;}
#gsjj_bj ul li{ padding: 10% 0; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.2);}
#gsjj_bj ul li h2{ font-size: 60px; font-weight: bold !important;}
#gsjj_bj ul li h2 sub{ margin-left: 10px; font-size: 16px; font-weight: normal !important;}
#gsjj_bj ul li p{ font-size: 18px;}
#gsjj_bj .jjlb{ background: rgba(0,0,0,0.5); width: 102%;}
#gsjj_bj .jjlb .text-center{ padding: 30px 0 20px; border-right: 1px solid rgba(255,255,255,0.2); position: relative; overflow: hidden;}
#gsjj_bj .jjlb .text-center:before{ position: absolute; left: 0; top: 0; content: ''; width: 120%; height: 120%; background: url("../images/gsjj_hover.jpg") no-repeat center; background-size: 100% 100%; opacity: 0; transition: 0.3s;}
#gsjj_bj .jjlb .text-center:last-of-type{ border: none;}
#gsjj_bj .jjlb svg{ width: 50px; position: relative; z-index: 1;}
#gsjj_bj .jjlb svg path{ fill: #fff;}
#gsjj_bj .jjlb p{ color: #fff; font-size: 18px; padding-top: 10px; position: relative; z-index: 1;}
#gsjj_bj .jjlb .text-center:hover:before{ opacity: 1; left: -10%; top: -10%; }
@media screen and (max-width:1440px){
    #gsjj_bj ul li h2{ font-size: 44px;}
    #gsjj_bj ul li p{ font-size: 16px;}
    #gsjj_bj #gsjj{ width: 80%;}
    #gsjj_bj #gsjj .con{ font-size: 14px;}
}
@media screen and (max-width:1200px){
    #gsjj_bj ul li h2{ font-size: 36px;}
    #gsjj_bj ul li p{ font-size: 14px;}
    #gsjj_bj #gsjj .tit{ font-size: 26px;}
    #gsjj_bj .jjlb svg{ width: 32px;}
    #gsjj_bj .jjlb p{ font-size: 16px;}
}
@media screen and (max-width:991px){
    #gsjj_bj #gsjj{ width: 100%;}
    #gsjj_bj ul li{ float: left; width: 33%; padding: 2% 0;}
    #gsjj_bj .jjlb .text-center{ padding: 10px 0;}
}
@media screen and (max-width:768px){
    #gsjj_bj ul li h2{ font-size: 26px;}
    #gsjj_bj .jjlb p{ font-size: 12px;}
}


.xwzx{position: relative; margin-top: 3%;}
.xwzx .swiper-container {padding-bottom: 2%; overflow: hidden;}
.xwzx .swiper-slide { display: flex; flex-direction: column; position: relative;}
.xwzx .swiper-slide .pic{  width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden; transition: 0.3s;}
.xwzx .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition: 0.3s;}
.xwzx .swiper-slide .tit{ transition: 0.5s; text-align: left; width: 100%; height: auto; color: #333; padding: 5% 0 0;}
.xwzx .swiper-slide .tit h5{ font-size: 22px; white-space: nowrap; text-overflow:ellipsis; overflow: hidden;}
.xwzx .swiper-slide .tit p{ margin-top: 15px !important; color: #666666; font-size: 15px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}
.xwzx .swiper-slide .more{ color: #666666; font-size: 14px; width: 100%; text-align: left; margin-top: 5%;}
.xwzx .swiper-slide .more svg{ width: 30px; margin-left: 15px;}
.xwzx .swiper-slide .more svg path{ fill: #cccccc;}
.xwzx .swiper-slide:hover img{  transform: scale(1.1); }
@media screen and (max-width:991px){
    .xwzx .swiper-slide .tit h5{ font-size: 18px;}
}






/*公司简介*/
#jjzy_bj{ background: url("../images/jjzy_bj.jpg") no-repeat center bottom;}
#jjzy_bj .main{ padding-bottom: 5%;}
#jjzy_bj .tit{ margin-top: 2%;}
#jjzy_bj .tit p{ text-transform: uppercase; font-size: 60px; height: 60px; line-height: 60px; background-image: linear-gradient(to right, #1650b9, #45a7de); background-clip:text; -webkit-background-clip:text; color: transparent;}
#jjzy_bj .tit p span{ font-weight: bold;}
#jjzy_bj .tit h2{ color: #333333; padding-top: 10px; font-size: 40px; font-weight: bold !important;}
#jjzy_bj .con{ color: #666666; font-size: 16px; line-height: 35px; height: 320px; overflow-y: scroll;}
#jjzy_bj .con::-webkit-scrollbar{
    width:3px;
    height:6px;
}
#jjzy_bj .con::-webkit-scrollbar-track{
    box-shadow: inset 0 0 6px transparent;
    background: #e8e8e8;
}
#jjzy_bj .con::-webkit-scrollbar-thumb{
    background: #1752ba;
}
#jjzy_bj ul{ margin-top: 10% !important;}
#jjzy_bj ul li{ color: #666666; font-size: 18px;}
#jjzy_bj ul li span{ padding: 0 10px; color: #1752ba; font-weight: bold; font-size: 60px;}
@media screen and (max-width:1440px){
    #jjzy_bj .tit p{ font-size: 46px;}
    #jjzy_bj .tit h2{ font-size: 34px;}
    #jjzy_bj ul li span{ font-size: 46px;}
}
@media screen and (max-width:1200px){
    #jjzy_bj .tit p{ font-size: 40px;}
    #jjzy_bj .tit h2{ font-size: 30px;}
    #jjzy_bj ul li span{ font-size: 40px;}
    #jjzy_bj .con{ font-size: 14px;}
    #jjzy_bj ul li{ font-size: 16px;}
}
@media screen and (max-width:991px){
    #jjzy_bj .tit{ margin: 0 auto 3%;}
    #jjzy_bj ul li span{ font-size: 30px; padding: 0;}
    #jjzy_bj ul li{ font-size: 12px;}
}
@media screen and (max-width:768px){
    #jjzy_bj ul li span{ font-size: 20px;}
    #jjzy_bj .tit p{ font-size: 30px;}
    #jjzy_bj .tit h2{ font-size: 20px; padding: 0;}
}

#whbj{ background: url("../images/whbj.png") no-repeat center; border-radius: 65px; padding: 5%; overflow: hidden; margin: 0 auto 7%; background-size: 100% 100%;}
.tit_zy p{ text-transform: uppercase; font-size: 60px; height: 60px; line-height: 60px; background-image: linear-gradient(to right, #1650b9, #45a7de); background-clip:text; -webkit-background-clip:text; color: transparent;}
.tit_zy p span{ font-weight: bold;}
.tit_zy h2{ color: #333333; padding-top: 10px; font-size: 40px; font-weight: bold !important;}
.more_zy{ height: 50px; line-height: 50px; border-radius: 25px; color: #fff; padding: 0 40px; background-image: linear-gradient(to right, #1650b9, #45a7de); transition: 0.3s; border: 1px solid #45a7de;}
.more_zy a{ color:#fff;}
.more_zy:hover{ background: none; border: 1px solid #d3d9e4; color: #333;}
.more_zy:hover a{ color: #333;}
#whbj .tit_zy p{ color: #05c7ff;}
#whbj .tit_zy h2{ color: #fff;}


#qywh{ margin-top: 5%;}
#qywh .swiper-container {
    width: 100%;
    height: 100%;
    position: relative;
}
#qywh .swiper-slide {
    text-align: left;
    transition:0.3s;
    position: relative;
    color: #fff;

    /* Center slide text vertically */
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#qywh .swiper-slide p{ font-size: 30px; font-weight: bold;}
#qywh .swiper-slide span{ display: block; margin: 10px 10% 0; text-align: center; font-size: 16px;}
#qywh .swiper-slide i{ font-size: 100px; color: rgba(255,255,255,0.1); font-weight: bold; transition: 0.3s;}
#qywh .swiper-slide:hover i{ color: #fff; transform:translateY(-30px); font-size: 60px;}
#qywh .swiper-slide:hover{ transform:translateY(30px);}
@media screen and (max-width:1440px){
    .tit_zy h2{ font-size: 30px;}
    .tit_zy p{ font-size: 45px;}
    #qywh .swiper-slide p{ font-size: 24px;}
    #qywh .swiper-slide span{ font-size: 14px; margin: 10px 0 0;}
    #qywh .swiper-slide i{ font-size: 70px;}
}
@media screen and (max-width:768px){
    .tit_zy h2{ font-size: 20px; padding: 0;}
    .tit_zy p{ font-size: 24px;}
    .more_zy{ height: 40px; line-height: 40px; font-size: 12px; padding: 0 10px;}
}



#zzrybj{ background: url("../images/rybj.jpg") no-repeat center top;}
.zzry{position: relative; margin-top: 3%; padding: 0 5%;}
.zzry .swiper-container { overflow: hidden;}
.zzry .swiper-slide { display: flex; flex-direction: column; position: relative; background: #fff; padding: 20px 20px 0;}
.zzry .swiper-slide .inimg{ width: 100%; height: 0; padding-bottom: 140%; position: relative; overflow: hidden;}
.zzry .swiper-slide .inimg p{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;}
.zzry .swiper-slide .inimg p img{ max-width: 100%; height: 100%; transition: 0.5s;}
.zzry .swiper-slide p{ height: 70px; line-height: 70px; text-align: center; color: #626262; font-size: 16px; transition: 0.3s;}
.zzry .swiper-slide:hover .inimg img{transform: scale(1.1);}
.zzry .swiper-slide:hover{ background: var(--theme-bg);}
.zzry .swiper-slide:hover p{ color: #fff;}
.zzry .swiper-button-next,.zzry .swiper-button-prev{ width: 50px; height: 50px; border-radius: 100%; border: 1px solid var(--theme-bg); line-height: 50px; text-align: center; color: var(--theme-bg); opacity: 1 !important; transition: 0.3s; z-index: 2;}
.zzry .swiper-button-next{background: var(--theme-bg); color: #fff; right: 0; left: auto;}
.zzry .swiper-button-next:hover,.zzry .swiper-button-prev:hover{ background: var(--theme-bg); color: #fff;}
.zzry .swiper-button-next:after,.zzry .swiper-button-prev:after{ font-size: 20px;}
@media screen and (max-width:991px){
    .zzry .swiper-button-next,.zzry .swiper-button-prev{ width: 50px; height: 50px; line-height: 50px;}
    .zzry .swiper-button-next:after,.zzry .swiper-button-prev:after{ font-size: 20px;}
}
@media screen and (max-width:768px){
}


.cqhj{ margin-top: 1% !important;}
.cqhj li{ margin-top: 5%;}
.cqhj li .pic{ width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden; transition: 0.3s;}
.cqhj li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition: 0.3s;}




/*产品*/
.cpnr{ padding: 0 7% 0 2%;}
.cpnr .row{ margin: 0 !important; padding: 0 !important;}
.cptit{ color: #333333; font-size: 30px; font-weight: bold; padding-left: 10px; margin-bottom: 3% !important;}
.cplb{}
.cplb li{ border: 1px solid #e1e9f4; transition: 0.3s; position: relative; margin-bottom: 5%;}
.cplb li:before{ position: absolute; left: 50%; bottom: 0; width: 0; z-index: 1; height: 3px; content: ''; background-image: linear-gradient(to right, #05c7ff, #1752ba); transition: 0.3s;}
.cplb li .pic{width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden;}
.cplb li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s;}
.cplb li .title{ padding: 10% 5%; color: #2c2c2c; font-size: 16px; position: relative; overflow: hidden;}
.cplb li .title:before{ position: absolute; left: 0; top: 0; width: 100%; height: 120%; background: url("../images/cplb_hover.jpg") no-repeat center; content: ''; opacity: 0; transition: 0.3s;}
.cplb li .title p{ position: relative; z-index: 1;}
.cplb li .title h3{ font-size: 18px; position: relative; z-index: 1; font-weight: bold !important; margin: 5% 0 !important;}
.cplb li .title h3 svg{ width: 25px;}
.cplb li .title h3 svg path{ fill: #05c7ff; }
.cplb li .title h3 span{ display: block;text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.cplb li .title em{ position: relative; z-index: 1; color: #666666; font-size: 14px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}
.cplb li:hover .title:before{ opacity: 1; top: -10%;}
.cplb li:hover{ box-shadow: 0 0 20px rgba(0,0,0,0.2);}
.cplb li:hover:before{ width: 100%; left: 0;}


.pro-sider{ border: 1px solid #e1e9f4; background: #fff;}
.pro-sider .in-title{ background: url("../images/cpnav_bt.jpg") no-repeat center; background-size: 100%; color: #fff; text-align: center; padding: 20px 0;}
.pro-sider .in-title h3{ font-size: 36px; font-weight: bold !important;}
.pro-sider .in-title em{ font-size: 18px; text-transform: uppercase;}
.pro-sider .pro-sider-ul .ul-li{ border-bottom: 1px solid #e1e9f4; padding: 20px;}
.pro-sider .pro-sider-ul .ul-li img{ width: 25%; margin-right: 10px;}
.pro-sider .pro-sider-ul .ul-li svg{ width: 20px;}
.pro-sider .pro-sider-ul .ul-li svg path{ fill: #0f55d6;}
.pro-sider .pro-sider-ul .ul-li h2{ font-size: 16px;}
.pro-sider .pro-sider-ul #li-on{ background: #05c7ff;}
.pro-sider .pro-sider-ul #li-on svg path{ fill: #fff;}
.pro-sider .pro-sider-ul #li-on h2{ color: #fff;}
.pro-sider .pro-sider-ul #li-on img{ filter: grayscale(100%) brightness(100);}
@media screen and (max-width:1600px){
    .pro-sider .in-title h3{ font-size: 30px;}
    .cpnr{ padding: 0 2%;}
}
@media screen and (max-width:1440px){
    .pro-sider .in-title h3{ font-size: 20px;}
    .pro-sider .in-title em{ font-size: 14px;}
    .pro-sider .pro-sider-ul .ul-li h2{ font-size: 14px;}
    .pro-sider .pro-sider-ul .ul-li svg{ width: 12px;}
}
@media screen and (max-width:1200px){
    .pro-sider .pro-sider-ul .ul-li svg{ display: none;}
    .pro-sider .pro-sider-ul .ul-li{ padding: 7px;}
    .pro-sider .pro-sider-ul .ul-li h2{ font-size: 12px;}
    .pro-sider .in-title em{ font-size: 12px;}
    .cptit{ font-size: 20px;}
    .cplb li .title h3{ font-size: 16px;}
    .cplb li .title em{ font-size: 12px;}
}

.cp_left{ height: 0; padding-bottom: 35%; position: relative; overflow: hidden;}
.cp_left img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition:0.3s;}
.cp_right{ padding-left: 3%;}
.cp_right p{ font-size: 24px; color: #373737; margin-bottom: 10px !important;}
.cp_right .tit{ border-bottom: 1px solid #e1e9f4; padding-bottom: 30px; color: #2d2d2d; font-size: 36px; font-weight: bold; position: relative; height: 90px; line-height: 80px;}
.cp_right .tit span{ position: relative; z-index: 1;}
.cp_right .tit:before{ text-transform: uppercase; content: attr(data-title); position: absolute; left: 0; top: -10px; width: 100%; font-family: Arial; color: #e5e5e5 !important; font-size: 72px; text-shadow: 1px 1px #f0f0f0,-1px -1px #f0f0f0,1px -1px #f0f0f0,-1px 1px #f0f0f0; font-weight: bold;}
.cp_right .con{ padding: 7% 0;}
.cp_right .con span{ color: #303030; font-size: 16px; font-weight: bold;}
.cp_right .con p{ color: #808080; font-size: 16px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;}
.cp_right .cpxj{ background: #0b53c0; width: 30%; font-size: 16px; color: #fff; border-radius: 5px; height: 55px;}
.cp_right .cpxj svg{ width: 20px; margin-right: 10px;}
.cp_right .cpxj svg path{ fill: #fff;}
.cp_right #cptel{ color: #ee3b02; font-size: 30px; font-family: cursive; font-weight: bold; margin: 0 5% 0 3%;}
.cp_right #cptel svg{ width: 30px; margin-right: 10px;}
.cp_right #cptel svg path{ fill: #ee3b02;}
.cp_right .cpwx{ width: 53px; height: 53px; border: 1px solid #ccc; border-radius: 100%; position: relative;}
.cp_right .cpwx span{ display: block; position: relative; z-index: 2; width: 52px; height: 52px; text-align: center; line-height: 47px;}
.cp_right .cpwx svg{ width: 35px;}
.cp_right .cpwx svg path{ fill: #ee3b02;}
.cp_right .cpwx p{ position: absolute; z-index: 1; bottom: 30px; left: -50px; background: #fff; border-radius: 10px; width: 150px; height: 150px; padding: 10px; box-shadow: 0 0 15px rgba(0,0,0,0.2); transition: 0.3s; opacity: 0; }
.cp_right .cpwx p img{ width: 130px; height: 130px}
.cp_right .cpwx:hover p{ opacity: 1; bottom: 60px;}
@media screen and (max-width:1200px){
    .cp_right #cptel{ font-size: 24px;}
    .cp_right .cpxj{ height: 45px; font-size: 14px;}
}
@media screen and (max-width:991px){
    .cp_left{ padding-bottom: 75%; margin-bottom: 20px;}
}
@media screen and (max-width:768px){
    .cp_right .cpwx{ display: none;}
    .cp_right .tit{ font-size: 20px;}
}


#cpbtqh{ width: 100% !important; transition:0.3s; background: #fff; text-align: center; border-bottom: 1px solid #efefef; margin-top: 3%;}
.cpbt{ margin: 0 auto !important; height: 70px; line-height: 70px; width: 100%; transition:0.3s;}
.cpbt li{ float: left; color: #666666; font-size: 16px; width: 12%; text-align: center; position: relative; transition:0.3s;}
.cpbt li a{ color: #666666;}
.cpbt li:after{ position: absolute; left: 50%; bottom: 0; width: 0; height: 3px; content: ''; background: #fff; transition: 0.3s;}
.cpbt li:before{ position: absolute; right: 0; top: 30%; width: 1px; height: 40%; content: ''; background: #d5d5d5;}
.cpbt li:last-of-type:before{ display: none;}
.cpbt li:hover:after{ position: absolute; left: 25%; bottom: 0; width: 50%; height: 3px; content: ''; background: #0b53c0;}
.cpbt li.current:hover:after{ left: 25%; width: 50%; background: #0b53c0;}
.cpbt li.current:after{ left: 25%; width: 50%; background: #0b53c0;}


.pro_con{ font-size: 16px; color: #999; line-height: 35px; padding: 3% 15px;}
.pro_con img{ max-width: 100%;}

@media screen and (max-width:1600px){
    .cp_right .tit{ font-size: 30px;}
    .cp_right .tit:before{ font-size: 60px;}
    .cp_right p{ font-size: 20px;}
    .cp_right dl{ margin: 1% 0 !important;}
    .cp_right .con{ font-size: 14px;}
    .cp_right .row .cptel span{ font-size: 14px;}
    .cp_right .row .cptel p{ font-size: 22px;}
    .cp_right .row ul li{ height: 50px; line-height: 50px;}
}
@media screen and (max-width:1440px){
    .cp_right .row .cptel i{ margin-right: 10px;}
    .cp_right .row .cptel span{ display: none;}
    .cp_right .tit{ font-size: 24px;}
    .cp_right p{ font-size: 16px;}
    .cp_right .con p{ font-size: 14px;}
    .cp_right .con{ padding: 3% 0;}
}
@media screen and (max-width:1200px){
    .cp_right .row .cpwx p{ width: 100%; padding: 5px;}
    .cp_right .row .cpwx span{ display: none;}
    .cpbt li{ width: 15%;}
    .cp_right .tit{ height: 70px; padding: 0;}
    .cp_right .tit:before{ font-size: 50px;}
}
@media screen and (max-width:991px){
    .cp_right dl dd{ float: left; width: 50%;}
    .cp_right .tit{ font-size: 24px;}
    .cp_right .tit:before{ font-size: 50px;}
    .cp_right p{ font-size: 16px; margin-bottom: 0 !important;}
}
@media screen and (max-width:768px){
    .cpbt li{ width: 25%; font-size: 13px;}
}


#xgcp{ margin-top: 4%; overflow: hidden;}
#xgcp .swiper-container {
    width: 100%;
    height: 100%;
    padding: 10px;
}
#xgcp .swiper-slide {
    transition: 0.3s;
    overflow: hidden;
    position: relative;

    /* Center slide text vertically */
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#xgcp .swiper-slide .img{ overflow: hidden; width: 100%; height: 0; padding-bottom: 75%; position: relative;}
#xgcp .swiper-slide .img img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition: 0.3s;}
#xgcp .swiper-slide .title{ padding: 5%; width: 100%; border: 1px solid #e1e9f4;}
#xgcp .swiper-slide .title h3{ color: #2c2c2c; font-size: 18px; height: 45px; line-height: 45px; text-align: center; white-space: nowrap; text-overflow:ellipsis; overflow: hidden;}
#xgcp .swiper-slide .font{ position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; margin:auto; overflow: hidden; z-index: 1; background: rgba(0,80,170,0.8); text-align: center; color: #fff; padding-top: 35%;transform: scale(0); transition: all 0.5s; opacity: 0; }
#xgcp .swiper-slide .font h2{ font-size: 18px; padding-bottom: 10%;}
#xgcp .swiper-slide .font i{ margin: 0 auto; width: 40%; height: 45px; line-height: 45px; text-align: center; border-radius: 5px; border: 1px solid rgba(255,255,255,0.3); font-size: 16px; color: rgba(255,255,255,0.7); transition: 0.3s;}
#xgcp .swiper-slide:hover .img img{transform: scale(1.05);}
#xgcp .swiper-slide:hover{ box-shadow: 0 0 10px rgba(0,80,170,0.3);}
#xgcp .swiper-slide:hover .font{ transform: scale(1); opacity: 1;}
#xgcp .swiper-slide .font i:hover{ background: #fff; color: #0b53c0;}

@media screen and (max-width:1600px){
}
@media screen and (max-width:1440px){
    #xgcp .swiper-slide .title h3{ font-size: 20px;}
}
@media screen and (max-width:1200px){
}
@media screen and (max-width:991px){
    #xgcp .swiper-slide .title h3{ font-size: 18px; height: 35px;}
}
@media screen and (max-width:768px){
}


/*新闻*/
.sNews-list .scs img {
    -webkit-transition-duration: 330ms;
    transition-duration: 330ms;
}
.sNews-list .scst img {
    -webkit-transition-duration: 330ms;
    transition-duration: 330ms;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
}


.sNews-list .pic img
{
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
}
.sNews-list .pic img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    border-radius: inherit;
    width: 100% !important;
    height: 100% !important;
}

.sNews-list .item {
    overflow: hidden;
    padding: 1.5rem 0;
    border-bottom: #eeeeee dashed 1px;
    position: relative;
}
.sNews-list .item:after {
    content: " ";
    pointer-events: none;
    position: absolute;
    -webkit-transition: all 250ms ease-out 0s;
    transition: all 250ms ease-out 0s;
    background-color: #f5f6f8;
    left: 0;
    top: 100%;
    width: 100%;
    height: 0;
}
.sNews-list .item .contain {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    z-index: 1;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    align-content: center;
    min-height: 240px;
}
.sNews-list .item .contain:after {
    display: none;
}
.sNews-list .item .pic {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -120px;
    width: 400px;
    background-color: #eee;
    height: 0; padding-bottom: 15% !important; transition: 0.3s; overflow: hidden;
}
.sNews-list .item  .pic img{  width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition: 0.3s;}
.sNews-list .item .txt {
    position: relative;
    padding-left: 450px;
    padding-right: 2.4rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.sNews-list .item .txt .title {
    line-height: 1.5;
    height: 1.5em;
    font-size: 18px;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-transition: all 250ms ease-out 0s;
    transition: all 250ms ease-out 0s;
}
.sNews-list .item .txt .date {
    margin-top: 0.5rem;
    font-size: 14px;
    color: #999999;
}
.sNews-list .item .txt .date i{ float: left; margin-right: 10px;}
.sNews-list .item .txt .abstract {
    margin-top: 0.5rem;
    line-height: 1.75em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    max-height: 3.5em;
    height: 3.5em;
    width: 90%;
    color: #999;
}
.sNews-list .item .txt .more {
    position: absolute;
    right: 0;
    border-radius: 50%;
    top: 50%;
    width: 60px;
    height: 60px;
    margin-top: -1.04rem;
    -webkit-transition: all 250ms ease-out 0s;
    transition: all 250ms ease-out 0s;
    z-index: 2;
    border: #ee3b02 solid 1px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.sNews-list .item .txt .more:after {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    background-image: url(../images/arrow-news-item-more.png);
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    -webkit-transition: all 250ms ease-out 0s;
    transition: all 250ms ease-out 0s;
}
@media screen and (max-width: 1440px) {
    .sNews-list .item .pic{ padding-bottom: 21% !important;}
}
@media screen and (max-width: 1200px) {
    .sNews-list .item .pic{ padding-bottom: 25% !important;}
}
@media screen and (min-width: 1025px) {
    .sNews-list .item:hover:after {
        top: 0;
        height: 100%;
        -webkit-transition: top 0ms ease-out 0s, height 220ms ease-out 0s;
        transition: top 0ms ease-out 0s, height 220ms ease-out 0s;
    }
    .sNews-list .item:hover .txt .title {
        color: #ee3b02;
    }
    .sNews-list .item:hover .txt .more {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        background-color: #ee3b02;
    }
    .sNews-list .item:hover .txt .more:after {
        -webkit-filter: grayscale(100%) brightness(600%);
        filter: grayscale(100%) brightness(600%);
    }
}
@media screen and (max-width: 1024px) {
    .sNews-list .item {
        padding: 1rem 0;
    }
    .sNews-list .item .contain {
        min-height: 0;
    }
    .sNews-list .item .pic {
        position: relative;
        top: 0;
        margin-top: 0;
        width: 50%;
        height: 0 !important;
        padding-bottom: 30%;
    }
    .sNews-list .item .txt {
        padding-left: 0;
        padding-right: 0;
        width: 47.5%;
    }
    .sNews-list .item .txt .more {
        display: none;
    }
    .sNews-list .item .txt .title{ font-size: 16px;}
    .sNews-list .item:active:after {
        top: 0;
        height: 100%;
        -webkit-transition: 0ms;
        transition: 0ms;
    }
    .sNews-list .item:active .txt .title {
        color: #ee3b02;
        -webkit-transition: 0ms;
        transition: 0ms;
    }
    .sNews-list .item:active .txt .more {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        background-color: #ee3b02;
        -webkit-transition: 0ms;
        transition: 0ms;
    }
    .sNews-list .item:active .txt .more:after {
        -webkit-filter: grayscale(100%) brightness(500%);
        filter: grayscale(100%) brightness(500%);
    }
}

.xwinfo .bai .p5{ padding: 3%;}
.xwinfo .bai .news-detail-title{ border-bottom: 1px solid #e5e5e5; padding-bottom: 3%;}
.xwinfo .bai .news-detail-title .h3{ border-bottom: none !important; color: #333333; font-size: 30px; font-weight: bold !important; padding: 0;}
.xwinfo .bai .news-detail-title .b{ color: #999999; font-size: 16px; margin-top: 2%;}
.xwinfo .bai .more{ height: 60px; line-height: 60px; background: var(--theme-bg); text-align: center; width: 210px; border-radius: 30px;}
.xwinfo .bai .more p{ color: #fff; font-size: 18px;}
.xwinfo .bai .more svg{ width: 30px; margin-right: 10px;}
.xwinfo .bai .more svg path{ fill: #fff;}
.xwinfo .bai .news-detail{ color: #666666; font-size: 18px; line-height: 40px; padding: 2% 0 5%;}
.xwinfo .bai .news-detail img{ max-width: 100%; margin: 15px auto; display: block;}

.xwinfo .newsPage{ background: var(--theme-bg); height: 100px; line-height: 100px; padding: 0 3%;}
.xwinfo .newsPage .page-a{ color: rgba(255,255,255,0.5); font-size: 16px;}
.xwinfo .newsPage .page-a a{ color: rgba(255,255,255,0.5); text-decoration: underline !important;}
@media screen and (max-width:1440px){
    #xwclass li .news_title{ font-size: 16px;}
    .xwinfo .bai .news-detail-title .h3{ font-size: 24px;}
    .xwinfo .bai .news-detail-title .h3{ font-size: 22px;}
    .xwinfo .newsPage{ line-height: 40px; padding-top: 10px;}
}
@media screen and (max-width:1200px){
    .xwinfo{ padding-top: 9%;}
    .xwlb li{ height: 50px; line-height: 50px;}
}
@media screen and (max-width:991px){
    .xwinfo .newsPage .page-a{ font-size: 14px;}
    .xwinfo .newsPage{ line-height: 30px; padding: 10px; height: auto;}
    .xwinfo .bai .news-detail-title .h3{ font-size: 18px; line-height: 25px;}
    .xwinfo .bai .more{ height: 45px; line-height: 45px;}
    .xwinfo .bai .more p{ font-size: 14px;}
    .xwinfo .bai .news-detail-title .b{ font-size: 14px;}
    .xwinfo .bai .news-detail{ font-size: 14px;}
}
@media screen and (max-width:768px){
    .xwinfo .bai .more{ float: right; margin-top: 3%;}
}
@media screen and (max-width:500px){
}



.khal li{ margin-bottom: 5%; border: 1px solid #ededed;}
.khal li .img{ width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden;}
.khal li .img img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;}
.khal li .img1{ width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden;}
.khal li .img1 p{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;}
.khal li .img1 p img{ max-width: 100%; height: 100%;}

.khal li .img .content,.khal li .img1 .content{ position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; background: rgba(7,53,127,0.8); text-align: center; color: #fff; opacity: 0; transition: 0.3s;}
.khal li .img .content p,.khal li .img1 .content p{ font-size: 15px; transition: 0.4s; padding: 0 10%;}
.khal li .img .content svg,.khal li .img1 .content svg{ width: 50px; padding: 30% 0 6%; transition: 0.4s;}
.khal li .img .content svg path,.khal li .img1 .content svg path{ fill: #fff;}

.khal li .box{ padding: 3%; color: #333333; font-size: 16px; text-align: center; white-space: nowrap; text-overflow:ellipsis; overflow: hidden;}

.khal li:hover .img .content,.khal li:hover .img1 .content{ opacity: 1;}
.khal li:hover .img .content svg,.khal li:hover .img1 .content svg{ padding-top: 23%;}



.ly_content{ color: #999999; margin-bottom: 2%; font-size: 16px;}
.con_lx{ padding: 15% 10% 0; color: #fff; position: relative;}
.con_lx .tit{ font-size: 30px; font-weight: bold;}
.con_lx ul{ padding-top: 8% !important;}
.con_lx ul li{ height: 40px; line-height: 40px; font-size: 16px;}
.con_lx ul li i{ display: inline-block; margin-right: 10px; font-size: 20px;}
@media screen and (max-width:1700px){
    .con_lx .tit{ font-size: 30px;}
}
@media screen and (max-width:1500px){
    .con_lx .tit{ font-size: 26px;}
}
@media screen and (max-width:1400px){
    .con_lx .tit{ font-size: 22px;}
}
@media screen and (max-width:1200px){
    .con_lx .tit{ font-size: 20px;}
    .con_lx ul li{ height: auto; font-size: 14px;}
}
@media screen and (max-width:991px){
    .con_lx{ padding: 5%;}
    .con_lx ul{ padding-top: 5% !important;}

}








/*公共*/
#zi_banner{ width: 100%; height: auto; position: relative;}
#zi_banner .pic{ text-align: center; overflow: hidden;}
#zi_banner .pic img{ width: 100%;}
#zi_banner .main{ position: absolute; left: 0; top: 0; width: 100%; z-index: 1; color: #fff; padding-top: 12%; line-height: 50px; text-align: left;}
#zi_banner .main h2{ font-size: 40px; font-weight: bold !important; position: relative; height: 70px;}
#zi_banner .main h2:before{ position: absolute; left: 0; bottom: 0; content: ''; width: 50px; height: 2px; background: #fff;}
@media screen and (max-width:1440px){
    #zi_banner .main h2{ font-size: 30px;}
    #zi_banner .main p{ font-size: 16px; height: 40px; line-height: 40px;}
}
@media screen and (max-width:1200px){
    #zi_banner .pic img{ width: 130%; margin-left: -15%;}
}
@media screen and (max-width:991px){
    #zi_banner .pic img{ width: 150%; margin-left: -15%;}
    #zi_banner .main{ padding-top: 20%;}
    #zi_banner .main h2{ font-size: 28px;}
    #zi_banner .main p{ font-size: 16px;}
}
@media screen and (max-width:768px) {
    #zi_banner .pic img { width: 195%; margin-left: -25%;}
    #zi_banner .main{ padding-top: 25%;}
    #zi_banner .main h2{ font-size: 24px;}
    #zi_banner .main p{ font-size: 14px;}
}
@media screen and (max-width:560px) {
    #zi_banner .main{ padding-top: 23%;}
    #zi_banner .main h2{ font-size: 20px;}
    #zi_banner .main p{ display: none;}
}



#cpdaohang{ width: 100%; height: auto; position: relative;}
#homebj{ width: 100%; height: 70px; line-height: 70px; color: #fff; border-bottom: 1px solid #ececec; background: #fafafa;}
#homebj ul{ width: 70%;}
#homebj ul li{ margin-right: 8%; position: relative; font-size: 16px; text-align: center;}
#homebj ul li:before{ position: absolute; left: 50%; bottom: 0; content: ''; height: 3px; background: #0056a3; width: 0; transition: all 0.3s; }
#homebj ul li a{ color: #666666;}
#homebj ul li:hover a{ color: #0056a3;}
#homebj ul li:hover:before{ left: 0; width: 100%;}
.home{ text-align: right; color: #999999;}
.home i{ display: inline-block; margin-right: 10px; font-size: 18px;}
.home a{ padding: 0 8px; color: #999999;}
.home a:last-of-type{ color: var(--theme-bg);}

@media screen and (max-width:1500px) {
}
@media screen and (max-width:1440px) {
    .home{ font-size: 12px;}
    .home i{ display: none;}
}
@media screen and (max-width:991px) {
    .home{ display: none !important;}
    #homebj ul{ width: 100%;}
    #homebj ul li{ float: left; width: 25%; text-align: center; margin: 0 !important; font-size: 14px;}
    #homebj{ padding: 10px 0; height: auto !important; line-height: 30px;}
}
@media screen and (max-width:768px) {
    #homebj ul li{ width: 25%;}

}


#cpnav{ padding: 0; overflow: hidden; width: 70%;}
#cpnav .swiper-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#cpnav .swiper-slide {
    text-align: center;
    transition: 0.3s;
    position: relative;
    font-size: 16px;
    /* Center slide text vertically */
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#cpnav .swiper-slide:before{ position: absolute; content: ''; left: 50%; bottom: 0; width: 0; height: 3px; background: #07357f; transition: 0.3s;}
#cpnav .swiper-slide:hover:before{ left: 25%; width: 50%;}
#cpnav .swiper-slide:hover a{ color: #07357f;}
@media screen and (max-width:991px){
    #cpnav{ width: 100%;}
}
@media screen and (max-width:765px){
}



#cpnav_lb{ padding: 0; overflow: hidden; width: 100%; margin: -70px auto 0;}
#cpnav_lb .swiper-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#cpnav_lb .swiper-slide {
    text-align: center;
    position: relative;
    font-size: 16px;
    background: #f6f8fb;
    padding: 30px 0;
    border-right: 1px solid #e9e9e9;
    /* Center slide text vertically */
    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
#cpnav_lb .swiper-slide i{ font-size: 50px; height: 55px; line-height: 55px;}
#cpnav_lb .swiper-slide:hover{ color: #fff; background: var(--theme-bg);}
#cpnav_lb .swiper-slide:hover a,#cpnav_lb .swiper-slide:hover i{ color: #fff;}
#cpnav_lb .swiper-slide:last-of-type{ border: none;}

#cpnav_lb .swiper-slide#li-on{ color: #fff; background: var(--theme-bg);}
#cpnav_lb .swiper-slide#li-on a,#cpnav_lb .swiper-slide#li-on i{ color: #fff;}
@media screen and (max-width:1200px){
    #cpnav_lb .swiper-slide i{ font-size: 40px; height: 45px; line-height: 45px;}
    #cpnav_lb .swiper-slide{ font-size: 14px;}
}
@media screen and (max-width:991px){
}
@media screen and (max-width:765px){
}



.hui{ background: #f9f9f9;}
.bai{ background: #fff !important;}







/*翻页*/
.page {
 font-size: 0;
 text-align: center;
}
.page .center {
 display: inline-block;
 overflow: hidden;
}
.page .center .page-span {
 float: left;
 font-size: 14px;
 color: #c3c3c3;
 line-height: 32px;
 margin-right: 30px;
}
.page .center .page-list {
 float: left;
 overflow: hidden;
}
.page .center .page-list ul li {
 float: left;
 width: auto;
 min-width: 30px;
 height: 32px;
 text-align: center;
 line-height: 30px;
 font-size: 14px;
 margin: 0 4px;
 padding: 0;
 border: none;
 background: transparent;
}
.page .center .page-list ul li a {
 min-width: 20px;
 padding: 0 5px;
 border: 1px solid #eee;
 display: block;
 color: #333;
 border-radius: 4px;
 -webkit-border-radius: 4px;
 overflow: hidden;
 background: #fff;
}
.page .center .page-list ul li:hover a {
 color: #f3c04b;
}
.page .center .page-list ul li.active a {
 background: #f3c04b;
 color: #fff;
}