/* Variables */
:root {
  --form-bg-gradation: linear-gradient(to right,rgba(16, 82, 44, 0.31),rgba(142, 195, 31, 0.2));
  --form-white: #fff;
  --form-gray: #adadad;
  --form-green: #34a853;
  --form-dark-green: #10522c;
  --form-grayish-green: #cdedd9;
  --form-grayish-dark-green: #889b8f;
  --form-orange: #ef7d2e;
  --form-red: #ef2e2e;
  --form-light-red: #e2adaf;
}

/* common */
body {
  font-size: 16px;
}

._ec-hidden {
  display: none;
}

._ec-display-pc {
  display: none;
}

@media all and (min-width: 960px) {
  ._ec-display-sp {
    display: none;
  }

  ._ec-break-sp {
    display: none;
  }
}

._ec-mt-10px {
  margin-top: 10px;
}

._ec-mt-3em {
  margin-top: 3em;
}

._ec-flex {
  display: flex;
}

._ec-flex-column {
  flex-direction: column;
}

._ec-flex-align-center {
  align-items: center;
}

._ec-flex-gap-4 {
  gap: .4em;
}

._ec-custom-scroll-bar::-webkit-scrollbar {
  width: 6px;
}

._ec-custom-scroll-bar::-webkit-scrollbar-track {
  background-color: transparent;
}

._ec-custom-scroll-bar::-webkit-scrollbar-thumb {
  background-color: var(--form-green);
  border-radius: 9999px;
}

._ec-zindex-1 {
  z-index: 1!important;
}

/**
 * Multi-step form
 */

/* layout */
.ec-form__container {
  align-items: center;
  display: flex;
  height: 100vh;
  justify-content: center;
  padding-top: 6em;
  width: 100%;
}

@media all and (min-width: 960px) {
  .ec-form__container {
    background-image: var(--form-bg-gradation);
    padding-top: 3em;
  }
}

.ec-form__wrapper {
  background-color: var(--form-white);
  height: 100%;
  padding-top: clamp(30px, 1.268rem + 2.59vw, 70px);
  width: 100%;
}

@media all and (min-width: 960px) {
  .ec-form__wrapper {
    height: 83%;
    margin-top: 4em;
    padding: clamp(30px, 1.268rem + 2.59vw, 70px) 10% 0;
    width: 76.5%;
  }
}

/* Heading */
.ec-form__h1 {
  color: var(--form-dark-green);
  font-size: clamp(16px, 0.879rem + 0.52vw, 24px);
  font-weight: 700;
  padding: 0 1em;
  text-align: center;
}

._excel-day1:has(.js__is-active[data-page="6"]) .ec-form__h1 {
  display: none;
}

.ec-form__contents--page_head {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  font-size: 16px;
  font-weight: 700;
  margin: 0 auto;
  position: relative;
  width: 100%;
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_head {
    margin: 0;
  }
}

.ec-form__contents--page_head::after {
  border-radius: 6px;
  color: var(--form-white);
  font-size: 12px;
  margin-left: 1em;
  padding: 0 4px;
}

.ec-form__contents--page_head_important::after {
  background-color: var(--form-red);
  content: "重要";
}

.ec-form__contents--page_head_required::after {
  background-color: var(--form-orange);
  content: "必須";
}

.ec-form__contents--page_head_any::after {
  background-color: var(--form-gray);
  content: "任意";
}

.ec-form__contents--page_head_note {
  color: var(--caution-red);
  display: flex;
  font-size: 0.8em;
  font-weight: 700;
}

.ec-form__contents--page_head_note::before {
  content: "※";
}

/* progress bar */
.ec-form__progress {
  display: flex;
  flex-direction: column;
  font-size: clamp(16px, 0.879rem + 0.52vw, 24px);
  font-weight: 700;
  line-height: 1;
  margin: 20px auto 0;
  width: 84%;
}

.ec-form__progress[data-is-shown="false"] {
  display: none;
}

._excel-day1:has(.js__is-active[data-page="6"]) .ec-form__progress {
  display: none;
}

@media all and (min-width: 960px) {
  .ec-form__progress {
    margin-top: 5px;
  }
}

.ec-form__progress label {
  margin-left: .5em;
}

.ec-form__progress label span {
  color: var(--form-green);
}

progress {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #ddd;
  display: block;
  height: clamp(3px, 0.157rem + 0.13vw, 5px);
  margin-top: 10px;
  width: 100%;
}

::-webkit-progress-bar {
  background-color: #ddd;
  border-radius: 9999px;
}

