@font-face {
    font-family: "Pretendard";
    font-weight: 900;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-Black.woff2) format("woff2"),url(../fonts/woff/Pretendard-Black.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 800;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-ExtraBold.woff2) format("woff2"),url(../fonts/woff/Pretendard-ExtraBold.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-Bold.woff2) format("woff2"),url(../fonts/woff/Pretendard-Bold.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 600;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-SemiBold.woff2) format("woff2"),url(../fonts/woff/Pretendard-SemiBold.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-Medium.woff2) format("woff2"),url(../fonts/woff/Pretendard-Medium.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-Regular.woff2) format("woff2"),url(../fonts/woff/Pretendard-Regular.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 300;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-Light.woff2) format("woff2"),url(../fonts/woff/Pretendard-Light.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 200;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-ExtraLight.woff2) format("woff2"),url(../fonts/woff/Pretendard-ExtraLight.woff) format("woff")
}

@font-face {
    font-family: "Pretendard";
    font-weight: 100;
    font-display: swap;
    src: url(../fonts/woff2/Pretendard-Thin.woff2) format("woff2"),url(../fonts/woff/Pretendard-Thin.woff) format("woff")
}

html,body {
    font-family: "Pretendard",-apple-system,Noto Sans KR,SD Gothic Neo
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Right_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Up_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Left_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Down_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Download.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Search.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Lock.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Home.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.mt--16 {
    margin-top: -16px !important
}

.mt--40 {
    margin-top: -40px !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.mb-32 {
    margin-bottom: 32px !important
}

.buttonBox {
    position: fixed;
    bottom: 40px;
    right: 20px;
    padding-bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px;
    transition: opacity .3s ease;
    z-index: 1;
    opacity: 0;
    visibility: hidden
}

.buttonBox .topBtn {
    width: 50px;
    height: 50px;
    border-radius: 30px;
    background-color: #000;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 22.7998V2.5498' stroke='white' stroke-width='1.6'/%3E%3Cpath d='M19.1998 9.7498L11.9998 2.5498L4.7998 9.7498' stroke='white' stroke-width='1.6'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer
}

.buttonBox .linkBtn {
    width: 50px;
    height: 50px;
    border-radius: 30px;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M15 11.4L22.2 6.59998V16.2H28.2V25.8H15V11.4Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M15.0004 4.19995H5.40039V19.7999H7.80039V25.7999H15.0004V4.19995Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M7.80078 25.7999V19.7999H1.80078V25.7999H7.80078Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M9 9H11.4' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M9 13.7999H11.4' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
    border: 1px solid #000;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center
}

.buttonBox .linkBtn.linkBtn2 {
    background-image: url("../images/icons/ImageAssets_Share.svg")
}

.buttonBox.visible {
    opacity: 1;
    visibility: visible;
    transition: opacity .3s ease
}

.buttonBox.no-fixed {
    position: absolute;
    bottom: 223px
}

.main .buttonBox {
    padding-bottom: 162px
}

.main .chatbot-container {
    bottom: 40px
}

.main .chatbot-container.no-fixed {
    position: absolute
}

@media screen and (max-width: 767px) {
    .buttonBox {
        bottom:9.3023255814vw !important;
        right: 4.6511627907vw !important;
        padding-bottom: 42.5581395349vw !important;
        gap: 2.7906976744vw !important
    }

    .buttonBox .topBtn {
        width: 11.6279069767vw;
        height: 11.6279069767vw;
        border-radius: 6.976744186vw;
        background-size: 4.6511627907vw
    }

    .buttonBox .linkBtn {
        width: 11.6279069767vw;
        height: 11.6279069767vw;
        border-radius: 6.976744186vw;
        background-size: 4.6511627907vw
    }

    .chatbot {
        bottom: 37.2093023256vw !important
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Right_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Up_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Left_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Down_Arrow.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Download.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Search.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Lock.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.icon {
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-image: url("../images/icons/ImageAssets_Home.svg")
}

.icon-sm {
    width: 16px;
    height: 16px
}

.icon-md {
    width: 24px;
    height: 24px
}

.icon-lg {
    width: 32px;
    height: 32px
}

@media screen and (max-width: 767px) {
    .icon {
        width:5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-sm {
        width: 3.7209302326vw;
        height: 3.7209302326vw
    }

    .icon-md {
        width: 5.5813953488vw;
        height: 5.5813953488vw
    }

    .icon-lg {
        width: 7.4418604651vw;
        height: 7.4418604651vw
    }
}

.mt--16 {
    margin-top: -16px !important
}

.mt--40 {
    margin-top: -40px !important
}

.mb-0 {
    margin-bottom: 0 !important
}

.mb-32 {
    margin-bottom: 32px !important
}

.buttonBox {
    position: fixed;
    bottom: 40px;
    right: 20px;
    padding-bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px;
    transition: opacity .3s ease;
    z-index: 1;
    opacity: 0;
    visibility: hidden
}

.buttonBox .topBtn {
    width: 50px;
    height: 50px;
    border-radius: 30px;
    background-color: #000;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 22.7998V2.5498' stroke='white' stroke-width='1.6'/%3E%3Cpath d='M19.1998 9.7498L11.9998 2.5498L4.7998 9.7498' stroke='white' stroke-width='1.6'/%3E%3C/svg%3E");
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer
}

.buttonBox .linkBtn {
    width: 50px;
    height: 50px;
    border-radius: 30px;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M15 11.4L22.2 6.59998V16.2H28.2V25.8H15V11.4Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M15.0004 4.19995H5.40039V19.7999H7.80039V25.7999H15.0004V4.19995Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M7.80078 25.7999V19.7999H1.80078V25.7999H7.80078Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M9 9H11.4' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M9 13.7999H11.4' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
    border: 1px solid #000;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center
}

.buttonBox .linkBtn.linkBtn2 {
    background-image: url("../images/icons/ImageAssets_Share.svg")
}

.buttonBox.visible {
    opacity: 1;
    visibility: visible;
    transition: opacity .3s ease
}

.buttonBox.no-fixed {
    position: absolute;
    bottom: 223px
}

.main .buttonBox {
    padding-bottom: 162px
}

.main .chatbot-container {
    bottom: 40px
}

.main .chatbot-container.no-fixed {
    position: absolute
}

@media screen and (max-width: 767px) {
    .buttonBox {
        bottom:9.3023255814vw !important;
        right: 4.6511627907vw !important;
        padding-bottom: 42.5581395349vw !important;
        gap: 2.7906976744vw !important
    }

    .buttonBox .topBtn {
        width: 11.6279069767vw;
        height: 11.6279069767vw;
        border-radius: 6.976744186vw;
        background-size: 4.6511627907vw
    }

    .buttonBox .linkBtn {
        width: 11.6279069767vw;
        height: 11.6279069767vw;
        border-radius: 6.976744186vw;
        background-size: 4.6511627907vw
    }

    .chatbot {
        bottom: 37.2093023256vw !important
    }
}

*,*::before,*::after {
    box-sizing: border-box
}

body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,blockquote,dl,dd {
    margin: 0;
    padding: 0;
    color: #171719
}

html,body {
    font-family: "Pretendard",-apple-system,Noto Sans KR,SD Gothic Neo
}

ul,ol {
    list-style: none;
    padding-left: 0
}

li {
    margin: 0;
    list-style: none
}

blockquote,q {
    quotes: none
}

blockquote::before,blockquote::after,q::before,q::after {
    content: ""
}

a {
    text-decoration: none;
    color: inherit
}

html {
    font-size: 100%;
    color: #333
}

body {
    background-color: #fff
}

input,textarea,select,button {
    border: none;
    padding: 0;
    margin: 0;
    background: rgba(0,0,0,0);
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    box-shadow: none;
    outline: none;
    padding-block:0;padding-inline:0}

select {
    appearance: none
}

input:focus,textarea:focus,select:focus,button:focus {
    outline: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

img {
    max-width: 100%;
    height: auto;
    display: block
}

.heading1 {
    color: #171719;
    font-size: 64px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    letter-spacing: -1.28px
}

.heading2 {
    color: #171719;
    font-size: 48px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    letter-spacing: -0.96px
}

.heading3 {
    color: #171719;
    font-size: 38px;
    font-style: normal;
    font-weight: 800;
    line-height: normal
}

.heading4 {
    color: #171719;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal
}

.heading5 {
    color: #171719;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 136%;
    letter-spacing: -0.64px
}

.heading6 {
    color: #171719;
    font-size: 30px;
    font-style: normal;
    font-weight: 800;
    line-height: 136%;
    letter-spacing: -0.6px
}

.heading7 {
    color: #171719;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    line-height: normal
}

.heading8 {
    color: #171719;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

.fs-i {
    font-size: ipx
}

select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M14 4.95455L8 11.5L2 4.95454' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 8px;
    background-position: right 16px center
}

header {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    min-width: 1104px;
    min-height: 98px;
    z-index: 1000
}

header .dim {
    display: none
}

header.show .dim {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0,0,0,.4);
    z-index: 1
}

header.show .header-box {
    border-bottom: 1px solid #eaebec
}

header .header {
    position: relative;
    width: 100%;
    background-color: #fff;
    z-index: 2
}

header .header-box {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    min-height: 98px;
    border-bottom: 1px solid rgba(0,0,0,0)
}

header .header-box .logo {
    position: absolute;
    top: auto;
    bottom: auto;
    left: 52px
}

header .header-box .logo a {
    display: inline-block;
    width: 216px;
    height: 44px;
    background-image: url("../images/ImageAssets_new_logo.svg");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center
}

@media(max-width: 1530px) {
    header .header-box .logo a {
        display:inline-block;
        width: 216px;
        height: 43px;
        background-image: url("../images/Logo.svg");
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: center
    }
}

@media(max-width: 1282px) {
    header .header-box .logo .call {
        display:none
    }
}

header .header-box .gnb {
    width: 947px;
    height: 100%
}

header .header-box .gnb ul {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 40px
}

header .header-box .gnb ul li {
    min-width: 125px;
    width: 20%;
    text-align: center
}

header .header-box .gnb ul li:nth-child(5) {
    min-width: 110px
}

header .header-box .gnb ul li a {
    font-size: 18px;
    font-weight: 700;
    color: #171719
}

header .header-box .gnb ul li a:hover {
    color: #3479ec
}

header .header-box .right {
    position: absolute;
    top: auto;
    bottom: auto;
    right: 40px;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    gap: 40px
}

header .header-box .right .call-box {
    position: relative
}

header .header-box .right .call-box .lg {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3px
}

header .header-box .right .call-box .md {
    display: none;
    margin-right: -16px
}

header .header-box .right .call-box .btn-call {
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/ImageAssets_Call_btn.svg");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    cursor: pointer
}

header .header-box .right .call-box .call-popup {
    display: none;
    position: absolute;
    bottom: -50px;
    right: -20px;
    min-width: 235px;
    padding: 14px;
    border-radius: 4px;
    border: 1.6px solid #3479ec;
    background-color: #fff;
    box-shadow: 0px 4px 12px 0px rgba(0,0,0,.15)
}

header .header-box .right .call-box .call-popup p {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

header .header-box .right .call-box .call-popup p span {
    font-size: 14px;
    font-weight: 700;
    color: #3479ec
}

header .header-box .right .call-box p {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    font-size: 12px;
    font-weight: 700;
    color: #000;
    gap: 2px
}

header .header-box .right .call-box p i {
    display: inline-flex;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'%3E%3Cpath d='M2.37367 1.66504L1 1.82961C1.08615 3.38486 1.52462 4.92423 2.31539 6.31791C2.76129 7.10379 3.31922 7.84335 3.98916 8.51325C4.65911 9.18321 5.39865 9.74115 6.18454 10.1871C7.57822 10.9778 9.11758 11.4163 10.6728 11.5025L10.8374 10.1288' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M6.18451 10.1866L7.61647 7.78735L11.002 8.75467L10.8374 10.1283' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M2.31531 6.31744L4.71455 4.88548L3.74726 1.5L2.37359 1.66457' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-size: 10px;
    background-repeat: no-repeat;
    background-position: center
}

header .header-box .right .call-box p.tel {
    font-size: 14px;
    font-weight: 700;
    color: #3479ec
}

@media(max-width: 1530px) {
    header .header-box .right .call-box .logo a {
        display:inline-block;
        width: 165px;
        height: 44px;
        background-image: url("../images/logo-small.svg");
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: center
    }

    header .header-box .right .call-box .lg {
        display: none
    }

    header .header-box .right .call-box .md {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 3px
    }
}

@media(max-width: 1282px) {
    header .header-box .right .call-box .logo .call,header .header-box .right .call-box .md {
        display:none
    }
}

header .header-box .right .switch-toggle {
    position: relative;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    width: 199px;
    height: 43px;
    padding: 4px;
    border-radius: 999px;
    background-color: #f4f4f5;
    box-shadow: 0px 2px 3px rgba(0,0,0,.06) inset;
    cursor: pointer
}

header .header-box .right .switch-toggle .switch {
    position: absolute;
    left: 4px;
    top: 4px;
    width: 104px;
    height: 35px;
    border-radius: 999px;
    background: linear-gradient(180deg, #4A85E9 0%, #3078EF 92%, #265096 100%);
    transition: left .3s ease,width .3s ease;
    z-index: 1
}

header .header-box .right .switch-toggle input[type=radio] {
    display: none
}

header .header-box .right .switch-toggle label {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 35px;
    cursor: pointer;
    transition: color .3s ease;
    font-size: 14px;
    font-weight: 700;
    color: #0f0f10;
    z-index: 2
}

header .header-box .right .switch-toggle label[for=toggle-switch-1] {
    width: 104px
}

header .header-box .right .switch-toggle label[for=toggle-switch-2] {
    width: 87px
}

header .header-box .right .switch-toggle input#toggle-switch-1:checked~.switch {
    width: 104px;
    left: 4px
}

header .header-box .right .switch-toggle input#toggle-switch-2:checked~.switch {
    width: 87px;
    left: calc(100% - 91px)
}

header .header-box .right .switch-toggle input#toggle-switch-1:checked~label[for=toggle-switch-1] {
    color: #fff
}

header .header-box .right .switch-toggle input#toggle-switch-2:checked~label[for=toggle-switch-2] {
    color: #fff
}

header .lnb-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    display: none;
    width: 689px;
    margin: 0 auto;
    gap: 16px;
    padding: 40px 0
}

header .lnb-box ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    min-width: 149px
}

header .lnb-box ul li {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

header .lnb-box ul li a {
    font-size: 14px;
    font-weight: 700;
    color: #37383c
}

header .lnb-box ul li a:hover {
    color: #3479ec
}

header .lnb-box ul li a.active {
    color: #3479ec
}

.kv-wrap {
    position: relative;
    width: 100%;
    height: 500px;
    background-size: cover;
    background-position: center
}

.kv-wrap .kv-box {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 1104px;
    height: 100%;
    margin: 0 auto
}

.kv-wrap .kv-box .page-title {
    color: #fff
}

.kv-wrap .kv-box .nav {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px 0;
    z-index: 3
}

.kv-wrap .kv-box .nav>* {
    border-right: 1px solid #c2c4c8
}

.kv-wrap .kv-box .nav>*:last-child {
    border-right: 0
}

.kv-wrap .kv-box .nav .btn {
    margin-top: 0
}

.kv-wrap .kv-box .nav .depth-box-1,.kv-wrap .kv-box .nav .depth-box-2 {
    position: relative;
    width: 320px
}

.kv-wrap .kv-box .nav .depth-box-1 .btn,.kv-wrap .kv-box .nav .depth-box-2 .btn {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    text-align: left
}

.kv-wrap .kv-box .nav .depth-box-1 .btn .icon,.kv-wrap .kv-box .nav .depth-box-2 .btn .icon {
    display: inline-flex;
    width: 16px;
    height: 16px;
    background-image: url("../images/icons/ImageAssets_Down_Arrow_16.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

.kv-wrap .kv-box .nav .depth-box-1 .btn.active .icon,.kv-wrap .kv-box .nav .depth-box-2 .btn.active .icon {
    transform: rotate(180deg)
}

.kv-wrap .kv-box .nav .depth-box-1 .dropdown,.kv-wrap .kv-box .nav .depth-box-2 .dropdown {
    display: none;
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    background-color: #1d5ad8;
    z-index: 1
}

.kv-wrap .kv-box .nav .depth-box-1 .dropdown.active,.kv-wrap .kv-box .nav .depth-box-2 .dropdown.active {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start
}

.kv-wrap .kv-box .nav .depth-box-1 .dropdown li,.kv-wrap .kv-box .nav .depth-box-2 .dropdown li {
    width: 100%;
    padding: 0 20px
}

.kv-wrap .kv-box .nav .depth-box-1 .dropdown li:first-child,.kv-wrap .kv-box .nav .depth-box-2 .dropdown li:first-child {
    padding-top: 12px
}

.kv-wrap .kv-box .nav .depth-box-1 .dropdown li:last-child,.kv-wrap .kv-box .nav .depth-box-2 .dropdown li:last-child {
    padding-bottom: 12px
}

.kv-wrap .kv-box .nav .depth-box-1 .dropdown li a,.kv-wrap .kv-box .nav .depth-box-2 .dropdown li a {
    display: block;
    width: 100%;
    padding: 8px 0;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    line-height: 160%
}

footer {
    position: relative;
    display: flex;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    min-width: 1104px;
    min-height: 182px;
    padding: 54px 80px;
    border-top: 1px solid #eaebec;
    background-color: #fff;
    z-index: 3
}

footer .footer {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%
}

footer .footer .left-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 40px;
    min-width: 733px
}

footer .footer .left-box .logo {
    width: 80px
}

footer .footer .left-box .f-info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px
}

footer .footer .left-box .f-info p {
    display: flex
}

footer .footer .left-box .f-info span {
    position: relative;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 500;
    color: #70737c
}

footer .footer .left-box .f-info span::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 10px;
    background-color: #eaebec;
    transform: translateY(-50%)
}

footer .footer .left-box .f-info span:first-child {
    width: 55px;
    text-align: left;
    padding: 0;
    font-size: 12px;
    font-weight: 700;
    color: #70737c
}

footer .footer .left-box .f-info span:first-child::before {
    content: none
}

footer .footer .left-box .f-info .copyright {
    margin-top: 8px;
    font-size: 12px;
    font-weight: 700;
    color: #70737c
}

footer .footer .right-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 40px
}

footer .footer .right-box .sns-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px
}

footer .footer .right-box .sns-box a {
    width: 42px
}

footer .footer .right-box .select-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px
}

footer .footer .right-box .select-box>* {
    width: 98px;
    height: 42px;
    padding: 11px 16px;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    border-radius: 6px;
    border: 1px solid #eaebec;
    background-color: #fff;
    cursor: pointer
}

footer .footer .right-box .select-box>*.family-site {
    width: 122px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M14 4.95455L8 11.5L2 4.95454' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 8px;
    background-position: right 16px center
}

