@charset "UTF-8"; 
 
/* ========================================================================== 
 Interview Detail Page - interview.css 
 ========================================================================== */ 
 
/* ---- Hero ---- */ 
 
.p-interview__hero { 
 background-color: #363935; 
 position: relative; 
overflow: hidden; 
} 
 
.p-interview__hero-inner { 
 position: relative; 
 max-width: 1440px; 
 margin: 0 auto; 
 display: grid; 
 grid-template-columns: minmax(220px, 1fr) clamp(360px, 43vw, 620px) minmax(220px, 1fr); 
 min-height: 820px; 
} 
 
/* ---- 左列 ---- */ 
.p-interview__hero-left { 
 display: flex; 
 flex-direction: column; 
 justify-content: flex-end; 
 padding: 60px 30px 100px 80px; 
} 
 
.p-interview__member-num { 
 position: absolute; 
 left: 80px; 
 top: 97px; 
 writing-mode: vertical-lr; 
 text-orientation: mixed; 
 font-family: var(--font3); 
 font-size: 3.6rem; 
 font-weight: 300; 
 letter-spacing: 0.05em; 
 line-height: 1.2; 
 color: #afff27; 
} 
 
.p-interview__hero-profile { 
 display: flex; 
 flex-direction: column; 
 gap: 40px; 
} 
 
.p-interview__hero-profile-top { 
 display: flex; 
 flex-direction: column; 
 gap: 30px; 
} 
 
.p-interview__hero-role { 
 font-family: var(--font3); 
 font-size: 1.4rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 1.6; 
 color: #afff27; 
} 
 
.p-interview__hero-name { 
 display: flex; 
 align-items: flex-end; 
 gap: 10px; 
} 
 
.p-interview__hero-name-ja { 
 font-family: var(--font2); 
 font-size: 3rem; 
 font-weight: 400; 
 line-height: 1.448; 
 color: #afff27; 
} 
 
.p-interview__hero-name-en { 
 font-family: var(--font3); 
 font-size: 1.6rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 1.2; 
 color: #afff27; 
} 
 
.p-interview__hero-divider { 
 border: none; 
 border-top: 1px solid #888888; 
 margin: 0; 
} 
 
.p-interview__hero-meta { 
 display: flex; 
 flex-direction: column; 
 gap: 20px; 
} 
 
.p-interview__hero-meta-dept { 
 font-family: var(--font3); 
 font-size: 1.6rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 color: #fff; 
} 
 
.p-interview__hero-meta-join { 
 font-family: var(--font3); 
 font-size: 1.6rem; 
 font-weight: 400; 
 letter-spacing: 0.05em; 
 line-height: 1.2; 
 color: #fff; 
} 
 
/* ---- 中央列: 写真エリア ---- */ 
.p-interview__hero-photo { 
 position: relative; 
 overflow: hidden; 
} 
 
.p-interview__hero-bg-img { 
 position: absolute; 
 top: 100px; 
 left: 0; 
 width: 100%; 
 height: 620px; 
 overflow: hidden; 
 background: 
 radial-gradient(circle 440px at 7% 8%, rgba(255, 251, 65, 0.8) 0%, rgba(255, 252, 65, 0) 100%), 
 radial-gradient(circle 380px at 75% 84%, rgba(31, 215, 212, 0.8) 0%, rgba(31, 215, 212, 0) 100%), 
 #afff27; 
} 
 
.p-interview__hero-ph-img { 
 position: absolute; 
 top: 31px; 
 left: 50%; 
 transform: translateX(-50%); 
 width: 100%; 
 height: auto; 
 display: block; 
} 
 
/* ---- 右列: キャッチコピー ---- */ 
.p-interview__hero-catch { 
 display: flex; 
 flex-direction: row-reverse; 
 gap: 16px; 
 padding: 100px 80px 80px 30px; 
 align-items: flex-start; 
} 
 
.p-interview__hero-catch span { 
 writing-mode: vertical-rl; 
 text-orientation: mixed; 
 font-family: var(--font2); 
 font-size: clamp(2.2rem, 3.1vw, 4.5rem); 
 font-weight: 400; 
 letter-spacing: 0.1em; 
 line-height: 1.3; 
 color: #afff27; 
} 
 
 
.p-interview__hero::before, 
.p-interview__schedule-card::before, 
.p-interview__block-dark::before, 
.p-interview__others::before { 
 content: ""; 
 opacity: 0.4; 
 position: absolute; 
 top: 0; 
 left: 0; 
 height: 100%; 
 width: 100%; 
 pointer-events: none; 
} 
 
@media screen and (min-width: 768px) { 
 .p-interview__hero::before, 
 .p-interview__schedule-card::before, 
 .p-interview__block-dark::before, 
 .p-interview__others::before { 
 background: url("../img_r2/common/bg_noise_gray.svg") repeat 0 0/40% auto; 
 } 
} 
 
