@charset "utf-8";

/* ---------------------------------------------------------------------------------------------

　   CONTACT

--------------------------------------------------------------------------------------------- */

#contact h1 {
  position: relative;
  text-align: center;
  letter-spacing: .1em;
}
#contact h1:before {
  content: "";
  display: block;
  margin: 0 auto 15px;
  width: 136px;
  height: 43px;
  background: url(../img/ribbon.png) no-repeat center / 100%;
}

input,textarea {
    border-radius:0;
    line-height: 1em;
}
input[type="text"],input[type="tel"],input[type="email"],input[type="number"] {
  height: 40px;
  padding:0 15px;
}
input[type="text"],textarea,input[type="tel"],input[type="email"],input[type="number"]{
  border: none;
  margin:0;
  display: block;
  background: #eee;
  font-family: inherit;
  -webkit-appearance: none;
  font-size: inherit;
  width: 100%;
}
textarea {
  padding:20px;
  height: 16em;
  width: 100%;
  display: block;
  resize: vertical;
}

button {
  -webkit-appearance: none;
  border:none;
  text-align: center;
  font-size: inherit;
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  letter-spacing: .2em;
}
#send:hover {
  opacity: .7;
}
#send:disabled {
  background: #999;
  cursor:not-allowed;
  opacity: 1;
}
.submit_btn__area .btn.back {
  background: #ddd;
  color: #000;
}
.thanks_text {
  text-align: center;
  line-height: 1.8em;
}
#contact form dt.hidden-item,
#contact form dd.hidden-item {
  display: none;
}
@media only screen and ( max-width : 767px ) {
  #contact h1 {
    font-size: 24px;
    margin-bottom: 40px;
  }
  #contact form dl {
    margin-bottom: 2em;
    font-size: 16px;
  }
  #contact form dt {
    margin-bottom: .8em;
  }
  #contact form dd {
    margin-bottom: 2em;
  }
  .submit_btn__area .btn {
    width: 100%;
    max-width: 240px;
    margin: 0 auto;
  }
  .submit_btn__area .btn.back {
    margin-bottom: 20px;
  }
}

@media print, screen and ( min-width : 768px ) {
  #contact h1 {
    font-size: 30px;
    margin-bottom: 60px;
  }
  #contact form dl {
    margin-bottom: 20px;
    font-size: 18px;
  }
  #contact form dt,#contact form dd {
    margin-bottom: 40px;
  }
  #contact form dt {
    width: 280px;
  }
  #contact form dd {
    width: calc(100% - 280px);
  }
  .submit_btn__area .btn.back {
    margin-right: 30px;
  }
  .submit_btn__area .btn {
    width: 300px;
  }
  #send {
  }
}