:root {
  --qa-vermilion-700: #B62A17;
  --qa-vermilion-600: #C9331F;
  --qa-vermilion-500: #E8412B; 
  --qa-vermilion-400: #F26A56;
  --qa-vermilion-300: #F58C7B;
  --qa-vermilion-100: #FBE0DA;
  --qa-vermilion-050: #FDF1EE;
  --qa-navy-900: #0E2A52;
  --qa-navy-800: #123B76;
  --qa-navy-700: #17427A; 
  --qa-navy-600: #1E56A0;
  --qa-navy-500: #2E6BC0;
  --qa-navy-100: #DCE8F7;
  --qa-navy-050: #EEF4FC;
  --qa-ink-900: #12243D;
  --qa-ink-800: #1B3357;
  --qa-ink-700: #2C4260;
  --qa-ink-600: #47586E;
  --qa-cyan:    #17A2C8;
  --qa-magenta: #D6338C;
  --qa-yellow:  #F4B31E;
  --qa-neutral-000: #FFFFFF;
  --qa-neutral-050: #F4F7FB; 
  --qa-neutral-100: #EAF0F7;
  --qa-neutral-200: #DBE3EE;
  --qa-neutral-300: #C4D0DE;
  --qa-neutral-400: #94A3B5;
  --qa-neutral-500: #64748B;
  --qa-neutral-600: #47566B;
  --qa-neutral-700: #33415A;
  --qa-neutral-900: #1A2436;
  --qa-success: #2E9E5B;
  --qa-success-bg: #E6F4EC;
  --qa-warning: #E0871C;
  --qa-warning-bg: #FBEFDD;
  --qa-danger:  #D63A2F;
  --qa-danger-bg: #FBE6E4;
  --qa-info:    #17A2C8;
  --qa-info-bg: #E1F2F7;
  --color-primary: var(--qa-vermilion-500);        
  --color-primary-hover: var(--qa-vermilion-600);
  --color-primary-active: var(--qa-vermilion-700);
  --color-primary-soft: var(--qa-vermilion-050);
  --color-on-primary: #FFFFFF;
  --color-brand: var(--qa-navy-700);               
  --color-brand-strong: var(--qa-navy-900);
  --color-brand-soft: var(--qa-navy-050);
  --color-on-brand: #FFFFFF;
  --text-strong: var(--qa-ink-900);
  --text-body: var(--qa-ink-700);
  --text-muted: var(--qa-neutral-500);
  --text-on-dark: #EAF1FB;
  --text-link: var(--qa-navy-600);
  --text-link-hover: var(--qa-navy-800);
  --surface-page: var(--qa-neutral-050);
  --surface-card: var(--qa-neutral-000);
  --surface-sunken: var(--qa-neutral-100);
  --surface-ink: var(--qa-navy-900);   
  --border-subtle: var(--qa-neutral-200);
  --border-default: var(--qa-neutral-300);
  --border-strong: var(--qa-navy-800);
}


:root {
  --font-display: "Zen Kaku Gothic New", "Noto Sans JP", system-ui, sans-serif;
  --font-body: "Noto Sans JP", system-ui, sans-serif;
  --font-numeric: "Archivo", "Zen Kaku Gothic New", sans-serif; 
  --fw-regular: 400; 
  --fw-medium: 500; 
  --fw-bold: 700; 
  --fw-black: 900; 
  --fs-eyebrow: 0.75rem;   
  --fs-caption: 0.8125rem; 
  --fs-body-sm: 0.875rem;  
  --fs-body: 1rem;         
  --fs-body-lg: 1.125rem;  
  --fs-h5: 1.25rem;        
  --fs-h4: 1.5rem;         
  --fs-h3: 1.9375rem;      
  --fs-h2: 2.4375rem;      
  --fs-h1: 3.0625rem;      
  --fs-display: 4rem;      
  --lh-tight: 1.15; 
  --lh-heading: 1.3; 
  --lh-body: 1.75; 
  --lh-snug: 1.5; 
  --ls-tight: -0.01em;
  --ls-normal: 0.01em;
  --ls-wide: 0.08em;   
  --type-eyebrow-weight: var(--fw-bold);
  --type-heading-weight: var(--fw-black);
  --type-body-weight: var(--fw-regular);
}


