/* =====================================================================
   SP v1 — スマホ最適化 (2026-09-26)
   top-v2.css / pages.css / recruit-v3.css の後に読み込む「上書き専用」シート。
   ①KV等は先にぼかし版(LQIP)を敷いて遷移時の白/黒フラッシュを消す
   ②タッチ端末では出現アニメを止め、最初の描画で完成形を出す
   ③スマホは1画面に収まる密度へ（余白・カード・見出しの圧縮、2列化、横スワイプ）
   ===================================================================== */

/* ---- 1. LQIP: 画像到着前の下地（全幅共通） ---- */
.hero { background-color: #0b1f5c; background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb/2wBDAA4KCw0LCQ4NDA0QDw4RFiQXFhQUFiwgIRokNC43NjMuMjI6QVNGOj1OPjIySGJJTlZYXV5dOEVmbWVabFNbXVn/2wBDAQ8QEBYTFioXFypZOzI7WVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVn/wAARCAASABgDASIAAhEBAxEB/8QAGAABAQEBAQAAAAAAAAAAAAAAAAQFBgL/xAArEAABAwMBAw0AAAAAAAAAAAABAAIDERIhBBMxQQUUIiMyUVJhcZGSobH/xAAYAQACAwAAAAAAAAAAAAAAAAABAgADBP/EABgRAQEBAQEAAAAAAAAAAAAAAAABAzEy/9oADAMBAAIRAxEAPwDbgihc26JzJmeKI3j6VPNgG1DD8Sufikj08wIi0+mjZQspFccnvrTdVXabWarZO64PuyHAZFfI4HDggFaQ0rC4X43m0Cp9kUzuV9kAHsuZXJAqRUopLC2Vzbek4XZyN6ugxGKYyiJheZO2fQ/iIiza+l+fH//Z"); background-size: cover; background-position: center; }
.ph { background-color: #0b1f5c; background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb/2wBDAA4KCw0LCQ4NDA0QDw4RFiQXFhQUFiwgIRokNC43NjMuMjI6QVNGOj1OPjIySGJJTlZYXV5dOEVmbWVabFNbXVn/2wBDAQ8QEBYTFioXFypZOzI7WVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVn/wAARCAASABgDASIAAhEBAxEB/8QAGAABAQEBAQAAAAAAAAAAAAAAAAQFBgL/xAAqEAABAwQAAwcFAAAAAAAAAAABAAIDBBESIRMxQQUUIjJRUmFxkZKhsf/EABgBAAIDAAAAAAAAAAAAAAAAAAECAAME/8QAGBEBAQEBAQAAAAAAAAAAAAAAAAEDMTL/2gAMAwEAAhEDEQA/ANuCKFzconMmZ7ojmP0qe7ANuGH8Sufikjp5gWxU9NGyxZaLI7Pre3K6upqyq4RvMH5bDgNi/wAHQ6dEArSbSsLhnrmcQLn7Ipndr8IAPZky9iQLkXKKSwtlc23xPGW9jmr4NRi2toiYXh/nP0P8REWbT0vz4//Z"); background-size: cover; background-position: center; }
.rc-hero { background-color: #0b1320; background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb/2wBDAA4KCw0LCQ4NDA0QDw4RFiQXFhQUFiwgIRokNC43NjMuMjI6QVNGOj1OPjIySGJJTlZYXV5dOEVmbWVabFNbXVn/2wBDAQ8QEBYTFioXFypZOzI7WVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVn/wAARCAAQABgDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAABgAE/8QAJxAAAgEDBAECBwAAAAAAAAAAAQIDAAQRBRIhMQYHEyIyQWFxsfD/xAAWAQEBAQAAAAAAAAAAAAAAAAABAAL/xAAWEQEBAQAAAAAAAAAAAAAAAAAAAWH/2gAMAwEAAhEDEQA/AFNwFgaO4lVjEisxCjJOOeq2JfxvaLOyNGCm7a3Y+1CPL9X3z6fbwTlUx7nA+c78Yz9OM1r8mnurHS9Sl24R5lSFwx4BGG/HVZ2Ajt2j1O3E0cknss3wgjHR5BB/uaqL+nd/cXcF7b3EzPHEUZNx5BbOf1VSq//Z"); background-size: cover; background-position: center; }
.contact, .rc-cta { background-color: #0b1f5c; background-image: url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb/2wBDAA4KCw0LCQ4NDA0QDw4RFiQXFhQUFiwgIRokNC43NjMuMjI6QVNGOj1OPjIySGJJTlZYXV5dOEVmbWVabFNbXVn/2wBDAQ8QEBYTFioXFypZOzI7WVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVn/wAARCAASABgDASIAAhEBAxEB/8QAGAABAQEBAQAAAAAAAAAAAAAAAAQFBgL/xAAqEAABAwQAAwcFAAAAAAAAAAABAAIDBBESIRMxQQUUIjJRUmFxkZKhsf/EABgBAAIDAAAAAAAAAAAAAAAAAAECAAME/8QAGBEBAQEBAQAAAAAAAAAAAAAAAAEDMTL/2gAMAwEAAhEDEQA/ANuCKFzconMmZ7ojmP0qe7ANuGH8Sufikjp5gWxU9NGyxZaLI7Pre3K6upqyq4RvMH5bDgNi/wAHQ6dEArSbSsLhnrmcQLn7Ipndr8IAPZky9iQLkXKKSwtlc23xPGW9jmr4NRi2toiYXh/nP0P8REWbT0vz4//Z"); background-size: cover; background-position: center; }
.about .split__img { background: #dfe6f3 url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb/2wBDAA4KCw0LCQ4NDA0QDw4RFiQXFhQUFiwgIRokNC43NjMuMjI6QVNGOj1OPjIySGJJTlZYXV5dOEVmbWVabFNbXVn/2wBDAQ8QEBYTFioXFypZOzI7WVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVn/wAARCAAQABgDASIAAhEBAxEB/8QAFgABAQEAAAAAAAAAAAAAAAAABgAE/8QAJxAAAgEDBAECBwAAAAAAAAAAAQIDAAQRBRIhMQYHEyIyQWFxsfD/xAAWAQEBAQAAAAAAAAAAAAAAAAABAAL/xAAWEQEBAQAAAAAAAAAAAAAAAAAAAWH/2gAMAwEAAhEDEQA/AFNwFgaO4lVjEisxCjJOOeq2JfxvaLOyNGCm7a3Y+1CPL9X3z6fbwTlUx7nA+c78Yz9OM1r8mnurHS9Sl24R5lSFwx4BGG/HVZ2Ajt2j1O3E0cknss3wgjHR5BB/uaqL+nd/cXcF7b3EzPHEUZNx5BbOf1VSq//Z") center / cover no-repeat; }
.recruit .split__img { background: #dfe6f3 url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gHYSUNDX1BST0ZJTEUAAQEAAAHIAAAAAAQwAABtbnRyUkdCIFhZWiAH4AABAAEAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAACRyWFlaAAABFAAAABRnWFlaAAABKAAAABRiWFlaAAABPAAAABR3dHB0AAABUAAAABRyVFJDAAABZAAAAChnVFJDAAABZAAAAChiVFJDAAABZAAAAChjcHJ0AAABjAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAAgAAAAcAHMAUgBHAEJYWVogAAAAAAAAb6IAADj1AAADkFhZWiAAAAAAAABimQAAt4UAABjaWFlaIAAAAAAAACSgAAAPhAAAts9YWVogAAAAAAAA9tYAAQAAAADTLXBhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb/2wBDAA4KCw0LCQ4NDA0QDw4RFiQXFhQUFiwgIRokNC43NjMuMjI6QVNGOj1OPjIySGJJTlZYXV5dOEVmbWVabFNbXVn/2wBDAQ8QEBYTFioXFypZOzI7WVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVlZWVn/wAARCAAQABgDASIAAhEBAxEB/8QAGAAAAwEBAAAAAAAAAAAAAAAAAAQGBQf/xAAlEAACAQMDAwUBAAAAAAAAAAABAgMABBESIUEGMXEFIiNCUdH/xAAVAQEBAAAAAAAAAAAAAAAAAAACAf/EABcRAQEBAQAAAAAAAAAAAAAAAAABAjH/2gAMAwEAAhEDEQA/ALdJABnNLTXcVxeG3TJeEjUeN+KxZ+obSMDQzv4U7ec4qT6Yv5Lrq4MJ8IzOfd9geP5Q6TpqeoRxgowlUa9BbQcZ2HfyaKYniEqLGpYSr8ibHTkfp7c9qKluoFf/2Q==") center / cover no-repeat; }
.rc-msg__photo, .rc-mani__photos figure, .ab-photo figure, .card__img { background-color: #e8edf5; }
/* 遅延読込プレースホルダの高さを先に確保（読込後のガクつき防止） */
.cs-mv .cs-photo img[src^="data:"] { aspect-ratio: 16 / 9; width: 100%; height: auto; object-fit: cover; }
.card__img img[src^="data:"] { aspect-ratio: 16 / 10; }

/* PC では SP 用サービスカードを出さない（≤1023px で display:block に切替） */
.svc-m { display: none; }

/* ---- 2. タッチ端末: 出現アニメを止めて最初から完成形で出す ---- */
@media (hover: none), (max-width: 1023px) {
  .rv { opacity: 1 !important; transform: none !important; transition: none !important; }
  .ph__en, .ph__ja, .ph__badges, .ph__cat, .ph__ttl--ar,
  .rc-hero__kicker, .rc-hero__ttl, .rc-hero__lead, .rc-kw, .rc-hero__cta,
  .hero__lead, .navi__out { animation: none !important; }
  .hero__ttl .ch { opacity: 1 !important; transform: none !important; animation: none !important; }
}

/* ---- 3. レイアウト圧縮 (≤1023px) ---- */
@media (max-width: 1023px) {
  :root { --side: 18px; }
  /* header: ロゴをきっちり左に */
  .header__in { padding: 0 12px 0 16px; }
  .header__logo { gap: 9px; }
  .header__logo img { height: 28px; }
  .header__word { font-size: 13px; letter-spacing: .14em; }
  /* 共通 */
  .sec { padding: 56px 0; }
  .sec__head { gap: 12px; margin-bottom: 20px; }
  .sec__lead { font-size: 12.5px; line-height: 1.8; }
  .sec__foot { margin-top: 26px; }
  .ttl__en { font-size: 32px; }
  .ttl__en::before { width: 26px; height: 3px; margin-bottom: 10px; }
  .ttl__ja { font-size: 12.5px; margin-top: 8px; }
  .pill { height: 50px; font-size: 12px; }
  .pill--lg { height: 54px; font-size: 13px; }
  .more { gap: 10px; font-size: 14px; }
  .more__c { width: 34px; height: 34px; }
  /* hero(top) */
  .hero { height: 108vw; min-height: 400px; max-height: 560px; }
  .hero__lead { margin-top: 10px; font-size: 11.5px; letter-spacing: .1em; }
  .clients { padding: 26px 0 22px; }
  .clients__head { margin-bottom: 12px; }
  .logo { height: 44px; padding: 0 14px; border-radius: 10px; }
  .logo img { max-height: 20px; max-width: 88px; }
  /* works(top): 3件だけ・タブ非表示・カード圧縮 */
  .works { padding: 56px 0; }
  .works:not(.wk) .tabs { display: none; }
  .works:not(.wk) .works__list > li:nth-child(n+4) { display: none; }
  .works__list { gap: 14px; }
  .card { padding: 8px 8px 12px; border-radius: 16px; }
  .card__img { aspect-ratio: 16 / 9; border-radius: 12px; }
  .card__body { padding: 10px 6px 0; }
  .card__cat { margin-bottom: 6px; font-size: 11px; }
  .card__ttl { font-size: 14px; line-height: 1.55; -webkit-line-clamp: 2; }
  .card__foot { padding-top: 10px; }
  .card .more__t { font-size: 12px; }
  .card .more__c { width: 30px; height: 30px; }
  /* service(top): PC用のホバー切替UIは隠し、スワイプ型カードに */
  .service__in { display: none; }
  .svc-m { display: block; position: relative; z-index: 1; padding: 52px 0 40px; }
  .svc-m__head { padding: 0 var(--side); }
  .svc-m__lead { margin-top: 12px; font-size: 12.5px; line-height: 1.8; color: rgba(255, 255, 255, .85); }
  .svc-m__track { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 18px var(--side) 6px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .svc-m__track::-webkit-scrollbar { display: none; }
  .svc-m__card { --dot: var(--c1); flex: 0 0 80vw; max-width: 340px; scroll-snap-align: start; display: flex; flex-direction: column; border-radius: 18px; background: #fff; color: var(--ink); box-shadow: 0 2px 4px rgba(15, 23, 42, .06), 0 24px 50px -30px rgba(0, 0, 0, .55); overflow: hidden; }
  .svc-m__vis { position: relative; aspect-ratio: 5 / 4; overflow: hidden; background: #0b1f5c; }
  .svc-m__vis .vis { position: absolute; inset: 0; }
  .svc-m__vis .vis__in { inset: auto; left: 0; top: 0; width: 200%; height: 200%; transform: scale(.5); transform-origin: 0 0; }
  .svc-m__vis .vis__chips { display: none; }
  .svc-m__body { display: flex; flex-direction: column; flex: 1; padding: 14px 16px 16px; }
  .svc-m__no { display: flex; align-items: center; gap: 8px; font-family: var(--fs-en); font-size: 10.5px; font-weight: 700; letter-spacing: .18em; color: var(--dot); }
  .svc-m__no::before { content: ""; width: 18px; height: 2px; border-radius: 1px; background: var(--dot); }
  .svc-m__name { margin-top: 8px; font-size: 17px; font-weight: 700; line-height: 1.4; }
  .svc-m__desc { margin: 8px 0 0; font-size: 12.5px; line-height: 1.75; color: #333; }
  .svc-m__more { display: flex; justify-content: flex-end; margin-top: auto; padding-top: 12px; }
  .svc-m__more .more__t { font-family: var(--fs-jp); font-size: 12px; }
  .svc-m__more .more__c { width: 30px; height: 30px; }
  .svc-m__dots { display: flex; justify-content: center; gap: 10px; margin-top: 12px; }
  .svc-m__dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 2px; background: rgba(255, 255, 255, .35); transform: rotate(45deg) scale(.8); transition: transform .25s, background .25s; }
  .svc-m__dot.is-active { background: #fff; transform: rotate(45deg) scale(1.1); box-shadow: 0 0 0 3px rgba(255, 255, 255, .2); }
  /* navigator */
  .navi { padding: 56px 0; }
  .navi__box { gap: 12px; }
  .navi__step { padding: 14px 14px 16px; border-radius: 16px; }
  .navi__step-h { font-size: 13.5px; }
  .navi__opts { gap: 6px; margin-top: 10px; }
  .navi__opt { padding: 7px 11px 7px 10px; font-size: 12px; }
  .navi__res { min-height: 0; padding: 18px 16px; border-radius: 16px; }
  .navi__empty { position: static; padding: 8px 0 4px; font-size: 12.5px; }
  .navi__orb { width: 64px; height: 64px; margin-bottom: 12px; }
  /* message */
  .message { padding: 56px 0 50px; }
  .message__statement { margin-top: 18px; font-size: clamp(20px, 5.6vw, 26px); line-height: 1.45; }
  .message__cols { margin-top: 16px; gap: 10px; }
  .message__cols p { font-size: 12.5px; line-height: 1.8; }
  .message__in .more-link { margin-top: 18px; }
  /* about(top) */
  .about { padding: 56px 0 40px; }
  .split__img { aspect-ratio: 16 / 10; }
  .split__panel, .split--rev .split__panel { margin: -22px 0 0; padding: 22px 20px 26px; }
  .panel__text { margin-top: 14px; font-size: 12.5px; line-height: 1.75; }
  .facts { margin-top: 16px; }
  .facts div { gap: 10px; padding: 8px 0; font-size: 11.5px; }
  .panel .more-link { margin-top: 16px; }
  .nums { margin-top: 30px; }
  .nums__item { padding: 18px 12px 16px; }
  .nums__item::before { left: 12px; width: 24px; }
  .nums__v { font-size: 28px; }
  .nums__v small { font-size: 11px; }
  .nums__l { margin-top: 6px; font-size: 10.5px; line-height: 1.5; }
  /* gallery / news / recruit(top) / contact帯 */
  .gallery { padding: 46px 0 6px; }
  .gallery__head { margin-bottom: 14px; }
  .gallery__item { width: 176px; }
  .gallery__set { gap: 8px; padding-right: 8px; }
  .gallery__row + .gallery__row { margin-top: 8px; }
  .news { padding: 52px 0; }
  .news__grid { gap: 10px; }
  .news__all { margin-top: 8px; }
  .news__list a { gap: 10px; padding: 12px 2px; }
  .news__cat { flex-basis: 40px; font-size: 11px; }
  .news__t { font-size: 13px; }
  .news__list li:nth-child(n+4) { display: none; }
  .recruit { padding: 24px 0 52px; }
  .values { gap: 6px; margin-top: 12px; }
  .values li { font-size: 11px; padding: 5px 9px; }
  .contact { padding: 48px 0; }
  .contact__text { margin-top: 16px; font-size: 12.5px; line-height: 1.8; letter-spacing: .04em; }
  .contact .pill { margin-top: 20px; }
  /* footer */
  .footer { padding: 40px 0 22px; }
  .footer__top { gap: 26px; }
  .footer__logo img { height: 30px; }
  .footer__word { font-size: 15px; }
  .footer__tag-en { margin-top: 16px; font-size: 10px; }
  .footer__tag-ja { font-size: 20px; }
  .footer__addr { margin-top: 12px; font-size: 11px; line-height: 1.7; }
  .footer__map { gap: 18px 14px; }
  .footer__h { padding-bottom: 8px; font-size: 12.5px; }
  .footer__sub { margin-top: 10px; }
  .footer__sub li + li { margin-top: 6px; }
  .footer__sub a { font-size: 12.5px; }
  .footer__follow { margin-top: 10px; }
  .footer__follow a { width: 38px; height: 38px; }
  .footer__cta { margin-top: 14px; padding: 10px 18px; font-size: 12.5px; }
  .footer__bottom { margin-top: 26px; padding-top: 14px; gap: 6px; }

  /* ---- 下層共通ヒーロー (.ph) ---- */
  .ph { height: 50vw; min-height: 200px; max-height: 280px; }
  .ph--sm { min-height: 190px; }
  .ph__in { padding-bottom: 18px; }
  .ph__crumb { font-size: 10px; }
  .ph__en { font-size: clamp(30px, 8.6vw, 40px); }
  .ph__en::before { width: 26px; height: 3px; margin-bottom: 10px; }
  .ph__ja { margin-top: 6px; font-size: 12.5px; }
  .ph__wm { display: none; }
  .ph__badges { margin-top: 10px; }
  /* about page */
  .ab-lead { padding: 40px 0 32px; }
  .ab-lead__ttl { font-size: clamp(21px, 5.8vw, 27px); line-height: 1.45; }
  .ab-lead__cols { margin-top: 14px; gap: 10px; }
  .ab-lead__cols p { font-size: 13px; line-height: 1.8; }
  .ab-photo { margin-top: -8px; }
  .ab-photo figure { aspect-ratio: 16 / 10; border-radius: 14px; }
  .ab-mvv { padding: 40px 0 16px; }
  .ab-mvv__grid { gap: 10px; margin-top: 16px; }
  .mvv { padding: 16px 16px 18px; border-radius: 16px; }
  .mvv__t { font-size: 16px; }
  .ab-profile { padding: 24px 0 48px; }
  .ab-profile__grid { gap: 20px; margin-top: 16px; }
  .profile div { grid-template-columns: 80px 1fr; gap: 10px; padding: 9px 2px; font-size: 12.5px; }
  .access__body { padding: 16px 16px 18px; }
  /* 実績一覧 / 関連実績 / サービス内実績: 2列のコンパクトカード */
  .wk { padding: 32px 0 52px; }
  .wk .tabs { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; margin: 0 calc(var(--side) * -1) 14px; padding: 2px var(--side) 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .wk .tabs::-webkit-scrollbar { display: none; }
  .wk .tabs__btn { flex: none; white-space: nowrap; }
  .tabs__btn { padding: 7px 11px 7px 10px; font-size: 11.5px; }
  .wk .works__list, .ar__rel .works__list, .sv-works .works__list, .cs-related .works__list, .cs-main .works__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .wk .card, .ar__rel .card, .sv-works .card, .cs-related .card, .cs-main .card { padding: 6px 6px 10px; border-radius: 12px; }
  .wk .card__img, .ar__rel .card__img, .sv-works .card__img, .cs-related .card__img, .cs-main .card__img { aspect-ratio: 4 / 3; border-radius: 9px; }
  .wk .card__body, .ar__rel .card__body, .sv-works .card__body, .cs-related .card__body, .cs-main .card__body { padding: 8px 2px 0; }
  .wk .card__cat, .ar__rel .card__cat, .sv-works .card__cat, .cs-related .card__cat, .cs-main .card__cat { gap: 6px; margin-bottom: 4px; font-size: 10px; }
  .wk .card__cat::before, .ar__rel .card__cat::before, .sv-works .card__cat::before, .cs-related .card__cat::before, .cs-main .card__cat::before { width: 12px; }
  .wk .card__ttl, .ar__rel .card__ttl, .sv-works .card__ttl, .cs-related .card__ttl, .cs-main .card__ttl { font-size: 12px; line-height: 1.5; -webkit-line-clamp: 3; }
  .wk .card__foot, .ar__rel .card__foot, .sv-works .card__foot, .cs-related .card__foot, .cs-main .card__foot { display: none; }
  .wk__more { margin-top: 24px; }
  .nl { padding: 32px 0 52px; }
  .nl__list a { gap: 10px; padding: 12px 2px; }
  .nl__t { font-size: 13.5px; }
  /* contact page */
  .ct-body { padding: 28px 0 44px; }
  .ct-intro { margin-bottom: 14px; }
  .ct-intro__ttl { margin-top: 10px; font-size: clamp(19px, 5.2vw, 24px); }
  .ct-intro__txt { font-size: 13px; }
  /* 記事(news等) */
  .ph--ar .ph__in { padding: 84px var(--side) 22px; }
  .ph__ttl--ar { margin-top: 10px; font-size: clamp(18px, 5vw, 24px); }
  .ar { padding: 26px 0 44px; }
  .ar__body { font-size: 14.5px; line-height: 1.9; }
  .ar__body h2 { margin: 34px 0 12px; font-size: 18px; }
  .ar__body h3 { margin: 26px 0 10px; font-size: 16px; }
  .ar__foot { margin-top: 32px; padding-top: 18px; }
  .ar__rel { padding: 40px 0 48px; }
  .ar__rel .works__list { margin-top: 20px; }
  /* サービス詳細 (service-v2) */
  .sv-hero { padding: 26px 0 32px; }
  .sv-hero__in { gap: 18px; }
  .sv-hero__eyebrow { margin-top: 10px; font-size: 10.5px; }
  .sv-hero__ttl { margin-top: 10px; font-size: clamp(24px, 6.8vw, 32px); }
  .sv-hero__ttl small { margin-top: 6px; font-size: 11.5px; }
  .sv-hero__lead { margin-top: 12px; font-size: 13.5px; line-height: 1.85; }
  .sv-hero .sv-chips { display: none; }
  .sv-hero__cta { margin-top: 18px; gap: 8px; flex-wrap: nowrap; }
  .sv-hero__cta .pill { flex: 1 1 0; width: auto; max-width: none; height: 48px; padding: 0 10px; font-size: 12.5px; }
  .sv-hero__vis .svc-visual { height: auto; aspect-ratio: 5 / 4; max-height: 300px; border-radius: 14px; }
  .sv-hero__vis .vis__in { inset: auto; left: 0; top: 0; width: 200%; height: 200%; transform: scale(.5); transform-origin: 0 0; }
  .sv-hero__vis .vis__chips, .sv-hero__vis .svc-visual__cap, .sv-hero__vis .svc-visual__dots { display: none; }
  .sv-sec { padding: 44px 0; }
  .sv-head { gap: 8px; margin-bottom: 16px; }
  .sv-head__en { font-size: 10.5px; }
  .sv-head__ttl { font-size: clamp(20px, 5.6vw, 26px); }
  .sv-head__lead { font-size: 13px; line-height: 1.8; }
  .sv-issues { gap: 8px; }
  .sv-issues li { gap: 8px; padding: 10px 12px; border-radius: 10px; font-size: 13px; }
  .sv-issues li::before { width: 20px; height: 20px; font-size: 11px; }
  .sv-issues__note { margin-top: 16px; font-size: 14.5px; }
  .sv-grid3 { gap: 10px; }
  .sv-card { padding: 16px; border-radius: 16px; }
  .sv-card__no { font-size: 10.5px; }
  .sv-card__t { margin-top: 6px; font-size: 15.5px; }
  .sv-card__d { margin-top: 6px; font-size: 12.5px; line-height: 1.75; }
  .sv-why { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .sv-why__i { flex-direction: column; gap: 6px; padding: 14px 12px 12px; border-radius: 14px; }
  .sv-why__no { font-size: 18px; }
  .sv-why__t { font-size: 13.5px; }
  .sv-why__d { font-size: 11.5px; line-height: 1.65; }
  .sv-chips { gap: 6px; }
  .sv-chips span { padding: 6px 10px; font-size: 12px; }
  .sv-plans { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; margin: 0 calc(var(--side) * -1); padding: 14px var(--side) 14px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .sv-plans::-webkit-scrollbar { display: none; }
  .sv-plan { flex: 0 0 76%; max-width: 320px; scroll-snap-align: start; padding: 18px 16px 16px; }
  .sv-plan__price { font-size: 20px; }
  .sv-plan dl { margin-top: 12px; }
  .sv-plan dl div { padding: 7px 0; font-size: 12px; }
  .sv-opts { gap: 10px; }
  .sv-opts__box { padding: 14px 14px 12px; }
  .sv-opts__box td { padding: 8px 4px; font-size: 12px; }
  .sv-flow { gap: 8px; }
  .sv-flow li { padding: 14px 12px 12px; }
  .sv-flow b { font-size: 13.5px; }
  .sv-flow p { font-size: 11.5px; line-height: 1.6; }
  .sv-faq summary { padding: 12px 0; font-size: 13.5px; }
  .sv-faq .a { font-size: 13px; line-height: 1.8; }
  /* ---- 採用 ---- */
  .rc-hero__in { padding: 72px 0 26px; }
  .rc-hero__wm { top: 66px; right: -2vw; font-size: 20vw; opacity: .7; }
  .rc-hero__kicker { margin-top: 0; font-size: 10.5px; }
  .rc-hero__ttl { margin-top: 12px; font-size: clamp(24px, 6.6vw, 30px); line-height: 1.3; }
  .rc-hero__lead { margin-top: 12px; font-size: 13px; line-height: 1.75; }
  .rc-kw { margin-top: 14px; gap: 6px; }
  .rc-kw li, .rc-kw li:first-child { padding: 0 0 0 10px; font-size: 12px; line-height: 1.45; }
  .rc-hero__cta { margin-top: 18px; gap: 8px; flex-wrap: nowrap; }
  .rc-hero__cta .pill { flex: 1 1 0; width: auto; max-width: none; height: 48px; padding: 0 10px; font-size: 12.5px; }
  .rc-jhero .sv-hero__cta .pill { padding: 0 6px; font-size: 11.5px; letter-spacing: .02em; white-space: nowrap; }
  .rc-mani { padding: 44px 0 40px; }
  .rc-mani__ttl { margin-top: 10px; font-size: clamp(24px, 6.4vw, 30px); }
  .rc-mani__lines { margin-top: 16px; gap: 6px; }
  .rc-mani__lines p { font-size: clamp(14px, 4vw, 17px); line-height: 1.55; }
  .rc-mani__photos { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 22px; }
  .rc-mani__photos figure, .rc-mani__photos figure:nth-child(2) { margin: 0; aspect-ratio: 1 / 1; border-radius: 10px; }
  .rc-mani__photos figure:nth-child(3) { grid-column: auto; }
  .rc-msg { padding: 44px 0; }
  .rc-msg__in { gap: 16px; }
  .rc-msg__ttl { margin-top: 10px; font-size: clamp(20px, 5.4vw, 24px); line-height: 1.45; }
  .rc-msg__photo { margin-top: 14px; aspect-ratio: 16 / 9; border-radius: 14px; }
  .rc-msg__body p { margin-bottom: 1.2em; font-size: 14px; line-height: 1.9; }
  .rc-msg__body p:first-child { font-size: 15px; }
  .rc-msg__close { padding: 16px; font-size: 13.5px; border-radius: 14px; }
  .rc-mvv { padding: 48px 0; }
  .rc-mvv__h { margin-top: 10px; font-size: clamp(20px, 5.4vw, 26px); }
  .rc-mvv__grid { gap: 10px; margin-top: 18px; }
  .rc-mvv__card { padding: 18px; border-radius: 16px; }
  .rc-mvv__big { margin-top: 10px; font-size: clamp(18px, 4.8vw, 22px); }
  .rc-mvv__note { margin-top: 8px; font-size: 12.5px; }
  .rc-mvv__vlabel { margin-top: 26px; }
  .rc-values { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
  .rc-values li { padding: 14px 14px 12px; border-radius: 12px; }
  .rc-values__no { font-size: 18px; }
  .rc-values b { margin-top: 6px; font-size: 13.5px; line-height: 1.4; }
  .rc-values p { margin-top: 4px; font-size: 11.5px; line-height: 1.6; }
  .rc-daily, .rc-hard, .rc-salary, .rc-benefits, .rc-jobs, .rc-flow, .rc-mind, .rc-voice { padding: 44px 0; }
  .rc-daily__in, .rc-salary__in, .rc-flow__in, .rc-hard__in { gap: 18px; }
  .rc-daily .sv-head__ttl, .rc-salary .sv-head__ttl, .rc-flow .sv-head__ttl { margin-top: 10px; font-size: clamp(20px, 5.4vw, 24px); }
  .rc-steps { gap: 8px; margin-top: 14px; }
  .rc-steps li { gap: 10px; padding: 12px; border-radius: 12px; }
  .rc-steps__no { width: 28px; height: 28px; font-size: 12px; }
  .rc-steps b { font-size: 14px; }
  .rc-steps p { font-size: 12.5px; line-height: 1.6; }
  .rc-daily .sv-chips { margin-top: 16px; }
  .rc-mind__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rc-mind__card { padding: 14px; border-radius: 14px; }
  .rc-mind__card h3 { margin-top: 6px; font-size: 14px; }
  .rc-mind__card p { margin-top: 6px; font-size: 11.5px; line-height: 1.65; }
  .rc-mind__card--photo img { min-height: 0; }
  .rc-hard__ttl { margin-top: 10px; font-size: clamp(22px, 6vw, 28px); }
  .rc-hard__text { margin-top: 12px; font-size: 13.5px; line-height: 1.85; }
  .rc-hard__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rc-hard__card { padding: 14px; border-radius: 14px; }
  .rc-hard__no { font-size: 18px; }
  .rc-hard__card h3 { margin-top: 8px; font-size: 14px; }
  .rc-hard__card p { margin-top: 6px; font-size: 11.5px; line-height: 1.65; }
  .rc-voice__grid { gap: 10px; }
  .rc-voice__card { padding: 18px 18px 16px; border-radius: 16px; }
  .rc-voice__q { font-size: 70px; right: 16px; }
  .rc-voice__head { font-size: 15px; }
  .rc-voice__body { margin-top: 10px; font-size: 13px; line-height: 1.85; }
  .rc-voice__who { margin-top: 12px; font-size: 12px; }
  .rc-facts { gap: 8px; margin-top: 14px; }
  .rc-facts div { padding: 10px 12px; border-radius: 10px; }
  .rc-facts dd { font-size: 13.5px; }
  .rc-salary__ex { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rc-ex { padding: 16px 14px 14px; border-radius: 16px; }
  .rc-ex--hero { padding: 20px 18px 18px; }
  .rc-ex__v { font-size: 30px; }
  .rc-ex--hero .rc-ex__v { font-size: 44px; }
  .rc-benefits__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rc-benefit { padding: 12px; border-radius: 12px; }
  .rc-benefit h3 { gap: 6px; font-size: 13px; }
  .rc-benefit h3::before { width: 12px; }
  .rc-benefit p { margin-top: 5px; font-size: 11.5px; line-height: 1.6; }
  .rc-jobs__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rc-jobs--page .rc-jobs__grid { margin-top: 18px; }
  .rc-jobs--page { padding: 32px 0 56px; }
  .rc-job { padding: 16px 14px 14px; border-radius: 14px; }
  .rc-job__en { display: block; font-size: 9.5px; letter-spacing: .14em; line-height: 1.3; }
  .rc-job__en::before { display: block; margin-bottom: 6px; }
  .rc-job__name { margin-top: 8px; font-size: 15px; }
  .rc-job__catch { margin-top: 6px; font-size: 12px; line-height: 1.6; }
  .rc-job__more { padding-top: 12px; }
  .rc-job .more__t { font-size: 11.5px; }
  .rc-job .more__c { width: 30px; height: 30px; }
  .rc-cond div { gap: 2px; padding: 10px 2px; }
  .rc-cond dt { font-size: 12.5px; }
  .rc-cond dd { font-size: 13px; line-height: 1.7; }
  .rc-flow { padding: 44px 0 50px; }
  .rc-cta { padding: 56px 0; }
  .rc-cta__ttl { margin-top: 10px; font-size: clamp(22px, 6vw, 28px); }
  .rc-cta__text { margin: 12px auto 20px; font-size: 13.5px; line-height: 1.8; }
  .rc-jhero { padding: 32px 0 36px; }
  .rc-jhero__ttl { font-size: clamp(26px, 7vw, 34px); }
  .rc-jhero__catch { margin-top: 10px; font-size: 14px; }
  .rc-jbody { padding: 36px 0 50px; }
  .rc-jbody__in { gap: 24px; }
  .rc-jbody .sv-head__ttl { margin: 8px 0 12px; font-size: clamp(19px, 5.2vw, 24px); }
  .rc-jbody__lead { font-size: 14px; line-height: 1.85; }
  .rc-list { gap: 6px; margin-top: 14px; }
  .rc-list li { padding: 9px 12px 9px 30px; font-size: 13.5px; line-height: 1.6; }
  .rc-list li::before { left: 12px; top: 17px; }
  .rc-jbody__note { margin-top: 12px; padding: 12px 14px; font-size: 13px; }
  .rc-side { padding: 18px 16px 16px; }
  .rc-side__t { margin: 8px 0 12px; font-size: 16px; }
  .rc-entry { padding: 24px 0 50px; }
  .rc-form { padding: 20px 14px 22px; }
  .rc-form__intro { margin-bottom: 16px; font-size: 12.5px; }
  .rc-form tr { gap: 6px; padding: 12px 0; }
  .rc-form input[type="text"], .rc-form input[type="email"], .rc-form input[type="tel"], .rc-form input[type="number"], .rc-form textarea { padding: 11px 12px; }
  .rc-form textarea { min-height: 120px; }
  .rc-form .button-container { margin-top: 20px; }
  /* ---- 実績記事 (topics-case) ※ topics-case-v2.css は後読みなので .cs-main で強める ---- */
  .cs-main .cs-hero { padding: 32px 16px 120px; }
  .cs-main .cs-title { font-size: clamp(22px, 6vw, 28px); }
  .cs-main .cs-mv { margin-top: -90px; }
  .cs-main .cs-kpis { margin-top: 14px; }
  .cs-main .cs-kpi { padding: 14px 12px 12px; border-radius: 14px; }
  .cs-main .cs-kpi-v { font-size: 22px; }
  .cs-main .cs-kpi-l { margin-top: 6px; font-size: 11px; }
  .cs-main .cs-article { margin-top: 32px; }
  .cs-main .cs-lead { font-size: 14.5px; line-height: 1.9; }
  .cs-main .cs-spec { margin-top: 18px; gap: 6px; }
  .cs-main .cs-spec-i { padding: 10px 12px; }
  .cs-main .cs-sec { margin-top: 32px; }
  .cs-main .cs-sec h2 { margin-bottom: 14px; padding-bottom: 10px; font-size: 19px; }
  .cs-main .cs-sec h3 { margin: 22px 0 8px; font-size: 16px; }
  .cs-main .cs-sec p { font-size: 14.5px; line-height: 1.9; }
  .cs-main .cs-clientbox { margin-top: 22px; padding: 16px 16px 14px 18px; }
  .cs-main .cs-points { gap: 8px; }
  .cs-main .cs-point { padding: 14px 14px 12px; border-radius: 14px; }
  .cs-main .cs-aboutband { margin-top: 40px; padding: 40px 16px; }
  .cs-main .cs-company-i { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 0; font-size: 13px; }
  .cs-main .cs-company-t { width: auto; min-width: 0; flex: none; padding: 8px 12px 2px; background: transparent; font-size: 11px; }
  .cs-main .cs-company-d { width: 100%; padding: 0 12px 9px; font-size: 13px; line-height: 1.7; }
  .cs-main .cs-num { white-space: nowrap; }
}
@media (max-width: 599px) {
  /* recruit-v3.css / pages.css の ≤599 で1列に戻る指定を上書きし、2列を維持 */
  .rc-mind__grid, .rc-benefits__grid, .rc-salary__ex { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sv-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}