.sub-menu {
    display: none;
}

header#masthead .main-navigation {
    display: block;
    clear:both;
    overflow:visible;
    position: absolute;
    z-index: 1000;
    font-size: 1rem;
    margin :0;
    padding: 0;
    width: 100%;
	font-family:"メイリオ";
}

header#masthead .main-navigation ul {
    list-style: none;
    margin: 0;
    padding: 80px 0 0 0;
    text-align:center;
    overflow:visible;
    z-index: 1;-webkit-transform: translate3d(0, 0, 1px); transform: translate3d(0, 0, 1px);/* z-indexのかわりにtransform: translate3dを設定 */
    /* ふんわりフェードイン */
    animation: fadeIn 0.25s ease 0s 0.5 normal;
    -webkit-animation: fadeIn 0.25s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

header#masthead .main-navigation li {
    position: relative;
    display: block;
    text-align:center;
}

header#masthead .main-navigation li a {
    display: block;
    overflow:hidden;
    text-decoration: none;
    padding: 0;
    margin: 0;

}

header#masthead .main-navigation ul li a {display:block; clear: both; margin: 0; text-align:left; height: auto; font-size: 1rem; /*font-family: "";*/ text-shadow: 0 0 0.1px rgba(0,0,0,0.2); width: 100%; padding: 1rem 1rem 1rem 2.5rem; border-bottom: dotted 1px #999; background-image: url(img/cursor_green.svg); background-position: top 1.25rem left 1rem; background-repeat: no-repeat;background-color:rgba(255,255,255,0.9); background-size: 16px; color: #666;transform: scale(1.0); line-height: 140%
}

header#masthead .main-navigation ul li a:hover {background-color:#F9F9A5;}

header#masthead .main-navigation ul li:hover > ul,
header#masthead .main-navigation ul li.focus > ul {
    left: auto;
}

header#masthead .main-navigation ul ul li:hover > ul,
header#masthead .main-navigation ul ul li.focus > ul {
    left: 100%;
}

.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {}


@media only screen and (min-width: 1281px) {
    header#masthead .main-navigation{
        position: absolute;
        top: 30px;
        left: 0;
        display: block;
        overflow: hidden;
        width: auto;
        height: 60px;
        text-align: right;
        font-size: 0;/* inline-blockの隙間消しハック */
    }
    
    header#masthead .main-navigation ul li {display:inline-block;}
    
    header#masthead .main-navigation ul li a {height: 60px;font-size: 0.88rem; padding: 0.3rem auto; border-top: none; background-position: bottom 1rem center; border-bottom: none; background-image: url(img/menu_off.svg); color: #2EA494; background-color: transparent;}
    header#masthead .main-navigation ul li a:hover {background-image: url(img/menu_active.svg); }

    
    header#masthead .main-navigation ul li a {padding: 1rem 1rem; width: auto; padding: 0.75rem 1rem;}
    
    
    /* 現在地によってメニューの背景を変える */
    body.home header#masthead .main-navigation ul li.home a {background-image: url(img/menu_active.svg);}
    body.archive header#masthead .main-navigation ul li.news a {background-image: url(img/menu_active.svg);}
    body.single header#masthead .main-navigation ul li.news a {background-image: url(img/menu_active.svg);}
    body.page-id-22 header#masthead .main-navigation ul li.about a {background-image: url(img/menu_active.svg);}
    body.page-id-8 header#masthead .main-navigation ul li.menu a {background-image: url(img/menu_active.svg);}
    body.page-id-16 header#masthead .main-navigation ul li.salon a {background-image: url(img/menu_active.svg);}
    body.page-id-18 header#masthead .main-navigation ul li.flow a {background-image: url(img/menu_active.svg);}
    body.page-id-20 header#masthead .main-navigation ul li.faq a {background-image: url(img/menu_active.svg);}
    body.page-id-3 header#masthead .main-navigation ul li.contact a {background-image: url(img/menu_active.svg);}
}


/* Small menu. */
.menu-toggle,
.main-navigation.toggled .nav-menu {
    display: block;
}
.menu-toggle
{width: 50px; height:50px; position: fixed; border: 2px solid #fff; border-radius: 10px; top: 16px; left:16px; display:block; padding: 0; background: #5abdbf;z-index: 1000; -webkit-transform: translate3d(0, 0, 10px); transform: translate3d(0, 0, 10px);/* z-indexのかわりにtransform: translate3dを設定 */}

.menu-toggle a:hover,
.menu-toggle a:focus,
.menu-toggle a:active {background: none;}

.main-navigation ul {
    display: none;
}
.main-navigation.toggled ul {
    height: 100%;
}

@media screen and (min-width: 1281px) {
    .menu-toggle {
        display: none;

    }
    .main-navigation ul {
        display: block;
    }
}

/* メニュートリガー */
.menu-trigger,
.menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
}
.menu-trigger {
    position: relative;
    width: 34px;
    height: 26px;
}
.menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #fff;
}

/* 何もしてないときは三本線 */
.main-navigation .menu-toggle .menu-trigger span:nth-of-type(1) {
    top: 0;
}
.main-navigation .menu-toggle .menu-trigger span:nth-of-type(2) {
    top: 12px;
}
.main-navigation .menu-toggle .menu-trigger span:nth-of-type(3) {
    bottom: 0;
}

/* .toggledで✕印 */
.main-navigation.toggled .menu-toggle .menu-trigger span:nth-of-type(1) {
    -webkit-transform: translateY(12px) rotate(-45deg);
    transform: translateY(12px) rotate(-45deg);
}
.main-navigation.toggled .menu-toggle .menu-trigger span:nth-of-type(2) {
    opacity: 0;
}
.main-navigation.toggled .menu-toggle .menu-trigger span:nth-of-type(3) {
    -webkit-transform: translateY(-12px) rotate(45deg);
    transform: translateY(-12px) rotate(45deg);
}


.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
    margin: 0 0 1.5em;
    overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
    float: left;
    width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
    float: right;
    text-align: right;
    width: 50%;
}


/* コンテンツ内メニュー */
#content-menu {margin: 0; padding:1rem;background: #a7ead2;}
/* リンクのホバー時背景色をいったん打ち消す */
#content-menu a:hover {background: none;}

#content-menu ul {
    list-style: none;
    margin: 0;
    padding: 10px 0 0 0;
    text-align:center;
    overflow:visible;
    /* ふんわりフェードイン */
    animation: fadeIn 0.1s ease 0s 0.25 normal;
    -webkit-animation: fadeIn 0.1s ease 0s 0.25 normal;}

#content-menu ul li {display: inline-block; line-height: 400%; }
#content-menu ul li a {padding: 0.75rem 1rem; margin: 0 0.1rem; color: #fff; background-color:#5abdbf; filter: drop-shadow(0px 2px 1px rgba(0,0,0,0.4));}

#content-menu ul li a:hover {background:#2c7599; color: #fff100;}

/* 背景色設定 */
#content-menu ul li.home a {background: #ff64a3; color: #fff;}
/*
#content-menu ul li.intro a {background:#E98FAC;}
#content-menu ul li.shop a {background:#F5C800;}
#content-menu ul li.search a {background:#ACC123;}
#content-menu ul li.faq a {background:#5CAECD;}
*/
#content-menu ul li.home a:hover {background:#d81a71; color: #fff100;}
/*
#content-menu ul li.intro a:hover {background:#e37095;}
#content-menu ul li.shop a:hover {background:#efa500;}
#content-menu ul li.search a:hover {background:#90a50a;}
#content-menu ul li.faq a:hover {background:#3895b9;}
*/