/* CSS Document */
.pc_menu{
transition-duration:.3s;position:fixed;top:0;z-index:100;background:#FFF;height:120%;
right:-400px;
}
#menu_area{
	margin-bottom:10px;
}
#headermenu{
	margin-left:auto;
	width:300px;
}
#headermenu li{
	margin:0 auto;
	width:180px;
	-moz-transition-property: background-color, width, height;
	-webkit-transition-property: background-color, width, height;
	-o-transition-property: background-color, width, height;
	-ms-transition-property: background-color, width, height;

	-moz-transition-duration:0.5s;
	-webkit-transition-duration:0.5s;
	-o-transition-duration:0.5s;
	-ms-transition-duration:0.5s;

	-moz-transition-timing-function: ease-out;
	-webkit-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	-ms-transition-timing-function: ease-out;
}
#headermenu li:not(:last-child){
	background-image: linear-gradient(to right, #000, #000 1px, transparent 1px, transparent 4px);
	background-size: 5px 2px;
	background-position: bottom;
	background-repeat: repeat-x;
}
#headermenu li a{
	color:#333;
}
#headermenu li span {
	display: block;
	font-size: 16px;
	padding: 20px 10px;
	text-align:center;
	font-weight: 700;
		color:#686868;
}


#headermenu li a,
#headermenu li a:hover{
	text-decoration: none;
}
#headermenu li a:hover span{

	color:#e4007f;
}
.common_header{
z-index:99
}
.sp_menu_header{
	position:relative;
}
#menu_overlay{
	z-index:99;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:120%;
	background-color:rgba(0,0,0,.5);
	display:none;

}
#menu_overlay.active{
	display:block;
}
.close_overlay {
  display: inline-block;
  width: 50px;
  height: 50px;
  position: absolute;

  cursor: pointer;right: 320px;
	top: 15px;
}
.close_overlay span::before,
.close_overlay span::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 84%;
  height: 8%;
  margin: -8% 0 0 -42%;
  background: #FFF;
}
.close_overlay span::before {
  transform: rotate(-45deg);
}
.close_overlay span::after {
  transform: rotate(45deg);
}
@media screen and (max-width:768px) {
	.common_header{
	z-index:100
	}
	.sp_menu_header{
		position:relative;
	}
	#menu_area{
		margin-bottom:0px;
	}
	#headermenu{
		width:auto;
	}
	#headermenu li{
		float:none;
		font-size:14px;
		width:auto;
	}
	#headermenu li:not(:last-child){
		border-right:none;
	}
	#headermenu li span {
		display: block;
		font-size: 13px;
		padding: 15px 10px;
		text-align:left;
	}
	#headermenu li a{
		color:#333;
	}
	#headermenu li {
		border-bottom: 1px solid #ededed;

		-moz-transition-property: background-color, width, height;
		-webkit-transition-property: background-color, width, height;
		-o-transition-property: background-color, width, height;
		-ms-transition-property: background-color, width, height;

		-moz-transition-duration:0.5s;
		-webkit-transition-duration:0.5s;
		-o-transition-duration:0.5s;
		-ms-transition-duration:0.5s;

		-moz-transition-timing-function: ease-out;
		-webkit-transition-timing-function: ease-out;
		-o-transition-timing-function: ease-out;
		-ms-transition-timing-function: ease-out;
	}
	#headermenu li:hover{
		background-color:#EEE;
	}
}

/*
sp header
*/
a.menu_toggle{
  text-decoration:none;
  color:#FFF;
}
.menu_text{
    display:block;
    margin-top: 1px;
    font-weight:700;
    text-align:center;
		line-height:0;
		color:#000;
    text-indent: 3px;
}
.sp_menu_toggle li{
  width:100%;
  background-color:#FFF;
  text-align:center;
  font-size:16px;
  color:#686868;
  height:50px;padding-top: 10px;
	padding-bottom: 10px;
	box-sizing: border-box;

	background-image: linear-gradient(to right, #000, #000 1px, transparent 1px, transparent 4px);
	background-size: 5px 2px;
	background-position: bottom;
	background-repeat: repeat-x;

}
	.sp_menu_toggle a:last-child li{
		background:none;
	}

.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-trigger {
	position: relative;
    width: 31px;
    height: 22px;
    margin-left: 6px;
    margin-bottom: 3px;
}
.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #EB6FA5;
  border-radius: 2px;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 10px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}

.menu-trigger.active {
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}

.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(10px) rotate(-45deg);
  transform: translateY(10px) rotate(-45deg);
  height: 4px;
}
.menu-trigger.active span:nth-of-type(2) {
  -webkit-transform: translateY(0) rotate(45deg);
  transform: translateY(0) rotate(45deg);
  height: 4px;
}
.menu-trigger.active span:nth-of-type(3) {
  opacity: 0;
}

.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
		z-index:99;
}

ul.sp_menu_toggle {
	position:fixed;
	z-index:1;
    top: 60px;
    left: 0;
    background: #fff;
    color: #000;
    text-align: center;
    transform: translateY(-140%);
    transition: all 0.6s;
    width: 100%;
}

 ul.sp_menu_toggle a,
 ul.sp_menu_toggle a:hover,
 ul.sp_menu_toggle a:active{
   text-decoration:none;
 }

ul.sp_menu_toggle.active {
    transform: translateY(0%);
    z-index: 100;
}
.sp_menu_toggle li.top_border{
	border-top:2px solid #EB6FA5;
}

@media screen and (max-width:768px) {
	.menu-trigger {
		position: relative;
		width: 28px;
		height: 22px;
		margin-left: 8px;
		margin-bottom: 3px;
	}

	.fixed {
			z-index:100;
	}
}
.member-actions a{
	text-decoration: none;
}