body {
    background: #fff;
    font-family: 'Roboto', sans-serif;
}

body a {
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

ul {
    padding: 0;
    margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
label,
p {
    margin: 0;
}

.banner-header {
    padding: 0;
    height: 72%;
}

.header {
    padding: 0;
    /* overflow: hidden; */
}

.logo {
    float: left;
}

.header-bottom {
    float: right;
    width: 60%;
}

.top-nav {
    float: right;
}

.copyrights {
    text-indent: -9999px;
    height: 0;
    line-height: 0;
    font-size: 0;
    overflow: hidden;
}

/*----*/
.top-nav ul li {
    display: inline-block;
}

.top-nav ul li:nth-child(5) {
    border-right: none;
}

.top-nav ul li a {
    display: inline-block;
    color: #1f6481;
    text-decoration: none;
    font-weight: 500;
    font-size: 1.2em;
    margin: 1em 0.5em;
    padding: 0.7em 1.2em;
    background: #fff;
    border: 1px solid #fff;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
}

.top-nav ul li a:hover,
.top-nav ul li.active a {
    background: #fafafa;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    border: 1px solid #EEEFF0;
}

.top-nav span.menu {
    display: none;
}

/*----*/
@media(max-width:768px) {
    span.menu {
        display: block;
        text-align: right;
        cursor: pointer;
        position: relative;
    }

    .top-nav ul {
        display: none;
        position: absolute;
        width: 100%;
        z-index: 9999;
        left: 0%;
        margin: 1em 0em;
        background: #0E4D6F;
        border: 0;
    }

    .top-nav span.menu {
        display: block;
        width: 100%;
        text-align: right;
        cursor: pointer;
    }

    .top-nav ul li {
        display: block;
        float: none;
        padding: 0.3em;
        text-align: center;
    }

    .top-nav ul li a {
        color: #fff;
        display: block;
        margin: 0;
        background: none;
        border: none;
        padding: 0.4em;
    }

    .top-nav ul li a:hover,
    .top-nav ul li.active a {
        background: none;
        border: none;
        color: #9e82ae;
    }

    .searchTxtLink,
    .searchTxt {
        display: none !important
    }
}

/*----*/
.banner {
    background: url(../images/banner_top.jpg)no-repeat;
    width: 100%;
    min-height: 600px;
    display: block;
    background-size: cover;
    padding: 6em 0;
}

.banner-in {
    min-height: 200px;
    /* min-height: 291px; */
    padding: 6em 0 0;
}

.banner-in h1 {
    color: #fff;
    font-size: 3.5em;
    font-weight: 900;
}

.item-right h1 {
    color: #fff;
    font-size: 4.3em;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 0.8em;
}

.item-right span {
    color: #fff;
    font-size: 1.8em;
    font-weight: 100;
}

.item-right p {
    color: #fff;
    font-size: 1.1em;
    font-weight: 100;
    line-height: 1.8em;
    margin: 2em 0;
}

.item-right a {
    color: #fff;
    text-decoration: none;
    font-size: 2em;
    font-weight: 900;
    background: #4fa7d1;
    padding: 0.5em 0.7em;
    display: inline-block;
    text-transform: uppercase;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
}

.item-right a:hover {
    background: #44BCEF;
}

.item-right a i {
    background: url(../images/img-sprite.png)no-repeat -8px -9px;
    width: 30px;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px 0 0px;
}

.banner-matter {
    padding: 2em 1em;
}

/*----*/
.content-top {
    padding: 3em 0;
}

.grid {
    padding: 2em;
    border: 1px solid #d9e3e7;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    width: 30%;
    margin-right: 5%;
}

.grid:nth-child(3) {
    margin-right: 0;
}

.grid h3 {
    color: #1e719b;
    font-size: 1.3em;
    font-weight: 700;
    text-transform: uppercase;
}

.grid h3 i {
    width: 60px;
    min-height: 40px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px 0 0px;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.grid h3 i.mid {
    background-position: -226px -8px;
}

.grid h3 i.just {
    background-position: -295px -3px;
}

.grid p {
    color: #5f5f5f;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.8em;
    margin: 0em 0 1em;
}

/*--grid--*/
.grid:hover.grid h3 {
    color: #755f83;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.grid:hover.grid h3 i {
    background-position: -164px -46px;
}

.grid:hover.grid h3 i.mid {
    background-position: -226px -54px;
}

.grid:hover.grid h3 i.just {
    background-position: -295px -46px;
}

.grid:hover a.just-do-in {
    background: #755f83;
}

a.just-do,
a.just-do-in {
    color: #fff;
    text-decoration: none;
    margin-top: 0.5em;
    font-size: 1.2em;
    font-weight: 600;
    background: #4fa7d1;
    padding: 0.3em 1em;
    display: inline-block;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
}

a.just-do:hover {
    background: #755f83;
}

.content-grid {
    padding: 2em 0 1em;
    text-align: center;
}

.content-grid h2 {
    color: #1e719b;
    font-size: 2.4em;
    font-weight: 700;
}

.content-grid p {
    color: #5f5f5f;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.8em;
    margin: 2.5em 0 0;
}

/*----*/
.content-bottom {
    /* background:#9e82ae; */
    /*padding: 3em 0;*/
    text-align: center;
    position: relative;
}

.content-bottom h3 {
    color: #fff;
    font-size: 4.3em;
    font-weight: 900;
    text-transform: uppercase;
}

.content-bottom p {
    color: #fff;
    font-size: 2em;
    font-weight: 100;
    margin: 0.5em 0 0;
}

.content-bottom i {
    background: url(../images/ar.png)no-repeat 0px 0px;
    width: 55px;
    min-height: 17px;
    display: inline-block;
    margin: 0 auto;
    position: absolute;
    bottom: -17px;
    right: 48%;
}

/*----*/
ul.drop li {
    list-style: none;
    align-items: center;
    align-content: center;
    text-align: center;
    color: #2567fc;
}


.currentli a {
    color: #1EC67A;
    border: 1px solid #1EC67A;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    box-shadow: 1px 1px 1px 0px #d9e3e7;
    padding: 1em;
    text-decoration: none;
    display: block;
    font-size: 1.2em;
    margin: 0em 0 1em;
    font-weight: 400;
    background-color: #f3f3f3;
}

.currentli a:hover {
    background: #fafafa;
    font-size: 1.2em;
    color: #1EC67A
}

.leftnavli a {
    color: #0e4d6f;
    background: #fff;
    border: 1px solid #D9E3E7;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    box-shadow: 1px 1px 1px 0px #d9e3e7;
    padding: 1em;
    text-decoration: none;
    display: block;
    font-size: 1.2em;
    margin: 0em 0 1em;
    font-weight: 400;
}

.leftnavli a:hover {
    background: #fafafa;
    color: #1EC67A
}

.ser-grid h3 {
    color: #1e719b;
    font-size: 1.3em;
    font-weight: 500;
    text-transform: uppercase;
}

.ser-grid h3 i {
    background: url(../images/img-sprite.png)no-repeat -164px 0px;
    width: 60px;
    min-height: 50px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 8px 0 0px;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.ser-grid h3 i.mid {
    background-position: -226px -8px;
}

.ser-grid p {
    color: #5f5f5f;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.8em;
}

/*----*/
.ser-grid:hover.ser-grid h3 {
    color: #755f83;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.ser-grid:hover.ser-grid h3 i {
    background-position: -164px -46px;
}

.ser-grid:hover.ser-grid h3 i.mid {
    background-position: -226px -54px;
}

.ser-grid:hover a.just-do-in {
    background: #755f83;
}

.ser-grid:hover a.see {
    text-decoration: none;
}

a.do {
    float: left;
}

a.see {
    color: #b2b2b2;
    text-decoration: underline;
    font-size: 1.1em;
    font-weight: 400;
    display: inline-block;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -o-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    float: right;
    font-style: italic;
    padding: 0.3em 0em;
}

a.see:hover {
    text-decoration: none;
}

.do-see {
    padding: 1.2em 0 0;
}

.ser-grid {
    padding: 2em;
    border: 1px solid #d9e3e7;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    margin: 1em 0 0;
}

.grid-this h3 {
    color: #755f83;
}

a.do-this {
    float: left;
}


.grid-service-content p {
    font-weight: 300;
    width: 100%;
    text-align: center;
}

    .grid-service-content p img {
        max-width: 100%; /* 宽度自适应 */
        height: auto; /* 让浏览器根据图片原始尺寸调整高度 */
        width: 100%;
    }

.roll-title p {
    font-size: 16px;
    line-height: 34px;
    color: #000;
    font-weight: 600
}


.roll {
    width: 100%;
    height: 500px;
    overflow: hidden;
    position: relative
}

.roll ul {
    position: absolute;
    top: 0;
    width: 100%;
}

.archive-simple {
    padding: 10px 0;
    height: 52px;
    border-bottom: 1px solid #eee;
    position: relative;
}

.archive-simple h2 {
    /* display: inline-block; */
    overflow: hidden;
    margin: 0;
    width: 45%;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: normal;
    font-size: 16px;
    line-height: 34px;
    float: left;
}

.archive-simple .area {
    position: absolute;
    font-size: 16px;
    line-height: 34px;
    left: 50%;
}

.archive-simple h2 a i {
    margin-right: 5px
}

.archive-simple p.post-meta {
    float: right;
    width: 15%;
    font-size: 16px;
    line-height: 34px;
}

.archive-simple span {
    margin-right: 5px
}

.archive-simple p.post-meta span a {
    margin-right: 0
}



p.you {
    font-size: 1.3em;
    line-height: 1.8em;
}

.service-para h4 {
    font-size: 2em;
    color: #9e82ae;
    padding: 1.3em 0 0.8em;
}

.service-name {
    padding: 0 2em 0 0;
}

.service-name:nth-child(2) {
    padding: 0 0em 0 0;
}

.service-name input[type="text"],
.service-name textarea {
    width: 100%;
    padding: 11px;
    outline: none;
    border: 1px solid #d9e3e7;
    -webkit-appearance: none;
    background: #f9f9f9;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
}

.service-name textarea {
    resize: none;
}

.service-name span {
    margin: 17px 0px;
    font-size: 1.1em;
    width: 100%;
    color: #838383;
    font-weight: 500;
    display: block;
}

.send input[type="submit"] {
    border: none;
    outline: none;
    color: #FFF;
    padding: 0.6em;
    font-size: 1.2em;
    font-weight: 500;
    -webkit-appearance: none;
    background: #47a1ce;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    width: 23%;
}

.send input[type="submit"]:hover {
    background: #755f83;
}

.send {
    padding: 1em 0 0;
}

.service-top {
    margin-top:50px;
    margin-bottom:0px;
}

.daohang {
    margin-top: 10px;
    margin-left: 30px;
    font-size: 16px;
    margin-bottom: 10px;
}

.daohangline {
    margin-left: 10px;
    margin-right: 10px;
    width: 100%;
    height: 3px;
    background-color: #e7e7e7;
}

/*--price--*/
.price-grid ul li {
    list-style: none;
}

.price-grid h5 {
    color: #1e6e98;
    font-size: 1.5em;
    padding: 0 0 0.7em;
}

.price-grid ul li span {
    font-size: 1em;
    color: #000;
    padding: 0.5em 0;
    display: block;
}

.price-grids {
    padding: 6em 0;
}

.price-grid p {
    color: #5f5f5f;
    font-size: 1em;
    line-height: 1.5em;
}

/*--404--*/
.four {
    text-align: center;
    padding: 8em 0 10em;
    min-height: 521px;
}

.four h2 {
    font-size: 4em;
    color: #1f6481;
}

.four h3 {
    font-size: 4em;
    color: #5f5f5f;
    padding: 0.7em 0;
}

/*----*/
.contact-head span {
    color: #777;
}

.contact-map iframe {
    min-height: 300px;
    width: 100%;
    border: none;
    margin: 1.5em 0 1em;
}

.contact-form-row {
    margin-bottom: 1em;
}

.contact-form-row div {
    width: 32.6%;
    float: left;
    margin-right: 1%;
}

.contact-form-row div span,
.contact-form-row2 span {
    font-size: 1.2em;
    color: #838383;
    font-weight: 700;
    display: block;
    padding: 0 0 0.5em;
}

.contact-form-row div input[type="text"] {
    width: 100%;
    padding: 1em;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border: 1px solid #EEE;
    -webkit-appearance: none;
    outline: none;
    color: #777;
    transition: border-color 0.4s;
    -webkit-transition: border-color 0.4s;
    -moz-transition: border-color 0.4s;
    -o-transition: border-color 0.4s;
    -ms-transition: border-color 0.4s;
    background: #f9f9f9;
}

.contact-form-row div input[type="text"]:hover,
.contact-form-row2 textarea:hover,
.service-name input[type="text"]:hover,
.service-name textarea:hover {
    border-color: #4fa7d1;
}

.contact-form-row div:nth-child(3) {
    margin-right: 0;
}

.contact-form-row2 textarea {
    width: 100%;
    padding: 1em;
    border: 1px solid #EEE;
    -webkit-appearance: none;
    outline: none;
    color: #777;
    min-height: 320px;
    resize: none;
    transition: border-color 0.4s;
    -webkit-transition: border-color 0.4s;
    -moz-transition: border-color 0.4s;
    -o-transition: border-color 0.4s;
    -ms-transition: border-color 0.4s;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    background: #f9f9f9;
}

.contact-form-row2 {
    margin-top: 1em;
}

.contact-form input[type="submit"] {
    background: #4fa7d1;
    color: #FFF;
    font-weight: 700;
    text-transform: uppercase;
    border: none;
    outline: none;
    margin-top: 1em;
    padding: 0.4em 2em;
    font-size: 1.5em;
    display: inline-block;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
    border-radius: 6px;
}

.contact-form input[type="submit"]:hover {
    background: #755f83;
}


/*--responsive--*/
@media(max-width:1440px) {}

@media(max-width:1366px) {}

@media(max-width:1280px) {}

@media(max-width:1024px) {
    /* .footer3 .menu-list {
        margin-right: 50px;
        margin-left: 50px
    } */

    .col-list li {
        width: 50% !important;
    }

    .footer2 .fl {
        margin-right: 50px !important
    }

    .row-list li .left-box {}

    .row-list li .right-box {
        width: 420px !important;
    }

    .row-list li .right-box p {
        text-overflow: ellipsis;
        /*锟斤拷些示锟斤拷锟斤拷锟斤拷要锟斤拷锟斤拷锟斤拷锟斤拷裕锟绞碉拷士锟绞★拷锟�*/
        display: -webkit-box;
        -webkit-line-clamp: 5;
        /*锟芥定锟斤拷锟斤拷锟斤拷锟叫的诧拷锟街截讹拷*/
        -webkit-box-orient: vertical;
        overflow: hidden;
        word-break: break-all;
        /*锟斤拷锟轿何地凤拷锟斤拷锟斤拷*/
    }

    .f-list li {
        width: 50% !important;
        float: left;
    }


    .header-nav-list {
        float: left !important;
        margin-left: 30px;
        margin-top: 2px
    }

    .header-content .header-nav-right {
        /* float: left !important; */
        margin-right: 80px !important
    }

    .slider-text {
        left: 30px !important;
    }


    .page2_01 {
        left: 0 !important;
    }

    .page3_01 {
        right: 0 !important;
    }

    .grid p {
        width: 100%;
        text-overflow: ellipsis;
        /*锟斤拷些示锟斤拷锟斤拷锟斤拷要锟斤拷锟斤拷锟斤拷锟斤拷裕锟绞碉拷士锟绞★拷锟�*/
        display: -webkit-box;
        -webkit-line-clamp: 2;
        /*锟芥定锟斤拷锟斤拷锟斤拷锟叫的诧拷锟街截讹拷*/
        -webkit-box-orient: vertical;
        overflow: hidden;
        word-break: break-all;
    }

    .header-nav-list ul li a {
        padding: 16px !important;
    }

    .page_footer .cen_box ul li {
        width: 200px !important;
        margin-right: 45px !important;
    }
}

@media(max-width:768px) {
    .archive-simple .area {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        width: 35% !important;
        display: block;
    }

    .grid h3 i {
        display: block !important;
    }

    body,
    html {
        width: 100%;
        height: 100%;
        overflow-x: hidden;
        overflow-y: auto;
    }

    .wrapBox .page1 .header {
        height: 65% !important;
    }

    .header-nav-list {
        display: none
    }

    .header-nav {
        height: 50px !important
    }

    .header-logo a img {
        width: 100px;
        height: auto !important;
        margin-top: 5px !important
    }

    .header-content {
        width: 100% !important;
        position: relative;
    }

    .slider-text {
        margin-top: 230px !important
    }

    .slider-text .banner-text1 {
        font-size: 24px !important;
        width: 300px !important;
        padding-left: 20px;
        padding-right: 20px;
        line-height: 30px !important
    }

    .slider-text .banner-text2 {
        font-size: 16px !important;
        width: 300px !important;
        padding-left: 20px;
        padding-right: 20px;
        line-height: 25px !important;
        margin-top: 10px !important
    }

    .banner-engine .banner-link-button {
        margin-top: 20px !important;
        margin-left: 20px !important
    }

    .grid {
        overflow: hidden;
        float: left;
    }

    .grid p {
        display: none
    }

    .grid a {
        width: 100%;
        margin-top: 10px;
        font-size: 12px !important;
        padding: 10px !important
    }

    .w960 {
        width: 100% !important;
    }

    .page2_01 {
        top: 50px !important;
        left: 50% !important;
        margin-left: -150px
    }

    .page2_02 {
        left: 50% !important;
        margin-left: -130px !important;
        top: 280px !important
    }

    .page3_01 {
        top: 50px !important;
        right: 50% !important;
        margin-right: -150px;
    }

    .page3_02 {
        left: 50% !important;
        margin-left: -130px !important;
        top: 280px !important
    }



    .bg_box {
        display: none
    }

    .tit_box {
        display: none
    }

    .footer2 {
        width: 100%;
        height: 100%;
        overflow: hidden !important;
    }

    .footer2 .fl {
        margin-right: 0px !important
    }

    .footer2 .fl.line {
        margin-top: 20px;
        width: 25%;
    }

    .footer2 .fl.line p {
        margin-top: 10px !important;
        padding-left: 0px !important;
    }

    #foot2 p {
        text-align: center;
        margin-top: 5px !important
    }

    #foot2 .fl.line p a {
        font-size: 14px !important
    }


    .fl.about {
        padding: 15px 30px !important;
        float: none !important;
        width: 50%;
    }

    #foot2 a {
        font-size: 12px !important
    }

    .footer2 h4 {
        text-align: center;
        font-size: 16px !important
    }

    #foot2 .about>p {
        font-size: 14px !important
    }

    #foot2 .fl h4 a {
        font-size: 14px !important
    }

    .fl-top .img-box {
        width: 148px !important;
        height: 148px !important;
        top: 32px;
        right: 15px !important;
        border-radius: 5px;
        overflow: hidden;
    }

    .footer2 .container>p {
        position: absolute;
        bottom: -90px;
        text-align: center
    }

    .footer2 .container>p:nth-of-type(2) {
        position: absolute;
        bottom: -120px;
        text-align: center;
        left: 50%;
        margin-left: -75px
    }

    .hide-header {
        display: block !important;
    }

    .header-nav-right {
        display: none
    }

    .ser-grid {
        display: none
    }

    .col-list li {
        width: 100% !important;
    }

    .row-list li {
        /* width: auto; */
        height: auto !important;
    }

    .row-list li .left-box,
    .row-list li .right-box {
        float: none !important;
        width: 100% !important;
    }

    .grid-service-content p>a>img {
        width: 100% !important;
    }

    #allmap {
        width: 100% !important;
        height: 400px !important;
        /* overflow: hidden;
        margin: 10px auto;
        font-family: "微锟斤拷锟脚猴拷"; */
    }

    .page2_02_btn,
    .page3_02_btn {
        margin-top: 5px !important
    }

    .banner-point {
        bottom: 15px !important
    }

    .roll-title>p:nth-of-type(3) {
        display: none
    }

    .roll-title>p:nth-of-type(2) {
        left: 65% !important
    }

    .post-meta {
        display: none
    }

    #roll_box {
        padding-left: 0 !important
    }

    #roll_box h2>a {
        font-size: 16px !important
    }

    .archive-simple .area {
        left: 65% !important;
    }

    .archive-simple h2 {
        width: 55% !important;
    }

    .list-box .img-box .list-box img {
        height: initial;
    }

    .list-box .img-box {
        height: initial !important;
    }

    .list-box img {
        height: initial !important;
    }

    .f-list li {
        width: 100% !important;
        /* float: left; */
    }

    .list-box {
        height: initial !important;
    }
}

