@charset "UTF-8";

html {
    scroll-behavior: smooth;
}

* {
    box-sizing: border-box;
}

body {
    background-color: #fff;
    margin: 0;
}
a:link{
    text-decoration: none;
}
a:visited{
    text-decoration: none;
}
a:active{
    text-decoration: none;
}
a:hover{
    text-decoration: none;
}

@media only screen and (max-width: 575px) {
    html {
        font-size: 8px !important;
    }
    .d-xs-block{
        display: block;
    }
    .d-xs-none{
        display: none;
    }
}

@media only screen and (min-width: 576px) {
    html {
        font-size: 8px !important;
    }
    .d-xs-block{
        display: block;
    }
    .d-xs-none{
        display: none;
    }
}

@media only screen and (min-width: 768px) {
    html {
        font-size: 8px !important;
    }
    .d-sm-block{
        display: block;
    }
    .d-sm-none{
        display: none;
    }
}

@media only screen and (min-width: 992px) {
    html {
        font-size: 10px !important;
    }
    .d-md-block{
        display: block;
    }
    .d-md-none{
        display: none;
    }
}

@media only screen and (min-width: 1200px) {
    html {
        font-size: 10px !important;
    }
    .d-lg-block{
        display: block;
    }
    .d-lg-none{
        display: none;
    }
}


h2,
h3,
h4 {
    text-align: center;
}

h1 {
    text-indent: -999px;
    float: left;
    margin: 0;
    font-size: 1.2rem;
}

li {
    list-style-type: none;
}

.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
    /* padding-right: 0;
    padding-left: 0; */
}

.container-fluid {
    padding-right: 0;
    padding-left: 0;
}

.row {
    margin-left: 0;
    margin-right: 0;
}

/*reset css*/
.navbar .navbar-header .logo .logoimg {
    width: 17rem;
}

a:hover {
    text-decoration: none;
}


.banner_img>img {
    height: 50rem !important;
}


.header .navbar {
    border-width: 0rem !important;
}

@media only screen and (max-width: 767px) {
    .header {
        height: 8rem;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 9999;
        background: #fff;
        box-shadow: 0 0.2rem 1rem 0 rgba(0, 0, 0, 0.1);
    }

    .header .navbar-header .logo {
        height: 8rem;
        line-height: 8rem;
        margin-left: 1rem;
    }

    .header .navbar {
        height: 8rem;
        position: relative;
    }

    .header .navbar .container {
        padding-left: 0;
        padding-right: 0;
    }

    .header .navbar .navbar-header {
        height: 8rem;
        /* position: fixed; */
        left: 0;
        top: 0;
        background-color: #fff;
        box-shadow: 0 0.2rem 1rem 0 rgba(0, 0, 0, 0.1);
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }

    .header .navbar .navbar-collapse {
        position: fixed;
        width: 100%;
        top: 8rem;
    }

    .container>.navbar-collapse {
        margin-right: 0;
        margin-left: 0;
    }


    .navbar-header .navbar-toggle {
        border: 0.1rem solid #ccc;
    }

    .navbar-header .navbar-toggle .icon-bar {
        background-color: #333;
    }

    .navbar-collapse {
        background: #fff;
    }

    .carousel-inner>.item>img,
    .carousel-inner>.item>a>img {
        line-height: 1;
        width: 100%;
        /* height: 42rem; */
        object-fit: cover;
    }

    .header .navbar .nav li a {
        padding-top: 0;
        padding-bottom: 0;
        height: 5rem;
        line-height: 5rem;
        color: #081624;
        font-weight: bold;
    }

    .header .navbar .nav li .active {
        background: transparent;
        color: #3884c0;
    }

    .header .navbar .nav li a:hover {
        background: transparent;
        color: #3884c0;
    }

    .header .navbar .nav .active::after {
        display: inline-block;
        content: '';
        position: absolute;
        bottom: 0rem;
        left: 5%;
        height: 0.2rem;
        width: 90%;
        background-color: #0F5094;
    }

    .header .navbar .nav li a:hover {
        background: transparent;
        color: #3884c0;
    }

    .header .navbar .nav li a:hover::after {
        display: inline-block;
        content: '';
        position: absolute;
        bottom: 0rem;
        left: 5%;
        height: 0.2rem;
        width: 90%;
        background-color: #0F5094;
    }

    #bs-example-navbar-collapse-1 {
        height: 42rem !important;
        box-shadow: 0 0.2rem 1rem 0 rgba(0, 0, 0, 0.2);
    }

    .header .navbar .wrap-contact {
        margin-top: 42rem;
    }

    .carousel {
        margin-top: 8rem;
    }
}


