.div-wrapper {

   overflow: auto;
    flex: none;
    position: relative;
    width: 390px;
    height: 100vh;
    background: #fff;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overscroll-behavior: none;

}

.div-wrapper .bg {
  position: absolute;
  top: 58px;
  left: 1px;
  width: 390px;
  height: 1706px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 1) 12%,
    rgba(189, 222, 255, 1) 45%,
    rgba(255, 255, 255, 1) 100%
  );
  opacity: 0.8;
}

.div-wrapper .banner-section {
  display: flex;
  flex-direction: column;
  width: 390px;
  align-items: center;
  gap: 16px;
  padding: 0px 20px;
  position: absolute;
  top: 1855px;
  left: 0;
}

.div-wrapper .banner {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
  background-color: #00aeff;
  border-radius: 16px;
}

.div-wrapper .emoji-moreng {
  display: inline-flex;
  height: 34px;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.div-wrapper .artwork {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  position: relative;
}

.div-wrapper .frame {
  position: relative;
  align-self: stretch;
  width: 34px;
}

.div-wrapper .minimal-clipboard {
  position: absolute;
  width: 247.06%;
  top: -14px;
  left: -73.15%;
  height: 56px;
  aspect-ratio: 1.5;
  object-fit: cover;
}

.div-wrapper .content {
  display: flex;
  align-items: center;
  gap: 6px;
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.div-wrapper .text-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  margin-top: -1.00px;
  font-family: var(--body-2-normal-bold-font-family);
  font-weight: var(--body-2-normal-bold-font-weight);
  color: #ffffff;
  font-size: var(--body-2-normal-bold-font-size);
  letter-spacing: var(--body-2-normal-bold-letter-spacing);
  line-height: var(--body-2-normal-bold-line-height);
  font-style: var(--body-2-normal-bold-font-style);
}

.div-wrapper .icon-normal-chevron {
  display: flex;
  flex-direction: column;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  position: relative;
}

.div-wrapper .ratio {
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.div-wrapper .shape {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

.div-wrapper .normal {
  position: absolute;
  width: 34.58%;
  height: 61.67%;
  top: 19.17%;
  left: 35.83%;
}

.div-wrapper .div {
  position: absolute;
  top: 58px;
  left: 20px;
  width: 350px;
  height: 220px;
  background-color: #101f52;
  border-radius: 16px;
  overflow: hidden;
}

.div-wrapper .rectangle {
  position: absolute;
  top: 118px;
  left: 0;
  width: 350px;
  height: 102px;
  background: linear-gradient(
    180deg,
    rgba(12, 35, 113, 0) 0%,
    rgba(19, 43, 124, 1) 100%
  );
}

.div-wrapper .element-wrapper {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 4px 10px;
  position: absolute;
  top: 182px;
  left: 292px;
  background-color: #00000099;
  border-radius: 12px;
}

.div-wrapper .element {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Pretendard-Bold", Helvetica;
  font-weight: 400;
  color: transparent;
  font-size: 12px;
  text-align: center;
  letter-spacing: 0.48px;
  line-height: normal;
  white-space: nowrap;
}

.div-wrapper .span {
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.06px;
}

.div-wrapper .text-wrapper-2 {
  font-family: "Pretendard-Regular", Helvetica;
  color: #ffffffcc;
  letter-spacing: 0.06px;
}

.div-wrapper .p {
  position: absolute;
  top: 90px;
  left: 20px;
  font-family: "Pretendard-Bold", Helvetica;
  font-weight: 700;
  color: transparent;
  font-size: 24px;
  letter-spacing: -0.48px;
  line-height: 31.2px;
}

.div-wrapper .text-wrapper-3 {
  color: #3ff8ff;
  letter-spacing: -0.12px;
}

.div-wrapper .text-wrapper-4 {
  color: #ffffff;
  letter-spacing: -0.12px;
}

.div-wrapper .text-wrapper-5 {
  position: absolute;
  top: 160px;
  left: 20px;
  font-family: var(--body-2-normal-regular-font-family);
  font-weight: var(--body-2-normal-regular-font-weight);
  color: #ffffff;
  font-size: var(--body-2-normal-regular-font-size);
  letter-spacing: var(--body-2-normal-regular-letter-spacing);
  line-height: var(--body-2-normal-regular-line-height);
  white-space: nowrap;
  font-style: var(--body-2-normal-regular-font-style);
}

.div-wrapper .frame-2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 2px 8px;
  position: absolute;
  top: 20px;
  left: 20px;
  background-color: #ffffff;
  border-radius: 100px;
}

.div-wrapper .text-wrapper-6 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Pretendard-Bold", Helvetica;
  font-weight: 700;
  color: #1a2a5b;
  font-size: 12px;
  letter-spacing: -0.24px;
  line-height: 15.6px;
  white-space: nowrap;
}

.div-wrapper .element-render-hand {
  position: absolute;
  top: 0;
  left: 196px;
  width: 154px;
  height: 173px;
  aspect-ratio: 1;
  object-fit: cover;
}

.div-wrapper .element-2 {
  display: flex;
  flex-direction: column;
  width: 351px;
  align-items: flex-start;
  gap: 16px;
  position: absolute;
  top: 310px;
  left: 20px;
}

.div-wrapper .div-2 {
  position: relative;
  align-self: stretch;
  margin-top: -1.00px;
  font-family: "Pretendard Variable-Bold", Helvetica;
  font-weight: 700;
  color: transparent;
  font-size: 22px;
  letter-spacing: -0.51px;
  line-height: 30.8px;
}

.div-wrapper .text-wrapper-7 {
  color: #2198fa;
  letter-spacing: -0.11px;
}

.div-wrapper .text-wrapper-8 {
  color: #000000;
  letter-spacing: -0.11px;
}

.div-wrapper .text-wrapper-9 {
  color: #171719;
  letter-spacing: -0.11px;
}

.div-wrapper .frame-3 {
  display: flex;
  align-items: center;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.div-wrapper .group-wrapper {
  position: relative;
  width: 117px;
  height: 128px;
}

.div-wrapper .group {
  position: relative;
  top: 8px;
  left: 18px;
  width: 83px;
  height: 110px;
}

.div-wrapper .ellipse {
  left: 1px;
  background-color: #d3e5f5;
  position: absolute;
  top: 0;
  width: 80px;
  height: 80px;
  border-radius: 40px;
}

.div-wrapper .img-frame {
  position: absolute;
  top: 13px;
  left: 13px;
  width: 54px;
  height: 54px;
  display: flex;
}

.div-wrapper .bunhongsaeg {
  width: 51px;
  height: 53px;
  margin-left: 2px;
  aspect-ratio: 0.96;
  object-fit: cover;
}

.div-wrapper .text-wrapper-10 {
  position: absolute;
  top: 91px;
  left: 0;
  font-family: "Pretendard-SemiBold", Helvetica;
  font-weight: 600;
  color: var(--global-tokens-gray-600);
  font-size: 15px;
  text-align: center;
  letter-spacing: -0.30px;
  line-height: 19.5px;
  white-space: nowrap;
}

.div-wrapper .group-2 {
  position: relative;
  top: 8px;
  left: 19px;
  width: 82px;
  height: 110px;
  display: flex;
  flex-direction: column;
  gap: 11px;
}

.div-wrapper .img {
  width: 80px;
  height: 80px;
}

.div-wrapper .text-wrapper-11 {
  margin-left: 4px;
  width: 71px;
  height: 19px;
  font-family: "Pretendard-SemiBold", Helvetica;
  font-weight: 600;
  color: var(--global-tokens-gray-600);
  font-size: 15px;
  text-align: center;
  letter-spacing: -0.30px;
  line-height: 19.5px;
  white-space: nowrap;
}

.div-wrapper .group-3 {
  position: relative;
  top: 8px;
  left: 19px;
  width: 82px;
  height: 110px;
}

.div-wrapper .ellipse-2 {
  left: 0;
  background-color: #e6e1fb;
  position: absolute;
  top: 0;
  width: 80px;
  height: 80px;
  border-radius: 40px;
}

.div-wrapper .text-wrapper-12 {
  position: absolute;
  top: 91px;
  left: 17px;
  font-family: "Pretendard-SemiBold", Helvetica;
  font-weight: 600;
  color: var(--global-tokens-gray-600);
  font-size: 15px;
  text-align: center;
  letter-spacing: -0.30px;
  line-height: 19.5px;
  white-space: nowrap;
}

.div-wrapper .img-frame-2 {
  position: absolute;
  top: 13px;
  left: 13px;
  width: 54px;
  height: 54px;
  display: flex;
  overflow: hidden;
}

.div-wrapper .image-wrapper {
  margin-top: -2px;
  width: 58px;
  height: 56px;
  margin-left: -2px;
  display: flex;
}

.div-wrapper .image {
  margin-top: 2px;
  width: 54px;
  height: 54px;
  margin-left: 2px;
  aspect-ratio: 1.03;
  object-fit: cover;
}

.div-wrapper .view {
  width: 350px;
  align-items: flex-start;
  gap: 20px;
  position: absolute;
  top: 1485px;
  left: 20px;
  display: flex;
  flex-direction: column;
}

.div-wrapper .frame-4 {
  display: flex;
  width: 350px;
  align-items: center;
  justify-content: space-between;
  position: relative;
  flex: 0 0 auto;
}

.div-wrapper .text-wrapper-13 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Pretendard-Bold", Helvetica;
  font-weight: 700;
  color: #000000;
  font-size: 20px;
  letter-spacing: 0;
  line-height: 26.0px;
  white-space: nowrap;
}

.div-wrapper .img-2 {
  position: relative;
  width: 24px;
  height: 24px;
}

.div-wrapper .frame-5 {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.div-wrapper .frame-6 {
  display: flex;
  flex-direction: column;
  /*width: 160px;*/
  align-items: flex-start;
  gap: 12.89px;
  position: relative;
   width: 100%;       /* 슬라이드 안에서 꽉 차도록 */
  max-width: 350px;
  
}

.div-wrapper .frame-wrapper {
  position: relative;
  align-self: stretch;
  width: 100%;
  height: 197px;
  background-color: #bbbbbb;
  border-radius: 12.89px;
  overflow: hidden;
}

.div-wrapper .frame-7 {
  width: 160px;
  height: 197px;
  display: flex;
  border-radius: 12.89px;
  border: 1.07px solid;
  border-color: #0000001a;
  background-image: url(./img/frame-1261154997-2.png);
  background-size: cover;
  background-position: 50% 50%;
}

.div-wrapper .frame-8 {
  display: inline-flex;
  margin-top: 157px;
  width: 75.89px;
  height: 25.59px;
  margin-left: 71.1px;
  position: relative;
  align-items: center;
  justify-content: center;
  gap: 10.74px;
  padding: 4.3px 6.44px;
  background-color: #00000080;
  border-radius: 107.38px;
}

.div-wrapper .text-wrapper-14 {
  position: relative;
  width: fit-content;
  margin-top: -1.07px;
  font-family: "Pretendard-SemiBold", Helvetica;
  font-weight: 600;
  color: #ffffff;
  font-size: 14px;
  letter-spacing: -0.28px;
  line-height: normal;
}

.div-wrapper .frame-9 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6.44px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.div-wrapper .text-wrapper-15 {
  position: relative;
  align-self: stretch;
  margin-top: -1.07px;
  font-family: "Pretendard-Bold", Helvetica;
  font-weight: 700;
  color: var(--global-tokens-colors-black-angst-100);
  font-size: 18px;
  letter-spacing: -0.72px;
  line-height: normal;
}

.div-wrapper .text-wrapper-16 {
  position: relative;
  align-self: stretch;
  font-family: "Pretendard-Regular", Helvetica;
  font-weight: 400;
  color: var(--global-tokens-gray-500);
  font-size: 16px;
  letter-spacing: -0.64px;
  line-height: 22.4px;
}

.div-wrapper .frame-10 {
  position: relative;
  background-image: url(./img/frame-1261154997-2.png);
  width: 160px;
  height: 197px;
  border-radius: 12.89px;
  border: 1.07px solid;
  border-color: #0000001a;
  background-size: cover;
  background-position: 50% 50%;
}

.div-wrapper .frame-11 {
  position: absolute;
  top: 157px;
  left: 71px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10.74px;
  padding: 4.3px 6.44px;
  background-color: #00000080;
  border-radius: 107.38px;
}

.div-wrapper .hospital-interia {
  position: absolute;
  top: -19px;
  left: 0;
  width: 176px;
  height: 236px;
  border-radius: 16px;
  border: 1px solid;
  border-color: #0000001a;
  aspect-ratio: 0.75;
  background-image: url(./img/hospital-interia.png);
  background-size: cover;
  background-position: 50% 50%;
}

.div-wrapper .frame-12 {
  position: relative;
  top: 176px;
  left: 72px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10.74px;
  padding: 4.3px 6.44px;
  background-color: #00000080;
  border-radius: 107.38px;
}

.div-wrapper .view-wrapper {
  position: absolute;
  top: 517px;
  left: 20px;
  width: 350px;
  height: 926px;
  display: flex;
  justify-content: center;
}

.div-wrapper .view-2 {
  width: 350px;
  height: 926px;
  align-items: center;
  box-shadow: var(--con);
  display: flex;
  flex-direction: column;
}

.div-wrapper .frame-13 {
  height: 80px;
  width: 350px;
  display: flex;
  background-color: #ffffff66;
  border-radius: 16px 16px 0px 0px;
  overflow: hidden;
}

.div-wrapper .img-wrapper {
  margin-top: 16px;
  width: 48px;
  height: 48px;
  margin-left: 16px;
  display: flex;
}

.div-wrapper .image-2 {
  margin-top: 2.4px;
  width: 37.35px;
  height: 43.49px;
  margin-left: 4.8px;
  aspect-ratio: 0.86;
  object-fit: cover;
}

.div-wrapper .AI {
  margin-top: 27px;
  width: 94px;
  height: 26px;
  margin-left: 4px;
  font-family: "Pretendard-Bold", Helvetica;
  font-weight: 700;
  color: transparent;
  font-size: 20px;
  letter-spacing: 0;
  line-height: 26.0px;
  white-space: nowrap;
}

.div-wrapper .text-wrapper-17 {
  color: #2299fa;
}

.div-wrapper .text-wrapper-18 {
  color: #302e3d;
}

.div-wrapper .text-wrapper-19 {
  height: 18px;
  width: 87px;
  align-self: center;
  margin-left: 85px;
  font-family: "Pretendard-Medium", Helvetica;
  font-weight: 500;
  color: #2299fa;
  font-size: 14px;
  text-align: right;
  letter-spacing: -0.28px;
  line-height: 18.2px;
  white-space: nowrap;
}

.div-wrapper .frame-14 {
  height: 846px;
  width: 350px;
  position: relative;
  background-color: #ffffff;
  border-radius: 0px 0px 16px 16px;
  overflow: hidden;
}

.div-wrapper .frame-15 {
  position: absolute;
  top: 24px;
  left: 16px;
  width: 318px;
  height: 156px;
  display: flex;
  background-color: var(--global-tokens-gray-50);
  border-radius: 16px;
  overflow: hidden;
}

.div-wrapper .frame-16 {
  display: flex;
  margin-top: 16px;
  width: 298px;
  height: 124px;
  margin-left: 16px;
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.div-wrapper .frame-17 {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
  position: relative;
  flex: 0 0 auto;
  margin-right: -6.00px;
}

.div-wrapper .text-wrapper-20 {
  position: relative;
  width: 274px;
  margin-top: -1.00px;
  font-family: "Pretendard Variable-Regular", Helvetica;
  font-weight: 400;
  color: var(--global-tokens-gray-600);
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 20.8px;
}

.div-wrapper .frame-18 {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.div-wrapper .text-wrapper-21 {
  position: relative;
  width: 268px;
  margin-top: -1.00px;
  font-family: "Pretendard Variable-Regular", Helvetica;
  font-weight: 400;
  color: var(--global-tokens-gray-600);
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 20.8px;
}

.div-wrapper .frame-19 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.div-wrapper .image-3 {
  position: relative;
  width: 24px;
  height: 24px;
  aspect-ratio: 1;
  object-fit: cover;
}

.div-wrapper .text-wrapper-22 {
  position: relative;
  width: 268px;
  font-family: "Pretendard Variable-Regular", Helvetica;
  font-weight: 400;
  color: var(--global-tokens-gray-600);
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 20.8px;
}

.div-wrapper .frame-20 {
  display: flex;
  flex-direction: column;
  width: 320px;
  align-items: flex-start;
  gap: 16px;
  position: absolute;
  top: 207px;
  left: 16px;
}

.div-wrapper .frame-21 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.div-wrapper .frame-22 {
  display: inline-flex;
  align-items: flex-start;
  gap: 6px;
  position: relative;
  flex: 0 0 auto;
}

.div-wrapper .text-wrapper-23 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Pretendard-Medium", Helvetica;
  font-weight: 500;
  color: #000000cc;
  font-size: 16px;
  text-align: right;
  letter-spacing: -0.96px;
  line-height: normal;
  white-space: nowrap;
}

.div-wrapper .frame-23 {
  display: flex;
  height: 59px;
  align-items: center;
  gap: 8.57px;
  padding: 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: var(--graygray-1);
  border-radius: 10px;
}

.div-wrapper .text-wrapper-24 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Pretendard-Regular", Helvetica;
  font-weight: 400;
  color: var(--global-tokens-gray-400);
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 20.8px;
  white-space: nowrap;
}

.div-wrapper .frame-24 {
  display: flex;
  height: 59px;
  align-items: center;
  gap: 174px;
  padding: 12px;
  position: relative;
  align-self: stretch;
  width: 100%;
  background-color: var(--graygray-1);
  border-radius: 10px;
}

.div-wrapper .icon-size {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  position: relative;
  flex: 0 0 auto;
}

.div-wrapper .button {
  all: unset;
  box-sizing: border-box;
  background-color: var(--semanticprimarynormal);
  display: flex;
  width: 155px;
  height: 44px;
  align-items: center;
  justify-content: center;
  gap: var(--semantic-gap-2);
  padding: 0px var(--semantic-padding-8) 0px var(--semantic-padding-8);
  position: absolute;
  top: 560px;
  border-radius: var(--semantic-radius-medium4);
}

.div-wrapper .text-wrapper-25 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  font-family: var(--m3-title-medium-font-family);
  font-weight: var(--m3-title-medium-font-weight);
  color: var(--mode-color-text-inverse-static);
  font-size: var(--m3-title-medium-font-size);
  letter-spacing: var(--m3-title-medium-letter-spacing);
  line-height: var(--m3-title-medium-line-height);
  position: relative;
  text-align: center;
  font-style: var(--m3-title-medium-font-style);
}

.div-wrapper .button-2 {
  all: unset;
  box-sizing: border-box;
  left: 163px;
  background-color: #ffe812;
  display: flex;
  width: 155px;
  height: 44px;
  align-items: center;
  justify-content: center;
  gap: var(--semantic-gap-2);
  padding: 0px var(--semantic-padding-8) 0px var(--semantic-padding-8);
  position: absolute;
  top: 560px;
  border-radius: var(--semantic-radius-medium4);
}

.div-wrapper .text-wrapper-26 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 123px;
  margin-left: -8.00px;
  margin-right: -8.00px;
  font-family: "Roboto", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 16px;
  text-align: center;
  line-height: 24px;
}

