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

@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: relative; border-bottom: 1px solid rgba(255,255,255,0.2);}
#logo{ text-align: center; transition: 0.3s; padding: 15px;}
#logo a{ display: block;}
#logo a img{ max-width: 100%; transition:0.5s;}
.top_tel{ color: #333333; overflow: hidden;}
.top_tel i{ font-size: 24px; margin-right: 10px; color: var(--theme-bg); }
.top_tel p{ font-size: 22px; color: #333333;}
.top_tel p span{ font-size: 18px;}
@media screen and (max-width:1730px){
    .top_tel p{ font-size: 20px;}
    .top_tel p span{ font-size: 16px;}
}
@media screen and (max-width:1600px){
    .top_tel i{ font-size: 22px;}
    .top_tel p span{ font-size: 14px;}
}
@media screen and (max-width:1520px){
    .top_tel p span{ display: none;}
}
@media screen and (max-width:1440px){
    #logo a img{ max-width: 100%;}
}
@media screen and (max-width:1200px){
}
@media screen and (max-width: 991px){
}
@media screen and (max-width: 798px){
}



#nav{ height: auto; transition:0.3s; text-align: center;}
#nav li{ display: inline-block; font-size: 16px; text-align: center; transition:0.5s; padding: 4% 0;}
#nav li .big{ display: block; position: relative; z-index: 1; line-height: 22px; color: #333333;}

#nav li .navson{display: none; position: absolute; left: 0; overflow: hidden; border-top: 1px solid #ededed; background: url("../images/rybj.jpg") no-repeat right bottom #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: 20px 0 0 !important;}
#nav li .navson .nav_font dl dd{ float: left; width: 12%; height: 50px; line-height: 50px; text-align: left; transition: 0.3s;}
#nav li .navson .nav_font dl dd i{ display: inline-block; font-size: 12px; 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;}

@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){
}
@media screen and (max-width:1350px){
}
@media screen and (max-width:1300px){
}
@media screen and (max-width:1200px){
    #nav li{ font-size: 14px;}
    #nav li .navson .nav_font dl dd{ width: 15%;}
    #nav li .navson .nav_font dl dd a{ font-size: 14px;}
    #nav li .navson .nav_font .font{ width: 100%;}
}
@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%;}
}


#banner,#mobile_banner{ position: relative;}
#banner img{ width: 100%;}
#banner .swiper-pagination{ bottom: 3%;}
#banner .swiper-pagination-bullet{ width: 20px; height: 5px; border-radius: 1px; transition:0.3s; opacity: 0.7; background: #fff;}
#banner .swiper-pagination-bullet-active{ width: 60px; background: #be0505; opacity: 1;}
#banner .swiper-button-next:after,#banner .swiper-button-prev:after{ display: none;}
#banner .swiper-button-next i,#banner .swiper-button-prev i{ color: #fff; font-size: 40px;}
#banner .swiper-button-next,#banner .swiper-button-prev{ background: rgba(0,0,0,0.2); width: 50px; height: 80px; line-height: 80px;}
#banner .swiper-button-next{ right: 5%;}
#banner .swiper-button-prev{ left:5%; }

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

