/* activity/index.html のページ内メニューとスマートフォン表示 */
/* TOPページ内メニュー：PC側は現在の間隔を維持 */
#headmenu {
    margin: 1rem 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
#headmenu ul {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0.3rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: 0 !important;
    background: transparent !important;
}
#headmenu li {
    float: none !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}
#headmenu li a {
    display: block !important;
    padding: 0.38rem 0.62rem !important;
    color: #344354 !important;
    background: #fff !important;
    border: 1px solid #d8dee5 !important;
    border-radius: 7px !important;
    box-shadow: none !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    transition: color 0.18s ease, background-color 0.18s ease,
                border-color 0.18s ease !important;
}
#headmenu li a:hover,
#headmenu li a:focus-visible {
    color: #fff !important;
    background: #40566d !important;
    border-color: #40566d !important;
    text-decoration: none !important;
}

/* PC：ジャンプボタンとの関係を考慮して現在の余白を維持 */
@media (min-width: 768px) {
    #headmenu {
        margin-bottom: -2.5rem !important;
    }
}

/* 携帯：ページ内メニューは非表示。歓迎見出し前の余白をさらに縮める */
@media (max-width: 767px) {
    #headmenu {
        display: block  !important;
    }
    #slender {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    #slender > img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 0 0 0.9rem !important;
    }
    #slender > h1 {
        margin-top: 0.2rem !important;
        margin-bottom: 0.2rem !important;
    }
    #slender > span {
        display: block !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-top: 0 !important;
        margin-bottom: 0.2rem !important;
        overflow-wrap: anywhere;
    }
    #contents > h2#welcome {
        margin-top: 0.1rem !important;
        padding-top: 0 !important;
    }
}
