@charset "utf-8";

/*-[ Framework ]--------------------*/
body{line-height:23px;font-size: 13px;font-family:"微軟正黑體";color: #4B4B4B;}

::-moz-selection{background:#333;color:white;text-shadow:none;}

::selection{background:#333;color:white;text-shadow:none;}

#page,.container {margin-right: auto;margin-left: auto;overflow: hidden;}

h1,h2,h3,h4,h5,h6{font-weight:normal;color: #777;}

.imgall{width:100%;}

.fl{ float:left}
.fr{ float:right;}


a{text-decoration:none;color: #565656;}
a:hover{color:#000;}
a:link, a:visited, a:active{text-decoration:none;}
:target{padding-top:20px;}

.line{width:100%;}

.blank30{ height:30px;}

.wrap{width:100%;}



/*-[ Main container ]---------------*/
.container{width:90%;min-width:320px; max-width:1100px;overflow:visible;margin-left:auto; margin-right:auto; }


/*-[ Header ]-----------------------*/

header{width: 100%; background-color:#545B6B; background-image:url(../images/bg_all.jpg);}
#logo{float:left; margin-top:80px; margin-bottom:30px;}

/* Navigation */
nav#global 
       {width:70%; float:right;height:auto;margin:0px; font-size:16px; position:relative;  z-index:999;  margin-top:90px;}

nav#global ul {display: table;text-align: center;height: auto;margin: 0 auto;width:100%;}
nav#global ul li {float:left;position: relative; display: inline;height:36px;line-height:36px;text-align:center;border:0px red solid; padding:0px 15px 0px 15px;}
nav#global ul li a{ color:#fff;}
nav#global ul li a:hover{color:#fff; font-weight:bold;border-top:solid 3px #ccc;}

/*
nav#global ul li:hover ul {display:block}
nav#global ul li ul {
    position: absolute;top: 35px;left: 5px;width:180px;height:auto;background:#F9F1FF;opacity:0.85;display:none; border:solid 1px #ccc; }
nav#global ul li ul li {display: block;width:155px;height:30px;line-height:30px;padding:0 5px 5px 20px;border-bottom:1px #000 dotted;text-align: left;margin: 0 auto;}
nav#global ul li ul li a {color:#6b6b6b;font-weight:normal;height: 0;line-height: 0;width: 150px;}
nav#global ul li ul li:hover{background:none}
nav#global ul li ul li:hover a {color:#9858C7;font-weight:normal}*/

.line1{ height:18px; background-color:#DDDDDD;}

/**最新消息**/
.box{margin-top:40px;}
.news{ float:left;width:45%;}
.news h3{height:40px; line-height:40px; background-color:#898989; color:#fff; font-size:18px; text-indent:15px; font-weight:bold;}
.news h3 b{ font-size:14px; margin-left:15px;}

.news ul{ margin-top:10px; background-color:#898989; padding-top:10px; padding-bottom:10px;}
.news ul li{ margin-bottom:1px;  line-height:40px; color:#fff; font-size:15px; border-bottom:solid 1px #ccc;}
.news ul li span{ float:left;width:80px; padding-left:30px;}
.news ul li a{ float:left; color:#fff; padding-right:10px; margin-left:30px;}
.news ul  li:last-child{ border-bottom:none;}

.news2 { margin-top:40px;}
.news2 ul{ margin-top:10px; background-color:#898989; padding-top:10px; padding-bottom:10px;}
.news2 ul li{ margin-bottom:1px;  line-height:40px; color:#fff; font-size:15px; border-bottom:solid 1px #ccc;}
.news2 ul li span{ float:left;width:80px; padding-left:30px;}
.news2 ul li a{ float:left; color:#fff; padding-right:10px; margin-left:30px;}
.news2 ul  li:last-child{ border-bottom:none;}

/**優質個案**/
.case{ float:right;width:45%;}
.case h3{height:40px; line-height:40px; background-color:#898989; color:#fff; font-size:18px; text-indent:15px; font-weight:bold;}
.case h3 b{ font-size:14px; margin-left:15px;}

.case p{margin-top:10px;width:100%;}
/*********圖片滾動***********/
#flexiselDemo3 {
display:none;
}
.nbs-flexisel-container {
	position:relative;
	max-width:100%;
	
	
}
.nbs-flexisel-ul {
	position:relative;
	width:9999px;
	margin:0px;
	padding:0px;
	list-style-type:none;	
	text-align:center;	
	
}

.nbs-flexisel-inner {
	overflow:hidden;
	float:left;
	width:100%;
}

.nbs-flexisel-item {
	float:left;
	margin:0px;
	padding:0px;
	cursor:pointer;
	position:relative;
	line-height:0px;
}
.nbs-flexisel-item img {
	width: 100%;
	cursor: pointer;
	positon: relative;

	width:200px;
	height:105px;

}

/*** Navigation ***/

.nbs-flexisel-nav-left,
.nbs-flexisel-nav-right {
	width: 22px;
	height: 22px; 
	position: absolute;
	cursor: pointer;
	z-index: 100;
	opacity: 0.5;
}

.nbs-flexisel-nav-left {
	left: 10px;
}

.nbs-flexisel-nav-right {
	right: 5px;
	
}

/*********圖片滾動***********/

footer{ margin-top:50px; background-color:#403A3A;}
.contact{ float:left; color:#fff;}
.copyright{ float:left; color:#fff; margin-left:40px;}

.condi{width:90%;min-width:320px; max-width:1100px;overflow:visible;margin-left:auto; margin-right:auto; position:relative;}


#top{ position:absolute;right:0; bottom:0;}
#top img{ display:block;}

/******************************************************* 內頁開始 *********************************/
.sub_ad{ position:relative;}
.sub_ad img{ display:block; width:100%;}
.sub_ad section{width:100%;text-align:center; height:30px; line-height:30px; position:absolute;top:0; left:0; background-image:url(../images/bg_title.png); color:#e8e9e9;}
.sub_ad section a{ color:#e8e9e9;}
.sub_ad section a:hover{ color:#D15428;}
.sub_ad section b{ margin-left:5px; margin-right:5px;}


/*** 標題開始 **/
.title{ margin-top:10px; margin-bottom:25px;}

.title h3{  padding-bottom:3px;}
.title h3 strong{ float:left; font-size:36px; font-weight:lighter; color:#a8a8a8;}
.title h3 b{ color:#565656; float:left; font-size:18px; line-height:18px; margin-left:10px; margin-top:10px;}
.title h3 span{ float:right; margin-right:10px;}
.title h3 span a{ color:#D15428;}

.content{ font-size:15px; line-height:30px;}

/********新聞列表*************/

.newslist{}
.newslist li{width:32%; float:left; margin-right:2%; margin-top:20px;}
.newslist li div{width:100%; position:relative;}
.newslist li img{width:100%; display:block;}
.newslist li div span{ position:absolute; bottom:0; height:30px; line-height:30px; background-image:url(../images/bg_title.png); color:#fff; display:block;width:100%; text-indent:15px; left:0; font-weight:bold;}
.newslist li strong{ background-color:#3F3939; display:block;padding:15px; color:#fff; font-size:18px; line-height:36px; min-height:110px;}
.newslist li strong b{ color:#777576; display:block; font-size:14px; font-weight:lighter}
#mr{ margin-right:0%;}

/**注冊表單**/
.formBox {margin-top: 25px;color: #2f2f2f;font-size: 13px;width:80%; margin-left:auto; margin-right:auto; }

.formBox2 {margin-top: 25px;color: #2f2f2f;font-size: 13px;width:60%; margin-left:auto; margin-right:auto;}
.form2 { margin-top:15px;}
.form2 label {display: inline-block;width: 110px;text-align: right;margin-right: 5px;font-family: "微軟正黑體", "LiHei Pro", "新細明體", sans-serif;font-size: 15px;color: #000;}
.form2 label em {color: #D3542B;font-style: normal;font-weight: normal; margin-right:3px;}
.form2 input[type="text"], .formBox2 .form2 input[type="password"]{box-sizing: border-box;-moz-box-sizing: border-box;width: 300px;padding: 5px;height: 35px;
line-height: 35px;border: 1px solid #ccc;border-radius: 3px;}

.form {margin-bottom: 25px;color: #2F2F2F;padding: 0 30px;}
.form label {display: inline-block;width: 110px;text-align: right;margin-right: 5px;font-family: "微軟正黑體", "LiHei Pro", "新細明體", sans-serif;font-size: 15px;color: #000;}
.form label em {color: #D3542B;font-style: normal;font-weight: normal; margin-right:3px;}
.form input[type="text"], .formBox .form input[type="password"]{box-sizing: border-box;-moz-box-sizing: border-box;width: 300px;height: 35px;
line-height: 35px;border: 1px solid #ccc;border-radius: 3px;}
.form font{ margin-left:10px; color:#808080;}
.form select {box-sizing: border-box;-moz-box-sizing: border-box;padding: 5px;height: 35px;border: 1px solid #ccc;border-radius: 3px;}

.yuan{color: #D3542B;font-style: normal;font-weight: normal; margin-right:3px; font-size:8px;}

/**注冊表單**/





#imgbig{ display:block}
#imgxiao{ display:none;}

/**********建案列表 *****/

.caselist{}
.caselist li{width:32%; float:left; margin-right:2%; margin-top:20px;}

.caselist li div{width:100%; position:relative;}

.caselist li div span{ position:absolute; bottom:0; height:30px; line-height:30px; background-image:url(../images/bg_title.png); color:#fff; display:block;width:100%; text-indent:15px; left:0; font-weight:bold;}
.caselist li img{width:100%; display:block;}
.caselist li strong{  display:block;font-size:18px; line-height:36px; margin-top:20px;}
.caselist li p{ display:block; font-size:14px; height:50px; color:#B0B0B0}

.casedetail{}
.casedetail span{ float:left;width:40%; border:solid 1px #ccc; text-align:center; padding:10px; background-color:#e8e8e8; display:block;}
.casedetail span img{height:300px}
.casedetail dl{ float:left;width:54%; margin-left:3%;}
.casedetail dl dt{ border-bottom:dotted 1px #ccc;}
.casedetail dl dd{ padding-top:20px;}

.btn{ background-color:#535A6A; color:#fff; padding:5px 20px 5px 20px;  text-align:center; letter-spacing:3px; cursor:pointer}
.btn:hover{ background-color:#535A6A; color:#fff;}

.btn2{ background-color:#D35326; color:#fff; padding:5px 20px 5px 20px;  text-align:center; letter-spacing:3px; cursor:pointer}
.btn2:hover{ background-color:#CD5025; color:#fff;}

.casepic{
	background:#1F1F1F url(../images/bg_all.jpg) repeat top left;
	color:#fff;
	font-family: 'PT Sans Narrow', Arial, sans-serif;
	font-size:14px;
	padding:20px;
	border-radius:10px;
}

.jamc{text-align:center; font-size:30px; padding-bottom:30px; padding-top:30px;}
.td1{ text-align:right; padding-right:30px;width:40%;}
.table1{width:70%; line-height:50px; color:#fff;}
.table1 input{ border:solid 1px #666; border-radius:5px; padding-top:5px; padding-bottom:5px;}

/***業績****/
.lishi1{ float:left;width:48%; font-size:40px;line-height:60px;}
.lishi2{ float:left;width:52%; font-size:14x; line-height:30px;}

.nianfen{}
.nianfen li{ float:left; padding-left:5px; padding-right:5px; line-height:30px; border-bottom:solid 2px #9D9D9D; margin-right:20px; margin-top:20px;}
.nianfen li:hover{border-bottom:solid 2px #C1724D}

.bigimg{ float:left;width:30%; position:relative;}
.bigimg img{width:100%; display:block; max-width:330px;}
.bigimg span{ position:absolute; bottom:0; height:30px; line-height:30px; background-image:url(../images/bg_title.png); color:#fff; display:block;width:100%; text-indent:15px; left:0; font-weight:bold;}

.imglist{ float:right;width:65%;}
.imglist h3{ border-bottom:solid 2px #000; line-height:30px; font-size:18px; font-weight:bold; color:#000; }
.imglist li{ float:left;width:45%; background-color:#CACACA; margin-top:20px; margin-right:2%; padding:10px; cursor:pointer; height:100px;}
.imglist li img{ float:left;width:45%; max-height:100px; margin-right:10px; max-width:122px;}
.imglist li p{ float:left;width:45%;}

/***聯絡我們***/
.htmlimg3{ float:right;width:68%; background-color:#ECECEC}
.htmlimg4{ float:left;width:30%;}

.lylr{box-sizing: border-box;-moz-box-sizing: border-box;width: 300px;padding: 5px;height: 100px;
line-height: 35px;border: 1px solid #ccc;border-radius: 3px; background-color:#fff; color:#000;overflow:hidden}

.leirong{ font-size:15px; line-height:30px; margin-top:10px;}

.sub2{width:75%; float:left;}
.categ{ margin-top:35px;  float:right;width:21%;}

.categ h3{ font-size:18px; padding:0px 15px 0px 25px;  color:#000; height:30px; background-image:url(../images/title_bg.png);background-repeat:no-repeat; line-height:none;}
.categ ul{ border-bottom:none; border-top:none; }
.categ ul li{ line-height:40px; font-size:15px; padding-left:35px;background-image:url(../images/li03.jpg); background-repeat:no-repeat; }
.categ ul li a{ color:#000;}


.xwimg{ float:left;width:50%;}
.xwimg img{width:90%;}

.xwinfo{ float:left;width:50%;}
.xwtitle{ display:block; text-align:right; line-height:50px;}
.xwinfo h5{ border:solid 2px #CFD2D6; border-right:none; border-left:none; line-height:50px; font-size:18px;}
.content_xwdetail{ margin-top:15px; margin-bottom:20px; line-height:30px;}
.laiyuan{ float:left; font-weight:lighter;}
.back{ float:right;}

.pager{ padding-top:10px; padding-bottom:10px; color: #333;
	font-size: 12px; text-decoration:none; margin-left:auto; margin-right:auto; text-align:center; margin-top:30px;}

.pager a{	margin-left:5px; margin-right:5px; background-color:#CACACA; padding:3px 10px 3px 10px;}
	
.pager span{ margin-left:5px; margin-right:5px;}
.currentpage{ background-color:#CF5526; padding:3px 10px 3px 10px;}


#lishi{ display:block;}
#lishi2{ display:none;}

.jczh{ padding:3px 10px 3px 10px; background-color:#535A6C; color:#fff; vertical-align:baseline;cursor:pointer; margin-left:10px;}
.jczh:hover{ color:#fff; }


.processlist{}
.processlist li{width:42%; float:left; margin-right:2%; margin-top:20px; border:solid 1px #ccc;}


.processlist li img{ float:left; width:135px; display:block;margin:10px;}
.processlist li strong{ float:left; display:block;font-size:18px; line-height:36px; margin-top:20px;}


#tablezsy
{
	width:100%;
	border-collapse:collapse;
}

#tablezsy tr:nth-of-type(odd){
	background:#eee
}


#tablezsy th{
	background:#333;
	color:white;
	font-weight:bold;
}

#tablezsy td,th{
	padding:6px;
	border:1px solid #ccc;
	text-align:left;
}


/*-----------------------------------------------
/* Responsive
/*---------------------------------------------*/

@media screen and (max-width:1150px){

	.imglist li{width:40%; }

}


.piclistnew{}
.piclistnew li{margin-left:2%; margin-right:2%;width:21%; float:left;margin-bottom:20px;}
.piclistnew li img{width:100%;display:block;}

@media screen and (max-width:870px){
	
	
.piclistnew li{width:46%; float:left;}


	.processlist li { float:none; width:100%; text-align:center}
	#lishi{ display:none;}
#lishi2{ display:block;}
	.xwimg{ float:none;width:100%; text-align:center}
	.xwimg { max-width:400px;  margin-left:auto; margin-right:auto;}
	.xwinfo{ float:none; width:100%; margin-top:20px;}
	
	.sub2{ width:100%; float:none;}
.categ{ margin-top:40px;width:none;width:100%; float:none; }

	.lylr{box-sizing: border-box;-moz-box-sizing: border-box;width: 100%;padding: 5px;height: 100px;
line-height: 35px;border: 1px solid #ccc;border-radius: 3px; background-color:#fff; color:#000;overflow:hidden}

	.bigimg{ float:none;width:100%; display:none;}
	.imglist{ float:none; width:100%;}
	.imglist li{ float:none; width:94%;}
	
	.htmlimg3{ width:100%; float:none; display:block; margin-left:auto; margin-right:auto; padding-top:30px; padding-bottom:30px; margin-top:20px;} /**編輯區**/
.htmlimg4{ width:100%; float:none; display:block; margin-left:auto; margin-right:auto; margin-top:30px;}


	.table1{width:100%;}
	.td1{ padding-right:10px;}
.jamc{ font-size:18px; font-weight:bold}
#logo{ float:none; margin-top:0px; padding-top:30px;}
#logo img{ display:block; margin-left:auto; margin-right:auto;}
nav#global { float:none; margin-top:0px; height:auto; padding-bottom:10px;width:100%; }
nav#global ul li { width:25%; text-align:center ; padding:0px;}

.box{margin-top:20px;}
.news{ float:none; width:100%;}
.case{ float:none; width:100%; margin-top:20px;}
footer{ margin-top:20px;}
.title{margin-bottom:5px;}
.title h3 span{ margin-top:15px;}

.newslist li{width:100%; float:none; margin-right:auto; margin-top:20px; margin-left:auto; max-width:377px;}
#mr{ margin-right:auto;}


.formBox {color: #2f2f2f;font-size: 13px; width:100%; margin-left:auto; margin-right:auto;}

.formBox2 {color: #2f2f2f;font-size: 13px; width:80%; margin-left:auto; margin-right:auto;}
.form2 label {width: auto;display: block;margin-bottom: 0px;text-align: left; margin-top:0px; padding:0px;}
.form2{ margin-top:10px;}
.form2 input[type="text"], .formBox2 .form2 input[type="password"] {width: 100%;}

.form label {width: auto;display: block;margin-bottom: 5px;text-align: left;}
.form input[type="text"], .formBox .form input[type="password"] {width: 100%;}

#imgbig{ display:none}
#imgxiao{ display:block;}

.caselist li{width:100%; float:none; margin-right:auto; margin-top:20px; margin-left:auto; max-width:330px;}

.casedetail span{ float:none;width:95%; border:solid 1px #ccc;}
.casedetail span img{max-width:300px;  margin-left:auto; margin-right:auto; display:block;}

.casedetail dl{ float:none;width:100%; margin-left:0%;}

.lishi1{ float:none;width:100%; font-size:30px;line-height:60px; display:block}
.lishi2{ float:none;width:100%; font-size:18x; line-height:30px;}
}

@media
only screen and (max-width:760px),(min-device-width:768px) and 
(max-device-width:1024px)
{
	#tablezsy thead{ display:block;}
	#tablezsy tbody{ display:block;}
	#tablezsy th{ display:block;}
	#tablezsy td{ display:block;}
	#tablezsy tr{ display:block;}
	
	#tablezsy thead tr{ position:absolute; top:-9999px; left:-9999px;}
	
	#tablezsy tr{ border:solid 1px #ccc;}
	
	#tablezsy td{ border:none; border-bottom: 1px solid #eee; position:relative; padding-left:50%;}
	
	#tablezsy td:before{ position:absolute; top:6px;left:6px;width:45%; padding-right:10px; white-space:nowrap;}
	
	#tablezsy td:nth-of-type(1):before{content:"申請單號";}
	#tablezsy td:nth-of-type(2):before{content:"報修申請日";}
	#tablezsy td:nth-of-type(3):before{content:"項目位置內容說明";}
	#tablezsy td:nth-of-type(4):before{content:"服務人員";}
	#tablezsy td:nth-of-type(5):before{content:"服務日期";}
	#tablezsy td:nth-of-type(6):before{content:"預定完成";}
	#tablezsy td:nth-of-type(7):before{content:"完成日期";}
}