/* TOP専用。下層ページの既存メニューと共通CSSは変更しない。 */
body.home .menu-container .top-nav-link {
 display: block; position: relative; width: 100%; margin-top: -60px;
 color: var(--top-nav-color); isolation: isolate;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 4px 5px rgba(15,35,45,.10));
}
body.home .menu-container .top-nav-frame { display: block; width: 100%; height: auto; overflow: visible; }
body.home .menu-container .top-nav-label {
 position: absolute; top: 66%; left: 8%; right: 8%; display: block;
 margin: 0; font-family: var(--rishiri-jp); font-size: clamp(11px, 1vw, 14px);
 font-weight: 700; line-height: 1.45; letter-spacing: .01em;
 color: #243540; text-align: center; white-space: normal;
}
body.home .menu-container .top-nav-link:hover,
body.home .menu-container .top-nav-link:focus-visible {
 transform: translateY(-4px); filter: drop-shadow(0 8px 8px rgba(15,35,45,.18));
}
body.home .menu-container .top-nav-link:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; border-radius: 3px; }
@media (prefers-reduced-motion: reduce) { body.home .menu-container .top-nav-link { transition: none; } }

/* 端のサブメニューが画面外へ伸びて横スクロールを作らないようにする。 */
body.home .menu-container .menu-item:nth-child(-n+2) .submenu {
 left: 0; right: auto; transform: none;
}
body.home .menu-container .menu-item:nth-child(n+5) .submenu {
 left: auto; right: 0; transform: none;
}