@media(max-width:640px) {
    .item-right h1 {
        font-size: 1.8em;
    }

    .banner-matter {
        padding: 1em 1em;
    }

    .item-right p {
        margin: 0.5em 0 1em;
    }

    .item-right a {
        padding: 0.1em 0.5em;
    }

    .banner {
        min-height: 309px;
    }

    .content-grid h2 {
        font-size: 1.6em;
    }

    .banner-in {
        min-height: 143px;
        padding: 4em 0 0;
    }

    .banner-in h1 {
        font-size: 2.8em;
    }

    .grid-service h2 {
        font-size: 1.7em;
    }

    .four h2 {
        font-size: 3em;
    }

    /* .contact {
        padding: 3em 0;
    } */

    .content-bottom i {
        right: 43%;
    }
}

@media(max-width:480px) {

    .banner-matter,
    .banner-side,
    .banner-matter-in {
        float: none;
        width: 100%;
    }

    .banner-side {
        padding: 0;
    }

    .banner-matter {
        padding: 0em 0em 2em;
    }

    .content-grid p {
        margin: 1.5em 0 0;
        height: 104px;
        overflow: hidden;
    }

    .content-bottom h3 {
        font-size: 2.3em;
    }

    .content-bottom p {
        font-size: 1.5em;
    }

    .submit input[type="text"] {
        padding: 0.5em 1em;
    }

    .submit input[type="submit"] {
        padding: 0.4em 1em;
    }

    p.footer-class {
        padding: 2em 0 1em;
    }

    .footer-top {
        padding: 1em 0 3em;
    }

    .content-top {
        padding: 3em 0 1em;
    }

    .banner-in h1 {
        font-size: 2.2em;
        padding: 0 0 1em;
    }

    .banner-side {
        display: none;
    }

    .banner {
        min-height: 281px;
        padding: 3em 0;
    }

    .content-bottom i {
        right: 43%;
    }

    .side-banner {
        display: block;
    }

    .banner-in {
        min-height: 266px;
        padding: 3em 0 0;
    }

    .four h2 {
        font-size: 2.5em;
    }

    .four h3 {
        font-size: 3em;
    }

    .four {
        min-height: 431px;
    }

    .contact-form-row div {
        width: 100%;
        float: none;
        margin-right: 0%;
    }

    .contact-form-row2 textarea {
        min-height: 236px;
    }

    .contact-map iframe {
        min-height: 200px;
    }

    .contact-form-row div span,
    .contact-form-row2 span {
        padding: 0.5em 0 0.5em;
    }
}

