@charset "UTF-8";

html,body{overflow-x:hidden}

body{
	font-family:"ヒラギノ角ゴ ProN W3","HiraKakuProN-W3","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","helvetica","arial",sans-serif;
	margin:0;
	max-height:100%;
	-webkit-text-size-adjust:100%
}

img{
	height:auto;
	max-width:100%
}

a{
	display:inline-block;
	max-width:100%;
	text-decoration:none
}

a:hover{text-decoration:none}

h1,h2,h3,h4,h5,h6{font-size:small}

img{vertical-align:bottom}

ul{list-style-type:none}

/**/

#header{position:relative}

#h1{
	height:100%;
	margin:0;
	position:absolute;
	width:100%
}

#h1>img{
	bottom:0;
	left:0;
	margin:auto;
	max-width:95%;
	position:absolute;
	right:0;
	top:0
}

#img{width:100%}

.header{
	overflow:hidden;
	padding:0 100% 30% 0
}

.header>#h1{z-index:1}

.header>#img{
	bottom:-20%;
	position:absolute
}

/**/

[data-hover="a"]{
	-webkit-transition:opacity .5s;
	transition:opacity .5s
}

.a{opacity:.5}

/**/

#button{
	bottom:0;
	height:70px;
	left:10px;
	margin:auto;
	position:fixed;
	top:0;
	z-index:100
}

#button>a{display:block}

#button>a+a{margin-top:2px}

/**/

.ib-m{
	display:inline-block;
	float:none;
	vertical-align:middle
}

/**/

#footer-back{background:#333}

#footer{
	margin:auto;
	max-width:1790px;
	width:95%
}

#footer>*{padding:5% 0}

#footer ul{
	display:inline-block;
	margin:0;
	padding:0;
	vertical-align:top
}

#footer ul+ul{margin-left:50px}

#footer ul a{
	color:#fff;
	font-weight:bold
}

#footer li+li{margin-top:15px}

/**/

#add{margin-top:5%}

#add>address{margin:5% 0 10px}

#add>*{
	color:#bfbfbf;
	font-size:11px
}

/**/

.list-1>*>div{
	display:table-cell;
	vertical-align:top
}

p{letter-spacing:1px}

/**/

#menu-box{
	border-radius:10px;
	background:#9cc122;
	padding:5px 10px;
	position:fixed;
	right:10px;
	top:10px;
	z-index:2000
}

#menu{
	cursor:pointer;
	height:45px;
	position:relative;
	width:45px
}

#menu>*{
	background:#fff;
	height:5px;
	position:absolute;
	width:100%
}

.close{opacity:1}

.close>*{
	-webkit-transition:top .5s .5s,-webkit-transform .5s;
	transition:top .5s .5s,transform .5s
}

.close>.menu-1{top:5px}

.close>.menu-2{top:20px}

.close>.menu-3{top:35px}

.body .close>*{
	-webkit-transition:top .5s,-webkit-transform .5s .5s;
	transition:top .5s,transform .5s .5s
}

.body .close>.menu-1,
.body .close>.menu-2{
	top:20px;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg)
}

.body .close>.menu-3{
	top:20px;
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg)
}

#side{
	background:#fff;
	height:100%;
	max-width:300px;
	overflow:auto;
	position:fixed;
	right:0;
	top:0;
	-webkit-transform:translateX(100%);
	transform:translateX(100%);
	-webkit-transition:-webkit-transform .5s;
	transition:transform .5s;
	z-index:1500;
	width:100%
}

#side>*{
	display:table;
	height:100%;
	width:100%
}

#side-cell{
	display:table-cell;
	vertical-align:middle
}

#side-cell>ul{
	display:table;
	margin:auto;
	padding:0;
	text-align:center
}

#side-cell li{margin:15px 0}

#side-cell li:last-child>a{color:#9cc122}

#side-cell a{
	color:#333;
	font-size:20px;
	font-weight:bold;
	position:relative
}

#side-cell div{
	background:#9cc122;
	bottom:0;
	height:4px;
	left:0;
	margin:auto;
	position:absolute;
	right:0;
	-webkit-transition:width .5s;
	transition:width .5s;
	width:0
}

#side-cell .menu>div{width:100%}

.body #side{
	-webkit-transform:translateX(0);
	transform:translateX(0)
}

/**/

.close:hover{opacity:1}

#body{
	-webkit-transition:-webkit-transform .5s;
	transition:transform .5s
}

.body #body{
	-webkit-transform:translateX(-300px);
	transform:translateX(-300px);
}

@media(max-width:991px){
	#footer .row>div+div{margin-top:5%}
}

@media(max-width:800px){
	#footer ul{
		width:49%
	}
	
	#footer ul:nth-child(2)~ul{margin-top:15px}
	
	#footer ul:nth-child(3){width:100%}
	
	#footer ul+ul{margin-left:0}
	
	#add{
		border-top:1px solid #fff;
		padding-top:5%
	}
}

@media(max-width:500px){

	#button{display:none}

	#footer ul{font-size:12px}

	#side-cell>ul{
		-webkit-transform:scale(.7);
		transform:scale(.7)
	}

}