:root {
  --s1g1: #335599;
  --s1g2: #7799dd;
  --s1g3: #EBF0FA;
  --s1g4: #ffffff;
  --s1g5: #aaccff;
  --s2g1: #555599;
  --s2g2: #9999dd;
  --s2g3: #F3F3FB;
  --s2g4: #ffffff;
  --s2g5: #ccccff;
  --s3g1: #995577;
  --s3g2: #dd7799;
  --s3g3: #FCF3F6;
  --s3g4: #ffffff;
  --s3g5: #ffaacc;
  --s4g1: #996655;
  --s4g2: #ddaa99;
  --s4g3: #FCF6F3;
  --s4g4: #ffffff;
  --s5g1: #808f55;
  --s5g2: #c0cf99;
  --s5g3: #F4F6EE;
  --s5g4: #ffffff;
}
.accordion h3 {
  font-weight: 500 !important;
  font-size: 26px;
}
.accordion h3.step1,
div:nth-child(4) > span.oc-mark {
  background-image: linear-gradient(90deg, var(--s1g1), var(--s1g2)) !important;
}
.accordion h3.step2,
div:nth-child(5) > span.oc-mark {
  background-image: linear-gradient(90deg, var(--s2g1), var(--s2g2));
}
.accordion h3.step3,
div:nth-child(6) > span.oc-mark {
  background-image: linear-gradient(90deg, var(--s3g1), var(--s3g2));
}
.accordion h3.step4,
div:nth-child(7) > span.oc-mark {
  background-image: linear-gradient(90deg, var(--s4g1), var(--s4g2));
}
.accordion h3.step5,
div:nth-child(8) > span.oc-mark {
  background-image: linear-gradient(90deg, var(--s5g1), var(--s5g2));
}
.accordion label {
  display: block;
  padding: 0px 8px;
  margin: 0 0 8px 0;
  font-size: 14px !important;
  border-width: 5px;
  border-left-style: solid;
  font-weight: 500 !important;
}
.accordion #step1 label {
  border-image: linear-gradient(to bottom, var(--s1g1), var(--s1g2));
  border-image-slice: 1;
}
.accordion #step2 label {
  border-image: linear-gradient(to bottom, var(--s2g1), var(--s2g2));
  border-image-slice: 1;
}
.accordion #step3 label {
  border-image: linear-gradient(to bottom, var(--s3g1), var(--s3g2));
  border-image-slice: 1;
}
.accordion #step4 input[type="checkbox"] {
  vertical-align: -0.05em !important;
  transform: scale(1) !important;
  line-height: 1.8em;
  margin: 5px 8px 0 3px!important;
  padding: 0!important;
}
.accordion #step4 label {
  font-weight: normal!important;
  font-size: 13px!important;
  border: 0;
  display: inline!important;
  margin: 0;
  padding: 0;
  cursor: pointer;
  line-height: 1.8em;
}
.checkbox-text {
  display: flex;
  align-items: flex-start;
}
.accordion #step5 label {
  border-image: linear-gradient(to bottom, var(--s5g1), var(--s5g2));
  border-image-slice: 1;
}
.accordion #step1 {
  background-image: linear-gradient(90deg, var(--s1g3), var(--s1g4)) !important;
}
.accordion #step2 {
  background-image: linear-gradient(90deg, var(--s2g3), var(--s2g4)) !important;
}
.accordion #step3 {
  background-image: linear-gradient(90deg, var(--s3g3), var(--s3g4)) !important;
}
.accordion #step4 {
  background-image: linear-gradient(90deg, var(--s4g3), var(--s4g4)) !important;
}
.accordion #step5 {
  background-image: linear-gradient(90deg, var(--s5g3), var(--s5g4)) !important;
}
.accordion input,
.accordion email,
.accordion select,
.accordion textarea {
  color: #555 !important;
  padding: 10px !important;
  margin-bottom: 20px !important;
  font-size: 14px !important;
  border-radius: 6px !important;
  background-color: #ffffff;
}
.accordion textarea {
  max-width: 100%;
  min-height: 150px !important;
}
.ac-contents .fa-regular {
  font-size: 16px !important;
  color: #fff !important;
}
div .icon-button {
  width: 40px;
  background-color: var(--s3g2) !important;
}
#step3 .datepicker {
  margin-bottom: 0 !important;
}
div .icon-input-container {
  border-color: var(--s3g5) !important;
  margin-bottom: 20px;
}
div .icon-button:hover {
  background-color: var(--s3g2) !important;
}
.reset-btn {
  background-color: #fff !important;
  color: #666 !important;
  padding: 0px 0px !important;
  font-size: 14px !important;
  padding-right: 14px !important;
}
.reset-btn:hover {
  background-color: #fff !important;
}
.ac-contents .icon-button img {
  filter: invert(1);
}
.accordion .readonly-style {
  background-color: #efefff !important;
  /* 背景を薄い灰色に */
  border: 1px dashed #ccc !important;
  /* ダッシュボーダー */
  color: #666 !important;
  /* テキスト色を控えめに */
}
.accordion {
  margin-bottom: 20px;
}
.ui-datepicker td a {
  text-align: center;
  padding-left: 5px;
}
.accordion input {
  background-color: #ffffff !important;
}
form #step1 input,
form #step1 select {
  border-color: var(--s1g5) !important;
}
form #step2 input {
  border-color: var(--s2g5) !important;
}
form #step3 input,
form #step3 select,
form #step3 textarea {
  border-color: var(--s3g5) !important;
}
@media screen and (max-width: 667px) {
  .accordion div {
    padding-left: 15px;
    padding-right: 15px;
  }
  .accordion .ac-contents {
    padding: 0px;
    padding-top: 20px;
    padding-bottom: 15px;
  }
  .accordion input,
  .accordion select {
    font-size: 16px !important;
    color: #555 !important;
  }
}