#index-left {width:550px; float:left; margin:0; padding:0 0 10px 10px; text-align:left;}
#index-right {width:410px; float:right; margin:0; padding:0 10px 10px 0; text-align:left;}

#news {width:auto; height:330px; overflow:auto; margin-left:10px;}
#news dt {font-size:10px; color:#339900;}
#news dd {padding:0 0.5em 0.5em 0.5em; border-bottom:dotted 1px #CCCCCC;}
#news a {text-decoration:underline; color:#333;}
#news a:hover {text-decoration:underline; color:#339900;}

.mn-img {width:980px; height:360px; margin:0 auto; margin-top:-20px; margin-bottom:20px; padding:0; background-color:#333; position:relative; z-index:1;}
.mn-img .member {position:absolute; top:0; left:0; display:none;}
.mn-img .first {position:absolute; top:0; left:0; display:block;}

.tn-img {width:auto; margin:0 auto; position:absolute; bottom:10px; right:10px;}
.tn-img ul {list-style-type:none; margin:0; line-height:0;}
.tn-img li {display:block; float:left; margin:0; margin-right:5px; padding:4px; line-height:0; cursor:pointer; background-color:rgba(255,255,255,0.4); box-shadow:1px 1px 2px rgba(0,0,0,0.8);}

#sub-img {position:relative; width:530px; height:380px; margin-bottom:10px;}
#si1,#si2,#si3,#si4,#si5,#si6 {position:absolute; z-index:10;}
#si1 {top:0; left:0;}
#si2 {top:0; right:0;}
#si3 {top:130px; left:0;}
#si4 {top:130px; right:0;}
#si5 {bottom:0; left:0;}
#si6 {bottom:0; right:0;}

@media screen and (max-width:768px){
	#index-left {width:100%; float:none; padding:0;}
	#index-right {width:100%; float:none; padding:0;}
	.mn-img {width:100%; height:100%; padding-top:36.7%; margin-top:-12px; margin-bottom:35px;}
	.mn-img img {width:100%;}
	.tn-img {bottom:-25px;}
	.tn-img li {padding:10px; background-color:#66bb00; border-radius:4px; box-shadow:none;}
	.tn-img li img {display:none;}
	#sub-img {position:static; width:100%; height:100%; margin-top:10px; overflow:hidden;}
	#sub-img img {max-width:100%;}
	#si1,#si2,#si3,#si4,#si5,#si6 {position:static; float:left; width:32%;}
	#si1 {margin-right:1.5%; margin-bottom: 1.5%;}
	#si2 {margin-right:1.5%; margin-bottom: 1.5%;}
	#si3 {margin-bottom: 1.5%;}
	#si4 {margin-right:1.5%;}
	#si5 {margin-right:1.5%;}
}
@media screen and (max-width:480px){
	#sub-img {position:relative; padding-top:70%;}
	#si1,#si2,#si3,#si4,#si5,#si6 {position:absolute; float:none; margin:0; width:49%; max-width:260px;}
	#si3 {top:34%;}
	#si4 {top:34%;}
}
