@charset "UTF-8";

@media screen and (max-width:1400px){
    .center {width:calc(100% - 60px);}

    .lnbWrap .lnb.center {width:100%;}
    .lnbWrap .lnb > li.lnb-home {display:none;}

    /* 제품소개 */
    .page11 .productList .product a .itemPic {height:23vw;}

    /* 게시판 */
    /* cne-default */
    .boardPage .galleryList .item .thumb {height:16vw;}
}

@media screen and (max-width:1024px){
    #sub-visual {height:320px;}
    #sub-visual .visualTtlWrap {top:calc(50% + 35px);}
    #sub-visual .visualTtlWrap .visualTtl {font-size:2.75em;}

    #sub-container .pageTtl strong {font-size:2.5em;}

    .article .tabList {margin-bottom:calc(2.5em - 12px);}
    .article .tabList .tab a {font-size:1em;margin-bottom:12px;}

    .article .contTtl {padding-left:18px;}
    .article .contTtl strong {font-size:1.5em;}

    /* page1010 */
    .page1010 .mainWrap {justify-content:center;height:350px;}
    .page1010 .mainWrap .greetingTxt {width:calc(100% - 360px);}
    .page1010 .mainWrap .greetingTxt .top,
    .page1010 .mainWrap .greetingTxt .mid {font-size:1.75em;word-break:keep-all;}
    .page1010 .mainWrap .greetingTxt .btm {word-break:keep-all;}
    .page1010 .mainWrap .greetingTxt .btm br {display:none;}
    .page1010 .mainWrap .ceoPhoto {height:calc(100% - 40px);}

    /* page1011 */
    .page1011 .chart .ceo {width:150px;height:150px;}
    .page1011 .chart .ceo a span {font-size:1.25em;padding-top:56px;}
    .page1011 .chart .ceo a strong {font-size:1em;}
    .page1011 .chart .employee {width:100%;}
    .page1011 .chart .employee::after {width:76%;}
    .page1011 .chart .employee .department {width:24.5%;}
    .page1011 .chart .employee .department > a {font-size:1em;}
    .page1011 .chart .employee .department .team li a {font-size:1em;}

    /* page1012 */
    .page1012 .historyWrap {justify-content:center;}
    .page1012 .historyWrap::before {display:none;}
    .page1012 .historyWrap .period {width:calc(100% - 120px);max-width:none;}
    .page1012 .historyWrap .period:not(:last-child) {margin-bottom:40px;}

    /* page1013 */
    .page1013 .employeeList .employee {width:calc(33% - 10px);}
    .page1013 .employeeList .employee:nth-child(5n) {margin-right:15px;}
    .page1013 .employeeList .employee:nth-child(3n) {margin-right:0;}

    /* page1015 */
    .page1015 .bizWrap .midLogo {width:650px;}
    .page1015 .bizWrap .topList::after {width:68%;}
    .page1015 .bizWrap .topList .bizItem {width:32%;padding:1.5em 1em;}
    .page1015 .bizWrap .topList .bizItem .icon {width:80px;}
    .page1015 .bizWrap .topList .bizItem .itemTtl {font-size:1.125em;padding-bottom:8px;margin-bottom:16px;}
    .page1015 .bizWrap .btmList::after {width:68%;}
    .page1015 .bizWrap .btmList .bizItem {width:32%;padding:1.5em 1em;}
    .page1015 .bizWrap .btmList .bizItem .icon {width:80px;}
    .page1015 .bizWrap .btmList .bizItem .itemTtl {font-size:1.125em;padding-bottom:8px;margin-bottom:16px;}

    /* page1016 */
    .page1016 .flex-table .table-content.bg-type .table-inner.subject .table-title {font-size:1em;}
    .page1016 .recruitStep li .num {font-size:2.25em;}
    .page1016 .recruitStep li .text {font-size:1.125em;}

    /* page1211 */
    .page1211 .siteList .site {width:25%;}

    /* page1310 */
    .page1310 .serviceWrap .managerWrap .employeeList .employee {width:calc((100% / 3) - 12px);margin-left:6px;margin-right:6px;}

    /* page1410 */
    .page1410 .flex-table .table-content.half {width:100%;}
    .page1410 .flex-table .table-content.half:nth-child(2n+1) {padding-right:0;}
    .page1410 .flex-table .table-content.half:nth-child(2n) {padding-left:0;}
    .page1410 .flex-table .table-content .table-inner.input.tel .table-text input:not([type=checkbox],[type=radio],[type=file]) {width:calc((100% - 30px) / 3);}
    .page1410 .flex-table .table-content .table-inner.input.email .table-text input:not([type=checkbox],[type=radio],[type=file]) {width:calc((100% - 24px) / 2);}
    
    /* select 영역이 있을 경우 */
    /* .page1410 .flex-table .table-content .table-inner.input.email .table-text input:not([type=checkbox],[type=radio],[type=file]) {width:calc((100% - 30px) / 3);}
    .page1410 .flex-table .table-content .table-inner.input.email .table-text select {width:calc((100% - 30px) / 3);margin-left:6px;} */

    /* 게시판 */
    .flex-table .table-content.bg-type .table-inner.subject {width:140px;}
    .flex-table .table-content.bg-type .table-inner.detail {width:calc(100% - 140px);}

    /* cne-default */
    .boardPage .galleryList .item {width:calc((100% / 3) - 8px);}
    .boardPage .galleryList .item:nth-child(4n) {margin-right:12px}
    .boardPage .galleryList .item:nth-child(3n) {margin-right:0}
    .boardPage .galleryList .item .thumb {height:21.5vw;}
    .boardPage .galleryList .item .thumb.no-img {background-size:100px;}
}

