@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	" board｜errors｜goods｜service｜layout/board｜layout/display｜layout/goods "
	" layout/popup.html "

	위 폴더 및 페이지 커스텀 및 layout, navigation, button, company 관련 편집 css 파일 입니다.

	** header, footer, main 관련은 /css/skin.css 에 있습니다.

───────────────────────────────────────────────────────────*/
    #container{position: relative; padding-bottom: 140px;}
    #container:has(.pdZero){padding-bottom: 0;}
    .sub_content{font-family: var(--font-type01);}
    img.for_m{display: none;}

    @media (max-width:1200px) {
        br.for_pc{display: none;}
    }
    @media (max-width:860px) {
        img.for_pc{display: none;}
        img.for_m{display: block;}
    }
    @media (max-width:1023px) {
        #container{padding-bottom: clamp(100px, 14vw, 140px);}
    }
/*───────────────────────────────────────────────────────────
	
    서브

───────────────────────────────────────────────────────────*/
    /* 상단 */
        .nav_desc{position: relative;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;font-size: var(--title-20);text-align: center;padding-block: 100px 21px;}
        .nav_desc dt{display: inline-flex;align-items: center;height: 21px;}
        .nav_desc dt:after{display: inline-flex;content:'';width: 4px;aspect-ratio: auto 1;border-radius: 100%;background: var(--point-color01);margin-inline: 12px;}
        .nav_desc dd{font-size: 110%;font-weight: 500;color: var(--black-color05);line-height: 1.5;font-family: var(--font-type02);letter-spacing: 0;}

        @media (max-width:1023px) {
            .nav_desc{padding-block: clamp(60px, 10vw, 100px) clamp(13px, 2.1vw, 21px);}
            .nav_desc dt{height: clamp(16px, 2.6vw, 21px);}
        }
        @media (max-width:640px) {
            .nav_desc dd{font-size: 100%;}
        }
        @media (max-width:479px) {
            .nav_desc dt:after{width: 3px;}
        }

    /* 타이틀 */
        .sub_title{position: relative;font-size: var(--title-20);display: grid;gap: 20px;text-align: center;text-wrap: balance;}
            .sub_title.pdT{padding-top: 140px;}
            .sub_title.hdS{margin-bottom: 34px;}
            .sub_title.hdM{margin-bottom: 60px;}
            .sub_title.left{text-align: left;text-wrap: pretty;}
            .sub_title.topLine:before{display: block;content:'';width: 2px;height: 60px;background: var(--border-color01);margin: 0 auto 20px;}
        .sub_title h2{font-size: 290%;font-weight: 700;color: var(--black-color01);line-height: 1.34;}
        .sub_title h2 em{font-weight: 700; color: var(--point-color02);}
        .sub_title h3{font-size: 200%; font-weight: 600; line-height: 1.35;}
        .sub_title h3 em {font-weight: inherit;background: var(--gradient01);background-clip: text;-webkit-text-fill-color: var(--trans-color);}
        .sub_title h3 strong{font-weight: inherit; color: var(--point-color01);}
        .sub_title h5{font-size: 140%; font-weight: 400; color: var(--black-color03); line-height: 1.5;}
        .sub_title h6{font-size: 110%;font-weight: 500;color: var(--black-color05);line-height: 1.5;}
            .sub_title h6:not(.ko){font-family: var(--font-type02); letter-spacing: 0;}
            .sub_title h6.ko{font-weight: 400;}
        .sub_title h6 strong{font-weight: 600; color: var(--black-color03);}

        @media (max-width:1023px) {
            .sub_title{gap: clamp(12px, 2vw, 20px);}
                .sub_title.pdT{padding-top: clamp(80px, 14vw, 140px);}
                .sub_title.hdS{margin-bottom: clamp(20px, 3.4vw, 34px);}
                .sub_title.hdM{margin-bottom: clamp(25px, 6vw, 60px);}
                .sub_title.topLine:before{height: clamp(35px, 6vw, 60px);margin-bottom: clamp(5px, 2vw, 20px);}
            .sub_title h2{font-size: 270%;}
            .sub_title h3{font-size: 190%;} 
        }
        @media (max-width:640px) {
            .sub_title h2{font-size: 240%;}
            .sub_title h3{font-size: 180%;} 
            .sub_title h5{font-size: 130%;}
        }
        @media (max-width:479px) {
            .sub_title h2{font-size: 200%;}
            .sub_title h3{font-size: 160%;}
            .sub_title h5{font-size: 120%;}
            .sub_title h6{font-size: 100%;}
        }

    /* 조직 유형 */
        .genreExp{display: grid;grid-template: auto / repeat(3, 1fr);gap: clamp(15px, 1.6vw, 28px);text-wrap: balance;}
        .genreExp section{border-radius: var(--radius-10); overflow: hidden; box-shadow: inset 0 0 0 1px var(--border-color01);}
        .genreExp .top_sec{font-size: var(--title-20);background: var(--point-color01);padding:22px 20px;min-height: 116px;display: flex;align-items: center;justify-content: center;text-align: center;}
            .genreExp .top_sec.auto{min-height: auto;}
        .genreExp .top_sec h5{font-size: 130%; font-weight: 500; color: var(--point-white); line-height: 1.39;}
        .genreExp .cont{padding:40px;font-size: var(--title-20);display: grid;gap: 30px;}
        .genreExp .cont:before{display: block;content:'';width: 24px;aspect-ratio: auto 1.33;background: url('../images/sub/quotation.svg') no-repeat center / 100% auto;margin-bottom: -5px;}
            .genreExp .cont.befor_dn:before{display: none;}
        .genreExp .cont h6{font-size: 110%; font-weight: 500; color: var(--black-color05); line-height: 1.54;}
        .genreExp .cont h6 strong{font-weight: 600; color: var(--black-color03);}
        .genreExp .cont h6 em{font-weight: 600; color: var(--point-color01);}
            .genreExp .cont h6.cen{text-align: center;}
        .genreExp .bullet_list{background: var(--gray-bg05);padding: 24px;border-radius: var(--radius-10);min-height: 176px;}

        @media (max-width:1160px) {
            .genreExp{grid-template:auto / repeat(2, 1fr);}
        }
        @media (max-width:1023px) {
            .genreExp .cont{padding: clamp(35px, 4vw, 40px); gap: clamp(20px, 3vw, 30px);}
            .genreExp .cont:before{width: clamp(20px, 2.9vw, 24px);}
            .genreExp .top_sec{padding-block: clamp(18px, 2.7vw, 22px);}
            .genreExp .bullet_list{padding-block: clamp(20px, 2.9vw, 24px);}
        }
        @media (max-width:640px) {
            .genreExp{grid-template:auto / repeat(1, 1fr);}
            .genreExp .top_sec{min-height: auto;}
            .genreExp .bullet_list{min-height: auto;}
        }
        @media (max-width:479px) {
            .genreExp .top_sec h5{font-size: 120%;}
            .genreExp .cont{padding:30px;}
            .genreExp .cont h6{font-size: 105%;}
        }
        
    /* 간격 & 배경 */
        .gap_wrap{display: grid; grid-template-columns: minmax(auto, 1fr); gap: 140px;}
            .gap_wrap.g40{gap: 40px;}
            .gap_wrap.g60{gap: 60px;}
        .gr_bg{position: relative; z-index: 1; padding-bottom: 140px;}
            .gr_bg:before{position: absolute; content:''; top:0; left:50%; translate: -50%; width: 200vw; height: 100%; background: var(--gray-bg04); z-index: -1;}
            .gr_bg.pt01:before{background: var(--point-color02);}
            .gr_bg.contact:before{width: 100vw;background: url('../images/sub/contact.png') no-repeat center / cover;}
        .gr_bg.pt01 .sub_title :where(h2, h6){filter: var(--filter-white);}
        .gr_bg.pt01 .sub_title h6{opacity: 0.8;}
        

        .shadow_box{background: var(--point-white);box-shadow: var(--shadow-03);padding: 40px;}

        .sub_content .bullet_list{display: flex;flex-direction: column;gap: 8px;}
		.sub_content .bullet_list > li{font-size:90%;line-height: 1.56;text-wrap: auto;}
        .sub_content .bullet_list > li strong{font-weight: 600; color: var(--black-color03); display: contents;}

        .write_thumb{gap: 30px;padding:60px;border-radius: var(--radius-20);background: var(--point-white);display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}
            .write_thumb.gray{background: var(--gray-bg05);}

        @media (max-width:1023px) {
            .gap_wrap{gap: clamp(70px, 14vw, 140px);}
                .gap_wrap.g40{gap: clamp(25px, 4vw, 40px);}
                .gap_wrap.g60{gap: clamp(30px, 6vw, 60px);}
            .gr_bg{padding-bottom: clamp(70px, 14vw, 140px);}

            .shadow_box{padding: clamp(30px, 4vw, 40px);}

            .write_thumb{padding: clamp(15px, 5vw, 60px);}
        }
        @media (max-width:479px) {
            .sub_content .bullet_list{gap: 6px;}
            .sub_content .bullet_list li:before{width: 3px;}

            .shadow_box{padding: 25px;}
        }

    /* 탭 */
        .sub_content .process_sub_tab{margin-block:0 60px;}
        .prcCont .item{transition: all 0.4s;}
            .prcCont .item:not(.on){opacity: 0; height: 0; translate: 0 70px; overflow: hidden;}

        @media (max-width:1023px) {
            .sub_content .process_sub_tab{margin-bottom: clamp(30px, 6vw, 60px);}
        }

    /* 그래프 설명 */
        .graphExp{display: flex; align-items: center; gap: clamp(50px, 4.2vw, 80px);}
        .graphExp .thumb{font-size: 0;width: 47.2%;flex-shrink: 0;border-radius: var(--radius-20);overflow: hidden;}
        .graphExp .cont{width: 100%;counter-reset: graphExp;display: flex;flex-direction: column;gap: 30px;}
        .graphExp .cont section{display: grid;gap: 13px;}
        .graphExp .sub_title h6{font-size: 120%;font-weight: 600;color: var(--black-color03);line-height: 1.5;display: flex;align-items: baseline;gap: 14px;letter-spacing: -0.03em;}
        .graphExp .sub_title h6:before{content: counter(graphExp, decimal-leading-zero);counter-increment: graphExp;display: flex;align-items: center;justify-content: center;text-align: center;min-width: 40px;height: 40px;padding-inline: 5px;flex-shrink: 0;box-sizing: border-box;border: 1px solid var(--point-color01);border-radius: 100%;background: var(--point-white);font-size: 75%;font-weight: 500;color: var(--point-color01);line-height: 1;translate: 0 -2px;}

        @media (max-width:1023px) {
            .graphExp{flex-wrap: wrap;gap: clamp(30px, 5vw, 50px);}
            .graphExp .thumb{width: 100%;max-width: 660px;flex-shrink: unset; margin-inline: auto;}
            .graphExp .sub_title h6{gap: clamp(12px, 1.9vw, 14px);}
            .graphExp .sub_title h6:before{min-width: clamp(33px, 4.5vw, 40px);height: clamp(33px, 4.5vw, 40px);}
            .graphExp .cont{gap: clamp(25px, 3.5vw, 35px);}
            .graphExp .cont section{gap: clamp(10px, 1.8vw, 13px);}
        }

    /* 프로세스 */
        .bizProc{display: flex;font-size: var(--title-20);text-wrap: balance;counter-reset: bizProc;padding: 19px 4px;gap: 80px 0;}
        .bizProc > li{position: relative;font-size: inherit;text-align: center;padding: 82px clamp(30px, 2.2vw, 40px) 62px;display: flex;flex-direction: column;gap: 44px;margin-inline: -1px;width: 100%;}
            .bizProc > li:before{content:'Step ' counter(bizProc, decimal-leading-zero)'.';counter-increment: bizProc;position: absolute;top: 0;left: 50%;translate: -50% -50%;max-width: 100%;background: var(--point-color04);font-size: inherit;font-weight: 500;font-family: var(--font-type02);color: var(--point-white);letter-spacing: 0;padding: 12px 20px;box-sizing: border-box;border-radius: var(--radius-10);}
            .bizProc > li:after{position: absolute;content:'';inset: 0;border: 2px dashed var(--point-white);border-radius: var(--radius-20);clip-path: inset(0 0 50%);z-index: -1;}
        .bizProc .icon{display: flex;align-items: center;justify-content: center;width: 110px;height: 88px;margin-inline: auto;}
            .bizProc .icon{&:before, &:after{position: absolute;content:'';width: 22px;aspect-ratio: auto 1;box-shadow: inset 0 0 0 5px var(--point-white);background: var(--point-color04);border-radius: 100%;top: 50%;left: 0;translate: -50% -50%;}}
            .bizProc .icon:after{content:'';left: calc(100% - 2px);}
        .bizProc .desc{display: grid;gap: 23px;filter: var(--filter-white);}
        .bizProc .desc dt{font-size: 130%; font-weight: 600;}
        .bizProc .desc dd{position: relative; opacity: 0.8;}

            .bizProc > li:nth-child(2n):before{top:100%;}
            .bizProc > li:nth-child(2):before{background: var(--point-color05);}
            .bizProc > li:nth-child(3):before{background: var(--point-color06);}
            .bizProc > li:nth-child(4):before{background: var(--point-color09);}
            .bizProc > li:last-child:before{background: var(--point-color07);}
            .bizProc > li:nth-child(2n):after{clip-path: inset(50% 0 0);}

            .bizProc > li:nth-child(2) .icon:before{background: var(--point-color05);}
            .bizProc > li:nth-child(2) .icon:after{background: var(--point-color06);}
            .bizProc > li:nth-child(3) .icon:before{background: var(--point-color06);}
            .bizProc > li:nth-child(3) .icon:after{background: var(--point-color07);}
            .bizProc > li:nth-child(4) .icon:before{background: var(--point-color09);}
            .bizProc > li:nth-child(4) .icon:after{background: var(--point-color07);}
            .bizProc > li:last-child .icon:before{background: var(--point-color07);}
            .bizProc > li:last-child .icon:after{background: var(--point-color08);}

        @media (max-width:1023px) {
            .bizProc{display: grid;grid-template: auto / repeat(2, 1fr);}
            .bizProc > li{padding-top: clamp(70px, 8.2vw, 82px);gap: clamp(23px, 4.4vw, 44px);}
                .bizProc > li:before{padding: clamp(10px, 1.7vw, 12px) clamp(15px, 2.5vw, 20px);}
            .bizProc .icon{width: clamp(60px, 11.5vw, 110px);height: clamp(50px, 9.3vw, 88px);}
                .bizProc .icon{&:before, &:after{width: clamp(16px, 2.7vw, 22px);}}
            .bizProc .desc{gap: clamp(18px, 2.3vw, 23px);}
        }
        @media (max-width:860px) {
            .bizProc .icon{&:before, &:after{box-shadow: inset 0 0 0 4px var(--point-white);}}
        }
        @media (max-width:479px) {
            .bizProc{grid-template: auto / repeat(1, 1fr);gap: 20px;}
            .bizProc > li{padding-block: 55px;}
            .bizProc > li:last-child{padding-bottom: 0;}
            .bizProc > li:after{clip-path: inset(0 0 50%) !important;}
            .bizProc > li:before{top: 0 !important;}
            .bizProc .icon:before{left: 1px;}
            .bizProc .icon:after{left: calc(100% - 1px);}
        }

    /* 체크 리스트 */
        .chk_list{position: relative;font-size: var(--title-20);display: flex;flex-direction: column;align-items: center;gap: 10px;}
        .chk_list > li{font-size: 120%;font-weight: 500;color: var(--black-color05);line-height: 1.5;display: flex;align-items: baseline;gap: 12px;}
        .chk_list > li:before{display: inline-flex;content:'';width: 15px;aspect-ratio: auto 1.25;background: url('../images/sub/chk_icon.svg') no-repeat center / 100% auto;flex-shrink: 0;translate: 0 -2px;}

        @media (max-width:1023px) {
            .chk_list > li{gap: clamp(10px, 1.7vw, 12px);}
            .chk_list > li:before{width: clamp(12px, 2vw, 15px);translate: 0 clamp(-2px, -0.4vw, 0px);}
        }
        @media (max-width:640px) {
            .chk_list{align-items: flex-start;}
            .chk_list > li{font-size: 110%;}
        }
        @media (max-width:479px) {
            .chk_list > li{font-size: 100%;}
        }

    /* 버튼 */
        #wrap .btn_wrap{position: relative;inset: auto;display: flex;justify-content: center;flex-wrap: wrap;margin: 80px 0 0;padding: 0;gap: 15px;}

        @media (max-width:1023px) {
            #wrap .btn_wrap{margin-top:clamp(35px, 8vw, 80px);}
        }

    /* 타이틀 설명 */
        .title_flex{display: flex;align-items: flex-start;gap: 40px 0;}
        .title_flex .sub_title{width: 41.4%;flex-shrink: 0;padding-right: 50px;}
        .title_flex .exp{width: 100%; font-size: var(--title-20); display: flex; flex-direction: column; gap: 14px;}
        .title_flex .exp h6{font-size: inherit; font-weight: 500; color: var(--black-color03); line-height: 1.6;}
        .title_flex .exp p{font-size: 90%; font-weight: 400; color: var(--black-color05); line-height: 1.67;}
        .title_flex .bullet_list{gap:10px;}
        .title_flex .bullet_list > li{font-size: 95%;line-height: 1.68;}

        @media (max-width:1023px) {
            .title_flex{flex-wrap: wrap;gap: clamp(20px, 4vw, 40px);}
            .title_flex .sub_title{width: 100%; padding-right: 0; flex-shrink: unset;}
            .title_flex .exp{gap: clamp(10px, 1.4vw, 14px);}
            .title_flex .bullet_list{gap: clamp(6px, 1vw, 10px);}
        }

    /* 원형 설명*/
        .circleExp{position: relative;padding: 60px 20px;background: var(--gray-bg05);}
        .circleExp .info_list{display: flex;align-items: center;justify-content: center;text-align: center;gap: clamp(40px, 4.4vw, 80px);}
            .circleExp .info_list > li{position: relative;border-radius: 100%;width: 100%;max-width: clamp(280px, 25vw, 318px);aspect-ratio: auto 1;display: flex;align-items: center;justify-content: center;}
            .circleExp .info_list > li{&:before, &:after{position: absolute;content:'';inset: 0;border: 1px solid var(--point-color08);border-radius: inherit;clip-path: var(--polygon-path02);}}
            .circleExp .info_list > li:after{border-style: dashed;clip-path: var(--polygon-path03);}
        .circleExp .info_list .cont{width: calc(100% - clamp(40px, 4vw, 48px)); height: calc(100% - clamp(40px, 4vw, 48px)); background: var(--point-color08); border-radius: inherit; padding:20px; box-shadow: var(--shadow-05);}
            .circleExp .info_list .cont{&:before, &:after{position: absolute;content:'';width: 24px;aspect-ratio: auto 1;background: var(--point-white);border: 5px solid var(--point-color08);border-radius: 100%;box-sizing: border-box;top: 50%;left: 0;translate: -50% -50%;z-index: 2;}}
            .circleExp .info_list .cont:after{left:auto;right:0;translate: 50% -50%;}
        .circleExp .info_list .desc{width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 15px;background: var(--point-white);border-radius: inherit;font-size: var(--title-20);box-shadow: var(--shadow-04);padding: 20px;}
            .circleExp .info_list .desc:before{position: absolute;content:'';width: clamp(40px, 4.4vw, 80px);height: 2px;background: var(--gradient03);top: 50%;left: 100%;margin-top: -1px;}
            .circleExp .info_list > li:last-child .desc:before{display: none;}
        .circleExp .info_list .desc dt{display:flex;align-items: center;justify-content: center;width: 60px;height: 60px;}
        .circleExp .info_list .desc dd{font-size: 120%; font-weight: 500; color: var(--black-color01);}

            .circleExp .info_list > li:nth-child(1):before{clip-path:inset(50% 0 0 50%);}
            .circleExp .info_list > li:nth-child(1):after{clip-path:inset(0 0 50% 50%);}
            .circleExp .info_list > li:nth-child(1) .cont:before{display: none;}

            .circleExp .info_list > li:nth-child(2){&:before, &:after{border-color: var(--point-color02);}}
            .circleExp .info_list > li:nth-child(2) .cont{background: var(--point-color02);}
            .circleExp .info_list > li:nth-child(2) .cont{&:before, &:after{border-color: var(--point-color02);}}

            .circleExp .info_list > li:nth-child(3):before{clip-path:inset(0 50% 50% 0);}
            .circleExp .info_list > li:nth-child(3):after{clip-path:inset(50% 50% 0 0);}
            .circleExp .info_list > li:nth-child(3) .cont:after{display: none;}


        @media (max-width:1023px) {
            .circleExp{padding-block: clamp(35px, 6vw, 60px);}
            .circleExp .info_list{flex-direction: column;gap: 60px;}
            .circleExp .info_list > li{&:before, &:after{rotate: 90deg;}}
            .circleExp .info_list .cont{&:before, &:after{width: 22px;border-width: 4px;}}
            .circleExp .info_list .cont:before{top: auto;left:50%;bottom: 100%;translate: -50% 50%;}
            .circleExp .info_list .cont:after{top: 100%;left:50%;translate: -50% -50%;}
            .circleExp .info_list .desc dt{width: 50px;height: 50px;}
            .circleExp .info_list .desc:before{top: 100%;left:50%;margin:0 0 0 -1px;width: 2px;height: 60px;}
        }
        @media (max-width:360px) {
            .circleExp .info_list .cont{padding:15px; width: calc(100% - 30px); height: calc(100% - 30px);}
            .circleExp .info_list .desc{padding:15px;}
        }

