@charset "utf-8";
/* CSS Document */



* { 
margin: 0;
 padding: 0;
  border: 0;
   list-style: none; 
   }

p {
	padding-top: 2px;
	padding-bottom: 4px;
	margin: 0px;
}

a {
	color: #0081D3;
	text-decoration: none;
} 
 
a:hover {
	color: #1C8610;
} 



.photo {
	border: 10px solid #FFF;
	border-radius:8px;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	box-shadow:1px 1px 4px #ccc;
	-moz-box-shadow:1px 1px 4px #ccc;
	-webkit-box-shadow:1px 1px 4px #ccc;
}

/*---------------------------------------------------------
  						clearfix
---------------------------------------------------------*/
.clearfix:after {
    content: "."; 
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}
.clearfix {
    min-height: 1px;
}
.clea{
	clear:both;	
	}
* html .clearfix {
    height: 1px;
    /*¥*//*/
    height: auto;
    overflow: hidden;
    /**/
}


h1 {
	width: 500px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;

}
h1 img {
	width: 100%;
}


.tel {
	width: 370px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.tel img {
	width: 100%;
}
h2 {
	position: relative;
	padding-top: 0.3em;
	padding-right: 0.3em;
	padding-left: 1em;
	padding-bottom: 0.3em;
	background-color: #66A5BC;
	margin-bottom: 1em;
	color: #603800;
	font-size: 25px;
	font-weight: normal;
	margin-top: 1em;
	background-image: url(images/bg_h2.png);
	border-radius: 10px;
	text-align: left;
	border: 2px solid #57C016;
}


h3 {
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: auto;
	text-align: left;
	color: #073D6F;
	font-size: 22px;
	font-weight: normal;
	padding-bottom: 4px;
	padding-left: 5px;
	padding-top: 4px;
}


h4 {
	text-align: left;
	font-size: 18px;
	font-weight: bold;
	color: #FFFFFF;
	margin-top: 10px;
	margin-bottom: 10px;
	background-color: #00496D;
	padding-left: 3px;
}
h5 {
	background-image: url(images/list4.png);
	background-repeat: no-repeat;
	background-position: left top;
	text-align: left;
	font-weight: bold;
	font-size: 16px;
	padding-left: 30px;
	color: #02740B;
	margin-bottom: 10px;
}
img {
	vertical-align: bottom;
	border: 0px;

}



main a:hover img {
	opacity: 0.7;
	-moz-opacity:0.7; 
	filter: alpha(opacity=70);
	zoom: 1;
}




/*ページ構成*/
html,body {
	height: 100%;
	margin: 0px;
	padding: 0px;
	width: 100%;
	text-align: center;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 15px;
	color: #564235;
	background-repeat: repeat-x;
	background-position: center top;
	background-color: #FFFFFF;
	background-image: url(images/bg_main.png);
}


#system_main {
	width: 100%;
	text-align: center;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;

}


header {
	height: 300px;
	width: 100%;
	text-align: center;
	padding: 0px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(images/bg_header.png);
	background-repeat: repeat-x;
	-webkit-box-shadow: 0px 0px;
	box-shadow: 0px 0px;
	background-position: center top;
	margin-top: -240px;
}

#cloud{
	width: 2000px;
	height: 240px;
	background-image: url(images/bg_header_cloud.png);
	animation: cloudmove 150s linear infinite;
	-webkit-animation: cloudmove 150s linear infinite;
	-moz-animation: cloudmove 150s linear infinite;
	margin-left: auto;
	margin-right: auto;
}
@keyframes cloudmove {
	0% {background-position: 0 0;}
	25% {background-position: 500px 0px;}
	50% {background-position: 1000px 0;}
	75% {background-position: 1500px 0px;}
	100% {background-position: 2000px 0;}
}
@-webkit-keyframes cloudmove {
	0% {background-position: 0 0;}
	25% {background-position: 500px 5px;}
	50% {background-position: 1000px 0;}
	75% {background-position: 1500px 5px;}
	100% {background-position: 2000px 0;}
}
@-moz-keyframes cloudmove {
	0% {background-position: 0 0;}
	25% {background-position: 500px 5px;}
	50% {background-position: 1000px 0;}
	75% {background-position: 1500px 5px;}
	100% {background-position: 2000px 0;}
}


#side {
	background-color: #4A2800;
}

/* ==========================================================================
   メニュー
   ========================================================================== */
div#nav{
	margin-right: auto;
	margin-left: auto;
	padding: 0;
	clear: both;
	width: 1000px;

}
div#nav ul:after{
	height: 0;
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
}
div#nav ul li{
	list-style-type: none;
	width: 200px;
	float: left;
}

#toggle{
	display: none;
}




#menu1 a {
	display: block;
	overflow: hidden;
	height: 0px;
	width: 200px;
	background-image: url(images/menu1.png);
	padding-top: 80px;
	text-align: center;
	margin: 0px;
}
#menu1 a:hover {
    background-position: 0 -80px;
}
	