::-webkit-progress-value {
  background-color: var(--form-green);
  border-radius: 9999px;
}

::-moz-progress-bar {
  background-color: var(--form-green);
  border-radius: 9999px;
}

/* form parts - radio-button */
.ec-form__parts--radio {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ec-form__parts--radio._ec-display-sp {
  display: flex;
}

.ec-form__parts--radio._ec-display-pc {
  display: none;
}

@media all and (min-width: 960px) {
  .ec-form__parts--radio._ec-display-sp {
    display: none;
  }
  
  .ec-form__parts--radio._ec-display-pc {
    display: flex;
  }
}

.ec-form__parts--radio_label {
  cursor: pointer;
  line-height: 1.4;
  padding-left: 1.5em;
  position: relative;
  transition: color .2s ease 0s;
}

.ec-form__parts--radio_label:hover,
input[type="radio"]:checked + .ec-form__parts--radio_label {
  color: var(--form-green);
}

.ec-form__parts--radio_label::before {
  border: 1px solid var(--form-gray);
  border-radius: 50%;
  content: "";
  height: 1em;
  left: 0;
  position: absolute;
  top: calc(50% - .5em);
  transition: border-color .2s ease 0s;
  width: 1em;
}

input[type="radio"]:checked + .ec-form__parts--radio_label::before {
  border-color: var(--form-green);
}

.ec-form__parts--radio_label::after {
  background-color: var(--form-green);
  border-radius: 50%;
  content: "";
  height: .6em;
  left: .2em;
  opacity: 0;
  position: absolute;
  top: calc(50% - .3em);
  transition: opacity .1s ease 0s;
  width: .6em;
}

input[type="radio"]:checked + .ec-form__parts--radio_label::after {
  opacity: 1;
}

#data-leader_subscription .ec-form__parts--radio_label,
#data-leader_subscription .ec-form__contents--page_info-payment_bank {
  display: none;
}

/* form parts - pull-down */
.ec-form__parts--pull-down {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--form-white);
  border: 1px solid #333;
  border-radius: 10px;
  cursor: pointer;
  outline: none;
  width: 100%;
}

/* form parts - input */
.ec-form__parts--input {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--form-white);
  border: 1px solid #333;
  border-radius: 10px;
  outline: none;
  transition: all .2s ease 0s;
  width: 100%;
}

.ec-form__parts--input[data-is-valid="false"] {
  background-color: var(--form-light-red);
  border-color: var(--form-red);
}

/* form parts - checkbox */
.ec-form__parts--checkbox_label {
  cursor: pointer;
  line-height: 1.4;
  padding-left: 1.5em;
  position: relative;
  transition: color .2s ease 0s;
}

.ec-form__parts--checkbox_label:hover,
input[type="checkbox"]:checked + .ec-form__parts--checkbox_label,
.ec-form__parts--checkbox_label[data-is-checked="true"] {
  color: var(--form-green);
}

.ec-form__parts--checkbox_label::before {
  border: 1px solid var(--form-gray);
  content: "";
  height: 1em;
  left: 0;
  position: absolute;
  top: calc(50% - .5em);
  transition: border-color .2s ease 0s;
  width: 1em;
}

input[type="checkbox"]:checked + .ec-form__parts--checkbox_label::before,
.ec-form__parts--checkbox_label[data-is-checked="true"]::before {
  border-color: var(--form-green);
}

.ec-form__parts--checkbox_label::after {
  border-bottom: 3px solid var(--form-green);
  border-right: 3px solid var(--form-green);
  content: "";
  height: .8em;
  left: .25em;
  opacity: 0;
  position: absolute;
  top: calc(50% - .5em);
  transform: rotate(40deg);
  transition: opacity .1s ease 0s;
  width: .5em;
}

input[type="checkbox"]:checked + .ec-form__parts--checkbox_label::after,
.ec-form__parts--checkbox_label[data-is-checked="true"]::after {
  opacity: 1;
}

/* textarea */
.ec-form__parts--textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--form-white);
  border: 1px solid #333;
  border-radius: 10px;
  line-height: 1.4;
  margin-top: 10px;
  outline: none;
  resize: vertical;
  transition: all .2s ease 0s;
  width: 100%;
}

.ec-form__parts--textarea[data-is-valid="false"] {
  background-color: var(--form-light-red);
  border-color: var(--form-red);
}

/* form page */
.ec-form__contents {
  margin-top: clamp(30px, 1.723rem + 0.65vw, 40px);
  position: relative;
}

._excel-day1:has(.js__is-active[data-page="6"]) .ec-form__contents {
  margin-top: 0;
}

