ブログ用：CF7のフォームをざっくりいい感じにするCSS

CF7フォームをざっくりいい感じにする.css

/* 雑なCSSのメモ書きのようなものなのでいい感じにカスタマイズして使ってください */
.wpcf7 * {
  box-sizing:border-box;
}

.wpcf7 label {
  font-weight:700;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
  width:100%;
  margin-top:0.25em;
  padding:0.5em 0.5em;
  border:1px solid #aaa;
  border-radius:4px;
  font-size:1rem;
  font-weight:400;
}

.wpcf7-radio .wpcf7-list-item {
  font-size:1rem;
  font-weight:400;
}

.wpcf7-radio .wpcf7-list-item label {
  padding:0.25em 1em;
  border:1px solid #aaa;
  border-radius:4px;
  font-weight:400;
  cursor:pointer;
}

.wpcf7-radio .wpcf7-list-item label:has(input:focus),
.wpcf7-radio .wpcf7-list-item label:has(input:checked) {
  border-color:blue;
}

.wpcf7-radio .wpcf7-list-item input {
  margin-top:0;
  margin-bottom:0;
  margin-left:0;
}

.wpcf7-radio .wpcf7-list-item input:focus {
  outline:none;
}

.wpcf7-radio .wpcf7-list-item.first {
  margin-left:0;
}

.wpcf7-submit {
  display:block;
  width:100%;
  padding:0.5em 1em;
  border:0;
  background-color:#0693e3;
  font-size:1.2rem;
  color:#fff;
  outline:none;
  cursor:pointer;
}