html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
	margin:0;
	padding:0;
	border:0;
	font-size:1.6rem;
	font:inherit;
	vertical-align:baseline;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
	display:block;
}

a {
	color: #0066FF;
	text-decoration: none;	/*リンクの下線を外す設定*/
}

a:hover {
	color: #F95902;
	text-decoration: underline;	/*オーバー時に下線を表示させる。*/
}

ol,ul{
	list-style:none;
}
blockquote,q{
	quotes:none;
}

blockquote:before,blockquote:after,q:before,q:after{
	content:'';content:none;
}

table{
	border-collapse:collapse;
	border-spacing:0;
}

body {
	 margin: 0;
	 padding: 0px 0px 0px 0px;
	 background: #ebe7d2;
/*		background: #ffffff;*/
	 color: #222;
	 font-size : 14px;
	-webkit-text-size-adjust: 100%;
	 /*font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
}

/* clear用のセレクタ */
.clear { 
	clear:both; 
}  

h1 { 
	font-size:32px; 
	font-family: 'Tangerine', cursive;
	text-align: center;
 }

h2 { 
	font-size:28px; 
	font-family: 'Tangerine', cursive;
	text-align: center;
 }



/*============================================
ヘッダ
============================================*/

#header { 
	width: 100%;
	max-width: 1080px;
	padding: 8px 0;
	margin: 1px auto;
	background: #fff;
	border-left:1px solid #cccccc;
	border-right:1px solid #cccccc;
/*	border-bottom:1px solid #cccccc;*/
}

#header .hleft{
		width:200px;
		float:left;
		padding-left: 4px;
}
#header .hleft .hltxt h1{
		text-decoration: none;
		font-weight: normal;
		color:#999999;
		font-size:1.6rem;
		padding-left:0px;
		padding-top: 2px;
}

#header .hleft .hlimg{
		margin:0;
		padding-top:12px;
		padding-left:2px;
		float:left;
		color:#fff;
}
#header .hright{
		width:478px;
		float:right;
		padding-right: 4px;
}
#header .hright .hrtxt{
		color:#999999;
		font-size:12px;
		text-align: right;
		padding-right: 4px;
}
#header .hright .hrimg{
		padding-left:0px;
		padding-top: 2px;
		float:left;
}

#header .hrights{
		width:240px;
		float:right;
		padding-right: 4px;
}
#header .hrights .hrtxt{
		color:#999999;
		font-size:12px;
		text-align: right;
		padding-right: 4px;
}
#header .hrights .hrimg{
		padding-left:0px;
		padding-top: 2px;
		float:left;
}

#header .hrights{
				display: none;
}

/*============================================
コンテンツ
============================================*/

#contents {
		width: 100%;
		max-width: 1080px;
		margin: 0 auto;
		padding: 0;
		background: #ffffff;
		border-left:1px solid #cccccc;
		border-right:1px solid #cccccc;
}

#main {
		float: left;
		width: 54%;
		margin: 0;
		padding: 0;
}

#main-in { 
		margin-left: 2px;
		border-left:1px solid #f5f5f5;
		padding: 15px 15px 15px 15px;
		background: #fff;
		/*background-color: #8fbc8f*/
}

#main2 {
		float: left;
		width: 26%;
		margin: 0;
		padding: 0;
}

#main2-in { 
		margin-left: 2px;
		border-left:1px solid #f5f5f5;
		padding: 15px 15px 15px 15px;
		/*background: #fff;*/
		background-color: #fffaf0;
}



/*============================================
フッタ
============================================*/
#footer {
	clear: both;	
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
	color: #ffffff;
	font-size : 12px;
	background: #a9a9a9;
	text-align: center;
        padding-top: 4px;
	padding-bottom: 4px;
        
/*	background: #ffffff;
	text-align: center;
	border-top: 1px solid #808080;
	padding-top: 4px;
	padding-bottom: 4px;
*/

/*	border-left:1px solid #cccccc;
	border-right:1px solid #cccccc;*/


}


/*============================================
ナビゲーション
============================================*/
#navigation{
	float: left;
	width: 20%;
	margin: 0;
	padding: 0;
}

#navigation h3{
 	margin: 0;
 	padding: 8px 5px 5px;
	background: #8d990f;
	color: #fff;
	font-size: 16px;
	text-align: center;
}

#menu h3:nth-of-type(1){ background: #8d990f; }
#menu h3:nth-of-type(2){ background: #99820f; }
#menu h3:nth-of-type(3){ background: #995f0f; }
#menu h3:nth-of-type(4){ background: #993d0f; }

/*
#menu h3:nth-of-type(1){ background: #8d990f; }
#menu h3:nth-of-type(2){ background: #99820f; }
#menu h3:nth-of-type(3){ background: #995f0f; }
#menu h3:nth-of-type(4){ background: #993d0f; }
*/
/*
#menu h3:nth-of-type(1){ background: #888888; }
#menu h3:nth-of-type(2){ background: #888888; }
#menu h3:nth-of-type(3){ background: #888888; }
#menu h3:nth-of-type(4){ background: #888888; }
#menu h3:nth-of-type(5){ background: #888888; }
*/

