.codex-development__mobile-break,
.codex-development__mobile-attendance { display: none; }

@media (max-width: 767px) {
  .mirror-home-page .codex-reasons { padding: 14px var(--phone-edge) 28px; background: #fff; }
  .mirror-home-page .codex-reasons__window { overflow: visible; border: 0; border-radius: 0; box-shadow: none; }
  .mirror-home-page .codex-reasons__chrome { gap: 10px; min-height: 36px; padding: 0; border: 0; font-size: 18px; }
  .mirror-home-page .codex-reasons__chrome::before { display: grid; place-items: center; flex: none; width: 25px; height: 25px; border: 2px solid #101b40; border-radius: 5px; color: #101b40; content: "›_"; font-family: system-ui, sans-serif; font-size: 17px; font-weight: 800; line-height: 1; }
  .mirror-home-page .codex-reasons__dots { display: none; }
  .mirror-home-page .codex-reasons__chrome strong { font-size: 19px; font-weight: 800; }
  .mirror-home-page .codex-reasons__chrome > span:last-child { color: #31446d; font-size: 12px; }
  .mirror-home-page .codex-reasons__body { background: #fff; }
  .mirror-home-page .codex-reasons__view--development { padding: 15px 0 0; }
  .mirror-home-page .codex-development__eyebrow { display: none; }
  .mirror-home-page .codex-development__title { margin: 0; font-size: clamp(25px, 7.2vw, 31px); line-height: 1.25; letter-spacing: -.045em; }
  .mirror-home-page .codex-development__title > span { display: inline; }
  .mirror-home-page .codex-development__title > span:first-child { display: block; }
  .mirror-home-page .codex-development__lead { margin-top: 8px; color: #32496f; font-size: 15px; line-height: 1.5; }
  .mirror-home-page .codex-development__mobile-break { display: initial; }
  .mirror-home-page .codex-development__cases { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; margin-top: 14px; padding: 0; border: 0; }
  .mirror-home-page .codex-development__cases button { min-height: 43px; gap: 0; padding: 4px 2px; border-radius: 7px; font-size: clamp(10px, 3.3vw, 14px); white-space: nowrap; }
  .mirror-home-page .codex-development__cases svg { display: none; }
  .mirror-home-page .codex-development__case { gap: 14px; margin-top: 18px; }
  .mirror-home-page .codex-development__conversation { position: relative; padding: 0; }
  .mirror-home-page .codex-development__category, .mirror-home-page .codex-development__chat-label, .mirror-home-page .codex-development__assistant { display: none; }
  .mirror-home-page .codex-development__conversation > h3 { min-height: 48px; margin: 0 0 10px; padding-right: 75px; font-size: clamp(25px, 7vw, 29px); line-height: 1.3; }
  .mirror-home-page .codex-development__illustration { position: absolute; top: -6px; right: 2px; width: 70px; height: 56px; margin: 0; }
  .mirror-home-page :is(.codex-development__problem, .codex-development__response) { display: grid; grid-template-columns: 65px minmax(0, 1fr); align-items: center; gap: 10px; max-width: none; min-height: 58px; margin: 0 0 7px; padding: 10px 12px; border-radius: 12px; color: #142747; font-size: 14px; line-height: 1.5; }
  .mirror-home-page .codex-development__problem { background: #eef2f7; }
  .mirror-home-page .codex-development__response { margin-left: 0; background: #e2efff; }
  .mirror-home-page .codex-development__problem::after { display: none; }
  .mirror-home-page :is(.codex-development__problem, .codex-development__response)::before { position: static; display: flex; align-items: center; width: auto; height: 100%; padding-right: 9px; border-right: 1px solid #cad9ed; background: none; clip-path: none; color: #101b40; content: "相談"; font-size: 15px; font-weight: 800; }
  .mirror-home-page .codex-development__response::before { border-color: #9ebeff; color: var(--dev-blue); content: "Codex"; font-family: "Inter", sans-serif; }
  .mirror-home-page .codex-development__benefits { gap: 2px; margin: 8px 0 0 8px; }
  .mirror-home-page .codex-development__benefits li { align-items: center; gap: 10px; font-size: 14px; line-height: 1.5; }
  .mirror-home-page .codex-development__check { width: 23px; height: 23px; margin: 0; font-size: 17px; }
  .mirror-home-page .codex-development__progress { max-width: none; gap: 6px; margin-top: 10px; padding: 9px 4px; border-top: 1px solid #c7dcff; border-bottom: 1px solid #c7dcff; color: #31466e; font-size: clamp(11px, 3.2vw, 14px); }
  .mirror-home-page .codex-development__progress span { gap: 6px; }
  .mirror-home-page .codex-development__progress span::before { width: 23px; height: 23px; font-size: 16px; }
  .mirror-home-page .codex-development__progress i { min-width: 6px; }
  .mirror-home-page .codex-development__screen-head { align-items: stretch; gap: 5px; margin: 0 0 7px; }
  .mirror-home-page .codex-development__screen-head h4 { color: #101b40; font-size: 20px; font-weight: 800; }
  .mirror-home-page .codex-development__screen-tabs { min-width: 0; width: 100%; padding: 2px; border-color: #c8ddff; border-radius: 8px; }
  .mirror-home-page .codex-development__screen-tabs button { min-height: 34px; padding: 5px; font-size: 13px; }
  .mirror-home-page .codex-development__app-window { border-color: #c5dcff; border-radius: 9px; box-shadow: none; }
  .mirror-home-page .codex-development__app-window > .codex-development__app-chrome { display: none; }
  .mirror-home-page #dev-attendance-employee .codex-development__app-layout { display: none; }
  .mirror-home-page .codex-development__mobile-attendance { display: block; padding: 0 6px 6px; }
  .mirror-home-page .codex-development__mobile-toolbar { display: flex; align-items: center; gap: 8px; min-height: 38px; color: #101b40; }
  .mirror-home-page .codex-development__mobile-toolbar > svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .mirror-home-page .codex-development__mobile-toolbar strong { font-size: 18px; font-weight: 800; white-space: nowrap; }
  .mirror-home-page .codex-development__mobile-toolbar > span { display: flex; align-items: center; gap: 4px; min-height: 29px; margin-left: auto; padding: 3px 6px; border: 1px solid #87b6ff; border-radius: 6px; color: var(--dev-blue); font-size: 12px; font-weight: 700; white-space: nowrap; }
  .mirror-home-page .codex-development__mobile-toolbar span svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; }
  .mirror-home-page .codex-development__mobile-clock { padding: 6px 9px 8px; border: 1px solid #d1e2ff; border-radius: 8px 8px 0 0; color: #101b40; text-align: center; }
  .mirror-home-page .codex-development__mobile-clock p { font-size: 13px; line-height: 1.4; }
  .mirror-home-page .codex-development__mobile-clock > strong { display: block; margin-top: -2px; font-family: "Inter", sans-serif; font-size: clamp(38px, 10vw, 47px); font-weight: 800; line-height: 1.12; letter-spacing: -.05em; }
  .mirror-home-page .codex-development__mobile-clock small { display: block; font-size: 11px; line-height: 1.3; }
  .mirror-home-page .codex-development__mobile-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; margin-top: 5px; }
  .mirror-home-page .codex-development__mobile-actions span { display: grid; place-items: center; min-height: 35px; border-radius: 6px; background: var(--dev-blue); color: #fff; font-size: 17px; font-weight: 800; }
  .mirror-home-page .codex-development__mobile-actions span + span { background: #e0e8f3; color: #263e6b; }
  .mirror-home-page .codex-development__mobile-menu { overflow: hidden; border: 1px solid #d1e2ff; border-top: 0; border-radius: 0 0 8px 8px; }
  .mirror-home-page .codex-development__mobile-menu p { display: flex; align-items: center; gap: 10px; min-height: 31px; padding: 4px 9px; border-top: 1px solid #d1e2ff; color: #142747; font-size: 14px; font-weight: 700; }
  .mirror-home-page .codex-development__mobile-menu svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
  .mirror-home-page .codex-development__mobile-menu p span { margin-left: auto; font-family: system-ui, sans-serif; font-size: 19px; line-height: 1; }
  .mirror-home-page .codex-development__bottom { justify-content: center; margin-top: 5px; text-align: center; }
  .mirror-home-page .codex-development__bottom > p { font-size: 11px; }
  .mirror-home-page .codex-development__pager { display: none; }
}

@media (max-width: 359px) {
  .mirror-home-page .codex-development__title { font-size: 23px; }
  .mirror-home-page .codex-development__cases button { font-size: 10px; }
  .mirror-home-page .codex-development__conversation > h3 { font-size: 24px; }
  .mirror-home-page :is(.codex-development__problem, .codex-development__response) { grid-template-columns: 54px minmax(0, 1fr); gap: 7px; padding-inline: 8px; font-size: 12px; }
  .mirror-home-page .codex-development__mobile-toolbar strong { font-size: 16px; }
  .mirror-home-page .codex-development__mobile-toolbar > span { font-size: 10px; }
}