@media screen and (max-width: 767.98px) { 
 .p-interview__hero::before, 
 .p-interview__schedule-card::before, 
 .p-interview__block-dark::before, 
 .p-interview__others::before { 
 background-image: -webkit-radial-gradient(12% 18%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(33% 77%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(58% 22%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(76% 41%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(21% 64%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(48% 55%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(67% 83%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(88% 28%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(15% 45%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(90% 70%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(35% 12%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%), -webkit-radial-gradient(55% 95%, 1px 1px, rgba(0, 0, 0, 0.6) 50%, transparent 51%); 
 background-image: radial-gradient(1px 1px at 12% 18%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 33% 77%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 58% 22%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 76% 41%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 21% 64%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 48% 55%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 67% 83%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 88% 28%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 15% 45%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 90% 70%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 35% 12%, rgba(0, 0, 0, 0.6) 50%, transparent 51%), radial-gradient(1px 1px at 55% 95%, rgba(0, 0, 0, 0.6) 50%, transparent 51%); 
 background-size: 20px 10px; 
 mix-blend-mode: multiply; 
 } 
} 
/* Breadcrumb */ 
 
.p-interview__breadcrumb { 
 background-color: #f3f3f3; 
 display: flex; 
 align-items: center; 
 justify-content: flex-end; 
 gap: 15px; 
 padding: 30px max(80px, calc((100% - 1440px) / 2 + 80px)) 60px; 
 font-family: var(--font1); 
 font-size: 1.3rem; 
 font-weight: 500; 
 letter-spacing: 0.1em; 
 text-transform: uppercase; 
} 
 
.p-interview__breadcrumb-plain { 
 color: #555; 
} 
 
.p-interview__breadcrumb a { 
 color: #555; 
 text-decoration: none; 
} 
 
.p-interview__breadcrumb a:hover { 
 text-decoration: underline; 
 text-underline-offset: 3px; 
} 
 
.p-interview__breadcrumb-sep { 
 width: 4px; 
 height: 8px; 
 display: inline-block; 
 flex-shrink: 0; 
 background: url("data:image/svg+xml,%3Csvg width='4' height='8' viewBox='0 0 4 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.5 0.5L3.5 4L0.5 7.5' stroke='%23555555' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / contain; 
} 
 
.p-interview__breadcrumb-current { 
 color: #888; 
} 
 
/* ---- Section Title (shared) ---- */ 
 
.p-interview__section-ttl { 
 display: flex; 
 flex-direction: column; 
 gap: 20px; 
} 
 
.p-interview__section-ttl-label { 
 display: inline-block; 
 background-color: #afff27; 
 color: #222; 
 font-family: var(--font1); 
 font-size: 1.4rem; 
 font-weight: 700; 
 line-height: 1; 
 padding: 4px 6px; 
 width: fit-content; 
} 
 
.p-interview__section-ttl-en { 
 font-family: var(--font3); 
 font-size: 4.4rem; 
 font-weight: 400; 
 letter-spacing: 0.1em; 
 line-height: 1.2; 
 text-transform: uppercase; 
} 


/* ---- Movie ---- */ 

.p-interview__movie-section {
    padding-block: 90px 70px;
}

.p-interview__movie-wrap {
    text-align: center;
}

.p-interview__movie-wrap iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    max-width: 840px;
    vertical-align: middle;
}

@media screen and (max-width: 767.98px) {
    .p-interview__movie-section {
        padding-block: 30px 20px;
    }
}


/* ---- Schedule ---- */ 
 
.p-interview__schedule-section { 
 background-color: #f3f3f3; 
 padding: 80px 80px 0; 
} 
 
.p-interview__schedule-card { 
 background-color: #363935; 
 position: relative; 
 border-radius: 50px; 
 overflow: hidden; 
 padding: 100px clamp(40px, 8.6vw, 110px); 
 display: flex; 
 justify-content: space-between; 
 gap: clamp(20px, 4vw, 100px); 
 max-width: 1280px; 
 margin: 0 auto; 
} 
 
.p-interview__schedule-left { 
 display: flex; 
 flex-direction: column; 
 justify-content: space-between; 
 flex-shrink: 0; 
} 
 
.p-interview__schedule-card .p-interview__section-ttl-en { 
 color: #fff; 
} 
 
.p-interview__schedule-photo { 
 width: 257px; 
 height: 465px; 
 border-radius: 3px; 
 overflow: visible; 
 flex-shrink: 0; 
 position: relative; 
} 
 
.p-interview__schedule-photo img { 
 display: block; 
 position: absolute; 
 bottom: 0; 
 right: 0; 
 width: auto; 
 max-width: none; 
 height: 100%; 
} 
 
.p-interview__schedule-right { 
 flex: 1; 
 min-width: 0; 
 padding-top: 40px; 
} 
 
.p-interview__timeline { 
 display: grid; 
 grid-template-columns: 62px 13px 1fr; 
 column-gap: 30px; 
 row-gap: 52px; 
 position: relative; 
} 
 
.p-interview__timeline::before { 
 content: ''; 
 position: absolute; 
 left: calc(62px + 30px + 6.5px); 
 top: 6.5px; 
 bottom: 6.5px; 
 width: 1px; 
 background: #afff27; 
 z-index: 0; 
} 
 
.p-interview__timeline-row { 
 display: contents; 
} 
 
.p-interview__timeline-time { 
 font-family: var(--font3); 
 font-size: 2.2rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 1; 
 color: #afff27; 
 text-align: right; 
 align-self: start; 
} 
 
.p-interview__timeline-dot { 
 width: 13px; 
 height: 13px; 
 background: #afff27; 
 justify-self: center; 
 align-self: start; 
 position: relative; 
 z-index: 1; 
 transform: rotate(45deg); 
} 
 
.p-interview__timeline-activity { 
 font-family: var(--font1); 
 font-size: 1.8rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 1; 
 color: #fff; 
 align-self: start; 
} 
 
/* ---- Q&A (一問一答) ---- */ 
 
.p-interview__qa-section { 
 background-color: #f3f3f3; 
 padding: 150px 80px; 
} 
 
.p-interview__qa-card { 
 background-color: #fff; 
 border-radius: 50px; 
 padding: 100px 110px; 
 display: flex; 
 flex-direction: column; 
 align-items: center; 
 gap: 80px; 
 max-width: 1280px; 
 margin: 0 auto; 
} 
 
.p-interview__qa-card .p-interview__section-ttl { 
 align-items: center; 
 text-align: center; 
} 
 
.p-interview__qa-card .p-interview__section-ttl-en { 
 color: #222; 
} 
 
.p-interview__qa-cols { 
 display: grid; 
 grid-template-columns: repeat(2, minmax(0, 1fr)); 
 grid-template-rows: repeat(3, auto); 
 grid-auto-flow: column; 
 column-gap: 80px; 
 row-gap: 0; 
 width: 100%; 
 align-items: stretch; 
 position: relative; 
} 
 
.p-interview__qa-cols::before { 
 content: ''; 
 position: absolute; 
 left: 50%; 
 top: 0; 
 bottom: 0; 
 width: 1px; 
 background-color: #e0e0e0; 
 transform: translateX(-0.5px); 
 pointer-events: none; 
} 
 
.p-interview__qa-col { 
 display: contents; 
} 
 
.p-interview__qa-item { 
 display: flex; 
 flex-direction: column; 
 gap: 30px; 
 padding-bottom: 60px; 
 border-bottom: 1px solid #e0e0e0; 
} 
 
.p-interview__qa-item + .p-interview__qa-item { 
 padding-top: 30px; 
} 
 
.p-interview__qa-item:last-child { 
 border-bottom: none; 
 padding-bottom: 0; 
} 
 
.p-interview__qa-q-wrap { 
 display: flex; 
 align-items: flex-start; 
 gap: 20px; 
} 
 
.p-interview__qa-q-badge { 
 width: 40px; 
 height: 40px; 
 display: flex; 
 align-items: center; 
 justify-content: center; 
 background-color: #363935; 
 border-radius: 3px; 
 flex-shrink: 0; 
} 
 
.p-interview__qa-q-badge span { 
 font-family: var(--font3); 
 font-size: 2.6rem; 
 font-weight: 400; 
 color: #afff27; 
 line-height: 1; 
} 
 
.p-interview__qa-question { 
 font-family: var(--font1); 
 font-size: 2rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 color: #222; 
 flex: 1; 
 min-width: 0; 
} 
 
.p-interview__qa-answer { 
 font-family: var(--font1); 
 font-size: 1.6rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 color: #222; 
 text-align: justify; 
} 
 
/* ---- Interview Content Blocks ---- */ 
 
.p-interview__blocks { 
 display: flex; 
 flex-direction: column; 
} 
 
.p-interview__block-dark { 
 background-color: #363935; 
 position: relative; 
padding: 150px 80px; 
} 
 
.p-interview__block-light { 
 background-color: #f3f3f3; 
 padding: 150px 80px; 
} 
 
.p-interview__block-inner { 
 max-width: 1280px; 
 margin: 0 auto; 
 display: flex; 
 flex-direction: column; 
 gap: 80px; 
} 
 
/* Block header */ 
.p-interview__block-header { 
 display: flex; 
 gap: 80px; 
 align-items: flex-start; 
} 
 
.p-interview__block-dark .p-interview__block-header .p-interview__section-ttl-en { 
 color: #fff; 
} 
 
.p-interview__block-light .p-interview__block-header .p-interview__section-ttl-en { 
 color: #222; 
} 
 
/* Block body */ 
.p-interview__block-body { 
 display: flex; 
 gap: 164px; 
 align-items: flex-start; 
} 
 
.p-interview__block-light .p-interview__block-body { 
 flex-direction: row-reverse; 
} 
 
/* Side label animation */ 
@keyframes slide-label-in { 
 from { clip-path: inset(0 0 100% 0); } 
 to { clip-path: inset(0 0 0 0); } 
} 
 
@keyframes slide-label-in-h { 
 from { clip-path: inset(0 100% 0 0); } 
 to { clip-path: inset(0 0 0 0); } 
} 
 
.p-interview__side-labels.slide-label .p-interview__side-label { 
 clip-path: inset(0 0 100% 0); 
} 
 
.p-interview__side-labels.slide-label.is-active .p-interview__side-label { 
 animation: slide-label-in 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; 
} 
 
/* 右 = 高いnth-child → 全ブロック共通（side-labels内は常にrow） */ 
.p-interview__side-labels.slide-label.is-active .p-interview__side-label:nth-child(1) { animation-delay: 0.5s; } 
.p-interview__side-labels.slide-label.is-active .p-interview__side-label:nth-child(2) { animation-delay: 0.25s; } 
.p-interview__side-labels.slide-label.is-active .p-interview__side-label:nth-child(3) { animation-delay: 0s; } 
 
/* Side labels */ 
.p-interview__side-labels { 
 display: flex; 
 flex-direction: row; 
 align-items: flex-start; 
 flex-shrink: 0; 
 align-self: flex-start; 
} 
 
.p-interview__side-label--sp {
 display: none;
}

.p-interview__side-label { 
 writing-mode: vertical-rl; 
 text-orientation: mixed; 
 font-family: var(--font2); 
 font-size: 3.6rem; 
 font-weight: 400; 
 letter-spacing: 0.05em; 
 line-height: 1.2; 
 background-color: #afff27; 
 color: #222; 
 padding: 24px 16px; 
 margin-inline-start: -10px; 
} 
 
/* Q main content */ 
.p-interview__block-main { 
 flex: 1; 
 min-width: 0; 
 display: flex; 
 flex-direction: column; 
 gap: 50px; 
} 
 
/* Q header line */ 
.p-interview__q-header { 
 display: flex; 
 align-items: center; 
 gap: 30px; 
 padding-bottom: 20px; 
 border-bottom: 1px solid; 
} 
 
.p-interview__block-dark .p-interview__q-header { 
 border-bottom-color: #888; 
} 
 
.p-interview__block-light .p-interview__q-header { 
 border-bottom-color: #ddd; 
} 
 
.p-interview__q-label { 
 font-family: var(--font3); 
 font-size: 2rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 1.2; 
 flex-shrink: 0; 
} 
 
.p-interview__block-dark .p-interview__q-label { 
 color: #afff27; 
} 
 
.p-interview__block-light .p-interview__q-label { 
 color: #363935; 
} 
 
.p-interview__q-title { 
 font-family: var(--font2); 
 font-size: 2.4rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 1.2; 
} 
 
.p-interview__block-dark .p-interview__q-title { 
 color: #fff; 
} 
 
.p-interview__block-light .p-interview__q-title { 
 color: #222; 
} 
 
/* Interview image */ 
.p-interview__block-img-wrap { 
 width: 100%; 
 /* height: 580px;  */
 overflow: hidden; 
 border-radius: 3px; 
} 
 
.p-interview__block-img-wrap img { 
 display: block; 
 width: 100%; 
 height: 100%; 
 object-fit: cover; 
} 
 
/* Two-column text area */ 
.p-interview__block-cols { 
 display: flex; 
 gap: 60px; 
 align-items: flex-start; 
} 
 
.p-interview__block-col { 
 flex: 1; 
 min-width: 0; 
 display: flex; 
 flex-direction: column; 
 gap: 30px; 
} 
 
/* Quote box */ 
.p-interview__quote { 
 display: flex; 
 align-items: center; 
 gap: 10px; 
 padding: 10px; 
 background-color: #222; 
} 
 
.p-interview__quote::before { 
 content: ''; 
 width: 12px; 
 height: 12px; 
 background-color: #fff; 
 clip-path: polygon(0 0, 100% 50%, 0 100%); 
 flex-shrink: 0; 
} 
 
.p-interview__quote-text { 
 font-family: var(--font1); 
 font-size: 1.6rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 1; 
 color: #fff; 
} 
 
/* Light block quote overrides */ 
.p-interview__block-light .p-interview__quote { 
 background-color: #e8e8e8; 
} 
 
.p-interview__block-light .p-interview__quote::before { 
 background-color: #222; 
} 
 
.p-interview__block-light .p-interview__quote-text { 
 color: #222; 
} 
 
/* Body text */ 
.p-interview__body-text { 
 font-family: var(--font1); 
 font-size: 1.6rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 text-align: justify; 
} 
 
.p-interview__block-dark .p-interview__body-text { 
 color: #fff; 
} 
 
.p-interview__block-light .p-interview__body-text { 
 color: #222; 
} 
 
/* ---- Recruit CTA ---- */ 
 
.p-interview__recruit-cta { 
 background: 
 radial-gradient(circle 639px at 50% 50%, rgba(175, 255, 39, 0.30) 0%, rgba(175, 255, 39, 0) 100%), 
 #fff; 
 padding: 100px 80px; 
} 
 
.p-interview__recruit-cta-inner { 
 max-width: 1280px; 
 margin: 0 auto; 
 display: flex; 
 flex-direction: column; 
 gap: 60px; 
 align-items: center; 
 text-align: center; 
} 
 
.p-interview__recruit-cta-ttl { 
 display: flex; 
 flex-direction: column; 
 gap: 30px; 
} 
 
.p-interview__recruit-cta-label { 
 font-family: var(--font3); 
 font-size: 1.4rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 1; 
 color: #222; 
} 
 
.p-interview__recruit-cta-heading { 
 font-family: var(--font2); 
 font-size: 3.2rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 1.4; 
 color: #222; 
} 
 
.p-interview__recruit-cta-text { 
 font-family: var(--font1); 
 font-size: 1.6rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 color: #222; 
} 
 
 
/* ---- Other Members ---- */ 
 
.p-interview__others { 
 background-color: #363935; 
 position: relative; 
padding: 100px 0; 
} 
 
.p-interview__others-ttl { 
 display: flex; 
 flex-direction: column; 
 align-items: center; 
 gap: 30px; 
 text-align: center; 
 margin-bottom: 60px; 
} 
 
.p-interview__others-ttl-en { 
 font-family: var(--font3); 
 font-size: 1.4rem; 
 font-weight: 700; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 color: #afff27; 
 text-transform: uppercase; 
} 
 
.p-interview__others-ttl-ja { 
 font-family: var(--font2); 
 font-size: 3.2rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 2; 
 color: #afff27; 
} 
 
/* 「他のメンバー」無限マーキー（採用TOPと同一マークアップ / 背景は .p-interview__others のまま） */ 
.p-interview__others .p-top-interview__rail-wrap { 
 --p-top-interview-marquee-gap: clamp(24px, 3vw, 40px); 
 --p-top-interview-marquee-duration: calc(100s / 1.5); 
 width: 100%; 
 overflow: hidden; 
} 
 
.p-interview__others .p-top-interview__marquee { 
 overflow: hidden; 
 padding-block: clamp(32px, 5vw, 56px); 
 padding-bottom: clamp(48px, 7vw, 88px); 
 padding-inline: max(24px, calc((100vw - min(1200px, 100vw - 40px)) / 2)); 
} 
 
.p-interview__others .p-top-interview__marquee-track { 
 display: flex; 
 flex-direction: row; 
 width: max-content; 
 gap: 0; 
 animation: p-top-interview-marquee var(--p-top-interview-marquee-duration, calc(100s / 1.5)) 
 linear infinite; 
 will-change: transform; 
} 
 
.p-interview__others .p-top-interview__marquee-strip { 
 display: flex; 
 flex-direction: row; 
 flex-shrink: 0; 
 gap: var(--p-top-interview-marquee-gap); 
 margin-inline-end: var(--p-top-interview-marquee-gap); 
} 
 
@media (prefers-reduced-motion: reduce) { 
 .p-interview__others .p-top-interview__marquee-track { 
 animation: none; 
 transform: none; 
 } 
} 
 
@keyframes p-top-interview-marquee { 
 from { 
 transform: translateX(0); 
 } 
 to { 
 transform: translateX(-50%); 
 } 
} 
 
.p-interview__others .p-top-interview__card { 
 flex: 0 0 320px; 
 scroll-snap-align: start; 
 width: 320px; 
 max-width: min(320px, 88vw); 
 text-decoration: none; 
 color: #fff; 
} 
 
.p-interview__others .p-top-interview__marquee-strip .p-top-interview__card:nth-child(even) { 
 transform: translateY(56px); 
} 
 
.p-interview__others .p-top-interview__photo { 
 position: relative; 
 width: 100%; 
} 
 
.p-interview__others .p-top-interview__photo-inner { 
 position: relative; 
 width: 100%; 
 height: 360px; 
 overflow: hidden; 
 border-radius: 10px 10px 0 0; 
} 
 
.p-interview__others .p-top-interview__img { 
 position: absolute; 
 inset: 0; 
 width: 100%; 
 height: 100%; 
 object-fit: cover; 
 object-position: center top; 
 filter: none; 
 transition: opacity 0.35s ease; 
} 
 
.p-interview__others .p-top-interview__img--default { 
 opacity: 1; 
} 
 
.p-interview__others .p-top-interview__img--hover { 
 opacity: 0; 
} 
 
.p-interview__others .p-top-interview__card:hover .p-top-interview__img--default { 
 opacity: 0; 
} 
 
.p-interview__others .p-top-interview__card:hover .p-top-interview__img--hover { 
 opacity: 1; 
} 
 
.p-interview__others .p-top-interview__meta { 
 display: flex; 
 flex-direction: column; 
 gap: 28px; 
 margin-top: 28px; 
 width: 100%; 
} 
 
.p-interview__others .p-top-interview__meta-id { 
 display: flex; 
 flex-direction: column; 
 gap: 20px; 
 align-items: flex-start; 
} 
 
.p-interview__others .p-top-interview__role { 
 margin: 0; 
 font-family: var(--font3); 
 font-size: 1.4rem; 
 font-weight: 500; 
 line-height: 1.45; 
 letter-spacing: 0.7px; 
 color: #fff; 
} 
 
.p-interview__others .p-top-interview__name { 
 margin: 0; 
 font-family: var(--font2); 
 font-size: 2.8rem; 
 font-weight: 400; 
 line-height: normal; 
 color: #fff; 
} 
 
.p-interview__others .p-top-interview__join { 
 margin: 0; 
 padding-top: 0; 
 padding-bottom: 20px; 
 border-top: none; 
 border-bottom: 1px solid rgba(255, 255, 255, 0.7); 
 font-family: var(--font3); 
 font-size: 14px; 
 font-weight: 400; 
 line-height: normal; 
 letter-spacing: 0.08em; 
 color: #fff; 
} 
 
.p-interview__member-card { 
 width: 320px; 
 text-decoration: none; 
 display: flex; 
 flex-direction: column; 
 gap: 30px; 
} 
 
.p-interview__member-card-photo { 
 width: 320px; 
 height: 400px; 
 position: relative; 
 overflow: hidden; 
 border-radius: 3px; 
} 
 
.p-interview__member-card-img { 
 position: absolute; 
 inset: 0; 
 display: block; 
 width: 100%; 
 height: 100%; 
 object-fit: cover; 
 object-position: center top; 
 filter: none; 
 transition: transform 0.4s ease, opacity 0.4s ease; 
} 
 
.p-interview__member-card-img--default { 
 opacity: 1; 
} 
 
.p-interview__member-card-img--hover { 
 opacity: 0; 
} 
 
.p-interview__member-card:hover .p-interview__member-card-img--default { 
 opacity: 0; 
 transform: scale(1.04); 
} 
 
.p-interview__member-card:hover .p-interview__member-card-img--hover { 
 opacity: 1; 
 transform: scale(1.04); 
} 
 
.p-interview__member-card-info { 
 display: flex; 
 flex-direction: column; 
 gap: 12px; 
 border-bottom: 1px solid rgba(255, 255, 255, 0.7); 
 padding-bottom: 18px; 
} 
 
.p-interview__member-card-role { 
 font-family: var(--font3); 
 font-size: 1.4rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 line-height: 1.6; 
 color: #fff; 
} 
 
.p-interview__member-card-sep { 
 border: none; 
 border-top: 1px solid #fff; 
 margin: 4px 0; 
} 
 
.p-interview__member-card-name { 
 font-family: var(--font2); 
 font-size: 2.8rem; 
 font-weight: 400; 
 line-height: 1.2; 
 color: #fff; 
} 
 
.p-interview__member-card-join { 
 font-family: var(--font3); 
 font-size: 1.6rem; 
 font-weight: 400; 
 letter-spacing: 0.05em; 
 line-height: 1.4; 
 color: #fff; 
} 
 
/* ---- Interview List Page ---- */ 
 
.p-member-list__head { 
 border-bottom: none; 
 padding-bottom: 70px; 
} 
 
.p-member-list__title .en { 
 letter-spacing: 0.08em; 
} 
 
.p-member-list { 
 padding-top: 60px; 
} 
 
.p-member-list__intro { 
 display: flex; 
 justify-content: space-between; 
 align-items: flex-start; 
 gap: 48px; 
 margin-bottom: 60px; 
} 
 
.p-member-list__group { 
 display: flex; 
 flex-direction: column; 
 gap: 16px; 
 flex-shrink: 0; 
} 
 
.p-member-list__group-ja { 
 display: inline-flex; 
 align-items: center; 
 justify-content: center; 
 width: fit-content; 
 padding: 4px 8px; 
 background: #afff27; 
 color: #222; 
 font-family: var(--font1); 
 font-size: 1.2rem; 
 font-weight: 700; 
 letter-spacing: 0.02em; 
} 
 
.p-member-list__sp-break { 
 display: none; 
} 
 
.p-member-list__group-en { 
 font-family: var(--font3); 
 font-size: 5.2rem; 
 font-weight: 400; 
 line-height: 1.05; 
 letter-spacing: 0.1em; 
 color: #222; 
} 
 
.p-member-list__lead { 
 max-width: 620px; 
 margin-top: 16px; 
 font-family: var(--font1); 
 font-size: 1.6rem; 
 font-weight: 500; 
 line-height: 2; 
 letter-spacing: 0.05em; 
 color: #1a1a1a; 
} 
 
.p-interview-list__grid { 
 display: grid; 
 grid-template-columns: repeat(3, minmax(0, 1fr)); 
 column-gap: 115px; 
 row-gap: 60px; 
} 
 
.p-interview-list__card { 
 text-decoration: none; 
 display: flex; 
 flex-direction: column; 
 gap: 30px; 
} 
 
.p-interview-list__photo { 
 width: 100%; 
 aspect-ratio: 4 / 5; 
 overflow: hidden; 
 border-radius: 3px; 
} 
 
.p-interview-list__photo img { 
 display: block; 
 width: 100%; 
 height: 100%; 
 object-fit: cover; 
 filter: grayscale(1); 
 transition: transform 0.4s ease, filter 0.4s ease; 
} 
 
.p-interview-list__card:hover .p-interview-list__photo img { 
 transform: scale(1.04); 
 filter: grayscale(0); 
} 
 
.p-interview-list__info { 
 display: flex; 
 flex-direction: column; 
 gap: 12px; 
} 
 
.p-interview-list__role { 
 font-family: var(--font3); 
 font-size: 1.4rem; 
 font-weight: 500; 
 letter-spacing: 0.05em; 
 color: #555; 
} 
 
.p-interview-list__name { 
 font-family: var(--font2); 
 font-size: 2.8rem; 
 font-weight: 400; 
 line-height: 1.2; 
 color: #222; 
} 
 
.p-interview-list__join { 
 margin: 0; 
 padding-top: 0; 
 padding-bottom: 12px; 
 border-top: none; 
 border-bottom: 1px solid #ddd; 
 font-family: var(--font3); 
 font-size: 1.6rem; 
 font-weight: 400; 
 letter-spacing: 0.05em; 
 color: #555; 
} 
 
/* ---- Responsive ---- */ 
 
@media screen and (max-width: 1279.98px) { 
 .p-interview__member-num { 
 left: 40px; 
 } 
 
 .p-interview__hero-left { 
 padding-left: 40px; 
 } 
 
 .p-interview__hero-catch { 
 padding-right: 40px; 
 } 
 
 .p-interview__breadcrumb { 
 padding-inline: 40px; 
 } 
 
 .p-interview__schedule-section, 
 .p-interview__qa-section { 
 padding-inline: 40px; 
 } 
 
 .p-interview__block-dark, 
 .p-interview__block-light { 
 padding-inline: 40px; 
 } 
 
 .p-member-list__intro { 
 flex-direction: column; 
 gap: 24px; 
 margin-bottom: 48px; 
 } 
 
 .p-member-list__lead { 
 max-width: 100%; 
 margin-top: 0; 
 } 
 
} 
 
@media screen and (max-width: 1023.98px) { 
 .p-interview__hero-inner { 
 display: grid; 
 grid-template-columns: 170px minmax(0, 1fr); 
 grid-template-rows: auto auto auto; 
 min-height: auto; 
 width: min(100% - 40px, 362px); 
 margin: 0 auto; 
 padding: 20px 0 40px; 
 gap: 0; 
 } 
 
 .p-interview__hero-photo { 
 grid-column: 1 / -1; 
 grid-row: 1; 
 width: 100%; 
 height: auto; 
 overflow: hidden; 
 margin: 0; 
 } 
 
 .p-interview__hero-ph-img { 
 position: static; 
 display: block; 
 width: 100%; 
 height: auto; 
 transform: none; 
 } 
 
 .p-interview__member-num { 
 grid-column: 1; 
 grid-row: 2; 
 position: static; 
 margin: 30px 0 0; 
 padding: 0; 
 writing-mode: horizontal-tb; 
 font-size: 2rem; 
 font-weight: 400; 
 line-height: 1; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__hero-left { 
 grid-column: 1; 
 grid-row: 3; 
 padding: 20px 0 0; 
 flex-direction: column; 
 align-items: flex-start; 
 justify-content: flex-start; 
 gap: 0; 
 width: 170px; 
 } 
 
 .p-interview__hero-profile { 
 gap: 20px; 
 width: 100%; 
 } 
 
 .p-interview__hero-profile-top { 
 gap: 20px; 
 } 
 
 .p-interview__hero-role { 
 font-size: 1.3rem; 
 line-height: 1.6; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__hero-name { 
 gap: 10px; 
 align-items: flex-end; 
 } 
 
 .p-interview__hero-name-ja { 
 font-size: 2.6rem; 
 line-height: 1; 
 } 
 
 .p-interview__hero-name-en { 
 font-size: 1.3rem; 
 line-height: 1; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__hero-divider { 
 margin: 0; 
 } 
 
 .p-interview__hero-meta { 
 flex-direction: column; 
 align-items: flex-start; 
 gap: 16px; 
 } 
 
 .p-interview__hero-meta-dept, 
 .p-interview__hero-meta-join { 
 font-size: 1.3rem; 
 line-height: 1; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__hero-catch { 
 grid-column: 2; 
 grid-row: 2 / 4; 
 padding: 30px 10px 0 0; 
 justify-content: flex-start; 
 align-items: flex-start; 
 flex-direction: row-reverse; 
 gap: 12px; 
 } 
 
 .p-interview__hero-catch span { 
 writing-mode: vertical-rl; 
 text-orientation: mixed; 
 font-size: 2.4rem; 
 line-height: 1.2; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__breadcrumb { 
 padding: 20px; 
 flex-wrap: wrap; 
 justify-content: flex-start; 
 gap: 8px; 
 } 
 
 .p-interview__schedule-section { 
 padding: 20px; 
 } 
 
 .p-interview__schedule-card { 
 background-color: #363935; 
 position: relative; 
 border-radius: 50px; 
 overflow: hidden; 
 padding: 100px clamp(40px, 8.6vw, 110px); 
 display: flex; 
 justify-content: space-between; 
 gap: clamp(20px, 4vw, 100px); 
 max-width: 1280px; 
 margin: 0 auto; 
} 
 
 .p-interview__schedule-photo { 
 width: 100%; 
 height: 250px; 
 } 
 
 .p-interview__schedule-right { 
 padding-top: 0; 
 } 
 
 .p-interview__section-ttl-en { 
 font-size: 30px; 
 } 
 
 .p-interview__qa-question { 
 font-size: 16px; 
 line-height: 1.8; 
 } 
 
 .p-interview__qa-answer { 
 font-size: 14px; 
 line-height: 2; 
 } 
 
 .p-interview__qa-q-badge { 
 width: 30px; 
 height: 30px; 
 } 
 
 .p-interview__qa-q-badge span { 
 font-size: 18px; 
 } 
 
 .p-interview__qa-section { 
 padding: 0 20px 20px; 
 } 
 
 .p-interview__qa-card { 
 padding: 60px 30px; 
 border-radius: 30px; 
 gap: 40px; 
 } 
 
 .p-interview__qa-cols { 
 display: block; 
 } 
 
 .p-interview__qa-col { 
 display: flex; 
 flex-direction: column; 
 gap: 60px; 
 } 
 
 .p-interview__qa-cols::before { 
 content: none; 
 } 
 
 
 .p-interview__qa-col:first-child .p-interview__qa-item:last-child { 
 border-bottom: 1px solid #e0e0e0; 
 padding-bottom: 60px; 
 } 
 
 .p-interview__qa-col:last-child { 
 padding-top: 60px; 
 } 
 
 .p-interview__block-dark, 
 .p-interview__block-light { 
 padding: 80px 20px; 
 } 
 
 .p-interview__block-body, 
 .p-interview__block-light .p-interview__block-body { 
 flex-direction: column; 
 gap: 40px; 
 } 
 
 .p-interview__side-labels { 
 flex-direction: column-reverse; 
 align-self: auto; 
 margin-bottom: 20px; 
 } 
 
 .p-interview__side-labels.slide-label .p-interview__side-label { 
 clip-path: inset(0 100% 0 0); 
 } 
 
 .p-interview__side-labels.slide-label.is-active .p-interview__side-label { 
 animation-name: slide-label-in-h; 
 } 
 
 .p-interview__side-label { 
 font-size: 2rem; 
 padding: 12px 16px; 
 writing-mode: horizontal-tb; 
 } 

.p-interview__side-label--pc {
 display: none;
}

.p-interview__side-label--sp {
 display: block;
}
 
 .p-interview__block-header { 
 flex-direction: column; 
 gap: 30px; 
 } 
 
 .p-interview__block-cols { 
 flex-direction: column; 
 } 
 
 .p-interview__quote-text { 
 font-size: 14px; 
 line-height: 2; 
 } 
 
 .p-interview__body-text { 
 font-size: 14px; 
 } 
 
 .p-interview__block-img-wrap { 
 /* height: 250px;  */
 } 
 
 .p-interview__q-title { 
 font-size: 2rem; 
 } 
 .p-interview__schedule-card { 
 border-radius: 10px; 
 padding: 40px 30px; 
 display: flex; 
 flex-direction: column; 
 justify-content: flex-start; 
 gap: 40px; 
 max-width: none; 
 margin: 0; 
 } 
 
 .p-interview__schedule-right { 
 padding-top: 0; 
 width: 100%; 
 } 
 
 .p-interview__schedule-left { 
 display: flex; 
 flex-direction: row; 
 align-items: flex-start; 
 justify-content: space-between; 
 gap: 16px; 
 } 
 
 .p-interview__schedule-photo { 
 display: block; 
 width: 90px; 
 height: 90px; 
 flex-shrink: 0; 
 overflow: hidden; 
 border-radius: 3px; 
 align-self: flex-start; 
 margin-top: 0; 
 } 
 
.p-interview__schedule-left .p-interview__section-ttl { 
margin-top: 0; 
align-self: flex-start; 
} 
 
.p-interview__schedule-left .p-interview__section-ttl-label { 
margin-top: 0; 
} 
 
 
 .p-interview__schedule-photo img { 
 position: static; 
 display: block; 
 width: 100%; 
 height: 100%; 
 object-fit: cover; 
 } 
 
 .p-interview__timeline { 
 grid-template-columns: 48px 10px 1fr; 
 column-gap: 16px; 
 row-gap: 28px; 
 } 
 
 .p-interview__timeline::before { 
 left: calc(48px + 16px + 5px); 
 top: 5px; 
 bottom: 5px; 
 } 
 
 .p-interview__timeline-time, 
 .p-interview__timeline-activity { 
 font-size: 16px; 
 } 
 
 .p-interview__timeline-dot { 
 width: 10px; 
 height: 10px; 
 } 
 
 .p-interview__others { 
 padding: 80px 0; 
 } 
 
 .p-member-list__head { 
 padding-bottom: 50px; 
 } 
 
 .p-member-list { 
 padding-top: 40px; 
 } 
 
 .p-member-list__group-en { 
 font-size: 40px; 
 letter-spacing: 0.06em; 
 } 
 
 .p-member-list__sp-break { 
 display: block; 
 } 
 
 .p-member-list__lead { 
 font-size: 1.4rem; 
 line-height: 1.9; 
 } 
 
 .p-interview__others-ttl { 
 gap: 16px; 
 margin-bottom: 40px; 
 } 
 
 .p-interview__others-ttl-ja { 
 font-size: 2.6rem; 
 line-height: 1.6; 
 } 
 
 .p-interview__others .p-top-interview__marquee { 
 padding-inline: 20px; 
 } 
 
 .p-interview__others .p-top-interview__marquee-track { 
 display: grid; 
 grid-template-columns: repeat(2, minmax(0, 170px)); 
 justify-content: space-between; 
 column-gap: 22px; 
 row-gap: 40px; 
 width: 100%; 
 max-width: 362px; 
 margin-inline: auto; 
 animation: none; 
 transform: none; 
 will-change: auto; 
 } 
 
 .p-interview__others .p-top-interview__marquee-strip { 
 display: contents; 
 margin-inline-end: 0; 
 } 
 
 .p-interview__others .p-top-interview__marquee-strip--clone { 
 display: none; 
 } 
 
 .p-interview__others .p-top-interview__marquee-track > .p-top-interview__marquee-strip:not(:first-child) { 
 display: none; 
 } 
 
 .p-interview__others-list > .p-interview__member-card:nth-child(n + 6), 
 .p-interview__others .p-top-interview__marquee-track > .p-top-interview__card:nth-child(n + 6) { 
 display: none; 
 } 
 
 .p-interview__others .p-top-interview__marquee-strip > .p-top-interview__card:nth-child(n + 6) { 
 display: none; 
 } 
 
 
 .p-interview__others .p-top-interview__marquee-strip .p-top-interview__card:nth-child(even) { 
 transform: none; 
 } 
 
 .p-interview__others .p-top-interview__card { 
 flex: 0 0 170px; 
 width: 170px; 
 max-width: 170px; 
 } 
 
 .p-interview__others .p-top-interview__photo-inner { 
 height: auto; 
 aspect-ratio: 170 / 212.5; 
 border-radius: 0; 
 } 
 
 .p-interview__others .p-top-interview__meta { 
 margin-top: 30px; 
 gap: 20px; 
 padding-bottom: 20px; 
 border-bottom: 1px solid rgba(255, 255, 255, 0.7); 
 } 
 
 .p-interview__others .p-top-interview__meta-id { 
 gap: 16px; 
 } 
 
 .p-interview__others .p-top-interview__role { 
 font-size: 1.3rem; 
 line-height: 1; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__others .p-top-interview__name { 
 font-size: 2.2rem; 
 line-height: 1; 
 } 
 
 .p-interview__others .p-top-interview__join { 
 font-size: 1.3rem; 
 line-height: 1; 
 padding-bottom: 0; 
 border-bottom: none; 
 } 
 
 .p-interview__member-card { 
 width: 170px; 
 max-width: 170px; 
 margin: 0; 
 gap: 30px; 
 } 
 
 .p-interview__member-card-photo { 
 width: 170px; 
 height: auto; 
 aspect-ratio: 170 / 212.5; 
 border-radius: 0; 
 } 
 
 .p-interview__member-card-info { 
 width: 170px; 
 gap: 20px; 
 padding-bottom: 20px; 
 } 
 
 .p-interview__member-card-role { 
 font-size: 1.3rem; 
 line-height: 1; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview__member-card-name { 
 font-size: 2.2rem; 
 line-height: 1; 
 } 
 
 .p-interview__member-card-join { 
 font-size: 1.3rem; 
 line-height: 1; 
 } 
 
 .p-interview-list__grid { 
 grid-template-columns: repeat(2, minmax(0, 170px)); 
 justify-content: space-between; 
 column-gap: 22px; 
 row-gap: 40px; 
 width: 100%; 
 max-width: 362px; 
 margin-inline: auto; 
 } 
 
 .p-interview-list__card { 
 gap: 30px; 
 } 
 
 .p-interview-list__photo { 
 width: 170px; 
 aspect-ratio: 170 / 212.5; 
 border-radius: 0; 
 } 
 
 .p-interview-list__info { 
 width: 170px; 
 gap: 20px; 
 padding-bottom: 20px; 
 border-bottom: 1px solid #ddd; 
 } 
 
 .p-interview-list__role { 
 font-size: 1.3rem; 
 line-height: 1; 
 letter-spacing: 0.05em; 
 } 
 
 .p-interview-list__name { 
 font-size: 2.2rem; 
 line-height: 1; 
 } 
 
 .p-interview-list__join { 
 font-size: 1.3rem; 
 padding-bottom: 0; 
 border-bottom: none; 
 } 
}