/**************************************************************/
  /**************************************************************/
  /***************************** main ***************************/
  /**************************************************************/
  /**************************************************************/
  /* ----------------------- video visual ----------------------*/
  /* .main_copy {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    left: 50%;
    bottom: 5rem;
    transform: translate(-50%);
    text-align: center;
    z-index: 2;
    color: #fff;
}
.main_copy img {
    margin-bottom: 1.25rem;
}
.main_copy p {
    display: block;
    width: 100%;
    font-size: 1.75rem;
    font-family: var(--main-font);
    font-weight: 600;
    letter-spacing: 1px;
} */


/* 페이지별 헤더 색상 교체 */

/* #header.mainheader {border-bottom: 1px solid var(--c-black-5);}
#header.mainheader .logo a img.on {display: none;}
#header.mainheader .logo a img.off {display: block;}

#header.mainheader.on .top_header .wrap a { color: var(--c-black-1);}
#header.mainheader.on nav #gnb li .nav_dep1 {color: var(--c-black-1);}
#header.mainheader.on .open .join a {color: var(--c-black-3);}
#header.mainheader.on .open .login a {color: var(--c-black-3);}
#header.mainheader.on .open ul li a {color: var(--c-black-3);}

#header.mainheader.on .open ul li a .material-icons-round, #header.mainheader.on .open ul li a .material-icons-outlined {color: var(--c-black-3);} */


.fp-viewing-HOME #header.mainheader .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu.png);}
.fp-viewing-HOME #header.mainheader.on .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-HOME #header.mainheader .menu_area ul li a.searchbtn {background-image: url(../images/common/ic_search.png);}
.fp-viewing-HOME #header.mainheader nav #gnb li .nav_dep1 {color: #fff; text-shadow: 0px 0px 6px rgba(51, 51, 51, 0.6);}
.fp-viewing-HOME #header.mainheader nav #gnb li .nav_dep1 a {color: #fff; }
.fp-viewing-HOME #header .top_header .wrap a {color: #fff;}
.fp-viewing-HOME #header.mainheader.on nav #gnb li .nav_dep1 {color: var(--c-black-1);text-shadow: none;}
.fp-viewing-HOME #header.mainheader .top_header .wrap a {
    color: #fff;
}
.fp-viewing-HOME #header.mainheader.on .top_header .wrap a {
    color: var(--c-black-1);
}

.fp-viewing-SERVICE #header .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-SERVICE #header.on .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-SERVICE #header .menu_area ul li a.searchbtn {background-image: url(../images/common/ic_search_on.png);}
.fp-viewing-SERVICE #header nav #gnb li .nav_dep1 {color: var(--c-black-1); text-shadow: none;}
.fp-viewing-SERVICE #header nav #gnb li .nav_dep1 a {color: var(--c-black-1); }
.fp-viewing-SERVICE #header .top_header .wrap a {color: var(--c-black-1);}
.fp-viewing-SERVICE #header.on nav #gnb li .nav_dep1 {color: var(--c-black-1);text-shadow: none;}
.fp-viewing-SERVICE #header .top_header .wrap a {
    color: var(--c-black-1);
}
.fp-viewing-SERVICE #header.on .top_header .wrap a {
    color: var(--c-black-1);
}

.fp-viewing-NEWS #header .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-NEWS #header.on .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-NEWS #header .menu_area ul li a.searchbtn {background-image: url(../images/common/ic_search_on.png);}
.fp-viewing-NEWS #header nav #gnb li .nav_dep1 {color: var(--c-black-1); text-shadow: none;}
.fp-viewing-NEWS #header nav #gnb li .nav_dep1 a {color: var(--c-black-1); }
.fp-viewing-NEWS #header .top_header .wrap a {color: var(--c-black-1);}
.fp-viewing-NEWS #header.on nav #gnb li .nav_dep1 {color: var(--c-black-1);text-shadow: none;}
.fp-viewing-NEWS #header .top_header .wrap a {
    color: var(--c-black-1);
}
.fp-viewing-NEWS #header.on .top_header .wrap a {
    color: var(--c-black-1);
}

.fp-viewing-SYSTEM #header .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu.png);}
.fp-viewing-SYSTEM #header.on .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-SYSTEM #header .menu_area ul li a.searchbtn {background-image: url(../images/common/ic_search_on.png);}
.fp-viewing-SYSTEM #header nav #gnb li .nav_dep1 {color: #fff; text-shadow: none;}
.fp-viewing-SYSTEM #header nav #gnb li .nav_dep1 a {color: #fff; }
.fp-viewing-SYSTEM #header .top_header .wrap a {color: var(--c-black-1);}
.fp-viewing-SYSTEM #header.on nav #gnb li .nav_dep1 {color: var(--c-black-1);text-shadow: none;}
.fp-viewing-SYSTEM #header .top_header .wrap a {
    color: var(--c-black-1);
}
.fp-viewing-SYSTEM #header.on .top_header .wrap a {
    color: var(--c-black-1);
}

