@charset "utf-8";

body::-webkit-scrollbar { display: none; }
/*───────────────────────────────────────────────────────────

	sub common

───────────────────────────────────────────────────────────*/
    #container:has(.full_sec) { max-width: 100%; width: 100%;}
    #container:has(.pbn){padding-bottom:0;}
    #container:has(.sub_about){padding-top:0;}

    .sub_visual { height:clamp(400px, 98vw, 980px); position: relative; background-image: url('../images/skin/sv_company.jpg');background-size:cover;background-position: center;background-repeat: no-repeat;}
    .sub_visual .sv_title { text-align: center; width: 100%; height: 100%; display: flex; align-items:flex-end; color: var(--point-white);box-sizing: border-box;}
    .sub_visual .sv_title .w_custom{display: flex;flex-direction: column;gap:var(--row-gap20);text-align: left;box-sizing:border-box;padding-bottom:var(--row-gap140);}
    .sub_visual .sv_title h2 { font-size:var(--text-24);font-weight:600;line-height:1.4;letter-spacing:0;}
    .sub_visual .sv_title p {font-size:var(--text-84);font-weight:800;letter-spacing: 0;line-height:1.4;}
    #wrap .sub_visual .page_title{font-size:var(--text-84);font-weight:800;letter-spacing: 0;line-height:1.4;text-transform:capitalize;}

    body:has(.sub_construction) .sub_visual { background-image: url('../images/skin/sv_construction.jpg'); }
    body:has(.sub_gis) .sub_visual { background-image: url('../images/skin/sv_gis.jpg'); }
    body:has(.sub_ict) .sub_visual { background-image: url('../images/skin/sv_ict.jpg'); }

    @media (max-width: 375px){
        .sub_visual .sv_title .w_custom{padding-bottom:20px;}
    }

    /*title*/
    .sub_page_title{font-size:var(--text-54);color:var(--black-color01);font-weight:800;line-height:1.4;text-align: center;}
    .sub_page_title span{font-weight:600;}
    .sub_content_title_box{margin-bottom:40px;display: grid;gap:var(--col-gap20);}
    .sub_content_title{font-size:var(--text-36);color:var(--black-color03);font-weight:600;line-height:1.2;letter-spacing:-0.03em;display: flex;gap:20px;align-items: flex-start;}
    .sub_content_title:before{width:8px;content:"";aspect-ratio: auto 1;background:var(--point-color01);translate:0 14px;}

        @media (max-width:1023px) {
            .sub_content_title_box{margin-bottom:clamp(20px, 3vw, 30px);}
            .sub_content_title{gap:clamp(10px, 1.5vw, 20px);}
            .sub_content_title:before{translate:0 clamp(5px, 1.2vw, 14px);}
        }
        @media (max-width:640px) {
            .sub_content_title:before{width:4px;translate:0 10px;}
        }

    /*bullet*/
    .bullet_list{position: relative;display: flex;flex-direction: column;gap:6px;}
    .bullet_list > li{display: flex;align-items: baseline;gap:8px;font-size:var(--text-18);font-weight: 400;color: var(--black-color03);line-height: 1.6;font-family:var(--font-type02);}
    .bullet_list > li::before{display: inline-flex;content:'';width: 4px;aspect-ratio: auto 1;background: var(--point-color01);flex-shrink: 0;translate: 0 -5px;}

    @media (max-width:1023px) {
        .bullet_list > li{gap: clamp(6px, 0.8vw, 8px);}
        .bullet_list > li::before{translate:0 -3px;}
    }
    @media (max-width:640px) {
        .bullet_list > li::before{width:3px;translate: 0 -4px;}
    }

/*───────────────────────────────────────────────────────────

	about

───────────────────────────────────────────────────────────*/
    .sub_about .about_intro{box-sizing:border-box;padding-block:var(--row-gap140);background:url('../images/skin/sub_about_bg.png')no-repeat center / cover;}
    .about_intro .w_custom{display: flex;flex-direction: column;gap:var(--row-gap80);align-items: flex-start;}
    .about_intro .intro_title{display: flex;flex-direction: column;gap:var(--row-gap30);}
    .about_intro .intro_title span{font-size:var(--text-24);color:var(--point-color06);font-weight:700;}
    .about_intro .intro_title h3{font-size:var(--text-72);color:var(--black-color01);font-weight:400;line-height:1.4;letter-spacing:-0.04em;}
        .about_intro .intro_title h3 strong{font-weight:600;}
        .about_intro .intro_title p{font-size:var(--text-24);color:var(--black-color03);font-weight:400;line-height:1.6;font-family:var(--font-type02);}
    .about_intro .value_list{align-self: flex-end;box-sizing:border-box;width:800px;padding:clamp(15px, 3vw, 30px) clamp(20px, 4vw, 60px);background:var(--point-color06);}
    .about_intro .value_list li{box-sizing:border-box;padding-block:var(--row-gap30);}
        .about_intro .value_list li + li{border-top:1px solid var(--point-white);}
    .about_intro .value_list li dl{position: relative;box-sizing:border-box;padding-left:clamp(14px, 2.6vw, 26px);display: flex;align-items: center;justify-content: space-between;}
        .about_intro .value_list li dl:before{width:clamp(4px, 0.6vw, 6px);aspect-ratio:auto 1;content:"";background:var(--point-white);position: absolute;left:0;top:clamp(9px, 1.3vw, 13px);}
    .about_intro .value_list li dl dt{display: flex;align-items: center;gap:var(--row-gap20);font-size:var(--text-22);color:var(--point-white);font-weight:300;line-height:1.2;flex-shrink:0;}
        .about_intro .value_list li dl dt strong{font-size:var(--text-28);font-weight:500;}
    .about_intro .value_list li dl dd{font-size:var(--text-20);color:var(--point-white);font-weight:300;line-height:1.6;font-family:var(--font-type02);}

    .about_business .business_list{display: grid;grid-template-columns:var(--grid-array03);gap:var(--row-gap50);}
    .about_business .business_list li{position: relative;}
    .about_business .business_list li .thumb{width:100%;aspect-ratio:auto 0.735;}
    .about_business .business_list li .thumb img{width:100%;height:100%;object-fit:cover;}
    .about_business .business_list li .txt{width:100%;height:100%;position: absolute;top:0;left:0;display: flex;align-items: center;justify-content: center;flex-direction: column;gap:12px;text-align: center;}
    .about_business .business_list li .txt dt{font-size:var(--text-52);color:var(--point-white);font-weight:800;line-height:1.4;}
    .about_business .business_list li .txt dd{font-size:var(--text-22);color:var(--point-white);font-weight:400;line-height:1.6;}


    @media (max-width:1023px) {
        .about_intro .value_list{width:100%;}
    }
    @media (max-width:640px) {
        .about_business .business_list{grid-template-columns:repeat(1, 1fr);}
        .about_business .business_list li .thumb{aspect-ratio:auto 1.8;}
        .about_intro .value_list li dl{flex-direction: column;align-items: flex-start;}
    }
    