footer .footer .right-box .select-box .organ {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 147px
}

.icon-home {
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cg clip-path='url(%23clip0_5591_5532)'%3E%3Cpath d='M8 14.2216V10.4883' stroke='white' stroke-width='1.6'/%3E%3Cpath d='M14.2223 14.2219H1.77783V6.97305L8.00005 1.37305L14.2223 6.97305V14.2219Z' stroke='white' stroke-width='1.6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_5591_5532'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-size: 100%
}

.icon-lock {
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.6004 7.37891H2.40039V14.8456H13.6004V7.37891Z' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M4.88965 7.37847V4.26736C4.88965 2.54914 6.28254 1.15625 8.00076 1.15625C9.71896 1.15625 11.1119 2.54914 11.1119 4.26736V7.37847' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8 9.86719V12.3561' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-size: 100%
}

.icon-qna {
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M7 1.5V9.5H15' stroke='black'/%3E%3C/svg%3E");
    background-size: 100%
}

.icon-down-arrow-gray {
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M14 4.95455L8 11.5L2 4.95454' stroke='%23C2C4C8' stroke-width='1.4'/%3E%3C/svg%3E");
    background-size: 100%
}

.icon-download {
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' viewBox='0 0 16 17' fill='none'%3E%3Cpath d='M2 11.5703V14.5702H13.9997V11.5703' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M4.40039 8.30469L8.00029 11.9046L11.6002 8.30469' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8 11.9041V2.9043' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-size: 100%
}

.ellipsis {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical
}

.ellipsis-1 {
    -webkit-line-clamp: 1
}

.ellipsis-2 {
    -webkit-line-clamp: 2
}

.ellipsis-3 {
    -webkit-line-clamp: 3
}

#main-lottie {
    position: absolute;
    bottom: 40px;
    left: 50%;
    width: 28px;
    height: 40px;
    transform: translateX(-50%);
    z-index: 2
}

input[type=checkbox] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    padding: 3.75px;
    flex-shrink: 0;
    border-radius: 2px;
    border: 1.4px solid #c2c4c8;
    background-color: #fff
}

input[type=checkbox]+label {
    cursor: pointer
}

input[type=checkbox]:hover {
    border: 1.4px solid #3479ec
}

input[type=checkbox]:checked {
    background-color: #3479ec;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cg clip-path='url(%23clip0_4083_8538)'%3E%3Cpath d='M13.0087 2.97923L5.32361 12.2013L1.04492 7.8004L2.53866 6.34815L5.20442 9.09008L11.4082 1.64551L13.0087 2.97923Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_4083_8538'%3E%3Crect width='12.5' height='12.5' fill='white' transform='translate(0.75 0.75)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-size: 12.5px
}

input[type=checkbox].blue_bg {
    border: 1.4px solid #9bc1ff;
    background-color: #4b7fd3
}

input[type=checkbox].blue_bg:hover {
    border: 1.4px solid #fff
}

input[type=checkbox].blue_bg:checked {
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cg clip-path='url(%23clip0_4064_13761)'%3E%3Cpath d='M13.0087 2.97923L5.32361 12.2013L1.04492 7.8004L2.53866 6.34815L5.20442 9.09008L11.4082 1.64551L13.0087 2.97923Z' fill='%231D5AD8'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_4064_13761'%3E%3Crect width='12.5' height='12.5' fill='white' transform='translate(0.75 0.75)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")
}

.btn {
    margin-top: 8px;
    cursor: pointer;
    transition: background-color ease .3s,border ease .3s
}

.btn.btn-default {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 302px;
    height: 50px;
    padding: 8px 20px;
    background-color: #fff;
    font-size: 18px;
    font-weight: 700;
    color: #171719
}

.btn.btn-default:hover {
    font-size: 18px;
    font-weight: 700;
    color: #3479ec
}

.btn.btn-tooltip {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px;
    height: 22px;
    padding: 0px 8px;
    border-radius: 4px;
    background-color: #000
}

.btn.btn-square-gradient {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 14px;
    border-radius: 6px;
    background: linear-gradient(180deg, #4A85E9 0%, #2968D0 50%, #2E66C2 100%);
    font-size: 12px;
    font-weight: 700;
    color: #fff
}

.btn.btn-square-gradient:hover {
    background-color: #3479ec
}

.btn.btn-square-fill {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 60px;
    padding: 8px 20px;
    margin: 0 auto;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background-color: #3479ec
}

.btn.btn-square-fill:hover {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background-color: #1d5ad8
}

.btn.btn-square-white {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 40px;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 700;
    color: #70737c;
    background-color: #fff
}

.btn.btn-square-border {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    min-height: 40px;
    padding: 0 20px;
    border: 1px solid #989ba2;
    background-color: #fff;
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

.btn.btn-square-border:hover {
    color: #3479ec;
    border: 1px solid #3479ec;
    background-color: #fff
}

.btn.btn-round-line {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 14px 26px;
    border-radius: 1000px;
    border: 2px solid #fff;
    font-size: 16px;
    font-weight: 700;
    color: #fff
}

.btn.btn-round-line:hover {
    background-color: #fff;
    font-size: 16px;
    font-weight: 700;
    color: #3479ec
}

.btn.btn-input {
    padding: 0 20px;
    height: 50px;
    border: 1px solid #c2c4c8;
    background-color: #f7f7f8;
    font-size: 16px;
    font-weight: 700;
    color: #171719;
    margin: 0
}

.btn.btn-input:hover {
    border: 1px solid #989ba2;
    background-color: #f7f7f8
}

.btn.btn-arrow-up {
    position: absolute;
    top: 10px;
    right: 21px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 39px;
    height: 39px;
    border-radius: 100px;
    margin: 0;
    border: 1px solid #fff;
    background-image: url("../images/icons/ImageAssets_Up_Arrow_16.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    transform: rotate(0)
}

.btn.btn-arrow-up.active {
    border: 1px solid #dcdcdc;
    transform: rotate(180deg)
}

.btn.btn-close-text {
    padding: 10.5px 6px;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.btn.btn-close-x {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    margin: 0;
    background-image: url("../images/icons/ImageAssets_X_24.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%
}

.btn.btn-close-x.black {
    background-image: url("../images/icons/ImageAssets_X_24_black.svg")
}

.btn.btn-home {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 56px;
    height: 40px
}

.pagination-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 4px;
    min-height: 60px;
    width: 100%;
    padding: 0 20px
}

.pagination-box .pagination {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid #989ba2;
    background-color: #fff;
    cursor: pointer
}

.pagination-box .pagination.b-none {
    border: none
}

.pagination-box .pagination.b-none.num {
    color: #70737c
}

.pagination-box .pagination.num {
    font-size: 14px;
    font-weight: 700;
    color: #37383c;
    line-height: 160%
}

.pagination-box .pagination.num.active {
    color: #fff;
    border: 1px solid #3479ec;
    background-color: #3479ec
}

.pagination-box .pagination.arrow {
    background-size: 6px 10px;
    background-repeat: no-repeat;
    background-position: center;
    color: #989ba2
}

.pagination-box .pagination.arrow.prev {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='10' viewBox='0 0 6 10' fill='none'%3E%3Cpath d='M5.0625 0.875L0.9375 5L5.0625 9.125' stroke='%2337383C' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E")
}

.pagination-box .pagination.arrow.prev.start {
    background-size: 11px 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10' fill='none'%3E%3Cpath d='M10.5625 0.875L6.4375 5L10.5625 9.125' stroke='%2370737C' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M5.5625 0.875L1.4375 5L5.5625 9.125' stroke='%2370737C' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
}

.pagination-box .pagination.arrow.next {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='10' viewBox='0 0 6 10' fill='none'%3E%3Cpath d='M0.9375 0.875L5.0625 5L0.9375 9.125' stroke='%2337383C' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E")
}

.pagination-box .pagination.arrow.next.end {
    background-size: 11px 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10' fill='none'%3E%3Cpath d='M1.4375 0.875L5.5625 5L1.4375 9.125' stroke='%2337383C' stroke-linecap='square' stroke-linejoin='round'/%3E%3Cpath d='M6.4375 0.875L10.5625 5L6.4375 9.125' stroke='%2337383C' stroke-linecap='square' stroke-linejoin='round'/%3E%3C/svg%3E")
}

.tab-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px
}

.tab-box .tab {
    cursor: pointer;
    transition: background-color ease .3s
}

.tab-box .tab-transparent {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid #fff;
    font-size: 16px;
    font-weight: 700;
    color: #fff
}

.tab-box .tab-transparent.active {
    background-color: #fff;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.tab-box .tab-sqaure-small {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid #c2c4c8;
    background-color: #fff;
    font-size: 16px;
    font-weight: 700;
    color: #989ba2
}

.tab-box .tab-sqaure-small.active {
    border: 1px solid #3479ec;
    font-size: 16px;
    font-weight: 700;
    color: #3479ec
}

.tab-box .tab-sqaure-large {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 14.5px 20px;
    border: 1px solid #c2c4c8;
    background-color: #fff;
    font-size: 16px;
    font-weight: 700;
    color: #989ba2
}

.tab-box .tab-sqaure-large.active {
    border: 1px solid #3479ec;
    font-size: 16px;
    font-weight: 700;
    color: #3479ec
}

.tab-box .tab-underline {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 20px 12px;
    border-bottom: 1px solid #fff;
    font-size: 16px;
    font-weight: 700;
    color: #989ba2
}

.tab-box .tab-underline.active {
    border-bottom: 2px solid #000;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.badge {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    color: #fff
}

.badge-lg {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 700;
    color: #fff
}

.badge-onsale {
    background-color: #2b8bfd
}

.badge-wating {
    background-color: #aa8f84
}

.badge-unsold {
    background-color: #6e6e6e
}

.tag {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 6px 12px;
    border-radius: 4px;
    border: 1.4px solid #3479ec
}

.swiper-wrap {
    position: relative
}

.swiper {
    position: relative;
    overflow: unset;
    display: flex;
    flex-direction: column
}

.swiper-button-next,.swiper-button-prev {
    width: 32px;
    height: 32px
}

.swiper-button-next,.swiper-rtl .swiper-button-prev {
    left: auto;
    right: -74px;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_32.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    color: rgba(0,0,0,0)
}

.swiper-button-prev,.swiper-rtl .swiper-button-next {
    right: auto;
    left: -74px;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_32.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    color: rgba(0,0,0,0);
    transform: rotate(180deg)
}

.swiper-button-next:after,.swiper-button-prev:after {
    font-size: 0
}

.swiper-pagination {
    display: inline-flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 2px;
    width: auto !important;
    position: absolute;
    bottom: auto;
    top: 50%;
    left: auto;
    right: 38px;
    transform: translateY(-50%)
}

.swiper-pagination span {
    font-size: 18px;
    font-weight: 700;
    color: #989ba2
}

.swiper-pagination .custom-pagination-current {
    color: #fff
}

.swiper-pagination .custom-pagination-total {
    color: #989ba2
}

.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal {
    display: block !important;
    left: 0;
    bottom: -68px;
    top: auto;
    width: 1034px;
    height: 2px
}

.swiper-scrollbar {
    background-color: #eaebec
}

.controls {
    position: absolute;
    top: 50%;
    right: 0;
    height: 24px;
    transform: translateY(-50%);
    z-index: 1
}

.controls .control-button {
    width: 24px;
    height: 24px;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer
}

.controls .control-button.stop {
    background-image: url("../images/icons/ImageAssets_Pressed.svg")
}

.controls .control-button.play {
    background-image: url("../images/icons/ImageAssets_Play.svg")
}

.card {
    min-width: 360px;
    box-shadow: 0px 7px 16px 0px rgba(0,0,0,.12)
}

.card .card-top {
    clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 40px, 100% 100%, 0 100%)
}

.card .content-img {
    position: relative;
    width: 100%;
    padding-top: 223px
}

.card .content-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 360px;
    transform: translate(-50%, -50%)
}

.card .content-text {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
    gap: 16px;
    padding: 15px 17px 16px 24px;
    background-color: #fff
}

.card .content-text.accordion {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    overflow: hidden;
    transition: height .3s ease-out
}

.card .content-text .top {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    width: 100%
}

.card .content-text .top.d-row {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 12px
}

.card .content-text .top .title {
    font-size: 20px;
    font-weight: 800;
    color: #171719;
    letter-spacing: -0.4px
}

.card .content-text .bottom {
    width: 100%
}

.card .content-text .bottom .content-info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start
}

.card .content-text .bottom .content-info p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 4px 0
}

.card .content-text .bottom .content-info p span {
    min-width: 70px;
    font-size: 12px;
    font-weight: 700;
    color: #171719
}

.card .content-text .bottom .content-info p span:first-child {
    font-size: 12px;
    font-weight: 700;
    color: #70737c
}

.card .content-info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start
}

.card .content-info p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 4px 0
}

.card .content-info p span {
    min-width: 70px;
    font-size: 12px;
    font-weight: 700;
    color: #171719
}

.card .content-info p span:first-child {
    font-size: 12px;
    font-weight: 700;
    color: #70737c
}

.data {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 20px;
    width: 351px;
    height: 315px
}

.data .img-box {
    position: relative;
    width: 100%;
    height: 192px;
    padding-top: 192;
    overflow: hidden;
    background-color: #f7f7f8;
    background-image: url("../images/no-image-logo.png");
    background-position: center;
    background-repeat: no-repeat
}

.data .img-box>* {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.data .img-box.video::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .5;
    background-color: #000
}

.data .img-box.video::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='20' viewBox='0 0 17 20' fill='none'%3E%3Cpath d='M16.9997 10L0.333008 20V0L16.9997 10Z' fill='%23DBDCDF'/%3E%3C/svg%3E");
    background-size: 16px 20px;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 2
}

.data .text-box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    padding: 0
}

.data .text-box .title-box p {
    font-size: 16px;
    font-weight: 700;
    color: #171719;
    line-height: 140%
}

.data .text-box .info-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 24px
}

.data .text-box .info-box p {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #70737c
}

.data .text-box .info-box p::after {
    position: absolute;
    top: 50%;
    right: -12px;
    content: "";
    width: 1px;
    height: 10px;
    background-color: #c2c4c8;
    transform: translateY(-50%)
}

.data .text-box .info-box p:last-child::after {
    content: none
}

.banner {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 445px;
    overflow: hidden
}

.banner>div {
    width: 552px;
    height: 100%
}

.banner .content-text {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 48px;
    height: 100%;
    padding: 64px;
    background-color: #3479ec
}

.banner .content-text .text-box {
    padding-top: 0
}

.banner .content-text .text-box p {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    font-weight: 700;
    line-height: 160%
}

.banner .content-img {
    position: relative;
    width: 100%;
    padding-top: 445px
}

.banner .content-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 552px;
    transform: translate(-50%, -50%)
}

.list-box ul {
    border-top: 1px solid #000
}

.list-box ul li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    min-height: 64px;
    padding: 0 8px;
    border-bottom: 1px solid #eaebec
}

.list-box ul li a {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    width: 100%;
    height: 100%;
    padding: 22px 0;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.list-box ul li a p {
    width: 410px
}

.board table {
    width: 100%
}

.board table tbody tr:not(.no-data):hover {
    background-color: #fbfbfb
}

.board table tr {
    border-bottom: 1px solid #eaebec
}

.board table tr.no-data {
    height: 400px
}

.board table tr th {
    padding: 25.5px 8px;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.board table tr td {
    padding: 22px 8px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%;
    text-align: center
}

.board table tr td.title {
    text-align: left;
    display: block
}

.board table tr td.icon {
    padding-left: 40px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.5999 7.37891H2.3999V14.8456H13.5999V7.37891Z' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M4.88867 7.37847V4.26736C4.88867 2.54914 6.28157 1.15625 7.99978 1.15625C9.71799 1.15625 11.1109 2.54914 11.1109 4.26736V7.37847' stroke='black' stroke-width='1.4'/%3E%3Cpath d='M8 9.86719V12.3561' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 16px;
    background-position: left 16px center
}

.board table tr td.icon.file {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8.19809 15L13.646 9.28226C15.4513 7.38757 15.4513 4.3157 13.646 2.42101C11.8407 0.526329 8.91376 0.526329 7.10849 2.42101L1.90265 7.88464C0.699117 9.14772 0.699117 11.1956 1.90265 12.4588C3.10617 13.7219 5.05748 13.7219 6.26101 12.4588L11.4668 6.99522C12.0686 6.36363 12.0686 5.33966 11.4668 4.7081C10.8651 4.07654 9.88943 4.07654 9.28763 4.7081L4.08183 10.1717' stroke='%23C2C4C8' stroke-width='1.4'/%3E%3C/svg%3E")
}

.post-navigation {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%
}

.post-navigation>div {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 60px;
    border-bottom: 1px solid #eaebec
}

.post-navigation>div.prev-post {
    border-top: 1px solid #eaebec
}

.post-navigation>div.prev-post .icon {
    transform: rotate(180deg)
}

.post-navigation>div>p {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 12px;
    width: 110px;
    height: 100%;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.post-navigation>div>a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: calc(100% - 110px);
    height: 100%;
    padding: 0 20px
}

.post-navigation>div>a p {
    font-size: 16px;
    font-weight: 500;
    color: #171719
}

.modal-overflow {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1010;
    overflow-y: auto;
    padding: 40px;
    opacity: 1
}

.modal-overflow.dim {
    background: rgba(0,0,0,.4)
}

.modal-overflow .btn-close-x {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 1
}

.modal-overflow .modal-dialog {
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;
    width: 600px;
    max-width: 100% !important;
    background: #fff;
    opacity: 1
}

#mainTodayPopup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 10;
    justify-content: center;
    align-items: center;
    gap: 20px;
    z-index: 10000
}

#mainTodayPopup::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .4;
    background-color: #171719
}

#mainTodayPopup .popup-wrap {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 500px;
    height: 666px;
    z-index: 1
}

#mainTodayPopup .popup-wrap.popup02 .popup-footer {
    justify-content: flex-end
}

#mainTodayPopup .popup-wrap .popup-content {
    width: 100%;
    height: auto;
    max-height: 600px;
    overflow: hidden
}

#mainTodayPopup .popup-wrap .popup-content .contentWrap {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 40px 40px 0
}

#mainTodayPopup .popup-wrap .popup-content .contentWrap .textWrap {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px;
    width: 100%
}

#mainTodayPopup .popup-wrap .popup-content .contentWrap .textWrap .topTxt {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 700;
    color: #171719;
    line-height: 160%
}

#mainTodayPopup .popup-wrap .popup-content .contentWrap .textWrap .middleTxt {
    width: 100%
}

#mainTodayPopup .popup-wrap .popup-content .contentWrap .btn {
    position: absolute;
    left: 40px;
    bottom: 40px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: fit-content;
    padding: 12px 50px 12px 26px;
    margin-top: 0;
    border-radius: 100px;
    background-color: #fff;
    font-size: 16px;
    font-weight: 700;
    color: #171719;
    border: 2px solid #c2c4c8
}