.ec-form__contents--page {
  display: none;
  left: 0;
  /* opacity: 0; */
  position: absolute;
  top: 0;
  /* transition: all .2s ease 0s; */
  /* visibility: hidden; */
  width: 100%;
}

.js__is-active {
  display: block;
  /* opacity: 1; */
  /* visibility: visible; */
}

.ec-form__contents--page-inner {
  height: calc(100vh - (clamp(30px, 1.723rem + 0.65vw, 40px) + clamp(3px, 0.157rem + 0.13vw, 5px) + 10px + clamp(16px, 0.879rem + 0.52vw, 24px) + 20px + clamp(1.6rem, 1.406rem + 0.83vw, 2.4rem) + clamp(30px, 1.268rem + 2.59vw, 70px) + 64px));
  overflow-y: scroll;
  padding: 0 8%; 
}

@media all and (min-width: 960px) {
  .ec-form__contents--page-inner {
    height: calc(100vh - (clamp(30px, 1.723rem + 0.65vw, 40px) + clamp(3px, 0.157rem + 0.13vw, 5px) + 10px + clamp(16px, 0.879rem + 0.52vw, 24px) + 5px + clamp(1.6rem, 1.406rem + 0.83vw, 2.4rem) + clamp(30px, 1.268rem + 2.59vw, 70px) + 17vh + 60px));
  }

  .ec-form__contents--page-inner:has(.ec-form__contents--page_confirm-privacy-policy-check) {
    height: calc(100vh - (clamp(30px, 1.268rem + 2.59vw, 70px) + 17vh + 60px));
  }
}

/* button */
.ec-form__contents--page_btn {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 0.795rem + 1.94vw, 50px);
  justify-content: center;
  padding-bottom: 20px;
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_btn {
    flex-direction: row;
  }
}

.ec-form__contents--page_btn_prev,
.ec-form__contents--page_btn_next {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  align-items: center;
  border: 0;
  border-radius: 6px;
  box-shadow: 0px 3px 6px rgba(0,0,0,.15);
  color: #fff;
  display: flex;
  font-size: clamp(12px, 0.689rem + 0.26vw, 16px);
  font-weight: 700;
  height: 44px;
  justify-content: center;
  position: relative;
  transform: translateY(0px);
}

.ec-form__contents--page_btn_prev {
  background-color: var(--form-gray);
  order: 2;
  transition: transform .2s ease 0s;
  width: 190px;
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_btn_prev {
    order: 1;
  }
}

.ec-form__contents--page_btn_next {
  background-color: var(--form-orange);
  max-width: 364px;
  opacity: 1;
  order: 1;
  transition: all .2s ease 0s;
  width: 100%;
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_btn_next {
    order: 2;
    height: 55px;
  }
}

.ec-form__contents--page_btn_prev:hover,
.ec-form__contents--page_btn_next:hover {
  transform: translateY(3px);
}

.ec-form__contents--page_btn_next:disabled {
  opacity: .2;
}

.ec-form__contents--page_btn_next:disabled:hover {
  transform: translateY(0);
}

.ec-form__contents--page_btn_prev::before,
.ec-form__contents--page_btn_next::after {
  background: url(../../images/icon/next-arrow--white.svg) no-repeat center/contain;
  content: "";
  height: clamp(12px, 0.689rem + 0.26vw, 16px);
  position: absolute;
  top: calc(50% - clamp(6px, 0.345rem + 0.13vw, 8px));
  width: clamp(12px, 0.689rem + 0.26vw, 16px);
}

.ec-form__contents--page_btn_prev::before {
  left: 1em;
  transform: rotate(180deg);
}

.ec-form__contents--page_btn_next::after {
  right: 1em;
}

/* privacy-policy & data leader plan */
.ec-form__contents--page_privacy-policy,
.ec-form__contents--page_dataleader-plan {
  border: 1px solid #333;
  border-radius: 10px;
  height: 36vh;
  margin: clamp(30px, 1.723rem + 0.65vw, 40px) 0 clamp(35px, 1.96rem + 0.97vw, 50px);
  overflow: hidden;
}

.ec-form__contents--page_privacy-policy_inner,
.ec-form__contents--page_dataleader-plan_inner {
  border-radius: 10px;
  font-size: 14px;
  height: 100%;
  overflow-y: scroll;
  padding: clamp(15px, 0.558rem + 1.62vw, 40px) clamp(10px, 0.094rem + 2.27vw, 45px);
}

.ec-form__contents--page_privacy-policy_section:not(:first-of-type),
.ec-form__contents--page_dataleader-plan_section:not(:first-of-type) {
  margin-top: 2em;
}

