@charset "UTF-8";
/*-------------------------------------------------------------------
    파일정의 : 테이블 스타일 TYPE 1
    분류순서 : Table > Board List > Board Read & Write
    속성순서 : Display > Position > Box Model > Design > Paragraph
    미디어쿼리순서 : Mobile > Tablet > PC

    컬러 리스트
    -----------------
    메인컬러 : #00a9aa, #5c439b
    서브컬러 : #eb425d, #f8b62d

    폰트사이즈 기준
    -----------------
    Mobile : 1rem = 13px
    Tablet : 1rem = 16px
    PC : 1rem = 18px

    디바이스 크기별 폰트사이즈 조정 시 아래 형식과 같이 기준폰트 변경으로 일괄 조정
    @media only screen and (max-width: 767px){
    	html, body {font-size: 10px;}
    }

    Mobile : (max-width: 767px) / html, body {font-size: 13px;}
    Tablet : (min-width: 768px) and (max-width: 1263px) / html, body {font-size: 16px;}
    PC : (min-width: 1264px) / html, body {font-size: 18px;}
-------------------------------------------------------------------*/
/*-------------------------------------------------------------------
    Table
-------------------------------------------------------------------*/
/* Common */
.tbl {}
.tbl tbody + tbody {border-top: 1px solid #e0e0e0;}
.tbl th,
.tbl td {font-size: 16px;}
.tbl td > a {text-overflow: ellipsis;overflow: hidden; color:#616161}
.tbl th {}
.tbl td {}
.tbl .tbl {min-width: auto !important; border-left: 1px solid #e0e0e0;}
.tbl .tbl tr:first-child {border-bottom: 1px solid #e0e0e0;}
.tbl tbody tr {counter-increment: rowcount;}
.tbl tbody tr .col-count::before {content: counter(rowcount) "";}

.col-object-image {width: 20.444rem;}
.col-object-image p {width: 17.778rem; height: 13.333rem; margin: 1px; background: #e4ebed; box-sizing: border-box; font-size: 0;}
.col-object-detail {position: relative; vertical-align: top;}
.col-object-detail dl {}
.col-object-detail dl::before {position: absolute; top: 1.167em; bottom: 1.167em; left: 0; border-left: 1px dashed #e0e0e0; content: "";}
.col-object-detail dl dt {margin: 1em 0 1.5em 0; font-weight: 700; color: #212121;}
.col-object-detail dl dd {margin-top: 0.5em; color: #757575;}

/* Normal Table */
/* Basic */
.tbl-normal {border-bottom: 1px solid #424242}
.tbl-normal th,
.tbl-normal td {padding:10px 21px; line-height: 1.3;}
.tbl-normal th {/*background: #ECF5FB;*/ background: #FAFAFA;font-weight: 400; color: #616161;}
.tbl-normal td {}
/* Horizontal */
.tbl-horizontal {}
.tbl-horizontal th,
.tbl-horizontal td {border-top: 1px solid #e0e0e0;}
.tbl-horizontal tr:first-child th,
.tbl-horizontal tr:first-child td {border-top: none;}
.tbl-horizontal th {border-right: 1px solid #e0e0e0;}
.tbl-horizontal td {}
/* Vertical */
.tbl-vertical {}
.tbl-vertical th,
.tbl-vertical td {border-left: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0;}
.tbl-vertical th {}
.tbl-vertical td {border-top: 1px solid #e0e0e0;}
.tbl-vertical th:first-child,
.tbl-vertical td:first-child {border-left: none;}
.tbl-vertical th:last-child,
.tbl-vertical td:last-child {border-right: none;}
.tbl-vertical tr:first-child td {border-top: none;}

/* Board */
.board-bottom {margin-top: 35px; position: relative;}

@media only screen and (max-width: 767px) {
    .tbl .caption {padding: 0 15px;}
    .col-object-image,
    .col-object-detail {display: block;}
    .col-object-detail dl::before {top: 0; right: 0; bottom: auto; right: 0; border: none; border-top: 1px dashed #e0e0e0; content: "";}
    .col-object-detail dl dt {margin-top: 0;}

.bbs-list.basic-type.notice .tbl tbody tr {text-align: right;}
.bbs-list.basic-type.notice .tbl tbody tr td.col-title {text-align: left; width: 100%;}
.bbs-list.basic-type.notice .tbl tbody tr td.col-number {display: none;}
.bbs-list.basic-type.notice .tbl tbody tr td.col-date {display: none;}
.bbs-list.basic-type.notice .tbl tbody tr td.col-way {position: relative; margin-left: 18px; padding-left: 20px; overflow: visible; font-size: 14px;}
.bbs-list.basic-type .tbl .col-title ~ td {margin-top:25px;}
.bbs-list.basic-type .tbl .col-part::before {background: url(../images/common/database-line.png)}

}

/*-------------------------------------------------------------------
    Board List
-------------------------------------------------------------------*/
/* Common */
.bbs-list .board-top {margin-bottom: 1.333rem;}
.bbs-list .board-top .board-total {font-size: 0.889rem;}
.bbs-list .board-top > div > .search,
.bbs-list .board-top .search-box {max-width: 30.889rem; margin: 0 auto;}
.bbs-list .board-top.board-top-box {position: relative; margin: 0; border: 1px solid #e0e0e0; border-top: 4px solid #6448a1; background: #f5f8f9;}
.bbs-list .board-inner {overflow: auto;}
.bbs-list .board-inner .tbl {min-width: 500px;}

.board-bottom > .btn_admin {position: absolute; right: 0; top: -4px;}
.btn.write { box-sizing: border-box; padding: 0 18px 0 32px; height: 40px; text-align: center;  line-height: 40px; color: #fff;
background: #2E8CD7; font-size: 16px; position: relative;}
.btn.write::before {content: ''; position: absolute; width: 18px; height: 18px; background: url('../images/common/btn_write.png');top: 13px;  left: 9px;}

.btn.list {float: left;}
.button-box > .btn_admin {float: right;}
.button-box > .btn_admin > .btn {box-sizing: border-box; padding: 0 22px 0 36px; height: 40px; text-align: center;  line-height: 40px; color: #fff; font-size: 14px; position: relative;}
.button-box > .btn_admin > .btn + .btn {margin-left: 5px;}
.btn.remove { background: #424242; }
.btn.modify {background: #2E8CD7;}
.btn.remove::before {content: ''; position: absolute; width: 18px; height: 18px; background: url('../images/common/btn_remove.png');top: 12px;  left: 13px;}
.btn.modify::before {content: ''; position: absolute; width: 18px; height: 18px; background: url('../images/common/btn_write.png');top: 12px;  left: 12px;}

/* Box Type */
.board-box-wrapper {}
.board-box-wrapper > p {margin: 3.111rem 0;}
.board-box-wrapper > ul {font-size: 0;}
.board-box-wrapper > ul > li {display: inline-block; vertical-align: top; margin-left: 3.2%; border: 1px solid #e0e0e0; box-sizing: border-box; transition: all 0.3s;}
.board-box-wrapper > ul > li:hover {box-shadow: 0 3px 7px rgba(224,224,224,1);}
.board-box {position: relative;}
.board-box .btn_detail {position: absolute; right: 0; bottom: 0; width: 3.556rem; height: 3.556rem; background: #6448a1; transition: opacity 0.3s;}
.board-box .btn_detail::before {position: absolute; top: 50%; left: 50%; width: 0.889rem; height: 0.111rem; margin: -0.056rem 0 0 -0.444rem; background: #fff; content: "";}
.board-box .btn_detail::after {position: absolute; top: 50%; left: 50%; width: 0.111rem; height: 0.889rem; margin: -0.444rem 0 0 -0.056rem; background: #fff; content: "";}

/* Full & Down Type */
.board-fold-wrapper {border-top: 4px solid #6448a1; border-bottom: 1px solid #e0e0e0;}
.board-fold-wrapper > ul {}
.board-fold-wrapper > ul > li {}
.board-fold-wrapper > ul > li > p {padding: 1.333em 15px; font-size: 1rem;}
.board-fold-wrapper > ul > li > a {display: block; position: relative; width: 100%; padding: 1.167em 6.5em; border-top: 1px solid #e0e0e0; box-sizing: border-box; font-size: 1rem;}
.board-fold-wrapper > ul > li:first-child > a {border-top: none;}
.board-fold-wrapper > ul > li > a > span:first-child {position: absolute; top: 0.833em; left: 1.889em; width: 1.889em; height: 1.889em; border: 2px solid #bdbdbd; border-radius: 50%; box-sizing: border-box; text-align: center; line-height: 1.667em; color: #bdbdbd;}
.board-fold-wrapper > ul > li > div {display: none; position: relative; padding: 1.167em 6.5em; border-top: 1px solid #e0e0e0; background: #f5f8f9; font-size: 1rem;}
.board-fold-wrapper > ul > li > div > span:first-child {position: absolute; top: 0.833em; left: 1.889em; width: 1.889em; height: 1.889em; border-radius: 50%; background: #00a9aa; text-align: center; line-height: 1.889em; color: #fff;}
.board-fold-wrapper > ul > li > a > span:first-child + span,
.board-fold-wrapper > ul > li > div > span:first-child + span {line-height: 1.3;}
.board-fold-wrapper .btn_fold::after {position: absolute; top: 1.5rem; right: 1.889rem; width: 0.556rem; height: 0.556rem; border-bottom: 2px solid #424242; border-right: 2px solid #424242; content: ""; transform: rotate(45deg); transition: rotate 0.3s;}
/* Hovering */
.board-fold-wrapper > ul > li:hover > a > span:first-child {border-color: #f8b62d; color: #f8b62d;}
.board-fold-wrapper > ul > li:hover > a > span:first-child + span {text-decoration: underline;}
/* Selected */
.board-fold-wrapper > ul > li.selected > a > span:first-child {border-color: #f8b62d; background: #f8b62d; color: #fff;}
.board-fold-wrapper > ul > li.selected > a > span:first-child + span {font-weight: 400; color: #212121;}
.board-fold-wrapper .selected .btn_fold::after {transform: rotate(-135deg);}

/* 기본형, Q&A형 */
.bbs-list.basic-type .tbl {border-top: 2px solid #2E8CD7;}
.bbs-list.basic-type .tbl thead {border-bottom: 1px solid #bdbdbd;background: #FAFAFA; }
.bbs-list.basic-type .tbl tbody tr{box-sizing: border-box; border-bottom:1px solid #ddd;}

.bbs-list.basic-type .tbl th,
.bbs-list.basic-type .tbl td {text-overflow: ellipsis;
    white-space: nowrap;  overflow: hidden;}
.bbs-list.basic-type .tbl th {font-weight: 100; color: #424242;}
.bbs-list.basic-type .tbl td {color: #757575;}
.bbs-list.basic-type .tbl .col-title a {/*display: inline-block;*/}
.bbs-list.basic-type .ellipsis.after-icon {position: relative; padding-right: 1.2em; box-sizing: border-box;}
.bbs-list.basic-type .ellipsis.after-icon i {position: absolute; top: 50%; right: 0; margin-top: -0.5em;}
/*공지아이콘->텍스트변경(2020-11-19)*/
/*.bbs-list.basic-type .tbl .col-number.text-icon {font-size: 0px; position: relative;}
.bbs-list.basic-type .tbl .col-number.text-icon::before {content: ''; position: absolute; width:40px; height: 40px; background: url('../images/common/notice.png') no-repeat; top:13px; left: 15px;}*/
.bbs-list.basic-type .tbl .col-number.text-icon {padding: 0;}
.bbs-list.basic-type .tbl .col-number.text-icon span {display: inline-block; padding: 6px 8px; border-radius: 5px; background: #1366b6; color: #eef6fb;}
.bbs-list.basic-type .tbl .col-file.text-icon {position: relative;}
.bbs-list.basic-type .tbl .col-file.text-icon::before {content: ''; position: absolute; width:14px; height: 18px; background: url('../images/common/file.png') no-repeat;left: 30px}
.bbs-list.basic-type .tbl .new .col-title,
.bbs-list.basic-type .tbl .hot .col-title {position: relative;text-overflow: ellipsis; white-space: nowrap;  overflow: hidden; padding-left: 24px;}
.bbs-list.basic-type .tbl .new.hot .col-title {padding-left: 46px;}
.bbs-list.basic-type .tbl .new .col-title::before {content: ''; position: absolute; width:18px; height: 18px; background: url('../images/common/new.png') no-repeat; top: 50%; transform: translateY(-50%);  -ms-transform: translateY(-50%); left:0;}
.bbs-list.basic-type .tbl .hot .col-title::after {content: ''; position: absolute; width:18px; height: 18px; background: url('../images/common/hot.png') no-repeat; top: 50%; transform: translateY(-50%);  -ms-transform: translateY(-50%); left:0;}
.bbs-list.basic-type .tbl .col-file.text-icon {width: 8%; line-height: 40px; vertical-align: top; margin-top:0px;}
.bbs-list.basic-type .tbl .new.hot .col-title::after {left: 22px}

.bbs-list.basic-type .tbl tr.none td {background: #FAFAFA}
.bbs-list.basic-type .tbl tr.none img {margin-bottom: -2px; margin-right: 3px;}
/* 블로그형 */
.bbs-list.blog-type .tbl {border-top: 4px solid #6448a1; border-bottom: 1px solid #6448a1;}

.bbs-list.blog-type .tbl td {padding: 1.333em 0.667em; border-top: 1px solid #e0e0e0; text-align: center;}
.bbs-list.blog-type .tbl tr:first-child td {border-top: none;}
.bbs-list.blog-type .tbl .col-views {width: 5rem; font-size: 0.778rem; line-height: 16px; color: #757575;}
.bbs-list.blog-type .tbl .col-views::before {display: inline-block; vertical-align: top; width: 18px; height: 16px; margin-right: 10px; background: url("../img/common/ico_user.png") no-repeat 0 0; content: "";}
.bbs-list.blog-type .tbl .col-date {width: 5rem; line-height: 1.222rem;}
.bbs-list.blog-type .tbl .col-date small {font-size: 1rem; font-weight: 400; color: #595757;}
.bbs-list.blog-type .tbl .col-date big {font-size: 1.111rem; font-weight: 500; color: #eb425d;}
.bbs-list.blog-type .tbl td.col-title {text-align: left;}
.bbs-list.blog-type .tbl .col-title small span {font-size: 0.778rem; line-height: 1.333rem; font-weight: 400; color: #757575;}
.bbs-list.blog-type .tbl .col-title big a {font-size: 1rem; line-height: 1.333rem; font-weight: 400; color: #212121;}



/* 박스형 */
.bbs-list.box-type .board-box-wrapper {border-bottom: 1px solid #e0e0e0;}
.bbs-list.box-type .board-box-wrapper > ul {margin: 3.111rem 0 1.333rem 0;}
.bbs-list.box-type .board-box-wrapper > ul > li {padding: 1.333rem;}
.bbs-list.box-type .board-box .post-date {font-size: 1rem; font-weight: 400; color: #00aaaa;}
.bbs-list.box-type .board-box .post-detail {margin: 1rem 0 2rem 0;}
.bbs-list.box-type .board-box .post-detail dt {margin-bottom: 1rem; font-size: 1.333rem; font-weight: 400; color: #212121;}
.bbs-list.box-type .board-box .post-detail dt span {height: 2.2em; max-height: 2.2em; line-height: 1.1em; -webkit-line-clamp: 2;}
.bbs-list.box-type .board-box .post-detail dd {font-size: 1rem; color: #757575;}
.bbs-list.box-type .board-box .post-detail dd span {height: 5.2em; max-height: 5.2em; line-height: 1.3em; -webkit-line-clamp: 4;}
.bbs-list.box-type .board-box .post-views {font-size: 0.778rem; line-height: 16px; color: #757575;}
.bbs-list.box-type .board-box .post-views::before {display: inline-block; vertical-align: top; width: 18px; height: 16px; margin-right: 10px; background: url("../img/common/ico_user.png") no-repeat 0 0; content: "";}

/* 포토갤러리형 */
.bbs-list.photo-gallery-type .board-box-wrapper {border-top: 4px solid #6448a1; border-bottom: 1px solid #e0e0e0;}
.bbs-list.photo-gallery-type .board-box-wrapper > ul {margin: 1.333rem 0;}
.bbs-list.photo-gallery-type .board-box .post-image {height: 8.056rem; margin: 1px; background: #e4ebed; box-sizing: border-box;}
.bbs-list.photo-gallery-type .board-box .post-detail {padding: 1.333rem;}
.bbs-list.photo-gallery-type .board-box .post-detail dt {margin-bottom: 1rem; font-size: 1.333rem; font-weight: 400; color: #212121;}
.bbs-list.photo-gallery-type .board-box .post-detail dt span {height: 2.2em; max-height: 2.2em; line-height: 1.1em; -webkit-line-clamp: 2;}
.bbs-list.photo-gallery-type .board-box .post-detail dd {display: inline-block; vertical-align: middle; font-size: 0.778rem;}
.bbs-list.photo-gallery-type .board-box .post-detail dd + dd {position: relative; margin-left: 0.5rem; padding-left: 0.556rem;}
.bbs-list.photo-gallery-type .board-box .post-detail dd + dd::before {position: absolute; top: 50%; left: 0; height: 0.611rem; margin-top: -0.306rem; border-left: 1px solid #bdbdbd; content: "";}
.bbs-list.photo-gallery-type .board-box .post-detail dd b {font-weight: 400;}
.bbs-list.photo-gallery-type .board-box .post-detail dd span {color: #757575;}

/* FAQ형 */
.bbs-list.faq-type .board-fold-wrapper {margin-bottom: 3.556rem;}


/*일반 서브페이지 세로형*/
.tbl.sub {border-top: 2px solid #2E8CD7;}
.tbl.sub + .tbl.sub {margin-top:30px;}
.tbl.sub thead tr th {/*background: #ECF5FB*/;color:#424242;}
.tbl.sub thead tr + tr {border-top: 1px solid #e0e0e0}
.tbl.sub tbody tr td {color:#757575}
.tbl.sub thead tr th, .tbl.sub tbody tr td { padding: 10px 10px;text-overflow: clip; white-space: normal; vertical-align: middle; word-break: break-all;}
.tbl.sub tbody tr td.align-left {padding-left: 15px}
.tbl.sub tbody tr td.align-left strong {margin-bottom: 5px; display: block; font-weight: 400}
.tbl.sub tbody tr {border-top:1px solid #e0e0e0;}
.tbl.sub tbody tr td.align-left br + strong {margin-top: 20px;}
.tbl.sub tbody tr td .table_down { display: inline-block; width:93px; height: 32px; line-height: 32px; background: #004795; border-radius: 16px; text-align: left; vertical-align: middle; font-size: 16px; color:#Fff; box-sizing: border-box; padding: 0 8px; position:relative;}
.tbl.sub tbody tr td .table_down::after {content: ''; position: absolute; background: url('../images/content/table_down.png'); width:15px; height: 14px;top: 9px; right: 7px;}
.tbl.sub tbody tr td .table_link { display: inline-block; width:93px; height: 32px; line-height: 32px; background: #004795; border-radius: 16px; text-align: left; vertical-align: middle; font-size: 16px; color:#Fff; box-sizing: border-box; padding: 0 8px; position:relative;}
.tbl.sub tbody tr td .table_link::after {content: ''; position: absolute; background: url('../images/content/table_link2.png'); width:15px; height: 15px;top: 8px; right: 7px;}
/* bbs search */
.bbsSearch {display: table; box-sizing: border-box; width: 100%; height: 80px;border-radius: 4px;}
.bbsSearch > div {display: table-cell; vertical-align: middle;}
.bbsSearch .total {text-align: left; font-size: 0;}
.bbsSearch .total > span {display: inline-block; vertical-align: middle; font-weight: 300; font-size: 15px; color: #616161;}
.bbsSearch .total > span > b {font-weight: 300; color: #1461BA; font-size: 15px;}
.bbsSearch .searchArea {position: relative; text-align: right; font-size: 0;}
.bbsSearch .searchArea > select {/*position: relative;*/ width: 104px; height: 40px; margin-right: 5px; padding: 0 0px 0 5px; border: 1px solid #E0E0E0; border-radius: 0px; background: #fff url(../images/common/ico_select.png) no-repeat right center; font-weight: 100; font-size: 14px; color: #616161;}
/* .bbsSearch .searchArea > select::before {position: absolute; top: 7px; right: 36px; bottom: 7px; border-left: 1px solid #eee; content: "";}
.bbsSearch .searchArea > select::after {position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-right: 2px solid #1872CC; border-bottom: 2px solid #1872CC; content: ""; transform: rotate(45deg);} */
.bbsSearch .searchArea > input {width: 276px; height: 40px; padding: 0 10px; border: 1px solid #E0E0E0 !important; border-radius: 0px; background: #fff; font-weight: 100; font-size: 14px; color: #9E9E9E; box-sizing: border-box; vertical-align: bottom}
.bbsSearch .searchArea .searchBtn {position: absolute; right: 0px; width: 40px; height: 40px; border-radius: 4px; background: url(../images/common/search-line.png) no-repeat center center;
}
.bbsSearch.type2{position:relative;padding:12px 0;background:none;border:0px none;border-bottom:1px solid #e5e5e5;text-align:right;}
.bbsSearch.type2 .total{display:block;position:absolute;left:0;top:50%;margin-top:-10px;}
.bbsSearch.type2 select{background:#f0f0f0;}
.bbsSearch.type3{margin-bottom:10px;padding:5px 0;border:0px none;background:none;}


.bbsSearch.sub02_02  {height: 60px;}
.bbsSearch.sub02_02 .searchArea .select_box {display: inline-block;}
.bbsSearch.sub02_02 .searchArea .select_box + .select_box {margin-left: 12px}
.bbsSearch.sub02_02 .searchArea  select {outline: none; height: 35px; padding: 0 0px 0 5px; border: 1px solid #E0E0E0;  border-radius: 0px; background: #fff url(../images/common/ico_select.png) no-repeat right center; font-weight: 100; font-size: 14px; color: #616161;}
.bbsSearch.sub02_02 .searchArea  select + label {margin-left: 10px;}
.bbsSearch.sub02_02 .searchArea  label {font-size: 14px; margin-right: 5px; font-weight: 300; position: relative; box-sizing: border-box; padding-left:7px; }
.bbsSearch.sub02_02 .searchArea  label::before {content: ''; position: absolute;    width: 3px;
height: 3px;background: #01A390; left: 0;  top: 9px;}
.bbsSearch.sub02_02 .searchArea  select.part {width:150px;}
.bbsSearch.sub02_02 .searchArea  select.subject {width:180px;}
.bbsSearch.sub02_02 .searchArea .searchBtn {display: inline-block; position: relative; border:1px solid #e0e0e0; vertical-align: top; border-radius: 0;box-sizing: border-box; width: 35px; height: 35px;}
.bbsSearch.sub02_02 .searchArea .searchBtn span {font-size: 0;}

/*border-neighbor*/
.border-neighbor {border-top: 1px solid #CFD8DC; margin-top:20px;}
.border-neighbor .notice-prev {border-top:0px;}
.border-neighbor .notice-prev dl dt::after {position: absolute; top: 50%; left:8px; width: 5px; height: 5px; margin-top: -2px; border-right: 2px solid #2E8CD7; border-bottom: 2px solid #2E8CD7; transform: rotate(-135deg);
content: "";}
.border-neighbor .notice-prev dl dt::before{position: absolute; top: 50%; left:0; width: 21px; height: 21px; margin-top: -12px; border-radius: 50%; border: 1px solid #2E8CD7;content: "";}
.border-neighbor .notice-next dl dt::after {position: absolute; top: 50%; left:8px; width: 5px; height: 5px; margin-top: -5px; border-right: 2px solid #2E8CD7; border-bottom: 2px solid #2E8CD7; transform: rotate(45deg);
content: "";}
.border-neighbor .notice-next dl dt::before{position: absolute; top: 50%; left:0; width: 21px; height: 21px; margin-top: -12px; border-radius: 50%; border: 1px solid #2E8CD7;content: "";}
.border-neighbor a {border-bottom: none; border-top: 1px solid #CFD8DC; padding: 15px 10px;font-size: 15px; display: block;}
.border-neighbor a:hover{background: #fafafa;}
.border-neighbor a dl {margin:0;}
.border-neighbor a dl dt {float: left; width: 100px; height: 27px; line-height: 27px; position: relative; padding-left: 35px;  box-sizing: border-box;}
.border-neighbor a dl dd {color: #555; margin-left: 60px; overflow: hidden;  white-space: nowrap;  text-overflow: ellipsis;  line-height: 27px;}

.bbs-read .board-bottom .button-box, .bbs-write .board-bottom .button-box {text-align: center;}



/*블로그형*/
.notice-wrap {border-top: 2px solid #0B439B;}
.noticeList * {transition: all 0.3s;}
.noticeList li {}
.noticeList li > a {display: table; table-layout: fixed; box-sizing: border-box; width: 100%; height: 106px; border: 1px solid transparent; border-bottom-color: #CFD8DC; transition: all 0.1s;}
.noticeList li > a > div {display: table-cell; vertical-align: middle;}
.noticeList li .infoLeft {width: 225px; text-align: center; padding:20px 0;}
.noticeList li .infoLeft .thumb {width: 216px; height: 152px;}
.noticeList li .infoLeft .thumb > img {max-width: 100%; max-height: 100%;}

.noticeList li .infoRight {position: relative; width: calc(100% - 225px); padding: 0 20px 0 12px;}
.noticeList li .infoRight > h3 {display: inline-block; position: relative; overflow: hidden; box-sizing: border-box; max-width: 100%; margin-bottom: 21px; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; font-size: 20px; color: #212121;
}

.noticeList li .infoRight .board_content > p {font-size: 14px; color:#757575;line-height: 1.5rem;height: 40px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;  text-overflow: ellipsis;}

.noticeList li .infoRight .boardInfo {padding-top: 40px; position: relative;}
.noticeList li .infoRight .boardInfo::before {content: ''; position: absolute; top: 21px; right: 0; width: 100%; height: 1px; border-top:1px dashed #ddd;}
.noticeList li .infoRight .boardInfo > div > span {color:#848484; font-size: 14px;}
.noticeList li .infoRight .boardInfo .info_left {float: left;}
.noticeList li .infoRight .boardInfo .info_right {float: right;}
.noticeList li .infoRight .boardInfo .info_right > span {padding-left: 30px; position: relative;}
.noticeList li .infoRight .boardInfo .info_right > span::before {content: ''; position: absolute;width:16px; height: 16px; left: 11px; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); margin-top: 1px;}
.noticeList li .infoRight .boardInfo .info_right > span + span::after {content: '';
    position: absolute; width: 1px; height: 15px; background: #B0BEC5; transform: rotate(15deg); left: 4px;}
.noticeList li .infoRight .boardInfo .info_right .writer::before {background: url('../images/common/writer.png')}
.noticeList li .infoRight .boardInfo .info_right .date::before {background: url('../images/common/date.png')}
.noticeList li .infoRight .boardInfo .info_right .view::before {background: url('../images/common/view.png')}
.noticeList li:hover > a {border: 1px solid #8FC7F6; box-shadow: 0 3px 6px 0 rgba(28,113,145,0.2);}
.noticeList li.empty {background: #fafafa}
.noticeList li.empty > p {box-sizing: border-box; height: 106px; border-bottom: 1px solid #CFD8DC; text-align: center; font-weight: 400; font-size: 16px; line-height: 106px; color: #797676;}
.noticeList li.empty > p > img {margin-bottom: -2px; margin-right: 3px;}
.noticeList li.notice .infoRight > h3 {padding-left: 40px;}
.noticeList li.notice .infoRight > h3::before {position: absolute; left: 0; width: 30px; height: 20px; border-radius: 4px; background: #1d84df; text-align: center; font-weight: 700; font-size: 12px; line-height: 20px; color: #fff; content: "공지";}
/*.noticeList li.file .infoRight::after {position: absolute; top: 50%; right: 48px; width: 40px; height: 40px; margin-top: -20px; border-radius: 50%; background: #F5F5F5 url(../images/common/ico_file.png) no-repeat center center; content: "";}*/
.noticeList li.new .infoRight > h3 {padding-right: 30px;}
.noticeList li.hot .infoRight > h3 {padding-right: 30px;}
.noticeList li.new.hot .infoRight > h3 {padding-right: 50px;}
.noticeList li.new .infoRight > h3::after {content: '';  position: absolute;  width: 18px; height: 18px; background: url(../images/common/new.png) no-repeat; right: 6px; top:2px; }
.noticeList li.hot .infoRight > h3::before {content: '';  position: absolute;  width: 18px; height: 18px; background: url(../images/common/hot.png) no-repeat; right: 6px; top:2px; }
.noticeList li.new.hot .infoRight > h3::after {right: 26px;}
.noticeList li.new.hot .infoRight > h3::before {right: 3px;}


/*학교안내*/
.bbs-list.basic-type.school .tbl th, .bbs-list.basic-type.school .tbl td {padding:17px 2px;}


.bbs-list.basic-type.school .tbl tbody tr:hover th a {color:transparent}
.bbs-list.basic-type.school .tbl tbody tr.school_info > td {padding:30px; background: url('../images/content/school_info_bg.png') no-repeat; background-size: cover;}

.bbs-list.basic-type.school .tbl tbody tr td.col-more {position: relative; cursor: pointer;}
.bbs-list.basic-type.school .tbl tbody tr td.col-more::before {content: ''; position: absolute;width:32px; height: 32px; border-radius: 50%; border:1px solid #003985;top:8px;
left: 50%;transform: translateX(-50%);transition: transform 0.3s;}
.bbs-list.basic-type.school .tbl tbody tr td.col-more.current::before {border-radius: 50%; border:1px solid #003985; background:#003985 }
.bbs-list.basic-type.school .tbl tbody tr td.col-more::after{position: absolute; top: 25px;
right: 45px; width: 7px; height: 7px; margin-top: -4px; border-right: 2px solid #003985; border-bottom: 2px solid #003985; transform: rotate(-45deg); transition: transform 0.3s; content: "";}
.bbs-list.basic-type.school .tbl tbody tr td.col-more.current::after {border-color: #fff;transform: rotate(45deg);margin-top: -5px; right: 43px;}

.school_info tbody tr th, .school_info tbody tr td {padding:13px 2px !important; font-size: 15px !important;}
.school_info tbody tr th {width:7rem; background: #ECF5FB;border-left: 1px solid #ddd; border-right:1px solid #ddd;}
.school_info tbody tr td {background: #fff;text-align: left !important; padding-left: 13px !important;}


@media only screen and (max-width: 767px) {
    /* Common */
    .bbs-list {}
    .bbs-list .board-top,
    .bbs-list .board-bottom {padding: 0 15px;}
    .bbs-list .board-top > div {float: none;}
    .bbs-list .board-top > div + div,
    .bbs-list .board-bottom > div + div {margin-top: 2.778rem;}
    .bbs-list .board-top.board-top-box {padding: 1.111rem 15px;}
    .bbs-list .board-top.board-top-box .board-total {margin-bottom: 1.111rem; text-align: center;}
    .bbs-list.basic-type .tbl tbody tr.none {padding: 0 !important}
    .bbs-list.basic-type .tbl tbody tr.none td {height: 100%; line-height: 110px;}

    .board-bottom > .btn_admin {position: relative; text-align: center; margin-bottom: 20px;}

    /* Box Type */
    .board-box-wrapper {padding: 0 15px;}
    .board-box-wrapper > ul > li {width: 48.4%;}
    .board-box-wrapper > ul > li:nth-child(2n+1) {margin-left: 0;}
    .board-box-wrapper > ul > li:nth-child(n+3) {margin-top: 1.333rem;}

    /* bbs search */
    .bbsSearch {display: block; height: auto; padding-bottom: 16px;}
    .bbsSearch .total {display: block; width: 100%; margin-bottom: 16px; padding: 0;}
    .bbsSearch .searchArea {display: block; width: 100%; padding: 0;}
    .bbsSearch .searchArea > select {display: block; width: 100%; margin: 0 0 10px 0;}
    .bbsSearch .searchArea > input {display: block; width: 100%;}
    .bbsSearch .searchArea .searchBtn {right: 0; bottom: 0;}

    .bbsSearch.sub02_02 {height: auto;}
    .bbsSearch.sub02_02 .searchArea .select_box + .select_box {margin-left: 0; margin-top: 12px;}
    .bbsSearch.sub02_02 .searchArea label {display: block; text-align: left; margin-bottom: 8px; font-size: 14px;}
    .bbsSearch.sub02_02 .searchArea label::before {top:6px}
    .bbsSearch.sub02_02 .searchArea .select_box {width: 100%;}
    .bbsSearch.sub02_02 .searchArea select.part,
    .bbsSearch.sub02_02 .searchArea select.subject {width: calc(100% - 38px)}


    /* 기본형*/
    .bbs-list.basic-type .tbl thead {display: none;}
    .bbs-list.basic-type.first > .tbl,
    .bbs-list.basic-type.first > .tbl > tbody,
    .bbs-list.basic-type.first > .tbl > tr {display: block;}
    .mobile .tbl tr {display: block}
    .bbs-list.basic-type .tbl tr {padding: 17px 3px; border-bottom: 1px solid #e0e0e0; height: 120px; box-sizing: border-box; position: relative;}
    .bbs-list.basic-type .tbl tr::before {content:''; position: absolute; width: 95%; height: 1px; border-top: 1px dashed #ddd;bottom:35px; left: 50%; transform: translateX(-50%); -ms-transfor: translateX(-50%);}
    .bbs-list.basic-type .tbl tr.none::before {display: none;}
    .bbs-list.basic-type .tbl td {padding: 0;}
    .bbs-list.basic-type .tbl td[colspan] {display: block; width: 100%; text-align: center; line-height: 80px;}

    .bbs-list.basic-type .tbl .col-number {float: left; width: 8%; text-align: center; height: 50px; line-height: 50px; min-width: 40px;}
    /*공지아이콘->텍스트변경(2020-11-19)*/
    .bbs-list.basic-type .tbl .col-number.text-icon span {line-height: 1; font-size: 13px;}
    .bbs-list.basic-type .tbl .col-file.text-icon {width:16px; height: 50px; margin-left: 9px; position: absolute;}

.bbs-list.basic-type .tbl tbody tr:hover > td {border-bottom: 0px solid #8FC7F6;border-top: 0px solid #8FC7F6; }

    .bbs-list.basic-type .tbl .col-number + .col-title {}
    .bbs-list.basic-type .tbl .col-title {display: inline-block; font-size: 16px; font-weight: 300; height: 50px; line-height: 50px; width: 87%;padding-right: 20px;padding-left: 10px;box-sizing: border-box;}
    .bbs-list.basic-type .tbl .new .col-title::before {right: 0;}
    .bbs-list.basic-type .tbl .col-title ~ td {display: inline-block; vertical-align: middle; }
    .bbs-list.basic-type .tbl .col-file ~ td {display: inline-block; vertical-align: middle; margin-top: 25px;}
    .bbs-list.basic-type .tbl .col-title ~ td + td {position: relative; margin-left:18px; padding-left: 20px; float: right; overflow: visible; font-size: 14px;}
    .bbs-list.basic-type .tbl .col-title ~ td + td::after {position: absolute; top: 50%; left:-13px; content: ""; width: 1px; height: 20px; background: #E0E0E0; transform: rotate(20deg) translateY(-50%); }
    .bbs-list.basic-type .tbl .col-title ~ td + td::before { content: ''; position: absolute; width: 16px; height: 16px; left: -1px; top: 50%; transform: translateY(-50%);
    margin-top: 1px;}
    .bbs-list.basic-type .tbl .col-views::after {display: none;}
    .bbs-list.basic-type .tbl .col-views::before {background: url(../images/common/view.png);}
    .bbs-list.basic-type .tbl .col-writer::before {background: url(../images/common/writer.png);}
    .bbs-list.basic-type .tbl .col-date::before {background: url(../images/common/date.png);}
    .bbs-list.basic-type .tbl .col-code {display: inline-block; vertical-align: middle; margin-bottom: 0.444em;}
    .bbs-list.basic-type .tbl .col-code + .col-code {position: relative; margin-left: 0.923em; padding-left: 0.944em;}
    .bbs-list.basic-type .tbl .col-code + .col-code::before {position: absolute; top: 50%; left: 0; height: 0.611rem; margin-top: -0.306rem; border-left: 1px solid #e0e0e0; content: "";}
    .bbs-list.basic-type .tbl .col-sub-title {display: block;}

/*Q&A 형*/
.bbs-list.basic-type.answer .tbl .col-number {display: none}
.bbs-list.basic-type.answer .tbl .col-number.text-icon::before {display: none;}
.bbs-list.basic-type.answer .tbl .col-title {width: 100%;  padding-left: 50px;}
.bbs-list.basic-type.answer .tbl .col-date {margin-top: 26px;}
.bbs-list.basic-type.answer .tbl .col-date::after {display: none}
.bbs-list.basic-type.answer .tbl .col-writer {position: relative; margin-left: 18px; padding-left: 20px; float: right; overflow: visible; font-size: 14px;margin-top: 26px;}
.bbs-list.basic-type.answer .tbl .col-writer::before {content: ''; position: absolute; width: 16px; height: 16px; left: -1px; top: 50%; transform: translateY(-50%); margin-top: 1px;background: url(../images/common/writer.png);}
.bbs-list.basic-type.answer .tbl .col-writer::after{position: absolute; top: 50%; left: -13px; content: ""; width: 1px; height: 20px; background: #E0E0E0; transform: rotate(20deg) translateY(-50%);}

.bbs-list.basic-type.answer .tbl .col-progress {position: absolute; left: 3px; margin: 0;padding: 0; top: 22px;}
.bbs-list.basic-type .tbl .col-progress > span {padding:3px 4px !important; display: block; box-sizing: border-box; width: 40px; height: 40px;white-space: normal;}
.bbs-list.basic-type.answer .tbl .col-progress::before {display: none;}
.bbs-list.basic-type.answer .tbl .col-progress::after {display: none;}

/*설문조사*/
.bbs-list.basic-type.survey .tbl tbody tr {text-align: right; height: 110px; padding:11px 3px}
.bbs-list.basic-type.survey .tbl tr::before {bottom: 37px}
.bbs-list.basic-type.survey .tbl .col-number {display: none}
.bbs-list.basic-type.survey .tbl .col-survey {position: absolute; left: 3px; margin: 0;padding: 0; top: 21px;}
.bbs-list.basic-type .tbl .col-survey > span {padding:0 !important; display: block; box-sizing: border-box; width: 53px; height: 30px; line-height: 26px; text-align: center;}
.bbs-list.basic-type.survey .tbl .col-title {width: 100%;  padding-left: 65px; text-align: left;}
.bbs-list.basic-type.survey .tbl .col-date {margin-top: 20px;}
.bbs-list.basic-type.survey .tbl .col-date::after {display: none}
.bbs-list.basic-type.survey .tbl .col-answer {position: relative; margin-left: 18px; padding-left: 20px;overflow: visible; font-size: 14px;margin-top: 20px;}
.bbs-list.basic-type.survey .tbl .col-answer::before {content: ''; position: absolute; width: 16px; height: 16px; left: -1px; top: 50%; transform: translateY(-50%); margin-top: 1px;background: url(../images/common/writer.png);}
.bbs-list.basic-type.survey .tbl .col-answer::after{position: absolute; top: 50%; right: -7px; content: ""; width: 1px; height: 20px; background: #E0E0E0; transform: rotate(20deg) translateY(-50%);}

.bbs-list.basic-type.survey .tbl .col-survey::before {display: none;}
.bbs-list.basic-type.survey .tbl .col-survey::after {display: none;}


/*나의민원 조회*/
.bbs-list.basic-type.claim .tbl tbody tr {text-align: right; height: 110px; padding:11px 3px}
.bbs-list.basic-type .tbl .col-claim > span {padding:0 !important; display: block; box-sizing: border-box; width: 68px; height: 30px; line-height: 26px; text-align: center;}
.bbs-list.basic-type.claim .tbl tr::before {bottom: 37px}
.bbs-list.basic-type.claim .tbl .col-number {display: none}
.bbs-list.basic-type.claim .tbl .col-claim {position: absolute; left: 3px; margin: 0;padding: 0; top: 21px;}
.bbs-list.basic-type.claim .tbl .col-title {width: 100%;  padding-left: 76px; text-align: left;}
.bbs-list.basic-type.claim .tbl .col-date {margin-top: 20px;}
.bbs-list.basic-type.claim .tbl .col-date::after {display: none}
.bbs-list.basic-type.claim .tbl .col-claim::before {display: none;}
.bbs-list.basic-type.claim .tbl .col-claim::after {display: none;}


/*일반 서브페이지 세로형*/
.tbl.sub thead tr th, .tbl.sub tbody tr td {width: auto;}

/*블로그형*/
.noticeList li > a {padding-bottom: 20px;}
.noticeList li > a > div {display: block;}
.noticeList li .infoLeft {width: 100%;}
.noticeList li .infoLeft > div {height: calc(((100vw - (-8px*2))*0.92)*0.717);}
.noticeList li .infoLeft .thumb{display: block; position: relative; overflow: hidden; box-sizing: border-box; width: 100%; height: 100%; border-bottom: 1px solid #CFD8DC; background: #E7EDF4;}
.noticeList li .infoLeft .thumb > img {min-height: 100%;}
.noticeList li .infoRight .board_content > p {height: 20px;
    -webkit-line-clamp: 1;}
.noticeList li .infoRight {width: 100%; padding:0;}
.noticeList li .infoRight .boardInfo {padding-top:25px;}
.noticeList li .infoRight .boardInfo::before {top:12px;}


}




@media only screen and (min-width: 768px) {
    /* Common */
    .bbs-list .board-top > div > .search,
    .bbs-list .board-top .search-box {width: 30.889rem;}
    .bbs-list .board-top.board-top-box {padding: 1.778rem;}
    .bbs-list .board-top.board-top-box .board-total {position: absolute; bottom: 2.111rem;}

    /* Box Type */
    /* 3개 정렬 */
    .board-box-wrapper > ul > li {width: 31.2%;}
    .board-box-wrapper > ul > li:nth-child(3n+1) {margin-left: 0;}
    .board-box-wrapper > ul > li:nth-child(n+4) {margin-top: 1.333rem;}
    /* 4개 정렬 */
    /* .board-box-wrapper > ul > li {width: 22.6%;}
    .board-box-wrapper > ul > li:nth-child(4n+1) {margin-left: 0;}
    .board-box-wrapper > ul > li:nth-child(n+5) {margin-top: 1.333rem;} */

    /* 기본형, Q&A형 */
    .bbs-list.basic-type .tbl th,
    .bbs-list.basic-type .tbl td {padding: 24px 2px; text-align: center;}
    .bbs-list.basic-type .tbl td {}
    .bbs-list.basic-type .tbl .col-file {width:5rem}
    .bbs-list.basic-type .tbl .col-number,
    .bbs-list.basic-type .tbl .col-views {width: 5rem;}
    .bbs-list.basic-type .tbl .col-progress,
    .bbs-list.basic-type .tbl .col-survey,
    .bbs-list.basic-type .tbl .col-more  {width: 7rem;}
    .bbs-list.basic-type .tbl .col-claim {width: 8rem;}
    .bbs-list.basic-type .tbl .col-writer,
    .bbs-list.basic-type .tbl .col-answer {width: 6rem;}
    .bbs-list.basic-type .tbl .col-date {width: 8rem;}
    .bbs-list.basic-type .tbl .col-call {width: 10rem;}
    .bbs-list.basic-type .tbl .col-term {width: 12rem;}
    .bbs-list.basic-type .tbl .col-school {width:15rem}
    .bbs-list.basic-type .tbl td.col-title {text-align: left;}
    .bbs-list.basic-type .tbl td.col-sub-title + td.col-title {text-align: center;}

    /*고시공고*/
    .bbs-list.basic-type.notice .tbl .col-number {width:6rem;}
    .bbs-list.basic-type.notice .tbl .col-date {width: 9rem;}
    .bbs-list.basic-type.notice .tbl .col-title {padding-right: 10px;}
    .bbs-list.basic-type.notice .tbl .col-way {width:9rem}
    .bbs-list.basic-type.notice .tbl .col-part {width: 10rem;}
    .bbs-list.basic-type.notice .tbl .col-writer {width: 6rem}





    /*학교안내*/
    .bbs-list.basic-type.school .tbl th, .bbs-list.basic-type.school .tbl td {padding:17px 2px;}
}

@media only screen and (min-width: 1264px) {
    /* Box Type */
    .board-box .btn_detail {opacity: 0;}
    .board-box-wrapper > ul > li:hover .btn_detail {opacity: 1;}
}

/*-------------------------------------------------------------------
    Board Read & Write
-------------------------------------------------------------------*/
/* Common */
.bbs-read .board-inner,
.bbs-write .board-inner {overflow: auto;}
.bbs-read .board-inner .tbl,
.bbs-write .board-inner .tbl {min-width: 600px;}
.bbs-read hr, .bbs-write hr {margin: 1.667rem 0;}
.bbs-read hr + mark, .bbs-write hr + mark {display: block; margin-bottom: 1.111rem; padding-left: 1.1em; text-indent: -1.1em; font-weight: 500; line-height: 1.4; color: #f8b62d;}
.bbs-read .folder, .bbs-write .folder {margin-top: 10px;}
.bbs-read .folded, .bbs-write .folded {margin-bottom: 30px;}

/* Read */
/* Basic */
.bbs-read .board-bottom .button-box {text-align: center; display: inline-block; width: 100%;}
.bbs-read .board-header {background: #FAFAFA}
.bbs-read .board-header-top {padding: 30px 20px; border-top: 2px solid #248EDC; border-bottom: 1px dashed #B0BEC5;}
.bbs-read .board-header-top p {font-size:24px; font-weight: 400; line-height: 1.1; color: #043871;}
.bbs-read .board-header-bottom {padding:15px 10px; border-bottom: 1px solid #B0BEC5; font-size: 0; text-align: right;}
.bbs-read .board-header-bottom span {font-size: 14px; line-height: 1.3; color: #757575; position: relative;padding-left: 18px;}
.bbs-read .board-header-bottom span + span {margin-left: 16px}
.bbs-read .board-header-bottom span + span::before {position: absolute;top: 50%;left: -8px; height: 0.833rem; margin-top: -0.417rem; border-left: 1px solid #ddd; content: "";transform: rotate(10deg);}

.bbs-read .board-header-bottom span::after {content: ''; position: absolute; width: 16px;
height: 16px; left: -1px; top: 50%; transform: translateY(-50%); margin-top: 1px;}
.bbs-read .board-header-bottom .writer::after {background: url(../images/common/writer.png);}
.bbs-read .board-header-bottom .view::after {background: url(../images/common/view.png);}
.bbs-read .board-header-bottom .date::after {background: url(../images/common/date.png);}


.bbs-read .board-editor-area {padding-top:30px; border-bottom: 1px solid #e0e0e0;}
.bbs-read .board-editor-top {padding:0 15px;font-size: 15px; line-height: 20px; color: #414141;}
.bbs-read .board-editor-top .view-content img {width:650px; max-width: 100%}
.bbs-read .board-editor-top > p {font-size: 16px;color:#616161; line-height: 1.3;}
.bbs-read .board-editor-bottom {margin-top: 40px; padding: 30px 30px; border: 1px dashed #CFD8DC; background: #EEF6FB;}
.bbs-read .board-editor-bottom > p {margin-bottom: 1em; font-size: 18px; font-weight: 400;}
.bbs-read .board-editor-bottom > p > b {font-size: 18px; font-weight: 400; color:#248EDC}

.board-editor-top .board-img {text-align: center; max-width: 100%; margin-bottom: 35px;}
.board-editor-top .board-img > img {max-width: 100%;}

.file-list .upload-file {display: block; padding:8px 0;}
.file-list .upload-file .btn_download-file {font-size: 14px; color:#757575; position: relative; padding-left: 15px;}
.file-list .upload-file .btn_download-file:hover {text-decoration: underline;}
.upload-file .btn_download-file::before {content: ''; position: absolute; width: 20px; height: 20px; background: url('../images/common/file-down.png') no-repeat; left: -8px; top:50%; transform: translateY(-50%);}

/*나의민원 조회*/
.bbs-list.basic-type .tbl .col-claim > span {border: 2px solid; padding: 3px 6px; font-size: 15px;padding: 3px 6px;}
.bbs-list.basic-type .tbl .col-claim .waiting {padding: 3px 20px;color: #757575; border-color:#BDBDBD; background: #FAFAFA}
.bbs-list.basic-type .tbl .col-claim .com {padding: 3px 20px; color: #00937F; border-color:#00937F;}
.bbs-list.basic-type .tbl .col-claim .cannot {color: #df2244; border-color:#df2244;}
/* 취소 상태 추가 (2020-11-05) */
.bbs-list.basic-type .tbl .col-claim .cancel {padding: 3px 20px;color: #616161; border-color:#ddd; background: #ddd}


/*설문조사*/
.bbs-list.basic-type .tbl .col-survey > span {border: 2px solid; padding: 3px 6px; font-size: 15px;padding: 3px 6px;}
.bbs-list.basic-type .tbl .col-survey .com {color: #00937F; border-color:#00937F; padding: 3px 13px;}
.bbs-list.basic-type .tbl .col-survey .ing {color: #2E8CD7; border-color:#2E8CD7;}

/* Q&A Type */
.bbs-list.basic-type .tbl .col-progress .com {color: #00937F; border: 2px solid #00937F; padding: 3px 6px; font-size: 15px;}
.bbs-list.basic-type .tbl .col-progress .ing  {color: #757575; border: 2px solid #BDBDBD; padding: 3px 6px; font-size: 15px;}
.bbs-list.basic-type .tbl .col-date {}

.board-editor-answer {border:2px solid #26A392; margin-top: 25px;margin-bottom: 60px;}
.board-editor-answer .answer-head {background: #FAFAFA}
.board-editor-answer .answer-head .answer-head-top {padding:25px 0; border-bottom: 1px dashed #B0BEC5 }
.board-editor-answer .answer-head .answer-head-top h3 {font-size: 16px; color:#004B3A;    display: inline-block; position: relative; padding-left: 95px;}
.board-editor-answer .answer-head .answer-head-top h3::before {content:'A'; position: absolute;color:#fff; background:#26A392; border-radius: 50%; width:30px; height: 30px;text-align: center; line-height: 28px;left: 58px; top: 50%; transform: translateY(-50%);}
.board-editor-answer .answer-head .answer-head-top h3::after {content: ''; position: absolute; width:14px; height: 15px; background: url('../images/common/answer_arrow.png'); left: 33px}

.board-editor-answer .answer-head .answer-head-bottom {text-align: right; padding:13px 0; padding-right: 15px; border-bottom: 1px solid #CFD8DC}
.board-editor-answer .answer-head .answer-head-bottom span {font-size: 14px; color:#848484; position: relative;}
.board-editor-answer .answer-head .answer-head-bottom span {padding-left: 17px;}
.board-editor-answer .answer-head .answer-head-bottom span + span {margin-left: 15px;}
.board-editor-answer .answer-head .answer-head-bottom span + span::after {position: absolute; top: 50%; left: -11px; content: ""; width: 1px; height: 16px; background: #E0E0E0; transform: rotate(20deg) translateY(-50%);}
.board-editor-answer .answer-head .answer-head-bottom span::before {content: ''; position: absolute; width: 16px; height: 16px; left: -1px; top: 50%; transform: translateY(-50%); margin-top: 1px;}
.board-editor-answer .answer-head .answer-head-bottom .writer::before {background: url(../images/common/writer.png);}
.board-editor-answer .answer-head .answer-head-bottom .date::before {background: url(../images/common/date.png)}

.board-editor-answer .answer-cont { padding:20px; box-sizing: border-box;min-height: 130px;}
.board-editor-answer .answer-cont p {font-size: 16px; color: #616161;line-height: 1.4rem;}






/* Write */
.bbs-write {border-top: 2px solid #248EDC;}
.bbs-write .text {height: 40px;}
.bbs-write tr.hidden {display: none;}
.bbs-write .board-bottom .button-box {text-align: center;}
.bbs-write .col-division {vertical-align: top; width: 8rem; text-align: left;padding-top: 16px; font-size: 16px; color: #043871; font-weight: 400;}
.bbs-write .col-division2 {width: 5rem;}
.bbs-write .col-contents {padding:15px;}
.bbs-write .col-input {padding: 0;}
.bbs-write .col-input textarea.text {margin: 0; border: none; border-radius: 0;}
.bbs-write .col-controll {padding: 0.556rem;}
.bbs-write .col-controll button {position: relative; width: 1.667rem; height: 1.667rem; border: 1px solid #b7b7b7; border-radius: 50%; cursor: pointer;}
.bbs-write .col-controll button::before {position: absolute; top: 50%; left: 50%; margin: -0.056rem 0 0 -0.389rem; width: 0.778rem; height: 0.111rem; background: #382a76; content: "";}
.bbs-write .col-controll button.btn_add-row::after {position: absolute; top: 50%; left: 50%; margin: -0.389rem 0 0 -0.056rem; width: 0.111rem; height: 0.778rem; background: #382a76; content: "";}
.bbs-write .col-controll button:hover {border-color: #5c439b; background-color: #5c439b;}
.bbs-write .col-controll button:hover::before,
.bbs-write .col-controll button:hover::after {background-color: #fff;}
.bbs-write .file-controll {max-width: 450px; font-size: 0;}
.bbs-write .input-box {max-width: 20rem;}
.bbs-write .input-box.no-type,
.bbs-write .input-box.address {max-width: none;}
.btn_delete-file {display: inline-block;  vertical-align: middle; position: absolute; width: 24px; height: 24px; top: 7px; right: 4.8rem; padding-left: 0; border-radius: 50%; border: 1px solid #CFD8DC; background: none;}
.btn_delete-file::before {position: absolute;top: 11px;left: 6px; width: 12px; height: 2px; background: #666; transform: rotate(45deg); content: "";}
.btn_delete-file::after { position: absolute;top: 11px;left: 6px; width: 12px;height: 2px; background: #666; transform: rotate(-45deg); content: "";}
.btn_delete-file:hover::before, .btn_delete-file:hover::after { background: #DF2244;}


/*board-guide*/
.board-guide {height: 88px; background: #F9F9F9; border:1px solid #DCDCDC; margin-top: 55px;margin-bottom: 30px;}
.board-guide ul {display: table; width: 100%; text-align: center; height: 88px;}
.board-guide ul > li {display: table-cell; width:33.3%; vertical-align: middle;}
.board-guide ul > li > span {font-size: 16px; color:#757575}
.board-guide ul > li > span + span {padding-left: 14px; position: relative;}
.board-guide ul > li > span + span::after {content: ''; position: absolute; width:1px; background: #ddd;height: 15px; left: 6px; top: 50%; transform: translateY(-50%); margin-top: 1px;}
.board-guide ul > li > span:first-child {color:#616161; position: relative;font-weight: 400;}
.board-guide ul > li > span:first-child::before{content: ''; position: absolute; width:16px; height: 16px; top:50%; transform: translateY(-50%);left: -20px; margin-top: 1px;}

.board-guide ul > li .person::before {background: url('../images/common/user-2-line.png') no-repeat;}
.board-guide ul > li .part::before {background: url('../images/common/database-line.png') no-repeat;}
.board-guide ul > li .call::before {background: url('../images/common/phone-line.png') no-repeat;}



/*0910 파일첨부 수정*/

.upload-file {display: block;}
.upload-file + .upload-file {margin-top: 5px;}
.upload-file .btn_download-file {display: inline-block; vertical-align: middle; font-size: 0.889rem;}
.upload-file .btn_download-file:hover {text-decoration: underline;}
.upload-file .btn_delete-file {display: inline-block; vertical-align: middle; position: relative; width: 15px; height: 15px; margin-left: 5px; padding-left: 0; border: 1px solid #ddd; background: none;}
.upload-file .btn_delete-file::before {position: absolute; top: 7px; left: 3px; width: 9px; height: 1px; background: #666; transform: rotate(45deg); content: "";}
.upload-file .btn_delete-file::after {position: absolute; top: 7px; left: 3px; width: 9px; height: 1px; background: #666; transform: rotate(-45deg); content: "";}
.upload-file .btn_delete-file:hover::before,
.upload-file .btn_delete-file:hover::after {background: #f00;}
/* Controll */
.file-list + .file-controll {margin-top: 10px;}
.file-controll .file {display: block;}
.file-controll .file + .file {margin-top: 5px;}
.file-controll + mark {display: inline-block; margin-top: 5px; font-size: 0.778rem; color: #f8b62d;}
.file {position: relative; }
.file > input[type="file"] {position: absolute; width: 0; height: 0; overflow: hidden;}
.file > input[type="text"] {margin: 0; width: 100%; background: transparent; height: 40px; margin:0 5px; width: calc(100% - 138px);}
.file .btn_search-file {background: #004795; color:#fff;}
.file .btn_add-file {width: 40px; height: 40px; border: 1px solid #bdbdbd; cursor: pointer;    font-size: 0px; position: relative; vertical-align: top; box-sizing: border-box;}
.file .btn_remove-file {width: 40px; height: 40px; border: 1px solid #bdbdbd; cursor: pointer;    font-size: 0px; position: relative; vertical-align: top; box-sizing: border-box;}
.file .btn_add-file:hover,
.file .btn_remove-file:hover {background: #EBEBF3;}
.file .btn_add-file::before,
.file .btn_remove-file::before {position: absolute; top: 50%; left: 50%; width: 14px; height: 2px;  margin: -1px 0 0 -7px;; background: #004795; content: "";}
.file .btn_add-file::after {position: absolute; top: 50%; left: 50%; width: 2px; height: 14px; margin: -7px 0 0 -1px; background: #004795; content: "";}

.input.file {}
.input.file .form-ipt {font-size: 0;}
.input.file .form-ipt > label {display: inline-block; vertical-align: top; position: relative; box-sizing: border-box; width: 320px; max-width: calc(100% - 96px); padding: 9px 58px 9px 13px; margin: 0 4px; border: 1px solid #BDBDBD; background: #fff;cursor: pointer;}
.input.file .form-ipt > label > span {display: inline-block; overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; font-weight: 300; font-size: 14px; line-height: normal; letter-spacing: 0; color:#BDBDBD;}
.input.file .form-ipt > label > span.has-file {color: #212121;}
.input.file .form-ipt > a {display: inline-block;}
.input.file .form-ipt > a.btn_file-upload { font-size: 14px;color:#fff;text-align: center;width: 80px; height: 40px; line-height: 40px; background: #004795;}
.input.file .form-ipt .btn_clear-file {position: absolute; box-sizing: border-box; width: 26px; height: 26px; margin: 7px 0 0 -45px; border: 1px solid #CFD8DC; border-radius: 50%; font-size: 0;}
.input.file .form-ipt .btn_clear-file::before {position: absolute;  top: 11px; left: 6px; width: 12px; height: 2px; background: #666; transform: rotate(45deg); content: "";}
.input.file .form-ipt .btn_clear-file::after{position: absolute; top: 11px; left: 6px; width: 12px; height: 2px; background: #666; transform: rotate(-45deg); content: "";}
.input.file .form-ipt .btn_clear-file:hover::before,
.input.file .form-ipt .btn_clear-file:hover::after {background: #DF2244 }

.input.file + .input.file {margin-top: 8px;}
.s-txt1 {display: inline-block; vertical-align: middle; font-weight: 300; font-size: 14px; line-height: 1.4; color: #757575;}
.s-txt2 {display: inline-block; vertical-align: middle; font-weight: 300; font-size: 13px; line-height: 1.5; color: #757575;}
.info-form [class^=s-txt].c1 {color: #009AFF;}
.info-form [class^=s-txt].c2 {color: #FF6162;}
.info-form [class^=s-txt].c3 {color: #B95E06;}
.info-form [class^=s-txt].c1.checked::before {display: inline-block; vertical-align: text-top; margin: 0 3px 0 10px; content: url(../images/content/ico_info-form-checked.png);}



/*table_scroll*/
.table-icon.icon--hide {
  display: none !important;
  opacity: 0
}


.table-responsive + .table-responsive {margin-top: 60px;}

.tbl.row {table-layout: inherit;}
.tbl.row > tbody {display: table-row-group}
.tbl.row > tbody > tr {display: table-row}
.tbl.row th, .tbl.row td {display: table-cell; vertical-align: middle;}









@media only screen and (max-width: 768px) {
    /* Common */
    .bbs-read,
    .bbs-write {}
    .bbs-read .board-bottom,
    .bbs-write .board-bottom {padding: 0;}
    .bbs-read hr + mark, .bbs-write hr + mark {margin-left: 15px; margin-right: 15px;}

    .bbs-write .tbl-horizontal colgroup,
    .bbs-write .tbl-horizontal th {display: none;}
    .bbs-write .tbl-horizontal td {padding: 1em 7px;}
    .bbs-write .tbl-horizontal .tbl,
    .bbs-write .tbl-horizontal .tbl tr:first-child,
    .bbs-write .tbl-horizontal .tbl td {padding: 0; padding-right: 15px; border: none;}
    .bbs-write .tbl-horizontal .tbl tr + tr td {padding-top: 10px;}
    .bbs-write .input_title + * {width: 100%; max-width: none; min-width: auto;}
    .btn_delete-file {right: 4.1rem}
    .file > input[type="text"] {font-size: 13px;  width: calc(100% - 122px);}

    .bbs-list.basic-type .tbl .col-number.text-icon::before {top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
    .bbs-list.basic-type .tbl .col-file.text-icon::before {top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); margin-top: 2px;}

    /*학교안내*/
    .bbs-list.basic-type.school .tbl thead {display: none;}
    .bbs-list.basic-type.school .tbl th.col-address {display: none;}
    .bbs-list.basic-type.school .tbl th.col-call {display: none;}
    .bbs-list.basic-type.school tbody tr {height: auto;}
    .bbs-list.basic-type.school .tbl tr::before {display: none;}
    .bbs-list.basic-type .tbl tr.school_info.tab-content {display: none;}
    .bbs-list.basic-type .tbl tr.school_info.tab-content.current {display: table-row;;}
    .bbs-list.basic-type.school .tbl .col-number {float: none; height: 20px; line-height: 20px; width: 6%;}
    .bbs-list.basic-type.school .tbl tbody tr td.col-more {width:15%; max-width: 85px;}
    .bbs-list.basic-type.school .tbl td.col-address {display: none;}
    .bbs-list.basic-type.school .tbl td.col-call {display: none;}
    .bbs-list.basic-type.school .tbl tbody tr td.col-more::after {right:47%;}
    .bbs-list.basic-type.school .tbl tbody tr td.col-more.current::after {right:44%;}
    .bbs-list.basic-type.school .tbl td.col-school {padding-left: 15px;}
    .bbs-list.basic-type.school .tbl tbody tr.school_info > td {padding:15px;}
    .bbs-list.basic-type.school .tbl td[colspan] {display: table-cell;line-height: unset;}

  /*  .bbs-list.basic-type.school .tbl tbody tr.school_info td > .tbl, .bbs-list.basic-type, .bbs-list.basic-type.school .tbl tbody tr.school_info td > .tbl tr {display: revert;}
    .bbs-list.basic-type.school .tbl tbody tr.school_info td > .tbl tbody {display: revert;}*/
    .school_info tbody tr th {width:auto;}
    .school_info tbody tr th, .school_info tbody tr td {font-size: 13px !important;}
    .school_info tbody tr td {padding-left: 7px !important}
    .bbs-list.basic-type.school .tbl th, .bbs-list.basic-type.school .tbl td {text-overflow: unset;  white-space: normal;  overflow: unset;vertical-align: middle;word-break: break-all;}
    .bbsSearch .searchArea.school {padding:25px 0 0px; margin-bottom: 15px;}



    /*table scroll*/
    .table-responsive {display: block; width: 100%; overflow-x: auto; position: relative; }
    .table-responsive table {width: 995px}
    .table-responsive .tbl {width: 995px}
    .table-icon.on, .ui:after { display: block; }
    .table-icon { position: absolute; z-index: 2;top: 30px;left:60px; width: 50px;
      height: 50px;border-radius: 50px; background: #fff; box-shadow: -1px 1px 10px grey;align-items: center;justify-content: center;transition: all .5s ease-in-out
    }
    .swipe-icon .swipe-arrow {animation: pulse-arrow 3s ease-out infinite  }
    .swipe-icon {  position: absolute; top: 15px; left: 25%;  width: 25px; height: 25px; overflow: visible; animation: hand-move 3s ease-out infinite}

    @keyframes pulse-arrow {
      0% {
        opacity: 1;
        transform: translateX(0)
      }

      50% {
        opacity: 1;
        transform: translateX(.25em)
      }

      75% {
        opacity: 0;
        transform: translateX(.25em)
      }

      100% {
        opacity: 0;
        transform: translateX(0)
      }
    }


    @keyframes hand-move {
      0%, 100% {
        transform: translateX(0)
      }

      50% {
        transform: translateX(15px)
      }
    }

    .tab_scroll .table-icon{top:2px}

}

@media only screen and (max-width: 750px) {

  /*0910수정 파일첨부 시작*/
  .input.file .form-ipt > label {width: calc(100% - 128px);}
  /*0910수정 파일첨부 끝*/


  .tbl.part, .tbl.part tbody, .tbl.part tbody tr, .tbl.part tbody tr td {display: block;}
  .tbl.part thead {display: none;}
  .tbl.part tbody tr {padding:15px 7px;}
  .tbl.part tbody tr td.align-left { padding: 5px 10px; }
  .tbl.part tbody tr td {border:0; text-align: left; padding: 3px 10px; font-size: 15px; word-break: keep-all;}
  .table_wrap.sub05 .tbl.part tbody tr td:first-child {background: transparent}
  .tbl.part tbody tr td:nth-child(4) {position: relative;padding-left: 77px;}

  .tbl.part tbody tr td::before {font-weight: 400;}
  .tbl.part tbody tr td:nth-child(1)::before {content: "담당 : ";}
  .tbl.part tbody tr td:nth-child(2)::before {content: "이름 : ";}
  .tbl.part tbody tr td:nth-child(3)::before {content: "전화번호 : ";}
  .tbl.part tbody tr td:nth-child(4)::before {content: "담당업무 : ";position: absolute; left: 10px; top: 5px;}

}





@media only screen and (max-width: 550px) {
  .board-guide {height: auto;}
  .board-guide ul {text-align: left; height: auto;padding: 30px 40px; box-sizing: border-box;}
  .board-guide ul > li {display: block; width:100%}
  .board-guide ul > li + li {padding-top:20px;}
  .bbs-list.basic-type .tbl .file .col-title {width:79%}

  /*0910수정 파일첨부 시작*/
  .input.file .form-ipt > label {width: calc(100% - 89px); max-width: none;}
  .input.file .form-ipt > a.btn_file-upload {width: 40px; font-size: 13px; padding:5px; line-height: 1.2; box-sizing: border-box;}
  /*0910수정 파일첨부 시작 끝*/


}


@media only screen and (max-width: 1263px) {
}

@media only screen and (min-width: 768px) {
    /* Common */
    .bbs-read .board-bottom .button-box,
    .bbs-write .board-bottom .button-box {}

    /* List */


    /* Q&A Type */
    .bbs-read.question-box .board-header-top p,
    .bbs-read.answer-box .board-header-top p {padding-left: 4.611rem; text-indent: -4.611rem;}

    .bbs-list.basic-type .tbl tbody tr:hover {border: 1px solid #8FC7F6 !important; box-shadow: 0 3px 6px 0 rgba(28,113,145,0.2);}
    .bbs-list.basic-type .tbl tbody tr:hover > td {border-bottom: 1px solid #8FC7F6;border-top: 1px solid #8FC7F6; }
    .bbs-list.basic-type .tbl tbody tr:hover th a {color:#003985}

    .bbs-list.blog-type .tbl tbody tr:hover {background: #f5f8f9;}
    .bbs-list.basic-type.school .tbl tbody tr:hover {border: 0px solid #8FC7F6 !important; box-shadow: 0 3px 6px 0 rgba(28,113,145,0);}
    .bbs-list.basic-type.school .tbl tbody tr:hover > th {border-bottom: 1px solid #ddd;}
    .bbs-list.basic-type.school .tbl tbody tr:hover > td {border-bottom: 1px solid #ddd;border-top: 0px solid #8FC7F6; }

    /*학교안내*/

}