/*--------------------------------------------------------------------
	contact.css
	お問い合わせページ（contact.html）専用の追加スタイル
	共通CSS（reset/basis/structure/parts/dark-theme）で足りない
	最小限のページ固有スタイルのみをここに記述する。
--------------------------------------------------------------------*/

/* ---- 必須バッジ ---- */
.contactRequired {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 3px;
  background-color: #CAA944;
  color: #1a1608 !important;
  font-size: 0.7rem;
  letter-spacing: .05em;
  vertical-align: middle;
}

/* ---- 入力欄・テキストエリア ---- */
.contactField input[type="text"],
.contactField input[type="email"],
.contactField textarea {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.04);
  color: #cfc9ba;
  font-family: inherit;
}

.contactField input[type="text"]::placeholder,
.contactField input[type="email"]::placeholder,
.contactField textarea::placeholder {
  color: #857e6e;
}

.contactField input[type="text"]:focus,
.contactField input[type="email"]:focus,
.contactField textarea:focus {
  outline: none;
  border-color: #CAA944;
  background-color: rgba(255, 255, 255, 0.08);
}

.contactField textarea {
  min-height: 180px;
  resize: vertical;
}

/* ---- 送信ボタン：SPでは横幅いっぱいのブロックボタンにする ---- */
@media screen and (max-width: 767px) {
  .contactSubmitRow .buttonCommon01 {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
}