/* Board */
.board-list {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
}
.board-list > li + li {
    border-top: 1px solid #D9D9D9;
}
.board-list .list-header {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 5rem;
    padding: 8px 0;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.board-list .list-header:hover {
    background-color: #F5FFFC;
}
.board-list#bo_list .td_chk {
    width: auto;
}
.board-list .num {
    width: 7.625rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: #222;
    letter-spacing: 0;
    line-height: 1;
    text-align: center;
}
.board-list .status {
    width: 7.25rem;
    font-size: 1rem;
    font-weight: 700;
    color: #42917D;
    text-align: center;
}
.board-list .status a {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    text-align: inherit;
}
.board-list .status em {
    font-style: normal;
}
.board-list .title {
    padding: 0 5.9375rem 0 3.90625%;
    font-size: 1rem;
    font-weight: 700;
    color: #222;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    word-break: keep-all;
}
.board-list .title a {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
.board-list .title a:after {
    content: "";
    display: block;
    position: absolute;
    top: 2.25rem;
    right: 3.125rem;
    width: 12px;
    height: 8px;
    pointer-events: none;
    background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMi44IiBoZWlnaHQ9IjgiIHZpZXdCb3g9IjAgMCAxMi44IDgiPg0KICA8cGF0aCBpZD0iaWNfY2FyZXQiIGQ9Ik02LDE2LjlsNi40LTYuNCw2LjQsNi40LTEuNiwxLjYtNC44LTQuOEw3LjYsMTguNVoiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDE4LjggMTguNSkgcm90YXRlKDE4MCkiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPg0KPC9zdmc+") no-repeat 0 0;
    background-size: contain;
}
.board-list .title a[aria-expanded=true]:after {
    -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
            transform: rotate(180deg);
}
.board-list a:hover {
    text-decoration: underline;
}
.board-list .list-body {
    max-height: 0;
    font-size: 0.875rem;
    color: #222;
    border-top: 1px solid #D9D9D9;
    overflow: hidden;
    -webkit-transition: max-height 0.2s ease-in-out;
    -o-transition: max-height 0.2s ease-in-out;
    transition: max-height 0.2s ease-in-out;
}
.board-list .list-body .container {
    padding: 1.5rem 3.90625% 3.125rem;
}
.board-list .list-body.on {
    display: block;
}
.board-list .meta-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 2.25rem;
    letter-spacing: 0;
    line-height: 1;
}
.board-list .meta-wrap > p {
    margin: 0 1.4285714286em 0 0;
    float: left;
}
.board-list .meta-wrap > p:last-child {
    margin-right: 0;
}
.board-list .meta-wrap em {
    font-style: normal;
}
.board-list .content-wrap {
    font-weight: 500;
    line-height: 2.1428571429;
    word-break: keep-all;
}
.board-list .attachment {
    margin: 2rem 0 0;
}
.board-list .attachment .file {
    display: block;
    margin: 0 0 8px;
    padding: 0 0 0 1rem;
    font-weight: 700;
    letter-spacing: 0;
    background: url("../img/ic_attachment.svg") no-repeat 0 2px;
    background-size: 1rem auto;
}
.board-list .empty {
    padding: 42px;
    text-align: center;
}
@media screen and (max-width: 1024px) {
    .board-list .list-header {
        display: block;
        min-height: 4rem;
        padding: 0.875rem 0;
    }
    .board-list .chk_box input[type=checkbox] + label span {
        margin-top: 8px;
        margin-right: 8px;
    }
    .board-list .num {
        width: 3.125rem;
        margin-top: 10px;
        padding-right: 3px;
        font-size: 0.875rem;
        text-align: left;
        float: left;
    }
    .board-list .status {
        width: auto;
        margin-left: 3.125rem;
        margin-bottom: 3px;
        font-size: 0.8125rem;
        text-align: left;
    }
    .board-list .chk_box ~ .status {
        margin-left: 4.625rem;
    }
    .board-list .title {
        margin-left: 3.125rem;
        padding-left: 0;
        padding-right: 0.875rem;
        font-size: 0.8125rem;
    }
    .board-list .title a:after {
        top: 1.75rem;
        right: 0;
    }
    .board-list .chk_box ~ .title {
        margin-left: 4.625rem;
    }
    .board-list .list-body {
        font-size: 0.8125rem;
    }
    .board-list .list-body .container {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 1.875rem;
    }
    .board-list .meta-wrap {
        margin-bottom: 1rem;
        font-size: 0.75rem;
    }
    .board-list .content-wrap {
        line-height: 1.8076923077;
    }
    .board-list .empty {
        padding: 32px;
    }
}

