@charset "utf-8";

/* 바꿔서 사용하는 영역 s*/
    :root {
        --main-bg: #005383; /* 버튼, 페이지네이션 */
        --sub-bg: #2a95d3;

        --border-dark:#888888; /* table 테두리 - 폼메일, 게시판 */
        --border-light:#dedede; /* table 테두리 - 폼메일, 게시판 */
        
        --form-input-height: 34px; 
        --form-title:#ffffff; /* label 컬러 */
        --form-title-bg:#f5f5f5; /* label 백그라운드 */
        
        --form-input-border:#dedede; /* input 감싸는 div 테두리 */
        --form-input-bg:#fafafa; /* input 백그라운드 */

        --view-max-width: 1024px; /* board_view 페이지 max-width */
    }
/* 바꿔서 사용하는 영역 e*/

/* 인풋 자동완성 */
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-text-fill-color: var(--main-black); -webkit-box-shadow: 0 0 0px 1000px var(--form-input-bg) inset; box-shadow: 0 0 0px 1000px var(--form-input-bg) inset; transition: background-color 5000s ease-in-out 0s; }
input:autofill, input:autofill:hover, input:autofill:focus, input:autofill:active { -webkit-text-fill-color: var(--main-black); -webkit-box-shadow: 0 0 0px 1000px var(--form-input-bg) inset; box-shadow: 0 0 0px 1000px var(--form-input-bg) inset; transition: background-color 5000s ease-in-out 0s;    }

/* 테이블 슬래시 */
.diagonal { background: url("/resources/img/common/diagonal.png") no-repeat center; background-size:100% 100%; letter-spacing: -1px;}
.noresize { resize: vertical; }
/* reset(기본셋팅 영역) e */    



/* form-mail */
.basic_form { margin-bottom: 50px; border: 1px solid var(--border-light); }
.basic_form select { padding-right:24px; }
.basic_form .frm-itm { display: table; width: 100%; border-bottom: 1px solid var(--border-light); }
.basic_form .frm-itm:last-child { border-bottom: 0; }
.basic_form .frm-itm .frm-tit { display: table-cell; width: 200px; padding:5px; text-align: center; vertical-align: middle; background: var(--form-title-bg); border-right: 1px solid var(--border-light); }
.basic_form .frm-itm .frm-tit:last-child { border-bottom: 0; }
.basic_form .frm-itm .frm-desc { display: table-cell; padding:5px; }
.frm-btn-wrap { text-align: center; }

    /* form-mail - 첨부파일 */
    .file-itm input[type="file"] { display: none; }
    .file-itm .select-file { display: inline-block; width:100px; height: var(--form-input-height); line-height: var(--form-input-height); background: var(--main-black); color:white; text-align: center; cursor: pointer; }
    .file-itm .file-name-txt { margin-left:8px; color:var(--sub-black); }
    .file-itm .file-name-txt.select { color:var(--main-black); }

    /* form-mail - 주소검색 */
    .addr-itm button { width: 80px; height: var(--form-input-height); float:left; margin-left:5px; line-height: var(--form-input-height); text-align: center; background: var(--main-black); color: white; }
    #zip_code { width:100px; float:left; }

    /* form-mail - 등록버튼 */

@media screen and (max-width: 768px){
    .basic_form .frm-itm .frm-tit { display: block; width: 100%; border-bottom: 1px solid var(--border-light); border-right: 0; }
    .basic_form .frm-itm .frm-desc { display: block; width: 100%; }
}
@media screen and (max-width: 500px){
    #captcha {width: calc(100% - 128px);}
}



/* 게시판 버튼 */
.flt-btn-wrap { width:100%; display: flex; justify-content: right; margin-top:15px; }
.flt-btn-wrap a { width:60px; height:30px; display: flex; align-items: center; justify-content: center; margin-left:10px; font-size: 15px; cursor: pointer; background: white; border:1px solid var(--border-dark); }
.flt-btn-wrap .delete-btn { background: var(--border-light); } /* 삭제버튼 */
.flt-btn-wrap .answer-btn { padding-left:15px; background: url("/resources/img/board/comment/comment_ico3.png") no-repeat 10px/9px ; } /* 답변버튼 */
.flt-btn-wrap .post-btn { width: 100px; height: 40px; display: flex; align-items: center; justify-content: center; border: solid 1px var(--main-bg); cursor: pointer; transition: 0.3s ease-out; background: white; color:var(--main-bg); } /* 글쓰기 버튼 */
.flt-btn-wrap .post-btn:hover { background: var(--main-bg); color:white; }

