/* Nav共通 */
.Nav {
margin-top: 0px;
}
.menuespace{
max-width:900px;
margin:2em auto 0;
padding:0px;
text-align:center;
}

.infospaces{
max-width:100%;
margin:0 auto;
padding:0px;
text-align:center;
background:#fff;
}

@media screen and (max-width:950px) {
.Nav {
margin-top: -30px;
position: relative;
border-top:none;
}
}

/* ______ ハンバーガMENU ______ */
.Nav .navbtn,
.Nav .hbg {
  display: none;
}
@media screen and (max-width:950px) {
.Nav .navbtn {
display: block;
position: absolute;
top: -42px;
right: 10px;
}
}
/* ______ ハンバーガMENUアイコンの下の文字 ______ */
@media screen and (max-width:950px) {
.Nav .hbg {
display:block;
position:absolute;
top:-5px;
right:7px;
font-size:.8em;
color:#000;
}
}

@media screen and (max-width:950px) {
.Nav .navbtn a,
.Nav .navbtn a.close {
display: block;
position: relative;
width: 40px;
height: 40px;
background-color: #000;
}

/* ______ 上の線 ______ */
.Nav .navbtn a::before,
.Nav .navbtn a.close::before {
position: absolute;
top:10px;
left:10px;
content:"";
width: 20px;
height: 3px;
background-color: #FFF;
transition: .2s;
}
.Nav .navbtn a.open::before {
top:19px;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
/* ______ 下の線 ______ */
.Nav .navbtn a::after,
.Nav .navbtn a.close::after {
position: absolute;
bottom:10px;
left:10px;
content:"";
width: 20px;
height: 3px;
background-color: #FFF;
transition: .2s;
}
  
.Nav .navbtn a.open::after {
bottom:18px;
content:"";
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
}
}

@media screen and (max-width:950px) {
.Nav .navbtn a span {
display: block;
overflow: hidden;
width: 1px;
height: 1px;
}

/* ______ 中央の線 ______ */
.Nav .navbtn a span::after,
.Nav .navbtn a.close span::after {
position: absolute;
top:18px;
left:10px;
content:"";
width: 20px;
height: 3px;
background-color: #FFF;
}
.Nav .navbtn a.open span::after {
display: none;
}
}

.Nav ul.close {
display: none;
border-top: solid 1px #F5F4F0;
}
.Nav > ul {
margin: 0 auto;
max-width: 950px;
}

@media screen and (max-width:950px) {
.Nav > ul {
display: none;
position: absolute;
top: 0;
left: -90;  /*_ ハンバーガmenuプルダウンの左からのアキ __ */
right: 0;
z-index:2000;
background-color: #FFF;
}
}

/*______ menu文字  _____ */
.Nav > ul > li {
position: relative;
font-size: 1em;
display: block;
}

.Nav > ul > .norms,
.Nav > ul > .parent{
float:left;
width:12em;
}

.infospaces .norms a,
.infospaces .parent a{
border-left:0px solid #000;
margin:0 auto;
text-align:center;
}

.infospaces .submenu a{
border-top: solid 1px #dddddd;
border-left:0px solid #000;
text-align:left;
}

.Nav > ul > li a {
padding: .2em .8em;
margin: 0px;
}

@media screen and (max-width:950px) {
.Nav > ul > li {
display: block;
padding: 0;
border-bottom: solid 1px #dddddd;
border-left: solid 0px #000;
}
 
 /*_ ハンバーガmenuプルダウンの左右幅 __ */
.Nav > ul > .norms,
.Nav > ul > .parent{
float:none;

}

.infospaces .norms a,
.infospaces .parent a{
border-left:0px solid #000;
}

/*______ ハンバーガmenuプルダウンの上下アキ  _____ */
.Nav > ul > li a {
padding: 19px 15px;
}

}

/* これを活かすとメニュー下が落ち着く
.infospaces .norms a,
.infospaces .parent a{
padding:0 .5em;
margin:0px;
}
*/

@media screen and (max-width:950px) {
.Nav > ul > li.parent.open > a::before {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
}
@media screen and (max-width:950px) {
.Nav > ul > li.parent.open {
border-bottom: none;
}
}

.Nav > ul > li.parent.open > a{
color: #FFF;
}
.Nav > ul > li.parent.open > a::after {
background: #333;
-webkit-transform: scale(1);
transform: scale(1);
}
@media screen and (max-width:950px) {
.Nav > ul > li.parent.open > a {
color: #FFF;
}
}


.Nav > ul > li a:hover {
color: #000;
}

.Nav > ul > li a,
.Nav > ul > li a::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
.Nav > ul > li a::after {
top: 0;
left: 0;
width: 100%;
height: 100%;
-webkit-transform: scale(.65);
transform: scale(.65);
}

/* ______ マウスオーバー時の背景色 ______ */
.Nav > ul > li a:hover {
color: #000;
background: #BBDAFF;
}

/*______ menu上下アキ  _____ */
.Nav > ul > li a {
display: block;
position: relative;
text-decoration: none;
text-align:left;
color: #333;
background-color: #fff;
z-index: 2000;
}


/* 2階層 */
.Nav > ul > li > ul {
display: none;
position: absolute;
top: 2.2em;
left: 0;
width: auto;
background-color: rgba(255, 255, 255, 0.8);
z-index: 3000;
}


@media screen and (max-width:950px) {
.Nav > ul > li > ul {
background-color: #fbfbfb;
position: static;
}
}
 
.Nav > ul > li > ul li {
white-space: nowrap;
}
 
.Nav > ul > li > ul li a {
position: relative;
padding: 12px 27px 12px 27px;
background-color: #EEE;
}

.Nav > ul > li > ul li a:hover {
background-color:#BBDAFF;
}

@media screen and (max-width:950px) {

/* 2階層目の背景 */
.Nav > ul > li > ul li a {
border-bottom: solid 1px #dddddd;
background-color: #DBEBFF;
color: #000;
}
}

.Nav > ul > li > ul li a::before {
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 6px;
height: 6px;
margin: -6px 0 0 0;
border-top: solid 2px #00a0e9;
border-right: solid 2px #00a0e9;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.Nav > ul > li > ul li a:hover {
text-decoration: none;
}
 
@media screen and (max-width:950px) {
.Nav > ul > li > ul li a:hover {
background-color:#BBDAFF;
}
}
 
.Nav > ul > li > ul li ul li a {
padding-left: 42px;
}
.Nav > ul > li > ul li ul li a::before {
left: 20px;
}

/*___________ 950以下 _____________________ */
@media screen and (max-width:950px) {

.menuespace{
max-width:100%;
}

.Nav > ul {
display: none;
position: absolute;
top: 0;
left: 0;  /*_ ハンバーガmenuプルダウンの左からのアキ __ */
right: 0;
z-index: 2000;
background-color: #fff;
opacity:0.9;   /*_ プルダウン半透過 __ */
}

 /*_ ハンバーガmenuプルダウンの左右幅 __ */
.Nav > ul > .norms,
.Nav > ul > .parent{
float:none;
width:98%;
}
.Nav > ul > li a {
padding: 19px 15px;
margin:0px;
color: #fff;
border-top: solid 1px #778899;
background-color:#6699CC; /* ハンバーガーメニュ第一階層の背景色 */
text-align:left;
}

.Nav > ul > li > a:hover {
color: #000;
background: #BBDAFF;
}

/* 2階層 */
.infospaces .submenu a{
border-top: solid 1px #dddddd;
border-left:0px solid #000;
text-align:center;
}
.Nav > ul > li > ul li a::before {
display: none;
}
 

}

