@charset "utf-8";
@import "page.css";
#city_banner{overflow:hidden;height:600px;background: url(../images/city/banner.jpg) no-repeat center center;background-size:cover;}
#city_banner .text{ width:50%; padding-left:10px}
#city_banner .text dt{ font-size:34px; line-height:50px; padding-bottom:20px; font-weight:700; border-bottom:1px solid #ddd; margin-bottom:30px}
#city_banner .text dt i{ font-size:74px; color:#FF5722; padding-right:5px; font-family:'Gotham-Book'; line-height:74px}
#city_banner .text dt em{ color:#FF5722}
#city_banner .text dd{ font-size:22px; line-height:36px; padding-left:3px}
#city_banner .text dd i{ font-size:30px; color:#FF5722; font-weight:700; padding:0 5px}
#city_banner .text dd em{ margin-right:10px}
#city_banner{ padding-top:130px; display:block}

#city_service{width:100%;padding:100px 0;background:url(../images/city/service_bg.jpg) no-repeat center center;background-size:cover}
#city_service .list .item{border-right:1px solid #eaeaea;padding:0 45px 20px;text-align:center;float:left;width:calc(100% / 4)}
#city_service .list .item:first-child{border-left:1px solid #eaeaea}
#city_service .list .item h2{margin-top:20px;font-size:19px;font-weight:700;display:block}
#city_service .list .item small{font-size:12px;display:block;color:#888;text-transform:capitalize}
#city_service .list .item p{line-height:20px;color:#888}
#city_service .service_title{padding:70px 0 0;text-align:center}
#city_service .service_title big{font-size:24px;font-weight:700;display:block}
#city_service .service_title small{font-size:14px;display:block;margin-top:10px;color:#888}#city_case{width:100%;padding:80px 0 100px;background:url(../images/city/case_bg.jpg);}

#city_case .stitle big{color:#fff}
#city_case .stitle small{color:#fff}
#city_case .list{margin-top:40px}
#city_case .list .tabs{height:33px; text-align:center}
#city_case .list .tabs a{ display:inline-block; margin:0 20px}
#city_case .list .tabs a span{color:#fff;display:block}
#city_case .list .tabs a em{transition: 0.5s;display: block;width: 0%;height: 1px;background: #eee;margin: 0 auto;}
#city_case .list .tabs a:hover{ background:#1a58ab}
#city_case .list .tabs a:hover em{ width:100%}
#city_case .list .tabs a.active{background:#1a58ab}
#city_case .list .tabs a.active em{ width:100%;}
#city_case .list .content{margin-top:30px}
#city_case .list .content ul li{float:left;width:calc((100% - 60px) / 4);overflow:hidden;position:relative; margin-right:20px; margin-top:20px}
#city_case .list .content ul li:nth-child(4n){ margin-right:0}
#city_case .list .content ul li .img{width:100%;height:210px; overflow:hidden}
#city_case .list .content ul li .img img{width:100%;height:100%;object-fit:cover}
#city_case .list .content ul li .info{border-top:0; background:#fff; padding:20px 30px 10px}
#city_case .list .content ul li .info big{font-size:16px;display:block}
#city_case .list .content ul li .info small{font-size:12px;display:block;line-height:24px;color:#888}
#city_case .list .content ul li .curr{opacity: 0;position: absolute;width: 100%;top: 0;left: 0;background: rgba(0, 0, 0, 0.7);height:calc(100% - 84px); padding-top:100px;}
#city_case .list .content ul li .curr em{transition: 0.5s;display: block;width: 40%;height: 1px;background: #eee;margin: 0 auto; overflow:hidden}
#city_case .list .content ul li .curr .title{display: block;color: #fff;text-align: center;font-size: 14px;letter-spacing: 1px;}
#city_case .list .content ul li a:hover .curr{opacity:1;}
#city_case .list .content ul li a:hover .curr em{ width:2%;}#city_idea{width:100%;padding:80px 0;background:url(../images/city/idea_bg.jpg);}

#city_idea .list{margin-top:50px}
#city_idea .list .text{width:calc((100% - 350px)/ 2);position:relative;height:330px}
#city_idea .list .text p{font-weight:700;font-size:16px}
#city_idea .list .text p small{display:block;font-size:12px;line-height:12px;font-weight:400;color:#888}
#city_idea .list .text1 p{text-align:right}
#city_idea .list .text2 p{text-align:left}
#city_idea .list .img{width:350px;text-align:center;margin:0 auto}
#city_idea .list .text1 p:nth-child(1){position:absolute;right:0;top:20px}
#city_idea .list .text1 p:nth-child(2){position:absolute;right:0;bottom:20px}
#city_idea .list .text2 p:nth-child(1){position:absolute;left:0;top:20px}
#city_idea .list .text2 p:nth-child(2){position:absolute;left:0;bottom:20px}

#city_news{width:100%;padding:80px 0;background:url(../images/city/news_bg.jpg);background-size:cover}
#city_news .stitle big{color:#fff}
#city_news .stitle small{color:#fff}
#city_news .list{margin-top:50px}
#city_news .list ul li{float:left;width:30%}
#city_news .list ul li:nth-child(2){margin:0 5%}
#city_news .list ul li .img{width:100%;height:250px;overflow:hidden}
#city_news .list ul li .img img{width:100%;height:100%;object-fit:cover}
#city_news .list ul li time{font-size:14px;color:#fff;margin-top:20px;display:block}
#city_news .list ul li .t{font-size:16px;font-weight:700;color:#fff}
#city_news .list ul li .t{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;display:-webkit-box;-webkit-box-orient:vertical}
#city_news .list ul li p{line-height:20px;color:#fff;margin-top:10px;color:#888}
#city_news .list ul li p{word-break:break-all;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical}
#city_news .list ul li .more{margin-top:10px}
#city_news .list ul li .more span{color:#1a58ab;border-bottom:1px solid #1a58ab;font-size:10px}