body.home .menu-container > .menu-item:nth-child(1) { --top-submenu-bg: #d4e1e8; --top-submenu-border: #004e75; }

body.home .menu-container > .menu-item:nth-child(2) { --top-submenu-bg: #e0edf4; --top-submenu-border: #4a96be; }

body.home .menu-container > .menu-item:nth-child(3) { --top-submenu-bg: #e1eddf; --top-submenu-border: #4d9844; }

body.home .menu-container > .menu-item:nth-child(4) { --top-submenu-bg: #f1f3dc; --top-submenu-border: #afbb32; }

body.home .menu-container > .menu-item:nth-child(5) { --top-submenu-bg: #f9f3da; --top-submenu-border: #dcb624; }

body.home .menu-container > .menu-item:nth-child(6) { --top-submenu-bg: #f9eadb; --top-submenu-border: #da852d; }

body.home .menu-container > .menu-item:nth-child(7) { --top-submenu-bg: #f5dcdb; --top-submenu-border: #c4322b; }

/* TOPサブメニュー：アイコンと同じ淡色、短いフェードで表示。 */
body.home .menu-container .submenu {
 background-color: var(--top-submenu-bg);
 border-color: var(--top-submenu-border);
 border-radius: 8px;
 box-shadow: 0 12px 28px rgba(24, 44, 55, .16);
 opacity: 0; visibility: hidden; pointer-events: auto;
 translate: 0 10px;
 transition: opacity .45s ease .1s, translate .45s ease .1s, visibility 0s linear .55s;
}
body.home .menu-container .menu-item:hover .submenu,
body.home .menu-container .menu-item:focus-within .submenu {
 opacity: 1; visibility: visible; pointer-events: auto; translate: 0 0; transition-delay: 0s;
}
body.home .menu-container .submenu a {
 color: #243540; transition: background-color .18s ease;
}
body.home .menu-container .submenu a:hover,
body.home .menu-container .submenu a:focus-visible {
 background-color: rgba(255, 255, 255, .7); padding-left: 20px;
}
@media (prefers-reduced-motion: reduce) {
 body.home .menu-container .submenu { transition: none; translate: none; }
}

/* アイコンとの14pxの余白。透明な通路でマウス移動中の閉じを防ぐ。 */
body.home .menu-container .submenu {
 top: calc(100% + 14px); overflow: visible;
}
body.home .menu-container .submenu::before {
 content: ""; position: absolute; left: -3px; right: -3px;
 top: -18px; height: 18px; background: transparent;
}

/* TOP便利ナビ：カード全体を明るくし、操作範囲を伝える。 */
body.home ul.shadow_hover > li { transition: box-shadow .3s ease; }
body.home ul.shadow_hover > li > a { transition: background-color .3s ease; }
body.home ul.shadow_hover > li > a .icon { transition: filter .3s ease; }
@media (hover: hover) {
 body.home ul.shadow_hover > li:hover {
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.35), 0 5px 16px rgba(20,60,90,.22);
 }
 body.home ul.shadow_hover > li > a:hover { background-color: rgba(255,255,255,.13); }
 body.home ul.shadow_hover > li > a:hover .icon { filter: drop-shadow(0 0 5px rgba(255,255,255,.4)); }
}
body.home ul.shadow_hover > li:focus-within {
 box-shadow: inset 0 0 0 2px rgba(255,255,255,.35), 0 5px 16px rgba(20,60,90,.22);
}
body.home ul.shadow_hover > li > a:focus-visible,
body.home ul.shadow_hover > li > a:active { background-color: rgba(255,255,255,.13); }
body.home ul.shadow_hover > li > a:focus-visible .icon { filter: drop-shadow(0 0 5px rgba(255,255,255,.4)); }
@media (prefers-reduced-motion: reduce) {
 body.home ul.shadow_hover > li,
 body.home ul.shadow_hover > li > a,
 body.home ul.shadow_hover > li > a .icon { transition: none; }
}

/* 便利ナビを少し膨らませる。周囲のレイアウトは維持。 */
body.home ul.shadow_hover > li {
 position: relative; transform-origin: center;
 transition: transform .28s cubic-bezier(.2,.8,.3,1), box-shadow .3s ease;
}
@media (hover: hover) {
 body.home ul.shadow_hover > li:hover { transform: scale(1.025); z-index: 1; }
}
body.home ul.shadow_hover > li:focus-within { transform: scale(1.025); z-index: 1; }
@media (prefers-reduced-motion: reduce) {
 body.home ul.shadow_hover > li { transition: none; transform: none; }
 body.home ul.shadow_hover > li:hover,
 body.home ul.shadow_hover > li:focus-within { transform: none; }
}

/* スマホTOP：お知らせ、2列の便利ナビ、その後にバナー群。 */
@media (max-width: 763px) {
 body.home .entry-content.top-mobile-layout { padding-top: 141px; }
 body.home .top-mobile-layout > .container-top { padding-top: 0; }
 body.home .top-mobile-layout > .right-side { width: 100%; min-width: 0; }
 body.home .top-mobile-layout > .right-side .center-column { width: 100%; min-width: 0; padding: 0 16px; }
 body.home .top-mobile-layout > .right-side .oshirase { width: 100%; box-sizing: border-box; padding: 24px 16px; }
 body.home .top-mobile-quicknav { padding: 32px 16px; margin: 24px 0; background: var(--c-f0f8ff); text-align: center; }
 body.home .top-mobile-quicknav > h2 { margin: 0 0 2px; }
 body.home .top-mobile-quicknav > h4 { margin: 0 0 24px; }
 body.home .top-mobile-quicknav .navi-area-left,
 body.home .top-mobile-quicknav .navi-area-right { display: block; width: 100%; margin: 0; }
 body.home .top-mobile-quicknav .navi-area-right { margin-top: 12px; }
 body.home .top-mobile-quicknav ul.shadow_hover { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
 body.home .top-mobile-quicknav ul.shadow_hover > li { width: auto; min-width: 0; margin: 0; }
 body.home .top-mobile-quicknav ul.shadow_hover > li > a { min-height: 116px; padding: 16px 8px; }
 body.home .top-mobile-quicknav .navi-label { font-size: 14px; }
 body.home .top-mobile-layout > .container-top .left-side { width: 100%; }
}
@media (max-width: 480px) {
 body.home .entry-content.top-mobile-layout { padding-top: 101px; }
}