.ec-form__contents--page_privacy-policy_head,
.ec-form__contents--page_dataleader-plan_head {
  font-weight: 700;
  margin-bottom: .5em;
}

/* notice */
.ec-form__contents--page_notice {
  line-height: 1.4;
  margin-top: 35px;
}

.ec-form__contents--page_notice_strong {
  color: var(--form-red);
  font-weight: 700;
  margin: 0 4px;
}

.ec-form__contents--page_notice_list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 20px 0 clamp(50px, 2.822rem + 1.29vw, 70px);
}

.ec-form__contents--page_notice {
  line-height: 1.4;
  margin-top: 35px;
}

.ec-form__contents--page_notice_list li {
  display: flex;
  line-height: 1.4;
}

.ec-form__contents--page_notice_list li::before {
  content: "・";
}

.ec-form__contents--page_bot-notice {
  display: flex;
  flex-direction: column;
  gap: .6em;
}

.ec-form__contents--page_bot-notice_text {
  line-height: 1.4;
  padding-left: 1em;
  position: relative;
}

.ec-form__contents--page_bot-notice_text::before {
  content: "・";
  display: inline-block;
  left: 0;
  position: absolute;
  top: 0;
}

.ec-form__contents--page_bot-notice_text_non-dot::before {
  content: none;
}

.ec-form__contents--page_bot-notice_btn {
  margin-top: clamp(50px, 2.822rem + 1.29vw, 70px);
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_notice_list {
    margin-bottom: 100px;
  }

  .ec-form__contents--page_bot-notice_btn {
    margin-top: 100px;
  }
}

/* info-datetime */
.ec-form__contents--page_info-datetime_participation {
  /* margin-top: 1em; */
  margin-top: 2em;
}

.ec-form__contents--page_info-datetime_btn {
  margin-top: 70px;
}

/* info-general */
.ec-form__contents--page_info-general {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ec-form__contents--page_info-general:not(:first-of-type) {
  /* margin-top: .5em; */
  margin-top: 2em;
}

.ec-form__contents--page_info-general_btn {
  margin-top: 70px;
}

/* info-contact */
.ec-form__contents--page_info-contact {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ec-form__contents--page_info-contact:not(:first-of-type) {
  /* margin-top: .5em; */
  margin-top: 2em;
}

.ec-form__contents--page_info-contact_btn {
  margin-top: 70px;
}

/* info-course */
.ec-form__contents--page_info-course_list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}

.ec-form__contents--page_info-course_btn {
  margin-top: 70px;
}

/* info-contents */
.ec-form__contents--page_info-contents_course-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}

.ec-form__contents--page_info-contents_timing {
  /* margin-top: .5em; */
  margin-top: 2em;
}

.ec-form__contents--page_info-contents_btn {
  margin-top: 70px;
}

/* info-payment */
.ec-form__contents--page_info-payment {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 10px;
}

.ec-form__contents--page_info-payment_card {
  overflow: hidden;
}

.ec-form__contents--page_payjp-field {
  display: flex;
  flex-direction: column;
  gap: 15px;
  height: 0;
  margin: 0 0 0 1.5em;
}

input[value="card"]:checked ~ .ec-form__contents--page_payjp-field {
  height: auto;
  margin: 1em 0 2em 1.5em;
}

#data-leader_subscription .ec-form__contents--page_payjp-field {
  margin: 0 0 2em;
}

.ec-form__contents--page_payjp-field_wrapper {
  align-items: center;
  display: flex;
}

input.ec-form__contents--page_payjp-field_input {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  padding: 0;
}

.ec-form__contents--page_payjp-field_input {
  align-items: center;
  background-color: var(--form-white);
  border: 1px solid #333;
  border-radius: 10px;
  display: flex;
  height: 2.2em;
  margin-top: 4px;
  padding-left: 10px!important;
  transition: all .2s ease 0s;
  width: 100%;
}

.ec-form__contents--page_payjp-field_input[data-is-valid="false"] {
  background-color: var(--form-light-red);
  border-color: var(--form-red);
}

.ec-form__contents--page_info-payment_btn {
  margin-top: 70px;
}