#menu2 a {
	display: block;
	overflow: hidden;
	height: 0px;
	width: 200px;
	background-image: url(images/menu2.png);
	padding-top: 80px;
	text-align: center;
	margin: 0px;
}
#menu2 a:hover {
    background-position: 0 -80px;
}

#menu3 a {
	display: block;
	overflow: hidden;
	height: 0px;
	width: 200px;
	background-image: url(images/menu3.png);
	padding-top: 80px;
	text-align: center;
	margin: 0px;
}
#menu3 a:hover {
    background-position: 0 -80px;
}

#menu4 a {
	display: block;
	overflow: hidden;
	height: 0px;
	width: 200px;
	background-image: url(images/menu4.png);
	padding-top: 80px;
	text-align: center;
	margin: 0px;
}
#menu4 a:hover {
    background-position: 0 -80px;
}
	
#menu5 a {
	display: block;
	overflow: hidden;
	height: 0px;
	width: 200px;
	background-image: url(images/menu5.png);
	padding-top: 80px;
	text-align: center;
	margin: 0px;
}
#menu5 a:hover {
    background-position: 0 -80px;
}




#wrapper {
	margin-right: auto;
	margin-left: auto;
	width: 1200px;
	margin-top: 40px;
	margin-bottom: 40px;
}





main {
	display: block;
	width: 980px;
	margin-right: auto;
	margin-left: auto;
	overflow: hidden;
}



footer {
	width: 100%;
	text-align: center;
	padding-bottom: 20px;
	background-image: url(images/bg_footer.png);
	background-repeat: repeat;
	background-position: center top;
	border-top: 10px solid #FFD780;
}
footer .copy img {
width: 500px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 20px;
	padding-bottom: 20px;
}


.pagetop {
	text-align: right;
	padding-top: 1em;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 1em;
	width: 94%;
}


h3.open_h3{
    cursor: pointer;
    margin: 0;
}
.open_h3:before, 
.open_h3.active:before {
	margin-right: 20px;
}
.open_h3.active::before {
    content: "－";
}
.open_h3::before {
    content: "＋";
}



/* トップ */

.info2 {
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.info2 a {
	padding-top: 7px;
	padding-bottom: 7px;
	margin-left: auto;
	border-radius: 10px;
	display: block;
	color: #FFFFFF;
	-webkit-box-shadow: 1px 1px 3px #B0A192;
	box-shadow: 1px 1px 3px #B0A192;
	width: 250px;
	text-align: center;
	margin-right: auto;
	margin-bottom: 15px;
	background-color: #FF484E;
	text-decoration: none;
}
.info2 a:hover {
	background-color: #67C513;
	color: #FFFFFF;
}



#rinen {
	margin-bottom: 50px;
	margin-right: auto;
	margin-left: auto;
	}
.rinen1 {
	text-align: left;
	font-size: 1.7em;
	margin-left: 12px;
	margin-right: 12px;
}
.rinen2 {
	text-align: left;
	margin-left: 12px;
	margin-right: 12px;
	font-size: 1.2em;
}

#top {
	margin-bottom: 20px;
	}
	

#top img {
	width: 100%;
}

#map {
	}

#map table {
	border-spacing: 3px;
	width: 100%;

}
#map th {
	border: 2px solid #74B7FF;
	padding: 1em;
	text-align: center;
	width: 25%;
}
#map td {
	border: 2px solid #74B7FF;
	padding:1em;
	text-align:left;
}


	
#map iframe {
	width: 95%;
	height: 300px;
	border: 4px solid #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	}


#outline {
	margin-bottom: 30px;
	}

#outline table {
	border-spacing: 3px;
	width: 100%;

}

.omainth  {
	border: 2px solid #74B7FF;
	padding: 1em;
	text-align: center;
	width: 25%;
	background-color: #F0F8FF;
}
.omaintd {
	border: 2px solid #74B7FF;
	padding:1em;
	text-align:left;
}
.osubth  {
	border: 1px solid #74B7FF;
	padding: 0.5em;
	text-align: center;
	color: #2874C5;
}
.osubtd {
	border: 1px solid #74B7FF;
	padding: 0.5em;
	text-align: center;
}

#floor {
	padding: 30px;
	background-color: #FFF5B2;
	border-radius: 30px;
	margin-bottom: 20px;
	}

#floor table {
	width: 100%;
}

#floor td {
	width: 50%;
}
#floor td img {
	width: 100%;
}



#daily {

	}

#daily dl {
	text-align: left;
	}
#daily dt span {
	padding-top: 5px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 5px;
	border-radius: 5px;
	background-color: #00A33D;
	color: #FFFFFF;
	}
#daily dd {
	margin-top: 10px;
	margin-bottom: 30px;
	background-color: #E3F9EB;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	}
.img_pc {
}
.img_pc img {
	width: 100%;
}

.img_sp {
	display: none;
}
.img_sp img {
	width: 100%;
}

#event {

	}







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

header,footer,main,#mainnav, #mainnav ul, #system_main,#topside {
	width: 100%;
	height:auto;	
}
#system_main {
	position: relative;
}

