@charset utf-8;
/* ======================================== サイト全体に適用*/
html {
margin: 0 auto;
padding: 0;
overflow:auto;
width:100%;
height: 100%;
scrollbar-base-color: #111111;
scrollbar-track-color: #222222;
scrollbar-arrow-color: #999999;
}

body {
	margin: 0 auto;
	padding: 0;
	width:100%;
	height: 100%;
	color: #888888;
	text-align: center;
	background-color: #000000;
	/*background-image: url(img/sp_bg.jpg);
	background-repeat: no-repeat;
	background-position: top center;
	background-attachment: fixed;*/
	font-size: 14px;
	line-height:170%;
	font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","HiraKakuPro-W3","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

.background-hack {
    z-index: -999999;
    background-image: url(img/sp_bg.jpg);
    background-position: top center;
    background-size: 100% auto;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
}

hr {
border: 1px #111111 solid;
margin:10px 0;
}

a{/*リンクされた文字*/
    color:#999999;
    text-decoration:none;
    outline: none;
}
a:link {/*未訪問のリンク*/
    color:#999999;
    text-decoration:none;
}
a:visited {/*訪問後のリンク*/
    color:#999999;
    text-decoration:none;
}
a:hover {/*マウスをのせたとき*/
    color:#ffffff;
    text-decoration:none;
}
a:active {/*クリック中*/
    text-decoration:none;
}

a img{
border:none;
}

li { list-style: none; margin: 0px; padding-left:0px; }
ul { list-style: none; margin: 0px; padding-left:0px; }
ol { list-style: none; margin: 0px; padding-left:0px; }


h1 {
margin: 0;
padding: 0;
}

.clearfix:after {
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
.clearfix {
	min-height: 1px; /*IE6、7対策*/
}

* html .clearfix {
  height: 1px;
  /*?*//*/
  height: auto;
  overflow: hidden;
  /**/
}
#container {
	width: 100%;
	height: 100%;
	min-height: 100%;
	text-align: center;
	display:block;
	position:absolute;
	padding-bottom:115px;
	background-image: url(img/bg_overlay.png);
	
}
@media only screen and (max-width:785px) {
#container {
background-image: none;
padding-bottom:0px;}
}

body > #container {
  height: auto; /* 要素を超えた分の背景が伸びないブラウザ用 */
}

#modal a{
color:#fff;
}
#modal a:hover{
color:#d9c68d;
}
/* #fullbg_stretch
---------------------------
#fullbg_stretch  img {
	visibility: hidden;
}*/
/* ======================================== */

#top {
	display:block;
	width: 100%;
	height:75px;
	background-image: url(img/header_bg.png);
	margin:0 auto;
	position: fixed;
	top:0px;
	left:0px;
	z-index:999;
	overflow : hidden;
}
@media only screen and (max-width:785px) {
#top {
position:static;
	display:block;
	width: 100%;
	min-width: 785px;
	height:75px;
	background-image: url(img/header_bg.png);
	margin:0 auto;
	top:0px;
	left:0px;
	z-index:999;
	overflow : hidden;}
}
#topBox {
width: 100%;
max-width:1000px;
min-width: 785px;
margin:0 auto;
display: none;
overflow : hidden;
}
#topLogo {
width:350px;
float: left;
}
#navi {
display:block;
margin-right:10px;
}
#navi li{
display:block;
height:75px;
float: right;
margin-left: 1px;
}
#navi a {
cursor:pointer;
}

#menuBox {
	position:relative;
	display:block;
	width:750px;
	top:120px;
	margin: 0 auto 20px;
	display: none;
	overflow : hidden;
}
@media only screen and (max-width:785px) {
#menuBox {
position:absolute;
display:block;
width:750px;
top:120px;
margin: 0 auto 20px;
padding-left: 15px;
display: none;
overflow : hidden;}
}
#menuBox a {
cursor:pointer;
}

#menu {
display:block;
overflow: hidden;
width:750px;
}

#menu li {
margin:5px;
float: left;
}

#menu2 {
display:block;
overflow: hidden;
margin-top: -2px;
width:750px;
}

#menu2 li {
margin:0px 5px;
float: left;
}

#line {
    width:100%;
    position: fixed;
    top:75px;
    left:0px;
    background-image:url(img/line_bg.png) ;
    height:20px;
    z-index: 999;
}
@media only screen and (max-width:785px) {
#line {
position:absolute;
width:100%;
/*min-width: 785px;*/
top:75px;
left:0px;
background-image:url(img/line_bg.png) ;
height:20px;
z-index: 999;}
}
/*#topics {
position:relative;
    width:740px;
    height:75px;
    top:120px;
    margin: 0 auto;
    overflow:hidden;
    background-image:url(img/topics_bg.png) ;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    z-index: 900;
    display: none;
}
@media only screen and (max-width:785px) {
#topics {
position:relative;
width:740px;
height:75px;
top:566px;
margin: 0 22px;
overflow:hidden;
background-image:url(img/topics_bg.png) ;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
z-index: 900;
display: none;}
}
#topicsBox {
    width:736px;
    height:65px;
    margin: 5px auto 5px;
}
#topicsText {
text-align: left;
padding: 0 10px;
font-size:13px;
line-height: 160%;
color: #888888;
}
#topicsText li span{
color:#888888;
font-size: 11px;
background-color: #000000;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
padding:0 6px;
margin:0 5px;
}*/

#reserve {
position:relative;
width:100%;
height:180px;
background-image:url(img/reserve.png);
}
@media only screen and (max-width:785px) {
#reserve {
position:relative;
top:500px;
width:100%;
height:160px; }
}
@media only screen and (max-width:485px) {
#reserve {
position:relative;
top:500px;
width:100%;
height:480px; }
}

#footer {
background-image:url(img/footer_bg.png) ;
font-size: 11px;
padding:3px 0;
position: fixed;
width:100%;
text-align: center;
margin: 0 auto -1px;
z-index: 999;
bottom:0px;
left:0px;
color: #666;
display: none;
}

#tothetopfixed {
	position: fixed;
	right: 0px;
	bottom: 29px;
	z-index: 9000;
}
