@charset "utf-8";

.pg-notice-list {
    & .bo_top {display: flex; justify-content: space-between; align-items: center;
        & .total {color: #666;
            & span {font-weight: 400;}
        }
        & .search {display: flex;
            & select {position: relative; width: 120px; height: 40px; border: 1px solid #e1e5ed; border-radius: 5px; padding: 0 28px 0 12px; background: url("/assets/site/img/common/ico-angle-down.png") no-repeat; background-position: center right 12px; background-size: 16px; background-color: #fff;}
            & input[type="text"] {width: 100%; height: 40px; font-size: 16px; border: 1px solid #e1e5ed; border-radius: 5px; padding: 0 12px; margin: 0 10px;}
            & input[type="submit"] {width: 100px; height: 40px; border-radius: 5px; background: #292E41; color: #fff; font-size: 16px; font-weight: 600;}
        }
    }
    & .bo_basic_list {border-top: 1px solid #0F162A;
        & table {
            & tr {border-bottom: 1px solid #CBCBCB;
                & th {border-bottom: 1px solid #CBCBCB;}
                & td {width: 100px; text-align: center; padding: 18px 0;
                    &.a {}
                    &.b {}
                    &.c {width: calc(100% - 400px);}
                    &.d {width: 200px;}
                }
            }
            & thead {
                & tr {background: #f9f9f9;
                    & td {font-weight: 600;}
                }
            }
            & tbody {
                & tr {
                    &:hover {background: unset;}
                    & td {
                        &.tda {
                            & span.notice {border-radius: 5px; padding: 5px 0;
                                &::after {font-size: 13px; font-weight: 500;}
                            }
                        }
                        &.tdb {}
                        &.tdc {text-align: left; padding: 18px 10px;
                            & a {display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; color: #292E41;}
                            &::after {content: none;}
                            & .new {display: none;}
                        }
                        &.tdd {color: #292E41;
                            &::before {content: none;}
                        }
                    }
                }
            }
        }
    }
    & .bo_footer {
        & .paging {margin-top: 70px;
            > ul {display: flex; justify-content: center; align-items: center;
                > li {
                    & a {display: block; padding: 0 10px;
                        & p {color: #868686;}
                        &.on p {font-weight: 700; color: #292E41;}
                    }
                }
            }
        }
    }
    @media (width <= 860px) {
        & .bo_top {margin: 15px 0; gap: 15px;
            > form {width: 100%;}
            & .search {width: 100%; margin: 0;
                & select {height: 35px; font-size: 14px;}
                & input[type="text"] {height: 35px; font-size: 14px;}
                & input[type="submit"] {height: 35px; font-size: 14px;}
            }
            & .total {width: 100%; font-size: 14px; line-height: 1.4;}
        }
        & .bo_basic_list {
            & table {
                & tr {display: table-row;
                    & td {display: table-cell; font-size: 14px; padding: 12px 0;
                        &.a {}
                        &.b {}
                        &.c {width: calc(100% - 350px);}
                        &.d {width: 150px;}
                    }
                }
                & tbody {
                    & tr {
                        & td {
                            &.tda {
                                & span {
                                    &.notice {
                                        &::after {font-size: 12px;}
                                    }
                                }
                            }
                            &.tdc {padding: 12px 0;}
                        }
                    }
                }
            }
        }
    }
    @media (width <= 640px) {
        & .bo_basic_list {overflow-x: scroll;
            & table {width: 640px;}
        }
    }
}

.pg-notice-view {
    & .bo_basic_view {
        & table {border-top: 1px solid #0F162A;
            & tr {
                & th {display: flex; background: #f9f9f9; border-bottom: 1px solid #CBCBCB;
                    & .tit {width: calc(100% - 200px); font-size: 18px; font-weight: 600; padding: 0 40px;}
                    & .date {width: 200px; font-size: 16px; text-align: center; color: #222;}
                }
                & td {padding: 0;
                    &.con {padding: 40px;}
                    & .nav {
                        > ul {
                            > li {display: flex; border-bottom: 1px solid #CBCBCB;
                                &:last-child {border-bottom: 0;}
                                > div {padding: 20px 0;}
                                & .cate {display: flex; justify-content: center; width: 200px; background: #f9f9f9;
                                    & i {margin-right: 10px;}
                                    & p {}
                                }
                                & .desc {display: flex; align-items: center; width: calc(100% - 200px);
                                    & a {display: flex; width: calc(100% - 200px); padding: 0 20px;
                                        & i {margin-right: 10px;}
                                        & p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
                                    }
                                    & span {width: 200px; text-align: center;}
                                }
                            }
                        }
                    }
                }
            }
        }
    }
    & .bo_footer {
        & .btn_wrap {
            & .btn {border-radius: 5px; background: #292E41;}
        }
    }
}