#form ::placeholder {
    color: #B5B5B6;
}
#button {
    border: none;
    border-radius : 3px;
    font-size: 1.1em;
    font-weight:bold;
    padding: .8em 3em;
    margin-top: 2em;
    background: #00853c;
    color: #FFF;
    transition: .2s ease-in-out;
    -webkit-appearance: none;
  }
#button:hover {
    box-shadow: 1px 1px 10px #fff;
    cursor: pointer;
    opacity:0.8;
}
#button:active {
    box-shadow: none;
}
#name {
    padding: .5em;
    border: none;
    border-radius: 3px;
    background: #F5F5F5;
    font-size: 1.2em;
    max-width: 100%;
    width: 100%;
    color: #454545;
}
#name, #email {
    height: 2.5em;
}
.radio > label {
    margin: 14px;
    cursor: pointer;
}
.label {
    padding: 1.3em 0 5px;
      margin-bottom: 1em;
      margin-top: 2em;

}
span {
  font-size: 12px;
  border-radius: 5px;
  padding: 4px;
}

/* 必須表示のspanにのみ背景色を適用 */
.label span {
color:#fff;
  background-color: #20ab5f;
    margin-right: 15px;
  padding: 6px 14px;
  color: #fff;
  font-size: 12px;
  vertical-align: 1px;
}



/* ラジオボタンとテキストを同じ行に表示 */
label {
  display: inline-block;
  margin-bottom: 10px; /* 下に少し余白を追加 */
}

/* 改行のためにbrタグを使うのでdisplay:blockは不要 */
.form_radio {
  margin-right: 5px; /* ラジオボタンとテキストの間に余白を追加 */
}

textarea.textbox {
  padding: .5em;
  border: none;
  border-radius: 3px;
  background: #F5F5F5;
  font-size: 1.2em;
  width: 100%;
  max-width: 100%;
  color: #454545;
  resize: vertical; /* ユーザーが縦方向にリサイズ可能に */
  line-height: 1.6em;
}

textarea.textbox-tall {
  height: 15em; /* 高さ調整、お好みで */
  padding: 1em;
  box-sizing: border-box;
}


@media screen and (max-width: 768px) {
  form {
    padding: 0 1em; /* 左右に余白を追加（スマホ用） */
  }

  .form-row {
    flex-direction: column;
    align-items: center;
  }

  .form-label,
  .form-input,
  input[type="text"],
  textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  #name {
    width: 100%;
  }
}

/* 全体の横スクロール防止対策 */
html, body {
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
}

/* すべての要素にbox-sizingを適用 */
*, *::before, *::after {
  box-sizing: border-box;
}