/*───────────────────────────────────────────────────────────

	연혁

───────────────────────────────────────────────────────────*/    
    .sub_history .list_box{position: relative;}
    .sub_history .list_box .line{position: absolute;top:clamp(30px, 3.5vw, 38px);width:1px;height:100%;background:var(--border-color01);left:50%;translate:-0.5px;}
    .sub_history .list_box .line em{width:100%;background:var(--point-color02);position: absolute;top:0;left:0;}
    .sub_history .history_list > li{display: flex;align-items: flex-start;}
    .sub_history .history_list > li > div{width:50%;box-sizing:border-box;}
    .sub_history .history_list .img_box{padding-right:clamp(30px, 9vw, 100px);}
    .sub_history .history_list .img{width:100%;aspect-ratio:auto 1.59;}
        .sub_history .history_list .img img{width:100%;height:100%;object-fit:cover;}
    .sub_history .history_list .txt_box{padding-left:clamp(30px, 9vw, 100px);display: flex;flex-direction:column;gap:var(--col-gap20);}
        .sub_history .history_list .txt_box:before{width:9px;aspect-ratio:auto 1;content:"";box-sizing:border-box;border-radius:100%;background:var(--black-color08);box-shadow:0 0 0 7px var(--border-color01);position: absolute;left:-4.5px;top:clamp(20px, 3vw, 33px);}
        .sub_history .history_list li.on .txt_box:before{background:var(--point-color02);}
        .sub_history .history_list .txt_box h3{font-size:var(--text-58);color:var(--black-color02);font-weight:700;line-height:1.2;}
        .sub_history .history_list li.on .txt_box h3{color:var(--point-color02);}
    .sub_history .history_list .list{display: flex;flex-direction: column;gap:12px;}
        .sub_history .history_list .list li{font-size:var(--text-18);color:var(--black-color05);font-weight:400;line-height:1.4;font-family:var(--font-type02);}

    /*even*/
        .sub_history .history_list > li:nth-child(even){flex-direction: row-reverse;}
        .sub_history .history_list > li:nth-child(even) .img_box{padding:0 0 0 clamp(30px, 9vw, 100px);}
        .sub_history .history_list > li:nth-child(even) .txt_box{padding:0 clamp(30px, 9vw, 100px) 0 0;text-align: right;}
        .sub_history .history_list > li:nth-child(even) .txt_box:before{left:auto;right:-4.5px;}

    @media (max-width:640px) {
        .sub_history .list_box .line{left:5px;translate:0;}
        #wrap .sub_history .history_list > li{flex-direction: column-reverse;align-items: flex-start;gap:33px;}
        .sub_history .history_list > li > div{width:100%;}
        #wrap .sub_history .history_list .img_box,
        #wrap .sub_history .history_list .txt_box{padding:0 0 0 30px;}
        #wrap .sub_history .history_list .txt_box:before{width:6px;box-shadow:0 0 0 5px var(--border-color01);left:3px;right:auto;}
        .sub_history .history_list > li:nth-child(even) .txt_box{text-align:left;}
        .sub_history .history_list .list{gap:8px;}
    }

