@charset "utf-8";

body {
  overflow-y: scroll;
}

div#confirm_field {
}

div#confirm_field {
  display: none;
}

div#confirm_field h2 {
  margin: 0 auto;
  padding: 15px 0;
  font-size: 1.8rem;
  line-height: 1.4;
  font-weight: bold;
  text-align: center;
}

div#confirm_field dl {
  border-top: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
}

div#confirm_field dl dt {
  width: 30%;
  border-top: 1px solid #cccccc;
  padding: 12px 20px;
  text-align: right;
  overflow: hidden;
  background-color: #ebf1ff;
}

div#confirm_field dl dt:first-child {
  border: none;
}

div#confirm_field dl dt:first-child + dd {
  border: none;
}

div#confirm_field dl dd {
  width: 70%;
  border-top: 1px solid #cccccc;
  padding: 12px 0 12px 20px;
}

div#confirm_field p#confirm_submit {
  width: 100%;
  margin: 40px auto 0;
  display: flex;
  justify-content: center;
  gap: 30px;
}

input[type="button"] {
  text-align: center;
  display: inline-block;
  width: 100%;
  max-width: 300px;
  font-size: 2rem;
  color: #ffffff;
  padding: 15px 30px;
  border: none;
}

input[type="button"]:hover {
  cursor: pointer;
  opacity: 0.8;
}

div#confirm_field input#confirm_submit_button {
  background: #ea617c;
}

div#confirm_field input#confirm_submit_button:hover {
}

div#confirm_field input#confirm_cancel_button {
  background: #a2a2a2;
}

div#confirm_field input#confirm_cancel_button:hover {
}

/* --responsive----------------------------------------------------------------------------------------------------------------- */

/* 640pixel start */
@media screen and (max-width: 640px) {
  div#confirm_field {
    /* width: 95%; */
  }

  div#confirm_field h2 {
    text-align: left;
  }

  div#confirm_field dl {
    /* overflow: visible; */
  }

  div#confirm_field dl dt {
    width: 100%;
    text-align: left;
    padding: 10px 5px;
    font-weight: bold;
  }

  div#confirm_field dl dt:before {
    content: "【";
  }

  div#confirm_field dl dt:after {
    content: "】";
  }

  div#confirm_field dl dd {
    width: 100%;
    border: none;
    padding: 12px 5px 16px;
  }

  div#confirm_field p#confirm_submit {
    display: block;
  }

  input[type="button"] {
    max-width: 100%;
  }

  div#confirm_field input#confirm_cancel_button {
    margin-bottom: 20px;
  }
}
/* 640pixel end */
