/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/* =============================================================================
   HTML5 表示定義
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block;
}
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }




html,body{margin:0;padding:0;}
body{font: 76% arial,sans-serif;text-align:center}
p{margin:0 10px 10px}

h1 {
	padding: 30px 0;
	font-size: 40px;
	text-align: center;
	}

h2 {
	padding: 30px 0;
	font-size: 32px;
	text-align: center;
	}

h3 {
	margin-bottom: 0.25em;
	font-size: 24px;
	}

h4 {
	margin-bottom: 0.25em;
	font-size: 22px;
}

h5 {
	margin-bottom: 0.25em;
	font-size: 16px;
	}

h6 {
	margin-bottom: 0.25em;
	color: #382400;
	font-size: 14px;
}



a {
	text-decoration:none;
	background: #fff;
	color:blue;
	}
a:visited {
	background: #fff;
	color:purple;
	}
a:hover {
	background: #000066;
	color:white;}
	}

img{
	display: block;
	}

#header{
	}
#header img{
	width: 100%;
	}
div#header h1{
	height:80px;
	line-height:80px;
	margin:0;
	padding-left:10px;
	background: #EEE;
	color: #79B30B}
div#content p{
	line-height:1.4}
div#navigation a{
	display: block}
div#navigation ul{
	list-style:none; 
	margin:0px; 
	padding:0px;}
div#navigation li {
	padding: 5px 5px 5px 10px;}
div#navigation dd{
	margin: 0 0 0 25px;
}
div#extra a{
	padding: 5px 5px 5px 5px;
	}
div#footer p{
	margin:0;
	padding:5px 10px;
	}
div#content ul{
	list-style:none;
	margin:5px;
	padding:5px;}
div#content li {
	padding:5px 3px 5px 10px;
	background: #fff;
	color: #f00;
}
div#content dl {
	padding:0;
	margin:5px 5px 5px 5px;
	background: #fff;
	color: #000}
div#content dt {
	padding:0;
	margin:5px 5px 5px 10px;
	background: #fff;
	color: #000}
div#content dd {
	padding:0;
	margin:5px 5px 10px 20px;
	background: #fff;
	color: #000}
div#sub-content h5{
	margin:10px;
	padding-left:10px;
	line-height:30px;
	background: #fff;
	color: #666}


/* 段組レイアウト */
div#container{
	text-align:left;
	background: #fff;
	width: 900px;
	margin-left: auto;
	margin-right: auto;
	}
div#wrapper {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	margin-bottom: 30px;
	background: #Fff;
}
div#extra{
	border-style: dotted none dotted none;
	border-width: 1px;
	background:#fff;
	clear:right;
	margin:10px 0px 0px 0px;
}
div#main{
	background:#fff;
	float: left;
}
div#content{
	background: #FfF;
	width:390px;
	float: right;
}
div#navigation{
	border-style:none dotted none none;
	border-width: 1px;
	background:#FfF;
	width: 200px;
	float: left;
}
div#sub-content{
	background: #fFF;
	width:300px;
	float: right;
}
div#footer{
	border-style:dotted none none none ;
	border-width: 1px;
	clear: both;
	padding: 2px;
	background: #fff;
	color: #222;
}
#smmenu{
	display: none;
	position: fixed;
	top: 10px;
	right: 15px;
}


/* スマホ　767px以下 */
@media only screen and (max-width: 767px) {
	div#container{
		width: 100%;
		min-width :300px;	  
	}
	div#wrapper{
	    /* position: relative;を解除 */
		margin-left: auto;
		margin-right: auto;
		margin-top: 0px;
		margin-bottom: 30px;
		position: static;
		width: 100%;
	}

	/* メインカラム */
	div#main{
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}
	div#content{
		width: 100%;
		margin-left: 0;
		margin-bottom: 30px;
	}
	
	/* サイドメニュー */
	div#navigation{
		width: 100%;
		margin-bottom: 30px;
	}

	/* バナーエリア */
	div#sub-content{
		width: 100%;
	}

	#smmenu{
		display: block;
		position: fixed;
		top: 10px;
		right: 15px;
	}

	#smmenu a{
		display: block;
		width: 30px;
		padding: 5px 5px;
		background: #844;
		color: #fff;
		border: 2px solid #844;
		border-radius: 5px;
	}
	#smmenu a:hover {
		color: #844;
		border: 2px solid #844;
		background: none;
	}

}