.fp-viewing-FOOTER #header.mainheader {background: #fff;}
.fp-viewing-FOOTER #header.mainheader .menu_area ul li a.btn_ham_menu {background-image: url(../images/common/ic_ham_menu_on.png);}
.fp-viewing-FOOTER #header nav #gnb li .nav_dep1 { color: var(--c-black-1); text-shadow: none;}


/* ------------------- sec basic setting ---------------------*/

.section .inner {
    width: var(--web-width);
    margin: 0 auto;
}

.section .inner .sec_tit {
    text-align: center;
    margin-bottom: 3rem;
}
.section .inner .sec_tit h3 {
    font-size: var(--txt-6xl);
    /* line-height: var(--txt-7xl); */
    font-weight: 500;
    color: var(--c-black-1);
    display: inline-block;
    font-family: var(--sub-font);
}
.section .inner .sec_tit h3 span {
    color: var(--main-color);
    text-transform: uppercase;
    font-family: var(--sub-font);
}
.section .inner .sec_tit p{
    font-size: var(--txt-2xl);
    line-height: var(--txt-3xl);
    color: var(--c-black-1);
    font-weight: 500;
    font-family: var(--sub-font);
}


/* -------------------------- sec1 ---------------------------*/
@keyframes scroll {
    0% {
        transform: translateY(0);
    }

    100% {
        transform: translateY(-20px);
    }
}
.sec1 {
    position: relative;
}
.sec1::before {
    content: "";
    display: block;
    width: 15px;
    height: 135px;
    background: url(../images/main/scrollimg.png) no-repeat center center;
    position: absolute;
    right: 35px;
    top: 65%;
    background-size: cover;
    opacity: 1;
    z-index: 9999;
    animation: scroll .8s infinite alternate;
}

/* .sec1::after {
    content: "Scroll";
    position: absolute;
    left: 50%;
    bottom: 8em;
    font-size: 1rem;
    color: #fff;
    font-weight: 400;
    opacity: 1;
    z-index: 9999;
    margin-left: -0.5rem;
    letter-spacing: 0.5px;
} */
#main_full .section.active::before,
#main_full .section.active::after {
    opacity: 1;
    transition: .8s .6s
}

.section .main_button {
    width: auto;
    height: 32px;
    line-height: 30px;
    padding: 0px 18px;
    border: 1px solid var(--c-black-2);
    border-radius: 16px;
    cursor: pointer;
    color: var(--c-black-2);
    font-family: var(--sub-font);
    font-size: var(--txt-md);
    font-weight: 500;
    letter-spacing: 0.5px;
    transition: .5s
}
.section.sec_project .project_wrap .project .main_button:hover {
    border: 1px solid #ffffff00;
    color: #fff;
    background: var(--main-color);
}

/* -------------------------- sec_service ---------------------------*/

.section.sec_service {
    position: relative;
    background: url(../images/main/service_bg.png) no-repeat center;
}
.section.sec_service .inner {
    margin: 6rem auto 0;
    position: relative;
}
.section.sec_service .main_service {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
    gap: 3.125rem;
    width: 100%;
}
.section.sec_service .main_service .box {
    width: calc((100% - 6.25rem) /3);
    height: 500px;
    border: 1px solid rgb(0 0 0 / 15%);
    border-radius: var(--radius-all-md);
    box-shadow: 10px 10px 30px 0px rgb(0 0 0 / 25%);
    transition: 0.5s;
    position: relative;
    overflow: hidden;
}

.section.sec_service .main_service .box .top {
    width: 100%;
    border-top-left-radius: var(--radius-all-md);
    border-top-right-radius: var(--radius-all-md);
    position: absolute;
    top: 0;
    z-index: 1;
}
.section.sec_service .main_service .box .top .tit {
    padding: 3.125rem;
}
.section.sec_service .main_service .box .top .tit h4 {
    font-size: var(--txt-3xl-1);
    font-weight: 600;
    color: var(--c-black-1);
}
.section.sec_service .main_service .box .top .tit h4 span {
    font-weight: 300;
}
.section.sec_service .main_service .box .top .tit p {
    font-size: var(--txt-lg-2);
    font-weight: 400;
    font-family: var(--sub-font);
    color: var(--c-black-3);
    margin-top: 10px;
}
.section.sec_service .main_service .box .bottom {
    width: 100%;
    height: 238px;
    padding: 1.5rem 3.125rem 2.5rem;
    border-bottom-left-radius: var(--radius-all-md);
    border-bottom-right-radius: var(--radius-all-md);
    position: absolute;
    bottom: 0;
    z-index: 1;
}
.section.sec_service .main_service .box.box01 .bottom {
    /* background: rgba(192, 215, 47, 0.95); */
}
.section.sec_service .main_service .box.box02 .bottom {
    /* background: rgba(64, 202, 224, 1); */
}
.section.sec_service .main_service .box.box03 .bottom {
    /* background: rgba(247, 134, 124, 1); */
}