:root {
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --gap-inline: var(--space-2);
  --gap-stack: var(--space-4);
  --pad-card: var(--space-6);
  --pad-section: var(--space-20);
  --container-max: 1200px;
  --container-narrow: 760px;
}


:root {
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 999px;
  --radius-card: var(--radius-lg);
  --radius-button: var(--radius-sm);
}


:root {
  --shadow-xs: 0 1px 2px rgba(33, 30, 25, 0.06);
  --shadow-sm: 0 2px 6px rgba(33, 30, 25, 0.08);
  --shadow-md: 0 6px 18px rgba(33, 30, 25, 0.10);
  --shadow-lg: 0 16px 40px rgba(33, 30, 25, 0.14);
  --shadow-primary: 0 8px 20px rgba(232, 65, 43, 0.28);
  --ring-focus: 0 0 0 3px rgba(232, 65, 43, 0.35);
  --border-hairline: 1px solid var(--border-subtle);
}


:root {
  --transition-fast: 120ms cubic-bezier(0.4, 0, 0.2, 1); 
  --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1); 
  --transition-emphasis: 320ms cubic-bezier(0.2, 0.7, 0.2, 1); 
}
body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--text-link); text-decoration: none; transition: color var(--transition-fast); }
a:hover { color: var(--text-link-hover); text-decoration: underline; text-underline-offset: 3px; }
h1, h2, h3, h4, h5 { font-family: var(--font-display); color: var(--text-strong); line-height: var(--lh-heading); font-weight: var(--fw-black); margin: 0; text-wrap: balance; }
p { text-wrap: pretty; }
::selection { background: var(--qa-vermilion-100); color: var(--qa-vermilion-700); }


