/*
===== BASE LAYOUT =====================================
*/
body{
	font-family: "Helvetica Neue", "Arial", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
	background:url(../images/bg7.jpg);
}

#container{
	margin:60px auto 0;
	width:800px;
	padding: 0px;
	text-align:left;
	background:#fff;
}
#container{
	zoom:1;/*for IE 5.5-7*/
}
#container:after{/*for modern browser*/
	content:".";
	display: block;
	height:0;
	clear:both;
	visibility:hidden;
}
* html #container{
	display:inline-table;
	/*\*/display:block;/**/
}

#header{
	margin:0;
	width:800px;
}

#header img{
	width:100%;
	}
	
#header h1{
	position:absolute;
	top:-100px;
}


#maincontent{
	padding:20px 0 0;
}


#photo{
	width:100%;
	height:auto;
	margin:0 auto;

}

#photo img{width:100%;}


#owaku,#gwaku,#uwaku{
	width:223px;
	float:left;
	margin:0 25px;
	position:relative;
	height:285px;
	overflow:hidden;
	display:inline;
}
#gwaku{
	margin:0 13px;
}

#owaku h2,#gwaku h2,#uwaku h2{
	background-image:url(../images/m7.png);
	background-repeat:no-repeat;
	width:223px;
	height:44px;
	text-indent:-999em;
}

#owaku ul,#gwaku ul,#uwaku ul{
	width:222px;
	height:208px;
	margin:0 0;
	overflow:auto;
}
#owaku ul li,#gwaku ul li,#uwaku ul li{
	font-size:80%;
	margin: 9px 5px 0px 6px;
	background-image:url(../images/lib.png);
	background-repeat:no-repeat;
	padding:0 0 0 12px;
	line-height:130%;

}
#owaku ul li a,#gwaku ul li a,#uwaku ul li a{
	margin-left:10px ;
}

.wakubox{
	position:absolute;
	bottom:5px;
	right:5px;
	top: initial;
	top: auto;
}
.wakubox:hover{
	opacity:0.6;
}
.wakubox a{
	width:85px;
	height:20px;
	background-image:url(../images/ol.png);
	background-repeat:no-repeat;
	text-indent:-999em;
	display:block;
}


#menu{
	width:800px;
	margin: 25px auto 0;
}

#menu .box h5{
	color:#FFF;
	text-align:left;
	font-size:14px;
	line-height:25px;
	border-bottom:1px solid #FFF;
}

#menu .box .sub li {
	background-repeat:no-repeat;
	padding:0 0 0 5px;
	font-size:80%;
	margin:5px 0 5px 0px;
}
#menu .box .sub li a{
	color:#FFF;
	text-decoration:none;
}
#menu .box .sub li a:hover{
	text-decoration:underline;
}
.box {
    width:222px;
    padding:2px;
    margin: 10px 10px 0px 20px;
    float: left;
}

.sub{text-align:left;}



#footer{
	width:800px;
	padding:0px;
	margin:0 auto 0px;
	background:#121526;
	color:#FFF;
	text-align:center;
}
.footer-inner{
	margin:0px auto;
	padding:20px 0;
	width:760px;
	position:relative;
}

#footer a{
	color:#FFF;
}
#footer p{
	text-align:right;
	color:#FFF;
	font-size:11px;
}
#banner{
	position:absolute;
	right:0px;
	top:40px;

}
#toiawase{
	text-align:left;
	font-size:11px;
	line-height:2em;
}
.clear{
	clear:both;
	padding:0;
	margin:0;
}

/*** スマホ用 start **********/
@media screen and (max-width: 767px) {
	#owaku, #gwaku, #uwaku{
		margin:0px 10px 20px;
	}
	#owaku h2, #gwaku h2, #uwaku h2{
		background-image:none;
		text-indent:10px;
		font-size:1.0em;
		padding:5px 0px;
		height:auto;
		width:auto;
		border-top:solid 1px #CCCCCC;
		border-bottom:solid 1px #CCCCCC;
	}
	#menu{
		position:inherit !important;
	}
	.box{
		position:inherit !important;
		width:auto;
		float:none;
		margin:0px 5px 5px 5px;
	}
	#menu .box h5{
		width:auto;
		padding:3px 5px;
		background-image:url(../images/btn_Plus.png);
		background-position:98% 8px !important;
		background-repeat:no-repeat;
		background-size:16px 16px;
	}
	#menu .box h5.select{
		background-image:url(../images/btn_Minus.png);
	}
	#banner{
		position:static;
	}
	#menu .box .sub{
		display:none;
	}
	#menu .box .sub li{
		padding:10px 0px;
	}
}
/*** スマホ用 end ************/