﻿/*******************************
    -------[=联系我们]-------
********************************/

.m-form{
    overflow: hidden;
    margin: 40px 0 50px;color: #474747;
    padding: 30px;font-size: 14px;
    -moz-box-shadow:0px 0px 20px #ccc; 
    -webkit-box-shadow:0px 0px 20px #ccc; 
    box-shadow:0px 0px 20px #ccc;
}

.m-form p{line-height: 36px;}
.m-col1{float: left;width: 50%;}
.m-col2{float: right;width: 40%;}
.m-col2.ad-mcol2{display: none;}
.m-form input{height: 40px;border: 1px solid #dedede;margin-bottom: 20px;width: 95%;padding: 0 10px;}
.m-form .sub{
    width: 90px;border-radius: 4px;font-size: 14px;color: #474747;margin: 0;background-color: #fff;-o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
}
.m-form .sub:hover{background-color: #ccc;}
.m-form em{float: right;width: 5%;margin-top:3px; text-align: center;font-size: 30px;color: #dc080d;}
.m-form textarea{width: 100%;height: 280px; border: 1px solid #dedede;resize: none;padding: 10px;font-size: 14px;color: #474747;}

.s-list1{overflow: hidden;margin: 0 -16px 40px;}
.s-list1 li{float: left;width: 33.3%;padding: 0 16px;}
.s-list1 .pic{
    display: block;
    position: relative;
    height: 0;
    padding-top: 67%;
    overflow: hidden;
}
.s-list1 .pic img{
    display: block;position: absolute;
    height: 100%;width: 100%;left: 0;top: 0;
    -o-transition:.3s;
    -ms-transition:.3s;
    -moz-transition:.3s;
    -webkit-transition:.3s;
    transition:.3s;
}
.s-list1 .pic:hover img{
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05); 
    -ms-transform: scale(1.05); 
    -o-transform: scale(1.05); 
    transform: scale(1.05);
    transform-origin: 50% 50%;
}

.s-list1 li h4{height: 60px;line-height: 60px;font-size: 18px;color: #0079c2;font-weight: normal;}
.s-list1 li h4 a{display: block; color: #0079c2;white-space: nowrap;overflow: hidden;-ms-text-overflow: ellipsis;
text-overflow: ellipsis;}
.s-list1 li h4 a:hover{text-decoration: underline;}
.s-list1 li p{font-size: 14px;color: #333;line-height: 1.8;}

.m-map {width: 100%; height: 500px;} 
#dituContent {height: 100%;}
#dituContent img{max-width: none;}



/*******************************
    -------[=质量]-------
********************************/
.m-proj1{position: relative; color: #474747;margin-top: 45px;}
.m-proj1:after{
    position: absolute;
    content: '';
    width: 32%;
    height: 450px;
    border: 1px solid #d2d2d2;
    top: 80px;
    left: 45%;
    z-index: -1;
}
.m-proj1 .pic{float: right;width: 35%;}
.m-proj1 .pic img{display: block;width: 100%;}
.m-proj1 .con{float: left;width: 61%;}
.m-proj1 .txt1{padding: 0 33% 40px 12%;}
.m-proj1 .txt1 .tit{font-size: 32px;}
.m-proj1 .txt1 .subtit{font-size: 20px;margin: 5px 0 10px;}
.m-proj1 .txt1 p{font-size: 14px;line-height: 1.9;}
.m-proj1 .txt2{
    position: relative;
    background-color: #fff;
    padding: 80px 12% 150px;
    -moz-box-shadow:0px 0px 20px #ccc; 
    -webkit-box-shadow:0px 0px 20px #ccc; 
    box-shadow:0px 0px 20px #ccc;
    margin-bottom: 130px;
}
.m-proj1 .txt2:after{
    position: absolute;
    content: '';
    width: 31px;
    height: 84px;
    top: 100%;
    left: 81%;
    background: url(../images/img-2.png) center center no-repeat;
    background-size: 100% 100%;
}
.m-proj1 .txt2 h4{font-size: 24px;font-weight: normal;height: 80px;line-height: 80px;border-bottom: 1px solid #b5b5b5;margin-bottom: 25px;white-space: nowrap;overflow: hidden;-ms-text-overflow: ellipsis;
text-overflow: ellipsis;}
.m-proj1 .txt2 p{font-size: 14px;line-height: 1.9;}
.m-proj1 .txt2 .details{
    float: right;font-size: 14px;
    color: #666;margin-top: 40px;
    background: url(../images/ico-01.png) right center no-repeat;
    padding-right: 38px;
}


.s-list2{position: relative;overflow: hidden;padding-bottom: 84px; margin-bottom: 40px;}
.s-list2:after{
    clear: both;
    position: absolute;
    content: '';
    width: 31px;
    height: 84px;
    bottom: 1px;
    left: 50%;
    margin-left: -16px;z-index: -1;
    background: url(../images/img-2.png) center center no-repeat;
    background-size: 100% 100%;
}

.s-list2 li{float: right;width: 50%;color: #474747;}
.s-list2 .pic{display: block;position: relative;height: 0;padding-top: 69%;overflow: hidden;}
.s-list2 .pic img{display: block;position: absolute;height: 100%;width: 100%;left: 0;top: 0;}
.s-list2 .con{
    position: absolute;
    width: 56%;
    left: 22%;
    top: 25%;
    color: #fff;
    padding: 30px 26px;
}
.s-list2 .txt{padding: 35px 19% 35px 16%;height: 240px;overflow: hidden;}
.s-list2 .txt .tit{font-size: 32px;font-weight: normal;}
.s-list2 .txt .tit i{display: block;font-size: 20px;margin: 5px 0 10px;font-style: normal;}
.s-list2 .txt p{font-size: 14px;line-height: 1.9;}


.s-list2 li.v1 .con{background-color: rgba(0,0,0,.6);}
.s-list2 li.v2 .con{background-color: rgba(0,121,194,.6);}

.s-list2 .con h5{font-size: 18px;font-weight: normal;margin-bottom: 20px;}
.s-list2 .con p{font-size: 14px;line-height: 1.8;}
.s-list2 .con .del{display: inline-block; font-size: 14px;padding-right: 38px; margin-top: 20px; background: url(../images/ico-02.png) right center no-repeat;}


.m-respons{overflow: hidden;text-align: center;color: #474747;}
.m-respons h2{font-weight: normal;font-size: 26px;}
.m-respons h2 i{display: block;font-style: normal;margin: 10px 0;}
.m-respons p{font-size: 14px;line-height: 1.9;}
.m-respons img{display: block;margin-top: 35px;}



@media only screen and (max-width: 1400px) {
    .s-list1 {margin: 0 0 40px; }
    
}

@media only screen and (max-width: 1366px) {
    .m-col1,.m-col2 {width: 46%; } 
    
    
}
@media only screen and (max-width: 1366px) {
}
@media only screen and (max-width: 1199px) {

}
/*Common For Max 960*/
@media only screen and (max-width: 1024px) {
}

/*Common For Max 768*/
@media only screen and (max-width: 959px) {

    .m-proj1 .pic,.m-proj1 .con {float: none; width: auto; } 
    .m-proj1 .txt1 {padding: 40px 10%; } 
    .m-proj1 .txt2 {padding: 60px 10% 120px; } 
    .m-proj1 .txt2:after {left: 49%; } 
    .s-list2 li {float: none; width: auto; }
    .m-proj1:after {display: none;}

}



/*Common For Max 480*/
@media only screen and (max-width: 768px) {
    .m-col1{width: auto;float: none; } 
    .m-col2.ad-mcol2{display: block;width: auto;float: none; width: 95%;margin-bottom: 20px;} 
    .m-col2{display: none;}
    .m-map {height: 300px; }
    .s-list1 li {float: none; width: auto; margin-bottom: 20px;}
    .m-form textarea {height: 160px;}

    .m-proj1 .txt1 {padding: 20px 5%; } 
    .m-proj1 .txt2 {padding: 30px 5% 80px; } 
    .s-list2 .txt {padding: 20px 5%; height: 200px; }
    
}

@media only screen and (max-width: 600px) {
}

/*Common For Max 320*/
@media only screen and (max-width: 479px) {

    .m-form {margin: 10px 0; padding: 10px; font-size: 12px; } 
    .m-form p {line-height: 24px; } 
    .m-form input {width: 98%; height: 36px; margin-bottom: 10px; } 
    .m-form em {width: 2%; margin-top: 1px; font-size: 20px; } 
    .m-form .sub {width: 90px; font-size: 12px; margin-bottom: 10px; } 
    .m-form textarea {height: 80px; font-size: 12px; }
    .s-list1 {margin: 0; } 
    .s-list1 li {padding: 0;margin-bottom: 10px; } 
    .s-list1 li h4 {height: 30px; line-height: 30px; font-size: 14px; } 
    .s-list1 li p {font-size: 12px; }
    .m-map {height: 180px; }
    .m-proj1 .txt1 {padding: 10px; } 
    .m-proj1 .txt1 .tit {font-size: 18px; } 
    .m-proj1 .txt1 .subtit {font-size: 14px; margin: 0; } 
    .m-proj1 .txt1 p {font-size: 12px; } 
    .m-proj1 .txt2 {padding: 10px 0 50px; margin-bottom: 50px; } 
    .m-proj1 .txt2 h4 {padding: 0 10px; font-size: 14px; height: 30px; line-height: 30px; margin-bottom: 10px; } 
    .m-proj1 .txt2 p {padding: 0 10px; font-size: 12px; } 
    .m-proj1 .txt2 .details {font-size: 12px; margin: 20px; background-size: 18px auto; padding-right: 25px; } 
    .m-proj1 .txt2:after {width: 15px; height: 40px; } 
    .s-list2 .con {width: 80%; left: 10%; top: 40px; padding: 15px; } 
    .s-list2 .con h5 {font-size: 14px; margin-bottom: 10px; } 
    .s-list2 .con p {font-size: 12px; } 
    .s-list2 .con .del {font-size: 12px; margin-top: 10px; padding-right: 30px; background-size: 20px auto; } 
    .s-list2 {padding-bottom: 40px; margin-bottom: 20px; } 
    .s-list2 .txt {padding: 10px; height: auto; } 
    .s-list2 .txt .tit {font-size: 16px; } 
    .s-list2 .txt .tit i {font-size: 14px; margin: 0 0 5px; } 
    .s-list2 .txt p {font-size: 12px; } 
    .s-list2:after {width: 16px; height: 40px; margin-left: -8px; } 
    .m-respons h2 {font-size: 16px; } 
    .m-respons h2 i {margin: 0; } 
    .m-respons p {font-size: 12px; } 
    .m-respons img {margin-top: 10px; } 
    .m-col2.ad-mcol2{width: 98%;margin-bottom: 10px;}
}























