.div-wrapper .checkbox {
  display: flex;
  width: 156px;
  align-items: center;
  justify-content: center;
  gap: var(--semantic-gap-3);
  position: absolute;
  top: 500px;
}

.div-wrapper .item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 3px 0px;
  position: relative;
  flex: 0 0 auto;
}

.div-wrapper .checkbox-item {
  display: flex;
  width: 24px;
  height: var(--semantic-size-height-4);
  align-items: center;
  padding: var(--semantic-padding-1);
  position: relative;
  background-color: var(--mode-color-element-inverse);
  border-radius: var(--semantic-radius-small2);
  border: 1px solid;
  border-color: var(--mode-color-border-gray-dark);
}

.div-wrapper .label {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: var(--semantic-gap-2-duplicate);
  position: relative;
  flex: 1;
  flex-grow: 1;
}

.div-wrapper .text-wrapper-27 {
  position: relative;
  align-self: stretch;
  margin-top: -1.00px;
  font-family: "Pretendard Variable-Regular", Helvetica;
  font-weight: 400;
  color: var(--mode-color-text-bolder);
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 24px;
}

.div-wrapper .fnb {
  position: fixed;
  left: 50%;
  bottom: 0;
  width: 390px;
  height: 80px;
  display: flex;
  justify-content: center;
  background-color: #ffffff;
  border-top-width: 1px;
  border-top-style: solid;
  border-color: #e1e2e4;
  margin-left: 45px;
  z-index:1000
}

