/* Case study index and article layouts. */
.p-designed--case { background: #f8fbfe; }
.p-designed--case .l-container { width: calc(1200 * var(--pc-scale)); }
.p-designed--case .p-post-index { padding: 0 0 calc(40 * var(--pc-scale)); }
.p-post-index__filters { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding-block: calc(80 * var(--pc-scale)) calc(64 * var(--pc-scale)); }
.p-designed--case .p-post-index__filters .c-filter { display: flex; flex-wrap: wrap; gap: 1rem; margin: 0; }
.p-designed--case .c-filter > a { padding: 0.625rem 1.5rem; border: 1px solid #d6dfe7; border-radius: 0.25rem; background: white; color: #00083d; font-size: 0.875rem; line-height: 1.5; }
.p-designed--case .c-filter > a[aria-current="page"] { border: 2px solid #d70a30; padding: calc(0.625rem - 1px) calc(1.5rem - 1px); color: #d70a30; font-weight: 700; }
.p-designed--case .p-post-index__count { margin: 0; color: #00083d; font-size: 0.9375rem; }
.p-designed--case .p-post-index__count strong { font: 700 0.875rem/2 var(--font-latin); }
.p-designed--case .p-post-index .c-case-list { gap: calc(80 * var(--pc-scale)) calc(24 * var(--pc-scale)); }
.p-designed--case .c-case-card--grid { height: 100%; border-radius: 0.5rem; box-shadow: 0 0 0.9375rem rgb(0 8 61 / 15%); }
.p-designed--case .c-case-card--grid > a { padding: 1rem; gap: 1rem; }
.p-designed--case .c-case-card--grid .c-case-card__image { aspect-ratio: 2048 / 1367; }
.p-designed--case .c-case-card--grid .c-case-card__body { flex: 1; display: flex; flex-direction: column; padding-inline: 0.5rem; }
.p-designed--case .c-case-card--grid .c-tag { align-self: start; padding: 0.125rem 0.5rem; margin-bottom: 1rem; line-height: 1.5; }
.p-designed--case .c-case-card--grid :is(h2, h3) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 1rem; font-weight: 700; line-height: 1.7; }
.p-designed--case .c-case-card--grid .c-case-card__excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin-block: 0.5rem 1rem; font-size: 0.8125rem; line-height: 1.5; }
.p-designed--case .c-case-card__meta { margin-top: auto; padding-top: 1rem; border-color: #e5e7eb; }
.p-designed--case .c-pagination { margin: 0; padding-block: calc(64 * var(--pc-scale)); }
.p-designed--case .c-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; padding: 0; border: 0; background: none; color: #9ca3af; font: 700 1rem/1.5 var(--font-latin); }
.p-designed--case .c-pagination .current { color: #d70a30; }
.p-designed--case .c-pagination :is(.next, .prev) { font-size: 0; background: url('../images/pages/voice-nav-next.svg') center / 2.5rem no-repeat; }
.p-designed--case .c-pagination .prev { background-image: url('../images/pages/voice-nav-prev.svg'); }
.p-designed--case .p-home-services--related { padding-block: calc(64 * var(--pc-scale)) calc(80 * var(--pc-scale)); border-top: 1px solid #ccd8e5; background: white; }
.p-home-services--related h2, .p-designed--case .p-related-posts h2 { text-align: center; font-size: 2rem; font-weight: 500; line-height: 1.6; }
.p-home-services--related h2::after, .p-designed--case .p-related-posts > .l-container > h2::after { content: ''; display: block; width: 4.0625rem; height: 3px; margin: 1rem auto 0; background: #d70a30; }
.p-home-services--related .p-home-services__list { gap: 1.5rem; margin-top: 2rem; }
.p-home-services--related .p-home-services__list > li { width: calc((100% - 3rem) / 3); }
.c-related-service { display: flex; flex-direction: column; height: 100%; overflow: hidden; border-radius: 0.5rem; background: white; box-shadow: 0 0 0.9375rem rgb(10 10 10 / 10%); }
.c-related-service__image { width: 100%; height: auto; aspect-ratio: 383.67 / 130; border: 0.344625rem solid white; border-radius: 0.5rem; object-fit: cover; }
.c-related-service__body { display: flex; flex: 1; flex-direction: column; padding: 1rem; }
.c-related-service h3 { border-left: 3px solid #d70a30; padding-left: 0.5rem; margin-bottom: 0.5rem; font-size: 1.125rem; font-weight: 700; line-height: 1.5; }
.c-related-service h3 small { font-size: 0.9375rem; }
.p-home-services__list > li:first-child .c-related-service h3 { font-size: 1.25rem; }
.c-related-service p { color: #4c4c4c; font-size: 0.875rem; line-height: 1.5; margin-bottom: 1rem; }
.c-related-service__link { display: flex; align-items: center; gap: 0.5rem; margin-top: auto; font-size: 1rem; line-height: 2; }
.c-related-service__link > span { width: 2rem; height: 2rem; border-radius: 50%; background: #d70a30 url('../images/pages/voice-service-arrow.svg') center / 1.5rem no-repeat; }
.p-designed--case .p-cms-article { padding-block: 0; }
.p-designed--case .p-cms-article > .l-container { width: calc(996 * var(--pc-scale)); }
.p-case-article__header { display: flex; flex-direction: column; gap: 1.5rem; padding-block: calc(80 * var(--pc-scale)) calc(40 * var(--pc-scale)); }
.p-designed--case .p-cms-article__breadcrumb { margin: 0; color: #848484; font-size: 0.875rem; line-height: 1.5; }
.p-case-article__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.p-designed--case .p-cms-article__tags { margin: 0; gap: 0.5rem; }
.p-designed--case .p-cms-article__tags a { display: block; padding: 0.125rem 0.5rem; background: white; border: 1px solid #d70a30; border-radius: 0.25rem; line-height: 1.5; }
.p-designed--case .p-cms-article time { color: #848484; font-size: 0.9375rem; line-height: 1.7; }
.p-designed--case .p-cms-article h1 { font-size: 2rem; font-weight: 500; line-height: 1.6; margin: 0; }
.p-designed--case .c-article-share { margin: 0; padding-block: 0.5rem; }
.p-designed--case .p-cms-article__image { width: auto; max-width: 100%; height: auto; margin: 0 auto; }
.p-designed--case .p-cms-article__body { margin: 0; padding-top: 3rem; color: #00083d; line-height: 2; }
.p-designed--case .p-cms-article__body img { display: block; width: auto; max-width: 100%; height: auto; margin-inline: auto; }
.p-designed--case .p-cms-article__body > p { margin: 0; }
.p-case-article__interview { padding-block: 2.5rem; }
.p-designed--case .p-cms-article__body .p-case-article__section-heading { padding: 0.25rem 1rem 0.25rem 1.5rem; margin: 0 0 2.5rem; border-left: 4px solid #d70a30; color: #00083d; font-size: 1.5rem; line-height: 1.6; }
.p-designed--case .p-cms-article__body .p-case-article__section-heading strong { font-weight: 700; }
.p-designed--case .p-case-article__interview > h3, .p-designed--case .p-cms-article__body .p-case-article__question { margin-block: 2rem 1rem; padding: 1.25rem; border: 0; border-radius: 0.25rem; background: #f1f4f6; color: #00083d; font-size: 1.125rem; font-weight: 700; line-height: 1.7; }
.p-case-article__interview dl { margin-block: 1rem 2rem; }
.p-case-article__interview dt { display: inline; font-weight: 700; }
.p-case-article__interview dt::after { content: '：'; }
.p-case-article__interview dd { display: inline; margin: 0; }
.p-case-article__interview dd p { margin: 0; }
.p-case-article__interview dd p:first-child { display: inline; }
.p-case-article__interview dd::after { content: ''; display: block; }
.p-case-article__interview img { margin-block: 1.5rem 0.5rem; }
.p-designed--case .p-cms-article__body .p-case-article__caption { display: block; padding-inline: 1em; font-size: 0.75rem; color: #848484; line-height: 1.5; text-align: center; }
.p-designed--case .p-case-article__caption img { display: inline-block; width: auto; max-width: calc(100% + 2em); margin-inline: -1em; }
.p-case-article__profile, .p-case-article__toc, .p-case-article__company { margin-block: 2.5rem; padding: 1.5rem 2rem 2rem; background: white; border-radius: 0.5rem; box-shadow: 0 0 1.1875rem rgb(198 200 205 / 30%); }
.p-designed--case .p-cms-article__body :is(.p-case-article__profile, .p-case-article__toc, .p-case-article__company) > h2 { margin: 0 0 1.5rem; padding: 0; border: 0; color: #00083d; font-size: 1rem; font-weight: 700; line-height: 2; }
.p-designed--case .p-cms-article__body :is(.p-case-article__profile, .p-case-article__toc, .p-case-article__company) > h2::before { content: ''; display: inline-block; width: 0.75rem; height: 0.75rem; margin-right: 0.75rem; background: #d70a30; }
.p-designed--case .p-cms-article__body .p-case-article__profile > h2 { margin-bottom: 1rem; }
.p-case-article__participants { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.p-case-article__participants > div { position: relative; border-left: 2px solid #ccd8e5; padding: 0.25rem 1rem; color: #4c4c4c; font-size: 0.875rem; line-height: 1.5; }
.p-designed--case .p-case-article__participants h3 { margin: 0 0 0.75rem; padding: 0; border: 0; background: none; font-size: 0.875rem; line-height: 1.0625rem; }
.p-designed--case .p-case-article__participants h3::before { content: ''; position: absolute; top: 0; left: -2px; width: 2px; height: 1.6875rem; background: #d70a30; }
.p-designed--case .p-case-article__participants p { margin: 0; font-size: 0.875rem; line-height: 1.5; }
.p-designed--case .p-case-article__participants p + p { margin-top: 1rem; }
.p-case-article__profile-break { display: block; height: 0.25rem; }
.p-case-article__participants p strong { font-weight: 400; }
.p-case-article__toc { counter-reset: case-section; }
.p-designed--case .p-case-article__toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; }
.p-case-article__toc li { display: flex; gap: 0.75rem; color: #4c4c4c; font-size: 0.875rem; line-height: 1.5; }
.p-case-article__toc li::before { counter-increment: case-section; content: counter(case-section, decimal-leading-zero); flex: 0 0 1.5rem; white-space: nowrap; color: #d70a30; font-family: var(--font-latin); font-weight: 700; }
.p-case-article__toc a { flex: 1; width: 0; text-decoration: underline; text-underline-offset: 0.25rem; }
.p-case-article__company dl { display: grid; grid-auto-flow: column; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(var(--company-rows, 3), auto); gap: 0 2.5rem; margin: 0; }
.p-case-article__company dl > div { display: grid; grid-template-columns: 28% 72%; padding-block: 1rem; border-bottom: 1px solid #ccd8e5; font-size: 0.875rem; line-height: 1.5; }
.p-case-article__company :is(dt, dd) { margin: 0; }
.p-case-article__company dt { font-weight: 700; }
.p-case-article__company a { color: #d70a30; text-decoration: underline; overflow-wrap: anywhere; }
.p-designed--case .p-cms-article__navigation { margin: 0; padding-block: 2.5rem 4rem; border-bottom: 0; font-size: 0.875rem; }
.p-designed--case .p-cms-article__navigation div > a { display: inline-flex; align-items: center; gap: 0.5rem; }
.p-designed--case .p-cms-article__navigation div > a::before { content: ''; display: block; width: 2.5rem; height: 2.5rem; background: url('../images/pages/voice-nav-prev.svg') center / contain no-repeat; }
.p-designed--case .p-cms-article__navigation div:last-child > a { flex-direction: row-reverse; }
.p-designed--case .p-cms-article__navigation div:last-child > a::before { background-image: url('../images/pages/voice-nav-next.svg'); }
.p-designed--case .p-related-posts { padding-block: calc(64 * var(--pc-scale)); border: 0; background: white; }
.p-designed--case .p-related-posts > .l-container > h2 { margin-bottom: 2rem; }
@media (width < 48em) {
    .p-designed--case .l-container, .p-designed--case .p-cms-article > .l-container { width: calc(100% - 40 * var(--sp-scale)); }
    .p-post-index__filters { gap: 1.5rem; padding-block: 2.5rem 2rem; }
    .p-designed--case .p-post-index__filters .c-filter { gap: 0.5rem; }
    .p-designed--case .c-filter > a { padding: 0.625rem 0.75rem; font-size: 0.8125rem; }
    .p-designed--case .c-filter > a[aria-current="page"] { padding: calc(0.625rem - 1px) calc(0.75rem - 1px); }
    .p-designed--case .p-post-index__count { width: 100%; }
    .p-designed--case .p-post-index .c-case-list { grid-template-columns: 100%; gap: 2rem; }
    .p-designed--case .c-pagination { flex-wrap: wrap; gap: 0.5rem; padding-block: 2.5rem; }
    .p-designed--case .p-home-services--related { padding-block: 3rem; }
    .p-home-services--related h2, .p-designed--case .p-related-posts h2 { font-size: 1.5rem; }
    .p-home-services--related .p-home-services__list { flex-direction: column; gap: 1.5rem; }
    .p-home-services--related .p-home-services__list > li { width: 100%; }
    .p-case-article__header { padding-block: 2.5rem 2rem; gap: 1.5rem; }
    .p-designed--case .p-cms-article h1 { font-size: 1.5rem; }
    .p-designed--case .p-cms-article__body { padding-top: 2rem; font-size: 0.9375rem; }
    .p-designed--case .p-cms-article__body .p-case-article__section-heading { padding-left: 1rem; font-size: 1.25rem; }
    .p-designed--case .p-case-article__interview > h3 { padding: 1rem; font-size: 1rem; }
    .p-case-article__profile, .p-case-article__toc, .p-case-article__company { padding: 1.5rem; }
    .p-case-article__participants { grid-template-columns: 100%; gap: 1.5rem; }
    .p-case-article__company dl { grid-template-columns: 100%; grid-template-rows: none; grid-auto-flow: row; }
    .p-case-article__company dl > div { grid-template-columns: 100%; gap: 0.5rem; }
    .p-designed--case .p-cms-article__navigation { gap: 0.5rem; font-size: 0.75rem; }
    .p-designed--case .p-cms-article__navigation div > a { gap: 0; }
    .p-designed--case .p-cms-article__navigation div > a::before { width: 1.25rem; height: 1.25rem; }
    .p-designed--case .p-related-posts ul { grid-template-columns: 100%; gap: 2rem; }
}