.super_main {
    background-color: #ffffff;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
}
.s_main {
    background-color: #ffffff;
    width: 1440px;
    position: relative;
    margin:0 auto;
}

.main {
    display: flex;
    flex-direction: column;
    width: 1440px;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: #ffffff;
  }
  
  .main .header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 8px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    background-color: #ffffff;
  }
  
  .main .header-navigation {
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    display: flex;
    width: 982px;
    padding: 8px 0px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .navigation-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .menu-item {
    width: 72px;
    padding: 4px 0px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
  }
  
  .main .text {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: var(--text-sm-medium-font-family);
    font-weight: var(--text-sm-medium-font-weight);
    color: var(--semantic-color-text-secondary);
    font-size: var(--text-sm-medium-font-size);
    letter-spacing: var(--text-sm-medium-letter-spacing);
    line-height: var(--text-sm-medium-line-height);
    white-space: nowrap;
    font-style: var(--text-sm-medium-font-style);
  }
  
  .main .div {
    align-items: center;
    justify-content: flex-end;
    gap: 96px;
    display: flex;
    width: 982px;
    padding: 8px 0px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .logo-playschool {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    position: relative;
    flex: 1;
    flex-grow: 1;
  }
  
  .main .playschool {
    position: relative;
    width: 180px;
    height: 48px;
  }
  
  .main .menu-items {
    width: 675px;
    gap: 60px;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;
  }
  
  .main .menu-item-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 4px;
    position: relative;
    flex: 1;
    align-self: stretch;
    flex-grow: 1;
  }
  
  .main .text-wrapper {
    position: relative;
    width: fit-content;
    font-family: var(--text-lg-semibold-font-family);
    font-weight: var(--text-lg-semibold-font-weight);
    color: var(--semantic-color-text-secondary);
    font-size: var(--text-lg-semibold-font-size);
    letter-spacing: var(--text-lg-semibold-letter-spacing);
    line-height: var(--text-lg-semibold-line-height);
    white-space: nowrap;
    font-style: var(--text-lg-semibold-font-style);
  }
  
  .main .div-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 4px;
    position: relative;
    align-self: stretch;
    flex: 0 0 auto;
  }
  
  .main .section {
    gap: 8px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .slider {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 360px;
    overflow: hidden;
  }
  
  .main .group {
    width: 4358px;
    height: 360px;
  }
  
  .main .frame-wrapper {
    display: inline-flex;
    flex-direction: column;
    height: 360px;
    align-items: flex-start;
    gap: 8px;
    position: relative;
  }
  
  .main .frame {
    position: relative;
    width: 4358px;
    height: 360px;
  }
  
  .main .hero-image {
    position: absolute;
    width: 1440px;
    height: 360px;
    top: 0;
    left: 0;
    background-color: var(--primaryebscokrpolar);
    overflow: hidden;
  }

  .main .overlap {
    position: absolute;
    width: 2438px;
    height: 360px;
    top: 0;
    left: 0px;
  }
  
  .main .section-2 {
    gap: 24px;
    padding: 48px 0px 96px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .title {
    display: flex;
    flex-direction: column;
    width: 982px;
    height: 42px;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 4px 0px;
    position: relative;
  }
  
  .main .text-wrapper-11 {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: var(--display-sm-semibold-font-family);
    font-weight: var(--display-sm-semibold-font-weight);
    color: var(--semantic-color-text-primary);
    font-size: var(--display-sm-semibold-font-size);
    text-align: center;
    letter-spacing: var(--display-sm-semibold-letter-spacing);
    line-height: var(--display-sm-semibold-line-height);
    white-space: nowrap;
    font-style: var(--display-sm-semibold-font-style);
  }
  
  .main .frame-10 {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .link-wrapper {
    display: flex;
    width: 982px;
    align-items: center;
    justify-content: flex-end;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .link {
    display: flex;
    width: 71px;
    align-items: center;
    justify-content: center;
    position: relative;
    border-radius: var(--semantic-border-radius-4);
  }
  
  .main .label {
    position: relative;
    width: fit-content;
    font-family: var(--text-sm-medium-font-family);
    font-weight: var(--text-sm-medium-font-weight);
    color: var(--semantic-color-text-interactive-primary);
    font-size: var(--text-sm-medium-font-size);
    letter-spacing: var(--text-sm-medium-letter-spacing);
    line-height: var(--text-sm-medium-line-height);
    white-space: nowrap;
    font-style: var(--text-sm-medium-font-style);
  }
  
  .main .chevron-right {
    position: relative;
    width: 24px;
    height: 24px;
  }
  
  .main .frame-11 {
    display: flex;
    flex-direction: column;
    width: 982px;
    align-items: flex-start;
    gap: 16px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .vertical-cards {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .program-cards {
    display: inline-flex;
    flex: 0 0 auto;
    margin-left: -1px;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
  }
  
  .main .base-card {
    display: flex;
    flex-direction: column;
    width: 312px;
    height: 359px;
    align-items: flex-start;
    justify-content: center;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--semantic-color-border-interactive-secondary);
    box-shadow: var(--m3-elevation-dark-1);
    gap: var(--semantic-spacing-0);
    cursor:pointer;
  }
  
  .main .program-image {
    display: flex;
    gap: 8px;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
  }
  
  .main .image-placeholder {
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
    background-image: url(/image/main/recom_1.png);
    background-size: cover;
    background-position: 50% 50%;
  }
  
  .main .content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding: 24px 16px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
    background-color: var(--semantic-color-background-bg-primary);
  }
  
  .main .text-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .headline {
    display: flex;
    flex-direction: column;
    height: 28px;
    align-items: flex-start;
    gap: 4px;
    position: relative;
    align-self: stretch;
    width: 100%;
  }
  
  .main .title-2 {
    position: relative;
    align-self: stretch;
    margin-top: -1px;
    font-family: var(--text-xl-semibold-font-family);
    font-weight: var(--text-xl-semibold-font-weight);
    color: #1d2939;
    font-size: var(--text-xl-semibold-font-size);
    letter-spacing: var(--text-xl-semibold-letter-spacing);
    line-height: var(--text-xl-semibold-line-height);
    font-style: var(--text-xl-semibold-font-style);
  }
  
  .main .description-set {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .description {
    display: flex;
    height: 24px;
    align-items: center;
    gap: 12px;
    position: relative;
    align-self: stretch;
    width: 100%;
  }
  
  .main .status-chip {
    display: inline-flex;
    height: 24px;
    align-items: center;
    gap: var(--semantic-spacing-2);
    padding: 8px var(--semantic-spacing-8) 8px var(--semantic-spacing-8);
    position: relative;
    flex: 0 0 auto;
    background-color: var(--semantic-color-bg-info-subtle);
    border-radius: 8px;
    box-shadow: var(--m3-elevation-light-1);
  }
  
  .main .status-chip-2 {
    position: relative;
    width: fit-content;
    margin-top: -6px;
    margin-bottom: -4px;
    font-family: var(--text-sm-semibold-font-family);
    font-weight: var(--text-sm-semibold-font-weight);
    color: var(--semantic-color-text-info-bold-duplicate);
    font-size: var(--text-sm-semibold-font-size);
    letter-spacing: var(--text-sm-semibold-letter-spacing);
    line-height: var(--text-sm-semibold-line-height);
    white-space: nowrap;
    font-style: var(--text-sm-semibold-font-style);
  }
  
  .main .description-2 {
    position: relative;
    flex: 1;
    font-family: var(--text-md-medium-font-family);
    font-weight: var(--text-md-medium-font-weight);
    color: var(--semantic-color-text-primary);
    font-size: var(--text-md-medium-font-size);
    letter-spacing: var(--text-md-medium-letter-spacing);
    line-height: var(--text-md-medium-line-height);
    font-style: var(--text-md-medium-font-style);
  }
  
  .main .base-card-wrapper {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .image-placeholder-2 {
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
    background-image: url(/image/main/recom_2.png);
    background-size: cover;
    background-position: 50% 50%;
  }
  
  .main .program-cards-2 {
    margin-right: -1px;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .base-card-2 {
    display: flex;
    flex-direction: column;
    width: 312px;
    height: 359px;
    align-items: flex-start;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid;
    border-color: var(--semantic-color-border-interactive-secondary);
    box-shadow: var(--m3-elevation-dark-1);
    gap: var(--semantic-spacing-0);
  }
  
  .main .image-placeholder-3 {
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
    background-image: url(/image/main/recom_3.png);
    background-size: cover;
    background-position: 50% 50%;
  }

  .main .image-placeholder-4 {
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
    background-image: url(/image/main/recom_4.png);
    background-size: cover;
    background-position: 50% 50%;
  }

  .main .image-placeholder-5 {
    position: relative;
    flex: 1;
    align-self: stretch;
    width: 100%;
    flex-grow: 1;
    background-image: url(/image/main/recom_5.png);
    background-size: cover;
    background-position: 50% 50%;
  }
  
  .main .frame-12 {
    display: inline-flex;
    align-items: flex-start;
    justify-content: center;
    gap: 1040px;
    position: absolute;
    top: 159px;
    left: -69px;
  }
  
  .main .arrow {
    justify-content: center;
    display: inline-flex;
    align-items: center;
    padding: var(--semantic-spacing-4);
    position: relative;
    flex: 0 0 auto;
    border-radius: 999px;
    border: 1px solid;
    border-color: var(--semantic-color-border-interactive-secondary);
    gap: var(--semantic-spacing-0);
    width: var(--semantic-spacing-40);
    height: var(--semantic-spacing-40);
  }
  
  .main .img-3 {
    position: relative;
    width: 32px;
    height: 32px;
  }
  
  .main .icon-chevron-right-wrapper {
    justify-content: flex-end;
    display: inline-flex;
    align-items: center;
    padding: var(--semantic-spacing-4);
    position: relative;
    flex: 0 0 auto;
    border-radius: 999px;
    border: 1px solid;
    border-color: var(--semantic-color-border-interactive-secondary);
    gap: var(--semantic-spacing-0);
    width: var(--semantic-spacing-40);
    height: var(--semantic-spacing-40);
  }
  
  .main .section-3 {
    gap: 48px;
    padding: 96px 0px;
    background-color: #f5f4f4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .title-3 {
    display: flex;
    flex-direction: column;
    width: 982px;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 4px 0px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .frame-13 {
    display: flex;
    width: 982px;
    align-items: flex-start;
    gap: 36px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .frame-14 {
    display: flex;
    flex-direction: column;
    width: 304px;
    height: 240px;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 44.8px 36px;
    position: relative;
    background-color: #fda073;
    border-radius: 19.2px;
    overflow: hidden;
    box-shadow: var(--m3-elevation-light-3);
  }
  
  .main .frame-15 {
    display: flex;
    width: 200px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 0px;
    position: relative;
    flex: 0 0 auto;
    margin-top: -25.3px;
    background-color: var(--color-background-warning-secondary-hover);
    border-radius: 24px;
    overflow: hidden;
  }
  
  .main .text-wrapper-12 {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: "Inter-SemiBold", Helvetica;
    font-weight: 600;
    color: #ff0303;
    font-size: 19.2px;
    letter-spacing: 0;
    line-height: 25.6px;
    white-space: nowrap;
  }
  
  .main .flexcontainer {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0px;
  }
  
  .main .span-wrapper {
    position: relative;
    align-self: stretch;
    font-family: "Inter-SemiBold", Helvetica;
    font-weight: 600;
    color: #ffffff;
    font-size: 24px;
    text-align: center;
    letter-spacing: 0;
    line-height: 32px;
  }
  
  .main .text-wrapper-13 {
    font-family: "Inter-SemiBold", Helvetica;
    font-weight: 600;
    color: #ffffff;
    font-size: 24px;
    letter-spacing: 0;
    line-height: 32px;
  }
  
  .main .text-wrapper-14 {
    position: relative;
    width: fit-content;
    margin-bottom: -24.5px;
    font-family: "Recipekorea-Medium", Helvetica;
    font-weight: 500;
    color: #f9ff00;
    font-size: 24px;
    letter-spacing: -0.48px;
    line-height: 38.4px;
    white-space: nowrap;
  }
  
  .main .frame-16 {
    display: flex;
    flex-direction: column;
    width: 304px;
    height: 240px;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 41.6px 30px;
    position: relative;
    background-color: #5dbda6;
    border-radius: 19.2px;
    overflow: hidden;
    box-shadow: var(--m3-elevation-light-3);
  }
  
  .main .frame-17 {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 32px;
    position: relative;
    flex: 0 0 auto;
    margin-top: -26.1px;
    margin-left: -11.5px;
    margin-right: -11.5px;
  }
  
  .main .frame-18 {
    background-color: var(--color-background-positive-secondary);
    display: flex;
    width: 200px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 0px;
    position: relative;
    flex: 0 0 auto;
    border-radius: 24px;
    overflow: hidden;
  }
  
  .main .text-wrapper-15 {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: "Inter-SemiBold", Helvetica;
    font-weight: 600;
    color: #0a634e;
    font-size: 19.2px;
    letter-spacing: 0;
    line-height: 25.6px;
    white-space: nowrap;
  }
  
  .main .text-wrapper-16 {
    position: relative;
    width: fit-content;
    margin-bottom: -25.3px;
    font-family: "Recipekorea-Medium", Helvetica;
    font-weight: 500;
    color: #f9ff00;
    font-size: 24px;
    letter-spacing: -0.48px;
    line-height: 38.4px;
    white-space: nowrap;
  }
  
  .main .frame-19 {
    display: flex;
    flex-direction: column;
    width: 304px;
    height: 240px;
    align-items: center;
    justify-content: center;
    gap: 24px;
    padding: 33.6px 16.8px;
    position: relative;
    margin-right: -2px;
    background-color: #6fb2d8;
    border-radius: 19.2px;
    overflow: hidden;
    box-shadow: var(--m3-elevation-light-3);
  }
  
  .main .frame-20 {
    margin-top: -14.1px;
    background-color: #a6cfe6;
    display: flex;
    width: 200px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 0px;
    position: relative;
    flex: 0 0 auto;
    border-radius: 24px;
    overflow: hidden;
  }
  
  .main .text-wrapper-17 {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: "Inter-SemiBold", Helvetica;
    font-weight: 600;
    color: #0d4564;
    font-size: 19.2px;
    letter-spacing: 0;
    line-height: 25.6px;
    white-space: nowrap;
  }
  
  .main .flexcontainer-2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  
  .main .text-wrapper-18 {
    position: relative;
    width: fit-content;
    margin-bottom: -13.3px;
    font-family: "Recipekorea-Medium", Helvetica;
    font-weight: 500;
    color: #f9ff00;
    font-size: 24px;
    letter-spacing: -0.48px;
    line-height: 38.4px;
    white-space: nowrap;
  }
  
  .main .section-4 {
    gap: 92px;
    padding: 96px 0px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .frame-21 {
    display: flex;
    width: 982px;
    align-items: center;
    gap: 24px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .view-wrapper {
    display: flex;
    flex-direction: column;
    width: 480px;
    align-items: flex-start;
    gap: 8px;
    padding: 24px 16px;
    position: relative;
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: #efefef;
    box-shadow: var(--shadows-shadow-xl);
  }
  
  .main .view {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 36px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .frame-22 {
    display: flex;
    align-items: center;
    gap: 8px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .title-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 16px;
    position: relative;
    flex: 1;
    flex-grow: 1;
  }
  
  .main .title-4 {
    position: relative;
    align-self: stretch;
    margin-top: -1px;
    font-family: var(--display-xs-semibold-font-family);
    font-weight: var(--display-xs-semibold-font-weight);
    color: var(--semantic-color-text-primary);
    font-size: var(--display-xs-semibold-font-size);
    letter-spacing: var(--display-xs-semibold-letter-spacing);
    line-height: var(--display-xs-semibold-line-height);
    font-style: var(--display-xs-semibold-font-style);
  }
  
  .main .plus-button {
    position: relative;
    width: 36px;
    height: 36px;
  }
  
  .main .frame-23 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 16px;
    padding: 0px 2px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .title-5 {
    position: relative;
    flex: 1;
    align-self: stretch;
    margin-top: -1px;
    font-family: var(--text-xl-medium-font-family);
    font-weight: var(--text-xl-medium-font-weight);
    color: var(--semantic-color-text-primary);
    font-size: var(--text-xl-medium-font-size);
    letter-spacing: var(--text-xl-medium-letter-spacing);
    line-height: var(--text-xl-medium-line-height);
    white-space: nowrap;
    font-style: var(--text-xl-medium-font-style);
  }
  
  .main .date {
    position: relative;
    width: fit-content;
    font-family: var(--text-md-regular-font-family);
    font-weight: var(--text-md-regular-font-weight);
    color: #98a1b2;
    font-size: var(--text-md-regular-font-size);
    text-align: right;
    letter-spacing: var(--text-md-regular-letter-spacing);
    line-height: var(--text-md-regular-line-height);
    white-space: nowrap;
    font-style: var(--text-md-regular-font-style);
  }
  
  .main .event-wrapper {
    display: flex;
    flex-direction: column;
    width: 480px;
    align-items: center;
    gap: 8px;
    padding: 24px 16px;
    position: relative;
    margin-right: -2px;
    background-color: #ffffff;
    border-radius: 8px;
    border: 1px solid;
    border-color: #efefef;
    box-shadow: var(--shadows-shadow-xl);
  }
  
  .main .event {
    display: flex;
    flex-direction: column;
    width: 434px;
    align-items: flex-start;
    justify-content: center;
    gap: 36px;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .title-6 {
    position: relative;
    flex: 1;
    margin-top: -1px;
    font-family: var(--text-xl-medium-font-family);
    font-weight: var(--text-xl-medium-font-weight);
    color: var(--semantic-color-text-primary);
    font-size: var(--text-xl-medium-font-size);
    letter-spacing: var(--text-xl-medium-letter-spacing);
    line-height: var(--text-xl-medium-line-height);
    font-style: var(--text-xl-medium-font-style);
  }
  
  .main .footer {
    align-items: center;
    gap: 8px;
    padding: 48px 144px;
    align-self: stretch;
    width: 100%;
    background-color: var(--semantic-color-bg-secondary);
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .footer-container {
    width: 956px;
    align-items: flex-start;
    gap: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    flex: 0 0 auto;
  }
  
  .main .row {
    display: inline-flex;
    height: 26px;
    align-items: center;
    gap: 16px;
    position: relative;
  }
  
  .main .text-wrapper-19 {
    position: relative;
    width: fit-content;
    font-family: var(--text-md-medium-font-family);
    font-weight: var(--text-md-medium-font-weight);
    color: var(--semantic-color-text-secondary);
    font-size: var(--text-md-medium-font-size);
    letter-spacing: var(--text-md-medium-letter-spacing);
    line-height: var(--text-md-medium-line-height);
    white-space: nowrap;
    font-style: var(--text-md-medium-font-style);
  }
  
  .main .vector {
    position: relative;
    align-self: stretch;
    width: 100%;
    height: 1px;
    object-fit: cover;
  }
  
  .main .row-2 {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .text-wrapper-20 {
    position: relative;
    width: fit-content;
    margin-top: -1px;
    font-family: var(--display-xs-semibold-font-family);
    font-weight: var(--display-xs-semibold-font-weight);
    color: var(--semantic-color-text-secondary);
    font-size: var(--display-xs-semibold-font-size);
    letter-spacing: var(--display-xs-semibold-letter-spacing);
    line-height: var(--display-xs-semibold-line-height);
    white-space: nowrap;
    font-style: var(--display-xs-semibold-font-style);
  }
  
  .main .text-i {
    position: relative;
    align-self: stretch;
    font-family: "Inter-Medium", Helvetica;
    font-weight: 500;
    color: var(--semantic-color-text-secondary);
    font-size: 16px;
    letter-spacing: 0;
    line-height: 24px;
  }
  
  .main .text-wrapper-21 {
    font-family: "Inter-Medium", Helvetica;
    font-weight: 500;
    color: #737373;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 24px;
  }
  
  .main .tbtn_area {
    display: flex;
    width:270px;
    height:auto;
    align-items: flex-end;
    justify-content: flex-end;
    position: relative;
  }

  .main .menu-item-2 {
    width: 120px;
    height: 48px;
    /* align-items: center;
    justify-content: center; */
    gap: 8px;
    padding: 15px 16px;
    position: relative;
    background-color: var(--semantic-color-bg-interactive-primary);
    border-radius: 8px;
  }
  
  .main .text-5 {
    position: relative;
    width: fit-content;
    margin-left: -2.5px;
    margin-right: -2.5px;
    font-family: var(--text-md-semibold-font-family);
    font-weight: var(--text-md-semibold-font-weight);
    color: var(--semantic-color-text-interactive-inverse);
    font-size: var(--text-md-semibold-font-size);
    letter-spacing: var(--text-md-semibold-letter-spacing);
    line-height: var(--text-md-semibold-line-height);
    white-space: nowrap;
    font-style: var(--text-md-semibold-font-style);
  }
  
  .main .copyright-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px 0px;
    position: relative;
    align-self: stretch;
    width: 100%;
    flex: 0 0 auto;
  }
  
  .main .copyright {
    position: relative;
    flex: 1;
    margin-top: -1px;
    font-family: var(--text-md-medium-font-family);
    font-weight: var(--text-md-medium-font-weight);
    color: var(--semantic-color-text-secondary);
    font-size: var(--text-md-medium-font-size);
    text-align: center;
    letter-spacing: var(--text-md-medium-letter-spacing);
    line-height: var(--text-md-medium-line-height);
    font-style: var(--text-md-medium-font-style);
  }

  /*하늘바탕 페이지 타이틀*/
  .page-title {
    display: flex;
    flex-direction: column;
    width:100%;
    height: 160px;
    align-items: center;
    justify-content: center;
    padding: 16px 0px 40px;
    position: relative;
    background-color: var(--semantic-color-bg-interactive-primary);
  }
  
  .page-title .breadcrumb {
    display: flex;
    width: 952px;
    align-items: center;
    position: relative;
    flex: 0 0 auto;
  }
  
  .page-title .pt_home {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex: 0 0 auto;
  }
  
  .page-title .pt_label {
    position: relative;
    width: fit-content;
    font-family: var(--text-sm-medium-font-family);
    font-weight: var(--text-sm-medium-font-weight);
    color: var(--semantic-color-text-interactive-inverse);
    font-size: var(--text-sm-medium-font-size);
    letter-spacing: var(--text-sm-medium-letter-spacing);
    line-height: var(--text-sm-medium-line-height);
    white-space: nowrap;
    font-style: var(--text-sm-medium-font-style);
  }
  
  .page-title .pt_txt {
    position: relative;
    display: flex;
    flex: 1;
    align-self: stretch;
    align-items: center;
    justify-content: center;
    font-family: var(--display-md-semibold-font-family);
    font-weight: var(--display-md-semibold-font-weight);
    color: var(--semantic-color-text-interactive-inverse);
    font-size: var(--display-md-semibold-font-size);
    text-align: center;
    letter-spacing: var(--display-md-semibold-letter-spacing);
    line-height: var(--display-md-semibold-line-height);
    font-style: var(--display-md-semibold-font-style);
  }
  /*하늘바탕 페이지 타이틀 END*/

  /*회색 바탕 페이지 타이틀*/
  .breadcrumb_gr {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width:100%;
    gap: 8px;
    padding: 16px 0px;
    position: relative;
    background-color: #e5e5e580;
  }
  
  .breadcrumb_gr .div_pg {
    display: flex;
    width: 982px;
    align-items: center;
    position: relative;
    flex: 0 0 auto;
  }
  
  .breadcrumb_gr .home_pg {
    display: flex;
    width: 200px;
    align-items: center;
    justify-content: center;
    position: relative;
    border-radius: var(--semantic-border-radius-4);
  }
  
  .breadcrumb_gr .label_pg {
    flex: 1;
    position: relative;
    font-family: var(--text-sm-medium-font-family);
    font-weight: var(--text-sm-medium-font-weight);
    color: var(--semantic-color-text-interactive-secondary);
    font-size: var(--text-sm-medium-font-size);
    letter-spacing: var(--text-sm-medium-letter-spacing);
    line-height: var(--text-sm-medium-line-height);
    font-style: var(--text-sm-medium-font-style);
  }
  /*회색 바탕 페이지 타이틀 END*/