.mc-contact {

  --mc-primary: #184dc4;
  --mc-ink: #162d45;
  --mc-secondary: #53657b;
  --mc-background: #ffffff;
  --mc-surface: #f5f8fc;
  --mc-border: #d5dfe9;
  --mc-teal: #087f8c;
  --mc-danger: #ad302a;
  --mc-thumb: #7d90a7;
  --mc-track: #eef3fa;
  --mc-thumb-hover: #53657b;
  --mc-thumb-active: #162d45;
  --mc-font: "BIZ UDPGothic", "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --mc-display-font: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --mc-number-font: "Cascadia Code", Consolas, monospace;
}
.mc-contact {
  font: 400 16px/1.75 var(--mc-font);
  color: var(--mc-ink);
  background: var(--mc-background);
  max-width: 720px;
  margin-inline: auto;
  line-break: strict;
  word-break: normal;
  overflow-wrap: anywhere;
  color-scheme: light;
}
.mc-contact *, .mc-contact *::before, .mc-contact *::after { box-sizing: border-box; }
.mc-contact, .mc-contact * { scrollbar-width: auto; scrollbar-color: var(--mc-thumb) var(--mc-track); }
.mc-contact *::-webkit-scrollbar { width: 12px; height: 12px; }
.mc-contact *::-webkit-scrollbar-track { background: var(--mc-track); }
.mc-contact *::-webkit-scrollbar-thumb { background: var(--mc-thumb); border: 3px solid var(--mc-track); border-radius: 8px; }
.mc-contact *::-webkit-scrollbar-thumb:hover { background: var(--mc-thumb-hover); }
.mc-contact *::-webkit-scrollbar-thumb:active { background: var(--mc-thumb-active); }
.mc-contact p { margin: 0; }
.mc-contact a { color: var(--mc-primary); text-underline-offset: 4px; cursor: pointer; }
.mc-contact a:hover { text-decoration-thickness: 2px; }
.mc-contact :focus-visible { outline: 3px solid var(--mc-primary); outline-offset: 3px; }
.mc-contact-form { display: grid; gap: 24px; margin: 0; }
.mc-contact-intro { color: var(--mc-secondary); }
.mc-contact-field { display: grid; gap: 8px; min-width: 0; }
.mc-contact-field label { font-weight: 700; cursor: pointer; }
.mc-contact-required, .mc-contact-optional { font-size: 14px; margin-left: 8px; font-weight: 400; }
.mc-contact-required { color: var(--mc-primary); }
.mc-contact-optional, .mc-contact-help { color: var(--mc-secondary); }
.mc-contact input:not([type="hidden"]), .mc-contact textarea {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--mc-border);
  border-radius: 8px;
  color: var(--mc-ink);
  background: var(--mc-background);
  font: inherit;
  line-height: 1.75;
  letter-spacing: normal;
  scroll-margin-block: 24px;
}
.mc-contact textarea { min-height: 224px; resize: none; }
.mc-contact input:hover, .mc-contact textarea:hover { border-color: var(--mc-secondary); }
.mc-contact input[aria-invalid="true"], .mc-contact textarea[aria-invalid="true"] { border-color: var(--mc-danger); }
.mc-contact input[readonly], .mc-contact textarea[readonly] { background: var(--mc-surface); }
.mc-contact-field-error { min-height: 24px; color: var(--mc-danger); font-size: 14px; }
.mc-contact-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.mc-contact-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 192px;
  min-height: 48px;
  padding: 10px 20px;
  border: 1px solid var(--mc-primary);
  border-radius: 8px;
  color: var(--mc-background);
  background: var(--mc-primary);
  font: 700 16px/1.5 var(--mc-font);
  cursor: pointer;
  transition: opacity 120ms;
}
.mc-contact-submit:not(:disabled):hover { opacity: .9; }
.mc-contact-submit:not(:disabled):active { opacity: .8; }
.mc-contact-submit:disabled { cursor: default; opacity: .6; }
.mc-contact-status { min-height: 56px; color: var(--mc-primary); scroll-margin-block: 24px; }
.mc-contact-status[data-tone="error"] { color: var(--mc-danger); }
@media (max-width: 480px) {
  .mc-contact-submit { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .mc-contact-submit { transition: none; }
}
@media (forced-colors: active) {
  .mc-contact, .mc-contact * { scrollbar-color: auto; }
  .mc-contact-submit:disabled { opacity: 1; }
}