@charset "UTF-8";

/* Shared enhancements for the three district route-list pages. */
body[data-bus-area] {
    --localbus-header-offset: 220px;
}

.css_btn01 {
    width: 100%;
}

.page_links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 30px;
    padding: 0;
    list-style: none;
}

.page_links a {
    display: block;
    position: relative;
    padding: 12px 2.4em 12px 10px;
    text-align: center;
}

.page_links a:after {
    position: absolute;
    top: calc(50% + 3px);
    right: 10px;
    float: none;
    margin: 0;
    transform: translateY(-50%);
}

.route-search {
    margin: 0 0 20px;
}

.route-search label {
    display: block;
    margin-bottom: 6px;
    font-weight: bold;
}

.route-search input {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    border: 1px solid #999;
    border-radius: 4px;
    padding: 8px 12px;
    font: inherit;
}

.route-search input:focus {
    outline: 3px solid #f5b5aa;
    outline-offset: 1px;
}

.route-search-result {
    min-height: 1.5em;
    margin: 6px 0 0;
    color: #555;
}

body[data-bus-area] :is(#rosenzu, #jikoku, #buslocation, #teikiken, #hanbai, #contact) {
    scroll-margin-top: var(--localbus-header-offset);
}

@media screen and (min-width: 781px) {
    body[data-bus-area] .sidemenu {
        position: sticky;
        top: var(--localbus-header-offset);
        max-height: calc(100vh - var(--localbus-header-offset));
        overflow-y: auto;
    }
}

@media screen and (max-width: 780px) {
    .deferred-section {
        content-visibility: auto;
        contain-intrinsic-size: auto 900px;
    }
}

@media screen and (max-width: 600px) {
    .page_links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .page_links a {
        min-height: 48px;
        padding: 13px 2.2em 13px 8px;
        box-sizing: border-box;
    }
}