/* Shared subpage heading; the outer theme already offsets the fixed header. */
.agency-sub-visual,
.agency-sub-visual * { box-sizing: border-box; }

.agency-sub-visual {
    width: 100%;
    min-width: 0;
    padding: 70px 24px 64px;
    background: #fff;
    color: #191f28;
    text-align: center;
    word-break: keep-all;
}

.agency-sub-visual--mobile { display: none; }
.agency-sub-visual__inner { width: 100%; max-width: 1200px; margin: 0 auto; }
.agency-sub-visual ol,
.agency-sub-visual ul { list-style: none; margin: 0; padding: 0; }
.agency-sub-visual a { color: inherit; text-decoration: none; }
.agency-sub-visual a:focus-visible { outline: 3px solid var(--rb-main-color, #2167ff); outline-offset: 4px; border-radius: 5px; }
.agency-sub-visual .ti { flex-shrink: 0; font-size: 18px; line-height: 1; }

.agency-sub-visual__breadcrumb ol { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 8px; }
.agency-sub-visual__breadcrumb li { display: inline-flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; color: #737981; font-size: 15px; line-height: 1.6; }
.agency-sub-visual__breadcrumb a { display: inline-flex; align-items: center; gap: 7px; min-width: 0; max-width: 100%; min-height: 32px; overflow-wrap: anywhere; }
.agency-sub-visual__breadcrumb span { overflow-wrap: anywhere; }
.agency-sub-visual__breadcrumb li > .ti { color: #a4a8af; font-size: 14px; }
.agency-sub-visual__breadcrumb a:hover { color: var(--rb-main-color, #2167ff); }
.agency-sub-visual__breadcrumb [aria-current="page"] { color: #555d68; }

.agency-sub-visual .agency-sub-visual__title {
    margin: 45px 0 0;
    padding: 0;
    border: 0;
    color: #171820;
    font-family: 'font-B', sans-serif;
    font-size: clamp(48px, 6vw, 96px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.045em;
    overflow-wrap: anywhere;
    text-wrap: balance;
}

.agency-sub-visual__tabs { margin-top: 48px; }
.agency-sub-visual__tabs ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.agency-sub-visual__tabs li { min-width: 0; max-width: 100%; }
.agency-sub-visual__tabs a { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; max-width: 100%; padding: 11px 23px; border-radius: 999px; background: #f6f7f8; color: #6b7280; font-size: 15px; font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; transition: color .18s ease, background .18s ease; }
.agency-sub-visual__tabs a:hover,
.agency-sub-visual__tabs a.is-current { background: #edf3ff; color: var(--rb-main-color, #2167ff); }
.agency-sub-visual__tabs a:focus-visible { border-radius: 999px; }
.agency-sub-visual__tabs .ti { font-size: 16px; }

@media (max-width: 1100px) {
    .agency-sub-visual--desktop { display: none; }
    .agency-sub-visual--mobile { display: block; }
    .agency-sub-visual { padding-top: 55px; padding-bottom: 48px; }
    .agency-sub-visual .agency-sub-visual__title { margin-top: 34px; font-size: clamp(42px, 7vw, 72px); }
    .agency-sub-visual__tabs { margin-top: 36px; }
}

@media (max-width: 640px) {
    .agency-sub-visual { padding: 36px 20px 36px; }
    .agency-sub-visual__breadcrumb ol { gap: 2px 6px; }
    .agency-sub-visual__breadcrumb li { gap: 6px; font-size: 12px; }
    .agency-sub-visual__breadcrumb .ti { font-size: 15px; }
    .agency-sub-visual__breadcrumb li > .ti { font-size: 12px; }
    .agency-sub-visual .agency-sub-visual__title { margin-top: 27px; font-size: clamp(34px, 9vw, 48px); line-height: 1.22; }
    .agency-sub-visual__tabs { margin-top: 28px; }
    .agency-sub-visual__tabs ul { gap: 7px; }
    .agency-sub-visual__tabs a { padding: 10px 17px; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
    .agency-sub-visual__tabs a { transition: none; }
}
