/*서브*/

.company-intro {width:100%; height:var(--nvh); min-height:400px; /*position:fixed; left:0; top:0; z-index:999;*/ background:var(--white);}
.company-intro .intro-wrap {width:100%; height:100%;}
.company-intro .intro-wrap .conts-wrap {width:100%; height:100%; display:flex; align-items:center; justify-content:center; text-align:center;}
.company-intro .intro-wrap .conts-wrap .conts-box {width:100%; height:100%; position:relative;}
.company-intro .intro-wrap .conts-wrap .conts-box .letter {opacity:0;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts {width:100%; position:absolute; position:absolute; left:0; top:50%; transform:translateY(-50%); /*visibility:hidden;*/}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-1 {font-size:90px; font-weight:500; z-index:10;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-1 span {display:inline-block; transition-timing-function:ease-in-out;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-2 {font-size:56px; font-weight:700; z-index:9;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-3 {height:100%; z-index:8; display:flex; align-items:center; justify-content:center;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-3 .img-box {width:90%; max-width:1520px; height:72.5%; clip-path:inset(100%);}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-3 .img-box span {display:block; width:100%; height:100%; position:relative;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-3 .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-4 {z-index:9; font-size:40px; font-weight:700;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-4 p {position:relative; opacity:0;}
.company-intro .intro-wrap .conts-wrap .conts-box .conts-4 span {color:var(--key-color);}

@media screen and (max-width: 1024px) {
    .company-intro {min-height:100%;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-1 {font-size:80px;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-2 {font-size:48px;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-3 .img-box {width:90%; height:80%;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-4 {font-size:36px;}
}

@media screen and (max-width: 768px) {
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-1 {font-size:72px;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-2 {font-size:40px;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-4 {font-size:32px;}
}

@media screen and (max-width: 480px) {
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-1 {font-size:52px;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-2 {font-size:30px;}
    .company-intro .intro-wrap .conts-wrap .conts-box .conts-4 {font-size:22px;}
}







.contents {width:100%; padding-top:var(--headerH);}
.contents .contents-wrap {width:100%;}
.contents .contents-wrap .section-wrap {width:90%; max-width:var(--conts-w); margin:0 auto;}
.contents section {width:100%; position:relative;}
.contents section .sec-wrap {width:90%; max-width:var(--conts-w); margin:0 auto;}
.contents section .sec-conts {width:100%;}


.contents .page-title {width:100%; height:480px; display:flex; align-items:center; justify-content:center;}
.contents .page-title .page-title-wrap {width:90%; max-width:var(--conts-w); display:flex; align-items:center; justify-content:space-between; gap:var(--gap-24);}
.contents .page-title .page-title-wrap h2 {font-size:90px; font-weight:500; letter-spacing:-2px; line-height:1.2; visibility:hidden;}
.contents .page-title .page-title-wrap h2 span {display:inline-block;}
.contents .page-title .page-title-wrap .nav {display:flex; align-items:center; gap:var(--gap-24); font-size:var(--font-18); font-weight:500; color:var(--gray-9); position:relative; padding-left:calc(var(--gap-32) + (var(--gap-24) / 2) + 5px);}
.contents .page-title .page-title-wrap .nav:before {content:''; width:var(--gap-32); height:var(--gap-32); background:url(/img/conts/icon_home.svg) center no-repeat; background-size:cover; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.contents .page-title .page-title-wrap .nav span {position:relative; min-height:var(--gap-32); display:flex; align-items:center; justify-content:center;}
.contents .page-title .page-title-wrap .nav span:before {content:''; width:3px; height:3px; border-radius:50%; background:var(--gray-9); position:absolute; left:calc(((var(--gap-24) - 3px) / 2) * -1); top:50%; transform:translateY(-50%);}
.contents .page-title .page-title-wrap .nav span:last-child {color:var(--gray-1);}

@media screen and (max-width: 1280px) {
    .contents .page-title {height:420px;}
    .contents .page-title .page-title-wrap h2 {font-size:76px;}
}

@media screen and (max-width: 1024px) {
    .contents .page-title {height:360px;}
    .contents .page-title .page-title-wrap h2 {font-size:62px;}
    .contents .page-title .page-title-wrap .nav span {font-size:var(--font-16);}
}

@media screen and (max-width: 850px) {
    .contents .page-title .page-title-wrap h2 {font-size:54px;}
}

@media screen and (max-width: 768px) {
    .contents .page-title {height:300px;}
    .contents .page-title .page-title-wrap {flex-direction:column-reverse; gap:var(--gap-16);}
    .contents .page-title .page-title-wrap h2 {width:100%; font-size:58px; text-align:left;}
    .contents .page-title .page-title-wrap .nav {width:100%;}
}

@media screen and (max-width: 648px) {
    .contents .page-title .page-title-wrap h2 {font-size:52px;}
    .contents .page-title .page-title-wrap h2 .row {font-size:46px;}
}

@media screen and (max-width: 480px) {
    .contents .page-title {height:240px;}
    .contents .page-title .page-title-wrap h2 {font-size:38px; letter-spacing:-1.5px;}
    .contents .page-title .page-title-wrap h2 .row {font-size:32px;}
}



.contents .com-img-layout {width:100%; position:relative;}
.contents .com-img-layout .img-box {width:100%; aspect-ratio:1520/642; position:relative; z-index:1; overflow:hidden;}
.contents .com-img-layout .img-box span {display:block; width:100%; height:100%; position:relative; transform-origin:50% 50%;}
.contents .com-img-layout .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}

@media screen and (max-width: 768px) {
    .contents .com-img-layout .img-box {aspect-ratio:1520/720;}
}

@media screen and (max-width: 648px) {
    .contents .com-img-layout .img-box {aspect-ratio:1520/820;}
}

@media screen and (max-width: 480px) {
    .contents .com-img-layout .img-box {aspect-ratio:1520/1200;}
}




.contents .com-sec-title {width:100%; display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:var(--gap-40);}
.contents .com-sec-title .head {font-size:var(--font-40); font-weight:500;}
.contents .com-sec-title .conts {font-size:var(--font-22); font-weight:400; color:var(--gray-6);}
.contents .com-sec-title .conts span {font-weight:500; color:var(--gray-1);}

@media screen and (max-width: 1024px) {
    .contents .com-sec-title {flex-direction:column; gap:var(--gap-16);}
}






/* board */
.contents .board-wrap {width:90%; max-width:var(--conts-w); margin:0 auto;}

.contents .board-wrap .list-top {width:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--gap-10); padding-bottom:var(--gap-24); border-bottom:1px solid var(--gray-c4); margin-bottom:var(--gap-60);}
.contents .board-wrap .list-top.typeB {padding-bottom:0; margin-bottom:var(--gap-24); border-bottom:none;}

@media screen and (max-width: 1280px) {
    .contents .board-wrap .list-top {flex-direction:column; gap:var(--gap-40); align-items:flex-start;}
}

@media screen and (max-width: 1024px) {
    .contents .board-wrap .list-top {flex-direction:column; gap:var(--gap-40);}
}

.contents .board-category {max-width:100%;}
.contents .board-category .scroll-wrap {width:100%; overflow-x:auto; -webkit-overflow-scrolling: touch;}
.contents .board-category ul.category-box {width:max-content; display:flex; align-items:center; gap:var(--gap-40);}
.contents .board-category ul.category-box li {width:fit-content; position:relative;}
.contents .board-category ul.category-box li:after {content:''; width:1px; height:var(--gap-16); background:var(--gray-c4); position:absolute; right:calc(var(--gap-40) / 2 * -1); top:50%; transform:translateY(-50%);}
.contents .board-category ul.category-box li:last-child:after {display:none;}
.contents .board-category ul.category-box li a,
.contents .board-category ul.category-box li button {font-size:var(--font-20); font-weight:500; color:var(--gray-9);}
.contents .board-category ul.category-box li.on a,
.contents .board-category ul.category-box li.on button {color:var(--gray-1);}

.contents .board-search {width:320px; height:50px; background:var(--white); border-radius:100px; border:1px solid var(--gray-d9); padding:0 var(--gap-16);}
.contents .board-search .search-wrap {width:100%; height:100%;}
.contents .board-search .search-wrap .search-box {width:100%; height:100%; display:flex; align-items:center;}
.contents .board-search .search-wrap .search-box .input-box {flex-shrink:1; flex-grow:1; height:100%;}
.contents .board-search .search-wrap .search-box .input-box input {width:100%; height:100%; border:none; background:transparent; font-size:var(--font-16);}
.contents .board-search .search-wrap .search-box .input-box input::placeholder {color:var(--gray-9);}
.contents .board-search .search-wrap .search-box .btn-search {width:var(--gap-24); aspect-ratio:1; background:url(/img/conts/icon_search.svg) center no-repeat; background-size:cover; cursor:pointer; font-size:0;}

@media screen and (max-width: 648px) {
    .contents .board-search {width:100%; padding:0 var(--gap-24);}
    .contents .board-search .search-wrap .search-box .btn-search {width:22px;}
}


.contents .board-list {width:100%;}
.contents .board-list .list-tb {width:100%;}


:root {
    --card-tb-gap-h : 30px;
    --card-tb-col-size : 3;
}

@media screen and (max-width: 1280px) {
    :root {
        --card-tb-gap-h : 20px;
    }
}

@media screen and (max-width: 900px) {
    :root {
        --card-tb-col-size : 2;
    }
}

@media screen and (max-width: 768px) {
    :root {
        --card-tb-gap-h : 15px;
    }
}

@media screen and (max-width: 648px) {
    :root {
        --card-tb-col-size : 1;
    }
}

.contents .board-list .card-tb {display:flex; flex-wrap:wrap; gap:var(--gap-80) var(--card-tb-gap-h);}
.contents .board-list .card-tb li.col {width:calc((100% - (var(--card-tb-gap-h) * (var(--card-tb-col-size) - 1))) / var(--card-tb-col-size));}
.contents .board-list .card-tb li.col a {display:block;}
.contents .board-list .card-tb li.col .thumbnail {width:100%; position:relative; overflow:hidden; aspect-ratio:482/271; border-radius:var(--gap-8);}
.contents .board-list .card-tb li.col .thumbnail:after {content:''; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(68,120,166,0.3); opacity:0; transition:opacity 0.5s ease-in-out;}
.contents .board-list .card-tb li.col .thumbnail span {display:block; width:100%; height:100%; position:relative; transform-origin:50% 50%; transition:transform 0.5s ease-in-out;}
.contents .board-list .card-tb li.col .thumbnail span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.contents .board-list .card-tb li.col .conts-box {width:100%; margin-top:var(--gap-24); padding:0 var(--gap-8);}
.contents .board-list .card-tb li.col .conts-box span {display:block; width:100%; font-size:var(--font-16); color:var(--key-color); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.contents .board-list .card-tb li.col .conts-box .title {display:block; width:100%; font-size:var(--font-20); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:var(--gap-8);}
.contents .board-list .card-tb li.col:hover .thumbnail:after {opacity:1;}
.contents .board-list .card-tb li.col:hover .thumbnail span {transform:scale(1.03);}


.contents .board-list .basic-tb {border-top:1px solid var(--gray-c4);}
.contents .board-list .basic-tb li.row {width:100%; border-bottom:1px solid var(--gray-c4);}
.contents .board-list .basic-tb li.row a {display:block; width:100%; height:100%;}
.contents .board-list .basic-tb li.row .list-box {width:100%; padding:var(--gap-50) var(--gap-10); display:flex; align-items:center; justify-content:space-between; flex-direction:row-reverse;}
.contents .board-list .basic-tb li.row .list-box .thumbnail {width:230px; border-radius:var(--gap-8); overflow:hidden;}
.contents .board-list .basic-tb li.row .list-box .thumbnail span {display:block; width:100%; aspect-ratio:229/152; position:relative; transform-origin:50% 50%; transition:transform 0.5s ease-in-out;}
.contents .board-list .basic-tb li.row .list-box .thumbnail span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.contents .board-list .basic-tb li.row .list-box .conts-box {width:70%;}
.contents .board-list .basic-tb li.row .list-box .conts-box span {display:block; font-size:var(--font-16); font-weight:700; color:var(--key-color); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-bottom:var(--gap-16);}
.contents .board-list .basic-tb li.row .list-box .conts-box .title {font-size:var(--font-22); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:color 0.5s ease-in-out;}
.contents .board-list .basic-tb li.row .list-box .conts-box .date {font-size:var(--font-18); font-weight:500; color:var(--gray-9); margin-top:var(--gap-60);}

.contents .board-list .basic-tb li.row .list-box:hover .thumbnail:not(.default) span {transform:scale(1.03);}
.contents .board-list .basic-tb li.row .list-box:hover .conts-box .title {color:var(--key-color);}

@media screen and (max-width: 1024px) {
    .contents .board-list .basic-tb li.row .list-box .thumbnail {width:180px;}
}

@media screen and (max-width: 768px) {
    .contents .board-list .basic-tb li.row .list-box .thumbnail {width:160px;}
}

@media screen and (max-width: 648px) {
    .contents .board-list .basic-tb li.row .list-box {flex-direction:column; align-items:flex-start; gap:var(--gap-24);}
    .contents .board-list .basic-tb li.row .list-box .thumbnail,
    .contents .board-list .basic-tb li.row .list-box .conts-box {width:100%;}
    .contents .board-list .basic-tb li.row .list-box .conts-box .date {margin-top:var(--gap-32);}
}

:root {
    --faq-mark-size : 70px;
}

@media screen and (max-width: 1024px) {
    :root {
        --faq-mark-size : 50px;
    }
}

@media screen and (max-width: 648px) {
    :root {
        --faq-mark-size : 40px;
    }
}

@media screen and (max-width: 480px) {
    :root {
        --faq-mark-size : 25px;
    }
}


.contents .board-list .faq-tb {border-top:1px solid var(--gray-c4);}
.contents .board-list .faq-tb li.row {width:100%; padding:0 var(--gap-10); border-bottom:1px solid var(--gray-c4);}
.contents .board-list .faq-tb li.row .faq-box {width:calc(100% - 30px); padding:var(--gap-60) 0; position:relative; cursor:pointer;}
.contents .board-list .faq-tb li.row .faq-box:before,
.contents .board-list .faq-tb li.row .faq-box:after {content:''; background:var(--gray-1); position:absolute; top:50%; transform:translateY(-50%); transition:0.3s ease-in-out;}
.contents .board-list .faq-tb li.row .faq-box:before {width:20px; height:2px; right:-30px;}
.contents .board-list .faq-tb li.row .faq-box:after {width:2px; height:20px; right:-21px;}
.contents .board-list .faq-tb li.row .faq-box .question-box {width:100%; display:flex; align-items:flex-start; font-size:var(--font-22); font-weight:500;}
.contents .board-list .faq-tb li.row .faq-box .question-box > * {min-height:35px; display:flex; align-items:center;}
.contents .board-list .faq-tb li.row .faq-box .question-box .mark {width:var(--faq-mark-size);}
.contents .board-list .faq-tb li.row .faq-box .question-box .question {width:calc(100% - var(--faq-mark-size));}
.contents .board-list .faq-tb li.row .faq-box .ask-box {width:100%; padding:var(--gap-24) 0 0 var(--faq-mark-size); font-size:var(--font-20); font-weight:400; color:var(--gray-3); line-height:1.6; display:none;}
.contents .board-list .faq-tb li.row .faq-box.active:after {transform:translateY(-50%) rotate(90deg);}
.contents .board-list .faq-tb li.row .faq-box.active .question-box {color:var(--key-color)}

@media screen and (max-width: 1024px) {
    .contents .board-list .faq-tb li.row .faq-box .question-box > * {min-height:30px;}
}
@media screen and (max-width: 768px) {
    .contents .board-list .faq-tb li.row .faq-box:before {width:16px;}
    .contents .board-list .faq-tb li.row .faq-box:after {height:16px; right:-23px;}
    .contents .board-list .faq-tb li.row .faq-box .question-box > * {min-height:28px;}
}

@media screen and (max-width: 480px) {
    .contents .board-list .faq-tb li.row .faq-box {width:calc(100% - 25px);}
    .contents .board-list .faq-tb li.row .faq-box:before {width:12px; right:-25px;}
    .contents .board-list .faq-tb li.row .faq-box:after {height:12px; right:-20px;}
    .contents .board-list .faq-tb li.row .faq-box .question-box > * {min-height:24px;}
}



:root {
    --thumb-tb-gap-h : 50px;
    --thumb-tb-col-size : 4;
}

@media screen and (max-width: 1280px) {
    :root {
        --thumb-tb-gap-h : 20px;
    }
}

@media screen and (max-width: 1024px) {
    :root {
        --thumb-tb-gap-h : 30px;
        --thumb-tb-col-size : 3;
    }
}

@media screen and (max-width: 768px) {
    :root {
        --thumb-tb-gap-h : 15px;
    }
}

@media screen and (max-width: 648px) {
    :root {
        --thumb-tb-gap-h : 20px;
        --thumb-tb-col-size : 2;
    }
}

@media screen and (max-width: 480px) {
    :root {
        --thumb-tb-col-size : 1;
    }
}

.contents .board-list .thumb-tb {display:flex; flex-wrap:wrap; gap:var(--gap-80) var(--thumb-tb-gap-h);}
.contents .board-list .thumb-tb li.col {width:calc((100% - (var(--thumb-tb-gap-h) * (var(--thumb-tb-col-size) - 1))) / var(--thumb-tb-col-size));}
.contents .board-list .thumb-tb li.col a {display:block;}
.contents .board-list .thumb-tb li.col .thumbnail {width:100%; position:relative; overflow:hidden; aspect-ratio:338/455; border-radius:var(--gap-8); border:1px solid #ebebeb;}
.contents .board-list .thumb-tb li.col .thumbnail:after {content:''; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(68,120,166,0.3); opacity:0; transition:opacity 0.5s ease-in-out;}
.contents .board-list .thumb-tb li.col .thumbnail span {display:block; width:100%; height:100%; position:relative; transform-origin:50% 50%; transition:transform 0.5s ease-in-out;}
.contents .board-list .thumb-tb li.col .thumbnail span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.contents .board-list .thumb-tb li.col .subject {display:block; width:100%; font-size:var(--font-22); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:var(--gap-24); text-align:center;}
.contents .board-list .thumb-tb li.col:hover .thumbnail:after {opacity:1;}
.contents .board-list .thumb-tb li.col:hover .thumbnail span {transform:scale(1.03);}

@media screen and (max-width: 1280px) {
    .contents .board-list .thumb-tb li.col .subject {font-size:var(--font-18);}
}






.contents .board-pagination {width:100%; margin-top:calc(var(--gap-60) * 2); display:flex; flex-wrap:wrap; gap:var(--gap-8); align-items:center; justify-content:center;}
.contents .board-pagination a {min-width:var(--gap-32); height:var(--gap-32); display:flex; align-items:center; justify-content:center; border-radius:500px; background:var(--white); font-size:var(--font-16); color:var(--gray-6); font-weight:400; padding:0 5px; position:relative; overflow:hidden;}
.contents .board-pagination a.nav {font-size:0;}
.contents .board-pagination a.nav:before {content:''; width:100%; height:100%; background-position:center; background-repeat:no-repeat; background-size:auto 40%; position:absolute; left:0; top:0;}
.contents .board-pagination a.nav.begin:before,
.contents .board-pagination a.nav.end:before {background-image:url(/img/conts/pagination_arrow_double.svg);}
.contents .board-pagination a.nav.prev:before,
.contents .board-pagination a.nav.next:before {background-image:url(/img/conts/pagination_arrow.svg);}
.contents .board-pagination a.nav.end:before,
.contents .board-pagination a.nav.next:before {transform:scaleX(-1);}
.contents .board-pagination a.on {background:var(--key-color); color:var(--white);}



.contents .board-view {width:100%;}
.contents .board-view .view-tb {width:100%;}
.contents .board-view .view-tb .view-head {width:100%; display:flex; align-items:flex-end; justify-content:space-between; padding-bottom:var(--gap-24); border-bottom:1px solid var(--gray-c4); gap:var(--gap-24);}
.contents .board-view .view-tb .view-head .title-box span {display:block; width:100%; font-size:var(--font-16); font-weight:500; color:var(--key-color); margin-bottom:var(--gap-16);}
.contents .board-view .view-tb .view-head .title-box .title {font-size:var(--font-22); font-weight:700;}
.contents .board-view .view-tb .view-head .date {font-size:var(--font-18); font-weight:500; color:var(--gray-9);}

.contents .board-view .view-tb .view-conts {width:100%; padding:var(--gap-60) 0; font-size:var(--font-18); font-weight:400; line-height:1.6;}
.contents .board-view .view-tb .view-conts .inner {width:90%; margin:0 auto;}
.contents .board-view .view-tb .view-conts img {max-width:100%; display:block;}

@media screen and (max-width: 1200px) {
    .contents .board-view .view-tb .view-head {flex-direction:column;}
    .contents .board-view .view-tb .view-head > * {width:100%;}
}




.contents .board-button {width:100%; margin-top:calc(var(--gap-50) * 2); display:flex; align-items:center; gap:var(--gap-10); flex-wrap:wrap; justify-content:center;}
.contents .board-button .button {flex-basis:120px;}



.contents .board-form {width:100%;}
.contents .board-form .form-tb {width:100%; display:flex; flex-direction:column; gap:var(--gap-40);}
.contents .board-form .form-tb .row {width:100%; display:flex; gap:var(--gap-40) var(--gap-80);}
.contents .board-form .form-tb .row .col {flex:1;}
.contents .board-form .form-tb .row .col .head {width:100%; font-size:var(--font-18); font-weight:500; margin-bottom:var(--gap-8);}
.contents .board-form .form-tb .row .col .head span.required {position:relative;}
.contents .board-form .form-tb .row .col .head span.required:after {content:'*'; color:var(--key-color);}
.contents .board-form .form-tb .row .col .form-box {width:100%;}

@media screen and (max-width: 1280px) {
    .contents .board-form .form-tb .row {flex-direction:column;}
    .contents .board-form .form-tb .row .col {width:100%;}
}


.contents .board-form .input-wrap {width:100%;}
.contents .board-form .input-box {width:100%;}
.contents .board-form .input-box input {width:100%; height:60px; border:solid var(--gray-c4); border-width:0 0 1px 0; background:transparent;}
.contents .board-form .input-box input:focus {border-color:var(--key-color);}

@media screen and (max-width: 768px) {
    .contents .board-form .input-box input {height:54px;}
}

@media screen and (max-width: 480px) {
    .contents .board-form .input-box input {height:48px;}
}

.contents .board-form .text-area-box {width:100%;}
.contents .board-form .text-area-box textarea {width:100%; height:175px; border:1px solid var(--gray-c4); padding:var(--gap-10); resize:none; font-size:var(--font-18); font-weight:400;}
.contents .board-form .text-area-box textarea::-webkit-scrollbar {background:transparent; width:10px;}
.contents .board-form .text-area-box textarea::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.1); cursor:pointer; border-radius:100px;}
.contents .board-form .text-area-box textarea:focus {border-color:var(--key-color);}

.contents .board-form .option-wrap {width:100%;}
.contents .board-form .option-wrap ul.option-box {width:100%; display:flex; align-items:center; gap:var(--gap-16) var(--gap-32); flex-wrap:wrap;}
.contents .board-form .option-wrap ul.option-box li.option {flex-shrink:1;}
.contents .board-form .option-wrap ul.option-box li.option .box-wrap { display:flex; gap:var(--gap-16); flex-wrap:nowrap; align-items:center; max-width:100%;}
.contents .board-form .option-wrap ul.option-box li.option .radio {flex-shrink:1; white-space:nowrap;}
.contents .board-form .option-wrap ul.option-box li.option .input-box {flex-shrink:1; flex-basis:165px;}

.contents .board-form .fix-input-wrap {position:relative;}
.contents .board-form .fix-input-wrap .input-box input {padding-right:var(--gap-24); text-align:right;}
.contents .board-form .fix-input-wrap p {position:absolute; right:0; top:50%; transform:translateY(-50%);}

.contents .board-form .calendar-wrap {position:relative;}
.contents .board-form .calendar-wrap .input-box input {padding-right:var(--gap-24);}
.contents .board-form .calendar-wrap button {width:var(--gap-24); aspect-ratio:1; position:absolute; right:0; top:50%; transform:translateY(-50%);}

@media screen and (max-width: 1024px) {
    .contents .board-form .text-area-box textarea {height:150px;}
}

@media screen and (max-width: 480px) {
    .contents .board-form .text-area-box textarea {height:120px;}
}





/* company */
/*.company {padding-top:var(--nvh);}*/
.company {padding-top:0;}
.company .sec-1 {padding:calc(var(--gap-60) * 3) 0;}
.company .sec-1 .title-box {width:100%; margin-bottom:var(--gap-60);}
.company .sec-1 .title-box .title {width:100%; font-size:var(--font-36); font-weight:500; color:var(--key-color); text-align:center;}
.company .sec-1 .conts-wrap {width:100%;}
.company .sec-1 .conts-wrap .layout-wrap {width:100%; position:relative; display:flex; border:solid #c4c4c4; border-width:1px 0;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box {width:25%; position:relative; cursor:pointer}
.company .sec-1 .conts-wrap .layout-wrap .layout-box:before {content:''; width:1px; height:100%; background:var(--white); position:absolute; left:0; top:0; z-index:11;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box:after {content:''; width:1px; height:98%; background:#c4c4c4; position:absolute; left:0; top:50%; transform:translateY(-50%); z-index:12;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box:first-child:before,
.company .sec-1 .conts-wrap .layout-wrap .layout-box:first-child:after {display:none;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box > .inner {width:100%; position:relative; z-index:10;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap {width:100%; position:relative; z-index:1; aspect-ratio:380/569; transform-style:preserve-3d; transition:transform 0.5s;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card {position:absolute; left:0; top:0; width:100%; height:100%; backface-visibility:hidden;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card span {display:block; width:100%; height:100%; background:var(--white); position:relative;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card.back {transform:rotateY(180deg);}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card.back:after {content:''; width:100%; height:100%; background:rgba(0,0,0,0.3); position:absolute; left:0; top:0;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts {width:100%; height:100%; position:absolute; left:0; top:0; display:flex; align-items:center; justify-content:center; z-index:10;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box {width:90%; text-align:center;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .head {width:100%; font-size:24px; font-weight:700;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .conts {width:100%; margin-top:var(--gap-16); font-size:18px; font-weight:400;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box:hover .card-wrap {transform:rotateY(180deg);}
.company .sec-1 .conts-wrap .layout-wrap .layout-box:hover .card-wrap .card span img {visibility:visible;}
.company .sec-1 .conts-wrap .layout-wrap .layout-box:hover .layout-conts .conts-box {color:var(--white);}

@media screen and (max-width: 1280px) {
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .head {font-size:20px;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .conts {font-size:14px;}
}

@media screen and (max-width: 768px) {
    .company .sec-1 .conts-wrap .layout-wrap {flex-direction:column; border-width:0;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box {width:100%; padding:var(--gap-32) 0; border-bottom:1px solid #c4c4c4;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:before, 
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:after {display:none;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap {aspect-ratio:362/200;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card span img {visibility:hidden;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card.front {display:none;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .card-wrap .card.back {transform:rotateY(0deg);}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts {position:relative; margin-top:var(--gap-24);}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box {width:95%; margin:0 auto; text-align:left;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .head {font-size:var(--font-24);}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .conts {font-size:var(--font-18);}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box .layout-conts .conts-box .conts .br {display:inline-block;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:hover .card-wrap {transform:rotateY(0deg);}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:hover .layout-conts .conts-box {color:var(--gray-1);}

    .company .sec-1 .conts-wrap .layout-wrap .layout-box:nth-child(1) .card-wrap .card.back:after {background:url(/img/conts/company_about_01_mo.png) center no-repeat; background-size:cover;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:nth-child(2) .card-wrap .card.back:after {background:url(/img/conts/company_about_02_mo.png) center no-repeat; background-size:cover;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:nth-child(3) .card-wrap .card.back:after {background:url(/img/conts/company_about_03_mo.png) center no-repeat; background-size:cover;}
    .company .sec-1 .conts-wrap .layout-wrap .layout-box:nth-child(4) .card-wrap .card.back:after {background:url(/img/conts/company_about_04_mo.png) center no-repeat; background-size:cover;}
}



.company .sec-2 {margin-bottom:calc(var(--gap-60) * 3);}
.company .sec-2 .company-story {width:100%; height:var(--nvh); overflow:hidden; position:relative;}
.company .sec-2 .company-story .layout-wrap {width:100%; height:100%; overflow:hidden;}
.company .sec-2 .company-story .layout-wrap .layout-box {width:100%; height:var(--nvh); position:absolute; left:0; top:0; transform:translateY(100%);}
.company .sec-2 .company-story .layout-wrap .layout-box.story-1 {transform:translateY(0);}
.company .sec-2 .company-story .layout-wrap .layout-box > .inner {width:100%; height:100%; position:relative;;}
.company .sec-2 .company-story .layout-wrap .layout-box .img-box {width:100%; height:100%; position:relative; z-index:1;}
.company .sec-2 .company-story .layout-wrap .layout-box .img-box span {display:block; width:100%; height:100%; position:relative; z-index:1;}
.company .sec-2 .company-story .layout-wrap .layout-box .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.company .sec-2 .company-story .layout-wrap .layout-box .img-box .cover {width:100%; height:100%; position:absolute; left:0; top:0; z-index:2; opacity:0;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts {width:100%; height:100%; position:absolute; left:0; top:0; z-index:2;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap {width:100%; height:100%; position:relative;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box {width:100%; height:100%; position:absolute; left:0; top:0; display:flex; align-items:center; justify-content:center;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .conts-inner {width:90%;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .main-title {width:100%; text-align:center; font-size:var(--font-36); font-weight:500; color:var(--sub-key-color); opacity:0;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .head {font-size:46px; font-weight:700; color:var(--white); text-align:center; justify-content:center; opacity:0;}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .line {width:100%; position:relative; overflow:hidden; height:calc((var(--gap-50) * 2) + var(--gap-60));}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .line:after {content:''; width:1px; height:var(--gap-60); background:var(--white); position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .conts {font-size:var(--font-24); font-weight:400; text-align:center; color:var(--white); opacity:0;}

.company .sec-2 .company-story .layout-wrap .layout-box.story-1 .img-box .cover {background:rgba(0,0,0,0.3);}
.company .sec-2 .company-story .layout-wrap .layout-box.story-2 .img-box .cover {background:rgba(0,0,0,0.2);}
.company .sec-2 .company-story .layout-wrap .layout-box.story-3 .img-box .cover {background:rgba(0,0,0,0.4);}

@media screen and (max-width: 1024px) {
    .company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .head {font-size:42px;}
}

@media screen and (max-width: 768px) {
    .company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .head {font-size:40px;}
}

@media screen and (max-width: 480px) {
    .company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .head {font-size:28px;}
    .company .sec-2 .company-story .layout-wrap .layout-box .layout-conts .conts-wrap .conts-box .conts {font-size:var(--font-16);}
}




.company .sec-3 {width:100%; padding:calc(var(--gap-60) * 3) 0;}
.company .sec-3 .social-wrap {width:100%; display:flex; align-items:flex-start; justify-content:space-between; gap:var(--gap-32);}
.company .sec-3 .social-wrap .lf-box {width:42%; max-width:634px;}
.company .sec-3 .social-wrap .rt-box {width:41%; max-width:624px; padding-top:var(--gap-60); display:flex; flex-direction:column; gap:calc(var(--gap-60) * 4);}
.company .sec-3 .social-wrap .lf-box .img-box {width:100%; clip-path:inset(0% 0% 100% 0%);}
.company .sec-3 .social-wrap .lf-box .img-box span {display:block; width:100%; aspect-ratio:634/727; position:relative;}
.company .sec-3 .social-wrap .lf-box .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.company .sec-3 .social-wrap .rt-box .img-wrap {width:100%; position:relative;}
.company .sec-3 .social-wrap .rt-box .img-wrap .img-box {position:relative; z-index:1; clip-path:inset(0% 100% 0% 0%);}
.company .sec-3 .social-wrap .rt-box .img-wrap .img-box span {display:block; width:100%; aspect-ratio:624/288; position:relative;}
.company .sec-3 .social-wrap .rt-box .img-wrap .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.company .sec-3 .social-wrap .rt-box .img-wrap .title-box {font-size:100px; color:rgba(0,0,0,0.06); font-weight:700; letter-spacing:-1px; line-height:1.1; position:absolute; z-index:2; left:-26%; bottom:-60%;}
.company .sec-3 .social-wrap .rt-box .img-wrap .title-box .row:last-child {transform:translateX(41%);}
.company .sec-3 .social-wrap .rt-box .conts-wrap {width:100%; padding:0 var(--gap-32) 0 var(--gap-60);}
.company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box {width:100%;}
.company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box .head {font-size:var(--font-36); font-weight:500; color:var(--key-color);}
.company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box .conts {width:100%; font-size:var(--font-22); font-weight:400; margin-top:var(--gap-16);}
.company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box .conts .row {margin-top:var(--gap-10);}
.company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box .conts .row:first-child {margin-top:0;}

@media screen and (max-width: 1280px) {
    .company .sec-3 .social-wrap .lf-box {width:46%;}
    .company .sec-3 .social-wrap .rt-box {width:44%;}
    .company .sec-3 .social-wrap .rt-box .img-wrap .title-box {font-size:6.2vw; left:-15%;}
    .company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box .conts {font-size:var(--font-18);}
}

@media screen and (max-width: 1024px) {
    .company .sec-3 .social-wrap {flex-direction:column; gap:calc(8.5vw * 2);}
    .company .sec-3 .social-wrap .lf-box {width:65%;}
    .company .sec-3 .social-wrap .rt-box {width:100%; max-width:100%; padding-top:0; gap:calc(var(--gap-40) * 2);}
    .company .sec-3 .social-wrap .rt-box .img-wrap {width:65%; margin-left:auto; margin-right:0;}
    .company .sec-3 .social-wrap .rt-box .img-wrap .title-box {font-size:13.2vw; left:-52%; bottom:auto; top:-80%; line-height:1;}
    .company .sec-3 .social-wrap .rt-box .img-wrap .title-box .row:last-child {transform:translateX(70%);}
    .company .sec-3 .social-wrap .rt-box .conts-wrap {padding:0;}
    .company .sec-3 .social-wrap .rt-box .conts-wrap .conts-box .conts {font-size:var(--font-22);}
}



.company .sec-4 .title-wrap {width:100%; margin-bottom:var(--gap-80); text-align:center;}
.company .sec-4 .title-wrap .title {width:100%; font-size:var(--font-36); font-weight:500; color:var(--key-color);}
.company .sec-4 .title-wrap .conts {font-size:var(--font-22); font-weight:400; margin-top:var(--gap-16);}
.company .sec-4 .talent-wrap {width:100%;}
.company .sec-4 .talent-wrap .talent-box {width:100%; display:flex; justify-content:space-between; gap:var(--gap-8);}
.company .sec-4 .talent-wrap .talent-box li {flex-basis:21%; overflow:hidden; position:relative; cursor:pointer; transition:0.5s ease-in-out;}
.company .sec-4 .talent-wrap .talent-box li .talent-conts {width:100%; height:32.63rem; position:relative;}
.company .sec-4 .talent-wrap .talent-box li .talent-conts .img-box {width:100%; height:100%; position:absolute; left:0; top:0; z-index:1;}
.company .sec-4 .talent-wrap .talent-box li .talent-conts .img-box span {display:block; width:100%; height:100%; position:relative;}
.company .sec-4 .talent-wrap .talent-box li .talent-conts .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box {width:100%; height:100%; display:flex; align-items:flex-end; padding:var(--gap-40); position:absolute; left:0; top:0; z-index:2;}
.company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box .conts {width:100%; font-size:var(--font-20); color:var(--white); font-weight:400; transition:0.5s ease-in-out;}
.company .sec-4 .talent-wrap .talent-box li.on {flex-grow:1;}
.company .sec-4 .talent-wrap .talent-box li.on .talent-conts .conts-box .conts {font-size:var(--font-36); font-weight:700;}

@media screen and (max-width: 1280px) {
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box {padding:20px;}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box .conts {font-size:16px;}
    .company .sec-4 .talent-wrap .talent-box li.on .talent-conts .conts-box .conts {font-size:24px;}
}

@media screen and (max-width: 1024px) {
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box {padding:15px;}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box .conts {font-size:14px;}
}

@media screen and (max-width: 768px) {
    .company .sec-4 .talent-wrap .talent-box {flex-direction:column;}
    .company .sec-4 .talent-wrap .talent-box li {width:100%; flex-basis:100%;}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts {height:100%;}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .img-box {height:auto; aspect-ratio:362/219; position:relative;}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box {padding:var(--gap-32);}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box .conts,
    .company .sec-4 .talent-wrap .talent-box li.on .talent-conts .conts-box .conts {font-size:var(--font-18); font-weight:500;}
    .company .sec-4 .talent-wrap .talent-box li .talent-conts .conts-box .conts .br {display:inline-block;}
}










/* history */
.history .contents-wrap {width:100%; max-width:var(--conts-w); margin:0 auto;}
.history .com-img-layout .img-box:after {content:''; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; left:0; top:0;}
.history .com-img-layout .history-title-conts {width:100%; height:100%; position:absolute; left:0; top:0; display:flex; align-items:center; justify-content:center; z-index:2;}
.history .com-img-layout .history-title-conts .conts-box {width:90%; text-align:center;}
.history .com-img-layout .history-title-conts .conts-box .year {width:100%; font-size:124px; font-weight:400; color:var(--white); letter-spacing:-2px; line-height:1; opacity:0;}
.history .com-img-layout .history-title-conts .conts-box .conts {width:100%; margin-top:var(--gap-24); font-size:var(--font-22); font-weight:400; color:var(--white); opacity:0;}
.history .com-img-layout .history-title-conts .label {width:88px; height:0%; background:var(--key-color); position:absolute; left:50%; top:0; transform:translateX(-50%); display:flex; align-items:flex-end; justify-content:center; padding:0;}
.history .com-img-layout .history-title-conts .label span {font-size:var(--font-18); color:var(--white); font-weight:400; opacity:0;}

@media screen and (max-width: 1280px) {
    .history .com-img-layout .history-title-conts .conts-box .year {font-size:85px;}
    .history .com-img-layout .history-title-conts .conts-box .conts {font-size:var(--font-18);}
}

@media screen and (max-width: 1024px) {
    .history .com-img-layout .history-title-conts .conts-box {padding-top:var(--gap-50);}
    .history .com-img-layout .history-title-conts .conts-box .year {font-size:72px;}
}

@media screen and (max-width: 768px) {
    .history .com-img-layout .history-title-conts .label {width:75px;}
    .history .com-img-layout .history-title-conts .conts-box .year {font-size:64px;}
}

@media screen and (max-width: 648px) {
    .history .com-img-layout .history-title-conts .label {width:70px;}
    .history .com-img-layout .history-title-conts .conts-box .year {font-size:56px;}
}




.history .history-wrap {width:100%; margin-top:var(--gap-50);}
.history .history-wrap .history-category-wrap {width:100%; padding:0 var(--gap-24); transition:0.3s ease-in-out; margin-bottom:calc(var(--gap-80) * 2);}
.history .history-wrap .history-category-wrap.hide {opacity:0;}
.history .history-wrap .history-category-wrap .history-category-inner {width:100%; position:relative; overflow-x:auto;}
.history .history-wrap .history-category-wrap .history-category-inner::-webkit-scrollbar {background:transparent; height:5px; -webkit-overflow-scrolling: touch;}
.history .history-wrap .history-category-wrap .history-category-inner::-webkit-scrollbar-thumb {background:transparent; border-radius:100px;}
.history .history-wrap .history-category-wrap .history-category-inner::-webkit-scrollbar-thumb:hover {background:rgba(0,0,0,0.1);}
.history .history-wrap .history-category-wrap .history-category-inner.fix {background:var(--white); position:fixed; left:0; top:0;}
.history .history-wrap .history-category-wrap .history-category {width:100%;}
.history .history-wrap .history-category-wrap .history-category .category-box {width:fit-content; min-width:100%; display:flex; align-items:center;}
.history .history-wrap .history-category-wrap .history-category .category-box li {flex:1; border-bottom:1px solid var(--gray-c4);}
.history .history-wrap .history-category-wrap .history-category .category-box li a {width:100%; height:60px; display:flex; align-items:center; justify-content:center; padding:0 var(--gap-16); font-size:var(--font-24); font-weight:500; color:var(--gray-9); position:relative;}
.history .history-wrap .history-category-wrap .history-category .category-box li a.on {color:var(--key-color);}
.history .history-wrap .history-category-wrap .history-category .category-box li a.on:after {content:''; width:100%; height:2px; background:var(--key-color); position:absolute; left:0; bottom:0;}

@media screen and (max-width: 768px) {
    .history .history-wrap .history-category-wrap .history-category .category-box li {width:160px; flex-shrink:0;}
    .history .history-wrap .history-category-wrap .history-category .category-box li a {height:54px;}
}

@media screen and (max-width: 480px) {
    .history .history-wrap .history-category-wrap .history-category .category-box li {width:140px;}
    .history .history-wrap .history-category-wrap .history-category .category-box li a {height:50px; font-size:var(--font-20);}
}


.history .history-wrap .history-conts-wrap {width:90%; position:relative; margin:0 auto;}
.history .history-wrap .history-conts-wrap .timeline-wrap {width:100%; display:flex; flex-direction:column; gap:calc(var(--gap-50) * 2); position:relative; z-index:2;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box {width:100%; display:flex;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts {width:50%;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap {width:100%;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year {width:100%; font-size:var(--font-32); font-weight:700; line-height:1.2; margin-bottom:var(--gap-24); position:relative; transition:color 0.3s ease-in-out;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:before {content:''; width:24px; height:24px; border-radius:50%; background:var(--gray-c4); position:absolute; left:-112px; top:50%; transform:translateY(-50%); opacity:0.3; transition:background 0.3s ease-in-out;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:after {content:''; width:10px; height:10px; border-radius:50%; background:var(--gray-c4); position:absolute; left:-105px; top:50%; transform:translateY(-50%); transition:background 0.3s ease-in-out;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box {width:100%;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul {width:100%;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li {width:100%; display:flex; align-items:flex-start; font-size:var(--font-18); font-weight:400; margin-top:var(--gap-16)}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li:first-child {margin-top:0;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .month {width:50px; min-height:30px; display:flex; align-items:center; font-weight:500;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .conts {width:calc(100% - 50px); display:flex; flex-direction:column; gap:5px; line-height:1.4;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .conts span {min-height:30px; display:flex; align-items:center;}

.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(odd) {justify-content:flex-end;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(odd) .timeline-conts {padding-left:100px;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts {padding-right:100px; text-align:right;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:before {left:auto; right:-112px;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:after {left:auto; right:-105px;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .conts-box ul li {flex-direction:row-reverse;}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .conts-box ul li .month,
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .conts-box ul li .conts span {justify-content:flex-end;}

.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box.on .timeline-conts .conts-wrap .year {color:var(--key-color);}
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box.on .timeline-conts .conts-wrap .year:before,
.history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box.on .timeline-conts .conts-wrap .year:after {background:var(--key-color);}



.history .history-wrap .history-conts-wrap .line {width:2px; height:100%; background:var(--gray-c4); position:absolute; left:50%; top:0; transform:translateX(-50%); z-index:1; overflow:hidden;}
.history .history-wrap .history-conts-wrap .line span {display:block; width:100%; height:0; background:var(--key-color); position:relative;}


@media screen and (max-width: 1024px) {
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:before {width:20px; height:20px; left:-90px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:after {width:8px; height:8px; left:-84px;}
    
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(odd) .timeline-conts {padding-left:80px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts {padding-right:80px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:before {left:auto; right:-90px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:after {left:auto; right:-84px;}
}

@media screen and (max-width: 900px) {
    .history .history-wrap .history-conts-wrap .timeline-wrap {padding-left:80px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts {width:100%;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:before {left:-79px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:after {left:-73px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .month {width:40px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .conts {width:calc(100% - 40px);}

    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(odd) .timeline-conts {padding-left:0;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts {padding-right:0; text-align:left;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:before {left:-79px; right:auto;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:after {left:-73px; right:auto;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .conts-box ul li {flex-direction:row;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .conts-box ul li .month,
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .conts-box ul li .conts span {justify-content:flex-start;}

    .history .history-wrap .history-conts-wrap .line {left:10px; transform:none;}
}

@media screen and (max-width: 768px) {
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .month,
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .conts {min-height:26px;}
}

@media screen and (max-width: 480px) {
    .history .history-wrap .history-conts-wrap .timeline-wrap {padding-left:60px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:before {width:18px; height:18px; left:-58px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .year:after {width:6px; height:6px; left:-52px;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .month,
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box .timeline-conts .conts-wrap .conts-box ul li .conts {min-height:24px;}

    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:before {left:-58px; right:auto;}
    .history .history-wrap .history-conts-wrap .timeline-wrap .timeline-box:nth-child(even) .timeline-conts .conts-wrap .year:after {left:-52px; right:auto;}
}


.history-category-fix {width:100%; padding:0 var(--gap-24); position:fixed; left:0; top:0; z-index:200; background:var(--white); opacity:0; visibility:hidden; transition:0.3s ease-in-out;}
.history-category-fix .history-category-inner {width:100%; position:relative; max-width:var(--conts-w); margin:0 auto; overflow-x:auto;}
.history-category-fix .history-category-inner::-webkit-scrollbar {background:transparent;}
.history-category-fix .history-category-inner::-webkit-scrollbar-thumb {background:transparent; border-radius:100px;}
.history-category-fix .history-category-inner::-webkit-scrollbar-thumb:hover {background:rgba(0,0,0,0.1);}
.history-category-fix .history-category-inner.fix {background:var(--white); position:fixed; left:0; top:0;}
.history-category-fix .history-category {width:100%; position:relative;}
.history-category-fix .history-category .category-box {width:fit-content; min-width:100%; display:flex; align-items:center;}
.history-category-fix .history-category .category-box li {flex:1; border-bottom:1px solid var(--gray-c4);}
.history-category-fix .history-category .category-box li a {width:100%; height:60px; display:flex; align-items:center; justify-content:center; padding:0 var(--gap-16); font-size:var(--font-24); font-weight:500; color:var(--gray-9); position:relative;}
.history-category-fix .history-category .category-box li a.on {color:var(--key-color);}
.history-category-fix .history-category .category-box li a.on:after {content:''; width:100%; height:2px; background:var(--key-color); position:absolute; left:0; bottom:0;}
.history-category-fix.show {visibility:visible; opacity:1; transform:translateY(0);}
.history-category-fix.down {visibility:visible; opacity:1; /*transform:translateY(var(--headerH));*/}


@media screen and (max-width: 768px) {
    .history-category-fix .history-category .category-box li {width:160px; flex-shrink:0;}
    .history-category-fix .history-category .category-box li a {height:54px;}
}

@media screen and (max-width: 480px) {
    .history-category-fix .history-category .category-box li {width:140px;}
    .history-category-fix .history-category .category-box li a {height:50px; font-size:var(--font-20);}
}






/* organization */
.organization .contents-wrap {width:100%; max-width:var(--conts-w); margin:0 auto;} 
.organization .organization-wrap {width:100%; margin-top:var(--gap-60);}
.organization .organization-wrap .title-wrap {width:100%; display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:var(--gap-40);}
.organization .organization-wrap .title-wrap .head {font-size:var(--font-40); font-weight:500;}
.organization .organization-wrap .title-wrap .conts {font-size:var(--font-22); font-weight:400; color:var(--gray-6);}
.organization .organization-wrap .title-wrap .conts span {font-weight:500; color:var(--gray-1);}

@media screen and (max-width: 1520px) {
    .organization .organization-wrap {width:90%; margin-left:auto; margin-right:auto;}
}

@media screen and (max-width: 1024px) {
    .organization .organization-wrap .title-wrap {flex-direction:column; gap:var(--gap-16);}
}

:root {
    --org-box-w : 180px;
    --org-box-h : 70px;
    
    --org-ceo-gap : var(--gap-40);

    --org-director-gap : calc(var(--gap-60) * 2);

    --org-department-gap : var(--gap-80);

    --org-dep-gap : var(--gap-40);
}

@media screen and (max-width: 648px) {
    :root {
        --org-box-w : 130px;
        --org-box-h : 60px;
    }
}

@media screen and (max-width: 480px) {
    :root {
        --org-box-w : 84px;
        --org-box-h : 42px;
    }
}


.organization .organization-wrap .org-wrap {width:100%; border-top:1px solid var(--gray-c4); padding:calc(var(--gap-50) * 2) 0;}
.organization .organization-wrap .org-wrap .org-chart {width:100%; max-width:1000px; margin:0 auto;}
.organization .organization-wrap .org-wrap .org-chart .org-box {width:var(--org-box-w); height:var(--org-box-h); border-radius:100px; display:flex; align-items:center; justify-content:center; font-size:var(--font-20); font-weight:500; position:relative; z-index:10;}

.organization .organization-wrap .org-wrap .org-chart .ceo {width:100%; margin-bottom:var(--org-ceo-gap); position:relative;}
.organization .organization-wrap .org-wrap .org-chart .ceo:after {content:''; width:1px; height:var(--org-ceo-gap); background:var(--gray-c4); position:absolute; left:50%; top:100%; transform:translateX(-50%); z-index:0;}
.organization .organization-wrap .org-wrap .org-chart .ceo ul {width:100%; display:flex; align-items:center; justify-content:center;}
.organization .organization-wrap .org-wrap .org-chart .ceo ul li {width:fit-content;}
.organization .organization-wrap .org-wrap .org-chart .ceo ul li .org-box {background:#30516D; color:var(--white);}

.organization .organization-wrap .org-wrap .org-chart .director {width:100%; margin-bottom:var(--org-director-gap); position:relative;}
.organization .organization-wrap .org-wrap .org-chart .director:after {content:''; width:1px; height:calc(var(--org-director-gap) / 2); background:var(--gray-c4); position:absolute; left:50%; top:100%; transform:translateX(-50%); z-index:0;}
.organization .organization-wrap .org-wrap .org-chart .director ul {width:100%; display:flex; align-items:center; justify-content:center;}
.organization .organization-wrap .org-wrap .org-chart .director ul li {width:fit-content;}
.organization .organization-wrap .org-wrap .org-chart .director ul li .org-box {background:var(--key-color); color:var(--white);}

.organization .organization-wrap .org-wrap .org-chart .department {width:100%; position:relative;}
.organization .organization-wrap .org-wrap .org-chart .department:before {content:''; width:calc(100% - (var(--org-box-w) * 2) - var(--gap-24)); height:calc(var(--org-director-gap) / 2); box-sizing:border-box; border:solid var(--gray-c4); border-width:1px 1px 0 1px; position:absolute; left:50%; top:calc((var(--org-director-gap) / 2) * -1); transform:translateX(-50%);}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart {width:100%; display:flex; align-items:flex-start; justify-content:space-between; gap:var(--gap-24);}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep-1 {margin-bottom:var(--org-department-gap); position:relative;}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep-1:after {content:''; width:1px; height:calc(var(--org-department-gap) / 2); background:var(--gray-c4); position:absolute; left:50%; top:100%; transform:translateX(-50%);}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep-1 .org-box {background:#D8E3EC; margin:0 auto;}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep {display:flex; -ms-flex-align:flex-start; gap:var(--gap-24); position:relative;}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep:before {content:''; width:calc(100% - var(--org-box-w)); height:calc((var(--org-department-gap) / 2) + var(--org-box-h) + var(--org-dep-gap)); border:solid var(--gray-c4); border-width:1px 1px 0 1px; position:absolute; left:50%; top:calc((var(--org-department-gap) / 2) * -1); transform:translateX(-50%);}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep li.dep-box .dep-2 {margin-bottom:var(--org-dep-gap); position:relative;}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep li.dep-box .dep-2 .org-box {background:var(--white); border-radius:var(--gap-8); border:1px solid var(--key-color);}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep li.dep-box .depth {background:var(--white); overflow:hidden; border-radius:var(--gap-8); border:1px solid var(--key-color); display:flex; flex-direction:column; position:relative; z-index:10;}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep li.dep-box .depth .org-box {border-bottom:1px solid var(--gray-ed); border-radius:0;}
.organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep li.dep-box .depth .org-box:last-child {border-bottom:none;}

@media screen and (max-width: 900px) {
    .organization .organization-wrap .org-wrap .org-chart {max-width:calc((var(--org-box-w) * 3) + (var(--gap-24) * 2));}
    .organization .organization-wrap .org-wrap .org-chart .department:before {width:calc(var(--org-box-w) + (var(--gap-24) * 2) + (var(--org-box-w) / 2)); height:calc(100% - (var(--org-box-h) * 3) - (var(--gap-24) / 2) - 3px); border-width:1px 0 0 1px; left:calc(var(--gap-24) * -1); transform:none;}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart {flex-direction:column;}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box {width:100%; display:flex; align-items:flex-start; justify-content:center; gap:var(--gap-24);}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep {flex-direction:column;}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep:before {width:calc(100% - var(--gap-24)); border-width:1px 0 1px 1px; left:calc((var(--gap-24) / 2) * -1); top:calc((var(--org-box-h) - 1px) / 2); transform:none; z-index:0;}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep li.dep-box {width:100%; display:flex; align-items:flex-start; gap:var(--gap-24);}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep-1:after {width:calc(var(--org-box-w) + (var(--gap-24) * 2)); height:1px; left:calc((var(--gap-24) - 1px) * -1); top:50%; transform:translateY(-50%);}

    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep.department-dep-1:before {height:calc(100% - (var(--org-box-h) * 4));}
    .organization .organization-wrap .org-wrap .org-chart .department .department-chart li.department-box .dep.department-dep-2:before {height:calc(100% - (var(--org-box-h) * 2));}
}

@media screen and (max-width: 480px) {
    .organization .organization-wrap .org-wrap .org-chart .org-box {font-size:var(--font-16);}
}






/* ci */
.ci .ci-wrap section {width:100%; border-top:1px solid var(--gray-c4); padding-top:var(--gap-24); margin-top:calc(var(--gap-60) * 3);}
.ci .ci-wrap section:first-child {margin-top:0;}
.ci .ci-wrap section .sec-wrap {width:100%;}
.ci .ci-wrap section .sec-title {width:100%; display:flex; align-items:flex-end; gap:var(--gap-16); margin-bottom:var(--gap-60);}
.ci .ci-wrap section .sec-title h3 {font-size:var(--font-36); font-weight:500; line-height:1.2;}
.ci .ci-wrap section .sec-title span {font-size:var(--font-20); font-weight:400; color:var(--gray-9);}

.ci .ci-wrap .symbol .symbol-wrap {width:100%;}
.ci .ci-wrap .symbol .symbol-wrap .conts-box {width:100%;}
.ci .ci-wrap .symbol .symbol-wrap .conts-box em {display:block; font-size:var(--font-20); font-weight:500; margin-bottom:var(--gap-16);}
.ci .ci-wrap .symbol .symbol-wrap .conts-box .conts {font-size:var(--font-18); font-weight:400; color:var(--gray-6);}
.ci .ci-wrap .symbol .symbol-wrap .img-box {width:100%; margin:var(--gap-32) 0 var(--gap-60) 0; aspect-ratio:1520/524; background:var(--gray-f4); display:flex; align-items:center; justify-content:center;}
.ci .ci-wrap .symbol .symbol-wrap .img-box span {display:block; width:18%; max-width:268px; aspect-ratio:268/155; position:relative;}
.ci .ci-wrap .symbol .symbol-wrap .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.ci .ci-wrap .symbol .symbol-wrap .button-box {width:100%; display:flex; align-items:center; justify-content:center; gap:var(--gap-10);}
.ci .ci-wrap .symbol .symbol-wrap .button-box .button {flex-basis:220px; flex-shrink:1;}

@media screen and (max-width: 768px) {
    .ci .ci-wrap .symbol .symbol-wrap .img-box {aspect-ratio:1520/680;}
    .ci .ci-wrap .symbol .symbol-wrap .button-box .button {flex-basis:190px;}
}

@media screen and (max-width: 480px) {
    .ci .ci-wrap .symbol .symbol-wrap .img-box {aspect-ratio:1520/720;}
    .ci .ci-wrap .symbol .symbol-wrap .img-box span {width:25%;}
    .ci .ci-wrap .symbol .symbol-wrap .button-box .button {flex-basis:180px;}
}


.ci .ci-wrap .signature-wrap {width:100%; display:flex; flex-direction:column; gap:var(--gap-60);}
.ci .ci-wrap .signature-wrap .signature-box {width:100%;}
.ci .ci-wrap .signature-wrap .signature-box .head {width:100%; font-size:var(--font-18); color:var(--gray-6); font-weight:500; margin-bottom:var(--gap-10);}
.ci .ci-wrap .signature-wrap .signature-box .conts-box {width:100%;}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb {width:100%; display:flex; align-items:center;}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb li {flex:1;}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb li .obj-box {width:100%}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb li .obj-box span {display:block; width:100%; position:relative; border-radius:var(--gap-8);}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb li .obj-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.basic {gap:var(--gap-24);}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.application {gap:var(--gap-16);}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.basic li .obj-box span {aspect-ratio:747/267; background:#f9f9f9;}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.application li .obj-box span {aspect-ratio:369/170; background:#f9f9f9;}
.ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.application li:nth-child(even) .obj-box span {background:var(--gray-1);}

@media screen and (max-width: 648px) {
    .ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb {flex-wrap:wrap;}
    .ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb li {flex:auto;}
    .ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.basic li {width:100%;}
    .ci .ci-wrap .signature-wrap .signature-box .conts-box ul.signature-tb.application li {width:calc((100% - var(--gap-16)) / 2);}
}



.ci .color-system .color-wrap {width:100%; position:relative;}
.ci .color-system .color-wrap .color-box {width:100%; aspect-ratio:1520/467; background:var(--sub-key-color); position:relative; z-index:1}
.ci .color-system .color-wrap .color-system-conts {width:100%; height:100%; position:absolute; left:0; top:0; z-index:10; display:flex; align-items:flex-end; padding:60px;}
.ci .color-system .color-wrap .color-system-conts ul {width:100%}
.ci .color-system .color-wrap .color-system-conts ul li {width:100%; display:flex; align-items:center; color:var(--white); margin-top:var(--gap-10);}
.ci .color-system .color-wrap .color-system-conts ul li:first-child {margin-top:0;}
.ci .color-system .color-wrap .color-system-conts ul li em {display:block; width:100px; font-size:var(--font-20); font-weight:500;}
.ci .color-system .color-wrap .color-system-conts ul li .conts {width:calc(100% - 100px); display:flex; align-items:center; gap:var(--gap-10); font-size:var(--font-18); font-weight:500;}

@media screen and (max-width: 1024px) {
    .ci .color-system .color-wrap .color-system-conts {padding:var(--gap-32);}
}

@media screen and (max-width: 768px) {
    .ci .color-system .color-wrap .color-box {aspect-ratio:1520/600;}
    .ci .color-system .color-wrap .color-system-conts ul li em {width:80px;}
}

@media screen and (max-width: 480px) {
    .ci .color-system .color-wrap .color-system-conts {padding:var(--gap-24);}
    .ci .color-system .color-wrap .color-box {aspect-ratio:1520/760;}
    .ci .color-system .color-wrap .color-system-conts ul li em {width:70px;}
}







/* business */
.business .business-intro {width:100%;}
.business .business-intro .intro-conts {width:90%; max-width:var(--conts-w); margin:0 auto; border-top:1px solid var(--gray-c4); padding-top:var(--gap-60);}
.business .business-intro .com-img-layout {max-width:var(--conts-w); margin:0 auto;}

:root {
    --business-nav-w : 260px;
}

.business .business-container {width:90%; max-width:var(--conts-w); margin:0 auto; margin-top:var(--gap-80);}
.business .business-container .business-wrap {width:100%; display:flex; align-items:flex-start;}
.business .business-container .business-wrap .navigation {width:var( --business-nav-w); height:100%;}
.business .business-container .business-wrap .navigation .nav-wrap {width:100%; position:relative;/* top:0; transform:translateY(0); transition:transform 0.5s ease-in-out;*/}
.business .business-container .business-wrap .navigation .nav-wrap ul li {width:100%; margin-top:var(--gap-32); cursor:pointer;}
.business .business-container .business-wrap .navigation .nav-wrap ul li:first-child {margin-top:0;}
.business .business-container .business-wrap .navigation .nav-wrap ul li span {font-size:var(--font-18); color:var(--gray-9); font-weight:700; background-image:linear-gradient(var(--key-color), var(--key-color)); background-repeat:no-repeat; background-position:left bottom; background-size:0 2px; transition:background-size 0.3s linear;}
.business .business-container .business-wrap .navigation .nav-wrap ul li.on span {color:var(--key-color); background-size:100% 2px;}

.business .business-container .business-wrap .business-conts-wrap {width:calc(100% - var(--business-nav-w)); display:flex; flex-direction:column; gap:calc(var(--gap-60) * 2) 0;}
.business .business-container .business-wrap .business-conts-wrap .business-box {width:100%;}
.business .business-container .business-wrap .business-conts-wrap .business-box .title-wrap {width:100%; margin-bottom:var(--gap-24);}
.business .business-container .business-wrap .business-conts-wrap .business-box .title-wrap h3 {font-size:var(--font-32); font-weight:500;}
.business .business-container .business-wrap .business-conts-wrap .business-box .title-wrap span {display:block; font-size:var(--font-18); color:var(--gray-6);}

.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap {width:100%; border:solid var(--gray-c4); border-width:1px 0; padding:var(--gap-60) 0;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-inner {width:100%; display:flex; align-items:flex-end; justify-content:space-between; position:relative;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .img-box {width:42%; max-width:520px;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .img-box span {display:block; width:100%; aspect-ratio:520/346; border-radius:var(--gap-8); position:relative; overflow:hidden;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .img-box span img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:cover;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box {width:58%; padding-left:var(--gap-40); display:flex; flex-direction:column; position:absolute; right:0; bottom:0; align-items:flex-end; justify-content:space-between; padding-top:var(--gap-60); height:100%;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box .business-conts {width:100%;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box .business-conts .conts {width:100%; font-size:var(--font-20); font-weight:500; margin-bottom:var(--gap-32);}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box .business-conts .btn-dir {font-size:var(--font-18); width:fit-content; position:relative; padding-right:calc(var(--gap-16) * 2);}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box .business-conts .btn-dir:after {content:''; width:var(--gap-16); height:100%; background:url(/img/com/arrow_dir.svg) center no-repeat; background-size:100% auto; position:absolute; right:0; top:0;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box .tag-wrap {width:100%; display:flex; align-items:center; gap:var(--gap-10); flex-wrap:wrap;}
.business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box .tag-wrap span {width:fit-content; height:32px; border-radius:100px; background:var(--white); border:1px solid var(--gray-c4); display:flex; align-items:center; justify-content:center; font-size:var(--font-14); color:var(--gray-6); font-weight:400; padding:0 var(--gap-16);}

@media screen and (max-width: 1440px) {
    .business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box {padding-top:0;}
}

@media screen and (max-width: 1280px) {
    .business .business-container .business-wrap {flex-direction:column; gap:var(--gap-40);}
    .business .business-container .business-wrap .navigation {width:100%;}
    .business .business-container .business-wrap .navigation .nav-wrap .nav-box {width:100%; overflow-x:auto; -webkit-overflow-scrolling: touch;}
    .business .business-container .business-wrap .navigation .nav-wrap ul {width:max-content; display:flex; gap:var(--gap-32); flex-wrap:nowrap;}
    .business .business-container .business-wrap .navigation .nav-wrap ul li {width:fit-content; margin-top:0; height:50px; display:flex; align-items:center;}
    .business .business-container .business-wrap .navigation .nav-wrap ul span {font-size:var(--font-20);}
    
    .business .business-container .business-wrap .business-conts-wrap {width:100%;}
}

@media screen and (max-width: 900px) {
    .business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-inner {flex-direction:column; gap:var(--gap-24);}
    .business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .img-box {width:100%; max-width:100%;}
    .business .business-container .business-wrap .business-conts-wrap .business-box .conts-wrap .conts-box {width:100%; padding-left:0; position:relative; padding-top:0; gap:var(--gap-60);}
}







/* project */
.project .project-view {width:100%;}
.project .project-view .project-view-box {width:100%; padding:var(--gap-60) var(--gap-40); display:flex; flex-direction:row-reverse; align-items:flex-start; gap:var(--gap-24); justify-content:space-between;}
.project .project-view .project-view-box .photo-wrap {width:55%;}
.project .project-view .project-view-box .photo-wrap .photo-list {width:100%; display:flex; flex-direction:column; gap:10px;}
.project .project-view .project-view-box .photo-wrap .photo-list li {width:100%;}
.project .project-view .project-view-box .photo-wrap .photo-list li span {display:block; width:100%; position:relative; border-radius:var(--gap-8); overflow:hidden;}
.project .project-view .project-view-box .photo-wrap .photo-list li span img {display:block; width:100%; max-width:100%;}

.project .project-view .project-view-box .conts-wrap {width:calc(45% - var(--gap-24));}
.project .project-view .project-view-box .conts-wrap .conts-box {width:100%; transition:0.5s ease-in-out;}
.project .project-view .project-view-box .conts-wrap .conts-box.fix {padding-top:var(--gap-60);}
.project .project-view .project-view-box .conts-wrap .conts-box ul {width:100%; display:flex; flex-direction:column; gap:var(--gap-50);}
.project .project-view .project-view-box .conts-wrap .conts-box ul li {width:100%;}
.project .project-view .project-view-box .conts-wrap .conts-box ul li .head {width:100%; font-size:var(--font-18); font-weight:500; color:var(--gray-9); margin-bottom:var(--gap-16);}
.project .project-view .project-view-box .conts-wrap .conts-box ul li .conts {width:100%; font-size:var(--font-20); font-weight:400;}

@media screen and (max-width: 1024px) {
    .project .project-view .project-view-box {flex-direction:column; padding:var(--gap-60) 0; gap:var(--gap-60);}
    .project .project-view .project-view-box .photo-wrap {width:100%; overflow-x:auto;}
    .project .project-view .project-view-box .photo-wrap::-webkit-scrollbar {background:transparent;}
    .project .project-view .project-view-box .photo-wrap::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.1);}
    .project .project-view .project-view-box .photo-wrap .photo-list {width:fit-content; flex-direction:row;}
    .project .project-view .project-view-box .photo-wrap .photo-list li {width:90vw;}
    .project .project-view .project-view-box .photo-wrap .photo-list li span {aspect-ratio:841/487;}
    .project .project-view .project-view-box .photo-wrap .photo-list li span img {height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:contain;}
    
    .project .project-view .project-view-box .conts-wrap {width:100%;}
}






/* profile */
.profile .com-img-layout {max-width:var(--conts-w); margin:0 auto;}
.profile .profile-wrap {width:90%; max-width:var(--conts-w); margin:0 auto; margin-top:calc(var(--gap-50) * 2);}
.profile .profile-wrap .profile-box {width:100%; display:flex; align-items:center; justify-content:space-between;}
.profile .profile-wrap .profile-box .conts-box {font-size:var(--font-40); font-weight:500;}
.profile .profile-wrap .profile-box .button-box .btn-download {width:288px; aspect-ratio:1; border-radius:50%; background:var(--gray-ed); display:flex; align-items:center; justify-content:center; text-align:center;}
.profile .profile-wrap .profile-box .button-box .btn-download .txt {font-size:var(--font-32); font-weight:500; width:90%; text-align:center;}


@media screen and (max-width: 1280px) {
    .profile .profile-wrap .profile-box .button-box .btn-download {width:250px;}
}

@media screen and (max-width: 1024px) {
    .profile .profile-wrap .profile-box .conts-box {font-size:var(--font-32);}
    .profile .profile-wrap .profile-box .button-box .btn-download {width:230px;}
}

@media screen and (max-width: 768px) {
    .profile .profile-wrap .profile-box {flex-direction:column; gap:var(--gap-40);}
    .profile .profile-wrap .profile-box .conts-box {width:100%; text-align:center;}
    .profile .profile-wrap .profile-box .button-box {width:100%;}
    .profile .profile-wrap .profile-box .button-box .btn-download {width:100%; aspect-ratio:6/1; border-radius:200px;}
    .profile .profile-wrap .profile-box .button-box .btn-download .txt .br {display:inline-block;}
}


@media screen and (max-width: 480px) {
    .profile .profile-wrap .profile-box .conts-box {font-size:var(--font-24);}
    .profile .profile-wrap .profile-box .button-box .btn-download {height:60px; aspect-ratio:unset;}
}






/* contact */
.contact .contact-wrap {width:100%; border-top:1px solid var(--gray-c4); padding:var(--gap-60) 0;}
.contact .contact-wrap .contact-form-wrap {width:100%; display:flex; align-items:flex-start; gap:var(--gap-60); justify-content:space-between;}
.contact .contact-wrap .contact-form-wrap .img-box {width:45%; max-width:680px;}
.contact .contact-wrap .contact-form-wrap .img-box span {width:100%; display:block; aspect-ratio:681/829; position:relative; background:url(/img/conts/contact_img.png) center no-repeat; background-size:cover;}
.contact .contact-wrap .contact-form-wrap .conts-box {width:48%; max-width:720px;}

@media screen and (max-width: 900px) {
    .contact .contact-wrap .contact-form-wrap {flex-direction:column;}
    .contact .contact-wrap .contact-form-wrap .img-box,
    .contact .contact-wrap .contact-form-wrap .conts-box {width:100%; max-width:100%;}
    .contact .contact-wrap .contact-form-wrap .img-box span {aspect-ratio:362/236; background-image:url(/img/conts/contact_img_mo.png);}
}


.contact .agree-wrap {width:100%; margin-top:calc(var(--gap-60) * 2);}
.contact .agree-wrap .head {width:100%; font-size:var(--font-22); font-weight:500; margin-bottom:var(--gap-16);}
.contact .agree-wrap .agree-conts-wrap {width:100%; height:250px; padding:var(--gap-16); border:1px solid var(--gray-c4); overflow-y:auto;}
.contact .agree-wrap .agree-conts-wrap::-webkit-scrollbar {background:transparent; width:10px;}
.contact .agree-wrap .agree-conts-wrap::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.1); cursor:pointer; border-radius:100px;}
.contact .agree-wrap .agree-conts-wrap .agree-conts-box {font-size:var(--font-18); font-weight:400; color:var(--gray-3);}

.contact .agree-wrap .agree-check {width:100%; margin-top:var(--gap-32); display:flex; align-items:center; justify-content:center;}
.contact .agree-wrap .agree-check .check {position:relative; overflow:hidden;}
.contact .agree-wrap .agree-check .check input[type=checkbox] {width:0; height:0; position:absolute; left:0; top:0; visibility:hidden; opacity:0;}
.contact .agree-wrap .agree-check .check input[type=checkbox] + label {display:block; position:relative; padding-left:30px; cursor:pointer;}
.contact .agree-wrap .agree-check .check input[type=checkbox] + label:before {content:''; width:22px; height:22px; border:1px solid #E5E5EC; position:absolute; left:0; top:0; background-size:70% auto; background-position:center; background-repeat:no-repeat;}
.contact .agree-wrap .agree-check .check input[type=checkbox] + label p {min-height:22px; display:flex; align-items:center; font-size:var(--font-16); font-weight:400;}
.contact .agree-wrap .agree-check .check input[type=checkbox] + label p:after {content:'*'; color:var(--key-color); font-weight:500;}
.contact .agree-wrap .agree-check .check input[type=checkbox]:checked + label:before {border-color:var(--key-color); background-image:url(/img/com/icon_check.svg);}

@media screen and (max-width: 768px) {
    .contact .agree-wrap .agree-conts-wrap {height:200px;}
    .contact .agree-wrap .agree-check .check input[type=checkbox] + label {padding-left:28px;}
    .contact .agree-wrap .agree-check .check input[type=checkbox] + label:before {width:20px; height:20px;}
    .contact .agree-wrap .agree-check .check input[type=checkbox] + label p {min-height:20px;}
}

@media screen and (max-width: 480px) {
    .contact .agree-wrap .agree-conts-wrap {height:160px;}
    .contact .agree-wrap .agree-check .check input[type=checkbox] + label {padding-left:20px;}
    .contact .agree-wrap .agree-check .check input[type=checkbox] + label:before {width:16px; height:16px;}
    .contact .agree-wrap .agree-check .check input[type=checkbox] + label p {min-height:16px;}
}


.contact .board-button {margin-top:var(--gap-60);}
.contact .board-button .button {flex-basis:165px;}

@media screen and (max-width: 768px) {
    .contact .board-button .button {flex-basis:135px;}
}

@media screen and (max-width: 480px) {
    .contact .board-button .button {flex-basis:105px;}
}





/* location */
.location .contents-wrap {width:90%; max-width:var(--conts-w); margin:0 auto;}
.location .location-wrap {width:100%;}
.location .location-wrap .map-wrap {width:100%;}
.location .location-wrap .map-wrap .map-box {display:block; aspect-ratio:1520/642; position:relative; z-index:1; overflow:hidden;}
.location .location-wrap .map-wrap .map-box iframe {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}

@media screen and (max-width: 768px) {
    .location .location-wrap .map-wrap .map-box {aspect-ratio:1520/720;}
}

@media screen and (max-width: 648px) {
    .location .location-wrap .map-wrap .map-box {aspect-ratio:1520/820;}
}

@media screen and (max-width: 480px) {
    .location .location-wrap .map-wrap .map-box {aspect-ratio:1520/1200;}
}

:root {
    --location-gap : 100px;
    --locaion-icon-size : 20px;
}

@media screen and (max-width: 1440px) {
    :root {
        --location-gap : 50px;
    }
}




.location .location-wrap .location-info-wrap {width:100%; margin-top:var(--gap-80); background:#fafafa; padding:var(--gap-60) 0; display:flex; position:relative;}
.location .location-wrap .location-info-wrap:before {content:''; width:1px; height:calc(100% - (var(--gap-60) * 2) - (var(--gap-24) * 2)); position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); background:#dfdfdf;}
.location .location-wrap .location-info-wrap > * {width:50%; position:relative;}
.location .location-wrap .location-info-wrap .row-wrap {width:90%; max-width:550px; margin:0 auto; position:relative;}
.location .location-wrap .location-info-wrap .row-wrap .info-row {width:100%; display:flex; align-items:flex-start; gap:var(--gap-80) var(--location-gap); flex-wrap:wrap;}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box .head {width:100%; display:flex; align-items:flex-start; gap:var(--gap-8); margin-bottom:var(--gap-10);}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box .head .icon {width:var(--locaion-icon-size); aspect-ratio:1; background-repeat:no-repeat; background-size:cover; background-position:center;}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box .head p {width:calc(100% - var(--locaion-icon-size) - var(--gap-8)); min-height:var(--locaion-icon-size); display:flex; align-items:center; font-size:var(--font-18); font-weight:500;}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box .conts {width:100%; padding-left:calc(var(--locaion-icon-size) + var(--gap-8)); font-size:var(--font-18); font-weight:500; color:var(--gray-6);}

.location .location-wrap .location-info-wrap .lf-box .row-wrap .info-row .info-box:nth-child(odd) {width:calc((100% - var(--location-gap)) * 0.62);}
.location .location-wrap .location-info-wrap .lf-box .row-wrap .info-row .info-box:nth-child(even) {width:calc((100% - var(--location-gap)) * 0.38);}
.location .location-wrap .location-info-wrap .rt-box .row-wrap .info-row .info-box {width:100%;}

.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box.address .head .icon {background-image:url(/img/conts/icon_map.svg);}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box.tel .head .icon {background-image:url(/img/conts/icon_call.svg);}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box.email .head .icon {background-image:url(/img/conts/icon_email.svg);}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box.fax .head .icon {background-image:url(/img/conts/icon_fax.svg);}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box.bus .head .icon {background-image:url(/img/conts/icon_bus.svg);}
.location .location-wrap .location-info-wrap .row-wrap .info-row .info-box.train .head .icon {background-image:url(/img/conts/icon_train.svg);}

@media screen and (max-width: 1280px) {
    .location .location-wrap .location-info-wrap {flex-direction:column; gap:calc(var(--gap-80) * 2);}
    .location .location-wrap .location-info-wrap:before {display:none;}
    .location .location-wrap .location-info-wrap > * {width:100%;}
    .location .location-wrap .location-info-wrap .row-wrap {max-width:100%;}

    .location .location-wrap .location-info-wrap .lf-box .row-wrap .info-row .info-box:nth-child(odd),
    .location .location-wrap .location-info-wrap .lf-box .row-wrap .info-row .info-box:nth-child(even),
    .location .location-wrap .location-info-wrap .rt-box .row-wrap .info-row .info-box {width:calc((100% - var(--location-gap)) / 2);}

    .location .location-wrap .location-info-wrap .rt-box .row-wrap:before {content:''; width:100%; height:1px; background:#dfdfdf; position:absolute; left:0; top:calc(var(--gap-80) * -1);}
}

@media screen and (max-width: 648px) {
    .location .location-wrap .location-info-wrap .lf-box .row-wrap .info-row .info-box:nth-child(odd),
    .location .location-wrap .location-info-wrap .lf-box .row-wrap .info-row .info-box:nth-child(even),
    .location .location-wrap .location-info-wrap .rt-box .row-wrap .info-row .info-box {width:100%;}
}




/* certification */
.certification .certification-wrap {border-top:1px solid var(--gray-c4); padding:var(--gap-60) 0;}

:root {
    --certification-btn-size : 40px;
    --certification-gap : 30px;
}

@media screen and (max-width: 768px) {
    :root {
        --certification-btn-size : 36px;
        --certification-gap : 20px;
    }
}

@media screen and (max-width: 480px) {
    :root {
        --certification-btn-size : 32px;
        --certification-gap : 15px;
    }
}

.certification-popup {width:calc(95% - (var(--gap-32) * 2)); max-width:calc(430px + (var(--certification-btn-size) * 2) + (var(--certification-gap) * 2)); position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); display:none; z-index:2001;}
.certification-popup.active {display:block;}
.certification-popup .popup-wrap {width:100%; position:relative;}
.certification-popup .popup-wrap .btn-popup-close {width:var(--gap-24); aspect-ratio:1; background:url(/img/com/icon_close_w.svg) center no-repeat; background-size:cover; position:absolute; right:calc(var(--gap-32) * -1); top:calc(var(--gap-32) * -1); font-size:0;}
.certification-popup .popup-wrap .popup-conts-wrap {width:100%; overflow:hidden;}
.certification-popup .popup-wrap .popup-conts-wrap .img-list-wrap {width:100%; position:relative; z-index:1; max-width:calc(100% - (var(--certification-btn-size) * 2) - (var(--certification-gap) * 2)); margin:0 auto; overflow:hidden;}
.certification-popup .popup-wrap .popup-conts-wrap .img-list-wrap .img-list li .img-box {width:100%; max-width:430px; aspect-ratio:432/581; position:relative; border-radius:var(--gap-8); border:1px solid #ebebeb; overflow:hidden; margin:0 auto; background:var(--white);}
.certification-popup .popup-wrap .popup-conts-wrap .img-list-wrap .img-list li .img-box img {display:block; width:100%; height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); object-fit:contain;}
.certification-popup .popup-wrap .popup-conts-wrap .img-list-wrap .img-list li .subject {width:100%; max-width:430px; margin:0 auto; margin-top:var(--gap-24); text-align:center; font-size:var(--font-22); font-weight:500; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; color:var(--white);}
.certification-popup .popup-wrap .popup-conts-wrap .popup-control button {width:var(--certification-btn-size); aspect-ratio:1; background:var(--white); border:1px solid #ebebeb; position:absolute; top:50%; transform:translateY(-50%); font-size:0; cursor:pointer; border-radius:50%; overflow:hidden; z-index:10;}
.certification-popup .popup-wrap .popup-conts-wrap .popup-control button:after {content:''; width:100%; height:100%; height:100%; background:url(/img/com/arrow_left_black.svg) center no-repeat; background-size:40% auto; position:absolute; left:0; top:0;}
.certification-popup .popup-wrap .popup-conts-wrap .popup-control .btn-certification-prev {left:0;}
.certification-popup .popup-wrap .popup-conts-wrap .popup-control .btn-certification-next {right:0;}
.certification-popup .popup-wrap .popup-conts-wrap .popup-control .btn-certification-next:after {transform:scaleX(-1);}

@media screen and (max-width: 1024px) {
    .certification-popup .popup-wrap .popup-conts-wrap .img-list-wrap .img-list li .subject {font-size:var(--font-20);}
}


@media screen and (max-width: 768px) {
    .certification-popup .popup-wrap .popup-conts-wrap .img-list-wrap {max-width:100%;}
    .certification-popup .popup-wrap .popup-conts-wrap .popup-control {width:100%; margin-top:var(--gap-32); display:flex; align-items:center; justify-content:center; gap:var(--gap-16);}
    .certification-popup .popup-wrap .popup-conts-wrap .popup-control button {position:relative; transform:none; left:0; top:0; right:0; bottom:0;}
}


.dim {width:100%; height:var(--nvh); background:rgba(0,0,0,0.7); position:fixed; left:0; top:0; z-index:2000}








@media screen and (max-width: 1024px) {}
@media screen and (max-width: 768px) {}
@media screen and (max-width: 648px) {}
@media screen and (max-width: 480px) {}