@import url(./layout.css);

/* ==========================================================================
   common part
========================================================================== */
.pic {
    overflow: hidden;
    position: relative;
    height: auto;
}

.bgimg {
    width: 100%;
}

.upimg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transition: all .5s;
}

.pic:hover .upimg {
    transform: scale(1.05);
}

/* 没有放大效果 */
.upimg2 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/* 居中对齐 */
.upimg3 {
    position: absolute;
    left: 50%;
    top: 50%;
    max-width: 100%;
    max-height: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transition: all .5s;
}

.pic:hover .upimg3 {
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/* 缩小放大 */
.upimg4 {
    position: absolute;
    left: 50%;
    top: 50%;
    max-width: 100%;
    max-height: 100%;
    -webkit-transform: translate(-50%, -50%) scale(0.93);
    transform: translate(-50%, -50%) scale(0.93);
    transition: all .5s;
}

.pic:hover .upimg4 {
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
}

.container img {
    max-width: 100%;
}





.banner{width: calc(100% - 3.6rem);position: relative;margin: 0 1.8rem; margin-top:var(--global-header-height); }
.banner .swiper-pagination-bullet{width:30px;border-radius:4px;background:#fff;opacity:.2;}
.banner .swiper-pagination-bullet-active{background:#fff;opacity:1;}








/* ==========================================================================
   hmdpart01
   ========================================================================== */

.homepart01{width: 100%; padding:1.6rem 0;background: url(../images/aboutbg.jpg) no-repeat left top;background-size: cover;}

.about_con{position: relative;}

.about_left{width:48%;position: relative;}
.about_left .pic{position: relative;z-index: 2; border-radius:8px; overflow: hidden;}

.aboutrig{width:45%;}
.aboutrig .tit{font-size: .28rem; font-weight:500; color:var(--primary); position: relative;padding-bottom: .2rem;}
.aboutrig .tit02{font-size: .18rem; font-weight:700; color:#000;margin-top: .2rem; }
.aboutrig .tit::before {
    content: "";
    position: absolute;
    left:0;
    bottom: 0;

    width:.56rem;
    height: .03rem;
    background:var(--primary);
    transition: all .3s;
}
.aboutrig .txt{font-size: .18rem; font-weight:500;margin-top: .4rem; color: #555;}
.aboutrig .Controls{margin-top: .6rem;}
.aboutrig .btn{padding:.18rem 0; display: inline-block;line-height:24px;margin-right: .2rem; color:var(--primary);font-size: .18rem; font-weight:500;}

.homepart02{width: 100%;}
.homepart02 img{width: 100%;}
.homepart02 .mo{display: none;}


/* ==========================================================================
   homepart03
   ========================================================================== */

.homepart03{width: 100%; padding:1.2rem 0;}
.home_tit { margin-bottom:.8rem; text-align: center;}
.home_tit .titen{color:var(--primary);font-size: .28rem; font-weight: 500;position: relative; padding-bottom:.1rem; }
.home_tit .titen::before {
  content: "";
  position: absolute;
  left: 50%;
  margin-left:-.28rem;
  bottom: 0;
  width:.56rem;
  height: .04rem;
  background:var(--primary);
}
.home_tit .titcn{margin-top:.2rem;font-size: .18rem; font-weight:700;line-height: 2; color: #000;}
.servicelist li{width: 33.33%;float: left; text-align: center;margin-bottom:.4rem;}
.servicelist li h4{margin:.3rem 0 .1rem 0;}
.servicelist li .txt{    color: rgb(153, 153, 153);}


.servicelist02 li{width: 25%;float: left;}
.servicelist02 li:last-child {background:rgb(0, 89, 133);}
.servicelist02 li .more{width: 100%;height: 100%;position: absolute;left: 0;top:0;z-index: 9; text-align: center; line-height: 100%;}

.servicelist02 li .more .txt{ width: 100%; height: 100%; display: flex; align-items: center;font-size: 20px; color: rgb(132, 186, 40);}
.servicelist02 li .more .txtcon{ width: 100%;text-align: center}


/* ==========================================================================
   homepart05
   ========================================================================== */

.homepart05{;padding:1.2rem 0 .8rem 0; position: relative; background: url(../images/bg05.jpeg) no-repeat center;background-size: cover;}

.homenewslist{margin-left: -.1rem;}
.homenewslist li{width: calc(25% - .1rem); margin-left: .1rem;  margin-bottom: .1rem; float: left; }
.newsbox02{background: #fff;font-size: .16rem;transition: all .3s;padding: 0.2rem;}
.newsbox02 .txtarea{font-size: 12px; color: #666666;}

.newsbox02 .tit{font-size: .14rem;font-weight:700;overflow:hidden;text-overflow: ellipsis;margin-top: .2rem; color: #000;
       display: -webkit-box;    -webkit-line-clamp:1;    -webkit-box-orient: vertical;}
.newsbox02 .date{margin-bottom: .1rem;}
.newsbox02 .txt{margin-top: .1rem; overflow:hidden;text-overflow: ellipsis;    display: -webkit-box;    -webkit-line-clamp:1;    -webkit-box-orient: vertical;}
.newsbox02:hover{box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.15);}
.newsbox02:hover .tit{color:var(--primary);}

.news_arrow_link {
    display: block;
    float: right;
    height: 28px; line-height: 28px;text-align: right; margin-top: .2rem;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    width: 40px;
}

.news_arrow_link  img { transition: all .3s;}
.newsbox02:hover .news_arrow_link img { margin-right: .1rem;}




/* ==========================================================================
   homepart06
   ========================================================================== */

.homepart06{;padding:1.6rem 0 1.2rem 0; position: relative; background:rgb(249, 249, 249);}
.homefeedback .home_tit{ text-align: left;margin-bottom: .3rem;}
.homefeedback  .home_tit .titen{}
.homefeedback .home_tit .titen::before { left:0; margin-left:0; }

.homefeedback .left{width: 300px;}
.homefeedback .feedback_main{width: calc(100% - 400px);}


.feedback_list li{margin-bottom: .3rem; background: #fff; padding-left: .3rem; position: relative; border: 1px solid #e0e0e0; border-radius: 2px;}
    
.input_style { height: 50px; width:100%; box-sizing: border-box; font-size: 16px; font-weight: 400; color: #767C8B; border:0; align-items: center; flex-wrap: nowrap; }
  
.feedback_list li span {position: absolute; left:10px; height: 50px; line-height: 50px;color: red;display: inline-block;}
  
  
  .text_area {
    padding-top:15px;position: relative;
    padding-left: .3rem;
    font-size: 16px;
    font-weight: 400;
    color: #767C8B;background: #fff;border: 1px solid #e0e0e0;
    margin: .32rem 0 .3rem;
    box-sizing: border-box;
  }
  
  .text_area span {
    margin-top: 15px;color: red; position: absolute; left: 10px;
  }

  .validateCode_input{ height: 50px; width:60%; box-sizing: border-box; font-size: 16px; font-weight: 400; color: #767C8B; border:0; align-items: center; flex-wrap: nowrap;  
   background: #fff;border: 1px solid #e0e0e0;}
  .validateCode{margin-bottom: .3rem;}
  .text_item {
    margin-top: 15px;
    min-height: 170px;
    width: 100%;
    background: none;
    outline: none;
    border: none;
    font-size: 16px; font-weight: 400; color: #767C8B;  font-family: Microsoft Yahei;
      font-size: 16px;
      line-height: 1.5;
  }

  
.btn_box {
  justify-content: center; 
}

.feedback_btn {
  width:100%;
  height: .54rem;
  font-size: .16rem;
  font-weight: bold;
  color: #FFFFFF;
  border: none;
background: #0D6AB8;
}





/* ==========================================================================
   footer
   ========================================================================== */
   footer{ background:var(--primary);}

footer a {    color: #555555;}

footer a:hover {    text-decoration: underline;}

.foot_lr { padding: .65rem 0; border-bottom: 1px solid rgba(181, 196, 203, .2); justify-content: space-between;}
.footer_main{padding: .85rem 0; border-bottom: 1px solid rgba(181, 196, 203, .2);}

.footlogo {width:40%;}
.footcontact { font-size: .14rem; line-height: 2; color: #fff;}


.foot_nav { width: 20%; margin-left:10%;}

.fn_title {
    font-size: 16px;
    color: rgb(129, 192, 77);
    font-weight: 700;
    position: relative;
    padding-bottom: .1rem;margin-bottom: .2rem;
}

.fn_title a{color: rgb(129, 192, 77);}


.fn_title::before {
    content: "";
    position: absolute;
    left: 0;
    bottom:0;
    width: .24rem;
    height: 2px;
    background:rgb(129, 192, 77);;
}
.fn_list a{color: #fff; line-height: 2;}




.foothd {
    padding: .25rem 0;
    color:#fff;
    text-align: center;
    font-size: .16rem;
    text-transform: Uppercase;
}

.foothd a {
    color: inherit;
}

.space {
    display: inline-block;
    width: .2rem;
}



@media only screen and (max-width:1440px) {
    .homepart06 { padding: .8rem 0;}
    .banner {width:100%; margin: 0; margin-top:var(--global-header-height);}
}

@media only screen and (max-width:1280px) {
    .homepart03 { padding: .8rem 0;}
    .home_tit { margin-bottom: .6rem;}
    .footlogo { width:30%; }
    .footlogo img{width: 100%;}
}

@media only screen and (max-width:920px) {
    .homepart02 .pc{display: none;}
    .homepart02 .mo{display: block;}
    .banner {margin: 0;}
    .about_left { width: 40%;}
    .aboutrig{ width:55%;}
    .homepart01 { padding: 1rem 0;}
    .homenewslist li { width: calc(50% - .1rem);}
    .homefeedback .feedback_main { width: calc(100% - 350px);}
    .newsbox02 .tit{font-size: 14px;}
    
}

@media only screen and (max-width: 768px) {


    .footer_main {
        display: none;
    }

    .space {
        width: 20px;
    }

    .foothd {
        font-size: 12px;
    }
    .servicelist02 li { width:50%;}
    .homefeedback .left img{display: none;}
    .homefeedback .left{width: 100%;float: none;}
    .homefeedback .feedback_main{width: 100%;float: none;}
    .homepart05 { padding: .8rem 0 .6rem 0;}
    
}

@media only screen and (max-width: 500px) {

    .space {
        width: 5px;
    }

    .foothd .wrapper {
        padding: 0;
    }

    .about_left,.aboutrig{ width:100%;float: none;}
    .homepart01 { padding: 30px 0;}
    .aboutrig .Controls { margin-top:20px;}
    .servicelist li {width:50%;padding-left:10px;padding-right:10px;}
    .home_tit .titcn{font-size: 14px;}
    .servicelist li .txt{font-size: 12px; height: 40px; line-height: 20px;}
    .servicelist02 li .more .txt{font-size: 16px;}

}