#mainTodayPopup .popup-wrap .popup-content .contentWrap .btn::after {
    content: "";
    position: absolute;
    right: 26px;
    top: 12px;
    width: 16px;
    height: 16px;
    background-image: url("../images/icons/IconAssets_Up_TailArrow_16.svg");
    background-position: center center
}

#mainTodayPopup .popup-wrap .popup-footer {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 66px;
    padding: 20px;
    background-color: #fff;
    border-top: 1px solid #c2c4c8
}

#mainTodayPopup .popup-wrap .popup-footer .swiper-pagination-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    height: 100%
}

#mainTodayPopup .popup-wrap .popup-footer .swiper-pagination {
    position: unset;
    width: 32px;
    transform: translate(0, 0)
}

#mainTodayPopup .popup-wrap .popup-footer .swiper-pagination .custom-pagination-current {
    color: #171719
}

#mainTodayPopup .popup-wrap .popup-footer .swiper-button-next,#mainTodayPopup .popup-wrap .popup-footer .swiper-button-prev {
    width: 16px;
    height: 16px;
    margin: 0
}

#mainTodayPopup .popup-wrap .popup-footer .swiper-button-next,#mainTodayPopup .popup-wrap .popup-footer .swiper-rtl .swiper-button-prev {
    position: unset;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_black_16.svg")
}

#mainTodayPopup .popup-wrap .popup-footer .swiper-button-prev,#mainTodayPopup .popup-wrap .popup-footer .swiper-rtl .swiper-button-next {
    position: unset;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_black_16.svg")
}

#mainTodayPopup .popup-wrap .popup-footer .today-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px
}

#mainTodayPopup .popup-wrap .popup-footer .today-box .btn {
    position: relative;
    margin-top: 0;
    margin-left: 4px
}

#mainTodayPopup .popup-wrap .popup-footer .today-box .btn::before {
    content: "";
    position: absolute;
    top: 50%;
    left: -4px;
    width: 1px;
    height: 20px;
    background-color: #eaebec;
    transform: translateY(-50%)
}

#searchPopup {
    display: flex;
    justify-content: flex-end;
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    z-index: 10;
    opacity: 0;
    transition: opacity .1s ease
}

#searchPopup .popup-wrap {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    width: 414px;
    height: 100%;
    padding: 56px 24px;
    background-color: rgba(52,121,236,.9);
    backdrop-filter: blur(20px)
}

#searchPopup .popup-wrap.main-search {
    width: 488px
}

#searchPopup .popup-wrap .btn-close-x {
    position: absolute;
    top: 24px;
    right: 24px
}

#searchPopup .popup-wrap .popup-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    width: 100%;
    height: 100%;
    padding: 0 16px;
    overflow-y: auto
}

#searchPopup .popup-wrap .popup-content::-webkit-scrollbar {
    width: 5px;
    background: #fff
}

#searchPopup .popup-wrap .popup-content::-webkit-scrollbar-thumb {
    background-color: #ccc
}

#searchPopup .popup-wrap .popup-content.conditional-search {
    overflow-y: none
}

#searchPopup .popup-wrap .popup-content.conditional-search .tab-section-wrap {
    overflow-y: auto
}

#searchPopup .popup-wrap .popup-content.conditional-search .tab-section-wrap::-webkit-scrollbar {
    width: 5px;
    background: #fff
}

#searchPopup .popup-wrap .popup-content.conditional-search .tab-section-wrap::-webkit-scrollbar-thumb {
    background-color: #ccc
}

#searchPopup .popup-wrap .popup-content .tab-section-wrap {
    width: 100%
}

#searchPopup .popup-wrap .popup-content .text-box {
    margin: 0;
    padding: 0;
    gap: 32px
}

#searchPopup .popup-wrap .popup-content .text-box p {
    font-weight: 800
}

#searchPopup .popup-wrap .popup-content .text-box .wrapBox {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px
}

#searchPopup .popup-wrap .popup-content .text-box .wrapBox button {
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    padding: 3px 7px;
    border: 1px solid #fff;
    border-radius: 4px;
    cursor: pointer
}

#searchPopup .popup-wrap .popup-content .tab-box {
    gap: 8px
}

#searchPopup .popup-wrap .popup-content .tab-box .tab {
    width: 163px
}

#searchPopup .popup-wrap .popup-content .tab-box .tab.active {
    color: #3479ec
}

#searchPopup .popup-wrap .popup-content .tab-section {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    margin-top: 14px
}

#searchPopup .popup-wrap .popup-content .frame-box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    width: 100%
}

#searchPopup .popup-wrap .popup-content .frame-box label {
    font-size: 14px;
    font-weight: 700;
    color: #fff
}

#searchPopup .popup-wrap .popup-content .frame-box .all-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    position: relative;
    width: 100%
}

#searchPopup .popup-wrap .popup-content .frame-box .all-box span {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin-right: 6px
}

#searchPopup .popup-wrap .popup-content .frame-box .all-box span.multi-text {
    position: absolute;
    top: 50%;
    right: 0;
    margin-right: 0;
    font-size: 12px;
    font-weight: 500;
    color: #93ccfd;
    transform: translateY(-50%)
}

#searchPopup .popup-wrap .popup-content .frame-box .checkbox-more {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 16px;
    row-gap: 16px;
    max-height: 200px;
    padding-bottom: 12px
}

#searchPopup .popup-wrap .popup-content .frame-box .checkbox-more p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap
}

#searchPopup .popup-wrap .popup-content .frame-box .checkbox-more p label {
    padding-left: 10px
}

#searchPopup .popup-wrap .popup-content .frame-box .priceBox {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px
}

#searchPopup .popup-wrap .popup-content .frame-box .priceBox input[type=text] {
    width: 50%;
    padding: 7px 10px;
    border: 1.4px solid #629dff;
    background: #235ab7;
    color: #fff;
    line-height: 160%
}

#searchPopup .popup-wrap .popup-content .frame-box .priceBox input[type=text]::placeholder {
    color: #5789db
}

#searchPopup .popup-wrap .popup-content .frame-box .priceBox span {
    font-size: 14px;
    font-weight: 700;
    color: #fff
}

#searchPopup .popup-wrap .popup-content .frame-box .btnMore {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px
}

#searchPopup .popup-wrap .popup-content .frame-box .btnMore .btn {
    width: 48.7%;
    padding: 8px 0;
    background: #3b8ef6;
    color: #fff
}

#searchPopup .popup-wrap .popup-content .btn-search {
    width: 100%;
    margin-top: 20px
}

#searchPopup.show {
    display: block
}

#searchPopup.show .popup-wrap {
    right: 0
}

#viewContPopup {
    align-items: center
}

#viewContPopup .borderR-none {
    border-right: none !important
}

#viewContPopup .borderB-none {
    border-bottom: none !important
}

#viewContPopup .modal-dialog {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 520px;
    height: 667px;
    padding: 32px;
    border-radius: 16px;
    background-color: #fff;
    background-blend-mode: luminosity;
    box-shadow: 0px 4px 20px 0px rgba(0,0,0,.4)
}

#viewContPopup .modal-dialog .modal-body {
    width: 100%;
    height: 100%;
    overflow: hidden
}

#viewContPopup .modal-dialog .modal-body .content-text {
    padding: 0;
    margin-bottom: 24px
}

#viewContPopup .modal-dialog .modal-body .swiper {
    position: relative;
    padding-bottom: 40px;
    margin-bottom: 24px
}

#viewContPopup .modal-dialog .modal-body .swiper-slide {
    width: 100%;
    height: 282px
}

#viewContPopup .modal-dialog .modal-body .swiper-pagination-box {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 12px
}

#viewContPopup .modal-dialog .modal-body .swiper-button-prev,#viewContPopup .modal-dialog .modal-body .swiper-button-next,#viewContPopup .modal-dialog .modal-body .swiper-pagination {
    position: unset;
    margin: 0;
    transform: translate(0, 0)
}

#viewContPopup .modal-dialog .modal-body .swiper-button-prev {
    width: 16px;
    height: 16px;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_black_16.svg");
    transform: rotate(180deg) translate(0, 0)
}

#viewContPopup .modal-dialog .modal-body .swiper-button-next {
    width: 16px;
    height: 16px;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_black_16.svg")
}

#viewContPopup .modal-dialog .modal-body .swiper-pagination {
    gap: 2
}

#viewContPopup .modal-dialog .modal-body .swiper-pagination span {
    color: #989ba2
}

#viewContPopup .modal-dialog .modal-body .swiper-pagination span.custom-pagination-total {
    color: #171719
}

#viewContPopup .modal-dialog .modal-body h3 {
    font-size: 18px;
    font-weight: 700;
    color: #171719;
    margin-bottom: 16px
}

#viewContPopup .modal-dialog .modal-body .location {
    margin-bottom: 16px
}

#viewContPopup .modal-dialog .modal-body table {
    width: 100%
}

#viewContPopup .modal-dialog .modal-body table tr {
    border-bottom: 1px solid #eaebec
}

#viewContPopup .modal-dialog .modal-body table tr th,#viewContPopup .modal-dialog .modal-body table tr td {
    padding: 11.5px 12px;
    font-size: 14px;
    font-weight: 700;
    color: #171719;
    text-align: center;
    border-right: 1px solid #eaebec
}

#viewContPopup .modal-dialog .modal-body table tr th {
    background-color: #f7f7f8
}

#viewContPopup .modal-dialog .zone-img {
    margin-bottom: 32px
}

#videoPop {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 100000000
}

#videoPop .modal-body {
    width: 754px;
    height: 490px;
    background: #fff
}

#videoPop .modal-body .videoArea {
    height: 424px
}

#videoPop .modal-body .videoArea video {
    width: 100%
}

#videoPop .modal-body .popup-footer .btnWrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: center;
    height: 66px;
    gap: 20px
}

#videoPop .modal-body .popup-footer .btnWrap .today-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px
}

#videoPop .modal-body .popup-footer .btnWrap .today-box label {
    color: #000
}

#videoPop .modal-body .popup-footer .btnWrap .btn {
    position: relative;
    margin-top: 0
}

#videoPop .modal-body .popup-footer .btnWrap .btn::after {
    content: "";
    position: absolute;
    left: -9px;
    top: 50%;
    width: 1px;
    height: 20px;
    background: #eaebec;
    transform: translateY(-50%)
}

@media screen and (max-width: 768px) {
    #videoPop .modal-body {
        width:100%;
        height: auto
    }

    #videoPop .modal-body .videoArea {
        height: auto
    }

    #videoPop .modal-body .popup-footer .btnWrap {
        height: auto;
        gap: 4.6511627907vw
    }

    #videoPop .modal-body .popup-footer .btnWrap .today-box {
        gap: 2.3255813953vw
    }

    #videoPop .modal-body .popup-footer .btnWrap .today-box label {
        font-size: 3.2558139535vw
    }

    #videoPop .modal-body .popup-footer .btnWrap .today-box input[type=checkbox] {
        width: 4.6511627907vw;
        height: 4.6511627907vw
    }

    #videoPop .modal-body .popup-footer .btnWrap .btn.btn-close-text {
        font-size: 3.2558139535vw
    }

    #videoPop .modal-body .popup-footer .btnWrap .btn::after {
        left: -2.0930232558vw;
        height: 4.6511627907vw
    }
}

header#header-container.welcome {
    width: auto;
    height: auto;
    z-index: 999;
    min-width: auto
}

header#header-container.welcome .welcomeHeader {
    width: auto;
    height: 100%;
    padding: 30px 40px;
    background: rgba(0,0,0,0)
}

header#header-container.welcome .welcomeHeader .logo {
    position: unset
}

header#header-container.welcome .welcomeHeader .logo a {
    display: inline-block;
    width: 218px;
    height: 45px;
    background-image: url("../images/ImageAssets_hublogo.svg");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center
}

.welcome {
    width: 100%;
    height: 100vh;
    padding: 0
}

.welcome .scrollWrap {
    height: 100vh;
    padding-bottom: 80px;
    overflow-y: auto
}

.welcome .scrollWrap::-webkit-scrollbar {
    width: 8px
}

.welcome .scrollWrap::-webkit-scrollbar-track {
    background: #e4e4e4
}

.welcome .scrollWrap::-webkit-scrollbar-thumb {
    height: 489px;
    background: #cbcbcb
}

.welcome .category {
    padding: 6px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    color: #000
}

.welcome .category.mint {
    background: linear-gradient(0deg, #8CF5F1 0%, #8CF5F1 100%),#0f68d8
}

.welcome .category.lightBlue {
    background: #eaf3ff
}

.welcome .category.skyblue {
    background: #b9d9ff
}

.welcome .welcomeSection {
    position: relative;
    width: 100%;
    height: 100%
}

.welcome .welcomeSection .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    transform-origin: center center
}

.welcome .welcomeSection .bg img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: auto;
    height: auto;
    max-width: none;
    transform: translate(-50%, -50%);
    transform-origin: center center
}

.welcome .welcomeSection .textWrap {
    position: absolute;
    left: 5.4166666667vw;
    top: 50%;
    height: 18.125vw;
    transform: translateY(-50%);
    z-index: 11
}

.welcome .welcomeSection .textWrap .welcomeText {
    width: 23.5416666667vw;
    height: 12.7604166667vw;
    background: url("/images/welcome/ImageAssets_maintext.svg") no-repeat center;
    background-size: 100%
}

.welcome .welcomeSection .textWrap .linkBtn {
    display: inline-block;
    margin-top: 2.9166666667vw;
    padding: .78125vw 1.3020833333vw;
    border-radius: 50px;
    border: 1px solid #fff;
    font-size: 1.0416666667vw;
    font-weight: 700;
    color: #fff
}

.welcome .welcomeSection .hubArea {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 776px;
    height: 538px;
    transform: translate(-50%, -50%);
    z-index: 11
}

.welcome .welcomeSection .hubCont {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 193px;
    height: 154px;
    transform: translate(-50%, -50%)
}

.welcome .welcomeSection .hubCont .hubBox {
    background: #fff;
    border-radius: 8px
}

