@charset "utf-8";
/* CSS Document */
/*
* @description: 网站首页样式
* @author: ishang_pan
* @update: ishang_pan (2017-10-11 10:50)
*/

.margin{
    width: 1120px;
    margin: auto;
}

/*首页 on*/
.is-main{margin: 15px auto;}

/*主体部分*/
#main{
    position: relative;
}

/*最新公告*/
#main .notice{
    overflow: hidden;
    background: #eff8ff;
}
#main .notice .notice-left{
    float: left;
    overflow: hidden;
    display: flex;
}
#main .notice .notice-left a span:nth-child(1){
    width: 610px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}
#main .notice .notice-left a{
    display: block;
}
#main .notice .notice-left p{
    float: left;
    width: 85px;
    height: 40px;
    padding: 0 28px;
    text-align: right;
    font: 14px/40px "";
    color: #fff;
    margin-right: 20px;
    background: url(../img/horn.png) #1c67bf no-repeat 28px center;
}
#main .notice .notice-left span{
    font: 14px/40px "";
    color: #666;
    float: left;
}

#main .notice .notice-left span:nth-child(2){
    margin: 0 32px 0 22px;
}
#main .notice .notice-right{
    float: right;
}
#main .notice .notice-right p{
    font: 14px/40px "";
    color: #666;
    margin-right: 20px;
    
}


#main .notice-phone{
    overflow: hidden;
    width: 100%;
    display: none;
}
#main .notice-phone .notice-phoneleft{
    float: left;
    width: 30px;
    height: 30px;
    margin: 10px;
    background: url(../img/noticephone.png) no-repeat center;
    background-size: 100%;
}
#main .notice-phone .notice-phoneright{
    float: left;
    width:85%;
}
#main .notice-phone .notice-phoneright .top{
    color: #363636;
    font-size: 16px;
    line-height: 32px;
    font-weight: 700;
    word-wrap:break-word；
}

#main .notice-phone .notice-phoneright .bottom{
    color: #8e8e8e;
    font-size: 14px;
    line-height: 20px;
}

/*集团概况、最新通知、服务要闻*/
#main .main-top{
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: 20px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; 
}
#main .main-top .main-top-content{
    width: 358px;
    float: left;
}
#main .main-top .main-top-content:first-child+.main-top-content{
    margin: 0 22px;
}
#main .main-top .ie-center{
    margin: 0 22px;
}
#main .main-top .title{
    overflow: hidden;
}
#main .main-top .title h1{
    font: 700 16px/48px "";
    color: #666;
    float: left;
}
#main .main-top .title a{
    display: block;
    font: 14px/48px "";
    color: #666;
    float: right;
}
#main .main-top .img{
    position: relative; 
    width: 358px;
    height: 203px;
}
#main .main-top .img>a{
    display: block;
    width: 358px;
    height: 203px;
    overflow: hidden;
}
#main .main-top .img>a>img{
    width: 100%;
    height: 100%;
    -webkit-transition: 0.3s linear all;
    transition: 0.3s linear all;
}
#main .main-top .img>a>img:hover{
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
#main .main-top .img p{
    font: 14px/40px "";
    color: #fff;
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    bottom: 0;
    width: 333px;
    padding-left: 25px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#main .main-top .main-top-content>p{
    text-indent: 24px;
    width: 358px;
    height: 108px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #333;
    font: 14px/36px "";
    margin-top: 16px;
}
#main .main-top .main-top-content>a{
    display: block;
    font: 14px/14px "";
    color: #358aed;
    margin-left: 282px;
    margin-top: 12px;
}
#main .main-top .main-top-content ul{
    margin-top: 16px;
}
#main .main-top .main-top-content ul li{
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    
}
#main .main-top .main-top-content ul li i{
    display: block;
    float: left;
    width: 4px;
    height: 4px;
    background: #888;
    margin:17px 5px 0 0;
}
#main .main-top .main-top-content ul li a{
    display: block;
    font: 14px/36px "" ;
    color: #333;
    width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal\9;
    float: left;
}
#main .main-top .main-top-content ul li span{
    display: block;
    font: 12px/36px "";
    color: #888;
    margin: 0 0 0 24px;
    float: right;
    width: 140px;
    text-align: right;
}

#main .main-center{
    width: 100%;
    margin-bottom: 20px; 
}
#main .main-center img{
    width: 100%;
}