@media(max-width:320px) {
    .logo img {
        width: 100%;
    }

    .logo {
        width: 65%;
    }

    .top-nav img {
        width: 90%;
    }

    .top-nav {
        margin-top: 1.3em;
    }

    .header {
        padding: 0.5em 0;
    }

    .item-right h1 {
        font-size: 1.5em;
    }

    .item-right span {
        font-size: 1.2em;
    }

    .item-bottom {
        padding: 0 0 2em;
    }

    .item-right a {
        padding: 0.3em 0.5em;
        font-size: 1em;
    }

    .item-right a i {
        width: 18px;
        height: 24px;
        background-size: 367px;
    }

    .item-bottom {
        padding: 0 0 1em;
    }

    .banner-matter {
        padding: 0;
    }

    .item-right p {
        height: 18px;
        font-size: 1em;
    }

    .banner {
        min-height: 181px;
        padding: 2em 0;
    }

    .grid {
        padding: 1em;
    }

    .grid p,
    .ser-grid p {
        font-size: 1em;
        line-height: 1.5em;
    }

    a.just-do,
    a.just-do-in {
        font-size: 1em;
    }

    .content-grid h2 {
        font-size: 1.3em;
    }

    .content-grid {
        padding: 1em 0 2em;
    }

    .content-grid p {
        margin: 0.5em 0 0;
    }

    .content-bottom h3 {
        font-size: 1.6em;
    }

    .content-bottom p {
        font-size: 1.3em;
    }

    .footer {
        padding: 1.5em 0 1em;
    }

    p.foot {
        font-size: 1.1em;
    }

    .submit input[type="submit"] {
        padding: 0.65em 0.6em;
        line-height: 1em;
        font-size: 1em;
        font-size: 1em;
    }

    .submit input[type="text"] {
        font-size: 1em;
    }

    p.footer-class {
        padding: 1em 0 1em;
        font-size: 1em;
    }

    .footer-top {
        padding: 1em 0 1em;
    }

    .content-top {
        padding: 2em 0 1em;
    }

    .content-bottom i {
        right: 38%;
    }

    .content-bottom {
        padding: 1.5em 0;
    }

    .banner-in h1 {
        font-size: 1.6em;
        padding: 0 0 0.5em;
    }

    .banner-in {
        min-height: 152px;
        padding: 2em 0 0;
    }

    .side {
        padding: 0 0.5em;
    }

    .service-top {
        padding: 2em 0;
    }

    ul.drop li a {
        padding: 0.6em;
        font-size: 1em;
    }

    .grid h3,
    .ser-grid h3 {
        font-size: 1em;
    }

    .ser-grid {
        padding: 1em;
        margin: 1.5em 0 0;
    }

    a.see {
        font-size: 1em;
    }

    .grid-service {
        padding: 1em 0 0;
    }

    .grid-service h2 {
        font-size: 1.3em;
    }

    .grid-service p {
        font-size: 1em;
        line-height: 1.5em;
        height: 64px;
        overflow: hidden;
        margin: 0.5em 0 0;
    }

    p.you {
        font-size: 1.1em;
        line-height: 1.5em;
        height: 50px;
        overflow: hidden;
        margin: 0.5em 0 0;
    }

    .service-para h4 {
        font-size: 1.5em;
    }

    .service-name span {
        margin: 7px 0px;
    }

    .send input[type="submit"] {
        padding: 0.5em;
        font-size: 1.1em;
        width: 32%;
    }

    .four h2 {
        font-size: 1.7em;
    }

    .four h3 {
        font-size: 2.5em;
        padding: 0.5em 0;
    }

    .four {
        padding: 6em 0 7em;
        min-height: 309px;
    }

    .price-grids {
        padding: 2em 0;
    }

    .price-grid h5 {
        width: 100%;
        font-size: 1.1em;
    }

    .price-grid ul li span {
        font-size: 0.77em;
    }

    p.on-to {
        display: none;
    }

    .price-grid p {
        height: 60px;
        overflow: hidden;
    }

    /* .contact {
        padding: 1em 0;
    } */

    .contact-form-row2 textarea {
        min-height: 136px;
    }

    .contact-map iframe {
        min-height: 100px;
    }

    .contact-form-row div input[type="text"] {
        padding: 0.7em;
    }

    .contact-form-row div span,
    .contact-form-row2 span {
        font-size: 1em;
    }

    .top-nav ul li a {
        font-size: 1em;
    }

    .contact-form input[type="submit"] {
        font-size: 1em;
    }
}