.welcome .welcomeSection .hubCont .hubBox .top {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 11px 16px;
    background: linear-gradient(180deg, #25ECE4 0%, #15C8C0 100%);
    border-radius: 9.6px 9.6px 0 0
}

.welcome .welcomeSection .hubCont .hubBox .top.lightBlue {
    background: linear-gradient(180deg, #D4E0F1 0%, #BDCBDB 100%)
}

.welcome .welcomeSection .hubCont .hubBox .top.skyblue {
    background: linear-gradient(180deg, #89B2E4 0%, #6BA7F0 100%)
}

.welcome .welcomeSection .hubCont .hubBox .top span {
    font-size: 15px;
    font-weight: 700;
    color: #000
}

.welcome .welcomeSection .hubCont .hubBox .top .arrowBtn {
    width: 24px;
    height: 24px;
    background: url("/images/welcome/arrowRight.svg");
    background-size: 100% 100%;
    background-repeat: no-repeat
}

.welcome .welcomeSection .hubCont .hubBox .bottom {
    padding: 14px 16px;
    background: linear-gradient(180deg, #FFF 0%, #F3F3F3 100%);
    border-radius: 0px 0px 9.6px 9.6px
}

.welcome .welcomeSection .hubCont .hubBox .bottom p {
    font-size: 17px;
    font-weight: 800;
    color: #1d1d1d
}

.welcome .welcomeSection .hubCont.hub1 {
    transform: translate(-165%, -285%)
}

.welcome .welcomeSection .hubCont.hub2 {
    transform: translate(98%, -72%)
}

.welcome .welcomeSection .hubCont.hub3 {
    transform: translate(-80%, -140%)
}

.welcome .welcomeSection .hubCont.hub4 {
    transform: translate(-5%, -280%)
}

.welcome .welcomeSection .hubCont.hub5 {
    transform: translate(188%, 20%)
}

.welcome .welcomeSection .hubCont.hub6 {
    transform: translate(-190%, 20%)
}

.welcome .welcomeSection .circle {
    width: 100%;
    height: 73px;
    margin-top: -7px
}

.welcome .welcomeSection .rightList {
    position: absolute;
    right: 0;
    top: 0;
    width: 350px;
    height: 100%;
    background: #fff;
    z-index: 1000
}

.welcome .welcomeSection .rightList .listWrap {
    display: flex;
    flex-direction: column
}

.welcome .welcomeSection .rightList .listWrap .listHeader {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 21px 26px 20px;
    border-bottom: 1px solid #e5e5e5
}

.welcome .welcomeSection .rightList .listWrap .listHeader strong {
    line-height: 136%;
    font-size: 18px;
    font-weight: 700;
    color: #000
}

.welcome .welcomeSection .rightList .listWrap .listContent {
    padding: 0 26px
}

.welcome .welcomeSection .rightList .listWrap .listContent>li {
    padding: 24px 0 32px;
    border-bottom: 1px solid #e5e5e5
}

.welcome .welcomeSection .rightList .listWrap .listContent>li:last-child {
    border-bottom: none
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .contTit h4 {
    margin-bottom: 10px;
    line-height: 136%
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .imgBox {
    position: relative;
    width: 100%;
    height: 149px;
    margin: 24px 0 16px;
    border-radius: 8px;
    overflow: hidden
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .imgBox img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .saleText {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    font-weight: 500;
    color: #000
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .saleText.align-start {
    align-items: flex-start
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .saleText ul {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
    width: 70%
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .saleText ul li {
    position: relative
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .saleText ul li~li:nth-child(even)::after {
    content: "";
    position: absolute;
    left: -8px;
    top: 50%;
    width: 1px;
    height: 12px;
    background: #c8c8c8;
    transform: translateY(-50%)
}

.welcome .welcomeSection .rightList .listWrap .listContent>li .contBox .moreBtn {
    width: 100%;
    margin-top: 16px;
    padding: 9px 0;
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    cursor: pointer
}

.welcome .welcomeSection .search-qucik-btn {
    opacity: 0;
    position: absolute;
    top: calc(50% - 49px);
    right: -60px;
    width: 126px;
    margin: 0;
    transform: translateY(-50%);
    z-index: 12
}

.welcome .welcomeSection .welcome-search-dim {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.26);
    transition: opacity 1s ease;
    z-index: 12;
    opacity: 0;
    visibility: hidden
}

.welcome .welcomeSection .welcome-search-dim.open {
    opacity: 1;
    visibility: visible
}

.welcome .welcomeSection #searchPopup {
    display: none;
    z-index: 999;
    opacity: 1
}

.welcome .welcomeSection #searchPopup .popup-wrap {
    padding: 24px
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content {
    padding: 0;
    gap: 32px
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section {
    margin-top: 0;
    gap: 32px
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box {
    gap: 14px
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .btn {
    height: 30px;
    font-size: 12px;
    margin-top: 0
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .frame-1-Wrap .priceBox {
    margin-bottom: 10px
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .checkbox-more p label {
    padding-left: 0
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .checkbox-more,.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .frame-1-Wrap {
    gap: 12px;
    padding-bottom: 0
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .checkbox-more::-webkit-scrollbar,.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .frame-1-Wrap::-webkit-scrollbar {
    width: 5px;
    background: #326ed3
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .checkbox-more::-webkit-scrollbar-thumb,.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .frame-1-Wrap::-webkit-scrollbar-thumb {
    background-color: #3a62a6
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .welcome-checkbox {
    opacity: 0;
    position: absolute
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .welcome-checkbox,.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .welcome-checkbox-label {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .welcome-checkbox-label {
    position: relative;
    font-weight: normal
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .welcome-checkbox+.welcome-checkbox-label:before {
    content: "";
    background: #4b7fd3;
    border: 1.4px solid #9bc1ff;
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    padding: 2px;
    margin-right: 10px;
    text-align: center;
    border-radius: 2px
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .tab-section .frame-box .welcome-checkbox:checked+.welcome-checkbox-label:before {
    background: url("../images/welcome/Check.svg") no-repeat center #fff
}

.welcome .welcomeSection #searchPopup .popup-wrap .popup-content .btn-search {
    margin-top: 0
}

.welcome .welcomeSection #searchPopup .popup-wrap .btn-close-x {
    z-index: 12
}

.welcome .welcomeSection #searchResultBox {
    display: none;
    position: absolute;
    top: 0;
    right: 350px;
    width: 488px;
    height: 100%;
    background-color: #fff;
    box-shadow: 4px 0px 40px 0px rgba(0,0,0,.12);
    z-index: 999
}

.welcome .welcomeSection #searchResultBox .card {
    box-shadow: none
}

.welcome .welcomeSection #searchResultBox .card .card-top {
    clip-path: none
}

.welcome .welcomeSection #searchResultBox .card .content-text {
    position: relative;
    align-items: flex-start;
    gap: 24px;
    padding: 20px 24px;
    background-color: #3479ec
}

.welcome .welcomeSection #searchResultBox .card .content-text>* {
    color: #fff
}

.welcome .welcomeSection #searchResultBox .card .content-text .count {
    position: absolute;
    top: 27px;
    right: 107px;
    font-size: 12px;
    font-weight: 700;
    color: #fff
}

.welcome .welcomeSection #searchResultBox .card .content-text .btn-reset {
    gap: 4px;
    position: absolute;
    top: 20px;
    right: 59px;
    width: 24px;
    height: 24px;
    margin: 0;
    padding: 7px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M2.39185 12.3333C2.39185 14.97 3.43924 17.4986 5.30362 19.363C7.168 21.2274 9.69665 22.2748 12.3333 22.2748C14.9699 22.2748 17.4986 21.2274 19.3629 19.363C21.2273 17.4986 22.2747 14.97 22.2747 12.3333C22.2747 9.6967 21.2273 7.16806 19.3629 5.30368C17.4986 3.4393 14.9699 2.3919 12.3333 2.3919C6.91068 2.3919 4.65126 6.00697 2.84373 8.71827" stroke="white" stroke-width="1.6"/>  <path d="M2.39185 3.29479V8.71739H7.81444" stroke="white" stroke-width="1.6"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%
}

.welcome .welcomeSection #searchResultBox .card .content-text .btn-close {
    position: absolute;
    top: 20px;
    right: 24px;
    width: 24px;
    height: 24px;
    margin-top: 0;
    background: url("../images/icons/ImageAssets_X_24.svg") no-repeat center
}

.welcome .welcomeSection #searchResultBox .card .content-text .content-info {
    gap: 4px
}

.welcome .welcomeSection #searchResultBox .card .content-text .content-info p {
    gap: 16px;
    padding: 0
}

.welcome .welcomeSection #searchResultBox .card .content-text .content-info p span {
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    line-height: 160%
}

.welcome .welcomeSection #searchResultBox .card .content-text .content-info p span:first-child {
    min-width: 48px;
    width: 48px;
    font-weight: 700;
    line-height: normal
}

.welcome .welcomeSection #searchResultBox .card .tab-box {
    gap: 0;
    border-bottom: 1px solid #c2c4c8
}

.welcome .welcomeSection #searchResultBox .card .tab-box li {
    width: 50%
}

.welcome .welcomeSection #searchResultBox .card .tab-box li button {
    width: 100%
}

.welcome .welcomeSection #searchResultBox .card .card-bottom {
    overflow-y: auto;
    height: calc(100vh - 300px)
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    border-bottom: 1px solid #eaebec
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 20px;
    margin: 0
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button p span {
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button p span.tag {
    font-size: 12px;
    font-weight: 700;
    color: #3479ec
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button>span {
    font-size: 14px;
    font-weight: 500;
    color: #171719
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button.active span {
    color: #3479ec
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button.active>span {
    color: #3479ec
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li>button.active~.accordion-cont {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li .accordion-cont {
    display: none;
    gap: 40px;
    width: 100%;
    height: 100%;
    padding: 20px 32px;
    background-color: #f7f7f8;
    border-top: 1px solid #eaebec
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li .accordion-cont .right {
    width: 100%
}

.welcome .welcomeSection #searchResultBox .card .card-bottom .board-box ul li .accordion-cont .right .btn {
    margin-top: 16px;
    width: 100%
}

.welcome .welcomeSection #searchResultBox .card .pagination-box {
    position: absolute;
    bottom: 0;
    background-color: #fff;
    box-shadow: 0px -7px 20px 0px rgba(0,0,0,.1)
}

.welcome #openPop {
    display: none;
    position: fixed;
    right: 350px;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1000
}

.welcome #openPop .dim {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%)
}

.welcome #openPop .popWrap {
    position: absolute;
    top: 0;
    right: 0;
    width: 488px;
    height: 100%;
    background: #fff;
    border-right: 1px solid #e5e5e5
}

.welcome #openPop .popWrap .closeBtn {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 32px;
    height: 32px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="33" height="33" viewBox="0 0 33 33" fill="none"><rect x="0.775391" y="0.224609" width="32" height="32" rx="16" fill="%23F3F3F3"/><path d="M11.7173 21.4138L21.9645 11.1666M21.9645 21.4138L11.7173 11.1666" stroke="black" stroke-width="1.38062" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer
}

.welcome #openPop .popWrap .top {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    padding-top: 32px
}

.welcome #openPop .popWrap .top .title {
    padding: 0 26px
}

.welcome #openPop .popWrap .top .title strong {
    line-height: 136%;
    letter-spacing: -0.48px
}

.welcome #openPop .popWrap .top .title p {
    margin: 4px 0 16px;
    font-size: 16px;
    font-weight: 500;
    color: #000;
    line-height: 24px
}

.welcome #openPop .popWrap .top .imgBox {
    width: 100%;
    height: 275px
}

.welcome #openPop .popWrap .top .imgBox img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.welcome #openPop .popWrap .meddle {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-top: 40px;
    padding: 0 26px
}

.welcome #openPop .popWrap .meddle span {
    font-size: 16px;
    font-weight: 600;
    color: #000
}

.welcome #openPop .popWrap .meddle p {
    font-size: 16px;
    font-weight: 600;
    color: #000
}

.welcome #openPop .popWrap .meddle p.text01 {
    margin-bottom: 10px
}

.welcome #openPop .popWrap .meddle .saleCont .saleBox {
    margin-bottom: 24px
}

.welcome #openPop .popWrap .meddle .saleCont .saleBox:last-child {
    margin-bottom: 0
}

.welcome #openPop .popWrap .meddle .saleCont .saleBox .saleTitle {
    margin-bottom: 12px;
    font-weight: 700
}

.welcome #openPop .popWrap .meddle .saleCont .saleBox ul {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px
}

.welcome #openPop .popWrap .meddle .saleCont .saleBox ul li {
    width: 48%
}

.welcome #openPop .popWrap .meddle .saleCont .saleBox ul li a {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 14px 16px;
    border-radius: 6px;
    background: #f5f5f5
}

.welcome #openPop .popWrap .meddle .btnBox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px
}

.welcome #openPop .popWrap .meddle .btnBox .linkBtn {
    display: block;
    width: 100%;
    padding: 18px 0;
    border-radius: 8px;
    background: linear-gradient(180deg, #5E7DB5 0%, #4164A4 100%),linear-gradient(94deg, #2BF8FF 0%, #43FFC3 69.73%),linear-gradient(0deg, #1B9DE2 0%, #1B9DE2 100%),linear-gradient(90deg, #3479EC 0%, #1E4586 100%);
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    text-align: center
}

.welcome #openPop .popWrap .meddle .btnBox .telBtn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 12px;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
    color: #000;
    border: 1px solid #c8c8c8;
    border-radius: 8px;
    padding: 17px 0
}

.welcome #openPop .popWrap .meddle .btnBox .telBtn .icon {
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="21" viewBox="0 0 20 21" fill="none"><path d="M3.95595 2.6897L1.6665 2.95554C1.81009 5.46787 2.54087 7.95454 3.85882 10.2059C4.60199 11.4754 5.53187 12.67 6.64844 13.7522C7.76502 14.8344 8.99759 15.7357 10.3074 16.4561C12.6302 17.7334 15.1958 18.4417 17.7878 18.581L18.0622 16.3619" stroke="black" stroke-width="1.90312"/><path d="M10.3062 16.4553L12.6928 12.5796L18.3353 14.1422L18.061 16.3611" stroke="black" stroke-width="1.90312"/><path d="M3.85742 10.2051L7.85616 7.89195L6.24401 2.4231L3.95456 2.68894" stroke="black" stroke-width="1.90312"/></svg>')
}

.welcome .colorNum {
    color: #00ac7e !important
}

@media screen and (max-width: 1440px) {
    .welcome .welcomeSection .bg img {
        width:100%;
        height: 100%;
        object-fit: cover;
        transform: translate(-60%, -50%)
    }

    .welcome .welcomeSection .circle {
        height: 5.07vw
    }

    .welcome .welcomeSection .hubArea {
        transform: translate(-65%, -50%)
    }

    .welcome .welcomeSection .hubCont {
        width: 13.4vw;
        height: 10.69vw
    }

    .welcome .welcomeSection .hubCont.hub1 {
        transform: translate(-140%, -225%)
    }

    .welcome .welcomeSection .hubCont.hub2 {
        transform: translate(27%, -72%)
    }

    .welcome .welcomeSection .hubCont.hub3 {
        transform: translate(-90%, -115%)
    }

    .welcome .welcomeSection .hubCont.hub4 {
        transform: translate(-30%, -204%)
    }

    .welcome .welcomeSection .hubCont.hub5 {
        transform: translate(90%, -7%)
    }

    .welcome .welcomeSection .hubCont.hub6 {
        transform: translate(-145%, 6%)
    }

    .welcome .welcomeSection .hubCont .hubBox .top {
        padding: 1vw
    }

    .welcome .welcomeSection .hubCont .hubBox .top span {
        font-size: 1.04vw
    }

    .welcome .welcomeSection .hubCont .hubBox .top a {
        width: 1.67vw;
        height: 1.67vw
    }

    .welcome .welcomeSection .hubCont .hubBox .bottom {
        padding: 1vw
    }

    .welcome .welcomeSection .hubCont .hubBox .bottom p {
        font-size: 1.18vw
    }
}

body,html,main {
    min-width: 1104px
}

#bg-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 10
}

.skipBtn {
    position: absolute;
    top: calc(100vh - 80px);
    left: 50%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 145px;
    height: 45px;
    border-radius: 599.4px;
    background: var(--Primary-Normal, #3479ec);
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.24);
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    transform: translateX(-50px);
    z-index: 999;
    cursor: pointer
}

.skipBtn .skipIcon {
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32' fill='none'%3E%3Cpath d='M25 4.35272V27.6471' stroke='white' stroke-width='1.8'/%3E%3Cpath d='M7 25.3493V6.65106L23.3133 16.0002L7 25.3493Z' stroke='white' stroke-width='1.8'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%
}

section .contents {
    width: 100%;
    height: 100%
}

section .inner {
    min-width: 1104px;
    max-width: 1104px;
    box-sizing: content-box;
    margin: 0 auto
}

section .text-box {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
    padding-top: 12px
}

section .text-box.white h2,section .text-box.white p {
    color: #fff
}

section .text-box .body.fs-16 {
    line-height: 160%
}

section .text-box.gap-4 {
    gap: 8px
}

main {
    position: relative;
    padding-top: 98px;
    width: 100%
}

main section {
    position: relative;
    overflow: hidden
}

main.home .ai-qucik-btn {
    opacity: 0;
    position: fixed;
    bottom: 40px;
    right: 40px;
    width: 300px;
    margin: 0;
    z-index: 3
}

main.home section.sec01 {
    width: 100%;
    height: calc(100vh - 98px)
}

main.home section.sec01 .bg {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0;
    transform: scale(0.9);
    transform-origin: center center
}

main.home section.sec01 .bg.bg-2 {
    transform: scale(1) !important
}

main.home section.sec01 .bg.active {
    display: block
}

main.home section.sec01 .bg>img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: auto;
    max-width: none;
    transform: translate(-50%, -48%);
    transform-origin: center center;
    transition: transform .3s
}

main.home section.sec01 .bg .blocks-cont p {
    position: absolute;
    top: 50%;
    left: 50%;
    cursor: pointer
}

main.home section.sec01 .bg .blocks-cont p:hover {
    z-index: 20
}

main.home section.sec01 .bg .blocks-cont p:hover::before {
    position: absolute;
    top: 50%;
    left: 50%;
    content: "";
    width: 36px;
    height: 37px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37' height='38' viewBox='0 0 37 38' fill='none'%3E%3Ccircle opacity='0.6' cx='18.4771' cy='18.6348' r='9.5059' stroke='white' stroke-width='0.905324'/%3E%3Ccircle opacity='0.1' cx='18.4765' cy='18.6347' r='17.6538' stroke='white' stroke-width='0.905324'/%3E%3Cg filter='url(%23filter0_d_6817_33455)'%3E%3Ccircle cx='18.4768' cy='18.635' r='5.43189' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_6817_33455' x='11.3736' y='12.3675' width='14.207' height='14.2065' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='0.835675'/%3E%3CfeGaussianBlur stdDeviation='0.835675'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.4 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_6817_33455'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_6817_33455' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    transform: translate(-50%, -50%);
    transition: all .3s
}

main.home section.sec01 .bg .blocks-cont p:hover::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 175px;
    content: "";
    display: flex;
    padding: 8.129px 13.935px 6.967px 15.096px;
    justify-content: center;
    align-items: center;
    gap: 18.58px;
    border-radius: 116.122px;
    background: #fff;
    box-shadow: 0px 1.584px 3.168px 0px rgba(0,0,0,.4);
    color: #1100c3;
    font-size: 24px;
    font-style: normal;
    font-weight: 800;
    transform: translate(-50%, -150%);
    transition: all .3s
}

