@charset "utf-8";
@import url(reset.css);

/*
========================
Global
========================
*/
html, body	{}
#container	{}
.wrapper 	{}
.inner		{}

a			{}
strong		{ font-weight:bold; }
em			{ font-style:italic; }

form fieldset				{ border:1px solid #ccc; padding:25px 20px 10px 20px; }
form p						{ margin-bottom:15px; }
form p label				{ margin-bottom:8px; display:inline-block; }
form select,
form input[type="text"],
form input[type="email"],
form input[type="password"],
form input[type="submit"],
form input[type="button"]	{ border:1px solid #aaa; font-size:1em; font-family:inherit; box-sizing:border-box; border-radius:3px; }
form input[type="submit"]	{ border:none; background:#000; color:#fff; padding:8px 0; border-radius:5px; cursor:pointer; }
form input[type="button"]	{ border:none; background:#ccc; color:#666; padding:6px 8px; border-radius:5px; cursor:pointer; }

form .error					{ color:#c00; margin-top:5px; padding-bottom:10px; display:block; text-align:left; }

/*
========================
Font
========================
*/
html, body 				{ font-family:"Heiti TC", "微軟正黑體", "Microsoft JhengHei", "新細明體", "Microsoft YaHei", "Helvetica Neue", Helvetica, "Segoe UI", "Lucida Grande", "Lucida Sans Unicode", "Arial", sans-serif; font-size:14px; -webkit-text-size-adjust:none; }

/*
========================
Header
========================
*/
#header-wrapper			{ height:60px; box-sizing:border-box; position:relative; }
#header-wrapper.border	{ border-bottom:1px solid #ccc; }
#header-inner			{ height:100%; margin:0 20px; }
#header-inner .logo.big	{ height:40px; float:right; margin-top:14px; }
#header-inner .logo.small { height:30px; margin-top:14px; }

#search-form 			{ position:absolute; left:319px; top:0; border-left:1px solid #ccc; padding:12px 0 0 15px; height:48px; }
#search-form label		{ display:inline-block; margin-right:8px; }
#search-form select		{ padding:5px 5px; background:#efefef; }
#search-form input[type="text"]	{ width:160px; padding:6px 7px; background:#efefef; }
#search-form input[type="submit"]	{ padding:6px 8px; }

#toolbar				{ position:absolute; right:0; top:0; }
#toolbar a				{ float:left; color:#666; text-decoration:none; display:block; width:90px; text-align:center; 
							border-left:1px solid #ccc; height:60px; line-height:55px; box-sizing:border-box; font-size:1.05em; }
#layer-list				{ position:absolute; right:0; top:59px; width:270px; border:1px solid #ccc; background:#fff; box-sizing:border-box; z-index:999; display:none; z-index:1000; }
#layer-list li			{ border-bottom:1px solid #ccc; padding:10px 8px; }	
#layer-list li input	{ margin-right:10px; vertical-align:text-bottom; }						

/*
========================
Nav
========================
*/
#nav-wrapper			{}
#nav-inner				{}

/*
========================
Main
========================
*/
#main-wrapper			{}
#main-inner				{ width:96%; max-width:1280px; margin:auto; padding-top:30px; }

#panel					{ position:absolute; left:0; top:60px; bottom:0; width:320px; border-right:1px solid #ccc; box-sizing:border-box; }
#panel-header			{ height:50px; padding:15px 0 0 15px; border-bottom:1px solid #ccc; box-sizing:border-box; background:#efefef; }
#panel-header h2		{ font-size:1.15em; margin-right:10px; display:inline-block; font-weight:bold; }
#panel-header p			{ display:inline-block; color:#666; }
#panel-header .back		{ text-decoration:none; color:#666; display:inline-block; margin-top:2px; }
#panel-header .print	{ float:right; margin-right:15px; opacity:.5; }
#panel-header .print:hover	{ opacity:1; }
#panel-header .print img	{ height:18px; }
#panel-body				{ position:absolute; left:0; top:50px; bottom:0; width:100%; overflow:hidden; }
#panel-body	.header		{ height:50px; padding:18px 0 0 15px; border-top:1px solid #ccc; box-sizing:border-box; background:#efefef;}
#panel-body	.header h3	{ margin-right:10px; display:inline-block; font-weight:bold; color:#666; }

#index-list li p		{ padding:15px 15px; border-bottom:1px solid #ccc; font-size:1.1em; position:relative; cursor:pointer; background:#fefefe; }
#index-list li ul p		{ padding-left:25px; }
#index-list li ul ul p	{ padding-left:35px; }
#index-list li ul ul ul p	{ padding-left:45px; }
#index-list li ul ul ul p span	{ display:none; }
#index-list li p:hover,
#index-list li.active > p	{ background:#dfdfdf; }
#index-list li p span	{ position:absolute; right:15px; top:50%; margin-top:-10px; font-size:1.1em; }

#result-list li			{ border-bottom:1px solid #ccc; box-sizing:border-box; padding:18px 15px 10px 15px; cursor:pointer; background:#fefefe; }
#result-list li:hover	{ background:#dfdfdf; }
#result-list dt			{ font-weight:bold; width:60px; float:left; margin-bottom:6px; line-height:1.4em; }
#result-list dd			{ margin-left:70px; margin-bottom:6px; line-height:1.4em; }

#case-info				{ padding:20px; }
#case-info dt			{ width:105px; float:left; font-weight:bold; margin-bottom:10px; }
#case-info dd			{ margin-left:105px; margin-bottom:10px; line-height:1.4em; }
#file-list				{ border-top:1px solid #ccc; }
#file-list li			{ border-bottom:1px solid #ccc; }
#file-list li a			{ display:block; text-decoration:none; color:#666; padding:12px 20px; background:#fefefe; }
#file-list li a:hover	{ background:#dfdfdf; }

#map					{ position:absolute; left:320px; top:60px; right:0; bottom:0; background:#ddd; }
#show-related-case		{ position:absolute; right:20px; top:80px; padding:6px 8px 6px 5px; border:1px solid #ccc; border-radius:2px; 
							background:#fff; color:#333; z-index:999; box-shadow:0 0 2px rgba(0,0,0,.5); }
#show-related-case input{ margin-right:5px; vertical-align:text-bottom; }



/*
========================
Footer
========================
*/
#footer-wrapper			{}
#footer-inner			{}


/*
========================
Page
========================
*/
/* login.php */
#login-form { margin:auto; width:90%; max-width:360px; margin-top:160px; text-align:center; }
#login-form fieldset	{ text-align:left; }
#login-form img.logo	{ }
#login-form img.title	{ margin-bottom:30px; }
#login-form input[type="text"],
#login-form input[type="password"],
#login-form input[type="submit"] { width:100%; padding:7px 3%; background:#f7f7f7; }
#login-form input[type="submit"]	{ width:70px; margin:auto; display:block; background:#000; }
#login-form .error	{ text-align:right; }

/* statistics.php */
#statistic-filter			{}
#statistic-filter .set		{ overflow:hidden; zoom:1; margin-bottom:20px; }
#statistic-filter .title	{ width:60px; float:left; padding:10px 0; }
#statistic-filter ul		{ margin-left:80px; overflow:hidden; zoom:1; font-size:1.1em; }
#statistic-filter li		{ display:block; float:left; padding:10px 12px; border:1px solid #ccc; color:#666; margin-right:5px; margin-bottom:5px; font-size:1.02em; cursor:pointer; }
#statistic-filter li:hover	{ background:#f7f7f7; }
#statistic-filter li.active	{ background:#666; border:1px solid #fff; color:#fff; }
#statistic-filter .set.secondary li	{ font-size:.95em; }
#statistic-filter .back		{ margin-left:20px; }
#statistic-filter .back a	{ display:inline-block; padding:10px 12px; border:1px solid #ccc; color:#666; font-size:1.02em; text-decoration:none; }
#statistic-filter .back a:hover { background:#f7f7f7; }
#statistic-graphic			{ margin-bottom:60px; }

.statistics-project-list				{ display:table; margin:60px 1.5% 90px 2.5%; width:96%; }
.statistics-project-list .row			{ display:table-row; }
.statistics-project-list .col			{ display:table-cell; padding:1em .8em; line-height:1.4em; border-bottom:1px solid #ddd; vertical-align:middle; }
.statistics-project-list .header .col	{ background:#f3f3f3; border-bottom:none; }
.statistics-project-list .year 			{ width:10%; }
.statistics-project-list .no 			{ width:20%;}
.statistics-project-list .land			{}
.statistics-project-list .view 			{ width:10%; text-align:right; }
.statistics-project-list .view a		{ color:#777; text-decoration:none; }
.statistics-project-list .view a:hover  { color:#333; }

/* for 1440px or less */ 
@media screen and (max-width: 1440px) {
#search-form 			{ left:279px; }
#search-form select		{ max-width:135px; }
#search-form input[type="text"] { max-width:120px; }
#toolbar a				{ width:70px; }
#panel					{ width:280px; }
#map					{ left:280px; }
}

/* for 1280px or less */ 
@media screen and (max-width: 1280px) {
#search-form 			{ left:239px; }
#search-form select		{ max-width:80px; }
#search-form input[type="text"] { max-width:110px; }
#panel					{ width:240px; }
#map					{ left:240px; }
}