@charset "UTF-8";
table#attach tr td a.btn {
  margin: auto;
}
table#attach {
  color: #747474;
  width: 100%;
}
table#attach th, table#attach td {
  padding: 0.6em;
  border-bottom: #ddd 1px solid;
}

table#attach td:nth-last-child(2) {
  text-align: center;
}
table#attach th {
  background: #666;
  color: #fff;
  padding: 0.5em;
  text-align: left;
  border-right: #fff 1px solid;
}
table#attach th:last-child {
  text-align: center;
  width: 5%;
}

table#set tr td a.btn {
  margin: auto;
}
table#set {
  color: #747474;
  width: 100%;
}
table#set th, table#set td {
  padding: 0.6em;
  border-bottom: #ddd 1px solid;
}
table#set td:nth-last-child(2) {
  text-align: right;
}
table#set th {
  background: #666;
  color: #fff;
  padding: 0.5em;
  text-align: left;
  border-right: #fff 1px solid;
}
table#set th:last-child {
  text-align: center;
  width: 5%;
}

@media screen and (max-width: 700px) {
  table#attach thead {
    display: none;
  }
  table#attach tr {
    display: flex;
    flex-wrap: wrap;
  }
  table#attach td {
    width: 50%;
    padding: 0;
    border-right: #fff 1px solid;
    border-bottom: none;
    margin-bottom: 0.4em;
    text-align: left !important;
  }
  table#attach td::before {
    display: block;
    color: #fff;
    background: #666;
    width: 100%;
    padding: 0.1em 0.3em;
    margin-bottom: 0.4em;
  }
  table#attach td:nth-child(1)::before {
    content: "製品名";
  }
  table#attach td:nth-child(2)::before {
    content: "品番";
  }
  table#attach td:nth-child(3)::before {
    content: "主製品";
  }
  table#attach td:nth-child(4)::before {
    content: "特記事項";
  }



  table#set thead {
    display: none;
  }
  table#set tr {
    display: flex;
    flex-wrap: wrap;
  }
  table#set td {
    width: 50%;
    padding: 0;
    border-right: #fff 1px solid;
    border-bottom: none;
    margin-bottom: 0.4em;
    text-align: left !important;
  }
  table#set td::before {
    display: block;
    color: #fff;
    background: #666;
    width: 100%;
    padding: 0.1em 0.3em;
    margin-bottom: 0.4em;
  }
  table#set td:nth-child(1)::before {
    content: "製品名";
  }
  table#set td:nth-child(2)::before {
    content: "品番";
  }

}