@charset "utf-8";



/*--------------------*/
/*　以下メニューCSS　*/
/*--------------------*/

nav {
	position: fixed;
	top: 0;
	right:0;
	width: 300px;
	height: 100%;
	background-color: #333;
	transition: all 0.1s;
	transform: translate(300px);
	z-index: 1000;
}
nav.open {
	transform: translate(0); 
}
nav ul {
	margin: 0;
	padding: 1em;
	list-style-type: none;
	overflow: auto;
}
nav ul li {
	padding: 1em 0;
	border-bottom: 1px solid #fff;
	text-align: left;
}
nav ul li a {
	display: block;
	text-decoration: none;
	color: #fff;
}
.navMenu li:last-child {
	border-bottom: none;
}

/* スマホでサブメニュー　消した　 */
@media screen and (max-width:849px){
    .navMenu li ul{
        display: none;
    }
}



/*
.navMenu li ul{
	padding:0;
	margin-top:0.5em;
}
.navMenu li ul li{
    padding-left: 1.5em;
}
.navMenu li ul li a:before{
    content: "- "
}


.navMenu li ul li:nth-child(1) {
	border-top: 1px solid #fff;
}
.navMenu li li:last-child {
}
*/




/* 開閉ボタン */

.navBtn button {
  display: block;
  background:#333;
  border: none;
  padding: 0 5px;
  width: 48px;
  color: #333;
  letter-spacing: 0.1em;
  cursor: pointer;
  position: fixed;
  top: 10px;
  right:10px;
  z-index: 1001;
  text-align: center;
  outline: none;
}
/* ハンバーガーボタン3本線 */
.navBtn button span.bar {
  display: block;
  height: 3px;
  background-color: #fff;
  margin: 10px 0;
  transition: all 0.1s;
  transform-origin: 0 0;
}
/* メニューアクティブ時 */
.navBtn button.active{
	background-color:#666;
}

.navBtn button.active span.bar {
  width: 45px;
}
.navBtn button.active .bar1 {
  transform: rotate(36deg);
}
.navBtn button.active .bar2 {
  opacity: 0;
}
.navBtn button.active .bar3 {
  transform: rotate(-36deg);
}




@media screen and (min-width:850px){
	/* PCでメニュボタン非表示 */
	.navBtn{display:none;}
	
	/*　PCでメニュー常時表示　*/
	nav{
		position: static;
		transform:none;
		width:100%;
		background-color:transparent;
	}
	nav.navMenu ul{
		width:100%;
		margin:auto;
		overflow:visible;
	}
	.navMenu ul:after{
		content:"";
		clear:both;
	}
	.navMenu ul li {
		padding: 0;
		width: 16.6%;
		float:left;
		border-bottom: none;
		text-align:center;
		position:relative;
	}
	.navMenu ul li a{
		color:#000;
		font-family:'NotoSansJP-M';
		padding:0.6em 0;
	}
	.navMenu ul li a:hover,
	.navMenu ul li.stay a,
    .navMenu ul li.stay li a:hover{
		color:#0000bb;
	}
    .navMenu ul li.stay li a{color: #000;}


	.navMenu ul li.sp{display:none;}

	.navMenu li ul{
	  position: absolute;
	  z-index: 9999;
	  top: 100%;
	  left:0;
	  padding:0;
	  margin:0;
	
	}
	.navMenu li ul li{
	  width:100%;
	  font-size:80%;
	  line-height:1.2em;
	}
	.navMenu li ul li a{
	  padding: 13px 0;
	  border-top: 1px solid #eee;
	  background: #fff;
	}
	.navMenu li ul li:last-child a{
		border-bottom:1px solid #eee;
	}
	.navMenu li ul li a:hover{
	  background: #eee;
	}
	
    
    
	
	.navMenu ul li ul li{
	  overflow: hidden;
	  height: 0;
	  transition: .2s;
	}
	.navMenu ul li:hover ul li{
	  overflow: visible;
	  height: 43px;
	}



	
}