@charset "utf-8";
/*.tbl-basic img {width:auto;display:inline-block;}
.tbl-board img {width:auto;display:inline-block;}
#bo_v_link img {width:auto;display:inline-block;}
.sit_icon img {width:auto;display:inline-block;}*/
/* Æ÷Æ®Æú¸®¿À - ¸®½ºÆ® */
#sub_container .portfolio-list {margin:0px; border-bottom:1px solid #d8d8d8;text-align:justify;}
#sub_container .portfolio-list > li {position:relative; display:inline-block; width:23%; margin-bottom:50px; padding:0px}
#sub_container .portfolio-list > li.empty_list {clear:both; float:none !important; width:100% !important}
#sub_container .portfolio-list > li .imgBox {margin-bottom:15px}
#sub_container .portfolio-list > li .imgBox img {display:block; width:100%; height:auto !important}
#sub_container .portfolio-list > li .infoArea h3 {font-size:17px; font-weight:500; color:#010101; margin-bottom:5px}
#sub_container .portfolio-list > li .infoArea p {font-size:14px; font-weight:500; color:#777}
#sub_container .portfolio-list > li input[type=checkbox] {position:absolute; top:15px; left:15px; z-index:5}
#sub_container .portfolio-list2 {margin:0px; border-bottom:1px solid #d8d8d8;text-align:justify;}
#sub_container .portfolio-list2 > li {position:relative; display:inline-block; width:30%; margin-bottom:50px; padding:0px}
#sub_container .portfolio-list2 > li.empty_list {clear:both; float:none !important; width:100% !important}
#sub_container .portfolio-list2 > li .imgBox {margin-bottom:0px}
#sub_container .portfolio-list2 > li .imgBox img {display:block; width:100%; height:auto !important}
#sub_container .portfolio-list2 > li .infoArea h3 {font-size:17px; font-weight:500; color:#010101; margin-bottom:5px}
#sub_container .portfolio-list2 > li .infoArea p {font-size:14px; font-weight:500; color:#777}
#sub_container .portfolio-list2 > li input[type=checkbox] {position:absolute; top:15px; left:15px; z-index:5}
#sub_container .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}
#sub_container .portfolio-list2 .hoverBox .inner {}
#sub_container .portfolio-list2 .hoverBox .inner h3 {font-size:24px; font-weight:600; color:#fff; line-height:1.2;}
#sub_container .portfolio-list2 .hoverBox .inner h3:after {display:block; width:40px; height:1px; margin:20px auto; content:''; background:#fff; opacity:.5}
#sub_container .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}
#sub_container .portfolio-list2 .bbsnewf5:hover .hoverBox {opacity:1}
#sub_container .portfolio-list2 .infoArea {display:none;}
.board_tab_spec {position:relative; margin-bottom:50px}
.board_tab_spec > a {display:none}
.board_tab_spec ul {border-bottom:1px solid #e0e0e0}
.board_tab_spec ul > li {float:left; margin-bottom:-1px; margin-left:-1px}
.board_tab_spec ul > li:first-child {margin-left:0}
.board_tab_spec ul > li > a {display:block; padding:12px 30px; color:#999; border:1px solid #e0e0e0; background:#f4f4f4}
.board_tab_spec ul > li.on > a {position:relative; color:#333; border-color:#aaa; border-bottom-color:#fff; background:#fff; z-index:10}
/* Æ÷Æ®Æú¸®¿À - ·¹ÀÌ¾î ¸ð´Þ */
#pf-layer {position:fixed; display:none; top:0; 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:1100px; height:780px; margin:-390px 0 0 -550px; 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 #d0d0d0; 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:#d0d0d0}
#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:660px; overflow-y:auto}
#pf-layer .content .inner img {display:block; max-width:100%; margin:auto}
#pf-layer .content .inner br {display:none}
/*  FAQ ¸®½ºÆ® */
#sub_container .faq-list {margin-bottom:30px; border-top:1px solid #316bd8}
#sub_container .faq-list > li {position:relative}
#sub_container .faq-list > .title {padding:12px 20px; border-bottom:1px solid #e2e2e2; cursor:pointer;font-size:0px;background:#fafafa;}
#sub_container .faq-list > .title > div {display:inline-block;vertical-align:top;line-height:30px;font-weight:bold;}
#sub_container .faq-list > .title > div.subject {width:80%;font-size:15px;text-align:center;}
#sub_container .faq-list > .title > div.confirm {width:10%;font-size:15px;text-align:center;}
#sub_container .faq-list > .title > div.date {width:10%;font-size:15px;text-align:center;}
#sub_container .faq-list > li .faq-check {float:left; display:inline-block; margin:0 10px; padding-top:13px}
#sub_container .faq-list > li .balloon {float:left; display:inline-block; width:30px; height:30px; font-size:16px; font-weight:800; color:#fff; text-align:center; line-height:27px; border-radius:30px}
#sub_container .faq-list > li .balloon.balloon-q {background:#316bd8}
#sub_container .faq-list > li .balloon.balloon-a {background:#1f1f1f}
#sub_container .faq-list > li .question {padding:12px 20px; border-bottom:1px solid #e2e2e2; cursor:pointer;font-size:0px;}
#sub_container .faq-list > li .question > div {display:inline-block;vertical-align:top;line-height:30px;}
#sub_container .faq-list > li .question > div.subject {width:80%;font-size:15px;}
#sub_container .faq-list > li .question > div.confirm {width:10%;font-size:15px;text-align:center;}
#sub_container .faq-list > li .question > div.date {width:10%;font-size:15px;text-align:center;}
#sub_container .faq-list > li .question:hover {background:#f7f7f7}
#sub_container .faq-list > li .question:after {clear:both; display:block; content:''}
#sub_container .faq-list > li .question h3 {float:left; font-size:16px; font-weight:600; color:#2b2b2b; line-height:30px; margin-left:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#sub_container .faq-list > li .answer {display:none; padding:20px;color:#555; line-height:1.8; border-bottom:1px solid #e2e2e2; background:#f6f6f6;font-size:0px;}
#sub_container .faq-list > li .answer > div {display:inline-block;vertical-align:top;line-height:30px;}
#sub_container .faq-list > li .answer > div.subject {width:80%;font-size:15px;}
#sub_container .faq-list > li .answer > div.subject i {float:left;font-size:25px;color:#dcdcdc;margin-left:10px;}
#sub_container .faq-list > li .answer > div.confirm {width:10%;font-size:15px;text-align:center;color:#316bd8;}
#sub_container .faq-list > li .answer > div.date {width:10%;font-size:15px;text-align:center;}
#sub_container .faq-list > li .answer .content {margin-left:80px; font-size:14px; color:#555; line-height:1.8}
#sub_container .faq-list > li .answer .content img {max-width:100%}
/*------------------------ °Ô½ÃÆÇ °øÅë ½ºÅ¸ÀϽÃÆ® ------------------------*/
#board_nav {display:none}
/*------------------------ °øÅë UI ½ºÅ¸ÀϽÃÆ® ------------------------*/
/* ÅÇ */
.tab-primary {display:table; width:100%; border-collapse:collapse; table-layout:fixed}
.tab-primary > li {display:table-cell; width:auto; height:50px; border:1px solid #d0d0d0; cursor:pointer}
.tab-primary > li:hover {background:#f9f9f9}
.tab-primary > li a {display:block; width:100%; height:100%; font-size:18px; font-weight:600; color:#0c0c0c; line-height:50px; text-align:center}
.tab-primary > li.selected {border-color:#0c0c0c; background:#0c0c0c}
.tab-primary > li.selected a {color:#fff}
.tab-submenu, .tab-category {margin-bottom:40px}
.tab-category > li:first-child {display:none}
/* ÅؽºÆ® ¿¡¾î¸®¾î */
.area-primary {padding:20px; font-family:inherit; font-size:14px; color:#777; line-height:25px; border:1px solid #d8d8d8}
.area-agree {width:100%; height:200px}
.area-content {width:100%; height:230px}
.area-comment {width:100%; height:120px}
/* üũ¹Ú½º */
.check-agree {margin-top:25px}
.check-primary.check-inline {display:inline-block}
/*
.check-primary {position:relative}
.check-primary input[type=checkbox] {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip:rect(0,0,0,0)}
.check-primary input[type=checkbox] + label {position:relative; display:inline-block; font-size:14px; font-weight:600; color:#777; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none}
.check-primary input[type=checkbox] + label:before {display:inline-block; width:15px; height:15px; margin:-2px 8px 0 0; text-align:center; content:''; border:1px solid #d0d0d0; background:#fff; vertical-align:-3px}
.check-primary input[type=checkbox]:checked + label:before {border-color:#0c0c0c}
.check-primary input[type=checkbox]:checked + label:after {display:block; position:absolute; top:50%; left:5px; width:5px; height:5px; margin-top:-2px; content:''; background:#0c0c0c}*/
/* Å×À̺í */
.tbl-basic {width:100%; border-top:1px solid #316bd8}
.tbl-basic thead th {font-size:15px; font-weight:600; color:#333; text-align:center; padding:15px 0; border-bottom:1px solid #dcdcdc; background:#fafafa;border-right:solid 1px #dcdcdc;}
.tbl-basic thead th:last-child {border-right:0px;}
.tbl-basic tbody th {font-weight:normal; color:#0c0c0c; text-align:left; padding:13px 0 13px 40px; background:#fafafa;width:20%;}
.tbl-basic tbody th, .tbl-basic tbody td {font-size:14px; line-height:1.6; border-bottom:1px solid #d8d8d8;border-right:solid 1px #dcdcdc;}
.tbl-basic tbody td {color:#777; padding:13px 25px}
.tbl-basic tbody td:last-child {border-right:0px;}
.tbl-basic tbody td a {font-size:14px;}
.tbl-basic tbody td a:hover {color:#0c0c0c; text-decoration:underline}
.tbl-basic tbody td input.block {margin:4px 0}
.tbl-simple {width:100%; border-top:2px solid #333}
.tbl-simple th, .tbl-simple td {font-size:14px; padding:13px 15px; line-height:1.75}
.tbl-simple td:nth-child(2) p {font-size:13px; font-weight:600}
.tbl-simple td:nth-child(2) span {font-size:12px; color:#ababab}
.tbl-simple th {color:#0c0c0c; text-align:center; padding-left:0; padding-right:0; border-bottom:1px solid #d0d0d0; background:#f7f7f7}
.tbl-simple td {color:#777; border-bottom:1px solid #d0d0d0}
.tbl-simple td .btn-link {display:inline-block; font-size:13px; font-weight:600; color:#333; padding:5px 8px; border:1px solid #e2e2e2; background:#fff}
.tbl-simple td .btn-link:hover {border-color:#bbb}
.tbl-simple td.td_on, .tbl-simple td.td_on a {color:#d40000 !important} 
.tbl-simple td.td_on, .tbl-simple td.td_on a em {color:#d40000 !important} 
.tbl-simple td strong {color:#d40000}
.tbl-board tbody tr:hover td {background:#f8f8f8}
tr.hide, td.hide {display:none}
.tbl-transparent {width:100%}
.tbl-transparent tbody th, .tbl-transparent tbody td {font-size:14px; color:#777; padding:5px 0; border:none; background:none}
.tbl-transparent tbody th {font-weight:600; text-align:left}
span.required {margin-left:5px; font-size:20px; color:#d80606; vertical-align:inherit}
.td_center {text-align:center}
/* ¼­½Ä ÁøÇà */
.btn_confirm {margin-top:30px; text-align:center}
/* ÀÔ·Â ¿ä¼Ò */
.text-primary {height:39px;width:200px; padding:0 10px; font-size:14px; font-weight:normal; color:#777; border:1px solid #f7f7f7;background:#f7f7f7;}
.search_btn {position:relative;width:39px;height:39px;background:#f7f7f7;border:1px solid #f7f7f7;margin-left:-2px;vertical-align:top;}
.search_btn i {font-size:20px;color:#316bd8}
/*.search_btn:after {position:absolute;font-family:'xeicon';content:'\e97a';color:#316bd8;top:0px;left:0px;font-size:30px;z-index:9;}*/
.text-primary.half {width:50%}
.text-primary.block {display:block; width:100%}
.file-transparent {position:absolute; width:1px; height:1px; margin:-1px; padding:0; border:none; overflow:hidden; clip:rect(0,0,0,0)}
/* ¼¿·ºÆ® ¹Ú½º */
.combo-primary {display:inline-block; padding:0 10px; height:35px; font-size:15px; border:1px solid #d0d0d0; background:#fff; cursor:pointer; vertical-align:middle}
/* ¹öÆ° */
.btn {display:inline-block; padding:0 25px; height:35px; font-size:15px; font-weight:600; text-align:center; line-height:33px;border:1px solid #d0d0d0; background:transparent; cursor:pointer; vertical-align:middle}
.btn.btn-grey {color:#2d2d2d; background:#f7f7f7}
.btn.btn-black {color:#fff; border-color:#2d2d2d; background:#2d2d2d}
.btn.btn-black-o {color:#2d2d2d; border-color:#2d2d2d}
.btn.btn-red {color:#fff; border-color:#9c0000; background:#9c0000}
.btn.btn-red-o {color:#d40000; border-color:#9c0000}
.btn.btn-white {color:#2d2d2d; border-color:#fff; background:#fff}
.btn.btn-lg {font-size:17px; line-height:43px; height:45px; padding:0 35px}
.btn.btn-xl {font-size:20px; line-height:48px; height:50px; padding:0 45px}
/* ·¹À̺í */
.lbl-chain {margin-right:20px}
@media screen and (max-width:1280px) {
 
 
 #sub_container .portfolio-list2 > li {width:48%; margin-bottom:50px; padding:0px}
 #sub_container .portfolio-list2 .hoverBox {display:none;}
 #sub_container .portfolio-list2 .infoArea {display:block;margin-top:15px;}
 
 #sub_container .faq-list > li .question {padding:12px 0px 12px 5px;}
 #sub_container .faq-list > li .answer {padding:10px 5px;}
 
 #sub_container .mobile th {display:block;width:100%;}
 #sub_container .mobile td {display:block;width:100%;}
 #sub_container .mobile td select {width:100%;}
 #sub_container .mobile td input {width:100%;}
 #sub_container .mobile td button#btn_autosave {display:none;}
 #sub_container .mobile td input[name='notice'] {width:15px;}
 #sub_container .tbl-basic td input[name='html'] {width:15px;}
}
@media screen and (max-width:1024px) {
 
 #sub_container .portfoliom {margin:0px; border-bottom:1px solid #d8d8d8;text-align:justify;}
 #sub_container .portfoliom > li {position:relative; display:inline-block; width:48%; margin-bottom:50px; padding:0px}
 #sub_container .portfoliom > li.empty_list {clear:both; float:none !important; width:100% !important}
 #sub_container .portfoliom > li .imgBox {margin-bottom:15px}
 #sub_container .portfoliom > li .imgBox img {display:block; width:100%; height:auto !important}
 #sub_container .portfoliom > li .infoArea h3 {font-size:17px; font-weight:500; color:#010101; margin-bottom:5px}
 #sub_container .portfoliom > li .infoArea p {font-size:14px; font-weight:500; color:#777}
 #sub_container .portfoliom > li input[type=checkbox] {position:absolute; top:15px; left:15px; z-index:5}
 
 #sub_container .tbl-basic th[scope='col']:nth-child(1) {display:none;}
 #sub_container .tbl-basic th[scope='col']:nth-child(3) {display:none;}
 #sub_container .tbl-basic th[scope='col']:nth-child(4) {border-right:0px;}
 #sub_container .tbl-basic th[scope='col']:nth-child(5) {display:none;}
 
 #sub_container .tbl-basic td {padding:10px 0px}
 #sub_container .tbl-basic td.td_num {display:none;}
 #sub_container .tbl-basic td.td_name {display:none;}
 #sub_container .tbl-basic td:nth-child(4) {border-right:0px;}
 
 .text-primary {}
 #bo_sch {float:none;margin-top:0px;}
 .search_btn {margin-left:-3px !important}
 #pf-layer {display:none !important;}
 .sr_btn.board {padding:5px 10px !important;}
 
 .bo_v_nb {float:none;display:block;text-align:center;}
 .bo_v_nb li {float:none;display:inline-block;margin-right:0px;margin-bottom:20px;}
 .bo_v_com {float:none;display:block;text-align:center;}
 .bo_v_com li {float:none;display:inline-block;margin-right:0px;margin-left:0px;}
 /* Å×À̺í */
 .tbl-basic thead th {font-size:13px; font-weight:400;padding:10px 0;}
 .tbl-basic.writer tbody th {padding:8px 0 8px 10px;width:100%;display:block;}
 .tbl-basic.writer tbody th, .tbl-basic.writer tbody td {font-size:13px;border-right:solid 0px #dcdcdc;}
 .tbl-basic.writer tbody td {color:#777; padding:13px 25px;width:100%;display:block;}
 .tbl-basic tbody td a {font-size:13px;}
 .tbl-basic tbody td {font-size:13px;}
 
 #bo_gall {margin:auto auto 50px auto}
 #bo_gall > a {position:relative; display:block !important; width:100%; height:50px; padding-left:15px; font-size:16px; line-height:50px; border:1px solid #e0e0e0}
 #bo_gall .board_tab_spec > a {position:relative; display:block !important; width:100%; height:50px; padding-left:15px; font-size:16px; line-height:50px; border:1px solid #e0e0e0}
 #bo_gall .board_tab_spec > a:after {position:absolute; font-family:'FontAwesome'; font-size:18px; color:#333; right:20px; content:'\f107'}
 #bo_gall .board_tab_spec > a.open:after {content:'\f106'}
 #bo_gall ul.tab {display:none; position:absolute; top:49px; width:100%; margin:0; border:1px solid #e8e8e8; border-top:none; background:#fff; z-index:30}
 #bo_gall ul.tab > li {float:none; display:block; margin:0}
 #bo_gall ul.tab > li > a {display:block; padding:12px 15px; font-size:16px; color:#999; border:none; border-top:1px solid #f0f0f0; background:none}
 #bo_gall ul.tab > li > a#bo_cate_on {color:#333; border-color:#f0f0f0}
 
 #bo_list {margin:auto auto 50px auto}
 #bo_list > a {position:relative; display:block !important; width:100%; height:50px; padding-left:15px; font-size:16px; line-height:50px; border:1px solid #e0e0e0}
 #bo_list .board_tab_spec > a {position:relative; display:block !important; width:100%; height:50px; padding-left:15px; font-size:16px; line-height:50px; border:1px solid #e0e0e0}
 #bo_list .board_tab_spec > a:after {position:absolute; font-family:'FontAwesome'; font-size:18px; color:#333; right:20px; content:'\f107'}
 #bo_list .board_tab_spec > a.open:after {content:'\f106'}
 #bo_list ul.tab {display:none; position:absolute; top:49px; width:100%; margin:0; border:1px solid #e8e8e8; border-top:none; background:#fff; z-index:30}
 #bo_list ul.tab > li {float:none; display:block; margin:0}
 #bo_list ul.tab > li > a {display:block; padding:12px 15px; font-size:16px; color:#999; border:none; border-top:1px solid #f0f0f0; background:none}
 #bo_list ul.tab > li > a#bo_cate_on {color:#333; border-color:#f0f0f0}
 
}
@media screen and (max-width:768px) {
 
}
@media screen and (max-width:640px) {
 #sub_container img.img_mob {display:block !important}
 #sub_container img.img_pc {display:none !important}
 
 #sub_container #bo_sch select {display:none;}
}