#navigation ul{
		list-style-type: none;
		margin: 0;
		padding: 0;
		background: #fff;
		border-left: 1px solid #8d990f;
		border-right: 1px solid #8d990f;
		border-bottom: 1px solid #8d990f;
}

#menu ul:nth-of-type(1){ border-color: #8d990f; }
#menu ul:nth-of-type(2){ border-color: #99820f; }
#menu ul:nth-of-type(3){ border-color: #995f0f; }
#menu ul:nth-of-type(4){ border-color: #993d0f; }
/*
#menu ul:nth-of-type(1){ border-color: #8d990f; }
#menu ul:nth-of-type(2){ border-color: #99820f; }
#menu ul:nth-of-type(3){ border-color: #995f0f; }
#menu ul:nth-of-type(4){ border-color: #993d0f; }
*/
/*
#menu ul:nth-of-type(1){ border-color: #888888; }
#menu ul:nth-of-type(2){ border-color: #888888; }
#menu ul:nth-of-type(3){ border-color: #888888; }
#menu ul:nth-of-type(4){ border-color: #888888; }
#menu ul:nth-of-type(5){ border-color: #993d0f; }
*/

#navigation ul li{
		width: 100%;
		margin: 0;
		padding: 0;
}

#navigation ul li a{
		display: block;
		margin: 0;
	 /*   height: 16px; my */
		padding: 8px 10px;
		color: #333;
		font-size: 16px;
		text-align: left;
		border-bottom: #dcdddd 1px solid;	/* my */
		text-decoration: none;
}

#navigation li a:hover{
		background: #eee;
}
#toggle{
		display: none;
}
.end_line{
		border: 2px solid #993d0f;
}

/* ================================================================= */

@media only screen and (max-width: 980px) {
#header { 
		margin: 0;
}
#main {
		float: none;
		clear: both;
		width: 100%;
}
#main-in {
		margin-left: 0;
}
#main2 {
		float: none;
		clear: both;
		width: 100%;
}
#main2-in {
		margin-left: 0;
}


#navigation{
		float: none;
		width: 100%;
		background: #ebe7d2;
}

#navigation h3{
	    clear: both;
	    position: relative;
	    z-index: 9999;
 }

#menu {
		 display: none; 
		 position: relative; 
}

#menu:after {
	    position: absolute;
	    content:"";
	    bottom: 0;
	    left: 0;
	    width: 100%;
	    height: 1px;
	    background: #d6cea3;
  }
#navigation ul{
	    border-left-width: 3px;
	    border-right-width: 3px;
	    border-right-style: solid;
	    background: #ebe7d2;
}
#navigation ul:before,
#navigation ul:after{
	    content: "";
	    display: table;
}
#navigation ul:after{ clear: both; }
#navigation ul{ *zoom: 1; }
#navigation ul li{
	    float: left;
	    width: 25%;
	    box-sizing: border-box;
	    border-right: 1px solid #d6cea3;
	    border-bottom: 1px solid #d6cea3;
}

#navigation ul li:nth-of-type(4n){ 
		border-right: 0; 
}

#navigation ul li a{
	    text-align: center;
	    padding: 12px 0px;
}

#navigation ul li a:hover{ 
		background: #f5f4ea;
}

#toggle{
    display: block;
    position: relative;
    width: 100%;
    background: #222;
}

#toggle a{
    display: block;
    position: relative;
    padding: 15px 0 10px;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

#toggle:before{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    background: #fff;
}

#toggle a:before, #toggle a:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 10px;
    width: 20px;
    height: 4px;
    background: #222;
}

#toggle a:before{ margin-top: -6px; }
#toggle a:after{ margin-top: 2px; }




}


/* ================================================================= */

@media only screen and (max-width: 767px) {

#header .hright{
		display:none;
}
#header .hrights{
		display:inline;
}

  #navigation ul li{
		 width: 50%;
 }
  #navigation ul li:nth-of-type(2n){ 
	border-right: 0;
 }

#main2-in .rbrock_01{
	float: left;
	text-align: center;
	background: #fff;
	width: 50%;
	margin: 0px 0px 18px 0px;
	padding: 0;
}
#main2-in .rbrock_02{
	float: left;
	text-align: center;
	background: #fff;
	width: 50%;
	margin: 0px 0px 18px 0px;
	padding: 0;
}
#main2-in .rbrock_03{
	float: left;
	text-align: center;
	background: #fff;
	width: 50%;
	margin: 0px 0px 18px 0px;
	padding: 0;
}


}

/* ================================================================= */

@media only screen and (max-width: 479px) {
    
#header .hright{
		display:none;
}
#header .hrights{
		display:none;
}


#navigation ul li{
    float: none;
    width: 100%;
  }

#main2-in .rbrock_01{

	text-align: center;
	background: #fff;
	width: auto;
	margin: 10px 0px 10px 0px;
	padding: 0;
}
#main2-in .rbrock_02{

	text-align: center;
	background: #fff;
	width: auto;
	margin: 10px 0px 10px 0px;
	padding: 0;
}
#main2-in .rbrock_03{

	text-align: center;
	background: #fff;
	width: 100%;
	margin: 10px 0px 10px 0px;
	padding: 0;
}



}