@media only screen and (min-width: 768px) {
    .header {
        height: 8rem;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 9999;
        background: #fff;
        box-shadow: 0 0.2rem 1rem 0 rgba(0, 0, 0, 0.1);
    }

    .header .navbar-header .logo {
        height: 8rem;
        line-height: 8rem;
    }

    .header .navbar .nav li a {
        padding-top: 0;
        padding-bottom: 0;
        height: 8rem;
        line-height: 8rem;
        color: #081624;
        font-size: 1.6rem;
    }

    .header .navbar .nav li .active {
        background: transparent;
        color: #3884c0;
    }

    .header .navbar .nav li a:hover {
        background: transparent;
        color: #3884c0;
    }

    .header .navbar .nav .active::after {
        display: inline-block;
        content: '';
        position: absolute;
        bottom: 1rem;
        left: 5%;
        height: 0.2rem;
        width: 90%;
        background-color: #0F5094;
    }

    .header .navbar .nav a:hover::after {
        display: inline-block;
        content: '';
        position: absolute;
        bottom: 1rem;
        left: 5%;
        height: 0.2rem;
        width: 90%;
        background-color: #0F5094;
    }

    .header .navbar .nav li a:hover {
        background: transparent;
        color: #3884c0;
    }

    .header .navbar .nav li a:hover::after {
        display: inline-block;
        content: '';
        position: absolute;
        bottom: 1rem;
        left: 5%;
        height: 0.2rem;
        width: 90%;
        background-color: #0F5094;
    }

    .header .navbar .nav li.scheme {
        position: relative;
    }

    ul#sub-nav-scheme {
        overflow: hidden;
        position: absolute;

        height: 0;
        width: 26rem;
        font-size: 1.4rem;
        transition: all 0.5s;
        -webkit-transition: all 0.5s;
        background: #fff;
        box-shadow: rgba(0, 0, 0, 0.1) 0rem 0.2rem 1rem 0rem;
        padding: 0 1rem;
    }

    ul#sub-nav-scheme a {
        line-height: 4rem;
        font-size: 1.4rem;
        list-style: none;
    }

    ul#sub-nav-scheme a:hover::after {
        display: none;
    }

    ul#sub-nav-scheme li {
        list-style-type: none;
        line-height: 4rem;
    }

    .header .navbar .nav li.scheme:hover ul#sub-nav-scheme {
        height: 20rem;
    }

    .header .wrap-contact {
        position: absolute;
        top: 0;
        right: 0;
    }

    .header .navbar .wrap-contact .search a {
        height: 8rem;
        line-height: 8rem;
        text-align: center;
        color: #434343;
        font-size: 1.4rem;
        font-weight: 100;
        border-left: 0.1rem solid #f9f6f6;
        border-right: 0.1rem solid #f9f6f6;
        padding: 0 4rem;
    }

    .header .navbar .wrap-contact .search a:hover::after {
        display: none;
    }

    .header .navbar .wrap-contact .contact a {
        height: 8rem;
        line-height: 8rem;
        text-align: center;
        color: #081624;
        font-size: 1.4rem;
        font-weight: 500;
        padding: 0 4rem;
    }

    .header .navbar .wrap-contact .contact a:hover::after {
        display: none;
    }

    .header .navbar .wrap-contact li.server  {
        height: 8rem;
        line-height: 8rem;
        text-align: center;
        width: 10rem;
        color: #fff;
        background: #1097c6;
        font-size: 1.4rem;
        font-weight: 500;
        overflow: hidden;
        transition:all 0.3s;
        -webkit-transition: all 0.3s;
    }
    .header .navbar .wrap-contact li.server .telnum{
        font-size: 3rem;
        display: none;
        transition:all 0.3s;
        -webkit-transition: all 0.3s;
    }
    .header .navbar .wrap-contact li.server .iconfont{
        font-size: 3rem;
    }

    .header .navbar .wrap-contact .server:hover{
        overflow: hidden;
        width: 28rem;
        transition:all 0.3s;
        -webkit-transition: all 0.3s;
    }

    .header .navbar .wrap-contact .server:hover .telnum{
        display: inline;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
    }

    .carousel-inner>.item>img,
    .carousel-inner>.item>a>img {
        line-height: 1;
        width: 100%;
        height: 76rem;
        object-fit: cover;
    }
}