/*───────────────────────────────────────────────────────────

	location

───────────────────────────────────────────────────────────*/    
    .location_tab{display: flex;flex-wrap:wrap;}
    .location_tab li{width:25%;box-sizing:border-box;border-bottom:1px solid var(--border-color01);}
    .location_tab li a{box-sizing:border-box;display:flex;align-items: center;justify-content: center;width:100%;padding-bottom:var(--row-gap20);position: relative;font-size:var(--text-22);color:var(--black-color08);font-weight:400;text-align: center;height:100%;}
        .location_tab li a:before{width:0;height:2px;content:"";background:var(--point-color06);position: absolute;bottom:-1px;left:50%;translate:-50%;transition:width 0.3s;}
    .location_tab li.on a{color:var(--point-color06);font-weight:700;}
        .location_tab li.on a:before{width:100%;}

    .location_cont{margin-top:var(--row-gap60);}
    .location_item{height:0;opacity:0;pointer-events:none;}
        .location_item.on{height:auto;opacity:1;pointer-events:initial;}
    .location_item .map_box{position: relative;width:100%;aspect-ratio:auto 2.67;}
        .location_item .map_box iframe{width:100%;height:100%;position: absolute;top:0;left:0;}
    .location_item .info_box{box-sizing:border-box;padding:0 var(--row-gap80);display: flex;align-items: flex-start;gap:var(--row-gap80);}
    .location_item .info_title{translate:0 -80px;min-width:440px;box-sizing:border-box;padding:var(--row-gap40);background:var(--point-color06);height:240px;display: flex;flex-direction: column;align-items: flex-start;justify-content: space-between;}
        .location_item .info_title span{font-size:var(--text-18);color:var(--point-white);font-weight:700;opacity:0.5;}
        .location_item .info_title h3{font-size:var(--text-36);color:var(--point-white);font-weight:700;line-height:1.4;}
    .location_item .info_list{display: grid;gap:var(--col-gap30);margin-top:var(--row-gap60);}
    .location_item .info_list dl{display: flex;align-items: baseline;}
    .location_item .info_list dl dt{display: flex;align-items: center;gap:var(--row-gap20);width:216px;flex-shrink:0;}
        .location_item .info_list dl dt span{display: inline-flex;align-items: center;justify-content: center;width:clamp(26px, 3.6vw, 36px);aspect-ratio:auto 1;border-radius:100%;background:var(--gray-bg01);}
        .location_item .info_list dl dt p{font-size:var(--text-20);color:var(--black-color03);font-weight:700;}
    .location_item .info_list dl dd{font-size:var(--text-20);color:var(--black-color05);font-weight:400;translate:0 -2px;}

    .sub_contact_box{box-sizing:border-box;background:var(--gray-bg01);padding-block:var(--row-gap140);}

    @media (max-width:1200px) {
        .location_item .info_title{min-width:initial;height:auto;gap:50px;}
    }
    @media (max-width:1023px) {
        .location_item .info_box{padding-inline:clamp(20px, 3vw, 30px)}
        .location_item .info_title{translate:0 clamp(-50px, -5vw, -30px);}
        .location_item .map_box{aspect-ratio:auto 1.6;}
        .location_item .info_list dl dt{width:clamp(120px, 17vw, 170px);}
        .location_item .info_list dl dt span img{max-width:43%;}
    }
    @media (max-width:640px) {
        .location_item .info_box{flex-direction: column;padding:0;gap:30px;}
        .location_item .info_title{translate:0;width:100%;gap:25px;}
        .location_item .info_list{margin-top:0;}
    }
    @media (max-width:479px) {
        .location_tab{gap:20px 0;}
        .location_tab li{width:50%;}
        .location_item .info_list dl dt{width:120px;}
    }

