@charset "UTF-8";
/* 配置する場所に関するスタイル(ここはコピペしない) */
/* Senses webform sample style */
div[id^=senses-webform] {
  --sw-input-border-color: #aaa;
  --sw-input-focus-border-color: rgba(172, 198, 27, 1);
  --sw-button-color: #acc61b;
  --sw-button-text-color: #fff;
  width: 100%;
  max-width: 100%;
  font-size: 100%;
  /* form style reset */
  /* custom form style */
  /* フォームラベルの調整 */
  /* セレクトボックスの下矢印再定義 */
  /* チェックボックス(ラジオボタンも一緒に)のサイズをクリックしやすいように調整 */
  /* 送信ボタンスタイル */
}
div[id^=senses-webform] *,
div[id^=senses-webform] *::after,
div[id^=senses-webform] *::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
div[id^=senses-webform] input[type=text],
div[id^=senses-webform] button,
div[id^=senses-webform] select,
div[id^=senses-webform] textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
}
div[id^=senses-webform] textarea {
  resize: vertical;
}
div[id^=senses-webform] input[type=submit],
div[id^=senses-webform] input[type=button],
div[id^=senses-webform] label,
div[id^=senses-webform] button,
div[id^=senses-webform] select {
  cursor: pointer;
}
div[id^=senses-webform] select::-ms-expand {
  display: none;
}
div[id^=senses-webform] .textField,
div[id^=senses-webform] .singleSelectionField,
div[id^=senses-webform] .termField {
  margin: 0.75em 0;
}
div[id^=senses-webform] .textField input + p,
div[id^=senses-webform] .singleSelectionField input + p,
div[id^=senses-webform] .termField input + p {
  /* 注釈 */
  font-size: 0.8em;
  padding: 0;
  margin: 0;
}
div[id^=senses-webform] input[type=text],
div[id^=senses-webform] select,
div[id^=senses-webform] textarea {
  width: 100%;
  margin: 4px 0;
  padding: 0.5em;
  background-color: #fff;
  border: 1px solid var(--sw-input-border-color);
  border-radius: 4px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
div[id^=senses-webform] input[type=text]:focus,
div[id^=senses-webform] select:focus,
div[id^=senses-webform] textarea:focus {
  -webkit-box-shadow: 0px 0px 10px 0px var(--sw-input-focus-border-color);
          box-shadow: 0px 0px 10px 0px var(--sw-input-focus-border-color);
}
div[id^=senses-webform] input[type=text] + div,
div[id^=senses-webform] select + div,
div[id^=senses-webform] textarea + div {
  color: red;
  font-size: 0.8em;
  text-align: left;
}
div[id^=senses-webform] label {
  font-size: 0.95em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  font-weight: bold;
}
div[id^=senses-webform] label span {
  color: #fff;
  background-color: #acc61b;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 12px;
  margin-left: 10px;
}
div[id^=senses-webform] label div {
  /* 必須 */
  color: red;
  font-size: 0.8em;
  margin-left: 1em;
  min-width: 2em;
  /* もし、順序を前にしたい場合
  order: -1; */
}
div[id^=senses-webform] select {
  padding-right: 32px;
  background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);
  background-position: calc(100% - 17px) 1em, calc(100% - 12px) 1em, calc(100% - 32px) 0;
  background-size: 5px 5px, 5px 5px, 1px 100%;
  background-repeat: no-repeat;
}
div[id^=senses-webform] .termField {
  font-size: 0.95em;
}
div[id^=senses-webform] input[type=checkbox],
div[id^=senses-webform] input[type=radio] {
  -webkit-transform: scale(1.8);
          transform: scale(1.8);
  margin: 0 1.2em 0 8px;
}
div[id^=senses-webform] button {
  margin: 0.75em 0;
  width: 100%;
  max-width: 260px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 1.25em;
  padding: 0.5em 0;
  border-radius: 999999px;
  text-decoration: none;
  text-align: center;
  word-break: break-all;
  color: var(--sw-button-text-color);
  background: var(--sw-button-color);
  border: 2px solid var(--sw-button-color);
  -webkit-transition: color, background 0.3s;
  transition: color, background 0.3s;
}
div[id^=senses-webform] button:hover {
  color: var(--sw-button-color);
  background: transparent;
}