/*登録フロー用*/
html {
  scroll-behavior: smooth;
}
:root {
  --header-height: 80px;
}
header {
  height: var(--header-height);
}
:target {
  scroll-margin-top: var(--header-height);
}
.l-new-flow {
  padding-top: 0px !important;
  /*margin-top: -15px !important;*/
}
.l-new-flow .steplist {
  padding: 8px 10px 12px;
  margin: 0 0 30px;
}
.l-new-flow .fixedsteplist {
  top: unset !important;
  position: unset !important;
  left: unset !important;
  transform: unset !important;
}
.l-new-flow .steplist ol li.item {
  padding: 50px 0 0;
  width: 20%;
  position: relative;
}

.l-new-flow .steplist ol li.item:not(:last-of-type):after {
  content: "";
  display: block;
  background: url("/img/flow/new_arrow.svg") no-repeat top 0 center;
  width: 24px;
  height: 15px;
  left: 100%;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  top: 28px;
}

.l-new-flow .button--greenarrow {
  background: #EDF5F2 url("/img/flow/icon_arrow_bottom.svg") no-repeat right 10px center !important;
}
.l-new-flow ol li a {
  text-decoration: unset !important;
}

.l-new-flow ol li.item01 {
  background: none;
}

.l-new-flow ol li.item01 a {
  background: url("/img/flow/new_icon_step_01_off.svg") no-repeat top 0 center;
}

.l-new-flow ol li.item01 a.is-active {
  background: url("/img/flow/new_icon_step_01_on.svg") no-repeat top 0 center;
  font-weight: normal;
}

.l-new-flow ol li.item02 {
  background: none;
}

.l-new-flow ol li.item02 a {
  background: url("/img/flow/new_icon_step_02_off.svg") no-repeat top 0 center;
}

.l-new-flow ol li.item02 a.is-active {
  background: url("/img/flow/new_icon_step_02_on.svg") no-repeat top 0 center;
  font-weight: normal;
}

.l-new-flow ol li.item03 {
  background: none;
}

.l-new-flow ol li.item03 a {
  background: url("/img/flow/new_icon_step_03_off.svg") no-repeat top 0 center;
}

.l-new-flow ol li.item03 a.is-active {
  background: url("/img/flow/new_icon_step_03_on.svg") no-repeat top 0 center;
  font-weight: normal;
}

.l-new-flow ol li.item04 {
  background: none;
}

.l-new-flow ol li.item04 a {
  background: url("/img/flow/new_icon_step_04_off.svg") no-repeat top 0 center;
}

.l-new-flow ol li.item04 a.is-active {
  background: url("/img/flow/new_icon_step_04_on.svg") no-repeat top 0 center;
  font-weight: normal;
}

.l-new-flow ol li.item05 {
  background: none;
}

.l-new-flow ol li.item05 a {
  background: url("/img/flow/new_icon_step_05_off.svg") no-repeat top 0 center;
}

.l-new-flow ol li.item05 a.is-active {
  background: url("/img/flow/new_icon_step_05_on.svg") no-repeat top 0 center;
  font-weight: normal;
}

.l-new-flow ol li.item06 {
  background: none;
}

.l-new-flow ol li.item06 a {
  background: url("/img/flow/new_icon_step_06_off.svg") no-repeat top 0 center;
  background-size: 24px;
}

.l-new-flow ol li.item06 a.is-active {
  background: url("/img/flow/new_icon_step_06_on.svg") no-repeat top 0 center;
  font-weight: normal;
}

.l-new-flow .sec-steps > p,
.l-new-flow .sec-steps ul {
  padding-left: 42px;
}

.l-new-flow .sec-steps > .bg-lightgreen {
  margin-left: 42px;
  padding: 14px;
}

.l-new-flow .sec-steps > .bg-lightgreen ul {
  padding: 0;
}

.l-new-flow .sec-steps > .bg-lightgreen ul li {
  position: relative;
  padding-left: 18px;
  font-size: 14px;
}

.l-new-flow .sec-steps > .bg-lightgreen ul li:not(:last-of-type) {
  margin: 0 0 4px;
}

.l-new-flow .sec-steps > .bg-lightgreen ul li:before {
  width: 6px;
  height: 6px;
  display: block;
  content: "";
  background-color: #32B988;
  border-radius: 50%;
  position: absolute;
  top: 9px;
  left: 6px;
}

.l-new-flow .sec-steps > .bg-lightgreen p.t-xs.c-gray.link a {
  font-size: 12px !important;
}

.l-new-flow .sec-steps p.f-center.t-xs {
  padding-left: 0;
}

.l-new-flow .sec-steps .icon {
  top: -16px !important;
}

.l-new-flow .sec-steps .ttl-bb {
  border-bottom: 1px solid #ddd;
  padding-bottom: 14px;
  margin-left: 42px !important;
}

.l-new-flow .sec-steps ul.f-narrow {
  margin: 0;
}

.l-new-flow .sec-steps ul.f-narrow li {
  margin: 0;
}

.l-new-flow .sec-steps ul.f-narrow li:not(:first-of-type) {
  margin-top: 30px;
}

.l-new-flow .sec-steps .link a {
  font-weight: bold;
  color: #32B988;
}

.l-new-flow .step01 .d-flex {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.l-new-flow .step01 .d-flex picture {
  margin: 0 !important;
}

.l-new-flow .step01 .d-flex picture img {
  width: 130px;
}

.l-new-flow .step01 .d-flex ul {
  margin: 0 0 0 20px !important;
  padding: 0 !important;
}

.l-new-flow .step01 .d-flex ul li:not(:last-of-type) {
  margin-bottom: 10px !important;
}

.l-new-flow .step03 picture:first-of-type {
  margin-bottom: -15px !important;
  display: block;
}

.l-new-flow .button--greenarrow {
  width: 90%;
  margin-left: 42px !important;
  text-align: left;
  padding-left: 20px;
  line-height: 40px;
}

@media screen and (min-width: 767px) {
  .l-new-flow .button--greenarrow {
    width: 706px;
  }
}

.l-new-flow .step05 .bg-lightgreen {
  margin: 0;
}

.l-new-flow .lastbox {
  padding: 20px;
}

.l-new-flow .lastbox .ttl-bb {
  border-bottom: 1px solid #ddd;
  padding-bottom: 14px;
  margin: 0 0 10px !important;
}

.l-new-flow .howto p {
  padding-left: 42px;
}