/* ==========================================================
   BREADCRUMB / PAGE HEADING
========================================================== */
.m-breadcrumb { max-width:1200px; margin:22px auto 0; font-size:12px; }
.m-breadcrumb ol { display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; margin:0; }
.m-breadcrumb li+li::before { content:"/"; margin-right:10px; color:#777; }
.m-page-heading { text-align:center; margin:20px -24px 0; padding:40px 24px; color:#000; background:linear-gradient(105deg,#F0F5E7 0%,#FBEAF1 33%,#F4F1EF 65%,#E9F7FC 100%); }
.m-page-heading h1 { display:inline-block; margin:0; padding:16px 30px 20px; border-block:1px solid; font:600 26px/1 var(--font-heading); }
@media (max-width:768px) { .m-breadcrumb { font-size:11px; margin-top:16px; } .m-page-heading { margin-top:12px; } .m-page-heading h1 { font-size:14px; padding:12px 20px 16px; } }
/* ==========================================================
   BACK TO TOP
========================================================== */
/* The hit area is 44px; its SP black face is 40px with a 60px bottom gap. */
.m-page-top { position:fixed; right:0; bottom:0; width:80px; height:80px; z-index:40; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .3s,visibility 0s linear .3s; }
.m-page-top.is-visible { opacity:1; visibility:visible; pointer-events:auto; transition-delay:0s; }
.m-page-top::before { position:absolute; inset:0; background:#000; content:""; }
.m-page-top::after { position:absolute; top:40px; left:calc(50% - 5px); width:10px; height:10px; border-top:1px solid #fff; border-left:1px solid #fff; transform:rotate(45deg); content:""; transition:transform .3s; }
@media (hover:hover) { .m-page-top:hover::after { transform:translateY(-10px) rotate(45deg); } }
.m-page-top:focus-visible { outline:2px solid #000; outline-offset:2px; }
@media (max-width:768px) {
 .m-page-top { width:44px; height:44px; bottom:58px; }
 .m-page-top::before { inset:2px 0 2px 4px; }
 .m-page-top::after { width:5px; height:5px; top:22px; left:calc(4px + 20px - 2.5px); }
}
@media (max-width:768px) and (hover:hover) { .m-page-top:hover::after { transform:translateY(-4px) rotate(45deg); } }
@media (prefers-reduced-motion:reduce) { .m-page-top,.m-page-top::after { transition:none; } .m-page-top:hover::after { transform:rotate(45deg); } }
