fieldset{border: transparent;}.container {max-width: 100%;border: 0;}.help-block {font-size: 0.75em;}input,button,textarea,select {margin: 0;padding: 0;border: none;border-radius: 0;font-size: 1em;}.form-column {margin-bottom: 0;}.form-column-heading h2 {font-size: 1.5em;margin: 0;font-weight: bold;}label h3 {font-size: 1em;display: inline-block;margin: 0;font-weight: bold;}label .badge-optional {display: none;}.description-block {color: #151514;margin-top: 0;}.button-group .help-block {margin-top: 0;font-size: 0.75em;}input[type="file"] {display: block;line-height: 1.75;}input[type="password"] {height: 1.75em;width: 100%;transition: all 0.3s;}input[readonly],textarea[readonly] {border-color: transparent;padding-left: 0;padding-right: 0;}.form-column-date .input-group select {width: auto;display: inline-block;}.form-column-calendar input {width: auto;}.form-column-zip-code-jp .input-group input {width: auto;min-width: auto;}.form-column-zip-code-autofill.form-column {border-bottom: 0;margin-bottom: 0;}body, .container{background-color: transparent;}

/* 全体設定 */
body {
  font-size: 1.6rem;
  line-height: 1.75;
  color: #0071bc;
  font-weight: 700;
}
.button, select:not(:-internal-list-box):not([multiple]) option {
  font-weight: 700;
}
input, select, textarea {
  -webkit-text-fill-color: #333;
}
/* 全体のコンテナ border-top用 */
.form-page {
  border-top: 4px solid currentColor;
}
/* 各項目のラベルとinputのコンテナ */
.form-column-name,
.form-column-text,
.form-column-tel,
.form-column-email,
.form-column-select,
.form-column-textarea,
.form-column-zip-code-jp,
.form-column-prefecture-jp {
  padding: 1.5em .5em;
  margin-inline: auto;
  display: grid;
  grid-template-columns: 14em 1fr;
  max-width: 900px;
  width: 100%;
  border-bottom: 2px dashed currentColor;
}
  /* selectのものだけ避ける 下向きの三角入れる */
.form-column-select {
  border-bottom: none;
  width: fit-content;
  margin-left: unset;
  position: relative;
}
.form-column-select::after {
  content: "";
  display: block;
  position: absolute;
  width: 1em;
  aspect-ratio: 2 / 1.73;
  background-color: currentColor;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  right: 1.5em;
  bottom: 2.8em;
}
.form-column-select + [class^=form-column] {
  border-top: 2px dashed currentColor;
}
  /* 一番最後のもの */
.form-page > :nth-last-child(1 of .form-column:not(.hidden)) {
  border-bottom: 4px solid currentColor;
}
@media screen and (max-width: 768px){
  .form-column-name,
  .form-column-text,
  .form-column-tel,
  .form-column-email,
  .form-column-select,
  .form-column-textarea,
  .form-column-zip-code-jp,
  .form-column-prefecture-jp {
    grid-template-columns: 1fr;
    gap: 1em;
  }
}

/* 各項目入力部分 */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea,
select{
  width: 100%;
  min-width: 500px;
  max-width: 100%;
  line-height: 1.75em;
  transition: all 0.3s;
  padding: .8em 2em;
  border-radius: .5em;
  height: initial;
}
select{
  min-width: unset;
  width: fit-content;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  font-weight: 700;
  padding-right: 4em;
}
textarea {
  height: 16em;
}
 /* 郵便番号 */
.form-column-zip-code-jp .input-group input.zip-code-jp{
  width: 14em;
}

@media screen and (max-width: 768px) {
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  textarea,
  select{
    min-width: unset;
  }
  textarea {
    height: 8em;
  }
}

/* 必須 */
  /* ラベルと横並びに */
.form-column-name label,
.form-column-text label,
.form-column-tel label,
.form-column-email label,
.form-column-select label,
.form-column-prefecture-jp label,
.form-column-zip-code-autofill .form-column-zip-code-jp label,
.form-column-checkbox .option-text{
  display: flex;
  align-items: center;
}
  /* 必須 */
label .badge-required,
.form-column-checkbox .option-text::after /* プライバシーポリシー用 */ {
  width: auto;
  margin-left: 0.25em;
  font-size: 0.9em;
  color: inherit;
}
label .badge-required::before {
  content: "[";
}
label .badge-required::after {
  content: "]";
}

/* 送信ボタン */
.button-group:has(>[type="submit"]) {
  width: fit-content;
  margin-top: 2em;
  margin-inline: auto;
}
button[type=submit] {
  display: inline-block;
  text-align: center;
  background-color: #5abde8;
  border: 2px solid #5abde8;
  color: #fff;
  border-radius: 100vw;
  padding: 1.5em 3em;
  margin-inline: auto;
  font-weight: 700;
}

/* プライバシーポリシー 画像で実装しているが、formのテキストの部分が空だとうまくいかないので注意 */
/* 他の部分のcssと競合する場合は
  .form-column-note => [data-column="プライバシーポリシー"]
  .form-column-check-box => [data-column="プライバシーポリシーに同意する"]
  などMovableTypeNetでつけたタイトル名を指定すると良い
*/
.form-column-note {
  width: 100%;
  max-width: 600px;
  height: 200px;
  border: solid 1px #ccc;
  overflow-y: scroll;
  background: white;
  margin: 1em auto;
}
.form-column-note .description-block {
  background-image: url(https://taiyosha.cleaning/wp-content/themes/original/assets/images/privacy_policy_pc.webp);
  height: 1580px;
  background-size: calc(100% - 20px);
  background-position: top 10px center;
  background-repeat: no-repeat;
  color: transparent;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .form-column-note .description-block {
    background-image: url(https://taiyosha.cleaning/wp-content/themes/original/assets/images/privacy_policy_sp.webp);
    height: 1300px;
  }
}
.form-column-checkbox legend .badge-required{
  display: none;
}
.form-column-checkbox :is(input, .option):hover {
  cursor: pointer;
}
  /* 必須をつけるためのもの */
.form-column-checkbox .option {
  display: flex;
  gap: .3em;
  margin-inline: auto;
  width: fit-content;
}
.form-column-checkbox .option-text::after {
  content: "[必須]";
}
.form-column-checkbox legend.label {
  display: none;
}

.message-block {
    margin-bottom: 10px;
    border: 2px solid #0071bd;
    padding: 0.5em;
    text-align: center;
}

@media screen and (max-width: 768px) {{
select{
    padding-right: 2em;
    padding-left: 1em;
}
}
@media screen and (max-width: 768px) {
  .form-column-checkbox .option-text {
    font-size: .9em;
  }
}