/* confirm */
.ec-form__contents--page_confirm-head {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

.ec-form__contents--page_confirm-note {
  color: var(--form-red);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}

.ec-form__contents--page_confirm-table {
  border-top: 1px solid var(--form-grayish-dark-green);
  font-size: clamp(14px, 0.845rem + 0.13vw, 16px);
  line-height: 1.4;
  margin: 1em auto;
  max-width: 600px;
  position: relative;
  width: 100%;
}

/* .ec-form__contents--page_confirm-table::before {
  background-color: var(--form-grayish-green);
  content: "";
  height: calc(100% - 35px - 10px);
  left: 0;
  position: absolute;
  top: 0;
  width: clamp(100px, 4.43rem + 7.77vw, 220px);
} */

.ec-form__contents--page_confirm-table::after {
  background: url(../../images/icon/excelcamp-down-arrow.svg) no-repeat center/contain;
  content: "";
  display: block;
  height: 35px;
  margin: 10px auto 0;
  width: 65px;
}

.ec-form__contents--page_confirm-table:has(+ .ec-form__contents--page_confirm-privacy-policy-check)::after {
  display: none;
}

@media all and (min-width: 960px) {
  /* .ec-form__contents--page_confirm-table::before {
    height: 100%;
    width: clamp(190px, 10rem + 3.13vw, 220px);
  } */

  .ec-form__contents--page_confirm-table::after {
    display: none;
  }
}

.ec-form__contents--page_confirm-table_item {
  align-items: center;
  border-bottom: 1px solid var(--form-grayish-dark-green);
  display: flex;
  position: relative;
}

.ec-form__contents--page_confirm-table_item dt {
  align-items: center;
  background: var(--form-grayish-green);
  display: flex;
  flex-shrink: 0;
  height: stretch;
  padding: clamp(8px, 0.439rem + 0.26vw, 12px) clamp(7px, 0.392rem + 0.19vw, 10px);
  width: clamp(100px, 4.43rem + 7.77vw, 220px);
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_confirm-table_item dt {
    width: clamp(190px, 10rem + 3.13vw, 220px);
  }
}

.ec-form__contents--page_confirm-table_item dd {
  padding: clamp(8px, 0.439rem + 0.26vw, 12px) clamp(15px, 0.862rem + 0.32vw, 20px);
  word-break: break-all;
}

.ec-form__contents--page_confirm-privacy-policy-check {
  align-items: center;
  display: flex;
  gap: .5em;
  margin: 0 auto -2rem;
  max-width: 600px;
  width: 100%;
}

@media all and (min-width: 960px) {
  .ec-form__contents--page_confirm-privacy-policy-check {
    margin-bottom: -3rem;
  }
}

.ec-form__contents--page_confirm-privacy-policy-check input {
  cursor: pointer;
}

.ec-form__contents--page_confirm-privacy-policy-check label {
  font-size: clamp(14px, 0.845rem + 0.13vw, 16px);
}

.ec-form__contents--page_confirm-privacy-policy-check label a {
  font-size: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ec-form__contents--page_confirm_btn {
  margin-top: 70px;
}

/* error */
.ec-form__error {
  align-items: center;
  color: var(--form-red);
  display: flex;
  font-size: 14px;
  line-height: 1.4;
  margin-top: 5px;
}

.ec-form__error::before {
  background: url(../../images/icon/caution.svg) no-repeat center/contain;
  content: "";
  flex-shrink: 0;
  height: 14px;
  margin-right: 5px;
  width: 14px;
}

.ec-form__error[data-is-shown="false"] {
  display: none;
}

/* processing animation */
.ec-form__processing {
  align-items: center;
  background-color: rgba(0,0,0,.85);
  bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  left: 0;
  opacity: 0;
  position: fixed;
  right: 0;
  top: 0;
  transition: all .2s ease 0s;
  visibility: hidden;
  z-index: 9999;
}

.ec-form__processing[data-is-shown="true"] {
  opacity: 1;
  visibility: visible;
}

.ec-form__processing--logo {
  animation: logo-rotation 2s linear infinite 0s;
  background: url(../../images/logo/excelcamp_logo-white.svg) no-repeat center/contain;
  height: 75px;
  width: 100px;
}

@keyframes logo-rotation {
  0% {
    transform: rotateY(180deg);
  }
  50% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(180deg);
  }
}

.ec-form__processing--progress {
  align-items: center;
  background-color: var(--form-white);
  border-radius: 9999px;
  display: flex;
  height: 10px;
  margin-top: 10px;
  padding: 0 4px;
  position: relative;
  width: 120px;
}

.ec-form__processing--progress-indicator {
  background-color: var(--form-green);
  border-radius: 9999px;
  height: 6px;
  transition: width .4s linear 0s; 
}

.ec-form__processing--progress-indicator[data-progress="0"] {
  width: 0;
}

.ec-form__processing--progress-indicator[data-progress="10"] {
  width: 10%;
}

.ec-form__processing--progress-indicator[data-progress="20"] {
  width: 20%;
}

.ec-form__processing--progress-indicator[data-progress="30"] {
  width: 30;
}

.ec-form__processing--progress-indicator[data-progress="40"] {
  width: 40%;
}

.ec-form__processing--progress-indicator[data-progress="50"] {
  width: 50;
}

.ec-form__processing--progress-indicator[data-progress="60"] {
  width: 60%;
}

.ec-form__processing--progress-indicator[data-progress="70"] {
  width: 70;
}

.ec-form__processing--progress-indicator[data-progress="80"] {
  width: 80%;
}

.ec-form__processing--progress-indicator[data-progress="90"] {
  width: 90;
}

.ec-form__processing--progress-indicator[data-progress="100"] {
  width: 100%;
}

/* thanks */
.ec-thanks__container {
  align-items: center;
  display: flex;
  justify-content: center;
  padding-top: var(--clamp-80sp);
}

@media all and (min-width: 960px) {
  .ec-thanks__container {
    align-items: flex-start;
    background-image: var(--form-bg-gradation);
    min-height: 100vh;
    padding: var(--clamp-80) 0;
  }
}

.ec-thanks__wrapper {
  padding-bottom: clamp(30px, 1.268rem + 2.59vw, 70px);
}

@media all and (min-width: 960px) {
  .ec-thanks__wrapper {
    background-color: var(--form-white);
    margin-top: 6em;
    padding: clamp(30px, 1.268rem + 2.59vw, 70px) 10%;
    width: 76.5%;
  }
}

.ec-thanks__main {
  background-color: rgba(239,239,46,.1);
  margin :0 auto;
  max-width: 820px;
  padding: clamp(30px, 1.268rem + 2.59vw, 70px) 25px;
  width: 100%;
}

@media all and (min-width: 960px) {
  .ec-thanks__main {
    background-color: var(--form-white);
    padding: 0;
  }
}

.ec-thanks__main--h2 {
  color: var(--form-dark-green);
  font-size: clamp(14px, 0.845rem + 0.13vw, 16px);
  font-weight: 500;
  margin-top: clamp(24px, 0.742rem + 3.24vw, 74px);
}

.ec-thanks__main--text {
  color: var(--form-dark-green);
  font-size: clamp(12px, 0.72rem + 0.13vw, 14px);
  margin-top: clamp(20px, 1.098rem + 0.65vw, 30px);
}

.ec-thanks__main--text a:hover {
  text-decoration: underline;
}

.ec-thanks__notes {
  border: 1px solid #4ca270;
  margin: clamp(20px, 0.947rem + 1.29vw, 40px) auto 0;
  max-width: 820px;
  width: calc(100% - 50px);
}

@media all and (min-width: 960px) {
  .ec-thanks__notes {
    width: 100%;
  }
}

.ec-thanks__notes--h2 {
  align-items: center;
  background-color: #4ca270;
  color: var(--form-white);
  display: flex;
  font-size: clamp(14px, 0.845rem + 0.13vw, 16px);
  font-weight: 500;
  height: clamp(28px, 1.72rem + 0.13vw, 30px);
  justify-content: center;
}

.ec-thanks__notes--text {
  background-color: #cde9d7;
  display: flex;
  flex-direction: column;
  font-size: clamp(12px, 0.72rem + 0.13vw, 14px);
  gap: 1em;
  padding: 20px 18px 35px;
}

.ec-thanks__link--btn {
  background-color: var(--form-orange);
  border-radius: 6px;
  box-shadow: 0 3px 6px rgba(0,0,0,.15);
  color: var(--form-white);
  display: block;
  font-size: clamp(12px, 0.689rem + 0.26vw, 16px);
  font-weight: 700;
  line-height: clamp(44px, 2.583rem + 0.71vw, 55px);
  margin: clamp(50px, 2.367rem + 3.24vw, 100px) auto 0;
  max-width: 364px;
  text-align: center;
  transform: translateY(0px);
  transition: transform .2s ease 0s;
  width: calc(100% - 50px);
}

.ec-thanks__link--btn:hover {
  transform: translateY(3px);
}

/* 
 * single-step form
 */
main:has(.ec-single-step-form__container) {
  padding-bottom: 0;
}

.ec-single-step-form__container {
  background-image: var(--form-bg-gradation);
  padding-top: var(--clamp-100sp);
  width: 100%;
}

.ec-single-step-form__infomation {
  align-items: center;
  background-color: var(--form-white);
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  padding: var(--clamp-12sp) 0 var(--clamp-35sp);
  width: var(--clamp-351sp);
}

.ec-single-step-form__infomation .ec-form__progress {
  display: none;
}

.ec-single-step-form__h1 {
  color: var(--dark-green_3);
  font-size: var(--clamp-16sp);
  font-weight: 700;
}

.ec-single-step-form__information--contents {
  background: #feffe6;
  margin: var(--clamp-16sp) auto 0;
  padding: var(--clamp-12sp) var(--clamp-25sp) var(--clamp-12sp) var(--clamp-19sp);
  width: var(--clamp-327sp);
}

.ec-single-step-form__information--contents h2 {
  color: var(--dark-green_3);
  font-size: var(--clamp-16sp);
  font-weight: 700;
  text-align: center;
}

.ec-single-step-form__information--contents_list {
  display: flex;
  flex-direction: column;
  gap: var(--clamp-9sp);
  margin-top: var(--clamp-12sp);
}

.ec-single-step-form__information--contents_list::after {
  content: "など";
  font-size: var(--clamp-12sp);
  font-weight: 400;
  margin-top: calc(var(--clamp-9sp) * -1);
  text-align: right;
}

.ec-single-step-form__information--contents_list li {
  display: flex;
  font-size: var(--clamp-16sp);
  font-weight: 400;
  line-height: 1.4;
  gap: var(--clamp-11sp);
}

.ec-single-step-form__information--contents_list li::before {
  background: url(../../images/icon/checkbox-icon.svg) no-repeat center/contain;
  content: "";
  flex-shrink: 0;
  height: var(--clamp-15sp);
  transform: translateY(var(--clamp-3sp));
  width: var(--clamp-16sp);
}

.ec-single-step-form__information--contents_text {
  display: flex;
  flex-direction: column;
  gap: var(--clamp-12sp);
  margin: var(--clamp-20sp) auto 0;
  width: var(--clamp-334sp);
}

.ec-single-step-form__information--contents_text p {
  font-size: var(--clamp-16sp);
  font-weight: 400;
  line-height: 1.44;
}

.ec-single-step-form__form-wrapper {
  background: var(--form-white);
  margin-top: var(--clamp-31sp);
  padding-top: var(--clamp-31sp);
  width: 100%;
}

.ec-single-step-form__contents {
  margin: 0 auto;
  width: var(--clamp-351sp);
}

.ec-single-step-form__contents--item-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--clamp-20sp);
}

