/*▼ ハンバーガーメニュー  ここから▼*/

#header-sp{ background:rgba(255,255,255,.8); width:100%; height:60px; z-index:999; top:0; transition:0.7s ease; position:fixed;}
#header-sp #logo-sp{ padding:10px 10px 0;}
#header-sp #logo-sp a{ text-decoration:none;}
#header-sp #logo-sp p{ font-size:19px; font-weight:bold; color:#5a4c42; display:inline-block;}
#header-sp #logo-sp p span{ font-size:9px; font-weight:500; display:block; letter-spacing:normal; line-height:1.3em;}
#header-sp #logo-sp img{ vertical-align: top; height:30px; margin:5px 5px 0 0;}



/*============
ナビ
#navArea
=============*/
#navArea{ position:relative; z-index:999;}
#navArea .h2-01{ font-size:22px; margin-bottom:0px;}
#navArea .h2-01 span { background:url(../images/common/h2-icon.png) left 18px no-repeat; background-size:22px auto; padding-left:35px;}
#navArea .inner{ position:relative; z-index:999;}


#navArea .inner .area-01{ text-align:center; padding-top:10px; margin-bottom:15px;}
#navArea .inner .area-01 .contactarea{ display:block;vertical-align:middle;}
#navArea .inner .area-01 .contactarea a{ display:block; text-align:center; padding:5px 20px;background: linear-gradient(to right, #249dae, #9fd32c); vertical-align:middle; text-decoration:none; border-radius:10px; margin:0 20px;}
#navArea .inner .area-01 .contactarea i{ color:#239daf; margin-right:5px; font-size:30px; color:#FFF; line-height:1em;}
#navArea .inner .area-01 .contactarea .p-01{ font-size:20px;font-weight:bold; color:#FFF; line-height:1em;}
#navArea .inner .area-01 .contactarea .p-02{ font-family: "Oswald", sans-serif; color:#FFF; line-height:1em;}

#navArea .sns{ text-align:center;}

nav {
  display:block;
  position:fixed;
  top:60px;/*上からの距離*/
  right:-430px;/*左から出すか右から出すか*/
  bottom:0;
  width:100%;
  background:#fff;
  overflow-x:hidden;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  transition:all .5s;
  z-index:20;
  opacity:0;
}
.open nav {
  right:0;  /*左から出すか右から出すか*/
  opacity:1;
  top:60px;
}
nav .inner #menu {
  list-style:none;
  margin:0 0 15px;
  padding:0;
}
nav .inner #menu  a{
  display:block;
  color:#5a4c42;
  font-size:18px;
  font-weight:600;
	line-height:3;
	padding:0 0 0 1.5em;
  text-decoration:none;
  transition-duration:0.2s;
  position:relative;
	border-bottom:1px solid #efefef;
  font-family:"Zen Maru Gothic", serif;
}





/*============
メニュー（3本線）
.toggle_btn
=============*/
.toggle_btn {
  display:block;
  position:fixed;
  top:0px;
  right:0px;
  width:70px;
  height:60px;
  transition:all .5s;
  cursor:pointer;
  z-index:3;
}
.toggle_btn span {
  display:block;
  position:absolute;
  left:20px;
  width:30px;
  height:3px;
  background:#9FD32B;
  border-radius:15px;
  transition:all .5s;
}
.toggle_btn span:nth-child(1) {
  top:20px;
}
.toggle_btn span:nth-child(2) {
  top:30px;
}
.toggle_btn span:nth-child(3) {
  top:40px;
}
.open .toggle_btn span {
}
.open .toggle_btn span:nth-child(1) {
  -webkit-transform:translateY(10px) rotate(-45deg);
  transform:translateY(10px) rotate(-45deg);
}
.open .toggle_btn span:nth-child(2) {
  opacity:0;
}
.open .toggle_btn span:nth-child(3) {
  -webkit-transform:translateY(-10px) rotate(45deg);
  transform:translateY(-10px) rotate(45deg);}


/*============
背景（マスク）
#mask
=============*/
#mask {
  display:none;
  transition:all .5s;
}
.open #mask {
  display:block;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:#fff;
  opacity:.7;
  z-index:2;
  cursor:pointer;}






.tab-box {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin: 0 auto;
	color: #5a4c42;
}
.tab-area input {
	position: absolute;
	z-index: -1;
	opacity: 0;
}
.tab-area label {
	position: relative;
	display: block;
  font-size:18px;
  font-weight:600;
	line-height:3;
	padding:0 0 0 1.5em;
	cursor: pointer;
	margin: 0 0 0px 0;
	background: #fff;
	border-bottom:1px solid #efefef;
  font-family:"Zen Maru Gothic", serif;
	font-weight:bold;}
.tab-area label a{ display:block; text-decoration:none; color:#333;}
.tab-area:first-child input[type=checkbox] + label::after {
	display:none;}
	
	
.tab-area .entry {
	overflow: hidden;
	max-height: 0;
	-webkit-transition: max-height 0.35s;
	transition: max-height 0.35s;
  transition: .7s;
	color: #5a4c42;
	background: #f7f7f7;
}
#menu .tab-area p a{
	font-size:18px;
  padding-left:30px;}
#menu .tab-area p a i{ margin-right:5px;}
.tab-area .entry p a:last-child{
	border-bottom:none;}
/* :checked */
.tab-area input:checked ~ .entry {
	max-height:400px;
}
/* Icon */
.tab-area label::after {
	line-height: 3;
	position: absolute;
	top:0px;
	right: 0;
	display: block;
	width:3em;
	height:3em;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
	text-align: center;
	font-size:15px;
}
.tab-area input[type=checkbox] + label::after {
	content: '＋';
}
.tab-area input[type=checkbox]:checked + label::after {
	content: '－';
}