body{margin:0px 0px;}






/* layout
----------------------------------------------------- */
#header {
	height:80px;
	margin:0px 0px;
	position: relative;
	text-align:center
	z-index:9999;
}


/* topコンテンツ*/
.topcontents {
	width:100%;
		padding:3px 0px 3px 0px ;
		border-bottom:1px solid #ccc;
		backGround-color: #f9fa62;
 		position: relative;
  		overflow: hidden;
		opacity: 1.0;
	z-index:5000;
	}


.top-logo{
	display:block;
	padding: 0px 0px 0px;
	margin:2px 2px -10px -10px;
	}
.top-main{
	display:block;
	float:left;
	padding: 0px 0px;
	background:#0047C4;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	z-index:5000;

	}
.top-mame{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#38B3ED;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	}
.top-gurume{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#FAAD00;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	}
.top-photo{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#e84a85;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	}
.top-360{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#333333;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	}
.top-access{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#9527C5;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	}
.top-spot{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#856E45;
	font-size:0.85em;
	color:#ffffff;
	}
.top-hotel{
	display:block;
	float:left;
	padding: 3px 12px;
	background:#DE0000;
	margin:0.2em 0.2em;
	font-size:0.85em;
	color:#ffffff;
	}


/*オンマウスでボタンを少し半透明にする */
.topcontents  li:hover{
opacity:0.8;
filter:alpha(opacity=80);	/* Ie用 */
}




/* 画面サイズが640以上の場合に出てくるロゴ画像用 */
#topcontentslogo {
	width:100%;
		padding: 3px 0px 0px 0px;
		border:0px solid #000;
		backGround-color: #f9fa62;
 		position: relative;
  		overflow: hidden;
		opacity: 1.0;
	}

#topcontentslogo img {
	width:180px;
		padding: 2px 0px 5px 0px;
	}





/* 画面サイズが641以上の場合にロゴを１つ消す用 */
@media only screen and (min-width: 641px) {

#topcontentslogo2 img {
display:none;
	}
}

/* 画面サイズが1215px以下の場合に適用 */
@media only screen and (max-width: 1216px) {
	#topmenu li {
		width: 25%;
		border-bottom: 1px solid #f9fa62;
	}
}






/* header
----------------------------------------------------- */



/*グローバルナビゲーションの指定*/
#headerFixedBox {
	height: 0px;
	width:100%;
	z-index:5000;

}

#topmenu {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	font-size:1em;
	z-index:5000;
}
#topmenu li{
	display: block;
	float: left;
	width: 12.5%;
	margin: 0;
	padding: 0;
	z-index:5000;
}
#topmenu li a {
	display: block;
	padding: 4px 0 4px;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	border-right:0px solid #f9fa62;
	margin: 1px;
	z-index:5000;
}
#topmenu li:last-child a{
	border: none;
	z-index:5000;
}
#topmenu li a:hover{
	z-index:5000;

}








#toggle {
	display: none;
}

.fixed {
	width: 100%;
	position: fixed;
	top: 0;
	z-index:5000;
}





h3 { 
 font-family: 'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; 
font-weight:600;
color: #888888;
margin: 0px 0 0px 0; 
font-size:16px;
	}

h3 B{ 
 font-family: 'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; 
font-weight:800;
color:#ff6c00;
margin: 0px 0 0px 0; 
font-size:16px;
	}



/* 画面サイズが1215px以下の場合に適用 */
@media only screen and (max-width: 1216px) {
#header {
	height:115px;

	margin:0;
	position: relative;
	text-align:center
	z-index:5000;
}

	#headerFixedBox li {
		width: 25%;
		border-bottom: 1px solid #f9fa62;
	z-index:5000;

	}
}


/* 画面サイズが640px以下の場合に適用 */
@media only screen and (max-width: 640px) {
#header {
	height:41px;

	margin:0;
	position: relative;
	text-align:center
}


#topcontentslogo2 {
	width:100%;
		padding:0px 0px 0px 0px;
		border:0px solid #ccc;
		backGround-color: #f9fa62;
 		position: relative;
  		overflow: hidden;
		opacity: 1.0;
	}
#topcontentslogo2 img {
	width:180px;
		margin: 0px 0px 2px 0px;
	}


#topcontentslogo img {
		display: none;
	}


	#topmenu {
		display: none;
	}


#topmenu {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	font-size:1.1em;
	z-index:5000;
}


#topmenu li{
	display: block;
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	z-index:5000;
}
#topmenu li a {
	display: block;
	padding: 6px 0px;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	border-right:0px solid #f9fa62;
	margin: 1px;
	z-index:5000;
}




	#toggle {
		display: block;
		position: relative;
		width: 100%;
		background: #f9fa62;
		z-index:9999;

	}
	.menuline{
		display: block;
		content:"";
		position: absolute;
		top: 50%;
		left: 12px;
		width: 27px;
		height: 3px;
		margin-top:18px;

		background:#555;
		padding:0px 0 0 0px;
		font-size:9px;
	line-height: 27px;
		z-index:9999;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;

	}
	#toggle a{
		display: block;
		position: relative;
		padding: 0px 0 0px;
		border-bottom: 0px solid #f9fa62;
		color:#000;
		text-align: center;
		text-decoration: none;
	}
	#toggle:before {
		display: block;
		content: "";
		position: absolute;
		top: 0px;
		left: 0px;
		width: 60px;
		height: 48px;
		margin-top: 0px;
		background:"";

	}
	#toggle a:before, #toggle a:after {
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 12px;
		width: 27px;
		height: 3px;
		background: #555;
		z-index:1005;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	}
	#toggle a:before {
		margin-top:6px;
		z-index:1006;
	}
	#toggle a:after {
		margin-top: 12px;

	}


/* menu文字とリンク範囲を透明で下にひく */
#togglemenuwaku{
		display: block;
		content:"";
		position: absolute;
		top: 0%;
		left: -8px;
		width: 50px;
		height: 0px;
		margin-top: 2px;
		padding:0px 0 0 0px;
		font-size:10px;
	line-height: 19px;
		z-index:9999;


}








}