.ec-single-step-form__contents--item_required,
.ec-single-step-form__contents--item_any {
  align-items: center;
  color: var(--dark-green_3);
  display: flex;
  font-size: var(--clamp-16sp);
  font-weight: 700;
  gap: var(--clamp-5sp);
}

.ec-single-step-form__contents--item_required::after {
  align-items: center;
  background: #d40000;
  border-radius: 9999px;
  color: white;
  content: "必須";
  display: flex;
  font-size: var(--clamp-12sp);
  font-weight: 700;
  height: var(--clamp-20sp);
  justify-content: center;
  width: var(--clamp-40sp);
}

.ec-single-step-form__contents--item input,
.ec-single-step-form__contents--item textarea {
  border-color: #bdbdbd;
  border-radius: var(--clamp-6sp);
  margin-top: var(--clamp-4sp);
}

.ec-single-step-form__contents--item textarea {
  height: var(--clamp-240sp);
  min-height: var(--clamp-240sp);
}

.ec-single-step-form__contents--item input::placeholder,
.ec-single-step-form__contents--item textarea::placeholder {
  color: #bdbdbd;
}

.ec-single-step-form__contents--item_checkbox {
  display: flex;
  flex-direction: column;
  gap: var(--clamp-26sp);
  margin-top: var(--clamp-10sp);
  padding-left: var(--clamp-12sp);
}

