@charset 'utf-8';

/* change_sale */
.tireChange {
  width: 100%;
  margin-bottom: 16px;
}

.tireChange table {
  width: 100%;
  margin: 2px 0;
}

.supplement {
  display: flex;
  justify-content: space-between;
  margin: 4px 0;
}

.tireChange table,
.tireChange th,
.tireChange td {
  table-layout: fixed;
  border-collapse: collapse;
  border: 1px solid #ddd;
  text-align: center;
  padding: 4px;
}

.tireChange table thead th {
  font-size: 13px;
  color: #fff;
  background: #900;
  border-radius: 4px 4px 0 0;
}

.tireChange table thead th.size,
.tireChange table thead th.position {
  width: 10%;
}
.tireChange table thead th.front,
.tireChange table thead th.rear,
.tireChange table thead th.tireprice {
  width: 25%;
}
.tireChange table thead th.tireSize {
  width: 40%;
}
.tireChange table thead th.VehicleType {
  width: 30%;
}
.tireChange table thead th.tireprice {
  width: 20%;
}

.tireChange table tbody td {
  font-size: 13px;
  color: #555;
  vertical-align: middle;
}

/* 工賃 */
td .wages:not(:first-of-type) {
  margin-top: 4px;
}
span.ex {
  font-size: 12px;
  font-weight: normal;
  color: #777;
}

/* 持ち込み */
/* carry-in */
/* .carry-in .bring { */
div .bring {
  display: none;
}
/* hidden-box */
td > div.hidden-box .bring {
  display: block;
  background: #eee;
  animation: .7s ease-in-out fadeIn normal forwards;
}
/* bring-your-own */
.bring-your-own {
  padding: 2px;
  cursor: pointer;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

  /* wheelReplacement */
  .wheelReplacement {
    padding: 8px 0;
    margin-top: 8px;
  }

  section.wheelReplacement h3 {
    font-size: 15px;
    font-weight: 600;
    font-family: "メイリオ" ;
    padding-left: 12px;
    margin-bottom: 8px;
  }

  section.wheelReplacement h3::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 600; 
    content: "\f005  ";
    color: #ff8c00;
  }

  section.wheelReplacement p {
    padding-left: 8px;
  }

/* others */
.others {
  width: 100%;
  margin-bottom: 16px;
}
.others h3.valve {
  width: 150px;
  border-bottom: 4px solid #f6ad49;
}

.others p.taxIncluded {
  font-size: 12px;
  color: #96514d;
  text-align: right;
  padding-right: 10px;
}

.others table {
  width: 98%;
}

.others table thead th {
  font-size: 13px;
  color: #fff;
  background: #900;
}
.others table thead th.shape {
  width: 20%;
}
.others table thead th.price {
  width: 20%;
}

/* 廃タイヤ */
.others table thead th.others-details {
  width: 40%;
}

.others th span.rote_important {
  color: #ff0;
  font-size: 12px;
  font-weight: bold;
}