.div-wrapper .frame-25 {
  display: inline-flex;
  margin-top: 16px;
  width: 327px;
  height: 46px;
  position: relative;
  align-items: flex-end;
  gap: 44px;
}

.div-wrapper .frame-26 {
  display: flex;
  flex-direction: column;
  width: 24px;
  align-items: center;
  gap: 4px;
  position: relative;
}

.div-wrapper .text-wrapper-28 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  font-family: "Pretendard-Medium", Helvetica;
  font-weight: 500;
  color: #737373;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.28px;
  line-height: 18.2px;
}

.div-wrapper .frame-27 {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  position: relative;
  flex: 0 0 auto;
}

.div-wrapper .text-wrapper-29 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  font-family: "Pretendard-Medium", Helvetica;
  font-weight: 500;
  color: #737373;
  font-size: 14px;
  text-align: center;
  letter-spacing: -0.28px;
  line-height: 18.2px;
  white-space: nowrap;
}

.div-wrapper .icon {
  position: absolute;
  width: 75.00%;
  height: 75.00%;
  top: 9.38%;
  left: 9.38%;
}

.div-wrapper .header {
  position: fixed;
  top: 0;
  left: 50%;
  height: 52px;
  background-color: #ffffff;
  width: 390px;
  display: flex;
  z-index: 1000; 
  margin-left: 45px;
}

