/*========================================	

	[ index.css verson:1.0 ]
	website: 
	page: index.html	

	powerby: Spider
	E-mail: lssd_19@163.com
	date:2013-4-06 23:37:32

	lastest update: 2013-4-12 23:37:43
	by: Spider

=========================================*/

@import url("reset.css");
 @import url("basic.css");
.bg-gray { background:#efefef; }
/* margin */
#customer { margin-bottom: 60px; }
/* slides */
.focusBox { position: relative; width: 100%!important; height: 500px; overflow: hidden; }
.focusBox .pic { position: relative; width: 100%!important; z-index: 0; }
.focusBox .pic li { width: 100%!important; margin: 0; padding: 0; list-style: none; background: none }
.focusBox .pic a { display: block; width: 100%!important; height: 500px; background-position: center center; background-size: auto 500px; }
.focusBox .pic img { width: 100%; height: 500px; }
.focusBox .hd { width: 100%!important; position: absolute; margin: 0; bottom: 30px; text-align: center; font-size: 0; z-index: 1; }
.focusBox .hd span { display: inline-block; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #333; background: #aaa; margin: 0 5px; cursor: pointer; *display:inline;
zoom: 1; filter: alpha(opacity=80); opacity: 0.8; }
.focusBox .hd .on { background: #fff; filter: alpha(opacity=100); opacity: 1; }
.focusBox .prev, .focusBox .next { width: 50px; height: 90px; margin: -60px 0 0; display: none; border-radius: 10px; background: url(../images/ad_ctr.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; filter: alpha(opacity=20); opacity: 0.2; }
.focusBox .prev { left: 0; }
.focusBox .next { background-position: -10px -90px; right: 0; }
.focusBox .prev:hover, .focusBox .next:hover { filter: alpha(opacity=50) !important; opacity: 0.5 !important; }
/* product */
#product { overflow: hidden }
#product .intro a { text-decoration:none; color:#999; }
#product li { padding: 0; margin:0 7px; border:1px solid #ccc; color: #fff; text-align: center; border-radius:12px; }
#product img { width:100%; margin:0 auto; border:none; height:auto; }
#product a:hover img { border-color: #003895; }
.procat dt,
.procat dd { border:1px solid #ccc; border-radius:5px; margin:10px 0; text-align:center; height:24px; line-height:24px; }
.procat dt { border-color:#e41e35; background-color:#e41e35; color:#fff; height:28px; line-height:28px; font-size:16px; margin-bottom:20px;font-weight:bold; }
.procat dd a { text-decoration:none; color:#000; }
.procat dd.on { border-color: #003895; background-color:#003895; }
.procat dd.on a { color:#fff; }
/* about */
#about { padding:20px 0; }
#about img { border:1px solid #cccccc; border-radius:12px; float:left; margin-bottom:20px; margin-right:40px; max-width:96%; }
#about p { margin-bottom:20px; font-size:16px; line-height:1.8; color:#000}
#about p.more { text-align:center }
/* advantage */
.bg-advantage { padding-bottom:40px; background:url(../images/insd3.png) center 0 repeat; }
#advantage .boxbg { padding:30px; border:1px solid #ccc; border-radius:10px; background:rgba(255,255,255,.6); box-shadow:5px 5px 5px rgba(0,0,0,.4)}
#advantage .content {position:relative; height:810px; background-size:360px;background-repeat:no-repeat;background-position:160px 215px;}
#advantage li { width: 260px; height:auto; padding-bottom:20px; overflow: hidden; position:absolute;  }
#advantage li .title { font-size:22px; margin-top:10px; line-height:35px; }
#advantage li .description { color:#000; font-size:16px; }
#advantage li.item1 { right:0; top:225px; width:135px;}
#advantage li.item2 { left:195px; top:0;}
#advantage li.item3 { left:0; top:190px; width:140px;}
#advantage li.item4 { right:120px; bottom:0;}
#advantage li.item5 { left:20px;bottom:80px; width:220px; }

/* case */
.bg-case { padding-bottom:40px; background:url(../images/subbg1.jpg) center 0 repeat-x; color:#fff; }
#case .title { color:#fff; }
#case .entitle { color:#f90; }
#case .intro { color:#666; }
#case .content { margin-left:80px; }
#case li { width: 257px; height:257px; padding: 3px; border: 1px solid #ccc; border-radius:10px; margin-right: 21px; background:#fff; overflow: hidden; }
#case li img { width: 257px; height:auto; border: none; border-radius:8px; }
#case li a:hover img , #honor li a:hover img { width: 255px; height: auto; }
#case li .title a:hover, #honor li .title a:hover { color: red; }
/*honor*/
#honor li { width: 257px; height: auto; padding: 5px; margin-right: 21px; background:#fff; overflow: hidden }
#honor li .title { display:none; }
#honor li img { width: 257px; height:auto; border: none; }
/* customer */
#customer li { list-style:none; float:Left; margin:6px 12px; padding:0; }
#customer li img { width:202px; }
/* news */
.bg-news { padding:35px 0; background:url(../images/insd4.png) center center repeat; }
.arcbox { font-size:16px; }
.arcbox .thumb img { border: 1px solid #ccc; float: right; border-radius:12px; }
.arcbox h4, .arcbox p, .arcbox ul { float: left; width: 600px; }
.arcbox ul, .arcbox li { list-style: inside; }
.arcbox li { padding: 3px 0; overflow: hidden; white-space: nowrap; margin-right: 2%; }
.arcbox li a { white-space: nowrap; }
/* power */
.bg-power { background:url(../images/subbg2.jpg) center center repeat-x; color:#fff; padding:20px 0; }
#power .title { color:#fff; }
#power .entitle { color:#f90; }
#power .intro { color:#ccc; }
#power li { width: 127px; height: 105px; float: left; margin: 20px 20px 0 0; padding-left: 140px; padding-top: 30px; border: 1px solid #ccc; border-radius: 6px; text-align: left; background: #fff url(../images/icon.png) 0 0 no-repeat; color: #999; line-height: 1.4; }
#power .year { background-position: 32px 33px; }
#power .customer { background-position: 32px -267px; }
#power .case { background-position: 32px -567px; width: 137px; padding-left: 130px; }
#power .area { background-position: 32px -867px; width: 137px; padding-left: 130px; margin-right: 0; }
#power li strong { clear: left; font-size: 45px; color: #000; }
/* flink */
#flink ul span { padding:10px 20px;}
#flink a { color:#000; text-decoration:none; }
#flink a:hover { color:#003895; text-decoration:underline; }
@media screen and (max-width: 768px) {
/*focusBox*/
.focusBox { height: 300px; }
.focusBox .pic a { height: 300px; background-size: auto 300px; }
/* slideGroup */
#news, #product { margin: 10px; }
#news .thumb .more { margin-bottom: 2em; }
.arcbox li { border-bottom:1px dashed #ccc; }


/* advantage */
#advantage .content {background-size:220px; height:auto; background-position:center top; }
#advantage li.item1,
#advantage li.item2,
#advantage li.item3,
#advantage li.item4,
#advantage li.item5 { width: 96%; height:auto; overflow: hidden; position:relative; left:0; top:0; right:0; bottom:0;  }
#advantage li.item1 { margin-top:220px; }
/* product */
#product img { width: 100%; height:300px; }
/* power */
#power li, #power .case, #power .area { width:28%; margin: 2%; padding:120px 8% 0; text-align:center; }
#power .case { width:36%; padding:120px 4% 0; }
#power .year { background-position: 60% 33px; }
#power .customer { background-position: 60% -267px; }
#power .case { background-position: 70% -567px; }
#power .area { background-position: 70% -867px; }
/* customer */
#customer li { width:45%; margin:2%; } 
#customer li img { width:100%; height:auto; } 
/* case */
#case { overflow: hidden; }
#case .content { margin-left:0; }
.bot-contact,
#tongji { display:none; }
}

@media screen and (max-width: 414px) {
.focusBox { height: 200px; }
.focusBox .pic a { height: 200px; background-size: auto 200px; }
/* slideGroup */
.slideGroup h3 span .title { width:49%;margin:0.5%;padding:0; text-align:center; }
#news .thumb .more { margin：0.5em 0 2em; height:45px; border-bottom:1px dotted #ccc; }
.arcbox li { width: 98%; }
.box .thumb h4, .box .thumb p { width: 98%; margin:0.5em 0;}
.arcbox .thumb img { width:100%; height:auto;}
/* product */
#product img { width: 98%; height:auto!important; }
#product .hd {bottom:80px}
}