header {
	height: 120px;
	width: 100%;
	margin-top: -120px;
	background-size: 100% auto;
}

	
html,body {
	background-size: 100% auto;
}


h3 {
	font-size: 20px;
}

#cloud{
	width: auto;
	height: 120px;
	background-image: url(images/bg_header_cloud2.png);
	animation: cloudmove 120s linear infinite;
	-webkit-animation: cloudmove 120s linear infinite;
	-moz-animation: cloudmove 120s linear infinite;
	margin-left: auto;
	margin-right: auto;
}
@keyframes cloudmove {
	0% {background-position: 0 0;}
	25% {background-position: 250px 0px;}
	50% {background-position: 500px 0;}
	75% {background-position: 750px 0px;}
	100% {background-position: 1000px 0;}
}
@-webkit-keyframes cloudmove {
	0% {background-position: 0 0;}
	25% {background-position: 250px 0px;}
	50% {background-position: 500px 0;}
	75% {background-position: 750px 0px;}
	100% {background-position: 1000px 0;}
}
@-moz-keyframes cloudmove {
	0% {background-position: 0 0;}
	25% {background-position: 250px 0px;}
	50% {background-position: 500px 0;}
	75% {background-position: 750px 0px;}
	100% {background-position: 1000px 0;}
}



	
div#nav{
	margin: 0;
	width: 100%;
	background-color: #FFFFFF;
	}
div#nav ul{
		height: auto;
		display: none;
		text-align: center;
	}
div#nav ul li{
	padding: 0;
	width: 100%;
	clear: left;
	float: none;
	margin-top: 2px;
	margin-bottom: 2px;
	}
div#toggle{
	width: 50px;
	display: block;
	position: absolute;
	right: 0px;
	top: 0px;
	height: 50px;
	}
div#toggle a{
		padding: 0;
		display: block;
		text-align: center;
	}
div#nav ul li a:link,
div#nav ul li a:visited{
		display: block;
	}
	
	
	
#menu1,#menu2,#menu3,#menu4,#menu5,#menu6,#menu7,#menu8 {
	width: 100%;
	padding:0px;
	margin: 0px;
}


#menu1 a,#menu2 a,#menu3 a,#menu4 a,#menu5 a,#menu6 a,#menu7 a,#menu8 a {
	width: 100%;
	text-decoration: none;
	padding-top: 0px;
	height: 50px;
	color: #4A2800;
	line-height: 50px;
	background-color: #FFEB8C;
	background-image: url(none);
	}


#menu1 a:hover,#menu2 a:hover,#menu3 a:hover,#menu4 a:hover,#menu5 a:hover,#menu6 a:hover,#menu7 a:hover,#menu8 a:hover {
	color: #FFFFFF;
	height: 50px;
	background-color: #FF9A17;
	background-image: url(none);
	}


.pagetop {
	text-align: right;
	padding-bottom: 10px;
	width: 95%;
	margin-right: auto;
	margin-left: auto;
}

footer .copy img {
	width: 80%;
	height:auto;
	}

	
h2 {

	font-size: 22px;

}

		
h1 {
	width: 70%;
	text-align: center;
	margin-left: auto;
	padding-top: 0px;
	margin-top: 0px;
}

#wrapper {
	width:auto;
	margin-top: 10px;
	margin-bottom: 10px;
}

main {
	margin-top: auto;
	margin-bottom: auto;
	width:94%;
	float: none;
}

#side {
	width:auto;
	float: none;
}
#outline table {
	width: auto;

}
.omainth  {
	border: 2px solid #74B7FF;
	padding: 1em;
	text-align: center;
	width: auto;
	display: block;
	background-color: #F0F8FF;
}
.omaintd {
	border: 2px solid #74B7FF;
	padding:1em;
	text-align:left;
	display: block;
}	


}

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

h1 {
	width: 70%;
	margin-right: auto;
	margin-left: auto;
}

html,body {
	background-image: url(images/bg_main_sp.png);
	background-size: auto auto;
}



h3 {
	font-size: 20px;
}

header {
	height: 130px;
	width: 100%;
	margin-top: -120px;
	background-image: url(images/bg_header_sp.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: auto auto;
}
	
footer .copy img {
	width:80%
}


#rinen img {
	width:100%
}
#floor td {
	width: auto;
	display: block;
}
.img_pc {
	display: none;
}


.img_sp {
	display: block;
}


.scrolltxt {
	display: block;
}

/*テーブルのスクロール*/ 
.x-scroll {
overflow: auto;
}
.x-scroll table{
width:100%;
}
.x-scroll::-webkit-scrollbar{
height: 5px; /* スクロールバーの高さ */
}
.x-scroll::-webkit-scrollbar-track{
background: #F1F1F1; /* スクロールバーの背景色 */
}
.x-scroll::-webkit-scrollbar-thumb {
background: #d6d6d6; /* スクロールバーの色 */
}
.x-scroll td, .x-scroll th{
white-space: nowrap;　/* 文字の折返しを禁止 */
}


	}