/* **************************************************

  		　　　　　　変数設定

************************************************** */
:root {
	--header-height:6rem;
}

/* **************************************************

  		　        　メニュー

************************************************** */
#menu {
    display:none;
}
.menulist {
    width:auto;
    height:var(--header-height);
    position:absolute;
    top:0;
    right:0;
    background:none;
    overflow: visible;
    padding-top:0;
    display:flex;
}
.menulist_inner {
    width:100%;
    height:auto;
    display:block;
    margin:2rem 3rem 0 0;
}
.menulist_inner ul {
    flex-flow:row;
    justify-content:end;
    height:auto;
    margin:0;
}
.menulist_inner ul li {
    margin-left:2rem;
    text-align:center;
}
.menulist_inner ul li a span.menu_en {
    font-size:1rem;
    line-height:1em;
    font-weight:normal;
}

.menulist_inner ul li a {
    position:relative;
    display: inline-block;
    text-align:center;
    margin:0 auto;
    text-decoration:none;
}
.menulist_inner ul li a span.menu_en {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    line-height:1rem;
}
.menulist_inner ul li a span.menu_ja {
    margin-top:0;
    line-height:1rem;
}

/* 共通スタイル */
.menulist_inner ul li a span {
    transition: opacity 0.2s ease; /* 切り替え時のアニメーション */
    opacity: 1; /* 初期状態で表示 */
}

/* 日本語は初期状態で非表示 */
.menulist_inner ul li a span.menu_ja {
    opacity: 0;
}

/* マウスオーバー時 */
.menulist_inner ul li a:hover span.menu_en {
    opacity: 0; /* 英語をフェードアウト */
}

.menulist_inner ul li a:hover span.menu_ja {
    opacity: 1; /* 日本語をフェードイン */
}