.ctr-btn-wrap { width:100%; margin-top:60px; display: flex; justify-content: center; flex-wrap: wrap; }
.ctr-btn-wrap a,.ctr-btn-wrap button { width: 150px; height:50px; margin: 0 10px ; display: flex; justify-content: center; align-items: center; cursor: pointer; border-radius: 5px; transition: 0.3s ease-out; }
.ctr-btn-wrap .to-next { background: var(--main-black); color:white; }
.ctr-btn-wrap .to-next:hover { background: #000; }
.ctr-btn-wrap .to-back { border: solid 1px var(--main-black); color: var(--main-black); }
.ctr-btn-wrap .to-back:hover { background:#f5f5f5; }

@media screen and (max-width: 500px){
    .ctr-btn-wrap a,.ctr-btn-wrap button { width:100%; margin: 10px 0; }
}


/* 페이지네이션 */
.pagination { width:100%; display:inline-block; margin: 50px auto 0; text-align: center; }
.pagination button, .pagination a {	width: 3.6rem; height: 3.6rem; margin: 0 2px; color: var(--deep-gray); font-size: 1.6rem; line-height: 3.6rem; font-weight: 700; display: inline-block; text-decoration: none; vertical-align: middle; border: 1px solid var(--lite-gray); border-radius: 4px; }
.pagination button:hover, .pagination a:hover { text-decoration:underline; }
.pagination .selected {	color: #fff; background-color: var(--main-black); border: 1px solid var(--main-black); }
.pagination .prev,.pagination .next, .pagination .p-prev,.pagination .n-next{ transition:.3s ease-in-out; background-image: url("/resources/img/common/page-arrow.svg"); background-repeat: no-repeat; border: 1px solid #fff; text-indent: -999em;	vertical-align: middle;}
.pagination .p-prev {background-position: left;}
.pagination .prev {background-position: left;}
.pagination .next { background-position: right;}
.pagination .n-next {background-position: right;}


/* 게시판 list */
.board_list { width: 100%; background-color: #fff;}
.board_list table { width: 100%; }
.board_list th { padding: 2.6rem 1rem; background: #F5F5F5; font-size: 1.8rem; font-weight: 800; border-top:1px solid #DEDEDE; border-bottom:1px solid #DEDEDE; }
.board_list td { padding: 2.6rem 3rem; font-size: 1.8rem; font-weight: 400; border-top:1px solid #DEDEDE; border-bottom:1px solid #DEDEDE; text-align: center; line-height: 1.4; }
.board_list .list_num { width:8%; }
.board_list .list_tit { width:62%; }
.board_list .list_tit a { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.board_list .list_file { width:24%; }
.board_list .list_wtr { width:12%; }
.board_list .list_date { width:18%; }

.board_list .list_file a { display: flex; gap:8px; align-items: center; }
.board_list .list_file p { width: calc(100% - 38px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; }
.board_list .list_file .ico_file { display: inline-block; width: 30px; height: 30px; text-indent: -9999px; overflow: hidden; background: url('/resources/img/common/ico-file.svg') no-repeat center/24px; }


.board_list.list_qna .list_num { width:8%; }
.board_list.list_qna .list_tit { width:auto; }
.board_list.list_qna .list_wtr { width:12%; }
.board_list.list_qna .list_ect { width:80px; } /* QNA 댓글,좋아요 창 추가 */
.board_list.list_qna .list_stat { width:110px; } /* QNA 상태 창 추가 */
.board_list.list_qna .list_date { width:120px; }

    /* 게시판 list - 답변완료 표시 */
    .qna_ico { display: inline-block; width:100%; padding: 5px 0; font-size: 15px; letter-spacing: -1px; }
    .qna_ico1 { color:#333; background: #fdd340; } /* 확인 중 */
    .qna_ico2 { border: 1px solid #ddd; color:#555; background:#f5f5f5; } /* 답변 완료 */
    .qna_ico3 { background:#555; color:#f5f5f5; } /* 답변 대기 */
    .secret { display: inline-block; width:20px; height:20px; background:url('/resources/img/board/comment/secret.png') no-repeat center/contain; text-indent: -99999px; overflow: hidden; position: relative; top:2px; margin-right:6px; } /* 비밀 글 */
    .answer_btn { display:inline-block; margin-left:10px; font-size: 15px; }
    
@media screen and (max-width: 768px){
    .board_list th, .board_list td { padding: 20px 5px; font-size: 14px; }
    .non_mobile { display: none; }
    .board_list .list_tit {width:70%;}
    .board_list .list_date { width:30%; }
}

    /* 게시판 list - 검색바 */
    .search_form form { width: 60%; float: right; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -moz-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -moz-align-items: center; -ms-flex-align: center; align-items: center; }
    .search_form select { width: 20%; height: 40px; padding-left: 14px; border:solid 1px var(--border-light); }
    .search_form .searcher-wrap { width: calc(80% - 110px); height: 40px; padding: 0 5px; position: relative; border: 1px solid var(--border-light); background: white; }
    .search_form .searcher-wrap .txt-del-btn { position: absolute; right:15px; top:50%; transform: translateY(-50%); width:18px; height:18px; background:#adadad url('/resources/img/common/close_w.png') no-repeat center/contain; overflow: hidden; text-indent: -99999px; border-radius: 50%; cursor: pointer; display: none; }
    .search_form input[type="text"] { width: calc(100% - 34px); height: 100%; background: white; }
    .search_form .sch_btn { width: 100px; height: 40px; text-align: center; background: var(--main-bg); color:white; border: solid 1px var(--main-bg); cursor: pointer; transition: 0.3s ease-out; }
    .search_form .sch_btn:hover { background: white; color:var(--main-bg); }

    @media screen and (max-width:1100px){
        .search_form form {width:80%;}
    }
    @media screen and (max-width:768px){
        .search_form form {width:100%;}
    }
    @media screen and (max-width:500px){
        .search_form select {width: 30%;}
        .search_form .searcher-wrap { width:70%; margin: 0; }
        .search_form .sch_btn { width:100%; margin-top:10px;}
    }



/* 게시판 view */
.view_table { width:100%; max-width:var(--view-max-width); margin: 0 auto; border-bottom:1px solid var(--border-light); }
.view_table .title { margin-bottom:40px; padding-bottom:30px; font-size:32px; font-weight: 600; letter-spacing: -0.5px; }
.view_table .sub-title { display: flex; justify-content: space-between; align-items: end; margin-left:2px; padding-bottom:30px; border-bottom:1px solid var(--border-light); font-size: 16px; font-weight: 400; color:#777; }
.view_table .count-list { display: flex; align-items: end; }
.view_table .count-list p { display: inline-block; margin-right: 20px; }
.view_table .count-list p:last-child { margin-right: 0; }

.view_table .link { font-size: 16px; padding: 20px 30px; margin:30px 0; background: #f4f4f4; border-radius: 5px; }
.view_table .file { font-size: 16px; padding: 20px 30px; margin:0px 0 40px; background: #f4f4f4; border-radius: 5px; }
.view_table .link a { position: relative; padding-left:15px; }
.view_table .link a:hover,.view_table .file a:hover { text-decoration: underline; text-underline-offset: 4px; }
.view_table .link a::before { content: ''; position: absolute; left:0px; top:10px; width:3px; height:3px; background: var(--border-dark); border-radius: 50%; }
.view_table .link a::after { content: ''; position: absolute; right:-10px; top:55%; transform: translate(100%, -50%); width: 16px; height:16px; background: url('/resources/img/common/link_ico.png') no-repeat center/contain; }

.view_table .file { display: flex; }
.view_table .file .label { width: 90px; font-weight: 600; display: inline-block; padding:2px 0; }
.view_table .file .down-list { width:calc(100% - 90px); }
.view_table .file .down-list a { display: block; padding:2px 15px 2px; max-width: fit-content; position: relative; }
.view_table .file a::before { content: ''; position: absolute; left:0px; top:12px; width:3px; height:3px; background: var(--border-dark); border-radius: 50%; }
.view_table .file a::after { content: ''; position: absolute; right:5px; top:60%; transform: translate(100%, -50%); width: 16px; height:16px; background: url('/resources/img/common/down_ico.png') no-repeat center/contain; }
.view_table .view_td { min-height:300px; line-height: 1.4; padding: 40px 0 40px; }
.view_table .view_vd { padding: 40px 0px; }

.table_bottom { position:relative; width:100%; max-width:var(--view-max-width); text-align:center; margin: 0 auto;}

@media screen and (max-width: 768px){
    .view_table th { font-size: 16px; }
    .view_table td { padding: 15px 5px; font-size: 15px;}
    .view_table .link { padding: 20px; margin: 20px 0; }
    .view_table .file { padding: 20px; margin: 0px 0 20px; }
}
@media screen and (max-width: 500px){
    .view_table .title { padding-bottom:0; }
    .view_table td {font-size: 14px;}
}
    /* 에디터 내부 스타일 X */
    .view_td img { max-width: fit-content; display: inline-block; }
    .view_td * { font: revert; }
    .view_td ul { list-style: disc; }
    .view_td ol { list-style: auto; }

    /* like btn */
    .like_span { vertical-align:middle; display:inline-block; margin-right:20px; }
    .like_btn { font-weight: 600; color:#333; float: left; text-align: center; vertical-align: middle; position: relative; }
    .like_btn .ico { vertical-align:middle; transition: .2s ease; margin-right:5px; display:inline-block; width:20px; height:20px; background:url("/resources/img/board/comment/like_ico.png") no-repeat center/contain;}
    .like_btn.on .ico { background:url("/resources/img/board/comment/like_on_ico.png") no-repeat center/contain; } 
    .like_btn .txt {vertical-align:middle; display:inline-block;}
    .like_count {line-height:140%}

    /* hate btn */
    .hate_span { vertical-align:middle; display:inline-block; margin-right:20px; }
    .hate_btn { font-weight: 600; color:#333; float: left; text-align: center; vertical-align: middle; position: relative; }
    .hate_btn .ico { vertical-align:middle; transition: .2s ease; margin-right:5px; display:inline-block; width:20px; height:20px; background:url("/resources/img/board/comment/hate_ico.png") no-repeat center/contain;}
    .hate_btn.on .ico { background:url("/resources/img/board/comment/hate_on_ico.png") no-repeat center/contain; } 
    .hate_btn .txt {vertical-align:middle; display:inline-block;}
    .hate_count {line-height:140%}

    /* 게시판 view - 답변 */
    .view_td.view_rep { min-height:100px; padding: 20px; margin-bottom:40px; background:#fafafa; border:1px solid #f5f5f5; border-radius: 5px; }
    .answer_tit { padding-left:14px; margin-bottom:10px; background: url("/resources/img/board/comment/comment_ico3.png") no-repeat left center/9px; font-weight: 600; }
    .view_td.view_rep pre { padding: 0px 14px; }

    /* 게시판 view - 페이지 댓글 처리 */
    .comment-wrap { max-width: var(--view-max-width); margin:0 auto; }
    .comment-wrap .reply-line { padding: 12px 20px; background:#f5f5f5; border-bottom:solid 1px #ddd; font-size:14px; }
    
        /* 게시판 view - 댓글 입력창 */
        .cmt_reply_contents { margin-top:40px; border:1px solid #b3b3b3; }
        .cmt_reply_contents .reply_top { background:#fff; padding:10px 20px; }
        .cmt_reply_contents .reply_top .name { display: inline-block; color: #555; font-weight: 600; position: relative; margin-top:5px; }
        .cmt_reply_contents .reply_top .name::before { content:''; display: inline-block; width:18px; height:18px; background:url("/resources/img/board/comment/comment_ico.png") no-repeat center ; margin-right: 6px; position: relative; top:3px; }
        .cmt_reply_contents textarea { padding:0 20px; min-height:80px; border:none; background: none; margin-bottom: 10px; font-size: 14px; } 
        .cmt_reply_contents .reply_bottom { border-top: 1px solid #eee; padding: 10px 20px; display: flex; align-items: center; justify-content: space-between; }
        .cmt_reply_contents .reply_bottom .counter { font-size: 14px; }
        .reg_btn { width:auto; display:inline-block; padding: 4px 20px; transition: .3s ease; background:#555; color:white; }
        .cmt_login { text-align:center; padding:30px 20px; letter-spacing:-.8px; background: #fafafa; }
        .cmt_login a { font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }

        /* 게시판 view - 댓글 페이지네이션 */
        .comment-wrap .pagination { margin: 20px auto 0; }
        .comment-wrap .pagination button,.comment-wrap .pagination a { color:#777; }
        .comment-wrap .pagination .selected { background-color: initial; color:#777; font-weight: 600; border: 1px solid #ddd; }

        /* 게시판 view - 댓글 */
        .cmt_item { padding: 15px 10px; border-bottom: 1px solid #ebedf2; position: relative;  font-size: 16px; }
        .cmt_item div[id^="tr_reply_div_"] .top{ position: relative; padding:15px 15px 30px; border-top:1px solid #ebedf2;  }
        .cmt_item.cmt1 { padding-left:3%;}
        .cmt_item.cmt2 { padding-left:6%;}
        .cmt_item.cmt3 { padding-left:9%;}
        .cmt_item.cmt4 { padding-left:12%;}
        .cmt_item.cmt5 { padding-left:15%;}
        .cmt_item .cmt_name { display: inline-block; position: relative; color: #5d6473; font-weight: 600; }
        .cmt_item:not(.cmt0) .cmt_name::before { content:''; display: inline-block; width:9px; height:10px; background:url("/resources/img/board/comment/comment_ico3.png") no-repeat; position:absolute; left:-19px; top:6px; }
        .cmt_item .date { float:right; color:#afafaf; font-size: 14px; }
        .cmt_item .cmt_txt { margin-top:6px; line-height: 150%; }
        .cmt_item .cmt_txt span { line-height: 150% }
        .cmt_item .cmt_txt.edt_date { text-align: right; color: #afafaf; font-size: 14px; }
        .cmt_item .cmt_txt textarea { border: 1px solid #b3b3b3; margin-bottom:10px; min-height: 100px; }



/* 게시판 edit, rep, */
.edit-table { border-top:solid 1px #dedede; }
.edit-table th { width:200px; padding: 15px; border-bottom: solid 1px #dedede; border-right:solid 1px #dedede; background: #fafafa; }
.edit-table td { width:calc(100% - 200px); padding: 15px; border-bottom: solid 1px #dedede; }
.edit-table td > iframe {width: calc(100% + 2px) !important;} /*board write 에디터 잘리는 문제*/



/* 게시판 check */
.alert-wrap { display: fixed; width: 100vw; height:100vh; }
.alert-inner { width:96%; max-width:500px; padding: 40px 30px ; position: absolute; left:50%; top:45%; transform: translate(-50%,-50%); border: solid 1px #ddd; }
.alert-inner h2 { font-size: 30px; font-weight: 600; }
.alert-inner .sub-txt { margin-top:12px; color:#777; }
.alert-inner .alert-input { margin-top:50px; }
.alert-inner label { display: block; font-weight: 600; margin-bottom: 8px; }
.alert-inner input { width:100%; padding:5px; border:none; border-bottom: solid 1px #dedede; background: white; }
.alert-btn-wrap { margin-top:20px; }
.alert-btn-wrap button { width: 100%; height:46px; background-color: #222; color:white; border-radius: 5px; }
.alert-btn-wrap .back_btn { display:block; height:46px; line-height: 46px; margin-top: 10px; border: 1px solid #ddd; border-radius: 5px; }



/* 게시판 view - image1 skin */
.img_brd1 ul { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap:2%; gap:2%; }
.img_brd1 li > a { display:block; width:100%; height:100%; position:relative; overflow: hidden; }
.img_brd1 li .hover {  z-index:1;  transition:.3s ease; transform:translateY(100%); position:absolute; width:100%; left:0; bottom:0; text-align:center; padding: 40px 15px 20px; display:block; background: linear-gradient(0deg, rgba(18,94,172,1) 30%, rgba(18,94,172,0) 100%);  color:#fff;}
.img_brd1 li .txt { padding:10px 25px 15px; display:block; position:absolute; width:100%; z-index:1; left:50%; bottom:0; max-width:90%; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; color:#fff; text-align:center; transform:translateX(-50%); border-top:1px dotted #fff; transition:.3s ease; }
.img_brd1 li > a::before { content:''; display:inline-block; position:absolute; left:0; top:0; width:100%; height:100%; background:linear-gradient(0deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 40%); z-index:1;}
.img_brd1 li > a .img { border:1px solid #ddd; border-bottom:0; width:100%; height:0; position:relative; overflow:hidden; padding-bottom: 75%; }

.img_brd1 li > a .img img { transition:.3s ease; background:#fff; position:absolute; top:50%; left:50%; transform:translate3D(-50%, -50%, 0); width: 100%;}
.img_brd1 li > a .hover .hover_tit {max-width:100%;overflow:hidden; white-space:nowrap; text-overflow:ellipsis; display:block; margin-bottom:5px;}
.img_brd1 li > a .hover .more_btn { transition:.3s ease; border:1px solid #fff;  color:#fff; display:inline-block; padding:4px 15px; background:url("/resources/img/gallery/more_ico.png") no-repeat 150% center; }
.img_brd1 li:hover > a .txt {opacity:0}
.img_brd1 li:hover > a .img img { transform:translate3D(-50%, -50%, 0) scale(1.2);}
.img_brd1 li:hover > a .hover { transform:translateY(0);}
.img_brd1 li:hover > a .hover .more_btn { padding:4px 35px 4px 15px; background-position:90% center;}

@media screen and (max-width: 768px){
    .img_brd1 ul { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (max-width: 500px){
    .img_brd1 ul { grid-template-columns: repeat(1, 1fr); }
}



/* 게시판 view - image2 skin */
.img_brd2 ul { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap:2%; gap:2%; }
.img_brd2 li { position: relative; }
.img_brd2 li > a { display:block; position:relative; border: 1px solid #ddd; padding: 18px 22px; }
.img_brd2 li::before {transition: all .1s ease-in-out .1s; top: 0; left: 0; content:'';}
.img_brd2 li::after{transition: all .1s ease-in-out .2s; top: 0; right: 0; content:'';}
.img_brd2 li a::before {transition: all .1s ease-in-out .3s; bottom: -1px; right: 0; content:'';}
.img_brd2 li a::after{transition: all .1s ease-in-out .4s; bottom: -1px; left: -1px; content:'';}
.img_brd2 li::before, .img_brd2 li::after, .img_brd2 li a::before, .img_brd2 li a::after { content: ""; display: block; position: absolute; background-color: var(--main-bg); z-index: 1; }
.img_brd2 li::before, .img_brd2 li a:before {width: 0%; height: 3px;}
.img_brd2 li::after, .img_brd2 li a:after {width: 3px; height: 0%;}
.img_brd2 li:hover::after, .img_brd2 li:hover a::after {height: 100%;}
.img_brd2 li:hover::before, .img_brd2 li:hover a::before {width: 100%;} 

.img_brd2 li > a .img { width:100%; height:0; position:relative; overflow:hidden; background: #ebebeb; padding-bottom: 75%; }
.img_brd2 li > a .img img { transition:.3s ease; background:#fff; position:absolute; top:50%; left:50%; transform:translate3D(-50%, -50%, 0); width: 100%;}
.img_brd2 li:hover > a .img img { transform:translate3D(-50%, -50%, 0) scale(1.2);}

.img_brd2 li .title {font-size: 22px; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal;  overflow: hidden;  padding: 20px 0 7px; transition: all .2s ease;}
.img_brd2 li .date {padding-bottom: 7px; color: #777;  font-size: 16px;}
.img_brd2 li .txt {overflow: hidden; text-overflow: ellipsis; white-space: normal; line-height: 140%; height: 2.7em;  text-align: left; word-wrap: break-word; display: -webkit-box;  -webkit-line-clamp: 2; -webkit-box-orient: vertical; color: #777;  font-size: 18px; word-break: break-all; font-size: 16px;}

.ImgCover li > a .img img.wide {height: 100%; width: auto;}
.ImgCover li > a .img img.tall {width: 100%; height: auto;}

.ImgContain li > a .img img.wide {width: 100%; height: auto;}
.ImgContain li > a .img img.tall {width: auto; height: 100%;}



/* 게시판 list - youtube skin */
.iframe-wrap { width:100%; height:0px; padding-bottom:56.25%; position: relative; background:#ddd; }
.iframe-wrap iframe { width:100%; height:100%; position: absolute; left:0px; top:0px; }
.iframe-wrap img { width:100%; height:100%; position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); object-fit: cover; transition: 0.3s; }
    
.media-wrap ul { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap:2%; }
.media-wrap li { width:100%; position: relative; }
.media-wrap li:hover .media-info-wrap { opacity: 1; }
.media-info-wrap { display: flex; flex-direction: column; justify-content: end; flex-wrap:wrap; padding: 32px 30px; position: absolute; left:0px; top:0px; width:100%; height:100%; background: rgba(0,0,0,.2); color:white; transition: 0.3s; opacity: 0; pointer-events: none; cursor: pointer; }
.media-info-wrap p { width: 100%; }
.media-info-wrap a { color:white; }
.media-info-wrap .info-tit { font:500 20px/125% 'Spoqa Han Sans Neo'; }
.media-info-wrap .info-name { margin-top:5px; font:400 16px/125% 'Spoqa Han Sans Neo'; }

    /* 게시판 팝업 */
    .pop-wrap { display:none; position:fixed; width:100%; max-width: 1280px; padding: 50px 0px; min-height: 300px; max-height:90vh; left:50%; top:50%; transform:translate(-50%,-50%); background: #fff; overflow-y: auto; transition: all 0.3s; z-index: 502; }
	.pop-wrap::-webkit-scrollbar { width: 5px; }
	.pop-wrap::-webkit-scrollbar-thumb { max-height:80%; background-color: var(--sub-black); border-radius: 7px; }
	.pop-wrap::-webkit-scrollbar-track { background: #ddd; border-radius: 7px;}
	.pop-wrap.active { display:block; transform:translate(-50%,-50%); box-shadow: 0px 2px 50px rgba(0,0,0,0.15); }
    
  .pop-wrap .close { width: 36px; height: 36px; cursor: pointer; position: absolute; right: 30px; top: 30px; z-index: 600; }
	.pop-wrap .close span { display: block; width: 2px; height: 32px; background-color: var(--main-black); position: absolute; top: 9px; left: 17px; transform: rotate(45deg); }
	.pop-wrap .close span:last-child { transform: rotate(-45deg);}

    .pop-cont-wrap { width: 100%; max-width:1024px; margin:0 auto; position: relative; }

    .pop-cont-wrap .pop-info-wrap { display: flex; justify-content: space-between; align-items: end; margin-bottom: 24px; }
    .pop-cont-wrap .pop-info-wrap .pop-tit { max-width: 600px; font:700 24px/125% 'SUIT'; }
    .pop-cont-wrap .pop-info-wrap .pop-cc { text-align: right; font:500 15px/125% 'SUIT'; }
    .pop-cont-wrap .pop-info-wrap .pop-cc p { margin-bottom: 6px; }
    .pop-cont-wrap .pop-info-wrap .pop-cc span { font-weight: 200; display: inline-block; font-size: 17px; margin-right: 14px; }
	
    @media screen and (max-width: 1280px){
        .pop-wrap { width: 100vw; height: 100%; max-height: 100%; padding: 40px; }
        .pop-cont-wrap .pop-info-wrap { display: block; }
        .pop-cont-wrap .pop-info-wrap .pop-cc { text-align: left; margin-top: 20px; }
    }
    @media screen and (max-width: 1024px){
        .media-wrap ul { grid-template-columns: repeat(2, 1fr); }
        .media-info-wrap { opacity: 1; background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); } 
    }
    @media screen and (max-width: 768px){
        .media-wrap ul { grid-template-columns: repeat(1, 1fr); }
        .pop-cont-wrap .pop-info-wrap .pop-tit { max-width: calc(100% - 50px); }
    }
    @media screen and (max-width: 500px){
        .pop-wrap { padding: 40px 20px; }
    }


/* FAQ 자주 묻는 질문 */
.faq .sec1 .c_box {margin: 0 0 30px;}
.faq .faq_wrap { border-top: 2px solid var(--main-bg);  border-bottom: 1px solid #d2d2d2;}
.faq .faq_wrap .faq_box:first-child {border-top: none;}
.faq .faq_wrap .faq_box { border-top: 1px solid #d2d2d2; }
.faq .faq_wrap .faq_q {min-height: 50px; background: #fff; display: table; cursor: pointer; width:100%;}
.faq .sec {margin-top: 30px;}
.faq .faq_ti {font-size: 22px; font-weight: 600; color: var(--main-bg); margin-bottom: 10px;}
.faq .faq_wrap .ico { width: 50px; min-height: 50px; height: 100%; background: var(--main-bg); display: table-cell; color: #fff; text-align: center; vertical-align: middle;   font-weight: 600; font-size: 18px;}
.faq .faq_wrap .con {height: 100%; width: calc(100% - 50px); vertical-align: middle; padding: 10px 15px; display: table-cell;}
.faq .faq_wrap .con > span {font-weight: 500;}
.faq .faq_wrap .faq_a {  float: left; width: 100%; background: #fff; display: table; display: none; border-top: 1px solid #d2d2d2;}
.faq .faq_wrap .faq_a .ico {background: #f9f9f9; color: var(--main-bg);}
.faq .faq_wrap .faq_a .con {padding: 20px 15px;}
.faq .con > ol.basic > li > ul > li {color: #777;}
.faq .empty {padding: 20px; text-align: center;}
.faq .faq_wrap .faq_a .con b {font-weight: 600;}
.faq .faq_wrap .faq_a .con a { display: inline-block; background:#fff url("/resources/img/common/newwin_b.png") no-repeat 18px 8px;cursor:pointer; border:1px solid #d2d2d2; background-color:#f4f4f4; border-radius:30px; padding:6px 15px 6px 38px; transition: all 0.3s ease 0s; margin-top: 3px;}
.faq .faq_wrap .faq_a .con a:hover { background: #e0e0e0 url("/resources/img/common/newwin_b.png") no-repeat 18px 8px; color:#282828; border:1px solid #c0c0c0; }

/*faq2*/
.faq2 .sec1 .c_box {margin: 0 0 30px;}
.faq2 .faq_wrap .faq_box:first-child {margin-top:0;}
.faq2 .faq_wrap .faq_box {cursor: pointer;background: #fff;  padding: 20px; border: 1px solid #ddd; margin-top: 10px;}
.faq2 .faq_wrap .faq_q {display: table;width:100%; position: relative;}
.faq2 .faq_wrap .faq_q .con {padding-right: 25px;}
.faq2 .faq_wrap .faq_q::before {content: ""; position: absolute;width: 15px; height: 9px; background: url("/resources/img/common/faq_arw.png") center no-repeat; top: 50%; right: 0; transform: translateY(-50%) rotate(0deg);; transition: all .3s ease-in-out;}
.faq2 .faq_wrap .faq_box.on .faq_q::before {transform: translateY(-50%) rotate(180deg);}
.faq2 .faq_wrap .faq_box.on { border-color: var(--main-bg);}
.faq2 .sec {margin-top: 30px;}
.faq2 .faq_ti {font-size: 22px; font-weight: 600; color: var(--main-bg); margin-bottom: 10px;}
.faq2 .faq_wrap .ico {width: 30px;height: 100%;display: table-cell;color: var(--main-bg); vertical-align: middle;font-weight: 500;}
.faq2 .faq_wrap .con {height: 100%;width: calc(100% - 30px);vertical-align: middle; display: table-cell;}
.faq2 .faq_wrap .con > span {font-weight: 500;}
.faq2 .faq_wrap .faq_a {float: left;width: 100%;background: #fff;display: table;display: none;border-top: 1px solid rgba(210, 210, 210, 0);padding-top: 15px;margin-top: 15px;}
.faq2 .faq_wrap .faq_box.on .faq_a { border-color: rgba(210, 210, 210, 1);}
.faq2 .faq_wrap .faq_a .ico {color: var(--main-bg);}
.faq2 .faq_wrap .faq_a .con {height: 100%;width: calc(100% - 50px);vertical-align: middle; display: table-cell;}
.faq2 .con > ol.basic > li > ul > li {color: #777;}
.faq2 .empty {padding: 20px; text-align: center;}
.faq2 .faq_wrap .faq_a .con b {font-weight: 600;}
.faq2 .faq_wrap .faq_a .con a { display: inline-block; background:#fff url("/resources/img/common/newwin_b.png") no-repeat 18px 8px;cursor:pointer; border:1px solid #d2d2d2; background-color:#f4f4f4;  padding:6px 15px 6px 38px; transition: all 0.3s ease 0s; margin-top: 3px;}
.faq2 .faq_wrap .faq_a .con a:hover { background: #e0e0e0 url("/resources/img/common/newwin_b.png") no-repeat 18px 8px; color:#282828; border:1px solid #c0c0c0; }


/* parsley S */
input.parsley-success,
select.parsley-success,
textarea.parsley-success {
  color: #468847;
  background-color: #DFF0D8;
  border: 1px solid #D6E9C6;
}

input.parsley-error,
select.parsley-error,
textarea.parsley-error {
  color: #B94A48;
  background-color: #F2DEDE;
  border: 1px solid #EED3D7;
}

.parsley-errors-list {
  margin: 2px 0 3px;
  padding: 0;
  list-style-type: none;
  font-size: 0.9em;
  line-height: 0.9em;
  opacity: 0;
  color: #B94A48;

  transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
}

.parsley-errors-list.filled {
  opacity: 1;
}
/* parsley E */