@charset "utf-8";

body{ 
padding: 0; 
margin: 0;
}

#container{
margin: auto;
color: #333;
background-color: white;
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo, sans-serif; 
border-bottom-width: 1px; 
border-bottom-style: solid; 
border-bottom-color: #4c4c4c; 

border-right-width: 1px; 
border-right-style: solid; 
border-right-color: #4c4c4c; 

border-left-width: 1px; 
border-left-style: solid; 
border-left-color: #4c4c4c; 
}

#header{
margin: 0;   
padding: 10px; 
color: white;
background-color: #4c4c4c; 
border-bottom-color: #b3b3b3; 
border-bottom-width: 1px; 
border-bottom-style: solid; 
font-weight: bold; 
}

#header a{ background-color: #4c4c4c; text-decoration: none; color: white;}
#header a:hover{ background-color: #4c4c4c; text-decoration: none; color: #6666ff;}



h1{ 
color: #804000; 
padding-bottom: 0; 
margin-bottom: 2em; 
border-bottom-color: #b3b3b3; 
border-bottom-width: 1px; 
border-bottom-style: solid; 
font-weight: bold; 
font-size: 120%; 
}

ul {border-top: 2px solid lightgray;
	padding-top: 2em;
}

p, ul, li, table{ margin-bottom: 2em;}


strong{ font-size: 120%;}

a{text-decoration: none;color: #6666ff;}
a:hover{ color: blue; text-decoration: underline; background-color: #ffff66; }
a:active{ color: red; background-color: white; }

		img {	max-width: 100%;height: auto;
				width:auto;border: 1px solid lightgray;}


@media screen and (min-width: 320px){

#container{
border: none; 
}


	#article{	margin: 0;
				padding: 1em 1em 0 1em;}
				
						
/*
		img {	max-width: 100%;
				height: auto;
				width:auto\9;}
*/

}

@media screen and (min-width: 768px){

body{background-color: #e6e6e6;}

	#container{
width:728px;

border-bottom-width: 1px; 
border-bottom-style: solid; 
border-bottom-color: #4c4c4c; 

border-right-width: 1px; 
border-right-style: solid; 
border-right-color: #4c4c4c; 

border-left-width: 1px; 
border-left-style: solid; 
border-left-color: #4c4c4c; 
}


	#article{
		margin: 0;
		padding: 3em 3em 0 3em;}
		
h1{font-size: 160%;}
				

}