/* common
=================================================================== */
/* layout
=================================================================== */
/* imgCover
=================================================================== */
/* mask
=================================================================== */
/* background
=================================================================== */
/* flex
=================================================================== */
/* animation delay
=================================================================== */
/* 3d
=================================================================== */
/* font
=================================================================== */
/* vw
=================================================================== */
/* form
=================================================================== */
/* ========================================================================= 767px */
@media only screen and (max-width: 767px) {
  /* ============================================================== contact */
  /* --------------------------------------- form */
  form input, form button, form textarea, form select {
    padding: 13px 20px;
    font-size: 13px;
    border-radius: 5px;
  }
  form select {
    border-radius: 9999px;
  }
  form input[type=submit] {
    border-width: 1px;
  }
  /* --------------------------------------- checkbox */
  .checkbox {
    margin-bottom: 30px;
  }
  .checkbox label {
    font-size: 12px;
    padding-left: 30px;
  }
  .checkbox label::before, .checkbox label::after {
    top: calc(50% + 1px);
  }
  .checkbox label::before {
    width: 16px;
    height: 16px;
  }
  .checkbox label::after {
    width: 8px;
    height: 8px;
    left: 5px;
  }
  /* --------------------------------------- formBtn */
  .formBtn input {
    width: 100%;
    max-width: 460px;
    font-size: 14px;
    padding: 24px;
  }
  /* --------------------------------------- formList */
  .formList > li {
    margin-bottom: 38px;
  }
  .formList > li > dl {
    display: block;
  }
  .formList > li > dl > dt {
    width: 100%;
    font-size: 13px;
    margin-bottom: 12px;
  }
  .formList > li > dl > dt.alignTop {
    margin-top: 0;
  }
  .formList > li > dl > dd {
    width: 100%;
  }
  .formList > li > dl > dd.select::after {
    width: 6px;
    right: 28px;
  }
  .formList > li.must > dl > dt::after {
    font-size: 16px;
    margin-left: 0.3em;
  }
  .formList > li:last-child {
    margin-bottom: 25px;
  }
  /* ============================================================== confirm */
  .error {
    font-size: 12px;
    margin-bottom: 50px;
  }
  .confirm .formList > li {
    margin-bottom: 45px;
  }
  .confirm .formList > li > dl > dt {
    font-size: 12px;
    margin-bottom: 0;
  }
  .confirm .formList > li > dl > dd {
    padding: 13px 0;
    font-size: 16px;
  }
  .confirm .confirm__formBtn--wrapper .formBtn--back {
    margin-right: 12px;
  }
  .confirm .confirm__formBtn--wrapper .formBtn--back::after {
    line-height: 52px;
  }
  .confirm .confirm__formBtn--wrapper .formBtn input {
    width: 175px;
  }
  .confirm .confirm__formBtn--wrapper .formBtn--back input {
    width: 110px;
    padding: 18px;
  }
  /* ============================================================== thanks */
  .thanks--text {
    font-size: 14px;
    margin-bottom: 35px;
  }
  .thanks .pagesArticle {
    min-height: inherit;
    margin-bottom: 55px;
  }
  .thanks .pagesArticle .btn > a {
    font-size: 12px;
  }
  /* ============================================================== hover pc */
  .checkbox label a:active {
    text-decoration: none;
  }
  .formBtn input:active {
    color: #000;
    background-color: #fff;
  }
  .confirm .confirm__formBtn--wrapper .formBtn--back:active::after {
    -webkit-transform: translateX(-6px);
            transform: translateX(-6px);
  }
  .confirm .confirm__formBtn--wrapper .formBtn--back:active input {
    color: #838383;
    background-color: #fff;
  }
}