/* recruit（固定ページ7978）固有のCSS ─ shared.css の後ろに読む
 * 1) 共有との唯一の違い：≤560px の .vgrid を2列にする（共有は1列）
 *    ＝元は共有コピーの306/402番目にあった。後ろに .vgrid を触る規則は無いので末尾で等価。
 * 2) wp-mq（マーキー）
 * 3) 本文色＋スマホ中央揃え（2026-07-03）
 */

/* ───── 1) 共有との差分 ───── */
@media(max-width:560px){.vgrid{grid-template-columns:repeat(2,1fr)}}

/* ───── 2) wp-mq ───── */
.wp-marquee{overflow:hidden;width:100%;min-width:0;max-width:100%}.wp-row{display:flex;width:max-content;animation:wpScrollL 54s linear infinite}.wp-row.r2{animation:wpScrollR 60s linear infinite;margin-top:12px}.wp-ph{position:relative;margin:0 12px 0 0;border:1px solid var(--line);line-height:0;overflow:hidden;height:210px;flex:0 0 auto}.wp-ph img{height:210px;width:auto;display:block}.wp-ph figcaption{position:absolute;left:10px;bottom:10px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:#ecf5f8;background:rgba(2,7,5,.55);padding:5px 10px;line-height:1;border-left:2px solid #56b5ce}.wp-marquee:hover .wp-row{animation-play-state:paused}@keyframes wpScrollL{from{transform:translateX(0)}to{transform:translateX(-50%)}}@keyframes wpScrollR{from{transform:translateX(-50%)}to{transform:translateX(0)}}@media(prefers-reduced-motion:reduce){.wp-row{animation:none}}@media(max-width:700px){.wp-ph,.wp-ph img{height:150px}}
/* AUEN: workplace mobile carousel (added by Claude) */
@media(max-width:700px){
.wp-marquee{display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;max-width:100%}
.wp-marquee::-webkit-scrollbar{display:none}
.wp-row,.wp-row.r2{display:contents!important;animation:none!important}
.wp-row.r1 .wp-ph:nth-child(n+7){display:none!important}
.wp-row.r2 .wp-ph:nth-child(n+6){display:none!important}
.wp-ph{flex:0 0 82%!important;scroll-snap-align:center;height:auto!important;margin:0!important;aspect-ratio:4/3}
.wp-ph img{width:100%!important;height:100%!important;object-fit:cover}
}


/* ───── 3) 本文色＋スマホ中央揃え ───── */
/* body-color + mobile-center 2026-07-03: 本文色を他セクション(--ink)と統一＋スマホ中央揃え(businessの mobile-center と同パターン) */
.bandpanel .sub,.cols2 p,.ctapanel p{color:var(--ink)!important}
@media(max-width:860px){
.cols2,.cols2 h3,.cols2 p{text-align:center!important}
.ctapanel{text-align:center!important;justify-content:center}
.ctapanel>div{justify-content:center}
.cols2 h3,.cols2 p,.ctapanel h2,.ctapanel p{text-wrap:balance;line-break:strict}
}