/*───────────────────────────────────────────────────────────

	business

───────────────────────────────────────────────────────────*/    
    .sub_business .business_visual{display: flex;align-items: center;justify-content: space-between;}
    .sub_business .business_visual .img{width: 55.2%;aspect-ratio: auto 1.394;}
        .sub_business .business_visual .img img{width:100%;height:100%;object-fit:cover;}
    .sub_business .business_visual .txt{display: flex;flex-direction: column;gap:var(--row-gap40);background:var(--point-color06);margin-left:-200px;width:55%;min-height:600px;box-sizing:border-box;padding:30px 100px;justify-content: center;}
        .sub_business .business_visual .txt h3{font-size:var(--text-54);color:var(--point-white);font-weight:700;line-height:1.4;letter-spacing:-0.04em;}
        .sub_business .business_visual .txt p{font-size:var(--text-22);color:var(--point-white);font-weight:300;line-height:1.6;font-family:var(--font-type02);}
        .sub_business .business_visual .txt p + p{margin-top:var(--row-gap30);}
    
    @media (max-width:1700px) {
        .sub_business .business_visual .txt{padding:30px 50px;}
    }
    @media (max-width:1023px) {
        .sub_business .business_visual{flex-direction:column;align-items: flex-start;}
        .sub_business .business_visual .img{width:100%;}
        .sub_business .business_visual .txt{width:100%;margin:0;height:auto;padding:clamp(30px, 5vw, 50px) clamp(15px, 3vw, 30px);min-height:initial;}

    }

    /*construction*/
    .const_work .work_list{display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: minmax(300px, auto); gap:var(--row-gap20);}
    .const_work .work_list > li{position: relative;}
        .const_work .work_list > li:nth-child(1){grid-column: 1 / 3; grid-row: 1 / 3;}
        .const_work .work_list > li:nth-child(2) { grid-column: 3 / 5; grid-row: 1 / 2; }
        .const_work .work_list > li:nth-child(3) { grid-column: 3 / 4; grid-row: 2 / 3; }
        .const_work .work_list > li:nth-child(4) { grid-column: 4 / 5; grid-row: 2 / 4; }
        .const_work .work_list > li:nth-child(5) { grid-column: 1 / 3; grid-row: 3 / 4; }
        .const_work .work_list > li:nth-child(6) { grid-column: 3 / 4; grid-row: 3 / 4; }
    .const_work .work_list > li .img{width:100%;height:100%;position: relative;overflow:hidden;}
        .const_work .work_list > li .img:before{width:100%;height:clamp(15%, 12vw, 120px);content:"";background:linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);opacity:0.6;position: absolute;bottom:0;left:0;z-index:2;}
        .const_work .work_list > li .img img{width:100%;height:100%;object-fit:cover;transition:all 0.3s;;}
    .const_work .work_list > li p{font-size:var(--text-22);color:var(--point-white);font-weight:600;line-height:1.4;position: absolute;bottom:clamp(15px, 3vw, 30px);left:clamp(15px, 3vw, 30px);z-index:3;text-wrap:balance;}

    /* over */
    @media (hover:hover) and (pointer:fine) {
        .const_work .work_list > li:hover .img img{scale:1.05;}
    }

    @media (max-width:767px) {
        .const_work .work_list{display: flex;flex-wrap:wrap;}
        .const_work .work_list > li:nth-child(1),
        .const_work .work_list > li:nth-child(2),
        .const_work .work_list > li:nth-child(5),
        .const_work .work_list > li:nth-child(6){width:calc(50% - var(--row-gap20) / 2);}
        .const_work .work_list > li:nth-child(3) .img{aspect-ratio:auto 2;}
        .const_work .work_list > li:nth-child(4) .img{aspect-ratio:auto 1.5;}
    }

    /*slide*/
    .business_slide .thumb_swiper{width:100%;}
    .business_slide .thumb_swiper .swiper-slide{pointer-events: none;z-index: 2;opacity:1 !important;aspect-ratio:auto 2.74;}
    .business_slide .thumb_swiper .swiper-slide img{clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);transition:clip-path .5s cubic-bezier(.215,.61,.355,1),-webkit-clip-path .5s cubic-bezier(.215,.61,.355,1);object-fit:cover;width:100%;height:100%;}
    .business_slide .txt_box{display: flex;align-items: flex-end;gap:var(--row-gap60);translate:0 -160px;z-index:3;}
    .business_slide .txt_box .txt_swiper{width:740px;margin:0;}
    .business_slide .txt_box .swiper-slide{padding:93px 60px;box-sizing:border-box;background:var(--point-color02);}
    .business_slide .txt_box .swiper-slide p{height:max-content;overflow:hidden;}
    .business_slide .txt_box .swiper-slide .txtAni{font-size:var(--text-36);color:var(--point-white);font-weight:600;line-height:1.2;display: block;translate:0 100%;opacity:0;transition:all 0.8s;}
    #wrap .business_slide_pagination{width:auto;display: flex;align-items: flex-end;gap:var(--row-gap20);}
    #wrap .business_slide_pagination .swiper-pagination-bullet{width:auto;height:auto;background:none;border-radius:0;display:flex;flex-direction:column;align-items:flex-start;gap:12px;cursor:pointer;opacity:1;margin:0;}
    #wrap .business_slide_pagination .swiper-pagination-bullet .bullet-num{font-size:var(--text-20);font-weight:600;color:var(--black-color05);opacity:0;pointer-events:none;}
    #wrap .business_slide_pagination .bullet-progress{width:clamp(50px, 14vw, 144px);height:3px;background:var(--gray-bg04);overflow:hidden;}
    #wrap .business_slide_pagination .bullet-progress-fill{width:0;height:100%;background:var(--point-color02);display: block;}

    /*active*/
    .business_slide .thumb_swiper .swiper-slide-active{pointer-events: auto;z-index: 1;}
    .business_slide .thumb_swiper .swiper-slide-active img{transition-duration:0s;}
    .business_slide .thumb_swiper.forwards .swiper-slide:not(.swiper-slide-active) img {clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);}
    .business_slide .thumb_swiper.backwards .swiper-slide:not(.swiper-slide-active) img {clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);}
    .business_slide .txt_box .swiper-slide-active .txtAni{opacity:1;translate:0;}
    #wrap .business_slide_pagination .swiper-pagination-bullet-active .bullet-num{opacity:1;pointer-events:initial;}

    @media (max-width:1500px) {
        .business_slide .txt_box{translate:0 -100px;flex-direction: column;align-items: flex-start;}
        .business_slide .txt_box .swiper-slide{padding:60px 30px;}
    }
    @media (max-width:1023px) {
        .business_slide .txt_box{width:100%;translate:0;gap:clamp(20px, 3vw, 30px);}
        .business_slide .txt_box .txt_swiper{width:100%;}
        .business_slide .txt_box .swiper-slide{padding:clamp(25px, 4.5vw, 45px) ;}
        #wrap .business_slide_pagination{width:70vw;box-sizing:border-box;margin:0 auto;}
        #wrap .business_slide_pagination .swiper-pagination-bullet{width:100%;gap:clamp(5px, 1.2vw, 12px);}
        #wrap .business_slide_pagination .bullet-progress{width:100%;}
        #wrap .business_slide_pagination .swiper-pagination-bullet .bullet-num{font-size:0;}
    }
    @media (max-width:479px) {
        #wrap .business_slide_pagination{width:calc(100% - 60px);}
    }


