@charset "utf-8";
/* CSS Document */
/* clearfix */
.cf { zoom: 1;}
.cf:before, .cf:after 
   {content:"";
	display: table;}
.cf:after {clear:both;}

 /* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
所有裝置共用的樣式及手機版型
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/


body{
	width: 100%;
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	line-height: 1.5em;
	background-color:#CCC;
	font-family:"細明體", "微軟正黑體", "新細明體", "標楷體", "Arial Unicode MS";
	color:#000;
	}
	a{
		color:#000;
		text-decoration:none;
	}
	a:hover {
		color:#333;
		text-decoration:underline;
	}


header{
    text-align:center;
	padding-left: 10%;
	background-color: #100066;
    }
header h1 {
	font-size: 2.3em;
	margin: 0 auto;
	padding:15px 5px 7px 5px;
	width:90%;
	color: #fff;
}
header h1 img{
	width: auto;
	max-width:100px;
	}



nav {
		text-align:center;
		border-bottom:3px double #000;
		margin:20px auto 15px auto;
	}
   nav ul {
	margin-bottom:15px;
	}
	nav ul li {
		text-align:center;
		float:left;
		width:20px;
		border-bottom:2px solid #000;
	}
	nav ul li:nth-child(odd) {
		width:49%;
		border-right:1px dotted #000;
	}
	nav ul li a {
		display:block;
		width:100%;
	}
	
	

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
所有裝置共同的樣式及手機版型
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
section

   {
	text-align: center;
    float:left;
    width:100%; 
    height:80px;
    background: #FC9;
	font-size:18px;
    }
section table {
	border:4px solid #006;}

	

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
所有裝置共同的樣式及手機版型
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
aside{
	text-align:left;
    float:right;
    width:100%;
    height:480px;
    background: #9F9;
	font-size:16px;
       }

aside table {
	font-size:15px;
	width: 80%;
	border:3px solid #C66;
	}
aside table td {
	width: auto;
	}
aside table td tr {width:auto;}
	
/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
所有裝置共同的樣式及手機版型
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
footer{
	text-align:center;

    height: 60px;

    width: auto;

    margin-top: 0;

    margin-right: auto;

    margin-bottom: 0;

    margin-left: auto;

    background:#6633CC;

    clear:both;

    }
@media only screen and (min-width: 320px) {
	header {
		position:static;
		overflow:visible;
	}
	header h1 {
		text-align:left;
		padding:15px 5px 7px 5px;
		width:100%;
		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;
		font-size:22px;
	}
	
	nav {
		text-align:center;
		border-bottom:3px double #000;
		margin:10px auto 15px auto;
		
	}
	
	
	nav ul li {
		text-align:center;
		float:left;
		width:100%;
		border-bottom:none;
		border-right:1px dotted #000;
	}
	nav ul li:nth-child(odd) {
		width:100%;
		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;
		
	}
		section {
			display:none;}}
@media only screen and (min-width: 768px) {
header {
		  position: inherit;
		  overflow: hidden;}
	header h1{
		width:60%;
		margin-left: auto;
		margin-right: auto;}
		
	header ul#s_nav {
		width:38%;
	font-size:32px;
	float: right;
	margin-top: 40px;
	position: static;
	}
header ul#s_nav li {
	
	float: right;
	position: static;
	}
	header {
		  position: inherit;
		  overflow: hidden;}
	header h1{
		width:60%;
		margin-left: auto;
		margin-right: auto;}
		

	nav {
		text-align:center;
		border-bottom:3px double #000;
		margin:10px auto 15px auto;
	}
	
	
	nav ul li {
		text-align:center;
		float:left;
		width:30%;
		border-bottom:none;
		border-right:1px dotted #000;
	}
	nav ul li:nth-child(odd) {
		width:30%;
		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;
		
	}
}
		

		
@media only screen and (min-width:1000px) {
	header {
		width:999px;
		margin-left:auto;
		margin-right:auto;
	}
	nav {
		max-width:999px;
	}
	nav ul {
		margin-left:auto;
		margin-right:auto;
	}
	nav ul li:nth-child(odd) {
		border-bottom:none;
	}
	nav ul li.home {
		border-left:1px dotted #000;
		border-right:1px dotted #000;
		}
		
      aside
   { height:400px;
   }
			}
@media only screen and (min-width:1400px) {
	header {
		width:1400px;
		margin-left:auto;
		margin-right:auto;
	}
	nav {
		max-width:700px;
	}
	nav ul {
		margin-left:auto;
		margin-right:auto;
	}
	nav ul li:nth-child(odd) {
		border-bottom:none;
	}
	nav ul li.home {
		border-left:1px dotted #000;
		border-right:1px dotted #000;
		}
		
      aside
   { min-height:500px;}
	section {
		display: inline
	}
   footer {
	}}
@media only screen and (min-width:1900px) {
	
		header {
		width:1800px;
		margin-left:auto;
		margin-right:auto;
	}
	header h1 img {
		width:30%;
		float:left;
	}
	header ul#s {
		width:65%;
	}
	header ul#s_nav {
		width:69%;
		float:right;
		margin-top:00px;
		position:static;
	}
	header ul#s_nav li{
		float: left;
		position:static;
		font-size:22px;
	}
			
     
	section { 
			width:25%;
			height:700px;
			margin-top:20px;}
      aside {
		  height:700px;
		  width:75%;
   }
   }
   footer {
   }