@media only screen and (min-width: 768px) and (max-width:991px) {
    .header .navbar .wrap-contact .search a {
        padding: 0 3rem;
    }

    .header .navbar .wrap-contact .search a:hover {
        padding: 0 3rem;
    }

    .header .navbar .wrap-contact .contact a {
        padding: 0 2rem;
    }

    .header .navbar .wrap-contact .contact a:hover {
        padding: 0 2rem;
    }

    .header .navbar .wrap-contact .server a {
        padding: 0 2rem;
    }

    .header .navbar .wrap-contact .server a:hover {
        padding: 0 2rem;
    }

    .nav>li>a {
        padding: 1rem;
    }
}

@media only screen and (min-width: 992px) {
    #bs-example-navbar-collapse-1 {
        text-align: center;
    }

    #bs-example-navbar-collapse-1 .navbar {
        display: inline-block;
        margin-right: 32rem;
        float: none;
    }

    #sub-nav-scheme li {
        text-align: left;
    }

}
.domain{
    background: #F0F6F7;
    padding-bottom: 6rem;
}

.domain .item {
    margin-top: 6rem;
}

.domain .img {
    width: 100%;
    height: 48rem;
    object-fit: cover;
}

.domain .right-half {
    max-width: 59rem;
    margin-left: 6rem;
    margin-right: 2rem;
}

.domain .left-half {
    max-width: 59rem;
    width: 42rem;
    float: right;
    margin-right: 6rem;
    margin-left: 2rem;
}

.domain .title {
    font-size: 3.2rem;
    font-weight: bold;
    color: #1097c6;
    line-height: 7.4rem;
    border-bottom: 0.1rem solid #B9C4CF;
    text-align: left;
}

.domain .content {
    color: #212529;
    font-size: 1.6rem;
    line-height: 3.8rem;
}

@media only screen and (max-width: 575px) {
    /* .domain {
        margin-top: 2rem;
    } */

    .domain .item {
        margin-top: 2rem;
    }

    .domain .img {
        width: 100%;
        height: 30rem;
        object-fit: cover;
    }

    .domain .right-half {
        max-width: 100%;
        margin: 2rem;
    }

    .domain .left-half {
        max-width: 100%;
        margin: 2rem;
    }
}

.cases {
    padding-top: 6rem;
    padding-bottom: 6rem;
    /* background: #F0F6F7; */
}

.cases .title a {
    color: #212529;
    font-size: 4rem;
}

.cases .sub-title {
    margin-top: 0;
    margin-bottom: 3rem;
}

.cases .sub-title a {
    color: #718090;
    font-size: 1.8rem;
}

.cases img {
    width: 100%;
    height: 16.6rem;
    object-fit: cover;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
}

.cases .item {
    padding: 0.5rem;
    position: relative;
}

