@charset "utf-8";
/* CSS Document */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,hr,p,blockquote,img,table,th,td,pre,code,form,fieldset,legend,button,input,textarea{margin:0;padding:0;font-family:"微软雅黑"!important;color:#333;font-size:14px;}
body {background:#FFFFFF  ;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
dl,dt,dd,form,li,ul,ol{list-style:none;}
a:link,a:visited {text-decoration:none;color:#111;}
a:hover,a:active {text-decoration:none;color:##083190;}
a.navlink:link,a.navlink:visited{line-height:50px;font-size:18px;margin:0 1.3vw;}
a.navlink:hover,a.navlink:active,a.curlink:link,a.curlink:visited {color:#F00}
a.curnav:link,a.curnav:visited{color:#FFF;font-size:16px;display:block;height:52px;background:#ABCD05 url(../images/navbg.jpg) center bottom no-repeat;}
a.overnav:link,a.overnav:visited{color:#FFF;font-size:16px;display:block;height:52px;background:#ABCD05 }
.margintop {margin-top:10px}
img {border:0;}
.cleardiv {context:"."; height:"0"; display:block;clear:both;visibility:hidden}
.hidebody {display:none}

#top {width:100vw;overflow:hidden;margin:0 auto;position:fixed;background:#FFF;border-bottom:1px solid #CCC;z-index:1000}
#top dt {width:30vw;float:left;height:50px;}
#top .nav {width:55vw;float:left;height:50px;}
#top .nbtn {width:20vw;float:right}
#top dt img {margin-left:4vw}
#top dd span {float:right;margin-right:4vw;cursor:pointer}
@media (min-width:960px){#mspan{display:none}}
@media (max-width:960px){
#pspan{display:none} 
#top dd .navlink {display:none}
}
@media (max-width:1200px){
	#top dd font {display:none}
#top dt {width:30vw;float:left;height:50px;}
#top .nav {width:60vw;float:left;height:50px;}
#top .nbtn {width:10vw;float:right}
}
#banner {z-index:0;padding-top:50px;position:relative}
#bli {width:100%;text-align:center;margin-top:-21px;z-index:0;position:absolute}
#bli img {z-index:10}
#sinodesign {text-align:center;padding:50px 0}
#sinodesign  img {width:16vw}
#sinodesign span {display:block;font-size:1.8vw;width:11vw;margin:20px auto;border-bottom:2px solid #999;line-height:2em;}
#sinodesign label {font-size:2.5vw}
#sinodesign div {width:70vw;font-size:1.1vw;margin:20px auto 0 auto;text-align:center;line-height:2em;}
@media (max-width:720px){#sinodesign div {width:90vw}}
#sinodesign  div img {width:28vw;margin:30px 0}

#newproject  {text-align:center;padding:50px 0;border-top:1px solid #999}
#npimg {width:24vw}
#newproject span {display:block;font-size:2vw;width:11vw;margin:20px auto 40px auto;border-bottom:2px solid #999;line-height:2em;}
@media screen and (max-width: 960px){
	#newproject ul {width:100vw;height:100vw;overflow:hidden;background:#C39;}
	#newproject li {width:50vw;height:50vw;float:left;}
	#newproject li a {position:absolute;width:50vw;height:50vw;background:#F00;font-size:20px;color:#FFF;line-height:50vw;display:none}

	}
@media screen and (min-width:960px){
	#newproject ul {width:100vw;}
	#newproject li {width:20vw;float:left;height:20vw}
	#newproject li a {position:absolute;width:20vw;height:20vw;background:#F00;background:#F00;font-size:20px;color:#FFF;line-height:20vw;display:none;}
	}
#newproject div {padding-top:20px;}
#about {width:100%;background:url(../images/aboutbg.jpg) fixed;padding:30px 0}
.about {width:30vw;margin:0px auto;background-color:#FFF;padding:40px}
#about h3 {font-size:3vw;color:#F00;font-family:Arial, Helvetica, sans-serif}
#about span {color:#999;font-size:1vw}
#ainfo *{font-size:1.1vw;line-height:2em;margin:10px 0}
@media screen and (max-width:960px){.about {width:60vw;margin:0px auto;background-color:#FFF;padding:40px}}

#ourclients {text-align:center;padding:50px 0 20px 0;width:80vw;margin:0 auto;position:relative;z-index:0}
#ocimg {width:18vw}
#ourclients label {display:block;font-size:2vw;width:11vw;margin:20px auto 40px auto;border-bottom:2px solid #999;line-height:2em;}

@media screen and (max-width:1400px) {#ourclients {width:80vw;overflow:hidden}}
@media screen and (max-width:1000px) {#ourclients {width:90vw;overflow:hidden}}
@media screen and (max-width:800px) {#ourclients {width:100vw;overflow:hidden}}
.swiper-container {width: 90%;height: 300px;margin-left: auto;margin-right: auto;}
.swiper-slide {text-align: center;font-size: 18px;height: 122px;/* Center slide text vertically */display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center; justify-content: center;-webkit-box-align: center;-ms-flex-align: center;      -webkit-align-items: center;align-items: center;}
.swiper-slide img {border:1px solid #ccc;width:200px}

@media screen and (max-width:1400px){.swiper-container {height:168px;box-sizing:content-box;padding-bottom:50px}.swiper-slide {height:90px;margin:2px 0px}.swiper-slide img {border:1px solid #ccc;width:140px}}
@media screen and (max-width:1200px) {.swiper-container {height:168px;box-sizing:content-box;padding-bottom:20px}.swiper-slide {height:60px;margin:2px 0px}.swiper-slide img {border:1px solid #ccc;width:110px}.swiper-container {width: 90%;}}

#ourservice {text-align:center;padding:50px 0 20px 0;border-top:1px solid #ccc}
#osimg {width:18vw}
#ourservice label {display:block;font-size:2vw;width:11vw;margin:20px auto 40px auto;border-bottom:2px solid #999;line-height:2em;}

#fwlist {width:70vw;margin:0 auto;overflow:hidden}
#fwlist dl {width:21vw;float:left;margin:0 1vw}
#fwlist dt:hover {background-color:#F00}
#fwlist dt {height:8vw;border:3px solid #F00;padding:20px;text-align:left;margin-bottom:20px}
#fwlist span {font-size:1.6vw;color:#F00;}
#fwlist div {font-size:1.5vw}
#fwlist font {height:3.5vw;display:block}
#fwlist dt:hover {background-color:#F00;}
#fwlist dt:hover span {color:#FFF}
#fwlist dt:hover div {color:#FFF}
#fwlist dd a {display:block;width:10.5vw;float:left;height:25px;line-height:25px;font-size:14px}
#fwlist dd a:hover,#fwlist dd a:active {color:#F00}
@media screen and (max-width:720px){#ourservice {display:none}}

#interested {text-align:center;padding:50px 0 20px 0}
#itimg {width:24vw}
#interested div {text-align:center;font-size:0.8rem;margin-top:2vw;line-height:1.5rem}

#footer {width:100vw;background:url(../images/fbg.jpg) fixed ;background-size:cover}
#f1 {padding:30px 40px;text-align:center}
#f1 h3 {font-size:1.8vw;color:#FFF}
#f1 span {font-size:1.2vw;color:#686868;line-height:2vw;padding:10px 0;display:block}
#f1 font {font-size:1.3vw;color:#FFF;}
#f2 {background:rgba(255,0,0,0.8);width:100%;overflow:hidden}
#f2 dl {width:25vw;float:left;}
#f2 dt {padding-top:4vw;padding-bottom:1vw;text-align:center;color:#FFF;font-size:1.3vw;}
#f2 dd {padding-top:1vw;padding-bottom:4vw;text-align:center;color:#FFF;font-size:1.2vw;border-top:1px solid #FFF;}
#f2 dd span {display:block}
#f3 {text-align:center;font-size:18px;color:#FFF;padding:20px }
@media screen and (max-width :960px){#f2,#f3 {display:none}}

#prolist  {text-align:center;padding:50px 0;width:100vw;overflow:hidden}
@media screen and (max-width: 960px){
	#prolist ul {width:100vw;overflow:hidden;}
	#prolist li {width:50vw;height:50vw;float:left}
	#prolist li a {position:absolute;width:50vw;height:50vw;background:#F00;font-size:20px;color:#FFF;line-height:50vw;display:none}
	}
@media screen and (min-width:960px){
	#prolist ul {width:100vw;overflow:hidden}
	#prolist li {width:20vw;float:left;height:20vw;}
	#prolist li a {position:absolute;width:20vw;height:20vw;background:#F00;background:#F00;font-size:20px;color:#FFF;line-height:20vw;display:none;}
	}

#mybody {width:100vw;overflow:hidden}
#mytitle {font-size:26px;text-align:center;margin-top:50px;font-weight:bold}
#myinfo {font-size:18px;text-align:center;line-height:2em;}
#caseshow {width:812px;height:570px;background:url(../images/pc.jpg);margin:10px auto;text-align:center;padding-top:30px}

#casemmshow {width:812px;margin:10px auto;text-align:center;padding-top:30px}

#casemshow {display:none}
@media screen and (max-width:960px){
	#casemshow {text-align:center;display:block;margin:10px auto; z-index:-9999;}
	#casemshow img {width:100%}
	#caseshow {display:none}
	#casemmshow {display:none}
	}

#caseinfo {text-align:center;font-size:16px;line-height:2em;}
#casepage {width:100vw;overflow:hidden;margin:20px auto}
#casepage dt {width:48vw;float:left;height:45px;background:url(../images/left.jpg) no-repeat right center;line-height:45px}
#casepage dd {width:48vw;float:right;height:45px;background:url(../images/right.jpg) no-repeat left center;line-height:45px;}
#casepage a {display:block;width:206px;height:45px;font-size:18px;text-align:center;}
#casepage dt a {float:right}
#casepage dt a:hover,#casepage dt a:active {background:url(../images/left_c.jpg);color:#FFF;}
#casepage dd a:hover,#casepage dd a:active {background:url(../images/right_c.jpg);color:#FFF;}

#xgcase {text-align:center;padding:50px 0;border-top:1px solid #999;border-bottom:1px solid #999;margin:50px 0;width:100vw;overflow:hidden}
@media screen and (max-width: 960px){
	#xgcase ul {width:100vw;height:100vw;overflow:hidden;background:#C39;}
	#xgcase li {width:50vw;height:50vw;float:left}
	#xgcase li a {position:absolute;width:50vw;height:50vw;background:#F00;font-size:20px;color:#FFF;line-height:50vw;display:none}
	}
@media screen and (min-width:960px){
	#xgcase ul {width:100vw;}
	#xgcase li {width:20vw;float:left;height:20vw;}
	#xgcase li a {position:absolute;width:20vw;height:20vw;background:#F00;background:#F00;font-size:20px;color:#FFF;line-height:20vw;display:none;}
	}
#xcimg {width:24vw;margin-bottom:50px}

#xfbody {margin:50px 0;padding:50px 0;border-top:1px solid #999;border-bottom:1px solid #999;}
#hzlist {width:60vw;margin:50px auto}
#hzlist dt {font-size:16px;color:#F00;height:40px;line-height:40px;padding:40px 10px}
#hzlist dd {font-size:16px;color:#666;line-height:2em;padding:10px;background-color:#E9E8E7}
@media screen and (max-width:1280px){#hzlist {width:80vw;margin:50px auto}}
@media screen and (max-width:960px){#hzlist {width:90vw;margin:50px auto}}

#contact{width:100vw;overflow:hidden; margin-top:30px;}
.contact {width:1020px;margin:0 auto}
.contact dt {width:480px;float:left;background:url(../images/code.png) no-repeat right bottom}
.contact dd {width:460px;float:right}
.c1 {font-size:35px;font-weight:bold;color:#F00;border-bottom:2px solid #F00}
.c2 {font-size:40px;line-height:1.3em;padding:10px 0;color:3e3a3a;border-bottom:1px solid #DDD}
.c3,.c4{font-size:16px;line-height:2em;padding:10px 0}
.c5 {display:block;font-size:1px;width:60px;height:3px;background-color:#F00}
.c4 font {color:#F00;font-weight:bold}
.contact h2 {font-size:26px;margin:10px 0;padding:0}
.fleft {width:80px;float:left;height:40px;line-height:40px;text-align:left;font-size:16px;margin:5px 0}
.fright {width:380px;float:right;height:40px;text-align:left;margin:5px 0}
.fright input {height:30px;margin-top:5px;width:100%;}
.c6 {font-size:16px;height:40px;line-height:40px;width:100%;clear:both}
.contact textarea {width:100%;height:120px}
.c7 {padding:60px 0 0 0 }
.c7  input {width:100%;height:40px;line-height:40px;border:2px solid #F00;background:#FFF;font-size:20px;color:#F00;font-size:18px;padding:0;line-height:30px;font-weight:bold}
@media screen and  (max-width:960px){
.contact {width:100vw;margin:0 auto}
.contact dt {width:90vw;float:none;background:url(../images/code.png) no-repeat right bottom;margin:0 auto}
.contact dd {width:90vw;float:none;margin:20px auto}
.fleft {width:20vw;float:left;height:40px;line-height:40px;text-align:left;font-size:16px;margin:5px 0}
.fright {width:70vw;float:right;height:40px;text-align:left;margin:5px 0}

}
#topcontact {width:100vw;background:#FFF;position:fixed;top:50px;display:none;z-index:1000;padding-top:20px}

#cpic {width:100%;overflow:hidden;padding:50px 0;border:1px solid #ccc;border:1px 0;margin:50px 0}
#cpic ul {width:1030px;margin:0 auto}
#cpic li {width:200px;padding:50px;border:1px solid #DDD;float:left;margin:20px}
#cpic li:hover {border-color:#F00}
@media screen and  (max-width:960px) {
	#cpic ul {width:100%;}
	#cpic li {float:none;margin:10px auto}
	}

#mbnav {width:40vw;position:fixed;top:0;bottom:20vw;right:0;background:#FFF;padding-top:50px;text-align:center;border-left:1px solid #CCC;border-bottom:1px solid #CCC;display:none;z-index:9999}
#mbnav li {height:60px;line-height:60px;border-bottom:1px solid #CCC}
@media screen and  (min-width:1080px ){#mbnav {display:none}}
@media  screen and (max-width:1080px ){#topcontact {display:none}}

#xfleft {position:fixed;width:110px;right:20px;z-index:1000;top:40vh;text-align:right}
#xfleft li {margin:0;padding:0;}
#xfleft li div {position:absolute;right:50px;margin-top:-80px;display:none}
@media screen and  (max-width:1080px){#xfleft {display:none}}

#mybanner {width:100%;height:296px;background:url(../images/banner2.png) no-repeat center top }