.pagination {
    margin: 1.875rem 0 0;
    font-size: 0;
    line-height: 1;
    text-align: center;
}
.pagination .page-link {
    display: inline-block;
    padding: 0 10px;
    font-size: 1.125rem;
    color: #333;
    line-height: 2.2222222222;
    vertical-align: top;
    white-space: nowrap;
}
.pagination .page-link:hover {
    text-decoration: underline;
}
.pagination .current {
    position: relative;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.9;
}
.pagination .current:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 5px;
    left: 8px;
    right: 8px;
    height: 2px;
    margin: auto;
    background: #333;
}
.pagination .current:hover {
    text-decoration: none;
}
.pagination .page-front {
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid #333;
    background: url("data:image/svg+xml;base64,DQo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0Ij4NCiAgPGRlZnM+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgiPg0KICAgICAgPHJlY3QgaWQ9IuyCrOqwge2YlV8xNzU2IiBkYXRhLW5hbWU9IuyCrOqwge2YlSAxNzU2IiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzIDE0KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNzA3MDcwIiBzdHJva2Utd2lkdGg9IjEiLz4NCiAgICA8L2NsaXBQYXRoPg0KICA8L2RlZnM+DQogIDxnIGlkPSJpY19wYWdlX2Zyb250IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTMgLTE0KSIgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPg0KICAgIDxnIGlkPSLqtazshLFf7JqU7IaMXzEzMl80IiBkYXRhLW5hbWU9Iuq1rOyEsSDsmpTshowgMTMyIOKAkyA0IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxNCAxNSkiPg0KICAgICAgPHBhdGggaWQ9Iu2MqOyKpF80MjgwIiBkYXRhLW5hbWU9Iu2MqOyKpCA0MjgwIiBkPSJNNiw3Ljc4N2wtNi02TDEuNzg3LDAsNiw0LjIxMywxMC4yMTMsMCwxMiwxLjc4N1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLjk1Nykgcm90YXRlKDkwKSIgZmlsbD0iIzMzMyIvPg0KICAgICAgPHJlY3QgaWQ9IuyCrOqwge2YlV8xNTk0IiBkYXRhLW5hbWU9IuyCrOqwge2YlSAxNTk0IiB3aWR0aD0iMi41IiBoZWlnaHQ9IjEyIiBmaWxsPSIjMzMzIi8+DQogICAgPC9nPg0KICA8L2c+DQo8L3N2Zz4NCg==") no-repeat 50% 50%;
    background-size: 0.875rem auto;
}
.pagination .page-prev {
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 1.25rem 0 5px;
    border: 1px solid #333;
    background: url("data:image/svg+xml;base64,DQo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0Ij4NCiAgPGRlZnM+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgiPg0KICAgICAgPHJlY3QgaWQ9IuyCrOqwge2YlV8xNzU3IiBkYXRhLW5hbWU9IuyCrOqwge2YlSAxNzU3IiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwIDE0KSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjNzA3MDcwIiBzdHJva2Utd2lkdGg9IjEiLz4NCiAgICA8L2NsaXBQYXRoPg0KICA8L2RlZnM+DQogIDxnIGlkPSJpY19wYWdlX3ByZXYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMCAtMTQpIiBjbGlwLXBhdGg9InVybCgjY2xpcC1wYXRoKSI+DQogICAgPHBhdGggaWQ9Iu2MqOyKpF8xMjAyMjgiIGRhdGEtbmFtZT0i7Yyo7IqkIDEyMDIyOCIgZD0iTTYsNy43ODdsLTYtNkwxLjc4NywwLDYsNC4yMTMsMTAuMjEzLDAsMTIsMS43ODdaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyMC43ODcgMTUpIHJvdGF0ZSg5MCkiIGZpbGw9IiMzMzMiLz4NCiAgPC9nPg0KPC9zdmc+DQo=") no-repeat 50% 50%;
    background-size: 0.875rem auto;
}
.pagination .page-next {
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 5px 0 1.25rem;
    border: 1px solid #333;
    background: url("data:image/svg+xml;base64,DQo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0Ij4NCiAgPGRlZnM+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgiPg0KICAgICAgPHJlY3QgaWQ9IuyCrOqwge2YlV8xNzQzIiBkYXRhLW5hbWU9IuyCrOqwge2YlSAxNzQzIiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLjUgMTQpIiBmaWxsPSJub25lIiBzdHJva2U9IiM3MDcwNzAiIHN0cm9rZS13aWR0aD0iMSIvPg0KICAgIDwvY2xpcFBhdGg+DQogIDwvZGVmcz4NCiAgPGcgaWQ9ImljX3BhZ2VfbmV4dCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEyLjUgLTE0KSIgY2xpcC1wYXRoPSJ1cmwoI2NsaXAtcGF0aCkiPg0KICAgIDxwYXRoIGlkPSLtjKjsiqRfMTIwMjI4IiBkYXRhLW5hbWU9Iu2MqOyKpCAxMjAyMjgiIGQ9Ik02LDcuNzg3bC02LTZMMS43ODcsMCw2LDQuMjEzLDEwLjIxMywwLDEyLDEuNzg3WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTUuNzEzIDI3KSByb3RhdGUoLTkwKSIgZmlsbD0iIzMzMyIgb3BhY2l0eT0iMC45OTgiLz4NCiAgPC9nPg0KPC9zdmc+DQo=") no-repeat 50% 50%;
    background-size: 0.875rem auto;
}
.pagination .page-last {
    display: inline-block;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid #333;
    background: url("data:image/svg+xml;base64,DQo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMCAwIDE0IDE0Ij4NCiAgPGRlZnM+DQogICAgPGNsaXBQYXRoIGlkPSJjbGlwLXBhdGgiPg0KICAgICAgPHJlY3QgaWQ9IuyCrOqwge2YlV8xNzQyIiBkYXRhLW5hbWU9IuyCrOqwge2YlSAxNzQyIiB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLjUgMTMpIiBmaWxsPSJub25lIiBzdHJva2U9IiM3MDcwNzAiIHN0cm9rZS13aWR0aD0iMSIvPg0KICAgIDwvY2xpcFBhdGg+DQogIDwvZGVmcz4NCiAgPGcgaWQ9ImljX3BhZ2VfZmluYWwiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI2LjUgMjcpIHJvdGF0ZSgxODApIiBjbGlwLXBhdGg9InVybCgjY2xpcC1wYXRoKSI+DQogICAgPGcgaWQ9Iuq1rOyEsV/smpTshoxfMTMyXzQiIGRhdGEtbmFtZT0i6rWs7ISxIOyalOyGjCAxMzIg4oCTIDQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEzLjU0MyAxNCkiPg0KICAgICAgPHBhdGggaWQ9Iu2MqOyKpF80MjgwIiBkYXRhLW5hbWU9Iu2MqOyKpCA0MjgwIiBkPSJNNiw3Ljc4N2wtNi02TDEuNzg3LDAsNiw0LjIxMywxMC4yMTMsMCwxMiwxLjc4N1oiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDExLjk1Nykgcm90YXRlKDkwKSIgZmlsbD0iIzMzMyIvPg0KICAgICAgPHJlY3QgaWQ9IuyCrOqwge2YlV8xNTk0IiBkYXRhLW5hbWU9IuyCrOqwge2YlSAxNTk0IiB3aWR0aD0iMi41IiBoZWlnaHQ9IjEyIiBmaWxsPSIjMzMzIi8+DQogICAgPC9nPg0KICA8L2c+DQo8L3N2Zz4NCg==") no-repeat 50% 50%;
    background-size: 0.875rem auto;
}
.pagination .is-disabled {
    opacity: 0.3;
}
@media screen and (max-width: 1024px) {
    .pagination .page-link {
        padding: 0 1em;
        font-size: 0.75rem;
        line-height: 2.6666666667;
    }
    .pagination .current {
        font-size: 0.8125rem;
        line-height: 2.4615384615;
    }
    .pagination .current:after {
        left: 10px;
        right: 10px;
    }
    .pagination .page-front {
        width: 2rem;
        height: 2rem;
        background-size: 10px auto;
    }
    .pagination .page-prev {
        width: 2rem;
        height: 2rem;
        margin-left: 3px;
        margin-right: 10px;
        background-size: 10px auto;
    }
    .pagination .page-next {
        width: 2rem;
        height: 2rem;
        margin-right: 3px;
        margin-left: 10px;
        background-size: 10px auto;
    }
    .pagination .page-last {
        width: 2rem;
        height: 2rem;
        background-size: 10px auto;
    }
}

