@charset "UTF-8";

/* wao menu PC
------------------------------------------------------------------------- */
#wao_menu {
    width: 100%;
    position: relative;
}

#wao_menu * {
    font-family: "GenJyuuGothic-Bold", sans-serif;
}

#wao_menu img {
    width: 100%;
    height: auto;
}

.bgScreen {
    background: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    z-index: 11;
}

.bgScreen.fixed {
    position: fixed;
}



#wao_menu #wao_menuBtn {
    width: 6vw;
    height: 6vw;
    max-width: 72px;
    max-height: 72px;
    position: absolute;
    top: 1vw;
    right: max(calc(50% - 860px), 2vw);
    z-index: 12;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
    background: url("/kodomo/open/tv/common/images/cmn_menu/wao_menu_open.png") no-repeat center 50% #5e8d43;
    background-size: contain;
}

#index #wao_menu #wao_menuBtn {
    width: 8vw;
    height: 8vw;
    max-width: 72px;
    max-height: 72px;
    position: absolute;
    top: 2vw;
    right: max(calc(50% - 860px), 2vw);
    z-index: 12;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
    background: url("/kodomo/open/tv/common/images/cmn_menu/wao_menu_open.png") no-repeat center 50% #5e8d43;
    background-size: contain;
}

#wao_menu #wao_menuBtn:hover {
    cursor: pointer;
}

#wao_menu #wao_menuBtn.open,
#index #wao_menu #wao_menuBtn.open {
    background: url("/kodomo/open/tv/common/images/cmn_menu/wao_menu_close.png") no-repeat center 50% #5e8d43;
    background-size: contain;
}

#index #wao_menu #wao_menuBtn.fixed,
#wao_menu #wao_menuBtn.fixed {
    position: fixed;
    top: 1vw;
}


#wao_menu #wao_menuWrap {
    width: 100%;
    padding: 2vw;
    background: rgba(255, 255, 255, 0.90);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
}

#wao_menuBox {
    width: 80vw;
    max-width: 1024px;
    display: flex;
    margin: auto auto auto 6%;
}

#wao_menuBox .wao_menu_logo {
    width: 28%;
    padding: 0 2%;
}

#wao_menuBox .wao_menu_main {
    width: 36%;
    padding: 0 1%;
}

#wao_menu #wao_menuBox .wao_menu_corner {
    width: 36%;
    padding: 0 1%;
}

#wao_menu #wao_menuBox .wao_menu_main li,
#wao_menu #wao_menuBox .wao_menu_corner li {
    background: url("/kodomo/open/tv/common/images/cmn_menu/wao_menu_line.png") no-repeat left bottom;
    background-size: 100%;
}

#wao_menu #wao_menuBox .wao_menu_main a,
#wao_menu #wao_menuBox .wao_menu_corner a {
    transition: 0.3s;
}
#wao_menu #wao_menuBox .wao_menu_main a:hover,
#wao_menu #wao_menuBox .wao_menu_corner a:hover {
    transform: translateX(5px)
}

#wao_menu #wao_menuBox .wao_menu_main .linktxt {
    font-size: 1.5vw;
    line-height: 1;
    color: #5E8D43;
    text-decoration: none;
    display: flex;
    align-items: center;
    min-height: 2em;
    padding: 0.25em 0.5em 0.25em 1.5em;
    background: url("/kodomo/open/tv/common/images/cmn_menu/btn_icon_green_R.png") no-repeat 1em 50%;
    background-size: 0.5em;
    transition: 0.3s;
}

#wao_menu #wao_menuBox .wao_menu_corner .linktxt {
    font-size: 1.5vw;
    line-height: 1;
    color: #5E8D43;
    text-decoration: none;
    display: block;
    padding: 1em 0.5em 1em 2em;
    background: url("/kodomo/open/tv/common/images/cmn_menu/btn_icon_green_R.png") no-repeat 1em 50%;
    background-size: 0.5em;
    transition: 0.3s;
}

#wao_menu #wao_menuBox .wao_menu_corner .linktxt.environment,
#wao_menu #wao_menuBox .wao_menu_corner .linktxt.diversity {
    /* color: #4EA7D6; */
    background: url("/kodomo/open/tv/common/images/cmn_menu/btn_icon_blue_R.png") no-repeat 1em 50%;
    background-size: 0.5em;
}

#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .linktxt::before {
    content: "";
    display: inline-block;
    width: 2em;
    height: 2em;
    vertical-align: middle;
    margin: 0 0.5em;
}

#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_home .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_home.png") no-repeat center 50%;
    background-size: 100%;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_program .linktxt {
    color: #5db3db;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_program .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_about.png") no-repeat center 50%;
    background-size: 100%;
    width: 3em;
    height: 3em;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_time .linktxt {
    color: #ee9c9f;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_time .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_time.png") no-repeat center 50%;
    background-size: 100%;
    width: 3em;
    height: 3em;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_friends .linktxt {
    color: #885e2f;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_friends .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_friends.png") no-repeat center 50%;
    background-size: 100%;
    width: 3em;
    height: 3em;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_minogashi .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_minogashi.png") no-repeat center 50%;
    background-size: 100%;
}
#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_next .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_next.png") no-repeat center 50%;
    background-size: 100%;
}


#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_sns .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_sns.png") no-repeat center 50%;
    background-size: 100%;
}

#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_goods .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_goods.png") no-repeat center 50%;
    background-size: 100%;
}

#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_contact .linktxt::before {
    background: url("/kodomo/open/tv/common/images/cmn_menu/menu_icon_contact.png") no-repeat center 50%;
    background-size: 100%;
}

#wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_btn {
    padding: 1em;
}

/* #wao_menu #wao_menuBox .wao_menu_main .wao_menu_mainList .wao_menu_sub_btn .linkbtn {
    display: block;
    width: 84%;
    max-width: 309px;
} */

@media (min-width:1024px) {
    #wao_menu #wao_menuBox .wao_menu_main .linktxt {
        font-size: 18px;
    }

    #wao_menu #wao_menuBox .wao_menu_corner .linktxt {
        font-size: 18px;
    }
}

/* wao menu PC
------------------------------------------------------------------------- */