#main .main-bottom{
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-bottom: 20px; 
    -ms-flex-wrap: wrap; 
        flex-wrap: wrap;
}
#main .main-bottom .main-bottom-content{
    width: 358px;
    float: left\9;
}
#main .main-bottom .title{
    overflow: hidden;
    position: relative;
}
#main .main-bottom .title h1{
    font: 700 16px/36px "";
    color: #666;
    padding: 0 8px;
    float: left;
    z-index: 20;
    border-bottom: 2px solid #358aed;
    position: relative;
    cursor: pointer;
}
#main .main-bottom .tab{
    margin:0 22px\9;
}
/*#main .main-bottom .tab .title h1{*/
    /*border: 0;*/
/*}*/
#main .main-bottom .tab .title .title-tab{
    border-bottom: 2px solid #358aed;
}
#main .main-bottom .title a{
    display: block;
    font: 14px/36px "";
    color: #666;
    float: right;
}
#main .main-bottom .title i{
    display: block;
    width: 358px;
    height: 2px;
    position: absolute;
    background: #e6f3fd;
    bottom: 0
}

#main .main-bottom .main-bottom-content>p{
    text-indent: 24px;
    width: 358px;
    height: 108px;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #333;
    font: 12px/36px "";
    margin-top: 16px;
}
#main .main-bottom .main-bottom-content>a{
    display: block;
    font: 12px/12px "";
    color: #358aed;
    margin-left: 282px;
    margin-top: 12px;
}
#main .main-bottom .main-bottom-content .tab-content ul{
    display: none;
}
#main .main-bottom .main-bottom-content .tab-content .tab-show{
    display: block;
}
#main .main-bottom .main-bottom-content ul li{
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
#main .main-bottom .main-bottom-content ul li i{
    display: block;
    width: 4px;
    height: 4px;
    background: #888;
    margin:17px 5px 0 0;
    float:left\9;
}
#main .main-bottom .main-bottom-content ul li a{
    display: block;
    font: 14px/36px "";
    color: #333;
    width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal\9;
    float:left\9;
}
#main .main-bottom .main-bottom-content ul li span{
    display: block;
    font: 12px/36px "";
    color: #888;
    margin: 0 0 0 25px;
    float:left\9;
    width:140px;
    text-align: right;
}


/*右边定位客服*/
.serviceRight{
    position: fixed;
    bottom:25px;
    right: 0;
    background: #fff;
    z-index: 220;
}
.serviceRight ul .code-bigimg{
    width: 0px;
    height: 120px;
    position: absolute;
    left: -160px;
    top: 105px;
    opacity: 0;
    transition: 0.3s linear all;
}
.code-bigimg img{
    width: 0px;
    height: 100px;
}
/* .serviceRight-three:hover .code-bigimg{
    
    display: block;
    transform: scale(1.1);
} */
.serviceRight ul{
    -webkit-box-shadow: -3px 3px 5px #ccc;
            box-shadow: -3px 3px 5px #ccc;
}
.serviceRight ul .serviceRight-one{
    width: 58px;
    height: 62px;
    background: url(../img/banner-nine.png) no-repeat;
    background-position: -1376px -475px;
}
.serviceRight ul .serviceRight-two{
    background: url(../img/banner-nine.png) no-repeat;
    background-position: -1376px -549px;
}
.serviceRight ul .serviceRight-three{
    background: url(../img/rightCode.gif) no-repeat;
    background-position: 16px 12px;
}
.serviceRight ul .serviceRight-four{
    background: url(../img/banner-nine.png) no-repeat;
    background-position: -1376px -695px;
}
.serviceRight ul .serviceRight-five{
    background: url(../img/banner-nine.png) no-repeat;
    background-position: -1376px -765px;
}
.serviceRight ul .serviceRight-six{
    background: url(../img/banner-nine.png) no-repeat;
    background-position: -1376px -839px;
}
.serviceRight ul .serviceRight-seven{
    background: #fff;
    position: fixed;
    bottom: 20px;
    background: url(../img/banner-nine.png) no-repeat #fff;
    background-position: -1376px -911px;
    display: none;
}

.serviceRight ul i{
    display: block;
    width: 54px;
    height: 1px;
    background: #f1f1f1;
}
.serviceRight ul li p{
    width: 58px;
    text-align: center;
    font: 12px/100px "";
    color: #888;
    height: 62px;  
}

.serviceRight ul li a{
    width: 58px;
    height: 62px;
    display: block;
}

.s-right{
    float: right;
    overflow: hidden;
}

.s-right .txt{
    height:32px !important;
    width:226px;
    border:1px solid #e1e1e1;
    float:left;
    padding-left: 12px; 
    color: #888;
    font-size: 14px;
    border-radius: 4px 0 0 4px;
}
.s-right .sub{
    height:34px;
    width:34px;
    border: 0;
    float:left;
    color:#fff;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    background: url(../img/search.gif) #358aed no-repeat center;
    -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/item-img.png',sizingMethod='scale');
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/item-img.png',sizingMethod='scale');
}

