#wrap {
  width: 100%;
  min-height: 100vh;
  background: #ffda57;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12rem;
}
#wrap > img {
  width: 15rem;
}



.process_wrap {text-align: center;}
.process_wrap h2 {font-size: 1.3rem;font-weight: 600;color: #fff;line-height: 1.4;}
.process_wrap .process {border-radius: 10rem;width: 15rem;height: 2rem;border: 2px solid #fff;padding: 2px;}
.process_wrap .process .inner {width: 100%;height: 100%;background-image: linear-gradient(to right, #ffdb5c, #fff8a8);border-radius: 10rem;box-shadow: 0 0 1rem rgba(255, 255, 255, .1) inset;}









/* 모달 */
#wrap.on .modal {display: block}
.modal {
  display:none;
  position: fixed;
  min-height: 100vh;
  width: 100%;
  left: 0;
  right: 0;
  top: 0;
  z-index: 100000;
  background: transparent;
}
.modal .modal_bg {
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background: rgba(0,0,0,.4);
}
.modal_box {
  background: #fff;
  padding: 4rem 4rem 5rem;
  max-width:500px;
  width: 90%;
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%,-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 2rem;
  /* box-shadow: 0 0 1rem rgba(0,0,0,.5); */
  z-index: 101;
}
.modal_box form {
  width: 100%;
}
.modal_box form span {
  display: flex;
  flex-direction: column;
}
.modal_box h3 {
  font-size: 2rem;
  font-weight: 600;
  color: #111;
  margin-bottom: 2rem;
  text-align: left;
  width: 100%;
  line-height: 1.4;
}
.modal_box h3 .point {
  font-size: inherit;
  font-weight: inherit;
  background-image: linear-gradient(transparent 0 , transparent 70%, #ffda57 70%);
  color: #999;
}
.modal_box form span > label {
  font-size: 1.8rem;
  font-weight: 600;
  color: #111;
  margin-bottom: 1rem;
}

.modal_box form .gender_radio {display: flex;justify-content: space-between;margin-bottom: 2rem;}
.modal_box form .gender_radio input[type=radio] {display: none;}
.modal_box form .gender_radio input[type=radio]+label {
  border: 1px solid #ffda57;
  background-color: #fff;
  border-radius: 10rem;
  padding: 1.5rem 3rem;
  font-size: 1.8rem;
  text-align: center;
  width: calc(50% - .5rem) ;
}
.modal_box form input {
  border: 1px solid #ffda57;
  background-color: #fff;
  border-radius: 10rem;
  padding: 1.5rem 3rem;
  font-size: 1.8rem;
  margin-bottom: 2rem;
  text-align: center;
  width: 100%;
}
.modal_box form input[type=text]{
  text-align: center;
}
.modal_box form .gender_radio input[type=radio]:checked+label{background-color: #ffda57;color: #333;}

.modal_box button {
  width: 100%;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 1.5rem;
  display: block;
  background: #ffda57;
  border-radius: 2.5rem;
  text-align: center;
}
