@import "base.css";

.pro_list_box >.service-list>li{ height:130px; width:390px; float:left; position:relative; border:2px solid #f0f0f0; border-radius:25px; margin-right:36px; margin-bottom:25px; padding-top:20px; padding-bottom:20px; padding-right:80px; padding-left:20px;}
.pro_list_box >.service-list>li:nth-child(2n+2){ margin-right:0px;}
.pro_list_box >.service-list>li h4{ font-size:18px; color:#444; font-weight:bold; margin-bottom:20px;}
.pro_list_box >.service-list>li>ul>li{ color:#999; line-height:20px; font-size:14px;}
.pro_list_box >.service-list>li.service-list01:after{ width:60px; height:60px; position:absolute; right:-2px; bottom:-2px; background:url(../images/service-icon01.png) 50% 50% no-repeat; background-color:#00b4e5; content:'';}
.pro_list_box >.service-list>li.service-list02,.service-list>li.service-list04{ padding-left:80px; padding-right:20px;}
.pro_list_box >.service-list>li.service-list02:after{ width:60px; height:60px; position:absolute; left:-2px; bottom:-2px; background:url(../images/service-icon02.png) 50% 50% no-repeat; background-color:#00b4e5; content:'';}
.pro_list_box >.service-list>li.service-list03:after{ width:60px; height:60px; position:absolute; right:-2px; top:-2px; background:url(../images/service-icon04.png) 50% 50% no-repeat; background-color:#00b4e5; content:'';}
.pro_list_box >.service-list>li.service-list04:after{ width:60px; height:60px; position:absolute; left:-2px; top:-2px; background:url(../images/service-icon03.png) 50% 50% no-repeat; background-color:#00b4e5; content:'';}
.pro_list_box >.service-list>li.service-list03 p{ text-align:right; color:#00b4e6; margin-top:30px;}

/*advantage*/
.advantage-list{ width:100%; height:200px;border-bottom:1px solid #eaeaea; padding-bottom:40px;}
.advantage-list ul{ float:left;}
.advantage-list ul li{ width:180px; float:left; margin-right:30px;text-align:center;}
.advantage-list ul li>a{ display:block; width:80px; height:80px;  margin:0 auto;margin-bottom:10px; border-radius:50%;}
.advantage-list ul li>a.adv-icon01{ background: url(../images/advantage-icon01.png) 50% 50% no-repeat #00b4e6;}
.advantage-list ul li>a.adv-icon02{ background: url(../images/advantage-icon02.png) 50% 50% no-repeat #00b4e6;}
.advantage-list ul li>a.adv-icon03{ background: url(../images/advantage-icon03.png) 50% 50% no-repeat #00b4e6;}
.advantage-list ul li h3>a{ font-size:16px; font-weight:bolder; display:block; color:#000; height:40px;}
.advantage-list ul li p>a{ color:#777; line-height:18px;}
.advantage-list ul li p>a:hover{ color:#333;}
.advantage-box{ width:370px; float:right; position:relative;}
.advantage-box h3{ text-align:center;font-size:30px; font-weight:bolder; padding-top:10px;}
.advantage-box p{ padding:20px; background:#00b4e6; color:#fff; line-height:20px; position:absolute; top:45px; left:0; height:95px;}
.advantage-box p a.more-advantage{display: block; height:40px; width:100px;background:url(../images/btn-icon-right.png) 80px 50% no-repeat; color:#fff; font-size:12px; line-height:40px; padding-left:15px; float:right; margin-top:25px;}
.pro_list_box >.advantage-list{width:100%; height:auto; padding:20px 0;border:0;}
.pro_list_box >.advantage-img{width:100%;height:auto;float:none;}
.advantage-img>ul{ width:1030px; margin:20px 0 2px 0;}
.advantage-img>ul>li{ margin-right:2px;}
.advantage-img>ul>li.small{ width:200px; float:left;}
.advantage-img>ul>li.big{ width:310px; float:left;}
.advantage-img>ul>li>ul>li{ position:relative; float:left;}
.advantage-img>ul>li.small>ul>li.long{ width:200px; height:110px; margin-bottom:2px; overflow:hidden;}
.advantage-img>ul>li.small>ul>li.mid{width:200px; height:210px;overflow:hidden;}
.advantage-img>ul>li.small>ul>li.long p{ width:200px; height:110px;}
.advantage-img>ul>li.small>ul>li.mid p{width:200px; height:210px;overflow:hidden;}
.advantage-img>ul>li.big>ul>li.big-big{width:310px; height:210px;overflow:hidden; float:left;margin-bottom:2px;}
.advantage-img>ul>li.big>ul>li.short{width:154px; height:110px;overflow:hidden; margin-right:2px;}
.advantage-img>ul>li.big>ul>li.big-big p{width:310px; height:210px;}
.advantage-img>ul>li.big>ul>li.short p{width:154px; height:110px;}
.advantage-img>ul>li.big>ul>li.short:last-child{ margin-right:0;}
.advantage-img>ul>li.big>ul>li.big-tall{ height:210px; width:154px; margin-right:2px; margin-bottom:2px; overflow:hidden;}
.advantage-img>ul>li.big>ul>li.big-tall p{ height:210px; width:154px;}
.advantage-img>ul>li.big>ul>li.big-tall02{height:210px; width:154px;margin-bottom:2px; overflow:hidden;}
.advantage-img>ul>li.big>ul>li.big-tall02 p{ height:210px; width:154px;}
.advantage-img>ul>li.big>ul>li.big-long{ width:310px; height:110px;}
.advantage-img>ul>li.big>ul>li.big-long p{ width:310px; height:110px;}
.advantage-img>ul>li>ul>li>p{ position:absolute; top:0; display:table; background:#00b4e6; text-align:center; opacity:0;}
.advantage-img>ul>li>ul>li>p.visible{ opacity:0.9;}
.advantage-img>ul>li>ul>li>p>span{ display:table-cell; vertical-align:middle;font-size:20px; font-weight:bolder; color:#fff;}
.advantage-img>ul>li>ul>li>p:hover{ opacity:0.8;}
.advantage-left{width:450px; float:left; background:#f0f2f3; height:307px; padding:50px 30px;}
.advantage-left h4{ font-size:14px; color:#000; font-weight:bold;}
.advantage-left ul{ margin:30px 0;}
.advantage-left ul li{ font-size:14px; color:#777; line-height:20px; position:relative; padding-left:15px; margin-bottom:20px;}
.advantage-left ul li:before{background: none repeat scroll 0 0 #00b4e5;border-radius: 50%; content: ""; height: 5px; left: 0;position: absolute; top: 10px;width: 5px;}
.advantage-left a{ display: block; height:40px; width:100px;background:url(../images/btn-icon-right.png) 100px 50% no-repeat #00b4e6; color:#fff; font-size:14px; line-height:40px; font-weight:bold;  padding-left:30px;}
.advt-title {padding: 30px 0;text-align: center;}
.advt-title h3 {font-size: 16px;font-weight: bolder;padding-top: 20px;}
.advt-title .blue-line {margin: 8px auto;}
.advt-title p {color: #777;}


.pro_list_box >.company-info-left {
    width: 500px;
    float: left;
	height:auto;
}
.company-img {
    width: 500px;
    height: 160px;
    overflow: hidden;
    float: left;
    margin-bottom: 25px;
}
.company-profile {
    width: 500px;
    height: 200px;
}
.company-profile p {
    line-height: 20px;
    color: #777;
}
.company-profile ul {
    line-height: 24px;
    margin-top: 15px;
}
.pro_list_box >.company-info-right {
    width: 500px;
    float: right;
	height:auto;
}
.company-info-right h3 {
    font-size: 18px;
    font-weight: bold;
}
.company-info-right ul li {
    position: relative;
    margin-top: 30px;
    padding-left: 60px;
}
.company-info-right ul li span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 55px;
    font-weight: bolder;
    font-size: 16px;
    font-family: "sivgeb";
}
.company-info-right ul li p {
    font-size: 14px;
    color: #777;
    font-size: 12px;
    line-height: 16px;
}
.about_more {
    display: block;
    width: 70px;
    padding-left: 15px;
    font-weight: bolder;
    height: 15px;
    color: #000;
    position: relative;
    background: url(../images/more-icon.png) right center no-repeat;
    margin-top: 10px;
	border:0;
	margin:0;
	line-height: 17px;
	text-align:left;
	font-size:12px;
	margin-top:10px;
}
.company-info-right a.about_more{
    margin-right: 20px;
}
.pro_list_box >.company-intro{
	width:100%;
	height:auto;
	}
.pro_list_box > .img-list > li {
    width: 254px;
    height: 253px;
    overflow: hidden;
    float: left;
    margin-right: 1px;
}
.pro_list_box >.img-list > li.black-bg01 {
    background: #3c3c3c;
    margin: 0 1px 0 0;
    padding: 10px;
    width: 234px;
    height: 233px;
    color: #fff;
}
.img-list > li.black-bg01 p {
    text-align: center;
    width: 232px;
    height: 193px;
    padding-top: 40px;
    font-size: 14px;
    line-height: 24px;
}
.img-list > li.black-bg01 p span {
    color: #fff;
    font-size: 20px;
    line-height: 36px;
    font-weight: bold;
    display: block;
    margin-bottom: 15px;
}

.pro_list_box >.img-list > li.img-list-long {
    width: 766px;
}
.img-list > li.img-list-long > img{
	width:767px;
	}
.img-list > li > img{
	width:255px;
	}
.pro_list_box .img-list > li.gray-bg01 {
    background: #ebebeb;
    padding: 10px;
    width: 234px;
    height: 233px;
    color: #fff;
}
.img-list > li.gray-bg01 p a {
    color: #777;
    display: table-cell;
    vertical-align: middle;
    font-size: 14px;
    line-height: 24px;
    padding: 0 20px 30px 20px;
}
.img-list > li.gray-bg01 p {
    display: table;
    text-align: center;
    width: 232px;
    height: 233px;
}
.img-list > li.gray-bg01 p a strong {
    color: #000;
    font-size: 20px;
    line-height: 36px;
    font-weight: bold;
}
.img-list > li.gk p span {
    display: block;
    margin-top: 10px;
}
.pro_list_box .img-list > li.gray-bg {
    background: #ebebeb;
    margin: 0 1px;
    padding: 10px;
    width: 234px;
    height: 233px;
}
.img-list > li.gray-bg p {
    padding: 15px;
    line-height: 20px;
    font-size: 14px;
    color: #777;
}
.img-list > li.gray-bg a.hy {
    display: block;
    text-align: center;
    font-size: 24px;
    line-height: 200px;
    color: #000;
    font-weight: bold;
}
.pro_list_box >.img-list > li.black-bg {
    background: #3c3c3c;
    margin: 0 1px 0 0;
    padding: 10px;
    width: 234px;
    height: 233px;
    color: #fff;
}
.img-list > li.black-bg p {
    display: table;
    text-align: center;
    width: 232px;
    height: 233px;
}
.img-list > li.black-bg p a {
    color: #fff;
    display: table-cell;
    vertical-align: middle;
    font-size: 20px;
    line-height: 36px;
    font-weight: bold;
}

 .img-list > li > ul.img-small > li {
    width: 126px;
    margin-right: 1px;
    height: 126px;
    overflow: hidden;
    float: left;
    margin-bottom: 1px;
    display: table;
    background: #777;
}

.pro_list_box .img-list > li > ul.img-small > li a {
    display: table-cell;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding: 0 8px;
    vertical-align: middle;
    text-align: center;
    line-height: 24px;
}
.pro_list_box .detial-top{width:100%;height:440px;}
.detail-right {
    width: 510px;
    float: right;
}
.detail-right ul.hbjk li {
    width: 244px;
    height: 198px;
    float: left;
    margin-left: 10px;
    margin-bottom: 10px;
}
@media screen and (min-width:768px){
.sub>li:hover {border:1px solid #00a0e9;}
.nav>.c_wap>li.lt:hover .sub{display:block;}
.nav>.c_wap>li.lt:hover .sub>li:hover>a{color:#00a0e9;}
.tel>ul>li:hover>div{display:block;cursor:pointer;}

.pro_list_box >.img-list > li > ul.img-small > li:hover{background: #00b4e6;}
.img-list > li.gray-bg:hover{background: #02b3e5;}
.img-list > li.gray-bg:hover p,.img-list > li.gray-bg:hover span{color:#fff;}
.img-list > li > ul.img-small > li:hover{background: #02b3e5;}
.pro_list_box >.img-list > li.gray-bg01:hover{background: #00b4e6;}
.pro_list_box > .img-list > li.black-bg01:hover{background: #00b4e6;}
.img-list > li.gray-bg01:hover p a{color:#fff;}
.img-list > li.gray-bg01:hover p a strong{color:#fff;}
.img-list > li.gray-bg:hover a.hy{color:#fff;}
.img-list > li.black-bg:hover{background: #00b4e6;}
}
@media screen and (max-width:767px) and (min-width:320px){
.main{width:100%;}
.top {height:20%;margin-bottom:20px;}	
.top .logo{margin:0 auto;float:none;}	
.top .nav{width:100%;float:none;}
.top .nav>ul>li{width:33%;}
.top .nav>ul>li a{width:100%;display:inline-block;}
.top .search{margin:0 auto;float:none;width:80%;min-width: 167px;}
.top .search .input{width:80%;}
.top .search .btn{background:url(../images/search.png) no-repeat 100% 98%; width: 20%;}
.sub,.sub>li{width:100%;}
.toTop{right:0;}	
.contact{height:483px;}
.contact_box{float:none;width:100%;}
.contact_title{text-align:center;}
.contact_info{overflow:hidden;}
.contact_info>div{width:100%;text-align:center;}
.contact dl{margin:0 auto;}
.footer{width:100%;}
.footer_nav{width:100%;max-width:430px;}
.footer_nav li{width:32%;}
.pro_top{width:100%;}
.pro_top img{max-width:1500px;width:100%;}
.pro_list{width:100%;}
.pro_list_nav{float:none;width:100%;max-width:540px;margin:0 auto;}
.contact dl {float: none; margin: 0 auto;}
.pro_list { width: 100%;padding-bottom: 40px;}
.pro_list_title { width: 100%; padding: 0; text-align: center;}
.pro_list_title > span { display: block;  text-align: center; width: 100%;}
.pro_list_box >.img-list{width:100%;max-width:512px;margin:0 auto;}

.pro_list_box > .company-info-left{width:100%;float:none;}
.company-img{width:100%;height:auto;}
.company-img img{max-width:500px;width:100%;margin:0 auto;display:block;}
.company-profile{width:100%;height:auto;margin-bottom:20px;}
.pro_list_box > .company-info-right{width:100%;float:none;}
.pro_list_box > .img-list > li.img-list-long{width:254px;float:none;}

.advantage-list ul{float:none;}
.advantage-list ul li{width:33%;margin:0;margin-bottom:10px;}
.advantage-box{width:100%;float:none;height: 156px;}
.advantage-img > ul{width:100%;margin-bottom:10px;}
.advantage-img > ul > li.small{float:none;margin:0 auto;display:none;}
.pro_list_box .detial-top{float:none;width:100%;}
.advantage-left{float:none;width:94%;padding:3%;height:auto;}
.detail-right{float:none;width:100%;}
.detail-right ul.hbjk li{width:49%; margin-left:1%;height:auto;margin-bottom: 1%;}
.detail-right ul.hbjk li img{width:100%;}
.advantage-img > ul > li.big{width:50%;margin:0;}

.advantage-img > ul > li.big > ul > li.big-big{float:none;margin:0 auto;width:99%;max-width:310px;}
.advantage-img > ul > li.big > ul > li.short{width:49%;float: left;height:auto;}
.advantage-img > ul > li.big > ul > li.short img{width:100%;max-width:154px;}
.advantage-img > ul > li.big > ul > li.big-tall{width:49%;float: left;height:auto;}
.advantage-img > ul > li.big > ul > li.big-tall img{width:100%;max-width:154px;}
.advantage-img > ul > li.big > ul > li.big-tall02{width:49%;float: left;height:auto;}
.advantage-img > ul > li.big > ul > li.big-tall02 img{width:100%;max-width:154px;}
.advantage-img > ul > li.big > ul > li.big-long{width:100%;height:auto;}
.advantage-img > ul > li.big > ul > li.big-long img{width:100%;}
.advantage-img > ul > li.big > ul > li.big-long p{width:100%;display:none;}
.pro_list_box > .service-list{width:100%;max-width:510px;}
.pro_list_box > .service-list > li{width:26%;;max-width:390px;height:264px;}
	}
@media screen and (max-width:767px) and (min-width:480px){
	
	}
@media screen and (max-width:480px) and (min-width:320px){
.pro_list_box > .img-list > li{float:none;margin:0 auto;}
.pro_list_box > .img-list > li.black-bg01,.pro_list_box .img-list > li.gray-bg,.pro_list_box > .img-list > li.black-bg{margin:0 auto;}
.advantage-list ul li{float:none;width:100%;}
.advantage-img > ul > li > ul > li{float:none}
.advantage-img > ul > li.big{float:none;margin:0 auto;width:100%;max-width:310px;}
.pro_list_box > .service-list > li{width:62%;max-width:390px;height:auto;float:none;margin:0 auto;}
}