/* 서브비쥬얼 */
.sub_visual {position: relative; z-index: 9;}

.sub_visual .title {color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 1280px; width: 100%; }
.sub_visual .title span {padding-left: 130px; position: relative; font-size: 20px;}
.sub_visual .title span::before {content: ''; display: block; position: absolute; width: 100px; top: 50%; transform: translateY(-50%); height: 1px; left: 0; background: #fff;}
.sub_visual .title h2 {font-size: 72px; font-weight: bold;}

.link_wrap {width: 100%; position: absolute; bottom: 0; background: rgba(20,44,87,0.7)}
.link {display: flex; max-width: 1280px; margin: 0 auto; position: relative; width: 100%; align-items: center;}
.link .sub_home {padding-right: 73px; line-height: 1;}

.link .sub_gnb {position: relative; min-width: 300px; padding: 23px 25px; transition: .3s;}
.link .sub_gnb > a {color: #fff; font-size: 18px; line-height: 1; background: url('../img/sub/arr.png') no-repeat; background-size: 12px 8px; background-position: right center; display: block;}
.link .sub_lnb {position: absolute; display: none; background-color: #fff; width: 100%; left: 0; top: 100%;}
.link .sub_lnb li {border: 1px solid #F1F1F1;}
.link .sub_lnb li a {color: #2E2F30; font-size: 16px; padding: 20px 25px; display: block;}

.link .sub_gnb.on {background: #fff;}
.link .sub_gnb.on > a {color: #142C57; background: url('../img/sub/arr_on.png') no-repeat; background-size: 12px 8px; background-position: right center;}
.link .sub_lnb li a:hover {background: #F1F3F6}

@media screen and (max-width:768px){
    .sub_visual .title {padding-left: 20px; padding-right: 20px;}
    .sub_visual .title span {padding-left: 70px; font-size: 15px;}
    .sub_visual .title span::before {width: 55px;}
    .sub_visual .title h2 {font-size: 35px; line-height: 1.2;}

    .link {padding: 0 20px}
    .link .sub_home {padding-right: 0; text-align: center; width: 6%;}

    .link .sub_gnb {min-width: 47%; padding: 18px 20px;}
    .link .sub_gnb > a {font-size: 15px;}

    .link .sub_lnb li a {font-size: 14px;}
}
/* //서브비쥬얼 */

/* company-인증서 */
.comp5 > img {margin: 0 auto;}
.comp5 > img.mo_view {width: 70%;}

.comp5_list {display: flex; flex-wrap: wrap; padding: 120px 0 100px; max-width: 1280px; margin: 0 auto;}
.comp5_list li {width: calc((100% - 190px) / 3); margin-bottom: 100px; margin-right: 95px;}
.comp5_list li:nth-child(3n) {margin-right: 0}
.comp5_list li .img_wrap {border: 1px solid #CCCCCC;}
.comp5_list li .txt_wrap {font-size: 20px; color: #2E2F30; font-weight: bold; padding-top: 34px; text-align: left}

@media screen and (max-width:768px){
    .comp5_list {padding: 60px 10px 50px; justify-content: space-between;}
    .comp5_list li {width: calc((100% - 10px) / 2); margin-bottom: 50px; margin-right: 0;}
    .comp5_list li .txt_wrap {padding-top: 15px; font-size: 17px; width: 90%;}
}

/* company-회사전경 */
.sub_img.comp6 {padding: 100px 0 160px; margin: 0}
.comp6 {position: relative;}
.comp6 > img {margin: 0 auto;}
.comp6 > img.mo_view {width: 50%;}

@media screen and (max-width: 768px){
    .sub_img.comp6 {margin: 27.8vw 0 0; padding: 0}
}

.comp6_list {display: flex; justify-content: space-between; flex-wrap: wrap; padding-top: 120px;}
.comp6_list li {width: calc((100% - 80px) / 3); margin-bottom: 40px; height: auto; min-height: 300px; cursor: pointer;}
.comp6_list li:nth-child(1) {background: url('../img/sub/comp6_img_1.jpg'); background-size: cover; background-position: center}
.comp6_list li:nth-child(2) {background: url('../img/sub/comp6_img_2.jpg'); background-size: cover; background-position: center}
.comp6_list li:nth-child(3) {background: url('../img/sub/comp6_img_3.jpg'); background-size: cover; background-position: center}
/* .comp6_list li:nth-child(4) {background: url('../img/sub/comp6_img_4.jpg'); background-size: cover; background-position: center}
.comp6_list li:nth-child(5) {background: url('../img/sub/comp6_img_5.jpg'); background-size: cover; background-position: center} */
.comp6_list li:nth-child(4) {background: url('../img/sub/comp6_img_6.jpg'); background-size: cover; background-position: center}

.comp6_list_pop_wrap {position: absolute; width: 100%; height: 100%; top: 0; display: none}
.comp6_list_pop_wrap .black_bg {background: rgba(0,0,0,0.7); height: 100%; width: 100%;}
.comp6_list_pop {background: #fff; padding: 20px 100px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.comp6_list_pop li {width: 1000px; height: 750px; background-size: cover; background-position: center;}

.comp6_list_pop .swiper-button-next, .comp6_list_pop .swiper-button-prev {width: 20px; height: 35px;}
.comp6_list_pop .swiper-button-next::after, .comp6_list_pop .swiper-button-prev::after {display: none}
.comp6_list_pop .swiper-button-next {background: url('../img/sub/comp6_pop_arr_right.png') no-repeat; background-size: contain; right: 35px}
.comp6_list_pop .swiper-button-prev {background: url('../img/sub/comp6_pop_arr_left.png') no-repeat; background-size: contain; left: 35px}

.comp6_list_mo {margin: 0 10px; padding: 70px 0 130px}
.comp6_list_mo li {height: auto; min-height: 30vh; background-size: cover; background-position: center}
.comp6_list_mo li img {height: auto; object-fit: cover;}

.comp6_list_mo .swiper-pagination {bottom: 90px}
.comp6_list_mo .swiper-pagination-bullet {background: #7a7a7a; width: 13px; height: 13px;}
.comp6_list_mo .swiper-pagination-bullet-active {background: #142C57}


/* 포트폴리오 - 리스트 */
.port > img {margin: 0 auto;}
.port > img.mo_view {width: 70%;}

.port_list_wrap {padding-bottom: 200px}

.port_cate {border-bottom: 1px solid #142C57; margin: 120px 0 80px}
.port_cate ul {display: flex;}
.port_cate ul li {position: relative;}
.port_cate ul li.on {border-top: 1px solid #142C57; border-right: 1px solid #142C57; border-left: 1px solid #142C57;}
.port_cate ul li.on::after {content: ''; display: block; position: absolute; bottom: -2px; width: 100%; height: 3px; background: #fff;}
.port_cate ul li a {font-size: 20px; color: #AAAAAA; padding: 23px 45px; background: #F9F9F9; display: block; }
.port_cate ul li #bo_cate_on {color: #142C57; background: #fff;}

.port_list {display: flex; align-items: flex-start; flex-wrap: wrap; padding-bottom: 60px; border-bottom: 1px solid #CCCCCC}
.port_list li {width: calc((100% - 20px) / 3); margin-right: 10px; margin-bottom: 40px; position: relative;}
.port_list li:nth-child(3n) {margin-right: 0;}
.port_list li p {font-size: 20px; padding-top: 20px; color: #2E2F30; text-align: center; width: 70%; margin: 0 auto}

@media screen and (max-width: 768px){
    .port > img.mo_view {width: 35%;}

    .port_list_wrap {padding-bottom: 0}
    .port_list {border-bottom: 0}

    .port_cate {border-bottom: 0; margin: 80px 0 50px;}
    .port_cate ul li {border-bottom: 1px solid #142C57; width: 100%}
    .port_cate ul li a {padding: 0; font-size: 12px; text-align: center; padding: 4px;}

    .port_list li {width: 100%; margin-right: 0; margin-bottom: 20px}
    .port_list li p {width: 90%}
    .port_list .img_wrap {display: block; height: 180px;}
    .port_list .img_wrap img {height: 100%; object-fit: cover;}
}


/* 포트폴리오 - 뷰 */
.port_view_wrap {display: flex; margin-top: 50px;}

.port_view_img {width: 50%; overflow: hidden;}
.port_view_img .swiper-container {width: 85%;height: auto; overflow: hidden;}
.port_view_img .gallery-top {height: 80%;width: 100%; margin: 0;}
.port_view_img .gallery-top .swiper-slide {height: auto;}
.port_view_img .gallery-top .swiper-slide > img {height: 100%; object-fit: cover;}
.port_view_img .gallery-thumbs .swiper-wrapper {width: 101%; padding-top: 10px;}
.port_view_img .gallery-thumbs .swiper-slide {width: calc(100% / 3); height: auto; padding-right: 20px;}
.port_view_img .gallery-thumbs .swiper-slide > img {height: 100%; object-fit: cover;}

.port_view_txt {width: 50%; padding-left: 50px;}
.port_view_txt .tit {font-size: 30px; font-weight: bold; line-height: 1.3;}
.port_view_txt .txt_wrap {border-top: 2px solid #000; margin-top: 20px;}
.port_view_txt .txt_wrap li {border-bottom: 1px solid #EEEEEE}
.port_view_txt .txt_wrap li span {display: inline-block; background: #F8F8F8; padding: 20px; min-width: 150px;}
.port_view_txt .txt_wrap li i {font-style: normal; padding-left: 30px; color: #8B8D8F}

.port_view_btn {text-align: center; border-top: 1px solid #CCCCCC; padding: 40px 0 70px; margin-top: 100px}
.port_view_btn span {display: inline-block; padding: 18px 58px; background: #142C57; color: #fff; font-weight: bold; cursor: pointer;}

@media screen and (max-width: 768px){
    .port_view_wrap {flex-direction: column; margin-top: 30px;}

    .port_view_img {width: 100%}
    .port_view_img .gallery-thumbs .swiper-slide {padding-right: 10px; max-height: 60px;}

    .port_view_txt {width: 100%; padding-left: 0; margin-top: 30px;}
    .port_view_txt .tit {font-size: 22px;}
    .port_view_txt .txt_wrap {margin-top: 10px}
    .port_view_txt .txt_wrap li span {min-width: 100px; padding: 10px;}
    .port_view_txt .txt_wrap li i {padding-left: 15px}

    .port_view_btn {border: 0; padding: 20px 40px; margin-top: 50px;}
    .port_view_btn span {font-size: 16px; padding: 12px 40px;}

    .bo_v_nb {margin: 20px 0 50px !important}
}

/* 뉴스, 보도자료 */
.commu > img {margin: 0 auto;}

.news, .board {margin-bottom: 200px}

.news_top {border-bottom: 1px solid #142C57; padding-bottom: 10px; display: flex; justify-content: space-between; align-items: center;
    margin-top: 50px;}
.news_top .total {font-size: 16px; color: #565758}
.news_top .total span {font-weight: bold; color: #142C57; font-size: 20px}
.news_top .search {}
.news_top .search > form {display: flex; justify-content: end; }
.news_top .search select {padding: 0 14px; border: 0; margin-right: 20px;}
.news_top .search .sch_bar {position: relative;}
.news_top .search .sch_bar input {border: 0; border-bottom: 1px solid #CCCCCC}
.news_top .search .sch_bar .sch_btn {position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}

.commu_list .list {border-top: 1px solid #f3f3f3;}
.commu_list .list li {transition: all 0.2s ease;}
.commu_list .list li:hover {background-color: #F2F4F8;}
.commu_list .list li a {padding: 30px 0; border-bottom: 1px solid #f3f3f3; display: flex}

.commu_list .list li a > div {display: flex; align-items: center; justify-content: center;}
.commu_list .list li a > div:nth-of-type(1) {width: 100px; min-width: 100px;}
.commu_list .list li a > div:nth-of-type(2) {width: 130px; min-width: 130px; flex-direction: column;}
.commu_list .list li a > div:nth-of-type(3) {width: 280px; min-width: 280px;}
.commu_list .list li a > div:nth-of-type(4) {flex-direction: column; align-items: baseline; padding-left: 40px}

.commu_list .list li a > div:nth-of-type(1)
.commu_list .list li a > div:nth-of-type(2) > p {font-weight: 900;	color: #142C57;	font-size: 20px;}
.commu_list .list li a > div:nth-of-type(2) > p:first-child {color: #8B8D8F; font-weight: 400;	font-size: 14px;}
.commu_list .list li a > div:nth-of-type(4) > p {font-size: 20px;}
.commu_list .list li a > div:nth-of-type(4) > p:last-child {color: #8B8D8F; font-size: 16px; margin-top: 20px;}

@media screen and (max-width: 1280px){
    .commu > img.mo_view {width: 80%; margin: 0 auto}

    .news, .board {margin-bottom: 100px}

    .news_top {margin-top: 60px}
    .news_top .total {font-size: 14px; display: flex; align-items: center; line-height: 1;}
    .news_top .total span {font-size: 16px; padding-left: 3px}
    .news_top .search {max-width: 230px}
    .news_top .search select {padding: 0 6px; font-size: 13px; margin-right: 5px;}
    .news_top .search .sch_bar {width: 70%}
    .news_top .search .sch_bar input {width: 100%; padding: 0;}

    .commu_list .list li a {padding: 20px 0;}
    .commu_list .list li a > div:nth-of-type(1) {display: none}
    .commu_list .list li a > div:nth-of-type(2) {display: none}
    .commu_list .list li a > div:nth-of-type(3) {width: 40%;  min-width: 40%;}
    .commu_list .list li a > div:nth-of-type(4) {flex-direction: column; align-items: baseline; padding-left: 20px}
	.commu_list .list li a > div:nth-of-type(4) > p {font-size: 18px;}
    .commu_list .list li a > div:nth-of-type(4) > p:last-child {overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 14px; margin-top: 2px;}
}

/* 뉴스, 보도자료 - 뷰 */

.commu_view_top {display: flex; justify-content: space-between; align-items: center; padding: 26px 0; border-top: 2px solid #142C57; border-bottom: 1px solid #CCCCCC; line-height: 1.3; margin-bottom: 50px; flex-wrap: wrap;}
.commu_view_top .tit {font-size: 25px; font-weight: bold; color: #2E2F30}
.commu_view_top p {font-size: 16px; color: #8B8D8F; }
.commu_view_top p span {padding-right: 15px; font-size: 18px; color: #565758; font-weight: 600; padding-right: 20px}

.commu_view_btn {text-align: center; border-top: 1px solid #CCCCCC; padding: 40px 0 70px; margin-top: 100px}
.commu_view_btn span {display: inline-block; padding: 18px 58px; background: #142C57; color: #fff; font-weight: bold; cursor: pointer;}

@media screen and (max-width: 768px){
    .commu_view_wrap {padding-top: 40px}
    .commu_view_top .tit {font-size: 18px}
    .commu_view_top p {font-size: 13px;}
    .commu_view_top p span {font-size: 15px; padding-right: 8px}

    .commu_view_btn {border: 0; padding: 20px 40px; margin-top: 50px;}
    .commu_view_btn span {font-size: 16px; padding: 12px 40px;}
}


/* 자료실 */
.refs > img {margin: 0 auto;}

.refs {margin-bottom: 200px}

.refs_top {border-bottom: 1px solid #142C57; padding-bottom: 10px; display: flex; justify-content: space-between; align-items: center;
    margin-top: 50px;}
.refs_top .total {font-size: 16px; color: #565758}
.refs_top .total span {font-weight: bold; color: #142C57; font-size: 20px}
.refs_top .search {}
.refs_top .search > form {display: flex; justify-content: end;}
.refs_top .search select {padding: 0 14px; border: 0; margin-right: 20px;}
.refs_top .search .sch_bar {position: relative;}
.refs_top .search .sch_bar input {border: 0; border-bottom: 1px solid #CCCCCC}
.refs_top .search .sch_bar .sch_btn {position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}

.refr_list .list {border-top: 1px solid #f3f3f3;}
.refr_list .list li {transition: all 0.2s ease;}
.refr_list .list li:hover {background-color: #F2F4F8;}
.refr_list .list li a {padding: 30px 0; border-bottom: 1px solid #f3f3f3; display: flex}

.refr_list .list li a > div {display: flex; align-items: center; justify-content: center;}
.refr_list .list li a > div:nth-of-type(1) {width: 100px; min-width: 100px;}
.refr_list .list li a > div:nth-of-type(2) {width: 130px; min-width: 130px; flex-direction: column;}
.refr_list .list li a > div:nth-of-type(3) {width: 280px; min-width: 280px;}
.refr_list .list li a > div:nth-of-type(4) {flex-direction: column; align-items: baseline; padding-left: 40px}

.refr_list .list li a > div:nth-of-type(1)
.refr_list .list li a > div:nth-of-type(2) > p {font-weight: 900;	color: #142C57;	font-size: 20px;}
.refr_list .list li a > div:nth-of-type(2) > p:first-child {color: #8B8D8F; font-weight: 400;	font-size: 14px;}
.refr_list .list li a > div:nth-of-type(4) > p {font-size: 20px;}
.refr_list .list li a > div:nth-of-type(4) > p:last-child {color: #8B8D8F; font-size: 16px; margin-top: 20px;}

@media screen and (max-width: 1280px){
    .refs > img.mo_view {width: 80%; margin: 0 auto}

    .refs {margin-bottom: 100px}

    .refs_top {margin-top: 60px}
    .refs_top .total {font-size: 14px;}
    .refs_top .total span {font-size: 16px}
    .refs_top .search select {padding: 0 6px; font-size: 13px; margin-right: 5px;}
    .refs_top .search .sch_bar {width: 70%}
    .refs_top .search .sch_bar input {width: 100%; padding: 0;}

    .refr_list .list li a {padding: 20px 0;}
    .refr_list .list li a > div:nth-of-type(1) {display: none}
    .refr_list .list li a > div:nth-of-type(2) {display: none}
    .refr_list .list li a > div:nth-of-type(3) {width: 40%;  min-width: 40%;}
    .refr_list .list li a > div:nth-of-type(4) {flex-direction: column; align-items: baseline; padding-left: 20px}
	.refr_list .list li a > div:nth-of-type(4) > p {font-size: 18px;}
    .refr_list .list li a > div:nth-of-type(4) > p:last-child {overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 14px; margin-top: 2px;}
}



/* 반응형 및 공통 */
.pc_view {display: block;}
.mo_view {display: none;}
.pc_view_flex {display: flex;}
.mo_view_flex {display: none;}

.sub_img {text-align: center; margin: 100px 0 0;}

.img_wrap > img {display: block; width: 100%}

@media screen and (max-width:768px){
    .pc_view {display: none;}
    .mo_view {display: block;}
    .pc_view_flex {display: none;}
    .mo_view_flex {display: flex;}

    .sub_img {margin: 27.8vw 0 0;}
}

/* 페이징 */
.pg_wrap {float: none; width: 100%; text-align: center; padding-top: 30px;}
.pg {}
.pg .pg_current {background: #142C57; color: #fff; border-radius: 0; border: 0;}
.pg .pg_page {border: 0; border-radius: 0;}
.pg_page:hover {background: #e3e3e3}
.pg .pg_end {background: url('../img/paging_right.png') no-repeat; background-size: 40%; background-position: center; margin-left: 20px;}
.pg .pg_start {background: url('../img/paging_left.png') no-repeat; background-size: 40%; background-position: center; margin-right: 20px;}