:root {
  --qa-vermilion-700: #B62A17;
  --qa-vermilion-600: #C9331F;
  --qa-vermilion-500: #E8412B; 
  --qa-vermilion-400: #F26A56;
  --qa-vermilion-300: #F58C7B;
  --qa-vermilion-100: #FBE0DA;
  --qa-vermilion-050: #FDF1EE;
  --qa-navy-900: #0E2A52;
  --qa-navy-800: #123B76;
  --qa-navy-700: #17427A; 
  --qa-navy-600: #1E56A0;
  --qa-navy-500: #2E6BC0;
  --qa-navy-100: #DCE8F7;
  --qa-navy-050: #EEF4FC;
  --qa-ink-900: #12243D;
  --qa-ink-800: #1B3357;
  --qa-ink-700: #2C4260;
  --qa-ink-600: #47586E;
  --qa-cyan:    #17A2C8;
  --qa-magenta: #D6338C;
  --qa-yellow:  #F4B31E;
  --qa-neutral-000: #FFFFFF;
  --qa-neutral-050: #F4F7FB; 
  --qa-neutral-100: #EAF0F7;
  --qa-neutral-200: #DBE3EE;
  --qa-neutral-300: #C4D0DE;
  --qa-neutral-400: #94A3B5;
  --qa-neutral-500: #64748B;
  --qa-neutral-600: #47566B;
  --qa-neutral-700: #33415A;
  --qa-neutral-900: #1A2436;
  --qa-success: #2E9E5B;
  --qa-success-bg: #E6F4EC;
  --qa-warning: #E0871C;
  --qa-warning-bg: #FBEFDD;
  --qa-danger:  #D63A2F;
  --qa-danger-bg: #FBE6E4;
  --qa-info:    #17A2C8;
  --qa-info-bg: #E1F2F7;
  --color-primary: var(--qa-vermilion-500);        
  --color-primary-hover: var(--qa-vermilion-600);
  --color-primary-active: var(--qa-vermilion-700);
  --color-primary-soft: var(--qa-vermilion-050);
  --color-on-primary: #FFFFFF;
  --color-brand: var(--qa-navy-700);               
  --color-brand-strong: var(--qa-navy-900);
  --color-brand-soft: var(--qa-navy-050);
  --color-on-brand: #FFFFFF;
  --text-strong: var(--qa-ink-900);
  --text-body: var(--qa-ink-700);
  --text-muted: var(--qa-neutral-500);
  --text-on-dark: #EAF1FB;
  --text-link: var(--qa-navy-600);
  --text-link-hover: var(--qa-navy-800);
  --surface-page: var(--qa-neutral-050);
  --surface-card: var(--qa-neutral-000);
  --surface-sunken: var(--qa-neutral-100);
  --surface-ink: var(--qa-navy-900);   
  --border-subtle: var(--qa-neutral-200);
  --border-default: var(--qa-neutral-300);
  --border-strong: var(--qa-navy-800);
}
:root {
  --font-display: "Zen Kaku Gothic New", "Noto Sans JP", system-ui, sans-serif;
  --font-body: "Noto Sans JP", system-ui, sans-serif;
  --font-numeric: "Archivo", "Zen Kaku Gothic New", sans-serif; 
  --fw-regular: 400; 
  --fw-medium: 500; 
  --fw-bold: 700; 
  --fw-black: 900; 
  --fs-eyebrow: 0.75rem;   
  --fs-caption: 0.8125rem; 
  --fs-body-sm: 0.875rem;  
  --fs-body: 1rem;         
  --fs-body-lg: 1.125rem;  
  --fs-h5: 1.25rem;        
  --fs-h4: 1.5rem;         
  --fs-h3: 1.9375rem;      
  --fs-h2: 2.4375rem;      
  --fs-h1: 3.0625rem;      
  --fs-display: 4rem;      
  --lh-tight: 1.15; 
  --lh-heading: 1.3; 
  --lh-body: 1.75; 
  --lh-snug: 1.5; 
  --ls-tight: -0.01em;
  --ls-normal: 0.01em;
  --ls-wide: 0.08em;   
  --type-eyebrow-weight: var(--fw-bold);
  --type-heading-weight: var(--fw-black);
  --type-body-weight: var(--fw-regular);
}
:root {
  --space-0: 0;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --gap-inline: var(--space-2);
  --gap-stack: var(--space-4);
  --pad-card: var(--space-6);
  --pad-section: var(--space-20);
  --container-max: 1200px;
  --container-narrow: 760px;
}
:root {
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 999px;
  --radius-card: var(--radius-lg);
  --radius-button: var(--radius-sm);
}
:root {
  --shadow-xs: 0 1px 2px rgba(33, 30, 25, 0.06);
  --shadow-sm: 0 2px 6px rgba(33, 30, 25, 0.08);
  --shadow-md: 0 6px 18px rgba(33, 30, 25, 0.10);
  --shadow-lg: 0 16px 40px rgba(33, 30, 25, 0.14);
  --shadow-primary: 0 8px 20px rgba(232, 65, 43, 0.28);
  --ring-focus: 0 0 0 3px rgba(232, 65, 43, 0.35);
  --border-hairline: 1px solid var(--border-subtle);
}
:root {
  --transition-fast: 120ms cubic-bezier(0.4, 0, 0.2, 1); 
  --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1); 
  --transition-emphasis: 320ms cubic-bezier(0.2, 0.7, 0.2, 1); 
}
body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: var(--text-link); text-decoration: none; transition: color var(--transition-fast); }
a:hover { color: var(--text-link-hover); text-decoration: underline; text-underline-offset: 3px; }
h1, h2, h3, h4, h5 { font-family: var(--font-display); color: var(--text-strong); line-height: var(--lh-heading); font-weight: var(--fw-black); margin: 0; text-wrap: balance; }
p { text-wrap: pretty; }
::selection { background: var(--qa-vermilion-100); color: var(--qa-vermilion-700); }

/* 横に長い表をスマートフォンで見られるようにする（PC表示は変わりません） */
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:24px 0}
.table-scroll>table{margin:0;min-width:560px}