@charset "UTF-8";
/* 키프레임 */
@keyframes shake-left {
  0% {
    rotate: -1deg;
  }
  100% {
    rotate: 3deg;
  }
}
@keyframes shake-left-point {
  0% {
    rotate: -1deg;
  }
  100% {
    rotate: 1deg;
  }
}
@keyframes shake-right-point {
  0% {
    rotate: 1deg;
  }
  100% {
    rotate: -1deg;
  }
}
@keyframes shake-left-s {
  0% {
    rotate: 0deg;
  }
  25% {
    rotate: -10deg;
  }
  50% {
    rotate: 5deg;
  }
  75% {
    rotate: -10deg;
  }
  100% {
    rotate: 0deg;
  }
}
@keyframes shake-right {
  0% {
    rotate: 1deg;
  }
  100% {
    rotate: -3deg;
  }
}
@keyframes swing-left {
  0% {
    transform: translateX(-0.5rem);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes swing-top {
  0% {
    transform: translateY(-1rem);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes ani-flicker {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* 믹스인 */
body, html {
  width: 100%;
  box-sizing: border-box;
}

body {
  overflow-x: hidden;
}

.form-flex {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.form-flex button, .form-flex a {
  flex-shrink: 0;
}

.none {
  width: 0;
  height: 0;
  text-indent: -9999px;
  display: none !important;
}

.ip-cau {
  position: relative;
  color: #999999;
  font-weight: 300;
  margin-top: 1rem;
  margin-left: 2.6rem;
  display: none;
}
.ip-cau::before {
  content: "";
  background: #333333 url("data:image/svg+xml;charset=utf8,%3Csvg width='2' height='10' viewBox='0 0 2 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 1.5C0 0.947715 0.447715 0.5 1 0.5V0.5C1.55228 0.5 2 0.947715 2 1.5V5.5C2 6.05228 1.55228 6.5 1 6.5V6.5C0.447715 6.5 0 6.05228 0 5.5V1.5Z' fill='%23fff'/%3E%3Cpath d='M0 8.5C0 7.94772 0.447715 7.5 1 7.5V7.5C1.55228 7.5 2 7.94772 2 8.5V8.5C2 9.05228 1.55228 9.5 1 9.5V9.5C0.447715 9.5 0 9.05228 0 8.5V8.5Z' fill='%23fff'/%3E%3C/svg%3E%0A") no-repeat center center/0.2rem;
  width: 2rem;
  height: 2rem;
  border-radius: 100rem;
  position: absolute;
  left: -2.6rem;
  top: 0.1rem;
}
.ip-cau.warring {
  color: #d32b2b;
  font-weight: 400;
}
.ip-cau.warring::before {
  background-color: #d32b2b;
}

.mw200 {
  width: 100%;
  max-width: 20rem !important;
  transition: max-width 500ms;
}

.mw160 {
  width: 100%;
  max-width: 16rem !important;
  transition: max-width 500ms;
}

.mw120 {
  width: 100%;
  max-width: 12rem !important;
  transition: max-width 500ms;
}

.btn, .btn-r-xl-sb, .btn-r-xl-wa, .btn-r-xl-de, .btn-r-xl-po, .btn-r-xl-nm, .btn-r-lg-sb, .btn-r-lg-wa, .btn-r-lg-de, .btn-r-lg-po, .btn-r-lg-nm, .btn-r-md-sb, .btn-r-md-wa, .btn-r-md-de, .btn-r-md-po, .btn-r-md-nm, .btn-r-sm-sb, .btn-r-sm-wa, .btn-r-sm-de, .btn-r-sm-po, .btn-r-sm-nm, .btn-r-xs-sb, .btn-r-xs-wa, .btn-r-xs-de, .btn-r-xs-po, .btn-r-xs-nm, .btn-o-xl-sb, .btn-o-xl-wa, .btn-o-xl-de, .btn-o-xl-po, .btn-o-xl-nm, .btn-o-lg-sb, .btn-o-lg-wa, .btn-o-lg-de, .btn-o-lg-po, .btn-o-lg-nm, .btn-o-md-sb, .btn-o-md-wa, .btn-o-md-de, .btn-o-md-po, .btn-o-md-nm, .btn-o-sm-sb, .btn-o-sm-wa, .btn-o-sm-de, .btn-o-sm-po, .btn-o-sm-nm, .btn-o-xs-sb, .btn-o-xs-wa, .btn-o-xs-de, .btn-o-xs-po, .btn-o-xs-nm, .btn-s-xl-sb, .btn-s-xl-wa, .btn-s-xl-de, .btn-s-xl-po, .btn-s-xl-nm, .btn-s-lg-sb, .btn-s-lg-wa, .btn-s-lg-de, .btn-s-lg-po, .btn-s-lg-nm, .btn-s-md-sb, .btn-s-md-wa, .btn-s-md-de, .btn-s-md-po, .btn-s-md-nm, .btn-s-sm-sb, .btn-s-sm-wa, .btn-s-sm-de, .btn-s-sm-po, .btn-s-sm-nm, .btn-s-xs-sb, .btn-s-xs-wa, .btn-s-xs-de, .btn-s-xs-po, .btn-s-xs-nm, .btn-g-xl-sb, .btn-g-xl-wa, .btn-g-xl-de, .btn-g-xl-po, .btn-g-xl-nm, .btn-g-lg-sb, .btn-g-lg-wa, .btn-g-lg-de, .btn-g-lg-po, .btn-g-lg-nm, .btn-g-md-sb, .btn-g-md-wa, .btn-g-md-de, .btn-g-md-po, .btn-g-md-nm, .btn-g-sm-sb, .btn-g-sm-wa, .btn-g-sm-de, .btn-g-sm-po, .btn-g-sm-nm, .btn-g-xs-sb, .btn-g-xs-wa, .btn-g-xs-de, .btn-g-xs-po, .btn-g-xs-nm, .btn-xl-sb, .btn-xl-wa, .btn-xl-de, .btn-xl-po, .btn-xl-nm, .btn-lg-sb, .btn-lg-wa, .btn-lg-de, .btn-lg-po, .btn-lg-nm, .btn-md-sb, .btn-md-wa, .btn-md-de, .btn-md-po, .btn-md-nm, .btn-sm-sb, .btn-sm-wa, .btn-sm-de, .btn-sm-po, .btn-sm-nm, .btn-xs-sb, .btn-xs-wa, .btn-xs-de, .btn-xs-po, .btn-xs-nm, .btn-r-sb, .btn-r-wa, .btn-r-de, .btn-r-po, .btn-r-nm, .btn-o-sb, .btn-o-wa, .btn-o-de, .btn-o-po, .btn-o-nm, .btn-s-sb, .btn-s-wa, .btn-s-de, .btn-s-po, .btn-s-nm, .btn-g-sb, .btn-g-wa, .btn-g-de, .btn-g-po, .btn-g-nm, .btn-r-xl, .btn-r-lg, .btn-r-md, .btn-r-sm, .btn-r-xs, .btn-o-xl, .btn-o-lg, .btn-o-md, .btn-o-sm, .btn-o-xs, .btn-s-xl, .btn-s-lg, .btn-s-md, .btn-s-sm, .btn-s-xs, .btn-g-xl, .btn-g-lg, .btn-g-md, .btn-g-sm, .btn-g-xs, .btn-sb, .btn-r-xl-sb, .btn-r-lg-sb, .btn-r-md-sb, .btn-r-sm-sb, .btn-r-xs-sb, .btn-o-xl-sb, .btn-o-lg-sb, .btn-o-md-sb, .btn-o-sm-sb, .btn-o-xs-sb, .btn-s-xl-sb, .btn-s-lg-sb, .btn-s-md-sb, .btn-s-sm-sb, .btn-s-xs-sb, .btn-g-xl-sb, .btn-g-lg-sb, .btn-wa, .btn-r-xl-wa, .btn-r-lg-wa, .btn-r-md-wa, .btn-r-sm-wa, .btn-r-xs-wa, .btn-o-xl-wa, .btn-o-lg-wa, .btn-o-md-wa, .btn-o-sm-wa, .btn-o-xs-wa, .btn-s-xl-wa, .btn-s-lg-wa, .btn-s-md-wa, .btn-s-sm-wa, .btn-s-xs-wa, .btn-g-xl-wa, .btn-de, .btn-r-xl-de, .btn-r-lg-de, .btn-r-md-de, .btn-r-sm-de, .btn-r-xs-de, .btn-o-xl-de, .btn-o-lg-de, .btn-o-md-de, .btn-o-sm-de, .btn-o-xs-de, .btn-s-xl-de, .btn-s-lg-de, .btn-s-md-de, .btn-s-sm-de, .btn-s-xs-de, .btn-g-xl-de, .btn-po, .btn-r-xl-po, .btn-r-lg-po, .btn-r-md-po, .btn-r-sm-po, .btn-r-xs-po, .btn-o-xl-po, .btn-o-lg-po, .btn-o-md-po, .btn-o-sm-po, .btn-o-xs-po, .btn-s-xl-po, .btn-s-lg-po, .btn-s-md-po, .btn-s-sm-po, .btn-s-xs-po, .btn-g-xl-po, .btn-nm, .btn-r-xl-nm, .btn-r-lg-nm, .btn-r-md-nm, .btn-r-sm-nm, .btn-r-xs-nm, .btn-o-xl-nm, .btn-o-lg-nm, .btn-o-md-nm, .btn-o-sm-nm, .btn-o-xs-nm, .btn-s-xl-nm, .btn-s-lg-nm, .btn-s-md-nm, .btn-s-sm-nm, .btn-s-xs-nm, .btn-g-xl-nm, .btn-xl, .btn-r-xl-sb, .btn-r-xl-wa, .btn-r-xl-de, .btn-r-xl-po, .btn-r-xl-nm, .btn-o-xl-sb, .btn-o-xl-wa, .btn-o-xl-de, .btn-o-xl-po, .btn-o-xl-nm, .btn-s-xl-sb, .btn-s-xl-wa, .btn-s-xl-de, .btn-s-xl-po, .btn-s-xl-nm, .btn-g-xl-sb, .btn-g-xl-wa, .btn-g-xl-de, .btn-g-xl-po, .btn-g-xl-nm, .btn-lg, .btn-r-lg-sb, .btn-r-lg-wa, .btn-r-lg-de, .btn-r-lg-po, .btn-r-lg-nm, .btn-o-lg-sb, .btn-o-lg-wa, .btn-o-lg-de, .btn-o-lg-po, .btn-o-lg-nm, .btn-s-lg-sb, .btn-s-lg-wa, .btn-s-lg-de, .btn-s-lg-po, .btn-s-lg-nm, .btn-g-lg-sb, .btn-md, .btn-r-md-sb, .btn-r-md-wa, .btn-r-md-de, .btn-r-md-po, .btn-r-md-nm, .btn-o-md-sb, .btn-o-md-wa, .btn-o-md-de, .btn-o-md-po, .btn-o-md-nm, .btn-s-md-sb, .btn-s-md-wa, .btn-s-md-de, .btn-s-md-po, .btn-s-md-nm, .btn-sm, .btn-r-sm-sb, .btn-r-sm-wa, .btn-r-sm-de, .btn-r-sm-po, .btn-r-sm-nm, .btn-o-sm-sb, .btn-o-sm-wa, .btn-o-sm-de, .btn-o-sm-po, .btn-o-sm-nm, .btn-s-sm-sb, .btn-s-sm-wa, .btn-s-sm-de, .btn-s-sm-po, .btn-s-sm-nm, .btn-xs, .btn-r-xs-sb, .btn-r-xs-wa, .btn-r-xs-de, .btn-r-xs-po, .btn-r-xs-nm, .btn-o-xs-sb, .btn-o-xs-wa, .btn-o-xs-de, .btn-o-xs-po, .btn-o-xs-nm, .btn-s-xs-sb, .btn-s-xs-wa, .btn-s-xs-de, .btn-s-xs-po, .btn-s-xs-nm, .btn-r, .btn-r-xl-sb, .btn-r-xl-wa, .btn-r-xl-de, .btn-r-xl-po, .btn-r-xl-nm, .btn-r-lg-sb, .btn-r-lg-wa, .btn-r-lg-de, .btn-r-lg-po, .btn-r-lg-nm, .btn-r-md-sb, .btn-r-md-wa, .btn-r-md-de, .btn-r-md-po, .btn-r-md-nm, .btn-r-sm-sb, .btn-r-sm-wa, .btn-r-sm-de, .btn-r-sm-po, .btn-r-sm-nm, .btn-r-xs-sb, .btn-r-xs-wa, .btn-r-xs-de, .btn-r-xs-po, .btn-r-xs-nm, .btn-o, .btn-o-xl-sb, .btn-o-xl-wa, .btn-o-xl-de, .btn-o-xl-po, .btn-o-xl-nm, .btn-o-lg-sb, .btn-o-lg-wa, .btn-o-lg-de, .btn-o-lg-po, .btn-o-lg-nm, .btn-o-md-sb, .btn-o-md-wa, .btn-o-md-de, .btn-o-md-po, .btn-o-md-nm, .btn-o-sm-sb, .btn-o-sm-wa, .btn-o-sm-de, .btn-o-sm-po, .btn-o-sm-nm, .btn-o-xs-sb, .btn-o-xs-wa, .btn-o-xs-de, .btn-o-xs-po, .btn-o-xs-nm, .btn-s, .btn-s-xl-sb, .btn-s-xl-wa, .btn-s-xl-de, .btn-s-xl-po, .btn-s-xl-nm, .btn-s-lg-sb, .btn-s-lg-wa, .btn-s-lg-de, .btn-s-lg-po, .btn-s-lg-nm, .btn-s-md-sb, .btn-s-md-wa, .btn-s-md-de, .btn-s-md-po, .btn-s-md-nm, .btn-s-sm-sb, .btn-s-sm-wa, .btn-s-sm-de, .btn-s-sm-po, .btn-s-sm-nm, .btn-s-xs-sb, .btn-s-xs-wa, .btn-s-xs-de, .btn-s-xs-po, .btn-s-xs-nm, .btn-g, .btn-g-xl-sb, .btn-g-xl-wa, .btn-g-xl-de, .btn-g-xl-po, .btn-g-xl-nm, .btn-g-lg-sb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-family: inherit;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.3s ease;
  line-height: 1;
}
.btn-g, .btn-g-xl-sb, .btn-g-xl-wa, .btn-g-xl-de, .btn-g-xl-po, .btn-g-xl-nm, .btn-g-lg-sb, .btn-g-lg-wa, .btn-g-lg-de, .btn-g-lg-po, .btn-g-lg-nm, .btn-g-md-sb, .btn-g-md-wa, .btn-g-md-de, .btn-g-md-po, .btn-g-md-nm, .btn-g-sm-sb, .btn-g-sm-wa, .btn-g-sm-de, .btn-g-sm-po, .btn-g-sm-nm, .btn-g-xs-sb, .btn-g-xs-wa, .btn-g-xs-de, .btn-g-xs-po, .btn-g-xs-nm, .btn-g-sb, .btn-g-wa, .btn-g-de, .btn-g-po, .btn-g-nm, .btn-g-xl, .btn-g-lg, .btn-g-md, .btn-g-sm, .btn-g-xs {
  background: transparent;
  border: none;
  color: #777777;
  border-radius: 0.4rem;
}
.btn-s, .btn-s-xl-sb, .btn-s-xl-wa, .btn-s-xl-de, .btn-s-xl-po, .btn-s-xl-nm, .btn-s-lg-sb, .btn-s-lg-wa, .btn-s-lg-de, .btn-s-lg-po, .btn-s-lg-nm, .btn-s-md-sb, .btn-s-md-wa, .btn-s-md-de, .btn-s-md-po, .btn-s-md-nm, .btn-s-sm-sb, .btn-s-sm-wa, .btn-s-sm-de, .btn-s-sm-po, .btn-s-sm-nm, .btn-s-xs-sb, .btn-s-xs-wa, .btn-s-xs-de, .btn-s-xs-po, .btn-s-xs-nm, .btn-s-sb, .btn-s-wa, .btn-s-de, .btn-s-po, .btn-s-nm, .btn-s-xl, .btn-s-lg, .btn-s-md, .btn-s-sm, .btn-s-xs {
  background: #ffffff;
  border: 1px solid #dddddd;
  border-radius: 0.4rem;
}
.btn-o, .btn-o-xl-sb, .btn-o-xl-wa, .btn-o-xl-de, .btn-o-xl-po, .btn-o-xl-nm, .btn-o-lg-sb, .btn-o-lg-wa, .btn-o-lg-de, .btn-o-lg-po, .btn-o-lg-nm, .btn-o-md-sb, .btn-o-md-wa, .btn-o-md-de, .btn-o-md-po, .btn-o-md-nm, .btn-o-sm-sb, .btn-o-sm-wa, .btn-o-sm-de, .btn-o-sm-po, .btn-o-sm-nm, .btn-o-xs-sb, .btn-o-xs-wa, .btn-o-xs-de, .btn-o-xs-po, .btn-o-xs-nm, .btn-o-sb, .btn-o-wa, .btn-o-de, .btn-o-po, .btn-o-nm, .btn-o-xl, .btn-o-lg, .btn-o-md, .btn-o-sm, .btn-o-xs {
  background: transparent;
  border: 1px solid #5838E6;
  color: #5838E6;
}
.btn-r, .btn-r-xl-sb, .btn-r-xl-wa, .btn-r-xl-de, .btn-r-xl-po, .btn-r-xl-nm, .btn-r-lg-sb, .btn-r-lg-wa, .btn-r-lg-de, .btn-r-lg-po, .btn-r-lg-nm, .btn-r-md-sb, .btn-r-md-wa, .btn-r-md-de, .btn-r-md-po, .btn-r-md-nm, .btn-r-sm-sb, .btn-r-sm-wa, .btn-r-sm-de, .btn-r-sm-po, .btn-r-sm-nm, .btn-r-xs-sb, .btn-r-xs-wa, .btn-r-xs-de, .btn-r-xs-po, .btn-r-xs-nm, .btn-r-sb, .btn-r-wa, .btn-r-de, .btn-r-po, .btn-r-nm, .btn-r-xl, .btn-r-lg, .btn-r-md, .btn-r-sm, .btn-r-xs {
  background: linear-gradient(90deg, #832CBD 0%, #5838E6 100%);
  color: #5838E6;
  border-radius: 100px;
  position: relative;
  overflow: hidden;
}
.btn-r::before, .btn-r-xl-sb::before, .btn-r-xl-wa::before, .btn-r-xl-de::before, .btn-r-xl-po::before, .btn-r-xl-nm::before, .btn-r-lg-sb::before, .btn-r-lg-wa::before, .btn-r-lg-de::before, .btn-r-lg-po::before, .btn-r-lg-nm::before, .btn-r-md-sb::before, .btn-r-md-wa::before, .btn-r-md-de::before, .btn-r-md-po::before, .btn-r-md-nm::before, .btn-r-sm-sb::before, .btn-r-sm-wa::before, .btn-r-sm-de::before, .btn-r-sm-po::before, .btn-r-sm-nm::before, .btn-r-xs-sb::before, .btn-r-xs-wa::before, .btn-r-xs-de::before, .btn-r-xs-po::before, .btn-r-xs-nm::before, .btn-r-sb::before, .btn-r-wa::before, .btn-r-de::before, .btn-r-po::before, .btn-r-nm::before, .btn-r-xl::before, .btn-r-lg::before, .btn-r-md::before, .btn-r-sm::before, .btn-r-xs::before {
  content: "";
  background: #ffffff;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border-radius: 100px;
  position: absolute;
  left: 2px;
  top: 2px;
  z-index: -1;
}
.btn-r::after, .btn-r-xl-sb::after, .btn-r-xl-wa::after, .btn-r-xl-de::after, .btn-r-xl-po::after, .btn-r-xl-nm::after, .btn-r-lg-sb::after, .btn-r-lg-wa::after, .btn-r-lg-de::after, .btn-r-lg-po::after, .btn-r-lg-nm::after, .btn-r-md-sb::after, .btn-r-md-wa::after, .btn-r-md-de::after, .btn-r-md-po::after, .btn-r-md-nm::after, .btn-r-sm-sb::after, .btn-r-sm-wa::after, .btn-r-sm-de::after, .btn-r-sm-po::after, .btn-r-sm-nm::after, .btn-r-xs-sb::after, .btn-r-xs-wa::after, .btn-r-xs-de::after, .btn-r-xs-po::after, .btn-r-xs-nm::after, .btn-r-sb::after, .btn-r-wa::after, .btn-r-de::after, .btn-r-po::after, .btn-r-nm::after, .btn-r-xl::after, .btn-r-lg::after, .btn-r-md::after, .btn-r-sm::after, .btn-r-xs::after {
  content: "";
  background: linear-gradient(90deg, #832CBD 0%, #5838E6 100%);
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  position: absolute;
  clip-path: circle(0% at 0 -50%);
  transition: all 500ms;
  z-index: -1;
  isolation: isolate;
}
.btn-r:hover, .btn-r-xl-sb:hover, .btn-r-xl-wa:hover, .btn-r-xl-de:hover, .btn-r-xl-po:hover, .btn-r-xl-nm:hover, .btn-r-lg-sb:hover, .btn-r-lg-wa:hover, .btn-r-lg-de:hover, .btn-r-lg-po:hover, .btn-r-lg-nm:hover, .btn-r-md-sb:hover, .btn-r-md-wa:hover, .btn-r-md-de:hover, .btn-r-md-po:hover, .btn-r-md-nm:hover, .btn-r-sm-sb:hover, .btn-r-sm-wa:hover, .btn-r-sm-de:hover, .btn-r-sm-po:hover, .btn-r-sm-nm:hover, .btn-r-xs-sb:hover, .btn-r-xs-wa:hover, .btn-r-xs-de:hover, .btn-r-xs-po:hover, .btn-r-xs-nm:hover, .btn-r-sb:hover, .btn-r-wa:hover, .btn-r-de:hover, .btn-r-po:hover, .btn-r-nm:hover, .btn-r-xl:hover, .btn-r-lg:hover, .btn-r-md:hover, .btn-r-sm:hover, .btn-r-xs:hover {
  color: #fff;
}
.btn-r:hover::after, .btn-r-xl-sb:hover::after, .btn-r-xl-wa:hover::after, .btn-r-xl-de:hover::after, .btn-r-xl-po:hover::after, .btn-r-xl-nm:hover::after, .btn-r-lg-sb:hover::after, .btn-r-lg-wa:hover::after, .btn-r-lg-de:hover::after, .btn-r-lg-po:hover::after, .btn-r-lg-nm:hover::after, .btn-r-md-sb:hover::after, .btn-r-md-wa:hover::after, .btn-r-md-de:hover::after, .btn-r-md-po:hover::after, .btn-r-md-nm:hover::after, .btn-r-sm-sb:hover::after, .btn-r-sm-wa:hover::after, .btn-r-sm-de:hover::after, .btn-r-sm-po:hover::after, .btn-r-sm-nm:hover::after, .btn-r-xs-sb:hover::after, .btn-r-xs-wa:hover::after, .btn-r-xs-de:hover::after, .btn-r-xs-po:hover::after, .btn-r-xs-nm:hover::after, .btn-r-sb:hover::after, .btn-r-wa:hover::after, .btn-r-de:hover::after, .btn-r-po:hover::after, .btn-r-nm:hover::after, .btn-r-xl:hover::after, .btn-r-lg:hover::after, .btn-r-md:hover::after, .btn-r-sm:hover::after, .btn-r-xs:hover::after {
  clip-path: circle(200% at 0 0);
}
.btn-xs, .btn-r-xs-sb, .btn-r-xs-wa, .btn-r-xs-de, .btn-r-xs-po, .btn-r-xs-nm, .btn-o-xs-sb, .btn-o-xs-wa, .btn-o-xs-de, .btn-o-xs-po, .btn-o-xs-nm, .btn-s-xs-sb, .btn-s-xs-wa, .btn-s-xs-de, .btn-s-xs-po, .btn-s-xs-nm, .btn-g-xs-sb, .btn-g-xs-wa, .btn-g-xs-de, .btn-g-xs-po, .btn-g-xs-nm, .btn-xs-sb, .btn-xs-wa, .btn-xs-de, .btn-xs-po, .btn-xs-nm, .btn-r-xs, .btn-o-xs, .btn-s-xs, .btn-g-xs {
  height: 3rem;
  font-size: 1.4rem;
  padding: 0rem 1.5rem;
}
.btn-sm, .btn-r-sm-sb, .btn-r-sm-wa, .btn-r-sm-de, .btn-r-sm-po, .btn-r-sm-nm, .btn-o-sm-sb, .btn-o-sm-wa, .btn-o-sm-de, .btn-o-sm-po, .btn-o-sm-nm, .btn-s-sm-sb, .btn-s-sm-wa, .btn-s-sm-de, .btn-s-sm-po, .btn-s-sm-nm, .btn-g-sm-sb, .btn-g-sm-wa, .btn-g-sm-de, .btn-g-sm-po, .btn-g-sm-nm, .btn-sm-sb, .btn-sm-wa, .btn-sm-de, .btn-sm-po, .btn-sm-nm, .btn-r-sm, .btn-o-sm, .btn-s-sm, .btn-g-sm {
  height: 4rem;
  font-size: 1.4rem;
  padding: 1rem 1.5rem;
}
.btn-md, .btn-r-md-sb, .btn-r-md-wa, .btn-r-md-de, .btn-r-md-po, .btn-r-md-nm, .btn-o-md-sb, .btn-o-md-wa, .btn-o-md-de, .btn-o-md-po, .btn-o-md-nm, .btn-s-md-sb, .btn-s-md-wa, .btn-s-md-de, .btn-s-md-po, .btn-s-md-nm, .btn-g-md-sb, .btn-g-md-wa, .btn-g-md-de, .btn-g-md-po, .btn-g-md-nm, .btn-md-sb, .btn-md-wa, .btn-md-de, .btn-md-po, .btn-md-nm, .btn-r-md, .btn-o-md, .btn-s-md, .btn-g-md {
  height: 5rem;
  font-size: 1.6rem;
  padding: 1rem 2rem;
}
.btn-lg, .btn-r-lg-sb, .btn-r-lg-wa, .btn-r-lg-de, .btn-r-lg-po, .btn-r-lg-nm, .btn-o-lg-sb, .btn-o-lg-wa, .btn-o-lg-de, .btn-o-lg-po, .btn-o-lg-nm, .btn-s-lg-sb, .btn-s-lg-wa, .btn-s-lg-de, .btn-s-lg-po, .btn-s-lg-nm, .btn-g-lg-sb, .btn-g-lg-wa, .btn-g-lg-de, .btn-g-lg-po, .btn-g-lg-nm, .btn-lg-sb, .btn-lg-wa, .btn-lg-de, .btn-lg-po, .btn-lg-nm, .btn-r-lg, .btn-o-lg, .btn-s-lg, .btn-g-lg {
  height: 6rem;
  font-size: 1.8rem;
  padding: 1.8rem 2rem 1.9rem;
  min-width: min(12rem, 16vw);
  border-radius: 0.4rem;
}
.btn-xl, .btn-r-xl-sb, .btn-r-xl-wa, .btn-r-xl-de, .btn-r-xl-po, .btn-r-xl-nm, .btn-o-xl-sb, .btn-o-xl-wa, .btn-o-xl-de, .btn-o-xl-po, .btn-o-xl-nm, .btn-s-xl-sb, .btn-s-xl-wa, .btn-s-xl-de, .btn-s-xl-po, .btn-s-xl-nm, .btn-g-xl-sb, .btn-g-xl-wa, .btn-g-xl-de, .btn-g-xl-po, .btn-g-xl-nm, .btn-xl-sb, .btn-xl-wa, .btn-xl-de, .btn-xl-po, .btn-xl-nm, .btn-r-xl, .btn-o-xl, .btn-s-xl, .btn-g-xl {
  height: 7.2rem;
  font-size: 2.2rem;
  padding: 1.8rem 4.8rem 1.9rem;
  border-radius: 0.4rem;
}
.btn-xl-r {
  border-radius: 100rem;
}
.btn-po, .btn-r-xl-po, .btn-r-lg-po, .btn-r-md-po, .btn-r-sm-po, .btn-r-xs-po, .btn-o-xl-po, .btn-o-lg-po, .btn-o-md-po, .btn-o-sm-po, .btn-o-xs-po, .btn-s-xl-po, .btn-s-lg-po, .btn-s-md-po, .btn-s-sm-po, .btn-s-xs-po, .btn-g-xl-po, .btn-g-lg-po, .btn-g-md-po, .btn-g-sm-po, .btn-g-xs-po, .btn-xl-po, .btn-lg-po, .btn-md-po, .btn-sm-po, .btn-xs-po, .btn-r-po, .btn-o-po, .btn-s-po, .btn-g-po {
  background: #5838E6;
  color: #ffffff;
  border-color: transparent;
}
.btn-po:hover, .btn-r-xl-po:hover, .btn-r-lg-po:hover, .btn-r-md-po:hover, .btn-r-sm-po:hover, .btn-r-xs-po:hover, .btn-o-xl-po:hover, .btn-o-lg-po:hover, .btn-o-md-po:hover, .btn-o-sm-po:hover, .btn-o-xs-po:hover, .btn-s-xl-po:hover, .btn-s-lg-po:hover, .btn-s-md-po:hover, .btn-s-sm-po:hover, .btn-s-xs-po:hover, .btn-g-xl-po:hover, .btn-g-lg-po:hover, .btn-g-md-po:hover, .btn-g-sm-po:hover, .btn-g-xs-po:hover, .btn-xl-po:hover, .btn-lg-po:hover, .btn-md-po:hover, .btn-sm-po:hover, .btn-xs-po:hover, .btn-r-po:hover, .btn-o-po:hover, .btn-s-po:hover, .btn-g-po:hover {
  background: rgb(59.7991071429, 26.2276785714, 208.7723214286);
  font-weight: 500;
  color: #ffffff;
  border: 1px solid #5838E6;
}
.btn-nm, .btn-r-xl-nm, .btn-r-lg-nm, .btn-r-md-nm, .btn-r-sm-nm, .btn-r-xs-nm, .btn-o-xl-nm, .btn-o-lg-nm, .btn-o-md-nm, .btn-o-sm-nm, .btn-o-xs-nm, .btn-s-xl-nm, .btn-s-lg-nm, .btn-s-md-nm, .btn-s-sm-nm, .btn-s-xs-nm, .btn-g-xl-nm, .btn-g-lg-nm, .btn-g-md-nm, .btn-g-sm-nm, .btn-g-xs-nm, .btn-xl-nm, .btn-lg-nm, .btn-md-nm, .btn-sm-nm, .btn-xs-nm, .btn-r-nm, .btn-o-nm, .btn-s-nm, .btn-g-nm {
  background: #ffffff;
  color: #333333;
  border: 1px solid #dddddd;
}
.btn-nm:hover, .btn-r-xl-nm:hover, .btn-r-lg-nm:hover, .btn-r-md-nm:hover, .btn-r-sm-nm:hover, .btn-r-xs-nm:hover, .btn-o-xl-nm:hover, .btn-o-lg-nm:hover, .btn-o-md-nm:hover, .btn-o-sm-nm:hover, .btn-o-xs-nm:hover, .btn-s-xl-nm:hover, .btn-s-lg-nm:hover, .btn-s-md-nm:hover, .btn-s-sm-nm:hover, .btn-s-xs-nm:hover, .btn-g-xl-nm:hover, .btn-g-lg-nm:hover, .btn-g-md-nm:hover, .btn-g-sm-nm:hover, .btn-g-xs-nm:hover, .btn-xl-nm:hover, .btn-lg-nm:hover, .btn-md-nm:hover, .btn-sm-nm:hover, .btn-xs-nm:hover, .btn-r-nm:hover, .btn-o-nm:hover, .btn-s-nm:hover, .btn-g-nm:hover {
  border-color: #5838E6;
  color: #5838E6;
  font-weight: 500;
}
.btn-de, .btn-r-xl-de, .btn-r-lg-de, .btn-r-md-de, .btn-r-sm-de, .btn-r-xs-de, .btn-o-xl-de, .btn-o-lg-de, .btn-o-md-de, .btn-o-sm-de, .btn-o-xs-de, .btn-s-xl-de, .btn-s-lg-de, .btn-s-md-de, .btn-s-sm-de, .btn-s-xs-de, .btn-g-xl-de, .btn-g-lg-de, .btn-g-md-de, .btn-g-sm-de, .btn-g-xs-de, .btn-xl-de, .btn-lg-de, .btn-md-de, .btn-sm-de, .btn-xs-de, .btn-r-de, .btn-o-de, .btn-s-de, .btn-g-de {
  background: #333333;
  color: #ffffff;
  border: 1px solid #333333;
}
.btn-de:hover, .btn-r-xl-de:hover, .btn-r-lg-de:hover, .btn-r-md-de:hover, .btn-r-sm-de:hover, .btn-r-xs-de:hover, .btn-o-xl-de:hover, .btn-o-lg-de:hover, .btn-o-md-de:hover, .btn-o-sm-de:hover, .btn-o-xs-de:hover, .btn-s-xl-de:hover, .btn-s-lg-de:hover, .btn-s-md-de:hover, .btn-s-sm-de:hover, .btn-s-xs-de:hover, .btn-g-xl-de:hover, .btn-g-lg-de:hover, .btn-g-md-de:hover, .btn-g-sm-de:hover, .btn-g-xs-de:hover, .btn-xl-de:hover, .btn-lg-de:hover, .btn-md-de:hover, .btn-sm-de:hover, .btn-xs-de:hover, .btn-r-de:hover, .btn-o-de:hover, .btn-s-de:hover, .btn-g-de:hover {
  background: #222222;
  font-weight: 500;
  color: #ffffff;
}
.btn-wa, .btn-r-xl-wa, .btn-r-lg-wa, .btn-r-md-wa, .btn-r-sm-wa, .btn-r-xs-wa, .btn-o-xl-wa, .btn-o-lg-wa, .btn-o-md-wa, .btn-o-sm-wa, .btn-o-xs-wa, .btn-s-xl-wa, .btn-s-lg-wa, .btn-s-md-wa, .btn-s-sm-wa, .btn-s-xs-wa, .btn-g-xl-wa, .btn-g-lg-wa, .btn-g-md-wa, .btn-g-sm-wa, .btn-g-xs-wa, .btn-xl-wa, .btn-lg-wa, .btn-md-wa, .btn-sm-wa, .btn-xs-wa, .btn-r-wa, .btn-o-wa, .btn-s-wa, .btn-g-wa {
  background: #d32b2b;
  color: #ffffff;
  border: 1px solid #d32b2b;
}
.btn-wa:hover, .btn-r-xl-wa:hover, .btn-r-lg-wa:hover, .btn-r-md-wa:hover, .btn-r-sm-wa:hover, .btn-r-xs-wa:hover, .btn-o-xl-wa:hover, .btn-o-lg-wa:hover, .btn-o-md-wa:hover, .btn-o-sm-wa:hover, .btn-o-xs-wa:hover, .btn-s-xl-wa:hover, .btn-s-lg-wa:hover, .btn-s-md-wa:hover, .btn-s-sm-wa:hover, .btn-s-xs-wa:hover, .btn-g-xl-wa:hover, .btn-g-lg-wa:hover, .btn-g-md-wa:hover, .btn-g-sm-wa:hover, .btn-g-xs-wa:hover, .btn-xl-wa:hover, .btn-lg-wa:hover, .btn-md-wa:hover, .btn-sm-wa:hover, .btn-xs-wa:hover, .btn-r-wa:hover, .btn-o-wa:hover, .btn-s-wa:hover, .btn-g-wa:hover {
  background: rgb(189.8169291339, 38.6830708661, 38.6830708661);
  border-color: rgb(189.8169291339, 38.6830708661, 38.6830708661);
  font-weight: 500;
  color: #ffffff;
}
.btn-sb, .btn-r-xl-sb, .btn-r-lg-sb, .btn-r-md-sb, .btn-r-sm-sb, .btn-r-xs-sb, .btn-o-xl-sb, .btn-o-lg-sb, .btn-o-md-sb, .btn-o-sm-sb, .btn-o-xs-sb, .btn-s-xl-sb, .btn-s-lg-sb, .btn-s-md-sb, .btn-s-sm-sb, .btn-s-xs-sb, .btn-g-xl-sb, .btn-g-lg-sb, .btn-g-md-sb, .btn-g-sm-sb, .btn-g-xs-sb, .btn-xl-sb, .btn-lg-sb, .btn-md-sb, .btn-sm-sb, .btn-xs-sb, .btn-r-sb, .btn-o-sb, .btn-s-sb, .btn-g-sb {
  background: #F4DD5A;
  color: #ffffff;
  border: 1px solid #F4DD5A;
}
.btn-sb:hover, .btn-r-xl-sb:hover, .btn-r-lg-sb:hover, .btn-r-md-sb:hover, .btn-r-sm-sb:hover, .btn-r-xs-sb:hover, .btn-o-xl-sb:hover, .btn-o-lg-sb:hover, .btn-o-md-sb:hover, .btn-o-sm-sb:hover, .btn-o-xs-sb:hover, .btn-s-xl-sb:hover, .btn-s-lg-sb:hover, .btn-s-md-sb:hover, .btn-s-sm-sb:hover, .btn-s-xs-sb:hover, .btn-g-xl-sb:hover, .btn-g-lg-sb:hover, .btn-g-md-sb:hover, .btn-g-sm-sb:hover, .btn-g-xs-sb:hover, .btn-xl-sb:hover, .btn-lg-sb:hover, .btn-md-sb:hover, .btn-sm-sb:hover, .btn-xs-sb:hover, .btn-r-sb:hover, .btn-o-sb:hover, .btn-s-sb:hover, .btn-g-sb:hover {
  background: rgb(242.40625, 216.0738636364, 66.09375);
  color: #ffffff;
  font-weight: 500;
  border-color: rgb(242.40625, 216.0738636364, 66.09375);
}
.btn-i {
  display: flex;
  gap: 1rem;
}
.btn-i i {
  letter-spacing: 0;
  color: #5838E6;
}
.btn-i:hover i {
  animation: swing-left 1000ms ease-in-out infinite 500ms alternate-reverse;
}
.btn-ico {
  width: 5rem;
  height: 5rem;
  border-radius: 0.4rem;
  font-size: 1.6rem;
  background: #ffffff;
  color: #333333;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 300ms;
  border: none;
  overflow: hidden;
  flex-shrink: 0;
}
.btn-ico i {
  width: 100%;
  height: 100%;
}
.btn-ico:hover .ico-search {
  background-color: rgb(68.9888392857, 33.3459821429, 227.1540178571);
}
.btn-ico .ico-search {
  background: #5838E6 url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='14' viewBox='0 0 15 14' fill='none'%3E%3Cpath d='M2.66992 1.74851C5.00129 -0.582789 8.78177 -0.582887 11.1131 1.74851C13.2032 3.83904 13.4175 7.09286 11.7592 9.42408L14.6289 12.2931L14.6973 12.3683C15.0177 12.7609 14.9949 13.341 14.6289 13.7072C14.2628 14.0733 13.6824 14.0961 13.2898 13.7755L13.2146 13.7072L10.3459 10.8381C8.01474 12.4963 4.76029 12.2819 2.66992 10.1916C0.338746 7.86031 0.338986 4.07998 2.66992 1.74851ZM9.69971 3.16156C8.14932 1.61116 5.63482 1.61141 4.08428 3.16156C2.53375 4.71215 2.53375 7.22702 4.08428 8.77761C5.63482 10.3279 8.14928 10.3281 9.69971 8.77761C11.25 7.22705 11.25 4.71208 9.69971 3.16156Z' fill='%23fff'/%3E%3C/svg%3E") no-repeat center/40%;
  width: 100%;
}

/* 기본 인풋 세팅값 */
input[type=text],
input[type=password],
input[type=number],
input[type=date] {
  height: 5rem;
  line-height: normal;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
  width: 100%;
  outline: none;
  font-size: 1.6rem;
  color: #777777;
  border: none;
  font-weight: 300;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 0.4rem;
  padding: 0 1.5rem;
}
input[type=text]:required,
input[type=password]:required,
input[type=number]:required,
input[type=date]:required {
  border-color: #5838E6;
  background: rgba(88, 56, 230, 0.1);
}

button {
  outline: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

select {
  outline: 0;
  cursor: pointer;
  font-size: 1.8rem;
  height: 5rem;
  width: 100%;
  color: #999999;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0 1.5rem;
  vertical-align: middle;
  text-align: left;
  border-radius: 0;
  background-color: #ffffff;
  border: none;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 0.4rem;
}

/* input placeholder 세팅 */
input[type=text]::-webkit-input-placeholder, input[type=text]::-moz-placeholder, input[type=text]:-ms-input-placeholder, input[type=text]:-moz-placeholder, input[type=password]::-webkit-input-placeholder, input[type=password]::-moz-placeholder, input[type=password]:-ms-input-placeholder, input[type=password]:-moz-placeholder {
  color: var(--black-color05);
}

/* 텍스트박스 */
textarea {
  margin: 0;
  padding: 2rem 1.5rem;
  vertical-align: middle;
  width: 100%;
  text-align: left;
  resize: none;
  border: none;
  font-size: 1.6rem;
  color: #777777;
  font-weight: 300;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: 0.4rem;
}
textarea::placeholder {
  color: #999999;
  font-weight: 300;
}

em.tb_es {
  color: #5838E6;
  flex-shrink: 0;
}

span:has(> input[type=checkbox], > input[type=radio]) {
  display: flex;
}

span.beforeRadio {
  background: #f9f9f9;
  padding: 0 1rem;
  border: 1px solid #dddddd;
  border-radius: 4rem;
}
span.beforeRadio input[type=radio] + label {
  color: #bbb;
  font-weight: 300;
}

span.nowRadio {
  background: #fff;
  padding: 0 1rem;
  border: 1px solid #5838E6;
  border-radius: 4rem;
}

input[type=checkbox], input[type=radio] {
  display: none;
}

input[type=radio] + label {
  display: flex;
  align-items: center;
  line-height: 1.2;
  padding: 1rem 0;
  gap: 0.5rem;
  color: #777777;
  font-weight: 400;
  font-size: 1.6rem;
  transition: all 300ms;
  word-break: keep-all;
  text-wrap-style: pretty;
}
input[type=radio] + label::before {
  content: "";
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 10rem;
  flex-shrink: 0;
  outline: 4px solid #fff;
  outline-offset: -5px;
  background: #eeeeee;
  box-sizing: border-box;
  border: 2px solid #dddddd;
  transition: all 300ms;
}
input[type=radio] + label:hover {
  color: #333333;
}
input[type=radio] + label:hover::before {
  background: rgb(215.9, 215.9, 215.9);
}
input[type=radio]:checked + label::before {
  background-color: #5838e6;
  border-color: #5838E6;
}

input[type=checkbox] + label {
  display: flex;
  align-items: center;
  line-height: 1.2;
  padding: 1rem 0;
  gap: 1rem;
  color: #777777;
  font-weight: 400;
  font-size: 2rem;
  transition: all 300ms;
  word-break: keep-all;
  text-wrap-style: pretty;
}
input[type=checkbox] + label::before {
  content: "";
  display: block;
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 0.2rem;
  flex-shrink: 0;
  box-sizing: border-box;
  border: 1px solid #eeeeee;
  transition: all 300ms;
  background: #ffffff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' viewBox='0 0 10 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.45028 8.1019C3.45157 8.10349 3.45286 8.10507 3.45416 8.10665C3.5226 8.1896 3.60407 8.24711 3.69059 8.27919C3.88621 8.35173 4.10761 8.29423 4.26234 8.10667C4.26413 8.1045 4.2659 8.10233 4.26766 8.10014L9.40518 1.8729C9.62833 1.60241 9.62833 1.16385 9.40518 0.89336C9.18202 0.622868 8.82021 0.622868 8.59705 0.89336L3.85824 6.63732L1.40518 3.66394C1.18202 3.39344 0.820214 3.39344 0.597056 3.66394C0.373898 3.93443 0.373898 4.37298 0.597056 4.64347L3.45028 8.1019Z' fill='%23bbb'/%3E%3C/svg%3E") no-repeat 50% 40%/70%;
}
input[type=checkbox] + label:hover {
  color: #5838E6;
  font-weight: 600;
}
input[type=checkbox] + label:hover::before {
  border-color: #5838E6;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' viewBox='0 0 10 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.45028 8.1019C3.45157 8.10349 3.45286 8.10507 3.45416 8.10665C3.5226 8.1896 3.60407 8.24711 3.69059 8.27919C3.88621 8.35173 4.10761 8.29423 4.26234 8.10667C4.26413 8.1045 4.2659 8.10233 4.26766 8.10014L9.40518 1.8729C9.62833 1.60241 9.62833 1.16385 9.40518 0.89336C9.18202 0.622868 8.82021 0.622868 8.59705 0.89336L3.85824 6.63732L1.40518 3.66394C1.18202 3.39344 0.820214 3.39344 0.597056 3.66394C0.373898 3.93443 0.373898 4.37298 0.597056 4.64347L3.45028 8.1019Z' fill='%235838E6'/%3E%3C/svg%3E");
}
input[type=checkbox]:checked + label {
  color: #5838E6;
  font-weight: 600;
}
input[type=checkbox]:checked + label::before {
  border-color: #5838E6;
  background-color: #5838E6;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='9' viewBox='0 0 10 9' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.45028 8.1019C3.45157 8.10349 3.45286 8.10507 3.45416 8.10665C3.5226 8.1896 3.60407 8.24711 3.69059 8.27919C3.88621 8.35173 4.10761 8.29423 4.26234 8.10667C4.26413 8.1045 4.2659 8.10233 4.26766 8.10014L9.40518 1.8729C9.62833 1.60241 9.62833 1.16385 9.40518 0.89336C9.18202 0.622868 8.82021 0.622868 8.59705 0.89336L3.85824 6.63732L1.40518 3.66394C1.18202 3.39344 0.820214 3.39344 0.597056 3.66394C0.373898 3.93443 0.373898 4.37298 0.597056 4.64347L3.45028 8.1019Z' fill='%23fff'/%3E%3C/svg%3E");
}

.hashChkArea input[type=checkbox] + label {
  padding: 1rem 1.6rem;
}
.hashChkArea input[type=checkbox] + label::before {
  border-radius: 4rem;
}

/* flex 정렬 class */
.f_left {
  justify-content: flex-start !important;
  display: flex;
  gap: 1rem;
}
.f_center {
  justify-content: center !important;
  display: flex;
  gap: 1rem;
}
.f_right {
  justify-content: flex-end !important;
  display: flex;
  gap: 1rem;
}

br.forPC {
  display: block;
}

.btnArea {
  margin: min(8vw, 8rem) 0 min(8vw, 14rem);
}

.StepContents .btnArea,
.StepContents + .btnArea {
  margin-top: 0;
}

#wrap > div {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  position: relative;
  background: #f8f8f8;
}

.dia_floting {
  position: fixed;
  background: rgba(0, 0, 0, 0);
  left: 50%;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 999;
  pointer-events: none;
}
.dia_floting .dia_ap {
  position: absolute;
  top: 0;
  border-radius: 100rem;
  border: 1px solid #5838E6;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(-150%);
  padding: 1.6rem;
  background: #ffffff;
  display: flex;
  align-items: center;
  gap: 2rem;
  width: min(85vw, 74rem);
  transition: opacity 400ms ease-in-out;
}
.dia_floting .dia_ap.on {
  opacity: 0;
}
.dia_floting .dia_ap p {
  font-size: 1.9rem;
  font-family: "GmarketSans", sans-serif;
  color: #777777;
  rotate: -0.04deg;
  word-break: keep-all;
  text-wrap-style: balance;
  line-height: 1.2;
  font-weight: 200;
  letter-spacing: -0.05rem;
}
.dia_floting .dia_ap p span {
  color: #5838E6;
  font-weight: 500;
}
.dia_floting .dia_ap::before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 8px 0px 8px;
  border-color: #674FDC transparent transparent transparent;
  position: absolute;
  bottom: -1rem;
  left: 50%;
  transform: translate(-50%, 100%);
  animation: swing-arr 800ms ease-in-out infinite alternate-reverse;
}
.dia_floting .dia_ap .dia_obj {
  width: 5rem;
  height: 5rem;
  border-radius: 10rem;
  border: 1px solid #dddddd;
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dia_floting .dia_ap .dia_obj i {
  display: block;
}
.dia_floting .dia_ap .dia_obj i.dia_cursor {
  margin-top: -0.6rem;
  width: 100%;
  height: 2.9rem;
  background: url("../img/diagnosis/dia_cursor.svg") no-repeat 52% 50%/contain;
}
.dia_floting .dia_ap .dia_obj i.dia_cursor_arr {
  position: absolute;
  width: 100%;
  height: 0.5rem;
  bottom: 0.6rem;
  transform: translateY(0.1rem);
  background: url("../img/diagnosis/dia_cursor_arr.svg") no-repeat 50% center/contain;
  animation: swing-small 1500ms ease-in-out infinite alternate-reverse;
}
@keyframes swing-small {
  0% {
    transform: translateY(0.1rem);
  }
  100% {
    transform: translateY(0.3rem);
  }
}
@keyframes swing-arr {
  0% {
    transform: translateY(0.8rem);
  }
  100% {
    transform: translateY(1.5rem);
  }
}
.dia_floting .StepContents {
  background: #fff;
  border: 3px solid #5838E6;
  width: 100%;
  max-width: 80%;
  height: 100%;
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(100vh);
  border-radius: 3rem 3rem 0 0;
  overflow-y: auto;
  pointer-events: none;
  padding: 5rem;
}
.dia_floting .StepContents .flotWrap {
  height: 100%;
}

/* INTRO */
.dia_intro {
  background: #fff;
  text-align: center;
  padding: 0 min(3vw, 4rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10vw 0;
  /* 로고 */
}
.dia_intro .logo {
  width: 30rem;
  height: 5.8rem;
  display: flex;
  gap: 1.3rem;
  align-items: center;
  background: url("../img/common/logo.svg") no-repeat 0 0/contain;
}
.dia_intro .dia_area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: clamp(2rem, 3vw, 6rem);
  position: relative;
  z-index: 2;
}
.dia_intro .dia_area .copy em {
  font-size: clamp(1.6rem, 2vw, 3.2rem);
  font-weight: 400;
  color: #333333;
  display: block;
  text-wrap: balance;
  word-break: keep-all;
  transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}
.dia_intro .dia_area .copy em b {
  color: #5838E6;
  font-weight: 600;
}
.dia_intro .dia_area .copy h1 {
  font-family: GmarketSans, sans-serif;
  font-size: clamp(3.8rem, 6vw, 8rem);
  color: #333333;
  line-height: 0.7;
  padding-top: 1.5rem;
  width: fit-content;
  margin: clamp(1rem, 2vw, 2.4rem) auto 4rem auto;
  transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  display: flex;
  align-items: center;
  gap: 1vw;
  opacity: 0;
}
.dia_intro .dia_area .copy h1 p {
  white-space: nowrap;
}
.dia_intro .dia_area .copy h1 strong {
  color: #5838E6;
  white-space: nowrap;
}
.dia_intro .dia_area .copy h1 span {
  display: block;
  position: absolute;
}
.dia_intro .dia_area .copy h1 span img {
  clip-path: inset(0 100% 0 0);
  display: flex;
  flex-direction: column;
}
.dia_intro .dia_area .copy h1 span img:last-of-type {
  margin-top: -0.3vw;
  margin-left: 1vw;
}
.dia_intro .dia_area .copy > p {
  color: #999999;
  font-weight: 300;
  font-size: clamp(1.8rem, 2.4vw, 2.6rem);
  line-height: 1.3;
  text-wrap: balance;
  word-break: keep-all;
  margin-bottom: clamp(2rem, 3vw, 4rem);
  transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}
.dia_intro .dia_area .copy > p b {
  color: #333333;
  font-weight: 600;
}
.dia_intro .dia_area .copy button {
  opacity: 0;
  margin: 0 auto;
}
.dia_intro .dia_area .copy + ul {
  color: #999999;
  font-size: clamp(1.4rem, 2vw, 1.6rem);
  font-weight: 400;
}
.dia_intro .dia_area .copy + ul li {
  text-wrap: balance;
  word-break: keep-all;
  transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.dia_intro .obj {
  isolation: isolate;
}
.dia_intro .human-f {
  background: url("../img/diagnosis/human-f.svg") no-repeat center bottom/100%;
  width: clamp(20rem, 25vw, 38.4rem);
  height: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 3%;
  z-index: -1;
  opacity: 0;
}
.dia_intro .human-m {
  background: url("../img/diagnosis/human-m.svg") no-repeat center bottom/100%;
  width: clamp(16rem, 20vw, 30.6rem);
  height: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  right: 3%;
  z-index: -1;
  opacity: 0;
}
.dia_intro .bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -2;
  opacity: 0;
  background: url("../img/diagnosis/diaBG.svg") no-repeat center bottom/cover;
}

/* STEP */
.StepContents {
  padding: min(5rem, 10vw) 0;
  padding-bottom: 3rem;
  flex-direction: column;
  gap: 2rem;
}
.StepContents .policyArea {
  display: flex;
  flex-direction: column;
  gap: 6.5rem;
}
.StepContents .policy-define {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
.StepContents .policy-define dl {
  font-size: 1.8rem;
  line-height: 1.3;
}
.StepContents .policy-define dl dt {
  color: #333333;
  font-weight: 700;
}
.StepContents .policy-define dl dd {
  color: #777777;
  font-weight: 400;
}
.StepContents .policy-define ol {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  line-height: 1.4;
  margin-top: 0.6rem;
  font-weight: 300;
}
.StepContents .policy-define ol li {
  position: relative;
  margin-left: 1rem;
}
.StepContents .policy-define ol li::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  display: inline-block;
  border-radius: 10rem;
  background: #777777;
  position: absolute;
  top: 0.9rem;
  left: -1rem;
}
.StepContents .policy-define ul {
  counter-set: policy-num 0;
  counter-reset: policy-num 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.6rem;
  line-height: 1.4;
  font-weight: 300;
}
.StepContents .policy-define ul li {
  counter-increment: policy-num;
  margin-left: 2.2rem;
}
.StepContents .policy-define ul li::before {
  content: counter(policy-num);
  font-size: 1.2rem;
  font-weight: 700;
  border: 2px solid #999999;
  color: #999999;
  line-height: 0.5;
  height: 1.6rem;
  width: 1.6rem;
  border-radius: 10rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: -0.2rem;
  margin-right: 0.5rem;
  margin-left: -2.2rem;
}
.StepContents .policy-define ul .caution {
  display: block;
  font-size: 1.6rem;
  line-height: 1.4;
  color: #999999;
}
.StepContents .policy-define ul .caution::before {
  content: "※";
  font-family: "Inter", sans-serif;
  display: inline-block;
  margin-right: 0.2rem;
}
.StepContents .policySec > p {
  font-size: 2rem;
  color: #333333;
  font-weight: 700;
  margin-bottom: 1rem;
}
.StepContents .policySec .tableArea {
  padding: min(5rem, 6vw);
  border-radius: 0.4rem;
  border: 1px solid #dddddd;
}
.StepContents .policySec .tableArea table tbody tr td::before {
  display: block;
}

.StepGuide {
  width: 100%;
  background: #333333;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3.3rem 2rem 3.4rem;
}
.StepGuide dl {
  display: flex;
  align-items: center;
  color: #f5f5f5;
  rotate: 0.4deg;
}
.StepGuide dl.active {
  color: #BDF03E;
}
.StepGuide dl.active dt, .StepGuide dl.active dd {
  font-weight: 600;
}
.StepGuide dl:not(:last-child)::after {
  content: "";
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M1.85547 0.293076C1.46494 -0.097448 0.831931 -0.097448 0.441406 0.293076C0.0509195 0.683604 0.0508947 1.31663 0.441406 1.70714L4.91992 6.18565L0.441406 10.6642C0.0509195 11.0547 0.0508947 11.6877 0.441406 12.0782C0.831921 12.4687 1.46495 12.4687 1.85547 12.0782L7.04102 6.89269L7.10938 6.81749C7.22953 6.67019 7.30168 6.49619 7.3252 6.31749L7.33301 6.23351V6.1378C7.33148 6.10615 7.32874 6.07449 7.32422 6.04308C7.2993 5.86809 7.22717 5.69823 7.10938 5.55382L7.04102 5.47862L1.85547 0.293076Z' fill='%23E8E8E8'/%3E%3C/svg%3E") no-repeat center center/contain;
  display: block;
  width: 0.9rem;
  height: 1.4rem;
  margin: 0 min(2vw, 2rem);
}
.StepGuide dl dt {
  font-size: min(3vw, 1.6rem);
  font-weight: 300;
  display: inline-block;
  margin-right: 0.6rem;
}
.StepGuide dl dd {
  font-size: min(4vw, 2.2rem);
  font-weight: 300;
}

.agreeSet .join_all {
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid #dddddd;
}
.agreeSet .joinList .jl_item {
  margin-bottom: 3rem;
}
.agreeSet .joinList .jl_item > p {
  padding-bottom: 1rem;
}
.agreeSet .joinList .jl_item > div {
  border: 1px solid #dddddd;
  box-sizing: border-box;
  padding: 2rem;
  color: #777777;
  font-weight: 400;
}
.agreeSet .joinList .jl_item > div > div {
  max-height: 27rem;
  min-height: 10rem;
  overflow: scroll;
}

.stepSubmit {
  width: calc(100% - min(6rem, 6vw));
  max-width: 1400px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 4rem;
  border-radius: 0.4rem;
  background: #ffffff;
  text-align: center;
}
.stepSubmit h2 {
  color: #5838E6;
  font-size: min(3rem, 10vw);
  font-family: "WavvePADO", sans-serif;
  font-weight: 400;
  line-height: 1.1;
  word-wrap: break-word;
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: center;
}
.stepSubmit h2::before {
  content: "";
  width: 3.1rem;
  height: 3.1rem;
  display: block;
  background: url("data:image/svg+xml,%3Csvg width='30' height='31' viewBox='0 0 30 31' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='0.5' width='30' height='30' rx='15' fill='%235838E6'/%3E%3Cpath d='M20.3337 11.5L13.0003 18.8333L9.66699 15.5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat 0 0/contain;
}
.stepSubmit > p {
  color: #333333;
  font-family: "WavvePADO", sans-serif;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: 110%; /* 2.64rem */
  letter-spacing: -0.048rem;
  margin-top: 1rem;
}
.stepSubmit > span {
  color: #777777;
  text-align: center;
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.6;
  display: block;
  margin-top: 1.5rem;
  word-break: keep-all;
}
.stepSubmit > span b {
  color: #5838E6;
  font-weight: 600;
}
.stepSubmit .ss_info {
  border-radius: 1rem;
  border: 1px solid #dddddd;
  background: #FBFBFB;
  padding: 3rem;
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}
.stepSubmit .ss_info dl {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.stepSubmit .ss_info dt {
  border-radius: 10rem;
  background: #333333;
  color: #ffffff;
  min-width: 12rem;
  padding: 0.4rem 1rem;
}
.stepSubmit .ss_info dd {
  color: #333333;
  font-weight: 300;
  rotate: -0.03deg;
  text-wrap-style: balance;
  text-align: left;
}
.stepSubmit .ss_info dd .line {
  display: inline-block;
  width: 1px;
  height: 12px;
  background: #dddddd;
  margin: 0 1.1rem;
}
.stepSubmit .ss_info dd b {
  font-weight: 600;
}

.stepForm {
  width: calc(100% - min(6rem, 6vw));
  max-width: 1400px;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 4rem;
  border-radius: 0.4rem;
  background: #ffffff;
}
.stepForm h2 {
  color: #333333;
  font-size: min(3rem, 10vw);
  font-family: "WavvePADO", sans-serif;
  font-weight: 400;
  line-height: 1.1;
  word-wrap: break-word;
}
.stepForm > p {
  color: #333333;
  font-family: "WavvePADO", sans-serif;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: 110%; /* 2.64rem */
  letter-spacing: -0.048rem;
  margin-top: 1rem;
}
.stepForm > span {
  color: #777777;
  text-align: center;
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.6;
  display: block;
  margin-top: 1.5rem;
}
.stepForm > span b {
  color: #5838E6;
  font-weight: 600;
}
.stepForm .form-user {
  display: flex;
  flex-direction: column;
  gap: min(2rem, 4vw);
  margin-top: 3rem;
}
.stepForm .form-user dl {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.stepForm .form-user dl dt {
  color: #333333;
  font-size: 1.8rem;
  font-weight: 500;
}
.stepForm .form-user dl dt i.imp {
  color: #d32b2b;
  display: inline-block;
  margin-left: 0.1rem;
}
.stepForm .form-user dl dd.ip-tooltip .ip-cau {
  display: block;
}
.stepForm .form-user dl dd.ip-faild input[type=text], .stepForm .form-user dl dd.ip-faild input[type=password] {
  border: 1px solid #d32b2b;
  background-color: rgba(211, 43, 43, 0.08);
}
.stepForm .form-user dl dd.ip-faild input[type=text]::placeholder, .stepForm .form-user dl dd.ip-faild input[type=password]::placeholder {
  color: #d32b2b;
}
.stepForm .form-user dl dd.ip-faild .ip-cau {
  color: #d32b2b;
  display: block;
}
.stepForm .form-user dl dd.ip-faild .ip-cau::before {
  background-color: #d32b2b;
}
.stepForm .form-user dl dd .cut-flex {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.stepForm .form-user dl dd .cut-flex button, .stepForm .form-user dl dd .cut-flex a {
  flex-shrink: 0;
}
.stepForm .form-user dl dd .cut-flex.half {
  width: calc(50% - 0.5rem);
}
.stepForm .form-user dl dd .cut-flex.call {
  width: calc(50% - 0.5rem);
}
.stepForm .form-user dl dd .cut-flex.call input {
  text-align: center;
}
.stepForm .form-user dl dd .cut-flex:not(:last-of-type) {
  margin-bottom: 1rem;
}
.stepForm .form-user dl dd .cut-flex span {
  color: #777777;
  font-weight: 200;
}
.stepForm .form-user dl dd .cut-flex span.dash {
  min-width: 1.4rem;
  text-align: center;
}
.stepForm .form-user dl dd .per_nums {
  display: flex;
  align-items: center;
  gap: 1rem;
  max-width: 72rem;
  width: 100%;
}
.stepForm .form-user dl dd .per_nums div:has(button, a) {
  flex-shrink: 0;
}
.stepForm .form-user dl dd .per_nums div:has(input) {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.stepForm .form-user dl dd .per_nums span {
  color: #777777;
  font-weight: 200;
}
.stepForm .form-user dl dd .per_nums span.dash {
  min-width: 1.4rem;
  text-align: center;
}
.stepForm .form-user dl dd.checkBox {
  display: flex;
  align-items: center;
  gap: 2rem;
}
.stepForm .selArea {
  position: relative;
  width: 100%;
}
.stepForm .selArea label {
  width: 1.5rem;
  height: 1.5rem;
  display: block;
  position: absolute;
  right: 2rem;
  top: calc(50% - 0.8rem);
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='13' viewBox='0 0 8 13' fill='none'%3E%3Cpath d='M6.14453 0.292626C6.53503 -0.0977861 7.16809 -0.0977861 7.55859 0.292626C7.94909 0.683122 7.94903 1.31616 7.55859 1.70669L3.08008 6.1852L7.55859 10.6637C7.94912 11.0542 7.94912 11.6873 7.55859 12.0778C7.16807 12.4683 6.53506 12.4683 6.14453 12.0778L0.958984 6.89224L0.890625 6.81704C0.762153 6.65954 0.6889 6.47165 0.670898 6.27993C0.669412 6.26432 0.667747 6.24871 0.666992 6.23306V6.13735C0.668523 6.1057 0.671259 6.07404 0.675781 6.04263C0.700727 5.86775 0.772907 5.69868 0.890625 5.55434L0.958984 5.47817L6.14453 0.292626Z' fill='%23999'/%3E%3C/svg%3E") no-repeat center center/contain;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  border-radius: 100rem;
  transition: transform 500ms;
}
.stepForm .selArea:has(select:focus-within) label {
  transform: rotate(90deg);
}
.stepForm .selArea select {
  color: #777777;
  font-size: 1.8rem;
  width: 100%;
  padding: 0 2rem;
  border-radius: 0.3rem;
  box-shadow: 0 0 0 1px #eeeeee inset;
  box-sizing: border-box;
  font-weight: 300;
}
.stepForm .cer-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 6rem;
  gap: 2rem;
}
.stepForm .cer-item dl {
  text-align: center;
}
.stepForm .cer-item dt {
  font-size: min(6vw, 2.6rem);
  font-family: "WavvePADO", sans-serif;
  color: #333333;
}
.stepForm .cer-item dd {
  font-size: min(3vw, 1.6rem);
  margin-top: 0.6rem;
  color: #777777;
}

.StepTit {
  text-align: center;
  margin-bottom: 4rem;
}
.StepTit h1 {
  font-size: min(9vw, 4.6rem);
  color: #333333;
  font-family: "WavvePADO", sans-serif;
  line-height: 1.2;
  word-break: keep-all;
  text-wrap-style: pretty;
}
.StepTit h1 strong {
  color: #5838E6;
}
.StepTit > p {
  color: #999999;
  font-weight: 300;
  font-size: min(6vw, 2.8rem);
  line-height: 1.3;
  word-break: keep-all;
  text-wrap-style: pretty;
  margin-top: min(4vw, 4rem);
}
.StepTit > p span {
  color: #333333;
  font-weight: 700;
}

.user-info {
  width: calc(100% - min(6rem, 6vw));
  max-width: 90rem;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 1rem;
  padding: 4rem;
  border: 0.3rem solid #5838E6;
}
.user-info i {
  width: min(12rem, 16vw);
  height: min(12rem, 16vw);
  display: block;
  margin: 0 auto 1rem;
  background: url(../img/common/ico-user-p.svg) no-repeat center/contain;
}
.user-info h2 {
  font-family: "WavvePADO", sans-serif;
  font-size: 3.4rem;
  text-align: center;
  color: #5838E6;
  margin-bottom: 2rem;
}
.user-info .user-data {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.user-info dl {
  border-radius: 10rem;
  width: 100%;
  max-width: 40rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  background: #f8f8f8;
  padding: 1.4rem 4rem;
  justify-content: center;
  color: #333333;
}
.user-info dl dt {
  font-size: 1.6rem;
  min-width: 5.8rem;
  text-align-last: justify;
}
.user-info dl dd {
  font-size: 2.6rem;
}
.user-info dl dd::before {
  content: "";
  width: 1px;
  height: 1.2rem;
  background: #dddddd;
  display: inline-block;
  margin: 0 1.4rem;
}
.user-info .caution {
  color: #999999;
  font-weight: 300;
  display: block;
  text-align: center;
}

.StepQNA {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 4rem;
  max-width: 178rem;
  margin: 0 auto;
  padding: 0 min(3vw, 4rem);
}
.StepQNA dl {
  background: #ffffff;
  box-sizing: border-box;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: min(1.6vw, 1.6rem);
  padding: min(3vw, 4rem);
}
.StepQNA dt {
  color: #333333;
  font-size: min(4vw, 2.6rem);
  gap: 1rem;
  font-weight: 500;
  line-height: 1.2;
  display: flex;
  align-items: baseline;
  justify-content: center;
  word-break: keep-all;
  text-wrap-style: pretty;
}
.StepQNA dt span {
  text-align: left;
}
.StepQNA dt::before {
  content: "";
  flex-shrink: 0;
  width: min(6vw, 4rem);
  height: min(6vw, 4rem);
  position: relative;
  top: 1.2rem;
  display: inline-block;
  background: url(../img/common/faq_que.svg) no-repeat 0 0/contain;
}
.StepQNA dt b {
  color: #5838E6;
  font-weight: 700;
}
.StepQNA dd {
  background: #ffffff;
  border-radius: min(1vw, 1rem);
  gap: min(3vw, 3rem) min(4vw, 6rem);
  flex-wrap: wrap;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: min(3vw, 3rem) min(3vw, 2rem);
}
.StepQNA dd span:has(input[type=text], textarea) {
  display: block;
  width: 100%;
  max-width: 90rem;
}
.StepQNA input[type=radio] + label {
  font-size: 2rem;
  rotate: -0.03deg;
}
.StepQNA input[type=radio], .StepQNA input[type=checkbox] {
  display: none;
}
.StepQNA input:checked + label {
  color: #5838E6;
  font-weight: 600;
}
.StepQNA input:checked + label i {
  outline-color: #5838E6;
}
.StepQNA input:checked + label i::before {
  background: #5838E6;
}

.StepKEY {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: min(3vw, 4rem);
  max-width: 178rem;
  margin: 0 auto;
  padding: 0 min(3vw, 4rem);
}
.StepKEY dl {
  box-sizing: border-box;
  box-shadow: 0 0 0 1px #eeeeee inset;
  border-radius: min(1.6vw, 1.6rem);
  padding: min(5vw, 4rem);
  gap: 3vw;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.StepKEY dl:hover {
  box-shadow: 0 0 0 6px #5838E6 inset;
}
.StepKEY dl:hover dt {
  color: #5838E6;
}
.StepKEY dt {
  word-break: keep-all;
  text-wrap-style: pretty;
  color: #333333;
  font-size: min(8vw, 3.6rem);
  gap: 1rem;
  font-weight: 600;
  line-height: 1.2;
  display: flex;
  align-items: baseline;
  justify-content: center;
  color: #333333;
  transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.StepKEY dt span {
  text-align: left;
}
.StepKEY dt b {
  color: #5838E6;
  font-weight: 700;
}
.StepKEY dd {
  gap: min(3vw, 1rem) min(4vw, 1rem);
  flex-wrap: wrap;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  padding: min(3vw, 3rem) min(3vw, 2rem);
}
.StepKEY input[type=radio] + label,
.StepKEY label {
  font-size: min(4vw, 2rem);
  line-height: 1;
  color: #777777;
  font-weight: 300;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 1.2rem 2rem;
  border-radius: 10rem;
  background: #fff;
  outline: 1px solid #eeeeee;
  transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.StepKEY input[type=radio] + label:hover,
.StepKEY label:hover {
  outline: 1px solid #5838E6;
  color: #5838E6;
  font-weight: 600;
}
.StepKEY input {
  display: none;
}
.StepKEY input:checked + label {
  outline: 1px solid #5838E6;
  background: #5838E6;
  color: #ffffff;
  font-weight: 600;
}

button.bt-rd {
  width: fit-content;
  font-size: min(5vw, 2rem);
  border-radius: 100px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  padding: min(3vw, 2rem) min(6vw, 3rem);
  gap: 1rem;
  position: relative;
  z-index: 1;
  line-height: 1;
  overflow: hidden;
  background: #ffffff;
  color: #5838E6;
  font-weight: 600;
  box-shadow: 0 0 0 2px #5838E6 inset;
  transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
button.bt-rd:hover {
  box-shadow: 0 0 0 0.4rem #5838E6 inset;
}
button.set-po {
  background: #5838E6;
  color: #ffffff;
}
button.set-po:hover {
  background: rgb(59.7991071429, 26.2276785714, 208.7723214286);
  box-shadow: unset;
  color: #ffffff;
}
button.set-de {
  background: #333333;
  color: #ffffff;
  box-shadow: 0 0 0 2px #333333 inset;
}
button.set-de:hover {
  background: #222222;
  box-shadow: unset;
  color: #ffffff;
}

/* 1024px */
/* 960px */
@media screen and (max-width: 960px) {
  .StepQNA dd {
    justify-content: flex-start;
  }
  .user-info {
    padding: 6vw;
  }
  .user-info dl {
    flex-direction: column;
  }
  .user-info dl dd::before {
    display: none;
  }
  .stepSubmit .ss_info dl {
    align-items: unsafe;
    flex-direction: column;
  }
  .stepSubmit .ss_info dt {
    width: 100%;
    border-radius: 0.4rem;
    font-size: max(2.5vw, 1.8rem);
  }
  .stepSubmit .ss_info dd {
    text-align: center;
    word-break: keep-all;
    font-size: max(2.5vw, 1.8rem);
  }
  .stepSubmit .ss_info dd .line {
    background: none;
    display: block;
  }
}
/* 720px */
@media screen and (max-width: 720px) {
  .StepGuide {
    padding: 4vw 3vw;
  }
  .StepGuide dl dt {
    display: none;
  }
  .StepGuide dl.active::before {
    content: "";
    width: 1rem;
    height: 1rem;
    border-radius: 10rem;
    background: #BDF03E;
    margin-right: 1.6vw;
    animation: ani-flicker 400ms ease-in-out infinite 500ms alternate-reverse;
  }
  .StepGuide dl:not(:last-child)::after {
    width: 8px;
    height: 12px;
  }
  .StepQNA label i {
    width: 1.6rem;
    height: 1.6rem;
  }
  .StepQNA label i::before {
    width: 50%;
    height: 50%;
  }
  .StepKEY dl {
    flex-direction: column;
    gap: 2vw;
  }
  .StepKEY label {
    padding: 0.8rem 1.6rem;
  }
  br.forPC {
    display: none;
  }
}
@media screen and (max-width: 535px) {
  .stepForm .form-user dl dd .per_nums {
    flex-direction: column;
  }
  .stepForm .form-user dl dd .per_nums div:has(button, a) {
    width: 100%;
  }
  .stepForm .form-user dl dd .per_nums div:has(button, a) button, .stepForm .form-user dl dd .per_nums div:has(button, a) a {
    width: 100%;
  }
}