.div-wrapper .header-2 {
  margin-top: 4px;
  height: 44px;
  position: relative;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 5px 20px;
  width: 390px;
  display: flex;
}

.div-wrapper .frame-28 {
  display: flex;
  width: 349.1px;
  align-items: center;
  justify-content: space-between;
  position: relative;
  flex: 0 0 auto;
  margin-bottom: -2.00px;
}

.div-wrapper .sildoc-logo {
  position: relative;
  width: 117.18px;
  height: 30px;
}

.div-wrapper .group-4 {
  position: absolute;
  width: 25.60%;
  height: 100%;
  top: 0;
  left: 0;
}

.div-wrapper .group-5 {
  position: absolute;
  width: 66.57%;
  height: 120.00%;
  top: -13.33%;
  left: 30.72%;
  display: flex;
}

.div-wrapper .text-wrapper-30 {
  flex: 1;
  width: 76px;
  font-family: "Kodchasan", Helvetica;
  font-weight: 600;
  color: #050548;
  font-size: 24px;
  letter-spacing: -0.48px;
  line-height: 36px;
  white-space: nowrap;
}

.div-wrapper .btn-chat {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 8px;
  position: relative;
  flex: 0 0 auto;
  background-color: #c3ebfd;
  border-radius: 100px;
  border: 1px solid #ffffff; /* 여기에 추가 */
}