.cases .item:hover img {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.cases .item .text {
    width: 100%;
    position: absolute;
    bottom: 2rem;
    left: 0;
    padding-left: 2rem;
    padding-right: 1rem;
    color: #fff;
    font-size: 1.6rem;
}

.cases .getMore {
    text-align: center;
}

.cases .getMore .more {
    margin-top: 4rem;
    padding-left: 4rem;
    padding-right: 4rem;
    display: inline-block;
    height: 4.8rem;
    line-height: 4.8rem;
    border: 0.1rem solid #1097c6;
    border-radius: 2.4rem;
    color: #1097c6;
}

.cases .getMore .more:hover {
    cursor: pointer;
    background: #1097c6;
    color: #fff;
}


.product {
    padding-top: 8rem;
    padding-bottom: 8rem;
    background: url('../img/index/bg.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.product .video{
    box-shadow: 0 0.2rem 1rem 0 rgba(0, 0, 0, 0.5);
    width: 90%;
    height: 100%;
    margin-left: 5%;

}

.news {
    margin-top: 6rem;
}

.news .title a {
    color: #212529;
    font-size: 4rem;
}

.news .sub-title {
    margin-bottom: 4rem;
}

.news .sub-title a {
    color: #212529;
    font-size: 1.8rem;
    margin-left: 1rem;
    margin-right: 1rem;
    padding-bottom: 0.4rem;
}

.news .sub-title .active {
    color: #1097c6;
    font-size: 1.8rem;
    border-bottom: 0.3rem solid #1097c6;
}

.news .sub-title a:hover {
    cursor: pointer;
    color: #1097c6;
    font-size: 1.8rem;
    border-bottom: 0.3rem solid #1097c6;
}

.news .news-item {
    padding-left: 1rem;
    padding-right: 1rem;
}

.news .item {
    background: #FFFFFF;
    box-shadow: 0rem 0rem 1.2rem 0rem rgba(0, 0, 0, 0.05);
    height: 60rem;
    margin-top: 1rem;
    position: relative;
}

.news .item:hover a img {
    transform: translate(0, -1rem);
    -webkit-transform: translate(0, -1rem);
}

.news .item .intro {
    margin: 2rem;
}

.news .item .intro .news-title a {
    height: 4.8rem;
    /* color: #1097c6; */
    color: #212529;
    font-size: 2rem;
    line-height: 2.4rem;
    overflow: hidden;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    /* 设置最大显示行数 */
    box-orient: vertical;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}

.news .item:hover .intro .news-title a {
    color: #fff;
}

.news .item .intro .news-content {
    color: #7F7F7F; /* 设置文本颜色 */
    font-size: 1.6rem; /* 设置字体大小 */
    line-height: 3rem; /* 设置行高 */
    overflow: hidden; /* 隐藏溢出的内容 */
    display: -webkit-box; /* 使用弹性盒子模型 */
    -webkit-line-clamp: 4; /* 设置最大显示行数为4行 */
    -webkit-box-orient: vertical; /* 垂直排列子元素 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
}


.news .item:hover {
    background-color: #1097c6;
}

.news .item:hover .intro .news-content {
    color: #fff;
}

.news .item .intro .more {
    position: absolute;
    left: 2rem;
    bottom: 1rem;
}

.news .item .intro .more a {
    color: #1097c6;
    font-size: 1.6rem;
}

.news .item:hover .intro .more a {
    color: #fff;
}

.news .news-more {
    width: 17.8rem;
    height: 4.8rem;
    line-height: 4.8rem;
    border: 0.1rem solid #1097c6;
    border-radius: 2.4rem;
    font-size: 1.6rem;
    font-weight: 400;
    color: #1097c6;
    margin: 6rem auto;
}
.news .news-more a{
    display: inline-block;
    width: 100%;
    height: 100%;
}

.news .news-more:hover {
    background-color: #1097c6;
}

.news .news-more:hover a {
    color: #fff;
}

.info .img {
    margin: 6rem auto 1rem;
    width: 17.8rem;
    height: 17.8rem;
    background: #FFFFFF;
    border: 0.1rem solid #BBD5FF;
}

.info .img img {
    width: 100%;
    height: 100%;
}

.info .text {
    text-align: center;
    font-size: 1.8rem;
    color: #1097c6;
    margin: 1rem;
}

.info .phone {
    color: #333333;
    font-size: 2rem;
    text-align: center;
    margin: 1rem;
}

.info .phone a {
    color: #1097c6;
}

.info .phone .fa {
    color: #1097c6;
}

.info .address {
    color: #333333;
    font-size: 2rem;
    text-align: center;
    margin: 1rem;
}

.footer {
    padding: 1.8rem;
    background: #03031B;
    color: #fff;
    text-align: center;
    margin-top: 3rem;
}

.footer p {
    margin: 0;
}

.footer a {
    color: #fff;
}

@media only screen and (max-width: 575px) {
    .news .item {
        height: 58rem;
    }

    .news .item a img {
        width: 100%;
        height: 24rem;
        object-fit: cover;
        transition: All 0.4s;
        -webkit-transition: All 0.4s;
    }
}

@media only screen and (min-width: 576px) {
    .news .item a img {
        width: 100%;
        height: 24rem;
        object-fit: cover;
        transition: All 0.4s;
        -webkit-transition: All 0.4s;
    }
}

@media only screen and (min-width: 768px) {
    .news .item {
        height: 58rem;
    }

    .news .item a img {
        width: 100%;
        height: 26rem;
        object-fit: cover;
        transition: All 0.4s;
        -webkit-transition: All 0.4s;
    }
}

@media only screen and (min-width: 992px) {
    .news .item {
        height: 58rem;
    }

    .news .news-item {
        padding-left: 0.4rem;
        padding-right: 0.4rem;
    }

    .news .item a img {
        width: 100%;
        height: 18rem;
        object-fit: cover;
        transition: All 0.4s;
        -webkit-transition: All 0.4s;
    }
}

@media only screen and (min-width: 1200px) {
    .news .item {
        height: 50rem;
    }

    .news .news-item {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .news .item a img {
        width: 100%;
        height: 20rem;
        object-fit: cover;
        transition: All 0.4s;
        -webkit-transition: All 0.4s;
    }
}
.container {
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
  }
  #backToTop {
    display: none;
    position: fixed;
    bottom: 40px;
    right: 30px;
    z-index: 999;
    width: 50px;
    height: 50px;
    border: none;
    background: transparent;
    cursor: pointer;
    opacity: 0.8;
    transition: all 0.3s ease;
  }
  
  .top-icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
  }
  
  /* 移动端适配 */
  @media (max-width: 768px) {
    #backToTop {
      bottom: 20px;
      right: 15px;
      width: 40px;
      height: 40px;
    }
  }
  
  /* 悬停状态 */
  #backToTop:hover {
    opacity: 1;
    transform: translateY(-3px);
  }
  
  /* 点击状态 */
  #backToTop.active .top-icon {
    content: url("img/aboutus/2.png");
  }
  #topIcon {
    transition: opacity 0.3s ease;
  }
  
  /* 点击时的闪烁效果 */
  #backToTop:active #topIcon {
    opacity: 0.8;
    transform: scale(0.95);
  }
@media only screen and (max-width: 767px) {
    .header .navbar .nav li a {
        padding-top: 0;
        padding-bottom: 0;
        height: 5rem;
        line-height: 4rem;
        color: #081624;
        font-weight: bold;
    }
  }
  .phone-center {
    display: flex;
    justify-content: center;  /* 水平居中 */
    align-items: center;       /* 垂直居中 */
    min-height: 100px;         /* 按需调整容器高度 */
  }
  
  .content-wrapper {
    text-align: center;        /* 内部文本居中 */
  }
  
  .phone-line {
    font-size: 2rem;
    margin: 8px 0;             /* 行间距控制 */
    display: inline-block;     /* 保持内容整体性 */
  }
  
  .nowrap {
    white-space: nowrap;       /* 强制不换行 */
    display: inline-block;     /* 配合nowrap使用 */
  }
  
  /* 图标与文字间距调整 */
  .icon-telephone {
    margin-right: 5px;
  }

  /* 移动端适配 */
  @media (max-width: 768px) {
    .phone-center {
      padding: 10px;
    }
    .phone-line {
      display: block;          /* 小屏幕下强制换行 */
    }
  }
  .sub-nav{
    padding-left: 25%;
  }