@media (max-width: 640px) {
	body {
		width: 640px;
		margin: 0 auto;
		background-color: #aaa;
	}
	
	body div {
		width: 100%;
		background-color: #ff0;
	}
	
	.clearfix {
		zoom: 1;
	}
	
	.clearfix:before, .clearfix:after {
		content: " ";
		display: block;
		clear: both;
	}
	
	#div1 {
		text-align: center;
	}
	
	#div3 {
		overflow: hidden;
	}
	
	#div3 img {
		width: 100%;
	}
	
	.clearfix img {
		width: 100%;
	}
	
	h2 {
		text-align: center;
		padding: 10px;
		background-color: #ccc;
	}
	
	.bbs-date {
		width: 30%;
		float: left;
	}
	
	.bbs-title {
		width: 70%;
		float: left;
	}
	
	#div2 ul {
		list-style: none;
		margin: 0 auto;
		padding: 0;	
		text-align: center;
	}
	
	#div2 li {
		border-bottom: 1px black dotted;
		padding: 5px 0;
	}	
	
	#div2 li:last-child {
		border-bottom: 0px;
	}
	
	#div10 ul, #div11 ul {
		margin: 0;
		list-style: none;
	}
	
	#div10 li, #div11 li {
		padding: 5px 0;
	}
	
	#div12 {
		padding: 10px 0;
		font-size: 10pt;
		text-align: center;
	}
}

@media (min-width: 641px) {
	* {
		margin: 0;
		padding: 0;
	}
	
	body {
		width: 1200px;
		margin-left: auto;
		margin-right: auto;
	}
	
	img {
		width: 100%;
	}
	
	ul {
		list-style: none;
	}
	
	.clearfix {
		zoom: 1;
	}
	
	.clearfix:before, .clearfix:after {
		content: " ";
		display: block;
		clear: both;
	}
	
	#div1 {
		height: 80px;
		width: 299px;
		float: left;	
		text-align: center;
		border-left: 1px rgb(26,112,179) solid;
	}
	
	#div1 h1 {
		font-size: 25px;
		font-weight: bold;
		margin-top: 15px;
		text-shadow: 2px 2px 3px #000;
	}
	
	#div2 {
		background-color: rgb(26,112,179);
		height: 50px;
		width: 900px;
		float: left;
		text-align: center;
		padding-top: 30px;
	}
	
	#div2 li {
		display: inline-block;
		color: white;
		font-weight: bold;
		border-right: 2px white solid;
		width: 100px;
		text-align: center;
	}
	
	#div3 {
		height: 373px;
		width:1200px;
		float: left;
	}
	
	#div3 img {
		width: 100%;
	}
	
	#div3:hover img {
		opacity: 0.9;
	}
	
	#div4 {
		background-color: green;
		height: 260px;
		width:400px;
		float: left;
		overflow: hidden;
	}
	
	#div5 {
		background-color: blue;
		height: 260px;
		width: 400px;
		float: left;
		overflow: hidden;
	}
	
	#div6 {
		background-color: navy;
		height: 260px;
		width: 400px;
		float : left;
		overflow: hidden;
	}
	
	#div7 {
		background-color: purple;
		height: 260px;
		width: 400px;
		float: left;
		overflow: hidden;
	}
	
	#div8 {
		background-color: pink;
		height: 260px;
		width: 400px;
		float: left;
		overflow: hidden;
	}
	
	#div9 {
		background-color: gray;
		height: 260px;
		width: 400px;
		float: left;
		overflow: hidden;
	}
	
	.bbs-title {
		float: left;
		width: 440px;
	}
	
	.bbs-date {
		float: left;
		text-align: right;
	}
	
	#div10 {
		height: 220px;
		width: 599px;
		float: left;
		border-right: 1px solid #ddd;
	}
	
	#div11 {
		height: 220px;
		width: 600px;
		float: left;
	}
	
	#div10 ul, #div11 ul {
		display: block;
		width: 90%;
		margin: auto;
	}
	
	#div10 h2, #div11 h2 {
		text-align: center;
		padding-top: 5px;
		padding-bottom: 5px;
		text-shadow: 1px 1px 2px #000;
	}
	
	#div10 li, #div11 li {
		font-size: 13pt;
		padding-top: 5px;
		padding-bottom: 5px;
		border-bottom: 1px dotted #aaa;
	}
	
	#div10 li:last-child, #div11 li:last-child {
		border-bottom: 0px;
	}
	
	#div12 {
		background-color: yellow;
		height: 45px;
		width: 1200px;
		float: left;
		text-align: center;
	}
	
	#div12 address {
		margin-top: 15px;
		font-style: normal;
	}
}