@charset "utf-8"; html, body {
    margin: 0px;
    padding: 0px;
}

IMG {
    border-width: 0px;
}

* {
    list-style-type: none;
    margin: 0;
    padding: 0;
    font-family: Arial,"Segoe UI"
}

a {
    text-decoration: none !important;
    color: #555
}

a:hover {
    text-decoration: none;
}

.banner{width: 100%;margin:0 auto}
.banner img{display: block;width: 100%;height: auto}


@media (min-width: 768px) {
    .navbar-nav{font-size: 1rem;
        display: flex;justify-content: space-between;width: 100%;}
    .navbar-nav a{color:#333}
    .logo-box{margin-right: 1.5rem}
    .logo{max-width:100%;max-height: 4.5rem}
    .navbar-collapse{display: block}
    .navbar-expand-lg .navbar-nav{justify-content: flex-end}
    .dropdown-menu {font-size: 1rem;
        --bs-dropdown-link-active-bg:#fff!important;}
    .nav-item{align-items: center;text-align: center;font-size: 1rem;margin:0 2rem}
     .container-box{max-width: 1300px;margin:0 auto;

    }
     .phone{color: #ff7216;font-size: 1.1rem;font-weight:700;}
     .banner-box{background: url("../images/banner-bg.jpg") no-repeat center center;background-size: cover}
     .banner-box img{max-width: 100%; height: auto;margin: 0 auto;display: block}

     .space-padding{padding: 2rem}
     .box-inner{display: flex;justify-content:space-between;align-items: center;}
     .left{width: 40%}
         .left img{max-width: 100%;height: auto}
         .right{width: 50%;margin-left: 5%}
         .right .title{font-size: 2rem;line-height: 1.8;font-weight: bold;margin-bottom: 1rem;
         &:after{width: 3rem;height: 5px;background: #0a58ca;border-radius: 10px;display: block;content: "";}
         }

         .right .summary{font-size: 1.1rem;margin-top: 20px;line-height: 1.8;
             color: #666;}

    .box-fill{background:#f2f2f2;
        .left{order: 10}
        .right{order: 0}
    }
    .bottom-box{width: 100%;margin: 0 auto;background: #425db1;
        font-size:.9rem;text-align: center;color: #eee;line-height: 1.5;padding: 2rem}
    .bottom{text-align: center}
    .bottom-box a{color: #eee}
    .about-box{font-size: 1rem;line-height: 1.8;color: #555;margin-top:2rem}
    .about-box img{max-width: 100%;height: auto;margin: 0 auto;display: block}
    .about-box .title{font-size: 1.8rem;line-height: 1.8;font-weight: bold;text-align: center;
        margin: 1rem auto;border-bottom: solid 1px #dedede;
        &:after{width: 3rem;height: 5px;background: #0a58ca;border-radius: 10px;display: block;content: "";margin:8px auto -3px}
    }
    .about-box .content{font-size: .95rem;line-height: 1.8;margin: 2rem auto 4rem; min-height: 22vh}
    .contact-box{font-size: 1rem;line-height: 1.8;margin: 2rem auto;display: flex;align-items: center;justify-content: center}
    .contact-box .l{width:35%;text-align: center;line-height: 1.8;font-size: 1rem}
    .contact-box  .l img{max-width:100%;height: auto;margin: 0 auto;display: block}

    .contact-box .r{width:55%; margin-left: 5%;font-size: 1rem;line-height: 2}
    .contact-map{max-width: 1200px;margin: 0 auto;border-radius: 20px;overflow: hidden;}
    .nav-padding{padding: 0 1rem}



}

@media (max-width: 1024px) {
    .container-box{max-width: 1600px;margin:0 auto; --bs-gutter-y: 0;
        width: 100%;
        padding: 0 1rem;
    }
    .navbar-nav{font-size: 1rem;
        display: flex;justify-content: space-between;}
    .navbar-nav  li{width: 100%;text-align: center;font-size: .9rem}
    .navbar-nav{font-size: 1rem;
        display: flex;justify-content: space-between;width: 100%;}
    .navbar-nav a{color:#333}
    .logo-box{margin-right: 1.5rem}
    .logo{max-width:100%;max-height: 4.5rem}
    .navbar-collapse{display: block}
    .navbar-expand-lg .navbar-nav{justify-content: flex-end}
    .dropdown-menu {font-size: 1rem;
        --bs-dropdown-link-active-bg:#fff!important;}
    .nav-item{align-items: center;text-align: center;font-size: 1rem;margin:0 2rem}
    .container-box{max-width: 1300px;margin:0 auto;

    }
    .phone{color: #ff7216;font-size: 1.1rem;font-weight:700;}
    .banner-box{background: url("../images/banner-bg.jpg") no-repeat center center;background-size: cover}
    .banner-box img{max-width: 100%; height: auto;margin: 0 auto;display: block}

    .space-padding{padding: 2rem}
    .box-inner{display: flex;justify-content:space-between;align-items: center;}
    .left{width: 40%}
    .left img{max-width: 100%;height: auto}
    .right{width: 50%;margin-left: 5%}
    .right .title{font-size: 2rem;line-height: 1.8;font-weight: bold;margin-bottom: 1rem;
        &:after{width: 3rem;height: 5px;background: #0a58ca;border-radius: 10px;display: block;content: "";}
    }

    .right .summary{font-size: 1.1rem;margin-top: 20px;line-height: 1.8;
        color: #666;}

    .box-fill{background:#f2f2f2;
        .left{order: 10}
        .right{order: 0}
    }



}
@media (max-width: 767.98px) {
    .container-box{max-width: 1600px;margin:0 auto; padding: 0 15px;
    }
    .phon-nav{width: 100%;padding: 0!important;}

    .navbar-expand-lg{padding-right: 1rem}
    .navbar-toggler{margin-right: 1rem}
    .navbar-collapse{background: #fafafa;padding: 1rem 0}
    .navbar-nav{align-items: center;text-align: center}
    .navbar-nav  li{width: 100%}
    .nav-item {border-bottom: solid 1px #eee;font-size:.9rem}
    .logo{max-width:80%;height: auto;float: left;margin-left: 1rem}

    .container-box{max-width: 1300px;margin:0 auto;

    }
    .phone{color: #ff7216;font-size: 1.1rem;font-weight:700;}
    .banner-box{background: url("../images/banner-bg.jpg") no-repeat center center;background-size: cover}
    .banner-box img{max-width: 100%; height: auto;margin: 0 auto;display: block}

    .space-padding{padding:1rem 2rem}
    .box-inner{display: block;}
    .left{width: 90%;margin:0 auto}
    .left img{max-width: 100%;height: auto}
    .right{width: 100%;margin: 20px auto;display: block}
    .right .title{font-size: 1.3rem;line-height: 1.8;font-weight: bold;margin-bottom: .5rem;
        &:after{width: 2rem;height: 5px;background: #0a58ca;border-radius: 10px;display: block;content: "";}
    }

    .right .summary{font-size: .9rem;margin-top: 20px;line-height: 1.6;
        color: #666;}

    .box-fill{background:#f2f2f2;
        .left{order: 10}
        .right{order: 0}
    }
    .bottom-box{width: 100%;margin: 0 auto;background: #425db1;
        font-size:.9rem;text-align: center;color: #eee;line-height: 1.5;padding: 2rem}
    .bottom{text-align: center}
    .bottom-box a{color: #eee;}
    .about-box{color: #555;width: 95%;margin:1.2rem auto}
    .about-box img{max-width: 100%;height: auto;margin: 0 auto;display: block}
    .about-box .title{font-size: 1.2rem;line-height: 1.8;font-weight: bold;text-align: center;
        margin: 1rem auto;border-bottom: solid 1px #dedede;
        &:after{width: 3rem;height: 5px;background: #0a58ca;border-radius: 10px;display: block;content: "";margin:0 auto -3px}
    }
    .about-box .content{font-size: .9rem;line-height: 1.6;margin: 1rem auto; min-height: 20vh}

    .contact-box{font-size: .9rem;line-height: 1.8;margin: 2rem auto;display: flex;flex-direction: column}
    .contact-box .l{width:100%;text-align: center;line-height: 1.8;font-size: 1rem;order: 2}
    .contact-box  .l img{max-width:90%;height: auto;margin: 1rem auto 0;display: block}

    .contact-box .r{width:100%; font-size: .9rem;line-height: 1.5;order: 0}
    .contact-map{max-width: 1200px;margin: 0 auto;border-radius: 20px;overflow: hidden;}
}





/*页码*/
.list-page {
    text-align: center;
    width: 98%;
    margin: 0 auto 1rem;display: flex;justify-content: center;
}

.pagination a {

    color: #0b112a !important
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 3;
    color: #fff !important;
    cursor: default;
    background-color: #333 !important;
    border-color: #ddd !important;
}

/*顶部*/
.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 10px;
    box-shadow: 0 0 10px rgba(230, 0, 18, 0.05);
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    border-radius: 5px;
    z-index: 28;
    background: rgba(230, 0, 18) url(../images/cd-top-arrow.svg) no-repeat center 50%;

    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.cd-top.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    opacity: .8;
}
.no-touch .cd-top:hover {
    background-color:#06C;
    opacity: 1;
}
@media only screen and (min-width: 768px) {
    .cd-top {
        right: 20px;
        bottom: 20px;
    }
}
@media only screen and (min-width: 1024px) {
    .cd-top {
        height: 55px;
        width: 55px;
        right: 30px;
        bottom: 30px;
        border-radius: 10px;
    }
}