@charset "UTF-8";
/* @mixin flex-size($shrink, $grow) {
  flex-shrink: $shrink;
  flex-grow: $grow;
} */
.kids-btn.primary:not(.icon) .svg-icon {
  filter: brightness(0) invert(1);
}

@font-face {
  font-family: "Pretendard GOV";
  font-weight: 300;
  font-display: swap;
  src: local("Pretendard GOV Light"), url(https://static.gov.kr/content/child/content/fonts/PretendardGOV-Light.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 400;
  font-display: swap;
  src: local("Pretendard GOV Regular"), url(https://static.gov.kr/content/child/content/fonts/PretendardGOV-Regular.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 500;
  font-display: swap;
  src: local("Pretendard GOV Medium"), url(https://static.gov.kr/content/child/content/fonts/PretendardGOV-Medium.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 600;
  font-display: swap;
  src: local("Pretendard GOV SemiBold"), url(https://static.gov.kr/content/child/content/fonts/PretendardGOV-SemiBold.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Pretendard GOV";
  font-weight: 700;
  font-display: swap;
  src: local("Pretendard GOV Bold"), url(https://static.gov.kr/content/child/content/fonts/PretendardGOV-Bold.subset.woff2) format("woff2");
}
@font-face {
  font-family: "Cafe24Ohsquare";
  font-weight: 900;
  font-display: swap;
  src: local("Cafe24Ohsquare-v2.0"), url(https://static.gov.kr/content/child/content/fonts/Cafe24Ohsquare-v2.0.woff2) format("woff2");
}
@font-face {
  font-family: "Cafe24Ohsquare";
  font-weight: 400;
  font-display: swap;
  src: local("Cafe24OhsquareAir-v2.0"), url(https://static.gov.kr/content/child/content/fonts/Cafe24OhsquareAir-v2.0.woff2) format("woff2");
}
:root {
  --kids-color-light-gray-0: #ffffff;
  --kids-color-light-gray-5: #f4f5f6;
  --kids-color-light-gray-10: #e6e8ea;
  --kids-color-light-gray-20: #cdd1d5;
  --kids-color-light-gray-30: #b1b8be;
  --kids-color-light-gray-40: #8a949e;
  --kids-color-light-gray-50: #6d7882;
  --kids-color-light-gray-60: #58616a;
  --kids-color-light-gray-70: #464c53;
  --kids-color-light-gray-80: #33363d;
  --kids-color-light-gray-90: #1e2124;
  --kids-color-light-gray-95: #131416;
  --kids-color-light-gray-100: #000000;
  --kids-color-light-primary-5: #ecf2fe;
  --kids-color-light-primary-10: #d8e5fd;
  --kids-color-light-primary-20: #b1cefb;
  --kids-color-light-primary-30: #86aff9;
  --kids-color-light-primary-40: #4c87f6;
  --kids-color-light-primary-50: #256ef4;
  --kids-color-light-primary-55: #157FFF;
  --kids-color-light-primary-60: #0b50d0;
  --kids-color-light-primary-70: #083891;
  --kids-color-light-primary-80: #052561;
  --kids-color-light-primary-90: #03163a;
  --kids-color-light-primary-95: #020f27;
  --kids-color-light-secondary-5: #eef2f7;
  --kids-color-light-secondary-10: #d6e0eb;
  --kids-color-light-secondary-20: #bacbde;
  --kids-color-light-secondary-30: #90b0d5;
  --kids-color-light-secondary-40: #6b96c7;
  --kids-color-light-secondary-50: #346fb2;
  --kids-color-light-secondary-60: #1c589c;
  --kids-color-light-secondary-70: #063a74;
  --kids-color-light-secondary-80: #052b57;
  --kids-color-light-secondary-90: #031f3f;
  --kids-color-light-secondary-95: #02162c;
  --kids-color-light-point-5: #fbeff0;
  --kids-color-light-point-10: #f5d6d9;
  --kids-color-light-point-20: #ebadb2;
  --kids-color-light-point-30: #e0858c;
  --kids-color-light-point-40: #d65c66;
  --kids-color-light-point-50: #d63d4a;
  --kids-color-light-point-60: #ab2b36;
  --kids-color-light-point-70: #7a1f26;
  --kids-color-light-point-80: #521419;
  --kids-color-light-point-90: #310c0f;
  --kids-color-light-point-95: #21080a;
  --kids-color-light-graphic-10: #e5ecf9;
  --kids-color-light-graphic-30: #98acc5;
  --kids-color-light-graphic-50: #61758f;
  --kids-color-light-graphic-70: #39506c;
  --kids-color-light-graphic-90: #223a58;
  --kids-color-light-danger-5: #fdefec;
  --kids-color-light-danger-10: #fcdfd9;
  --kids-color-light-danger-20: #f7afa1;
  --kids-color-light-danger-30: #f48771;
  --kids-color-light-danger-40: #f05f42;
  --kids-color-light-danger-50: #de3412;
  --kids-color-light-danger-60: #bd2c0f;
  --kids-color-light-danger-70: #8a240f;
  --kids-color-light-danger-80: #5c180a;
  --kids-color-light-danger-90: #390d05;
  --kids-color-light-danger-95: #260903;
  --kids-color-light-warning-5: #fff3db;
  --kids-color-light-warning-10: #ffe0a3;
  --kids-color-light-warning-20: #ffc95c;
  --kids-color-light-warning-30: #ffb114;
  --kids-color-light-warning-40: #c78500;
  --kids-color-light-warning-50: #9e6a00;
  --kids-color-light-warning-60: #8a5c00;
  --kids-color-light-warning-70: #614100;
  --kids-color-light-warning-80: #422c00;
  --kids-color-light-warning-90: #2e1f00;
  --kids-color-light-warning-95: #241800;
  --kids-color-light-success-5: #eaf6ec;
  --kids-color-light-success-10: #d8eedd;
  --kids-color-light-success-20: #a9dab4;
  --kids-color-light-success-30: #7ec88e;
  --kids-color-light-success-40: #3fa654;
  --kids-color-light-success-50: #228738;
  --kids-color-light-success-60: #267337;
  --kids-color-light-success-70: #285d33;
  --kids-color-light-success-80: #1f4727;
  --kids-color-light-success-90: #122b18;
  --kids-color-light-success-95: #0e2012;
  --kids-color-light-information-5: #e7f4fe;
  --kids-color-light-information-10: #d3ebfd;
  --kids-color-light-information-20: #9ed2fa;
  --kids-color-light-information-30: #5fb5f7;
  --kids-color-light-information-40: #2098f3;
  --kids-color-light-information-50: #0b78cb;
  --kids-color-light-information-60: #096ab3;
  --kids-color-light-information-70: #085691;
  --kids-color-light-information-80: #053961;
  --kids-color-light-information-90: #03253f;
  --kids-color-light-information-95: #021a2c;
  --kids-color-light-alpha-black100: rgba(0, 0, 0, 1);
  --kids-color-light-alpha-black75: rgba(0, 0, 0, 0.75);
  --kids-color-light-alpha-black50: rgba(0, 0, 0, 0.5);
  --kids-color-light-alpha-black25: rgba(0, 0, 0, 0.25);
  --kids-color-light-alpha-black10: rgba(0, 0, 0, 0.1);
  --kids-color-light-alpha-black0: rgba(0, 0, 0, 0);
  --kids-color-light-alpha-white100: rgba(255, 255, 255, 1);
  --kids-color-light-alpha-white75: rgba(255, 255, 255, 0.75);
  --kids-color-light-alpha-white50: rgba(255, 255, 255, 0.5);
  --kids-color-light-alpha-white25: rgba(255, 255, 255, 0.25);
  --kids-color-light-alpha-white10: rgba(255, 255, 255, 0.1);
  --kids-color-light-alpha-white0: rgba(255, 255, 255, 0);
  --kids-color-high-contrast-gray-0: #ffffff;
  --kids-color-high-contrast-gray-5: #f4f5f6;
  --kids-color-high-contrast-gray-10: #e6e8ea;
  --kids-color-high-contrast-gray-20: #cdd1d5;
  --kids-color-high-contrast-gray-30: #b1b8be;
  --kids-color-high-contrast-gray-40: #8a949e;
  --kids-color-high-contrast-gray-50: #6d7882;
  --kids-color-high-contrast-gray-60: #58616a;
  --kids-color-high-contrast-gray-70: #464c53;
  --kids-color-high-contrast-gray-80: #33363d;
  --kids-color-high-contrast-gray-90: #1e2124;
  --kids-color-high-contrast-gray-95: #131416;
  --kids-color-high-contrast-gray-100: #000000;
  --kids-color-high-contrast-primary-5: #ecf2fe;
  --kids-color-high-contrast-primary-10: #d8e5fd;
  --kids-color-high-contrast-primary-20: #b1cefb;
  --kids-color-high-contrast-primary-30: #86aff9;
  --kids-color-high-contrast-primary-40: #4c87f6;
  --kids-color-high-contrast-primary-50: #256ef4;
  --kids-color-high-contrast-primary-55: #157FFF;
  --kids-color-high-contrast-primary-60: #0b50d0;
  --kids-color-high-contrast-primary-70: #083891;
  --kids-color-high-contrast-primary-80: #052561;
  --kids-color-high-contrast-primary-90: #03163a;
  --kids-color-high-contrast-primary-95: #020f27;
  --kids-color-high-contrast-secondary-5: #edf6f8;
  --kids-color-high-contrast-secondary-10: #d5ebf1;
  --kids-color-high-contrast-secondary-20: #abd8e3;
  --kids-color-high-contrast-secondary-30: #75c0d1;
  --kids-color-high-contrast-secondary-40: #3d9fb8;
  --kids-color-high-contrast-secondary-50: #268097;
  --kids-color-high-contrast-secondary-60: #1f687a;
  --kids-color-high-contrast-secondary-70: #17505e;
  --kids-color-high-contrast-secondary-80: #113b45;
  --kids-color-high-contrast-secondary-90: #0e3139;
  --kids-color-high-contrast-secondary-95: #091f25;
  --kids-color-high-contrast-point-5: #fbeff0;
  --kids-color-high-contrast-point-10: #f5d6d9;
  --kids-color-high-contrast-point-20: #ebadb2;
  --kids-color-high-contrast-point-30: #e0858c;
  --kids-color-high-contrast-point-40: #d65c66;
  --kids-color-high-contrast-point-50: #d63d4a;
  --kids-color-high-contrast-point-60: #ab2b36;
  --kids-color-high-contrast-point-70: #7a1f26;
  --kids-color-high-contrast-point-80: #521419;
  --kids-color-high-contrast-point-90: #310c0f;
  --kids-color-high-contrast-point-95: #21080a;
  --kids-color-high-contrast-graphic-10: #e5ecf9;
  --kids-color-high-contrast-graphic-30: #98acc5;
  --kids-color-high-contrast-graphic-50: #61758f;
  --kids-color-high-contrast-graphic-70: #39506c;
  --kids-color-high-contrast-graphic-90: #223a58;
  --kids-color-high-contrast-danger-5: #fdefec;
  --kids-color-high-contrast-danger-10: #fcdfd9;
  --kids-color-high-contrast-danger-20: #f7afa1;
  --kids-color-high-contrast-danger-30: #f48771;
  --kids-color-high-contrast-danger-40: #f05f42;
  --kids-color-high-contrast-danger-50: #de3412;
  --kids-color-high-contrast-danger-60: #bd2c0f;
  --kids-color-high-contrast-danger-70: #8a240f;
  --kids-color-high-contrast-danger-80: #5c180a;
  --kids-color-high-contrast-danger-90: #390d05;
  --kids-color-high-contrast-danger-95: #260903;
  --kids-color-high-contrast-warning-5: #fff3db;
  --kids-color-high-contrast-warning-10: #ffe0a3;
  --kids-color-high-contrast-warning-20: #ffc95c;
  --kids-color-high-contrast-warning-30: #ffb114;
  --kids-color-high-contrast-warning-40: #c78500;
  --kids-color-high-contrast-warning-50: #9e6a00;
  --kids-color-high-contrast-warning-60: #8a5c00;
  --kids-color-high-contrast-warning-70: #614100;
  --kids-color-high-contrast-warning-80: #422c00;
  --kids-color-high-contrast-warning-90: #2e1f00;
  --kids-color-high-contrast-warning-95: #241800;
  --kids-color-high-contrast-success-5: #eaf6ec;
  --kids-color-high-contrast-success-10: #d8eedd;
  --kids-color-high-contrast-success-20: #a9dab4;
  --kids-color-high-contrast-success-30: #7ec88e;
  --kids-color-high-contrast-success-40: #3fa654;
  --kids-color-high-contrast-success-50: #228738;
  --kids-color-high-contrast-success-60: #267337;
  --kids-color-high-contrast-success-70: #285d33;
  --kids-color-high-contrast-success-80: #1f4727;
  --kids-color-high-contrast-success-90: #122b18;
  --kids-color-high-contrast-success-95: #0e2012;
  --kids-color-high-contrast-information-5: #e7f4fe;
  --kids-color-high-contrast-information-10: #d3ebfd;
  --kids-color-high-contrast-information-20: #9ed2fa;
  --kids-color-high-contrast-information-30: #5fb5f7;
  --kids-color-high-contrast-information-40: #2098f3;
  --kids-color-high-contrast-information-50: #0b78cb;
  --kids-color-high-contrast-information-60: #096ab3;
  --kids-color-high-contrast-information-70: #085691;
  --kids-color-high-contrast-information-80: #053961;
  --kids-color-high-contrast-information-90: #03253f;
  --kids-color-high-contrast-information-95: #021a2c;
  --kids-color-high-contrast-alpha-black100: rgba(0, 0, 0, 1);
  --kids-color-high-contrast-alpha-black75: rgba(0, 0, 0, 0.75);
  --kids-color-high-contrast-alpha-black50: rgba(0, 0, 0, 0.5);
  --kids-color-high-contrast-alpha-black25: rgba(0, 0, 0, 0.25);
  --kids-color-high-contrast-alpha-black10: rgba(0, 0, 0, 0.1);
  --kids-color-high-contrast-alpha-black0: rgba(0, 0, 0, 0);
  --kids-color-high-contrast-alpha-white100: rgba(255, 255, 255, 1);
  --kids-color-high-contrast-alpha-white75: rgba(255, 255, 255, 0.75);
  --kids-color-high-contrast-alpha-white50: rgba(255, 255, 255, 0.5);
  --kids-color-high-contrast-alpha-white25: rgba(255, 255, 255, 0.25);
  --kids-color-high-contrast-alpha-white10: rgba(255, 255, 255, 0.1);
  --kids-color-high-contrast-alpha-white0: rgba(255, 255, 255, 0);
  --kids-color-sub-bg: #D1EDFA;
  --kids-color-sub-gray: #111111;
  --kids-color-sub-light-gray: #f8f8f8;
  --kids-color-point-purple-10: #F8F3FC;
  --kids-color-point-purple-20: #E1CAF2;
  --kids-color-point-purple-30: #C9A1E8;
  --kids-color-point-purple-40: #B277DE;
  --kids-color-point-purple-50: #9B50D4;
  --kids-color-point-purple-60: #662597;
  --kids-color-point-purple-70: #4B1B6F;
  --kids-color-point-purple-80: #2F1146;
  --kids-color-point-purple-90: #2F1146;
  --kids-color-point-purple-100: #13071D;
  --kids-color-point-orange-10: #FFE2D6;
  --kids-color-point-orange-20: #FFBEA3;
  --kids-color-point-orange-30: #FF9A70;
  --kids-color-point-orange-40: #FF743B;
  --kids-color-point-orange-50: #FF510A;
  --kids-color-point-orange-60: #D63E00;
  --kids-color-point-orange-70: #A32F00;
  --kids-color-point-orange-80: #702100;
  --kids-color-point-orange-90: #3D1200;
  --kids-color-point-orange-100: #0A0300;
  --kids-color-point-yellow-10: #FFFFFF;
  --kids-color-point-yellow-20: #FEF6CC;
  --kids-color-point-yellow-30: #FEEE9A;
  --kids-color-point-yellow-40: #FEE567;
  --kids-color-point-yellow-50: #FEDC34;
  --kids-color-point-yellow-60: #FED403;
  --kids-color-point-yellow-70: #CBA901;
  --kids-color-point-yellow-80: #987F01;
  --kids-color-point-yellow-90: #655501;
  --kids-color-point-yellow-100: #332B01;
  --kids-color-point-green-10: #F7FDF9;
  --kids-color-point-green-20: #CFF1DB;
  --kids-color-point-green-30: #A8E6BD;
  --kids-color-point-green-40: #80DB9F;
  --kids-color-point-green-50: #59D082;
  --kids-color-point-green-60: #36BF65;
  --kids-color-point-green-70: #2B9750;
  --kids-color-point-green-80: #206F3B;
  --kids-color-point-green-90: #154726;
  --kids-color-point-green-100: #092011;
  --kids-color-point-blue-10: #E2F0F8;
  --kids-color-point-blue-20: #B8DBF0;
  --kids-color-point-blue-30: #8EC6E6;
  --kids-color-point-blue-40: #64B1DD;
  --kids-color-point-blue-50: #399CD4;
  --kids-color-point-blue-60: #2781B4;
  --kids-color-point-blue-70: #1E638A;
  --kids-color-point-blue-80: #154560;
  --kids-color-point-blue-90: #0C2736;
  --kids-color-point-blue-100: #03090D;
  --kids-color-point-red-0: #FFF5F5;
  --kids-color-point-red-10: #FFE3E8;
  --kids-color-point-red-20: #FFC2C6;
  --kids-color-point-red-30: #FF9198;
  --kids-color-point-red-40: #FF5C66;
  --kids-color-point-red-50: #FF2936;
  --kids-color-point-red-60: #F50010;
  --kids-color-point-red-70: #C2000C;
  --kids-color-point-red-80: #8F0009;
  --kids-color-point-red-90: #5C0006;
  --kids-color-point-red-100: #290003;
  --kids-typo-font-type: "Pretendard GOV";
  --kids-typo-font-weight-regular: Regular;
  --kids-typo-font-weight-bold: Bold;
  --kids-typo-letter-spacing-0: 0rem;
  --kids-typo-letter-spacing--1: -0.1rem;
  --kids-typo-letter-spacing-1: 0.1rem;
  --kids-number-0: 0rem;
  --kids-number-1: 0.1rem;
  --kids-number-2: 0.2rem;
  --kids-number-3: 0.4rem;
  --kids-number-4: 0.6rem;
  --kids-number-5: 0.8rem;
  --kids-number-6: 1rem;
  --kids-number-7: 1.2rem;
  --kids-number-8: 1.6rem;
  --kids-number-9: 2rem;
  --kids-number-10: 2.4rem;
  --kids-number-11: 2.8rem;
  --kids-number-12: 3.2rem;
  --kids-number-13: 3.6rem;
  --kids-number-14: 4rem;
  --kids-number-15: 4.4rem;
  --kids-number-16: 4.8rem;
  --kids-number-17: 5.6rem;
  --kids-number-18: 6.4rem;
  --kids-number-19: 7.2rem;
  --kids-number-20: 8rem;
  --kids-number-21: 9.6rem;
  --kids-number-max: 100rem;
  --kids-spacer-50: 20rem;
  --kids-spacer-49: 19.6rem;
  --kids-spacer-48: 19.2rem;
  --kids-spacer-47: 18.8rem;
  --kids-spacer-46: 18.4rem;
  --kids-spacer-45: 18rem;
  --kids-spacer-44: 17.6rem;
  --kids-spacer-43: 17.2rem;
  --kids-spacer-42: 16.8rem;
  --kids-spacer-41: 16.4rem;
  --kids-spacer-40: 16rem;
  --kids-spacer-39: 15.6rem;
  --kids-spacer-38: 15.2rem;
  --kids-spacer-37: 14.8rem;
  --kids-spacer-36: 14.4rem;
  --kids-spacer-35: 14rem;
  --kids-spacer-34: 13.6rem;
  --kids-spacer-33: 13.2rem;
  --kids-spacer-32: 12.8rem;
  --kids-spacer-31: 12.4rem;
  --kids-spacer-30: 12rem;
  --kids-spacer-29: 11.6rem;
  --kids-spacer-28: 11.2rem;
  --kids-spacer-27: 10.8rem;
  --kids-spacer-26: 10.4rem;
  --kids-spacer-25: 10rem;
  --kids-spacer-24: 9.6rem;
  --kids-spacer-23: 9.2rem;
  --kids-spacer-22: 8.8rem;
  --kids-spacer-21: 8.4rem;
  --kids-spacer-20: 8rem;
  --kids-spacer-19: 7.6rem;
  --kids-spacer-18: 7.2rem;
  --kids-spacer-17: 6.8rem;
  --kids-spacer-16: 6.4rem;
  --kids-spacer-15: 6rem;
  --kids-spacer-14: 5.6rem;
  --kids-spacer-13: 5.2rem;
  --kids-spacer-12: 4.8rem;
  --kids-spacer-11: 4.4rem;
  --kids-spacer-10: 4rem;
  --kids-spacer-9: 3.6rem;
  --kids-spacer-8: 3.2rem;
  --kids-spacer-7: 2.8rem;
  --kids-spacer-6: 2.4rem;
  --kids-spacer-5: 2rem;
  --kids-spacer-4: 1.6rem;
  --kids-spacer-3: 1.2rem;
  --kids-spacer-2: 0.8rem;
  --kids-spacer-1: 0.4rem;
  --kids-spacer-0: 0;
  --kids-spacer-default: .1rem;
  --kids-spacer-default2: .2rem;
  --kids-spacer-full: 100%;
  /* MODE-LIGHT */
  --kids-light-color-surface-gray-subtler: var(
    --kids-color-light-gray-5
  );
  --kids-light-color-surface-gray-subtle: var(
    --kids-color-light-gray-10
  );
  --kids-light-color-surface-disabled: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-surface-primary-subtler: var(
    --kids-color-light-primary-5
  );
  --kids-light-color-surface-secondary-subtler: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-surface-danger-subtler: var(
    --kids-color-light-danger-5
  );
  --kids-light-color-surface-warning-subtler: var(
    --kids-color-light-warning-5
  );
  --kids-light-color-surface-success-subtler: var(
    --kids-color-light-success-5
  );
  --kids-light-color-surface-information-subtler: var(
    --kids-color-light-information-5
  );
  --kids-light-color-surface-point-subtler: var(
    --kids-color-light-point-5
  );
  --kids-light-color-surface-white: var(--kids-color-light-gray-0);
  --kids-light-color-surface-inverse: var(
    --kids-color-light-gray-90
  );
  --kids-light-color-surface-white-static: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-surface-inverse-static: var(
    --kids-color-light-gray-90
  );
  --kids-light-color-surface-white-subtle: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-surface-white-subtler: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-border-gray-light: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-border-gray: var(--kids-color-light-gray-30);
  --kids-light-color-border-secondary-light: var(
    --kids-color-light-secondary-10
  );
  --kids-light-color-border-danger-light: var(
    --kids-color-light-danger-10
  );
  --kids-light-color-border-danger: var(
    --kids-color-light-danger-50
  );
  --kids-light-color-border-warning-light: var(
    --kids-color-light-warning-10
  );
  --kids-light-color-border-warning: var(
    --kids-color-light-warning-50
  );
  --kids-light-color-border-success-light: var(
    --kids-color-light-success-10
  );
  --kids-light-color-border-success: var(
    --kids-color-light-success-50
  );
  --kids-light-color-border-information-light: var(
    --kids-color-light-information-10
  );
  --kids-light-color-border-information: var(
    --kids-color-light-information-50
  );
  --kids-light-color-border-gray-dark: var(
    --kids-color-light-gray-60
  );
  --kids-light-color-border-primary: var(
    --kids-color-light-primary-55
  );
  --kids-light-color-border-disabled: var(
    --kids-color-light-gray-30
  );
  --kids-light-color-border-gray-darker: var(
    --kids-color-light-gray-90
  );
  --kids-light-color-border-secondary: var(
    --kids-color-light-secondary-70
  );
  --kids-light-color-border-inverse: var(--kids-color-light-gray-0);
  --kids-light-color-border-transparency: var(
    --kids-color-light-alpha-black0
  );
  --kids-light-color-border-primary-light: var(
    --kids-color-light-primary-10
  );
  --kids-light-color-border-point: var(--kids-color-light-point-50);
  --kids-light-color-border-point-light: var(
    --kids-color-light-point-10
  );
  --kids-light-color-divider-gray-light: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-divider-gray: var(--kids-color-light-gray-40);
  --kids-light-color-divider-gray-dark: var(
    --kids-color-light-gray-50
  );
  --kids-light-color-divider-primary: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-divider-secondary-light: var(
    --kids-color-light-secondary-10
  );
  --kids-light-color-divider-secondary: var(
    --kids-color-light-secondary-70
  );
  --kids-light-color-divider-error: var(
    --kids-color-light-danger-50
  );
  --kids-light-color-divider-primary-light: var(
    --kids-color-light-primary-10
  );
  --kids-light-color-divider-inverse: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-divider-gray-darker: var(
    --kids-color-light-gray-90
  );
  --kids-light-color-divider-point: var(
    --kids-color-light-point-50
  );
  --kids-light-color-text-bolder: var(--kids-color-light-gray-95);
  --kids-light-color-text-subtle: var(--kids-color-light-gray-70);
  --kids-light-color-text-disabled: var(--kids-color-light-gray-40);
  --kids-light-color-text-disabled-on: var(
    --kids-color-light-gray-50
  );
  --kids-light-color-text-primary: var(
    --kids-color-light-primary-60
  );
  --kids-light-color-text-secondary: var(
    --kids-color-light-secondary-80
  );
  --kids-light-color-text-danger: var(--kids-color-light-danger-60);
  --kids-light-color-text-warning: var(
    --kids-color-light-warning-60
  );
  --kids-light-color-text-success: var(
    --kids-color-light-success-60
  );
  --kids-light-color-text-information: var(
    --kids-color-light-information-60
  );
  --kids-light-color-text-basic: var(--kids-color-light-gray-95);
  --kids-light-color-text-point: var(--kids-color-light-point-60);
  --kids-light-color-text-bolder-inverse: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-text-basic-inverse: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-text-subtle-inverse: var(
    --kids-color-light-gray-30
  );
  --kids-light-color-text-inverse-static: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-text-static: var(--kids-color-light-gray-90);
  --kids-light-color-icon-gray: var(--kids-color-light-gray-80);
  --kids-light-color-icon-gray-fill: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-icon-inverse: var(--kids-color-light-gray-0);
  --kids-light-color-icon-primary: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-icon-secondary: var(
    --kids-color-light-secondary-80
  );
  --kids-light-color-icon-point: var(--kids-color-light-point-50);
  --kids-light-color-icon-danger: var(--kids-color-light-danger-50);
  --kids-light-color-icon-warning: var(
    --kids-color-light-warning-50
  );
  --kids-light-color-icon-success: var(
    --kids-color-light-success-50
  );
  --kids-light-color-icon-information: var(
    --kids-color-light-information-50
  );
  --kids-light-color-icon-gray-light: var(
    --kids-color-light-gray-70
  );
  --kids-light-color-icon-disabled: var(--kids-color-light-gray-40);
  --kids-light-color-icon-disabled-on: var(
    --kids-color-light-gray-50
  );
  --kids-light-color-icon-inverse-static: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-icon-primary-static: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-icon-secondary-static: var(
    --kids-color-light-secondary-80
  );
  --kids-light-color-icon-point-static: var(
    --kids-color-light-point-50
  );
  --kids-light-color-icon-danger-static: var(
    --kids-color-light-danger-50
  );
  --kids-light-color-icon-warning-static: var(
    --kids-color-light-warning-50
  );
  --kids-light-color-icon-success-static: var(
    --kids-color-light-success-50
  );
  --kids-light-color-icon-information-static: var(
    --kids-color-light-information-50
  );
  --kids-light-color-icon-gray-static: var(
    --kids-color-light-gray-80
  );
  --kids-light-color-link-default: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-link-hover: var(--kids-color-light-primary-60);
  --kids-light-color-link-pressed: var(
    --kids-color-light-primary-70
  );
  --kids-light-color-link-visited: #5917b8;
  --kids-light-color-button-primary-fill: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-button-primary-fill-hover: var(
    --kids-color-light-primary-60
  );
  --kids-light-color-button-primary-fill-pressed: var(
    --kids-color-light-primary-70
  );
  --kids-light-color-button-secondary-fill: var(
    --kids-color-light-primary-5
  );
  --kids-light-color-button-secondary-fill-hover: var(
    --kids-color-light-primary-10
  );
  --kids-light-color-button-secondary-fill-pressed: var(
    --kids-color-light-primary-20
  );
  --kids-light-color-button-secondary-border: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-button-tertiary-fill: var(
    --kids-color-light-alpha-white0
  );
  --kids-light-color-button-tertiary-fill-hover: var(
    --kids-color-light-gray-5
  );
  --kids-light-color-button-tertiary-fill-pressed: var(
    --kids-color-light-gray-10
  );
  --kids-light-color-button-tertiary-border: var(
    --kids-color-light-gray-60
  );
  --kids-light-color-button-disabled-fill: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-button-text-fill-hover: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-button-text-fill-pressed: var(
    --kids-color-light-secondary-10
  );
  --kids-light-color-button-text-fill: var(
    --kids-color-light-alpha-white0
  );
  --kids-light-color-button-text-border: var(
    --kids-color-light-alpha-black0
  );
  --kids-light-color-button-disabled-border: var(
    --kids-color-light-gray-30
  );
  --kids-light-color-background-white: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-background-inverse: var(
    --kids-color-light-gray-90
  );
  --kids-light-color-background-gray-subtler: var(
    --kids-color-light-gray-5
  );
  --kids-light-color-background-gray-subtle: var(
    --kids-color-light-gray-10
  );
  --kids-light-color-background-dim: var(
    --kids-color-light-alpha-black75
  );
  --kids-light-color-element-disabled-light: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-element-disabled-dark: var(
    --kids-color-light-gray-40
  );
  --kids-light-color-element-gray-lighter: var(
    --kids-color-light-gray-5
  );
  --kids-light-color-element-gray-light: var(
    --kids-color-light-gray-10
  );
  --kids-light-color-element-gray: var(--kids-color-light-gray-50);
  --kids-light-color-element-primary-lighter: var(
    --kids-color-light-primary-5
  );
  --kids-light-color-element-primary-light: var(
    --kids-color-light-primary-10
  );
  --kids-light-color-element-primary: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-element-secondary-lighter: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-element-secondary-light: var(
    --kids-color-light-secondary-10
  );
  --kids-light-color-element-secondary: var(
    --kids-color-light-secondary-70
  );
  --kids-light-color-element-point-lighter: var(
    --kids-color-light-point-5
  );
  --kids-light-color-element-point-light: var(
    --kids-color-light-point-10
  );
  --kids-light-color-element-point: var(
    --kids-color-light-point-50
  );
  --kids-light-color-element-danger-lighter: var(
    --kids-color-light-danger-5
  );
  --kids-light-color-element-danger: var(
    --kids-color-light-danger-50
  );
  --kids-light-color-element-warning-lighter: var(
    --kids-color-light-warning-5
  );
  --kids-light-color-element-warning: var(
    --kids-color-light-warning-30
  );
  --kids-light-color-element-success-lighter: var(
    --kids-color-light-success-5
  );
  --kids-light-color-element-success: var(
    --kids-color-light-success-50
  );
  --kids-light-color-element-information-lighter: var(
    --kids-color-light-information-5
  );
  --kids-light-color-element-information: var(
    --kids-color-light-information-50
  );
  --kids-light-color-element-inverse: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-element-gray-dark: var(
    --kids-color-light-gray-60
  );
  --kids-light-color-element-inverse-static: var(
    --kids-color-light-gray-0
  );
  --kids-light-color-action-white: var(--kids-color-light-gray-0);
  --kids-light-color-action-primary: var(
    --kids-color-light-alpha-white0
  );
  --kids-light-color-action-primary-hover: var(
    --kids-color-light-primary-5
  );
  --kids-light-color-action-primary-pressed: var(
    --kids-color-light-primary-10
  );
  --kids-light-color-action-secondary: var(
    --kids-color-light-alpha-white0
  );
  --kids-light-color-action-secondary-hover: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-action-secondary-pressed: var(
    --kids-color-light-secondary-10
  );
  --kids-light-color-action-secondary-selected: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-action-secondary-on: var(
    --kids-color-light-alpha-white0
  );
  --kids-light-color-action-secondary-on-hover: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-action-secondary-on-pressed: var(
    --kids-color-light-secondary-10
  );
  --kids-light-color-action-secondary-on-selected: var(
    --kids-color-light-secondary-5
  );
  --kids-light-color-action-secondary-active: var(
    --kids-color-light-secondary-70
  );
  --kids-light-color-action-primary-active: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-action-disabled: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-action-primary-selected: var(
    --kids-color-light-primary-5
  );
  --kids-light-color-input-border: var(--kids-color-light-gray-60);
  --kids-light-color-input-border-disabled: var(
    --kids-color-light-gray-30
  );
  --kids-light-color-input-border-active: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-input-border-error: var(
    --kids-color-light-danger-50
  );
  --kids-light-color-input-surface: var(--kids-color-light-gray-0);
  --kids-light-color-input-surface-disabled: var(
    --kids-color-light-gray-20
  );
  --kids-light-color-graphic-blue-subtler: var(
    --kids-color-light-graphic-10
  );
  --kids-light-color-graphic-blue-subtle: var(
    --kids-color-light-graphic-30
  );
  --kids-light-color-graphic-blue: var(
    --kids-color-light-graphic-50
  );
  --kids-light-color-graphic-blue-dark: var(
    --kids-color-light-graphic-70
  );
  --kids-light-color-graphic-blue-darker: var(
    --kids-color-light-graphic-90
  );
  --kids-light-color-graphic-red-subtler: var(
    --kids-color-light-point-5
  );
  --kids-light-color-graphic-red-subtle: var(
    --kids-color-light-point-10
  );
  --kids-light-color-graphic-red: var(
    --kids-color-high-contrast-point-20
  );
  --kids-light-color-graphic-red-dark: var(
    --kids-color-high-contrast-point-40
  );
  --kids-light-color-graphic-red-darker: var(
    --kids-color-high-contrast-point-70
  );
  --kids-light-color-graphic-brand: var(
    --kids-color-light-primary-50
  );
  --kids-light-color-alpha-base100: var(
    --kids-color-light-alpha-white100
  );
  --kids-light-color-alpha-base50: var(
    --kids-color-light-alpha-white50
  );
  --kids-light-color-alpha-base25: var(
    --kids-color-high-contrast-alpha-white25
  );
  --kids-light-color-alpha-base0: var(
    --kids-color-light-alpha-white0
  );
  --kids-light-color-alpha-inverse100: var(
    --kids-color-light-alpha-black100
  );
  --kids-light-color-alpha-inverse50: var(
    --kids-color-light-alpha-black50
  );
  --kids-light-color-alpha-inverse25: var(
    --kids-color-light-alpha-black25
  );
  --kids-light-color-alpha-inverse0: var(
    --kids-color-light-alpha-black0
  );
  --kids-light-color-alpha-base75: var(
    --kids-color-light-alpha-white75
  );
  --kids-light-color-alpha-inverse75: var(
    --kids-color-light-alpha-black75
  );
  --kids-light-color-alpha-inverse10: var(
    --kids-color-light-alpha-black10
  );
  --kids-light-color-alpha-base10: var(
    --kids-color-high-contrast-alpha-white10
  );
  --kids-light-color-alpha-shadow1: rgba(0, 0, 0, 0.05);
  --kids-light-color-alpha-shadow2: rgba(0, 0, 0, 0.078);
  --kids-light-color-alpha-shadow3: rgba(0, 0, 0, 0.122);
  --kids-light-border-width-variable-regular: 0.1rem;
  --kids-light-border-width-variable-medium: 0.2rem;
  --kids-light-border-width-variable-large: 0.3rem;
  --kids-light-border-width-static-regular: 0.1rem;
  --kids-light-border-width-static-medium: 0.2rem;
  /* MODE-HIGH-CONTRAST */
  --kids-high-contrast-color-surface-gray-subtler: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-surface-gray-subtle: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-surface-disabled: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-surface-primary-subtler: var(
    --kids-color-high-contrast-primary-95
  );
  --kids-high-contrast-color-surface-secondary-subtler: var(
    --kids-color-high-contrast-secondary-95
  );
  --kids-high-contrast-color-surface-danger-subtler: var(
    --kids-color-high-contrast-danger-95
  );
  --kids-high-contrast-color-surface-warning-subtler: var(
    --kids-color-high-contrast-warning-95
  );
  --kids-high-contrast-color-surface-success-subtler: var(
    --kids-color-high-contrast-success-95
  );
  --kids-high-contrast-color-surface-information-subtler: var(
    --kids-color-high-contrast-information-95
  );
  --kids-high-contrast-color-surface-point-subtler: var(
    --kids-color-high-contrast-point-95
  );
  --kids-high-contrast-color-surface-white: var(
    --kids-color-high-contrast-gray-100
  );
  --kids-high-contrast-color-surface-inverse: var(
    --kids-color-high-contrast-gray-10
  );
  --kids-high-contrast-color-surface-white-static: var(
    --kids-color-high-contrast-gray-0
  );
  --kids-high-contrast-color-surface-inverse-static: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-surface-white-subtle: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-surface-white-subtler: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-border-gray-light: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-border-gray: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-border-secondary-light: var(
    --kids-color-high-contrast-secondary-90
  );
  --kids-high-contrast-color-border-danger-light: var(
    --kids-color-high-contrast-danger-90
  );
  --kids-high-contrast-color-border-danger: var(
    --kids-color-high-contrast-danger-50
  );
  --kids-high-contrast-color-border-warning-light: var(
    --kids-color-high-contrast-warning-90
  );
  --kids-high-contrast-color-border-warning: var(
    --kids-color-high-contrast-warning-50
  );
  --kids-high-contrast-color-border-success-light: var(
    --kids-color-high-contrast-success-90
  );
  --kids-high-contrast-color-border-success: var(
    --kids-color-high-contrast-success-50
  );
  --kids-high-contrast-color-border-information-light: var(
    --kids-color-high-contrast-information-90
  );
  --kids-high-contrast-color-border-information: var(
    --kids-color-high-contrast-information-50
  );
  --kids-high-contrast-color-border-gray-dark: var(
    --kids-color-high-contrast-gray-40
  );
  --kids-high-contrast-color-border-primary: var(
    --kids-color-high-contrast-primary-55
  );
  --kids-high-contrast-color-border-disabled: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-border-gray-darker: var(
    --kids-color-high-contrast-gray-10
  );
  --kids-high-contrast-color-border-secondary: var(
    --kids-color-high-contrast-secondary-60
  );
  --kids-high-contrast-color-border-inverse: var(
    --kids-color-high-contrast-gray-100
  );
  --kids-high-contrast-color-border-transparency: var(
    --kids-color-high-contrast-alpha-white25
  );
  --kids-high-contrast-color-border-primary-light: var(
    --kids-color-high-contrast-primary-90
  );
  --kids-high-contrast-color-border-point: var(
    --kids-color-high-contrast-point-50
  );
  --kids-high-contrast-color-border-point-light: var(
    --kids-color-high-contrast-point-90
  );
  --kids-high-contrast-color-divider-gray-light: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-divider-gray: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-divider-gray-dark: var(
    --kids-color-high-contrast-gray-50
  );
  --kids-high-contrast-color-divider-primary: var(
    --kids-color-high-contrast-primary-55
  );
  --kids-high-contrast-color-divider-secondary-light: var(
    --kids-color-high-contrast-secondary-90
  );
  --kids-high-contrast-color-divider-secondary: var(
    --kids-color-high-contrast-secondary-60
  );
  --kids-high-contrast-color-divider-error: var(
    --kids-color-high-contrast-danger-50
  );
  --kids-high-contrast-color-divider-primary-light: var(
    --kids-color-high-contrast-primary-90
  );
  --kids-high-contrast-color-divider-inverse: var(
    --kids-color-high-contrast-gray-100
  );
  --kids-high-contrast-color-divider-gray-darker: var(
    --kids-color-high-contrast-gray-10
  );
  --kids-high-contrast-color-divider-point: var(
    --kids-color-high-contrast-point-50
  );
  --kids-high-contrast-color-text-bolder: var(
    --kids-color-high-contrast-gray-10
  );
  --kids-high-contrast-color-text-subtle: var(
    --kids-color-high-contrast-gray-20
  );
  --kids-high-contrast-color-text-disabled: var(
    --kids-color-high-contrast-gray-60
  );
  --kids-high-contrast-color-text-disabled-on: var(
    --kids-color-high-contrast-gray-50
  );
  --kids-high-contrast-color-text-primary: var(
    --kids-color-high-contrast-primary-20
  );
  --kids-high-contrast-color-text-secondary: var(
    --kids-color-high-contrast-secondary-20
  );
  --kids-high-contrast-color-text-danger: var(
    --kids-color-high-contrast-danger-20
  );
  --kids-high-contrast-color-text-warning: var(
    --kids-color-high-contrast-warning-20
  );
  --kids-high-contrast-color-text-success: var(
    --kids-color-high-contrast-success-20
  );
  --kids-high-contrast-color-text-information: var(
    --kids-color-high-contrast-information-20
  );
  --kids-high-contrast-color-text-basic: var(
    --kids-color-high-contrast-gray-5
  );
  --kids-high-contrast-color-text-point: var(
    --kids-color-high-contrast-point-20
  );
  --kids-high-contrast-color-text-bolder-inverse: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-text-basic-inverse: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-text-subtle-inverse: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-text-inverse-static: var(
    --kids-color-high-contrast-gray-0
  );
  --kids-high-contrast-color-text-static: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-icon-gray: var(
    --kids-color-high-contrast-gray-5
  );
  --kids-high-contrast-color-icon-gray-fill: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-icon-inverse: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-icon-primary: var(
    --kids-color-high-contrast-primary-20
  );
  --kids-high-contrast-color-icon-secondary: var(
    --kids-color-high-contrast-secondary-20
  );
  --kids-high-contrast-color-icon-point: var(
    --kids-color-high-contrast-point-20
  );
  --kids-high-contrast-color-icon-danger: var(
    --kids-color-high-contrast-danger-20
  );
  --kids-high-contrast-color-icon-warning: var(
    --kids-color-high-contrast-warning-20
  );
  --kids-high-contrast-color-icon-success: var(
    --kids-color-high-contrast-success-20
  );
  --kids-high-contrast-color-icon-information: var(
    --kids-color-high-contrast-information-20
  );
  --kids-high-contrast-color-icon-gray-light: var(
    --kids-color-high-contrast-gray-20
  );
  --kids-high-contrast-color-icon-disabled: var(
    --kids-color-high-contrast-gray-60
  );
  --kids-high-contrast-color-icon-disabled-on: var(
    --kids-color-high-contrast-gray-50
  );
  --kids-high-contrast-color-icon-inverse-static: var(
    --kids-color-high-contrast-gray-0
  );
  --kids-high-contrast-color-icon-primary-static: var(
    --kids-color-high-contrast-primary-55
  );
  --kids-high-contrast-color-icon-secondary-static: var(
    --kids-color-high-contrast-secondary-80
  );
  --kids-high-contrast-color-icon-point-static: var(
    --kids-color-high-contrast-point-50
  );
  --kids-high-contrast-color-icon-danger-static: var(
    --kids-color-high-contrast-danger-50
  );
  --kids-high-contrast-color-icon-warning-static: var(
    --kids-color-high-contrast-warning-50
  );
  --kids-high-contrast-color-icon-success-static: var(
    --kids-color-high-contrast-success-50
  );
  --kids-high-contrast-color-icon-information-static: var(
    --kids-color-high-contrast-information-50
  );
  --kids-high-contrast-color-icon-gray-static: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-link-default: var(
    --kids-color-high-contrast-primary-30
  );
  --kids-high-contrast-color-link-hover: var(
    --kids-color-high-contrast-primary-20
  );
  --kids-high-contrast-color-link-pressed: var(
    --kids-color-high-contrast-primary-10
  );
  --kids-high-contrast-color-link-visited: #c49ff9;
  --kids-high-contrast-color-button-primary-fill: var(
    --kids-color-high-contrast-primary-55
  );
  --kids-high-contrast-color-button-primary-fill-hover: var(
    --kids-color-high-contrast-primary-60
  );
  --kids-high-contrast-color-button-primary-fill-pressed: var(
    --kids-color-high-contrast-primary-70
  );
  --kids-high-contrast-color-button-secondary-fill: var(
    --kids-color-high-contrast-primary-95
  );
  --kids-high-contrast-color-button-secondary-fill-hover: var(
    --kids-color-high-contrast-primary-90
  );
  --kids-high-contrast-color-button-secondary-fill-pressed: var(
    --kids-color-high-contrast-primary-80
  );
  --kids-high-contrast-color-button-secondary-border: var(
    --kids-color-high-contrast-primary-55
  );
  --kids-high-contrast-color-button-tertiary-fill: var(
    --kids-color-high-contrast-alpha-black0
  );
  --kids-high-contrast-color-button-tertiary-fill-hover: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-button-tertiary-fill-pressed: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-button-tertiary-border: var(
    --kids-color-high-contrast-gray-40
  );
  --kids-high-contrast-color-button-disabled-fill: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-button-text-fill-hover: var(
    --kids-color-high-contrast-secondary-95
  );
  --kids-high-contrast-color-button-text-fill-pressed: var(
    --kids-color-high-contrast-secondary-90
  );
  --kids-high-contrast-color-button-text-fill: var(
    --kids-color-high-contrast-alpha-black0
  );
  --kids-high-contrast-color-button-text-border: var(
    --kids-color-high-contrast-alpha-white50
  );
  --kids-high-contrast-color-button-disabled-border: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-background-white: var(
    --kids-color-high-contrast-gray-100
  );
  --kids-high-contrast-color-background-inverse: var(
    --kids-color-high-contrast-gray-10
  );
  --kids-high-contrast-color-background-gray-subtler: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-background-gray-subtle: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-background-dim: var(
    --kids-color-high-contrast-alpha-black75
  );
  --kids-high-contrast-color-element-disabled-light: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-element-disabled-dark: var(
    --kids-color-high-contrast-gray-60
  );
  --kids-high-contrast-color-element-gray-lighter: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-element-gray-light: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-element-gray: var(
    --kids-color-high-contrast-gray-50
  );
  --kids-high-contrast-color-element-primary-lighter: var(
    --kids-color-high-contrast-primary-95
  );
  --kids-high-contrast-color-element-primary-light: var(
    --kids-color-high-contrast-primary-90
  );
  --kids-high-contrast-color-element-primary: var(
    --kids-color-high-contrast-primary-50
  );
  --kids-high-contrast-color-element-secondary-lighter: var(
    --kids-color-high-contrast-secondary-95
  );
  --kids-high-contrast-color-element-secondary-light: var(
    --kids-color-high-contrast-secondary-90
  );
  --kids-high-contrast-color-element-secondary: var(
    --kids-color-high-contrast-secondary-60
  );
  --kids-high-contrast-color-element-point-lighter: var(
    --kids-color-high-contrast-point-95
  );
  --kids-high-contrast-color-element-point-light: var(
    --kids-color-high-contrast-point-90
  );
  --kids-high-contrast-color-element-point: var(
    --kids-color-high-contrast-point-50
  );
  --kids-high-contrast-color-element-danger-lighter: var(
    --kids-color-high-contrast-danger-95
  );
  --kids-high-contrast-color-element-danger: var(
    --kids-color-high-contrast-danger-50
  );
  --kids-high-contrast-color-element-warning-lighter: var(
    --kids-color-high-contrast-warning-95
  );
  --kids-high-contrast-color-element-warning: var(
    --kids-color-high-contrast-warning-30
  );
  --kids-high-contrast-color-element-success-lighter: var(
    --kids-color-high-contrast-success-95
  );
  --kids-high-contrast-color-element-success: var(
    --kids-color-high-contrast-success-50
  );
  --kids-high-contrast-color-element-information-lighter: var(
    --kids-color-high-contrast-information-95
  );
  --kids-high-contrast-color-element-information: var(
    --kids-color-high-contrast-information-50
  );
  --kids-high-contrast-color-element-inverse: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-element-gray-dark: var(
    --kids-color-high-contrast-gray-40
  );
  --kids-high-contrast-color-element-inverse-static: var(
    --kids-color-high-contrast-gray-0
  );
  --kids-high-contrast-color-action-white: var(
    --kids-color-light-gray-100
  );
  --kids-high-contrast-color-action-primary: var(
    --kids-color-high-contrast-alpha-black0
  );
  --kids-high-contrast-color-action-primary-hover: var(
    --kids-color-high-contrast-primary-95
  );
  --kids-high-contrast-color-action-primary-pressed: var(
    --kids-color-high-contrast-primary-90
  );
  --kids-high-contrast-color-action-secondary: var(
    --kids-color-light-alpha-black0
  );
  --kids-high-contrast-color-action-secondary-hover: var(
    --kids-color-high-contrast-secondary-95
  );
  --kids-high-contrast-color-action-secondary-pressed: var(
    --kids-color-high-contrast-secondary-90
  );
  --kids-high-contrast-color-action-secondary-selected: var(
    --kids-color-light-secondary-5
  );
  --kids-high-contrast-color-action-secondary-on: var(
    --kids-color-high-contrast-alpha-black0
  );
  --kids-high-contrast-color-action-secondary-on-hover: var(
    --kids-color-high-contrast-gray-100
  );
  --kids-high-contrast-color-action-secondary-on-pressed: var(
    --kids-color-high-contrast-secondary-90
  );
  --kids-high-contrast-color-action-secondary-on-selected: var(
    --kids-color-light-secondary-5
  );
  --kids-high-contrast-color-action-secondary-active: var(
    --kids-color-high-contrast-secondary-60
  );
  --kids-high-contrast-color-action-primary-active: var(
    --kids-color-high-contrast-primary-50
  );
  --kids-high-contrast-color-action-disabled: var(
    --kids-color-high-contrast-gray-80
  );
  --kids-high-contrast-color-action-primary-selected: var(
    --kids-color-high-contrast-primary-95
  );
  --kids-high-contrast-color-input-border: var(
    --kids-color-high-contrast-gray-40
  );
  --kids-high-contrast-color-input-border-disabled: var(
    --kids-color-high-contrast-gray-70
  );
  --kids-high-contrast-color-input-border-active: var(
    --kids-color-high-contrast-primary-55
  );
  --kids-high-contrast-color-input-border-error: var(
    --kids-color-high-contrast-danger-50
  );
  --kids-high-contrast-color-input-surface: var(
    --kids-color-high-contrast-gray-90
  );
  --kids-high-contrast-color-input-surface-disabled: var(
    --kids-color-high-contrast-gray-95
  );
  --kids-high-contrast-color-graphic-blue-subtler: var(
    --kids-color-high-contrast-graphic-10
  );
  --kids-high-contrast-color-graphic-blue-subtle: var(
    --kids-color-high-contrast-graphic-30
  );
  --kids-high-contrast-color-graphic-blue: var(
    --kids-color-high-contrast-graphic-50
  );
  --kids-high-contrast-color-graphic-blue-dark: var(
    --kids-color-high-contrast-graphic-70
  );
  --kids-high-contrast-color-graphic-blue-darker: var(
    --kids-color-high-contrast-graphic-90
  );
  --kids-high-contrast-color-graphic-red-subtler: var(
    --kids-color-high-contrast-point-5
  );
  --kids-high-contrast-color-graphic-red-subtle: var(
    --kids-color-high-contrast-point-10
  );
  --kids-high-contrast-color-graphic-red: var(
    --kids-color-high-contrast-point-20
  );
  --kids-high-contrast-color-graphic-red-dark: var(
    --kids-color-high-contrast-point-40
  );
  --kids-high-contrast-color-graphic-red-darker: var(
    --kids-color-high-contrast-point-70
  );
  --kids-high-contrast-color-graphic-brand: var(
    --kids-color-high-contrast-primary-50
  );
  --kids-high-contrast-color-alpha-base100: var(
    --kids-color-high-contrast-alpha-black100
  );
  --kids-high-contrast-color-alpha-base50: var(
    --kids-color-high-contrast-alpha-black50
  );
  --kids-high-contrast-color-alpha-base25: var(
    --kids-color-high-contrast-alpha-black25
  );
  --kids-high-contrast-color-alpha-base0: var(
    --kids-color-light-alpha-black0
  );
  --kids-high-contrast-color-alpha-inverse100: var(
    --kids-color-high-contrast-alpha-white100
  );
  --kids-high-contrast-color-alpha-inverse50: var(
    --kids-color-high-contrast-alpha-white50
  );
  --kids-high-contrast-color-alpha-inverse25: var(
    --kids-color-high-contrast-alpha-white25
  );
  --kids-high-contrast-color-alpha-inverse0: var(
    --kids-color-high-contrast-alpha-white0
  );
  --kids-high-contrast-color-alpha-base75: var(
    --kids-color-high-contrast-alpha-black75
  );
  --kids-high-contrast-color-alpha-inverse75: var(
    --kids-color-high-contrast-alpha-white75
  );
  --kids-high-contrast-color-alpha-inverse10: var(
    --kids-color-high-contrast-alpha-black25
  );
  --kids-high-contrast-color-alpha-base10: var(
    --kids-color-high-contrast-alpha-black10
  );
  --kids-high-contrast-color-alpha-shadow1: rgba(0, 0, 0, 0.12);
  --kids-high-contrast-color-alpha-shadow2: rgba(0, 0, 0, 0.2);
  --kids-high-contrast-color-alpha-shadow3: rgba(0, 0, 0, 0.4);
  --kids-high-contrast-border-width-variable-regular: 0.2rem;
  --kids-high-contrast-border-width-variable-medium: 0.3rem;
  --kids-high-contrast-border-width-static-regular: 0.1rem;
  --kids-high-contrast-border-width-static-medium: 0.2rem;
  --kids-light-color-purple-base: var(
    --kids-color-point-purple-50
  );
  --kids-light-color-orange-base: var(
    --kids-color-point-orange-40
  );
  --kids-light-color-yellow-base: var(
    --kids-color-point-yellow-60
  );
  --kids-light-color-green-base: var(
    --kids-color-point-green-50
  );
  --kids-light-color-blue-base: var(
    --kids-color-point-blue-50
  );
  --kids-light-color-red-base: var(
    --kids-color-point-red-30
  );
  /* SEMANTIC */
  --kids-gap-1: var(--kids-number-2);
  --kids-gap-2: var(--kids-number-3);
  --kids-gap-3: var(--kids-number-5);
  --kids-gap-4: var(--kids-number-7);
  --kids-gap-5: var(--kids-number-8);
  --kids-gap-6: var(--kids-number-9);
  --kids-gap-7: var(--kids-number-10);
  --kids-gap-8: var(--kids-number-12);
  --kids-gap-9: var(--kids-number-14);
  --kids-gap-10: var(--kids-number-16);
  --kids-gap-11: var(--kids-number-18);
  --kids-gap-12: var(--kids-number-20);
  --kids-padding-1: var(--kids-number-2);
  --kids-padding-2: var(--kids-number-3);
  --kids-padding-3: var(--kids-number-5);
  --kids-padding-4: var(--kids-number-6);
  --kids-padding-5: var(--kids-number-7);
  --kids-padding-6: var(--kids-number-8);
  --kids-padding-7: var(--kids-number-9);
  --kids-padding-8: var(--kids-number-10);
  --kids-padding-9: var(--kids-number-12);
  --kids-padding-10: var(--kids-number-14);
  --kids-size-height-1: var(--kids-number-5);
  --kids-size-height-2: var(--kids-number-8);
  --kids-size-height-3: var(--kids-number-9);
  --kids-size-height-4: var(--kids-number-10);
  --kids-size-height-5: var(--kids-number-12);
  --kids-size-height-6: var(--kids-number-14);
  --kids-size-height-7: var(--kids-number-16);
  --kids-size-height-8: var(--kids-number-17);
  --kids-size-height-9: var(--kids-number-18);
  --kids-size-height-10: var(--kids-number-19);
  --kids-size-height-11: var(--kids-number-20);
  --kids-radius-xsmall1: var(--kids-number-2);
  --kids-radius-xsmall2: var(--kids-number-2);
  --kids-radius-xsmall3: var(--kids-number-2);
  --kids-radius-small1: var(--kids-number-3);
  --kids-radius-small2: var(--kids-number-3);
  --kids-radius-small3: var(--kids-number-3);
  --kids-radius-medium1: var(--kids-number-4);
  --kids-radius-medium2: var(--kids-number-4);
  --kids-radius-medium3: var(--kids-number-5);
  --kids-radius-medium4: var(--kids-number-5);
  --kids-radius-large1: var(--kids-number-6);
  --kids-radius-large2: var(--kids-number-6);
  --kids-radius-xlarge1: var(--kids-number-7);
  --kids-radius-xlarge2: var(--kids-number-7);
  --kids-radius-max: var(--kids-number-max);
}

:root {
  --kids-font-family-base: var(--kids-typo-font-type);
  --kids-font-size-base: 62.5%;
  --kids-line-height-none: 1;
  --kids-line-height-135: 1.35;
  --kids-line-height-base: 1.5;
  --kids-letter-spacing-none: var(--kids-typo-letter-spacing-0);
  --kids-letter-spacing-tight: var(--kids-typo-letter-spacing--1);
  --kids-letter-spacing-wide: var(--kids-typo-letter-spacing-1);
  --kids-font-weight-regular: 400;
  --kids-font-weight-bold: 700;
  --kids-transition-base: 0.2s ease-in-out;
  --kids-transition-fade: opacity 0.2s linear;
  --kids-transition-collapse: max-height 0.2s ease;
  --kids-transition-collapse-width: width 0.2s ease;
  --kids-contents-size: 1200px;
  --kids-contents-padding-x: 24px;
  --kids-contents-wrap-size: 1248px;
  --kids-box-shadow-outline: 0 0 0 0.4rem
    var(--kids-light-color-border-primary);
  --kids-box-shadow-outline-inset: inset 0 0 0 0.2rem
    var(--kids-light-color-border-primary);
  --kids-zoom-small: 0.9;
  --kids-zoom-medium: 1;
  --kids-zoom-large: 1.1;
  --kids-zoom-xlarge: 1.3;
  --kids-zoom-xxlarge: 1.5;
  --kids-font-underline-offset: 0.3rem;
  --kids-icon--size-xsmall: var(--kids-size-height-2);
  --kids-icon--size-small: var(--kids-size-height-2);
  --kids-icon--size-medium: var(--kids-size-height-3);
  --kids-icon--size-large: var(--kids-size-height-4);
  --kids-icon--size-xlarge: var(--kids-size-height-4);
}

@media (max-width: 1023px) {
  :root {
    --kids-contents-padding-x: 16px;
  }
}
:root {
  /* RESPONSIVE-PC */
  --kids-font-size-display-large: 6rem;
  --kids-font-size-display-medium: 4.4rem;
  --kids-font-size-display-small: 3.6rem;
  --kids-font-size-body-xxlarge-bold: 2.8rem;
  --kids-font-size-body-xlarge-bold: 2.4rem;
  --kids-font-size-body-large-bold: 2.2rem;
  --kids-font-size-body-medium-bold: 2.0rem;
  --kids-font-size-body-small-bold: 1.8rem;
  --kids-font-size-body-xsmall-bold: 1.6rem;
  --kids-font-size-body-xxsmall-bold: 1.4rem;
  --kids-font-size-body-xxlarge: 2.8rem;
  --kids-font-size-body-xlarge: 2.4rem;
  --kids-font-size-body-large: 2.2rem;
  --kids-font-size-body-medium: 2.0rem;
  --kids-font-size-body-small: 1.8rem;
  --kids-font-size-body-xsmall: 1.6rem;
  --kids-font-size-body-xxsmall: 1.4rem;
  --kids-font-size-heading-xxlarge: 4rem;
  --kids-font-size-heading-xlarge: 3.6rem;
  --kids-font-size-heading-large: 3.2rem;
  --kids-font-size-heading-medium: 2.4rem;
  --kids-font-size-heading-small: 2.0rem;
  --kids-font-size-heading-xsmall: 1.8rem;
  --kids-font-size-heading-xxsmall: 1.6rem;
  --kids-font-size-label-large: 1.9rem;
  --kids-font-size-label-medium: 1.7rem;
  --kids-font-size-label-small: 1.5rem;
  --kids-font-size-label-xsmall: 1.3rem;
  --kids-font-size-navigation-title-medium: 2.4rem;
  --kids-font-size-navigation-title-small: 1.9rem;
  --kids-font-size-navigation-depth-medium: 1.7rem;
  --kids-font-size-navigation-depth-small: 1.5rem;
  --kids-gap-layout-header-breadcrumb: var(--kids-number-10);
  --kids-gap-layout-left-contents: var(--kids-number-18);
  --kids-gap-layout-contents-right: var(--kids-number-14);
  --kids-gap-layout-h1-h2: var(--kids-number-16);
  --kids-gap-layout-h2-h2: var(--kids-number-20);
  --kids-gap-layout-h2-h3: var(--kids-number-14);
  --kids-gap-layout-h3-h3: var(--kids-number-18);
  --kids-gap-layout-h3-h4: var(--kids-number-10);
  --kids-gap-layout-h4-h4: var(--kids-number-14);
  --kids-gap-layout-h4-h5: var(--kids-number-8);
  --kids-gap-layout-h5-h5: var(--kids-number-12);
  --kids-gap-layout-title-body-large: var(--kids-number-10);
  --kids-gap-layout-title-body-medium: var(--kids-number-9);
  --kids-gap-layout-title-body-small: var(--kids-number-8);
  --kids-gap-layout-breadcrumb-h1: var(--kids-number-14);
  --kids-gap-layout-contents-footer: var(--kids-number-18);
  --kids-gap-layout-text-text-large: var(--kids-number-9);
  --kids-gap-layout-text-text-medium: var(--kids-number-8);
  --kids-gap-layout-text-text-small: var(--kids-number-7);
  --kids-gap-layout-image-text-large: var(--kids-number-12);
  --kids-gap-layout-image-text-medium: var(--kids-number-10);
  --kids-gap-layout-image-text-small: var(--kids-number-9);
  --kids-padding-card-large: var(--kids-number-14);
  --kids-padding-card-medium: var(--kids-number-12);
  --kids-padding-card-small: var(--kids-number-10);
  --kids-padding-card-xsmall: var(--kids-number-8);
  /* RESPONSIVE-MOBILE */
}
@media (max-width: 767px) {
  :root {
    --kids-font-size-display-large: 4.4rem;
    --kids-font-size-display-medium: 3.2rem;
    --kids-font-size-display-small: 2.8rem;
    --kids-font-size-body-xxlarge-bold: 2.4rem;
    --kids-font-size-body-xlarge-bold: 2.0rem;
    --kids-font-size-body-large-bold: 1.8rem;
    --kids-font-size-body-medium-bold: 1.8rem;
    --kids-font-size-body-small-bold: 1.6rem;
    --kids-font-size-body-xsmall-bold: 1.6rem;
    --kids-font-size-body-xxsmall-bold: 1.4rem;
    --kids-font-size-body-xxlarge: 2.4rem;
    --kids-font-size-body-xlarge: 2.0rem;
    --kids-font-size-body-large: 1.8rem;
    --kids-font-size-body-medium: 1.8rem;
    --kids-font-size-body-small: 1.6rem;
    --kids-font-size-body-xsmall: 1.6rem;
    --kids-font-size-body-xsmall: 1.4rem;
    --kids-font-size-heading-xxlarge: 3.2rem;
    --kids-font-size-heading-xlarge: 2.8rem;
    --kids-font-size-heading-large: 2.4rem;
    --kids-font-size-heading-medium: 2.2rem;
    --kids-font-size-heading-small: 1.8rem;
    --kids-font-size-heading-xsmall: 1.8rem;
    --kids-font-size-heading-xxsmall: 1.6rem;
    --kids-font-size-label-large: 1.9rem;
    --kids-font-size-label-medium: 1.7rem;
    --kids-font-size-label-small: 1.5rem;
    --kids-font-size-label-xsmall: 1.3rem;
    --kids-font-size-navigation-title-medium: 2.2rem;
    --kids-font-size-navigation-title-small: 1.9rem;
    --kids-font-size-navigation-depth-medium: 1.7rem;
    --kids-font-size-navigation-depth-small: 1.5rem;
    --kids-gap-layout-header-breadcrumb: var(--kids-number-8);
    --kids-gap-layout-left-contents: 0rem;
    --kids-gap-layout-contents-right: 0rem;
    --kids-gap-layout-h1-h2: var(--kids-number-12);
    --kids-gap-layout-h2-h2: var(--kids-number-14);
    --kids-gap-layout-h2-h3: var(--kids-number-10);
    --kids-gap-layout-h3-h3: var(--kids-number-12);
    --kids-gap-layout-h3-h4: var(--kids-number-8);
    --kids-gap-layout-h4-h4: var(--kids-number-10);
    --kids-gap-layout-h4-h5: var(--kids-number-7);
    --kids-gap-layout-h5-h5: var(--kids-number-8);
    --kids-gap-layout-title-body-large: var(--kids-number-9);
    --kids-gap-layout-title-body-medium: var(--kids-number-7);
    --kids-gap-layout-title-body-small: var(--kids-number-5);
    --kids-gap-layout-breadcrumb-h1: var(--kids-number-12);
    --kids-gap-layout-contents-footer: var(--kids-number-14);
    --kids-gap-layout-text-text-large: var(--kids-number-8);
    --kids-gap-layout-text-text-medium: var(--kids-number-7);
    --kids-gap-layout-text-text-small: var(--kids-number-6);
    --kids-gap-layout-image-text-large: var(--kids-number-10);
    --kids-gap-layout-image-text-medium: var(--kids-number-9);
    --kids-gap-layout-image-text-small: var(--kids-number-8);
    --kids-padding-card-large: var(--kids-number-10);
    --kids-padding-card-medium: var(--kids-number-10);
    --kids-padding-card-small: var(--kids-number-9);
    --kids-padding-card-xsmall: var(--kids-number-7);
  }
}

.svg-icon.ico-angle {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
}
.svg-icon.ico-angle.disabled {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_disabled.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_disabled.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
}
.svg-icon.ico-angle.up {
  transform: rotate(180deg);
}
.svg-icon.ico-angle.left {
  transform: rotate(90deg);
}
.svg-icon.ico-angle.right {
  transform: rotate(-90deg);
}
.svg-icon.ico-more {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_more.svg);
  background-color: transparent;
}
.svg-icon.ico-reset {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_reset.svg);
  background-color: transparent;
}
.svg-icon.ico-popup-close {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_close.svg);
  background-color: transparent;
}
.svg-icon.ico-sch {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_sch.svg);
  background-color: transparent;
}
.svg-icon.ico-go {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_go.svg);
  background-color: transparent;
}
.svg-icon.ico-go-primary {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_go_primary.svg);
  background-color: transparent;
}
.svg-icon.ico-down {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_download.svg);
  background-color: transparent;
}
.svg-icon.ico-down-small {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_down_small.svg);
  background-color: transparent;
}
.svg-icon.ico-down-primary {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-down-primary.svg);
  background-color: transparent;
}
.svg-icon.ico-plus {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_plus.svg);
  background-color: transparent;
}
.svg-icon.ico-plus {
  gap: var(--kids-gap-3);
}
.svg-icon.ico-link {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_go.svg);
  background-color: transparent;
}
.svg-icon.ico-link {
  gap: var(--kids-gap-3);
}
.svg-icon.ico-bread-home {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_bread_home.svg);
  background-color: transparent;
}
.svg-icon.ico-all {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_all.svg);
  background-color: transparent;
}
.svg-icon.ico-login-go {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_login_certify_go.svg);
  background-color: transparent;
}
.svg-icon.ico-go-top {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_go_top.svg);
  background-color: transparent;
}
.svg-icon.ico-detail-arw {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-detail-arw.svg);
  background-color: transparent;
}
.svg-icon.ico-detail-arw-white {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-detail-arw-white.svg);
  background-color: transparent;
}
.svg-icon.ico-video {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-video.svg);
  background-color: transparent;
}
.svg-icon.ico-video-hover {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-video-hover.svg);
  background-color: transparent;
}
.svg-icon.ico_angle_thick {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_thick.svg);
  background-color: transparent;
}
.svg-icon.ico-arw-more {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-arw-more.svg);
  background-color: transparent;
}
.svg-icon.ico-arw-more-active {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-arw-more-active.svg);
  background-color: transparent;
}
.svg-icon.ico-cate-all {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-all.svg);
  background-color: transparent;
}
.svg-icon.ico-cate-nature {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-nature.svg);
  background-color: transparent;
}
.svg-icon.ico-cate-tradition {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-tradition.svg);
  background-color: transparent;
}
.svg-icon.ico-cate-it {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-it.svg);
  background-color: transparent;
}
.svg-icon.ico-cate-job {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-job.svg);
  background-color: transparent;
}
.svg-icon.ico-cate-safe {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-safe.svg);
  background-color: transparent;
}
.svg-icon.ico-delete-fill {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-clear.svg);
  background-color: transparent;
}

.active .svg-icon.ico-cate-all {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-all-active.svg);
  background-color: transparent;
}
.active .svg-icon.ico-cate-nature {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-nature-active.svg);
  background-color: transparent;
}
.active .svg-icon.ico-cate-tradition {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-tradition-active.svg);
  background-color: transparent;
}
.active .svg-icon.ico-cate-it {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-it-active.svg);
  background-color: transparent;
}
.active .svg-icon.ico-cate-job {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-job-active.svg);
  background-color: transparent;
}
.active .svg-icon.ico-cate-safe {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-cate-safe-active.svg);
  background-color: transparent;
}

/* reset */
html,
body {
  position: relative;
  width: 100%;
  height: 100%;
  font-family: var(--kids-font-family-base);
  color: var(--kids-light-color-text-basic);
  font-weight: var(--kids-font-weight-regular);
  line-height: var(--kids-line-height-base);
  word-break: keep-all;
  word-wrap: break-word;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
}

html {
  font-size: var(--kids-font-size-base);
}

body {
  background-color: var(--kids-light-color-background-white);
  font-size: var(--kids-font-size-body-medium);
  overflow-x: hidden;
}

*:focus {
  outline: 0.2rem solid var(--kids-light-color-border-inverse);
  outline-offset: 0;
  box-shadow: var(--kids-box-shadow-outline);
  transition: outline 0s, box-shadow 0s !important;
}

::-moz-selection {
  background: var(--kids-color-light-secondary-50);
  color: var(--kids-color-light-gray-0);
}

::selection {
  background: var(--kids-color-light-secondary-50);
  color: var(--kids-color-light-gray-0);
}

body,
div,
p,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
li,
dl,
dt,
dd,
table,
th,
td,
form,
fieldset,
legend,
input,
textarea,
a,
button,
select,
ul,
li,
span,
em,
label,
:before,
:after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-text-size-adjust: none;
  font-family: inherit;
  line-height: var(--kids-line-height-base);
  letter-spacing: inherit;
  word-break: keep-all;
}

pre {
  font-family: inherit;
}

input,
textarea,
a,
button,
select,
span,
label,
:before,
:after {
  font-size: inherit;
  font-weight: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6,
strong {
  font-weight: var(--kids-font-weight-bold);
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section {
  display: block;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

img,
fieldset {
  border: 0;
}

fieldset {
  min-width: 100%;
}

img {
  max-width: 100%;
  vertical-align: top;
}

ul,
ol {
  list-style: none;
}

em,
address,
i {
  font-style: normal;
}

a,
button {
  transition: var(--kids-transition-base);
}

a,
a:hover,
a:active,
a:focus {
  color: inherit;
  text-decoration: none;
}

a:visited.visited,
a:visited .visited {
  color: var(--kids-light-color-link-visited);
}

button,
input[type=submit],
input[type=button] {
  overflow: visible;
  margin: 0;
  background-color: transparent;
  border: none;
  -webkit-appearance: button;
  cursor: pointer;
  font: inherit;
  color: inherit;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}

textarea {
  resize: none;
}

label {
  cursor: pointer;
}

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

input[type=text],
input[type=tel],
input[type=password],
input[type=file],
input[type=number],
input[type=email],
input[type=date],
input[type=search],
textarea {
  -webkit-box-shadow: none;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-tap-highlight-color: transparent;
}

input[type=number] {
  -moz-appearance: textfield;
  margin: 0;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=text]::-ms-clear {
  display: none;
}

caption {
  position: static !important;
  margin: 0 !important;
}

table {
  table-layout: fixed;
  max-width: none;
  width: auto;
  min-width: 100%;
  border-collapse: collapse;
}

blockquote {
  margin: 0;
  padding: 0;
}

[role=button] {
  cursor: pointer;
}

.img img {
  min-width: 100%;
  max-width: 100%;
}

.img.bg-img {
  background-size: cover;
}

.blind,
hr,
.sr-only,
legend,
caption {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  left: 0;
  top: 0;
}

.hide {
  display: none !important;
}

.show {
  display: block !important;
}

.underline {
  text-decoration: underline;
  text-underline-offset: var(--kids-font-underline-offset);
}

.break-all {
  word-break: break-all;
}

.svg-icon {
  display: inline-flex;
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-color: transparent;
}
.svg-icon.pure {
  display: inline-flex;
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
  background-color: var(--kids-light-color-text-basic);
  background-color: transparent !important;
  forced-color-adjust: none;
}

.inner {
  max-width: var(--kids-contents-wrap-size);
  padding-left: var(--kids-contents-padding-x);
  padding-right: var(--kids-contents-padding-x);
}

@media (max-width: 767px) {
  .pc-only {
    display: none !important;
  }
  .pc-only.read {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    left: 0;
    top: 0;
  }
  .mo-line {
    display: block;
    line-height: inherit;
  }
}
@media (min-width: 1024px) {
  .inner {
    margin: 0 auto;
  }
}
@media (min-width: 768px) {
  .mo-only {
    display: none !important;
  }
  .mo-only.read {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    left: 0;
    top: 0;
  }
  .pc-line {
    display: block;
    line-height: inherit;
  }
}
/* **** LAYOUT **** */
html {
  height: -webkit-fill-available;
}

#wrap {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  min-height: 100%;
}

.inner {
  width: 100%;
  max-width: var(--kids-contents-wrap-size);
  padding-left: var(--kids-contents-padding-x);
  padding-right: var(--kids-contents-padding-x);
}
.inner.page-step {
  position: relative;
}

#container {
  flex: 1;
  scroll-margin-top: 14rem;
  position: relative;
}
#container > .inner {
  min-height: 60rem;
}
#container > .inner:not(.in-between) {
  padding-bottom: var(--kids-gap-layout-contents-footer);
}
#container > .kids-breadcrumb-wrap {
  padding-bottom: 0;
}
#container > .kids-breadcrumb-wrap .breadcrumb {
  max-width: var(--kids-contents-wrap-size);
  padding-left: var(--kids-contents-padding-x);
  padding-right: var(--kids-contents-padding-x);
}
#container:focus {
  outline: 0.2rem solid var(--kids-light-color-border-primary);
  outline-offset: -2px;
}

/* **** CONTENTS AREA **** */
.conts-area {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  width: 100%;
}
.conts-area .conts-wrap + .conts-wrap {
  padding-top: var(--kids-gap-11);
}

.conts-wrap {
  width: 100%;
  overflow-x: hidden;
}
.conts-wrap .sec-tit {
  margin-bottom: 2.4rem;
  font-size: var(--kids-font-size-heading-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  letter-spacing: -0.01rem;
}
.conts-wrap .sec-tit .highlight {
  color: var(--kids-color-light-primary-60);
}
.conts-wrap:first-of-type {
  padding-top: 6.5rem;
}
.conts-wrap:last-of-type {
  padding-bottom: 10rem;
}

.list-tab-wrap + .conts-wrap {
  padding-top: 2rem;
}

/* **** COMMON COMPONENTS **** */
/* ** Accessibility ** */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  left: 0;
  top: 0;
}

/* ** Page Title ** */
.page-title-wrap {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  margin: 0 auto;
  margin-bottom: 4.8rem;
  max-width: var(--kids-contents-wrap-size);
  padding-left: var(--kids-contents-padding-x);
  padding-right: var(--kids-contents-padding-x);
}
.page-title-wrap .h-tit {
  font-size: var(--kids-font-size-heading-xxlarge);
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: var(--kids-font-weight-bold);
}
.page-title-wrap .h-tit .kids-badge-wrap {
  font-weight: var(--kids-font-weight-regular);
  margin-top: var(--kids-gap-layout-title-body-large);
}
.page-title-wrap .h-txt {
  font-size: var(--kids-font-size-body-large);
}

/* ** Page Bottom Button ** */
.page-btn-wrap {
  z-index: 10;
  display: flex;
  justify-content: center;
  gap: var(--kids-gap-5);
  margin-top: var(--kids-number-12);
}
.page-btn-wrap.end {
  justify-content: flex-end;
  padding: 0 3.2rem;
}

/* ** page top button ** */
.page-top-button {
  visibility: hidden;
  position: fixed;
  right: 4rem;
  bottom: 6.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: var(--kids-size-height-9);
  height: var(--kids-size-height-9);
  border-radius: var(--kids-radius-medium3);
  border: 0.1rem solid var(--kids-light-color-border-gray-light);
  background-color: var(--kids-light-color-action-white);
  box-shadow: 0px 0px 2px 0px var(--kids-light-color-alpha-shadow1), 0px 4px 8px 0px var(--kids-light-color-alpha-shadow2);
  z-index: -1;
  opacity: 0;
  font-size: var(--kids-font-size-label-small);
  transition: 0.2s ease-in-out;
}
.page-top-button:hover {
  background-color: var(--kids-light-color-action-secondary-hover);
}
.page-top-button:active, .page-top-button:focus {
  background-color: var(--kids-light-color-action-secondary-pressed);
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.page-top-button.active {
  z-index: 999;
  visibility: visible;
  opacity: 1;
}
@media (max-width: 1023px) {
  .page-top-button {
    right: var(--kids-contents-padding-x);
    bottom: var(--kids-contents-padding-x);
  }
}

/* ** Total Count ** */
.total-count {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  font-weight: 500;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: row;
  margin-bottom: var(--kids-number-5);
}
.total-count .highlight {
  color: var(--kids-color-light-primary-50);
}

.no-data {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  text-align: center;
  color: var(--kids-light-color-text-basic);
  padding: 12rem 0;
}

/* **** RESPONSIVE **** */
/* ** Web Only ** */
@media (min-width: 1024px) {
  .inner {
    margin: 0 auto;
  }
}
/* ** Tablet & Mobile ** */
@media (max-width: 1023px) {
  .breadcrumb-wrap {
    padding-left: var(--kids-number-8);
    padding-right: var(--kids-number-8);
  }
  .breadcrumb-wrap .breadcrumb .home {
    gap: 0;
  }
  .breadcrumb-wrap .breadcrumb .home::before {
    width: 1.6rem;
    height: 1.6rem;
  }
  #container .inner {
    padding-left: var(--kids-number-8);
    padding-right: var(--kids-number-8);
  }
  .conts-wrap:first-of-type {
    padding-top: 0;
  }
  .conts-wrap:last-of-type {
    padding-bottom: 5rem;
  }
}
/* ** Mobile Only ** */
@media (max-width: 767px) {
  /* Visibility Control */
  .for-mobile {
    display: block;
  }
  .w-hide {
    display: block !important;
  }
  .m-hide {
    display: none !important;
  }
  /* Layout */
  #container > .inner {
    min-height: 50rem;
  }
  .conts-area .conts-wrap + .conts-wrap {
    padding-top: var(--kids-number-14);
  }
  .list-tab-wrap + .conts-wrap {
    padding-top: 2.2rem;
  }
  .total-count {
    font-size: var(--kids-font-size-body-xsmall);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 400;
    font-weight: 500;
    justify-content: flex-start;
  }
  .page-top-button {
    width: 5.2rem;
    height: 5.2rem;
    font-size: 1.3rem;
    border-radius: 0.8rem;
  }
  .page-top-button .svg-icon {
    width: 1.95rem;
    height: 1.95rem;
  }
  .page-btn-wrap.end {
    justify-content: center; /* 260210 디자이너 요청으로 end일 경우 가운데 정렬 적용 */
  }
}
@keyframes bounceScaleInRight {
  0% {
    opacity: 0;
    transform: translateX(100%) scale(0.5);
  }
  50% {
    opacity: 1;
    transform: translateX(-5px) scale(1.1);
  }
  70% {
    transform: translateX(5px) scale(0.95);
  }
  100% {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}
@keyframes bounceScaleInUp {
  0% {
    opacity: 0;
    transform: translateY(50px) translateX(-50%) scale(0.5);
  }
  50% {
    opacity: 1;
    transform: translateY(-10px) translateX(-50%) scale(1.1);
  }
  70% {
    transform: translateY(5px) translateX(-50%) scale(0.95);
  }
  100% {
    opacity: 1;
    transform: translateY(0) translateX(-50%) scale(1);
  }
}
@keyframes SlideIn {
  0% {
    opacity: 0;
    transform: translateX(0px);
  }
  60% {
    transform: translateX(-10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes patternFadeSlideUp {
  0% {
    right: -21rem;
    bottom: -10rem;
    opacity: 0;
    transform: scale(2);
  }
  100% {
    right: -8rem;
    bottom: -7rem;
    opacity: 1;
    transform: scale(2);
  }
}
.main-visual-area {
  overflow: hidden;
}
.main-visual-area .main-visual-wrap {
  width: 100%;
  max-width: 144rem;
  width: 100%;
  margin: 11.6rem auto 0;
  background-color: #F8F8F8;
  border-radius: 6rem;
  padding: var(--kids-number-20) 0 21.7rem;
  position: relative;
  z-index: 0;
}
.main-visual-area .main-visual-wrap .h-tit {
  scroll-margin-top: 20rem;
}
.main-visual-area .main-visual-wrap .visual-box {
  height: 38.6rem;
}
.main-visual-area .main-visual-wrap .visual-box .inner {
  position: relative;
}
.main-visual-area .main-visual-wrap .visual-box.swiper-slide-active .visual-desc em {
  animation: fadeIn 1.4s ease-out forwards;
}
.main-visual-area .main-visual-wrap .visual-box.swiper-slide-active .visual-desc .desc {
  animation: fadeIn 1.2s ease-out 0.4s forwards;
}
.main-visual-area .visual-desc {
  position: relative;
  z-index: 2;
  padding: 2rem 0 0;
}
.main-visual-area .visual-desc em {
  opacity: 0;
  display: inline-flex;
  background-color: var(--kids-color-sub-gray);
  border-radius: 2.1rem;
  padding: 0.821rem 1.6rem;
  color: var(--kids-color-light-alpha-white100);
  font-size: 1.8rem;
  line-height: 1.2;
  letter-spacing: var(--kids-typo-letter-spacing--1);
}
.main-visual-area .visual-desc .desc {
  opacity: 0;
  margin-top: 1.6rem;
}
.main-visual-area .visual-desc .desc > a {
  display: block;
  height: 100%;
  font-family: "Cafe24Ohsquare";
  font-size: 7rem;
  line-height: 1.2;
  letter-spacing: var(--kids-typo-letter-spacing--1);
}
.main-visual-area .visual-desc .desc strong {
  display: block;
  font-weight: 700;
}
.main-visual-area .swiper-indicator {
  z-index: 1;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 36.6rem;
  width: 100%;
}
.main-visual-area .swiper-indicator .swiper-pagination {
  height: var(--kids-size-height-7);
  line-height: 1.5;
  font-size: 1.9rem;
}
.main-visual-area .swiper-indicator .swiper-pagination.swiper-pagination-fraction {
  padding: 0 2.1rem;
}
.main-visual-area .swiper-indicator [class^=swiper-button-] {
  width: var(--kids-size-height-7);
  height: var(--kids-size-height-7);
}
.main-visual-area .swiper-indicator [class^=swiper-button-]::after {
  display: inline-flex;
  width: var(--kids-size-height-5);
  height: var(--kids-size-height-5);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-color: transparent;
}
.main-visual-area .slide-img-bg {
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 0 0;
  z-index: -1;
  right: 0;
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  height: 33.8rem;
}
.main-visual-area .slide-img-bg.slide-img-bg01 {
  bottom: 25.4rem;
  width: 100.8rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_bg01.png);
}
.main-visual-area .slide-img-bg.slide-img-bg02 {
  bottom: 25.4rem;
  width: 100.8rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_bg02.png);
}
.main-visual-area .slide-img-bg.slide-img-bg03 {
  bottom: 25.4rem;
  width: 100.8rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_bg03.png);
}
.main-visual-area .slide-img-bg.active {
  opacity: 1;
  transform: scale(1);
}
.main-visual-area .slide-mascot [class^=img-mascot] {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  z-index: 2;
  opacity: 0;
  transform: scale(0.5);
}
.main-visual-area .slide-mascot .img-mascot01 {
  right: 100%;
  top: 13rem;
  transform: translateX(100%);
}
.main-visual-area .slide-mascot .img-mascot01.active {
  animation: bounceScaleInRight 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
  animation-delay: 0.3s;
}
.main-visual-area .slide-mascot .img-mascot02 {
  left: 50%;
  bottom: calc(100% - 1.135rem);
  transform: translateX(-50%) translateY(50px);
}
.main-visual-area .slide-mascot .img-mascot02.active {
  animation: bounceScaleInUp 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}
.main-visual-area .slide-mascot .img-mascot03 {
  right: -4.1rem;
  transform: translateX(0);
}
.main-visual-area .slide-mascot .img-mascot03.active {
  animation: SlideIn 0.8s ease forwards;
  animation-delay: 0.6s;
}
.main-visual-area .slide-mascot.slide-mascot01 .img-mascot01 {
  width: 11rem;
  height: 18.6rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot01-1.png);
}
.main-visual-area .slide-mascot.slide-mascot01 .img-mascot02 {
  width: 18rem;
  height: 9.513rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot01-2.png);
}
.main-visual-area .slide-mascot.slide-mascot01 .img-mascot03 {
  bottom: 28.3rem;
  width: 41rem;
  height: 32.6rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot01-3.png);
}
.main-visual-area .slide-mascot.slide-mascot02 .img-mascot01 {
  right: calc(100% - 2.4rem);
  width: 10.6rem;
  height: 16.5rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot02-1.png);
}
.main-visual-area .slide-mascot.slide-mascot02 .img-mascot02 {
  bottom: calc(100% - 2.6rem);
  width: 14.2rem;
  height: 11.8rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot02-2.png);
}
.main-visual-area .slide-mascot.slide-mascot02 .img-mascot03 {
  bottom: 25.4rem;
  right: -8.9rem;
  width: 61rem;
  height: 38.3rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot02-3.png);
}
.main-visual-area .slide-mascot.slide-mascot03 .img-mascot01 {
  right: calc(100% - 2.4rem);
  width: 10.2rem;
  height: 16.1rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot03-1.png);
}
.main-visual-area .slide-mascot.slide-mascot03 .img-mascot02 {
  bottom: calc(100% - 3.135rem);
  width: 13.8rem;
  height: 11.4rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot03-2.png);
}
.main-visual-area .slide-mascot.slide-mascot03 .img-mascot03 {
  bottom: 25.4rem;
  right: -3.1rem;
  width: 36.7rem;
  height: 39.64rem;
  background-image: url(https://static.gov.kr/content/child/content/images/main/main_visual_mascot03-3.png);
}

.main-bnr-area {
  margin-top: -21.7rem;
  margin-bottom: var(--kids-number-18);
}
.main-bnr-area .inner {
  display: flex;
  align-items: flex-start;
  gap: 2.1rem;
}
.main-bnr-area .bnr {
  flex: 1 1 0px;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  height: 38.6rem;
  border-radius: var(--kids-number-14);
  padding: 3.9rem 3.2rem 3rem;
  overflow: hidden;
  color: var(--kids-color-light-alpha-white100);
  letter-spacing: -0.15rem;
  position: relative;
  z-index: 2;
  cursor: pointer;
  transition: 0.2s ease-in-out;
}
.main-bnr-area .bnr .ico {
  position: absolute;
  z-index: 1;
  top: 3.9rem;
  left: 3.2rem;
  width: 10.8rem;
  height: 10.8rem;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
}
.main-bnr-area .bnr .tit {
  position: absolute;
  z-index: 1;
  top: 20.2rem;
  left: 3.2rem;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1;
}
.main-bnr-area .bnr .bnr-desc {
  position: absolute;
  z-index: 1;
  top: 25.2rem;
  left: 3.2rem;
  right: 3.2rem;
}
.main-bnr-area .bnr .bnr-desc .desc {
  font-size: 1.7rem;
  letter-spacing: var(--prefix-letter-spacing-tight);
}
.main-bnr-area .bnr .bnr-desc .desc.default {
  opacity: 1;
  transform: translateY(0);
}
.main-bnr-area .bnr .bnr-desc .desc.hover {
  opacity: 0;
  transform: translateY(1rem);
  position: absolute;
  left: 0;
  top: 0;
  height: 0;
  width: 100%;
  overflow: hidden;
}
.main-bnr-area .bnr .btn-detail {
  position: absolute;
  width: calc(100% - 3.2rem * 2);
  bottom: 3rem;
  left: 3.2rem;
  display: flex;
  align-items: center;
  font-size: 1.7rem;
  font-weight: 600;
  transition: 0.2s ease-in-out;
}
.main-bnr-area .bnr .btn-detail .svg-icon {
  position: absolute;
  right: 0;
  display: inline-flex;
  width: var(--kids-number-15);
  height: var(--kids-number-15);
  border-radius: 50%;
  mask-image: none;
  background-size: auto;
  transition: 0.2s ease-in-out;
}
.main-bnr-area .bnr .pattern {
  width: 23rem;
  height: 23rem;
  position: absolute;
  z-index: 0;
  right: -5.2rem;
  top: -3.7rem;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: auto;
  opacity: 1;
  transform: scale(1);
  transition: all 0.2s;
  transition-delay: -0.5s;
}
.main-bnr-area .bnr:hover {
  flex: 2.3909;
}
.main-bnr-area .bnr:hover .ico {
  opacity: 0;
}
.main-bnr-area .bnr:hover .tit {
  font-size: 3.6rem;
  top: 6rem;
}
.main-bnr-area .bnr:hover .bnr-desc {
  top: 11.5rem;
}
.main-bnr-area .bnr:hover .bnr-desc .desc {
  font-size: 2.2rem;
}
.main-bnr-area .bnr:hover .bnr-desc .desc.default {
  opacity: 0;
  transform: translateY(-100%);
  height: 0;
}
.main-bnr-area .bnr:hover .bnr-desc .desc.hover {
  opacity: 1;
  transform: translateY(0);
  height: auto;
}
.main-bnr-area .bnr:hover .btn-detail .svg-icon {
  right: calc(100% - 9rem - 4.4rem);
}
.main-bnr-area .bnr:hover .pattern {
  top: inherit;
  animation: patternFadeSlideUp 0.5s ease-out forwards;
}
.main-bnr-area .bnr.off .pattern {
  right: -13.5rem;
  transition-delay: 0s;
}
.main-bnr-area .bnr01 {
  background-color: var(--kids-color-point-purple-50);
}
.main-bnr-area .bnr01 .ico {
  background-image: url(https://static.gov.kr/content/child/content/images/main/ico_main_bnr01.svg);
}
.main-bnr-area .bnr01 .btn-detail .svg-icon {
  background-color: #B177DD;
}
.main-bnr-area .bnr01 .pattern {
  background-image: url(https://static.gov.kr/content/child/content/images/main/bg_main_bnr01.svg);
}
.main-bnr-area .bnr02 {
  background-color: var(--kids-color-point-orange-40);
}
.main-bnr-area .bnr02 .ico {
  background-image: url(https://static.gov.kr/content/child/content/images/main/ico_main_bnr02.svg);
}
.main-bnr-area .bnr02 .btn-detail .svg-icon {
  background-color: #FF9D75;
}
.main-bnr-area .bnr02 .pattern {
  background-image: url(https://static.gov.kr/content/child/content/images/main/bg_main_bnr02.svg);
}
.main-bnr-area .bnr03 {
  background-color: #FAD149;
  color: var(--kids-color-light-alpha-black100);
}
.main-bnr-area .bnr03 .ico {
  background-image: url(https://static.gov.kr/content/child/content/images/main/ico_main_bnr03.svg);
}
.main-bnr-area .bnr03 .btn-detail .svg-icon {
  background-color: #FFE9A9;
}
.main-bnr-area .bnr03 .pattern {
  background-image: url(https://static.gov.kr/content/child/content/images/main/bg_main_bnr03.svg);
}

@media (min-width: 1280px) and (max-width: 1439px) {
  .main-visual-area .slide-mascot .img-mascot01 {
    display: none;
  }
  .main-visual-area .slide-mascot .img-mascot03 {
    right: 0;
  }
}
@media (max-width: 1023px) {
  .main-visual-area .main-visual-wrap {
    margin-top: 8.9rem;
    border-radius: 0;
    padding: 2rem 0 5.9rem;
  }
  .main-visual-area .main-visual-wrap .visual-box {
    height: 60rem;
  }
  .main-visual-area .main-visual-wrap .visual-box .inner {
    padding-bottom: 35.784rem;
  }
  .main-visual-area .main-visual-wrap .visual-box .visual-desc em {
    border-radius: 3.3rem;
    padding: 0.68rem 2rem;
    font-size: 1.7rem;
    letter-spacing: -0.56px;
  }
  .main-visual-area .main-visual-wrap .visual-box .visual-desc .desc {
    margin-top: 1.2rem;
  }
  .main-visual-area .main-visual-wrap .visual-box .visual-desc .desc > a {
    font-size: 6rem;
  }
  .main-visual-area .swiper-indicator {
    top: 25rem;
    justify-content: space-between;
  }
  .main-visual-area .swiper-indicator .swiper-pagination {
    height: var(--kids-size-height-6);
    font-size: 1.8rem;
  }
  .main-visual-area .swiper-indicator .swiper-pagination.swiper-pagination-fraction {
    padding: 0 1.5rem;
    gap: 0.3rem;
  }
  .main-visual-area .swiper-indicator [class^=swiper-button-] {
    width: var(--kids-size-height-6);
    height: var(--kids-size-height-6);
  }
  .main-visual-area .swiper-indicator [class^=swiper-button-]::after {
    background-size: 2.6rem auto;
  }
  .main-visual-area .slide-img-bg.slide-img-bg01, .main-visual-area .slide-img-bg.slide-img-bg02, .main-visual-area .slide-img-bg.slide-img-bg03 {
    height: 30rem;
    width: 60rem;
    left: 0;
    bottom: 8rem;
  }
  .main-visual-area .slide-mascot .img-mascot01 {
    display: none;
  }
  .main-visual-area .slide-mascot.slide-mascot01 .img-mascot02 {
    bottom: calc(100% - 0.856rem);
    width: 16rem;
    height: 8.4rem;
  }
  .main-visual-area .slide-mascot.slide-mascot01 .img-mascot03 {
    right: 1.6rem;
    bottom: 11rem;
    width: 32rem;
    height: 25.5rem;
  }
  .main-visual-area .slide-mascot.slide-mascot02 .img-mascot02 {
    width: 12rem;
    height: 10rem;
  }
  .main-visual-area .slide-mascot.slide-mascot02 .img-mascot03 {
    right: 1.6rem;
    bottom: 11rem;
    width: 40.5rem;
    height: 25.5rem;
  }
  .main-visual-area .slide-mascot.slide-mascot03 .img-mascot02 {
    bottom: calc(100% - 2rem);
    width: 11rem;
    height: 9.1rem;
  }
  .main-visual-area .slide-mascot.slide-mascot03 .img-mascot03 {
    right: 1.6rem;
    bottom: 11rem;
    width: 23.7rem;
    height: 25.5rem;
  }
  .main-bnr-area {
    margin-top: -7.9rem;
  }
  .main-bnr-area .inner {
    flex-direction: column;
    gap: 1.6rem;
  }
  .main-bnr-area .bnr {
    width: 100%;
    border-radius: 3.6rem;
    flex: inherit;
  }
  .main-bnr-area .bnr .ico {
    width: 8.8rem;
    height: 8.8rem;
  }
  .main-bnr-area .bnr .tit {
    top: 17rem;
  }
  .main-bnr-area .bnr .bnr-desc {
    top: 22.6rem;
  }
  .main-bnr-area .bnr .bnr-desc .desc {
    font-size: 1.7rem;
  }
  .main-bnr-area .bnr .bnr-desc .desc.default {
    opacity: 1;
    transform: translateY(0);
    height: auto;
    overflow: visible;
  }
  .main-bnr-area .bnr .bnr-desc .desc.hover {
    display: none;
  }
  .main-bnr-area .bnr:hover {
    flex: inherit;
  }
  .main-bnr-area .bnr:hover .ico {
    opacity: 1;
  }
  .main-bnr-area .bnr:hover .tit {
    top: 17rem;
    font-size: 3.2rem;
  }
  .main-bnr-area .bnr:hover .bnr-desc {
    top: 22.6rem;
  }
  .main-bnr-area .bnr:hover .bnr-desc .desc {
    font-size: 1.7rem;
  }
  .main-bnr-area .bnr:hover .bnr-desc .desc.default {
    opacity: 1;
    transform: translateY(0);
    height: auto;
    overflow: visible;
  }
  .main-bnr-area .bnr:hover .bnr-desc .desc.hover {
    display: none;
  }
  .main-bnr-area .bnr:hover .btn-detail .svg-icon {
    right: 0;
  }
  .main-bnr-area .bnr:hover .pattern {
    top: -3.7rem;
    animation: none;
  }
  .main-bnr-area .bnr.off .pattern {
    right: -5.2rem;
    transition-delay: 0s;
  }
}
@media (max-width: 767px) {
  .main-visual-area .main-visual-wrap .visual-box {
    height: 53.9rem;
  }
  .main-visual-area .main-visual-wrap .visual-box .visual-desc em {
    border-radius: 3.2rem;
    padding: 0.6rem 2rem;
  }
  .main-visual-area .main-visual-wrap .visual-box .visual-desc .desc {
    margin-top: 1rem;
  }
  .main-visual-area .main-visual-wrap .visual-box .visual-desc .desc > a {
    font-size: 4.4rem;
    line-height: 1.35;
  }
  .main-visual-area .swiper-indicator {
    top: 21.7rem;
  }
  .main-visual-area .slide-img-bg.slide-img-bg01 {
    background-image: url(https://static.gov.kr/content/child/content/images/main/m_main_visual_bg01.png);
    bottom: 17.3rem;
    width: 100%;
    height: 18.4rem;
  }
  .main-visual-area .slide-img-bg.slide-img-bg02 {
    background-image: url(https://static.gov.kr/content/child/content/images/main/m_main_visual_bg02.png);
    bottom: 17.3rem;
    width: 100%;
    height: 18.4rem;
  }
  .main-visual-area .slide-img-bg.slide-img-bg03 {
    background-image: url(https://static.gov.kr/content/child/content/images/main/m_main_visual_bg03.png);
    bottom: 17.3rem;
    width: 100%;
    height: 18.4rem;
  }
  .main-visual-area .slide-mascot.slide-mascot01 .img-mascot02 {
    width: 14rem;
    height: 7.3rem;
  }
  .main-visual-area .slide-mascot.slide-mascot01 .img-mascot03 {
    bottom: 11.5rem;
    width: 24rem;
    height: 19.1rem;
  }
  .main-visual-area .slide-mascot.slide-mascot02 .img-mascot02 {
    width: 10.8rem;
    height: 9rem;
  }
  .main-visual-area .slide-mascot.slide-mascot02 .img-mascot03 {
    right: -1.6rem;
    bottom: 11.5rem;
    width: 34rem;
    height: 21.8rem;
  }
  .main-visual-area .slide-mascot.slide-mascot03 .img-mascot02 {
    width: 10.8rem;
    height: 8.9rem;
  }
  .main-visual-area .slide-mascot.slide-mascot03 .img-mascot03 {
    bottom: 11.5rem;
    width: 20.4rem;
    height: 22.1rem;
  }
}
@keyframes bounceUp {
  0% {
    transform: translateY(100px);
    opacity: 0;
  }
  60% {
    transform: translateY(-10px);
    opacity: 1;
  }
  80% {
    transform: translateY(5px);
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
.hero-wrap {
  width: 100%;
}
.hero-wrap .inner {
  position: relative;
  height: 100%;
}
.hero-wrap .inner .info-wrap {
  width: 100%;
  padding: 8rem 0 9.2rem;
}
.hero-wrap .inner .info-wrap .info-text {
  font-size: var(--kids-font-size-body-xlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
}
.hero-wrap .inner .info-wrap .info-text em {
  display: inline-block;
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: inherit;
  margin-top: var(--kids-number-9);
}
.hero-wrap .inner .info-wrap .info-text + .form-group {
  margin-top: var(--kids-number-10);
}
.hero-wrap .inner .info-wrap .form-group {
  max-width: 60rem;
}
.hero-wrap .inner .info-wrap .form-group .kids-btn.icon.btn-delete-input {
  width: var(--kids-number-12);
  height: var(--kids-number-12);
}
.hero-wrap .inner .info-wrap .form-group .kids-btn.icon.btn-delete-input .svg-icon {
  width: 2.667rem;
  height: 2.667rem;
}
.hero-wrap .inner .info-wrap.has-form {
  padding: 8rem 0 6.4rem;
}
.hero-wrap .inner .info-wrap.has-form .info-text em {
  margin-top: 0;
}
.hero-wrap .inner .ico-deco01 {
  position: absolute;
  bottom: -2rem;
  right: 4rem;
  max-width: 44.6rem;
  animation: bounceUp 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.2s;
  opacity: 0;
  animation-fill-mode: forwards;
}
.hero-wrap .inner .ico-deco02 {
  position: absolute;
  bottom: -2rem;
  right: 4rem;
  max-width: 44.6rem;
  animation: bounceUp 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.3s;
  opacity: 0;
  animation-fill-mode: forwards;
}
.hero-wrap .inner .ico-mascot {
  position: absolute;
  bottom: -2rem;
  right: 4rem;
  max-width: 44.6rem;
  animation: bounceUp 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
}
.hero-wrap[data-page=dictionary] {
  background-color: var(--kids-color-sub-bg);
}
.hero-wrap[data-page=know] {
  background-color: #FDF8E3;
}
.hero-wrap[data-page=listen] {
  background-color: var(--kids-color-point-purple-10);
}
.hero-wrap[data-page=sites] {
  background-color: var(--kids-color-point-red-0);
}

@media (max-width: 1023px) {
  .hero-wrap .inner .info-wrap .form-group {
    max-width: 40rem;
  }
  .hero-wrap .inner .ico-deco01,
  .hero-wrap .inner .ico-deco02,
  .hero-wrap .inner .ico-mascot {
    position: absolute;
    bottom: -1rem;
    right: 2rem;
    max-width: 30rem;
  }
  .hero-wrap + .list-tab-wrap {
    margin-top: 4rem;
  }
}
@media (max-width: 767px) {
  .hero-wrap {
    height: auto;
    min-height: 33.6rem;
    display: flex;
    flex-direction: column;
  }
  .hero-wrap .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    height: 100%;
    gap: 0;
    flex: 1;
  }
  .hero-wrap .inner .info-wrap {
    padding: 4rem 0 16rem;
  }
  .hero-wrap .inner .info-wrap .kids-input.xlarge {
    height: var(--kids-input--size-height-large);
    font-weight: 400;
  }
  .hero-wrap .inner .info-wrap .kids-btn.icon.xlarge {
    width: var(--kids-number-12);
    height: var(--kids-number-12);
  }
  .hero-wrap .inner .info-wrap .info-text em {
    margin-top: var(--kids-number-8);
  }
  .hero-wrap .inner .info-wrap .info-text br,
  .hero-wrap .inner .info-wrap .info-text em br {
    display: none;
  }
  .hero-wrap .inner .info-wrap .info-text .for-mobile {
    display: block;
  }
  .hero-wrap .inner .info-wrap .form-group {
    max-width: 100%;
  }
  .hero-wrap .inner .info-wrap .form-group .kids-btn.icon.btn-delete-input {
    width: var(--kids-number-10);
    height: var(--kids-number-10);
  }
  .hero-wrap .inner .info-wrap .form-group .kids-btn.icon.btn-delete-input .svg-icon {
    width: var(--kids-number-9);
    height: var(--kids-number-9);
  }
  .hero-wrap .inner .info-wrap.has-form {
    padding: 4rem 0 16rem;
  }
  .hero-wrap .inner .info-wrap.has-form em {
    display: inline;
  }
  .hero-wrap .inner .ico-deco01,
  .hero-wrap .inner .ico-deco02,
  .hero-wrap .inner .ico-mascot {
    position: absolute;
    right: inherit;
    left: 50%;
    margin-left: -11.5rem;
    max-width: 23rem;
  }
}
@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
}
.sub-visual-group {
  width: 100%;
  padding: 7.7rem 0 8rem;
  background: url(https://static.gov.kr/content/child/content/images/sub/bg-visual-pattern.png) repeat 0 0/230px auto;
}
.sub-visual-group .inner {
  position: relative;
  z-index: 1;
}
.sub-visual-group .group-title {
  position: relative;
  margin: 0 8rem -4.6rem;
  padding: var(--kids-padding-6) 5rem;
  font-size: var(--kids-font-size-heading-xxlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 700;
  letter-spacing: var(--kids-typo-letter-spacing--0);
  color: var(--kids-color-light-alpha-white100);
  border-radius: 9.9rem;
  z-index: 1;
}
.sub-visual-group .group-title .for-mobile {
  display: none;
}
.sub-visual-group .group-title::after {
  content: "";
  position: absolute;
  bottom: -9.8rem;
  right: 14.6rem;
  width: 9.4rem;
  height: 9.8rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.sub-visual-group .group-cont {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
  min-height: 47.2rem;
  padding: 10.9rem 8rem 0;
  background: var(--kids-color-light-alpha-white100);
  border-radius: 5rem;
  border: 2px solid transparent;
  font-size: var(--kids-font-size-body-xlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  position: relative;
}
.sub-visual-group .group-cont::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 9.3rem;
  width: 44.3rem;
  height: 30rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 0;
}
.sub-visual-group .sub-cont {
  max-width: 65.4rem;
  padding: 0 5rem;
  z-index: 1;
}
.sub-visual-group .sub-cont [class*=tit] {
  font-weight: 700;
}
.sub-visual-group .sub-cont .tit {
  margin-bottom: var(--kids-padding-8);
}
.sub-visual-group .sub-cont .desc-tit {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  margin-bottom: var(--kids-padding-5);
}
.sub-visual-group .sub-cont .desc {
  font-size: var(--kids-font-size-body-xlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
}
.sub-visual-group .sub-cont .desc em {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.sub-visual-group .sub-cont .desc + .desc {
  margin-top: var(--kids-number-7);
}
.sub-visual-group.item-01 {
  background-color: #cfecff;
}
.sub-visual-group.item-01 .group-title {
  background: var(--kids-color-point-blue-50);
}
.sub-visual-group.item-01 .group-title::after {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/bg-visual-item-pointer-01.png");
}
.sub-visual-group.item-01 .group-cont {
  border-color: var(--kids-color-point-blue-50);
}
.sub-visual-group.item-01 .group-cont::after {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/img-visual-item-01.png");
}
.sub-visual-group.item-01 .sub-cont .tit {
  color: #2781b4;
}
.sub-visual-group.item-02 {
  background-color: #fff0cf;
}
.sub-visual-group.item-02 .group-title {
  background: #ffad00;
}
.sub-visual-group.item-02 .group-title::after {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/bg-visual-item-pointer-02.png");
}
.sub-visual-group.item-02 .group-cont {
  border-color: #ffad00;
}
.sub-visual-group.item-02 .group-cont::after {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/img-visual-item-02.png");
}
.sub-visual-group.item-02 .sub-cont .tit {
  color: #cc8a00;
}
.sub-visual-group.item-03 {
  background-color: #ffe3e8;
}
.sub-visual-group.item-03 .group-title {
  background: #ff828a;
}
.sub-visual-group.item-03 .group-title::after {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/bg-visual-item-pointer-03.png");
}
.sub-visual-group.item-03 .group-cont {
  border-color: #ff828a;
}
.sub-visual-group.item-03 .group-cont::after {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/img-visual-item-03.png");
}
.sub-visual-group.item-03 .sub-cont .tit {
  color: #ff4c58;
}

.kids-gov-wrap {
  overflow-x: auto;
  padding-top: var(--kids-number-20);
  padding-bottom: 10rem;
}
.kids-gov-wrap:last-of-type {
  padding-bottom: 10rem;
}

.gov-badge {
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-color-light-gray-0);
  display: inline-block;
  padding: 0 var(--kids-number-7);
  height: 3rem;
  border-radius: 3rem;
}
.gov-badge.bg-green {
  background-color: #339d76;
}
.gov-badge.bg-light-purple {
  background-color: #c486e9;
}
.gov-badge.bg-purple {
  background-color: var(--kids-color-point-purple-50);
}
.gov-badge.bg-blue {
  background-color: #0078bd;
}
.gov-badge.bg-skyblue {
  background-color: var(--kids-color-point-blue-50);
}
.gov-badge.bg-yellow {
  background-color: var(--kids-color-point-yellow-60);
  color: var(--kids-color-light-gray-100);
}
.gov-badge.bg-pink {
  background-color: #ff828a;
}

.leader-team-wrap {
  width: 100%;
  padding: var(--kids-number-20) 0;
  background-color: var(--kids-light-color-surface-secondary-subtler);
}

.leader-team-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--kids-gap-7);
}
.leader-team-list > li {
  background-color: var(--kids-color-light-gray-0);
  border-radius: var(--kids-number-12);
  padding: 6rem 4rem 4rem;
}
.leader-team-list > li h4 {
  font-size: var(--kids-font-size-heading-xxlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 700;
  display: block;
}
.leader-team-list > li .team-role {
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-color-high-contrast-gray-80);
  margin-top: var(--kids-number-12);
}
.leader-team-list > li .team-thumb {
  margin-top: 4.9rem;
  text-align: center;
}
.leader-team-list > li .team-thumb img {
  margin: 0 auto;
}

.all-team-wrap {
  width: 100%;
  padding: var(--kids-number-20) 0;
}

.all-team-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--kids-gap-7);
}
.all-team-list > .card {
  position: relative;
  background-color: var(--kids-light-color-surface-secondary-subtler);
  border-radius: var(--kids-number-9);
  transition: 0.2s ease-in-out;
  overflow: hidden;
}
.all-team-list > .card:hover {
  background-color: var(--kids-color-point-blue-50);
  color: var(--kids-color-light-gray-0);
}
.all-team-list > .card > a {
  display: block;
  padding: var(--kids-number-11) var(--kids-number-12);
}
.all-team-list > .card > a::before {
  content: "";
  position: absolute;
  right: var(--kids-number-11);
  bottom: var(--kids-number-11);
  width: var(--kids-number-12);
  height: var(--kids-number-12);
  background-color: var(--kids-color-point-blue-50);
  border-radius: var(--kids-radius-max);
}
.all-team-list > .card > a::after {
  content: "";
  position: absolute;
  right: var(--kids-number-13);
  bottom: var(--kids-number-13);
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background: linear-gradient(#fff, #fff) center/100% 0.1rem no-repeat, linear-gradient(#fff, #fff) center/0.1rem 100% no-repeat;
}
.all-team-list > .card > a:hover .title {
  color: var(--kids-color-light-gray-0);
}
.all-team-list > .card > a:hover .desc,
.all-team-list > .card > a:hover .ico-arw-more {
  opacity: 1;
}
.all-team-list > .card > a:hover::before, .all-team-list > .card > a:hover::after {
  opacity: 0;
}
.all-team-list > .card.no-link a {
  cursor: default;
}
.all-team-list .title {
  font-size: var(--kids-font-size-heading-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-light-color-text-basic);
  transition: opacity 0.2s linear;
}
.all-team-list .desc {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-color-light-gray-0);
  margin-top: var(--kids-number-5);
  opacity: 0;
  transition: opacity 0.25s ease, height 0.35s ease;
}
.all-team-list .ico-arw-more {
  width: 3.2rem;
  height: 3.2rem;
  position: absolute;
  right: 3rem;
  top: 3rem;
  opacity: 0;
  transition: 0.2s ease-in-out;
}

@media (hover: hover) {
  .card a:hover .desc {
    opacity: 1;
  }
}
.org-chart {
  --org-chart-gap: 8rem;
  --org-chart-line-height: auto;
  --vertical-line: auto;
  --item-height: var(--item-height);
  --item-height-half: calc(var(--item-height) * 0.5);
  --item-gap: 1.2rem;
  --depth1-gap: 28.33%;
  --depth1-gap-half: calc(var(--depth1-gap) * 0.5);
  --depth1-col-width: 22.2rem;
  --depth2-col-width: calc(2.8rem + var(--depth2-width));
  --depth2-gap: 2.8rem;
  --depth2-gap-half: calc(var(--depth2-gap) * 0.5);
  --depth2-width: 18rem;
  --org-bullet-size: 1.2rem;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--org-chart-gap);
}
.org-chart::before {
  content: "";
  position: absolute;
  background: #cdd1d5;
  z-index: 1;
  width: 0.2rem;
  margin-left: -0.1rem;
  top: 0;
  left: 50%;
  height: var(--org-chart-line-height);
}
.org-chart .org-item {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 3.4rem;
}
.org-chart .item-title {
  align-self: center;
  font-size: var(--kids-font-size-heading-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  z-index: 1;
}
.org-chart .item-title > a {
  display: inline-flex;
  align-items: center;
  gap: 0 1rem;
  min-width: 30.6rem;
  padding: 2rem 2.4rem 2rem 5.8rem;
  border-radius: 0.8rem;
  color: var(--kids-color-light-alpha-white100);
}
.org-chart .item-title > a strong {
  flex: 1 0 calc(100% - 3.4rem);
  text-align: center;
}
.org-chart .item-title > a .svg-icon {
  filter: brightness(0) invert(1);
}
.org-chart .item-group {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: 2.8rem;
  width: 100%;
}
.org-chart .item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
  width: 100%;
}
.org-chart .item.other .item-inner {
  gap: 2.8rem;
}
.org-chart .item-inner {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--item-gap);
  width: 100%;
}
.org-chart .item-inner [class*=item-depth-] {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--item-gap);
  position: relative;
}
.org-chart .item-inner [class*=item-depth-]:has(> li:nth-child(2)):not(:has(> li.no-line))::after {
  content: "";
  position: absolute;
  background: #cdd1d5;
  z-index: 1;
  width: 0.2rem;
  margin-left: -0.1rem;
  top: 2.5rem;
  height: var(--vertical-line);
}
.org-chart .item-inner [class*=item-depth-] li {
  position: relative;
  width: 100%;
}
.org-chart .item-inner [class*=item-depth-] li::after {
  content: "";
  position: absolute;
  background: #cdd1d5;
  z-index: 1;
  height: 0.2rem;
  margin-top: -0.1rem;
  top: 2.5rem;
}
.org-chart .item-inner [class*=item-depth-] li.no-line::after {
  content: none;
}
.org-chart .item-inner [class*=item-depth-] li a {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 100%;
  padding: 1.1rem 2rem;
  border-radius: 0.8rem;
  font-size: var(--kids-font-size-body-small-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  z-index: 2;
}
.org-chart .item-inner [class*=item-depth-] li a strong {
  flex: 1 0 calc(100% - 2rem);
  max-width: calc(100% - 2rem);
  word-break: break-word;
}
.org-chart .item-inner [class*=item-depth-] li a .svg-icon {
  flex: 1 0 2rem;
  width: 2rem;
  height: 2rem;
}
.org-chart .item-inner .item-depth-1 {
  flex: 1;
  width: 100%;
}
.org-chart .item-inner .item-depth-1 > li {
  display: grid;
  grid-template-columns: 51.63% 48.37%;
}
.org-chart .item-inner .item-depth-1 > li::after {
  width: var(--depth1-gap-half);
}
.org-chart .item-inner .item-depth-1 > li:nth-child(1)::after {
  width: var(--depth1-gap);
}
.org-chart .item-inner .item-depth-1 > li:not(.no-line) > p a::before {
  content: "";
  position: absolute;
  top: 2.5rem;
  transform: translateY(-50%);
  width: var(--org-bullet-size);
  height: var(--org-bullet-size);
  background: #fff;
  border: 0.2rem solid var(--kids-color-light-alpha-white100);
  border-radius: 100%;
}
.org-chart .item-inner .item-depth-1 > li:has(> .item-depth-2) > p a::after {
  content: "";
  position: absolute;
  top: 2.5rem;
  transform: translateY(-50%);
  width: var(--org-bullet-size);
  height: var(--org-bullet-size);
  background: #fff;
  border: 0.2rem solid var(--kids-color-light-alpha-white100);
  border-radius: 100%;
}
.org-chart .item-inner .item-depth-1 p {
  width: 100%;
}
.org-chart .item-inner .item-depth-2 {
  position: relative;
}
.org-chart .item-inner .item-depth-2 li:nth-child(1)::after {
  width: var(--depth2-gap);
}
.org-chart .item-inner .item-depth-2 li:not(:nth-child(1))::after {
  width: var(--depth2-gap-half);
}
.org-chart .item-inner:nth-child(odd) .item-depth-1:has(> li:nth-child(2))::after {
  right: var(--depth1-gap-half);
}
.org-chart .item-inner:nth-child(odd) .item-depth-1 > li {
  padding-right: var(--depth1-gap);
  direction: rtl;
}
.org-chart .item-inner:nth-child(odd) .item-depth-1 > li > * {
  direction: ltr;
}
.org-chart .item-inner:nth-child(odd) .item-depth-1 > li::after {
  right: 0;
}
.org-chart .item-inner:nth-child(odd) .item-depth-1 > li:not(:nth-child(1))::after {
  right: var(--depth1-gap-half);
}
.org-chart .item-inner:nth-child(odd) .item-depth-1 > li:not(.no-line) a::before {
  right: calc(var(--org-bullet-size) * -0.5);
}
.org-chart .item-inner:nth-child(odd) .item-depth-1 > li:has(> .item-depth-2) > p a::after {
  left: calc(var(--org-bullet-size) * -0.5);
}
.org-chart .item-inner:nth-child(odd) .item-depth-2 {
  left: 0;
}
.org-chart .item-inner:nth-child(odd) .item-depth-2 li {
  padding-right: var(--depth2-gap);
}
.org-chart .item-inner:nth-child(odd) .item-depth-2 li:nth-child(1)::after {
  right: 0;
}
.org-chart .item-inner:nth-child(odd) .item-depth-2 li:not(:nth-child(1))::after {
  right: var(--depth2-gap-half);
}
.org-chart .item-inner:nth-child(odd) .item-depth-2:has(> li:nth-child(2))::after {
  right: var(--depth2-gap-half);
}
.org-chart .item-inner:nth-child(even) .item-depth-1:has(> li:nth-child(2))::after {
  left: var(--depth1-gap-half);
}
.org-chart .item-inner:nth-child(even) .item-depth-1 > li {
  padding-left: var(--depth1-gap);
  direction: ltr;
}
.org-chart .item-inner:nth-child(even) .item-depth-1 > li > * {
  direction: ltr;
}
.org-chart .item-inner:nth-child(even) .item-depth-1 > li::after {
  left: 0;
}
.org-chart .item-inner:nth-child(even) .item-depth-1 > li:not(:nth-child(1))::after {
  left: var(--depth1-gap-half);
}
.org-chart .item-inner:nth-child(even) .item-depth-1 > li:not(.no-line) a::before {
  left: calc(var(--org-bullet-size) * -0.5);
}
.org-chart .item-inner:nth-child(even) .item-depth-1 > li:has(> .item-depth-2) > p a::after {
  right: calc(var(--org-bullet-size) * -0.5);
}
.org-chart .item-inner:nth-child(even) .item-depth-2 {
  right: 0;
}
.org-chart .item-inner:nth-child(even) .item-depth-2 li {
  padding-left: var(--depth2-gap);
}
.org-chart .item-inner:nth-child(even) .item-depth-2 li:nth-child(1)::after {
  left: 0;
}
.org-chart .item-inner:nth-child(even) .item-depth-2 li:not(:nth-child(1))::after {
  left: var(--depth2-gap-half);
}
.org-chart .item-inner:nth-child(even) .item-depth-2:has(> li:nth-child(2))::after {
  left: var(--depth2-gap-half);
}
.org-chart .org-item.type01 .item-title a {
  background: #0078bd;
}
.org-chart .org-item.type01 .item-inner:not(.line) .item-depth-1 a {
  background: var(--kids-color-point-blue-50);
  border: 1px solid var(--kids-color-point-blue-50);
  color: var(--kids-color-light-alpha-white100);
}
.org-chart .org-item.type01 .item-inner:not(.line) .item-depth-1 a .svg-icon {
  filter: brightness(0) invert(1);
}
.org-chart .org-item.type01 .item-inner:not(.line) .item-depth-1:not(.no-line) a::before {
  background: var(--kids-color-point-blue-50);
}
.org-chart .org-item.type01 .item-inner:not(.line) .item-depth-1 li:has(> .item-depth-2) > p a::after {
  background: var(--kids-color-point-blue-50);
}
.org-chart .org-item.type01 .item-inner:not(.line) .item-depth-2 a {
  background: var(--kids-color-light-alpha-white100);
  border: 1px solid #2781b4;
  color: #2781b4;
}
.org-chart .org-item.type01 .item-inner:not(.line) .item-depth-2 a .svg-icon {
  filter: invert(47%) sepia(49%) saturate(711%) hue-rotate(158deg) brightness(85%) contrast(91%);
}
.org-chart .org-item.type01 .item-inner.line .item-depth-1 a {
  background: var(--kids-color-light-alpha-white100);
  border: 1px solid #2781b4;
  color: #2781b4;
}
.org-chart .org-item.type01 .item-inner.line .item-depth-1 a .svg-icon {
  filter: invert(47%) sepia(49%) saturate(711%) hue-rotate(158deg) brightness(85%) contrast(91%);
}
.org-chart .org-item.type01 .item-inner.line .item-depth-1:not(.no-line) a::before,
.org-chart .org-item.type01 .item-inner.line .item-depth-1 li:has(> .item-depth-2) > p a::after {
  background: #2781b4;
}
.org-chart .org-item.type02 .item-title a {
  background: #2b9750;
}
.org-chart .org-item.type02 .item-inner:not(.gray, .line) .item-depth-1 a {
  background: #36bf65;
  border: 1px solid #36bf65;
  color: var(--kids-color-light-alpha-white100);
}
.org-chart .org-item.type02 .item-inner:not(.gray, .line) .item-depth-1 a .svg-icon {
  filter: brightness(0) invert(1);
}
.org-chart .org-item.type02 .item-inner:not(.gray, .line) .item-depth-1:not(.no-line) a::before,
.org-chart .org-item.type02 .item-inner:not(.gray, .line) .item-depth-1 li:has(> .item-depth-2) > p a::after {
  background: #59d082;
}
.org-chart .org-item.type02 .item-inner.line:not(.gray) .item-depth-1 a {
  background: #fff;
  border: 1px solid #36bf65;
  color: #36bf65;
}
.org-chart .org-item.type02 .item-inner.line:not(.gray) .item-depth-1 a .svg-icon {
  filter: invert(69%) sepia(26%) saturate(1197%) hue-rotate(87deg) brightness(88%) contrast(79%);
}
.org-chart .org-item.type02 .item-inner.line:not(.gray) .item-depth-1:not(.no-line) a::before {
  background: #36bf65;
}
.org-chart .org-item.type02 .item-inner.line:not(.gray) .item-depth-1 li:has(> .item-depth-2) > p a::after {
  background: #36bf65;
}
.org-chart .org-item.type02 .item-inner.gray .item-depth-1 a {
  background: #8a949e;
  border: 1px solid #8a949e;
  color: var(--kids-color-light-alpha-white100);
}
.org-chart .org-item.type02 .item-inner.gray .item-depth-1 a .svg-icon {
  filter: brightness(0) invert(1);
}
.org-chart .org-item.type02 .item-inner.gray .item-depth-1:not(.no-line) a::before {
  background: #8a949e;
}
.org-chart .org-item.type02 .item-inner.gray .item-depth-1 li:has(.item-depth-2) > p a::after {
  background: #8a949e;
}
.org-chart .org-item.type02 .item-inner.gray .item-depth-2 a {
  background: var(--kids-color-light-alpha-white100);
  border: 1px solid #6d7882;
  color: #6d7882;
}
.org-chart .org-item.type02 .item-inner.gray .item-depth-2 a .svg-icon {
  filter: invert(50%) sepia(8%) saturate(572%) hue-rotate(167deg) brightness(90%) contrast(87%);
}
.org-chart .org-item.type02 .item-inner.gray.line .item-depth-1 a {
  background: var(--kids-color-light-alpha-white100);
  border: 1px solid #6d7882;
  color: #6d7882;
}
.org-chart .org-item.type02 .item-inner.gray.line .item-depth-1 a .svg-icon {
  filter: invert(50%) sepia(8%) saturate(572%) hue-rotate(167deg) brightness(90%) contrast(87%);
}

.gov-symbol-wrap {
  width: 100%;
  background-color: var(--kids-light-color-surface-secondary-subtler);
}
.gov-symbol-wrap .inner {
  position: relative;
}
.gov-symbol-wrap .inner::before, .gov-symbol-wrap .inner::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
}
.gov-symbol-wrap .inner::before {
  right: 2.5rem;
  bottom: 44.8rem;
  width: 28.7rem;
  height: 28.7rem;
  background-image: url("https://static.gov.kr/content/child/content/images/sub/gov-symbol-bg.png");
}
.gov-symbol-wrap .inner::after {
  right: 10.2rem;
  bottom: 12.5rem;
  width: 35.9rem;
  height: 37.4rem;
  background-image: url("https://static.gov.kr/content/child/content/images/sub/gov-symbol-mascot.png");
}

.symbol-list {
  display: grid;
  align-items: start;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--kids-gap-5);
  padding: 14rem 10.2rem 0;
}
.symbol-list > li {
  position: relative;
  z-index: 1;
  max-width: 44.6rem;
  padding: 5.5rem 4.5rem 4.5rem;
  margin-bottom: 6rem;
  border-radius: var(--kids-number-12);
  background-color: var(--kids-color-light-gray-0);
}
.symbol-list > li .cont {
  position: relative;
  z-index: 4;
}
.symbol-list > li .desc {
  font-size: var(--kids-font-size-body-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  word-break: keep-all;
}
.symbol-list > li .desc + .desc {
  margin-top: var(--kids-number-7);
}
.symbol-list > li .gov-badge {
  margin-top: var(--kids-number-12);
}
.symbol-list > li h4 {
  font-size: var(--kids-font-size-heading-xxlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 700;
}
.symbol-list > li .btn-wrap {
  margin-top: var(--kids-number-9);
  gap: var(--kids-gap-3);
}
.symbol-list > li .symbol-thumb {
  margin-top: var(--kids-number-11);
}
.symbol-list > li .icon-shape {
  position: absolute;
  transform-origin: center;
  transition: 0.2s ease-in-out;
  z-index: -1;
  overflow: visible;
  opacity: 0;
  transform: translateY(-50%);
}
.symbol-list > li .icon-shape.yellow {
  right: -6.5rem;
  top: -6.1rem;
}
.symbol-list > li .icon-shape.purple {
  right: -10.1rem;
  top: 22.3rem;
}
.symbol-list > li .icon-shape.green {
  left: -10.6rem;
  top: 4.2rem;
}
.symbol-list > li .icon-shape.pink {
  right: -9rem;
  top: 15.8rem;
}
.symbol-list > li .icon-shape.blue {
  right: -10rem;
  top: 18.3rem;
}
.symbol-list > li .icon-shape.active {
  transform: translateY(0);
  opacity: 1;
  animation: float 2s ease-in-out infinite;
  animation-delay: 0.4s;
}
.symbol-list > li .icon-shape svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.symbol-list > li .icon-shape::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.4s ease;
  background: rgba(255, 255, 255, 0.15);
}
.symbol-list > li:nth-child(odd) {
  justify-self: start;
}
.symbol-list > li:nth-child(even) {
  justify-self: end;
}
.symbol-list > li:nth-child(2), .symbol-list > li:nth-child(4) {
  top: 13.9rem;
}
.symbol-list > li:last-child {
  margin-bottom: 0;
}
.symbol-list > li::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  opacity: 1;
  pointer-events: none;
  transition: opacity 0.4s ease;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(15px);
  border-radius: inherit;
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .sub-visual-group .group-cont {
    padding: 9rem 2.4rem 3.8rem;
  }
  .sub-visual-group .group-cont .sub-cont {
    padding: 0;
  }
}
@media (max-width: 1023px) {
  .sub-visual-group {
    padding: 1.6rem 0;
  }
  .sub-visual-group .group-title {
    margin: 0;
    border-radius: 3.2rem 3.2rem 0 0;
    padding: var(--kids-number-10) var(--kids-number-12);
  }
  .sub-visual-group .group-title::after {
    bottom: -1.92rem;
    right: 7.68rem;
    width: 0;
    height: 0;
    border-right-width: 14.4px;
    border-left-width: 14.4px;
    border-top-width: 19.2px;
    border-color: transparent;
    border-style: solid;
  }
  .sub-visual-group .group-title .for-mobile {
    display: block;
  }
  .sub-visual-group .group-cont {
    min-height: auto;
    padding: 9rem 2.4rem 3.8rem;
    border-radius: 0 0 3.2rem 3.2rem;
  }
  .sub-visual-group .group-cont .sub-cont {
    padding: 0;
  }
  .sub-visual-group .group-cont .sub-cont .desc br {
    display: none;
  }
  .sub-visual-group .group-cont .sub-cont .desc .for-mobile {
    display: block;
  }
  .sub-visual-group .group-cont::after {
    bottom: unset;
    top: 2.88rem;
    right: 1.8rem;
    width: 18.24rem;
    height: 12.36rem;
  }
  .sub-visual-group.item-01 .group-title::after {
    border-top-color: var(--kids-color-point-blue-50);
    background: none;
  }
  .sub-visual-group.item-02 .group-title::after {
    border-top-color: #ffad00;
    background: none;
  }
  .sub-visual-group.item-03 .group-title::after {
    border-top-color: #ff828a;
    background: none;
  }
  .all-team-list {
    grid-template-columns: repeat(2, 1fr);
  }
  .kids-gov-wrap {
    padding-top: 4rem;
  }
  .kids-gov-wrap:last-of-type {
    padding-bottom: 5rem;
  }
  .org-chart {
    --depth1-gap: 14.7%;
  }
  .symbol-list {
    padding: 14rem 8.16rem 0;
  }
}
@media (max-width: 767px) {
  .sub-visual-group .group-title::after {
    bottom: -1.6rem;
    right: 6.4rem;
    border-right-width: 12px;
    border-left-width: 12px;
    border-top-width: 16px;
  }
  .sub-visual-group .group-cont::after {
    top: 2.4rem;
    right: 1.5rem;
    width: 15.2rem;
    height: 10.3rem;
  }
  .gov-badge {
    height: 2.7rem;
    border-radius: 2.7rem;
  }
  .leader-team-wrap {
    padding: var(--kids-number-14) 0;
  }
  .leader-team-list {
    grid-template-columns: repeat(1, 1fr);
    gap: var(--kids-gap-5);
  }
  .leader-team-list > li {
    width: 100%;
    border-radius: var(--kids-number-10);
    padding: 5rem 4rem 4rem;
  }
  .leader-team-list > li .team-role {
    margin-top: var(--kids-number-8);
  }
  .leader-team-list > li .team-thumb {
    margin-top: var(--kids-number-12);
  }
  .leader-team-list > li .team-img {
    margin-top: 3.2rem;
  }
  .all-team-list {
    grid-template-columns: repeat(1, 1fr);
    gap: var(--kids-gap-6);
  }
  .all-team-list > .card {
    border-radius: var(--kids-number-9);
    transition: background-color 0.4s ease-in-out;
  }
  .all-team-list > .card:hover {
    background-color: var(--kids-light-color-surface-secondary-subtler);
    color: var(--kids-light-color-text-basic);
  }
  .all-team-list > .card:hover > a::before, .all-team-list > .card:hover > a::after {
    opacity: 1;
  }
  .all-team-list > .card:hover > a .title {
    color: var(--kids-light-color-text-basic);
  }
  .all-team-list > .card:hover > a .ico-arw-more {
    opacity: 1;
  }
  .all-team-list > .card.active {
    background-color: var(--kids-color-point-blue-50);
    color: var(--kids-color-light-gray-0);
  }
  .all-team-list > .card.active:hover .ico-arw-more {
    opacity: 1;
  }
  .all-team-list > .card.active > a::before, .all-team-list > .card.active > a::after {
    opacity: 0;
  }
  .all-team-list > .card.active > a .title {
    color: var(--kids-color-light-gray-0);
  }
  .all-team-list > .card.active > a .desc {
    margin-top: var(--kids-number-3);
    opacity: 1;
  }
  .all-team-list > .card.active > a .ico-arw-more {
    opacity: 1;
  }
  .all-team-list > .card > a {
    padding: var(--kids-number-9) var(--kids-number-12);
  }
  .all-team-list > .card > a::before, .all-team-list > .card > a::after {
    display: none;
  }
  .all-team-list .desc {
    color: var(--kids-light-color-text-basic);
    opacity: 1;
    margin-top: var(--kids-number-3);
  }
  .all-team-list .ico-arw-more {
    opacity: 1;
    top: 2rem;
    right: 2rem;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url("https://static.gov.kr/content/child/content/images/common/ico/ico-arw-more-active.svg");
    background-color: transparent;
  }
  .org-chart {
    --org-chart-gap: 6rem;
    --item-gap: 0.8rem;
    --depth1-gap: 14.7%;
    --depth2-gap: 0.8rem;
    --org-bullet-size: 1rem;
    --item-height-half: calc(var(--item-height) * 0.5);
    width: auto;
  }
  .org-chart .item-title > a {
    min-width: 20.9rem;
    padding: 1.2rem 2.4rem;
  }
  .org-chart .item-title > a strong {
    flex: 1 0 calc(100% - 3rem);
  }
  .org-chart .item-title > a .svg-icon {
    width: 2rem;
    height: 2rem;
  }
  .org-chart .item-inner [class*=item-depth-] li a {
    gap: 0 0.4rem;
    width: 100%;
    max-width: 100%;
    padding: 1rem 1.6rem;
    font-size: var(--kids-font-size-body-xxsmall-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
  }
  .org-chart .item-inner [class*=item-depth-] li a .svg-icon {
    flex: 1 0 1.6rem;
    width: 1.6rem;
    height: 1.6rem;
  }
  .org-chart .item-inner .item-depth-1 {
    width: 100%;
  }
  .org-chart .item-inner .item-depth-1:has(> li:nth-child(2)):not(:has(> li.no-line))::after {
    top: calc(var(--first-item-height) * 0.5);
  }
  .org-chart .item-inner .item-depth-1 > li {
    grid-template-columns: unset;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: column;
    gap: var(--depth2-gap);
  }
  .org-chart .item-inner .item-depth-2 {
    width: 100%;
  }
  .org-chart .item-inner .item-depth-2:has(> li:nth-child(2)):not(:has(> li.no-line))::after {
    content: none;
  }
  .org-chart .item-inner .item-depth-2 li {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: column;
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-1 li::after, .org-chart .item-inner:nth-child(odd) .item-depth-1 li:not(:nth-child(1))::after, .org-chart .item-inner:nth-child(even) .item-depth-1 li::after, .org-chart .item-inner:nth-child(even) .item-depth-1 li:not(:nth-child(1))::after {
    top: calc(var(--item-height) * 0.5);
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-1 > li:not(.no-line) a::before, .org-chart .item-inner:nth-child(even) .item-depth-1 > li:not(.no-line) a::before {
    top: 50%;
    right: calc(var(--org-bullet-size) * -0.5);
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-1 > li:has(> .item-depth-2) > p a::after, .org-chart .item-inner:nth-child(even) .item-depth-1 > li:has(> .item-depth-2) > p a::after {
    left: 50%;
    top: unset;
    bottom: -0.6rem;
    transform: translateX(-50%);
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-2, .org-chart .item-inner:nth-child(even) .item-depth-2 {
    gap: var(--depth2-gap);
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-2 li, .org-chart .item-inner:nth-child(even) .item-depth-2 li {
    padding: 0;
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-2 li:nth-child(1)::after, .org-chart .item-inner:nth-child(odd) .item-depth-2 li:not(:nth-child(1))::after, .org-chart .item-inner:nth-child(even) .item-depth-2 li:nth-child(1)::after, .org-chart .item-inner:nth-child(even) .item-depth-2 li:not(:nth-child(1))::after {
    content: "";
    position: absolute;
    background: #cdd1d5;
    z-index: 1;
    width: 0.2rem;
    margin-left: -0.1rem;
    top: calc(var(--depth2-gap) * -1);
    left: 50%;
    right: auto;
    height: calc(var(--depth2-gap) + 2px);
  }
  .org-chart .item-inner:nth-child(odd) .item-depth-2:has(> li:nth-child(2))::after, .org-chart .item-inner:nth-child(even) .item-depth-2:has(> li:nth-child(2))::after {
    content: none;
  }
  .gov-symbol-wrap .inner::before {
    right: 2.9rem;
    bottom: 18rem;
    width: 16rem;
    height: 16rem;
  }
  .gov-symbol-wrap .inner::after {
    right: 6.8rem;
    bottom: 0;
    width: 20rem;
    height: 20.9rem;
  }
  .symbol-list {
    grid-template-columns: repeat(1, 1fr);
    padding: 11rem 0 30rem;
  }
  .symbol-list > li {
    position: relative;
    z-index: 1;
    max-width: 100%;
    padding: 4rem 3.2rem 3.2rem;
    margin-bottom: 1.6rem;
  }
  .symbol-list > li .desc br {
    display: none;
  }
  .symbol-list > li .desc + .desc {
    margin-top: var(--kids-number-5);
  }
  .symbol-list > li .gov-badge {
    margin-top: var(--kids-number-10);
  }
  .symbol-list > li .btn-wrap {
    margin-top: var(--kids-number-8);
  }
  .symbol-list > li .symbol-thumb {
    margin-top: 1.9rem;
  }
  .symbol-list > li .icon-shape {
    opacity: 1;
    transform: none;
  }
  .symbol-list > li .icon-shape.yellow {
    width: 10.9rem;
    right: -4.8rem;
    top: -4.5rem;
  }
  .symbol-list > li .icon-shape.purple {
    width: 15.7rem;
    right: -7.4rem;
    top: 22.4rem;
  }
  .symbol-list > li .icon-shape.green {
    width: 15.6rem;
    left: -7.7rem;
    top: 3.1rem;
  }
  .symbol-list > li .icon-shape.pink {
    width: 15.8rem;
    left: inherit;
    right: -6.6rem;
    top: 17.4rem;
  }
  .symbol-list > li .icon-shape.blue {
    width: 16rem;
    right: -8.4rem;
    top: 16.5rem;
  }
  .symbol-list > li .icon-shape.active {
    animation: none;
  }
  .symbol-list > li:nth-child(odd) {
    justify-self: center;
  }
  .symbol-list > li:nth-child(even) {
    justify-self: center;
  }
  .symbol-list > li:nth-child(2), .symbol-list > li:nth-child(4) {
    top: 0;
  }
}
.visual-cards-wrap {
  position: relative;
  width: 100%;
}
.visual-cards-wrap .inner {
  text-align: center;
}
.visual-cards-wrap[data-page=kids] {
  background-color: #D1EDFA;
}
.visual-cards-wrap[data-page=kids]::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 7.2rem;
  width: 100%;
  height: 71rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-kids-visual-bg-top.png") no-repeat top center/cover;
}
.visual-cards-wrap[data-page=kids]::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7.2rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-kids-visual-bg-btm.png") repeat-x top center/auto 100%;
}
.visual-cards-wrap[data-page=kids] .more {
  width: 3.6rem;
  height: 3.6rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 6.6rem;
  z-index: 1;
  border-radius: var(--kids-radius-max);
  background: url("https://static.gov.kr/content/child/content/images/common/ico/icon-arrow-down-kids.svg") no-repeat 50%/cover;
}
.visual-cards-wrap[data-page=kids] {
  margin-bottom: 10.4rem;
  padding-bottom: 15.4rem;
}
.visual-cards-wrap[data-page=safety] {
  background-color: #DEE0FF;
}
.visual-cards-wrap[data-page=safety]::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 7.2rem;
  width: 100%;
  height: 71rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-safety-visual-bg-top.png") no-repeat top center/cover;
}
.visual-cards-wrap[data-page=safety]::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7.2rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-safety-visual-bg-btm.png") repeat-x top center/auto 100%;
}
.visual-cards-wrap[data-page=safety] .more {
  width: 3.6rem;
  height: 3.6rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 6.6rem;
  z-index: 1;
  border-radius: var(--kids-radius-max);
  background: url("https://static.gov.kr/content/child/content/images/common/ico/icon-arrow-down-safety.svg") no-repeat 50%/cover;
}
.visual-cards-wrap[data-page=learning] {
  background-color: #CEEDD9;
}
.visual-cards-wrap[data-page=learning]::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 7.2rem;
  width: 100%;
  height: 71rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-learning-visual-bg-top.png") no-repeat top center/cover;
}
.visual-cards-wrap[data-page=learning]::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7.2rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-learning-visual-bg-btm.png") repeat-x top center/auto 100%;
}
.visual-cards-wrap[data-page=learning] .more {
  width: 3.6rem;
  height: 3.6rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 6.6rem;
  z-index: 1;
  border-radius: var(--kids-radius-max);
  background: url("https://static.gov.kr/content/child/content/images/common/ico/icon-arrow-down-learning.svg") no-repeat 50%/cover;
}
.visual-cards-wrap[data-page=helper] {
  background-color: #FDE9BF;
}
.visual-cards-wrap[data-page=helper]::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 7.2rem;
  width: 100%;
  height: 71rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-helper-visual-bg-top.png") no-repeat top center/cover;
}
.visual-cards-wrap[data-page=helper]::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 7.2rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-helper-visual-bg-btm.png") repeat-x top center/auto 100%;
}
.visual-cards-wrap[data-page=helper] .more {
  width: 3.6rem;
  height: 3.6rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 6.6rem;
  z-index: 1;
  border-radius: var(--kids-radius-max);
  background: url("https://static.gov.kr/content/child/content/images/common/ico/icon-arrow-down-helper.svg") no-repeat 50%/cover;
}
.visual-cards-wrap:first-of-type {
  padding-top: 8rem;
  padding-bottom: 15.4rem;
}

.visual-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--kids-gap-7);
  text-align: left;
}
.visual-cards-box {
  position: relative;
  z-index: 1;
  margin-top: 1.5rem;
  padding: var(--kids-number-19);
  padding-right: 4.7rem;
  height: 63.6rem;
  border-radius: 5rem;
  transition: 0.2s ease-in-out;
}
.visual-cards-box .qa-badge {
  position: absolute;
  top: -1.6rem;
  font-size: 5rem;
  font-weight: 700;
  text-align: center;
  border-radius: var(--kids-radius-max);
  background-color: var(--kids-color-light-gray-0);
  width: 8.8rem;
  height: 8.8rem;
}
.visual-cards-box .card-quote {
  font-size: var(--kids-font-size-display-small);
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: var(--kids-typo-letter-spacing--1);
  position: relative;
  font-family: "Cafe24Ohsquare";
  word-break: keep-all;
}
.visual-cards-box .card-quote .quote-left {
  width: var(--kids-number-9);
  height: var(--kids-number-9);
  display: inline-flex;
  color: inherit;
  position: absolute;
  left: -2.9rem;
  top: -0.5rem;
}
.visual-cards-box .card-quote .quote-right {
  width: var(--kids-number-9);
  height: var(--kids-number-9);
  display: inline-flex;
  color: inherit;
  margin-bottom: var(--kids-number-6);
}
.visual-cards-box p {
  font-size: var(--kids-font-size-body-large);
  line-height: 170%;
  letter-spacing: var(--kids-typo-letter-spacing--1);
  font-weight: 400;
  word-break: keep-all;
  margin-top: 2.4rem;
}
.visual-cards-box .img-mascot-01 {
  position: absolute;
  right: 7rem;
  bottom: 4rem;
  height: 22.5rem;
}
.visual-cards-box .img-mascot-02 {
  position: absolute;
  right: -12.7rem;
  bottom: -9.3rem;
  height: 36rem;
}

[data-page=kids] .visual-cards-box:nth-of-type(1) {
  color: var(--kids-color-high-contrast-gray-0);
  background-color: var(--kids-color-light-primary-55);
}
[data-page=kids] .visual-cards-box:nth-of-type(1) .qa-badge {
  left: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: var(--kids-color-light-primary-55);
  border: 0.6rem solid #59BDE2;
}
[data-page=kids] .visual-cards-box:nth-of-type(1) p .for-mobile {
  display: none;
}
[data-page=kids] .visual-cards-box:nth-of-type(2) {
  border: 0.4rem solid var(--kids-color-light-primary-55);
  background: var(--kids-color-high-contrast-gray-0);
}
[data-page=kids] .visual-cards-box:nth-of-type(2) .card-quote {
  color: var(--kids-color-light-primary-55);
}
[data-page=kids] .visual-cards-box:nth-of-type(2) .qa-badge {
  right: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: var(--kids-color-light-primary-55);
  border: 0.6rem solid #59BDE2;
}

[data-page=safety] .visual-cards-box:nth-of-type(1) {
  color: var(--kids-color-high-contrast-gray-0);
  background-color: var(--kids-color-point-purple-50);
}
[data-page=safety] .visual-cards-box:nth-of-type(1) .qa-badge {
  left: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: var(--kids-color-point-purple-50);
  border: 0.6rem solid #C486E9;
}
[data-page=safety] .visual-cards-box:nth-of-type(1) p .for-mobile {
  display: none;
}
[data-page=safety] .visual-cards-box:nth-of-type(2) {
  border: 0.4rem solid var(--kids-color-point-purple-50);
  background: var(--kids-color-high-contrast-gray-0);
}
[data-page=safety] .visual-cards-box:nth-of-type(2) .card-quote {
  color: var(--kids-color-point-purple-50);
}
[data-page=safety] .visual-cards-box:nth-of-type(2) .qa-badge {
  right: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: var(--kids-color-point-purple-50);
  border: 0.6rem solid #C486E9;
}

[data-page=learning] .visual-cards-box:nth-of-type(1) {
  color: var(--kids-color-high-contrast-gray-0);
  background-color: #3E9A5C;
}
[data-page=learning] .visual-cards-box:nth-of-type(1) .qa-badge {
  left: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: #3E9A5C;
  border: 0.6rem solid #33C272;
}
[data-page=learning] .visual-cards-box:nth-of-type(1) p .for-mobile {
  display: none;
}
[data-page=learning] .visual-cards-box:nth-of-type(2) {
  border: 0.4rem solid #3E9A5C;
  background: var(--kids-color-high-contrast-gray-0);
}
[data-page=learning] .visual-cards-box:nth-of-type(2) .card-quote {
  color: #3E9A5C;
}
[data-page=learning] .visual-cards-box:nth-of-type(2) .qa-badge {
  right: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: #3E9A5C;
  border: 0.6rem solid #33C272;
}

[data-page=helper] .visual-cards-box:nth-of-type(1) {
  color: var(--kids-color-high-contrast-gray-0);
  background-color: #F18736;
}
[data-page=helper] .visual-cards-box:nth-of-type(1) .qa-badge {
  left: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: #F18736;
  border: 0.6rem solid #FFAD00;
}
[data-page=helper] .visual-cards-box:nth-of-type(1) p .for-mobile {
  display: none;
}
[data-page=helper] .visual-cards-box:nth-of-type(2) {
  border: 0.4rem solid #F18736;
  background: var(--kids-color-high-contrast-gray-0);
}
[data-page=helper] .visual-cards-box:nth-of-type(2) .card-quote {
  color: #F18736;
}
[data-page=helper] .visual-cards-box:nth-of-type(2) .qa-badge {
  right: -1.8rem;
  width: 8.8rem;
  height: 8.8rem;
  color: #F18736;
  border: 0.6rem solid #FFAD00;
}

.guide-text {
  position: relative;
  margin-top: 6rem;
  text-align: center;
}
.guide-text p {
  font-size: var(--kids-font-size-body-xlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
}
.guide-text p em {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}

.img-bnr-wrap .img-bnr {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--kids-gap-7);
  padding-bottom: 0.4rem;
}
.img-bnr-wrap .img-bnr .img-box {
  overflow: hidden;
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-color-high-contrast-gray-30);
  border-radius: var(--kids-radius-xlarge1);
}
.img-bnr-wrap .img-bnr .img-box .bnr-cont {
  padding: 3.2rem;
}
.img-bnr-wrap .img-bnr .img-box .bnr-cont p.tit {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.img-bnr-wrap .img-bnr .img-box .bnr-cont p.desc {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  word-break: break-all;
  margin-top: var(--kids-padding-6);
  color: var(--kids-light-color-text-subtle);
}
.img-bnr-wrap .img-bnr .img-box .bnr-cont .btn-detail {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row;
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  margin-top: var(--kids-padding-8);
  padding: 0.3rem 0;
}
.img-bnr-wrap .img-bnr .img-box .bnr-cont .btn-detail .ico-detail-arw {
  width: var(--kids-size-height-3);
  height: var(--kids-size-height-3);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-detail-arw.svg);
  background-color: transparent;
  display: inline-flex;
  margin-left: 0.4rem;
}

.download-bnr-wrap .download-bnr-inner {
  padding: 3.2rem;
  border-radius: var(--kids-radius-xlarge1);
  background-color: var(--kids-color-light-secondary-5);
}
.download-bnr-wrap .download-bnr-inner .swiper-wrapper {
  gap: var(--kids-gap-7);
}
.download-bnr-wrap .download-bnr-inner .download-box {
  flex: 1 1 0px;
  min-width: 0;
  display: flex;
  gap: var(--kids-gap-4);
}
.download-bnr-wrap .download-bnr-inner .download-box .bnr-thumb img {
  width: 100%;
}
.download-bnr-wrap .download-bnr-inner .download-box .bnr-cont {
  flex: 1 1 0px;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
}
.download-bnr-wrap .download-bnr-inner .download-box .bnr-cont .tit {
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  word-break: break-all;
}
.download-bnr-wrap .download-bnr-inner .download-box .bnr-cont p {
  font-size: var(--kids-font-size-body-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
  margin-top: var(--kids-padding-2);
  word-break: break-all;
}
.download-bnr-wrap .download-bnr-inner .download-box .bnr-cont .btn-download {
  margin-top: var(--kids-number-8);
  padding: 0.8rem 1.18rem;
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-color-high-contrast-gray-60);
  color: var(--kids-light-color-text-basic);
}
.download-bnr-wrap .swiper-button-next,
.download-bnr-wrap .swiper-button-prev,
.download-bnr-wrap ~ .swiper-button-next,
.download-bnr-wrap ~ .swiper-button-prev,
.download-bnr-wrap .swiper-indicator {
  display: none;
}

.link-list-wrap .link-list-box {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-number-14);
  padding: 3.2rem;
  border-radius: var(--kids-radius-xlarge1);
  background-color: var(--kids-color-light-secondary-5);
}
.link-list-wrap .link-list-box .tit-wrap {
  flex: 0 0 38.56%;
  color: var(--kids-color-high-contrast-gray-90);
}
.link-list-wrap .link-list-box .tit-wrap em {
  font-size: var(--kids-font-size-body-xsmall-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: block;
  margin-bottom: var(--kids-number-5);
}
.link-list-wrap .link-list-box .tit-wrap strong {
  font-size: var(--kids-font-size-heading-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: block;
  margin-bottom: 2rem;
}
.link-list-wrap .link-list-box .tit-wrap p {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
}
.link-list-wrap .link-list-box .link-list {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
  gap: var(--kids-number-5);
  width: 100%;
}
.link-list-wrap .link-list-box .link-list > li {
  width: 100%;
}
.link-list-wrap .link-list-box .link-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  position: relative;
  padding: 3.076rem 2.4rem;
  border-radius: 0.6rem;
  background-color: var(--kids-color-high-contrast-gray-0);
  transition: 0.2s ease-in-out;
}
.link-list-wrap .link-list-box .link-box:hover {
  box-shadow: 0 0 0 1.5px var(--kids-color-high-contrast-primary-60);
}
.link-list-wrap .link-list-box .link-box .link-cont {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  width: calc(100% - var(--kids-number-13));
  margin-right: var(--kids-number-8);
}
.link-list-wrap .link-list-box .link-box .link-tit {
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.link-list-wrap .link-list-box .link-box .link-desc {
  font-size: var(--kids-font-size-body-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  padding-left: 1rem;
  text-align: right;
  color: var(--kids-light-color-text-subtle);
}
.link-list-wrap .link-list-box .link-box .ico-link {
  width: var(--kids-size-height-3);
  height: var(--kids-size-height-3);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_go.svg);
  background-color: transparent;
  display: inline-flex;
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .visual-cards-box {
    padding: var(--kids-number-19);
    height: 80rem;
  }
  .visual-cards-box .img-mascot {
    max-height: 46%;
  }
  .visual-cards-box .img-mascot-02 {
    right: -2rem;
  }
  .visual-cards p br {
    display: none;
  }
  .visual-cards p br.for-mobile {
    display: block;
  }
  .img-bnr-wrap .img-bnr .img-box .bnr-cont p.desc br {
    display: none;
  }
  .link-list-wrap .link-list-box .tit-wrap {
    flex: 0 0 33%;
  }
  .link-list-wrap .link-list-box .tit-wrap p br {
    display: none;
  }
  .link-list-wrap .link-list-box .link-cont .link-tit {
    min-width: 22rem;
  }
  .download-bnr-wrap .download-bnr-inner .download-box .bnr-cont p.desc br {
    display: none;
  }
}
@media (max-width: 1023px) {
  .visual-cards {
    grid-template-columns: 1fr;
    gap: var(--kids-gap-8);
  }
  .visual-cards-box {
    margin-top: 0;
    padding: 5rem 4.5rem;
    border-radius: 3.2rem;
    height: auto;
  }
  .visual-cards-box .qa-badge {
    width: 6rem;
    height: 6rem;
    font-size: 3.2rem;
  }
  .visual-cards-box .card-quote .quote-left {
    width: var(--kids-number-8);
    height: var(--kids-number-8);
    display: inline-flex;
    color: inherit;
    left: -2rem;
    top: -0.2rem;
  }
  .visual-cards-box .card-quote .quote-right {
    width: var(--kids-number-8);
    height: var(--kids-number-8);
    display: inline-flex;
    color: inherit;
    margin-bottom: 0.3rem;
    margin-left: 0.2rem;
  }
  .visual-cards-box p {
    margin-top: var(--kids-number-7);
  }
  .visual-cards-box p br {
    display: none;
  }
  .visual-cards-box p br.for-mobile {
    display: block;
  }
  .visual-cards-box .img-mascot {
    max-height: 46%;
  }
  .visual-cards-box .img-mascot-02 {
    right: -2rem;
    bottom: -7.4rem;
  }
  .visual-cards-box:nth-of-type(1) {
    padding-bottom: 32rem;
  }
  .visual-cards-box:nth-of-type(2) {
    padding-bottom: 30rem;
  }
  [data-page=kids] .visual-cards-box:nth-of-type(1) .qa-badge {
    left: inherit;
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: var(--kids-color-light-primary-55);
    border: 0.4rem solid #59BDE2;
  }
  [data-page=kids] .visual-cards-box:nth-of-type(2) .qa-badge {
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: var(--kids-color-light-primary-55);
    border: 0.4rem solid #59BDE2;
  }
  [data-page=safety] .visual-cards-box:nth-of-type(1) .qa-badge {
    left: inherit;
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: var(--kids-color-point-purple-50);
    border: 0.4rem solid #C486E9;
  }
  [data-page=safety] .visual-cards-box:nth-of-type(2) .qa-badge {
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: var(--kids-color-point-purple-50);
    border: 0.4rem solid #C486E9;
  }
  [data-page=learning] .visual-cards-box:nth-of-type(1) .qa-badge {
    left: inherit;
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: #3E9A5C;
    border: 0.4rem solid #33C272;
  }
  [data-page=learning] .visual-cards-box:nth-of-type(2) .qa-badge {
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: #3E9A5C;
    border: 0.4rem solid #33C272;
  }
  [data-page=helper] .visual-cards-box:nth-of-type(1) .qa-badge {
    left: inherit;
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: #F18736;
    border: 0.4rem solid #FFAD00;
  }
  [data-page=helper] .visual-cards-box:nth-of-type(2) .qa-badge {
    right: -0.4rem;
    width: 6rem;
    height: 6rem;
    color: #F18736;
    border: 0.4rem solid #FFAD00;
  }
  .img-bnr-wrap .img-bnr {
    grid-template-columns: 1fr;
    gap: var(--kids-padding-6);
  }
  .img-bnr-wrap .img-bnr .img-box .bnr-cont {
    padding: var(--kids-padding-9) 2.7rem;
  }
  .img-bnr-wrap .img-bnr .img-box .bnr-cont p.desc {
    margin-top: 1.3rem;
    word-break: keep-all;
  }
  .img-bnr-wrap .img-bnr .img-box .bnr-cont p.desc br {
    display: none;
  }
  .img-bnr-wrap .img-bnr .img-box .bnr-cont .btn-detail {
    justify-content: flex-start;
  }
  .download-bnr-wrap .download-bnr-inner {
    position: relative;
    width: 100%;
    padding: 0;
    overflow: hidden;
    border-radius: var(--kids-radius-xlarge1);
    background-color: var(--kids-color-high-contrast-gray-0);
  }
  .download-bnr-wrap .download-bnr-inner .swiper-wrapper {
    gap: 0;
    display: flex;
    flex-wrap: nowrap;
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .download-bnr-wrap .download-bnr-inner .download-box {
    flex: none;
    width: 100%;
    min-width: 100%;
    flex-shrink: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .download-bnr-wrap .download-bnr-inner .download-box .bnr-thumb {
    width: 13rem;
  }
  .download-bnr-wrap .download-bnr-inner .download-box .bnr-cont {
    justify-content: center;
  }
  .download-bnr-wrap .download-bnr-inner .download-box .bnr-cont p.desc {
    margin-top: var(--kids-number-5);
    word-break: break-all;
    color: var(--kids-light-color-text-subtle);
  }
  .download-bnr-wrap .download-bnr-inner .download-box .bnr-cont p.desc br {
    display: none;
  }
  .download-bnr-wrap .download-bnr-inner .download-box .bnr-cont .btn-download {
    margin-top: var(--kids-number-5);
    background-color: var(--kids-color-light-gray-0);
  }
  .download-bnr-wrap .swiper-indicator {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
    position: static;
    margin-top: var(--kids-number-8);
  }
  .download-bnr-wrap .swiper-indicator .swiper-pagination {
    height: var(--kids-size-height-6);
  }
  .download-bnr-wrap .swiper-indicator .swiper-navigation {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: row;
    z-index: 1;
    width: 100%;
    height: 0.1rem;
    padding: 0 var(--kids-number-8);
  }
  .download-bnr-wrap .swiper-indicator .swiper-navigation [class^=btn] {
    width: var(--kids-size-height-6);
    height: var(--kids-size-height-6);
  }
  .download-bnr-wrap .swiper-button-next,
  .download-bnr-wrap .swiper-button-prev {
    width: var(--kids-size-height-6);
    height: var(--kids-size-height-6);
    display: inline-flex;
    margin-top: 0;
    background-size: auto 2.2rem;
  }
  .link-list-wrap .link-list-box {
    flex-direction: column;
    gap: var(--kids-gap-8);
  }
  .link-list-wrap .link-list-box .tit-wrap {
    flex: 1 1 0px;
    min-width: 0;
  }
  .link-list-wrap .link-list-box .tit-wrap em {
    margin-bottom: var(--kids-number-3);
  }
  .link-list-wrap .link-list-box .tit-wrap strong {
    margin-bottom: var(--kids-number-8);
  }
  .link-list-wrap .link-list-box .tit-wrap strong br {
    display: none;
  }
  .link-list-wrap .link-list-box .tit-wrap p br {
    display: none;
  }
  .link-list-wrap .link-list-box .link-list {
    flex: 1 1 0px;
    min-width: 0;
  }
  .link-list-wrap .link-list-box .link-box {
    padding: var(--kids-padding-5) var(--kids-padding-6);
  }
  .link-list-wrap .link-list-box .link-box:hover {
    box-shadow: none;
  }
  .link-list-wrap .link-list-box .link-box .link-desc {
    display: none;
  }
}
@media (max-width: 767px) {
  .visual-cards-wrap .visual-cards-box .card-quote br {
    display: none;
  }
  .visual-cards-wrap[data-page=kids] .more {
    width: var(--kids-number-8);
    height: var(--kids-number-8);
    bottom: 2.1rem;
  }
  .visual-cards-wrap[data-page=kids]::before {
    display: none;
  }
  .visual-cards-wrap[data-page=kids]::after {
    height: 2.1rem;
    background-size: auto 100%;
  }
  .visual-cards-wrap[data-page=kids] {
    margin-bottom: 8rem;
    padding-bottom: 6.9rem;
  }
  .visual-cards-wrap[data-page=safety] .more {
    width: var(--kids-number-8);
    height: var(--kids-number-8);
    bottom: 2.1rem;
  }
  .visual-cards-wrap[data-page=safety]::before {
    display: none;
  }
  .visual-cards-wrap[data-page=safety]::after {
    height: 2.1rem;
    background-size: auto 100%;
  }
  .visual-cards-wrap[data-page=learning] .more {
    width: var(--kids-number-8);
    height: var(--kids-number-8);
    bottom: 2.1rem;
  }
  .visual-cards-wrap[data-page=learning]::before {
    display: none;
  }
  .visual-cards-wrap[data-page=learning]::after {
    height: 2.1rem;
    background-size: auto 100%;
  }
  .visual-cards-wrap[data-page=helper] .more {
    width: var(--kids-number-8);
    height: var(--kids-number-8);
    bottom: 2.1rem;
  }
  .visual-cards-wrap[data-page=helper]::before {
    display: none;
  }
  .visual-cards-wrap[data-page=helper]::after {
    height: 2.1rem;
    background-size: auto 100%;
  }
  .visual-cards-wrap:first-of-type {
    padding-top: 4rem;
    padding-bottom: 6.9rem;
  }
  .visual-cards-box .img-mascot-01 {
    right: 4.5rem;
    bottom: 4rem;
    height: 16rem;
    max-height: 16rem;
  }
  .visual-cards-box .img-mascot-02 {
    right: -0.8rem;
    bottom: -4.5rem;
    height: 18rem;
    max-height: 18rem;
  }
  .visual-cards-box:nth-of-type(1) {
    padding-bottom: 23rem;
  }
  .visual-cards-box:nth-of-type(2) {
    padding-bottom: 18rem;
  }
  .guide-text {
    margin-top: 8rem;
  }
  .guide-text p br {
    display: none;
  }
  .guide-text p br.for-mobile {
    display: block;
  }
}
.list-cate-wrap {
  width: 100%;
  padding: 7rem 0;
  margin-bottom: 8rem;
  background-color: var(--kids-color-sub-bg);
}
.list-cate-wrap ul {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-7);
}
.list-cate-wrap ul > li {
  flex: 1;
}
.list-cate-wrap .btn-cate {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 18rem;
  border-radius: var(--kids-number-9);
  background-color: var(--kids-color-light-gray-0);
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-light-color-text-subtle);
  border: 0.2rem solid transparent;
  transition: 0.2s ease-in-out;
}
.list-cate-wrap .btn-cate .svg-icon {
  width: var(--kids-number-18);
  height: var(--kids-number-18);
  background-color: transparent;
  margin-bottom: var(--kids-number-9);
}
.list-cate-wrap .btn-cate:hover {
  border-color: var(--kids-color-light-primary-50);
}
.list-cate-wrap .active .btn-cate {
  color: var(--kids-color-light-gray-0);
  border-color: var(--kids-color-light-primary-50);
  background-color: var(--kids-color-light-primary-50);
}
.list-cate-wrap + .list-tab-wrap {
  margin-top: 0;
}

.consonant-grid-wrap {
  width: 100%;
  margin-top: var(--kids-number-20);
}

.consonant-grid {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray);
  border-radius: var(--kids-radius-xlarge1);
  padding: var(--kids-padding-6) var(--kids-padding-8);
}
.consonant-grid .grid-item {
  font-size: var(--kids-font-size-body-xxlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  flex: 1;
  height: 6rem;
  transition: 0.2s ease-in-out;
}
.consonant-grid .grid-item + .grid-item {
  border-left: var(--kids-light-border-width-variable-regular) dashed #D1D5DB;
}
.consonant-grid .grid-item.all {
  font-size: var(--kids-font-size-body-xxlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  min-width: 12.8rem;
  border-radius: var(--kids-radius-xlarge1) 0 0 var(--kids-radius-xlarge1);
}
.consonant-grid .grid-item:last-of-type {
  border-radius: 0 var(--kids-radius-xlarge1) var(--kids-radius-xlarge1) 0;
}
.consonant-grid .grid-item:hover {
  background-color: #F6F6F6;
  color: var(--kids-light-color-text-primary);
}
.consonant-grid .grid-item.active {
  background-color: var(--kids-color-light-primary-50);
  color: var(--kids-color-light-gray-0);
}

.word-list-wrap {
  margin-top: var(--kids-number-12);
}
.word-list-wrap .no-data {
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray-light);
}

.word-list {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: var(--kids-light-border-width-variable-regular) solid #172C56;
}
.word-list > li {
  padding: var(--kids-number-12) var(--kids-number-14);
  border-bottom: var(--kids-light-border-width-variable-regular) dashed var(--kids-light-color-border-gray-light);
  word-break: keep-all;
}
.word-list > li dt {
  font-size: var(--kids-font-size-heading-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-light-color-text-primary);
}
.word-list > li dd {
  font-size: var(--kids-font-size-body-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
  min-height: 6.6rem;
  margin-top: var(--kids-number-5);
}
.word-list > li:nth-of-type(2n-1) {
  border-right: 1px dashed var(--kids-light-color-border-gray-light);
}
.word-list::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: var(--kids-light-border-width-variable-regular);
  background-color: var(--kids-light-color-border-gray-light);
}

.youtube {
  position: relative;
  width: 100%;
  max-width: 64rem;
  aspect-ratio: 64/39;
  margin: 3rem auto;
}
.youtube iframe {
  width: 100%;
  height: 100%;
  max-height: 39rem;
}

@media (max-width: 767px) {
  .list-cate-wrap {
    padding: 4rem 0;
    margin-bottom: 4rem;
  }
  .list-cate-wrap ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.4rem;
  }
  .list-cate-wrap .btn-cate {
    height: 10rem;
    border-radius: var(--kids-number-7);
    font-size: var(--kids-font-size-body-small-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
  }
  .list-cate-wrap .btn-cate .svg-icon {
    width: var(--kids-number-13);
    height: var(--kids-number-13);
    margin-bottom: var(--kids-number-7);
  }
  .consonant-grid-wrap {
    margin-top: var(--kids-number-14);
  }
  .consonant-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
  .consonant-grid .grid-item.all {
    min-width: auto;
    grid-column: span 2;
  }
  .consonant-grid .grid-item:nth-of-type(4n) {
    border-left: 0;
  }
  .consonant-grid .grid-item:nth-of-type(n+4) {
    border-top: var(--kids-light-border-width-variable-regular) dashed #D1D5DB;
  }
  .word-list {
    grid-template-columns: repeat(1, 1fr);
  }
  .word-list > li {
    padding: var(--kids-number-9) var(--kids-number-6);
  }
  .word-list > li dd {
    min-height: 5.4rem;
    margin-top: var(--kids-number-7);
  }
  .word-list > li:nth-of-type(2n-1) {
    border-right: 0;
  }
}
.complete-wrap {
  text-align: center;
  margin: 10rem auto;
}
.complete-wrap .img-mascot {
  display: block;
  margin: 0 auto var(--kids-number-12);
}
.complete-wrap .desc strong {
  font-size: var(--kids-font-size-heading-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: block;
}
.complete-wrap .desc p {
  font-size: var(--kids-font-size-body-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
}
.complete-wrap .desc strong + p {
  margin-top: var(--kids-number-5);
}
.complete-wrap .page-btn-wrap {
  margin-top: var(--kids-number-12);
}

@media (max-width: 1023px) {
  .complete-wrap {
    margin: 4rem auto 5rem;
  }
  .complete-wrap .img-mascot {
    height: 7.9rem;
  }
}
.quiz-wrap .quiz {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-7);
}
.quiz-wrap .quiz .quiz-item {
  flex: 1;
}
.quiz-wrap .quiz figure {
  position: relative;
  border: none;
  cursor: pointer;
  padding: 6rem 0 4.8rem;
  border-radius: 5rem;
  text-align: center;
}
.quiz-wrap .quiz figure .visual {
  display: block;
  width: 100%;
  text-align: center;
  transition: 0.2s ease-in-out;
}
.quiz-wrap .quiz figure:hover .visual {
  transform: scale(1.1);
}
.quiz-wrap .quiz h4 {
  font-size: var(--kids-font-size-heading-xxlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 700;
  font-family: "Cafe24Ohsquare";
  color: var(--kids-color-light-gray-0);
  margin-bottom: 1.9rem;
}
.quiz-wrap .quiz h4 span {
  font-size: var(--kids-font-size-heading-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: inherit;
  display: block;
}
.quiz-wrap .quiz figcaption {
  border: none;
  width: 100%;
}
.quiz-wrap .quiz figcaption p {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-color-light-gray-0);
  margin-top: var(--kids-number-10);
}
.quiz-wrap .quiz figcaption a {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18rem;
  height: 6.8rem;
  border-radius: var(--kids-radius-xlarge1);
  background-color: var(--kids-color-light-gray-0);
  margin-top: var(--kids-number-10);
}
.quiz-wrap .quiz .safe {
  background-color: #FF743B;
}
.quiz-wrap .quiz .safe figcaption a {
  color: #FF743B;
  box-shadow: 0px 0.6rem 0px #D53E00;
}
.quiz-wrap .quiz .learn {
  background-color: #9B50D4;
}
.quiz-wrap .quiz .learn figcaption a {
  color: #9B50D4;
  box-shadow: 0px 0.6rem 0px #701AB2;
}
.quiz-wrap .quiz .supp {
  background-color: #FAD149;
}
.quiz-wrap .quiz .supp h4,
.quiz-wrap .quiz .supp figcaption p {
  color: var(--kids-color-light-gray-100);
}
.quiz-wrap .quiz .supp figcaption a {
  color: #E79805;
  box-shadow: 0px 0.6rem 0px #C99A00;
}

.quiz-detail-wrap .quiz {
  border-radius: var(--kids-number-12);
  overflow: hidden;
}
.quiz-detail-wrap .qhead {
  height: 22.9rem;
  padding: 6rem 8rem;
  color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .qhead h3 {
  font-size: var(--kids-font-size-heading-xxlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 700;
  font-family: "Cafe24Ohsquare";
  color: inherit;
}
.quiz-detail-wrap .qhead .desc {
  font-size: var(--kids-font-size-body-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: inherit;
  word-break: keep-all;
}
.quiz-detail-wrap .qbody {
  padding: 3.2rem 8rem;
  color: var(--kids-color-light-gray-0);
  overflow: hidden;
}
.quiz-detail-wrap .qbody h4 {
  font-size: var(--kids-font-size-body-xxlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: inherit;
  margin-bottom: var(--kids-number-9);
}
.quiz-detail-wrap .qbody h4 .ask {
  font-size: var(--kids-font-size-heading-xlarge);
  line-height: 1.35;
  letter-spacing: var(--kids-typo-letter-spacing--1);
  font-weight: 700;
  display: block;
  text-align: center;
  width: 17.4rem;
  border-radius: 6.2rem;
  padding: 0.671rem 0;
  margin-bottom: var(--kids-number-8);
  background-color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .qbody .col2 {
  float: left;
  position: relative;
  width: 47%;
  margin: 0;
  text-align: center;
  font-size: 0;
}
.quiz-detail-wrap .qbody figure > a {
  display: inline-block;
  width: 100%;
  height: 34.8rem;
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-x.png") no-repeat center;
  background-size: contain;
  transition: 0.2s ease-in-out;
}
.quiz-detail-wrap .qbody figure > a.bingo {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-o.png") no-repeat center;
  background-size: contain;
}
.quiz-detail-wrap .qbody figure > a.active {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-x-hover.png") no-repeat center;
  background-size: contain;
  transform: scale(1.1);
}
.quiz-detail-wrap .qbody figure > a.bingo.active {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-o-hover.png") no-repeat center;
  background-size: contain;
}
.quiz-detail-wrap .qbody.hover figure > a:hover, .quiz-detail-wrap .qbody.hover figure > a:focus {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-x-hover.png") no-repeat center;
  background-size: contain;
  transform: scale(1.1);
}
.quiz-detail-wrap .qbody.hover figure > a.bingo:hover, .quiz-detail-wrap .qbody.hover figure > a.bingo:focus {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-o-hover.png") no-repeat center;
  background-size: contain;
}
.quiz-detail-wrap .qfoot {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
  position: relative;
  width: 100%;
  min-height: 14.1rem;
  padding: 4.6rem 5rem 2.1rem;
}
.quiz-detail-wrap .qfoot:after {
  clear: both;
  content: "";
  display: block;
}
.quiz-detail-wrap .qfoot p {
  font-size: var(--kids-font-size-body-large-bold);
  line-height: 170%;
  letter-spacing: var(--kids-typo-letter-spacing--1);
  font-weight: 700;
  color: var(--kids-color-light-gray-0);
  display: none;
  overflow: hidden;
  width: calc(100% - 45rem);
}
.quiz-detail-wrap .qfoot p .point {
  color: #ffdf2c;
}
.quiz-detail-wrap .qfoot p.inblock {
  display: inline-block;
}
.quiz-detail-wrap .qfoot .btns {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-4);
  position: absolute;
  right: 5rem;
  top: 4.6rem;
}
.quiz-detail-wrap .qfoot .btns a {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18rem;
  height: 6.8rem;
  border-radius: var(--kids-radius-xlarge1);
  background-color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .qfoot::before {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  top: -0.1rem;
  height: 2.2rem;
  background-position: calc(50% - 26.27px);
  background-repeat: repeat-x;
  background-size: 54.545px 22px;
}
.quiz-detail-wrap .quiz.safe {
  background-color: #FF743B;
}
.quiz-detail-wrap .quiz.safe .qhead {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-safe-bg.png") no-repeat left top;
  background-size: cover;
}
.quiz-detail-wrap .quiz.safe .qbody h4 .ask {
  color: #FF743B;
}
.quiz-detail-wrap .quiz.safe .qfoot {
  background-color: #AB3809;
}
.quiz-detail-wrap .quiz.safe .qfoot .btns > a {
  color: #F6500C;
  box-shadow: 0px 0.6rem 0px #7A2401;
}
.quiz-detail-wrap .quiz.safe .qfoot .btns > a.next {
  background-color: var(--kids-color-high-contrast-primary-50);
  box-shadow: 0px 0.6rem 0px var(--kids-color-light-primary-80);
  color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .quiz.safe .qfoot::before {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-safe-pattern.png");
}
.quiz-detail-wrap .quiz.learn {
  background-color: #9B50D4;
}
.quiz-detail-wrap .quiz.learn .qhead {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-learn-bg.png") no-repeat left top;
  background-size: cover;
}
.quiz-detail-wrap .quiz.learn .qbody h4 .ask {
  color: #9B50D4;
}
.quiz-detail-wrap .quiz.learn .qfoot {
  background-color: #6F1FAD;
}
.quiz-detail-wrap .quiz.learn .qfoot .btns > a {
  color: #8F16EB;
  box-shadow: 0px 0.6rem 0px #4B0A7C;
}
.quiz-detail-wrap .quiz.learn .qfoot .btns > a.next {
  background-color: var(--kids-color-high-contrast-primary-50);
  box-shadow: 0px 0.6rem 0px var(--kids-color-light-primary-80);
  color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .quiz.learn .qfoot::before {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-learn-pattern.png");
}
.quiz-detail-wrap .quiz.supp {
  background-color: #FAD149;
}
.quiz-detail-wrap .quiz.supp .qhead {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-supp-bg.png") no-repeat left top;
  background-size: cover;
  color: var(--kids-color-light-gray-100);
}
.quiz-detail-wrap .quiz.supp .qbody h4 {
  color: var(--kids-color-light-gray-100);
}
.quiz-detail-wrap .quiz.supp .qbody h4 .ask {
  color: #E49C00;
}
.quiz-detail-wrap .quiz.supp .qfoot {
  background-color: #E49C00;
}
.quiz-detail-wrap .quiz.supp .qfoot p {
  color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .quiz.supp .qfoot p .point {
  color: var(--kids-color-light-gray-100);
}
.quiz-detail-wrap .quiz.supp .qfoot .btns > a {
  color: #CC8B00;
  box-shadow: 0px 0.6rem 0px #946601;
}
.quiz-detail-wrap .quiz.supp .qfoot .btns > a.next {
  background-color: var(--kids-color-high-contrast-primary-50);
  box-shadow: 0px 0.6rem 0px var(--kids-color-light-primary-80);
  color: var(--kids-color-light-gray-0);
}
.quiz-detail-wrap .quiz.supp .qfoot::before {
  background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-supp-pattern.png");
}

/* 수료증 */
.quiz-finish-wrap .page-title-wrap {
  padding-top: 3.7rem;
  padding-bottom: 5.9rem;
  margin: 0 auto;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.quiz-finish-wrap .page-title-wrap::before, .quiz-finish-wrap .page-title-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  height: 100%;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto;
  z-index: -1;
}
.quiz-finish-wrap .page-title-wrap::before {
  left: 50%;
  margin-left: -60rem;
  width: 43.3rem;
  background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-confetti-l.png");
  background-position: right center;
}
.quiz-finish-wrap .page-title-wrap::after {
  right: 50%;
  margin-right: -60rem;
  width: 40.6rem;
  background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-confetti-r.png");
  background-position: left center;
}
.quiz-finish-wrap .sec-tit {
  font-size: var(--kids-font-size-display-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 700;
  margin: 0;
}
.quiz-finish-wrap .sub-text {
  font-size: var(--kids-font-size-body-xxlarge);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  margin-top: var(--kids-number-7);
}
.quiz-finish-wrap .sub-text em {
  font-size: var(--kids-font-size-body-xxlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.quiz-finish-wrap form {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  text-align: center;
  position: relative;
}
.quiz-finish-wrap form input[type=text] {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 43.5%;
  max-width: 23.021vw;
  min-width: 15rem;
  height: 4.688vw;
  max-height: 6rem;
  padding: 0;
  border-radius: 0;
  border: none;
  text-align: center;
  font-size: clamp(2rem, 6rem, 3.12vw);
  font-family: "Cafe24Ohsquare";
  font-weight: 700;
  color: var(--kids-light-color-text-basic);
}
.quiz-finish-wrap form input[type=text]::placeholder {
  color: var(--kids-color-light-gray-40);
  font-family: "Pretendard GOV", sans-serif;
  font-weight: 400;
  text-decoration: underline;
  text-underline-offset: 1rem;
}
.quiz-finish-wrap form .date {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 26%;
  font-size: clamp(1.4rem, 2.4rem, 1.25vw);
  font-weight: 700;
  color: var(--kids-color-light-gray-50);
}
.quiz-finish-wrap .btns {
  text-align: center;
}
.quiz-finish-wrap .btns a {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18rem;
  height: 6.8rem;
  border-radius: var(--kids-radius-xlarge1);
  background-color: var(--kids-color-light-gray-0);
  background-color: var(--kids-color-high-contrast-primary-50);
  box-shadow: 0px 0.6rem 0px var(--kids-color-light-primary-80);
  color: var(--kids-color-light-gray-0);
  margin-top: var(--kids-number-14);
}
.quiz-finish-wrap .safefrm {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-safe-finish.jpg") no-repeat center center;
  background-size: cover;
}
.quiz-finish-wrap .learnfrm {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-learn-finish.jpg") no-repeat center center;
  background-size: contain;
}
.quiz-finish-wrap .suppfrm {
  background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-supp-finish.jpg") no-repeat center center;
  background-size: cover;
}

@media (max-width: 1023px) {
  .quiz-wrap .quiz {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    gap: 1.6rem;
  }
  .quiz-wrap .quiz .quiz-item {
    width: 100%;
  }
  .quiz-detail-wrap .qfoot {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    height: auto;
    padding: 3.7rem var(--kids-number-9) var(--kids-number-10);
  }
  .quiz-detail-wrap .qfoot p {
    width: 100%;
    padding-bottom: 2rem;
  }
  .quiz-detail-wrap .qfoot .btns {
    position: static;
    width: 100%;
    justify-content: center;
    gap: var(--kids-gap-3);
  }
}
@media (max-width: 767px) {
  .quiz-wrap .quiz figure {
    padding: 4rem 0;
    border-radius: 3.2rem;
  }
  .quiz-wrap .quiz figure:hover .visual {
    transform: none;
  }
  .quiz-wrap .quiz h4 {
    padding: 2rem 0 0;
  }
  .quiz-detail-wrap .quiz {
    border-radius: var(--kids-number-12);
  }
  .quiz-detail-wrap .qhead {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    height: auto;
    padding: var(--kids-number-12) var(--kids-number-11) 5.1rem;
    background-size: auto 100%;
  }
  .quiz-detail-wrap .qbody {
    padding: var(--kids-number-12) var(--kids-number-11) var(--kids-number-11);
  }
  .quiz-detail-wrap .qbody h4 {
    margin-bottom: var(--kids-number-11);
  }
  .quiz-detail-wrap .qbody h4 .ask {
    width: 12.1rem;
    border-radius: 5rem;
    padding: var(--kids-number-3) 0;
  }
  .quiz-detail-wrap .qbody .col2 {
    width: 50%;
  }
  .quiz-detail-wrap .qbody figure > a {
    height: 11rem;
  }
  .quiz-detail-wrap .qfoot .btns a {
    width: 14rem;
    height: 5.33rem;
  }
  .quiz-detail-wrap .quiz.safe .qfoot .btns > a {
    box-shadow: 0px 0.47rem 0px #7A2401;
  }
  .quiz-detail-wrap .quiz.safe .qfoot .btns > a.next {
    box-shadow: 0px 0.47rem 0px var(--kids-color-light-primary-80);
  }
  .quiz-detail-wrap .quiz.learn .qfoot {
    background-color: #6F1FAD;
  }
  .quiz-detail-wrap .quiz.learn .qfoot .btns > a {
    box-shadow: 0px 0.47rem 0px #4B0A7C;
  }
  .quiz-detail-wrap .quiz.learn .qfoot .btns > a.next {
    box-shadow: 0px 0.47rem 0px var(--kids-color-light-primary-80);
  }
  .quiz-detail-wrap .quiz.supp .qfoot .btns > a {
    box-shadow: 0px 0.47rem 0px #946601;
  }
  .quiz-detail-wrap .quiz.supp .qfoot .btns > a.next {
    box-shadow: 0px 0.47rem 0px var(--kids-color-light-primary-80);
  }
  .quiz-finish-wrap .page-title-wrap {
    padding-top: 1rem;
    padding-bottom: 4rem;
  }
  .quiz-finish-wrap .page-title-wrap::before {
    left: 0;
    margin-left: 0;
    width: 8.9rem;
    background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-confetti-l-m.png");
  }
  .quiz-finish-wrap .page-title-wrap::after {
    right: 0;
    margin-right: 0;
    width: 8.1rem;
    background-image: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-confetti-r-m.png");
  }
  .quiz-finish-wrap .sec-tit {
    font-size: var(--kids-font-size-display-medium);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-1);
    font-weight: 700;
    margin: 0;
  }
  .quiz-finish-wrap .sub-text {
    font-size: var(--kids-font-size-body-medium);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 400;
  }
  .quiz-finish-wrap .sub-text em {
    font-size: var(--kids-font-size-body-medium-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
  }
  .quiz-finish-wrap .btns a {
    width: 14rem;
    height: 5.33rem;
  }
}
@media (max-width: 479px) {
  .quiz-finish-wrap form {
    padding-bottom: 121%;
  }
  .quiz-finish-wrap form input[type=text] {
    font-size: var(--kids-font-size-body-medium-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
    bottom: 49.2%;
    height: 6.5vw;
    max-width: 37vw;
  }
  .quiz-finish-wrap form .date {
    font-size: var(--kids-font-size-body-xxsmall-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
  }
  .quiz-finish-wrap .safefrm {
    background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-safe-finish-m.jpg") no-repeat center center;
    background-size: cover;
  }
  .quiz-finish-wrap .learnfrm {
    background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-learn-finish-m.jpg") no-repeat center center;
    background-size: contain;
  }
  .quiz-finish-wrap .suppfrm {
    background: url("https://static.gov.kr/content/child/content/images/sub/svc-quiz-supp-finish-m.jpg") no-repeat center center;
    background-size: cover;
  }
}
.kids-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  --kids-badge--size-height: var(--kids-size-height-4);
  --kids-badge--line-height: 2.4rem;
  --kids-badge--padding: var(--kids-padding-3);
  --kids-badge--radius: var(--kids-radius-small2);
  --kids-badge--radius-max: var(--kids-radius-max);
  --kids-badge--dot-size: 0.6rem;
  --kids-badge--dot-padding: 0;
  --kids-badge--number-size-height: var(--kids-size-height-3);
  --kids-badge--font-size: var(--kids-font-size-label-small);
  --kids-badge--font-size-large: var(--kids-font-size-label-medium);
  --kids-badge--size-height-large: var(--kids-size-height-5);
  --kids-badge--color-gray-element: var(--kids-light-color-element-gray);
  --kids-badge--color-gray-element-lighter: var(--kids-light-color-element-gray-light);
  --kids-badge--color-gray-text: var(--kids-light-color-text-subtle);
  --kids-badge--color-purple-element: var(--kids-color-point-purple-50);
  --kids-badge--color-purple-element-lighter: var(--kids-color-point-purple-50);
  --kids-badge--color-purple-text: var(--kids-color-point-purple-50);
  --kids-badge--color-orange-element: var(--kids-color-point-orange-50);
  --kids-badge--color-orange-element-lighter: var(--kids-color-light-danger-5);
  --kids-badge--color-orange-text: var(--kids-color-light-danger-60);
  --kids-badge--color-yellow-element: var(--kids-color-point-yellow-60);
  --kids-badge--color-yellow-element-lighter: var(--kids-color-light-warning-5);
  --kids-badge--color-yellow-text: var(--kids-color-light-warning-60);
  --kids-badge--color-green-element: var(--kids-color-point-green-70);
  --kids-badge--color-green-element-lighter: var(--kids-color-light-success-5);
  --kids-badge--color-green-text: var(--kids-color-light-success-60);
  --kids-badge--color-blue-element: var(--kids-color-light-primary-55);
  --kids-badge--color-blue-element-lighter: var(--kids-color-light-information-5);
  --kids-badge--color-blue-text: var(--kids-color-light-information-60);
  --kids-badge--color-background-basic: var(
    --kids-light-color-background-white
  );
  --kids-badge--color-text-basic: var(
    --kids-light-color-text-inverse-static
  );
}
.kids-badge.outline-gray {
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-badge--light-color-gray-element);
  color: var(--kids-badge--color-gray-text);
}
.kids-badge.bg-gray {
  background-color: var(--kids-badge--color-gray-element);
  color: var(--kids-badge--color-text-basic);
}
.kids-badge.bg-light-gray {
  background-color: var(--kids-badge--color-gray-element-lighter);
  color: var(--kids-badge--color-gray-text);
}
.kids-badge.outline-purple {
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-badge--light-color-purple-element);
  color: var(--kids-badge--color-purple-text);
}
.kids-badge.bg-purple {
  background-color: var(--kids-badge--color-purple-element);
  color: var(--kids-badge--color-text-basic);
}
.kids-badge.bg-light-purple {
  background-color: var(--kids-badge--color-purple-element-lighter);
  color: var(--kids-badge--color-purple-text);
}
.kids-badge.outline-orange {
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-badge--light-color-orange-element);
  color: var(--kids-badge--color-orange-text);
}
.kids-badge.bg-orange {
  background-color: var(--kids-badge--color-orange-element);
  color: var(--kids-badge--color-text-basic);
}
.kids-badge.bg-light-orange {
  background-color: var(--kids-badge--color-orange-element-lighter);
  color: var(--kids-badge--color-orange-text);
}
.kids-badge.outline-yellow {
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-badge--light-color-yellow-element);
  color: var(--kids-badge--color-yellow-text);
}
.kids-badge.bg-yellow {
  background-color: var(--kids-badge--color-yellow-element);
  color: var(--kids-badge--color-text-basic);
  color: var(--kids-color-light-alpha-black100);
}
.kids-badge.bg-light-yellow {
  background-color: var(--kids-badge--color-yellow-element-lighter);
  color: var(--kids-badge--color-yellow-text);
}
.kids-badge.outline-green {
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-badge--light-color-green-element);
  color: var(--kids-badge--color-green-text);
}
.kids-badge.bg-green {
  background-color: var(--kids-badge--color-green-element);
  color: var(--kids-badge--color-text-basic);
}
.kids-badge.bg-light-green {
  background-color: var(--kids-badge--color-green-element-lighter);
  color: var(--kids-badge--color-green-text);
}
.kids-badge.outline-blue {
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-badge--light-color-blue-element);
  color: var(--kids-badge--color-blue-text);
}
.kids-badge.bg-blue {
  background-color: var(--kids-badge--color-blue-element);
  color: var(--kids-badge--color-text-basic);
}
.kids-badge.bg-light-blue {
  background-color: var(--kids-badge--color-blue-element-lighter);
  color: var(--kids-badge--color-blue-text);
}
.kids-badge {
  height: var(--kids-badge--size-height);
  line-height: var(--kids-badge--line-height);
  font-size: var(--kids-badge--font-size);
  font-weight: var(--kids-font-weight-regular);
  padding: 0 var(--kids-badge--padding);
  border-radius: var(--kids-badge--radius);
}
.kids-badge.large {
  height: var(--kids-badge--size-height-large);
  font-size: var(--kids-badge--font-size-large);
}
@media (max-width: 767px) {
  .kids-badge.large {
    font-size: var(--kids-badge--font-size);
  }
}
.kids-badge.number {
  height: var(--kids-badge--number-size-height);
  border-radius: var(--kids-badge--radius-max);
}
.kids-badge.dot {
  width: var(--kids-badge--dot-size);
  height: var(--kids-badge--dot-size);
  padding: var(--kids-badge--dot-padding);
  border-radius: var(--kids-badge--radius-max);
}

.kids-badge-wrap {
  --kids-badge--wrap-gap: var(--kids-gap-3);
  display: flex;
  flex-wrap: wrap;
  gap: var(--kids-badge--wrap-gap);
}
.kids-badge-wrap + .kids-badge-wrap {
  margin-top: var(--kids-padding-5);
}

/* 브레드크럼 */
.kids-breadcrumb-wrap {
  --kids-breadcrumb--padding-x: var(--kids-padding-2);
  --kids-breadcrumb--margin-bottom: var(
    --kids-gap-layout-breadcrumb-h1
  );
  --kids-breadcrumb--radius: var(--kids-radius-medium2);
  --kids-breadcrumb--font-size: var(--kids-font-size-label-small);
  --kids-breadcrumb--color-action: var(
    --kids-light-color-action-secondary
  );
  --kids-breadcrumb--color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-breadcrumb--color-action-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  --kids-breadcrumb--color-text: var(
    --kids-light-color-text-basic
  );
  --kids-breadcrumb--color-text-disabled: var(
    --kids-light-color-text-disabled
  );
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: row;
  margin-bottom: var(--kids-breadcrumb--margin-bottom);
  padding-top: var(--kids-gap-layout-header-breadcrumb);
  padding-bottom: var(--kids-gap-layout-breadcrumb-h2);
}
.kids-breadcrumb-wrap .breadcrumb {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-2);
  width: 100%;
}
.kids-breadcrumb-wrap .breadcrumb li {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  font-size: var(--kids-breadcrumb--font-size);
}
.kids-breadcrumb-wrap .breadcrumb li .txt {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-2);
  padding: 0 var(--kids-breadcrumb--padding-x);
  background-color: var(--kids-breadcrumb--color-action);
  border-radius: var(--kids-breadcrumb--radius);
}
.kids-breadcrumb-wrap .breadcrumb li a.txt {
  text-decoration: underline;
  text-underline-offset: var(--kids-font-underline-offset);
}
.kids-breadcrumb-wrap .breadcrumb li a.txt:not(.disabled):hover {
  background-color: var(--kids-breadcrumb--color-action-hover);
}
.kids-breadcrumb-wrap .breadcrumb li a.txt:not(.disabled):active {
  background-color: var(--kids-breadcrumb--color-action-pressed);
}
.kids-breadcrumb-wrap .breadcrumb li a.txt:not(.disabled):focus, .kids-breadcrumb-wrap .breadcrumb li a.txt:not(:disabled):focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.kids-breadcrumb-wrap .breadcrumb li a.txt.disabled, .kids-breadcrumb-wrap .breadcrumb li a.txt:disabled {
  cursor: default;
  color: var(--kids-breadcrumb--color-text-disabled);
}
.kids-breadcrumb-wrap .breadcrumb li:not(:last-child)::after {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  content: "";
  margin-left: var(--kids-gap-2);
  display: inline-flex;
  width: var(--kids-icon--size-small);
  height: var(--kids-icon--size-small);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  transform: rotate(-90deg);
}
.kids-breadcrumb-wrap .breadcrumb .home {
  gap: 0;
}
.kids-breadcrumb-wrap .breadcrumb .home .txt::before {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-small);
  height: var(--kids-icon--size-small);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_bread_home.svg);
  background-color: transparent;
}

@media (max-width: 767px) {
  .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:last-child) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    left: 0;
    top: 0;
  }
  .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:nth-child(2)):last-child {
    gap: var(--kids-gap-2);
  }
  .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:nth-child(2)):last-child::before, .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:nth-child(2)):last-child::after {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    content: "";
    display: inline-flex;
    width: var(--kids-icon--size-small);
    height: var(--kids-icon--size-small);
    background-color: var(--kids-light-color-text-basic);
    forced-color-adjust: none;
  }
  .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:nth-child(2)):last-child::before {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_ellipsis.svg);
    background-color: transparent;
  }
  .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:nth-child(2)):last-child::after {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
    background-color: transparent;
    transform: rotate(-90deg);
  }
  .kids-breadcrumb-wrap .breadcrumb li:not(.home):not(:nth-child(2)):last-child .txt {
    order: 3;
  }
}
/* icon 버튼 사이즈 */
.kids-btn {
  --kids-button--size-height-xsmall: var(--kids-size-height-5);
  --kids-button--padding-x-xsmall: var(--kids-padding-4);
  --kids-button--padding-y-xsmall: 0;
  --kids-button--gap-xsmall: var(--kids-gap-1);
  --kids-button--radius-xsmall: var(--kids-radius-small3);
  --kids-button--font-size-xsmall: var(--kids-font-size-label-small);
  --kids-button--font-weight-xsmall: var(--kids-font-weight-regular);
  --kids-button--size-height-small: var(--kids-size-height-6);
  --kids-button--padding-x-small: var(--kids-padding-5);
  --kids-button--padding-y-small: 0;
  --kids-button--gap-small: var(--kids-gap-1);
  --kids-button--radius-small: var(--kids-radius-medium1);
  --kids-button--font-size-small: var(--kids-font-size-label-small);
  --kids-button--font-weight-small: var(--kids-font-weight-regular);
  --kids-button--size-height-medium: var(--kids-size-height-7);
  --kids-button--padding-x-medium: var(--kids-padding-6);
  --kids-button--padding-y-medium: 0;
  --kids-button--gap-medium: var(--kids-gap-2);
  --kids-button--radius-medium: var(--kids-radius-medium2);
  --kids-button--font-size-medium: var(--kids-font-size-label-medium);
  --kids-button--font-weight-medium: var(--kids-font-weight-regular);
  --kids-button--size-height-large: var(--kids-size-height-8);
  --kids-button--padding-x-large: var(--kids-padding-7);
  --kids-button--padding-y-large: 0;
  --kids-button--gap-large: var(--kids-gap-2);
  --kids-button--radius-large: var(--kids-radius-medium3);
  --kids-button--font-size-large: var(--kids-font-size-label-large);
  --kids-button--font-weight-large: var(--kids-font-weight-regular);
  --kids-button--size-height-xlarge: var(--kids-size-height-9);
  --kids-button--padding-x-xlarge: var(--kids-padding-8);
  --kids-button--padding-y-xlarge: 0;
  --kids-button--gap-xlarge: var(--kids-gap-2);
  --kids-button--radius-xlarge: var(--kids-radius-medium4);
  --kids-button--font-size-xlarge: var(--kids-font-size-label-large);
  --kids-button--font-weight-xlarge: var(--kids-font-weight-regular);
}
.kids-btn {
  gap: var(--kids-button--gap-large);
  height: var(--kids-button--size-height-large);
  padding: var(--kids-button--padding-y-large) var(--kids-button--padding-x-large);
  border-radius: var(--kids-button--radius-large);
  font-size: var(--kids-button--font-size-large);
  font-weight: var(--kids-button--font-weight-large);
}
.kids-btn .svg-icon {
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
}
.kids-btn.xsmall {
  gap: var(--kids-button--gap-xsmall);
  height: var(--kids-button--size-height-xsmall);
  padding: var(--kids-button--padding-y-xsmall) var(--kids-button--padding-x-xsmall);
  border-radius: var(--kids-button--radius-xsmall);
  font-size: var(--kids-button--font-size-xsmall);
  font-weight: var(--kids-button--font-weight-xsmall);
}
.kids-btn.xsmall .svg-icon {
  width: var(--kids-icon--size-xsmall);
  height: var(--kids-icon--size-xsmall);
}
.kids-btn.small {
  gap: var(--kids-button--gap-small);
  height: var(--kids-button--size-height-small);
  padding: var(--kids-button--padding-y-small) var(--kids-button--padding-x-small);
  border-radius: var(--kids-button--radius-small);
  font-size: var(--kids-button--font-size-small);
  font-weight: var(--kids-button--font-weight-small);
}
.kids-btn.small .svg-icon {
  width: var(--kids-icon--size-small);
  height: var(--kids-icon--size-small);
}
.kids-btn.medium {
  gap: var(--kids-button--gap-medium);
  height: var(--kids-button--size-height-medium);
  padding: var(--kids-button--padding-y-medium) var(--kids-button--padding-x-medium);
  border-radius: var(--kids-button--radius-medium);
  font-size: var(--kids-button--font-size-medium);
  font-weight: var(--kids-button--font-weight-medium);
}
.kids-btn.medium .svg-icon {
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
}
.kids-btn.large {
  gap: var(--kids-button--gap-large);
  height: var(--kids-button--size-height-large);
  padding: var(--kids-button--padding-y-large) var(--kids-button--padding-x-large);
  border-radius: var(--kids-button--radius-large);
  font-size: var(--kids-button--font-size-large);
  font-weight: var(--kids-button--font-weight-large);
}
.kids-btn.large .svg-icon {
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
}
.kids-btn.xlarge {
  gap: var(--kids-button--gap-xlarge);
  height: var(--kids-button--size-height-xlarge);
  padding: var(--kids-button--padding-y-xlarge) var(--kids-button--padding-x-xlarge);
  border-radius: var(--kids-button--radius-xlarge);
  font-size: var(--kids-button--font-size-xlarge);
  font-weight: var(--kids-button--font-weight-xlarge);
}
.kids-btn.xlarge .svg-icon {
  width: var(--kids-icon--size-xlarge);
  height: var(--kids-icon--size-xlarge);
}
.kids-btn {
  --kids-button--color-primary-fill: var(--kids-light-color-button-primary-fill);
  --kids-button--color-primary-fill-hover: var(--kids-light-color-button-primary-fill-hover);
  --kids-button--color-primary-fill-pressed: var(--kids-light-color-button-primary-fill-pressed);
  --kids-button--color-primary-fill-disabled: var(--kids-light-color-button-disabled-fill);
  --kids-button--color-primary-border: var(--kids-light-color-button-primary-fill);
  --kids-button--color-primary-border-disabled: var(--kids-light-color-button-disabled-border);
  --kids-button--color-primary-text: var(--kids-light-color-text-inverse-static);
  --kids-button--color-primary-text-disabled: var(--kids-light-color-text-disabled-on);
  --kids-button--color-secondary-fill: var(--kids-light-color-button-secondary-fill);
  --kids-button--color-secondary-fill-hover: var(--kids-light-color-button-secondary-fill-hover);
  --kids-button--color-secondary-fill-pressed: var(--kids-light-color-button-secondary-fill-pressed);
  --kids-button--color-secondary-fill-disabled: var(--kids-light-color-button-disabled-fill);
  --kids-button--color-secondary-border: var(--kids-light-color-button-secondary-border);
  --kids-button--color-secondary-border-disabled: var(--kids-light-color-button-disabled-border);
  --kids-button--color-secondary-text: var(--kids-light-color-text-primary);
  --kids-button--color-secondary-text-disabled: var(--kids-light-color-text-disabled-on);
  --kids-button--color-tertiary-fill: var(--kids-light-color-button-tertiary-fill);
  --kids-button--color-tertiary-fill-hover: var(--kids-light-color-button-tertiary-fill-hover);
  --kids-button--color-tertiary-fill-pressed: var(--kids-light-color-button-tertiary-fill-pressed);
  --kids-button--color-tertiary-fill-disabled: var(--kids-light-color-button-disabled-fill);
  --kids-button--color-tertiary-border: var(--kids-light-color-button-tertiary-border);
  --kids-button--color-tertiary-border-disabled: var(--kids-light-color-button-disabled-border);
  --kids-button--color-tertiary-text: var(--kids-light-color-text-basic);
  --kids-button--color-tertiary-text-disabled: var(--kids-light-color-text-disabled-on);
  --kids-button--color-text-fill: var(--kids-light-color-button-text-fill);
  --kids-button--color-text-fill-hover: var(--kids-light-color-button-text-fill-hover);
  --kids-button--color-text-fill-pressed: var(--kids-light-color-button-text-fill-pressed);
  --kids-button--color-text-fill-disabled: var(--kids-light-color-button-text-fill);
  --kids-button--color-text-border: var(--kids-light-color-button-text-border);
  --kids-button--color-text-border-disabled: var(--kids-light-color-border-transparency);
  --kids-button--color-text-text: var(--kids-light-color-text-basic);
  --kids-button--color-text-text-disabled: var(--kids-light-color-text-disabled);
  --kids-button--color-link-fill: var(--kids-light-color-button-text-fill);
  --kids-button--color-link-fill-hover: var(--kids-light-color-button-text-fill);
  --kids-button--color-link-fill-pressed: var(--kids-light-color-button-text-fill);
  --kids-button--color-link-fill-disabled: var(--kids-light-color-button-text-fill);
  --kids-button--color-link-border: var(--kids-light-color-button-text-border);
  --kids-button--color-link-border-disabled: var(--kids-light-color-border-transparency);
  --kids-button--color-link-text: var(--kids-light-color-link-default);
  --kids-button--color-link-text-disabled: var(--kids-light-color-text-disabled);
}
.kids-btn {
  background-color: var(--kids-button--color-primary-fill);
  border-color: var(--kids-button--color-primary-border);
  color: var(--kids-button--color-primary-text);
}
.kids-btn.primary {
  background-color: var(--kids-button--color-primary-fill);
  border-color: var(--kids-button--color-primary-border);
  color: var(--kids-button--color-primary-text);
}
.kids-btn.primary:hover {
  background-color: var(--kids-button--color-primary-fill-hover);
}
.kids-btn.primary:active, .kids-btn.primary:focus {
  background-color: var(--kids-button--color-primary-fill-pressed);
}
.kids-btn.primary[disabled], .kids-btn.primary.disabled {
  background-color: var(--kids-button--color-primary-fill-disabled);
  border-color: var(--kids-button--color-primary-border-disabled);
  color: var(--kids-button--color-primary-text-disabled);
}
.kids-btn.primary[disabled]:not(.icon) .svg-icon, .kids-btn.primary.disabled:not(.icon) .svg-icon {
  background-color: var(--kids-button--color-primary-text-disabled);
}
.kids-btn.primary[disabled]:hover, .kids-btn.primary.disabled:hover {
  background-color: var(--kids-button--color-primary-fill-disabled);
  border-color: var(--kids-button--color-primary-border-disabled);
  color: var(--kids-button--color-primary-text-disabled);
}
.kids-btn.secondary {
  background-color: var(--kids-button--color-secondary-fill);
  border-color: var(--kids-button--color-secondary-border);
  color: var(--kids-button--color-secondary-text);
}
.kids-btn.secondary:hover {
  background-color: var(--kids-button--color-secondary-fill-hover);
}
.kids-btn.secondary:active, .kids-btn.secondary:focus {
  background-color: var(--kids-button--color-secondary-fill-pressed);
}
.kids-btn.secondary[disabled], .kids-btn.secondary.disabled {
  background-color: var(--kids-button--color-secondary-fill-disabled);
  border-color: var(--kids-button--color-secondary-border-disabled);
  color: var(--kids-button--color-secondary-text-disabled);
}
.kids-btn.secondary[disabled]:not(.icon) .svg-icon, .kids-btn.secondary.disabled:not(.icon) .svg-icon {
  background-color: var(--kids-button--color-secondary-text-disabled);
}
.kids-btn.secondary[disabled]:hover, .kids-btn.secondary.disabled:hover {
  background-color: var(--kids-button--color-secondary-fill-disabled);
  border-color: var(--kids-button--color-secondary-border-disabled);
  color: var(--kids-button--color-secondary-text-disabled);
}
.kids-btn.tertiary {
  background-color: var(--kids-button--color-tertiary-fill);
  border-color: var(--kids-button--color-tertiary-border);
  color: var(--kids-button--color-tertiary-text);
}
.kids-btn.tertiary:hover {
  background-color: var(--kids-button--color-tertiary-fill-hover);
}
.kids-btn.tertiary:active, .kids-btn.tertiary:focus {
  background-color: var(--kids-button--color-tertiary-fill-pressed);
}
.kids-btn.tertiary[disabled], .kids-btn.tertiary.disabled {
  background-color: var(--kids-button--color-tertiary-fill-disabled);
  border-color: var(--kids-button--color-tertiary-border-disabled);
  color: var(--kids-button--color-tertiary-text-disabled);
}
.kids-btn.tertiary[disabled]:not(.icon) .svg-icon, .kids-btn.tertiary.disabled:not(.icon) .svg-icon {
  background-color: var(--kids-button--color-tertiary-text-disabled);
}
.kids-btn.tertiary[disabled]:hover, .kids-btn.tertiary.disabled:hover {
  background-color: var(--kids-button--color-tertiary-fill-disabled);
  border-color: var(--kids-button--color-tertiary-border-disabled);
  color: var(--kids-button--color-tertiary-text-disabled);
}
.kids-btn.text {
  background-color: var(--kids-button--color-text-fill);
  border-color: var(--kids-button--color-text-border);
  color: var(--kids-button--color-text-text);
}
.kids-btn.text:hover {
  background-color: var(--kids-button--color-text-fill-hover);
}
.kids-btn.text:active, .kids-btn.text:focus {
  background-color: var(--kids-button--color-text-fill-pressed);
}
.kids-btn.text[disabled], .kids-btn.text.disabled {
  background-color: var(--kids-button--color-text-fill-disabled);
  border-color: var(--kids-button--color-text-border-disabled);
  color: var(--kids-button--color-text-text-disabled);
}
.kids-btn.text[disabled]:not(.icon) .svg-icon, .kids-btn.text.disabled:not(.icon) .svg-icon {
  background-color: var(--kids-button--color-text-text-disabled);
}
.kids-btn.text[disabled]:hover, .kids-btn.text.disabled:hover {
  background-color: var(--kids-button--color-text-fill-disabled);
  border-color: var(--kids-button--color-text-border-disabled);
  color: var(--kids-button--color-text-text-disabled);
}
.kids-btn.link {
  background-color: var(--kids-button--color-link-fill);
  border-color: var(--kids-button--color-link-border);
  color: var(--kids-button--color-link-text);
}
.kids-btn.link:hover {
  background-color: var(--kids-button--color-link-fill-hover);
}
.kids-btn.link:active, .kids-btn.link:focus {
  background-color: var(--kids-button--color-link-fill-pressed);
}
.kids-btn.link[disabled], .kids-btn.link.disabled {
  background-color: var(--kids-button--color-link-fill-disabled);
  border-color: var(--kids-button--color-link-border-disabled);
  color: var(--kids-button--color-link-text-disabled);
}
.kids-btn.link[disabled]:not(.icon) .svg-icon, .kids-btn.link.disabled:not(.icon) .svg-icon {
  background-color: var(--kids-button--color-link-text-disabled);
}
.kids-btn.link[disabled]:hover, .kids-btn.link.disabled:hover {
  background-color: var(--kids-button--color-link-fill-disabled);
  border-color: var(--kids-button--color-link-border-disabled);
  color: var(--kids-button--color-link-text-disabled);
}
.kids-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: auto;
  border-style: solid;
  cursor: pointer;
  white-space: nowrap;
  transition: var(--kids-transition-base);
  line-height: 2;
  border-width: var(--kids-light-border-width-variable-regular);
}
.kids-btn .svg-icon {
  background-color: var(--kids-button--color-primary-text);
  transition: var(--kids-transition-base);
  background-color: transparent;
}
.kids-btn:hover, .kids-btn.hover {
  background-color: var(--kids-button--color-primary-fill-hover);
}
.kids-btn:active, .kids-btn:focus, .kids-btn.active {
  background-color: var(--kids-button--color-primary-fill-pressed);
}
.kids-btn[disabled], .kids-btn.disabled {
  background-color: var(--kids-button--color-primary-fill-disabled);
  border-color: var(--kids-button--color-primary-border-disabled);
  color: var(--kids-button--color-primary-text-disabled);
  cursor: default;
}
.kids-btn[disabled]:hover, .kids-btn.disabled:hover {
  background-color: var(--kids-button--color-primary-fill-disabled);
  border-color: var(--kids-button--color-primary-border-disabled);
  color: var(--kids-button--color-primary-text-disabled);
}
.kids-btn.text {
  --kids-button--size-height-xsmall: var(--kids-size-height-3);
  --kids-button--padding-x-xsmall: var(--kids-padding-1);
  --kids-button--padding-y-xsmall: var(--kids-number-0);
  --kids-button--size-height-small: var(--kids-size-height-4);
  --kids-button--padding-x-small: var(--kids-padding-1);
  --kids-button--padding-y-small: var(--kids-number-0);
  --kids-button--size-height-medium: var(--kids-size-height-5);
  --kids-button--padding-x-medium: var(--kids-padding-1);
  --kids-button--padding-y-medium: var(--kids-number-2);
  --kids-button--size-height-large: var(--kids-size-height-6);
  --kids-button--padding-x-large: var(--kids-padding-1);
  --kids-button--padding-y-large: 0.5rem;
  --kids-button--size-height-xlarge: var(--kids-size-height-7);
  --kids-button--padding-x-xlarge: var(--kids-padding-1);
  --kids-button--padding-y-xlarge: 0.9rem;
  display: inline-block;
  height: auto !important;
  padding: var(--kids-button--padding-y-large) var(--kids-button--padding-x-large);
  text-align: left;
  white-space: normal;
}
.kids-btn.text.xsmall {
  min-height: var(--kids-button--size-height-xsmall);
  padding: var(--kids-button--padding-y-xsmall) var(--kids-button--padding-x-xsmall);
}
.kids-btn.text.xsmall .svg-icon {
  margin-bottom: -0.3rem;
}
.kids-btn.text.small {
  padding: var(--kids-button--padding-y-small) var(--kids-button--padding-x-small);
}
.kids-btn.text.small .svg-icon {
  margin-bottom: -0.3rem;
}
.kids-btn.text.medium {
  padding: var(--kids-button--padding-y-medium) var(--kids-button--padding-x-medium);
}
.kids-btn.text.medium .svg-icon {
  margin-bottom: -0.4rem;
}
.kids-btn.text.large {
  padding: var(--kids-button--padding-y-large) var(--kids-button--padding-x-large);
}
.kids-btn.text.large .svg-icon {
  margin-bottom: -0.5rem;
}
.kids-btn.text.xlarge {
  padding: var(--kids-button--padding-y-xlarge) var(--kids-button--padding-x-xlarge);
}
.kids-btn.text.xlarge .svg-icon {
  margin-bottom: -0.6rem;
}
.kids-btn.text.h-auto {
  height: auto;
  padding: var(--kids-padding-1) !important;
}
.kids-btn.text .svg-icon {
  display: inline-block;
  margin-bottom: -0.5rem;
}
.kids-btn.link {
  --kids-button--font-size-xsmall: var(
    --kids-font-size-label-small
  );
  --kids-button--font-size-xsmall: var(
    --kids-font-size-label-small
  );
  --kids-button--padding-x-xsmall: var(--kids-padding-1);
  --kids-button--font-size-small: var(--kids-font-size-label-small);
  --kids-button--padding-x-small: var(--kids-padding-1);
  --kids-button--font-size-medium: var(
    --kids-font-size-label-medium
  );
  --kids-button--font-size-medium: var(
    --kids-font-size-label-medium
  );
  --kids-button--padding-x-medium: var(--kids-padding-1);
  --kids-button--font-size-large: var(--kids-font-size-label-large);
  --kids-button--padding-x-large: var(--kids-padding-1);
  --kids-button--font-size-xlarge: var(
    --kids-font-size-label-large
  );
  --kids-button--font-size-xlarge: var(
    --kids-font-size-label-large
  );
  --kids-button--padding-x-xlarge: var(--kids-padding-1);
  display: inline-block;
  height: auto !important;
  padding: 0 var(--kids-button--padding-x-large);
  font-size: var(--kids-button--font-size-large);
  text-align: left;
  white-space: normal;
}
.kids-btn.link.xsmall {
  padding: 0 var(--kids-button--padding-x-xsmall);
  font-size: var(--kids-button--font-size-xsmall);
}
.kids-btn.link.xsmall .svg-icon {
  margin-bottom: -0.3rem;
}
.kids-btn.link.small {
  padding: 0 var(--kids-button--padding-x-small);
  font-size: var(--kids-button--font-size-small);
}
.kids-btn.link.small .svg-icon {
  margin-bottom: -0.3rem;
}
.kids-btn.link.medium {
  padding: 0 var(--kids-button--padding-x-medium);
  font-size: var(--kids-button--font-size-medium);
}
.kids-btn.link.medium .svg-icon {
  margin-bottom: -0.4rem;
}
.kids-btn.link.large {
  font-size: var(--kids-button--font-size-large);
}
.kids-btn.link.large .svg-icon {
  margin-bottom: -0.5rem;
}
.kids-btn.link.xlarge {
  padding: 0 var(--kids-button--padding-x-xlarge);
  font-size: var(--kids-button--font-size-xlarge);
}
.kids-btn.link.xlarge .svg-icon {
  margin-bottom: -0.6rem;
}
.kids-btn.link.basic {
  color: var(--kids-light-color-text-basic);
}
.kids-btn.link.basic .svg-icon {
  background-color: var(--kids-light-color-text-basic);
}
.kids-btn.link.basic.pure:hover, .kids-btn.link.basic.pure:active, .kids-btn.link.basic.pure:focus, .kids-btn.link.basic.pure:visited {
  color: var(--kids-light-color-text-basic);
}
.kids-btn.link.basic.pure:hover .svg-icon, .kids-btn.link.basic.pure:active .svg-icon, .kids-btn.link.basic.pure:focus .svg-icon, .kids-btn.link.basic.pure:visited .svg-icon {
  background-color: var(--kids-light-color-text-basic);
}
.kids-btn.link:hover, .kids-btn.link.hover {
  color: var(--kids-light-color-link-hover);
}
.kids-btn.link:active, .kids-btn.link:focus, .kids-btn.link.active {
  color: var(--kids-light-color-link-pressed);
}
.kids-btn.link:visited {
  color: var(--kids-light-color-link-visited);
  text-decoration: none;
}
.kids-btn.link.pure:hover, .kids-btn.link.pure:active, .kids-btn.link.pure:focus, .kids-btn.link.pure:visited {
  color: var(--kids-button--color-link-text);
}
.kids-btn.link .underline.hidden-underline {
  text-decoration-color: var(--kids-light-color-border-transparency);
  transition: var(--kids-transition-base);
}
.kids-btn.link:hover .underline.hidden-underline, .kids-btn.link:active .underline.hidden-underline, .kids-btn.link:focus .underline.hidden-underline, .kids-btn.link:visited .underline.hidden-underline {
  text-decoration-color: inherit;
}
.kids-btn.link .svg-icon {
  display: inline-block;
  margin-bottom: -0.5rem;
}
.kids-btn {
  /* icon 버튼 (텍스트 없음) */
}
.kids-btn.icon {
  --kids-button--icon-size-xsmall: var(--kids-size-height-2);
  --kids-button--icon-size-small: var(--kids-size-height-3);
  --kids-button--icon-size-medium: var(--kids-size-height-4);
  --kids-button--icon-size-large: var(--kids-size-height-5);
  --kids-button--icon-size-xlarge: var(--kids-size-height-6);
  width: var(--kids-button--icon-size-medium);
  height: var(--kids-button--icon-size-medium);
  padding: 0 !important;
  background-color: transparent;
  border-color: var(--kids-light-color-border-transparency);
  color: inherit;
  border: 0;
}
.kids-btn.icon:hover, .kids-btn.icon:active {
  background-color: inherit;
}
.kids-btn.icon.xsmall {
  width: var(--kids-button--icon-size-xsmall);
  height: var(--kids-button--icon-size-xsmall);
}
.kids-btn.icon.xsmall .svg-icon {
  width: 100%;
  height: 100%;
}
.kids-btn.icon.small {
  width: var(--kids-button--icon-size-small);
  height: var(--kids-button--icon-size-small);
}
.kids-btn.icon.small .svg-icon {
  width: 100%;
  height: 100%;
}
.kids-btn.icon.medium {
  width: var(--kids-button--icon-size-medium);
  height: var(--kids-button--icon-size-medium);
}
.kids-btn.icon.medium .svg-icon {
  width: 100%;
  height: 100%;
}
.kids-btn.icon.large {
  width: var(--kids-button--icon-size-large);
  height: var(--kids-button--icon-size-large);
}
.kids-btn.icon.large .svg-icon {
  width: 100%;
  height: 100%;
}
.kids-btn.icon.xlarge {
  width: var(--kids-button--icon-size-xlarge);
  height: var(--kids-button--icon-size-xlarge);
}
.kids-btn.icon.xlarge .svg-icon {
  width: 100%;
  height: 100%;
}
.kids-btn.icon .svg-icon {
  background-color: transparent;
}
.kids-btn.icon.pure .svg-icon {
  background-color: transparent;
}
.kids-btn.icon.border {
  background-color: var(--kids-light-color-background-white);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray);
  border-radius: var(--kids-radius-max);
}
.kids-btn.icon.border.large .svg-icon {
  width: var(--kids-icon--size-xsmall);
  height: var(--kids-icon--size-xsmall);
}
.kids-btn.icon.border.xlarge .svg-icon {
  width: var(--kids-icon--size-xlarge);
  height: var(--kids-icon--size-xlarge);
}
.kids-btn.icon.border[disabled], .kids-btn.icon.border.disabled {
  background-color: var(--kids-light-color-button-disabled-fill);
}

.btn-wrap {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-4);
  flex-wrap: wrap;
}

/* {$prefix}-drop-wrap */
.kids-drop-wrap {
  --kids-dropdown--menu-radius: var(--kids-radius-medium4);
  --kids-dropdown--menu-padding: var(--kids-padding-3);
  --kids-dropdown--menu-margin-top: var(--kids-padding-6);
  --kids-dropdown--menu-gap: var(--kids-gap-3);
  --kids-dropdown--list-item-radius: var(--kids-radius-medium2);
  --kids-dropdown--list-item-height: var(--kids-size-height-7);
  --kids-dropdown--list-item-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-dropdown--menu-color-border: var(
    --kids-light-color-border-gray-light
  );
  --kids-dropdown--menu-color-surface: var(
    --kids-light-color-surface-white-subtler
  );
  --kids-dropdown--menu-color-alpha-shadow: 0 0 0.2rem 0
      var(--kids-light-color-alpha-shadow1),
    0 0.4rem 0.8rem 0 var(--kids-light-color-alpha-shadow2);
  --kids-dropdown--list-item-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-dropdown--list-item-color-action-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  --kids-dropdown--list-item-color-action-selected: var(
    --kids-light-color-action-secondary-selected
  );
  --kids-dropdown--list-item-color-text-selected: var(
    --kids-light-color-text-secondary
  );
  display: inline-flex;
  position: relative;
}
.kids-drop-wrap .drop-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  display: none;
  z-index: 6;
  min-width: 18rem;
  border-radius: var(--kids-dropdown--menu-radius);
  padding: var(--kids-dropdown--menu-padding);
  margin-top: var(--kids-dropdown--menu-margin-top);
  background-color: var(--kids-dropdown--menu-color-surface);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-dropdown--menu-color-border);
  box-shadow: var(--kids-dropdown--menu-color-alpha-shadow);
  transform: translateX(-50%);
}
.kids-drop-wrap .drop-menu::before {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  position: absolute;
  bottom: 100%;
  left: 50%;
  display: block;
  margin-bottom: -0.5rem;
  margin-left: -0.6rem;
  transform: rotate(-135deg);
  background-color: var(--kids-dropdown--menu-color-surface);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-dropdown--menu-color-border);
  border-top-color: transparent;
  border-left-color: transparent;
}
.kids-drop-wrap .drop-menu .drop-in {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-dropdown--menu-gap);
  position: relative;
  z-index: 1;
}
.kids-drop-wrap .drop-menu .drop-top {
  width: 100%;
  padding: var(--kids-padding-3) var(--kids-padding-6);
  border-bottom: 0.1rem solid var(--kids-dropdown--menu-color-border);
}
.kids-drop-wrap .drop-menu .drop-bottom {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: row;
  width: 100%;
  padding: var(--kids-padding-3) 0;
  border-top: 0.1rem solid var(--kids-dropdown--menu-color-border);
}
.kids-drop-wrap .drop-menu .drop-list {
  width: 100%;
}
.kids-drop-wrap .drop-menu .drop-list .item-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  width: 100%;
  gap: var(--kids-gap-3);
  padding: 0 var(--kids-padding-6);
  font-size: var(--kids-dropdown--list-item-font-size);
  border-radius: var(--kids-dropdown--list-item-radius);
  height: var(--kids-dropdown--list-item-height);
  background-color: var(--kids-dropdown--menu-color-surface);
}
@media (max-width: 767px) {
  .kids-drop-wrap .drop-menu .drop-list .item-link {
    font-size: var(--kids-dropdown--list-item-font-size);
  }
}
.kids-drop-wrap .drop-menu .drop-list .item-link .ico-go {
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
}
.kids-drop-wrap .drop-menu .drop-list .item-link:hover {
  background-color: var(--kids-dropdown--list-item-color-action-hover);
}
.kids-drop-wrap .drop-menu .drop-list .item-link:active {
  background-color: var(--kids-dropdown--list-item-color-action-pressed);
}
.kids-drop-wrap .drop-menu .drop-list .item-link.active {
  font-weight: var(--kids-font-weight-bold);
  color: var(--kids-dropdown--list-item-color-text-selected);
  background-color: var(--kids-dropdown--list-item-color-action-selected);
}
.kids-drop-wrap .drop-menu .drop-list li:has(.item-link.reset) {
  margin-top: 0.8rem;
  border-bottom: var(--kids-light-border-width-variable-regular) solid #d7d9db;
}
.kids-drop-wrap.screen-size .drop-list .item-link.active:before {
  background: var(--kids-dropdown--list-item-color-text-selected);
  border-color: var(--kids-dropdown--list-item-color-text-selected);
  color: #fff;
  font-weight: 400;
}
.kids-drop-wrap.screen-size .drop-list .item-link:before {
  content: "가";
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  margin-right: 0.8rem;
  width: 2.3rem;
  height: 2.3rem;
  color: var(--kids-color-light-gray-90);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray-light);
  border-radius: 0.4rem;
  font-size: 1.5rem;
  background-color: #fff;
}
.kids-drop-wrap.screen-size .drop-list .item-link.md:before {
  width: 2.6rem;
  height: 2.6rem;
  font-size: 1.7rem;
}
.kids-drop-wrap.screen-size .drop-list .item-link.lg:before {
  width: 2.9rem;
  height: 2.9rem;
  font-size: 1.9rem;
}
.kids-drop-wrap.screen-size .drop-list .item-link.xlg:before {
  width: 3.2rem;
  height: 3.2rem;
  font-size: 2.1rem;
}
.kids-drop-wrap.screen-size .drop-list .item-link.xxlg:before {
  width: 3.5rem;
  height: 3.5rem;
  font-size: 2.3rem;
}
.kids-drop-wrap.screen-size .drop-list .item-link.reset {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: 100%;
  height: 4.8rem;
}
.kids-drop-wrap.screen-size .drop-list .item-link.reset::before {
  content: "";
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: 0;
  background: transparent url(https://static.gov.kr/content/child/content/images/common/ico/ico_reset.svg) no-repeat center center/contain;
}
.kids-drop-wrap.screen-size .drop-list li:has(.item-link.reset) {
  margin-top: 0.8rem;
  border-bottom: var(--kids-light-border-width-variable-regular) solid #d7d9db;
}
.kids-drop-wrap.drop-left .drop-menu {
  left: 0;
  right: unset;
  transform: none;
}
.kids-drop-wrap.drop-left .drop-menu::before {
  left: 2.4rem;
  margin-left: 0;
}
.kids-drop-wrap.drop-right .drop-menu {
  left: unset;
  right: 0;
  transform: none;
}
.kids-drop-wrap.drop-right .drop-menu::before {
  left: unset;
  right: 2.4rem;
}

/* 푸터 */
#kids-footer {
  position: relative;
  z-index: 50;
  background-color: var(--kids-light-color-surface-gray-subtler);
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-color-light-gray-20);
}
#kids-footer > .inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
  width: 100%;
  position: relative;
}
@media (min-width: 1024px) {
  #kids-footer > .inner {
    gap: var(--kids-gap-6);
    padding: var(--kids-padding-9) 1.6rem var(--kids-padding-8);
  }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  #kids-footer > .inner {
    padding: var(--kids-padding-9) var(--kids-contents-padding-x);
  }
}
@media (max-width: 1023px) {
  #kids-footer > .inner {
    gap: var(--kids-gap-7);
    padding: var(--kids-padding-8) var(--kids-padding-6);
  }
}
@media (max-width: 767px) {
  #kids-footer > .inner {
    align-items: flex-start;
    width: 100%;
    gap: var(--kids-gap-4);
  }
}
#kids-footer .f-cnt {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-5);
  width: 100%;
}
#kids-footer .f-btm {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
  gap: var(--kids-gap-7);
  width: 100%;
}
@media (max-width: 767px) {
  #kids-footer .f-btm {
    gap: var(--kids-gap-6);
  }
}
#kids-footer .f-logo {
  width: 14rem;
  height: 4.5rem;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico_logo_ft.svg);
  background-size: auto 100%;
  background-repeat: no-repeat;
}
#kids-footer .f-logo img {
  width: 100%;
  height: auto;
}
#kids-footer .f-logo + .f-copy {
  align-self: center;
}
#kids-footer .info-addr {
  display: flex;
}
#kids-footer .info-addr dl {
  font-size: 1.7rem;
}
#kids-footer .info-addr dl + dl:before {
  content: "";
  display: inline-flex;
  width: 1px;
  height: 1.2rem;
  margin: 0 var(--kids-gap-3);
  background-color: var(--kids-light-color-divider-gray-dark);
}
#kids-footer .info-addr dl > * {
  display: inline;
}
#kids-footer .info-cs {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-3);
  font-size: 1.7rem;
}
#kids-footer .info-cs .item-tit + .item {
  padding-left: var(--kids-gap-3);
}
#kids-footer .info-cs .item + .item:before {
  content: "";
  display: inline-flex;
  width: 1px;
  height: 1.2rem;
  margin: 0 var(--kids-gap-3);
  background-color: var(--kids-light-color-divider-gray-dark);
}
#kids-footer .f-copy {
  align-self: flex-end;
  font-size: 1.5rem;
  color: var(--kids-light-color-text-subtle);
}

@media (min-width: 768px) and (max-width: 1023px) {
  #kids-footer .info-addr {
    flex-direction: column;
  }
  #kids-footer .info-addr dl + dl:before {
    content: none;
  }
  #kids-footer .info-addr dl > * {
    display: inline;
  }
}
@media (max-width: 767px) {
  #kids-footer > .inner {
    flex-direction: column;
    align-items: flex-start;
  }
  #kids-footer .f-logo {
    width: 8.9rem;
    height: 3rem;
  }
  #kids-footer .f-logo + .f-copy {
    width: 100%;
    padding-top: 0;
    border-top: 0;
  }
  #kids-footer .info-addr {
    flex-direction: column;
  }
  #kids-footer .info-addr dl + dl:before {
    content: none;
  }
  #kids-footer .info-addr dl > * {
    display: inline;
  }
  #kids-footer .info-addr dl span {
    display: block;
  }
  #kids-footer .f-copy {
    align-self: flex-start;
    width: 100%;
    font-size: 1.3rem;
  }
}
/* form 레이아웃 */
.fieldset {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-7);
}

.form-col-group {
  display: flex;
  gap: var(--kids-gap-5);
}
.form-col-group .form-group {
  width: fit-content;
}
@media (max-width: 767px) {
  .form-col-group {
    flex-direction: column;
  }
  .form-col-group .form-group {
    width: 100%;
  }
}

.form-group {
  --kids-form-group--label-font-size: var(
    --kids-font-size-label-small
  );
  --kids-form-group--gap: var(--kids-gap-3);
  --kids-form-group--icon-padding-right: calc(
    var(--kids-padding-10) * 2 + var(--kids-icon--size-large)
  );
  --kids-form-group--message-font-size: var(
    --kids-font-size-label-xsmall
  );
  --kids-form-group--message-text-color: var(
    --kids-light-color-text-subtle
  );
  --kids-form-group--message-success-text-color: var(
    --kids-light-color-text-success
  );
  --kids-form-group--message-information-text-color: var(
    --kids-light-color-text-information
  );
  --kids-form-group--message-error-text-color: var(
    --kids-light-color-text-danger
  );
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-form-group--gap);
  width: 100%;
}
.form-group .form-tit,
.form-group .form-label {
  width: 100%;
  color: var(--kids-light-color-text-subtle);
}
.form-group .form-conts {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-4);
  width: 100%;
}
.form-group .form-conts.keyword-sch {
  width: 58.8rem;
}
.form-group .form-conts .form-label {
  display: flex;
  font-size: var(--kids-form-group--label-font-size);
  width: 100%;
}
@media (max-width: 767px) {
  .form-group .form-conts .form-label {
    font-size: var(--kids-form-group--label-font-size);
  }
}
.form-group .form-conts.btn-ico-wrap {
  position: relative;
}
.form-group .form-conts.btn-ico-wrap .kids-input {
  padding-right: var(--kids-form-group--icon-padding-right);
}
.form-group .form-conts.btn-ico-wrap .btn-group,
.form-group .form-conts.btn-ico-wrap .kids-btn {
  position: absolute;
  top: 50%;
  right: var(--kids-padding-7);
  transform: translateY(-50%);
}
.form-group .form-conts.btn-ico-wrap .btn-group {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-4);
}
.form-group .form-conts.btn-ico-wrap .btn-group .kids-btn {
  position: static;
  transform: translateY(0);
}
.form-conts[data-delete=true] .kids-input:not(:placeholder-shown) ~ .btn-delete-input {
  display: flex;
}
.form-conts[data-delete=true] .kids-input:not(:placeholder-shown) ~ .btn-group .btn-delete-input {
  display: flex;
}

.form-group .form-conts.calendar-conts {
  gap: 0;
}
.form-group > p {
  width: 100%;
}
.form-group [class^=form-hint] {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-2);
  width: 100%;
  font-size: var(--kids-form-group--message-font-size);
  color: var(--kids-form-group--message-text-color);
}
@media (max-width: 767px) {
  .form-group [class^=form-hint] {
    font-size: var(--kids-form-group--message-font-size);
  }
}
.form-group [class^=form-hint]::before {
  display: inline-flex;
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-small);
  height: var(--kids-icon--size-small);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_information.svg);
  background-color: transparent;
}
.form-group [class^=form-hint-]::before {
  display: inline-flex;
  width: var(--kids-icon--size-small);
  height: var(--kids-icon--size-small);
  background-color: var(--kids-light-color-text-basic);
  background-color: transparent !important;
  forced-color-adjust: none;
}
.form-group .form-hint-success {
  color: var(--kids-form-group--message-success-text-color);
}
.form-group .form-hint-success::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_success_fill.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_success_fill.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
}
.form-group .form-hint-information {
  color: var(--kids-form-group--message-information-text-color);
}
.form-group .form-hint-information::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_information_fill.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_information_fill.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
}
.form-group .form-hint-invalid {
  color: var(--kids-form-group--message-error-text-color);
}
.form-group .form-hint-invalid::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_error_fill.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_error_fill.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
}

.kids-form-checks-inline {
  display: flex;
  gap: 1.2rem;
}

.input-group {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-5);
  width: 100%;
}
.input-group.range {
  align-items: flex-end;
  position: relative;
}
.input-group.range > li:not(.mark) {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  flex: 1 1 0px;
  min-width: 0;
  gap: var(--kids-form-group--gap);
  position: relative;
}
.input-group.range > li.mark {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  height: var(--kids-size-height-8);
}
.input-group.range > li.mark.large {
  height: var(--kids-size-height-8);
}
.input-group.range > li.mark.medium {
  height: var(--kids-size-height-7);
}
.input-group.range > li.mark.small {
  height: var(--kids-size-height-6);
}

.row .input-group {
  flex-direction: column;
}
.row .input-group.range > li {
  width: 100%;
}

@media (max-width: 767px) {
  .form-group .form-conts.keyword-sch {
    width: 100%;
  }
}
/* 헤더 */
#kids-header {
  --kids-header--utility-gap: var(--kids-gap-4);
  --kids-header--container-gap: var(--kids-gap-2);
  --kids-header--container-padding-top: var(--kids-padding-5);
  --kids-header--container-padding-bottom: var(--kids-padding-6);
  --kids-header--navi-min-height: var(--kids-size-height-6);
  --kids-header--navi-gap: var(--kids-gap-2) var(--kids-gap-3);
  --kids-header--navi-padding: 0 var(--kids-padding-5);
  --kids-header--navi-border-radius: var(--kids-radius-medium1);
  --kids-header--logo-border: #B2B2B2;
  --kids-header--navi-font-size-pc: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-header--navi-font-size-mobile: var(
    --kids-font-size-navigation-depth-small
  );
  --kids-header--color-surface: var(
    --kids-light-color-surface-white
  );
  --kids-header--utility-color-divider: var(
    --kids-light-color-divider-gray-light
  );
  --kids-header--navi-color-text: var(
    --kids-light-color-text-basic
  );
  --kids-header--navi-color-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-header--navi-color-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  position: sticky;
  top: 0;
  left: 0;
  z-index: 1000;
  background-color: var(--kids-header--color-surface);
}
#kids-header .header-in {
  position: relative;
  transform: translateY(0);
}
#kids-header .header-utility {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: row;
}
#kids-header .header-utility .utility-list {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: row;
}
#kids-header .header-utility .utility-list > li {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
}
#kids-header .header-utility .utility-list > li:not(:first-child) {
  gap: var(--kids-header--utility-gap);
  margin-left: var(--kids-header--utility-gap);
}
#kids-header .header-utility .utility-list > li:not(:first-child)::before {
  display: inline-flex;
  content: "";
  width: 0.1rem;
  height: var(--kids-size-height-2);
  background-color: var(--kids-header--utility-color-divider);
}
#kids-header .header-container .inner {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: row;
}
@media (min-width: 1024px) {
  #kids-header .header-container .inner {
    padding-top: 1.7rem;
    padding-bottom: 1rem;
  }
}
#kids-header .header-container .logo {
  display: flex;
  align-self: center;
  width: 100%;
  align-items: center;
}
#kids-header .header-container .logo a {
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
#kids-header .header-container .logo .logo-kids {
  width: 19.2rem;
  height: 4.8rem;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico_logo.svg);
  background-size: 100% auto;
  background-position: left;
}
#kids-header .header-container .logo .logo-gov {
  display: flex;
  align-items: center;
}
#kids-header .header-container .logo .logo-gov a {
  width: 9.9rem;
  height: 3.2rem;
  display: inline-block;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico_logo_gov.svg);
  background-size: auto 100%;
  background-position: right;
}
#kids-header .header-container .logo .logo-gov:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 0.1rem;
  height: 2rem;
  margin: 0 1.7rem;
  background-color: var(--kids-color-light-gray-20);
}
#kids-header .header-container .utility-wrap {
  flex: 1;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  flex-direction: column;
  gap: var(--kids-header--container-gap);
}
#kids-header .header-container .header-actions {
  display: inline-flex;
  gap: var(--kids-gap-3);
  margin-left: auto;
  padding: var(--kids-padding-1) 0;
}
#kids-header .header-container .header-actions .kids-drop-wrap.kids-language [class*=-btn] {
  padding-left: var(--kids-padding-5);
  font-weight: var(--kids-font-weight-bold);
}
#kids-header .header-container .btn-navi {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  flex-direction: column;
  gap: var(--kids-header--navi-gap);
  min-height: var(--kids-header--navi-min-height);
  padding: var(--kids-header--navi-padding);
  border-radius: var(--kids-header--navi-border-radius);
  font-size: var(--kids-header--navi-font-size-pc);
  font-weight: var(--kids-font-weight-bold);
  color: var(--kids-header--navi-color-text);
  transition: var(--kids-transition-base);
}
#kids-header .header-container .btn-navi::before {
  display: inline-flex;
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
}
#kids-header .header-container .btn-navi.navi-row {
  flex-direction: row;
}
#kids-header .header-container .btn-navi.sch::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_sch.svg);
  background-color: transparent;
}
#kids-header .header-container .btn-navi.login::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_login.svg);
  background-color: transparent;
}
#kids-header .header-container .btn-navi.join::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_join.svg);
  background-color: transparent;
}
#kids-header .header-container .btn-navi.my::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_my.svg);
  background-color: transparent;
}
#kids-header .header-container .btn-navi.all {
  padding-top: 0.65rem;
  padding-bottom: 0.25rem;
}
#kids-header .header-container .btn-navi.all::before {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_all.svg);
  background-color: transparent;
}

/* 스크롤 동작 */
#wrap[class*=scroll] #kids-header:not(.sample) {
  position: relative;
  z-index: 1000;
  border-bottom: 0.1rem solid var(--kids-header--utility-color-divider);
}
#wrap[class*=scroll] #kids-header:not(.sample) .header-in {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  background-color: var(--kids-header--color-surface);
  transition: transform ease 0.4s 0.01s;
}
#wrap.scroll-down #kids-header:not(.sample) .header-in {
  transform: translateY(-100%);
}
#wrap.scroll-up #kids-header:not(.sample) .header-in {
  transform: translateY(0);
}

@media (min-width: 1024px) {
  #kids-header .header-container .btn-navi.all {
    display: none;
  }
  #kids-header .header-container .btn-navi .header-utility {
    display: none;
  }
  .is-gnb-web {
    overflow: hidden;
  }
  .is-gnb-web #wrap.scroll-down #kids-header .header-in {
    transform: translateY(0);
  }
  .is-gnb-web.hasScrollY #kids-masthead,
  .is-gnb-web.hasScrollY #kids-header .header-container,
  .is-gnb-web.hasScrollY #kids-header .kids-main-menu,
  .is-gnb-web.hasScrollY #kids-header .gnb-toggle-wrap,
  .is-gnb-web.hasScrollY #container,
  .is-gnb-web.hasScrollY #kids-footer {
    padding-right: 1.7rem;
  }
  .is-gnb-web.hasScrollY #kids-footer .foot-quick {
    padding-right: 1.7rem;
    margin-right: -1.7rem;
  }
}
@media (max-width: 1023px) {
  #kids-header .header-container .inner {
    align-self: center;
    padding-top: var(--kids-gap-3);
    padding-bottom: var(--kids-gap-3);
    border-bottom: var(--kids-light-border-width-static-regular) solid var(--kids-light-color-divider-gray-light);
  }
  #kids-header .header-container .logo .logo-kids {
    width: 15.6rem;
    height: 2.239rem;
    background-size: contain;
  }
  #kids-header .header-container .logo .logo-gov {
    display: none;
  }
  #kids-header .header-container .logo .logo-gov a {
    width: 8rem;
    height: 2.6rem;
  }
  #kids-header .header-container .logo .logo-gov::after {
    margin: 0 1.6rem;
  }
  #kids-header .header-container .kids-drop-wrap,
  #kids-header .header-container .btn-navi.sch,
  #kids-header .header-container .header-utility {
    display: none;
  }
  #kids-header .header-container .btn-navi.navi-row {
    flex-direction: column;
  }
  #kids-header .header-container .btn-navi.join, #kids-header .header-container .btn-navi.my {
    display: none;
  }
  #kids-header .header-container .my-drop {
    display: none;
  }
}
@media (max-width: 767px) {
  #kids-header .header-container .logo .logo-gov {
    display: none;
  }
  #kids-header .header-container .header-actions {
    gap: 0;
  }
  #kids-header .header-container .btn-navi {
    flex-direction: column;
    font-size: var(--kids-header--navi-font-size-mobile);
  }
}
/* 입력 필드 / 텍스트 영역 */
.kids-input {
  --kids-input--color-surface: var(
    --kids-light-color-input-surface
  );
  --kids-input--color-surface-readonly: var(
    --kids-light-color-input-surface-disabled
  );
  --kids-input--color-surface-disabled: var(
    --kids-light-color-input-surface-disabled
  );
  --kids-input--color-surface-error: var(
    --kids-light-color-input-surface
  );
  --kids-input--color-border: var(
    --kids-light-color-input-border
  );
  --kids-input--color-border-active: var(
    --kids-light-color-input-border-active
  );
  --kids-input--color-border-readonly: var(
    --kids-light-color-input-border-disabled
  );
  --kids-input--color-border-disabled: var(
    --kids-light-color-input-border-disabled
  );
  --kids-input--color-border-error: var(
    --kids-light-color-input-border-error
  );
  --kids-input--color-text: var(--kids-light-color-text-subtle);
  --kids-input--color-text-active: var(
    --kids-light-color-text-basic
  );
  --kids-input--color-text-readonly: var(
    --kids-light-color-text-subtle
  );
  --kids-input--color-text-disabled: var(
    --kids-light-color-text-disabled-on
  );
  --kids-input--color-text-placeholder: var(
    --kids-light-color-text-disabled
  );
  --kids-input--color-text-error: var(
    --kids-light-color-text-subtle
  );
  --kids-input--padding-x: var(--kids-number-10);
  --kids-input--size-height-small: var(--kids-size-height-6);
  --kids-input--radius-small: var(--kids-radius-medium1);
  --kids-input--font-size-small: var(--kids-font-size-label-small);
  --kids-input--size-height-medium: var(--kids-size-height-7);
  --kids-input--radius-medium: var(--kids-radius-medium2);
  --kids-input--font-size-medium: 1.8rem;
  --kids-input--size-height-large: var(--kids-size-height-8);
  --kids-input--radius-large: var(--kids-radius-medium3);
  --kids-input--font-size-large: 1.8rem;
  --kids-input--size-height-xlarge: var(--kids-size-height-11);
  --kids-input--radius-xlarge: var(--kids-radius-large2);
  --kids-input--font-size-xlarge: var(--kids-font-size-heading-medium);
}
.kids-input {
  height: var(--kids-input--size-height-large);
  border-radius: var(--kids-input--radius-large);
  font-size: var(--kids-input--font-size-large);
}
.kids-input.small {
  height: var(--kids-input--size-height-small);
  border-radius: var(--kids-input--radius-small);
  font-size: var(--kids-input--font-size-small);
}
.kids-input.medium {
  height: var(--kids-input--size-height-medium);
  border-radius: var(--kids-input--radius-medium);
  font-size: var(--kids-input--font-size-medium);
}
.kids-input.large {
  height: var(--kids-input--size-height-large);
  border-radius: var(--kids-input--radius-large);
  font-size: var(--kids-input--font-size-large);
}
.kids-input.xlarge {
  height: var(--kids-input--size-height-xlarge);
  border-radius: var(--kids-input--radius-xlarge);
  font-size: var(--kids-input--font-size-xlarge);
  font-weight: var(--kids-font-weight-bold);
}
.kids-input {
  position: relative;
  width: 100%;
  padding: 0 var(--kids-input--padding-x);
  border-width: var(--kids-light-border-width-variable-regular);
  background-color: var(--kids-input--color-surface);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-input--color-border);
  font-family: inherit;
  color: var(--kids-input--color-text);
  transition: var(--kids-transition-base);
}
.kids-input:focus, .kids-input.focus {
  border-color: var(--kids-input--color-border-active);
  border-width: 2px;
  outline: none;
  box-shadow: none;
}
.kids-input[readonly] {
  background-color: var(--kids-input--color-surface-readonly);
  border-color: var(--kids-input--color-border-readonly);
  color: var(--kids-input--color-text-readonly);
}
.kids-input[readonly].datepicker {
  background-color: var(--kids-input--color-surface);
  border-color: var(--kids-input--color-border);
  color: var(--kids-input--color-text);
}
.kids-input[readonly]:focus {
  border-color: var(--kids-input--color-border-active);
}
.kids-input[disabled] {
  background-color: var(--kids-input--color-surface-disabled);
  border-color: var(--kids-input--color-border-disabled);
  color: var(--kids-input--color-text-disabled);
}
.kids-input::-webkit-input-placeholder {
  color: var(--kids-input--color-text-placeholder);
}
.kids-input::-moz-placeholder {
  color: var(--kids-input--color-text-placeholder);
}
.kids-input:-ms-input-placeholder {
  color: var(--kids-input--color-text-placeholder);
}
.kids-input::-ms-input-placeholder {
  color: var(--kids-input--color-text-placeholder);
}
.kids-input:not(textarea):placeholder-shown {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

textarea.kids-input {
  --kids-input--textarea-size-height: 14.4rem;
  --kids-input--textarea-padding-x: var(--kids-padding-8);
  --kids-input--textarea-padding-y: var(--kids-padding-3);
  height: var(--kids-input--textarea-size-height);
  padding: var(--kids-input--textarea-padding-y) var(--kids-input--textarea-padding-x);
  line-height: var(--kids-transition-base);
}

.is-error .kids-input {
  background-color: var(--kids-input--color-surface-error);
  border-color: var(--kids-input--color-border-error);
  border-width: 2px;
  color: var(--kids-input--color-text-error);
}
.is-error .kids-input:focus {
  border-color: var(--kids-input--color-border-active);
}

.textarea-wrap {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-3);
  width: 100%;
}

.textarea-count {
  --kids-input--count-number-font-size: var(
    --kids-font-size-body-small
  );
  --kids-input--count-number-font-size: var(
    --kids-font-size-body-small
  );
  --kids-input--count-number-color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-input--count-number-color-text-active: var(
    --kids-light-color-text-primary
  );
  --kids-input--count-number-color-text-error: var(
    --kids-light-color-text-danger
  );
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row;
  gap: var(--kids-gap-1);
  width: 100%;
  font-size: var(--kids-input--count-number-font-size);
  color: var(--kids-input--count-number-color-text);
}
.textarea-count .count-now {
  color: var(--kids-input--count-number-color-text-active);
}

.is-error .textarea-count .count-now {
  color: var(--kids-input--count-number-color-text-error);
}

.textarea-bottom {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-5);
}
.textarea-bottom .textarea-count {
  margin-left: auto;
  flex-basis: content;
  order: 2;
}
.textarea-bottom .form-hint-invalid {
  font-size: var(--kids-font-size-body-xsmall);
  align-items: flex-start;
  order: 1;
}
.textarea-bottom .form-hint-invalid::before {
  flex: none;
}

/* 날짜선택 */
.calendar-input {
  --kids-input--color-surface: var(
    --kids-light-color-input-surface
  );
  position: relative;
  z-index: 1;
  width: 100%;
}
.calendar-input .kids-input {
  padding-right: var(--kids-form-group--icon-padding-right);
  background-image: none;
}
.calendar-input .kids-btn {
  position: absolute;
  top: 50%;
  right: var(--kids-padding-7);
  transform: translateY(-50%);
}
.calendar-input .range::after {
  display: none;
}

/* 메인 메뉴 */
/* gnb pc */
.kids-main-menu {
  --kids-main-menu--main-trigger-size-height: var(
    --kids-size-height-8
  );
  --kids-main-menu--main-trigger-padding-x: var(--kids-padding-6);
  --kids-main-menu--main-trigger-font-size: var(
    --kids-font-size-navigation-title-small
  );
  --kids-main-menu--main-menu-width: 26.6rem;
  --kids-main-menu--sub-trigger-padding-x: var(--kids-padding-8);
  --kids-main-menu--sub-trigger-padding-y: var(--kids-padding-6);
  --kids-main-menu--sub-trigger-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-trigger-font-size-active: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-menu-padding-x: var(--kids-padding-10);
  --kids-main-menu--sub-menu-padding-y: var(--kids-padding-6);
  --kids-main-menu--sub-menu-title-size-height: var(
    --kids-size-height-8
  );
  --kids-main-menu--sub-menu-title-padding-x: var(--kids-padding-2);
  --kids-main-menu--sub-menu-title-radius: var(
    --kids-radius-medium3
  );
  --kids-main-menu--sub-menu-title-font-size: var(
    --kids-font-size-navigation-title-medium
  );
  --kids-main-menu--sub-menu-trigger-color-padding-x: var(
    --kids-padding-3
  );
  --kids-main-menu--sub-menu-trigger-color-padding-y: var(
    --kids-padding-4
  );
  --kids-main-menu--sub-menu-trigger-color-radius: var(
    --kids-radius-medium2
  );
  --kids-main-menu--sub-menu-trigger-color-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-menu-description-title-font-size: var(
    --kids-font-size-navigation-title-small
  );
  --kids-main-menu--sub-menu-description-title-padding: var(
    --kids-padding-2
  );
  --kids-main-menu--sub-menu-description-title-radius: var(
    --kids-radius-medium1
  );
  --kids-main-menu--sub-menu-description-description-color-padding-top: var(
    --kids-padding-6
  );
  --kids-main-menu--sub-menu-description-description-color-padding-x: var(
    --kids-padding-2
  );
  --kids-main-menu--sub-menu-description-description-color-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-menu-only-2depth-padding-y: var(
    --kids-padding-6
  );
  --kids-main-menu--banner-padding-x: var(--kids-padding-6);
  --kids-main-menu--banner-padding-y: var(--kids-padding-5);
  --kids-main-menu--banner-radius: var(--kids-radius-medium3);
  --kids-main-menu--column-banner-margin-x: var(--kids-padding-6);
  --kids-main-menu--column-banner-padding: var(--kids-padding-8);
  --kids-main-menu--column-banner-radius: var(
    --kids-radius-medium3
  );
  --kids-main-menu--color-surface: var(
    --kids-light-color-surface-white
  );
  --kids-main-menu--color-border: var(
    --kids-light-color-divider-gray-light
  );
  --kids-main-menu--main-trigger-color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-main-menu--main-trigger-color-text-active: var(
    --kids-light-color-text-basic
  );
  --kids-main-menu--main-trigger-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-main-menu--main-trigger-color-action-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  --kids-main-menu--main-trigger-color-border-selected: var(
    --kids-light-color-action-secondary-active
  );
  --kids-main-menu--toggle-color-surface: var(
    --kids-light-color-surface-white-subtle
  );
  --kids-main-menu--main-menu-color-surface: var(
    --kids-light-color-surface-secondary-subtler
  );
  --kids-main-menu--sub-trigger-color-text: var(
    --kids-light-color-text-basic
  );
  --kids-main-menu--sub-trigger-color-text-selected: var(
    --kids-light-color-text-secondary
  );
  --kids-main-menu--sub-trigger-color-text-pressed: var(
    --kids-light-color-text-basic
  );
  --kids-main-menu--sub-trigger-color-action: var(
    --kids-light-color-action-secondary-on
  );
  --kids-main-menu--sub-trigger-color-action-selected: var(
    --kids-light-color-action-secondary-on-selected
  );
  --kids-main-menu--sub-trigger-color-action-pressed: var(
    --kids-light-color-action-secondary-on-pressed
  );
  --kids-main-menu--sub-menu-color-action: var(
    --kids-light-color-action-secondary
  );
  --kids-main-menu--sub-menu-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-main-menu--sub-menu-color-action-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  --kids-main-menu--sub-menu-trigger-color-action-selected: var(
    --kids-light-color-action-secondary-selected
  );
  --kids-main-menu--sub-menu-trigger-color-text-selected: var(
    --kids-light-color-text-secondary
  );
  --kids-main-menu--sub-menu-description-description-color-border: var(
    --kids-light-color-border-gray-light
  );
  --kids-main-menu--sub-menu-description-description-color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-main-menu--banner-background: var(
    --kids-light-color-surface-gray-subtle
  );
  position: relative;
  background-color: var(--kids-main-menu--color-surface);
  border-top: 0.1rem solid;
  border-bottom: 0.1rem solid;
  border-color: var(--kids-main-menu--color-border);
}
.kids-main-menu .gnb-menu {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-5);
}
.kids-main-menu .gnb-menu .gnb-main-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-3);
  position: relative;
  height: var(--kids-main-menu--main-trigger-size-height);
  color: var(--kids-main-menu--main-trigger-color-text);
  padding: 0 var(--kids-main-menu--main-trigger-padding-x);
  transition: var(--kids-transition-base);
}
.kids-main-menu .gnb-menu .gnb-main-trigger,
.kids-main-menu .gnb-menu .gnb-main-trigger h2 {
  font-size: var(--kids-main-menu--main-trigger-font-size);
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu .gnb-menu .gnb-main-trigger::before, .kids-main-menu .gnb-menu .gnb-main-trigger::after {
  display: inline-flex;
  content: "";
}
.kids-main-menu .gnb-menu .gnb-main-trigger::before {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 0.4rem;
  background-color: var(--kids-main-menu--main-trigger-color-border-selected);
  transition: var(--kids-transition-base);
}
.kids-main-menu .gnb-menu .gnb-main-trigger::after {
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  transition: var(--kids-transition-base);
  transform: rotate(0deg);
}
.kids-main-menu .gnb-menu .gnb-main-trigger:hover {
  background-color: var(--kids-main-menu--main-trigger-color-action-hover);
}
.kids-main-menu .gnb-menu .gnb-main-trigger:active {
  color: var(--kids-main-menu--main-trigger-color-text-active);
  background-color: var(--kids-main-menu--main-trigger-color-action-pressed);
}
.kids-main-menu .gnb-menu .gnb-main-trigger:focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.kids-main-menu .gnb-menu .gnb-main-trigger.active::before {
  left: 0;
  width: 100%;
}
.kids-main-menu .gnb-menu .gnb-main-trigger.active::after {
  transform: rotate(-180deg);
}
.kids-main-menu .gnb-menu .gnb-main-trigger.is-link::after {
  display: none;
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .kids-main-menu .gnb-menu .gnb-main-trigger {
    --kids-main-menu--main-trigger-padding-x: var(
      --kids-padding-3
    );
  }
}
.kids-main-menu .gnb-toggle-wrap {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 0.1rem;
  display: none;
  width: 100%;
  background-color: var(--kids-main-menu--toggle-color-surface);
}
.kids-main-menu .gnb-toggle-wrap.is-open {
  display: block;
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list {
  display: flex;
  position: relative;
  max-width: var(--kids-contents-size);
  margin: 0 auto;
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list > ul {
  position: relative;
  padding: var(--kids-padding-6) 0;
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list > ul > li {
  width: var(--kids-main-menu--main-menu-width);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-toggle-title {
  flex: 0.32763;
  padding: 1rem 0.4rem;
  margin-top: 1.6rem;
  font-size: var(--kids-font-size-heading-medium);
  font-weight: 700;
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  width: 100%;
  gap: var(--kids-gap-7);
  padding: var(--kids-main-menu--sub-trigger-padding-y) var(--kids-main-menu--sub-trigger-padding-x);
  background-color: var(--kids-main-menu--sub-trigger-color-action);
  font-size: var(--kids-main-menu--sub-trigger-font-size);
  color: var(--kids-main-menu--sub-trigger-color-text);
  text-align: left;
  transition: var(--kids-transition-base);
  border-radius: var(--kids-number-5);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger::after {
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  content: "";
  flex-shrink: 0;
  transition: var(--kids-transition-base);
  transform: rotate(-90deg);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger .svg-icon {
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  flex-shrink: 0;
  transition: var(--kids-transition-base);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger:hover, .kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger.active {
  font-size: var(--kids-main-menu--sub-trigger-font-size-active);
  font-weight: var(--kids-font-weight-bold);
  background-color: var(--kids-main-menu--sub-trigger-color-action-selected);
  color: var(--kids-main-menu--sub-trigger-color-text-selected);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger:hover .svg-icon, .kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger.active .svg-icon {
  background-color: var(--kids-main-menu--sub-trigger-color-text-selected);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger:active {
  font-size: var(--kids-main-menu--sub-trigger-font-size-active);
  font-weight: var(--kids-font-weight-bold);
  background: var(--kids-main-menu--sub-trigger-color-action-pressed);
  color: var(--kids-main-menu--sub-trigger-color-text-pressed);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger:active .svg-icon {
  background-color: var(--kids-main-menu--sub-trigger-color-text-pressed);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger:focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger.is-link {
  justify-content: flex-start;
  gap: var(--kids-gap-3);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger.is-link::after {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_more.svg);
  background-color: transparent;
  transform: rotate(0);
}
.kids-main-menu .gnb-toggle-wrap .gnb-main-list .gnb-sub-trigger.is-link.external-link::after {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_go.svg);
  background-color: transparent;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list {
  flex-direction: column;
  align-items: normal;
  gap: var(--kids-gap-5);
  position: absolute;
  top: 0;
  left: var(--kids-main-menu--main-menu-width);
  right: 0;
  display: none;
  min-height: 100%;
  padding: var(--kids-main-menu--sub-menu-padding-y) var(--kids-main-menu--sub-menu-padding-x);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  flex: 1;
  gap: var(--kids-gap-5);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content .sub-title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-5);
  height: var(--kids-main-menu--sub-menu-title-size-height);
  padding: 0 var(--kids-padding-2);
  font-size: var(--kids-main-menu--sub-menu-title-font-size);
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: var(--kids-gap-7);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  width: 100%;
  gap: var(--kids-gap-3);
  padding: var(--kids-main-menu--sub-menu-trigger-color-padding-y) var(--kids-main-menu--sub-menu-trigger-color-padding-x);
  background-color: var(--kids-main-menu--sub-menu-color-action);
  border-radius: var(--kids-main-menu--sub-menu-trigger-color-radius);
  font-size: var(--kids-main-menu--sub-menu-trigger-color-font-size);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a::before,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  margin-top: var(--kids-padding-4);
  background-color: var(--kids-light-color-text-basic);
  border-radius: var(--kids-radius-max);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a:hover,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button:hover {
  background-color: var(--kids-main-menu--sub-menu-color-action-hover);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a:active, .kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a:focus,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button:active,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button:focus {
  background-color: var(--kids-main-menu--sub-menu-color-action-pressed);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a:focus,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button:focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a.active,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button.active {
  background-color: var(--kids-main-menu--sub-menu-trigger-color-action-selected);
  color: var(--kids-main-menu--sub-menu-trigger-color-text-selected);
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul a.active::before,
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul button.active::before {
  background-color: var(--kids-main-menu--sub-menu-trigger-color-text-selected);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description {
  gap: var(--kids-gap-9);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-2);
  padding: 0;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li::before {
  display: none;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li .tit {
  font-size: var(--kids-main-menu--sub-menu-description-title-font-size);
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li .tit a {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  width: auto;
  padding: var(--kids-main-menu--sub-menu-description-title-padding);
  background-color: var(--kids-main-menu--sub-menu-color-action);
  border-radius: var(--kids-main-menu--sub-menu-description-title-radius);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li .tit a::before {
  display: none;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li .tit a:hover {
  background-color: var(--kids-main-menu--sub-menu-color-action-hover);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li .tit a:active {
  background-color: var(--kids-main-menu--sub-menu-color-action-pressed);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-content > ul.type-description li .txt {
  padding: var(--kids-main-menu--sub-menu-description-description-color-padding-top) var(--kids-main-menu--sub-menu-description-description-color-padding-x) 0;
  border-top: 0.1rem solid var(--kids-main-menu--sub-menu-description-description-color-border);
  font-size: var(--kids-main-menu--sub-menu-description-description-color-font-size);
  color: var(--kids-main-menu--sub-menu-description-description-color-text);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list .gnb-sub-banner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-5);
  margin: 0;
  padding: var(--kids-main-menu--banner-padding-y) var(--kids-main-menu--banner-padding-x);
  border-radius: var(--kids-main-menu--banner-radius);
  background: var(--kids-main-menu--banner-background);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.between {
  flex-direction: row;
  padding-right: 0;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.between .gnb-sub-content > ul {
  grid-template-columns: repeat(2, 1fr);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.between .gnb-sub-banner {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  width: var(--kids-main-menu--main-menu-width);
  gap: var(--kids-gap-3);
  padding: var(--kids-main-menu--column-banner-padding);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.single-list {
  display: flex;
  position: static;
  padding: var(--kids-main-menu--sub-menu-only-2depth-padding-y) 0;
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.single-list .gnb-sub-content > ul {
  grid-template-columns: repeat(4, 1fr);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.single-list.between .gnb-sub-content > ul {
  grid-template-columns: repeat(3, 1fr);
}
.kids-main-menu .gnb-toggle-wrap .gnb-sub-list.active {
  display: flex;
}

.gnb-backdrop {
  --kids-main-menu--color-dim: var(
    --kids-light-color-background-dim
  );
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 60;
  background-color: var(--kids-main-menu--color-dim);
}
.gnb-backdrop.active {
  display: block;
}

/* gnb mobile */
.kids-main-menu-mobile {
  --kids-main-menu--dim-transition: opacity 0.5s 0.1s;
  --kids-main-menu--header-gap: var(--kids-gap-5);
  --kids-main-menu--header-padding-x: var(--kids-padding-6);
  --kids-main-menu--header-padding-top: var(--kids-padding-6);
  --kids-main-menu--header-padding-bottom: var(--kids-padding-8);
  --kids-main-menu--utils-gap-layout-li-li: var(--kids-gap-5);
  --kids-main-menu--utils-line-height: var(--kids-size-height-2);
  --kids-main-menu--login-gap: var(--kids-gap-3);
  --kids-main-menu--service-menu-gap-layout-menu: var(--kids-gap-3);
  --kids-main-menu--service-menu-gap-layout-icon-text: var(
    --kids-gap-1
  );
  --kids-main-menu--service-menu-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--service-menu-icon-size: var(
    --kids-size-height-3
  );
  --kids-main-menu--service-menu-border-radius: var(
    --kids-radius-medium1
  );
  --kids-main-menu--menu-left-width: 12.4rem;
  --kids-main-menu--main-trigger-height: var(--kids-size-height-9);
  --kids-main-menu--main-trigger-padding-x: var(--kids-padding-8);
  --kids-main-menu--main-trigger-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-menu-padding: var(
    --kids-main-menu--header-padding-x
  );
  --kids-main-menu--sub-list-padding-y: var(--kids-padding-3);
  --kids-main-menu--sub-title-font-size: var(
    --kids-font-size-navigation-title-small
  );
  --kids-main-menu--sub-title-padding-x: var(--kids-padding-3);
  --kids-main-menu--sub-title-padding-top: var(--kids-padding-3);
  --kids-main-menu--sub-title-padding-bottom: var(--kids-padding-6);
  --kids-main-menu--sub-menu-trigger-font-size: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-menu-trigger-font-size-active: var(
    --kids-font-size-navigation-depth-medium
  );
  --kids-main-menu--sub-menu-trigger-padding-x: var(
    --kids-padding-3
  );
  --kids-main-menu--sub-menu-trigger-padding-y: var(
    --kids-padding-5
  );
  --kids-main-menu--sub-menu-trigger-border-radius: var(
    --kids-radius-medium3
  );
  --kids-main-menu--depth3-gap: var(--kids-gap-3);
  --kids-main-menu--depth3-sub-menu-gap: var(--kids-gap-3);
  --kids-main-menu--depth3-sub-menu-margin-top: var(--kids-gap-3);
  --kids-main-menu--depth3-sub-menu-padding-x: var(
    --kids-padding-6
  );
  --kids-main-menu--depth3-sub-menu-padding-y: var(
    --kids-padding-4
  );
  --kids-main-menu--depth3-sub-menu-border-radius: var(
    --kids-radius-medium2
  );
  --kids-main-menu--depth4-head-padding: var(--kids-padding-6);
  --kids-main-menu--depth4-body-padding-x: var(
    --kids-main-menu--sub-menu-padding
  );
  --kids-main-menu--depth4-sub-title: var(
    --kids-main-menu--sub-title-font-size
  );
  --kids-main-menu--depth4-sub-title-padding-x: var(
    --kids-main-menu--sub-title-padding-x
  );
  --kids-main-menu--depth4-sub-title-padding-top: var(
    --kids-main-menu--sub-title-padding-top
  );
  --kids-main-menu--depth4-sub-title-padding-bottom: var(
    --kids-main-menu--sub-title-padding-bottom
  );
  --kids-main-menu--depth4-list-gap: var(--kids-gap-3);
  --kids-main-menu--depth4-list-gap-layout-dot-text: var(
    --kids-gap-2
  );
  --kids-main-menu--depth4-list-li-border-radius: var(
    --kids-main-menu--depth3-sub-menu-border-radius
  );
  --kids-main-menu--depth4-list-li-padding-x: var(
    --kids-main-menu--depth3-sub-menu-padding-x
  );
  --kids-main-menu--depth4-list-li-padding-y: var(
    --kids-main-menu--depth3-sub-menu-padding-y
  );
  --kids-main-menu--tab-nav-menu-padding-x: var(
    --kids-main-menu--header-padding-x
  );
  --kids-main-menu--tab-nav-menu-padding-top: var(--kids-padding-6);
  --kids-main-menu--tab-nav-menu-margin-top: var(--kids-padding-8);
  --kids-main-menu--tab-nav-menu-margin-x: var(
    --kids-main-menu--header-padding-x
  );
  --kids-main-menu--tab-nav-menu-list-gap: var(--kids-gap-3);
  --kids-main-menu--tab-nav-menu-list-padding-bottom: var(
    --kids-main-menu--tab-nav-menu-padding-top
  );
  --kids-main-menu--tab-nav-main-trigger-height: var(
    --kids-size-height-6
  );
  --kids-main-menu--tab-nav-main-trigger-padding-x: var(
    --kids-padding-4
  );
  --kids-main-menu--tab-nav-main-trigger-border-radius: var(
    --kids-radius-medium1
  );
  --kids-main-menu--type-tab-sub-list-padding: var(
    --kids-main-menu--header-padding-x
  );
  --kids-main-menu--type-tab-gnb-header-border-bottom-width: 0.4rem;
  --kids-main-menu--type-tab-sub-list-border-bottom-width: var(
    --kids-main-menu--type-tab-gnb-header-border-bottom-width
  );
  --kids-main-menu--type-tab-sub-list-border-bottom-color: var(
    --kids-main-menu--header-color-border
  );
  --kids-main-menu--type-tab-sub-banner-gap: var(--kids-gap-5);
  --kids-main-menu--type-tab-sub-banner-border-radius: var(
    --kids-radius-medium3
  );
  --kids-main-menu--type-tab-sub-banner-padding-x: var(
    --kids-padding-6
  );
  --kids-main-menu--type-tab-sub-banner-padding-y: var(
    --kids-padding-2
  );
  --kids-main-menu--color-dim: var(
    --kids-light-color-background-dim
  );
  --kids-main-menu--color-surface: var(
    --kids-light-color-surface-white
  );
  --kids-main-menu--header-border-width: var(
    --kids-light-border-width-static-regular
  );
  --kids-main-menu--header-color-border: var(
    --kids-light-color-divider-gray-light
  );
  --kids-main-menu--utils-line-width: var(
    --kids-light-border-width-static-regular
  );
  --kids-main-menu--utils-color-border: var(
    --kids-light-color-border-gray-light
  );
  --kids-main-menu--service-menu-color-icon: var(
    --kids-light-color-icon-gray-fill
  );
  --kids-main-menu--service-menu-color-action-active: var(
    --kids-light-color-action-secondary-on-pressed
  );
  --kids-main-menu--menu-color-surface: var(
    --kids-light-color-surface-secondary-subtler
  );
  --kids-main-menu--main-trigger-color-text-active: var(
    --kids-light-color-text-secondary
  );
  --kids-main-menu--main-trigger-color-action-active: var(
    --kids-light-color-action-secondary-on-selected
  );
  --kids-main-menu--main-trigger-color-action-pressed: var(
    --kids-light-color-action-secondary-on-pressed
  );
  --kids-main-menu--sub-menu-color-surface: var(
    --kids-light-color-surface-white-subtle
  );
  --kids-main-menu--sub-title-border-width: var(
    --kids-light-border-width-static-regular
  );
  --kids-main-menu--sub-title-color-border: var(
    --kids-light-color-divider-gray
  );
  --kids-main-menu--sub-menu-trigger-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-main-menu--sub-menu-trigger-color-action-active: var(
    --kids-light-color-action-secondary-selected
  );
  --kids-main-menu--sub-menu-trigger-color-text: var(
    --kids-light-color-text-secondary
  );
  --kids-main-menu--depth3-sub-menu-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-main-menu--depth3-sub-menu-color-action-active: var(
    --kids-light-color-action-secondary-selected
  );
  --kids-main-menu--depth4-color-surface: var(
    --kids-light-color-surface-white-subtle
  );
  --kids-main-menu--depth4-list-li-color-text-hover: var(
    --kids-light-color-text-secondary
  );
  --kids-main-menu--depth4-list-li-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-main-menu--depth4-list-li-color-action-active: var(
    --kids-light-color-action-secondary-selected
  );
  --kids-main-menu--tab-nav-menu-border-top-width: var(
    --kids-light-border-width-static-regular
  );
  --kids-main-menu--tab-nav-menu-color-border-top: var(
    --kids-light-color-divider-gray-light
  );
  --kids-main-menu--tab-nav-main-trigger-color-action: var(
    --kids-light-color-action-white
  );
  --kids-main-menu--tab-nav-main-trigger-color-action-active: var(
    --kids-light-color-action-secondary-selected
  );
  --kids-main-menu--tab-nav-main-trigger-border-width: var(
    --kids-light-border-width-static-regular
  );
  --kids-main-menu--tab-nav-main-trigger-color-border: var(
    --kids-light-color-border-gray
  );
  --kids-main-menu--type-tab-menu-color-surface: var(
    --kids-light-color-surface-white-subtle
  );
  --kids-main-menu--type-tab-sub-banner-color-surface: var(
    --kids-light-color-surface-gray-subtler
  );
  --kids-main-menu--search-layer-body-background: var(
    --kids-light-color-surface-gray-subtler
  );
  position: fixed;
  top: 0;
  right: -100%;
  z-index: 100;
  width: 100%;
  height: 100%;
  visibility: hidden;
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile::after {
  display: none;
  opacity: 0;
  content: "";
  position: fixed;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: var(--kids-main-menu--color-dim);
  transition: var(--kids-main-menu--dim-transition);
}
.kids-main-menu-mobile.is-open {
  visibility: visible;
  right: 0;
}
.kids-main-menu-mobile.is-open::after {
  opacity: 1;
}
.kids-main-menu-mobile.is-backdrop::after {
  display: block;
}
.kids-main-menu-mobile .gnb-wrap {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 5;
  height: 100%;
  background-color: var(--kids-main-menu--color-surface);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-main-menu--header-gap);
  padding: 2.3rem 2.4rem;
  border-bottom: 4px solid var(--kids-color-light-gray-20);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-utils {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-utils .utility-list {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-utils .utility-list > li {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-utils .utility-list > li:not(:first-child) {
  margin-left: var(--kids-main-menu--utils-gap-layout-li-li);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-utils .utility-list > li:not(:first-child)::before {
  content: "";
  width: var(--kids-main-menu--utils-line-width);
  height: var(--kids-main-menu--utils-line-height);
  margin-right: var(--kids-main-menu--utils-gap-layout-li-li);
  background-color: var(--kids-main-menu--utils-color-border);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-login {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-main-menu--login-gap);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-login .user,
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-login button {
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-service-menu {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: row;
  gap: var(--kids-main-menu--service-menu-gap-layout-menu);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-service-menu .link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: var(--kids-main-menu--service-menu-gap-layout-icon-text);
  font-size: var(--kids-main-menu--service-menu-font-size);
  font-weight: var(--kids-font-weight-bold);
  width: 8rem;
  height: 5.6rem;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-service-menu .link::before {
  display: inline-flex;
  content: "";
  width: var(--kids-main-menu--service-menu-icon-size);
  height: var(--kids-main-menu--service-menu-icon-size);
  background-color: var(--kids-main-menu--service-menu-color-icon);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-service-menu .link:active {
  border-radius: var(--kids-main-menu--service-menu-border-radius);
  background-color: var(--kids-main-menu--service-menu-color-action-active);
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-logo {
  display: flex;
  align-self: center;
  width: 100%;
  align-items: center;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-logo a {
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-logo .logo-kids {
  width: 15.6rem;
  height: 2.239rem;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico_logo.svg);
  background-position: left;
  background-size: contain;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-logo .logo-gov {
  display: flex;
  align-items: center;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-logo .logo-gov a {
  width: 8rem;
  height: 2.6rem;
  display: inline-block;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico_logo_gov.svg);
  background-size: auto 100%;
  background-position: right;
}
.kids-main-menu-mobile .gnb-wrap .gnb-header .gnb-logo .logo-gov:before {
  content: "";
  display: inline-block;
  vertical-align: top;
  width: 0.1rem;
  height: 2rem;
  margin: 0.3rem 1.6rem 0;
  background-color: var(--kids-color-light-gray-20);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  flex: 1;
  overflow-y: auto;
  scroll-behavior: smooth;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu {
  display: flex;
  position: relative;
  background-color: var(--kids-main-menu--menu-color-surface);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  position: relative;
  top: 0;
  left: 0;
  width: var(--kids-main-menu--menu-left-width);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap > ul {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap .gnb-main-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  position: relative;
  z-index: 1;
  width: 100%;
  height: var(--kids-main-menu--main-trigger-height);
  padding: 0 var(--kids-main-menu--main-trigger-padding-x);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap .gnb-main-trigger, .kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap .gnb-main-trigger > * {
  font-size: var(--kids-main-menu--main-trigger-font-size);
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap .gnb-main-trigger:focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
  background-color: var(--kids-main-menu--main-trigger-color-action-pressed);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .menu-wrap .gnb-main-trigger.active {
  color: var(--kids-main-menu--main-trigger-color-text-active);
  background-color: var(--kids-main-menu--main-trigger-color-action-active);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  flex: 1;
  background-color: var(--kids-main-menu--sub-menu-color-surface);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list {
  padding: var(--kids-main-menu--sub-menu-padding);
  padding-bottom: 0;
  border-bottom: 4px solid var(--kids-color-light-gray-20);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list > ul {
  padding: var(--kids-main-menu--sub-list-padding-y) 0;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .sub-title {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  position: relative;
  font-size: var(--kids-main-menu--sub-title-font-size);
  font-weight: var(--kids-font-weight-bold);
  padding: var(--kids-main-menu--sub-title-padding-top) var(--kids-main-menu--sub-title-padding-x) var(--kids-main-menu--sub-title-padding-bottom);
  border-bottom: var(--kids-main-menu--sub-title-border-width) solid var(--kids-main-menu--sub-title-color-border);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  padding: var(--kids-main-menu--sub-menu-trigger-padding-y) var(--kids-main-menu--sub-menu-trigger-padding-x);
  font-size: var(--kids-main-menu--sub-menu-trigger-font-size);
  border-radius: var(--kids-main-menu--sub-menu-trigger-border-radius);
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger:hover {
  background-color: var(--kids-main-menu--sub-menu-trigger-color-action-hover);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger.selected {
  color: var(--kids-main-menu--sub-menu-trigger-color-text);
  font-size: var(--kids-main-menu--sub-menu-trigger-font-size-active);
  font-weight: var(--kids-font-weight-bold);
  background-color: var(--kids-main-menu--sub-menu-trigger-color-action-active);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger.has-depth3::after {
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  flex-shrink: 0;
  margin-left: auto;
  transition: var(--kids-transition-base);
  transform: rotate(0deg);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger.has-depth3.active {
  background-color: var(--kids-main-menu--depth3-sub-menu-color-action-active);
  color: var(--kids-main-menu--sub-menu-trigger-color-text);
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger.has-depth3.active::after {
  transform: rotate(180deg);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-trigger:hover {
  background-color: transparent;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  margin-top: var(--kids-main-menu--depth3-sub-menu-margin-top);
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap > ul {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-main-menu--depth3-gap);
  overflow: hidden;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap.is-open {
  grid-template-rows: 1fr;
  opacity: 1;
  visibility: visible;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-main-menu--depth3-sub-menu-gap);
  padding: var(--kids-main-menu--depth3-sub-menu-padding-y) var(--kids-main-menu--depth3-sub-menu-padding-x);
  border-radius: var(--kids-main-menu--depth3-sub-menu-border-radius);
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger::before {
  content: "•";
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger:focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger:hover {
  background-color: var(--kids-main-menu--depth3-sub-menu-color-action-hover);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger:active {
  background-color: var(--kids-main-menu--depth3-sub-menu-color-action-active);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger.selected {
  color: var(--kids-main-menu--sub-menu-trigger-color-text);
  font-weight: var(--kids-font-weight-bold);
  background-color: var(--kids-main-menu--sub-menu-trigger-color-action-active);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .depth3-wrap .depth3-trigger.has-depth4::after {
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  flex-shrink: 0;
  margin-left: auto;
  transform: rotate(-90deg);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap {
  display: none;
  position: fixed;
  top: 0;
  right: -100%;
  z-index: 10;
  width: 100%;
  height: 100%;
  background-color: var(--kids-main-menu--depth4-color-surface);
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-head {
  display: flex;
  align-items: normal;
  justify-content: space-between;
  flex-direction: row;
  font-weight: var(--kids-font-weight-bold);
  width: 100%;
  padding: var(--kids-main-menu--depth4-head-padding);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body {
  padding: 0 var(--kids-main-menu--depth4-body-padding-x);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body .sub-title {
  font-size: var(--kids-main-menu--depth4-sub-title);
  padding: var(--kids-main-menu--depth4-sub-title-padding-top) var(--kids-main-menu--depth4-sub-title-padding-x) var(--kids-main-menu--depth4-sub-title-padding-bottom);
  margin: 0;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body .depth4-ul {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-main-menu--depth4-list-gap);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body .depth4-ul a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-main-menu--depth4-list-gap-layout-dot-text);
  padding: var(--kids-main-menu--depth4-list-li-padding-y) var(--kids-main-menu--depth4-list-li-padding-x);
  border-radius: var(--kids-main-menu--depth4-list-li-border-radius);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body .depth4-ul a::before {
  content: "•";
  font-weight: var(--kids-font-weight-regular);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body .depth4-ul a:hover {
  font-weight: var(--kids-font-weight-bold);
  color: var(--kids-main-menu--depth4-list-li-color-text-hover);
  background-color: var(--kids-main-menu--depth4-list-li-color-action-hover);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap .depth4-body .depth4-ul a:active {
  background-color: var(--kids-main-menu--depth4-list-li-color-action-active);
  transition: var(--kids-transition-base);
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-menu .submenu-wrap .depth4-wrap.is-open {
  display: block;
  right: 0;
}
.kids-main-menu-mobile .gnb-wrap .gnb-body .gnb-bottom {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-5);
  padding: var(--kids-padding-6);
}
.kids-main-menu-mobile .gnb-wrap #close-nav {
  position: absolute;
  top: 2.4rem;
  right: var(--kids-main-menu--header-padding-x);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav {
  display: none;
  height: 0;
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav .menu-wrap {
  overflow: hidden;
  margin: var(--kids-main-menu--tab-nav-menu-margin-top) calc(var(--kids-main-menu--tab-nav-menu-margin-x) * -1) 0;
  padding: var(--kids-main-menu--tab-nav-menu-padding-top) var(--kids-main-menu--tab-nav-menu-padding-x) 0;
  border-top: var(--kids-main-menu--tab-nav-menu-border-top-width) solid var(--kids-main-menu--tab-nav-menu-color-border-top);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav .menu-wrap > ul {
  overflow-x: auto;
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-main-menu--tab-nav-menu-list-gap);
  padding-bottom: var(--kids-main-menu--tab-nav-menu-list-padding-bottom);
  scroll-behavior: smooth;
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav .menu-wrap > ul .gnb-main-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  padding: 0 var(--kids-main-menu--tab-nav-main-trigger-padding-x);
  height: var(--kids-main-menu--tab-nav-main-trigger-height);
  border: var(--kids-main-menu--tab-nav-main-trigger-border-width) solid var(--kids-main-menu--tab-nav-main-trigger-color-border);
  border-radius: var(--kids-main-menu--tab-nav-main-trigger-border-radius);
  background-color: var(--kids-main-menu--tab-nav-main-trigger-color-action);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav .menu-wrap > ul .gnb-main-trigger, .kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav .menu-wrap > ul .gnb-main-trigger > * {
  font-size: var(--kids-font-size-body-medium);
  font-weight: var(--kids-font-weight-regular);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-tab-nav .menu-wrap > ul .gnb-main-trigger.active {
  background-color: var(--kids-main-menu--tab-nav-main-trigger-color-action-active);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab.is-active .gnb-header {
  padding-bottom: 0;
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab.is-active .gnb-tab-nav {
  display: block;
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-header {
  border-bottom-width: var(--kids-main-menu--type-tab-gnb-header-border-bottom-width);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-body .gnb-menu {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  background-color: var(--kids-main-menu--type-tab-menu-color-surface);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list {
  padding: var(--kids-main-menu--type-tab-sub-list-padding);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list:not(:last-child) {
  border-bottom: var(--kids-main-menu--type-tab-sub-list-border-bottom-width) solid var(--kids-main-menu--type-tab-sub-list-border-bottom-color);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-body .gnb-menu .submenu-wrap .gnb-sub-list .gnb-sub-banner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-main-menu--type-tab-sub-banner-gap);
  padding: var(--kids-main-menu--type-tab-sub-banner-padding-y) var(--kids-main-menu--type-tab-sub-banner-padding-x);
  border-radius: var(--kids-main-menu--type-tab-sub-banner-border-radius);
  background-color: var(--kids-main-menu--type-tab-sub-banner-color-surface);
}
.kids-main-menu-mobile .gnb-wrap.type-header-tab .gnb-bottom {
  border-top: var(--kids-main-menu--type-tab-sub-list-border-bottom-width) solid var(--kids-main-menu--type-tab-sub-list-border-bottom-color);
}
.kids-main-menu-mobile .search-layer {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  z-index: 10;
  background-color: var(--kids-main-menu--color-surface);
}
.kids-main-menu-mobile .search-layer.active {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
}
.kids-main-menu-mobile .search-layer .search-header {
  margin-top: 0.3rem;
  padding: 5.6rem var(--kids-main-menu--header-padding-x) var(--kids-main-menu--header-padding-bottom);
  border-bottom: var(--kids-main-menu--header-border-width) solid var(--kids-main-menu--header-color-border);
}
.kids-main-menu-mobile .search-layer .search-body {
  overflow-y: auto;
  padding: 0 var(--kids-main-menu--header-padding-x);
  background-color: var(--kids-main-menu--search-layer-body-background);
}
.kids-main-menu-mobile .search-layer .search-body .no-results {
  text-align: center;
  padding: var(--kids-padding-10) 0;
}
.kids-main-menu-mobile .search-layer .search-body .no-results strong {
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu-mobile .search-layer .search-body .result-list {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-5);
  padding: var(--kids-padding-8) 0;
}
.kids-main-menu-mobile .search-layer .search-body .result-list .result-item {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-3);
}
.kids-main-menu-mobile .search-layer .search-body .result-list .result-item a {
  text-decoration: underline;
  text-underline-offset: var(--kids-font-underline-offset);
}
.kids-main-menu-mobile .search-layer .search-body .result-list .result-item .highlight {
  font-weight: var(--kids-font-weight-bold);
}
.kids-main-menu-mobile .search-layer .search-close {
  position: absolute;
  top: 1.6rem;
  right: var(--kids-main-menu--header-padding-x);
}
.kids-main-menu-mobile .dummy-control {
  text-align: left;
}
.kids-main-menu-mobile .dummy-control .dummy-text {
  margin-top: 0.3rem;
  color: var(--kids-input--color-text-placeholder);
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.kids-main-menu-mobile .dummy-control .ico-search {
  right: 1.4rem;
}

@media (min-width: 1024px) {
  .kids-main-menu-mobile {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .kids-main-menu-mobile .gnb-wrap {
    width: 45%;
  }
  .kids-main-menu-mobile .gnb-menu .submenu-wrap .depth4-wrap {
    width: 40%;
  }
}
@media (max-width: 1023px) {
  .kids-main-menu {
    display: none;
  }
  .is-gnb-mobile {
    overflow: hidden;
  }
  .gnb-backdrop {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .kids-main-menu-mobile .gnb-wrap {
    width: 100%;
  }
}
/* 공식 배너 */
#kids-masthead {
  --kids-masthead--color-surface: var(
    --kids-light-color-surface-secondary-subtler
  );
  --kids-masthead--inner-gap-y: var(--kids-gap-2);
  --kids-masthead--inner-gap-x: var(--kids-gap-5);
  --kids-masthead--inner-min-size-height: var(--kids-size-height-5);
  --kids-masthead--inner-padding-y: var(--kids-padding-2);
  --kids-masthead--font-size: var(--kids-font-size-body-small);
  --kids-masthead--font-size: var(--kids-font-size-body-small);
}
@media (max-width: 1023px) {
  #kids-masthead {
    --kids-masthead--inner-padding-y: 0;
  }
}
#kids-masthead {
  position: relative;
  z-index: 70;
  background-color: var(--kids-masthead--color-surface);
}
#kids-masthead .toggle-head .inner {
  position: relative;
  gap: var(--kids-masthead--inner-gap-y) var(--kids-masthead--inner-gap-x);
  min-height: var(--kids-masthead--inner-min-size-height);
  padding-top: var(--kids-masthead--inner-padding-y);
  padding-bottom: var(--kids-masthead--inner-padding-y);
}
#kids-masthead .toggle-head .nuri-txt {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-3);
  font-size: var(--kids-masthead--font-size);
  word-break: break-all;
}
#kids-masthead .toggle-head .nuri-txt::before {
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
  background-color: var(--kids-light-color-text-basic);
  background-color: transparent !important;
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_flag.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_flag.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
}
#kids-masthead .toggle-body {
  height: 0;
  transition: var(--kids-transition-base);
  overflow: hidden;
}
#kids-masthead .inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
}

/* 페이지네이션 */
.kids-pagination {
  --kids-pagination--color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-pagination--color-text-active: var(
    --kids-light-color-text-inverse-static
  );
  --kids-pagination--color-text-disabled: var(
    --kids-light-color-text-disabled
  );
  --kids-pagination--color-action: var(
    --kids-light-color-action-secondary
  );
  --kids-pagination--color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-pagination--color-action-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  --kids-pagination--color-action-active: var(
    --kids-light-color-action-secondary-active
  );
  --kids-pagination-gap: var(--kids-gap-3);
  --kids-pagination-margin-top: 6rem;
  --kids-pagination-margin-top-mobile: 3.2rem;
  --kids-pagination-margin-bottom: var(--kids-number-10);
  --kids-pagination--size-height: var(--kids-size-height-6);
  --kids-pagination--radius: var(--kids-radius-medium1);
  --kids-pagination--prev-btn-padding-left: var(--kids-padding-2);
  --kids-pagination--prev-btn-padding-right: var(--kids-padding-3);
}
@media (max-width: 767px) {
  .kids-pagination {
    --kids-pagination-gap: var(--kids-gap-7) var(--kids-gap-3);
  }
}
.kids-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: var(--kids-pagination-gap);
  width: 100%;
  margin-top: var(--kids-pagination-margin-top);
  margin-bottom: var(--kids-pagination-margin-bottom);
  color: var(--kids-pagination--color-text);
}
.kids-pagination .page-navi,
.kids-pagination .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  height: var(--kids-pagination--size-height);
  background-color: var(--kids-pagination--color-action);
  border-radius: var(--kids-pagination--radius);
  transition: var(--kids-transition-base);
}
.kids-pagination .page-navi:hover,
.kids-pagination .page-link:hover {
  background-color: var(--kids-pagination--color-action-hover);
}
.kids-pagination .page-navi:active,
.kids-pagination .page-link:active {
  background-color: var(--kids-pagination--color-action-pressed);
}
.kids-pagination .page-navi.prev {
  order: 1;
  padding: 0 var(--kids-pagination--prev-btn-padding-right) 0 var(--kids-pagination--prev-btn-padding-left);
}
.kids-pagination .page-navi.prev::before {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  transform: rotate(90deg);
}
.kids-pagination .page-navi.next {
  order: 3;
  padding: 0 var(--kids-pagination--prev-btn-padding-left) 0 var(--kids-pagination--prev-btn-padding-right);
}
.kids-pagination .page-navi.next::after {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-medium);
  height: var(--kids-icon--size-medium);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  transform: rotate(-90deg);
}
.kids-pagination .page-navi.disabled {
  color: var(--kids-pagination--color-text-disabled);
}
.kids-pagination .page-navi.disabled::before, .kids-pagination .page-navi.disabled:after {
  opacity: 0.5;
}
.kids-pagination .page-links {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  order: 2;
  gap: var(--kids-gap-3);
}
.kids-pagination .page-links .page-link {
  width: var(--kids-pagination--size-height);
  height: var(--kids-pagination--size-height);
}
.kids-pagination .page-links .page-link.link-dot {
  display: inline-flex;
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_ellipsis.svg);
  background-color: transparent;
}
.kids-pagination .page-links .page-link.active {
  background-color: var(--kids-pagination--color-action-active);
  font-weight: var(--kids-font-weight-bold);
  color: var(--kids-pagination--color-text-active);
}
.kids-pagination + .helper-box {
  margin-top: var(--kids-padding-10);
}

@media (max-width: 767px) {
  .kids-pagination {
    flex-wrap: wrap;
    margin-top: var(--kids-pagination-margin-top-mobile);
  }
  .kids-pagination .page-links {
    width: 100%;
  }
  .kids-pagination .page-navi.next {
    transition: none;
    order: 1;
  }
  .kids-pagination + .helper-box {
    margin-top: var(--kids-padding-9);
  }
}
/* ** swiper ** */
.swiper-indicator {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-3);
  flex-shrink: 0;
  position: relative;
}
.swiper-indicator.text-center {
  justify-content: center;
}
.swiper-indicator .swiper-pagination {
  top: auto;
  bottom: auto;
  width: auto;
}
.swiper-indicator .swiper-pagination:not(.swiper-pagination-fraction) {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  height: var(--kids-size-height-6);
  padding: var(--kids-padding-5);
  border-radius: var(--kids-radius-max);
  background-color: var(--kids-light-color-element-inverse);
}
.swiper-indicator .swiper-pagination.swiper-pagination-fraction.swiper-pagination-bg {
  font-weight: var(--kids-font-weight-bold);
  padding: var(--kids-padding-5);
  border-radius: var(--kids-radius-max);
  background-color: var(--kids-light-color-surface-white);
}
.swiper-indicator .swiper-button-next,
.swiper-indicator .swiper-button-prev {
  position: static;
  margin: 0;
  background-color: var(--kids-color-light-gray-0);
}
.swiper-indicator .swiper-navigation {
  display: inline-flex;
  gap: var(--kids-gap-3);
}

.swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  position: relative;
  height: var(--kids-size-height-6);
}
.swiper-pagination .swiper-pagination-bullet {
  width: var(--kids-size-height-1);
  height: var(--kids-size-height-1);
  background-color: var(--kids-light-color-element-gray);
  opacity: 1;
}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 2rem;
  border-radius: var(--kids-radius-max);
  background-color: var(--kids-light-color-element-primary);
}
.swiper-pagination.swiper-pagination-fraction {
  gap: var(--kids-gap-2);
  padding: 0 var(--kids-padding-6);
  color: var(--kids-light-color-text-basic);
  font-weight: var(--kids-font-weight-bold);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray-light);
  border-radius: var(--kids-radius-max);
  background-color: var(--kids-light-color-surface-white);
}
.swiper-pagination.swiper-pagination-fraction .swiper-pagination-current {
  color: var(--kids-color-light-secondary-80);
}

.swiper-btn {
  display: flex;
  gap: var(--kids-gap-3);
}

.swiper-controller {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: var(--kids-gap-3);
}

[class^=swiper-button-] {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  width: var(--kids-size-height-6);
  height: var(--kids-size-height-6);
  flex-shrink: 0;
  background-color: var(--kids-color-light-gray-0);
  border-radius: var(--kids-radius-max);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray-light);
}
[class^=swiper-button-]::after {
  content: "";
  display: inline-flex;
  width: var(--kids-icon--size-large);
  height: var(--kids-icon--size-large);
  background-color: var(--kids-light-color-text-basic);
  forced-color-adjust: none;
  font-size: 0 !important;
}
[class^=swiper-button-] svg {
  display: none;
}

.swiper-button-more::after {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_plus.svg);
  background-color: transparent;
}

.swiper-button-play::after {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_swiper_play.svg);
  background-color: transparent;
}

.swiper-button-stop::after {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_swiper_stop.svg);
  background-color: transparent;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
}
.swiper-button-next:hover,
.swiper-button-prev:hover {
  background-color: var(--kids-light-color-action-secondary-hover);
}
.swiper-button-next:active,
.swiper-button-prev:active {
  background-color: var(--kids-light-color-action-secondary-pressed);
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
  opacity: 1;
}

.swiper-button-next {
  right: 0;
}
.swiper-button-next::after {
  transform: rotate(-90deg);
}

.swiper-button-prev {
  left: 0;
}
.swiper-button-prev::after {
  transform: rotate(90deg);
}

@media (max-width: 767px) {
  .swiper-indicator.w-hide {
    display: flex !important;
  }
  .swiper-indicator .swiper-navigation.w-hide {
    display: flex !important;
  }
}
/* 건너뛰기 링크 */
#kids-skip-link {
  --kids-skip-link--font-size: var(--kids-font-size-body-small);
  --kids-skip-link--color-background: var(
    --kids-light-color-background-inverse
  );
  --kids-skip-link-color-text: var(
    --kids-light-color-text-basic-inverse
  );
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  text-align: center;
  background-color: var(--kids-skip-link--color-background);
}
#kids-skip-link a:not(:focus) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  left: 0;
  top: 0;
}
#kids-skip-link a:focus {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
  font-size: var(--kids-skip-link--font-size);
  color: var(--kids-skip-link-color-text);
  width: 100%;
  height: var(--kids-size-height-5);
  margin: 0 auto;
  text-align: center;
}

/* 탭 */
.kids-tab-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-8);
  width: 100%;
  margin: 0 auto;
}

.tab {
  --kids-tab--button-size-height: var(--kids-size-height-7);
  --kids-tab--button-size-min-width: 6.4rem;
  --kids-tab--button-font-size: var(
    --kids-font-size-heading-small
  );
  --kids-tab--button-font-size: var(
    --kids-font-size-heading-small
  );
  --kids-tab--gap: var(--kids-gap-3);
  --kids-tab--full-button-size-height: var(--kids-size-height-8);
  --kids-tab--mobile-full-button-size-height: var(--kids-size-height-7);
  --kids-tab--full-button-font-size: var(
    --kids-font-size-heading-small
  );
  --kids-tab--full-button-font-size: var(
    --kids-font-size-heading-small
  );
  --kids-tab--line-button-padding: var(--kids-padding-2);
  --kids-tab--fill-button-padding: var(--kids-padding-3);
  --kids-tab--fill-button-radius: var(--kids-radius-medium2);
  --kids-tab--conts-padding-top: var(--kids-padding-10);
  --kids-tab--button-trigger-size-height: var(--kids-size-height-7);
  --kids-tab--button-trigger-padding-x: var(--kids-padding-6);
  --kids-tab--button-trigger-radius: var(--kids-radius-medium1);
  --kids-tab--button-color-action: var(
    --kids-light-color-action-secondary
  );
  --kids-tab--button-color-action-hover: var(
    --kids-light-color-action-secondary-hover
  );
  --kids-tab--button-color-action-pressed: var(
    --kids-light-color-action-secondary-pressed
  );
  --kids-tab--button-color-border: var(
    --kids-light-color-action-secondary
  );
  --kids-tab--button-color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-tab--button-color-text-disabled: var(
    --kids-light-color-text-disabled
  );
  --kids-tab--fill-button-color-action-active: var(
    --kids-light-color-action-secondary-active
  );
  --kids-tab--fill-button-color-border: var(
    --kids-light-color-border-gray
  );
  --kids-tab--fill-button-color-border-active: var(
    --kids-light-color-action-secondary-active
  );
  --kids-tab--fill-button-color-text: var(
    --kids-light-color-text-inverse-static
  );
  --kids-tab--line-button-color-border: var(
    --kids-light-color-border-gray
  );
  --kids-tab--line-button-color-line-active: var(
    --kids-light-color-action-secondary-active
  );
  --kids-tab--line-button-color-text-active: var(
    --kids-light-color-text-secondary
  );
  --kids-tab--button-trigger-color-text: var(
    --kids-light-color-text-inverse-static
  );
  --kids-tab--button-trigger-color-action: var(
    --kids-light-color-action-secondary-active
  );
  border-radius: var(--kids-number-5);
}
.tab > ul {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-tab--gap);
  overflow-x: auto;
  flex-wrap: nowrap;
  width: 100%;
  -webkit-overflow-scrolling: touch;
}
.tab li,
.tab .btn-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  position: relative;
  white-space: nowrap;
}
.tab .btn-tab {
  width: 100%;
  height: var(--kids-tab--button-size-height);
  background-color: var(--kids-tab--button-color-action);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-tab--button-color-border);
  font-size: var(--kids-tab--button-font-size);
  white-space: nowrap;
  color: var(--kids-tab--button-color-text);
  font-weight: var(--kids-font-weight-bold);
  transition: var(--kids-transition-base);
}
.tab .btn-tab:not(:disabled):hover {
  background-color: var(--kids-tab--button-color-action-hover);
  transition: var(--kids-transition-base);
}
.tab .btn-tab:not(:disabled):active {
  background-color: var(--kids-tab--button-color-action-pressed);
  transition: var(--kids-transition-base);
}
.tab .btn-tab:focus {
  box-shadow: var(--kids-box-shadow-outline-inset);
  outline-offset: -0.4rem;
}
.tab .btn-tab[disabled] {
  color: var(--kids-tab--button-color-text-disabled);
  cursor: default;
}
.tab li {
  flex-grow: 0;
  box-sizing: border-box;
}
.tab.full {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}
.tab.full .btn-tab {
  height: var(--kids-tab--full-button-size-height);
  padding: 0;
  font-size: var(--kids-tab--full-button-font-size);
}
.tab.full > ul {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  position: relative;
  width: 100%;
  gap: 0;
}
.tab.full > ul > li {
  flex: 1 1 0px;
  min-width: 0;
}
.tab.fill .btn-tab {
  padding: 0 var(--kids-tab--fill-button-padding);
  border-radius: var(--kids-tab--fill-button-radius);
}
.tab.fill .btn-tab:focus {
  box-shadow: inset 0 0 0 0.6rem var(--kids-light-color-border-primary);
  outline-offset: -0.4rem;
}
.tab.fill .active .btn-tab {
  background-color: var(--kids-tab--fill-button-color-action-active);
  border-color: var(--kids-tab--fill-button-color-border-active) !important;
  color: var(--kids-tab--fill-button-color-text);
}
.tab.fill.full .btn-tab {
  border-color: var(--kids-tab--fill-button-color-border);
}
.tab.fill.full > ul > li + li .btn-tab {
  border-left: none;
}
.tab.fill.full > ul > li .btn-tab {
  border-radius: 0;
}
.tab.fill.full > ul > li:first-of-type .btn-tab {
  border-top-left-radius: var(--kids-tab--fill-button-radius);
  border-bottom-left-radius: var(--kids-tab--fill-button-radius);
}
.tab.fill.full > ul > li:last-of-type .btn-tab {
  border-top-right-radius: var(--kids-tab--fill-button-radius);
  border-bottom-right-radius: var(--kids-tab--fill-button-radius);
}
.tab.line .btn-tab {
  min-width: var(--kids-tab--button-size-min-width);
  padding: 0 var(--kids-tab--line-button-padding);
  background-color: var(--kids-color-light-alpha-white100);
}
.tab.line .btn-tab:before {
  position: absolute;
  bottom: 0;
  left: 50%;
  content: "";
  width: 0;
  height: 0.4rem;
  background-color: var(--kids-tab--line-button-color-line-active);
  transition: var(--kids-transition-base);
}
.tab.line .active .btn-tab {
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-tab--line-button-color-text-active);
  color: var(--kids-tab--line-button-color-text-active);
}
.tab.line .active .btn-tab:before {
  position: absolute;
  left: 0;
  width: 100%;
}
.tab.line.full .btn-tab {
  border: 0;
  border-bottom: 2px solid var(--kids-tab--line-button-color-border);
}
.tab.line.full .btn-tab:before {
  bottom: -0.1rem;
}

.list-tab-wrap {
  width: 100%;
  max-width: 1200px;
  margin: 8rem auto 0;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  padding-left: 0.4rem;
  overflow-x: auto;
}
.list-tab-wrap > ul {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-4);
  width: max-content;
}
.list-tab-wrap > ul > li {
  background-color: var(--kids-color-light-gray-5);
  border-radius: var(--kids-radius-max);
}
.list-tab-wrap > ul > li a,
.list-tab-wrap > ul > li button {
  display: block;
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  padding: var(--kids-padding-5) var(--kids-padding-8);
}
.list-tab-wrap > ul > li.active {
  background-color: var(--kids-color-light-primary-55);
}
.list-tab-wrap > ul > li.active a,
.list-tab-wrap > ul > li.active button {
  color: var(--kids-color-light-alpha-white100);
}

.tab-conts-wrap {
  width: 100%;
}

.tab-conts {
  display: none;
  margin-top: var(--kids-tab--conts-padding-top);
}
.tab-conts.active {
  display: flex;
  align-items: normal;
  justify-content: flex-start;
  flex-direction: column;
}

@media (max-width: 1023px) {
  .tab-wrap {
    padding-bottom: 2.8rem;
  }
  .tab.fill .btn-tab {
    font-size: 1.7rem;
    height: 4.8rem;
    border-radius: var(--kids-tab--fill-button-radius);
  }
  .tab.fill .btn-tab::before {
    display: none;
  }
  .list-tab-wrap {
    padding-left: var(--kids-contents-padding-x);
    padding-right: var(--kids-contents-padding-x);
    margin-top: 0;
    margin-bottom: 0.6rem;
  }
  .list-tab-wrap > ul > li a,
  .list-tab-wrap > ul > li button {
    padding: 0.8rem 1.75rem;
  }
}
@media (max-width: 767px) {
  .tab-conts.active {
    gap: var(--kids-padding-8);
  }
  .tab.line.full > ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
  }
  .tab.line.full > ul > li {
    width: auto;
    min-width: fit-content;
  }
  .tab.line.full .btn-tab {
    padding: 0 1.15rem;
    font-size: var(--kids-font-size-label-medium);
    border-bottom: none;
    min-width: unset;
    height: var(--kids-tab--mobile-full-button-size-height);
  }
  .tab.line.full .btn-tab:hover {
    background-color: transparent;
  }
  .tab.line.full .btn-tab:before {
    height: 0.3rem;
  }
  .tab.fill.full .btn-tab {
    border-color: var(--kids-tab--fill-button-color-border);
    padding: 0 var(--kids-padding-5);
    border-width: 0;
    min-width: fit-content;
  }
  .tab.fill.full > ul {
    gap: var(--kids-gap-3);
    flex-wrap: nowrap;
  }
  .tab.fill.full > ul > li {
    width: fit-content;
    width: auto;
    flex: none;
  }
  .tab.fill.full > ul > li .btn-tab {
    border-radius: var(--kids-tab--fill-button-radius);
  }
}
/* 표 */
.kids-table-wrap {
  --kids-color-table-border-top: #172C56;
  --kids-color-table-border-btm: #D1D5DB;
  --kids-color-table-date: #666;
  --kids-table--data-thead-th-padding: 2.725rem;
  --kids-table--data-thead-th-padding-sides: var(--kids-padding-6);
  --kids-table--data-thead-font-size: var(
    --kids-font-size-heading-small
  );
  --kids-table--data-tbody-font-size: var(
    --kids-font-size-body-medium-bold
  );
  --kids-table--data-tbody-font-size: var(
    --kids-font-size-body-medium-bold
  );
  --kids-table--data-tbody-padding: 2.525rem;
  --kids-table--data-tbody-padding-sides: var(--kids-padding-4);
  --kids-table--data-border-top-width: var(
    --kids-light-border-width-variable-medium
  );
  --kids-table--data-border-width: var(
    --kids-light-border-width-variable-regular
  );
  --kids-table--data-thead-border: var(
    --kids-color-table-border-top
  );
  --kids-table--data-thead-surface: var(
    --kids-light-color-surface-secondary-subtler
  );
  --kids-table--data-thead-color-text: var(
    --kids-light-color-text-bolder
  );
  --kids-table--data-tbody-color-surface: var(
    --kids-light-color-surface-white-subtle
  );
  --kids-table--data-tbody-color-divider: var(
    --kids-color-table-border-btm
  );
  --kids-table--data-tbody-color-text: var(
    --kids-light-color-text-subtle
  );
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-4);
}
.kids-table-wrap .tbl {
  table-layout: fixed;
  border-top: var(--kids-table--data-border-top-width) solid var(--kids-table--data-thead-border);
}
.kids-table-wrap .tbl.data th,
.kids-table-wrap .tbl.data td {
  vertical-align: middle;
}
.kids-table-wrap .tbl.data thead th {
  padding: var(--kids-table--data-thead-th-padding) var(--kids-table--data-thead-th-padding-sides);
  border-bottom: var(--kids-table--data-border-width) solid var(--kids-table--data-tbody-color-divider);
  font-weight: var(--kids-font-weight-bold);
  font-size: var(--kids-table--data-thead-font-size);
  color: var(--kids-table--data-thead-color-text);
  text-align: center;
}
.kids-table-wrap .tbl.data tbody th,
.kids-table-wrap .tbl.data tbody td {
  padding: var(--kids-table--data-tbody-padding) var(--kids-table--data-tbody-padding-sides);
  border-bottom: var(--kids-table--data-border-width) solid var(--kids-table--data-tbody-color-divider);
  font-size: var(--kids-table--data-tbody-font-size);
  color: var(--kids-table--data-tbody-color-text);
  font-weight: var(--kids-font-weight-regular);
  text-align: center;
}
.kids-table-wrap .tbl.data tbody th.title,
.kids-table-wrap .tbl.data tbody td.title {
  text-align: left;
  max-width: 0;
}
.kids-table-wrap .tbl.data tbody th.title .title-link,
.kids-table-wrap .tbl.data tbody td.title .title-link {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--kids-color-light-gray-95);
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
}
.kids-table-wrap .tbl.data tbody th .no-data,
.kids-table-wrap .tbl.data tbody td .no-data {
  padding: 9.35rem 0;
}
.kids-table-wrap .tbl.data th:nth-child(1),
.kids-table-wrap .tbl.data td:nth-child(1) {
  width: 12rem;
}
.kids-table-wrap .tbl.data th:nth-child(2),
.kids-table-wrap .tbl.data td:nth-child(2) {
  width: 20rem;
}
.kids-table-wrap .tbl.data th:last-child,
.kids-table-wrap .tbl.data td:last-child {
  width: 24rem;
}
.kids-table-wrap .tbl.data td:last-child {
  color: var(--kids-color-table-date);
}
.kids-table-wrap .tbl.row.data {
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-table--data-tbody-color-divider);
}
.kids-table-wrap .tbl.row.data th,
.kids-table-wrap .tbl.row.data td {
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-table--data-tbody-color-divider);
}
.kids-table-wrap .tbl.row.data th {
  border-right: 1px solid var(--kids-color-light-gray-20);
  background-color: var(--kids-table--data-thead-surface);
  font-weight: var(--kids-font-weight-bold);
  font-size: var(--kids-table--data-thead-font-size);
  color: var(--kids-table--data-thead-color-text);
  text-align: left;
}
.kids-table-wrap.scroll {
  overflow-x: auto;
  overflow-y: hidden;
}
.kids-table-wrap.scroll .tbl {
  width: 100%;
}
.kids-table-wrap + .kids-table-wrap {
  margin-top: var(--kids-gap-10);
}

@media (max-width: 1023px) {
  .kids-table-wrap .tbl.data th:nth-child(1),
  .kids-table-wrap .tbl.data td:nth-child(1) {
    width: 80px;
  }
  .kids-table-wrap .tbl.data th:nth-child(2),
  .kids-table-wrap .tbl.data td:nth-child(2) {
    width: 150px;
  }
  .kids-table-wrap .tbl.data th:last-child,
  .kids-table-wrap .tbl.data td:last-child {
    width: 200px;
  }
}
@media (max-width: 767px) {
  .kids-table-wrap .tbl {
    width: 100%;
  }
  .kids-table-wrap .tbl.data thead {
    display: none;
  }
  .kids-table-wrap .tbl.data tbody {
    display: block;
  }
  .kids-table-wrap .tbl.data tbody tr {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    width: 100%;
    padding: var(--kids-padding-7) 0;
    border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-color-table-border-btm);
  }
  .kids-table-wrap .tbl.data tbody tr td {
    display: block;
    border-bottom: 0;
    padding: 0 1rem;
    text-align: left;
    margin-bottom: var(--kids-number-7);
  }
  .kids-table-wrap .tbl.data tbody tr td .badge .kids-badge.large {
    height: var(--kids-badge--size-height);
    line-height: var(--kids-badge--line-height);
    font-size: var(--kids-badge--font-size);
    font-weight: var(--kids-font-weight-regular);
    padding: 0 var(--kids-badge--padding);
    border-radius: var(--kids-badge--radius);
  }
  .kids-table-wrap .tbl.data tbody tr td.title {
    width: 100%;
    max-width: none;
    min-width: 0;
    overflow: hidden;
  }
  .kids-table-wrap .tbl.data tbody tr td.title .title-link {
    font-size: var(--kids-font-size-body-medium);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 400;
  }
  .kids-table-wrap .tbl.data tbody tr td .kids-badge.large {
    height: var(--kids-badge--size-height);
    line-height: var(--kids-badge--line-height);
    font-size: var(--kids-badge--font-size);
    font-weight: var(--kids-font-weight-regular);
    padding: 0 var(--kids-badge--padding);
    border-radius: var(--kids-badge--radius);
  }
  .kids-table-wrap .tbl.data tbody tr td:nth-child(2) {
    margin-bottom: var(--kids-number-5);
  }
  .kids-table-wrap .tbl.data tbody tr td:last-child {
    margin-bottom: 0;
  }
  .kids-table-wrap .tbl.data th:nth-child(1),
  .kids-table-wrap .tbl.data td:nth-child(1),
  .kids-table-wrap .tbl.data th:nth-child(2),
  .kids-table-wrap .tbl.data td:nth-child(2),
  .kids-table-wrap .tbl.data th:last-child,
  .kids-table-wrap .tbl.data td:last-child {
    width: 100%;
  }
  .kids-table-wrap .tbl.data td:nth-child(1) {
    font-size: var(--kids-font-size-body-small);
  }
  .kids-table-wrap.mo-scroll {
    width: 100%;
  }
  .kids-table-wrap.mo-scroll th,
  .kids-table-wrap.mo-scroll td {
    white-space: nowrap;
  }
}
/* 텍스트 목록 */
.kids-info-list {
  --kids-info-list--depth1-list-margin-top: 0;
  --kids-info-list--depth2-list-margin-top: var(--kids-gap-5);
  --kids-info-list--depth3-list-margin-top: var(--kids-gap-4);
  --kids-info-list--depth1-padding-left: 2.6rem;
  --kids-info-list--depth2-padding-left: var(--kids-number-10);
  --kids-info-list--depth3-padding-left: var(--kids-number-9);
  --kids-info-list--gap-layout-depth1-li-li: var(--kids-gap-2);
  --kids-info-list--gap-layout-depth2-li-li: var(--kids-gap-3);
  --kids-info-list--gap-layout-depth3-li-li: var(--kids-gap-3);
  --kids-info-list--text-depth1: var(--kids-font-size-body-small);
  --kids-info-list--text-depth1: var(--kids-font-size-body-small);
  --kids-info-list--text-depth2: var(--kids-font-size-body-xsmall);
  --kids-info-list--text-depth2: var(--kids-font-size-body-xsmall);
  --kids-info-list--text-depth3: var(--kids-font-size-body-xsmall);
  --kids-info-list--text-depth3: var(--kids-font-size-body-xsmall);
  --kids-info-list--info-txt-margin-top: var(--kids-number-7);
  --kids-info-list--depth1-color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-info-list--depth2-color-text: var(
    --kids-light-color-text-subtle
  );
  --kids-info-list--depth3-color-text: var(
    --kids-light-color-text-subtle
  );
  display: flex;
  flex-direction: column;
  margin-top: var(--kids-info-list--depth1-list-margin-top);
  gap: var(--kids-info-list--gap-layout-depth1-li-li);
}
.kids-info-list > li {
  position: relative;
  padding-left: var(--kids-info-list--depth1-padding-left);
  color: var(--kids-info-list--depth1-color-text);
  font-size: var(--kids-info-list--text-depth1);
}
.kids-info-list > li::before {
  position: absolute;
  top: 0;
  left: 0;
}
.kids-info-list > li > .kids-info-list {
  gap: var(--kids-info-list--gap-layout-depth2-li-li);
  margin-top: var(--kids-info-list--depth2-list-margin-top);
}
.kids-info-list > li > .kids-info-list > li {
  padding-left: var(--kids-info-list--depth2-padding-left);
  color: var(--kids-info-list--depth2-color-text);
  font-size: var(--kids-info-list--text-depth2);
}
.kids-info-list > li > .kids-info-list > li > .kids-info-list {
  margin-top: var(--kids-info-list--depth3-list-margin-top);
}
.kids-info-list > li > .kids-info-list > li > .kids-info-list > li {
  padding-left: var(--kids-info-list--depth3-padding-left);
  color: var(--kids-info-list--depth3-color-text);
  font-size: var(--kids-info-list--text-depth3);
}
.kids-info-list > li > .info-txt {
  margin-top: var(--kids-info-list--info-txt-margin-top);
}
.kids-info-list.decimal > li::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  content: "";
  background-color: var(--kids-info-list--depth1-color-text);
  border-radius: var(--kids-radius-max);
  top: 1rem;
  left: 1.1rem;
}
.kids-info-list.dash > li::before {
  content: "-";
}
.kids-info-list.hollow {
  gap: var(--kids-info-list--gap-layout-depth2-li-li);
}
.kids-info-list.hollow > li {
  padding-left: var(--kids-info-list--depth3-padding-left);
}
.kids-info-list.hollow > li::before {
  content: "";
  width: 0.4rem;
  height: 0.4rem;
  content: "";
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-info-list--depth1-color-text);
  border-radius: var(--kids-radius-max);
  top: 0.95rem;
  left: 0.8rem;
}
.kids-info-list.ordered > li .num {
  position: absolute;
  top: 0;
  left: 0;
}
.kids-info-list.ordered > li::before {
  display: none;
}

/* 셀렉트 */
.kids-form-select {
  --kids-form-select--color-background: var(--kids-light-color-input-surface);
  --kids-form-select--color-background-readonly: var(--kids-light-color-input-surface-disabled);
  --kids-form-select--color-background-disabled: var(--kids-light-color-input-surface-disabled);
  --kids-form-select--color-background-error: var(--kids-light-color-input-surface);
  --kids-form-select--icon-color-background: var(--kids-light-color-icon-gray);
  --kids-form-select--icon-color-background-readonly: var(--kids-light-color-icon-disabled-on);
  --kids-form-select--icon-color-background-disabled: var(--kids-light-color-icon-disabled-on);
  --kids-form-select--color-border: var(--kids-light-color-input-border);
  --kids-form-select--color-border-active: var(--kids-light-color-input-border-active);
  --kids-form-select--color-border-readonly: var(--kids-light-color-input-border-disabled);
  --kids-form-select--color-border-disabled: var(--kids-light-color-input-border-disabled);
  --kids-form-select--color-border-error: var(--kids-light-color-input-border-error);
  --kids-form-select--color-text: var(--kids-light-color-text-disabled);
  --kids-form-select--color-text: var(--kids-light-color-text-disabled);
  --kids-form-select--color-text-active: var(--kids-light-color-text-basic);
  --kids-form-select--color-text-completed: var(--kids-light-color-text-subtle);
  --kids-form-select--color-text-disabled: var(--kids-light-color-text-disabled-on);
  --kids-form-select--color-text-error: var(--kids-light-color-text-subtle);
  --kids-form-select--padding-default: var(--kids-padding-6);
  --kids-form-select--size-height-small: var(--kids-size-height-6);
  --kids-form-select--icon-size-small: var(--kids-icon--size-small);
  --kids-form-select--radius-small: var(--kids-radius-medium3);
  --kids-form-select--padding-right-small: calc(var(--kids-form-select--padding-default) + var(--kids-gap-3) + var(--kids-form-select--icon-size-small));
  --kids-form-select--pc-font-size-small: var(--kids-pc-font-size-label-small);
  --kids-form-select--mobile-font-size-small: var(--kids-mobile-font-size-label-small);
  --kids-form-select--size-height-medium: var(--kids-size-height-7);
  --kids-form-select--icon-size-medium: var(--kids-icon--size-medium);
  --kids-form-select--padding-right-medium: calc(var(--kids-form-select--padding-default) + var(--kids-gap-3) + var(--kids-form-select--icon-size-medium));
  --kids-form-select--radius-medium: var(--kids-radius-medium2);
  --kids-form-select--pc-font-size-medium: var(--kids-pc-font-size-label-medium);
  --kids-form-select--mobile-font-size-medium: var(--kids-mobile-font-size-label-medium);
  --kids-form-select--size-height-large: var(--kids-size-height-8);
  --kids-form-select--icon-size-large: var(--kids-icon--size-large);
  --kids-form-select--padding-right-large: calc(var(--kids-form-select--padding-default) + var(--kids-gap-3) + var(--kids-form-select--icon-size-large));
  --kids-form-select--radius-large: var(--kids-radius-medium1);
  --kids-form-select--pc-font-size-large: var(--kids-pc-font-size-label-large);
  --kids-form-select--mobile-font-size-large: var(--kids-mobile-font-size-label-large);
}
.kids-form-select {
  height: var(--kids-form-select--size-height-large);
  padding: 0 var(--kids-form-select--padding-right-large) 0 var(--kids-form-select--padding-default);
  background-position: center right var(--kids-form-select--padding-default);
  background-size: var(--kids-form-select--icon-size-large) !important;
  border-radius: var(--kids-form-select--radius-large);
  font-size: var(--kids-form-select--pc-font-size-large);
}
@media (max-width: 767px) {
  .kids-form-select {
    font-size: var(--kids-form-select--mobile-font-size-large);
  }
}
.kids-form-select.small {
  height: var(--kids-form-select--size-height-small);
  padding: 0 var(--kids-form-select--padding-right-small) 0 var(--kids-form-select--padding-default);
  background-position: center right var(--kids-form-select--padding-default);
  background-size: var(--kids-form-select--icon-size-small) !important;
  border-radius: var(--kids-form-select--radius-small);
  font-size: var(--kids-form-select--pc-font-size-small);
}
@media (max-width: 767px) {
  .kids-form-select.small {
    font-size: var(--kids-form-select--mobile-font-size-small);
  }
}
.kids-form-select.medium {
  height: var(--kids-form-select--size-height-medium);
  padding: 0 var(--kids-form-select--padding-right-medium) 0 var(--kids-form-select--padding-default);
  background-position: center right var(--kids-form-select--padding-default);
  background-size: var(--kids-form-select--icon-size-medium) !important;
  border-radius: var(--kids-form-select--radius-medium);
  font-size: var(--kids-form-select--pc-font-size-medium);
}
@media (max-width: 767px) {
  .kids-form-select.medium {
    font-size: var(--kids-form-select--mobile-font-size-medium);
  }
}
.kids-form-select.large {
  height: var(--kids-form-select--size-height-large);
  padding: 0 var(--kids-form-select--padding-right-large) 0 var(--kids-form-select--padding-default);
  background-position: center right var(--kids-form-select--padding-default);
  background-size: var(--kids-form-select--icon-size-large) !important;
  border-radius: var(--kids-form-select--radius-large);
  font-size: var(--kids-form-select--pc-font-size-large);
}
@media (max-width: 767px) {
  .kids-form-select.large {
    font-size: var(--kids-form-select--mobile-font-size-large);
  }
}
.kids-form-select {
  position: relative;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_thick.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_thick.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center right var(--kids-form-select--padding-default);
  background-color: var(--kids-form-select--color-background) !important;
  border-width: var(--kids-light-border-width-variable-regular);
  border-style: solid;
  border-color: var(--kids-form-select--color-border);
  font-family: inherit;
  color: var(--kids-form-select--color-text);
  transition: var(--kids-transition-base);
}
.kids-form-select:focus {
  border-color: var(--kids-form-select--color-border-active);
  border-width: 2px;
  outline: none;
  box-shadow: none;
  color: var(--kids-form-select--color-text-active);
}
.kids-form-select.completed {
  color: var(--kids-form-select--color-text-completed);
}
.kids-form-select.is-error {
  border-color: var(--kids-light-color-text-point);
  border-width: 2px;
}
.kids-form-select[disabled] {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_disabled.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle_disabled.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center right var(--kids-form-select--padding-default);
  background-color: var(--kids-form-select--color-background-disabled) !important;
  border-color: var(--kids-form-select--color-border-disabled);
  color: var(--kids-form-select--color-text-disabled);
}

.is-error .kids-form-select {
  border-color: var(--kids-light-color-text-point);
  border-width: 2px;
}

/* sorting select */
.kids-form-select-sort {
  --kids-form-select-sorting--color-background: var(--kids-light-color-action-secondary);
  --kids-form-select-sorting--color-background-hover: var(--kids-light-color-action-secondary-hover);
  --kids-form-select-sorting--color-background-pressed: var(--kids-light-color-action-secondary-pressed);
  --kids-form-select-sorting--color-text: var(--kids-light-color-text-basic);
  --kids-form-select-sorting--padding-left: var(--kids-padding-2);
  --kids-form-select-sorting--radius: var(--kids-radius-small2);
  --kids-form-select-sorting--icon-size-small: var(--kids-icon--size-small);
  --kids-form-select-sorting--padding-left-small: var(--kids-padding-1);
  --kids-form-select-sorting--padding-right-small: calc(var(--kids-form-select-sorting--padding-left) + var(--kids-gap-1) + var(--kids-form-select-sorting--icon-size-small));
  --kids-form-select-sorting--pc-font-size-small: var(--kids-pc-font-size-label-small);
  --kids-form-select-sorting--mobile-font-size-small: var(--kids-mobile-font-size-label-small);
  --kids-form-select-sorting--icon-size-medium: var(--kids-icon--size-medium);
  --kids-form-select-sorting--padding-left-medium: var(--kids-padding-2);
  --kids-form-select-sorting--padding-right-medium: calc(var(--kids-form-select-sorting--padding-left) + var(--kids-gap-1) + var(--kids-form-select-sorting--icon-size-medium));
  --kids-form-select-sorting--pc-font-size-medium: var(--kids-pc-font-size-label-medium);
  --kids-form-select-sorting--mobile-font-size-medium: var(--kids-mobile-font-size-label-medium);
  --kids-form-select-sorting--icon-size-large: var(--kids-icon--size-large);
  --kids-form-select-sorting--padding-left-large: var(--kids-padding-2);
  --kids-form-select-sorting--padding-right-large: calc(var(--kids-form-select-sorting--padding-left) + var(--kids-gap-1) + var(--kids-form-select-sorting--icon-size-large));
  --kids-form-select-sorting--pc-font-size-large: var(--kids-pc-font-size-heading-small);
  --kids-form-select-sorting--mobile-font-size-large: var(--kids-mobile-font-size-heading-small);
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico_angle.svg);
  background-color: transparent !important;
  background-size: contain;
  background-repeat: no-repeat;
  background-color: var(--kids-form-select-sorting--color-background) !important;
  border: none;
  border-radius: var(--kids-form-select-sorting--radius);
  font-family: inherit;
  color: var(--kids-form-select-sorting--color-text);
  transition: var(--kids-transition-base);
}
.kids-form-select-sort {
  padding: 0 var(--kids-form-select-sorting--padding-right-medium) 0 var(--kids-form-select-sorting--padding-left);
  background-position: center right var(--kids-form-select-sorting--padding-left);
  background-size: var(--kids-form-select-sorting--icon-size-medium) !important;
  font-size: var(--kids-form-select-sorting--pc-font-size-medium);
}
@media (max-width: 767px) {
  .kids-form-select-sort {
    font-size: var(--kids-form-select-sorting--mobile-font-size-medium);
  }
}
.kids-form-select-sort.small {
  padding: 0 var(--kids-form-select-sorting--padding-right-small) 0 var(--kids-form-select-sorting--padding-left);
  background-position: center right var(--kids-form-select-sorting--padding-left);
  background-size: var(--kids-form-select-sorting--icon-size-small) !important;
  font-size: var(--kids-form-select-sorting--pc-font-size-small);
}
@media (max-width: 767px) {
  .kids-form-select-sort.small {
    font-size: var(--kids-form-select-sorting--mobile-font-size-small);
  }
}
.kids-form-select-sort.medium {
  padding: 0 var(--kids-form-select-sorting--padding-right-medium) 0 var(--kids-form-select-sorting--padding-left);
  background-position: center right var(--kids-form-select-sorting--padding-left);
  background-size: var(--kids-form-select-sorting--icon-size-medium) !important;
  font-size: var(--kids-form-select-sorting--pc-font-size-medium);
}
@media (max-width: 767px) {
  .kids-form-select-sort.medium {
    font-size: var(--kids-form-select-sorting--mobile-font-size-medium);
  }
}
.kids-form-select-sort.large {
  padding: 0 var(--kids-form-select-sorting--padding-right-large) 0 var(--kids-form-select-sorting--padding-left);
  background-position: center right var(--kids-form-select-sorting--padding-left);
  background-size: var(--kids-form-select-sorting--icon-size-large) !important;
  font-size: var(--kids-form-select-sorting--pc-font-size-large);
  font-weight: var(--kids-font-weight-bold);
}
@media (max-width: 767px) {
  .kids-form-select-sort.large {
    font-size: var(--kids-form-select-sorting--mobile-font-size-large);
  }
}
.kids-form-select-sort:hover {
  background-color: var(--kids-form-select-sorting--color-background-hover) !important;
}
.kids-form-select-sort:focus {
  background-color: var(--kids-form-select-sorting--color-background-pressed) !important;
}

.kids-list-wrap {
  --kids-color-sub-list-desc: #8A949E;
  --kids-color-sub-list-bg: #f8f8f8;
}

.list-wrap {
  display: grid;
  grid-template-columns: repeat(3, calc(33.3333333333% - (var(--kids-gap-7)) * 2 / 3));
  gap: var(--kids-gap-7);
}
.list-wrap .list-box {
  height: 45rem;
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-color-light-gray-30);
  border-radius: var(--kids-number-10);
  transition: 0.2s ease-in-out;
}
.list-wrap .list-box > a {
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: var(--kids-number-10);
}
.list-wrap .box {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  padding: var(--kids-padding-10);
  padding-bottom: 0;
  gap: var(--kids-gap-5);
}
.list-wrap .list-title {
  width: 100%;
  overflow: hidden;
  min-height: 7.2rem;
}
.list-wrap .list-title .title {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  word-break: break-all;
}
.list-wrap .list-title .sub-text {
  font-size: var(--kids-font-size-body-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.list-wrap .list-info {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  row-gap: var(--kids-number-7);
  column-gap: var(--kids-gap-3);
  padding-top: var(--kids-padding-2);
}
.list-wrap .list-info .info-title {
  font-size: var(--kids-font-size-body-xsmall-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  font-weight: 700;
  flex: 0 0 4.5rem;
}
.list-wrap .list-info .info-cont {
  font-size: var(--kids-font-size-body-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  flex: 1 1 calc(100% - 4.5rem - var(--kids-gap-3));
}
.list-wrap .desc {
  width: 100%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  border-top: var(--kids-light-border-width-variable-regular) solid var(--kids-color-light-gray-20);
  font-size: var(--kids-font-size-body-small-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-color-sub-list-desc);
  margin-top: 2.4rem;
  padding-top: var(--kids-padding-6);
  -webkit-line-clamp: 3;
}
.list-wrap.type-text .list-box .box {
  height: 100%;
}
.list-wrap.type-text .list-box:hover {
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-color-light-primary-55);
  box-shadow: 0 0 0 1px var(--kids-color-light-primary-55);
}
.list-wrap.type-image .list-box {
  background-color: var(--kids-color-sub-list-bg);
  border: none;
  height: auto;
}
.list-wrap.type-image .list-box:hover .list-thumb img {
  transform: scale(1.1);
}
.list-wrap.type-image .list-box .box {
  padding-bottom: 1.6rem;
}
.list-wrap.type-image .list-thumb {
  flex: 1;
  aspect-ratio: 384/274;
  overflow: hidden;
  border: 0.1rem solid var(--kids-color-sub-list-bg);
  border-radius: 0 0 var(--kids-number-10) var(--kids-number-10);
}
.list-wrap.type-image .list-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: 0.2s ease-in-out;
  word-break: break-all;
}
.list-wrap.type-image.list-fun-know .list-box:hover .list-thumb .ico-video {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-video-hover.svg);
  background-color: transparent;
}
.list-wrap.type-image.list-fun-know .box {
  padding-bottom: 7.4rem;
}
.list-wrap.type-image.list-fun-know .list-title {
  min-height: 7.2rem;
}
.list-wrap.type-image.list-fun-know .list-thumb {
  aspect-ratio: 384/216;
  position: relative;
}
.list-wrap.type-image.list-fun-know .list-thumb .ico-video {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-video.svg);
  background-color: transparent;
  transition: 0.2s ease-in-out;
  width: 6.6rem;
  height: 6.6rem;
}
.list-wrap.type-image.list-fun-know .list-thumb.video::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 0;
  background-color: rgba(0, 0, 0, 0.35);
}
.list-wrap.type-image.list-fun-game .list-box .box {
  padding-bottom: 3rem;
}
.list-wrap.type-image.list-fun-game .list-box .list-title {
  min-height: 9.6rem;
}

@media (max-width: 1023px) {
  .list-wrap .list-title .sub-text {
    display: none;
  }
  .list-wrap.type-text .list-info .info-title {
    flex: 0 0 4.2rem;
  }
  .list-wrap.type-text .list-info .info-cont {
    flex: 1 1 calc(100% - 4.2rem - var(--kids-gap-3));
  }
}
@media (max-width: 767px) {
  .list-wrap {
    grid-template-columns: repeat(1, 1fr);
    gap: var(--kids-gap-5);
  }
  .list-wrap .list-box {
    width: 100%;
    height: 38.4rem;
  }
  .list-wrap .box {
    padding: var(--kids-padding-10);
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    gap: var(--kids-gap-3);
  }
  .list-wrap .kids-badge.large {
    height: var(--kids-badge--size-height);
    line-height: var(--kids-badge--line-height);
    font-size: var(--kids-badge--font-size);
    font-weight: var(--kids-font-weight-regular);
    padding: 0 var(--kids-badge--padding);
    border-radius: var(--kids-badge--radius);
  }
  .list-wrap .list-title {
    min-height: 6.6rem;
  }
  .list-wrap .list-title .title {
    font-size: var(--kids-font-size-body-xxlarge-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
    -webkit-line-clamp: 2;
    word-break: break-all;
  }
  .list-wrap .list-title .sub-text {
    display: none;
  }
  .list-wrap .list-info {
    padding-top: var(--kids-padding-3);
  }
  .list-wrap .list-info .info-title {
    flex: 0 0 4.2rem;
  }
  .list-wrap .list-info .info-cont {
    flex: 1 1 calc(100% - 4.2rem - var(--kids-gap-3));
  }
  .list-wrap .desc {
    -webkit-line-clamp: 2;
    margin-top: var(--kids-number-8);
  }
  .list-wrap.type-text .list-box:hover {
    border-color: var(--kids-color-light-gray-30);
    box-shadow: none;
  }
  .list-wrap.type-image .list-box:hover .list-thumb img {
    transform: none;
  }
  .list-wrap.type-image .list-box .box {
    padding-bottom: 0.6rem;
  }
  .list-wrap.type-image .list-thumb {
    aspect-ratio: 328/234;
  }
  .list-wrap.type-image.list-fun-know .box {
    padding-bottom: 5.6rem;
  }
  .list-wrap.type-image.list-fun-know .list-title {
    min-height: 7.2rem;
  }
  .list-wrap.type-image.list-fun-know .list-thumb {
    aspect-ratio: 328/184;
  }
  .list-wrap.type-image.list-fun-know .list-thumb.video:hover .ico-video {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(https://static.gov.kr/content/child/content/images/common/ico/ico-video.svg);
    background-color: transparent;
  }
  .list-wrap.type-image.list-fun-game .list-box .box {
    padding-bottom: 3rem;
  }
  .list-wrap.type-image.list-fun-game .list-box .list-title {
    min-height: 6.6rem;
  }
}
.info-group {
  --kids-info-box-title-color: #1d1d1d;
  --kids-info-box-hollow-color: var(--kids-light-color-border-gray-dark);
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  padding: 16px;
  border: var(--kids-light-border-width-variable-regular) solid transparent;
  border-radius: 1.2rem;
  gap: 8px;
}
.info-group .tit {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: 10px;
  font-size: 1.5rem;
  font-weight: 700;
}
.info-group .text,
.info-group .btn-group {
  padding-left: 26px;
}
.info-group .tit::before {
  content: "";
  display: inline-flex;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto;
}
.info-group .tit::before {
  background-color: var(--kids-color-sub-light-gray);
  background-image: url("https://static.gov.kr/content/child/content/images/common/ico/ico-info-union.svg");
}
.info-group {
  background-color: var(--kids-light-color-surface-gray-subtler);
  border-color: var(--kids-light-color-border-gray-light);
  word-break: keep-all;
  padding: var(--kids-padding-6);
}
.info-group .tit {
  font-size: var(--kids-font-size-heading-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-info-box-title-color);
}
.info-group .tit::before {
  margin-top: 4px;
}
.info-group .info-list {
  margin: var(--kids-number-5) 0 0 0;
}
.info-group .info-list > li {
  position: relative;
  font-size: var(--kids-font-size-body-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
}
.info-group .info-list > li:before {
  content: "";
  position: absolute;
  box-sizing: border-box;
}
.info-group .info-list > li + li {
  margin-top: 8px;
}
.info-group .info-list > li .for-mobile {
  display: none;
}
.info-group .info-list.dashed > li {
  padding-left: 18px;
}
.info-group .info-list.dashed > li:before {
  width: 6px;
  height: 2px;
  background-color: var(--kids-info-box-hollow-color);
  top: 9px;
  left: 0px;
}
.info-group .info-list.hollow > li {
  margin-left: var(--kids-number-11);
  padding-left: var(--kids-padding-5);
}
.info-group .info-list.hollow > li:before {
  width: var(--kids-number-3);
  height: var(--kids-number-3);
  border: var(--kids-light-border-width-variable-regular) solid var(--kids-info-box-hollow-color);
  border-radius: 50%;
  top: 10px;
  left: 0;
}
.info-group .info-list + .sub-text {
  margin-top: 18px;
}

@media (max-width: 767px) {
  .info-group .info-list > li .for-mobile {
    display: block;
  }
}
.kids-detail-wrap {
  --kids-list-detail--padding-top: var(--kids-number-8);
  --kids-list-detail--padding-bottom: 10.4rem;
  --kids-list-detail--padding-bottom-mobile: 5rem;
  --kids-list-detail-top--padding-bottom: var(--kids-padding-6);
  --kids-list-detail-badge--margin-bottom: var(--kids-number-7);
  --kids-list-detail-date--gap: var(--kids-number-7);
  --kids-list-detail-date--margin-top: var(--kids-number-14);
  --kids-list-detail-cont--padding: var(--kids-number-20);
  --kids-list-detail-cont--padding-mobile: 6rem;
  --kids-list-detail-thumb--size: 60rem;
  --kids-list-detail-thumb--gap-mobile: 6rem;
  --kids-list-detail-title--margin-bottom-mobile: 6rem;
  --kids-post-nav--padding-top: var(--kids-padding-8);
  --kids-post-nav--padding-top-mobile: var(--kids-padding-6);
  --kids-post-nav--gap: var(--kids-gap-3);
  --kids-post-nav--gap-mobile: var(--kids-gap-4);
  --kids-page-btn--margin-top: var(--kids-number-14);
  --kids-page-btn--margin-top-mobile: var(--kids-number-12);
  --kids-join-info--title-width: 6.5rem;
  --kids-join-info--cont-margin: 4rem;
  --kids-role-list--margin-top: 1.1rem;
  --kids-role-list--margin-top-mobile: 0.4rem;
  --kids-role-list--padding-left: 4.5rem;
  --kids-role-list--padding-left-mobile: 4rem;
  --kids-role-detail-list--margin-top: 5rem;
  --kids-role-detail-list--margin-top-mobile: 4rem;
  --kids-history-box--max-width: 67rem;
  --kids-history-box--min-height: 29.8rem;
  --kids-history-box--min-height-mobile: 16.1rem;
  --kids-history-box--bg-color: #0078BD;
  --kids-history-box--padding: 6.6rem 6rem;
  --kids-history-box--padding-mobile: 3.2rem 2.8rem;
  --kids-history-box-circle--left: 15.1rem;
  --kids-history-box-circle--left-mobile: 8.1rem;
  --kids-history-box-title--padding-left: 8.9rem;
  --kids-history-box-title--padding-left-mobile: 3.985rem;
  --kids-history-box-line--left: 15.7rem;
  --kids-history-box-line--left-mobile: 8.47rem;
  --kids-history-box-line--space: 2rem;
  --kids-history-box-line--space-mobile: 0.8rem;
  --kids-history-box-line--width: 0.1rem;
  --kids-history-box-line--size: 1px 8px;
  --kids-history-box-line--size-mobile: 1px 4px;
  --kids-history-box-logo--right: 6rem;
  --kids-history-box-logo--right-mobile: 2.8rem;
  --kids-history-box-logo--bottom: 6.6rem;
  --kids-history-box-logo--bottom-mobile: 3.2rem;
  --kids-history-box-logo--width: 7rem;
}
.kids-detail-wrap.conts-wrap {
  padding-top: var(--kids-list-detail--padding-top);
  padding-bottom: var(--kids-list-detail--padding-bottom);
}

.detail-top {
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray-light);
  padding-bottom: var(--kids-list-detail-top--padding-bottom);
}
.detail-top .kids-badge {
  margin-bottom: var(--kids-list-detail-badge--margin-bottom);
}
.detail-top .title {
  font-size: var(--kids-font-size-display-large);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-1);
  font-weight: 400;
}
.detail-top .date {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-list-detail-date--gap);
  margin-top: var(--kids-list-detail-date--margin-top);
}
.detail-top .date dt {
  font-size: var(--kids-font-size-body-xsmall-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.detail-top .date dd {
  font-size: var(--kids-font-size-body-xsmall);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-color-light-gray-50);
}

.detail-cont-wrap {
  padding: var(--kids-list-detail-cont--padding) 0;
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-light-color-border-gray-light);
}
.detail-cont-wrap .detail-tit-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  margin-top: var(--kids-number-20);
  margin-bottom: var(--kids-number-10);
}
.detail-cont-wrap .detail-tit-wrap .sub-title {
  font-size: var(--kids-font-size-heading-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.detail-cont-wrap .info-group {
  margin-top: var(--kids-number-20);
}

.detail-thumb-cont {
  text-align: center;
}
.detail-thumb-cont .detail-thumb-img {
  width: auto;
  margin: 0 auto;
}

.detail-info-cont {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-12);
}
.detail-info-cont .detail-info-img {
  max-width: var(--kids-list-detail-thumb--size);
  width: 100%;
}

.detail-info {
  flex: 1;
}
.detail-info dt {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}
.detail-info dd {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
  margin-top: var(--kids-number-7);
}
.detail-info dd + dt {
  margin-top: var(--kids-number-12);
}
.detail-info dd a {
  word-break: break-all;
}

.detail-cont .desc {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  white-space: pre-line;
}
.detail-cont .desc em {
  font-size: var(--kids-font-size-body-small-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
}

.program-list {
  counter-reset: section;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-gap-7);
  margin: var(--kids-number-16) 0 var(--kids-number-20);
}
.program-list > li {
  flex: 1;
  padding: var(--kids-number-12) 0;
  border-width: var(--kids-light-border-width-variable-regular) 0;
  border-color: var(--kids-light-color-border-gray);
  border-style: solid;
}
.program-list > li strong {
  font-size: var(--kids-font-size-heading-medium);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: block;
}
.program-list > li p {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
  margin-top: var(--kids-number-10);
}
.program-list > li::before {
  counter-increment: section;
  content: "0" counter(section);
  font-size: var(--kids-font-size-heading-xlarge);
  line-height: 1.35;
  letter-spacing: var(--kids-typo-letter-spacing--1);
  font-weight: 700;
  color: var(--kids-color-light-gray-20);
}

.join-info {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
}
.join-info dt {
  font-size: var(--kids-font-size-body-small-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  width: var(--kids-join-info--title-width);
}
.join-info dd {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
  width: calc(100% - var(--kids-join-info--title-width) - var(--kids-join-info--cont-margin));
  margin-left: var(--kids-join-info--cont-margin);
}
.join-info dd + dt, .join-info dd + dt + dd {
  margin-top: var(--kids-number-10);
}
.join-info .join-step {
  counter-reset: section;
}
.join-info .join-step > li {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
}
.join-info .join-step > li::before {
  counter-increment: section;
  content: counter(section) ".";
  font-size: var(--kids-font-size-body-small-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: inherit;
  margin-right: var(--kids-number-3);
}
.join-info .join-step > li + li {
  margin-top: var(--kids-number-5);
}

.role-list {
  counter-reset: section;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-8);
  margin: var(--kids-number-14) 0 0;
}
.role-list > li {
  padding: 0 var(--kids-padding-8);
}
.role-list > li strong {
  font-size: var(--kids-font-size-body-xlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: inline-flex;
  margin-left: var(--kids-number-5);
  max-width: calc(100% - 5rem);
}
.role-list > li p {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: var(--kids-light-color-text-subtle);
  margin-top: var(--kids-role-list--margin-top);
  padding-left: var(--kids-role-list--padding-left);
}
.role-list > li::before {
  counter-increment: section;
  content: "0" counter(section);
  font-size: var(--kids-font-size-body-xxlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-color-light-gray-20);
}
.role-list .kids-info-list {
  margin-top: var(--kids-number-8);
  padding-left: var(--kids-role-list--padding-left);
}

.role-detail-list {
  counter-reset: section;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-8);
  margin: var(--kids-role-detail-list--margin-top) 0 0;
}
.role-detail-list > li {
  width: 100%;
  color: var(--kids-light-color-text-subtle);
}
.role-detail-list > li strong {
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: inherit;
  width: calc(100% - 2.4rem - var(--kids-number-3));
  display: inline-flex;
  margin-left: var(--kids-number-3);
}
.role-detail-list > li p {
  font-size: var(--kids-font-size-body-small);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 400;
  color: inherit;
  margin-top: var(--kids-number-5);
  padding-left: var(--kids-number-11);
}
.role-detail-list > li::before {
  counter-increment: section;
  content: counter(section) ".";
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: inherit;
}

.post-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
  padding-top: var(--kids-post-nav--padding-top);
  width: 100%;
}
.post-nav a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  gap: var(--kids-post-nav--gap);
}
.post-nav a .title {
  font-size: var(--kids-font-size-body-small-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  color: var(--kids-light-color-text-subtle);
}
.post-nav a[aria-disabled=true] {
  cursor: default;
}
.post-nav a[aria-disabled=true] .title {
  color: var(--kids-light-color-text-disabled);
}
.post-nav + .page-btn-wrap {
  margin-top: var(--kids-page-btn--margin-top);
}

.history-box {
  position: relative;
  max-width: var(--kids-history-box--max-width);
  min-height: var(--kids-history-box--min-height);
  background-color: var(--kids-history-box--bg-color);
  border-radius: var(--kids-number-9);
  padding: var(--kids-history-box--padding);
  padding-right: 0;
  margin: 0 auto;
}
.history-box .history-list {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
  gap: var(--kids-gap-6);
  position: relative;
}
.history-box .history-list > li {
  position: relative;
  width: 100%;
}
.history-box .history-list > li::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: var(--kids-history-box-circle--left);
  top: 50%;
  transform: translateY(-50%);
  width: var(--kids-number-8);
  height: var(--kids-number-8);
  border-radius: var(--kids-radius-max);
  background-color: var(--kids-color-light-primary-55);
  border: var(--kids-light-border-width-variable-large) solid var(--kids-color-light-gray-0);
}
.history-box .history-list span {
  color: var(--kids-color-light-gray-0);
}
.history-box .history-list .year {
  font-size: var(--kids-font-size-body-xxlarge-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  display: inline-flex;
  min-width: 11.2rem;
}
.history-box .history-list .title {
  font-size: var(--kids-font-size-body-medium-bold);
  line-height: 1.5;
  letter-spacing: var(--kids-typo-letter-spacing-0);
  font-weight: 700;
  padding-left: var(--kids-history-box-title--padding-left);
  display: inline-block;
  vertical-align: middle;
  word-break: keep-all;
  max-width: calc(100% - 16rem);
}
.history-box .history-list::after {
  content: "";
  position: absolute;
  left: var(--kids-history-box-line--left);
  top: calc(var(--kids-history-box-line--space) + var(--kids-gap-6) / 2);
  bottom: calc(var(--kids-history-box-line--space) + var(--kids-gap-6) / 2);
  width: var(--kids-history-box-line--width);
  background-image: linear-gradient(to bottom, white 0, white 4px, transparent 4px, transparent 8px);
  background-size: var(--kids-history-box-line--size);
  background-repeat: repeat-y;
  background-position: left center;
}
.history-box .history-logo {
  position: absolute;
  right: var(--kids-history-box-logo--right);
  bottom: var(--kids-history-box-logo--bottom);
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .detail-cont .desc .for-pc {
    display: none;
  }
  .role-list > li p br {
    display: none;
  }
}
@media (max-width: 1023px) {
  .detail-top .title {
    font-size: var(--kids-font-size-display-medium);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-1);
    font-weight: 700;
    font-weight: 400;
  }
  .detail-cont .desc .for-pc {
    display: none;
  }
  .detail-info-cont {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
  }
  .detail-info-cont .detail-info-img {
    max-width: 100%;
  }
  .role-list > li p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .kids-detail-wrap.conts-wrap {
    padding-top: 0;
    padding-bottom: var(--kids-list-detail--padding-bottom-mobile);
  }
  .detail-cont-wrap {
    padding: var(--kids-list-detail-cont--padding-mobile) 0;
  }
  .detail-cont-wrap .detail-tit-wrap {
    margin-top: var(--kids-list-detail-title--margin-bottom-mobile);
    margin-bottom: var(--kids-number-8);
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
  }
  .detail-cont-wrap .detail-tit-wrap .btn-wrap {
    margin-top: var(--kids-number-8);
  }
  .detail-cont-wrap .detail-tit-wrap--btn-left {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
  }
  .detail-cont-wrap .detail-tit-wrap--btn-left .btn-wrap {
    margin-top: 0;
  }
  .detail-cont-wrap .info-group {
    margin-top: var(--kids-list-detail-cont--padding-mobile);
  }
  .detail-info-cont {
    gap: var(--kids-list-detail-thumb--gap-mobile);
  }
  .detail-info dd {
    margin-top: var(--kids-number-3);
  }
  .detail-info dd + dt {
    margin-top: var(--kids-number-10);
  }
  .program-list {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    gap: 0;
    margin: var(--kids-number-14) 0 0;
  }
  .program-list > li {
    width: 100%;
    padding: var(--kids-padding-9) 0;
  }
  .program-list > li p {
    margin-top: var(--kids-number-8);
  }
  .program-list > li + li {
    border-top: 0;
  }
  .role-list {
    margin: var(--kids-number-10) 0 0;
  }
  .role-list > li {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
  }
  .role-list > li strong {
    margin-left: var(--kids-number-5);
  }
  .role-list > li p {
    margin-top: var(--kids-role-list--margin-top-mobile);
    padding-left: var(--kids-role-list--padding-left-mobile);
    flex: 100%;
  }
  .role-list > li::before {
    margin-top: -0.3rem;
  }
  .role-detail-list {
    gap: var(--kids-gap-6);
    margin: var(--kids-role-detail-list--margin-top) 0 0;
  }
  .role-detail-list > li strong {
    width: calc(100% - 2.1rem - var(--kids-number-4));
    margin-left: var(--kids-number-4);
  }
  .post-nav {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    padding-top: var(--kids-post-nav--padding-top-mobile);
  }
  .post-nav a {
    width: 100%;
    gap: var(--kids-post-nav--gap-mobile);
    padding: var(--kids-padding-6) var(--kids-padding-5);
  }
  .post-nav a.next .title {
    order: 2;
  }
  .post-nav a.next .svg-icon {
    order: 1;
  }
  .post-nav + .page-btn-wrap {
    margin-top: var(--kids-page-btn--margin-top-mobile);
  }
  .history-box {
    min-height: var(--kids-history-box--min-height-mobile);
    border-radius: var(--kids-radius-xlarge1);
    padding: var(--kids-history-box--padding-mobile);
  }
  .history-box .history-list {
    gap: var(--kids-gap-3);
  }
  .history-box .history-list > li::after {
    left: var(--kids-history-box-circle--left-mobile);
    width: var(--kids-number-5);
    height: var(--kids-number-5);
    border-width: var(--kids-light-border-width-variable-regular);
  }
  .history-box .history-list .year {
    font-size: var(--kids-font-size-body-xsmall-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
    min-width: 6.45rem;
  }
  .history-box .history-list .title {
    font-size: var(--kids-font-size-body-xxsmall);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 400;
    padding-left: var(--kids-history-box-title--padding-left-mobile);
    max-width: calc(100% - 7rem);
    min-width: 15rem;
  }
  .history-box .history-list::after {
    left: var(--kids-history-box-line--left-mobile);
    top: calc(var(--kids-history-box-line--space-mobile) + var(--kids-gap-6) / 2);
    bottom: calc(var(--kids-history-box-line--space-mobile) + var(--kids-gap-6) / 2);
    background-image: linear-gradient(to bottom, white 0, white 2px, transparent 2px, transparent 4px);
    background-size: var(--kids-history-box-line--size-mobile);
  }
  .history-box .history-logo {
    width: var(--kids-history-box-logo--width);
    right: var(--kids-history-box-logo--right-mobile);
    bottom: var(--kids-history-box-logo--bottom-mobile);
  }
}
.board-detail-wrap {
  --kids-board-detail--margin-top: 8rem;
  --kids-board-detail--tit-width: 22.2rem;
  --kids-board-detail--tit-color: #000;
  --kids-board-detail--tit-padding-mobile: .65rem;
  --kids-board-detail--tit-margin-mobile: 1.9rem;
  --kids-board-detail--conts-padding-mobile: 1.9rem;
  --kids-board-detail--row-padding: 1.9rem var(--kids-number-12);
  --kids-board-detail--select-width: 30rem;
  --kids-board-detail--textarea-height: 39.5rem;
  --kids-board-detail--textarea-height-mobile: 35.5rem;
  --kids-board-detail--input-border-color: #DDDDDD;
  --kids-board-detail--border-top-color: #172C56;
  --kids-board-detail--border-divider-color: #D1D5DB;
  margin-top: var(--kids-board-detail--margin-top);
  border-top: var(--kids-light-border-width-variable-medium) solid var(--kids-board-detail--border-top-color);
}
.board-detail-wrap .page-btn-wrap {
  margin-bottom: var(--kids-number-10);
}

.form-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row;
  border-bottom: var(--kids-light-border-width-variable-regular) solid var(--kids-board-detail--border-divider-color);
  gap: 0;
}
.form-row .form-tit,
.form-row .form-conts {
  padding: var(--kids-board-detail--row-padding);
}
.form-row .form-tit {
  font-size: var(--kids-font-size-body-large-bold);
  line-height: 170%;
  letter-spacing: var(--kids-typo-letter-spacing--1);
  font-weight: 700;
  text-align: center;
  color: var(--kids-board-detail--tit-color);
  width: var(--kids-board-detail--tit-width);
}
.form-row .form-conts {
  flex: 1;
}
.form-row .form-conts select {
  max-width: var(--kids-board-detail--select-width);
}
.form-row .form-conts textarea {
  height: var(--kids-board-detail--textarea-height);
}

@media (max-width: 767px) {
  .board-detail-wrap {
    margin-top: 4.2rem;
  }
  .form-row {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
  }
  .form-row .form-tit,
  .form-row .form-conts {
    padding: 0;
  }
  .form-row .form-tit {
    font-size: var(--kids-font-size-body-medium-bold);
    line-height: 1.5;
    letter-spacing: var(--kids-typo-letter-spacing-0);
    font-weight: 700;
    text-align: left;
    width: 100%;
    padding: var(--kids-board-detail--tit-padding-mobile) 0;
    margin-top: var(--kids-board-detail--tit-margin-mobile);
  }
  .form-row .form-conts {
    padding-bottom: var(--kids-board-detail--conts-padding-mobile);
  }
  .form-row .form-conts select {
    max-width: 100%;
  }
  .form-row .form-conts textarea {
    height: var(--kids-board-detail--textarea-height-mobile);
  }
}