#city_contact {width:100%;padding:80px 0;background:url(../images/city/guest_bg.png)}
#city_contact big{display:block;font-size:20px;font-weight:700}
#city_contact .box{padding:40px 0}
#city_contact .box input{float:left;margin-right:1%;padding:20px 0;color:#6e6e6e;border:0;background:#fff;text-indent:20px}
#city_contact .box .text1{width:20%}
#city_contact .box .text2{width:20%}
#city_contact .box .text3{width:37%}
#city_contact .box .submit{width:20%;margin-right:0;border:0;background:#000;color:#fff}
#city_contact small{display:block;font-size:14px;color:#888}

@media (max-width:900px){
	body,html{font-size:.21rem;line-height:.34rem;}
	#city_banner {overflow: hidden;background: url(../images/city/banner.jpg) no-repeat center center;background-size: cover;padding-top: 0;height: 100%;}
	#city_banner .wrap{height: inherit; padding:.5rem .3rem;display: block;}
	#city_banner .text{width:100%; text-align:center}
	#city_banner .text dt{font-size:.3rem;line-height:.34rem;padding-bottom:0;margin-bottom:.6rem; border-bottom:0;}
	#city_banner .text dt i{font-size:.6rem;padding-right:0;line-height:.6rem;}
	#city_banner .text dd{ display:none}
	#city_banner .img{width:100%; text-align: center}
	#city_banner .img img{ max-width:80%;}
	
	#city_service{padding:.5rem 0;}
	#city_service .list{display:block;}
	#city_service .list .item{border:1px solid #eaeaea;padding:.3rem;text-align:left;float: inherit;width:100%; margin-top:.3rem;}
	#city_service .list .item h2{margin-top:.2rem;font-size:.26rem;}
	#city_service .list .item small{font-size:.21rem;}
	#city_service .list .item p{line-height:.34rem; font-size:.21rem;}
	#city_service .service_title{padding:.5rem 0 0;}
	#city_service .service_title big{font-size:.26rem;}
	#city_service .service_title small{font-size:.21rem;margin-top:.1rem;}
	
	#city_case{padding:.6rem 0;}
	#city_case .list{margin-top:.3rem;}
	#city_case .list .tabs{height:.34rem;}
	#city_case .list .tabs a{margin:0 .1rem;}
	#city_case .list .content{margin-top:.3rem;}
	#city_case .list .content ul li{float: inherit;width:100%;margin-right:0;margin-top:.3rem;}
	#city_case .list .content ul li:nth-child(n+4){ display:none}
	#city_case .list .content ul li .info{padding:.3rem;}
	#city_case .list .content ul li .info big{font-size:.26rem;}
	#city_case .list .content ul li .info small{font-size:.21rem;}
	#city_case .list .content ul li .curr{ display:none}
	
	#city_idea{padding:.6rem 0;}
	#city_idea .list{margin-top:0;}
	#city_idea .list .text{width:100%;position:relative;height: auto;}
	#city_idea .list .text p{font-size:.26rem; border:1px solid #e8edf2; padding:.3rem; margin-top:.3rem}
	#city_idea .list .text p small{font-size:.21rem;line-height: inherit;}
	#city_idea .list .text1 p{text-align:left;}
	#city_idea .list .img{ display:none}
	#city_idea .list .text1 p:nth-child(1){position: inherit;right:0;top:0;}
	#city_idea .list .text1 p:nth-child(2){position:inherit;right:0;bottom:0;}
	#city_idea .list .text2 p:nth-child(1){position:inherit;left:0;top:0;}
	#city_idea .list .text2 p:nth-child(2){position:inherit;left:0;bottom:0;}	
	
	#city_news{padding:.6rem 0;}
	#city_news .list{margin-top:0;}
	#city_news .list ul li{float: inherit;width:100%; margin-top:.3rem}
	#city_news .list ul li:nth-child(2){margin:.3rem 0 0}
	#city_news .list ul li .img{width:100%;height:3rem;overflow:hidden;}
	#city_news .list ul li time{font-size:.21rem;color:#fff;margin-top:20px;display:block;}
	#city_news .list ul li .t{font-size:.26rem;}
	#city_news .list ul li p{line-height: inherit; font-size:.21rem;margin-top:.1rem;}
	#city_news .list ul li .more{margin-top:.1rem;}
	#city_news .list ul li .more span{font-size:.21rem;}
	
	#city_contact{padding:.6rem 0;}
	#city_contact big{font-size:.26rem;font-weight:700;}
	#city_contact .box{padding:.4rem 0;display:block;}
	#city_contact .box input{float: inherit;margin-right:0;padding:.2rem 0;text-indent:.2rem; font-size:.21rem;margin-top:.2rem;}
	#city_contact .box .text1{width:100%;}
	#city_contact .box .text2{width:100%;}
	#city_contact .box .text3{width:100%;}
	#city_contact .box .submit{width:100%;appearance: button; -moz-appearance:button; -webkit-appearance:button; border-radius:0}
	#city_contact small{font-size:.21rem;}
}