/* PCはホバー、縦積み時は画面下端を基準に一面ずつ青へ切り替える。 */
.audience-panels{--audience-hover-overlay:rgb(39 92 223 / .9);--audience-hover-ink:#fff;--audience-button-hover-fill:#fff;--audience-button-hover-ink:var(--blue);padding:12px 12px 112px;scroll-margin-top:100px}
body[data-audience-hover="white"] .audience-panels{--audience-hover-overlay:rgb(255 255 255 / .8);--audience-hover-ink:#17191c;--audience-button-hover-fill:var(--blue);--audience-button-hover-ink:#fff}
.audience-panels-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:1920px;margin-inline:auto}
.audience-panel{position:relative;isolation:isolate;overflow:hidden;min-width:0;min-height:720px;display:flex;flex-direction:column;justify-content:flex-start;background:#17191c;color:#fff;transition:color .5s ease}
.audience-panel::after{content:"";position:absolute;inset:0;z-index:1;background:rgb(0 0 0 / .8);pointer-events:none;transition:background-color .5s ease}
.audience-panel-photo{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:cover}
.audience-panel-creator .audience-panel-photo{object-position:60% center}
.audience-panel-company .audience-panel-photo{object-position:72% center}
.audience-panel-copy{position:relative;z-index:2;padding:72px clamp(32px,3.6vw,64px);text-align:left}
.audience-panel-company .audience-panel-copy{text-align:right}
.audience-panel-label{font-size:16px;font-weight:700;line-height:1.6}
.audience-panel-english{margin-top:27px;font-family:"Anton",sans-serif;font-size:clamp(48px,6.6667vw,96px);font-weight:400;line-height:1.08;white-space:nowrap}
.home-content .audience-panel h2{margin:18px 0 0;font-size:clamp(20px,1.6667vw,24px);font-weight:700;line-height:1.6}
.audience-panel-description{margin-top:10px;font-size:16px;font-weight:500;line-height:1.85}
.audience-panel-link{display:inline-flex;align-items:center;justify-content:center;gap:9px;max-width:100%;min-height:52px;margin-top:32px;padding:13px 22px;border:1px solid currentColor;border-radius:5px;background:transparent;color:#fff;font-size:16px;font-weight:700;line-height:1.5;transition:background-color .5s ease,color .5s ease,border-color .5s ease}
.audience-panel-link svg{width:18px;height:18px;flex-shrink:0}
.audience-panel-link:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
/* タッチ時のhover残留を避け、PCのポインター操作とキーボード操作に限定。 */
@media(min-width:768px) and (hover:hover) and (pointer:fine){
 .audience-panel:where(:hover,:has(.audience-panel-link:focus-visible)){color:var(--audience-hover-ink)}
 .audience-panel:where(:hover,:has(.audience-panel-link:focus-visible))::after{background:var(--audience-hover-overlay)}
 .audience-panel:where(:hover,:has(.audience-panel-link:focus-visible)) .audience-panel-link{color:var(--audience-hover-ink)}
 .audience-panel .audience-panel-link:is(:hover,:focus-visible){background:var(--audience-button-hover-fill);border-color:var(--audience-button-hover-fill);color:var(--audience-button-hover-ink)}
}
@media(min-width:1700px){.audience-panel{min-height:820px}}
@media(min-width:768px) and (max-width:1099px){
 .audience-panel{min-height:650px}.audience-panel-copy{padding:56px 28px}.audience-panel-link{padding-inline:16px}
}
@media(max-width:767px){
 .audience-panels{padding:8px 8px 64px;scroll-margin-top:80px}.audience-panels-grid{grid-template-columns:1fr;gap:8px}.audience-panel{min-height:480px;justify-content:center}.audience-panel-copy{padding:36px 32px}.audience-panel-company .audience-panel-copy{text-align:left}.audience-panel-label{font-size:14px}.audience-panel-english{font-size:clamp(44px,15vw,80px);margin-top:25px}.home-content .audience-panel h2{font-size:clamp(18px,5.1vw,20px);margin-top:16px}.audience-panel-description{font-size:14px;line-height:1.8}.audience-panel-link{min-height:46px;margin-top:28px;padding:11px 18px;font-size:14px}.audience-panel-company .audience-panel-photo{object-position:78% center}
 .audience-panel.is-scroll-active{color:var(--audience-hover-ink)}
 .audience-panel.is-scroll-active::after{background:var(--audience-hover-overlay)}
 .audience-panel.is-scroll-active .audience-panel-link{color:var(--audience-hover-ink)}
 .audience-panel.is-scroll-active .audience-panel-link:focus-visible{outline-color:currentColor}
}
@media(max-width:479px){
 .audience-panel-copy{padding:36px 24px}
}
@media(prefers-reduced-motion:reduce){.audience-panel,.audience-panel::after,.audience-panel-link{transition:none}}