.list-box {
    width: 100%;
    height: 290px;
    overflow: hidden;
}

.list-box img {
    width: 100%;
    height: 190px;
    transition: all 0.5s;
}

.list-box .img-box {
    width: 100%;
    height: 190px;
    overflow: hidden;
    border: 2px solid gainsboro;
    position: relative;
}

.list-box .img-box div {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: all 0.5s
}

.list-box p {
    font-size: 18px;
    color: #000;
    margin-top: 5px;
    font-weight: 600;
}

.list-box span {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.f-list li:hover {
    cursor: pointer;
}

.f-list li:hover .list-box img {
    transform: scale(1.2);
}

.f-list li:hover .list-box .img-box div {
    opacity: 1;
}

.f-list li {
    margin-bottom: 20px;
    overflow: hidden;
}

.col-list {
    width: 100%;
    overflow: hidden;
}

.col-list li {
    width: 33.33%;
    float: left;
    padding: 0 10px;
    /* background: white */
    margin-bottom: 20px;
    position: relative;
    top: 150px;
    transition: all 0.5s
}

.col-list li .box-in {
    width: 100%;
    /* height: 470px; */
    background: white;
    border-radius: 5px;
    padding: 10px;
    padding-bottom: 20px
}

    .col-list li .box-in h4 {
        color: #2567fc;
        font-weight: 600;
        padding-left: 10px;
        font-size: 20px;
        margin-bottom: 10px
    }

.col-list li .box-in p {
    /* color: #0078BE;
	font-weight: 600; */
    font-size: 14px;
    margin-top: 5px;
    padding-left: 10px;
}

.col-list li .box-in .btn-box {
    height: 60px;
    width: 100%;
    margin-top: 20px
}


.col-list li .box-in .btn-box .b-fl {
    float: left;
    height: 60px;
    width: 50%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-flex-direction: column;
    flex-direction: column;
}

.col-list li .box-in .btn-box .b-fl>a {
    text-decoration: underline;
    margin-left: 25px;
    font-size: 16px;
    margin-bottom: 3px
}

.col-list li .box-in .btn-box .b-fl>a:hover {
    color: #1EC67A
}

    .col-list li .box-in button {
        margin-left: 10px;
        /* margin-top: 20px; */
        width: 130px;
        height: 46px;
        border-radius: 20px;
        border: none;
        background: #2567fc;
        line-height: 46px
    }



.col-list li .box-in button a {
    color: white;
    font-size: 16px
}


.col-list li .img-box {
    width: 100%;
    height: 0px !important;
    padding-bottom: 83% !important;
    overflow: hidden;
}

.col-list li :hover .img-box img {
    transform: scale(1.2);
}

.col-list li .img-box img {
    width: 100%;
    height: auto !important;
    transition: all 0.5s;
}

.row-list {
    width: 100%;
}

.row-list a:link {
    color: #616161
}

.row-list li {
    width: 100%;
    height: 200px;
    border: 1px solid gainsboro;
    margin-bottom: 20px;
    overflow: hidden;
    position: relative;
    top: 150px;
    transition: all 0.5s
}

.row-list li:hover .left-box img {
    transform: scale(1.2);
}

.row-list li:hover .left-box .wrap {
    opacity: 1;
}


.row-list li:hover a {
    color: #616161 !important
}

.row-list li:hover p {
    color: #616161 !important
}

.row-list li .left-box,
.row-list li .right-box {
    float: left;
}

.row-list li .left-box {
    width: 280px;
    height: 100%;
    overflow: hidden;
    /* background: gray */
    position: relative;
}

.row-list li .left-box img {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
}

.row-list li .left-box .wrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    transition: all 0.5s;
    opacity: 0;
    z-index: 1;
}