main.home section.sec01 .bg .blocks-cont p.block-1-1 {
    transform: translate(-9%, -249%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-1:hover::after {
    content: "산업 1-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-2 {
    transform: translate(32%, -179%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-2:hover::after {
    content: "산업 1-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-3 {
    transform: translate(119%, -151%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-3:hover::after {
    content: "산업 1-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-4 {
    transform: translate(-56%, -330%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-4:hover::after {
    content: "산업 2-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-5 {
    transform: translate(-100%, -230%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-5:hover::after {
    content: "산업 2-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-6 {
    transform: translate(-227%, -144%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-6:hover::after {
    content: "산업 3-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-7 {
    transform: translate(-150%, -178%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-7:hover::after {
    content: "산업 3-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-8 {
    transform: translate(-243%, -164%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-8:hover::after {
    content: "산업 3-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-9 {
    transform: translate(-59%, -212%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-9:hover::after {
    content: "산업 4-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-10 {
    transform: translate(-96%, -99%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-10:hover::after {
    content: "산업 4-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-11 {
    transform: translate(-107%, -185%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-11:hover::after {
    content: "산업 4-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-12 {
    transform: translate(-146%, -132%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-12:hover::after {
    content: "산업 4-4 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-13 {
    transform: translate(-69%, -159%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-13:hover::after {
    content: "산업 4-5 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-14 {
    transform: translate(-31%, -168%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-14:hover::after {
    content: "산업 4-6 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-15 {
    transform: translate(13%, -232%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-15:hover::after {
    content: "산업 4-7 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-16 {
    transform: translate(-269%, -71%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-16:hover::after {
    content: "산업 5-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-17 {
    transform: translate(-246%, -51%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-17:hover::after {
    content: "산업 5-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-18 {
    transform: translate(-209%, -28%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-18:hover::after {
    content: "산업 6-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-19 {
    transform: translate(-156%, -9%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-19:hover::after {
    content: "산업 6-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-20 {
    transform: translate(-90%, 9%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-20:hover::after {
    content: "산업 6-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-21 {
    transform: translate(-24%, 31%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-21:hover::after {
    content: "산업 6-4 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-22 {
    transform: translate(182%, -104%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-22:hover::after {
    content: "산업 7-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-23 {
    transform: translate(249%, -70%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-23:hover::after {
    content: "산업 7-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-24 {
    transform: translate(298%, -38%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-24:hover::after {
    content: "산업 7-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-25 {
    transform: translate(358%, -10%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-25:hover::after {
    content: "산업 7-4 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-26 {
    transform: translate(182%, -47%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-26:hover::after {
    content: "산업 8-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-27 {
    transform: translate(140%, 1%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-27:hover::after {
    content: "산업 8-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-28 {
    transform: translate(167%, 3%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-28:hover::after {
    content: "산업 8-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-29 {
    transform: translate(171%, 37%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-29:hover::after {
    content: "산업 8-4 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-30 {
    transform: translate(80%, 58%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-30:hover::after {
    content: "산업 9-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-31 {
    transform: translate(161%, 78%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-31:hover::after {
    content: "산업 9-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-32 {
    transform: translate(194%, 90%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-32:hover::after {
    content: "산업 9-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-33 {
    transform: translate(330%, 118%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-33:hover::after {
    content: "산업 9-4 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-1-34 {
    transform: translate(225%, 11%)
}

main.home section.sec01 .bg .blocks-cont p.block-1-34:hover::after {
    content: "산업 10-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-1 {
    transform: translate(115%, -262%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-1:hover::after {
    content: "지원 1-1 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-2 {
    transform: translate(154%, -233%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-2:hover::after {
    content: "지원 1-2 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-3 {
    transform: translate(94%, -221%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-3:hover::after {
    content: "지원 1-3 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-4 {
    transform: translate(68%, -186%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-4:hover::after {
    content: "지원 1-4 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-5 {
    transform: translate(63%, -216%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-5:hover::after {
    content: "지원 1-5 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-6 {
    transform: translate(-13%, -106%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-6:hover::after {
    content: "지원 1-6 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-7 {
    transform: translate(29%, -82%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-7:hover::after {
    content: "지원 1-7 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-8 {
    transform: translate(38%, -35%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-8:hover::after {
    content: "지원 1-8 구역" !important
}

main.home section.sec01 .bg .blocks-cont p.block-2-9 {
    transform: translate(66%, -91%)
}

main.home section.sec01 .bg .blocks-cont p.block-2-9:hover::after {
    content: "지원 1-9 구역" !important
}

main.home section.sec01 #mainContSorting {
    opacity: 0;
    transform: translateX(-100px);
    width: 330px;
    height: auto;
    border-radius: 8px;
    margin-left: 100px;
    overflow: hidden;
    background-color: #fff;
    z-index: 10;
    box-shadow: 0px 12px 40px 0px rgba(0,0,0,.4)
}

main.home section.sec01 #mainContSorting .sorting-box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    height: auto;
    background-color: #fff;
    overflow: hidden
}

main.home section.sec01 #mainContSorting .sorting-box .contHeader {
    width: 100%;
    height: 57px;
    padding: 18px 24px;
    border-bottom: 1px solid var(--Fill-Neutral, #eaebec);
    font-size: 18px;
    font-weight: 700;
    color: #3479ec
}

main.home section.sec01 #mainContSorting .sorting-box .contBody {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 22px;
    width: 100%;
    height: auto;
    min-height: 258px;
    padding: 20px 24px 22px
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 12px
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .notSuppertedTitle,main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .suppertedTitle {
    display: none
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .notSuppertedTitle p,main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .suppertedTitle p {
    font-size: 14px;
    font-weight: 600;
    color: #37383c
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox>p {
    font-size: 14px;
    font-weight: 600;
    color: #37383c
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 8px
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox input[type=radio] {
    display: none
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox label {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 137px;
    height: 45px;
    padding: 14px 16px;
    border-radius: 6px;
    border: 1px solid #eaebec;
    cursor: pointer
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox label span {
    font-size: 14px;
    font-weight: 500;
    color: #171719
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox label span.num {
    font-weight: 700
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox input[type=radio]:checked+label {
    background-color: #3479ec;
    border: 1px solid #3479ec
}

main.home section.sec01 #mainContSorting .sorting-box .contBody .selectBox .tabBox input[type=radio]:checked+label span {
    color: #fff
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter>p {
    font-size: 14px;
    font-weight: 600;
    color: #37383c
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter #toggle {
    display: none
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter .toggleSwitch {
    width: 44px;
    height: 24px;
    display: block;
    position: relative;
    border-radius: 100px;
    background-color: #dbdcdf;
    cursor: pointer
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter .toggleSwitch .toggleButton {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translateY(-50%);
    border-radius: 100px;
    background-color: #fff
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter input[type=checkbox]:checked+.toggleSwitch {
    background-color: #3479ec
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter input[type=checkbox]:checked+.toggleSwitch .toggleButton {
    left: calc(100% - 20px);
    border-radius: 100px;
    background: var(--Fill-Normal, #fff);
    box-shadow: 0px 1px 2px 0px rgba(0,0,0,.1)
}

main.home section.sec01 #mainContSorting .sorting-box .contFooter .toggleSwitch,main.home section.sec01 #mainContSorting .sorting-box .contFooter .toggleButton {
    transition: all .2s ease-in
}

main.home section.sec01 .contents {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 80px;
    position: absolute;
    z-index: 2
}

main.home section.sec01 .contents>.text-box {
    width: auto;
    opacity: 0;
    transform: translateX(-100px);
    gap: 24px;
    padding-top: 0;
    margin-top: 167px;
    margin-left: 100px;
    z-index: 1
}

main.home section.sec01 .contents>.text-box p {
    margin-left: 4px;
    font-size: 32px;
    font-weight: 700;
    color: #171719;
    text-shadow: 0px 4px 4px rgba(0,0,0,.35);
    line-height: 136%;
    letter-spacing: -0.64px
}

main.home section.sec01 .contents>.text-box h2 {
    font-size: 74px;
    font-weight: 800;
    color: #171719;
    text-shadow: 0px 4px 4px rgba(0,0,0,.35)
}

main.home section.sec01 .contents>.text-box.white p {
    color: #fff
}

main.home section.sec01 .contents>.text-box.white h2 {
    color: #fff
}

main.home section.sec01 .search-qucik-btn {
    opacity: 0;
    position: absolute;
    top: calc(50% - 49px);
    right: -60px;
    width: 126px;
    margin: 0;
    transform: translateY(-50%);
    z-index: 2
}

main.home section.sec02 {
    background-color: #3479ec;
    width: 100%;
    height: 583px
}

main.home section.sec02 .contents {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 100%
}

main.home section.sec02 .contents .text-box {
    gap: 32px;
    padding-top: 0
}

main.home section.sec02 .contents .text-box .sec02Logo {
    width: 253px
}

main.home section.sec02 .contents .text-box .sec02Logo img {
    width: 100%
}

main.home section.sec02 .contents .text-box p {
    font-size: 64px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -1.28px
}

main.home section.sec02 .contents .text-box p.subTit {
    margin-top: 32px;
    font-size: 32px;
    line-height: 136%;
    letter-spacing: -0.64px
}

main.home section.sec02 .contents .text-box .gap-32 {
    gap: 32px
}

main.home section.sec04 {
    width: 100%;
    height: auto
}

main.home section.sec04 .contents {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 68px;
    height: 100%;
    padding-top: 222px;
    margin: 0 auto
}

main.home section.sec04 .contents::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: -102%;
    top: 0;
    background-color: #fff;
    z-index: 2
}

main.home section.sec04 .contents .text-box {
    padding: 0
}

main.home section.sec04 .contents .swiper-wrap {
    width: 100%;
    height: 366px
}

main.home section.sec04 .contents .swiper {
    width: 1104px;
    margin: 0 auto
}

main.home section.sec04 .contents .swiper-slide {
    width: 360px !important;
    margin-right: 12px;
    transition: opacity .3s
}

main.home section.sec04 .contents .swiper-slide:last-child {
    margin-right: 0
}

main.home section.sec04 .contents .swiper-slide .card {
    padding-bottom: 60px
}

main.home section.sec04 .contents .swiper-slide .card .content-img {
    cursor: pointer
}

main.home section.sec04 .contents .swiper-slide .card .accordion {
    cursor: pointer
}

main.home section.sec04 .contents .controls {
    top: auto;
    bottom: -78px;
    left: 1068px;
    right: auto;
    transform: translateY(0)
}

main.home section.sec04 .contents .controls .control-button.stop {
    background-image: url("../images/icons/ImageAssets_Pressed_gray.svg")
}

main.home section.sec04 .contents .controls .control-button.play {
    background-image: url("../images/icons/ImageAssets_Play_gray.svg")
}

main.home section.sec04 .contents .swiper-button-next,main.home section.sec04 .contents .swiper-button-prev {
    width: 16px;
    height: 16px
}

main.home section.sec04 .contents .swiper-button-next,main.home section.sec04 .contents .swiper-rtl .swiper-button-prev {
    top: auto;
    bottom: -74px;
    left: 1122px;
    right: auto;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_black_16.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    color: rgba(0,0,0,0)
}

main.home section.sec04 .contents .swiper-button-prev,main.home section.sec04 .contents .swiper-rtl .swiper-button-next {
    top: auto;
    bottom: -74px;
    right: auto;
    left: 1098px;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_black_16.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    color: rgba(0,0,0,0);
    transform: rotate(180deg)
}

main.home section.sec04 .contents .swiper-button-next:after,main.home section.sec04 .contents .swiper-button-prev:after {
    font-size: 0
}

main.home section.sec05 {
    width: 100%;
    height: 1080px
}

main.home section.sec05 .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("../images/main/ImageAssets_sec4_bg.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1
}

main.home section.sec05 .bg::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .15
}

main.home section.sec05 .contents {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    gap: 68px;
    height: 100%;
    padding: 0 0 205.5px;
    z-index: 1
}

main.home section.sec05 .contents>.text-box {
    width: 1104px;
    padding-top: 0;
    text-align: left
}

main.home section.sec05 .contents .swiper {
    overflow: hidden
}

main.home section.sec05 .contents .swiper .banner-wrapper {
    width: 1104px
}

main.home section.sec05 .contents .swiper .banner-wrapper .banner .text-box {
    padding: 0
}

main.home section.sec05 .contents .swiper .banner-wrapper .banner .text-box .tab {
    cursor: default
}

main.home section.sec05 .contents .swiper .banner-wrapper .swiper-slide {
    width: 1104px
}

main.home section.sec06 {
    width: 100%;
    height: 898px
}

main.home section.sec06 .contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 64px;
    height: 100%
}

main.home section.sec06 .board-wrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 24px
}

main.home section.sec06 .board-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    width: 540px;
    height: 100%
}

main.home section.sec06 .board-box .no-data {
    width: 100%
}

main.home section.sec06 .board-box .no-data li {
    width: 100%
}

main.home section.sec06 .board-box .list-title-box {
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    width: auto
}

main.home section.sec06 .board-box .list-title-box .icon {
    width: 16px;
    height: 16px;
    background-image: url("../images/icons/ImageAssets_Right_Arrow_16.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center
}

main.home section.sec06 .board-box .list-box {
    width: 100%
}

main.search .sec01 {
    width: 100%;
    height: calc(100vh - 98px)
}

main.search .sec01 .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    transform: scale(1, 1);
    z-index: 1
}

main.search .sec01 .bg>img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: auto;
    max-width: none;
    transform: translate(-50%, -50%);
    transform-origin: center center
}

main.search .sec01 .bg .blocks-cont p {
    position: absolute;
    top: 50%;
    left: 50%
}

main.search .sec01 .bg .blocks-cont p.block-1-1 {
    transform: translate(63%, -152%)
}

main.search .sec01 .bg .blocks-cont p.block-1-2 {
    transform: translate(130.6%, -129%)
}

main.search .sec01 .bg .blocks-cont p.block-1-3 {
    transform: translate(196%, -106%)
}

main.search .sec01 .bg .blocks-cont p.block-1-4 {
    transform: translate(-7%, -159%)
}

main.search .sec01 .bg .blocks-cont p.block-1-5 {
    transform: translate(-32%, -120%)
}

main.search .sec01 .bg .blocks-cont p.block-1-6 {
    transform: translate(-71%, 17%)
}

main.search .sec01 .bg .blocks-cont p.block-1-7 {
    transform: translate(-56%, -60%)
}

main.search .sec01 .bg .blocks-cont p.block-1-8 {
    transform: translate(-120%, -2%)
}

main.search .sec01 .bg .blocks-cont p.block-1-9 {
    transform: translate(106%, -123%)
}

main.search .sec01 .bg .blocks-cont p.block-1-10 {
    transform: translate(108%, 100%)
}

main.search .sec01 .bg .blocks-cont p.block-1-11 {
    transform: translate(82%, -65%)
}

main.search .sec01 .bg .blocks-cont p.block-1-12 {
    transform: translate(58%, -6%)
}

main.search .sec01 .bg .blocks-cont p.block-1-13 {
    transform: translate(127%, 20%)
}

main.search .sec01 .bg .blocks-cont p.block-1-14 {
    transform: translate(154%, -38%)
}

main.search .sec01 .bg .blocks-cont p.block-1-15 {
    transform: translate(177%, -95%)
}

main.search .sec01 .bg .blocks-cont p.block-1-16 {
    transform: translate(-141%, 100%)
}

main.search .sec01 .bg .blocks-cont p.block-1-17 {
    transform: translate(-83%, 101%)
}

main.search .sec01 .bg .blocks-cont p.block-1-18 {
    transform: translate(-14%, 101%)
}

main.search .sec01 .bg .blocks-cont p.block-1-19 {
    transform: translate(46%, 101%)
}

main.search .sec01 .bg .blocks-cont p.block-1-20 {
    transform: translate(106%, 101%)
}

main.search .sec01 .bg .blocks-cont p.block-1-21 {
    transform: translate(164%, 101%)
}

main.search .sec01 .bg .blocks-cont p.block-1-22 {
    transform: translate(269%, -75%)
}

main.search .sec01 .bg .blocks-cont p.block-1-23 {
    transform: translate(510%, -57%)
}

main.search .sec01 .bg .blocks-cont p.block-1-24 {
    transform: translate(562%, -43%)
}

main.search .sec01 .bg .blocks-cont p.block-1-25 {
    transform: translate(615%, -28%)
}

main.search .sec01 .bg .blocks-cont p.block-1-26 {
    transform: translate(307%, 1%)
}

main.search .sec01 .bg .blocks-cont p.block-1-27 {
    transform: translate(269%, 61%)
}

main.search .sec01 .bg .blocks-cont p.block-1-28 {
    transform: translate(509%, 41%)
}

main.search .sec01 .bg .blocks-cont p.block-1-29 {
    transform: translate(642%, 82%)
}

main.search .sec01 .bg .blocks-cont p.block-1-30 {
    transform: translate(243%, 103%)
}

main.search .sec01 .bg .blocks-cont p.block-1-31 {
    transform: translate(304%, 104%)
}

main.search .sec01 .bg .blocks-cont p.block-1-32 {
    transform: translate(365%, 105%)
}

main.search .sec01 .bg .blocks-cont p.block-1-33 {
    transform: translate(425%, 105%)
}

main.search .sec01 .bg .blocks-cont p.block-1-34 {
    transform: translate(356%, -7%)
}

main.search .sec01 .category-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
    position: absolute;
    top: 50%;
    right: 50%;
    padding: 16px;
    z-index: 3;
    background-color: #fff;
    transform: translate(800px, -200px)
}

main.search .sec01 .category-box p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

main.search .sec01 .category-box p span {
    width: 32px;
    height: 16px
}

main.search .sec01 .category-box p span.c-6669FF {
    background-color: #6669ff
}

main.search .sec01 .category-box p span.c-00A84C {
    background-color: #00a84c
}

main.search .sec01 .contents {
    position: absolute;
    height: calc(100vh - 98px);
    padding: 113px 100px;
    z-index: 2
}

main.search .sec01 .home-qucik-btn {
    position: absolute;
    top: calc(50% - 49px);
    left: 0;
    width: 126px;
    margin: 0;
    transform: translateY(-50%)
}

main.search .sec01 #searchResultBox {
    margin-left: 75px;
    width: 480px;
    max-height: 757px;
    background-color: #fff;
    box-shadow: 4px 0px 40px 0px rgba(0,0,0,.12)
}

main.search .sec01 #searchResultBox .card {
    box-shadow: none
}

main.search .sec01 #searchResultBox .card .card-top {
    clip-path: none
}

main.search .sec01 #searchResultBox .card .content-text {
    position: relative;
    align-items: flex-start;
    gap: 24px;
    padding: 20px 24px;
    background-color: #3479ec
}

main.search .sec01 #searchResultBox .card .content-text>* {
    color: #fff
}

main.search .sec01 #searchResultBox .card .content-text .count {
    position: absolute;
    top: 27px;
    right: 107px;
    font-size: 12px;
    font-weight: 700;
    color: #fff
}

main.search .sec01 #searchResultBox .card .content-text .btn-reset {
    gap: 4px;
    position: absolute;
    top: 20px;
    right: 24px;
    width: auto;
    height: auto;
    margin: 0;
    padding: 7px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    border-radius: 4px;
    border: 1px solid #79a4ff;
    background: #2365f0
}

main.search .sec01 #searchResultBox .card .content-text .btn-reset .icon {
    display: flex;
    width: 11px;
    height: 11px;
    background-image: url("../images/icons/Line-Arrow-Rotate-Left-2--Streamline-Sharp.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%
}

main.search .sec01 #searchResultBox .card .content-text .content-info {
    gap: 4px
}

main.search .sec01 #searchResultBox .card .content-text .content-info p {
    gap: 16px;
    padding: 0
}

main.search .sec01 #searchResultBox .card .content-text .content-info p span {
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    line-height: 160%
}

main.search .sec01 #searchResultBox .card .content-text .content-info p span:first-child {
    min-width: 48px;
    width: 48px;
    font-weight: 700;
    line-height: normal
}

main.search .sec01 #searchResultBox .card .tab-box {
    gap: 0;
    border-bottom: 1px solid #c2c4c8
}

main.search .sec01 #searchResultBox .card .tab-box li {
    width: 33.3333333333%
}

main.search .sec01 #searchResultBox .card .tab-box li button {
    width: 100%
}

main.search .sec01 #searchResultBox .card .board-box {
    height: 450px;
    overflow-y: scroll
}

main.search .sec01 #searchResultBox .card .board-box ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start
}

main.search .sec01 #searchResultBox .card .board-box ul li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    border-bottom: 1px solid #eaebec
}

main.search .sec01 #searchResultBox .card .board-box ul li>button {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 20px;
    margin: 0
}

main.search .sec01 #searchResultBox .card .board-box ul li>button p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px
}

main.search .sec01 #searchResultBox .card .board-box ul li>button p span {
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

main.search .sec01 #searchResultBox .card .board-box ul li>button p span.tag {
    font-size: 12px;
    font-weight: 700;
    color: #3479ec
}

main.search .sec01 #searchResultBox .card .board-box ul li>button>span {
    font-size: 14px;
    font-weight: 500;
    color: #171719
}

main.search .sec01 #searchResultBox .card .board-box ul li>button.active span {
    color: #3479ec
}

main.search .sec01 #searchResultBox .card .board-box ul li>button.active>span {
    color: #3479ec
}

main.search .sec01 #searchResultBox .card .board-box ul li>button.active~.accordion-cont {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center
}

main.search .sec01 #searchResultBox .card .board-box ul li .accordion-cont {
    display: none;
    gap: 40px;
    width: 100%;
    height: 100%;
    padding: 20px 32px;
    background-color: #f7f7f8;
    border-top: 1px solid #eaebec
}

main.search .sec01 #searchResultBox .card .board-box ul li .accordion-cont .left {
    width: 180px
}

main.search .sec01 #searchResultBox .card .board-box ul li .accordion-cont .right {
    width: 196px
}

main.search .sec01 #searchResultBox .card .board-box ul li .accordion-cont .right .btn {
    margin-top: 16px;
    width: 100%
}

main.search .sec01 #searchResultBox .card .pagination-box {
    background-color: #fff;
    box-shadow: 0px -7px 20px 0px rgba(0,0,0,.1)
}

.sub .sec01 {
    width: 100%;
    height: auto
}

.sub .sec01 .contents {
    padding: 80px 0 120px
}

.sub .sec01 .red {
    color: #e52222 !important
}

.sub .sec01 li .title {
    margin-bottom: 24px;
    font-size: 24px;
    font-weight: 700;
    color: #171719;
    line-height: normal
}

.sub .sec01 .text {
    position: relative;
    padding-left: 24px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%
}

.sub .sec01 .text::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #171719
}

.sub .sec01 .text.red {
    color: #e52222
}

.sub .sec01 .text.red::before {
    background: #e52222
}

.sub .sec01 .map-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 32px;
    width: 100%
}

.sub .sec01 .map-box h3 {
    width: 100%;
    margin-bottom: 0
}

.sub .sec01 .map-box img {
    width: 100%
}

.sub .sec01 .map-box .map-text {
    width: 100%
}

.sub .sec01 .map-box .map-text .title {
    margin-bottom: 24px;
    font-size: 24px;
    font-weight: normal;
    color: #171719;
    font-weight: 700
}

.sub .sec01 .view-img {
    position: relative
}

.sub .sec01 .view-img .util-icon {
    position: absolute;
    right: 20px;
    bottom: 18px;
    width: 30px !important;
    height: 30px
}

.sub .sec01 .text-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px
}

.sub .sec01 .table-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px
}

.sub .sec01 .table-text p {
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%
}

.sub .sec01 .table-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px;
    width: 100%
}

.sub .sec01 .table-area.gap-32 {
    gap: 32px
}

.sub .sec01 .table-area .table-wrap {
    width: 100%
}

.sub .sec01 .table-area .table-wrap table {
    position: relative;
    width: 100%;
    text-align: center
}

.sub .sec01 .table-area .table-wrap table.table1 tr:first-child>td:last-child {
    text-align: left
}

.sub .sec01 .table-area .table-wrap table.table1 tr:first-child>td:last-child,.sub .sec01 .table-area .table-wrap table.table1 tr:last-child>td:last-child {
    border-right: none
}

.sub .sec01 .table-area .table-wrap table.table2 th:last-child,.sub .sec01 .table-area .table-wrap table.table2 td:last-child {
    border-right: none
}

.sub .sec01 .table-area .table-wrap table.table2 td:last-child {
    text-align: left
}

.sub .sec01 .table-area .table-wrap table.table3 th:last-child,.sub .sec01 .table-area .table-wrap table.table3 td:last-child {
    border-right: none
}

.sub .sec01 .table-area .table-wrap table.table3 th:last-child {
    border-right: 1px solid #eaebec
}

.sub .sec01 .table-area .table-wrap table tr {
    border-bottom: 1px solid #eaebec
}

.sub .sec01 .table-area .table-wrap table tr.border-b {
    border-bottom: 1px solid #c2c4c8
}

.sub .sec01 .table-area .table-wrap table tr:first-child th:last-child {
    border-right: none
}

.sub .sec01 .table-area .table-wrap table th,.sub .sec01 .table-area .table-wrap table td {
    font-size: 14px;
    font-weight: 700;
    color: #171719;
    padding: 16px 20px;
    border-right: 1px solid #eaebec
}

.sub .sec01 .table-area .table-wrap table th {
    background: #f7f7f8
}

.sub .sec01 .table-area .table-wrap table th:last-child {
    border-right: none
}

.sub .sec01 .table-area .table-wrap table td {
    font-weight: 500;
    line-height: 160%
}

.sub .sec01 .table-area .table-wrap table td p {
    font-size: 14px
}

.sub .sec01 .table-area .table-wrap table td.borderR {
    border-right: 1px solid #eaebec !important
}

.sub .sec01 .table-area .table-wrap table::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: #000
}

.sub .sec01 .table-area .table-wrap .table-note {
    padding-left: 18px;
    margin: 10px 0 0;
    font-size: 12px;
    white-space: nowrap
}

.sub .sec01 .table-area .table-wrap .table-note::before {
    top: 7px;
    left: 7px
}

.sub .sec01 .table-area .table-wrap .table-flex {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start
}

.sub .sec01 .table-area .table-wrap .table-flex .table-left {
    border-right: 1px solid #eaebec
}

.sub .sec01 .table-area .table-wrap .table-flex .table-left td {
    padding: 16px 20px
}

.sub .sec01 .table-area .table-wrap .table-flex .table-right td {
    height: 129px;
    padding: 0;
    font-size: 14px
}

.sub .sec01 .table-area .table-wrap .table-flex .table-right td:first-child {
    text-align: center
}

.sub .sec01 .table-area .table-wrap .table-flex .table-right tr:first-child td {
    height: 130px
}

.sub .sec01 .table-area.new td {
    text-align: left !important
}

.sub .sec01 ul.text-box strong {
    display: inline-block;
    width: auto
}

.sub .sec01 ul.text-box .text span {
    color: #1d5ad8
}

.sub .sec01 .note {
    margin-top: 24px;
    font-size: 12px;
    font-weight: 500;
    color: #70737c
}

.sub .sec01 .note.mt-10 {
    margin-top: 10px
}

.sub .sec01 .note.text {
    position: relative;
    padding-left: 20px
}

.sub .sec01 .note.text::before {
    top: 8px;
    left: 8px;
    width: 2px;
    height: 2px;
    background: #70737c
}

.sub .sec01 .note.red {
    color: #e52222
}

.sub .sec01 .video-box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 100%;
    gap: 16px
}

.sub .sec01 .video-box p {
    width: 100%
}

.sub .sec01 .video-box video {
    width: 100%
}

.sub .sec01 .gap-0 {
    gap: 0 !important
}

.sub .sec01 .gap-4 {
    gap: 4px !important
}

.sub .sec01 .gap-24 {
    gap: 24px !important
}

.sub .sec01 .text-left {
    text-align: left !important
}

.sub.board .contents {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 40px
}

.sub.board .contents .top-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    position: relative;
    width: 100%
}

.sub.board .contents .top-content .total-cnt-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 16px
}

.sub.board .contents .top-content .total-cnt-box p {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 700;
    color: #70737c
}

.sub.board .contents .top-content .total-cnt-box p span {
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

.sub.board .contents .top-content .total-cnt-box p:first-child::after {
    position: absolute;
    right: -8px;
    top: 50%;
    content: "";
    width: 1px;
    height: 12px;
    background-color: #000;
    transform: translateY(-50%)
}

.sub.board .contents .top-content .search-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px
}

.sub.board .contents .top-content .search-box select {
    width: 100px;
    height: 50px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%;
    border: 1px solid #c2c4c8;
    background-color: #fff
}

.sub.board .contents .top-content .search-box .input-box {
    position: relative;
    width: 350px;
    height: 50px;
    padding: 12px 48px 12px 20px;
    border: 1px solid #c2c4c8;
    background-color: #fff
}

.sub.board .contents .top-content .search-box input[type=text] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    font-size: 16px;
    font-weight: 500;
    color: #171719
}

.sub.board .contents .top-content .search-box input[type=text]::placeholder {
    color: #c2c4c8
}

.sub.board .contents .top-content .search-box .btn-search {
    position: absolute;
    right: 20px;
    top: 50%;
    width: 24px;
    height: 24px;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M3 11.1816C3 13.3516 3.86199 15.4326 5.39634 16.9669C6.9307 18.5012 9.01173 19.3633 11.1816 19.3633C13.3516 19.3633 15.4326 18.5012 16.9669 16.9669C18.5012 15.4326 19.3633 13.3516 19.3633 11.1816C19.3633 9.01173 18.5012 6.9307 16.9669 5.39634C15.4326 3.86199 13.3516 3 11.1816 3C9.01173 3 6.9307 3.86199 5.39634 5.39634C3.86199 6.9307 3 9.01173 3 11.1816Z' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M16.9092 16.9082L21.7498 21.7495' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
    background-size: 100%;
    background-repeat: no-repeat;
    margin: 0
}

.sub.board .contents .board {
    width: 100%;
    border-top: 1px solid #000
}

.sub.board .contents .board .inquiryAnswer {
    padding: 5px 6px;
    font-size: 14px;
    font-weight: 500;
    color: #70737c;
    border: 1px solid #eaebec
}

.sub.board .contents .board .inquiryAnswer.inquiryAnswerC {
    border: 1px solid rgba(0,0,0,0);
    color: #1d5ad8;
    background: #eff7ff
}

.sub.board .contents .pagination-box {
    min-height: auto
}

.sub.board .contents .btn-inquiry {
    position: absolute;
    right: 0;
    bottom: 120px
}

.sub.board .contents .board-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px
}

.sub.write .dot {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    width: 4px;
    height: 4px;
    background-color: #ff4242;
    border-radius: 100%;
    margin-top: 5px
}

.sub.write .text-box {
    width: auto;
    padding-top: 0
}

.sub.write .search-box p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4px;
    font-size: 14px;
    font-weight: 500;
    color: #171719
}

.sub.write .form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 40px;
    width: 100%;
    padding-top: 40px
}

.sub.write .form>div {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    width: 100%;
    min-height: 50px
}

.sub.write .form>div .label {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    font-size: 16px;
    font-weight: 700;
    color: #171719;
    gap: 4px;
    width: 140px;
    min-height: 50px;
    padding: 12px 8px
}

.sub.write .form>div .label.pw-label {
    width: auto;
    margin-left: 8px
}

.sub.write .form>div .input-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}

.sub.write .form>div .input-box p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4px;
    width: 325px;
    font-size: 12px;
    font-weight: 500;
    color: #989ba2;
    line-height: 160%;
    margin-left: 16px
}

.sub.write .form>div .input-box p .dot {
    background-color: #989ba2
}

.sub.write .form>div input,.sub.write .form>div select,.sub.write .form>div textarea {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 250px;
    height: 50px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%;
    border: 1px solid #c2c4c8;
    background-color: #fff;
    resize: none
}

.sub.write .form>div input::placeholder,.sub.write .form>div select::placeholder,.sub.write .form>div textarea::placeholder {
    color: #c2c4c8
}

.sub.write .form>div input.input-title,.sub.write .form>div select.input-title,.sub.write .form>div textarea.input-title {
    width: 940px
}

.sub.write .form>div textarea {
    width: 940px;
    height: 300px;
    padding: 20px 20px 30px
}

.sub.write .form>div .typing {
    position: absolute;
    bottom: 20px;
    right: 20px;
    font-size: 12px;
    font-weight: 700;
    color: #c2c4c8
}

.sub.write .btn-save {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 200px;
    height: 60px;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background-color: #3479ec;
    margin: 0 auto
}

.sub.view .title-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 80px;
    padding: 20px;
    border-bottom: 1px solid #eaebec
}

.sub.view .title-box h2 {
    font-size: 24px;
    font-weight: 700;
    color: #171719
}

.sub.view .q-board {
    border-bottom: 1px solid #eaebec
}

.sub.view .a-board {
    background-color: #fbfbfb;
    border-bottom: 1px solid #eaebec
}

.sub.view .content-info {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
    width: 100%;
    min-height: 60px;
    padding: 20px;
    border-bottom: 1px solid #eaebec
}

.sub.view .content-info p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%
}

.sub.view .content-info p span {
    font-weight: 700
}

.sub.view .content-info p.date {
    position: absolute;
    top: 20px;
    right: 20px
}

.sub.view .content-info.q-info2 {
    justify-content: space-between
}

.sub.view .content-info.q-info2 .infoCategory {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    background: #2b8bfd;
    border-radius: 4px
}

.sub.view .content-info.q-info2 .dateWrap {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 24px
}

.sub.view .content-info.q-info2 .dateWrap .date {
    position: unset
}

.sub.view .fileWrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start
}

.sub.view .fileWrap .fileContent {
    width: 100%
}

.sub.view .fileWrap .fileContent>li {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 32px;
    padding: 16px 20px;
    border-bottom: 1px solid #eaebec
}

.sub.view .fileWrap .fileContent>li .left {
    width: 60px
}

.sub.view .fileWrap .fileContent>li .left p {
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.sub.view .fileWrap .fileContent>li .right {
    width: 91%
}

.sub.view .fileWrap .fileContent>li .right ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px
}

.sub.view .fileWrap .fileContent>li .right ul li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.sub.view .fileWrap .fileContent>li .right ul li .fileBox {
    display: flex;
    gap: 12px
}

.sub.view .fileWrap .fileContent>li .right ul li .fileBox a {
    display: flex;
    align-items: center;
    gap: 8px
}

.sub.view .fileWrap .fileContent>li .right ul li .fileBox .file-name {
    font-size: 14px;
    font-weight: 500;
    color: #171719
}

.sub.view .fileWrap .fileContent>li .right ul li .fileBox button {
    padding: 5px 11px;
    font-size: 12px;
    font-weight: 700;
    color: #171719;
    border: 1px solid #c2c4c8
}

.sub.view .fileWrap .fileContent>li .right ul li .file-down-cnt {
    font-size: 14px;
    font-weight: 500;
    color: #989ba2
}

.sub.view .fileWrap .fileContent>li .right .viewerBtnWrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px
}

.sub.view .fileWrap .fileContent>li .right .viewerBtnWrap a {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 9px 13px;
    border: 1px solid #c2c4c8;
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

.sub.view .view-box {
    width: 100%;
    padding: 40px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%
}

.sub.view .view-box>* {
    max-width: 100%
}

.sub.view .view-box video {
    display: block;
    margin: 0 auto
}

.sub.view .view-box iframe {
    margin: 0 auto
}

.sub.view .file-box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    border: 1px solid #eaebec
}

.sub.view .file-box>p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 60px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 700;
    color: #171719;
    background-color: #f7f7f8;
    border-bottom: 1px solid #eaebec
}

.sub.view .file-box .file-list {
    width: 100%;
    padding: 16px 20px
}

.sub.view .file-box .file-list .file-item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.sub.view .file-box .file-list .file-item a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #171719;
    padding: 8px 0
}

.sub.view .file-box .file-list .file-item .file-down-cnt {
    font-size: 14px;
    font-weight: 500;
    color: #989ba2
}

.sub.view .btn-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 20px 0 16px
}

.sub.introduction .text-16 {
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 25.6px
}

.sub.introduction strong {
    display: block;
    width: 100%
}

.sub.introduction .marginB-24 {
    margin-bottom: 24px
}

.sub.introduction .contact-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    text-align: left;
    border: 1px solid #eaebec;
    height: 80px
}

.sub.introduction .contact-box.contact-box2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    height: 160px
}

.sub.introduction .contact-box.contact-box2 .box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    border-bottom: 1px solid #eaebec
}

.sub.introduction .contact-box.contact-box2 .box:last-child {
    border-bottom: none
}

.sub.introduction .contact-box>div {
    height: 100%
}

.sub.introduction .contact-box .left {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
    width: 200px;
    height: 100%;
    padding: 0 40px;
    border-right: 1px solid #eaebec
}

.sub.introduction .contact-box .right {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding: 0 24px
}

.sub.introduction .contact-box p {
    font-weight: 500;
    line-height: 22.4px
}

.sub.introduction .introduction-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 96px;
    width: 100%
}

.sub.introduction .introduction-wrap.gap-56 {
    gap: 56px
}

.sub.introduction .introduction-wrap .introduction-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px;
    width: 100%
}

.sub.introduction .introduction-wrap .introduction-content>li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 56px;
    width: 100%
}

.sub.introduction .introduction-wrap .introduction-content>li .introduction-text {
    width: 508px
}

.sub.introduction .introduction-wrap .introduction-content.introduction-content1 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start
}

.sub.introduction .introduction-wrap .introduction-content .introduction-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px
}

.sub.introduction .introduction-wrap .introduction-content .introduction-text ul {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.sub.introduction .introduction-wrap .introduction-content .introduction-text.gap-8 {
    gap: 8px
}

.sub.introduction .introduction-wrap .introduction-content .table-wrap tr td {
    padding: 16px;
    text-align: left
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
    width: 100%
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-wrap strong {
    margin-bottom: 8px
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-wrap .line-bar {
    position: absolute;
    left: 117.5px;
    top: 85px;
    width: 1px;
    height: 1003px;
    background: #c2c4c8
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 79px;
    width: 100%;
    padding-left: 24px
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent .year {
    position: relative;
    width: 43px;
    font-size: 18px;
    font-weight: 700;
    color: #171719
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent .year::after {
    content: "";
    position: absolute;
    right: -55px;
    top: 50%;
    width: 8px;
    height: 8px;
    background: #3479ec;
    border-radius: 50%;
    transform: translateY(-50%)
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent .detail-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px;
    width: 100%
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent .detail {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent .detail .date {
    width: 60px
}

.sub.introduction .introduction-wrap .introduction-content .propulsion-cotent .detail p {
    font-weight: 500;
    line-height: 25.6px
}

.sub.introduction .introduction-wrap .introduction-content.gap-32 {
    gap: 32px
}

.sub.guide .contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px
}

.sub.guide .contents .text-center {
    text-align: center !important
}

.sub.guide .contents .text-left {
    text-align: left !important
}

.sub.guide .contents .tab-contents {
    width: 100%
}

.sub.guide .contents .text-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px;
    width: 100%
}

.sub.guide .contents .text-area .text-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
    width: 100%
}

.sub.guide .contents .text-area .text-wrap.gap-56 {
    gap: 56px
}

.sub.guide .contents .text-area .text-wrap h3 {
    margin-bottom: 0
}

.sub.guide .contents .text-area .text-wrap .text-box {
    width: 100%;
    padding-top: 0;
    gap: 24px
}

.sub.guide .contents .text-area .text-wrap .text-box .title {
    margin-bottom: 0;
    font-size: 24px;
    font-weight: 700;
    color: #171719
}

.sub.guide .contents .text-area .text-wrap .text-box ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px;
    width: 100%
}

.sub.guide .contents .text-area .text-wrap .text-box .numTextBox {
    display: flex;
    position: relative;
    font-size: 18px;
    font-weight: 700;
    color: #171719
}

.sub.guide .contents .text-area .text-wrap .text-box .numTextBox span {
    position: absolute;
    display: inline-block
}

.sub.guide .contents .text-area .text-wrap .text-box .numTextBox p {
    padding-left: 24px
}

.sub.guide .contents .text-area .text-wrap .engIconText {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 10px
}

.sub.guide .contents .text-area .text-wrap .engIconText li {
    position: relative;
    min-height: 26px
}

.sub.guide .contents .text-area .text-wrap .engIconText li span {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #3479ec;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    line-height: 136%;
    letter-spacing: -0.259px
}

.sub.guide .contents .text-area .text-wrap .engIconText li p {
    padding-left: 32px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%
}

.sub.guide .contents .text-area .text-wrap .img-box .note {
    font-size: 14px;
    font-weight: 500;
    color: #70737c;
    line-height: 160%;
    margin-top: 10px
}

.sub.guide .contents .table-wrap {
    width: 100%
}

.sub.guide .contents .table-wrap .tableTitle {
    font-size: 14px;
    font-weight: 700;
    color: #171719;
    text-align: center;
    margin-bottom: 16px
}

.sub.guide .contents .table-wrap.flex-table {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px
}

.sub.guide .contents .table-wrap.flex-table p {
    font-size: 14px;
    font-weight: 500;
    color: #171719;
    line-height: 160%;
    text-align: left
}

.sub.guide .contents .table-wrap table {
    position: relative;
    width: 100%
}

.sub.guide .contents .table-wrap table tr {
    border-bottom: 1px solid #eaebec
}

.sub.guide .contents .table-wrap table tr.borderB {
    border-bottom: 1px solid #989ba2
}

.sub.guide .contents .table-wrap table th,.sub.guide .contents .table-wrap table td {
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 500;
    color: #171719;
    line-height: 160%;
    text-align: center;
    border-right: 1px solid #eaebec
}

.sub.guide .contents .table-wrap table th:last-child,.sub.guide .contents .table-wrap table td:last-child {
    border-right: none
}

.sub.guide .contents .table-wrap table th.borderR,.sub.guide .contents .table-wrap table td.borderR {
    border-right: 1px solid #eaebec
}

.sub.guide .contents .table-wrap table th {
    font-size: 14px;
    font-weight: 700;
    background: #f7f7f8
}

.sub.guide .contents .table-wrap table::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 1px;
    background: #000
}

.sub.guide .contents .table-wrap .table1 {
    width: 100%
}

.sub.guide .contents .table-wrap .table1.table-left td:last-child {
    font-size: 16px;
    text-align: left
}

.sub.guide .contents .table-wrap .table2 {
    width: 100%
}

.sub.guide .contents .table-wrap .table2 td {
    text-align: left
}

.sub.guide .contents .table-wrap .table2 td:last-child {
    border-right: 1px solid #eaebec
}

.sub.guide .contents .down-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
    width: 100%
}

.sub.guide .contents .down-wrap .down-box {
    width: 100%
}

.sub.guide .contents .down-wrap .down-title {
    display: flex;
    gap: 16px;
    margin-bottom: 24px
}

.sub.guide .contents .down-wrap .down-title p {
    font-size: 18px;
    font-weight: 700;
    color: #171719;
    line-height: normal
}

.sub.guide .contents .down-wrap .down-title a {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px
}

.sub.guide .contents .down-wrap .down-text {
    font-size: 14px;
    font-weight: 700;
    color: #3479ec
}

.sub.guide .contents .down-wrap .down-item {
    width: 100%;
    border: 1px solid #eaebec
}

.sub.guide .contents .down-wrap .down-item li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 1.3953488372vw;
    padding: 19px 24px;
    width: 100%;
    border-bottom: 1px solid #eaebec
}

.sub.guide .contents .down-wrap .down-item li:last-child {
    border-bottom: none
}

.sub.guide .contents .down-wrap .down-item li p {
    font-size: 14px;
    font-weight: 500;
    color: #171719
}

.sub.guide .contents .tab-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px;
    display: none;
    width: 100%
}

.sub.guide .marginB-24 {
    margin-bottom: 24px
}

.sub.guide .marginB-32 {
    margin-bottom: 24px
}

.sub.guide.download .text-wrap {
    width: 100%
}

.sub.guide .tab-box {
    justify-content: center;
    gap: 0;
    width: 100%
}

.sub.guide .tab-box .tab-sqaure-large:last-child {
    border-right: 1px solid #c2c4c8
}

.sub.guide .tab-box .tab-sqaure-large.active {
    border: 1px solid #3479ec
}

.sub.guide .formula {
    width: 100%;
    padding: 20px 0;
    background: #fbfbfb;
    border: 1px solid #eaebec;
    text-align: center
}

.sub.guide .formula p {
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: normal
}

.sub.guide .energy-wrap {
    width: 100%
}

.sub.guide .energy-wrap .energy-title {
    width: 100%;
    margin-bottom: 32px
}

.sub.guide .energy-wrap .energy-title h3 {
    margin-bottom: 0
}

.sub.guide .energy-wrap .energy-contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px
}

.sub.guide .energy-wrap .energy-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px;
    width: 100%
}

.sub.guide .energy-wrap .energy-box .text-box {
    width: 100%
}

.sub.guide .energy-wrap .energy-box .text-box .title {
    margin-bottom: 0;
    font-weight: 800
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
    width: 100%
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
    width: 100%
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-title p {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: normal
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-title p span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    background: #000;
    border-radius: 50%
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 70px;
    padding: 20px 0;
    border: 1px solid #eaebec;
    background: #f7f7f8
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-text {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 8px
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-text li {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-text li p {
    font-size: 14px;
    font-weight: 500;
    color: #171719;
    line-height: 22.4px
}

.sub.guide .energy-wrap .energy-box .text-box .formula-wrap .formula-box .formula-text li p.formula-icon-wrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px
}

.sub.guide .energy-wrap .energy-box .table-box {
    width: 100%
}

.sub.guide5 .contents .text-wrap {
    width: 100%
}

.sub.info .info-tit {
    text-align: left
}

.sub.info .tab-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    width: 100%;
    margin: 56px 0
}

.sub.info .tab-box .tab {
    height: 50px;
    color: #171719;
    background-color: #fff;
    border-right: 0
}

.sub.info .tab-box .tab:last-child {
    border-right: 1px solid #c2c4c8
}

.sub.info .tab-box .tab.active {
    color: #fff;
    background-color: #3479ec
}

.sub.info .card-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px;
    width: 100%;
    padding-top: 40px
}

.sub.info .card {
    width: 352px;
    min-width: 352px;
    box-shadow: none;
    border: 1px solid #eaebec
}

.sub.info .card .card-top {
    clip-path: none
}

.sub.info .card .content-img {
    padding-top: 220px
}

.sub.info .card .content-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 352px;
    transform: translate(-50%, -50%)
}

.sub.info .card .content-text {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
    gap: 24px;
    padding: 30px 20px;
    background-color: #fff
}

.sub.info .card .content-text .bottom {
    width: 100%
}

.sub.info .card .content-text .bottom .content-info {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start
}

.sub.info .card .content-text .bottom .content-info p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 4px 0
}

.sub.info .card .content-text .bottom .content-info p span {
    min-width: 70px;
    font-size: 12px;
    font-weight: 700;
    color: #171719
}

.sub.info .card .content-text .bottom .content-info p span:first-child {
    font-size: 12px;
    font-weight: 700;
    color: #70737c
}

.sub.info2 .contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 96px
}

.sub.info2 .contents .info-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 56px
}

.sub.info2 .contents .tab-box {
    margin: 0
}

.sub.info2 .contents .img-box {
    width: 100%
}

.sub.info2 .contents .blockWrap {
    position: relative;
    width: 100%
}

.sub.info2 .contents .blockWrap .infoBlockWrap {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-1 {
    width: 100px;
    height: 91px;
    transform: translate(-196%, -195%) rotate(19deg);
    clip-path: polygon(9% 0, 100% 0%, 93% 100%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-2 {
    width: 100px;
    height: 91px;
    transform: translate(-104%, -162%) rotate(19deg);
    clip-path: polygon(9% 0, 100% 0%, 93% 100%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-3 {
    width: 100px;
    height: 91px;
    transform: translate(-12%, -130%) rotate(20deg);
    clip-path: polygon(9% 0, 100% 0%, 93% 100%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-4 {
    width: 106px;
    height: 102px;
    transform: translate(-278%, -203%) rotate(19deg);
    clip-path: polygon(15% 0%, 100% 0%, 87% 100%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-5 {
    width: 106px;
    height: 86px;
    transform: translate(-321%, -121%) rotate(19deg);
    clip-path: polygon(15% 0%, 100% 0%, 93% 68%, 7% 70%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-6 {
    width: 77px;
    height: 93px;
    transform: translate(-466%, 20%) rotate(10deg);
    clip-path: polygon(33% 1%, 94% 8%, 71% 76%, 7% 84%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-7 {
    width: 106px;
    height: 85px;
    transform: translate(-347%, -53%) rotate(18deg);
    clip-path: polygon(15% 0%, 100% 0%, 93% 68%, 7% 70%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-8 {
    width: 77px;
    height: 112px;
    transform: translate(-532%, 1%) rotate(10deg);
    clip-path: polygon(42% 4%, 97% 9%, 71% 76%, 7% 84%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-9 {
    width: 62px;
    height: 53px;
    transform: translate(-333%, -142%) rotate(18deg);
    clip-path: polygon(13% 0%, 100% 0%, 92% 71%, 3% 70%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-10 {
    width: 66px;
    height: 43px;
    transform: translate(-310%, 151%) rotate(15deg);
    clip-path: polygon(10% 0%, 96% 0%, 89% 53%, 2% 83%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-11 {
    width: 66px;
    height: 56px;
    transform: translate(-343%, -59%) rotate(19deg);
    clip-path: polygon(10% 0%, 95% 0%, 88% 65%, 0% 68%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-12 {
    width: 66px;
    height: 56px;
    transform: translate(-372%, 12%) rotate(17deg);
    clip-path: polygon(10% 0%, 95% 0%, 88% 65%, 0% 68%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-13 {
    width: 66px;
    height: 56px;
    transform: translate(-283%, 44%) rotate(17deg);
    clip-path: polygon(10% 0%, 95% 0%, 88% 65%, 0% 68%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-14 {
    width: 66px;
    height: 56px;
    transform: translate(-253%, -28%) rotate(16deg);
    clip-path: polygon(10% 0%, 95% 0%, 88% 65%, 0% 68%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-15 {
    width: 66px;
    height: 56px;
    transform: translate(-223%, -98%) rotate(17deg);
    clip-path: polygon(10% 0%, 95% 0%, 88% 65%, 0% 68%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-16 {
    width: 103px;
    height: 96px;
    transform: translate(-457%, 110%);
    clip-path: polygon(100% 0, 87% 28%, 83% 100%, 6% 98%, 46% 0)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-17 {
    width: 103px;
    height: 92px;
    transform: translate(-395%, 118%);
    clip-path: polygon(100% 0, 96% 99%, 27% 98%, 30% 30%, 47% 0)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-18 {
    width: 98px;
    height: 94px;
    transform: translate(-332%, 115%);
    clip-path: polygon(35% 0%, 100% 0%, 92% 100%, 28% 99%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-19 {
    width: 98px;
    height: 97px;
    transform: translate(-269%, 113%);
    clip-path: polygon(40% 0%, 100% 0%, 95% 92%, 33% 92%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-20 {
    width: 98px;
    height: 97px;
    transform: translate(-198%, 113%);
    clip-path: polygon(36% 0%, 100% 0%, 96% 95%, 29% 95%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-21 {
    width: 98px;
    height: 97px;
    transform: translate(-95%, 112%);
    clip-path: polygon(84% 0, 63% 39%, 52% 100%, 0% 98%, 5% 0%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-22 {
    width: 118px;
    height: 103px;
    transform: translate(90%, -75%) rotate(19deg);
    clip-path: polygon(8% 0%, 92% 0%, 82% 86%, 0% 87%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-23 {
    width: 88px;
    height: 103px;
    transform: translate(232%, -51%) rotate(18deg);
    clip-path: polygon(15% 0%, 68% 0%, 54% 86%, 0% 87%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-24 {
    width: 88px;
    height: 103px;
    transform: translate(290%, -35%) rotate(18deg);
    clip-path: polygon(15% 0%, 68% 0%, 54% 86%, 0% 87%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-25 {
    width: 88px;
    height: 103px;
    transform: translate(347%, -20%) rotate(18deg);
    clip-path: polygon(15% 0%, 68% 0%, 54% 86%, 0% 87%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-26 {
    width: 101px;
    height: 69px;
    transform: translate(68%, 27%) rotate(19deg);
    clip-path: polygon(7% 0%, 100% 0%, 93% 55%, 0% 59%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-27 {
    width: 101px;
    height: 55px;
    transform: translate(50%, 105%) rotate(17deg);
    clip-path: polygon(7% 0%, 100% 0%, 95% 55%, 0% 95%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-28 {
    width: 68px;
    height: 60px;
    transform: translate(240%, 72%) rotate(18deg);
    clip-path: polygon(13% 0%, 86% 0%, 77% 75%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-29 {
    width: 56px;
    height: 43px;
    transform: translate(396%, 135%) rotate(18deg);
    clip-path: polygon(13% 0%, 100% 0%, 95% 67%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-30 {
    width: 113px;
    height: 94px;
    transform: translate(-21%, 118%);
    clip-path: polygon(50% 2%, 97% 0%, 94% 100%, 21% 100%, 29% 47%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-31 {
    width: 106px;
    height: 101px;
    transform: translate(64%, 109%);
    clip-path: polygon(24% 0%, 78% 0%, 79% 93%, 19% 92%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-32 {
    width: 106px;
    height: 102px;
    transform: translate(132%, 109%);
    clip-path: polygon(15% 0%, 74% 0%, 74% 93%, 15% 93%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-33 {
    width: 106px;
    height: 103px;
    transform: translate(200%, 108%);
    clip-path: polygon(11% 0%, 74% 0%, 87% 94%, 12% 93%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info1-34 {
    width: 166px;
    height: 162px;
    transform: translate(202%, -5%) rotate(9deg);
    clip-path: polygon(30% 2%, 82% 10%, 61% 89%, 0% 100%)
}

.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-1 {
    width: 35px;
    height: 31px;
    transform: translate(-95%, -355%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-2 {
    width: 35px;
    height: 31px;
    transform: translate(-0%, -325%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-3 {
    width: 70px;
    height: 41px;
    transform: translate(-75%, -185%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-4 {
    width: 70px;
    height: 41px;
    transform: translate(-100%, -105%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-5 {
    width: 35px;
    height: 21px;
    transform: translate(-235%, -55%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-6 {
    width: 35px;
    height: 21px;
    transform: translate(-255%, 45%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-7 {
    width: 35px;
    height: 31px;
    transform: translate(-135%, -5%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-8 {
    width: 70px;
    height: 70px;
    transform: translate(30%, -125%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}
.sub.info2 .contents .blockWrap .infoBlockWrap .infoBlock.info2-9 {
    width: 70px;
    height: 70px;
    transform: translate(-15%, -40%) rotate(19deg);
    clip-path: polygon(7% 0, 100% 0%, 93% 100%, 0% 100%);
}

.sub.info6 .contents {
    gap: 56px
}

.sub.info6 .contents .text-wrap .flow {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 32px;
    width: 100%
}

.sub.info6 .contents .text-wrap .flow .box {
    position: relative;
    width: calc((100% - 96px)/4);
    height: auto;
    border: 1px solid #eaebec
}

.sub.info6 .contents .text-wrap .flow .box::after {
    position: absolute;
    top: 50%;
    right: -24px;
    display: block;
    content: "";
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='16' viewBox='0 0 17 16' fill='none'%3E%3Cpath d='M5.65376 2L12.1992 8L5.65376 14' stroke='%23C2C4C8' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    transform: translateY(-50%)
}

.sub.info6 .contents .text-wrap .flow .box:last-child::after {
    content: none
}

.sub.info6 .contents .text-wrap .flow .box p {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center
}

.sub.info6 .contents .text-wrap .flow .box p.head {
    height: 50px;
    font-size: 14px;
    font-weight: 700;
    color: #171719;
    background-color: #f7f7f8
}

.sub.info6 .contents .text-wrap .flow .box p.body {
    height: 150px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    border-top: 1px solid #eaebec
}

.sub.info6 .contents .text-wrap .text-box {
    padding-top: 0
}

.sub.info6 .contents .text-wrap .noti a:hover {
    text-decoration: underline
}

.sub.info6 .contents .text-wrap .noti .note {
    margin-top: 0;
    line-height: 160%
}

.sub.info6 .contents .text-wrap .reference {
    font-size: 12px;
    font-weight: 500;
    color: #70737c
}

.sub.info6 .contents .text-wrap h3 .warning {
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
    color: #e52222
}

.sub.info6 .contents .table-wrap .table1.table-left td:last-child {
    font-size: 14px
}

.sub.favour .favour-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 96px
}

.sub.favour .favour-wrap .tableTitle {
    width: 100%;
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

.sub.favour .favour-wrap .content-title {
    margin-bottom: 32px
}

.sub.favour .favour-wrap .marginB-24 {
    margin-bottom: 24px
}

.sub.favour .favour-wrap .marginB-32 {
    margin-bottom: 32px
}

.sub.favour .favour-wrap.gap-56 {
    gap: 56px
}

.sub.favour .favour-wrap .text-box {
    gap: 4px;
    margin-bottom: 56px;
    padding-top: 0
}

.sub.favour .favour-wrap .img-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 56px
}

.sub.favour .favour-wrap .img-wrap p {
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 700;
    color: #171719;
    text-align: center
}

.sub.favour .favour-wrap .img-wrap .video-box p {
    margin-bottom: 0
}

.sub.favour .favour-wrap .favour-content {
    width: 100%
}

.sub.favour .favour-wrap .table-wrap {
    margin: 0 auto;
    text-align: center
}

.sub.favour .favour-wrap .table-wrap table.table1 tr:first-child>td:last-child {
    text-align: center
}

.sub.favour .favour-wrap .table-wrap table.table1 td:last-child {
    border-right: none
}

.sub.favour .favour-wrap .contact {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 24px;
    padding: 20px 0;
    background: #fbfbfb;
    border: 1px solid #eaebec
}

.sub.favour .favour-wrap .contact li {
    position: relative;
    font-size: 16px;
    font-weight: 500;
    color: #171719
}

.sub.favour .favour-wrap .contact li p {
    color: #70737c
}

.sub.favour .favour-wrap .contact li p span {
    font-size: 17px;
    font-weight: 700;
    color: #3479ec
}

.sub.favour .favour-wrap .contact li~li::after {
    content: "";
    position: absolute;
    left: -8px;
    top: 50%;
    width: 1px;
    height: 10px;
    background: #c2c4c8;
    transform: translateY(-50%)
}

.sub.favour .favour-wrap .situation-title {
    padding: 24px;
    border: 1px solid #c2c4c8;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.sub.favour .favour-wrap .situation-title .title {
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.sub.favour .favour-wrap .situation-title .note {
    margin: 0;
    line-height: normal
}

.sub.favour .favour-wrap .situation-wrap {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.sub.favour .favour-wrap .situation-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 40px;
    padding: 24px 16px;
    height: 931px;
    overflow-y: scroll;
    overflow-x: hidden
}

.sub.favour .favour-wrap .situation-content .situation-box {
    width: 272px
}

.sub.favour .favour-wrap .situation-content .situation-box .top {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background: #f7f7f8;
    border-radius: 6px
}

.sub.favour .favour-wrap .situation-content .situation-box .top span {
    font-size: 14px;
    font-weight: 700;
    color: #171719
}

.sub.favour .favour-wrap .situation-content .situation-box .top ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 16px
}

.sub.favour .favour-wrap .situation-content .situation-box .top ul li {
    position: relative;
    font-size: 12px;
    font-weight: 500;
    color: #989ba2
}

.sub.favour .favour-wrap .situation-content .situation-box .top ul li~li::after {
    content: "";
    position: absolute;
    left: -8px;
    top: 50%;
    width: 1px;
    height: 10px;
    transform: translateY(-50%);
    background: #eaebec
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 16px;
    gap: 8px;
    border-bottom: 1px solid #eaebec
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    width: 100%;
    font-size: 12px;
    font-weight: 700;
    color: #171719
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li p .num {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    width: 11px;
    height: 11px;
    font-size: 7px;
    font-weight: 700;
    color: #000;
    border: 1px solid #000;
    border-radius: 50%
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li>ul {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 16px
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li>ul li {
    position: relative;
    display: flex;
    gap: 4px;
    font-size: 12px;
    font-weight: 500;
    color: #989ba2
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li>ul li span {
    color: #171719
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li>ul li:first-child {
    width: 74px
}

.sub.favour .favour-wrap .situation-content .situation-box .bottom>li>ul li:first-child::before {
    content: "";
    position: absolute;
    right: -8px;
    top: 50%;
    width: 1px;
    height: 10px;
    transform: translateY(-50%);
    background: #eaebec
}

.sub.favour.favour2 .text-box,.sub.favour.favour3 .text-box {
    margin-bottom: 0
}

.sub.industrial .text-16 {
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 25.6px
}

.sub.industrial strong {
    display: block;
    width: 100%
}

.sub.industrial .marginB-24 {
    margin-bottom: 24px
}

.sub.industrial .industrial-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 96px;
    width: 100%
}

.sub.industrial .industrial-wrap.gap-56 {
    gap: 56px
}

.sub.industrial .industrial-wrap .industrial-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    width: 100%
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 32px 72px 34px 72px;
    color: #fff
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap.color_01 {
    background: #605e5e
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap.color_02 {
    background: #549cbb
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap.color_03 {
    background: #5e49b3
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap.color_04 {
    background: #2f4d92
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap.color_05 {
    background: #a17a32
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap .intro-box p {
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    letter-spacing: -0.418px
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap .intro-box h1 {
    font-size: 44px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.88px
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap .contact-box {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 10px
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap .contact-box>div {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 4px
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap .contact-box>div p {
    font-size: 12px;
    font-weight: 700;
    color: #fff
}

.sub.industrial .industrial-wrap .industrial-content .intro-wrap .contact-box>div p.tel {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    padding: 8px 14px;
    border-radius: 4px;
    border: 1px solid #fff
}

.sub.industrial .industrial-wrap .industrial-content .purpose {
    margin-bottom: 56px
}

.sub.industrial .industrial-wrap .industrial-content .purpose li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%
}

.sub.industrial .industrial-wrap .industrial-content.industrial-content1 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start
}

.sub.industrial .industrial-wrap .industrial-content.industrial-content1 .industrial-text {
    width: auto
}

.sub.industrial .industrial-wrap .industrial-content .industrial-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 32px;
    width: 100%
}

.sub.industrial .industrial-wrap .industrial-content .industrial-text.industrial-state {
    gap: 32px
}

.sub.industrial .industrial-wrap .industrial-content .industrial-text .linkWrap {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 24px
}

.sub.industrial .industrial-wrap .industrial-content .industrial-text .linkWrap .linkBtn {
    padding: 14px 20px;
    background: #3479ec;
    font-size: 18px;
    font-weight: 700;
    color: #fff
}

.sub.industrial .industrial-wrap .industrial-content .table-wrap tr td {
    padding: 16px;
    text-align: left
}

.sub.industrial .industrial-wrap .industrial-content .table-wrap.table02 td {
    text-align: center
}

.sub.industrial .industrial-wrap .industrial-content .table-wrap.table02 td p.text {
    text-align: left
}

.sub.industrial .industrial-wrap .industrial-content p.note:before {
    content: "";
    position: absolute;
    left: 10px;
    top: 4px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #70737c
}

.sub.industrial .industrial-wrap .industrial-content p.note {
    position: relative;
    padding-left: 24px;
    margin-top: 10px;
    color: var(--Label-Neutral, #70737c);
    font-size: 12px;
    font-weight: 500
}

.sub.industrial .industrial-wrap .industrial-content .imgBox {
    position: relative;
    border: 1px solid #c2c4c8
}

.sub.industrial .industrial-wrap .industrial-content .imgBox .stateFild {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea1 .stateFild1 {
    width: 144px;
    height: 81px;
    background: url("/images/sub/statelabel/state1_1.png") no-repeat;
    transform: translate(112%, -173%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea1 .stateFild2 {
    width: 146px;
    height: 100px;
    background: url("/images/sub/statelabel/state1_2.png") no-repeat;
    transform: translate(13%, -158%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea1 .stateFild3 {
    width: 207px;
    height: 112px;
    background: url("/images/sub/statelabel/state1_3.png") no-repeat;
    transform: translate(-52%, 80%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea1 .stateFild4 {
    width: 170px;
    height: 75px;
    background: url("/images/sub/statelabel/state1_4.png") no-repeat;
    transform: translate(44%, 134%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild1 {
    width: 100px;
    height: 72px;
    background: url("/images/sub/statelabel/ImageAssets_KV_C13-3.png") no-repeat;
    transform: translate(358%, -1%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild2 {
    width: 122px;
    height: 46px;
    background: url("/images/sub/statelabel/ImageAssets_KV_D11-2.png") no-repeat;
    transform: translate(-296%, -415%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild3 {
    width: 123px;
    height: 66px;
    background: url("/images/sub/statelabel/ImageAssets_KV_D11-3.png") no-repeat;
    transform: translate(-194%, -319%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild4 {
    width: 153px;
    height: 20px;
    background: url("/images/sub/statelabel/ImageAssets_KV_D11-6.png") no-repeat;
    transform: translate(-249%, -745%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild5 {
    width: 85px;
    height: 65px;
    background: url("/images/sub/statelabel/ImageAssets_KV_D13-2.png") no-repeat;
    transform: translate(-380%, -205%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild6 {
    width: 83px;
    height: 69px;
    background: url("/images/sub/statelabel/ImageAssets_KV_D13-3.png") no-repeat;
    transform: translate(-287%, -193%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild7 {
    width: 142px;
    height: 92px;
    background: url("/images/sub/statelabel/ImageAssets_KV_E01-2.png") no-repeat;
    transform: translate(91%, -45%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild8 {
    width: 128px;
    height: 43px;
    background: url("/images/sub/statelabel/ImageAssets_KV_K16.png") no-repeat;
    transform: translate(-175%, -403%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild9 {
    width: 139px;
    height: 39px;
    background: url("/images/sub/statelabel/ImageAssets_KV_L01.png") no-repeat;
    transform: translate(-104%, 497%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea2 .stateFild10 {
    width: 109px;
    height: 43px;
    background: url("/images/sub/statelabel/ImageAssets_KV_L02.png ") no-repeat;
    transform: translate(-279%, -712%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea3 .stateFild1 {
    width: 157px;
    height: 77px;
    background: url("/images/sub/statelabel/ImageAssets_KV_2273-1.png") no-repeat;
    transform: translate(-28%, -160%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea3 .stateFild2 {
    width: 166px;
    height: 30px;
    background: url("/images/sub/statelabel/ImageAssets_KV_2273-2.png") no-repeat;
    transform: translate(-117%, -220%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea3 .stateFild3 {
    width: 243px;
    height: 154px;
    background: url("/images/sub/statelabel/ImageAssets_KV_2273-5.png") no-repeat;
    transform: translate(-73%, -182%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea3 .stateFild4 {
    width: 213px;
    height: 133px;
    background: url("/images/sub/statelabel/ImageAssets_KV_2273-5_1.png") no-repeat;
    transform: translate(-6%, -219%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea3 .stateFild5 {
    width: 112px;
    height: 74px;
    background: url("/images/sub/statelabel/ImageAssets_KV_2273-6.png") no-repeat;
    transform: translate(-103%, -17%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea3 .stateFild6 {
    width: 203px;
    height: 89px;
    background: url("/images/sub/statelabel/ImageAssets_KV_2273-7.png") no-repeat;
    transform: translate(-11%, -48%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea4 .stateFild1 {
    width: 157px;
    height: 20px;
    background: url("/images/sub/statelabel/ImageAssets_KV_32B-4.png") no-repeat;
    transform: translate(-103%, 215%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea4 .stateFild2 {
    width: 209px;
    height: 79px;
    background: url("/images/sub/statelabel/ImageAssets_KV_34B-5.png") no-repeat;
    transform: translate(0%, 32%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea4 .stateFild3 {
    width: 146px;
    height: 98px;
    background: url("/images/sub/statelabel/ImageAssets_KV_34B-6.png") no-repeat;
    transform: translate(-4%, -64%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea4 .stateFild4 {
    width: 115px;
    height: 59px;
    background: url("/images/sub/statelabel/ImageAssets_KV_34B-8.png") no-repeat;
    transform: translate(-104%, -45%)
}

.sub.industrial .industrial-wrap .industrial-content .imgBox.stateArea4 .stateFild5 {
    width: 102px;
    height: 78px;
    background: url("/images/sub/statelabel/ImageAssets_KV_D13-2_4.png") no-repeat;
    transform: translate(-10%, 41%)
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    width: 100%
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 20px;
    width: calc((100% - 24px)/2)
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status.third {
    width: calc((100% - 24px)/3)
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 16px;
    width: 100%;
    height: 90px;
    padding: 24px;
    border-radius: 8px
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText p {
    font-size: 18px;
    font-weight: 700;
    color: #126865
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText.green {
    background: #d3f1f2
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText.blue {
    background: #e1ecf9
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText.blue p {
    color: #375db6
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText.gray {
    background: #f2f2f2
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .statusText.gray p {
    color: #4b7cef
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status p {
    font-size: 14px;
    font-weight: 500;
    color: #000
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status p span {
    font-size: 14px;
    font-weight: 600;
    color: #158a6b
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 8px;
    width: 100%
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusHeader{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    border: 1px solid #eaebec;
    border-radius: 4px;
    padding: 14px 16px;
}
.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusHeader p{
    width: calc(100% / 5);
    display: flex;
    justify-content: center;
    /* font-size: 18px; */
    font-weight: 700;
    color: #126865;
}
.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status02 .statusHeader p{
    color: #375db6;
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList {
    width: 100%;
    border: 1px solid #eaebec;
    border-radius: 4px
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList .statusTitle {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    display: flex;
    justify-content: space-between;
    cursor: pointer
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    display: none
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul.active {
    display: block
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul li {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 14px 16px;
    border-bottom: 1px solid #eaebec;
    display: flex;
    justify-content: space-between
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul li:first-child {
    border-top: 1px solid #eaebec
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul li:last-child {
    border-bottom: none
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul li.no-data {
    border: none !important
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul li p {
    font-size: 12px
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont .statusList ul li p span {
    font-size: 12px;
    font-weight: 400;
    color: #000
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status02 li,.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status03 li {
    width: 100%;
    padding: 14px 16px
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status02 li .statusTitle,.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status03 li .statusTitle {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status03 li .statusTitle p span {
    color: #375db6
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont.status03 li .statusTitle p span {
    color: #4b7cef
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont p {
    font-size: 14px;
    font-weight: 500;
    color: #000
}

.sub.industrial .industrial-wrap .industrial-content .status-wrap .status .stausCont p span {
    font-size: 14px;
    font-weight: 600;
    color: #158a6b
}

.sub.industrial .industrialSwiper {
    overflow: hidden
}

.sub.industrial .industrialSwiper .swiper-button-next,.sub.industrial .industrialSwiper .swiper-button-prev {
    width: 46px;
    height: 46px;
    background: url("../../images/icons/circleBtn.svg") no-repeat
}

.sub.industrial .industrialSwiper .swiper-button-next {
    right: 17px
}

.sub.industrial .industrialSwiper .swiper-button-prev {
    left: 17px;
    transform: rotate(180deg)
}

.sub.industrial .industrialSwiper .swiper-button-next.swiper-button-disabled,.sub.industrial .industrialSwiper .swiper-button-prev.swiper-button-disabled {
    opacity: 1;
    background: url("../../images/icons/circleBtnDisabled.svg") no-repeat
}

.sub.industrial .industrialSwiper .swiper-button-next.swiper-button-disabled {
    transform: rotate(180deg)
}

.sub.industrial .industrialSwiper .swiper-button-prev.swiper-button-disabled {
    transform: rotate(0)
}

.sub.promotion .data-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px;
    padding-top: 40px
}

.sub.news .data-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px
}

.sub.news .data {
    background-color: #fff;
    box-shadow: 0px 1px 10px 0px rgba(0,0,0,.2)
}

.sub.news .data .text-box {
    padding: 0 20px
}

.sub.inquiry-pw .contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.sub.inquiry-pw .password-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    width: 100%;
    padding: 64px 0;
    border: 1px solid #c2c4c8
}

.sub.inquiry-pw .password-wrap .text-box {
    align-items: center;
    gap: 24px;
    padding-top: 0;
    text-align: center
}

.sub.inquiry-pw .password-wrap .text-box p {
    font-size: 16px;
    font-weight: 500;
    color: #70737c;
    line-height: 160%
}

.sub.inquiry-pw .password-wrap .password-box {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8px
}

.sub.inquiry-pw .password-wrap .password-box p {
    margin-right: 12px;
    font-size: 16px;
    font-weight: 700;
    color: #171719
}

.sub.inquiry-pw .password-wrap .password-box .input-box {
    width: 250px;
    height: 50px;
    padding: 12px 20px;
    border: 1px solid #c2c4c8;
    background-color: #fff
}

.sub.inquiry-pw .password-wrap .password-box .input-box input {
    width: 100%;
    height: 100%;
    font-size: 16px;
    font-weight: 500;
    color: #171719
}

.sub.inquiry-pw .password-wrap .password-box .input-box input::placeholder {
    color: #c2c4c8
}

.sub.inquiry-pw .password-notice {
    margin-top: -17px;
    font-size: 12px;
    font-weight: 500;
    color: #70737c
}

.sub.inquiry-pw .btn-inquiry {
    position: unset !important;
    margin-top: 0
}

.sub.faq .question {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 0
}

.sub.faq .question .toggle-btn-box {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    min-height: 70px;
    padding: 0 20px
}

.sub.faq .question .toggle-btn-box .toggle-btn {
    position: relative;
    width: 100%;
    min-height: 70px;
    text-align: left;
    font-size: 18px;
    font-weight: 700;
    color: #171719;
    cursor: pointer
}

.sub.faq .question .toggle-btn-box .toggle-btn::before {
    content: "Q";
    font-size: 18px;
    font-weight: 700;
    color: #3479ec;
    margin-right: 16px
}

.sub.faq .question .toggle-btn-box .toggle-btn::after {
    position: absolute;
    top: 27px;
    right: 0;
    content: "";
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M14 4.95455L8 11.5L2 4.95454' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%
}

.sub.faq .question .toggle-btn-box .toggle-btn.active::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2 11.5455L8 5L14 11.5455' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E")
}

.sub.faq .answer {
    position: relative;
    display: none;
    width: 100%;
    padding: 30px 20px 30px 49px;
    font-size: 16px;
    font-weight: 500;
    color: #171719;
    line-height: 160%;
    text-align: left;
    border-top: 1px solid #eaebec;
    background-color: #fbfbfb
}

.sub.faq .answer::before {
    position: absolute;
    top: 30px;
    left: 20px;
    content: "A";
    font-size: 18px;
    font-weight: 700;
    color: #171719
}

@media screen and (min-width: 1921px) {
    main.home section.sec01 .bg {
        width:100%
    }

    main.home section.sec01 .bg>img {
        width: 100%
    }

    main.home section.sec01 .bg .blocks-cont p img {
        width: 100%
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-1 {
        width: 7.9166666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-2 {
        width: 9.7916666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-3 {
        width: 7.6041666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-4 {
        width: 7.5520833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-5 {
        width: 8.8541666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-6 {
        width: 6.3020833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-7 {
        width: 8.59375vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-8 {
        width: 7.2395833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-9 {
        width: 7.1875vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-10 {
        width: 5.3645833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-11 {
        width: 6.1458333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-12 {
        width: 6.1979166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-13 {
        width: 4.1145833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-14 {
        width: 5.3645833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-15 {
        width: 5.3645833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-16 {
        width: 8.6458333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-17 {
        width: 7.2916666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-18 {
        width: 6.4583333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-19 {
        width: 6.1979166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-20 {
        width: 6.5104166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-21 {
        width: 6.25vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-22 {
        width: 7.5520833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-23 {
        width: 7.0833333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-24 {
        width: 7.0833333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-25 {
        width: 6.9270833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-26 {
        width: 5.8854166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-27 {
        width: 6.0416666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-28 {
        width: 7.5520833333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-29 {
        width: 9.8958333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-30 {
        width: 6.09375vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-31 {
        width: 5.78125vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-32 {
        width: 7.03125vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-33 {
        width: 5.8854166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-1-34 {
        width: 11.3541666667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-1 {
        width: 3.3854166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-2 {
        width: 3.3333333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-3 {
        width: 3.28125vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-4 {
        width: 3.3333333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-5 {
        width: 2.1354166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-6 {
        width: 3.125vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-7 {
        width: 3.6458333333vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-8 {
        width: 6.1979166667vw
    }

    main.home section.sec01 .bg .blocks-cont p.block-2-9 {
        width: 7.34375vw
    }

    main.search section.sec01 .bg {
        width: 100%
    }

    main.search section.sec01 .bg>img {
        width: 100%
    }

    main.search section.sec01 .bg .blocks-cont p img {
        width: 100%
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-1 {
        width: 8.125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-2 {
        width: 8.0729166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-3 {
        width: 8.125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-4 {
        width: 8.4375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-5 {
        width: 7.4479166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-6 {
        width: 5vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-7 {
        width: 7.34375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-8 {
        width: 5.7291666667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-9 {
        width: 4.7916666667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-10 {
        width: 4.84375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-11 {
        width: 4.84375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-12 {
        width: 4.8958333333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-13 {
        width: 4.84375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-14 {
        width: 4.84375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-15 {
        width: 6.8229166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-16 {
        width: 6.8229166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-17 {
        width: 6.8229166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-18 {
        width: 6.7708333333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-19 {
        width: 6.7708333333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-20 {
        width: 6.8229166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-21 {
        width: 8.59375vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-22 {
        width: 5.6770833333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-23 {
        width: 5.6770833333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-24 {
        width: 5.6770833333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-25 {
        width: 7.03125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-26 {
        width: 7.4479166667vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-27 {
        width: 5.2083333333vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-28 {
        width: 4.6875vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-29 {
        width: 7.03125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-30 {
        width: 7.03125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-31 {
        width: 7.03125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-32 {
        width: 7.03125vw
    }

    main.search section.sec01 .bg .blocks-cont p.block-1-33 {
        width: 10.2083333333vw
    }

    main.search section.sec01 .category-box {
        right: 8.4%;
        transform: translate(0, -263%)
    }
}