@charset "utf-8";
/* CSS Document */

img { border: 0px; }
.imgmid { text-align: center; padding: 10px 0; }
.imgleftfloat { float: left; margin-right: 30px; width: 280px; }
.imgrightfloat { float: right; margin-left: 10px; width: 320px; }
a { color: #00a1e1; text-decoration: none; }
a:hover { color: #FFF; background-color: #00a1e1; }
body { font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; font-size:14px;}
h1, h2, h3, h4, h5, h6 { font-weight: 700; }
h1 { font-size: 20px; font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; margin:0 0 0.8em;}
h2 { font-size: 18px; font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; margin:0 0 0.8em; color:#00a1e1;}
h3 { font-size: 16px; font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; margin:0 0 0.8em;}
h4 { font-size: 16px; font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; margin:0 0 0.8em;}
h5 { font-size: 15px; font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; margin:0 0 0.8em;}
h6 { font-size: 14px; font-family: "PT Sans", "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif; margin:0 0 0.8em;}

#header{ padding: 20px 0;  }
.logo { width: 840px; margin: 0 auto;}
.logo img{ width:150px;}

.inner_box{ width:100%; max-width:850px; margin:auto;}

.inner_box p{ margin:0 0 20px 0; line-height:1.6em;}
h1.title { text-align: center; font-size:24px;}
p.imghelp { text-align: center !important; font-size:13px; font-style:italic;}

.title { padding: 20px 0; }
.title p { line-height: 30px; font-weight: bold; font-size: 24px; text-align: center; }
.artbody { width: 850px; margin: 0 auto; }
.arttitle { border-top: 3px solid #4452B3; border-bottom: 1px solid #000099; padding: 3px 0; }
.arttitle p { color: #0042A5; font-size: 12px; text-align: left; line-height: 24px; }
.artcontent { padding: 5px 0; }
.artcontent p { font-size: 14px; line-height: 24px; margin-bottom: 16px; }

.artcontent img { border: 1px solid #DDd; padding: 20px; }
.topbar { background: url(../image/article/topbar.gif) repeat-x; height: 30px; padding: 5px 0; }
.botbar { background: url(../image/article/botbar.gif) repeat-x; height: 30px; padding: 5px 0; }
.table_class { border-collapse: collapse; margin-bottom: 5px; }
.table_class td { border: 1px solid #666; font-size: 12px; font-family: Arial, Helvetica, sans-serif; vertical-align: baseline; line-height: 24px; padding: 2px; }
.copyright p { line-height: 48px; text-align: center; font-size: 12px; font-family: Arial, Helvetica, sans-serif; }
ul { margin-left: 40px; }
li { font-size: 12px; font-family: Arial, Helvetica, sans-serif; line-height: 24px; }
.pictable_class { border-collapse: collapse; margin: 0 auto; }
.pictable_class td { font-size: 12px; font-family: Arial, Helvetica, sans-serif; line-height: 24px; }
.clearbothfloat { clear: both; }
ul li { list-style-position: inside\0/; }

@media only screen and (max-width: 800px) {
#wrapper { width: 100%; height:auto; overflow:scroll;}
.logo { width: 100%; height: auto; background: none; }
.logo img { height: 40px; margin: 10px; }
.artbody { width: 96%; padding: 0 2%; margin: 0 auto; }
.topbar, .botbar { display: none; }
.table_class { width: 100%; overflow: auto; }
}