.row-list li .right-box {
    width: 540px;
    height: 100%;
    /* background: greenyellow; */
    padding: 20px;
}

.row-list li .right-box h4 {
    width: 100%;
    font-weight: 600;
    color: #000;
    font-size: 22px
}

.row-list li .right-box p {
    width: 100%;
    margin-top: 20px;
    font-size: 16px;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}


.col-list {
    width: 100%;
    overflow: hidden;
}

.col-list li {
    width: 33.33%;
    float: left;
    padding: 0 10px;
    /* background: white */
    margin-bottom: 20px;
    position: relative;
    top: 150px;
    transition: all 0.5s
}

.col-list li .box-in {
    width: 100%;
    height: 480px;
    background: white;
    border-radius: 5px;
    padding: 10px;
    padding-bottom: 20px
}

    .col-list li .box-in h4 {
        color: #2567fc;
        font-weight: 600;
        padding-left: 10px;
        font-size: 20px;
        margin-bottom: 10px
    }

.col-list li .box-in p {
    /* color: #0078BE;
	font-weight: 600; */
    font-size: 14px;
    margin-top: 5px;
    padding-left: 10px;
}


.col-list li .box-in button a {
    color: white;
    font-size: 16px
}

.col-list li .box-in>a:hover {
    color: #666 !important
}