/*───────────────────────────────────────────────────────────
	
    Board

───────────────────────────────────────────────────────────*/
    /* 검색 */
        #wrap .search_wrap{position: relative;font-size: var(--title-20);padding-top: 20px;margin-bottom: 60px;}
        #wrap .search_wrap .sec_list{border: 2px solid var(--black-color01);border-radius: var(--radius-10);background: var(--point-white);display: flex;width: fit-content;box-sizing: border-box;margin-inline: auto;}
        #wrap .search_wrap .sec_list > li{position: relative; display: flex; width: 100%;}
        #wrap .search_wrap .sec_list > li:has(input[type="checkbox"]) { flex-shrink: 0; width: fit-content; }
        #wrap .search_wrap .sec_list > li:has(input[type="checkbox"]):nth-child(1) span { padding-right: 0; }
        #wrap .search_wrap .sec_list > li:has(input[type="checkbox"]):nth-child(1)::before { display: none; }
        #wrap .search_wrap .sec_list > li:has(input[type="checkbox"]) span { box-sizing: border-box; padding-inline: 22px; display: inline-flex; align-items: center; height: 56px; font-size: 90%;font-weight: 700;color: var(--black-color03);border: 0;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing: border-box;background: none;height: 56px;line-height: normal;letter-spacing: -0.03em; }
        
        #wrap .search_wrap .sec_list > li:not(:last-child):before{position: absolute; content:''; width: 1px; height: 14px; background: var(--border-color01); top:50%; right:0; translate: 0 -50%;}
        #wrap .search_wrap :where(input[type="text"], select){padding-inline: 22px;font-size: 95%;font-weight: 500;color: var(--black-color03);border: 0;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing: border-box;background: none;height: 56px;line-height: normal;letter-spacing: -0.03em;}
        #wrap .search_wrap [type="text"]::placeholder{font-weight: 400; color: var(--black-color09);}
        #wrap .search_wrap select{width: 160px;border: 0;appearance: none;padding-right: 50px;background: url('../images/sub/sel_arw.svg') no-repeat calc(100% - 26px) 50%;}
        #wrap .search_wrap [type="text"]{width: 400px;}
        #wrap .search_wrap button{width: 58px;height: 56px;background: none;padding: 15px;box-sizing: border-box;flex-shrink: 0;}

        @media (max-width:1023px){
            #wrap .search_wrap{padding-top: clamp(0px, 2vw, 20px);margin-bottom: clamp(30px, 6vw, 60px);}
            #wrap .search_wrap .sec_list{width: 100%;}
            #wrap .search_wrap .sec_list > li{width: clamp(115px, 16.5vw, 160px);flex-shrink: 0;}
            #wrap .search_wrap .sec_list > li:has([type="text"]){width: 100%; flex-shrink: unset;}
            #wrap .search_wrap .sec_list > li:has(button){width: auto;}
            #wrap .search_wrap .sec_list > li:not(:last-child):before{height: clamp(12px, 1.9vw, 14px);}
            #wrap .search_wrap .sec_list > li:has(input[type="checkbox"]) span { padding-inline: clamp(20px, 2.2vw, 22px); height: clamp(48px, 6.1vw, 56px); }
            #wrap .search_wrap :where(input[type="text"], select){padding-inline: clamp(20px, 2.2vw, 22px);height: clamp(48px, 6.1vw, 56px);}
            #wrap .search_wrap select{background-position: calc(100% - clamp(20px, 2.6vw, 26px));padding-right: clamp(42px, 5vw, 50px);width: 100%;}
            #wrap .search_wrap [type="text"]{width: 100%;}
            #wrap .search_wrap button{width: clamp(48px, 6.1vw, 58px);height: clamp(48px, 6.1vw, 56px);}
        }
        @media (max-width:431px){
            #wrap .search_wrap .sec_list{flex-wrap: wrap;}
            #wrap .search_wrap .sec_list > li{width: 100%; flex-shrink: unset;}
            #wrap .search_wrap .sec_list > li:not(:has([type="text"])):before{display: none;}
            #wrap .search_wrap .sec_list > li:has([type="text"]){width: calc(100% - 48px);}
            #wrap .search_wrap select{height: 48px;}
        }

    /* 갤러리 */
        .no_data{text-align: center; font-size: var(--title-18); font-weight: 400; color: var(--black-color05); padding-block: 50px;}

        /* S_2025.10.23_고객스토리 리스트에 4개씩 보이도록 수정 - 이수용 */
        .list_gallery{display: grid;grid-template: auto / repeat(4, 1fr);gap: clamp(15px, 1.6vw, 28px);}
        /*.list_gallery{display: grid;grid-template: auto / repeat(4, 1fr);gap: clamp(15px, 1.6vw, 28px);}*/
        /* E_2025.10.23_고객스토리 리스트에 4개씩 보이도록 수정 - 이수용 */


        .list_gallery > li{position: relative;border-radius: var(--radius-15);}
            .list_gallery > li:before{position: absolute;content:'';inset: 0;box-shadow: inset 0 0 0 1px var(--border-color01);transition: all 0.4s;z-index: 1;border-radius: inherit;pointer-events: none;}
        .list_gallery .link{position: absolute; inset: 0; z-index: 5;}
        .list_gallery .desc{font-size: var(--title-20);}
        .list_gallery .desc dt{position: relative;display: flex;align-items: center;justify-content: center;width: 100%;aspect-ratio: auto 1.33;}
        .list_gallery .desc dd{font-size: 130%; font-weight: 600; color: var(--black-color03); line-height: 1.39; padding:34px 30px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

            /* over */
                @media (hover:hover) and (pointer:fine) {
                    .list_gallery > li:hover:before{box-shadow: inset 0 0 0 2px var(--point-color01), var(--shadow-03);}
                }

        @media (max-width:1023px) {
            .list_gallery .desc dd{font-size: 120%;padding: clamp(22px, 3.4vw, 34px) clamp(20px, 3vw, 30px);}
        }
        @media (max-width:860px) {
            .list_gallery{grid-template: auto / repeat(2, 1fr);}
        }
        @media (max-width:640px) {
            .list_gallery .desc dd{font-size: 110%;}
        }
        @media (max-width:479px) {
            .list_gallery{grid-template: auto / repeat(1, 1fr);}
        }

    /* 페이징 */
        #wrap .paging {text-align:center;padding:0;line-height:normal;margin: 60px 0 0;box-sizing:border-box;display: flex;justify-content: center;flex-wrap: wrap;gap: 10px;font-size: var(--title-20);}
		#wrap .paging span {display: block;}
		#wrap .paging a {display:inline-flex;align-items:center;justify-content:center;font-size: max(13px, 85%);font-weight: 400;color: var(--black-color08);padding: 2px 8px 0;border:0;box-sizing:border-box;width: auto;min-width: 40px;height: 40px;line-height: 1.2;text-align:center;margin: 0;font-family: var(--font-type02);border-radius: 40px;}
		#wrap .paging :is(.page_num.on a, a.on){color: var(--point-white);background: var(--gradient01);}
		#wrap .paging .arrow a {font-size:0;background:no-repeat center;border: 1px solid var(--border-color01);}
        #wrap .paging .arrow img{display: none;}
        #wrap .paging .arrow:where(.first, .last) a{background-image:url('../images/sub/paging_first.svg');}
        #wrap .paging .arrow:where(.prev, .next) a{background-image:url('../images/sub/paging_prev.svg');}
        #wrap .paging .arrow:where(.next, .last) a{scale: -1 -1;}
		#wrap .paging .arrow.prev a {margin-right:10px;}
		#wrap .paging .arrow.next a {margin-left: 10px;}

        @media (max-width:1023px){
            #wrap .paging{gap: clamp(5px, 1.5vw, 10px); margin-top: clamp(35px, 6vw, 60px);}
            #wrap .paging a{min-width: clamp(32px, 4.5vw, 40px);height: clamp(32px, 4.5vw, 40px); border-radius: clamp(32px, 4.5vw, 40px);}
            #wrap .paging .arrow.prev a {margin-right:clamp(5px, 1vw, 10px);}
            #wrap .paging .arrow.next a {margin-left: clamp(5px, 1vw, 10px);}
        }


    /* 상세 */
        #wrap .bbs_view{position: relative;font-size: var(--title-20);border-bottom: 1px solid var(--border-color01);padding-bottom: 40px;}
        #wrap .bbs_view .view_tit{padding: 50px 0;text-align: center;border: 0;margin: 0;width: 100%;box-sizing: border-box;font-size: var(--title-20);background: none;display: grid;gap: 20px;border-top: 1px solid var(--black-color01);border-bottom: 1px solid var(--border-color01);}
            #wrap .bbs_view .view_tit:after{display: none;}
        #wrap .bbs_view .view_tit h3{font-size: 200%;font-weight: 500;color: var(--black-color01);width: 100%;text-align: inherit;line-height: 1.65;letter-spacing: -0.03em;}
        #wrap .bbs_view .view_tit p{font-size: 90%;font-weight: 400;color: var(--black-color07);width: 100%;text-align: inherit;display: block;box-sizing: border-box;line-height: 1.67;padding: 0;}
        #wrap .bbs_view .view_cont{padding:60px;min-height: 300px;font-size: 95%;font-weight: 400;color: var(--black-color04);line-height: 1.95;letter-spacing: -0.03em;border-bottom: 0;box-sizing: border-box;width: 100%;margin: 0;word-break: keep-all;}
        #wrap .extra_editor_wrap{display: flex;gap: 15px clamp(40px, 3.2vw, 60px);width: 100%;border: 0;box-sizing: border-box;margin: 0;background: var(--gray-bg03);border-radius: var(--radius-10);overflow: hidden;padding: 28px 0;}
        #wrap .extra_editor_wrap h4{position: relative;font-size: 90%;font-weight: 700;color: var(--black-color03);text-align: center;width: 180px;flex-shrink: 0;padding: 0 15px;background: none;box-sizing: border-box;display: flex;align-items: center;justify-content: center;}
        #wrap .extra_editor_wrap h4:before{position: absolute; content:''; width: 1px; height: 12px; background: var(--border-color01); top:50%; right:0; translate: 0 -50%;}
        #wrap .extra_cont{display: flex;flex-direction: column;gap: 12px;padding: 0;font-size: 85%;font-weight: 700;color: var(--black-color07);width: 100%;}
        #wrap .extra_cont span{font-size: inherit;color: inherit;display: block;margin: 0;}
        #wrap .extra_cont span a{color: inherit !important;}


        @media (max-width:1023px){
            #wrap .bbs_view{padding-bottom: clamp(20px, 4vw, 40px);}
            #wrap .bbs_view .view_tit{padding-block: clamp(28px, 5vw, 50px);gap: clamp(10px, 2vw, 20px);}
            #wrap .bbs_view .view_tit h3{font-size: 180%;}
            #wrap .bbs_view .view_cont{padding: clamp(20px, 6vw, 60px);min-height: clamp(180px, 30vw, 300px);}
            #wrap .extra_editor_wrap{padding-block: clamp(20px, 2.8vw, 28px);column-gap: clamp(30px, 4vw, 40px);}
            #wrap .extra_editor_wrap h4{width: clamp(110px, 18vw, 180px);}
        }
        @media (max-width:640px){
            #wrap .bbs_view .view_tit h3{font-size: 160%;}
        }
        @media (max-width:479px){
            #wrap .bbs_view .view_tit h3{font-size: 130%;}
            #wrap .bbs_view .view_cont{font-size: 90%;line-height: 1.7;}
        }
        @media (max-width:360px){
            #wrap .extra_editor_wrap{flex-wrap: wrap;padding-inline: 20px;}
            #wrap .extra_editor_wrap h4{width: 100%;padding-inline: 0;text-align: left;justify-content: flex-start;}
            #wrap .extra_editor_wrap h4:before{display: none;}
        }

    /* 작성하기 */
        #wrap .bbs_write{position: relative;display: block;width: 100%;box-sizing: border-box;border-top: 1px solid var(--black-color01);padding-top: 40px;margin-top: 20px;}
        #wrap .bbs_write :where(tbody, tr, th, td){position: relative;display: block;width: 100%;box-sizing: border-box;background: none;border:0;padding:0;line-height: 1.57;}
        #wrap .bbs_write tbody{display: flex; gap: clamp(15px, 1.1vw, 20px); flex-wrap: wrap;}
        #wrap .bbs_write tr{width: calc(100% / 2 - clamp(15px, 1.1vw, 20px) / 2);display: flex;align-items: center;gap: 18px 0;padding: 19px 30px;border: 1px solid var(--border-color01);border-radius: var(--radius-10);font-size: var(--title-20);}
            #wrap .bbs_write tr:has([name="title"], [name="content"], [name="captcha"]){width: 100%;}
            #wrap .bbs_write tr:has([name="content"]){flex-wrap: wrap;padding-top: 25px;}
            #wrap .bbs_write tr:has([name="content"]) th{width: 100%; flex-shrink: unset; padding-right: 0;}
        #wrap .bbs_write th{width: clamp(140px, 10vw, 160px);flex-shrink: 0;padding-right: 15px;font-size: inherit;font-weight: 500;color: var(--black-color01);letter-spacing: -0.03em;}
        #wrap .bbs_write th em{font-weight: inherit;color: var(--point-color08);}
        #wrap .bbs_write td{width: 100%;font-size: 95%;font-weight: 400;color: var(--black-color03);letter-spacing: -0.03em;line-height: inherit;}
        #wrap .bbs_write label{font-size: inherit; font-weight: inherit; color: inherit;}
        #wrap .bbs_write :where([type="text"], [type="password"], textarea){width: 100%;height: auto;min-width: auto;border: 0;line-height: normal;box-sizing: border-box;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;padding: 0;font-size: inherit;font-weight: inherit;color: inherit;vertical-align: middle;letter-spacing: inherit;margin: 0;}
        #wrap .bbs_write :where([type="text"], [type="password"], textarea)::placeholder{color: var(--black-color09);}
        #wrap .bbs_write textarea{height: 125px;resize: none;}
        #wrap .cap_wrap{display: flex;align-items: center;gap: 30px;}
        #wrap .cap_wrap .controller{display: flex;flex-shrink: 0;gap: 10px;width: 230px;}
        #wrap #captcha_box{width: 100%;aspect-ratio: auto 4.73;border: 1px solid var(--black-color00);border-radius: var(--radius-05);overflow: hidden;box-sizing: border-box;margin: 0;}
        #wrap #captcha_box img{width: calc(100% + 2px) !important;height: calc(100% + 2px) !important;max-width: none;max-height: none;margin: -1px 0 0 -1px;}
        #wrap #refreshCode{font-size: 0;width: 40px;aspect-ratio: auto 1;background:var(--black-color06) url('../images/sub/refreshCode.svg') no-repeat center;border-radius: var(--radius-05);flex-shrink: 0;}
        #wrap .policy_wrap{margin-top: 20px;padding: 30px;border: 1px solid var(--border-color01);border-radius: var(--radius-10);box-sizing: border-box;display: grid;gap: 24px;}

        #wrap .btn_wrap{position: relative;inset: auto;padding: 0;margin: 80px 0 0;display: flex;justify-content: center;gap: 15px;flex-wrap: wrap;}

        @media (max-width:1023px){
            #wrap .bbs_write{margin-top: clamp(0px, 2vw, 20px);padding-top: clamp(25px, 4vw, 40px);}
            #wrap .bbs_write tr{width: 100%;padding-inline: clamp(20px, 3vw, 30px);row-gap: clamp(12px, 2.3vw, 18px);}
            #wrap .bbs_write tr:has([name="content"]){padding-top: clamp(19px, 3vw, 25px);}
            #wrap .bbs_write textarea{height: clamp(100px, 12.5vw, 125px);}
            #wrap .cap_wrap{gap: clamp(15px, 3vw, 30px);}
            #wrap .cap_wrap .controller{width: clamp(200px, 25vw, 230px);}
			#wrap #refreshCode{width:clamp(36px, 4.5vw, 40px);background-size: clamp(12px, 1.9vw, 14px);}
            #wrap .policy_wrap{padding: clamp(20px, 3vw, 30px);margin-top: clamp(15px, 2vw, 20px);gap: clamp(15px, 2.4vw, 24px);}
            #wrap .btn_wrap{margin-top:clamp(40px, 8vw, 80px);}
        }
        @media (max-width:860px){
            #wrap .cap_wrap{flex-wrap: wrap;}
        }
        @media (max-width:479px){
            #wrap .bbs_write tr{flex-wrap: wrap;}
            #wrap .bbs_write th{width: auto; flex-shrink: unset; padding-right: 0;}
        }

    /* 인풋 */
        textarea[readonly]{border-radius: var(--radius-05);width: 100%;height: 150px;font-size: var(--title-17);resize: none;box-sizing: border-box;line-height: 1.6;color: var(--black-color08);letter-spacing: -0.03em;overflow: hidden;overflow-y: auto;background: var(--gray-bg03);border:0;padding: 30px;}
            textarea[readonly]::-webkit-scrollbar {width: auto; }
            textarea[readonly]::-webkit-scrollbar-track {border-left: 4px solid var(--border-color01); margin:10px; cursor: pointer;}
            textarea[readonly]::-webkit-scrollbar-thumb {border-left: 4px solid var(--point-color02); cursor: pointer;}

        label:has([type="checkbox"]){display: flex;align-items: flex-start;gap: 10px;font-size: var(--title-20);font-weight: 500;color: var(--black-color01);line-height: 24px;transition: all 0.4s;cursor: pointer;}
        label:has([type="checkbox"]) em{font-weight: 600;color: var(--point-color08);display: contents;}
        label [type="checkbox"]{position: relative;display: inline-flex;width: 24px;height: 24px;border: 1px solid var(--border-color01);background: var(--point-white);border-radius: var(--radius-05);box-sizing: border-box;transition: inherit;cursor: pointer;flex-shrink: 0;}
            label [type="checkbox"]:before{position: absolute;content:'';width: 12px;aspect-ratio: auto 1.33;background: url('../images/sub/chk_icon.svg') no-repeat center / 100% auto;transition: inherit;top: 50%;left: 50%;translate: -50% -50%;filter: var(--filter-black) opacity(0.2);}
            label [type="checkbox"]:checked{border-color: var(--point-color08);background: var(--point-color08);}
            label [type="checkbox"]:checked:before{filter: var(--filter-white);}

        @media (max-width:1023px){
            textarea[readonly]{padding: clamp(20px, 3vw, 30px);height: clamp(140px, 15.5vw, 150px);} 
            label:has([type="checkbox"]){line-height: clamp(22px, 2.9vw, 24px);}
            label [type="checkbox"]{width: clamp(22px, 2.9vw, 24px);height: clamp(22px, 2.9vw, 24px);}
            label [type="checkbox"]:before{width: clamp(10px, 1.7vw, 12px);}
        }
        @media (max-width:640px){
            textarea[readonly]::-webkit-scrollbar-track {border-width: 3px;}
            textarea[readonly]::-webkit-scrollbar-thumb {border-width: 3px;}
        }