.m-xjnews{margin-bottom: 15px; padding: 24px 48px; background:url(../img/bg-new.png) #f5f5f5 left top no-repeat;}
.m-xjnews .u-tit{display: block; font-size: 32px; font-weight: bold; line-height: 55px; color: #d51200; overflow: hidden; word-wrap: normal; white-space: nowrap; text-overflow: ellipsis;}
.m-xjnews ul{margin-left: -15px; margin-right: -15px;}
.m-xjnews  li{line-height: 32px;}
.m-xjnews  li a{color: #5e5e5e; display: block; padding-left: 14px; background: url(../img/arr.jpg) 0 center no-repeat; overflow: hidden; word-wrap: normal; white-space: nowrap; text-overflow: ellipsis;}

.m-left{float: left;width: 73%;overflow: hidden;}
.m-right{float: right;width: 24%;overflow: hidden;}

/* .m-list ul{padding-top:10px;} */
/* .m-list li{height:42px;line-height:42px;overflow: hidden;padding-left: 12px;background: url(../img/arr.jpg) 0 center no-repeat;font-size: 18px;}
.m-list li a{display: block;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}
.m-list li a font{color: #f00; font-family: '宋体';}
.m-list li a img{vertical-align: middle;}
.m-list li span{color: #999999;float: right;font-size: 14px;} */

.m-pfadv{z-index:9998;}
.m-pfadv p{text-align: right;}
/*集团要闻*/
.u-logo{ padding: 22px 0;}
.m-jtyw{overflow: hidden;}
.m-jtyw h3{position: relative;margin-bottom: 25px; border-bottom:1px solid #ddd; overflow:hidden;}
.m-jtyw h3 a{float:left;display: block;padding:0 10px;height: 40px;line-height: 40px;font-size: 20px;font-weight:bold;background:url(../img/t-bg.png) center bottom no-repeat;color: #006ebc;}
.m-jtyw h3 span{position:absolute;right:0;color: #333;font-size: 12px;}
.m-jtyw .col-md-4,.m-jtyw .col-md-8{padding: 0;}
.m-jtyw h4{margin-bottom: 10px;background:url(../img/arr.png) 0 center no-repeat;padding-left: 12px;}
.m-jtyw h4 a{display:block;font-size: 18px;color: #006ebc; text-align:left;font-weight: bold;white-space: nowrap; text-overflow: ellipsis;  overflow: hidden;}
.m-jtyw h4 span{ float:right;font-size: 14px;color:#666;}
.m-jtyw p{font-size: 12px;color: #666;white-space: nowrap; text-overflow: ellipsis;  overflow: hidden;}

.m-jtyw .yw-pic{width: 38%;}
.m-jtyw .yw-title{width: 59%;}
.m-jtyw .yw-text{width: 59%;}

.flash-wrapper{ position: relative; width: 38%; height: 200px; overflow: hidden;}
.flash-wrapper .hd{ height: 8px; overflow: hidden; position: absolute; right: 5px; bottom: 14px; z-index: 1;}
.flash-wrapper .hd ul{ overflow: hidden; zoom:1; float: left; }
.flash-wrapper .hd ul li{ float: left; width: 8px; height: 8px; margin-right: 9px; cursor: pointer; background: #fff;transition: 0.4s all; border-radius:50%;}
.flash-wrapper .hd ul li.on{ width: 8px; background: #ff0000;}

.flash-wrapper .bd{ position: relative; height: 100%; z-index: 0;}
.flash-wrapper .bd li{position: relative; zoom:1;}
.flash-wrapper .bd li img{width: 100%; height: 200px;}
.flash-wrapper .bd li .mask{height:40px;position:absolute;bottom:0px;left:0;display:block; width:100%; display: block; opacity: 0.5; background:#000;}
.flash-wrapper .bd li .comt{
  width: 60%;
  color:#fff;position:absolute;left:0;bottom:0; height:40px; line-height:40px; text-indent:1em; text-align:left; z-index:97;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.flash-wrapper .bd li .comt a{ color:#fff; font-size: 14px;}

/*用水知识   服务指南*/
.m-yszs{width: 47.5%;margin-top: 15px;}
.m-yszs h3{position: relative;border-bottom: 1px solid #ddd;/* padding-left: 10px; */}
.m-yszs h3 a{display: inline-block;height: 40px;line-height: 40px;padding:0 10px;font-size: 20px;font-weight:bold;background: url(../img/t-bg.png) center bottom no-repeat;color: #006ebc;}
.m-yszs h3 span{position:absolute;right:0;color: #333;font-size: 12px;}
.m-yszs ul{padding: 10px 5px 0 5px;}
.m-yszs li{height:36px;line-height:36px;background: url(../img/arr.jpg) 0 center no-repeat;}
.m-yszs li img{margin:5px 0 0 8px;}

/*停水公告 水质公告 招标公告 其他公告*/
.m-tsgg{margin: 15px 0;}
.m-tsgg .hd{height: 44px;line-height: 43px;border-bottom: 1px solid #ddd;overflow: hidden;position: relative;}
.m-tsgg .hd li{width:15%;float: left;border-left: none;}
.m-tsgg .hd li a{display: block;text-align: center;font-weight: bold;font-size: 20px;}
.m-tsgg .hd li.on a{color: #006ebc;background: url(../img/t-bg.png) center bottom no-repeat;}
.m-tsgg .hd .moreBtn{position:absolute;right:0;color: #333;font-size: 12px;}
.m-tsgg .tempWrap{height: 80px !important;}
.m-tsgg .bd ul{overflow: hidden;height: 120px !important;}
.m-tsgg .more{display: none; text-align: center; border: 1px solid #ddd; border-radius: 15px; padding: 5px 0; margin: 10px 0 15px 0;}
.m-tsgg .bd li{float: left;width: 47%;}
.m-tsgg .bd li{height:45px;line-height:45px;background: url(../img/arr.jpg) 0 center no-repeat;}

/*网上营业厅*/
.m-wsyy{overflow: hidden;}
.m-wsyy h3{height: 68px;line-height:68px;background:#2fa7dc url(../img/home/yyt.png) right top no-repeat;}
.m-wsyy h3 a{display:block;font-size: 20px;color: #fff;text-indent: 30px;font-weight: bold;}
.m-wsyy ul{padding: 4px 0;}
.m-wsyy li{float: left;width: 28%;height: 78px;border-radius: 5px;background: #2fa7dc;line-height: 124px;margin: 10px 0 0 4.5%;}
.m-wsyy li a{display: block;font-size: 15px;font-weight: bold;color:#fff;text-align: center;}
.m-wsyy li.ws1 a{background: url(../img/ws1.png) center 10px no-repeat;}
.m-wsyy li.ws2 a{background: url(../img/ws2.png) center 10px no-repeat;}
.m-wsyy li.ws3 a{background: url(../img/ws3.png) center 10px no-repeat;}
.m-wsyy li.ws4 a{background: url(../img/ws4.png) center 10px no-repeat;}
.m-wsyy li.ws5 a{background: url(../img/ws5.png) center 10px no-repeat;}
.m-wsyy li.ws6 a{background: url(../img/ws6.png) center 10px no-repeat;}

.m-wsyy li.ws1{ background:#46a0df;}
.m-wsyy li.ws2{ background:#dfae46;}
.m-wsyy li.ws3{ background:#5dce78;}
.m-wsyy li.ws4{ background:#6f96e6;}
.m-wsyy li.ws5{ background:#e386a3;}
.m-wsyy li.ws6{ background:#dc95e7;}

.newsr{margin:10px 0 0 0px;}
.newsr a{display:block;float:left;width:49%;padding:76px 0 0 0;margin:0.5%;color:#fff;text-align:center; font-size: 14px;}
.newsr div{background:linear-gradient(to left,#006ebc, #006ebc);float:left;border-radius: 5px;}
.newsr div:hover{background:linear-gradient(to left,#006ebc, #006ebc);float:left;border-radius: 5px;}
.newsr .service1{background:url(../img/wsyyt/service1.png) center top 12px no-repeat;}
.newsr .service2{background:url(../img/wsyyt/service2.png) center top 12px no-repeat;}
.newsr .service3{background:url(../img/wsyyt/service3.png) center top 12px no-repeat;}
.newsr .service4{background:url(../img/wsyyt/service4.png) center top 12px no-repeat;}
.newsr .service5{background:url(../img/wsyyt/service5.png) center top 12px no-repeat;}
.newsr .service6{background:url(../img/wsyyt/service6.png) center top 12px no-repeat;}
.newsr .service7{background:url(../img/wsyyt/service7.png) center top 12px no-repeat;}
.newsr .service8{background:url(../img/wsyyt/service8.png) center top 12px no-repeat;}
.newsr .service9{background:url(../img/wsyyt/service9.png) center top 12px no-repeat;}
.newsr .segment{width:370px;height:66px; padding:0;margin:0;border:0;}
.newsr{width:380px;float:left;margin:0 0 0 13px;}
.newsr a{display:block;width:110px;height: 105px;padding:76px 0 0 0;color:#fff;text-align:center;}
.newsr div{margin:0 0 5px 5px;}
.newsr .segment{margin:5px 0 0 0;width:370px;text-align: left;font-size:18px;line-height: 66px;text-indent: 1em;}

/*热线*/
.m-rx{margin: 20px 0 10px 0;text-align: center;}
.m-rx img{width: 100%;} 

.qy-video{width:100%;height: 55px;line-height:55px; margin-top:20px;background:url(../img/qy-video-btn-bg.png) no-repeat left center #5ac0ea;}
.qy-video a{ display:block; width:100%; height:55px; line-height:55px; color:#fff; font-size:18px; text-indent:65px; font-weight:bold;}

/*服务网点*/
.m-fwwd h3 a{display: block;color: #006ebc;font-size: 16px;height: 40px;line-height: 40px;text-indent: 10px;font-weight: bold;}
.m-fwwd iframe{width: 100%;display: block;margin: 0 auto;}

/*友情链接*/
.m-friendlink{border-top: 1px solid #ddd;padding-top: 10px;overflow: hidden;margin-top:10px;}
.m-friendlink h3{float: left;font-size: 20px;height: 54px;line-height: 54px;}
.m-friendlink ul{float: left;overflow: hidden;}
.m-friendlink li{float: left;margin-left: 7px;}


/*媒体查询*/
@media (min-width: 1200px){
    .is-main{ width: 1140px; }
    .m-left{ padding: 0; }
}
@media (max-width: 1024px) {
    .m-left,.m-right{width: 100%;padding: 0 15px;}
    .m-wsyy{margin-top: 10px;}
    .m-wsyy li{width: 15%;margin-left: 1.4%;}
    .m-rx{margin-top: 55px;float: right;}
    .m-fwwd{margin-top: 15px;float: left;}
    .m-rx,.m-fwwd{width: 48%;}
    .m-rx img,.m-fwwd img{width: 100%;}
    .m-friendlink{margin: 15px 15px 0 15px;padding: 0;}
    .m-friendlink li{width: 19%; text-align: center; margin-bottom: 15px; margin-left: 1%;}
    .m-friendlink li img{width: 100%;}
    #floatAd2,#leftad,#rightad{display: none;}
	.qy-video{ float:left;}
}
@media (max-width: 768px) {
    .m-friendlink li{ margin-bottom: 15px; margin-left: 0;width: 32%;}
    .m-friendlink li img{width: auto;}
}
@media (max-width: 736px) {
	.m-xjnews{margin: 0 15px 15px; padding: 15px;}
	.m-xjnews .u-tit{line-height: 2; font-size: 20px; padding: 0 30px;}
	.flash-wrapper{width: 100%; margin-bottom: 10px;}
	
    .m-yszs{width: 100%;}
    .m-tsgg .bd li{width: 100%;}
    .m-jtyw .yw-text{width: 100%;}
}
@media (max-width: 667px) {
    .m-friendlink li{ margin-bottom: 15px;width: 33.3%;}
}
@media (max-width: 640px) {
    .m-friendlink li{ margin-bottom: 8px;}
}
@media (max-width: 568px) {
    .m-wsyy li{width: 31%;margin-left: 1.6%;}
    .m-friendlink li{width: 50%; text-align: center; margin-bottom: 15px; }
    .m-friendlink li img{width: auto;}
}
@media (max-width: 414px) {
    .m-jtyw h3 a{width: 130px;height: 40px;line-height: 40px;font-size: 18px;}
    .m-tsgg .hd li{width: 20%;}
    .m-rx,.m-fwwd{width: 100%;}
    .m-rx{margin-top: 25px;}
    .m-fwwd{margin-top: 0;}
    .m-rx img,.m-fwwd iframe{width: auto;}
    .m-friendlink li { width: 49%; margin:0 0 1% 1%; }
    .m-friendlink li img{width: 100%;}
}
@media (max-width: 375px) {
    .m-tsgg .hd li{width: 25%;}
    .m-tsgg .hd .moreBtn{display: none;}
    .m-tsgg .more{display: block;}
    .m-jtyw h3 a{width: 90px;height: 35px;line-height: 35px;font-size: 16px;background: url(../img/home/t-bg2.jpg) 0 center no-repeat;color: #006ebc;}
}
@media (max-width: 360px) {
    .m-rx img,.m-fwwd iframe{width: 100%;}
}
@media (max-width: 360px) {
    .m-friendlink li{width: 100%;text-align: center;margin:0 0 10px 0;}
    .m-friendlink li img{width: auto;}
}



/*首页 end*/