.col-list li .img-box {
    width: 100%;
    height: 180px;
    overflow: hidden;
}

.col-list li :hover .img-box img {
    transform: scale(1.2);
}

.col-list li .img-box img {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
}

.wrapBox .header {
    padding: 0;
    height: 72% !important;
}

.wrapBox .banner-engine {
    height: 88% !important;
    position: relative;
    overflow: hidden;
}

.wrapBox .banner-ul {
    width: 100% !important;
    height: 100% !important;
}

.w960 img {
    max-height: 400px !important
}

.footer {
    position: relative !important;
    padding-top: 60px;
    height: 160px;
}



.page_footer .footer {
    position: absolute !important;
    padding-top: 0;
    height: 180px;
}

.page_footer .footer-class>img:nth-of-type(1) {
    width: 100px !important;
    height: 100px !important;
}

.page_footer .footer2 {
    position: absolute !important;
    bottom: 0;
    width: 100%;
    z-index: 2;
}

.footer2 {
    position: relative;
    padding: 10px;
    padding-bottom: 20px;
    /* background: rgb(69,69,69); */
    /* background: rgb(36, 33, 33) */
    background: #333
}

.footer2 p {
    font-size: 16px !important;
    margin-top: 18px !important;
    font-family: "Helvetica Neue" !important;
    color: white !important;
    box-sizing: content-box !important
}

