body { text-align:center; color:#000000; line-height:130%; 
background-color:#67C0F4;
background-attachment:fixed; 
background-image:url(back.png);
scrollbar-arrow-color:#67C0F4; 
scrollbar-base-color:#000000; 
scrollbar-highlight-color: #67C0F4; 
scrollbar-shadow-color: #67C0F4; 
table-layout:fixed; 
} 

a { text-decoration:none; }
 a:link,a:visited{color:#67C0F4; }
 a:hover,a:active{color:#000000; background-color:#67C0F4; }

/* 基本スタイル（PC向けスタイル） */
#wrap { width:780px; height:500px; text-align:left; margin:0 auto; }  
#inner { margin:100 10px;  
		background-image:url(top.png); 
		background-repeat:no-repeat; 
		background-position:top ; 
		background-attachment:fixed;}  
#mainWrap { width:260px;  height:450px; float:left; }  
#sideWrap { width:480px; height:450px; float:right; } 
			.box { width:438px; height:150px; border:dotted 1px; 
			text-align:left; font-size:smaller; margin:200px 0px 0px 20px; 
			padding:2px 2px; overflow-y:auto; overflow-x:hidden; 
			background:#E0FFFF; 
			filter:alpha(opacity=70);
			-moz-opacity:0.7;
			opacity:0.7; }
#footer { width: 780px; text-align:center; margin:0 auto; }
.clear { clear:both; }  
.clear hr { display:none; }  


@media screen and (max-width: 540px) {
/* モバイル向けスタイル */
img {
width: 100% ;
}
#wrap { width:auto; text-align:left; margin: 10 auto; }  
#inner { margin:0px;  
		background-image:url(top.png); 
		background-repeat:no-repeat; 
		background-position:top ; 
		background-attachment:fixed; }  
#mainWrap { display: flex; flex-wrap: wrap; float:none; }  
#sideWrap { display: flex; flex-wrap: wrap; float:none; } 

		.box { 
		display: flex; flex-wrap: wrap; float:none; 
		justify-content: center;
		text-align: left;
		font-size: smaller;
		width: 276px; 
		height: 180px; 
		border: dotted 2px; 
		overflow-y:auto; overflow-x:hidden; 
		background:#E0FFFF; 
		filter:alpha(opacity=70); 
		-moz-opacity:0.7; 
		opacity:0.7; }

		.clear { clear:both; } 
 
		.clear hr { display:none; }

#footer { width:auto; text-align:center; margin:0 auto; }


}