/*───────────────────────────────────────────────────────────

	게시판

───────────────────────────────────────────────────────────*/    
    /* 페이징 */
        #wrap .paging {position: relative;padding:0;line-height:normal;margin:47px 0 0;text-align: center;display: flex;justify-content: center;flex-wrap: wrap;gap: 10px;}
        #wrap .paging span {display: inline-block;}
        #wrap .paging a {display:inline-flex;align-items:center;justify-content:center;font-size:var(--text-15);font-weight: 400;color:var(--black-color07);padding:0;border:0;box-sizing:border-box;width: auto;min-width:36px;height:36px;line-height:1;text-align:center;margin: 0;border: 0;}
        #wrap .paging :is(.on a, a.on){background:var(--black-color05);border-radius:100%;color: var(--point-white);font-weight:700;}
        #wrap .paging .arrow a {font-size:0;background: var(--point-white) url('../images/sub/paging_prev.svg') no-repeat center / auto 10px;}
        #wrap .paging .arrow:where(.first, .last) a{background-image: url('../images/sub/paging_first.svg');}
        #wrap .paging .arrow:where(.next, .last) a{scale: -1 -1;}
        #wrap .paging .arrow a img{display: none;}

        @media (max-width:1023px) {
            #wrap .paging{margin-top: clamp(30px, 4.7vw, 47px);gap: clamp(5px, 1vw, 10px);}
            #wrap .paging a{min-width: clamp(30px, 3.6vw, 36px);height: clamp(30px, 3.6vw, 36px);}
            #wrap .paging .arrow a{background-size: auto clamp(8px, 1.5vw, 10px);}
        }

    /*버튼*/
        #wrap .btn_wrap{padding-top:60px;}
        #wrap .btn_wrap .btn{display: inline-flex;box-sizing:border-box;align-items: center;justify-content: center;text-align: center;width:240px;height:70px;font-size:var(--text-22);font-weight:600;transition:all 0.3s;}
        #wrap .btn_wrap .btn_point{background:var(--point-color02);border:1px solid var(--point-color02);color:var(--point-white);}
        #wrap .btn_wrap .btn_basic{background:var(--point-color01);border:1px solid var(--point-color01);color:var(--point-white);}
        #wrap .btn_wrap .btn span{font-size:inherit;color:inherit;font-weight:inherit;}
            
        /* over */
        @media (hover:hover) and (pointer:fine) {
            #wrap .btn_wrap .btn_point:hover{color:var(--point-white);border-color:var(--point-color01);background:var(--point-color01);;}
            #wrap .btn_wrap .btn_basic:hover{background:var(--point-white);color:var(--point-color01);}
        }
        
        @media (max-width:1023px) {
            #wrap .btn_wrap{padding-top:clamp(40px, 6vw, 60px);}
            #wrap .btn_wrap .btn{width:clamp(140px, 2vw, 200px);height:clamp(50px, 7vw, 70px);}
        }

    /*인풋*/
        #wrap :where([type="text"], select){background: var(--point-white);border-radius:6px;font-size: var(--text-18);font-weight: 400;color: var(--black-color05);line-height: normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;height:50px;padding: 0 20px;letter-spacing: -0.03em; transition: all 0.4s;border:none;border:1px solid var(--border-color01)}
            #wrap :where([type="text"], select)::placeholder{color: var(--black-color10);}
            #wrap :where([type="text"], select):focus{border-color: var(--black-color00);}
        #wrap select{width: 100%;max-width: 160px;padding-right: 45px;appearance: none;background:var(--point-white) url('../images/sub/sel_arw.svg') no-repeat calc(100% - 20px) / 11px auto;}
        #wrap textarea{width: 100%;font-size: var(--text-18);font-weight: 400;color: var(--black-color03);line-height: 1.6;border:none;background: var(--point-white);resize: none;padding: clamp(15px, 3vw, 30px);height: clamp(120px, 18vw, 160px);scrollbar-gutter: stable;}
        #wrap textarea::placeholder{color:var(--black-color10);}
        #wrap textarea::-webkit-scrollbar {width: clamp(3px, 0.6vw, 4px);}
        #wrap textarea::-webkit-scrollbar-track {box-shadow:-10px 0 0 var(--border-color01); border-radius: 10px; margin: 10px;}
        #wrap textarea::-webkit-scrollbar-thumb {box-shadow:-10px 0 0 var(--black-color10); border-radius: 10px;}
        
        #wrap :where([type="text"], [type="password"], [type="number"], [type="date"]) {height:70px;line-height:initial;border:none;color:var(--black-color03);font-size:var(--text-18);padding:0 20px 0 0;border:none;}
        #wrap input[type="text"]::-webkit-input-placeholder {color:var(--black-color10);}
        #wrap input[type="password"]::-webkit-input-placeholder {color:var(--black-color10);}
        #wrap input[type="text"]::-moz-placeholder {color:var(--black-color10);}
        #wrap input[type="password"]::-moz-placeholder {color:var(--black-color10);}
        #wrap input[type="text"]:-ms-input-placeholder {color:var(--black-color10);}
        #wrap input[type="password"]:-ms-input-placeholder {color:var(--black-color10);}
        #wrap input[type="text"]:-moz-placeholder {color:var(--black-color10);}
        #wrap input[type="password"]:-moz-placeholder {color:var(--black-color10);}
        #wrap input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0) inset;-webkit-text-fill-color:var(--black-color08);font-size:inherit;}

        @media (max-width:1023px) {
            #wrap :where([type="text"], [type="password"], [type="number"], [type="date"], select){padding-right:clamp(15px, 2.3vw, 20px);height: clamp(56px, 7vw, 70px);}
            #wrap select{max-width: clamp(110px, 18vw, 160px);padding-right: clamp(35px, 5.5px, 30px);background-position: calc(100% - clamp(15px, 2.3vw, 20px)) 50%;background-size: clamp(8px, 1.9vw, 11px);}
            #wrap textarea{padding:clamp(12px, 1.5vw, 15px) clamp(15px, 2vw, 20px);}
        }

    /*체크박스*/
        #wrap label:has([type="checkbox"]){display: flex;align-items: flex-start;font-size: var(--text-18);font-weight: 500;color: var(--black-color03);gap: 10px;cursor: pointer;line-height: 26px;}
        #wrap label:has([type="checkbox"]) em{font-weight: 500; color: var(--point-color01); display: contents;}
        #wrap [type="checkbox"]{position: relative; display: inline-flex; width: 26px; height: 26px; border:1px solid var(--border-color01); background: var(--point-white); flex-shrink: 0; cursor: pointer;border-radius:2px;}
            #wrap [type="checkbox"]:before{position: absolute; content:''; inset: 0; background: url('../images/skin/chk_icon.svg') no-repeat center / 12px auto; filter: var(--filter-black) opacity(0.4); transition: all 0.4s;}
            #wrap [type="checkbox"]:checked{background:var(--point-color01);border-color:var(--point-color01);}
            #wrap [type="checkbox"]:checked:before{filter:var(--filter-white);}

        #wrap input[type="checkbox"] + label:before, #wrap input[type="checkbox"] + label::before{display: none;}
            
        @media (max-width:1023px){
            #wrap label:has([type="checkbox"]){line-height: clamp(20px, 2.9vw, 26px);}
            #wrap [type="checkbox"]{width: clamp(20px, 2.9vw, 26px); height: clamp(20px, 2.9vw, 26px);}
            #wrap [type="checkbox"]:before{background-size: clamp(10px, 1.7vw, 12px) auto;}
        }

    /*라디오*/
        #wrap label:has([type="radio"]){display: flex;align-items: flex-start;gap: 10px;font-size: var(--text-20);font-weight: 400;color: var(--black-color01);line-height: 20px; cursor: pointer;}
        #wrap label [type="radio"]{display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; aspect-ratio: auto 1; border: 1px solid var(--black-color10); border-radius: 100%; background: var(--point-white); cursor: pointer; transition: all 0.4s;}
        #wrap label [type="radio"]:before{content: ''; width: 50%; aspect-ratio: auto 1; background: var(--black-color00); border-radius: 100%; opacity: 0; transition: all 0.4s;}
        #wrap label [type="radio"]:checked{border-color: var(--black-color00);}
        #wrap label [type="radio"]:checked:before{opacity: 1;}

        @media (max-width:1023px){
            #wrap label:has([type="radio"]){line-height: clamp(17px, 2vw, 20px);}
            #wrap [type="radio"]{width: clamp(17px, 2vw, 20px); height: clamp(17px, 2vw, 20px);}
        }