.footer2 a {
    color: white;
    box-sizing: content-box !important;
    font: 14px "Helvetica Neue" !important;
}

.footer2 .fl-top {
    width: 100%;
    height: 225px;
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 40px
}

.footer2 .container {
    position: relative;
}

.footer2 .container>p {
    text-align: center
}

.footer2 h4 {
    font-size: 18px !important;
    font-family: "Helvetica Neue" !important;
}

.footer2 .fl {
    float: left;
    margin-right: 100px
}


.footer2 a:hover {
    color: rgb(40, 137, 178) !important
}


.line p {
    padding-left: 10px;
    position: relative;
}

.line p::before {
    width: 8px;
    height: 1px;
    background: white;
    position: absolute;
    content: '';
    top: 50%;
    left: 0;
    margin-top: -1px
}

.fl-top .img-box {
    width: 150px;
    height: 150px;
    position: absolute;
    right: 0;
}

.fl-top .img-box img {
    width: 100%;
    height: 100%;
}

.fl.about {
    border: 1px solid rgb(102, 99, 99);
    padding: 15px;
    border-radius: 5px;
}

.footer2 .fl h4 {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: white;
}

.footer2 .fl h4 a {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: white;
}

.footer2 .container>p a {
    text-decoration: underline
}

.searchTxt {
    width: 200px;
    float: right;
    padding: 3px;
    outline: none;
    border: 1px solid #d9e3e7;
    -webkit-appearance: none;
    background: #f9f9f9;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
}

.searchTxt:hover {
    border-color: #4fa7d1;
}

.searchTxtLink {
    color: #fff;
    margin-left: 10px;
    height: 32px;
    text-decoration: none;
    font-size: 1.2em;
    font-weight: 600;
    background: #4fa7d1;
    padding: 0.2em 1em;
    display: inline-block;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    float: right;
}

.searchTxtLink:hover {
    text-decoration: none;
}


.hide-header {
    position: absolute;
    right: 20px;
    top: 12px;
    width: 30px;
    height: 50px;
    display: none
        /* background: rebeccapurple */
}

.hide-header p {
    width: 100%;
    height: 3px;
    background: #666;
    margin-bottom: 8px;
}

.hide-list {
    /* width: 100px; */
    /* height: 200px; */
    padding: 20px 50px;
    background: rgb(49, 47, 47);
    position: absolute;
    right: -100%;
    top: 0;
    z-index: 100;
    /* box-shadow:0 2px 12px 0 rgba(0, 0, 0, 0.1) */
}

.hide-list li {
    font-size: 16px;
    color: white;
    margin-bottom: 10px;
    text-align: center
        /* font-weight: 600 */
}

.hide-list li a {
    color: white
}

#allmap {
    width: 800px;
    height: 800px;
    overflow: hidden;
    margin: 10px auto;
    font-family: "微锟斤拷锟脚猴拷";
}

.fl.about p:nth-of-type(4) {
    font-size: 14px !important;
}

.footer3 {
    height: 360px;
    width: 100%;
    padding-top: 40px;
    background: #131A31;
    position: relative;
}

.footer3 .menu-list {
    float: left;
    /* width: 66px; */
    margin-right: 120px;
    margin-left: 30px
}

