main p a, main li a, main table a { text-decoration: underline; text-underline-offset: 2px; }

@media (max-width: 640px) {
  html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    overscroll-behavior-x: none;
  }

  body { touch-action: pan-y; }

  header > div {
    padding: 9px 16px !important;
    gap: 9px 12px !important;
  }

  header nav {
    order: 3;
    width: 100%;
    gap: 8px !important;
    justify-content: space-between;
    margin-left: 0 !important;
    padding: 8px 0 2px;
    flex-wrap: nowrap !important;
    overflow-x: hidden;
    touch-action: pan-y;
    scrollbar-width: none;
  }

  header nav::-webkit-scrollbar { display: none; }

  main section > div,
  main article > div,
  footer > div {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  [style*="minmax(300px,1fr)"],
  [style*="minmax(300px, 1fr)"],
  [style*="minmax(320px,1fr)"],
  [style*="minmax(320px, 1fr)"],
  [style*="minmax(280px,1fr)"],
  [style*="minmax(280px, 1fr)"],
  [style*="minmax(220px,1fr) minmax(300px,2fr)"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  [style*="grid-template-columns:auto minmax"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  [style*="grid-template-columns:repeat(3,1fr)"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  [style*="grid-template-columns:auto 1fr auto"] {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 10px !important;
  }

  table {
    display: table;
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    white-space: normal;
  }

  th, td {
    min-width: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  pre { max-width: 100%; box-sizing: border-box; }

  h1, h2, h3, p, li { overflow-wrap: anywhere; }

  .case-metrics,
  .case-metrics tbody,
  .case-metrics tr,
  .case-metrics td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
  }

  .case-metrics caption {
    display: block;
    padding: 14px 16px 8px !important;
  }

  .case-metrics td {
    padding: 17px 16px !important;
    border-right: 0 !important;
    border-bottom: 1px solid #dcd6c8;
  }

  .case-metrics td:last-child { border-bottom: 0; }

  .case-metrics td > div:first-child {
    font-size: 22px !important;
    line-height: 1.25;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: keep-all;
  }

  .case-metrics td > div:last-child {
    margin-top: 6px !important;
    font-size: 14px !important;
    line-height: 1.55;
    overflow-wrap: normal;
    word-break: keep-all;
  }

  #problem article {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #problem article + article {
    border-left: 0 !important;
    border-top: 1px solid #dcd6c8;
  }

  #who > div { padding-top: 32px !important; padding-bottom: 32px !important; }
  #who .who-card-head { display: none; }
  #who .who-meta > div { padding: 11px 14px !important; gap: 10px !important; }
  #who .who-meta dt { min-width: 48px !important; }
  #who .who-stats { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #who .who-stats > div { padding: 12px 8px !important; text-align: center; }
  #who .who-stats > div > div:first-child { font-size: 16px !important; }
  #who .who-stats > div > div:last-child { margin-top: 3px !important; font-size: 11px !important; line-height: 1.35; }

  #process ol > li {
    display: grid !important;
    grid-template-columns: 28px 76px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 0 10px !important;
    padding: 14px 0 !important;
  }
  #process ol > li > span:nth-child(1) { grid-column: 1; grid-row: 1; }
  #process ol > li > span:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
    justify-self: start;
    color: #14130f !important;
  }
  #process ol > li > span:nth-child(2) {
    grid-column: 3;
    grid-row: 1;
    min-width: 0;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .service-facts { grid-template-columns: minmax(0, 1fr) !important; }
  .service-facts > div {
    padding: 14px 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid #dcd6c8;
  }
  .service-facts > div:last-child { border-bottom: 0; }

  body > div[style*="position:fixed"] {
    right: 10px !important;
    bottom: 10px !important;
  }
}

@media (max-width: 360px) {
  header [role="img"][aria-label="세온코더"] { width: 136px !important; }
  header a[href="/sample/"] { height: 38px !important; padding: 0 12px !important; font-size: 12px !important; }
  main section > div,
  main article > div,
  footer > div { padding-left: 14px !important; padding-right: 14px !important; }
}