@charset "utf-8";

/* 게시판 공통 요소 */
@import url('/Web-home/fnct/bbs/bbs_common/css/board_common.css');

/***** Table *****/
.boardWrap{margin-bottom:7rem;border-top:0.2rem solid #003377;}
.boardWrap > ul{position:relative;border-bottom:0.1rem solid #8B9099;}
.boardWrap > ul > li{position:relative;display:flex;align-items:center;border-bottom:0.1rem solid #e2e2e2;}
.boardWrap > ul > li:last-child{border-bottom:0;}
.boardWrap > ul > li.board-noti{background:#F1F6FA; }
/* .boardWrap > ul > li.board-noti .info > div{position: relative;} */
.boardWrap > ul > li > a{display:flex;flex:1;align-items:center;transition: background .2s;}
.boardWrap > ul > li > a:hover {background: #f1f6fa;}
.boardWrap .check{text-align:center;padding:2.4rem 0;}
.boardWrap .num{width:12rem;text-align:center;font-family: 'paper';font-weight: 400;color: #999;font-size: 1.5rem;}
.boardWrap .con{flex:1;padding:2.4rem 12.5rem 2.4rem 0 !important;}
.boardWrap .con.ansUse{padding:2.4rem 25rem 2.4rem 0 !important;}
.boardWrap .notice-title{display:inline-block;text-indent:-9999px;width:5rem;height:5rem;background:#1265D3 url('../images/ico-noti.png') no-repeat center;border-radius:50%;}
.boardWrap .title{font-size:1.7rem;font-family:'paper';font-weight: 500;color:#121212;display:flex;line-height:3rem;align-items:center;}
.boardWrap .title strong em {display:-webkit-inline-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;vertical-align:middle;}
.boardWrap .title strong span{line-height:3rem;background-position: left bottom .5rem;background-size: 0 1px;background-image: linear-gradient(#9da0a2,#9da0a2);transition:background-size .5s;background-repeat: no-repeat;font-family: 'paper';font-weight: 500; font-size: 1.7rem;display: block;}
.boardWrap .title i {display: none;font-size: 1.7rem; transform: translateY(-.5rem);}
.boardWrap > ul a:hover .title strong span{background-size:100% 1px;}
.boardWrap .mobile-file-area{display:none;}
.boardWrap .right-box {position: absolute !important; right:0; top:50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; margin-right:0 !important; padding-right:0 !important;}
.boardWrap .right-box::after {display: none;}
.boardWrap .file-area{position: relative; width:12.5rem; text-align: center;}
.boardWrap .file-area .file-box {position: relative; display: inline-block; text-align: center; }
.boardWrap .file-area img {width: 2.6rem;}
.boardWrap .file-area::after {display: none;}
.boardWrap .file-area i {position: absolute;right:-.36rem;bottom: .3rem;width: 1.5rem;height: 1.5rem;font-size: .9rem;font-family: 'paper';font-weight: 600;color: #fff;background: #1265d3;border-radius: 50%;text-align: center;line-height: 1.5rem;}
.boardWrap .process{width:12.5rem; text-align:center;position:relative;}
.boardWrap .process::before{content:'';width:0.1rem;height:1.5rem;position:absolute;left:0;top:50%;margin-top:-0.7rem;background:#ccc;}
.boardWrap .process > span{font-size:1.8rem;font-family:'paper';font-weight: 500;}
.boardWrap .process .p1{color:#1174FF;}
.boardWrap .process .p2{color:#828282;}
.boardWrap .process .p3{color:#079DAB;}
.boardWrap .clsdr{width:2.1rem;height:2.1rem;margin-left:0.5rem;display:inline-block;text-indent:-9999px;background:url('../images/lock.png') no-repeat center;position:relative;flex-shrink:0;}

.boardWrap .trash .num > span{border-radius:50%;display:inline-block;text-indent:-9999px;width:5rem;height:5rem;background:#888 url('../images/ico-trash.png') no-repeat center;}
.boardWrap .trash .title strong{color:#999;text-decoration:line-through;}
.boardWrap .trash .info .typeCl{border:0.1rem solid #A6A6A6;color:#a6a6a6;}
.boardWrap .info > div {position:static;}
.boardWrap .mo-info {display: flex; flex-wrap:wrap; align-items: center; margin-right: 0; padding-right: 0;}
.boardWrap .mo-info::after {display: none;}
.boardWrap .mo-info > div {position: relative; margin-right: 2.2rem; padding-right: 2.2rem;}

.boardWrap .mo-info > div:nth-last-child(-n+2)::after {display: none;}
.boardWrap .mo-info > div::after {content:''; width:0.1rem; height:1.2rem; background:#ccc; position: absolute; right:0; top:50%; margin-top:-0.6rem;}

/* .boardWrap .new{transform: translateY(-.6rem);} */
.boardWrap .lock {transform: translateY(-.5rem);}

.boardWrap > ul > li.no-data{display:block;padding:14rem 0;text-align:center;}

@media screen and (max-width:1200px) {
    .boardWrap .info > div > span {display: block !important;}
}

@media screen and (max-width:1024px){
    .boardWrap .num{width:10rem;}
    .boardWrap .notice-title{width:4rem;height:4rem;background-size:2rem;}
    .boardWrap .process{width:7.5rem;}

    .boardWrap .title strong{font-size:1.6rem;}
    .boardWrap .process > span{font-size:1.6rem;}
}

@media screen and (max-width:768px){
    .boardWrap .border-noti .info{display: flex; flex-wrap:wrap;}
    /* .boardWrap .info {flex-wrap:wrap;} */
    .boardWrap .con .mo-info > div.date-area span {display: none;}
    .boardWrap .con .mo-info > div.date-area::after {display: none !important;}
    .boardWrap .mo-info {flex-shrink: unset !important; font-size: unset; padding-right: 0 !important; margin-right: 0 !important;}
    .boardWrap .mo-info > div {flex-shrink: 0; font-size: 1.3rem; padding-right: 1rem; margin-right: 1rem;}
    .boardWrap .mo-info > div::after {display: block !important;}
    .boardWrap .mo-info > div:last-child::after {display: none !important;}
    .boardWrap .mo-info > div:last-child {margin-right:0;}
    .boardWrap .num{display:none;}
    .boardWrap .check{display:none;}
    .boardWrap .con,
    .boardWrap .con.ansUse{padding: 2.4rem 1.5rem !important;}
    .boardWrap .con.ansUse .mo-info > div.date-area::after {display: block !important;}
    .boardWrap .title{margin-right:2rem;}
    .boardWrap .title strong{margin-right:0;}
    .boardWrap .right-box {position: relative !important; right:unset; top:unset; transform: unset;}
    .boardWrap .file-area{display:none;}
    .boardWrap .process {width:unset; padding-left:1.5rem; text-align:left; padding:0; font-size: 1.3rem;}
    .boardWrap .process::before {display: none; height:1.2rem; margin-top:-0.6rem;}
    .boardWrap .process > span {font-size: 1.3rem;}
    .boardWrap .mobile-file-area{display:none;}
    .boardWrap .mobile-file-area img{width:1.5rem;height:1.5rem;vertical-align:middle;}
    .no-data{padding:8rem 0;}
}