.ec-single-step-form__contents--item_multi-box {
  display: flex;
  flex-direction: column;
  gap: var(--clamp-20sp);
}

.ec-single-step-form__contents--item_multi-box span {
  font-size: var(--clamp-16sp);
  font-weight: 400;
}

.ec-single-step-form__contents--item_multi-box label {
  font-size: var(--clamp-16sp);
  font-weight: 400;
  margin-left: var(--clamp-26sp);
}

.ec-single-step-form__contents--item_single-box label {
  font-size: var(--clamp-16sp);
  font-weight: 400;
}

.ec-single-step-form__contents--item:has(input[name="privacy-policy"]) {
  text-align: center;
}

input[name="privacy-policy"] + .ec-form__parts--checkbox_label {
  font-size: var(--clamp-16sp);
  font-weight: 400;
}

input[name="privacy-policy"] + .ec-form__parts--checkbox_label:hover,
input[name="privacy-policy"]:checked + .ec-form__parts--checkbox_label {
  color: #525252;
}

@media all and (min-width: 960px) {
  main:has(.ec-single-step-form__container) ~ .ec-footer {
    margin-top: 0!important;
  }

  .ec-single-step-form__container {
    align-items: flex-start;
    display: flex;
    flex-direction: row;
    gap: var(--clamp-66);
    justify-content: center;
    padding: var(--clamp-154) 0 var(--clamp-40);
  }

  .ec-single-step-form__infomation {
    border: var(--clamp-4) solid #e5eed3;
    border-radius: var(--clamp-20);
    margin: 0;
    padding: var(--clamp-43) var(--clamp-42) var(--clamp-68);
    width: var(--clamp-500);
  }

  .ec-single-step-form__h1 {
    font-size: var(--clamp-24);
  }

  .ec-single-step-form__information--contents {
    margin: var(--clamp-26) 0 0;
    padding: var(--clamp-22) var(--clamp-34);
    width: 100%;
  }

  .ec-single-step-form__information--contents h2 {
    font-size: var(--clamp-20);
  }

  .ec-single-step-form__information--contents_list {
    gap: var(--clamp-13);
    margin-top: var(--clamp-17);
  }

  .ec-single-step-form__information--contents_list::after {
    font-size: var(--clamp-12);
    margin: 0 0 0 var(--clamp-32);
    text-align: left;
  }

  .ec-single-step-form__information--contents_list li {
    align-items: center;
    font-size: var(--clamp-16);
    gap: var(--clamp-10);
  }

  .ec-single-step-form__information--contents_list li::before {
    height: var(--clamp-22);
    transform: translateY(0);
    width: var(--clamp-22);
  }

  .ec-single-step-form__information--contents_text {
    gap: var(--clamp-22);
    margin: var(--clamp-44) auto 0;
    width: var(--clamp-417);
  }

  .ec-single-step-form__information--contents_text p {
    font-size: var(--clamp-20);
  }

  .ec-single-step-form__form-wrapper {
    border: var(--clamp-4) solid #a4bdaf;
    border-radius: var(--clamp-20);
    margin-top: 0;
    padding: var(--clamp-44) var(--clamp-44) var(--clamp-20);
    width: var(--clamp-625);
  }

  .ec-single-step-form__contents {
    margin: 0;
    width: 100%;
  }

  .ec-single-step-form__contents--item-wrapper {
    gap: var(--clamp-20);
  }

  .ec-single-step-form__contents--item_required,
  .ec-single-step-form__contents--item_any {
    font-size: var(--clamp-20);
    gap: var(--clamp-10);
  }

  .ec-single-step-form__contents--item_required::after {
    font-size: var(--clamp-14);
    height: var(--clamp-22);
    width: var(--clamp-44);
  }

  .ec-single-step-form__contents--item input,
  .ec-single-step-form__contents--item textarea {
    border-radius: var(--clamp-6);
    margin-top: var(--clamp-5);
  }

  .ec-single-step-form__contents--item textarea {
    height: var(--clamp-230);
    min-height: var(--clamp-230);
  }

  .ec-single-step-form__contents--item_checkbox {
    display: flex;
    flex-direction: column;
    gap: var(--clamp-36);
    margin-top: var(--clamp-21);
    padding-left: 0;
  }

  .ec-single-step-form__contents--item_multi-box {
    flex-direction: row;
    flex-wrap: wrap;
    gap: unset;
    padding-left: var(--clamp-54);
  }

  .ec-single-step-form__contents--item_multi-box span {
    font-size: var(--clamp-20);
    transform: translateX(calc(var(--clamp-54) * -1));
    width: 55%;
  }

  .ec-single-step-form__contents--item_multi-box label {
    font-size: var(--clamp-20);
    margin-left: 0;
    margin-top: var(--clamp-26);
    width: 49%;
  }

  .ec-single-step-form__contents--item_single-box label {
    font-size: var(--clamp-20);
  }

  input[name="privacy-policy"] + .ec-form__parts--checkbox_label {
    font-size: var(--clamp-20);
  }

  .ec-single-step-form__contents--item_single-box label::before,
  .ec-single-step-form__contents--item_single-box label::after,
  input[name="privacy-policy"] + .ec-form__parts--checkbox_label::before,
  input[name="privacy-policy"] + .ec-form__parts--checkbox_label::after {
    top: calc(50% - .4em);
  }
  
  .ec-single-page-form__contents--btn-wrapper {
    margin-top: 24px;
  }
}