@charset "utf-8";

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
 所有設備共同的樣式及手機、小型平板版型
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/*==========================================
 body
===========================================*/
body { width: 100%;  background-color:#FFF;  color:#000;}
a {  color:#000;  text-decoration:none;font-family: Arial, Helvetica, sans-serif;}
a:hover {  color:#333;  text-decoration:underline;}
/*==========================================
 header style
===========================================*/
header {  text-align:center;border-top: 3px solid #888; background-color:#ddd}
header h1 {  font-size:1.5em;  margin:0 auto;  padding:10px 5px 10px 5px;  width:90%;}
header h1 img {  width:100%;  max-width:265px;}
header {  position:relative;  overflow:hidden;}
header ul#s_nav {  margin-bottom:10px;  position:relative;  left:50%;  float:left;}
header ul#s_nav li {  float:left;  position:relative;  left: -50%;}
header ul#s_nav li a {  display:block;  font-size:1.1em;  margin-right:10px;  padding-left:10px;}
header ul#s_nav li.contact a {  background:url(../images/icn_contact.jpg) no-repeat left center;}
header ul#s_nav li.news a {  background:url(../images/icn_news.jpg) no-repeat left center;}
header ul#s_nav li.sitemap a {  background:url(../images/icn_sitemap.jpg) no-repeat left center;	}
header p {  width:100%;}
header p img {  width:100%;  height:auto;  max-width:960px;}

/*==========================================
  global navigation style
===========================================*/
nav ul {  margin-bottom: 10px;}
nav ul li {  text-align: center;  float: left;  width: 50%;  border-bottom: 1px solid #000;border-top: 0px solid #000;background-color:#eff;}
nav ul li:nth-child(odd) {  width: 49%;  border-right: 1px dotted #000;}
nav ul li a{  font-size:1em; display: block;  width: 100%;padding:5px 2px 5px 2px; }
/* 用以設定當前選擇項目的class */
.active {background-color:#FF9;}


/*==========================================
 content area style
===========================================*/
div#contents {  background: url(../images/bg_footer..jpg) no-repeat bottom;  padding-bottom: 90px;}
/*==========================================
 content area -> WORKS
===========================================*/
div#contents section#work h2 {font-size:1.2em;margin:0 0 12px 5px;}
div#contents section#work h2 a {border-bottom:dotted 1px 000;line-height:1.2em;}
div#contents section#work h2 a:hover{color:#090;text-decoration:none;}
.mark {max-width:20px;} 
.imgg {width:100%;  height:auto;  max-width:520px;margin:5px;}
.imgg2 {width:40%;  height:auto;  max-width:130px;margin:5px;}
.imgg3 {width:100%;  height:auto;  max-width:420px;margin:20px;}

div#contents section#work path {margin:0 0 15px 5px;}
div#contents section#work top {text-align:left;width:90%;min-width:120px;float:left;line-height:1.6em;}
div#contents section#work top a{color:#009;line-height:1.8em;text-decoration:none;font-family: Arial, Helvetica, sans-serif;border-bottom:dotted 1px orange; }
div#contents section#work top a:hover {color:#C00;}

/*關於我們*/
div#contents section#work abu {font-size:1.1em;text-align:left;width:85%;min-width:120p;margin:25px;line-height:1.4em;font-family: Arial, Helvetica, sans-serif;}
div#contents section#work abu a{color:#007700;text-decoration:none;border-bottom:dotted 1px orange;line-height:1.7em;}
div#contents section#work abu p{color:#000;margin-bottom:10px;margin-left:5px;margin-right:18px;}
div#contents section#work abu a:hover {color:#ff8800;}
div#contents section#work abu h5{font-size:1.1em; font-weight:bold;color:#933;line-height:1.5em;text-decoration:none;border-bottom:dotted 1px #000;}

div#contents section#work p.style50{color:#009;line-height:1.6em;text-decoration:none;font-family: Arial, Helvetica, sans-serif; }
div#contents section#work p.style50 a:hover{color#ff8800;line-height:1.6em;text-decoration:none;font-family: Arial, Helvetica, sans-serif; }

div#contents section#work a2 {text-align:left;width:90%;min-width:120px;float:left;margin-bottom:30px;line-height:2em;}
div#contents section#work a2 a{color:#009;line-height:2em;text-decoration:none;font-family: Arial, Helvetica, sans-serif;border-bottom:dotted 0px orange;}
div#contents section#work a2 a:hover {color:#090;}
div#contents section#work a2 th{color:#000; border-bottom:dotted 1px #000;}
div#contents section#work a2 td{color:#000; border-bottom:dotted 1px #aaa;}
/*子目錄樣式1*/
div#contents section#work menu {text-align:left; width:100%;min-width:100px;float:left;margin-bottom:40px;}
div#contents section#work menu a{ font-weight:600; color:#03C;line-height:1.7em;text-decoration:none;border-bottom:dotted 1px orange;}
div#contents section#work menu a:hover {color:#C00;}

/*參考及注意事項樣式*/
div#contents section#work bot { font-weight:500;text-align:left;width:85%;min-width:120p;margin:20px;line-height:1.3em;}
div#contents section#work bot a{ font-weight:bold;color:#007700;text-decoration:none;border-bottom:dotted 1px orange;line-height:1.7em;}
div#contents section#work bot p{color:#000;margin-bottom:8px;}
div#contents section#work bot a:hover {color:#ff8800;}
div#contents section#work bot h5{font-size:1.1em; font-weight:bold;color:#933;line-height:1.5em;text-decoration:none;border-bottom:dotted 1px #000;}
/*設定頁尾圖片*/
div#contents section#work bot h6 {font-size:1em;color:#2d444f;background-color:#ccc;padding-top:9px;padding-bottom:3px;text-align:center;min-width:80px}
div#contents section#work bot img {width:100%;  height:auto;  max-width:90px;}

div#contents section#work bot p.style5 {margin-left:50px; width:80%; color:#3399CC;}
div#contents section#work bot p.style6 {margin-left:50px; width:80%; color:#FF9900;}
div#contents section#work bot p.style7 {font-weight:bold;}

div#contents section#work article {text-align:center;width:90%;min-width:120px;float:left;  margin-bottom:30px;}
div#contents section#work article img {width:100%;  height:auto;  max-width:184px;}
div#contents section#work article h3 {font-size:1.2em; font-weight:bold;}
div#contents section#work article h4 {font-size:1.1em; font-weight:bold;}
div#contents section#work article p {text-align:left;  font-size:1em;line-height:1.5em;  padding:0 15px;display:none; width:85%;font-family: Arial, Helvetica, sans-serif;}
div#contents section#work article h5 {color:#007700;line-height:2em;}

div#contents section#work art {text-align:center;width:90%;min-width:140px;float:center;  margin-bottom:40px;margin-top:5px;}
/*光譜圖設定*/
div#contents section#work art img {width:100%;  height:auto;  max-width:350px;margin-top:30px;}

div#contents section#work art h3 {font-size:0.95em;  font-weight:bold;margin-bottom:6px;margin-top:10px;font-family: Arial, Helvetica, sans-serif;}
div#contents section#work art h4 {font-size:1.1em; font-weight:bold;margin-bottom:6px;margin-top:10px;font-family: Arial, Helvetica, sans-serif;}
div#contents section#work art p { font-weight:500;text-align:left;font-size:1em;line-height:1.5em;
padding:0 15px;border:1px solid #ccc;width:80%;}
div#contents section#work art p.style1 {line-height:1.5em;border:1px solid #ccc; padding:0 15px; width:80%; font-size:0.85em;color:#00C}
  div#contents section#work art p.style2 {line-height:1.8em;border:1px solid #ccc;float:right; width:58%;padding-left:10px; letter-spacing:0.1em; font-size:0.8em;color:#C60;}
div#contents section#work art p.style3 {line-height:1.5em;border:1px solid #ccc; padding:0 0px; width:20%; font-size:0.85em;color:#00C;text-align:left;background-color:#eee;}

div#contents section#work art p.style4 {text-align:left;font-size:0.9em;line-height:1.5em;
padding:0 15px;width:80%;border:1px solid #ccc;width:80%;}
div#contents section#work art p.style4 {line-height:1.5em;border:1px solid #ccc; padding:0 0px; width:20%; font-size:0.85em;color:#00C;text-align:left;background-color:#eee;}
div#contents section#work art p.style4 a:hover {color:#ff8800;}

div#contents section#work art p.style5 a {color:#007700;text-decoration:none;border-bottom:dotted 1px orange;}
div#contents section#work art p.style5 a:hover {color:#ff8800;}

div#contents section#work table  {font-size:1.0em; line-height:1.6em;}
div#contents section#work tr.item {font-weight:500; color:#03C;line-height:1.5em;text-decoration:none;border-bottom:dotted 1px #ddd;}
div#contents section#work tr.item a{color:#00C;padding:0px;;text-decoration:none; }
div#contents section#work tr.item a:hover {color:#ff8800;}
div#contents section#work tr.item a:active {color:#ff8800;}

div#contents section#work tr.item2 {color:#000;line-height:1.5em;border-bottom:dotted 1px #ddd;}
div#contents section#work tr.item2 a{color:#000;padding:0px;}

.style10 {font-size: 1.25em;color:#F70; margin-left:15px; line-height:1.3;font-family: Arial, Helvetica, sans-serif;}
.style11 {font-size: 1.25em;color:#000; margin-left:15px; line-height:1.5;font-family: Arial, Helvetica, sans-serif;}
.style12 {font-size: 0.9em;color:#444; margin-left:15px; line-height:1.4;font-family: Arial, Helvetica, sans-serif;}
.style13 {font-size: 1.1em;color:#000; margin-left:5px;margin-bottom:8px;margin-top:8px; line-height:1.4;font-family: Arial, Helvetica, sans-serif;}
.style14 {font-size: 1.15em;color:#f70; margin-left:5px;margin-bottom:8px;margin-top:8px; line-height:1.4;font-family: Arial, Helvetica, sans-serif;}

/*=========================================
  page top button style
===========================================*/
a#pagetopBtn img {position:fixed;  bottom:10px;  right:1px;}
/*==========================================
 footer style
===========================================*/
footer {border-top: 3px solid #009; background-color:#eFF;}
footer div {margin: 2px 10px 10px 20px;}
footer div p {font-size:0.9em;line-height: 2.0em; text-align: left;}
footer div small {font-size: 0.9em;text-align: left;}

/* 電腦或大型平板的版型設定：769px～960px */
@media only screen and (min-width: 769px) {
  header {    width:960px;    margin-left:auto;    margin-right:auto;  }
  header h1 {    text-align:left;    padding:15px 5px 7px 5px;    width:280px;    float:left;  }
  header h1 img {    width:100%;  }
  header ul#s_nav {    float:right;    margin-top:20px;    position:static;  }
  header ul#s_nav li {    float:left;    position:static;  }
  nav {    text-align: center;    border-bottom: 3px double #000;    margin: 10px auto 15px auto;  }
  nav ul li {text-align: center;float: left;    width: 16%;    border-bottom: none;    border-right: 1px dotted #000;  }
  nav ul li:nth-child(odd) {    width: 17%;    border-bottom: none;  }
  nav ul li.home {    border-left: none;    margin-left: 1px;  }
  nav ul li.contact {    border-right: none;  }
  nav ul li a{    display: block;  }

  div#contents section#work article {    width: 32%;  }
  div#contents section#work article img { max-width:220px;}
  div#contents section#work article h3 {    line-height: 2.0em;  }
  div#contents section#work article p {  font-size: 0.8em;    line-height: 2.0em; display:block;  }

  div#contents section#work art {width:90%;  }
  div#contents section#work art img {max-width:350px;  }
  div#contents section#work art h3 {line-height:2.0em;  }
  div#contents section#work art p {line-height:1.9em;border:1px solid #CCC; width:80%;padding-left:10px;}
  div#contents section#work art p.style1 {line-height:1.8em;border:1px solid #ccc; width:80%;padding-left:10px; letter-spacing:0.1em; font-size:0.9em;color:#00C;}
  div#contents section#work art p.style2 {line-height:1.8em;border:1px solid #ccc;float:right; width:58%;padding-left:10px; letter-spacing:0.1em; font-size:0.8em;color:#C60;}
/*設定頁尾圖片*/
div#contents section#work bot h6 {font-size:1em;color:#2d444f;background-color:#ccc;padding-top:9px;padding-bottom:3px;text-align:center;}
div#contents section#work bot img {width:100%;  height:auto;  max-width:110px;}

}

/* 電腦版型設定：961px以上固定版型 */
@media only screen and (min-width: 961px) {
  header {    width:960px;    margin-left:auto;    margin-right:auto;  }
  nav {    max-width: 960px;  }
  nav ul{    margin-left: auto;    margin-right: auto;  }
  nav ul li:nth-child(odd) {    border-bottom: none;  }
  nav ul li a{  font-size:1em; display: block;  wfont-weight:700; }
  nav ul li.home {    border-left: 1px dotted #000;  }
  nav ul li.contact {    border-right: 1px dotted #000;  }

  nav2 {    max-width: 960px;}
  nav2 ul{    margin-left: auto;    margin-right: auto; border:1px solid #ccc;  }
  nav2 ul li:nth-child(odd) {    border-bottom: none;  }
  nav2 ul li.home {    border-left: 1px dotted #000;  }
  nav2 ul li.contact {    border-right: 1px dotted #000;  }

  div#contents {    max-width: 960px;    margin: 0 auto;  }
  div#contents section#work article  {  width: 32%;}
  div#contents section#work article img {   float:left; max-width:400px; margin-right:20px;}
  div#contents section#work article h3 {    line-height: 1.4em;  border-left:5px solid #000; margin-bottom: 10px; padding-left:10px; text-align:left; float:left; font-size: 1.2em;}
  div#contents section#work article p { line-height: 3em; border:1px solid #ccc; float:left; width:60%;   }
  div#contents section#news {    width: 49%;    float: left;  }
  div#contents section#information {width: 49%;    float: right;  }

  div#contents section#work art {width:90%;  }
  div#contents section#work art img {float:left; max-width:400px;margin-right:20px;}
  div#contents section#work art h3 {border-left:5px solid #000;margin-bottom:10px;padding-left:10px;text-align:left;float:left;font-size:1.2em;}
  div#contents section#work art h4 {border-left:3px solid #000;margin-bottom:7px;padding-left:10px;text-align:left;float:left;font-size:1.1em;}
  div#contents section#work art p {line-height:1.9em;border:1px solid #CCC;float:right; width:58%;padding-left:10px; letter-spacing:0.1em; font-size:1em;}
  div#contents section#work art p.style1 {line-height:1.8em;border:1px solid #ccc;float:right; width:58%;padding-left:10px; letter-spacing:0.1em; font-size:0.9em;color:#00C}
  div#contents section#work art p.style2 {line-height:1.8em;border:1px solid #ccc;float:right; width:58%;padding-left:10px; letter-spacing:0.1em; font-size:0.8em;color:#C60;}
 
  div#contents section#work art p.style3 {line-height:1.8em;border:1px solid #ccc;float:right; width:58%;padding-left:10px; letter-spacing:0.1em; font-size:0.9em;color:#00C}

p.style3 {line-height:1.5em;border:1px solid #ccc; padding:10px 5px 10px 5px;   width:100%; font-size:1em;color:#00C;text-align:left;background-color:#eee;}

footer {text-align:center;  }
/*設定頁尾圖片*/
div#contents section#work bot h6 {font-size:1em;color:#2d444f;background-color:#ccc;padding-top:9px;padding-bottom:3px;text-align:center;}
div#contents section#work bot img {width:100%;  height:auto;  max-width:120px;}
}