@charset "UTF-8";
.contact--info {
  margin-bottom: 20px; }

.contact--notes {
  color: #cc6600; }

.contact--notes--important {
  color: #ff0000; }

.contact--table_wrapper .contact--notes {
  padding-left: 0.5em; }
.contact--table_wrapper tbody th, .contact--table_wrapper tbody td {
  font-size: 0.14rem;
  font-weight: 400;
  border: 1px solid #DEDEDE;
  display: block; }
  @media screen and (min-width: 600px) {
    .contact--table_wrapper tbody th, .contact--table_wrapper tbody td {
      display: table-cell; } }
.contact--table_wrapper tbody th {
  background-color: #F4F4F4;
  padding: 7px 12px 6px;
  min-width: 170px;
  vertical-align: middle; }
  @media screen and (min-width: 600px) {
    .contact--table_wrapper tbody th {
      width: 228px; } }
.contact--table_wrapper tbody td {
  padding: 15px 10px 15px; }

.contact--subject--description {
  margin-bottom: 20px; }
  .contact--subject--description .contact--notes {
    padding-left: 0; }

.contact--subject--list--item {
  margin-bottom: 5px; }
  .contact--subject--list--item:nth-of-type(2) label {
    display: inline-block; }
  .contact--subject--list--item:nth-of-type(2)::after {
    content: "Please be sure to enter the name of the product you are inquiring about in the 【Content of inquiry】 field.";
    color: #ff0000;
    font-weight: bold;
    padding-left: 5px; }
  .contact--subject--list--item:nth-of-type(3) label {
    display: inline-block; }
  .contact--subject--list--item:nth-of-type(3)::after {
    content: "Please be sure to enter your order ID and details in the [Content of inquiry] field.";
    color: #ff0000;
    font-weight: bold;
    padding-left: 5px; }

.contact--text_area {
  height: 100px; }

.contact .form--btn_area {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  row-gap: 15px;
  align-items: center; }
  @media screen and (min-width: 600px) {
    .contact .form--btn_area {
      flex-direction: row;
      flex-wrap: nowrap;
      justify-content: center;
      column-gap: 5%; } }
.contact .btn-next {
  width: 80%; }
  @media screen and (min-width: 600px) {
    .contact .btn-next {
      width: 40%;
      order: 2; } }
.contact .btn-back {
  flex-basis: 80%;
  width: 80%; }
  @media screen and (min-width: 600px) {
    .contact .btn-back {
      flex-basis: 40%;
      width: 40%;
      order: 1; } }

/*# sourceMappingURL=contact.css.map */