.section.sec_service .main_service .box .bottom ul {
    border-top: 1px dotted #00000050;
}
.section.sec_service .main_service .box .bottom ul li {
    font-size: var(--txt-lg-2);
    font-weight: 500;
    color: var(--c-black-1);
    border-bottom: 1px dotted #00000050;
    padding: 1rem 0;
    text-shadow: 10px 0px 10px rgba(255, 255, 255, 1);
}
.section.sec_service .main_service .box .bg {
    width: 100%;
    height: 100%;
    padding: 3.125rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-top-left-radius: var(--radius-all-md);
    border-top-right-radius: var(--radius-all-md);
    transition: 0.5s;
}
.section.sec_service .main_service .box:hover .bg {
    transform: scale(1.1);
    transition: 0.5s;
    overflow: hidden;
}
.section.sec_service .main_service .box.box01 .bg {
    background-image: url(../images/main/service_bg01.png?ver=1.0);
    transition: 0.5s;
}
.section.sec_service .main_service .box.box02 .bg {
    background-image: url(../images/main/service_bg02.png?ver=1.0);
}
.section.sec_service .main_service .box.box03 .bg {
    background-image: url(../images/main/service_bg03.png?ver=1.0);
}

/* -------------------------- sec_news ---------------------------*/

.section.sec_news {
    position: relative;
    background: url(../images/main/news_bg.png) no-repeat center;
    z-index: 1;
}
.section.sec_news .inner {
    margin: 5rem auto 0;
}
.sec_news .tab_main-tab {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 3rem;
    margin-top: -1.5rem;
    margin-bottom: 2.5rem;
}
.sec_news .tab_main-tab .tab_main {
    font-size: var(--txt-xl);
    font-weight: 400;
    color: var(--c-black-3);
}
.sec_news .tab_main-tab .tab_main:hover, .sec_news .tab_main-tab .tab_main.active {
    font-weight: 600;
    color: var(--c-black-1);
}
.sec_news .tab_main-cont { display: none; }
.sec_news .tab_main-cont.active { display: block; }
.section.sec_news .news {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #fff;
    padding: 2.5rem 0rem;
    border-radius: var(--radius-all-md);
    border: 1px solid var(--c-black-5);
    position: relative;
}
.section.sec_news .news .box {
    width: calc(100% /4);
    border-left: 1px solid var(--c-black-5);
    padding: 0 2.5rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    cursor: pointer;
}
.section.sec_news .news .box:first-child {
    border-left: none;
}
.section.sec_news .news .box h5 {
    font-size: var(--txt-lg);
    font-weight: 500;
    margin-bottom: 1rem;
}
.section.sec_news .news .box h4 {
    font-size: var(--txt-lg-2);
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    min-height: 72px;
}

.section.sec_news .news .box p.txt {
    font-size: var(--txt-md);
    color: var(--c-black-3);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 1rem 0;
    min-height: 100px;
    line-height: 1.375rem;
}
.section.sec_news .news .box p.date {
    font-weight: 500;
}
.section.sec_news .news .more {
    width: auto;
    border-radius: var(--radius-all-xl);
    padding: 5px 1rem;
    font-size: var(--txt-md);
    font-weight: 400;
    color: var(--c-black-1);
    /* background: var(--c-black-5); */
    /* text-transform: uppercase; */
    display: inline-block;
    text-align: center;
    letter-spacing: 0.5px;
    border: 1px solid var(--c-black-5);
    margin-top: -6px;
    opacity: 0;
    transition: .5s
}
.section.sec_news .news .box:hover .more {
    opacity: 1;
}
.section.sec_news .news .box .more:hover {
    background: var(--c-black-7);
}
.section.sec_news .banner_wrap {
    width: 100%;
    margin-top: 3rem;
    display: flex;
    justify-content: flex-end;
}
.section.sec_news .banner_wrap .banner {
    width: calc(100% / 4);
    min-width: 325px;
    background: var(--main-color);
    padding: 1rem 2.5rem;
    border-radius: var(--radius-all-sm);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    gap: 2rem;
    transition: .5s;
}
.section.sec_news .banner_wrap .banner:hover {
    /* background: rgba(192, 215, 47, 1); */
}
.section.sec_news .banner_wrap .banner h4 {
    font-size: var(--txt-lg-2);
    font-weight: 500;
    color: #fff;
}
.section.sec_news .banner_wrap .banner h4 span {
    font-size: var(--txt-lg);
    font-weight: 400;
    color: var(--c-black-1);
    font-family: var(--sub-font);
    opacity: 0.5;
    margin-left: 1rem;
}
.section.sec_news .banner_wrap .banner img {
    height: 25px;
}