.skeleton {
    -webkit-animation: skeleton-loading 1s linear infinite alternate;
            animation: skeleton-loading 1s linear infinite alternate;
}

@-webkit-keyframes skeleton-loading {
    0% {
        background-color: hsl(200deg, 20%, 80%);
    }
    100% {
        background-color: hsl(200deg, 20%, 95%);
    }
}

@keyframes skeleton-loading {
    0% {
        background-color: hsl(200deg, 20%, 80%);
    }
    100% {
        background-color: hsl(200deg, 20%, 95%);
    }
}
.skeleton-text {
    display: block;
    width: 100%;
    height: 1rem;
    margin: 0 0 4px;
    border-radius: 0.25rem;
}

.num .skeleton-text {
    width: 4rem;
    margin: 0 auto;
}
@media screen and (max-width: 1024px) {
    .num .skeleton-text .num .skeleton-text {
        width: 2rem;
        margin: 0;
    }
}

@media screen and (max-width: 1024px) {
    .status .skeleton-text {
        width: 4rem;
    }
}

.pagination.skeleton {
    display: block;
    width: 30%;
    height: 2rem;
    margin-left: auto;
    margin-right: auto;
    border-radius: 0.25rem;
}

.board-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: -2rem;
    right: 0;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}

.board-action .btn {
    display: block;
    width: 2rem;
    height: 2rem;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: 1.25rem auto;
}

.board-action .edit {
    background-image: url("../img/ic_edit.svg");
}

.board-action .settings {
    background-image: url("../img/ic_settings.svg");
}