/****************** 공지사항 리스트 ******************/
.board-top {
    margin-bottom: 10px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
.board-top .board-title > span {
    display: block;
    font-family: 'Anta';
}
.board-top .board-title .type {
    font-size: 18px;
    color: var(--main-color);
}
.board-top .board-title .total {
    margin-top: 3px;
    font-size: 50px;
}
.board-top .write-button {
    display: block;;
    padding-left: 23px;
    font-weight: 500;
    font-size: 15px;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none"><path d="M8.5 14.1665H14.875" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.6875 2.47916C11.9693 2.19737 12.3515 2.03906 12.75 2.03906C12.9473 2.03906 13.1427 2.07793 13.325 2.15344C13.5073 2.22895 13.673 2.33963 13.8125 2.47916C13.952 2.61869 14.0627 2.78434 14.1382 2.96664C14.2137 3.14895 14.2526 3.34434 14.2526 3.54166C14.2526 3.73899 14.2137 3.93438 14.1382 4.11669C14.0627 4.29899 13.952 4.46464 13.8125 4.60416L4.95833 13.4583L2.125 14.1667L2.83333 11.3333L11.6875 2.47916Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>')left center no-repeat;
}

.board .line {
    display: block;
    width: 100%;
    overflow: hidden;
}
.board-list-box {
    margin-top: 50px;
}
.board-list-box ul {
    display: flex;
    flex-wrap: wrap;
    gap: 30px
}
.board-list-box ul li {
    position: relative;
    width: calc(100% / 3 - 30px);
}
.board-list-box ul li.no-list {
    width: 100%;
    padding: 50px 0;
    font-size: 15px;
    text-align: center;
}
/* .board-list-box ul li:before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 99%;
    height: 1px;
    background: rgba(255,255,255,0.2);
}
.board-list-box ul li:after {
    content: "";
    position: absolute;
    bottom: 5px;
    left: 2px;
    width: 1%;
    height: 1px;
    background: rgba(255,255,255,0.2);
    transform: rotate(45deg);
} */
.board-list-box ul li::before {
    content: "";
    display: block;
    width: 100%;
    height: 15px;
    background: url(../img/content/notice-card-top.png)center center / 100% no-repeat;
}
.board-list-box ul li::after {
    content: "";
    display: block;
    width: 100%;
    height: 58px;
    background: url(../img/content/notice-card-bottom.png)center bottom / 100% no-repeat;
}
.board-list-box ul li a {
    position: relative;
    display: block;
    padding: 25px 30px;
    padding-bottom: 0;
}
.board-list-box ul li a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 2px;
    height: calc(100% + 2.292vw);
    background: #fff;
}
.board-list-box ul li a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 2px;
    height: calc(100% + 0.729vw);
    background: #fff;
}
.board-list-box ul li a .img {
    width: 100%;
    height: 300px;
    overflow: hidden;
}
.board-list-box ul li a .img.no-img {
    background: url(../img/layout/logo_wh.png)center center no-repeat;
    background-size: 80px;
}
.board-list-box ul li a .img img {
    width: 100%;
}
.board-list-box ul li a .text {
    margin-top: 28px;
    padding: 0 10px;
}
.board-list-box ul li a .title {
    display: block;
    min-height: 58px;
    line-height: 28px;
    font-weight: 700;
    font-size: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.board-list-box ul li a .date {
    display: block; 
    margin-top: 15px;
    font-family: 'Anta';
    font-size: 14px;
    opacity: .9;   
}

/****************** Pagination ******************/
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 40px;
}
.pagination li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    font-size: 14px;
    background: url(../img/content/pagination-btn.png)center center no-repeat;
}
.pagination li.active a {
    font-weight: 700;
    color: var(--main-color);
    background: url(../img/content/pagination-btn-active.png)center center no-repeat;
}