.banner-swiper .swiper-button-white:after,.banner-swiper .swiper-button-white:after{ color: #fff;}

@media screen and (max-width:1440px){
}
@media screen and (max-width:1200px){
    #banner .gallery-thumbs .swiper-slide span{ font-size: 12px;}
}



/*底部*/
#end_bj{ background: url("../images/end_bj.jpg") no-repeat center; width: 100%; text-align: left; position: relative; color: #fff;}
#end_bj a{ color: #fff; transition: 0.3s; position: relative;}
#end_bj a:hover{ color: #cc0707;}
#end_logo{ border-bottom: 1px solid rgba(255,255,255,0.1); padding: 2% 0;}
#end_logo .font{ line-height: 40px;}
#end_logo .font p{ color: #fff; font-size: 26px;}
#end_logo .font span{ color: #999999; font-size: 16px;}

#end_bj .main{ padding: 4% 0;}

.end_nav ul .big{ font-size: 18px; color: #fff; margin-bottom: 10px;}
.end_nav ul li{ height: 35px; line-height: 35px; font-size: 16px;}
.end_nav ul li a{ color: rgba(255,255,255,0.3) !important;}
.ewm{ margin: 0 auto; width: 50%;}
.ewm p{ border: 1px dashed #999999; padding: 10px;}
.ewm span{ display: block; height: 50px; line-height: 50px; color: #999999; font-size: 16px;}
.ewm img{ width: 100%;}
#end_bj .main dl{ margin: 3% 0 0 !important;}
#end_bj .main dl dd{ width: 30%; border: 1px solid rgba(255,255,255,0.3); border-radius: 10px; padding: 1.5% 0;}
#end_bj .main dl dd i{ width: 45px; height: 45px; border: 3px solid var(--theme-bg); border-radius: 100%; text-align: center; line-height: 39px; color: var(--theme-bg); font-size: 22px; margin-right: 20px;}
#end_bj .main dl dd p{ color: #999999; font-size: 16px;}
#end_bj .main dl dd span{ color: #fff; font-size: 26px;}

#end_line{ height: auto; padding: 10px 0; line-height: 30px; color: rgba(255,255,255,0.4); border-top: 1px solid rgba(255,255,255,0.1); }
#end_line a{ color: rgba(255,255,255,0.4);}
#end_line a:hover{ color: #fff;}

@media screen and (max-width:1500px){
    #end_bj .main dl dd span{ font-size: 20px;}
}
@media screen and (max-width:1440px){
    #end_logo .font p{ font-size: 22px;}
    .end_nav ul .big{ font-size: 16px;}
    .end_nav ul li{ font-size: 14px;}
    #end_bj .main dl dd p{ font-size: 14px;}
    #end_bj .main dl dd span{ font-size: 16px;}
}
@media screen and (max-width:1200px){
    #end_bj .main dl dd span{ font-size: 14px;}
}
@media screen and (max-width:991px){
    .ewm{ width: 60%;}
    #end_bj .main dl dd i{ display: none;}
}
@media screen and (max-width:768px){
    .ewm{ width: 50%;}
    #end_bj{ padding: 0 15px;}
    #end_bj .main dl dd{ width: 100%;}
    #end_bj .main dl dd .float-start{ width: 80%;}
}



.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 i{ font-size: 28px; padding: 2% 0 1%; font-weight: normal;}
.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 h2{ color: #333333; font-size: 46px; background: url("../images/tit_bj.png") no-repeat left top; padding: 20px 0 0 25px;}
.tit_in:before{ color: rgba(51,51,51,0.03); font-size: 96px; text-transform: uppercase; font-weight: bold; content: attr(data-title); position: absolute; left: 0; margin: auto; top: 0; display: block; width: 100%; height: 100%; text-align: left;}
@media screen and (max-width:1440px){
    .tit_in h2{ font-size: 32px;}
    .tit_in:before{ font-size: 70px;}
    .tit_in h2{ background-size: auto 100%;}
}
@media screen and (max-width:1200px){
    .tit_in:before{ font-size: 60px;}
}
@media screen and (max-width:991px){
    .tit_in h2{ font-size: 26px;}
    .tit_in:before{ font-size: 50px;}
}
@media screen and (max-width:768px){
    .tit_in h2{ font-size: 22px;}
    .tit_in:before{ font-size: 40px;}
}


.cpzx{ margin-top: 3%;}
.cpzx .swiper-slide { background-position: center; position: relative; overflow: hidden;}
.cpzx .gallery-top { overflow: hidden; height: auto; position: relative; padding: 0 !important;}
.cpzx .gallery-top .swiper-slide .big_cp li{ background: #fff; overflow: hidden; transition: 0.3s; padding: 0;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit{ padding: 3%;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit h2{ position: relative; color: #333333; font-size: 22px; height: 40px; line-height: 40px; transition: 0.5s; overflow: hidden; text-overflow: ellipsis; white-space: pre;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit h2 p{ position: relative; z-index: 1; padding-left: 10px; transition: 0.5s;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit h2:before{ position: absolute; left: 7px; bottom: 0; content: ''; width: 15px; height: 40px; border-radius: 3px; background: var(--theme-bg); transition: all linear 0.3s; transform: skewX(-20deg);}
.cpzx .gallery-top .swiper-slide .big_cp li .tit dl{ margin: 8% 0 12% !important;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit dl dd{ float: left; width: 48%; height: 30px; line-height: 30px; border: 1px solid #dedede; text-align: center; margin: 5px 0; transition: 0.5s; cursor: default;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit dl dd:nth-of-type(2n){ float: right;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit dl dd:hover{ background: var(--theme-bg); color: #fff; border: 1px solid var(--theme-bg);}
.cpzx .gallery-top .swiper-slide .big_cp li .tit span{ font-size: 16px; color: #999999; transition: 0.3s;}
.cpzx .gallery-top .swiper-slide .big_cp li .tit span i{ margin-left: 10px; transition: 0.3s;}
.cpzx .gallery-top .swiper-slide .big_cp li:hover .tit span{ color: var(--theme-bg);}
.cpzx .gallery-top .swiper-slide .big_cp li:hover .tit span i{ margin-left: 20px;}
.cpzx .gallery-top .swiper-slide .big_cp li:hover .tit h2 p{ color: #fff;}
.cpzx .gallery-top .swiper-slide .big_cp li:hover .tit h2:before{ width: 100%; transform: skewX(0); left: 0;}
.cpzx .gallery-top .swiper-slide .big_cp li .pic{ width: 60%; display: block; height: 0; padding-bottom: 45%; position: relative;}
.cpzx .gallery-top .swiper-slide .big_cp li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;transition: 0.5s;}

.cpzx .gallery-top .swiper-slide .small_cp li{ background: #fff; margin-top: 20px; text-align: center;}
.cpzx .gallery-top .swiper-slide .small_cp li .pic{ width: 100%; display: block; height: 0; padding-bottom: 75%; position: relative;}
.cpzx .gallery-top .swiper-slide .small_cp li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;transition: 0.5s;}
.cpzx .gallery-top .swiper-slide .small_cp li .tit{ padding: 10% 0;}
.cpzx .gallery-top .swiper-slide .small_cp li .tit h2{ color: #333333; font-size: 18px; transition: 0.5s;}
.cpzx .gallery-top .swiper-slide .small_cp li .tit span{ display: block; height: 35px; line-height: 35px; background: #eeeeee; color: #333333; width: 50%; margin: 5% auto 0; transition: 0.5s;}
.cpzx .gallery-top .swiper-slide .small_cp li:hover .tit h2{ color: var(--theme-bg);}
.cpzx .gallery-top .swiper-slide .small_cp li:hover .tit span{ background: var(--theme-bg); color: #fff;}

.cpzx .gallery-thumbs { height: auto; text-align: left; overflow: hidden;}
.cpzx .gallery-thumbs .swiper-wrapper{ width: auto;}
.cpzx .gallery-thumbs .swiper-slide { cursor: pointer; height: auto; transition: 0.3s;}
.cpzx .gallery-thumbs .swiper-slide p{ transition: 0.3s; color: #333333; font-size: 16px; width: 90%; overflow: hidden; text-overflow: ellipsis; white-space: pre;}
.cpzx .gallery-thumbs .swiper-slide i{ font-size: 12px; color: #e9e9e9; transition: 0.3s;}
.cpzx .gallery-thumbs .swiper-slide-thumb-active p,.cpzx .gallery-thumbs .swiper-slide-thumb-active i{ color: var(--theme-bg);}
@media screen and (max-width:1440px){
    .cpzx .gallery-top .swiper-slide .big_cp li .tit h2{ font-size: 20px;}
    .cpzx .gallery-top .swiper-slide .big_cp li .tit span{ font-size: 14px;}
    .cpzx .gallery-top .swiper-slide .small_cp li .tit h2{ font-size: 16px;}
}
@media screen and (max-width:1200px){
    .cpzx .gallery-top .swiper-slide .big_cp li .tit h2{ font-size: 16px; height: 30px; line-height: 30px;}
    .cpzx .gallery-top .swiper-slide .big_cp li .tit span{ font-size: 14px;}
    .cpzx .gallery-top .swiper-slide .big_cp li .tit dl{ margin: 3% 0 5% !important;}
    .cpzx .gallery-top .swiper-slide .big_cp li .tit dl dd{ height: 25px; line-height: 25px; font-size: 12px;}
    .cpzx .gallery-top .swiper-slide .small_cp li .tit h2{ font-size: 14px;}
    .cpzx .gallery-top .swiper-slide .small_cp li .tit span{ height: 30px; line-height: 30px; font-size: 13px;}
    .cpzx .gallery-thumbs .swiper-slide p{ font-size: 14px;}
}
@media screen and (max-width:991px){
    .cpzx .gallery-top{ margin-top: 3% !important;}
}
@media screen and (max-width:768px){
    .cpzx .gallery-top .swiper-slide .big_cp li{ margin-bottom: 30px;}
    .cpzx .gallery-top .swiper-slide .big_cp .col-12:nth-of-type(2) li{ margin-bottom: 0;}
}


#cpys{ position: relative;}
#cpys .main{ position: absolute !important; left: 0; top: 15%; z-index: 4; width: 100%; padding: 0;}
#cpys .tit_in h2{ color: #fff;}
#cpys .tit_in:before{ color: rgba(255,255,255,0.07);}

#cpys .swiper { width: 100%; height: auto; margin-left: auto; margin-right: auto;}
#cpys .mySwiper2 { height: auto; width: 100%;}
#cpys .mySwiper2 .swiper-slide{ position: relative;}
#cpys .mySwiper2 .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 43%; position: relative; overflow: hidden;}
#cpys .mySwiper2 .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;}
#cpys .mySwiper2 .swiper-slide .font{ position: absolute; left: 0; top: 0; color: #fff; z-index: 1; width: 100%;}
#cpys .mySwiper2 .swiper-slide .font .container{ padding-top: 15%;}
#cpys .mySwiper2 .swiper-slide .font .container .tit{ font-size: 40px; color: var(--theme-bg); font-weight: bold;}
#cpys .mySwiper2 .swiper-slide .font .container dl{ margin: 0 auto; border-bottom: 1px dashed rgba(255,255,255,0.2); padding: 5% 0 2%;}
#cpys .mySwiper2 .swiper-slide .font .container dl dd{ font-size: 22px; width: 20%; position: relative;}
#cpys .mySwiper2 .swiper-slide .font .container dl dd:before{ position: absolute; right: 20%; top: 15%; content: ''; width: 1px; height: 70%; background: rgba(255,255,255,0.5);}
#cpys .mySwiper2 .swiper-slide .font .container dl dd:last-of-type:before{ display: none;}
#cpys .mySwiper2 .swiper-slide .font .container ul{ padding-top: 6% !important; width: 100%;}
#cpys .mySwiper2 .swiper-slide .font .container ul li{ font-size: 16px; line-height: 40px; margin-bottom: 10px;}
#cpys .mySwiper2 .swiper-slide .font .container ul li i{ color: var(--theme-bg); font-weight: bold; font-size: 20px; margin-right: 10px;}
#cpys .mySwiper2 .swiper-pagination{ width: auto; left: 8.5%; bottom: 20%;}
#cpys .mySwiper2 .swiper-pagination-bullet{ font-size: 32px; margin: 0 10px; color: rgba(255,255,255,0.3); width: auto; height: 35px; line-height: 35px; background: none !important; opacity: 1; text-decoration: underline; border-radius: 0 !important; font-family: auto; font-weight: lighter;}
#cpys .mySwiper2 .swiper-pagination-bullet-active{ color: var(--theme-bg);}

#cpys .cpys_hover{ position: absolute; right: 0; bottom: 45%; z-index: 1; width: 30%;}
#cpys .mySwiper { box-sizing: border-box; overflow: inherit; }
#cpys .mySwiper .swiper-slide { position: relative; cursor: pointer;}
#cpys .mySwiper .swiper-slide .font{ color: #fff; background: rgba(0,0,0,0.3); border-radius: 100%; width: 210px; height: 210px; text-align: center; transition: 0.5s; position: relative;}
#cpys .mySwiper .swiper-slide .font:before{ position: absolute; left: 0; top: 0; content: ''; background: url("../images/yuan_line.png") no-repeat left top; background-size: auto 100%; width: 100%; height: 100%; transition: 0.5s;}
#cpys .mySwiper .swiper-slide .font p{ font-size: 16px; position: relative; z-index: 1;}
#cpys .mySwiper .swiper-slide .font i{ font-size: 50px; height: 60px; position: relative; z-index: 1; }
#cpys .mySwiper .swiper-slide:nth-of-type(1) .font{ position: absolute; left: 0; top: -250px;}
#cpys .mySwiper .swiper-slide:nth-of-type(1) .font:before{transform: rotate(90deg); left: 0; top: 0;}
#cpys .mySwiper .swiper-slide:nth-of-type(2) .font{ position: absolute; left: -350px; top: 0;}
#cpys .mySwiper .swiper-slide:nth-of-type(3) .font{ position: absolute; right: 190px; top: 0;}
#cpys .mySwiper .swiper-slide:nth-of-type(3) .font:before{ transform: rotate(180deg); left: auto; top: 0; right: 0;}
#cpys .mySwiper .swiper-slide:hover .font:before{ transform: rotate(50deg);}
#cpys .mySwiper .swiper-slide:nth-of-type(1):hover .font:before{transform: rotate(140deg);}
#cpys .mySwiper .swiper-slide:nth-of-type(3):hover .font:before{transform: rotate(230deg);}
#cpys .mySwiper .swiper-slide-thumb-active .font{ background: rgba(196,0,0,0.3);}

@media screen and (max-width:1700px){
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 50%;}
    #cpys .main{ top: 10%;}
    #cpys .mySwiper .swiper-slide:nth-of-type(3) .font{ right: 130px;}
}
@media screen and (max-width:1600px){
    #cpys .mySwiper .swiper-slide:nth-of-type(2) .font{ left: -320px;}
    #cpys .mySwiper .swiper-slide:nth-of-type(3) .font{ right: 100px;}
}
@media screen and (max-width:1500px){
    #cpys .mySwiper2 .swiper-pagination{ bottom: 10%;}
    #cpys .mySwiper .swiper-slide:nth-of-type(2) .font{ left: -300px;}
    #cpys .mySwiper .swiper-slide:nth-of-type(3) .font{ right: 50px;}
}
@media screen and (max-width:1440px){
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 55%;}
    #cpys .mySwiper2 .swiper-slide .font .container .tit{ font-size: 30px;}
    #cpys .mySwiper2 .swiper-slide .font .container dl dd{ font-size: 16px;}
    #cpys .mySwiper2 .swiper-slide .font .container ul li{ font-size: 14px;}
    #cpys .mySwiper .swiper-slide .font{ width: 180px; height: 180px;}
}
@media screen and (max-width:1200px){
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 65%;}
    #cpys .mySwiper .swiper-slide:nth-of-type(1) .font{ left: -35px; top: -200px;}
}
@media screen and (max-width:991px){
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 75%;}
    #cpys .mySwiper2 .swiper-pagination{ display: none;}
    #cpys .mySwiper2 .swiper-slide .font .container{ padding-top: 20%;}
    #cpys .cpys_hover{ bottom: 10px; width: 100%;}
    #cpys .mySwiper .swiper-slide .font{ position: relative !important; left: 0 !important; top: 0 !important; width: 100% !important; height: 100% !important; border-radius: 0 !important; padding: 20px 0 !important;}
    #cpys .mySwiper .swiper-slide .font:before{ display: none !important;}
    #cpys .mySwiper .swiper-slide .font i{ font-size: 40px; height: 40px; line-height: 40px;}
    #cpys .mySwiper2 .swiper-slide .font .container .tit{ font-size: 22px;}
    #cpys .mySwiper2 .swiper-slide .font .container dl{ padding: 2% 0;}
    #cpys .mySwiper2 .swiper-slide .font .container dl dd{ font-size: 14px;}
}
@media screen and (max-width:768px){
    #cpys .mySwiper2 .swiper-slide .font .container{ padding-top: 20%;}
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 90%;}
    #cpys .mySwiper2 .swiper-slide .font .container dl dd{ width: 25%;}
    #cpys .mySwiper2 .swiper-slide .font .container ul li{ line-height: 35px;}
    #cpys .main{ top: 5%;}
    #cpys .cpys_hover{ bottom: 0;}
    #cpys .mySwiper .swiper-slide .font{ padding: 10px 0 !important;}
    #cpys .mySwiper .swiper-slide .font i{ font-size: 30px; height: 40px; line-height: 40px;}
    #cpys .mySwiper .swiper-slide .font p{ font-size: 14px;}
}
@media screen and (max-width:650px){
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 110%;}
}
@media screen and (max-width:550px){
    #cpys .mySwiper2 .swiper-slide .pic{ padding-bottom: 120%;}
}
@media screen and (max-width:450px){
}


#yingyong{ margin-top: 4%; overflow: hidden;}
#yingyong .swiper-container {
    width: 100%;
    height: 100%;
    position: relative;
}
#yingyong .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;
}
#yingyong .swiper-slide .pic{ width: 100%; height: 0; padding-bottom: 130%; position: relative; overflow: hidden;}
#yingyong .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition: 0.5s;}
#yingyong .swiper-slide .font{ position: absolute; left: 0; bottom: 0; width: 100%; z-index: 2; font-size: 18px; height: auto; color: #fff; padding: 10%;}
#yingyong .swiper-slide .newsTitBg{position: absolute; bottom: 0; left: 0; width: 100%; height: 60%; text-align: center; z-index: 1; content: ''; transition:.4s; background: linear-gradient(bottom,rgba(0,0,0,.7),rgba(0,0,0 ,0) 100%);background: -o-linear-gradient(bottom,rgba(0,0,0,.7),rgba(0,0 0,0) 100%);background: -ms-linear-gradient(bottom,rgba(0,0,0,.7),rgba(0,0,0,0) 100%);background: -moz-linear-gradient(bottom,rgba(0,0,0,.7),rgba(0,0,0,0) 100%);background: -webkit-linear-gradient(bottom,rgba(0,0,0,.7),rgba(0,0,0,0) 100%);}
#yingyong .swiper-slide .font i{ font-size: 40px; height: 50px; margin-bottom: 3%; transition:0.5s;}
#yingyong .swiper-slide .font h2{ font-size: 22px;}
#yingyong .swiper-slide .font p{ font-size: 14px; color: rgba(255,255,255,0.4); text-transform: uppercase;}
#yingyong .swiper-slide:hover .pic img{transform: scale(1.1);}
#yingyong .swiper-slide:hover .font i{ color: var(--theme-bg);}



#ggbj{ background: url("../images/ggbj.jpg") repeat-y center fixed; color: #fff; text-align: center; padding: 3% 0; line-height: 80px;}
#ggbj h2{ font-size: 42px;}
#ggbj h2 span{ color: var(--theme-bg); font-weight: bold !important;}
#ggbj p{ font-size: 16px;}
#ggbj i{ display: block; height: 45px; line-height: 45px; border: 1px solid #fff; color: #fff; border-radius: 25px; width: 150px; margin: 0 auto; transition: 0.3s;}
#ggbj:hover i{ background: var(--theme-bg); border: 1px solid var(--theme-bg); color: #fff;}
@media screen and (max-width:1440px){
    #ggbj{ line-height: 60px;}
    #ggbj h2{ font-size: 32px;}
    #ggbj p{ font-size: 14px;}
}
@media screen and (max-width:991px){
    #ggbj{ line-height: 60px;}
    #ggbj h2{ font-size: 28px; line-height: 40px;}
    #ggbj p{ font-size: 14px; line-height: 30px; padding: 20px 0;}
}
@media screen and (max-width:768px){
    #ggbj h2{ font-size: 22px;}
    #ggbj i{ height: 35px; line-height: 35px;}
}

.gsjj .tit p{ color: #333333; font-size: 48px; font-weight: bold;}
.gsjj .tit p span{ color: var(--theme-bg);}
.gsjj .tit h2{ color: #333333; font-size: 32px; margin-top: 20px !important;}
.gsjj .con{ margin: 3% 0; color: #666666; line-height: 35px; font-size: 16px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;}
.gsjj .more{ color: var(--theme-bg); font-size: 16px;}
.gsjj .more i{ margin-right: 10px;}
.gsjj ul{ padding-top: 15px !important;}
.gsjj ul .jjlb_pic i{ position: relative; width: 80px; height: 80px; margin-bottom: -20px;}
.gsjj ul .jjlb_pic i span{ display: block; width: 80px; height: 80px; text-align: center;}
.gsjj ul .jjlb_pic i span img{ position: relative; z-index: 1;}
.gsjj ul .jjlb_pic i:before{ position: absolute; left: 0; top: 0; content: ''; background: url("../images/jj_icon3.png") no-repeat center; width: 80px; height: 80px;}
.gsjj ul .jjlb_pic i:after{ position: absolute; left: 0; top: 0; content: ''; background: url("../images/jj_icon2.png") no-repeat center; width: 80px; height: 80px;}
.gsjj ul .jjlb_pic i:before{
    -webkit-transform: rotate(360deg);
    animation: rotation 12s linear infinite;
    -moz-animation: rotation 12s linear infinite;
    -webkit-animation: rotation 12s linear infinite;
    -o-animation: rotation 12s linear infinite;
}
@-webkit-keyframes rotation{
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}
.gsjj ul .jjlb_pic i:after{
    -webkit-transform: rotate(-360deg);
    animation: rotation1 12s linear infinite;
    -moz-animation: rotation1 12s linear infinite;
    -webkit-animation: rotation1 12s linear infinite;
    -o-animation: rotation1 12s linear infinite;
}
@-webkit-keyframes rotation1{
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(-360deg);}
}
.jjlb{ width: 85%; padding-bottom: 50px;}
.jjlb h2{ font-size: 68px; color: var(--theme-bg); height: 70px; line-height: 70px; font-family: Bahnschrift; font-weight: 600 !important; position: relative;}
.jjlb h2 sub,.jjlb h2 sup{ color: #333333; font-size: 16px;}
.jjlb h2 sup{ position: absolute; right: 0; top: 10px;}
.jjlb p{ color: #333333; font-size: 16px; padding-top: 5px;}

@media screen and (max-width:1440px){
    .gsjj .tit h2{ font-size: 28px; margin-top: 10px !important;}
    .gsjj .tit p{ font-size: 40px;}
    .gsjj .con{ font-size: 14px;}
    .jjlb h2{ font-size: 54px;}
    .jjlb p,.jjlb h2 sub{ font-size: 14px;}
    .jjlb p{ padding: 0;}
}
@media screen and (max-width:1200px){
    .gsjj .tit h2{ font-size: 22px; margin-top: 10px !important;}
    .gsjj .tit p{ font-size: 30px;}
    .gsjj .more{ font-size: 14px;}
    .jjlb h2{ font-size: 44px; height: 50px; line-height: 50px;}
    .jjlb p,.jjlb h2 sub,.jjlb h2 sup{ font-size: 12px;}
}
@media screen and (max-width:991px){
    .jjlb h2{ font-size: 36px; height: 40px; line-height: 40px;}
}
@media screen and (max-width:768px){
    .jjlb{ padding: 0;}
    .jjlb li{ float: left; width: 33%; text-align: center; margin-bottom: 20px;}
    .jjlb li h2{ display: inline-block; font-size: 32px; }
}
@media screen and (max-width:500px){
    .jjlb li h2{ font-size: 26px; }
}




#xwbj{ background: url("../images/xwbj.jpg") no-repeat center top; border-top: 1px solid #e8e8e7;}
#xwpicnr_in{ position: relative;}
#xwpicnr_in .swiper-container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
#xwpicnr_in .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;
}
#xwpicnr_in .swiper-slide .pic{ display: block; width: 100%; height: 0; padding-bottom: 70%; position: relative; overflow: hidden;}
#xwpicnr_in .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute;}
#xwpicnr_in .swiper-slide .font{ background: #fff; padding: 12% 5% 8%; color: #333; width: 100%; height: auto; font-size: 16px;}
#xwpicnr_in .swiper-slide .font p{ font-size: 16px;}
#xwpicnr_in .swiper-slide .font p span{ font-size: 48px; font-weight: bold; font-family: Bahnschrift;}
#xwpicnr_in .swiper-slide .font h2{ font-size: 20px; font-weight: bold !important; padding: 2% 0; transition: 0.3s;}
#xwpicnr_in .swiper-slide .font .content{ margin-top: 10px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}
#xwpicnr_in .swiper-slide:hover .font h2{ color: var(--theme-bg);}
#xwpicnr_in .swiper-pagination{ right: 3%; bottom: 3%; left: auto; height: 30px; text-align: right;}
#xwpicnr_in .swiper-pagination .swiper-pagination-bullet{ background: var(--theme-bg); width: 10px; height: 10px;}
@media screen and (max-width:1700px){
}
@media screen and (max-width:1500px){
}
@media screen and (max-width:1440px){
    #in_news li .news_info{ font-size: 14px;}
}
@media screen and (max-width:1200px){
    #xwpicnr_in .swiper-slide .font span{ font-size: 36px;}
    #xwpicnr_in .swiper-slide .font{ font-size: 14px; line-height: 20px; }
    #xwpicnr_in .swiper-slide .font h2{ font-size: 18px;}
    #xwpicnr_in .swiper-slide .font p{ font-size: 14px;}
    #xwpicnr_in .swiper-slide .font p span{ font-size: 36px;}
}
@media screen and (max-width:991px){
}



#in_news li{ width: 100%;height: auto; margin: 0 auto; padding: 3% 0; overflow: hidden; border-bottom: 1px solid #e5e5e5; position: relative; transition: 0.3s;}
#in_news li .pic{display: block; width: 30%; height: 0; padding-bottom: 25%; position: relative; overflow: hidden;}
#in_news li .pic img{width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute;}
#in_news li .font{ width: 68%;}
#in_news li .news_title{ color: #000000; font-size: 18px; font-weight: bold; white-space: nowrap;text-overflow:ellipsis;overflow: hidden; padding-bottom: 10px; }
#in_news li .news_info{ margin: 3% 0; color: #8f8f8f; font-size: 16px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
#in_news li .more{ color: #666666; text-transform: uppercase;}
#in_news li .more i{ margin-left: 20px; font-size: 20px; transition: 0.3s;}
#in_news li:last-of-type{ border-bottom: none;}
#in_news li:hover .more,#in_news li:hover .news_title{ color: var(--theme-bg);}
#in_news li a{display: block;}
@media screen and (max-width:1440px){
    #in_news li .news_info{ font-size: 14px; margin: 1% 0;}
}
@media screen and (max-width:1200px){
    #in_news li .news_title{ font-size: 18px; padding: 0;}
    #in_news li .more{ font-size: 12px;}
    #in_news li:before{ font-size: 80px;}
}
@media screen and (max-width:991px){
    #in_news{ margin-top: 3% !important;}
}
@media screen and (max-width:768px){
    #in_news li .pic,#in_news li .font{ width: 100%;}
    #in_news li .pic{ padding-bottom: 55%; margin-bottom: 20px;}
}



/*公司简介*/
#jjzy_bj{ background: url("../images/jjzy_bj.jpg") no-repeat center;}
#jjzy_bj .tit{ position: relative;}
#jjzy_bj .tit p{ color: var(--theme-bg); font-family: Bahnschrift; font-size: 24px; text-transform: uppercase;}
#jjzy_bj .tit h2{ color: #333333; font-size: 36px; padding: 5px 0 20px !important;}
#jjzy_bj .tit:before{ position: absolute; left: 0; bottom: 0; content: ''; width: 50px; height: 3px; background: var(--theme-bg);}
#jjzy_bj .con{ font-size: 16px; line-height: 38px; margin: 3% 0;}
#jjzy_bj .jjlb{ width: 100%; margin: 5% 0 0 !important;}
@media screen and (max-width:991px){
    #jjzy_bj .tit p{ font-size: 20px;}
    #jjzy_bj .tit h2{ font-size: 30px;}
    #jjzy_bj .con{ font-size: 14px; line-height: 35px;}
}
@media screen and (max-width:768px){
    #jjzy_bj .tit p{ font-size: 14px;}
    #jjzy_bj .tit h2{ font-size: 20px;}
    #jjzy_bj .con{ font-size: 13px; line-height: 30px;}
}

.tit_zy{ color: #333333;}
.tit_zy h2{ font-size: 36px;}
.tit_zy p{ font-size: 16px; text-transform: uppercase;}
.more_zy{ height: 50px; line-height: 50px; background: var(--theme-bg); width: 150px; text-align: center; color: #fff; border-radius: 25px;}
@media screen and (max-width:1200px){
    .tit_zy h2{ font-size: 30px;}
    .tit_zy p{ font-size: 14px;}
    .more_zy{ height: 40px; line-height: 40px;}
}
@media screen and (max-width:991px){
    .tit_zy h2{ font-size: 22px;}
    .tit_zy p{ font-size: 12px;}
    .more_zy{ height: 30px; line-height: 30px; width: 100px;}
}



#whbj{ background: url("../images/whbj.jpg") no-repeat center; color: #fff;}
#whbj .tit_zy{ color: #fff;}
#whbj ul{ margin-top: 5% !important;}
#whbj ul li{ float: left; width: 50%; height: 86px; margin: 20px 0;}
#whbj ul li .pic{ position: relative; width: 72px; height: 72px; line-height: 72px; text-align: center; border-radius: 100%; background: rgba(255,255,255,0.1); margin-right: 20px; transition: 0.3s;}
#whbj ul li .pic i{ color: #fff; font-size: 34px; position: relative; z-index: 1;}
#whbj ul li .pic:before{  position: absolute; left: -7px; top: -7px; content: ''; width: 86px; height: 86px; border-radius: 100%; background: rgba(255,255,255,0.1); transition: 0.3s;}
#whbj ul li .float-start{ line-height: 35px;}
#whbj ul li .float-start p{ font-size: 24px;}
#whbj ul li .float-start span{ font-size: 16px;}
#whbj ul li:hover .pic{ background: var(--theme-bg);}
#whbj ul li:hover .pic:before{ background: rgba(196,0,0,0.4);}
@media screen and (max-width:768px){
    #whbj ul li .pic{ width: 60px; height: 60px; line-height: 60px;}
    #whbj ul li .pic:before{ width: 70px; height: 70px; left: -5px; top: -5px;}
    #whbj ul li .float-start{ width: 70%; line-height: 30px;}
    #whbj ul li .float-start p{ font-size: 20px;}
    #whbj ul li .float-start span{ font-size: 13px;}
}
@media screen and (max-width:510px){
    #whbj ul li{ width: 100%; margin: 0;}
}


.xiangce{position: relative; overflow: hidden; margin-top: 3%;}
.xiangce .swiper-slide { display: flex; flex-direction: column;  position: relative; padding: 0; background: #f7f8fb;}
.xiangce .swiper-slide .inimg{ padding: 0;}
.xiangce .swiper-slide .inimg a{ display: block; width: 100%; height: 0; padding-bottom: 72%; position: relative; overflow: hidden;}
.xiangce .swiper-slide .inimg a img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center; transition: 0.5s;}
.xiangce .swiper-slide p{ color: #333333; height: 60px; line-height: 60px; font-size: 16px; text-align: center;}
.xiangce .swiper-slide:hover .inimg img{ transform: scale(1.1);}
@media screen and (max-width:1440px){
    .xiangce .swiper-slide p{ font-size: 14px;}
}
@media screen and (max-width:991px){
}
@media screen and (max-width:768px){
}




#zzrybj{ background: url("../images/rybj.jpg") no-repeat center;}
.zzry{position: relative; overflow: hidden; margin-top: 3%;}
.zzry .swiper-slide { display: flex; flex-direction: column;  position: relative; padding: 0;}
.zzry .swiper-slide .inimg{ display: block; width: 100%; height: 0; padding-bottom: 72%; position: relative; overflow: hidden; background: #fff;}
.zzry .swiper-slide .inimg a{ display: block; width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;}
.zzry .swiper-slide .inimg a img{ max-width: 100%; height: 100%; transition: 0.5s;}
.zzry .swiper-slide p{ color: #333333; height: 60px; line-height: 60px; font-size: 16px; text-align: center;}
.zzry .swiper-slide:hover .inimg img{ transform: scale(1.1);}
@media screen and (max-width:1440px){
    .zzry .swiper-slide p{ font-size: 14px;}
}
@media screen and (max-width:991px){
}
@media screen and (max-width:768px){
}






/*产品*/
.cp_class,.cpclass { margin-top: 30px !important;}
.cp_class li { cursor: pointer; height: 45px; line-height: 45px; transition: 0.3s;}
.cp_class li p{ transition: 0.3s; color: #333333; font-size: 16px; width: 90%; overflow: hidden; text-overflow: ellipsis; white-space: pre;}
.cp_class li i{ font-size: 12px; color: #e9e9e9; transition: 0.3s;}
.cp_class li:hover p,.cp_class li:hover i{ color: var(--theme-bg);}

.cpclass li{ background: #fff; margin-bottom: 30px; text-align: center;}
.cpclass li .pic{ width: 100%; display: block; height: 0; padding-bottom: 75%; position: relative;}
.cpclass li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;transition: 0.5s;}
.cpclass li .tit{ padding: 10% 0;}
.cpclass li .tit h2{ color: #333333; font-size: 18px; transition: 0.5s;}
.cpclass li .tit span{ display: block; height: 35px; line-height: 35px; background: #eeeeee; color: #333333; width: 50%; margin: 5% auto 0; transition: 0.5s;}
.cpclass li:hover .tit h2{ color: var(--theme-bg);}
.cpclass li:hover .tit span{ background: var(--theme-bg); color: #fff;}
@media screen and (max-width:991px){
    .cpclass li .tit h2{ font-size: 16px;}
    .cpclass li .tit span{ height: 30px; line-height: 30px;}
}
@media screen and (max-width:768px){
    .cpclass li .tit h2{ font-size: 14px;}
    .cpclass li .tit span{ font-size: 12px;}
}

#pro_info{ background: url("../images/zi_banner.jpg") no-repeat center top;}
.home_zy{ color: #fff;}
.home_zy a{ padding: 0 10px; color: #fff;}
.home_zy i{ margin-right: 10px;}

.pro_nr{ background: #fff; padding: 40px 20px; margin-top: 3%; border-radius: 10px; box-shadow: 0 0 15px rgba(0,0,0,0.1);}
#qfwfw{ margin: 0; overflow: hidden;}
#qfwfw .swiper-slide { background-position: center; position: relative;}
#qfwfw .gallery-top { height: auto; padding: 0; overflow: hidden; }
#qfwfw .gallery-top .swiper-slide{}
#qfwfw .gallery-top .swiper-slide p{display: block; width: 100%; height: 0; padding-bottom: 79%; position: relative; overflow: hidden;}
#qfwfw .gallery-top .swiper-slide p img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition:0.3s;}
#qfwfw .gallery-thumbs { height: auto; text-align: left;}
#qfwfw .gallery-thumbs .swiper-wrapper{ width: auto;}
#qfwfw .gallery-thumbs .swiper-slide { width: 100%; cursor: pointer; padding: 0; line-height: 25px; position: relative; height: auto;}
#qfwfw .gallery-thumbs .swiper-slide p{ display: block; border: 3px solid #f4f4f4; width: 100%; height: 0; padding-bottom: 60%; position: relative; overflow: hidden; transition: 0.3s;}
#qfwfw .gallery-thumbs .swiper-slide p img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition:0.3s;}
#qfwfw .gallery-thumbs .swiper-slide-thumb-active { position: relative; }
#qfwfw .gallery-thumbs .swiper-slide-thumb-active p{ border: 3px solid var(--theme-bg);}
@media screen and (max-width:1440px){
    #qfwfw .gallery-thumbs{ padding: 0 !important; margin-bottom: 10px !important;}
}
@media screen and (max-width:991px){
    #qfwfw .gallery-top{ margin-bottom: 3%;}
    #qfwfw .gallery-thumbs .swiper-wrapper{ padding-top: 0;}
    #qfwfw .gallery-thumbs .swiper-slide{ padding: 3%;}
}
@media screen and (max-width:768px){
}


.pro_nr .font h2{ display: block; position: relative; color: #333333; font-size: 36px; height: 70px; line-height: 40px; transition: 0.5s; overflow: hidden; text-overflow: ellipsis; white-space: pre; border-bottom: 1px solid #e9e9e9;}
.pro_nr .font h2 p{ position: relative; z-index: 1; padding-left: 10px; transition: 0.5s;}
.pro_nr .font h2:before{ position: absolute; left: 7px; top: 0; content: ''; width: 15px; height: 40px; border-radius: 3px; background: var(--theme-bg); transition: all linear 0.3s; transform: skewX(-20deg);}
.pro_nr .font .con{ color: #666666; font-size: 16px; margin: 3% 0; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;}
.pro_nr .font dl{ border-top: 1px solid #e9e9e9; margin: 3% 0 5% !important; padding-top: 3%;}
.pro_nr .font dl dd{ padding: 0 30px; margin-right: 10px; height: 40px; line-height: 40px; border: 1px solid #dedede; text-align: center; transition: 0.5s; cursor: default;}
.pro_nr .font dl dd:hover{ background: var(--theme-bg); color: #fff; border: 1px solid var(--theme-bg);}
.pro_nr .order-btn{ height: 55px; line-height: 55px; color: #fff; background: var(--theme-bg); text-align: center; font-size: 16px; transition: 0.3s;}
.pro_nr .order-btn a{ color: #fff;}
.pro_nr .order-btn i{ font-size: 20px; margin-right: 10px;}
@media screen and (max-width:1440px){
    .pro_nr .font h2{ font-size: 32px;}
}
@media screen and (max-width:1200px){
    .pro_nr .font dl dd{ padding: 0 10px;}
    .pro_nr .order-btn{ font-size: 14px;}
    .pro_nr .font .con{ font-size: 14px;}
}
@media screen and (max-width:991px){
    .pro_nr .font h2{ font-size: 22px; height: 50px;}
    .pro_nr .font dl dd{ padding: 0 8px; font-size: 12px;}
    .pro_nr .order-btn{ height: 45px; line-height: 45px;}
}



#cpbtqh{ width: 100% !important; transition:0.3s; background: #f7f8fb; text-align: center;}
.cpbt{ margin: 0 auto !important; height: 70px; line-height: 70px; width: 100%; transition:0.3s;}
.cpbt li{ float: left; color: #666666; font-size: 18px; width: 25%; 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 a{ color: #cf0000;}
.cpbt li:hover:after{ position: absolute; left: 25%; bottom: 0; width: 50%; height: 3px; content: ''; background: #cf0000;}
.cpbt li.current a{ color: #cf0000;}
.cpbt li.current:hover:after{ left: 25%; width: 50%; background: #cf0000;}
.cpbt li.current:after{ left: 25%; width: 50%; background: #cf0000;}

@media screen and (max-width:1600px){
}
@media screen and (max-width:1440px){
}
@media screen and (max-width:1200px){
}
@media screen and (max-width:991px){
}
@media screen and (max-width:768px){
    .cpbt li{ font-size: 13px;}
}


.pro_con{ font-size: 16px; line-height: 35px; margin-bottom: 5%;}
/*.cpzy_tit{ margin-top: 5%;}*/
.cpzy_tit p{ color: #333333; font-size: 48px; font-weight: bold;}
.cpzy_tit span{ display: block; margin-left: 20px; position: relative; height: 40px; background: var(--theme-bg); line-height: 42px; padding: 0 30px; color: #fff; font-size: 24px; font-family: Bahnschrift; text-transform: uppercase; border-bottom-left-radius: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.cpzy_tit span em{ position: relative; z-index: 1;}
.cpzy_tit span:before{ position: absolute; right: -7px; bottom: 0; content: ''; background: rgba(196,0,0,0.3); height: 40px; border-top-right-radius: 20px; width: 50%;}
.cpzy_tit span:after{ position: absolute; right: -14px; bottom: 0; content: ''; background: rgba(196,0,0,0.3); height: 40px; border-top-right-radius: 20px; width: 50%;}
.cpzy_tit i{ font-size: 16px; padding-top: 15px;}


.cpzy_ys{ margin-top: 3% !important;}
.cpzy_ys li{ border: 1px solid #e1e1e1; width: 23%; text-align: center; padding: 3% 0; transition: 0.3s;}
.cpzy_ys li i{ color: var(--theme-bg); font-size: 40px; height: 40px; transition: 0.3s;}
.cpzy_ys li h2{ color: #333333; font-size: 24px; padding: 30px 0 20px; transition: 0.3s;}
.cpzy_ys li p{ color: #999999; font-size: 16px; transition: 0.3s;}
.cpzy_ys li em{ display: block; width: 30px; height: 30px; border: 3px solid var(--theme-bg); border-radius: 100%; line-height: 24px; color: var(--theme-bg); font-size: 20px; margin: 30px auto 0; font-weight: bold; transition: 0.3s;}
.cpzy_ys li:hover{ background: var(--theme-bg);}
.cpzy_ys li:hover i,.cpzy_ys li:hover h2,.cpzy_ys li:hover p,.cpzy_ys li:hover em{ color: #fff;}
.cpzy_ys li:hover em{ border: 3px solid #fff;}

@media screen and (max-width:1440px){
    .cpzy_tit p{ font-size: 40px;}
    .cpzy_tit span{ font-size: 20px;}
}
@media screen and (max-width:1200px){
    .cpzy_tit p{ font-size: 32px;}
    .cpzy_tit span{ font-size: 16px;}
    .cpzy_ys li h2{ font-size: 20px;}
    .cpzy_ys li p{ font-size: 14px;}
}
@media screen and (max-width:991px){
    .cpzy_tit p{ font-size: 24px;}
    .cpzy_tit span,.cpzy_tit i{ font-size: 14px;}
    .cpzy_ys li{ width: 47%; float: left; margin-bottom: 20px;}
    .cpzy_ys li:nth-of-type(2n){ float: right;}
}
@media screen and (max-width:768px){
    .pro_con{ font-size: 14px; padding-left: 15px; padding-right: 15px;}
    .cpzy_ys li i{ font-size: 30px; height: 30px;}
    .cpzy_ys li h2{ font-size: 18px; padding: 15px 0 10px;}
    .cpzy_ys li p{ line-height: 25px;}
    .cpzy_ys li em{ width: 25px; height: 25px; border: 1px solid var(--theme-bg); line-height: 23px; font-size: 14px;}
}

#xgcp{ margin-top: 3%; overflow: hidden;}
#xgcp .swiper-container {
    width: 100%;
    height: 100%;
    padding: 10px;
}
#xgcp .swiper-slide {
    transition: 0.3s;
    overflow: hidden;
    position: relative;
    background: #fff;
    border: 1px solid #efefef;

    /* 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 .pic{ width: 100%; display: block; height: 0; padding-bottom: 75%; position: relative;}
#xgcp .swiper-slide .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; text-align: center;transition: 0.5s;}
#xgcp .swiper-slide .tit{ padding: 10% 0; width: 100%; text-align: center;}
#xgcp .swiper-slide .tit h2{ color: #333333; font-size: 18px; transition: 0.5s;}
#xgcp .swiper-slide .tit span{ display: block; height: 35px; line-height: 35px; background: #eeeeee; color: #333333; width: 50%; margin: 5% auto 0; transition: 0.5s;}
#xgcp .swiper-slide:hover .tit h2{ color: var(--theme-bg);}
#xgcp .swiper-slide:hover .tit span{ background: var(--theme-bg); color: #fff;}



/*新闻资讯*/
.news_pic { padding: 0 !important;}
.news_pic li{ margin-bottom: 7%;}
.news_pic .imgbox { width: 100%; height: 0; padding-bottom: 65%; position: relative; overflow: hidden; border-radius: 10px;}
.news_pic .imgbox img { object-fit: cover; left: 0; position: absolute; text-align: center; height:100%; width:100%; transition: 0.3s;}
.news_pic .imgbox1 { width: 100%; height: 0; padding-bottom: 65%; position: relative; overflow: hidden; border-radius: 10px;}
.news_pic .imgbox1 p{ object-fit: cover; left: 0; position: absolute; text-align: center; height:100%; width:100%;}
.news_pic .imgbox1 p img{ max-width: 100%; height: 100%; transition: 0.3s;}
.news_pic .imgbj{ position: absolute; z-index: 1; padding: 4%; color: #fff; left: 0; bottom: 0; width: 100%; height: 100%; }
.news_pic .imgbj .tit{ position: relative; z-index: 5; font-weight: bold; font-size: 18px; transition: 0.5s;}
.news_pic .imgbj i{ position: relative; z-index: 5; font-size: 30px; transition: 0.5s;}
.news_pic .imgbj:after {
    content: " ";
    z-index: 4;
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0.7;
    background-image: url('../images/mask-md-fc.png');
    background-size: 100% auto;
    background-position: 50% 100%;
    background-repeat: no-repeat;
}
.news_pic li:hover .imgbox img{ transform: scale(1.05) rotate(-1deg); }
.news_pic li:hover .imgbox1 p img{ transform: scale(1.05) rotate(-1deg); }




#xwclass{ padding: 0 4% !important; background: #fff;}
#xwclass li{width: 100%;height: auto; padding: 4% 0; transition: 0.3s; border-bottom: 1px solid #d6d6d6;}
#xwclass li .pic{ display: block; height: 0; padding-bottom: 20%; position: relative; overflow: hidden;}
#xwclass li .pic img{ width: 100%; height: 100%; object-fit: cover; left: 0; position: absolute; transition:0.3s;}
#xwclass li .font{ padding-left: 3%;}
#xwclass li .news_title{ text-align: left; color: #333333; font-size: 20px; white-space: nowrap; text-overflow:ellipsis; overflow: hidden; line-height: 30px;}
#xwclass li .news_time{ color: #999999; font-size: 15px; font-family: Arial; padding: 10px 0 20px;}
#xwclass li .news_info{ color: #999999; font-size: 16px; display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;}
#xwclass li i{ float: right; width: 60px; height: 60px; text-align: center; line-height: 55px; border: 1px solid #c8c8c8; border-radius: 3px;transition: 0.3s;}
#xwclass li i svg{ width: 24px;}
#xwclass li i svg path{ fill: #666; transition: 0.3s;}
#xwclass li:last-of-type{ border-bottom: none;}
#xwclass li:hover .news_time span{ color: var(--theme-bg);}
#xwclass li:hover i{ border: 1px solid var(--theme-bg); background: var(--theme-bg);}
#xwclass li:hover i svg path{ fill: #fff;}
@media screen and (max-width:991px){
    #xwclass li .news_title{ font-size: 18px;}
    #xwclass li .news_time{ font-size: 12px; padding: 5px 0;}
    #xwclass li .news_info{ font-size: 14px;}
}
@media screen and (max-width:768px){
    #xwclass li .pic{ padding-bottom: 55%; margin-bottom: 3%;}
    #xwclass li .news_title{ font-size: 16px;}
}


#xw_main .content{ color: #666666; font-size: 16px; border-bottom: 1px solid #f5f5f5; margin-bottom: 6%; padding: 4% 0;}
.xw_bai{ background: #fff; padding: 3%; line-height: 40px;}
.xw_bai h1{ color: #000000; font-size: 22px; line-height: 40px;}
.xw_bai .click{ color: #666666; font-size: 14px;}
.xw_bai .click i{ display: inline-block; margin-right: 10px;}
.xw_bai img{ display: block; max-width: 100%; margin: 2% auto;}



#prev_next{ height: 80px; line-height: 80px; margin-top: 10px !important; }
#prev_next li{ float: left; width: 49.5%; color: #999999; background: #fff; padding: 0 5%;}
#prev_next li .page-a{white-space: nowrap; overflow:hidden; text-overflow: ellipsis;}
#prev_next li a{ color: #999999;}
#prev_next li:last-of-type{ float: right; text-align: right;}
#prev_next li:hover{ color: var(--theme-bg);}
#prev_next li:hover a{ color: var(--theme-bg);}
@media screen and (max-width:991px){
    #prev_next li{  width: 100%; line-height: 25px; font-size: 13px; margin-top: 2%;}
    .xw_bai h1{ font-size: 18px; height: auto; line-height: 30px;}
    #prev_next li:last-of-type{ text-align: left;}
}

.xwinfo_tit{ color: #333333; font-size: 20px; font-weight: bold;}
#xgxw_pic{ margin-top: 5%; overflow: hidden;}
#xgxw_pic img{ max-width: 100%; transition: 0.3s;}
#xgxw_pic:hover img{ transform: scale(1.05);}
#xgxw{ padding: 0 !important;}
#xgxw li{ color: #666666; font-size: 16px; transition: 0.3s; line-height: 30px; margin-top: 5%;}
#xgxw li:hover{ color: var(--theme-bg); }
@media screen and (max-width:1200px){
    #xgxw li{ font-size: 12px;}
}




/*联系我们*/
.de-contact .lx_tit{ margin-bottom: 2%;}
.de-contact .lx_tit p{ color: var(--theme-bg); font-weight: bold; font-size: 32px; padding-right: 10px;}
.de-contact .lx_tit span{ color: #999999; font-size: 16px; text-transform: uppercase;}
.lxwm{ padding: 3% 5% 0 0 !important;}
.lxwm li{ color: #000000; cursor: pointer; border-top: 1px solid #ededed; padding: 3% 0; }
.lxwm li i{ height: 50px; width: 50px; line-height: 50px; margin-right: 15px; text-align: center; color: var(--theme-bg); font-size: 30px; border: 1px solid #d7d7d7; transition: 0.3s;}
.lxwm li .d-md-flex{ width: 90%;}
.lxwm li .font{ line-height: 25px; width: 35%;}
.lxwm li .font span{ display: block; color: #666666; font-size: 16px;}
.lxwm li .font p{ color: #c8c8c8; font-size: 13px; text-transform: uppercase;}
.lxwm li .con{ color: #333333; font-size: 20px; width: 65%;}
.lxwm li:last-of-type{ border-bottom: 1px solid #ededed;}
.de-contact .contact-map{ margin-top: 5%;}
.de-contact .ewm{ text-align: center;}
.lxwm li:hover i{ background: var(--theme-bg); border: 1px solid var(--theme-bg); color: #fff;}
@media screen and (max-width:1440px){
    .lxwm li{ padding: 4% 0;}
    .lxwm li .con{ font-size: 18px;}
}
@media screen and (max-width:1200px){
    .lxwm li .font span{ font-size: 14px;}
    .lxwm li .font p{ font-size: 12px;}
    .lxwm li .con{ font-size: 16px;}
}
@media screen and (max-width:991px){
    .de-contact .lx_tit{ margin: 5% 0 0;}
}
@media screen and (max-width:768px){
    .lxwm li .font{ width: 100%;}
    .lxwm li .font p{ display: none;}
    .de-contact .lx_tit p{ font-size: 20px;}
    .de-contact .lx_tit span{ font-size: 14px;}
}





/*公共*/
#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;  line-height: 50px; text-align: center;}
#zi_banner .main h2{ font-size: 36px;}
#zi_banner .main p{ font-size: 16px; }
@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: 6%;}
    #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: 8%;}
    #zi_banner .main h2{ font-size: 24px;}
    #zi_banner .main p{ font-size: 14px;}
}
@media screen and (max-width:560px) {
    #zi_banner .main h2{ font-size: 20px;}
    #zi_banner .main p{ display: none;}
}




#homebj{ position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; height: 60px; line-height: 58px; color: #fff; border-top: 1px solid rgba(255,255,255,0.1);}
#homebj ul{ width: 70%;}
#homebj ul li{ padding: 0 5%; position: relative; font-size: 16px; text-align: center;}
#homebj ul li:before{ position: absolute; right: 0; top: 35%; content: ''; height: 30%; background: rgba(255,255,255,0.2); width: 1px;}
#homebj ul li a{ color: #fff; transition: 0.3s;}
#homebj ul li:hover a{ color: var(--theme-bg);}
.home{ text-align: right; color: #fff;}
.home i{ display: inline-block; margin-right: 10px; font-weight: bold; font-size: 18px;}
.home a{ padding: 0 8px; color: #fff;}
.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%; padding: 0; 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 a{ color: #fff;}
#cpnav .swiper-slide:before{ position: absolute; right: 0; top: 35%; content: ''; height: 30%; background: rgba(255,255,255,0.2); width: 1px;}
#cpnav .swiper-slide:hover a{ color: var(--theme-bg);}
@media screen and (max-width:1200px){
    #cpnav .swiper-slide{ font-size: 14px;}
}
@media screen and (max-width:991px){
    #cpnav{ width: 100%;}
}
@media screen and (max-width:765px){
}


.hui{ background: #f8f8f8;}
.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;
}