/* dock-option-detail-page.css */
/* DockOptionDetailContentType02.css */
.dock-option-detail-content-type02 {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dock-option-detail-content-type02 .price {
    font-size: var(--base-font-size-lg);
    font-weight: var(--bold);
  }
.dock-option-detail-content-type02 .detail-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
  }
/* DockOptionDetailContentTableType01.css */
.dock-option-detail-content-table-type01 {
  display: grid;
  gap: var(--space-sm);
}
.dock-option-detail-content-table-type01 > table {
    width: 100%;
    overflow: clip;
    border-spacing: 0;
    border-collapse: separate;
    border: 1px solid var(--color-orange-400);
    border-radius: 12px;
  }
.dock-option-detail-content-table-type01 > table th {
      font-weight: var(--normal);
    }
@media all and (max-width: 1087.98px) {
.dock-option-detail-content-table-type01 > table th {
        font-size: 12px;
    }
      }
@media all and (max-width: 1087.98px) {
.dock-option-detail-content-table-type01 > table td {
        font-size: 12px;
    }
      }
.dock-option-detail-content-table-type01 > table tbody tr :is(th, td) {
        padding: 20px;
      }
@media all and (max-width: 1087.98px) {
.dock-option-detail-content-table-type01 > table tbody tr :is(th, td) {
          padding: 8px;
      }
        }
.dock-option-detail-content-table-type01 > table tbody tr > *:nth-child(1) {
          width: 24%;
        }
.dock-option-detail-content-table-type01 > table tbody tr > *:nth-child(2) {
          width: auto;
        }
.dock-option-detail-content-table-type01 > table tbody tr > th dl {
        display: flex;
        flex-wrap: wrap;
      }
.dock-option-detail-content-table-type01 > table tbody tr > td dl {
        display: flex;
        flex-wrap: wrap;
      }
:is(.dock-option-detail-content-table-type01 > table tbody) tr + tr :is(th, td) {
        border-top: 1px solid var(--color-orange-400);
      }
.dock-option-detail-content-table-type01 > table tbody tr:nth-of-type(odd) th {
          background-color: var(--color-orange-200);
        }
.dock-option-detail-content-table-type01 > table tbody tr:nth-of-type(odd) td {
          background-color: #fff;
        }
.dock-option-detail-content-table-type01 > table tbody tr:nth-of-type(even) th {
          background-color: var(--color-orange-400);
        }
.dock-option-detail-content-table-type01 > table tbody tr:nth-of-type(even) td {
          background-color: var(--color-orange-100);
        }
/* DockOptionDetailContentTableType02.css */
.dock-option-detail-content-table-type02 {
  display: grid;
  gap: var(--space-sm);
}
.dock-option-detail-content-table-type02 > table {
    width: 100%;
    overflow: clip;
    border-spacing: 0;
    border-collapse: separate;
    border: 1px solid var(--color-orange-400);
    border-radius: 12px;
  }
.dock-option-detail-content-table-type02 > table th {
      font-weight: var(--normal);
    }
@media all and (max-width: 1087.98px) {
.dock-option-detail-content-table-type02 > table th {
        font-size: 12px;
    }
      }
@media all and (max-width: 1087.98px) {
.dock-option-detail-content-table-type02 > table td {
        font-size: 12px;
    }
      }
.dock-option-detail-content-table-type02 > table tbody tr :is(th, td) {
        padding: 20px;
      }
@media all and (max-width: 1087.98px) {
.dock-option-detail-content-table-type02 > table tbody tr :is(th, td) {
          padding: 8px;
      }
        }
.dock-option-detail-content-table-type02 > table tbody tr > *:nth-child(1) {
          width: 24%;
        }
.dock-option-detail-content-table-type02 > table tbody tr > *:nth-child(2) {
          width: auto;
        }
.dock-option-detail-content-table-type02 > table tbody tr > *:nth-child(3) {
          width: 14%;
          border-left: 1px solid var(--color-orange-400);
        }
:is(.dock-option-detail-content-table-type02 > table tbody) tr + tr :is(th, td) {
        border-top: 1px solid var(--color-orange-400);
      }
.dock-option-detail-content-table-type02 > table tbody tr:nth-of-type(odd) th {
          background-color: var(--color-orange-200);
        }
.dock-option-detail-content-table-type02 > table tbody tr:nth-of-type(odd) td {
          background-color: #fff;
        }
.dock-option-detail-content-table-type02 > table tbody tr:nth-of-type(even) th {
          background-color: var(--color-orange-400);
        }
.dock-option-detail-content-table-type02 > table tbody tr:nth-of-type(even) td {
          background-color: var(--color-orange-100);
        }