.footer3 h4 {
    font-size: 14px;
    color: white;
    font-weight: bold;
    margin-bottom: 16px
}

.footer3 .menu-list a {
    font-size: 14px;
    color: white;
    font-weight: 500;
    margin-bottom: 16px;
    display: block
}

.footer3 .menu-list h4 a {
    font-size: 14px;
    color: white;
    font-weight: bold;
    margin-bottom: 16px
}
.center-container {
    width: 1220px;
    position: relative;
    margin: 0 auto;
}


.footer3 a:hover {
    color: white
}

.footer3 .menu-list-w p {
    font-size: 14px;
    color: white;
    font-weight: 500;
    margin-bottom: 16px;
}

.footer {
    padding: 40px 20px;
    border-top: 1px dashed #555; /* 顶部虚线 */
    border-bottom: 1px solid #2d3c5a; /* 底部实线 */
}

.footer-container {
    max-width: 1360px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    gap: 5px;
    flex-wrap: wrap;
}

.footer-column1 {
    flex-basis: 230px;
    min-width: 220px;
}

.footer-column2 {
    flex-basis: 280px;
    min-width: 220px;
}

/* Logo 区域 */
.logo-section {
    margin-bottom: 20px;
}

    .logo-section img {
        width: 180px;
        height: auto;
        /* 占位图，实际请替换为你的 logo 图片路径 */
        display: block;
        box-sizing: content-box;
    }

.footer-column1 h3 {
    font-size: 18px;
    margin-bottom: 15px;
    position: relative;
    padding-bottom: 8px;
    font-weight: normal;
}

    .footer-column1 h3::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 16px;
        height: 4px;
        background-color: #f59e0b; /* 橙黄下划线 */
    }

.footer-column1 p {
    margin-bottom: 8px;
    font-size: 14px;
    color: white;
    opacity: 0.6;
}
.footer-column1 p a:hover {
    background: #44BCEF;
}

.footer-column2 h3 {
    font-size: 18px;
    margin-bottom: 15px;
    position: relative;
    padding-bottom: 8px;
    font-weight:normal;
}

    .footer-column2 h3::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 16px;
        height: 4px;
        background-color: #f59e0b; /* 橙黄下划线 */
    }

.footer-column2 p a:hover {
    background: #44BCEF;
}

.footer-column2 p {
    margin-bottom: 8px;
    font-size: 14px;
    color: white;
    opacity: 0.6;
}

/* “关注我们”部分 */
.social-media {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
    width:200px;
}

.social-item {
    text-align: center;
}

    .social-item img {
        width: 90px;
        height: 90px;
        background-color: #ffffff; /* 白色占位图 */
        margin-bottom: 5px;
    }

    .social-item span {
        font-size: 14px;
        display: block;
        color: #ffffff;
    }

/* “沐小娱SaaS系统” 双列布局 */
.saas-system-columns {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.saas-column {
    flex: 1;
}

/* “联系我们”部分 */
.contact-info {
    margin-top: 15px;
}

    .contact-info p {
        margin-bottom: 8px;
    }

    .contact-info .phone-tel {
        font-size: 24px;
        font-weight: bold;
        color: #f59e0b; /* 橙黄电话号码 */
    }

/* 版权信息 */
.copyright {
    text-align: center;
    padding: 20px 0;
    font-size: 14px;
    color: #94a3b8; /* 浅灰文字 */
}

.menu-list-w {
    /* width: 175px; */
    float: left;
    margin-right: 96px
}

.img-in-box {
    width: 200px;
    float: left;
}

.img-in-box img {
    width: 90px;
    height: 90px;
}

.img-in-box .fl {
    float: left;
}

.img-in-box h5 {
    color: white;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    padding-top: 3px
}

.footer-btm {
    width: 100%;
    height: 50px;
    border-top: 1px solid #575757;
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: center;
    line-height: 50px;
    opacity:0.8;
}

.footer-btm p {
    font-size: 14px;
    color: white;
    display: inline-block;
}

@media(max-width:800px) {
    .footer3 {
        width: 100%;
        height: initial;
        overflow: hidden;
        padding-top: 30px
    }

    .footer-btm {
        position: relative;
        float: left;
        margin-top: 20px
    }

    .img-in-box {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .img-in-box .fl {
        float: none;
    }

    .menu-list-w {
        margin-top: 10px;
        margin-left: 20px !important;
    }

    .footer-btm p {
        margin-right: 0 !important;
    }

    .footer3 .menu-list {
        margin-right: 20px !important;
        margin-left: 20px !important;
    }

    .footer-btm{
        height: initial;
    }


}

@media(max-width:1280px) {
    .footer3 .menu-list {
        margin-right: 50px;
        margin-left: 50px
    }

    .menu-list-w {
        margin-left: 50px
    }

    .col-list li {
        width: 50%;
    }
    .col-list li .box-in{
        height: inherit;
    }

    .row-list li .right-box {
        width: 420px !important;
    }

    .center-container,
    #certify {
        width: 100% !important;
    }

    .header-nav-list {
        margin-left: 70px !important;
    }
}

.down-a-btn {
    margin: 0;
    display: block;
    text-decoration: underline;
    font-size: 16px;
    margin-left: 10px !important;
    width: 130px;
    height: 46px;
    border-radius: 20px;
    border: none;
    background: #2567fc;
    line-height: 46px;
    color: white;
    text-align: center
}