.div-wrapper .message-square {
  position: relative;
  width: 18px;
  height: 18px;
  aspect-ratio: 1;
}

.div-wrapper .text-wrapper-31 {
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Pretendard Variable-Bold", Helvetica;
  font-weight: 700;
  color: var(--semanticprimarynormal);
  font-size: 14px;
  letter-spacing: 0.20px;
  line-height: 20.0px;
  white-space: nowrap;
  position: relative;
  text-align: center;
}
/* Original CSS code should be injected here */

/* Form input styling to match design */
.frame-23 input,
.frame-24 input {
  all: unset;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  font-family: "Pretendard-Regular", Helvetica;
  font-weight: 400;
  color: var(--global-tokens-gray-600);
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 20.8px;
}

.frame-23 input::placeholder,
.frame-24 input::placeholder {
  color: var(--global-tokens-gray-400);
}

.frame-23 input:focus,
.frame-24 input:focus {
  outline: 2px solid var(--semanticprimarynormal);
  outline-offset: -2px;
}

/* Checkbox styling */
.checkbox-item {
  all: unset;
  box-sizing: border-box;
  width: 24px;
  height: var(--semantic-size-height-4);
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--mode-color-element-inverse);
  border-radius: var(--semantic-radius-small2);
  border: 1px solid var(--mode-color-border-gray-dark);
  cursor: pointer;
}

.checkbox-item:checked {
  background-color: var(--semanticprimarynormal);
  border-color: var(--semanticprimarynormal);
}

.checkbox-item:checked::after {
  content: "✓";
  color: white;
  font-size: 14px;
  font-weight: bold;
}

.checkbox-item:focus {
  outline: 2px solid var(--semanticprimarynormal);
  outline-offset: 2px;
}

/* File input styling */
input[type="file"] {
  opacity: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.frame-23:has(input[type="file"]) {
  position: relative;
  cursor: pointer;
}

.frame-23:has(input[type="file"])::after {
  content: "파일을 첨부해 주세요.";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--global-tokens-gray-400);
  font-family: "Pretendard-Regular", Helvetica;
  font-weight: 400;
  font-size: 16px;
  letter-spacing: -0.32px;
  line-height: 20.8px;
  pointer-events: none;
}

