
@import url(default.css);
@import url(font.css);
@import url(common.css);

header {
    font-family: "NanumSquareNeo";
}
header .header_top,
header .header_body {
    padding: 0 20px;
    position: relative;
    z-index: 100;
}
header .header_top {
    height: 40px;
    width: 100%;
    position: relative;
    z-index: 101;
}
header .header_top::after {
    content: "";
    display: block;
    position: absolute;
    top: 40px;
    left: 0;
    width: 100%;
    height: 1px;
    background: #ededed;
}
header .header_top .util {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 30px;
    font-size: 15px;
    height: 100%;
}
header .header_top .util .site_open,
header .header_top .util .login_open {
    padding: 0 0 0 25px;
    position: relative;
}
header .header_top .util .site_open::before,
header .header_top .util .login_open::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 0;
    width: 22px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_147_9' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='18' height='18'%3E%3Crect width='18' height='18' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_147_9)'%3E%3Cpath d='M6 12H15V4.5H6V12ZM6 13.5C5.5875 13.5 5.23438 13.3531 4.94063 13.0594C4.64688 12.7656 4.5 12.4125 4.5 12V3C4.5 2.5875 4.64688 2.23438 4.94063 1.94063C5.23438 1.64688 5.5875 1.5 6 1.5H15C15.4125 1.5 15.7656 1.64688 16.0594 1.94063C16.3531 2.23438 16.5 2.5875 16.5 3V12C16.5 12.4125 16.3531 12.7656 16.0594 13.0594C15.7656 13.3531 15.4125 13.5 15 13.5H6ZM3 16.5C2.5875 16.5 2.23438 16.3531 1.94063 16.0594C1.64688 15.7656 1.5 15.4125 1.5 15V4.5H3V15H13.5V16.5H3Z' fill='%23555555'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center center;
}
header .header_top .util .login_open::before {
    background-image: url("data:image/svg+xml,%3Csvg width='22' height='22' viewBox='0 0 22 22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_11650' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='22' height='22'%3E%3Crect width='22' height='22' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_11650)'%3E%3Cpath d='M8.25033 13.0626C7.92949 13.0626 7.65831 12.9518 7.43678 12.7303C7.21526 12.5088 7.10449 12.2376 7.10449 11.9167C7.10449 11.5959 7.21526 11.3247 7.43678 11.1032C7.65831 10.8817 7.92949 10.7709 8.25033 10.7709C8.57116 10.7709 8.84234 10.8817 9.06387 11.1032C9.2854 11.3247 9.39616 11.5959 9.39616 11.9167C9.39616 12.2376 9.2854 12.5088 9.06387 12.7303C8.84234 12.9518 8.57116 13.0626 8.25033 13.0626ZM13.7503 13.0626C13.4295 13.0626 13.1583 12.9518 12.9368 12.7303C12.7153 12.5088 12.6045 12.2376 12.6045 11.9167C12.6045 11.5959 12.7153 11.3247 12.9368 11.1032C13.1583 10.8817 13.4295 10.7709 13.7503 10.7709C14.0712 10.7709 14.3423 10.8817 14.5639 11.1032C14.7854 11.3247 14.8962 11.5959 14.8962 11.9167C14.8962 12.2376 14.7854 12.5088 14.5639 12.7303C14.3423 12.9518 14.0712 13.0626 13.7503 13.0626ZM11.0003 18.3334C13.0475 18.3334 14.7816 17.623 16.2024 16.2022C17.6232 14.7813 18.3337 13.0473 18.3337 11.0001C18.3337 10.6334 18.3107 10.2782 18.2649 9.93446C18.2191 9.59071 18.135 9.25841 18.0128 8.93758C17.692 9.01397 17.3712 9.07126 17.0503 9.10946C16.7295 9.14765 16.3934 9.16675 16.042 9.16675C14.6517 9.16675 13.3378 8.86883 12.1003 8.273C10.8628 7.67716 9.80866 6.84453 8.93783 5.77508C8.44894 6.96675 7.74998 8.00182 6.84095 8.88029C5.93192 9.75876 4.87394 10.4195 3.66699 10.8626V11.0001C3.66699 13.0473 4.37741 14.7813 5.79824 16.2022C7.21908 17.623 8.9531 18.3334 11.0003 18.3334ZM11.0019 19.7084C9.79743 19.7084 8.66527 19.4799 7.60545 19.0227C6.54563 18.5656 5.62377 17.9453 4.83987 17.1617C4.05596 16.3781 3.4353 15.4566 2.97789 14.3972C2.52062 13.3379 2.29199 12.206 2.29199 11.0017C2.29199 9.79719 2.52055 8.66503 2.97766 7.60521C3.43477 6.54539 4.05512 5.62353 4.83872 4.83962C5.62232 4.05572 6.5438 3.43506 7.60316 2.97764C8.66252 2.52038 9.79437 2.29175 10.9987 2.29175C12.2032 2.29175 13.3354 2.5203 14.3952 2.97741C15.455 3.43453 16.3769 4.05488 17.1608 4.83848C17.9447 5.62207 18.5653 6.54355 19.0228 7.60291C19.48 8.66228 19.7087 9.79413 19.7087 10.9985C19.7087 12.203 19.4801 13.3351 19.023 14.395C18.5659 15.4548 17.9455 16.3766 17.1619 17.1605C16.3783 17.9444 15.4569 18.5651 14.3975 19.0225C13.3381 19.4798 12.2063 19.7084 11.0019 19.7084ZM9.33085 3.86956C10.0254 5.15045 10.9888 6.12441 12.2211 6.79143C13.4532 7.45831 14.7269 7.79175 16.042 7.79175C16.2912 7.79175 16.5342 7.77884 16.771 7.75302C17.0078 7.7272 17.2478 7.69015 17.491 7.64187C16.8787 6.42561 15.9917 5.45898 14.8302 4.742C13.6684 4.02516 12.3918 3.66675 11.0003 3.66675C10.6925 3.66675 10.4054 3.68409 10.1391 3.71877C9.87298 3.75345 9.60355 3.80371 9.33085 3.86956ZM3.92435 9.24971C4.78586 8.81841 5.60383 8.18821 6.37826 7.35908C7.15269 6.52996 7.65273 5.53598 7.87839 4.37716C6.87586 4.83198 6.02855 5.48572 5.33647 6.33837C4.64424 7.19103 4.17353 8.16147 3.92435 9.24971Z' fill='%23555555'/%3E%3C/g%3E%3C/svg%3E%0A");
}
header .header_body {
    width: 100%;
    height: 110px;
    display: flex; /* logo, gnb, util 좌우 */
    justify-content: space-between;
    align-items: center;
    color: #1d1d1d;
}
header .logo a {
    display: block;
    width: 260px;
    height: 40px; 
    background: url(../images/logo.svg) no-repeat center center / contain;
}
@media screen and (min-width:1025px) {
    header .header_body .gnb .gnb_open,
    header .header_body .gnb .gnb_close {
        display: none;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 {
        display: flex;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li {
        width: 155px;
        text-align: center;
        position: relative; /* depth2 정렬의 기준 */
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li.over > a {
        color: var(--main-color);
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > a {
        display: block;
        line-height: 110px;
        font-size: 20px;
        font-weight: 700;
        white-space: nowrap;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > ul.depth2 {
        /* 2차하위메뉴 부드럽게 나타나는 애니메이션 */
        position: absolute;
        left: 0;
        top: 150px;
        width: 100%;
        display: none;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > ul.depth2 > li > a {
        display: block;
        color: var(--base-color);
        line-height: 2.2;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > ul.depth2 > li > a:hover {
        font-weight: var(--bold-weight);
        color: var(--main-color);
    }
    header .header_body::before {
        content: "";
        position: absolute;
        left: 0;
        top: -40px;
        z-index: -1;
        width: 100%;
        height: 400px;
        background-color: #fff;
        box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1);
        display: none;
    }
    header .header_body::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        border-bottom: 1px solid #ededed;
    }
    header .util .search .search_open {
        position: relative;
        border: 1px solid #C7C7C7;
        padding: 18px 120px 18px 32px;
        border-radius: 50px;
        color: #9E9E9E;
    }
    header .util .search .search_open::after {
        content: "";
        position: absolute;
        top: 15px;
        right: 18px;
        width: 30px;
        height: 30px;
        background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_11613' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='30' height='30'%3E%3Crect width='30' height='30' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_11613)'%3E%3Cpath d='M11.875 19.9998C9.60417 19.9998 7.68229 19.2133 6.10938 17.6404C4.53646 16.0675 3.75 14.1456 3.75 11.8748C3.75 9.60392 4.53646 7.68205 6.10938 6.10913C7.68229 4.53621 9.60417 3.74976 11.875 3.74976C14.1458 3.74976 16.0677 4.53621 17.6406 6.10913C19.2135 7.68205 20 9.60392 20 11.8748C20 12.7914 19.8542 13.656 19.5625 14.4685C19.2708 15.281 18.875 15.9998 18.375 16.6248L25.375 23.6248C25.6042 23.8539 25.7188 24.1456 25.7188 24.4998C25.7188 24.8539 25.6042 25.1456 25.375 25.3748C25.1458 25.6039 24.8542 25.7185 24.5 25.7185C24.1458 25.7185 23.8542 25.6039 23.625 25.3748L16.625 18.3748C16 18.8748 15.2812 19.2706 14.4688 19.5623C13.6562 19.8539 12.7917 19.9998 11.875 19.9998ZM11.875 17.4998C13.4375 17.4998 14.7656 16.9529 15.8594 15.8591C16.9531 14.7654 17.5 13.4373 17.5 11.8748C17.5 10.3123 16.9531 8.98413 15.8594 7.89038C14.7656 6.79663 13.4375 6.24976 11.875 6.24976C10.3125 6.24976 8.98438 6.79663 7.89062 7.89038C6.79688 8.98413 6.25 10.3123 6.25 11.8748C6.25 13.4373 6.79688 14.7654 7.89062 15.8591C8.98438 16.9529 10.3125 17.4998 11.875 17.4998Z' fill='%23BDBDBD'/%3E%3C/g%3E%3C/svg%3E%0A");
        background-repeat: no-repeat;
        background-position: center center;
    }
    /************ menu_over 추가시 *************/
    header .header_body.menu_over::before {
        display: block;
    }
    header .header_body.menu_over .gnb .gnb_wrap ul.depth1 > li > ul.depth2 {
        display: block;
    }
}

@media screen and (max-width:1440px) {
    /* 1차메뉴 여백 줄이기 */
    header .header_body .gnb .gnb_wrap ul.depth1 > li {
        width: 140px;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > a {
        font-size: 18px;
    }
}
@media screen and (max-width:1330px) {
    header .header_body .gnb .gnb_wrap ul.depth1 > li {
        width: 135px;
    }
    /* 검색창 없애고 아이콘만 */
    header .util .search .search_open {
        position: relative;
        border: 0;
        padding: 18px 18px 18px 32px;
        background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_11613' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='30' height='30'%3E%3Crect width='30' height='30' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_11613)'%3E%3Cpath d='M11.875 19.9998C9.60417 19.9998 7.68229 19.2133 6.10938 17.6404C4.53646 16.0675 3.75 14.1456 3.75 11.8748C3.75 9.60392 4.53646 7.68205 6.10938 6.10913C7.68229 4.53621 9.60417 3.74976 11.875 3.74976C14.1458 3.74976 16.0677 4.53621 17.6406 6.10913C19.2135 7.68205 20 9.60392 20 11.8748C20 12.7914 19.8542 13.656 19.5625 14.4685C19.2708 15.281 18.875 15.9998 18.375 16.6248L25.375 23.6248C25.6042 23.8539 25.7188 24.1456 25.7188 24.4998C25.7188 24.8539 25.6042 25.1456 25.375 25.3748C25.1458 25.6039 24.8542 25.7185 24.5 25.7185C24.1458 25.7185 23.8542 25.6039 23.625 25.3748L16.625 18.3748C16 18.8748 15.2812 19.2706 14.4688 19.5623C13.6562 19.8539 12.7917 19.9998 11.875 19.9998ZM11.875 17.4998C13.4375 17.4998 14.7656 16.9529 15.8594 15.8591C16.9531 14.7654 17.5 13.4373 17.5 11.8748C17.5 10.3123 16.9531 8.98413 15.8594 7.89038C14.7656 6.79663 13.4375 6.24976 11.875 6.24976C10.3125 6.24976 8.98438 6.79663 7.89062 7.89038C6.79688 8.98413 6.25 10.3123 6.25 11.8748C6.25 13.4373 6.79688 14.7654 7.89062 15.8591C8.98438 16.9529 10.3125 17.4998 11.875 17.4998Z' fill='%23BDBDBD'/%3E%3C/g%3E%3C/svg%3E%0A");
        background-repeat: no-repeat;
        background-position: center center;
    }
    header .util .search .search_open span {
        display: none;
    }
    header .util .search .search_open::after {
        display: none;
    }
}
@media screen and (max-width:1024px) {
    header .header_body {
    padding: 0 0 0 20px;
}
    header .header_top {
        height: 30px;
    }
    header .header_top::after {
        top: 30px;
    }
    header .header_top .util {
        gap: 10px;
        font-size: 14px;
    }
    header .header_body {
        height: 60px;
    }
    header .logo a {
        display: block;
        width: 162px;
        height: 24px; 
    }
    header .header_body .gnb .gnb_open,
    header .header_body .gnb .gnb_close {
        display: block;
        width: 60px;
        height: 60px;
        background-position: center center;
        background-repeat: no-repeat;
        background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_151_6' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='15' y='15' width='29' height='29'%3E%3Crect x='15' y='15' width='29' height='29' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_151_6)'%3E%3Cpath d='M19.8333 35.75C19.491 35.75 19.204 35.6342 18.9724 35.4026C18.7408 35.171 18.625 34.884 18.625 34.5417C18.625 34.1993 18.7408 33.9123 18.9724 33.6807C19.204 33.4491 19.491 33.3333 19.8333 33.3333H31.9167C32.259 33.3333 32.546 33.4491 32.7776 33.6807C33.0092 33.9123 33.125 34.1993 33.125 34.5417C33.125 34.884 33.0092 35.171 32.7776 35.4026C32.546 35.6342 32.259 35.75 31.9167 35.75H19.8333ZM19.8333 29.7083C19.491 29.7083 19.204 29.5925 18.9724 29.3609C18.7408 29.1293 18.625 28.8424 18.625 28.5C18.625 28.1576 18.7408 27.8707 18.9724 27.6391C19.204 27.4075 19.491 27.2917 19.8333 27.2917H39.1667C39.509 27.2917 39.796 27.4075 40.0276 27.6391C40.2592 27.8707 40.375 28.1576 40.375 28.5C40.375 28.8424 40.2592 29.1293 40.0276 29.3609C39.796 29.5925 39.509 29.7083 39.1667 29.7083H19.8333ZM19.8333 23.6667C19.491 23.6667 19.204 23.5509 18.9724 23.3193C18.7408 23.0877 18.625 22.8007 18.625 22.4583C18.625 22.116 18.7408 21.829 18.9724 21.5974C19.204 21.3658 19.491 21.25 19.8333 21.25H39.1667C39.509 21.25 39.796 21.3658 40.0276 21.5974C40.2592 21.829 40.375 22.116 40.375 22.4583C40.375 22.8007 40.2592 23.0877 40.0276 23.3193C39.796 23.5509 39.509 23.6667 39.1667 23.6667H19.8333Z' fill='%23002F87'/%3E%3C/g%3E%3C/svg%3E%0A");
    }
    header .header_body .gnb .gnb_close {
        background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_8853' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='15' y='15' width='29' height='29'%3E%3Crect x='15' y='15' width='29' height='29' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_8853)'%3E%3Cpath d='M29.5 31.1916L23.5791 37.1125C23.3576 37.334 23.0757 37.4448 22.7333 37.4448C22.3909 37.4448 22.109 37.334 21.8875 37.1125C21.6659 36.8909 21.5552 36.609 21.5552 36.2666C21.5552 35.9243 21.6659 35.6423 21.8875 35.4208L27.8083 29.5L21.8875 23.5791C21.6659 23.3576 21.5552 23.0757 21.5552 22.7333C21.5552 22.3909 21.6659 22.109 21.8875 21.8875C22.109 21.6659 22.3909 21.5552 22.7333 21.5552C23.0757 21.5552 23.3576 21.6659 23.5791 21.8875L29.5 27.8083L35.4208 21.8875C35.6423 21.6659 35.9243 21.5552 36.2666 21.5552C36.609 21.5552 36.8909 21.6659 37.1125 21.8875C37.334 22.109 37.4448 22.3909 37.4448 22.7333C37.4448 23.0757 37.334 23.3576 37.1125 23.5791L31.1916 29.5L37.1125 35.4208C37.334 35.6423 37.4448 35.9243 37.4448 36.2666C37.4448 36.609 37.334 36.8909 37.1125 37.1125C36.8909 37.334 36.609 37.4448 36.2666 37.4448C35.9243 37.4448 35.6423 37.334 35.4208 37.1125L29.5 31.1916Z' fill='%23002F87'/%3E%3C/g%3E%3C/svg%3E%0A");
    }
    header .header_body .gnb .gnb_wrap {
        position: fixed; /* body를 기준으로 정렬 */
        right: -100%;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: #fff;
        color: #1d1d1d;

        transition: 0.6s;
        z-index: 100;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 {
        margin: 100px 20px 0 20px;
        height: calc(100% - 60px);
        overflow-y: auto;
        overflow-x: hidden;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li {
        width: auto;
        border-top: 1px solid #ededed;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li:last-child {
        border-bottom: 1px solid #ededed;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > a {
        display: block;
        padding: 18px 0;
        font-size: 18px;
        font-weight: 700;
        position: relative; /* after 정렬의 기준 */
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li:has(ul.depth2) > a::after {
        content: "";
        position: absolute;
        right: 0;
        top: 16px;
        width: 20px;
        height: 20px;
        background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_8866' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='20' height='20'%3E%3Crect y='20' width='20' height='20' transform='rotate(-90 0 20)' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_8866)'%3E%3Cpath d='M9.5051 16.9139L15.3191 11.2871C15.5168 11.0957 15.7476 11.0032 16.0112 11.0096C16.2749 11.0159 16.5056 11.1148 16.7034 11.3062C16.9011 11.4976 17 11.7209 17 11.9761C17 12.2313 16.9011 12.4545 16.7034 12.6459L10.6323 18.5407C10.4741 18.6938 10.2961 18.8086 10.0984 18.8852C9.90061 18.9617 9.70286 19 9.5051 19C9.30735 19 9.10959 18.9617 8.91184 18.8852C8.71409 18.8086 8.53611 18.6938 8.3779 18.5407L2.28706 12.6459C2.08931 12.4545 1.99373 12.2281 2.00032 11.9665C2.00691 11.7049 2.10908 11.4785 2.30684 11.2871C2.50459 11.0957 2.73531 11 2.99898 11C3.26265 11 3.49337 11.0957 3.69112 11.2871L9.5051 16.9139Z' fill='%231C1B1F'/%3E%3C/g%3E%3C/svg%3E%0A");
        background-position: center center;
        background-repeat: no-repeat;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > ul.depth2 {
        background-color: #F9FAFB;
        border-radius: 5px;
        margin: 0 0 25px 0;
        color: #555;
        padding: 24px 20px;
        display: none; /* 숨김 */
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > ul.depth2 > li > a {
        display: block;
        padding: 7px 0;
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li > ul.depth2 > li > a:hover {
        font-weight: 700;
        color: var(--main-color);
    }
    header .header_body .gnb .gnb_close {
        display: none; /* 숨김 */
        position: fixed;
        right: 0;
        top: 30px;
        width: 60px;
        height: 60px;
        background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_157_2' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='15' y='15' width='29' height='29'%3E%3Crect x='15' y='15' width='29' height='29' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_157_2)'%3E%3Cpath d='M29.5 31.1916L23.5791 37.1125C23.3576 37.334 23.0757 37.4448 22.7333 37.4448C22.3909 37.4448 22.109 37.334 21.8875 37.1125C21.6659 36.8909 21.5552 36.609 21.5552 36.2666C21.5552 35.9243 21.6659 35.6423 21.8875 35.4208L27.8083 29.5L21.8875 23.5791C21.6659 23.3576 21.5552 23.0757 21.5552 22.7333C21.5552 22.3909 21.6659 22.109 21.8875 21.8875C22.109 21.6659 22.3909 21.5552 22.7333 21.5552C23.0757 21.5552 23.3576 21.6659 23.5791 21.8875L29.5 27.8083L35.4208 21.8875C35.6423 21.6659 35.9243 21.5552 36.2666 21.5552C36.609 21.5552 36.8909 21.6659 37.1125 21.8875C37.334 22.109 37.4448 22.3909 37.4448 22.7333C37.4448 23.0757 37.334 23.3576 37.1125 23.5791L31.1916 29.5L37.1125 35.4208C37.334 35.6423 37.4448 35.9243 37.4448 36.2666C37.4448 36.609 37.334 36.8909 37.1125 37.1125C36.8909 37.334 36.609 37.4448 36.2666 37.4448C35.9243 37.4448 35.6423 37.334 35.4208 37.1125L29.5 31.1916Z' fill='%23002F87'/%3E%3C/g%3E%3C/svg%3E%0A");
        background-position: center center;
        background-repeat: no-repeat;
    }
    header .header_body .util {
        display: none;
    }
    /******** 모바일 메뉴가 열렸을때 **********/
    header .header_body.menu_open .gnb .gnb_wrap {
        
        right: 0; /* 나타남 */
    }
    header .header_body.menu_open .gnb .gnb_close {
        display: block; /* 나타남 */
    }

    /********* 하위메뉴가 열렸을때 ************/
    header .header_body .gnb .gnb_wrap ul.depth1 > li.open > a {
        color: var(--main-color);
    }
    header .header_body .gnb .gnb_wrap ul.depth1 > li.open > ul.depth2 {
        display: block; /* 나타남 */
    }
}
  
.visual {
    background: url(../images/visual_bg.png) no-repeat center center / cover;
    height: 965px;
    color: #fff;
    position: relative; /* item 기준 */
    text-align: center;
}
.visual h2 {
    font-size: 60px;
    font-weight: 800;
    text-align: center;
    padding: 160px 0 62px 0;
    font-family: 'NPSfont';
}
.visual p {
    font-size: 20px;
    position: relative;
    padding-right: 35px;
    display: inline-block;
}
.visual p::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_11768' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='30' height='30'%3E%3Crect width='30' height='30' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_11768)'%3E%3Cpath d='M6.875 10C6.52083 10 6.22396 9.88021 5.98438 9.64062C5.74479 9.40104 5.625 9.10417 5.625 8.75C5.625 8.39583 5.74479 8.09896 5.98438 7.85938C6.22396 7.61979 6.52083 7.5 6.875 7.5C7.22917 7.5 7.52604 7.61979 7.76562 7.85938C8.00521 8.09896 8.125 8.39583 8.125 8.75C8.125 9.10417 8.00521 9.40104 7.76562 9.64062C7.52604 9.88021 7.22917 10 6.875 10ZM12.5 27.5C11.125 27.5 9.94792 27.0104 8.96875 26.0312C7.98958 25.0521 7.5 23.875 7.5 22.5V15C7.5 12.9167 8.22917 11.1458 9.6875 9.6875C11.1458 8.22917 12.9167 7.5 15 7.5H17.2812C18.7188 7.5 19.9479 7.98438 20.9688 8.95312C21.9896 9.92188 22.5 11.1146 22.5 12.5313C22.5 13.4896 22.2448 14.3698 21.7344 15.1719C21.224 15.974 20.5312 16.5833 19.6562 17C18.9896 17.3125 18.4635 17.776 18.0781 18.3906C17.6927 19.0052 17.5 19.6771 17.5 20.4062V22.5C17.5 23.8958 17.0156 25.0781 16.0469 26.0469C15.0781 27.0156 13.8958 27.5 12.5 27.5ZM10 7.5C9.64583 7.5 9.34896 7.38021 9.10938 7.14062C8.86979 6.90104 8.75 6.60417 8.75 6.25V5.625C8.75 5.27083 8.86979 4.97396 9.10938 4.73438C9.34896 4.49479 9.64583 4.375 10 4.375C10.3542 4.375 10.651 4.49479 10.8906 4.73438C11.1302 4.97396 11.25 5.27083 11.25 5.625V6.25C11.25 6.60417 11.1302 6.90104 10.8906 7.14062C10.651 7.38021 10.3542 7.5 10 7.5ZM12.5 25C13.1875 25 13.776 24.7552 14.2656 24.2656C14.7552 23.776 15 23.1875 15 22.5V20.4062C15 19.1979 15.3177 18.0833 15.9531 17.0625C16.5885 16.0417 17.4583 15.2708 18.5625 14.75C19 14.5417 19.349 14.2344 19.6094 13.8281C19.8698 13.4219 20 12.9792 20 12.5C20 11.7708 19.7292 11.1719 19.1875 10.7031C18.6458 10.2344 18.0104 10 17.2812 10H15C13.625 10 12.4479 10.4896 11.4688 11.4688C10.4896 12.4479 10 13.625 10 15V22.5C10 23.1875 10.2448 23.776 10.7344 24.2656C11.224 24.7552 11.8125 25 12.5 25ZM13.75 6.25C13.3958 6.25 13.099 6.13021 12.8594 5.89062C12.6198 5.65104 12.5 5.35417 12.5 5V4.375C12.5 4.02083 12.6198 3.72396 12.8594 3.48438C13.099 3.24479 13.3958 3.125 13.75 3.125C14.1042 3.125 14.401 3.24479 14.6406 3.48438C14.8802 3.72396 15 4.02083 15 4.375V5C15 5.35417 14.8802 5.65104 14.6406 5.89062C14.401 6.13021 14.1042 6.25 13.75 6.25ZM17.5 6.25C17.1458 6.25 16.849 6.13021 16.6094 5.89062C16.3698 5.65104 16.25 5.35417 16.25 5V3.75C16.25 3.39583 16.3698 3.09896 16.6094 2.85938C16.849 2.61979 17.1458 2.5 17.5 2.5C17.8542 2.5 18.151 2.61979 18.3906 2.85938C18.6302 3.09896 18.75 3.39583 18.75 3.75V5C18.75 5.35417 18.6302 5.65104 18.3906 5.89062C18.151 6.13021 17.8542 6.25 17.5 6.25ZM21.875 7.5C21.3542 7.5 20.9115 7.31771 20.5469 6.95312C20.1823 6.58854 20 6.14583 20 5.625V4.375C20 3.85417 20.1823 3.41146 20.5469 3.04688C20.9115 2.68229 21.3542 2.5 21.875 2.5C22.3958 2.5 22.8385 2.68229 23.2031 3.04688C23.5677 3.41146 23.75 3.85417 23.75 4.375V5.625C23.75 6.14583 23.5677 6.58854 23.2031 6.95312C22.8385 7.31771 22.3958 7.5 21.875 7.5Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center center;
}
.visual .box {
    background-color: rgba(255, 255, 255, 0.1);
    box-shadow: 5px 5px 15px 0 rgba(0, 0, 0, 0.06);
    border-radius: 10px;
    width: 758px;
    max-width: 100%;
    text-align: center;
    margin: 35px auto 0;
    display: flex;
    justify-content: space-around;
    position: relative;
}
.visual .box::before,
.visual .box::after {
    content: "";
    position: absolute;
    height: 113px;
    border: 1px solid rgba(255, 255, 255, 0.1);
} 
.visual .box::after {
    right: 32%;
    top: 21%;
}
.visual .box::before {
    left: 32%;
    top: 21%;
}   
.visual .box strong {
    font-size: 25px;
    font-family: 'NPSfont';
    font-weight: 700;
    display: block;
    padding: 60px 0 0 0;
    margin: 31px 0 0 0;
    position: relative;
}
.visual .box .tem strong {
    margin: 50px 0 0 0;
}
.visual .box strong::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 50px;
    background-repeat: no-repeat;
    background-position: center center;
}
.visual .box .tem strong::before {
    background-image: url("data:image/svg+xml,%3Csvg width='58' height='58' viewBox='0 0 58 58' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2065' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='58' height='58'%3E%3Crect width='58' height='58' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2065)'%3E%3Cpath d='M27.1877 7.71477V4.8335C27.1877 4.31995 27.3615 3.88959 27.7091 3.54239C28.0567 3.19479 28.4872 3.021 29.0008 3.021C29.5147 3.021 29.9451 3.19479 30.2919 3.54239C30.6391 3.88959 30.8127 4.31995 30.8127 4.8335V7.71477C30.8127 8.22831 30.6389 8.65888 30.2913 9.00647C29.9437 9.35367 29.5131 9.52727 28.9996 9.52727C28.4856 9.52727 28.0552 9.35367 27.7085 9.00647C27.3613 8.65888 27.1877 8.22831 27.1877 7.71477ZM27.1877 53.1668V50.2856C27.1877 49.772 27.3615 49.3414 27.7091 48.9938C28.0567 48.6467 28.4872 48.4731 29.0008 48.4731C29.5147 48.4731 29.9451 48.6467 30.2919 48.9938C30.6391 49.3414 30.8127 49.772 30.8127 50.2856V53.1668C30.8127 53.6804 30.6389 54.1107 30.2913 54.4579C29.9437 54.8055 29.5131 54.9793 28.9996 54.9793C28.4856 54.9793 28.0552 54.8055 27.7085 54.4579C27.3613 54.1107 27.1877 53.6804 27.1877 53.1668ZM53.1668 30.8127H50.2856C49.772 30.8127 49.3414 30.6389 48.9938 30.2913C48.6467 29.9437 48.4731 29.5131 48.4731 28.9996C48.4731 28.4856 48.6467 28.0552 48.9938 27.7085C49.3414 27.3613 49.772 27.1877 50.2856 27.1877H53.1668C53.6804 27.1877 54.1107 27.3615 54.4579 27.7091C54.8055 28.0567 54.9793 28.4872 54.9793 29.0008C54.9793 29.5147 54.8055 29.9451 54.4579 30.2919C54.1107 30.6391 53.6804 30.8127 53.1668 30.8127ZM7.71477 30.8127H4.8335C4.31995 30.8127 3.88959 30.6389 3.54239 30.2913C3.19479 29.9437 3.021 29.5131 3.021 28.9996C3.021 28.4856 3.19479 28.0552 3.54239 27.7085C3.88959 27.3613 4.31995 27.1877 4.8335 27.1877H7.71477C8.22831 27.1877 8.65888 27.3615 9.00647 27.7091C9.35367 28.0567 9.52727 28.4872 9.52727 29.0008C9.52727 29.5147 9.35367 29.9451 9.00647 30.2919C8.65888 30.6391 8.22831 30.8127 7.71477 30.8127ZM47.3112 13.2731L46.0002 14.5835C45.6659 14.9182 45.2516 15.0894 44.7574 15.0971C44.2632 15.1051 43.827 14.9201 43.4488 14.5419C43.102 14.1951 42.9224 13.7784 42.9099 13.2918C42.8974 12.8053 43.0664 12.3747 43.4168 12.0001L44.7641 10.6522C45.0988 10.2929 45.5195 10.1093 46.0262 10.1012C46.5325 10.0936 46.9731 10.2772 47.3481 10.6522C47.7231 11.0272 47.9043 11.464 47.8918 11.9627C47.8794 12.4613 47.6858 12.8981 47.3112 13.2731ZM14.5835 46.0002L13.2362 47.3481C12.9015 47.7074 12.4808 47.891 11.9741 47.8991C11.4678 47.9067 11.0272 47.7231 10.6522 47.3481C10.2772 46.9731 10.096 46.5363 10.1085 46.0377C10.121 45.539 10.3145 45.1022 10.6891 44.7272L12.0001 43.4168C12.3344 43.0821 12.7487 42.9109 13.2429 42.9032C13.7371 42.8952 14.1733 43.0803 14.5515 43.4585C14.8983 43.8053 15.0779 44.2219 15.0904 44.7085C15.1029 45.195 14.934 45.6256 14.5835 46.0002ZM44.7272 47.3112L43.4168 46.0002C43.0821 45.6659 42.9109 45.2516 42.9032 44.7574C42.8952 44.2632 43.0803 43.827 43.4585 43.4488C43.8053 43.102 44.2219 42.9224 44.7085 42.9099C45.195 42.8974 45.6256 43.0664 46.0002 43.4168L47.3481 44.7641C47.7074 45.0988 47.891 45.5195 47.8991 46.0262C47.9067 46.5325 47.7231 46.9731 47.3481 47.3481C46.9731 47.7231 46.5363 47.9043 46.0377 47.8918C45.539 47.8794 45.1022 47.6858 44.7272 47.3112ZM12.0001 14.5835L10.6522 13.2362C10.2929 12.9015 10.1093 12.4808 10.1012 11.9741C10.0936 11.4678 10.2772 11.0272 10.6522 10.6522C11.0272 10.2772 11.464 10.096 11.9627 10.1085C12.4613 10.121 12.8981 10.3145 13.2731 10.6891L14.5835 12.0001C14.9182 12.3344 15.0894 12.7487 15.0971 13.2429C15.1051 13.7371 14.9201 14.1733 14.5419 14.5515C14.1951 14.8983 13.7784 15.0779 13.2918 15.0904C12.8053 15.1029 12.3747 14.934 12.0001 14.5835ZM29.0056 42.2918C25.3149 42.2918 22.1761 41.0001 19.5891 38.4167C17.002 35.8333 15.7085 32.6963 15.7085 29.0056C15.7085 25.3149 17.0002 22.1761 19.5836 19.5891C22.167 17.002 25.3041 15.7085 28.9947 15.7085C32.6854 15.7085 35.8242 17.0002 38.4113 19.5836C40.9983 22.167 42.2918 25.3041 42.2918 28.9947C42.2918 32.6854 41.0001 35.8242 38.4167 38.4113C35.8333 40.9983 32.6963 42.2918 29.0056 42.2918ZM29.0002 38.6668C31.6988 38.6668 33.9845 37.7304 35.8575 35.8575C37.7304 33.9845 38.6668 31.6988 38.6668 29.0002C38.6668 26.3015 37.7304 24.0158 35.8575 22.1429C33.9845 20.27 31.6988 19.3335 29.0002 19.3335C26.3015 19.3335 24.0158 20.27 22.1429 22.1429C20.27 24.0158 19.3335 26.3015 19.3335 29.0002C19.3335 31.6988 20.27 33.9845 22.1429 35.8575C24.0158 37.7304 26.3015 38.6668 29.0002 38.6668Z' fill='%23FFEA00'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.visual .box .dust strong::before {
    background-image: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2227' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='50' height='50'%3E%3Crect width='50' height='50' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2227)'%3E%3Cpath d='M25.0002 37.1808C27.2116 37.1808 29.1 36.3982 30.6653 34.8329C32.2305 33.2676 33.0132 31.3793 33.0132 29.1678V27.2048C33.0132 26.6711 32.8326 26.2239 32.4715 25.8631C32.1108 25.502 31.6635 25.3215 31.1299 25.3215H18.8705C18.3368 25.3215 17.8896 25.502 17.5288 25.8631C17.1677 26.2239 16.9871 26.6711 16.9871 27.2048V29.1678C16.9871 31.3793 17.7698 33.2676 19.3351 34.8329C20.9003 36.3982 22.7887 37.1808 25.0002 37.1808ZM25.0002 34.6965C23.4616 34.6965 22.1555 34.1596 21.0819 33.086C20.0083 32.0124 19.4715 30.7063 19.4715 29.1678V27.8058H30.5288V29.1678C30.5288 30.7063 29.992 32.0124 28.9184 33.086C27.8448 34.1596 26.5387 34.6965 25.0002 34.6965ZM17.7064 14.9048C16.5939 14.9048 15.613 15.2635 14.7637 15.9808C13.9144 16.6978 13.2667 17.5718 12.8205 18.6027C12.6871 18.9048 12.7066 19.1926 12.8788 19.4662C13.051 19.7399 13.3002 19.9221 13.6262 20.0131C13.9252 20.1041 14.2323 20.0708 14.5476 19.9131C14.8625 19.7555 15.0868 19.5258 15.2205 19.2241C15.4903 18.7192 15.8342 18.2904 16.2522 17.9376C16.6703 17.5852 17.1557 17.4024 17.7085 17.3892C18.2613 17.4024 18.7467 17.5905 19.1647 17.9537C19.5828 18.3169 19.9267 18.751 20.1965 19.2558C20.3354 19.561 20.5578 19.7829 20.8637 19.9214C21.1693 20.06 21.4715 20.084 21.7705 19.9933C22.0965 19.9024 22.3491 19.7234 22.5283 19.4563C22.7071 19.1893 22.7299 18.9048 22.5965 18.6027C22.1503 17.5718 21.5019 16.6978 20.6512 15.9808C19.8005 15.2635 18.8189 14.9048 17.7064 14.9048ZM32.2897 14.9048C31.1772 14.9048 30.1963 15.2635 29.347 15.9808C28.4977 16.6978 27.85 17.5718 27.4038 18.6027C27.2705 18.9048 27.2899 19.1926 27.4621 19.4662C27.6344 19.7399 27.8835 19.9221 28.2095 20.0131C28.5085 20.1041 28.8156 20.0708 29.1309 19.9131C29.4458 19.7555 29.6701 19.5258 29.8038 19.2241C30.0601 18.7192 30.4007 18.2871 30.8257 17.9277C31.2503 17.5687 31.739 17.3892 32.2918 17.3892C32.8446 17.3892 33.3333 17.5741 33.758 17.9438C34.183 18.3136 34.5236 18.751 34.7799 19.2558C34.9187 19.561 35.1411 19.7829 35.447 19.9214C35.7526 20.06 36.0548 20.084 36.3538 19.9933C36.6798 19.9024 36.9325 19.7234 37.1116 19.4563C37.2904 19.1893 37.3132 18.9048 37.1798 18.6027C36.7337 17.5718 36.0852 16.6978 35.2345 15.9808C34.3838 15.2635 33.4022 14.9048 32.2897 14.9048ZM25.0038 44.7928C22.2663 44.7928 19.6932 44.2734 17.2845 43.2345C14.8759 42.1956 12.7807 40.7857 10.9991 39.0048C9.21752 37.2239 7.80693 35.1296 6.76735 32.722C5.72811 30.3143 5.2085 27.7419 5.2085 25.0048C5.2085 22.2673 5.72794 19.6942 6.76683 17.2855C7.80572 14.8768 9.21561 12.7817 10.9965 11.0001C12.7774 9.2185 14.8717 7.80791 17.2793 6.76833C19.687 5.72909 22.2594 5.20947 24.9965 5.20947C27.734 5.20947 30.3071 5.72892 32.7158 6.76781C35.1245 7.80669 37.2196 9.21659 39.0012 10.9975C40.7828 12.7784 42.1934 14.8727 43.233 17.2803C44.2722 19.6879 44.7918 22.2603 44.7918 24.9975C44.7918 27.735 44.2724 30.3081 43.2335 32.7168C42.1946 35.1254 40.7847 37.2206 39.0038 39.0022C37.2229 40.7838 35.1286 42.1944 32.721 43.234C30.3134 44.2732 27.741 44.7928 25.0038 44.7928ZM25.0002 41.6678C29.6529 41.6678 33.5939 40.0532 36.8231 36.8241C40.0522 33.5949 41.6668 29.6539 41.6668 25.0011C41.6668 20.3484 40.0522 16.4074 36.8231 13.1782C33.5939 9.94906 29.6529 8.33447 25.0002 8.33447C20.3474 8.33447 16.4064 9.94906 13.1772 13.1782C9.94808 16.4074 8.3335 20.3484 8.3335 25.0011C8.3335 29.6539 9.94808 33.5949 13.1772 36.8241C16.4064 40.0532 20.3474 41.6678 25.0002 41.6678Z' fill='%23003CFF'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.visual .box .ozone strong::before {
    background-image: url("data:image/svg+xml,%3Csvg width='50' height='50' viewBox='0 0 50 50' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2224' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='50' height='50'%3E%3Crect width='50' height='50' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2224)'%3E%3Cpath d='M25.0085 35.8169C26.7762 35.8169 28.4446 35.4176 30.0137 34.6189C31.5828 33.8203 32.8509 32.6839 33.8179 31.2096C34.1196 30.753 34.1551 30.2983 33.9242 29.8455C33.6929 29.3927 33.3248 29.1663 32.82 29.1663C32.6137 29.1663 32.4266 29.2137 32.2585 29.3085C32.0908 29.4033 31.9509 29.5389 31.8387 29.7153C31.0401 30.8452 30.0438 31.7306 28.8497 32.3715C27.6559 33.0125 26.3726 33.333 24.9997 33.333C23.6268 33.333 22.3434 33.0125 21.1497 32.3715C19.9556 31.7306 18.9592 30.8452 18.1606 29.7153C18.0273 29.5389 17.8766 29.4033 17.7085 29.3085C17.5408 29.2137 17.3537 29.1663 17.1471 29.1663C16.6422 29.1663 16.2743 29.3841 16.0434 29.8195C15.8125 30.2549 15.8479 30.6969 16.1497 31.1455C17.1163 32.6413 18.3844 33.7938 19.9538 34.6028C21.5229 35.4122 23.2078 35.8169 25.0085 35.8169ZM32.0955 22.5158C32.8538 22.5158 33.4967 22.2504 34.0242 21.7195C34.5516 21.1889 34.8153 20.5446 34.8153 19.7867C34.8153 19.0287 34.55 18.386 34.0195 17.8585C33.4889 17.3308 32.8445 17.0669 32.0861 17.0669C31.3281 17.0669 30.6854 17.3323 30.158 17.8632C29.6306 18.3938 29.3669 19.038 29.3669 19.796C29.3669 20.554 29.6321 21.1967 30.1627 21.7242C30.6933 22.2519 31.3375 22.5158 32.0955 22.5158ZM17.9132 22.5158C18.6712 22.5158 19.3139 22.2504 19.8413 21.7195C20.3688 21.1889 20.6325 20.5446 20.6325 19.7867C20.6325 19.0287 20.3672 18.386 19.8367 17.8585C19.3061 17.3308 18.6618 17.0669 17.9038 17.0669C17.1455 17.0669 16.5026 17.3323 15.9752 17.8632C15.4478 18.3938 15.184 19.038 15.184 19.796C15.184 20.554 15.4493 21.1967 15.9799 21.7242C16.5104 22.2519 17.1549 22.5158 17.9132 22.5158ZM25.0033 44.7913C22.2658 44.7913 19.6927 44.2719 17.284 43.233C14.8754 42.1941 12.7802 40.7842 10.9986 39.0033C9.21704 37.2224 7.80644 35.1281 6.76686 32.7205C5.72763 30.3129 5.20801 27.7405 5.20801 25.0033C5.20801 22.2658 5.72745 19.6927 6.76634 17.284C7.80523 14.8754 9.21513 12.7802 10.996 10.9986C12.7769 9.21704 14.8712 7.80644 17.2788 6.76686C19.6865 5.72763 22.2589 5.20801 24.996 5.20801C27.7335 5.20801 30.3066 5.72745 32.7153 6.76634C35.124 7.80523 37.2191 9.21513 39.0007 10.996C40.7823 12.7769 42.1929 14.8712 43.2325 17.2788C44.2717 19.6865 44.7913 22.2589 44.7913 24.996C44.7913 27.7335 44.2719 30.3066 43.233 32.7153C42.1941 35.124 40.7842 37.2191 39.0033 39.0007C37.2224 40.7823 35.1281 42.1929 32.7205 43.2325C30.3129 44.2717 27.7405 44.7913 25.0033 44.7913ZM24.9997 41.6663C29.6525 41.6663 33.5934 40.0518 36.8226 36.8226C40.0518 33.5934 41.6663 29.6525 41.6663 24.9997C41.6663 20.3469 40.0518 16.4059 36.8226 13.1768C33.5934 9.94759 29.6525 8.33301 24.9997 8.33301C20.3469 8.33301 16.4059 9.94759 13.1768 13.1768C9.94759 16.4059 8.33301 20.3469 8.33301 24.9997C8.33301 29.6525 9.94759 33.5934 13.1768 36.8226C16.4059 40.0518 20.3469 41.6663 24.9997 41.6663Z' fill='%230AC000'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.visual .box .num {
    font-size: 14px;
    display: block;
    margin: 11px 0 32px 0;
}
.visual .box .tem, 
.visual .box .dust, 
.visual .box .ozone {
    width: 33.33%;
}
.visual .item01,
.visual .item02,
.visual .item03,
.visual .item04,
.visual .item05 {
  position: absolute; /* .visual을 기준으로 배치됨 */
}
.visual .item01 {
    top: 12%;
    left: 4%;
}
.visual .item02  {
    top: 38%;
    left: 8%;
    animation: show1 0.7s forwards;
    z-index: 1;
}
.visual .item03  {
    bottom: 14%;
    right: 25%;
}
.visual .item04  {
    bottom: 28%;
    right: 14%;
    animation: show3 0.7s forwards;
}
.visual .item05  {
    top: 5%;
    right: -4%;
    animation: show2 0.7s forwards;
}
@keyframes show1 {
    0% {opacity: 0; transform: translate(-300px, 300px);}
    100% {opacity: 1; transform: translate(0, 0);}
}
@keyframes show2 {
    0% {opacity: 0; transform: translate(300px, -300px);}
    100% {opacity: 1; transform: translate(0, 0);}
}
@keyframes show3 {
    0% {opacity: 0; transform: translate(300px, 300px);}
    100% {opacity: 1; transform: translate(0, 0);}
}
@media screen and (max-width:1660px) {
    .visual .item01 {
        top: 26%;
        left: 1%;
        width: 100px;
    }
    .visual .item02  {
        top: 65%;
        left: 2%;
        width: 200px;
    }
    .visual .item03  {
        bottom: 11%;
        right: 5%;
    }
    .visual .item04  {
        bottom: 82%;
        right: -1%;
        width: 156px;
        animation: show2 0.7s forwards;
    }
    .visual .item05  {
        display: none;
    }
}
@media screen and (max-width:1024px) {
    .visual {
        height: 865px;
    }
    .visual h2 {
        font-size: 45px;
        padding: 205px 0 25px 0;
    }
}
@media screen and (max-width:768px) {
    .visual {
        height: 564px;
        text-align: center;
    }
    .visual h2 {
        font-size: 30px;
        padding: 205px 0 25px 0;
    }
    .visual p {
        display: none;
    }
    .visual .box {
        width: calc(100% - 40px);
        text-align: center;
        margin: 0 20px;
    }
    .visual .box::before,
    .visual .box::after {
    content: "";
    position: absolute;
    height: 60px;
    border: 1px solid rgba(255, 255, 255, 0.1);
} 
    .visual .box strong {
        font-size: 18px;
        padding: 54px 0 0 0;
        margin: 12px 0 12px 0;
    }
    .visual .box .tem strong {
        margin: 12px 0 12px 0;
    }  
    .visual .box .tem strong .whe {
        display: none;
    } 
    .visual .box .num {
        display: none;
    }
    .visual .item01 {
        top: 13%;
        left: 18%;
        width: 70px;
    }
    .visual .item02  {
        top: 3%;
        left: -6%;
        width: 150px;
    }
    .visual .item03  {
        bottom: 2%;
        right: 21%;
        width: 100px;
    }
    .visual .item04  {
        display: none;
    }
    .visual .item05  {
        display: block;
        width: 180px;
    }
}


.intro {
    background: #F7FFF4 url(../images/intro_icon01.png) no-repeat center bottom 38px;
    padding: 243px 0 280px 0;
    position: relative;
}
.intro::before {
    content: "";
    position: absolute;
    top: -230px;
    left: 0;
    display: block;
    width: 100%;
    height: 250px;
    margin: 0 auto;
    background: url(../images/paper_green.png) no-repeat center bottom / 100%;
}
.intro .story01 {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end  
}
.intro .story01 .text {
    font-size: 50px;
}
.intro .story01 .text p {
    color: #1d1d1d;
}
.intro .story01 .text h3 {
    margin-left: 300px;
    font-weight: 800;
    color: var(--main-color);
}
.intro .story01 a {
    display: inline-block;
    color: #fff;
    background: #009B93;
    border-radius: 16px;
    padding: 15px 68px 11px 25px;
    position: relative;
    margin-left: 50px;
    margin-bottom: 20px;
    z-index: 1;

    transition: all 0.3s ease;
}
.intro .story01 a:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.intro .story01 a::after {
    content: "";
    position: absolute;
    top: 12px;
    right: 20px;
    width: 27px;
    height: 27px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg width='27' height='27' viewBox='0 0 27 27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2200' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='27' height='27'%3E%3Crect width='27' height='27' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2200)'%3E%3Cpath d='M20.4469 14.6249H3.375C3.05625 14.6249 2.78906 14.5171 2.57344 14.3015C2.35781 14.0858 2.25 13.8187 2.25 13.4999C2.25 13.1812 2.35781 12.914 2.57344 12.6983C2.78906 12.4827 3.05625 12.3749 3.375 12.3749H20.4469L16.0875 7.9874C15.8813 7.78115 15.7734 7.52334 15.7641 7.21396C15.7547 6.90459 15.8625 6.6374 16.0875 6.4124C16.2937 6.20615 16.5562 6.10303 16.875 6.10303C17.1938 6.10303 17.4563 6.20615 17.6625 6.4124L23.9625 12.7124C24.075 12.8249 24.1547 12.9468 24.2016 13.078C24.2484 13.2093 24.2719 13.3499 24.2719 13.4999C24.2719 13.6499 24.2484 13.7905 24.2016 13.9218C24.1547 14.053 24.075 14.1749 23.9625 14.2874L17.6625 20.5874C17.4563 20.7937 17.1984 20.8968 16.8891 20.8968C16.5797 20.8968 16.3125 20.7937 16.0875 20.5874C15.8625 20.3624 15.75 20.0952 15.75 19.7858C15.75 19.4765 15.8625 19.2093 16.0875 18.9843L20.4469 14.6249Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.intro .story02 {
    margin: 300px 0 0 0;
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 1;
    flex-wrap: nowrap;
}
.intro .story02 .text {
    font-size: 50px;
    color: #1d1d1d;
}
.intro .story02 .text h3 {
    font-weight: 700;
    color: #ABC937;
    margin-left: 300px;
}
.intro .story02 .list ul {
    display: flex;
    gap: 24px;
}
.intro .story02 .list ul li {
    width: 260px;
    height: 260px;
    border-radius: 50px;
    text-align: center;
    position: relative;
    transition: all 0.3s ease;
}
.intro .story02 .list ul li:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.intro .story02 .list ul li.yellow {
    background-color: #FFCC05;
}
.intro .story02 .list ul li.green {
    background-color: #ABC937;
}
.intro .story02 .list ul li a {
    color: #fff;
    display: block;
    font-size: 22px;
    font-weight: 600;
    text-align: center;
    padding: 150px 0 40px; /* 아이콘+텍스트+플러스 정렬을 위한 여백 */
    position: relative;
    height: 100%;
    box-sizing: border-box;
    transition: all 0.3s ease;
}
.intro .story02 .list ul li a::before {
    content: "";
    position: absolute;
    top: 35px;
    left: 50%;
    transform: translateX(-50%);
    width: 100px;
    height: 100px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(../images/intro_work01.png);
}
.intro .story02 .list ul li.green a::before {
    background-image: url(../images/intro_work02.png);
}
.intro .story02 .list ul li a::after {
    content: "";
    position: absolute;
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2399' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='28' height='28'%3E%3Crect width='28' height='28' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2399)'%3E%3Cpath d='M13.9994 23.9173C13.7513 23.9173 13.5435 23.8334 13.3761 23.6656C13.2085 23.498 13.1247 23.2902 13.1247 23.0423V14.8757H4.95801C4.71009 14.8757 4.50233 14.7917 4.33472 14.6239C4.16691 14.4561 4.08301 14.2483 4.08301 14.0004C4.08301 13.7522 4.16691 13.5445 4.33472 13.3771C4.50233 13.2095 4.71009 13.1257 4.95801 13.1257H13.1247V4.95898C13.1247 4.71107 13.2086 4.5033 13.3764 4.33569C13.5442 4.16789 13.7521 4.08398 14 4.08398C14.2481 4.08398 14.4558 4.16789 14.6233 4.33569C14.7909 4.5033 14.8747 4.71107 14.8747 4.95898V13.1257H23.0413C23.2893 13.1257 23.497 13.2096 23.6646 13.3774C23.8324 13.5452 23.9163 13.753 23.9163 14.0009C23.9163 14.2491 23.8324 14.4568 23.6646 14.6242C23.497 14.7918 23.2893 14.8757 23.0413 14.8757H14.8747V23.0423C14.8747 23.2902 14.7908 23.498 14.623 23.6656C14.4552 23.8334 14.2473 23.9173 13.9994 23.9173Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.intro .story01 img {
    position: absolute;
    top: 6%;
    right: 22%;
}
.intro .story02 img {
    position: absolute;
    top: -54%;
    left: -13%;
} 
@media screen and (max-width:1330px) {
    .intro .story01 {
        justify-content: space-between;
    }
    .intro .story02 {
        margin: 240px 0 0 0;
        display: block;
    }
    .intro .story02 .text h3 {
        margin-left: 0;
        margin-bottom: 30px;
    }
    .intro .story02 .list ul {
        display: flex;
        justify-content: flex-end;
    }
    .intro .story01 img {
        right:38%;
    }
    .intro .story02 img {
        top: -29%;
        left: 0;
    } 
}
@media screen and (max-width:1024px) {
    .intro .story01 .text,
    .intro .story02 .text {
        font-size: 40px;
    }
    .intro .story01 .text h3 {
        margin-left: 250px;
    }
}
@media screen and (max-width:768px) {
    .intro {
        padding: 175px 0 180px 0;
    }
    .intro::before {
        top: -235px;
        background: url(../images/paper_green_m.png) no-repeat center bottom / auto;
    }
    .intro .story01 {
        display: flex;
        flex-direction: column;
    }
    .intro .story01 .text {
        font-size: 25px;
        text-align: end;
    }
    .intro .story01 .text h3 {
        margin: 0 0 24px 0;
    }
    .intro .story01 a {
        border-radius: 10px;
        padding: 10px 60px 8px 20px;
        margin-left: 0;
        margin-bottom: 0;
    }
    .intro .story01 a::after {
        top: 6px;
    }
    .intro .story02 {
        margin: 150px 0 0 0;
        display: block;
    }
    .intro .story02 .text {
        font-size: 25px;
    }
    .intro .story02 .list ul {
        flex-direction: column;
        margin: 40px 0 0 0;
    }
    .intro .story02 .list ul li {
        width: 100%;
        height: 180px;
        border-radius: 25px;
    }
    .intro .story02 .list ul li a {
        font-size: 20px;
        padding: 95px 0 40px; /* 아이콘+텍스트+플러스 정렬을 위한 여백 */
    }
    .intro .story02 .list ul li a::before {
        top: 23px;
        width: 60px;
        height: 60px;
    }
    .intro .story02 .list ul li a::after {
        bottom: 20px;
    }
    .intro .story01 img {
        top: 6%;
        right: 3%;
        width: 120px;
    }
    .intro .story02 img { 
        top: -15%;
        left: 0;
        width: 100px;
    } 
}
.culture {
    background: url(../images/culture_bg.png) no-repeat center center / cover;
    height: 1119px;
    position: relative;
}
.culture .wrapper {
    position: relative;
}
.culture::before {
    z-index: 1;
    content: "";
    position: absolute;
    top: -180px;
    left: 0;
    display: block;
    width: 100%;
    height: 200px;
    margin: 0 auto;
    background: url(../images/paper_pink.png) no-repeat center bottom / 100%;
}
.culture h2 {
    font-size: 50px;
    padding: 110px 0 39px 0;
    text-align: center;
    color: #1d1d1d;
}
.culture h2 span {
    font-weight: 700;
    color: #F26631;
}
.culture .tab_list ul {
    display: flex;
    justify-content: center;
    margin-bottom: 190px;
    gap: 20px;
    font-size: 22px;
    font-weight: 500;
}
.culture .tab_list ul li button {
    width: 180px;
    text-align: center;
}
.culture .tab_list ul .item1 button {
    background: #F26631;
    border-radius: 50px;
    padding: 17px 0 14px 0;
    color: #fff;
}
.culture .tab_list ul .item2 button {
    background: rgba(242, 102, 49, 0.3);
    border: 1px solid rgba(242, 102, 49, 0.3);
    border-radius: 50px;
    padding: 16px 0 13px 0;
    color: rgba(255, 255, 255, 0.6);
}
.culture .tab_list ul .item2 button:hover {
    transition: all 0.3s ease;
    border: 1px solid #F26631;
    color: #fff;
}
.culture .content .swiper {
    overflow: visible;
}
.culture .content .swiper-slide {
    width:  404px;
}
.culture .content .swiper-slide.swiper-slide-active {
    transform: translateY(-93px);
    transition: all 0.5s ease;
}
.culture .content .swiper-slide a {
    display: block;
}
.culture .content .swiper-slide a .photo {
    overflow: hidden;
    height: 520px;
    border-radius: 30px;
}
.culture .content .swiper-slide a .photo img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.culture .content .swiper-slide a h3 {
    margin: 40px 0 0 0;
    text-align: center;
    font-size: 20px;
    font-family: 'NanumSquareNeo';
}
.culture a {
    display: inline-block;
}
.culture .more {
    background: #fff;
    border-radius: 14px;
    width: 60px;
    height: 60px;
    position: absolute;
    top: 223px;
    right: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg width='35' height='35' viewBox='0 0 35 35' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_11992' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='35' height='35'%3E%3Crect x='0.81543' y='0.390137' width='34' height='34' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_11992)'%3E%3Cpath d='M17.8148 29.432C17.5135 29.432 17.2612 29.3301 17.0579 29.1263C16.8544 28.9228 16.7526 28.6705 16.7526 28.3695V18.4528H6.83594C6.5349 18.4528 6.28261 18.3509 6.07908 18.1472C5.87532 17.9434 5.77344 17.691 5.77344 17.3899C5.77344 17.0887 5.87532 16.8364 6.07908 16.6331C6.28261 16.4296 6.5349 16.3278 6.83594 16.3278H16.7526V6.41113C16.7526 6.11009 16.8545 5.85781 17.0583 5.65428C17.262 5.45051 17.5144 5.34863 17.8155 5.34863C18.1167 5.34863 18.369 5.45051 18.5723 5.65428C18.7758 5.85781 18.8776 6.11009 18.8776 6.41113V16.3278H28.7943C29.0953 16.3278 29.3476 16.4297 29.5511 16.6334C29.7549 16.8372 29.8568 17.0896 29.8568 17.3907C29.8568 17.6919 29.7549 17.9442 29.5511 18.1475C29.3476 18.351 29.0953 18.4528 28.7943 18.4528H18.8776V28.3695C18.8776 28.6705 18.7757 28.9228 18.572 29.1263C18.3682 29.3301 18.1158 29.432 17.8148 29.432Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.culture .more:hover {
    transition: 0.3s ease;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
@media screen and (max-width:1024px) {
    .culture h2 {
        font-size: 40px;
        padding: 110px 0 27px 0;
        text-align: center;
        color: #1d1d1d;
    }
    .culture .content .swiper-slide {
        width:  304px;
    }
    .culture .content .swiper-slide a .photo {
        height: 430px;
        border-radius: 20px;
    }
    .culture .content .swiper-slide a h3 {
        margin: 30px 0 0 0;
        font-size: 18px;
    }
    .culture .more {
        top: 195px;
    }
}
@media screen and (max-width:768px) {
        
    .culture {
        height: 555px;
    }
    .culture::before {
        top: -182px;
        background: url(../images/paper_pink_m.png) no-repeat center bottom / auto;
    }
    .culture h2 {
        font-size: 25px;
        padding: 63px 0 21px 0;
    }
    .culture .tab_list ul {
        margin-bottom: 60px;
        gap: 10px;
        font-size: 17px;
    }
    .culture .tab_list ul li button {
        width: 100px;
    }
    .culture .tab_list ul .item1 button {
        padding: 10px 0 8px 0;
    }
    .culture .tab_list ul .item2 button {
        padding: 10px 0 6px 0;
    }
    .culture .content .swiper-slide {
        width:  208px;
    }
    .culture .content .swiper-slide.swiper-slide-active {
        transform: none;
    }
    .culture .content .swiper-slide a .photo {
        height: 261px;
        border-radius: 15px;
    }
    .culture .content .swiper-slide a h3 {
        margin: 13px 0  0;
        font-size: 16px;
    }
    .culture .more {
        display: none;
    }
}
.write {
    background: url(../images/write_bg.png) no-repeat center bottom / cover;
    
    position: relative;
}
@media screen and (max-width:1920px) {
    .write .shape {
        width: 75%;
        top: 2%;
        left: -8%;
    }
}
@media screen and (min-width:1921px) {
    .write .shape {
        width: 50%;
        top: 10%;
        left: 6%;
    }
}
.write .tit {
    padding: 330px 0 0 0;
    font-size: 50px;
    color: #1d1d1d;
}
.write .tit h3 {
    font-weight: 700;
    margin:0 0 10px 300px;
}
.write .tit h3 span {
    color: #F26631;
}   
.write .btn_wrap button {
    background-color: #fff;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    background-repeat: no-repeat;
    background-position: center center;
}
.write .btn_wrap {
    margin-bottom: 31px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
.write .btn_wrap .btn_prev {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2214' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='25' height='25'%3E%3Crect width='24' height='24' transform='matrix(-1 0 0 1 24.4873 0.390137)' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2214)'%3E%3Cpath d='M10.0122 12.3901L17.3622 5.04014C17.6122 4.79014 17.733 4.4943 17.7247 4.15264C17.7164 3.81097 17.5872 3.51514 17.3372 3.26514C17.0872 3.01514 16.7914 2.89014 16.4497 2.89014C16.108 2.89014 15.8122 3.01514 15.5622 3.26514L7.88719 10.9651C7.68719 11.1651 7.53719 11.3901 7.43719 11.6401C7.33719 11.8901 7.28719 12.1401 7.28719 12.3901C7.28719 12.6401 7.33719 12.8901 7.43719 13.1401C7.53719 13.3901 7.68719 13.6151 7.88719 13.8151L15.5872 21.5151C15.8372 21.7651 16.1289 21.886 16.4622 21.8776C16.7955 21.8693 17.0872 21.7401 17.3372 21.4901C17.5872 21.2401 17.7122 20.9443 17.7122 20.6026C17.7122 20.261 17.5872 19.9651 17.3372 19.7151L10.0122 12.3901Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.write .btn_wrap .btn_next {
    background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2211' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='25' height='25'%3E%3Crect x='0.487305' y='0.390137' width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2211)'%3E%3Cpath d='M14.9624 12.3901L7.61241 5.04014C7.36241 4.79014 7.24158 4.4943 7.24991 4.15264C7.25825 3.81097 7.38741 3.51514 7.63741 3.26514C7.88741 3.01514 8.18325 2.89014 8.52491 2.89014C8.86658 2.89014 9.16242 3.01514 9.41242 3.26514L17.0874 10.9651C17.2874 11.1651 17.4374 11.3901 17.5374 11.6401C17.6374 11.8901 17.6874 12.1401 17.6874 12.3901C17.6874 12.6401 17.6374 12.8901 17.5374 13.1401C17.4374 13.3901 17.2874 13.6151 17.0874 13.8151L9.38741 21.5151C9.13741 21.7651 8.84575 21.886 8.51241 21.8776C8.17908 21.8693 7.88741 21.7401 7.63741 21.4901C7.38741 21.2401 7.26241 20.9443 7.26241 20.6026C7.26241 20.261 7.38741 19.9651 7.63741 19.7151L14.9624 12.3901Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.write .btn_wrap a {
    display: inline-block;
}
.write .btn_wrap .btn_prev:hover,
.write .btn_wrap .btn_next:hover,
.write .btn_wrap .more:hover {
    transition: 0.3s ease;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.write .btn_wrap .more {
    margin-left: 10px;
    background-color: #fff;
    border-radius: 14px;
    width: 60px;
    height: 60px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg width='35' height='35' viewBox='0 0 35 35' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_95_2217' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='35' height='35'%3E%3Crect x='0.81543' y='0.390137' width='34' height='34' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_95_2217)'%3E%3Cpath d='M17.8152 29.432C17.514 29.432 17.2617 29.3301 17.0584 29.1263C16.8549 28.9228 16.7531 28.6705 16.7531 28.3695V18.4528H6.83643C6.53538 18.4528 6.2831 18.3509 6.07957 18.1472C5.87581 17.9434 5.77393 17.691 5.77393 17.3899C5.77393 17.0887 5.87581 16.8364 6.07957 16.6331C6.2831 16.4296 6.53538 16.3278 6.83643 16.3278H16.7531V6.41113C16.7531 6.11009 16.855 5.85781 17.0587 5.65428C17.2625 5.45051 17.5149 5.34863 17.8159 5.34863C18.1172 5.34863 18.3695 5.45051 18.5728 5.65428C18.7763 5.85781 18.8781 6.11009 18.8781 6.41113V16.3278H28.7948C29.0958 16.3278 29.3481 16.4297 29.5516 16.6334C29.7554 16.8372 29.8573 17.0896 29.8573 17.3907C29.8573 17.6919 29.7554 17.9442 29.5516 18.1475C29.3481 18.351 29.0958 18.4528 28.7948 18.4528H18.8781V28.3695C18.8781 28.6705 18.7762 28.9228 18.5724 29.1263C18.3687 29.3301 18.1163 29.432 17.8152 29.432Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.write .txt {
    margin-left: 245px;
    position: relative;
}
.write .txt .swiper ul li p {
    font-size: 18px;
    font-weight: 700;
    padding: 34px 53px;
    background-color: #fff;
    border-radius: 40px;
    margin-bottom: 32px;
    font-family: 'NanumSquareNeo';
}
.write .txt .swiper ul li span {
    display: block;
    text-align: end;
    font-weight: 400;
    color: #888;
    margin-bottom: 300px;
}
.write img {
    position: absolute;
    bottom: 26.3%;
    left: 12%;
}
.write .txt .swiper .swiper-slide {
    opacity: 0 !important;
}
.write .txt .swiper .swiper-slide.swiper-slide-active {
    opacity: 1 !important;
}
@media screen and (max-width:1840px) {
    .write img {
        bottom: 32.4%;
        left: 9%;
        width: 250px;
    }
}
@media screen and (max-width:1560px) {
    .write img {
        bottom: 33.3%;
        left: 5%;
        width: 220px;
    }
}
@media screen and (max-width:1360px) {
    .write img {
        bottom: 34.4%;
        left: 3%;
        width: 210px;
    }
}
@media screen and (max-width:1024px) {
    .write .tit {
        padding: 150px 0 0 0;
        font-size: 40px;
    }
    .write img {
        bottom: 45.4%;
        width: 200px;
    }
    .write .txt .swiper ul li p {
        font-size: 16px;
        padding: 16px 21px;
        border-radius: 15px;
        margin-bottom: 13px;
    }
}
@media screen and (max-width:768px) {
    .write {
        background: url(../images/write_bg.png) no-repeat center center / cover;
        height: 429px;
        position: relative;
    }
    .write .tit {
        padding: 80px 0 0 0;
        font-size: 25px;
    }
    .write .tit h3 {
        font-weight: 700;
        margin:0 0 10px 0;
    }
    .write .btn_wrap button {
        width: 30px;
        height: 30px;
    }
    .write .btn_wrap {
        gap: 5px;
        margin-bottom: 15px;
    }
    .write .btn_wrap .btn_prev {
        background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_8380' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='18' height='18'%3E%3Crect width='18' height='18' transform='matrix(-1 0 0 1 18 0)' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_8380)'%3E%3Cpath d='M7.14403 9L12.6565 3.4875C12.844 3.3 12.9347 3.07812 12.9284 2.82188C12.9222 2.56563 12.8253 2.34375 12.6378 2.15625C12.4503 1.96875 12.2284 1.875 11.9722 1.875C11.7159 1.875 11.494 1.96875 11.3065 2.15625L5.55028 7.93125C5.40028 8.08125 5.28778 8.25 5.21278 8.4375C5.13778 8.625 5.10028 8.8125 5.10028 9C5.10028 9.1875 5.13778 9.375 5.21278 9.5625C5.28778 9.75 5.40028 9.91875 5.55028 10.0688L11.3253 15.8438C11.5128 16.0312 11.7315 16.1219 11.9815 16.1156C12.2315 16.1094 12.4503 16.0125 12.6378 15.825C12.8253 15.6375 12.919 15.4156 12.919 15.1594C12.919 14.9031 12.8253 14.6813 12.6378 14.4938L7.14403 9Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
    }
    .write .btn_wrap .btn_next {
        background-image: url("data:image/svg+xml,%3Csvg width='19' height='18' viewBox='0 0 19 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_8385' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='19' height='18'%3E%3Crect x='0.664062' width='18' height='18' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_8385)'%3E%3Cpath d='M11.52 9L6.00753 3.4875C5.82003 3.3 5.7294 3.07812 5.73565 2.82188C5.7419 2.56563 5.83878 2.34375 6.02628 2.15625C6.21378 1.96875 6.43565 1.875 6.6919 1.875C6.94815 1.875 7.17003 1.96875 7.35753 2.15625L13.1138 7.93125C13.2638 8.08125 13.3763 8.25 13.4513 8.4375C13.5263 8.625 13.5638 8.8125 13.5638 9C13.5638 9.1875 13.5263 9.375 13.4513 9.5625C13.3763 9.75 13.2638 9.91875 13.1138 10.0688L7.33878 15.8438C7.15128 16.0312 6.93253 16.1219 6.68253 16.1156C6.43253 16.1094 6.21378 16.0125 6.02628 15.825C5.83878 15.6375 5.74503 15.4156 5.74503 15.1594C5.74503 14.9031 5.83878 14.6813 6.02628 14.4938L11.52 9Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
    }
    .write .btn_wrap .more {
        border-radius: 8px;
        width: 30px;
        height: 30px;
        background-image: url("data:image/svg+xml,%3Csvg width='21' height='20' viewBox='0 0 21 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_132_8389' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='21' height='20'%3E%3Crect x='0.328125' width='20' height='20' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_132_8389)'%3E%3Cpath d='M10.3273 17.0837C10.15 17.0837 10.0016 17.0237 9.88206 16.9039C9.76234 16.7841 9.70247 16.6357 9.70247 16.4587V10.6253H3.86914C3.69206 10.6253 3.54365 10.5654 3.42393 10.4455C3.30407 10.3257 3.24414 10.1772 3.24414 10.0001C3.24414 9.8229 3.30407 9.67449 3.42393 9.55491C3.54365 9.43519 3.69206 9.37533 3.86914 9.37533H9.70247V3.54199C9.70247 3.36491 9.7624 3.21651 9.88227 3.09678C10.0021 2.97692 10.1506 2.91699 10.3277 2.91699C10.5049 2.91699 10.6533 2.97692 10.7729 3.09678C10.8926 3.21651 10.9525 3.36491 10.9525 3.54199V9.37533H16.7858C16.9629 9.37533 17.1113 9.43526 17.231 9.55512C17.3509 9.67498 17.4108 9.82345 17.4108 10.0005C17.4108 10.1778 17.3509 10.3262 17.231 10.4457C17.1113 10.5655 16.9629 10.6253 16.7858 10.6253H10.9525V16.4587C10.9525 16.6357 10.8925 16.7841 10.7727 16.9039C10.6528 17.0237 10.5043 17.0837 10.3273 17.0837Z' fill='%23F26631'/%3E%3C/g%3E%3C/svg%3E%0A");
    }
    .write .txt {
        margin-left: 0;
        position: relative;
    }
    .write .txt .swiper ul li p {
        font-size: 14px;
        padding: 16px 21px;
        border-radius: 15px;
        margin-bottom: 13px;
    }
    .write .txt .swiper ul li span {
        font-size: 14px;
    }
    .write img {
        display: none;
    }
}
.play {
    background: url(../images/play_bg.png) no-repeat center top / 100% 100%;
    height: 1223px;
    text-align: center;
    position: relative
}
.play .tit {
    color: #fff;
    padding: 500px 0 71px 0;
}
.play .tit span {
    font-weight: 700;
    color: #FFE342;
}
.play .tit h2 {
    font-size: 50px;
}
.play .list ul {
    display: flex;
    justify-content: center;
    gap: 24px;
    margin: 0 20px;
}
.play .list ul li {
    width: 511px;
}
.play .list ul li a {
    /* 기존 스타일 유지 + 필요한 부분만 수정 */
    display: block;
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    background-color: #fff;
    border-radius: 30px;
    width: 100%;
    padding: 198px 0 64px 0;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    position: relative; /* 아이콘 정렬용 */
    
    transition: all 0.3s ease;
}
.play .list ul li a:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 20px rgba(0, 0, 0, 0.4);
}

.play .list ul .museum a::before,
.play .list ul .study a::before {
    content: "";
    position: absolute;
    top: 57px;
    left: 50%; /* 중앙 정렬 */
    transform: translateX(-50%); /* 정확히 중앙 정렬 */
    width: 151px;
    height: 112px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.play .list ul .museum a::before {
    background: url(../images/museum.png) no-repeat center center / contain;
}
.play .list ul .study a::before {
    background: url(../images/study.png) no-repeat center center / contain;
}
.play img {
    position: absolute;
}
.play .pic01 {
    bottom: 48%;
    left: 4%;
    width: 6%;
}
.play .pic02 {
    bottom: 50%;
    right: 3%;
    width: 7%;
}
.play .pic03 {
    bottom: 4%;
    left: 26%;
    width: 5.5%;
}
.play .pic04 {
    bottom: 0;
    left: 6%;
    width: 19%;
}
.play .pic05 {
    bottom: 0;
    right: 30%;
    width: 11.5%;
}
.play .pic06 {
    bottom: 6%;
    right: 4%;
    width: 19%;
}
.play .pic {
    bottom: 39%;
    right: 8%;
    width: 23%;
}
.play .star01,
.play .star02,
.play .star03,
.play .star04,
.play .star05,
.play .star06,
.play .star07,
.play .star08,
.play .star09 {
    animation-name: big;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}
.play .star01 {
    bottom: 55%;
    left: 2%;
    width: 2%;
}
.play .star02 {
    bottom: 66%;
    left: 12%;
    width: 6%;
}
.play .star03 {
    bottom: 35%;
    left: 7%;
    width: 4.2%;
}
.play .star04 {
    bottom: 49%;
    left: 17%;
    width: 2.6%;
}
.play .star05 {
    bottom: 60%;
    left: 30%;
    width: 3.4%;
}
.play .star06 {
    bottom: 48%;
    left: 71%;
    width: 1.9%;
}
.play .star07 {
    bottom: 64%;
    left: 61%;
    width: 4.3%;
}
.play .star08 {
    bottom: 31%;
    right: 8%;
    width: 3%;
}
.play .star09 {
    bottom: 60%;
    right: 4%;
    width: 4%;

}

@keyframes big { /* 애니메이션을 효과를 미리 설정함 */
	0% { transform: scale3d(1, 1, 1);  }  /* 애니메이션을 시작할때의 속성 */
	50% { transform: scale3d(1.3, 1.3, 1); } /* 중간값은 %를 조절하여 추가/삭제 가능 */
	100% { transform: scale3d(1, 1, 1); } /* 애니메이션이 종료될때의 속성 */
}

@media screen and (max-width:1400px) {
    .play .pic01,
    .play .pic02,
    .play .star03,
    .play .star08 {
        display: none;
    }
}
@media screen and (max-width:1024px) {
    .play .tit h2 {
        font-size: 40px;
    }
}
@media screen and (max-width:768px) {
            
        .play {
            height: 604px;
        }
        .play .tit {
            padding: 195px 0 23px 0;
        }
        .play .tit h2 {
            font-size: 25px;
        }
        .play .list ul {
            display: flex;
            justify-content: center;
            gap: 16px;
        }
        .play .list ul li {
            width: 100%;
        }
        .play .list ul li a {
            font-size: 15px;
            border-radius: 15px;
            padding: 85px 0 30px 0;
        }
        .play .list ul .museum a::before,
        .play .list ul .study a::before {
            top: 30px;
            width: 60px;
            height: 45px;
        }
        .play .pic01,
        .play .pic02 {
            display: none;
        }
        .play .pic03 {
            bottom: 2%;
            left: 28%;
            width: 5%;
        }
        .play .pic04 {
            width: 24%;
        }
        .play .pic05 {
            bottom: 3%;
            right: 28%;
            width: 13.4%;
        }
        .play .pic {
            bottom: 50%;
            right: 4%;
            width: 30%;
        }
        .play .star01 {
            bottom: 18%;
            left: 4%;
            width: 4%;
        }
        .play .star02 {
            bottom: 23%;
            left: 17%;
        }
        .play .star04 {
            bottom: 15%;
            left: 28%;
            width: 3%;
        }
        .play .star05 {
            bottom: 20%;
            left: 38%;
            width: 7.4%;
        }
        .play .star06 {
            display: none;
        }
        .play .star07 {
            bottom: 25%;
        }
        .play .star08 {
            display: block;
            bottom: 17%;
            right: 19%;
        }
        .play .star09 {
            bottom: 22%;
        }

}

/************************ svg 선 그리기 *************************/
.line path {
    stroke: #009B93; /* 선색 */
    stroke-width: 35px; /* 선두께 */
    stroke-linecap: round; /* 모서리 처리 - round:둥글게, butt:네모나게, square:네모나게 연장 */
    stroke-dasharray: 4000; /* 선의 총길이 인데 애니메이션을 주기 전에 어느정도인지 값을 줘봐야함 */
    stroke-dashoffset: 0; /* 무조건 0 */
    fill: none;
}
.line-wrap {
    width: 100%;
    height: auto;
    overflow: visible;

    display: block;
    width: 100%;
    height: 1700px;
    position: absolute;
    top: 625px;
    z-index: 0;
}
.line {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
@media screen and (max-width:1330px) {
    .line-wrap {
        display: none;
    }
}

footer {
    background-color: #1d1d1d;
    color: #fff;
    font-family: "NanumSquareNeo";
    padding: 82px 0 0 0;
}
footer .wrapper {
    display: flex;
    gap: 87px;
}
footer .group {
    margin: 12px 0 80px 0;
}
footer .f_nav ul {
    display: flex;
    gap: 35px;
}
footer .f_nav ul li:hover {
    font-weight: 700;
    text-decoration: underline;
}
footer .f_nav ul .line {
    position: relative;
}
footer .f_nav ul .line::before {
    content: "";
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.3);
    height: 13px;
    left: -16px;
    top: 4px;
}
footer .f_info {
    display: flex;
    gap: 35px;
    margin: 44px 0 20px 0;
    color: rgba(255, 255, 255, 0.8);
    flex-wrap: wrap;
}
footer .f_info address {
    position: relative;
}
footer .f_info address::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.3);
    height: 13px;
    right: -18px;
    top: 4px;
}
footer .copyright {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.6);
}
@media screen and (max-width:1024px) {
    footer {
        padding: 55px 0 0 0;
    }
    footer .wrapper {
        display: block;
    }
    footer .group {
        padding: 25px 0 61px 0;
        margin: 0;
    }
    footer .f_nav ul {
        display: flex;
        gap: 2px 25px;  
    }
    footer .f_nav ul .line::before {
        left: -13px;
    }
    footer .f_info {
        gap: 2px 25px;
        margin: 44px 0 30px 0;
    }
    footer .f_info address::after {
        right: -12px;
    }
    footer .copyright {
        font-size: 15px;
    }
}