/* ----------------------------------------------------
Screen style's
---------------------------------------------------- */
.menu-container {
position:absolute;
font-family: "M PLUS Rounded 1c", "メイリオ", sans-serif;
width: 100%;
top:0;
right:0;
margin: 0;
text-align: right;
z-index: 100;
}

.menu-mobile {display: none;}

.menu-mobile:after {
content: "\f394";
font-family: "Ionicons";
font-size: 2.5rem;
padding: 0px 7px;
float: right;
position: relative;
border:2px solid #0a4387;
color: #0a4387;
right:5px;
top: 50%;
 -webkit-transform: translateY(-25%);
 -ms-transform: translateY(-25%);
 transform: translateY(-25%);
background: rgba(255,255,255,1);
z-index: 1000;
}

.menu-dropdown-icon:before {
content: "\f489";
font-family: "Ionicons";
display: none;
font-weight: bold;
cursor: pointer;
float: right;
padding: 1em 1.5em;
background: rgba(255,255,255,0.7);
color: #0a4387;
margin: 0;
}

.menu > ul {
margin: 0;
list-style: none;
padding: 0;
position: relative;
top:10px;
right:0;
    /* IF .menu position=relative -> ul = container width, ELSE ul = 100% width */
box-sizing: border-box;
}

.menu > ul:before,
.menu > ul:after {
content: "";
display: table;
}

.menu > ul:after {clear: both;}

.menu > ul > li {
padding: 0;
margin: 0;
display: inline-block;
}
.m-blue{color: #1ba1e6 !important;margin-left: 5px;}

.menu > ul > li a {
text-decoration: none;
padding:1.5em 2em;
display: block;
}
 @media only screen and (max-width: 1250px) {
  .menu > ul > li a {padding: 1.5em 1em;}
 }
.menu > ul > li a {color: #232323;font-weight: bold;}
.menu > ul > li a:hover {color: #1ba1e6;transition-duration: 0.3s;}

.menu > ul > li.ya:hover {
background-image: url(../all/m-ya.png);
background-repeat: no-repeat;
background-position:bottom center;
}


.menu > ul > li > ul {
    display: none;
    width: 100%;
    background: #1ba1e6;
    padding: 0;
    position: absolute;
    z-index: 99;
    right: 0;
    margin: 0;
    list-style: none;
    box-sizing: border-box;
text-align: center;
}

.menu > ul > li > ul:before,
.menu > ul > li > ul:after {
    content: "";
    display: table;
transition-duration: 0.3s;
}



.menu > ul > li > ul:after {
    clear: both;
}

.menu > ul > li > ul > li {
    margin: 0;
    padding:  0;
    list-style: none;
    display: inline-block;
}


.menu > ul > li > ul > li a {
    color: #ffffff;
    padding:  0 40px;
height: 73px;
line-height:73px;
display: block;
}
.menu > ul > li > ul > li a:hover {color: #232323;background-color: rgba(255,255,255,0.5);}

/* -----------------------------------------------
Mobile style's
------------------------------------------------- */

@media only screen and (max-width: 1000px) {
/* 通常メニュー */
   .menu-container {
        display: block;
        right:0;
        top:20px;
        
    }
    .menu-mobile {
        display: block;
    }
    .menu-dropdown-icon:before {
        display: block;
    }
    .menu > ul {
        display: none;top:0px;
    }
    .menu > ul > li {
        width: 100%;
        float: none;
        display: block;
text-align: left;
line-height:1em;
background: rgba(27,161,230,0.95);
border-bottom:1px solid #dcdcdc;
padding: 0;
margin: 0;
    }
.m-blue {display: none;}
    .menu > ul > li a {
        padding:1em 1.5em;
        width: 100%;
        display: block;
    }

    .menu > ul > li a:hover {background-color:#f5f5f5 !important;}
    .menu > ul > li a:active {background-color:#f5f5f5 !important;}

    .menu > ul > li:first-child {
        margin-top: 45px;
    }

    .menu > ul > li > ul {
        position: relative;
transition-duration: 0.5s;
    }
    .menu > ul > li > ul.normal-sub {
        width: 100%;
    }
    .menu > ul > li > ul > li {
        float: none;
        width: 100%;
        padding: 0;
        margin: 0;
        text-align: left;
    }

.menu > ul > li > ul > li a {
    color: #ffffff;
    padding:  1em 2.5em;
height: auto;
line-height:1em;
display: block;
border-bottom:1px solid rgba(255,255,255,0.5);
background-color:rgba(255,255,255,0.2) !important;
}


.menu > ul > li > ul > li a:hover {background-color:rgba(255,255,255,0.5) !important;}

    .menu > ul > li > ul > li > ul {
        position: relative;
    }
    .menu > ul > li > ul > li > ul > li {
        float: none;
    }
    .menu .show-on-mobile {
        display: block;
    }

    .ya:hover {background-image:none !important;}


}