@charset "shift_jis";

/* =======================================

	Header CSS

 -----------------------------------------
	INDEX
 -----------------------------------------
 	1.Description
	
	2.Site Title
	
	3.Header Navi

========================================== */

#header {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	display: block;
	position: relative;
	z-index: 101;
}

#header h1 {
	margin: 0 auto;
	padding: 0;
	position: relative;
	width:auto;
}

#header h1 img{
	position: absolute;  
	top: 26px;  
	left: 20px;
	width:163px;
	height:auto;
}


/* 1.Description
========================================== */
p#description {
	z-index:100;
	display:none;
}

div.btn_menu{
	position: fixed;  
	top: 23px;  
	right: 24px;
	width:44px;
	height:48px;

	background:url(../../images/base/btn_menu.png) no-repeat;
	background-size:44px 48px;
	cursor:pointer;
	text-indent:-9999px;
}

_div.btn_entry{
	position: fixed;  
	top: 24px;  
	right: 75px;
}
div.btn_entry{
	position: fixed;  
	top: 80px;  
	right: 25px;
}
div.btn_entry2{
	position: fixed;  
	top: 176px !important;  
	right: 25px;
}
div.btn_contact,
div.btn_contact2{
	position: fixed;  
	top: 273px;  
	right: 25px;
}

_div.btn_entry img{
	width:92px;
	height:auto;
}
div.btn_entry img,
div.btn_contact img,
div.btn_contact2 img{
	width:45px;
	height:auto;
}

#drawernav{
position: fixed;
top: 0;
right: -260px;
width: 260px;
height: 100%;
background:url(../../images/page/menu_bg.png) ;
z-index: 1000;
	-webkit-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition: all 400ms cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */

	-webkit-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-moz-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	-o-transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); 
	transition-timing-function: cubic-bezier(1.000, 0.000, 0.000, 1.000); /* easeInOutExpo */
}


#humberger{
position: absolute;
top: 22px;
left: -56px;
width: 52px;
cursor:pointer;
}
.icon-bar{
height: 3px;
background: #fff;
display: block;
margin-bottom: 3px;
display:none;
}

body.drawer-opened #humberger :nth-child(1){
transform:translate(0,4px) rotate(45deg);
-webkit-transform:translate(0,4px) rotate(45deg);
}
body.drawer-opened #humberger :nth-child(2){
transform:translate(-5px ,0);
-webkit-transform:translate(-5px ,0);
opacity:0;
}
body.drawer-opened #humberger :nth-child(3){
transform:translate(0,-8px) rotate(-45deg);
-webkit-transform:translate(0,-8px) rotate(-45deg);
}

body.drawer-opened #humberger .icon-bar{
display:block;
}


#overlay{
z-index:-1;
opacity: 0;
background: #000;
left: 0;
top: 0;
width: 100%;
height: 100%;
position: fixed;
display:none;
}

/**
* ドロワー開放時のスタイル
**/

body.drawer-opened #drawernav{
right: 0;
}
body.drawer-opened #overlay{
z-index: 1000;
opacity: 0.5;
display:block;
}

ul.slidemenu{
	overflow-y: auto;
	overflow-x: hidden;
	margin:0 15px 0 15px;
	padding: 10px 0 50px 0;
	zoom: 1;
	position: relative;
	list-style:none;
	border-top:0px solid #00693e;

	-webkit-overflow-scrolling: touch;
}

ul.slidemenu li{
	margin:0 0 0 0;
	padding: 0 0 0 0;
	list-style:none;
}

ul.slidemenu li.f_nav_f{
	clear:both;
}

ul.slidemenu li a{
	padding: 10px 30px 10px 0;
	text-align: left;
	background: url(../../images/page/arr2.png) no-repeat;
	background-position: right 10px top 12px;
	background-size:18px 18px;
	border-bottom:1px solid #a29d9b;
	display:block;
	font-size:14px;
	line-height:1.5;
	color:#fff;
	text-decoration:none;
}

ul.slidemenu li.sns_nav{
	text-align: center;
}

ul.slidemenu li.sns_nav a{
	padding: 10px 5px 10px 5px;
	text-align: center;
	background: none;
	background-position: right 10px top 12px;
	background-size:18px 18px;
	border-bottom:0px solid #a29d9b;
	display:inline-block;
	font-size:14px;
	line-height:1.5;
	color:#fff;
}


ul.slidemenu li.f_nav_arr a{
	padding: 0 0 2px 0;
	text-align: left;
	background: none;
	border-bottom:0px solid #a29d9b;
	display:block;
	font-size:12px;
	line-height:1.5;
	color:#fff;
}

ul.slidemenu li.f_nav_s{
	border-bottom:1px solid #a29d9b;
}

ul.slidemenu li div{
	padding: 10px 0 10px 0;
	text-align: left;
	background: url(../../images/page/arr2.png) no-repeat;
	background-position: right 10px top 12px;
	background-size:18px 18px;

	display:block;
	font-size:14px;
	line-height:1.5;
	color:#fff;
	cursor:pointer;
}

ul.slidemenu li div:hover{
	text-decoration:none;
}

ul.slidemenu li img{
	margin-right:5px;
}

ul.slidemenu li.f_nav_s .slide_on{

}

ul.slide_drop{
margin: 0 0 0 15px;
display:none;
}

ul.slide_drop li{

display:block !important;
padding: 0 0 5px 0;
vertical-align:top;
}


ul.slidemenu li.f_nav_s .selected{
	margin: 0 0 0;
	background: url(../../images/page/btn_dropoff.png) no-repeat ;
	background-position: right 10px top 12px;
	background-size:18px 18px;
	cursor:pointer;
}

ul.slidemenu li.f_nav_info {
	padding: 10px 0 20px 0;
	font-size:12px;
	line-height:1.5;
	color:#fff;
}

ul.slidemenu li.f_nav_info img{
	margin:10px 10px 15px 0;
	vertical-align:middle;
}

ul.slidemenu li.f_nav_info span{
	font-size:14px;
	font-weight:bold;
}

ul.slidemenu li.f_nav_info a{
	padding: 0 0 0 0;
	text-align: left;
	background: none;
	background-position: right 10px top 12px;
	background-size:18px 18px;
	border-bottom:0px solid #a29d9b;
	display:inline;
	font-size:10px;
	line-height:1.5;
	color:#fff;
	text-decoration:none;
}

{
	border-radius: 3px;		/* CSS3草案 */
	-webkit-border-radius: 3px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 3px;	/* Firefox用 */
	moz-box-shadow: 1px 1px 3px #aaa;
	-webkit-box-shadow: 1px 1px 3px #aaa;
}