/* Date input styling */
input[type="date"] {
  color-scheme: light;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
  position: absolute;
  right: 12px;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

/* Button accessibility improvements */
.button:focus,
.button-2:focus,
.btn-chat:focus {
  outline: 0px solid #4a90e2;
  outline-offset: 0px;
}

/* Navigation accessibility */
.frame-26,
.frame-27 {
  cursor: pointer;
}

.frame-26:hover,
.frame-27:hover {
  opacity: 0.8;
}

.frame-26:focus,
.frame-27:focus {
  outline: 2px solid var(--semanticprimarynormal);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Form validation styles */
input:invalid {
  border-color: var(--global-tokens-error);
}

input:valid {
  border-color: var(--global-tokens-colors-magical-green-400);
}

/* Screen reader only content */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Focus management for better keyboard navigation */
*:focus {
  outline: 2px solid var(--semanticprimarynormal);
  outline-offset: 2px;
}

/* Skip to main content link for screen readers */
.skip-link {
  position: absolute;
  top: -40px;
  left: 6px;
  background: var(--semanticprimarynormal);
  color: white;
  padding: 8px;
  text-decoration: none;
  border-radius: 4px;
  z-index: 1000;
}

.skip-link:focus {
  top: 6px;
}

/* 추천병원 Swiper 컨테이너 */
.hospital-swiper {
  width: 100%;
  overflow: hidden;   /* 스와이프 영역 넘치는 부분 숨김 */
  padding: 10px 0;
}

/* 각 슬라이드 */
.hospital-swiper .swiper-slide {
  width: 160px !important;  /* 카드 고정 너비 */
  flex-shrink: 0;           /* 줄어들지 않게 */
}

/* 기존 frame-6(article 카드)도 슬라이드 안에서 잘 보이도록 */
.div-wrapper .frame-6 {
  width: 100%;  /* 기존 160px → swiper-slide 크기 따르게 */
  max-width: 350px;
}


button {
    background: none;   
    border: none;       
    padding: 0;        
    margin: 0;
    cursor: pointer;   
}


.view .frame-4 button[aria-label="추천병원 더보기"] .img-2 {
    display: block;   
    width: 24px;      
    height: 24px;
}


/* pc버전 */
.pc_wrap{display: flex;align-items: center;justify-content: center;width: 100%;margin: 0 auto;gap:80px;background: #EBF0F5;box-sizing: border-box;}
.pc_wrap .pc_form{overflow: auto;display: flex;flex:none;flex-direction: column;position: relative;width: 400px;max-height:88vh;padding:30px 30px 0;background: #fff;box-sizing: border-box;}
.pc_wrap .pc_form .formbox{margin-top: 0;}
.pc_wrap .pc_form .grp_bot{flex:none;position: sticky;bottom:0px;z-index: 30;margin: 16px -20px 0;padding:16px 20px 16px;background: #fff;box-shadow: 0 -10px 10px #ffffffcc;}
/* form */
.badge_time{display: inline-flex;align-items: center;justify-content: center;margin-bottom: 24px;padding:8px 12px 8px 40px;border-radius: 18px;background: #D4F5FF url(/common/app/appv3/img/ico_time.svg) no-repeat left 12px center;color:#0F95D8;font-size: 14px;font-weight: 600;line-height: 130%;}

header.sub + main .formbox{margin-top: 17px;}

.formbox{margin-top: 30px;}
.formbox.bg{padding:20px;border-radius: 16px;background: #DDE7F2;}
.img_join{text-align: center;}
.join_tit{margin-top: 15px;color: #302F3E;font-size: 24px;font-weight: 700;line-height: 140%;}

.img_compbox{margin-top: 30px;text-align: center;}
.img_compbox .tit{margin-top: 16px;color:#302F3E;font-size: 22px;font-weight: 700;}
.img_compbox .tit_sub{margin-top: 12px;color:#535E68;font-size: 18px;}
.img_compbox .txt{margin-top: 41px;color:#535E68;font-size: 20px;font-weight: 700;}

.grp_form + .grp_form{margin-top: 24px;}
.grp_form > .tit{margin-bottom: 8px;color: #302F3E;font-size: 20px;font-weight: 500;line-height: 100%;letter-spacing: -1px;}
.grp_form > .tit.req::after{content: '*';margin-left: 6px;color:#ED75BB;font-size: 20px;}
.grp_form > .cont input,
.grp_form > .cont select,
.grp_form > .cont textarea{width: 100%;height: 59px;padding:0 12px;border:1px solid #F1F3F5;border-radius:8px;background:#F1F3F5;color:#302F3E;font-size: 18px;box-sizing: border-box;transition: all 0.3s;}
.grp_form > .cont textarea{height: 132px;padding: 16px 12px;resize: none;vertical-align: top;}
.grp_form > .cont select{background: #F1F3F5 url(/common/app/appv3/img/ico_select.svg) no-repeat center right 12px;appearance: none;}
.grp_form > .cont textarea::placeholder,
.grp_form > .cont input::placeholder{color:#868E96;}
.grp_form > .cont input:focus,
.grp_form > .cont textarea:focus,
.grp_form > .cont select:focus{border:1px solid #212529;background-color:#fff;outline: none;}
.grp_form > .cont .txt_err{display: none;margin-top: 8px;padding-left: 21px;background: url(/common/app/appv3/img/ico_error.svg) no-repeat left center;color:#EA2424;font-size: 16px;}
.grp_form > .cont input.error,
.grp_form > .cont .error input,
.grp_form > .cont .error select{border-color:#EA2424;}
.grp_form > .cont .error ~ .txt_err{display: block;}
.grp_form > .cont .flexbox{display: flex;align-items: center;gap: 8px;}
.grp_form > .cont .btn_upload{display: flex;align-items: center;justify-content: center;width: 100%;height: 59px;gap:8px;border-radius: 10px;background: #F1F3F5;font-size: 18px;font-weight: 500;}
.grp_form > .cont .btn_upload::after{content:'';display: inline-block;width: 24px;height: 24px;background: url(/common/app/appv3/img/ico_upload.svg) no-repeat center;}
.grp_form > .cont .btn_form{width: 100%;height: 55px;margin-top: 12px;border:1px solid #DAE1E8;border-radius: 10px;background: #fff;color:#86919C;font-size: 16px;}
.grp_form > .cont .txt_sub{margin-top: 8px;color: #7A7A7A;font-size: 18px;}
.grp_form > .cont > .btn_cm{margin-top: 12px;}
.formbox.bg .grp_form > .cont input{background: #fff;}
.ipt_pop{width: 100%;height: 59px;padding:0 12px;border:1px solid #F1F3F5;border-radius:8px;background:#F1F3F5;color:#302F3E;font-size: 18px;box-sizing: border-box;transition: all 0.3s;}

.notibox{display: flex;align-items: flex-start;padding: 16px 20px;border-radius: 12px;background: #FFEFF5;}
.notibox p{color:#333031;font-size: 18px;font-weight: 500;line-height: 140%;}
.notibox::before{content: '';display: inline-block;flex:none;width: 24px;height: 24px;margin-right: 8px;background: url(/common/app/appv3/img/ico_noti.svg) no-repeat center;}
.notibox.white{background: #fff;}
.notibox.white::before{background: url(/common/app/appv3/img/ico_noti_blue.svg) no-repeat center;}

.notimsg{margin-top: 24px;padding: 20px;border:1px solid #E6E6E6;border-radius: 12px;background: #fafafa;}
.notimsg:first-child{margin-top: 0;}
.notimsg .tit{color:#24ADF1;font-size: 18px;font-weight: 700;line-height: 140%;}
.notimsg .tit.tip{padding-left: 20px;background: url(/common/app/appv3/img/ico_tip.svg) no-repeat center left;}
.notimsg .tit.noti{padding-left: 20px;background: url(/common/app/appv3/img/ico_notired.svg) no-repeat center left;color:#C43151;}
.notimsg .tit.sch{padding-left: 20px;background: url(/common/app/appv3/img/ico_tipsch.svg) no-repeat center left;}
.notimsg .txt{color:#4B4B4B;font-size: 18px;font-weight: 500;line-height: 140%;}
.notimsg ul{margin-top: 8px;}
.notimsg ul li{display: flex;align-items: flex-start;gap:6px;color:#4B4B4B;font-size: 16px;font-weight: 500;line-height: 140%;}
.notimsg ul li::before{content:'';flex:none;width: 16px;height: 22px;background: url(/common/app/appv3/img/ico_notimsg.svg) no-repeat center;}
.notimsg ul li + li{margin-top: 8px;} 

.grp_check { display: flex; align-items: center;position: relative;}
.grp_check input[type="checkbox"] { position: absolute;top:1px;left:1px;width: 0px;height: 0px;} 
.grp_check label { display:inline-flex; align-items: center; position: relative; padding-left: 42px; color:#302F3E; font-size: 18px; font-weight: 700; line-height: 32px; cursor: pointer;} 
.grp_check label:before { content:''; display: inline-block; flex:none;position: absolute;left:0; width:32px; height: 32px;margin-right: 10px;border:1px solid #DEE2E6; border-radius:5px; background: #fff; box-sizing: border-box;transition: all 0.3s;}
.grp_check label:after { content: ''; position: absolute; top: 8px; left: 8px; width: 14px; height: 7px; border: 2px solid #DEE2E6; transform: rotate(-45deg); border-width: 0 0 3px 3px; } 
.grp_check input:focus{outline: none;}
.grp_check input[type="checkbox"]:checked + label:before { background: #00AAFF;border-color: #00AAFF;}
.grp_check input[type="checkbox"]:checked + label:after{border-color: #fff;}
.grp_check > a{margin-left: 10px;color: #AEB3BE;font-size: 16px;font-weight: 500;line-height: 32px;text-decoration-line: underline;}
.grp_check + .grp_check{margin-top: 12px;}

.grp_radio { display:flex;flex-direction: column;align-items: flex-start;gap:10px;}
.grp_radio li input[type="radio"] { display: none; } 
.grp_radio li label { display:inline-flex; align-items: center; color:#212529; font-size: 15px; font-weight: 500; cursor: pointer;vertical-align: top;} 
.grp_radio li label:before { content:''; display: inline-block; width:25px; height: 25px; margin-right:8px; border:1px solid #A9B0B8; border-radius: 50%; background: #fff; box-sizing: border-box; } 
.grp_radio li input[type="radio"]:checked + label:before {background: #FF7EB0;box-shadow: inset 0 0px 0px 4px #fff;} 

.btn_radio{display: flex;align-items: center;width: 100%;gap:10px;}
.btn_radio input{display: none;}
.btn_radio label{display: inline-flex;flex:1;align-items: center;justify-content: center;height: 55px;padding:9px 7px;border: 2px solid #F1F3F5;border-radius: 10px;background: #F1F3F5;color: #ADB5BD;font-size: 15px;font-weight: 600;line-height: 100%;text-align: center;box-sizing: border-box;cursor: pointer;}
.btn_radio input[type="radio"]:checked + label{background:#fff;color:#FF7EB0;font-weight: 700;border-color:#FF7EB0;}


.titbox{display: flex;align-items: center;margin-top: 32px;}
.titbox:first-child{margin-top: 0;}
.titbox.verti{flex-direction: column;align-items: flex-start;gap:10px;}
.titbox .tit{color:#302F3E;font-size: 24px;font-weight: 700;}
.titbox .tit .pt{display: inline-block;color:#00A7FC;}
.titbox .right{display: flex;align-items: center;margin-left: auto;}
.titbox .right .btn_tit{height: 36px;padding: 0 12px;border-radius: 10px;background: #302F3E;color:#fff;font-size: 16px;font-weight: 700;}
.titbox .right .link_more{display: inline-block;padding-right: 24px;background: url(/common/app/appv3/img/ico_link_more.svg) no-repeat center right;color:#6A6C6E;font-size: 18px;font-weight: 500;}
.titbox .tit.fw_m{font-weight: 500;}
.titbox .tit.fw_exb{font-weight: 800;}
.titbox .tit.ico_help,
.titbox .tit.ico_ex,
.titbox .tit.ico_chk{display: flex;align-items: center;gap:8px;font-size: 16px;line-height: 100%;}
.titbox .tit.ico_help::before{content: '';display: inline-block;width: 24px;height: 24px;background: url(/common/app/appv3/img/ico_hlep.svg) no-repeat center;}
.titbox .tit.ico_ex::before{content: '';display: inline-block;width: 24px;height: 24px;background: url(/common/app/appv3/img/ico_ex.svg) no-repeat center;}
.titbox .tit.ico_chk::before{content: '';display: inline-block;width: 24px;height: 24px;background: url(/common/app/appv3/img/ico_chk.svg) no-repeat center;}
.titbox .sub{color:#302F3E;font-size: 18px;}
.tabmenu + .titbox {margin-top: 20px;}
.bar + .titbox {margin-top: 32px;}
.titbox + .titbox{margin-top: 20px;}
.boxtit{display: flex;align-items: center;justify-content: center;height: 67px;margin-top: 15px;border: 1px solid #DEE2E6;border-radius: 10px;color:#212529;font-size: 18px;font-weight: 700;}
.boxtit + .titbox{margin-top: 20px;}
.txtbox{margin-top: 10px;}
.txtbox p{color:#302F3E;font-size: 16px;font-weight: 400;line-height: 130%;}
.imgbox img{margin-top: 24px;text-align: center;}
.imgbox p{padding: 0 16px;text-align: center;}
.imgbox .tit{color:#302F3E;font-size: 20px;font-weight: 700;line-height: 130%;}
.imgbox .txt{margin-top: 6px;color:#302F3E;font-size: 18px;line-height: 130%;}

.fz12{font-size: 12px !important;}
.fz13{font-size: 13px !important;}
.fz14{font-size: 14px !important;}
.fz15{font-size: 15px !important;}
.fz16{font-size: 16px !important;}
.fz18{font-size: 18px !important;}
.fz20{font-size: 18px !important;}
.fw_n{font-weight: 400 !important;}
.fw_m{font-weight: 500 !important;}
.fw_sb{font-weight: 600 !important;}
.fw_b{font-weight: 700 !important;}
.fw_exb{font-weight: 800 !important;}

p.txt{font-size: 16px;line-height: 130%;letter-spacing: -0.2px;}
p.txt.gray01{color:#86919C;}
p.txt.gray02{color:#515660;}
p.txt.gray03{color:#7A7F88;}
p.txt.gray04{color:#535E68;}
p.txt.gray05{color:#495057;}

.mt8{margin-top: 8px !important;}
.mt10{margin-top: 10px !important;}
.mt12{margin-top: 12px !important;}
.mt16{margin-top: 16px !important;}
.mt32{margin-top: 32px !important;}
.mt40{margin-top: 40px !important;}
.mb12{margin-bottom: 12px !important;}

.grp_bot{flex:none;margin-top: 20px;padding-top:30px;}
main .grp_bot{flex:none;position: sticky;bottom:0px;z-index: 30;margin: 16px -20px 0;padding:16px 20px 16px;background: #fff;box-shadow: 0 -10px 10px #ffffffcc;}
.grp_bot .txt{margin-bottom: 8px;font-size: 18px;font-weight: 500;line-height: 140%;text-align: center;}
.grp_bot .btn_bot{width: 100%;height: 50px;border-radius: 9px;background: #00AAFF;color:#fff;color:#F2F6FA;font-size: 20px;font-weight: 700;}
.grp_bot .btn_bot.gray{background: #A9B0B8;}
.grp_bot .btn_bot:disabled{background: #CDD8E3;}
.grp_bot .sub_txt{color:#86919C;font-size: 18px;font-weight: 500;text-align: center;}
.grp_bot .sub_txt a{display: inline-block;margin-left: 4px;color:#86919C;font-size: 18px;font-weight: 500;text-decoration: underline;}
.grp_bot .btn_bot + .sub_txt{margin-top: 20px;}
.grp_bot .grp_btn{display: flex;align-items: center;gap: 12px;}
.grp_bot .bot_bubble {position: absolute;top:-40px;left:50%;padding: 10px 16px;border-radius: 8px;background: #302F3E;color: #fff;font-size: 15px;font-weight: 500;white-space: pre;box-sizing: border-box;transform: translateX(-50%);}
.grp_bot .bot_bubble::after {content: '';position: absolute;bottom: -9px; left: 50%;width: 14px;height: 10px;background: #302F3E;transform: translateX(-50%);clip-path: polygon(50% 100%, 0 0, 100% 0);}

/* 모바일 전용 */
@media screen and (max-width: 767px) {
  .div-wrapper .fnb {
    left: 1px;
    margin-left: 0;
  }


  .div-wrapper .header {
  left: 0;
  margin-left: 0;
}
 

}


/* 모바일 전용 */
@media screen and (max-width: 767px) {
  .div-wrapper .fnb {
    left: 1px;
    margin-left: 0;
	height: 160px;
  }


  .div-wrapper .header {
  left: 0;
  margin-left: 0;
}
 

}


nav .footer{position: absolute;left: 35px;top: 70px;width:90%;height: 88px;color: #AEB3BE;text-align: left;line-height:20px;font-size:12px;}

a {
  color: inherit;      
  
}

a:hover, a:focus, a:active {
  color: inherit;      
 
}

/* Swiper 컨테이너 설정 */
    .swiper {
      width: 100%;
      height: 100%;
    }
    
    .swiper-slide {
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
    /* display: none 제거 - Swiper가 슬라이드 표시를 관리합니다 */
    .div {
      display: block !important;
    }

    /* Swiper 기본 pagination 숨김 */
    .swiper-pagination {
      display: none;
    }

    /* Swiper 기본 navigation 숨김 */
    .swiper-button-next,
    .swiper-button-prev {
      display: none;
    }