@media screen and (max-width:768px){
    .product .product-list li div img {
        width: auto;
    }
    .main .main-text p:before {
        bottom:-25px;
        top:inherit
    }
    .main {height: 400px;}
    .product .product-list li {gap:0;}
    .product .product-list li div {width: 130px !important;}
    .center {width:calc(100% - 30px);}

    .lnbWrap {height:48px;}
    .lnbWrap .lnb > li > a {line-height:48px;}
    .lnbWrap .lnb > li .depth2 {top:48px;}

    #sub-container {padding:3.5em 0;}
    #sub-container .pageTtl {margin-bottom:2.25em;}
    #sub-container .pageTtl::before {left:-5px;top:-2px;width:18px;height:3px;}
    #sub-container .pageTtl strong {font-size:2em;}

    .article .contTtl {padding-left:14px;}
    .article .contTtl::before {width:4px;height:4px;border:3px solid var(--color-main);}
    .article .contTtl strong {font-size:1.25em;}

    .pc-mode {display:none;}
    .m-mode {display:block;}

    /* page1010 */
    .page1010 .mainWrap {position:relative;justify-content:flex-end;height:auto;padding:2.5em 2.5em 0;background-size:cover;box-sizing:border-box;}
    .page1010 .mainWrap .greetingTxt {width:100%;margin-bottom:30px;}
    .page1010 .mainWrap .ceoPhoto {height:200px;}

    /* page1012 */
    .page1012 .historyWrap .period {width:100%;}

    /* page1013 */
    .page1013 .employeeList .employee {width:calc(50% - 8px);}
    .page1013 .employeeList .employee:nth-child(5n) {margin-right:16px;}
    .page1013 .employeeList .employee:nth-child(3n) {margin-right:16px;}
    .page1013 .employeeList .employee:nth-child(2n) {margin-right:0;}

    /* page1014 */
    .page1014 .customerList {justify-content:center;}
    .page1014 .customerList .customer {width:calc(50% - 8px);padding:1.125em;margin-bottom:1.5em;}
    .page1014 .customerList .customer:nth-child(4n+1) {margin-right:0;}
    .page1014 .customerList .customer:nth-child(4n+2),
    .page1014 .customerList .customer:nth-child(4n+3) {margin-left:0;margin-right:0;}
    .page1014 .customerList .customer:nth-child(4n+4) {margin-left:0;}
    .page1014 .customerList .customer:nth-child(2n+1) {margin-right:16px;}

    /* page1015 */
    .page1015 .bizWrap {display:flex;justify-content:center;flex-flow:row wrap;}
    .page1015 .bizWrap .midLogo {order:1;width:100%;max-width:560px;padding:0;}
    .page1015 .bizWrap .topList {justify-content:center;order:2;margin-top:40px;margin-bottom:0;}
    .page1015 .bizWrap .topList::after {display:none;}
    .page1015 .bizWrap .topList .bizItem {width:100%;max-width:400px;margin-bottom:40px;}
    .page1015 .bizWrap .topList .bizItem::before {top:-41px;bottom:auto;height:40px;}
    .page1015 .bizWrap .topList .bizItem::after {top:-6px;bottom:auto;}
    .page1015 .bizWrap .btmList {justify-content:center;order:3;margin-top:0;}
    .page1015 .bizWrap .btmList::after {display:none;}
    .page1015 .bizWrap .btmList .bizItem {width:100%;max-width:400px;margin-bottom:40px;}
    .page1015 .bizWrap .btmList .bizItem:last-child {margin-bottom:0;}
    .page1015 .bizWrap .btmList .bizItem::before {top:-41px;bottom:auto;height:40px;}

    /* page1016 */
    .page1016 .recruitStep li {padding:1.5em 0.5em;}
    .page1016 .recruitStep li .num {font-size:2em;}
    .page1016 .recruitStep li .text {font-size:1em;margin-bottom:8px;}
    .page1016 .recruitStep li .icon {width:80px;height:80px;}
    .page1016 .benefitsList li {width:100%;padding:0;}
    .page1016 .benefitsList li:not(:last-child) {margin-bottom:1em;}
    .page1016 .benefitsList li .ttl {font-size:1em;}

    /* page1211 */
    .page1211 .siteList .site {width:50%;}

    /* page1310 */
    .page1310 > .titleWrap {display:none;}
    .page1310 .titleWrap.m-mode {display:flex;flex-flow:row wrap;margin-bottom:1em;}
    .page1310 .titleWrap {justify-content:flex-end;}
    .page1310 .titleWrap .contTtl {order:1;width:100%;margin-bottom:2px;}
    .page1310 .titleWrap .applyBtn {order:3;}
    .page1310 .titleWrap .point-circle {order:2;margin-bottom:0.75em;}
    .page1310 .serviceWrap {justify-content:center;}
    .page1310 .serviceWrap .serviceArea {width:100%;margin-bottom:2em;}
    .page1310 .serviceWrap .serviceArea .serviceMap {max-width:360px;margin:0 auto;}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble::after {top:32px;}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area1 {transform:translate(-47px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area2 {transform:translate(-40px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area3 {transform:translate(-40px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area4 {transform:translate(-55px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area5 {transform:translate(-62px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area6 {transform:translate(-55px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area7 {transform:translate(-78px,-29px);}
    .page1310 .serviceWrap .serviceArea .serviceMap #map-bubble.area8 {transform:translate(-40px,-29px);}
    .page1310 .serviceWrap .managerWrap {width:100%;}
    .page1310 .serviceWrap .managerWrap .employeeList .employee {width:calc(50% - 12px);}
    
    /* page1410 */
    .page1410 .agreement {justify-content:space-between;width:100%;}

    /* 제품소개 */
    .page11 .productTab .tab {width:calc(50% - 6px);margin-right:12px;}
    .page11 .productTab .tab:nth-child(4n) {margin-right:12px;}
    .page11 .productTab .tab:nth-child(2n) {margin-right:0;}
    .page11 .productList .product {width:calc(50% - 9px);}
    .page11 .productList .product:nth-child(3n) {margin-right:18px;}
    .page11 .productList .product:nth-child(2n) {margin-right:0;}
    .page11 .productList .product a .itemPic {height:34vw;margin-bottom:0.75em;}
    .page11 .productList .product a .itemTtl {font-size:1.25em;}
    .page11 .prdImg {height:325px;}
    .page11 .prdImg .viewBtn {width:48px;height:48px;line-height:48px;}

    /* 게시판 */
    .flex-table .table-content.bg-type {width:100%;}
    .flex-table .table-content.bg-type .table-inner.subject {width:100px;}
    .flex-table .table-content.bg-type .table-inner.detail {width:calc(100% - 100px);}

    /* cne-default */
    .boardPage .flex-table .table-content {justify-content:flex-start;}
    .boardPage .flex-table .table-content .table-inner.num {display:none;}
    .boardPage .flex-table .table-content .table-inner.ttl {width:100%;margin-bottom:4px;}
    .boardPage .flex-table .table-content .table-inner.name {position:relative;width:auto;margin-right:16px;}
    .boardPage .flex-table .table-content .table-inner.date {position:relative;width:auto;margin-right:16px;}
    .boardPage .flex-table .table-content .table-inner.hit {width:auto;}

    .boardPage .flex-table .table-content.head-area {display:none;}

    .boardPage .flex-table .table-content .table-inner.name::after,
    .boardPage .flex-table .table-content .table-inner.date::after {content:"";position:absolute;top:50%;right:-8px;display:block;width:1px;height:10px;background-color:var(--mono6);transform:translateY(-50%);}

    .boardPage .flex-table .table-content .table-inner.ttl .table-ttl-link {font-size:1.125em;font-weight:700;}
    .boardPage .flex-table .table-content .table-inner.name .table-text,
    .boardPage .flex-table .table-content .table-inner.date .table-text,
    .boardPage .flex-table .table-content .table-inner.hit .table-text {color:var(--mono4);}
    .boardPage .flex-table .table-content .table-inner.hit .table-text .m-mode {display:inline-block;padding-right:4px;}
    
    .boardPage .galleryList .item {width:calc(50% - 4px);margin-right:8px;}
    .boardPage .galleryList .item:nth-child(4n) {margin-right:8px;}
    .boardPage .galleryList .item:nth-child(3n) {margin-right:8px;}
    .boardPage .galleryList .item:nth-child(2n) {margin-right:0;}
    .boardPage .galleryList .item .thumb {height:32vw;}

    .boardPage .viewWrap .viewHead .viewTtl {font-size:1.75em;}


    .main .main-text p {font-size: 30px;}
    header .header-wrap .logo a {width:70%;}
    header .header-top {    padding: 0;  }
    .allmenu-wrap > ul.allmenu-list > li ul {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }
    .allmenu-wrap > ul.allmenu-list > li > a {
        text-align: center;
        width: 100%;
        border-bottom: 1px solid #d4d4d4;
    }
    .allmenu-wrap > ul.allmenu-list > li ul li {margin-right: 0;}
    .allmenu-wrap > ul.allmenu-list > li ul li a {font-size: 18px;}
    .allmenu-wrap > ul.allmenu-list > li ul {margin-top: 20px;}
    .product {
        flex-direction: column-reverse;
        gap: 50px;
        width: 100%;
        padding: 2em 1em;
        box-sizing: border-box;
    }
    .product-list {
        padding: 2em 1em;
        box-sizing: border-box;
        width: 100% !important;
    }
    
    .product .product-img {
        width: 100%; 
    }
    .top-btn {margin: 0 auto;}

    .page1010 .imgWrap img {
        width: 100%;
    }
    .contact-box {
        flex-direction: column;
        padding: 2em;
        gap: 20px;
    }
    .contact-box div {
        flex-direction: column;
        gap: 20px;
    }
    .page11 .productList {
        flex-direction: column;
        width: 100%;
    }
    .page11 .productList .product a .itemPic {
        height: 250px;
    }
    .page11 .productList .product {margin-bottom: 0;}
    .page11 .productTab {margin-bottom: 0;}
    .page11 .productList .product {width: 100%;}
    footer {margin-top: 50px;}


    .fixed-links {
        bottom: 10%; /* 모바일에서는 조금 더 위로 */
        right: 4%;
        gap: 6px;
        font-size: 14px;
      }
    
      .fixed-links .link {
        width: 120px;
        height: 40px;
        border-radius: 20px;
        gap: 8px;
        padding: 0 6px;
      }
    
      .fixed-links .link .icon-wrap {
        width: 36px;
        height: 36px;
        border-radius: 50%;
      }
    
      .fixed-links .link p {
        font-size: 13px;
        font-weight: 600;
      }
    
      .fixed-links .inquiry {
        height: 40px;
        font-size: 14px;
        border-radius: 20px;
      }

      .logo-item-wrap .logo-item img {
        height: auto;
        width: 100%;
      }
      .page1011 .product-wrap {
        flex-direction: column;
      }
      .page1011 .sub-t {
        font-size: 20px;;
      }
      .page1011 ul.item-list li,
      .page1011 p {
        font-size: 1.1em;
      }
      .page1011 .product-wrap > div img {
        width: 100%;
      }
      .gray-table,.support-table,.lease-table {font-size: 1em;}

      .proc-wrap { padding: 24px; border-radius: 16px; }
      .proc-title { font-size: 18px !important; margin: 16px 0; }
    
      .proc-wrap { padding: 24px; border-radius: 16px; }
      .proc-title { font-size: 18px !important; margin: 16px 0; }
    
      .proc-grid{
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 20px; /* 간격 조금 넉넉하게 */
      }
    
      .proc-grid .step{
        min-height: 72px;
        height: auto;
        padding: 14px 16px;
        font-size: 14px;
        border-radius: 10px;
        position: relative;
      }
      .proc-grid .step small{ font-size: 11px; }
    
      /* 기존 화살표 요소 숨김 */
      .proc-grid .arr{ display:none !important; }
    
      /* 각 step 아래 화살표 표시 (마지막 포함) */
      .proc-grid .step::after{
        content:"";
        position:absolute;
        left:50%;
        bottom:-14px;
        transform:translateX(-50%);
        border-left:7px solid transparent;
        border-right:7px solid transparent;
        border-top:14px solid #1f2a44;
      }
      .proc-grid .step.green::after {
        display: none;
      }
      
    
      /* 단계 순서 재배치 */
      .proc-grid > :nth-child(1)  { order: 1; }  /* 온라인 신청 */
      .proc-grid > :nth-child(3)  { order: 2; }  /* 서류심사 */
      .proc-grid > :nth-child(5)  { order: 3; }  /* 선정통보 */
      .proc-grid > :nth-child(11) { order: 4; }  /* 발주 진행 */
      .proc-grid > :nth-child(9)  { order: 5; }  /* 납품/2차 심사 */
      .proc-grid > :nth-child(7)  { order: 6; }  /* 보조금 지급 */
    
}

@media screen and (max-width:480px){
.product .product-list li {
    flex-direction: column;
    height: 250px;
    gap:20px;
}
.product .product-list li .detail-more {
    margin-left: 0;

}

    .fixed-links {
        bottom: 5% !important;
        right: 3%!important;
        gap: 5px!important;
        font-size: 12px!important;
      }
    
      .fixed-links .link {
        width: 80px;
        height: 36px;
      }
    
      .fixed-links .link .icon-wrap {
        width: 30px;
        height: 30px;
      }
    
      .fixed-links .link p {
        font-size: 12px;
      }
    
      .fixed-links .inquiry {
        width: 80px;
        height: 36px;
        font-size: 12px;
      }

    .center {width:calc(100% - 20px);}

    #sub-visual {height:250px;}
    #sub-visual .visualTtlWrap .visualTtl {font-size:2.25em;}

    .lnbWrap {height:auto;}
    .lnbWrap .lnb > li {width:100%;height:40px;}
    .lnbWrap .lnb > li > a {height:40px;font-size:0.875em;line-height:40px;}
    .lnbWrap .lnb > li .depth2 {top:40px;}
    .lnbWrap .lnb > li .depth2 ul li a {font-size:0.875em;}

    #sub-container {padding:3em 0;}
    #sub-container .pageTtl {margin-bottom:2em;}
    #sub-container .pageTtl strong {font-size:1.75em;}

    /* page1010 */
    .page1010 .mainWrap {padding:30px 30px 0;border-radius:30px 0;}
    .page1010 .mainWrap .greetingTxt .top,
    .page1010 .mainWrap .greetingTxt .mid {font-size:1.25em;}

    /* page1011 */
    .page1011 .chart .ceo {margin-bottom:10px;}
    .page1011 .chart .employee {justify-content:center;}
    .page1011 .chart .employee::after {display:none;}
    .page1011 .chart .employee .department {width:calc(100% - 60px);margin-top:30px;}
    .page1011 .chart .employee .department::after {display:none;}

    /* page1012 */
    .page1012 .historyWrap .period .eventList .event .date {width:100%;padding-bottom:0.25em;margin-bottom:0.375em;border-bottom:1px solid var(--mono7);}
    .page1012 .historyWrap .period .eventList .event .detail {width:100%;}

    /* page1013 */
    .page1013 .employeeList .employee {width:100%;}
    .page1013 .employeeList .employee {margin-right:0;}
    .page1013 .employeeList .employee:nth-child(5n) {margin-right:0;}
    .page1013 .employeeList .employee:nth-child(3n) {margin-right:0;}
    .page1013 .employeeList .employee:nth-child(2n) {margin-right:0;}

    /* page1014 */
    .page1014 .customerList .customer {height:100px;padding:0.25em;}

    /* page1016 */
    .page1016 .recruitStep li {width:50%;}
    .page1016 .recruitStep li:not(:nth-child(2n+1)) {border-right:0;}

    /* page1211 */
    .page1211 .siteList .site {width:100%;padding:0.75em;padding-left:2em;}
    .page1211 .siteList .site::before {left:1.125em;}
    
    /* page1310 */
    .page1310 .serviceWrap .managerWrap .employeeList .employee {width:calc(100% - 12px);}

    /* page1410 */
    .page1410 .agreement {justify-content:flex-end;}
    .page1410 .agreement .checkText {width:100%;margin-bottom:0.5em;word-break:keep-all;}
    .page1410 .agreement .checkBox {margin-left:0;}
    .page1410 .flex-table .table-content .table-inner.label {width:100%;margin-bottom:0.5em;}
    .page1410 .flex-table .table-content .table-inner.input {width:100%;}

    /* 게시판 */
    /* cne-default */
    .boardPage .galleryList .item .thumb.no-img {background-size:80px;}
    .boardPage .galleryList .item .ttl {font-size:1em;}
    
    .boardPage .passWrap .contentWrap .flex-table .table-content .table-inner.label {width:100%;margin-bottom:0.5em;}
    .boardPage .passWrap .contentWrap .flex-table .table-content .table-inner.input {width:100%;}

}