@page {
  size:A4 portrait;
  margin:10mm 8mm 12mm;
}

* {
  box-sizing:border-box;
}

html,
body {
  margin:0;
  padding:0;
  background:#fff;
  color:#111;
  font-family:Arial, "Malgun Gothic", sans-serif;
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}

.js-print-sheet {
  width:100%;
}

.js-print-header {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin:0 0 8px;
  padding:0 0 7px;
  border-bottom:2px solid #222;
}

.js-print-title {
  font-size:20pt;
  font-weight:900;
  letter-spacing:-.7px;
  white-space:nowrap;
}

.js-print-meta {
  display:flex;
  align-items:center;
  gap:22px;
  padding-bottom:2px;
  font-size:9.5pt;
  font-weight:700;
  white-space:nowrap;
}

.js-print-table {
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:8.5pt;
}

.js-print-table thead {
  display:table-header-group;
}

.js-print-table tr {
  break-inside:avoid;
  page-break-inside:avoid;
}

.js-print-table th,
.js-print-table td {
  border:1px solid #777;
  vertical-align:top;
}

.js-print-table th {
  padding:5px 4px;
  background:#e9edf2;
  text-align:center;
  font-size:8.7pt;
  font-weight:900;
}

.js-print-table td {
  padding:5px 5px;
  line-height:1.35;
  overflow-wrap:anywhere;
  word-break:keep-all;
}

.col-phone {
  font-size:8.1pt;
  white-space:normal;
}

.col-phone > div + div {
  margin-top:3px;
}

.print-building-name {
  margin-bottom:3px;
  font-size:9pt;
  font-weight:900;
}

.print-address {
  color:#303744;
  font-size:8.2pt;
  line-height:1.35;
}

.print-room {
  display:inline-block;
  margin-left:3px;
  padding:0 3px;
  border:1px solid #b9c5d3;
  border-radius:4px;
  background:#f4f7fa;
  font-size:7.4pt;
  font-weight:800;
}

.print-detail-top {
  margin-bottom:4px;
  font-weight:900;
}

.print-price {
  color:#111;
  font-weight:700;
  line-height:1.45;
}

.print-memo {
  white-space:pre-wrap;
  line-height:1.42;
}

.col-date {
  text-align:center;
  font-size:7.8pt;
  white-space:nowrap;
}

.empty-cell {
  color:#aaa;
}

.print-row-done td {
  background:#eeeeee;
  color:#666;
}

.print-row-visit td {
  background:#fff7cc;
}

/* 완료이면서 임장가자인 경우 회색 우선 */
.print-row-done.print-row-visit td {
  background:#eeeeee;
}

@media screen {
  body {
    padding:18px;
    background:#edf1f5;
  }

  .js-print-sheet {
    max-width:794px;
    margin:0 auto;
    padding:22px;
    background:#fff;
    box-shadow:0 8px 30px rgba(0,0,0,.18);
  }
}