/* -------------------------- sec_system ---------------------------*/

.section.sec_system {
    position: relative;
    background: url(../images/main/system_bg.png?ver=1.0) no-repeat center;
    /* background: var(--main-color); */
}
.section.sec_system .inner {
    margin: 5rem auto 0;
    position: relative;
}
.section.sec_system .inner .sec_tit h3 {
    color: #fff;
}
.section.sec_system .inner .sec_tit h3 span {
    color: #fff;
}
.section.sec_system .inner .banner_wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 3.125rem;
    margin-top: 4rem;
}
.section.sec_system .inner .banner_wrap .banner {
    width: calc((100% - 3.125rem) /2);
    border-radius: var(--radius-all-md);
    box-shadow: 10px 10px 40px 10px rgb(0 0 0 / 25%);
    overflow: hidden;
    position: relative;
    cursor: pointer;
    transition: 0.5s;
    bottom: 0rem;
}
.section.sec_system .inner .banner_wrap .banner .tit {
    position: absolute;
    padding: 3.125rem;
    z-index: 1;
}
.section.sec_system .inner .banner_wrap .banner h4 {
    font-size: var(--txt-4xl);
    font-weight: 500;
    color: var(--c-black-1);
    font-family: var(--sub-font);
    text-shadow: 0px 0px 10px rgba(255,255,255,1);
}

.section.sec_system .inner .banner_wrap .banner p {
    font-size: var(--txt-xl);
    font-weight: 400;
    color: var(--c-black-1);
    font-family: var(--sub-font);
    text-shadow: 0px 0px 6px rgba(255,255,255,1);
}
.section.sec_system .inner .banner_wrap .banner .bg {
    width: 100%;
    height: 360px;
    padding: 3.125rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: var(--radius-all-md);
    transition: 0.5s;
}
.section.sec_system .inner .banner_wrap .banner.banner01 .bg {
    background-image: url(../images/main/banner01_bg.png);
    transition: 0.5s;
}
.section.sec_system .inner .banner_wrap .banner:hover .bg {
    transform: scale(1.1);
    transition: 0.5s;
    overflow: hidden;
}
.section.sec_system .inner .banner_wrap .banner.banner01:hover {
    bottom: 2rem;
}
.section.sec_system .inner .banner_wrap .banner.banner02:hover {
    bottom: 2rem;
}
.section.sec_system .inner .banner_wrap .banner.banner02 .bg {
    background-image: url(../images/main/banner02_bg.png);
}
.section.sec_system .inner .banner_wrap .banner .view {
    width: auto;
    border-radius: var(--radius-all-xl);
    padding: 0.5rem 1.5rem;
    font-size: var(--txt-md-1);
    font-weight: 400;
    color: #fff;
    border: 1px solid #fff;
    display: inline-block;
    text-align: center;
    position: absolute;
    right: 3.125rem;
    bottom: 3.125rem;
    letter-spacing: 0.5px;
    z-index: 1;
    transition: 0.5s;
    font-family: var(--sub-font);
}
.section.sec_system .inner .banner_wrap .banner:hover .view {
    background: rgb(255,255,255,0.9);
    color: var(--c-black-1);
    /* border: 1px solid var(--main-color); */
}

/* 문의하기 */
.contact_top {
    position: fixed;
    bottom: 2rem;
    right: 1.5rem;
    z-index: 9999;
    transition: 0.3s;
    text-align: center;
    cursor: pointer;
   
}
.contact_top .icon {
    width: 42px;
    height: 40px;
    background-image: url(../images/main/contact_icon.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0 auto 10px;
}
.contact_top p {
    color: var(--c-black-1);
    font-size: var(--txt-md);
    font-weight: 500;
    text-align: center;
}
.fp-viewing-HOME .contact_top .icon {
    background-image: url(../images/main/contact_icon_w.png);
}
.fp-viewing-HOME .contact_top p {
    color: #fff;
}
.fp-viewing-SYSTEM .contact_top .icon {
    background-image: url(../images/main/contact_icon_w.png);
}
.fp-viewing-SYSTEM .contact_top p {
    color: #fff;
}
.fp-viewing-FOOTER .contact_top .icon {
    background-image: url(../images/main/contact_icon_w.png);
}
.fp-viewing-FOOTER .contact_top p {
    color: #fff;
}