/****************** 공지사항 상세 ******************/
.board-detail .board-detail-top {
    padding-bottom: 30px;
}
.board-detail .board-detail-top .title {
    display: block;
    font-weight: 700;
    font-size: 36px;
    text-align: center;
}
.board-detail .board-detail-top > span {
    display: block;
    margin-top: 20px;
    font-family: 'Anta';
    font-size: 14px;
    text-align: center;
    opacity: .9;
}
.board-detail .board-detail-content {
    min-height: 500px;
    padding: 40px 30px;
    border-bottom: 1px solid #e8f7f6;;
}
.board-detail .board-detail-content img {
    max-width: 100%;
}
.board-detail .board-detail-bottom {
    margin-top: 30px;
}
.board-detail .board-detail-bottom .list-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    width: 130px;
    height: 50px;
    font-family: 'Anta';
    font-size: 18px;
    background: url(../img/content/list-btn.png)center center no-repeat
}

/****************** 공지사항 등록폼 ******************/
.board-form #editor {
    margin: 20px 0 30px;
}
.board-form #editor strong {
    color: #222;
}
.board-form .submit-btn {
    font-size: 18px;
}

@media only screen and (max-width: 1560px) {
    .board {
        padding: 0 30px;
    }

    .board-list-box ul li::before {
        /* height: 14px; */
        height: 0.897vw;
    }
    .board-list-box ul li::after {
        /* height: 55px; */
        height: 3.526vw;
    }
}
@media only screen and (max-width: 1199px) {
    .board-list-box ul li {
        width: calc(100% / 2 - 15px);
    }
    .board-list-box ul li::after {
        height: 4.587vw;
    }
    .board-list-box ul li a::after {
        height: 100%;
    }
}
@media only screen and (max-width: 1023px) {
    .board-top .board-title .type {
        font-size: 14px;
    }
    .board-top .board-title .total {
        font-size: 30px;
    }
    .board-list-box ul li a {
        padding: 25px 25px 0 25px;
    }
    .board-list-box ul li a .img {
        height: 24.438vw;
    }
    .board-list-box ul li a .text {
        margin-top: 20px;
        padding: 0;
    }
    .board-list-box ul li a .title {
        min-height: 43px;
        line-height: 22px;
        font-size: 15px;
    }
    .board-list-box ul li a .date {
        font-size: 13px;
    }

    .board-detail .board-detail-top .title {
        
        font-size: 26px;
    }
    .board-detail .board-detail-top > span {
        margin-top: 12px;
        font-size: 13px;
    }
}
@media only screen and (max-width: 520px) {
    .board > .line img {
        width: 200%;
    }

    .board-list-box ul li {
        width: 100%;
    }
    .board-list-box ul li::before {
        height: 2.692vw;
    }
    .board-list-box ul li::after {
        height: 10.577vw;
    }
    .board-list-box ul li a .img {
        height: 57.692vw;
    }
}

/****************** 약관 ******************/
.policy-title1 {
    display: block;
    margin: 80px 0 30px;
    font-weight: 700;
    font-size: 28px;
}
.policy-title2 {
    display: block;
    margin-bottom: 12px;
    font-weight: 700;
    font-size: 18px;
}
.policy-title3 {
    display: block;
    margin: 20px 0 15px;
    font-weight: 500;
    font-size: 16px;
}
.policy-txt1 {
    line-height: 21px;
    font-size: 15px;
}
.policy-tab {
    display: flex;
    margin-bottom: 80px;
}
.policy-tab li {
    flex: 1;
}
.policy-tab li a {
    display: block;
    height: 60px;
    line-height: 60px;
    text-align: center;
    border: 1px solid #fff;
    border-right: 0;
    opacity: .6;
}
.policy-tab li:last-child a {
    border-right: 1px solid #fff;
}
.policy-tab li.active a {
    font-weight: 700;
    color: var(--background-color);
    background: #fff;
    opacity: 1;
}
.policy-cont .box {
    margin-bottom: 50px;
}
@media only screen and (max-width: 1560px) {
    .policy-wrap .inner2 {
        padding: 0 30px;
    }
}
@media only screen and (max-width: 1023px) {
    .policy-tab {
        flex-wrap: wrap;
    }
    .policy-tab li {
        flex: 1 1 40%;
    }
    .policy-tab li a {
        border-right: 1px solid #fff;
    }
}
@media only screen and (max-width: 767px) {
    .policy-tab li a {
        height: 52px;
        line-height: 52px;
        font-size: 14px;
    }
    .policy-title1 {
        font-size: 22px;
    }
    .policy-title2 {
        font-size: 15px;
    }
    .policy-txt1 {
        font-size: 13px;
    }
}

