@charset "utf-8";

/* 제품소개 스타일 */
/*.portfolio-list {width:102.67%; margin-left:-1.219%}
.portfolio-list > li {float:left; display:block; width:30.89% !important; margin:0 1.219% 30px 1.219%}
.portfolio-list > li.board {width:100% !important}
.portfolio-list li.bbsnewf5 a > img {display:block; width:100%; height:auto !important; transition:all .5s ease}
.portfolio-list li.bbsnewf5 a:hover > img {transform:scale(1.1)}
.portfolio-list .hoverBox {position:absolute; display:block; top:0; left:0; width:100%; height:100%; padding:32% 30px 0 30px; text-align:center; background:rgba(0,0,0,.8); opacity:0; transition:all .5s ease}
.portfolio-list .hoverBox .inner {}
.portfolio-list .hoverBox .inner h3 {font-size:24px; font-weight:600; color:#fff; line-height:1.2}
.portfolio-list .hoverBox .inner h3:after {display:block; width:40px; height:1px; margin:20px auto; content:''; background:#fff; opacity:.5}
.portfolio-list .hoverBox .inner p {display:-webkit-box; color:#fff; max-height:69px; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; text-overflow:ellipsis}
.portfolio-list .bbsnewf5:hover .hoverBox {opacity:1}*/

.board_wrap .portfolio-list2 {margin:0px; border-bottom:1px solid #d8d8d8;text-align:justify;}
.board_wrap .portfolio-list2 > li {position:relative; display:inline-block; width:30%; margin-bottom:50px; padding:0px}
.board_wrap .portfolio-list2 > li.empty_list {clear:both; float:none !important; width:100% !important}
.board_wrap .portfolio-list2 > li .imgBox {margin-bottom:0px}
.board_wrap .portfolio-list2 > li .imgBox img {display:block; width:100%; height:auto !important}
.board_wrap .portfolio-list2 > li .infoArea h3 {font-size:17px; font-weight:500; color:#010101; margin-bottom:5px}
.board_wrap .portfolio-list2 > li .infoArea p {font-size:14px; font-weight:500; color:#777}
.board_wrap .portfolio-list2 > li input[type=checkbox] {position:absolute; top:15px; left:15px; z-index:5}

.board_wrap .portfolio-list2 .hoverBox {position:absolute; display:block; top:0; left:0; width:100%; height:100%; padding:32% 30px 0 30px; text-align:center; background:rgba(0,0,0,.8); opacity:0; transition:all .5s ease;box-sizing:border-box;}
.board_wrap .portfolio-list2 .hoverBox .inner {}
.board_wrap .portfolio-list2 .hoverBox .inner h3 {font-size:24px; font-weight:600; color:#fff; line-height:1.2;}
.board_wrap .portfolio-list2 .hoverBox .inner h3:after {display:block; width:40px; height:1px; margin:20px auto; content:''; background:#fff; opacity:.5}
.board_wrap .portfolio-list2 .hoverBox .inner p {display:-webkit-box; color:#fff; max-height:69px; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; text-overflow:ellipsis}
.board_wrap .portfolio-list2 .bbsnewf5:hover .hoverBox {opacity:1}
.board_wrap .portfolio-list2 .infoArea {display:none;}

/* 포트폴리오 - 레이어 모달 */
#pf-layer {position:fixed; display:none; top:0px; left:0; width:100%; height:100%; z-index:1100}
#pf-layer .mask {position:fixed; top:0; left:0; width:100%; height:100%; background:#0c0c0c; opacity:.5; z-index:1050}
#pf-layer .content {position:absolute; top:50%; left:50%; width:1024px; height:1000px; margin:-420px 0 0 -512px; padding:50px 50px 0; background:#fff; overflow:hidden; z-index:1080}
#pf-layer .content .title {margin-bottom:30px}
#pf-layer .content .title h2 {font-size:17px; font-weight:600; color:#010101; margin-bottom:5px}
#pf-layer .content .title p {font-size:14px; font-weight:600; color:#777}
#pf-layer .btn-close {position:absolute; top:50px; right:50px; width:30px; height:30px; border:1px solid #16b9ed; background:#fff; cursor:pointer; outline:none}
#pf-layer .btn-close span {position:absolute; display:block; top:50%; left:50%; width:20px; height:2px; margin:-1px 0 0 -10px; background:#16b9ed}
#pf-layer .btn-close span.line1 {transform:rotate(45deg)}
#pf-layer .btn-close span.line2 {transform:rotate(-45deg)}
#pf-layer .btn-close:hover {border-color:#aaa}
#pf-layer .btn-close:hover span {background:#aaa}
#pf-layer .content .inner {height:900px; overflow-y:auto}
#pf-layer .content .inner img {display:block; max-width:100%; margin:auto}
#pf-layer .content .inner br {display:none}

@media (max-width: 768px) {

}