/*───────────────────────────────────────────────────────────

    board

───────────────────────────────────────────────────────────*/
    /*검색*/
        #wrap .search_wrap{padding:0 0 30px;}
        #wrap .search_wrap fieldset{position: relative; display: flex; justify-content: flex-end; gap:10px;flex-wrap:wrap;}
        #wrap .search_wrap .board_search_sel{display:inline-flex; gap:10px; width:140px;}
        #wrap .search_wrap .board_search_sel select{width:100%;max-width:100%;}
        #wrap .search_wrap .input_text{width:380px; padding-right:120px;border:1px solid var(--border-color01);height:50px;padding:0 20px;}
        #wrap .search_wrap .search_btn{position:absolute; right:0; bottom:0; width:100px; height:50px; display:flex; align-items: center; justify-content: center; border:0; border-left: 1px solid var(--border-color01); font-size:var(--text-18); font-weight: 500; color: var(--black-color03); letter-spacing: -0.02em; box-sizing: border-box; z-index:2;}

        @media (max-width:1023px){
            #wrap .search_wrap{padding:0 0 clamp(15px, 3vw, 30px);}
            #wrap .search_wrap .board_search_sel{width:clamp(120px, 14vw, 140px);}
            #wrap .search_wrap .input_text{width:clamp(320px, 3.8vw, 380px);padding-right:clamp(70px, 10vw, 100px);}
            #wrap .search_wrap .input_text, #wrap .search_wrap select{height:clamp(42px, 5vw, 50px);}
            #wrap .search_wrap .search_btn{width:clamp(60px, 9vw, 90px);height:clamp(40px, 5vw, 50px);}
        }
        @media (max-width:479px){
            #wrap .search_wrap .input_text{width:100%}
            #wrap .search_wrap select{width:100%;max-width:100%;}
        }
        @media (max-width:360px){
            #wrap .search_wrap fieldset{flex-wrap: wrap;}
            #wrap .search_wrap .input_text{width:100%;}
        }

    /*gallery*/
    .gallery_list{display: flex;flex-wrap:wrap;gap:30px;margin-top:var(--row-gap120);}
        .gallery_list.nodata{justify-content: center;}
        .gallery_list li{box-sizing:border-box;width:calc(100% / 3 - 20px);position: relative;border-radius:var(--radius-20);border:1px solid var(--border-color01);padding:20px 20px;}
        .gallery_list li > a{display: block;width:100%;height:100%;position: absolute;top:0;left:0;}
        .gallery_list li .thumb{width:100%;aspect-ratio:auto 1.5;box-sizing:border-box;border-radius:var(--radius-10);border:4px solid var(--border-color01);position: relative;overflow:hidden;}
        .gallery_list li .thumb img{width:100%;height:100%;object-fit:cover;}
        .gallery_list li .info{text-align: center;margin-top:20px;font-size:var(--text-20);}
        .gallery_list li .title{font-size:110%;color:var(--black-color00);font-weight:400;}
        .gallery_list li span{display: block;font-size:var(--text-18);color:var(--black-color07);font-weight:300;margin-top:10px;}

        @media (hover: hover) and (pointer: fine) {
            .gallery_list li:hover{border-color:var(--black-color03);}
        }

        @media (max-width:1023px){
            .gallery_list{gap:clamp(20px, 3vw, 30px)}
            .gallery_list li{width:calc(100% / 3 - clamp(20px, 3vw, 30px) * 2 / 3);}
        }
        @media (max-width:640px){
            .gallery_list li{width:calc(100% / 2 - clamp(20px, 3.2vw, 32px) / 2 );padding:20px 15px;}
            .gallery_list li .thumb{border-width:2px;}
        }
        @media (max-width:479px){
            .gallery_list li{width:100%;}
            .gallery_list li .info{margin-top:10px;}
            .gallery_list li span{margin-top:5px;}
        }
        

    /*view*/
        #wrap .bbs_view{margin-top:30px;}
        #wrap .bbs_view div.view_tit {padding: 27px 20px;border-bottom:1px solid var(--border-color01);border-top:2px solid var(--black-color03);background:var(--point-white);margin:0;width:100%;box-sizing:border-box;}
        #wrap .bbs_view div.view_tit > h3 {font-size:var(--text-20); font-weight:400; width:100%;color:var(--black-color04);}
        #wrap .bbs_view div.view_tit .preface{font-size:inherit;font-weight:inherit;display: inline-block;margin-right:clamp(10px, 2vw, 20px);box-sizing:border-box;padding:5px 10px;}
        #wrap .bbs_view div.view_tit .preface[data-preface="CONSTRUCTION"]{background:var(--point-color01);color:var(--point-white);}
        #wrap .bbs_view div.view_tit .preface[data-preface="ICT"]{background:var(--point-color02);color:var(--point-white);}
        #wrap .bbs_view div.view_tit .preface[data-preface="GIS"]{background:var(--point-color04);color:var(--point-white);}
        #wrap .bbs_view div.view_tit .info{display:flex;flex-wrap:wrap;margin-top: 17px;}
        #wrap .bbs_view div.view_tit .info dl{display:inline-flex; gap:0 4px; align-items: center;}
            #wrap .bbs_view div.view_tit .info dl + dl:before{display:inline-flex; content:''; width:1px; height:9px; background:var(--border-color01); margin:0 13px;}
        #wrap .bbs_view div.view_tit .info dl :where(dt,dd){font-size: var(--text-16);font-weight: 400;color: var(--black-color08);}
        #wrap .bbs_view div.view_cont{padding:30px 20px; line-height: 1.78; border-bottom: 1px solid var(--border-color01); font-size: var(--text-18); font-weight: 400; color: var(--black-color04);}
        #wrap .sub_board .bbs_view .extra_editor_wrap{display:flex; margin-top:-1px; border-top:1px solid var(--border-color01); border-bottom:1px solid var(--border-color01);}
        #wrap .sub_board .bbs_view .extra_editor_wrap > h4{display:inline-block; width:150px; background: var(--gray-bg); padding:20px; box-sizing: border-box; text-align: center; font-size:var(--text-18); font-weight: 500; color: var(--black-color03);}
        #wrap .sub_board .bbs_view .extra_editor_wrap > .extra_cont{display:inline-block; width:calc(100% - 150px); padding:20px; font-size:var(--text-18); font-weight: 400; color: var(--black-color06); word-break: break-all;}
        #wrap .sub_board .bbs_view .extra_editor_wrap > .extra_cont :where(span,a){font-size:inherit !important; font-weight: inherit !important; color: inherit !important;}

        @media (max-width:1023px){
            #wrap .bbs_view div.view_tit{padding:clamp(18px, 2.5vw, 25px) clamp(15px, 2vw, 20px);}
            #wrap .bbs_view div.view_tit .info{margin-top:clamp(8px, 1.2vw, 12px);}
            #wrap .bbs_view div.view_cont{padding:clamp(18px, 2.5vw, 25px) clamp(15px, 2vw, 20px);}
            #wrap .sub_board .bbs_view .extra_editor_wrap > h4{width:clamp(100px, 13vw, 130px);}
            #wrap .sub_board .bbs_view .extra_editor_wrap > .extra_cont{width:calc(100% - clamp(100px, 13vw, 130px));}

        }
        @media (max-width:640px){
            #wrap .bbs_view div.view_tit .info dl + dl:before{margin:0 10px;}
        }    

    /*write*/
	#wrap .bbs_write{position: relative; border:none;display: block; width: 100%; padding:0;}
	#wrap .bbs_write :where(tbody, tr, th, td){display: block; width: 100%; padding:0; margin:0; border:0; background: none;}
	#wrap .bbs_write tbody{display: flex;flex-wrap: wrap;gap: clamp(15px, 2vw, 20px) clamp(15px, 2vw, 20px);}
	#wrap .bbs_write tr{display: flex;align-items:center;width: calc(100% / 2 - clamp(15px, 2vw, 20px) / 2); gap: var(--row-gap10) 0;background:var(--point-white);padding:0 clamp(15px, 3vw, 30px);}
	#wrap .bbs_write th{width: clamp(100px, 16.2vw, 160px);flex-shrink: 0;font-size: var(--text-19);font-weight: 600;color: var(--black-color03);letter-spacing: -0.03em;}
	#wrap .bbs_write th label{font-size: inherit; font-weight: inherit; color: inherit;}
	#wrap .bbs_write th em{font-weight: inherit; color: var(--black-color03);}
	#wrap .bbs_write td{width: 100%;}
	#wrap .bbs_write select{width: 100%;}
	#wrap .bbs_write label:has([type="checkbox"]){font-size: var(--text-16);}
	#wrap .bbs_write input:where([type="text"], [type="password"], [type="number"]){width: 100%;margin: 0;font-size:var(--text-18);}
	#wrap .bbs_write textarea{height: clamp(120px, 18vw, 180px);padding:clamp(15px, 3vw, 30px) 0;}
	#wrap .bbs_write tr:has(textarea, .controller){width: 100%;}
	#wrap .bbs_write tr:has(textarea) td{display: flex;flex-direction: column;gap: var(--row-gap15);align-items: flex-start;}
	#wrap .bbs_write td:has(.controller){display: flex;gap: var(--row-gap10);}
	#wrap .bbs_write .controller{position: relative;display: flex;align-items: center;padding-block: var(--row-gap10);width: clamp(200px, 24.6vw, 241px);gap: var(--row-gap10);flex-shrink: 0;}
	#wrap .bbs_write #captcha_box{width: 100%;height: clamp(34px, 4.5vw, 40px);margin: 0;overflow: hidden;border: 1px solid var(--border-color01);border-radius: inherit;}
	#wrap .bbs_write #captcha_box img{width: calc(100% + 2px) !important;height: calc(100% + 2px) !important;max-width: none;max-height: none;margin: -1px 0 0 -1px;object-fit: cover;}
	#wrap .bbs_write #refreshCode{position: relative;width: clamp(34px, 4.5vw, 40px);height: clamp(34px, 4.5vw, 40px);box-shadow: inset 0 0 0 1px var(--border-color01);border-radius: inherit;background: url('../images/skin/refreshCode.svg') no-repeat center / clamp(15px, 2.3vw, 18px);font-size: 0;flex-shrink: 0;cursor: pointer;}
	#wrap .bbs_write #cap{position: relative;}
	#wrap .bbs_write tr:has([type="file"]){margin-right: 1px;align-items: center;}
	#wrap .bbs_write tr:has([type="file"]) th{translate: 0;}
	#wrap .bbs_write tr:has([type="file"]) td{display: flex;gap: var(--row-gap10);}
	#wrap .bbs_write input[type="file"]{display: none;}
	#wrap .bbs_write span[id*="file"]{display: flex;align-items: center;gap: 10px;height: clamp(44px, 8vw, 60px);border-radius: var(--radius-06);background: var(--point-white);border: 1px solid var(--border-color01);padding: 0 clamp(15px, 2.4vw, 24px);font-size: var(--text-16);font-weight: 400;color: var(--black-color02);line-height: normal;min-width: auto;letter-spacing: -0.03em;vertical-align: middle;width: 100%;}
	#wrap .bbs_write span[id*="file"] a{color: var(--point-color06) !important;white-space: normal;overflow:hidden;text-overflow:ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
	#wrap .bbs_write span[id*="file"] .file_no{flex-shrink:0;}
	#wrap .bbs_write td [for="file"]{display: flex;align-items: center;justify-content: center;gap: 10px;height: clamp(44px, 8vw, 60px);border-radius: var(--radius-06);background: var(--border-color03);border: 1px solid var(--border-color03);padding: 0 clamp(15px, 2.4vw, 24px);font-size: var(--text-16);font-weight: 400;color: var(--black-color02);line-height: normal;letter-spacing: -0.03em;vertical-align: middle;flex-shrink: 0;cursor: pointer;}
	#wrap .policy_box{margin-top: var(--row-gap40);display: grid;gap: var(--row-gap20);}
	#wrap .policy_box label:has([type="checkbox"]){font-size: var(--text-18);}

		@media (min-width:480px) {
			#wrap .bbs_write tr:has(textarea, .controller) th{align-self: flex-start;padding:20px 0;}
		}

	@media (max-width:1300px) {
		#wrap .bbs_write td:has(.controller){display: flex; flex-wrap: wrap;}
	}
	@media (max-width:1023px) {
		#wrap .bbs_write tr{width: 100%;}
	}
	@media (max-width:479px) {
		#wrap .bbs_write tr{flex-wrap: wrap;padding-block:10px;}
		#wrap .bbs_write th{width: 100%; flex-shrink: unset;}
	}