/*
공지사항
*/
*{margin: 0; padding: 0; box-sizing: border-box;}
ul{padding: 0;}
ul li{list-style: none;}
main.bbs {padding: 1.5rem 0;}
.bbs-header {margin: 1rem 0;}

@media (min-width: 768px) {
    .bbs-header {display: flex;justify-content: end;}
}



/* weekend-page */
[class^='mo-'] {display:none;}
.weekend-page .visual{width: 100%; background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/hanaschool/weekendbbs_visual.jpg'); background-repeat: no-repeat; background-position: center; background-size: cover; color: #fff; padding: 3.4rem 0 2.3rem;}
.weekend-page .visual h1{margin-bottom: 1.3rem;}

.weekend-page .bbs-contents-top-txt{font-size: 1.375rem; font-weight: 700; color: #000; margin-top: 2.25rem; margin-bottom: 0.75rem;}
.weekend-page .bbs-contents-top-txt em{font-style: normal;}


/* .weekend-page .bbs-header{border-bottom: 2px solid #C8C5CA; padding-bottom: 1rem;}
.weekend-page .bbs-header .form-control{border: none; }
.weekend-page .bbs-header .input-group{border: 1px solid #DEDFE5; border-radius: 0.37rem; height: 2.3rem;}
.weekend-page .bbs-header .btn-outline-secondary{border: none;} */

.weekend-page .listWrap > ul{display: flex; flex-wrap: wrap;}
.weekend-page .listWrap > ul > li{width: calc(100%/3 - 1rem); margin-right: 1.5rem; margin-bottom: 1.8rem; border: 1px solid #DEDFE5; border-radius: 1rem;}
.weekend-page .listWrap > ul > li:nth-child(3n){margin-right: 0;}
.weekend-page .listWrap > ul > li:nth-last-of-type(1),.weekend-page .listWrap > ul > li:nth-last-of-type(2),.weekend-page .listWrap > ul > li:nth-last-of-type(3){margin-bottom: 0;}
.weekend-page .listWrap > ul > li .imgBox{width: 100%; border-radius: 1rem 1rem 0 0; overflow: hidden; height: 11.3rem; position: relative;}
.weekend-page .listWrap > ul > li .imgBox span{width: 100%; height: 100%; display: block;}
.weekend-page .listWrap > ul > li .imgBox::after{content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0,0,0,0.5); opacity: 0; touch-action: none; pointer-events: none; transition: all 0.3s ease;}
.weekend-page .listWrap > ul > li .imgBox a{color: #fff; font-size: 0.75rem; background-color: #000000; border-radius: 100px; padding: 0.6rem 1rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); opacity: 0; transition: all 0.3s ease; z-index: 2; line-height: 1;}
.weekend-page .listWrap > ul > li .imgBox a:hover{background-color: #333333;}
.weekend-page .listWrap > ul > li .textBox{width: 100%; border-radius: 0 0 1rem 1rem; padding: 1rem 1.8rem 0; min-height: 10.12rem; position: relative; color: #000; border-top: 1px solid #DEDFE5;}
.weekend-page .listWrap > ul > li .textBox .subject{font-size: 1.12rem; font-weight: bold; margin-top: 0.5rem; margin-bottom: 0.3rem; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -moz-box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; display: -moz-box; display: -webkit-box; height: 3.375rem;}
.weekend-page .listWrap > ul > li .textBox .category span{padding: 0.3rem 0.6rem; display: inline-block; border-radius: 100px; color: #fff; background-color: #666666; font-weight: 500; line-height: 1; }
.weekend-page .listWrap > ul > li .textBox .category span.ing{background-color: #FF5101;}
.weekend-page .listWrap > ul > li .textBox .calender{font-size: 0.87rem; width: 100%; padding: 0; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -moz-box-orient: vertical; line-clamp: 3; -webkit-line-clamp: 3; display: -moz-box; display: -webkit-box;}
.weekend-page .listWrap > ul > li:hover .imgBox::after{opacity: 1;}
.weekend-page .listWrap > ul > li:hover .imgBox a{opacity: 1;}

.weekend-page .pagination .page-item:not(:first-child, :last-child){display: none;}
.weekend-page .pagination .page-item + .page-item{margin-left: 1.5rem;}
.weekend-page .pagination .page-item:first-child *{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/hanaschool/weekendbbs_pagination_prev.svg'); background-repeat: no-repeat; background-position: center; background-size: 1.5rem; text-indent: -9999999%; border: none; background-color: transparent !important; width: 1.5rem;}
.weekend-page .pagination .page-item:last-child *{background-image: url('https://s3.ap-northeast-2.amazonaws.com/img.hana-edu.co.kr/hanaschool/weekendbbs_pagination_next.svg'); background-repeat: no-repeat; background-position: center; background-size: 1.5rem; text-indent: -9999999%; border: none; background-color: transparent !important; width: 1.5rem;}
.weekend-page .pagination .page-item.disabled *{opacity: 0.5;}
.weekend-page .page-link{padding: 0;}
.weekend-page .page-links .justify-content-between,
.weekend-page .page-links .justify-content-sm-between{justify-content: flex-end !important;}
/* .weekend-page .pagination .page-link:focus{box-shadow: none;} */



@media (max-width: 1080px) {
    [class^='mo-'] {display:block;}

    .weekend-page .listWrap > ul > li{width: calc(100%/2 - 1rem);}
    .weekend-page .listWrap > ul > li:nth-child(3n){margin-right: 1.5rem;}
    .weekend-page .listWrap > ul > li:nth-child(2n){margin-right: 0;}
    .weekend-page .listWrap > ul > li:nth-last-of-type(3){margin-bottom: 1.8rem;}
    .weekend-page .listWrap > ul > li .imgBox::after{opacity: 1;}
    .weekend-page .listWrap > ul > li .imgBox a{opacity: 1;}
}

@media (max-width: 767px) {
    .weekend-page .visual{font-size: 0.87rem; padding: 6.4rem 0 5.3rem;}
    .weekend-page .visual h1{font-size: 1.62rem; margin-bottom: 0.8rem;}

    .weekend-page .listWrap > ul > li{width: 100%; margin-right: 0 !important; margin-bottom: 1rem;}
    .weekend-page .listWrap > ul > li:nth-last-of-type(2),.weekend-page .listWrap > ul > li:nth-last-of-type(3){margin-bottom: 1rem;}
    .weekend-page .listWrap > ul > li .imgBox{height: 10.3rem;}
    .weekend-page .listWrap > ul > li .textBox{padding: 1rem;}
    .weekend-page .listWrap > ul > li .textBox .subject{line-height: 1.35; height: auto;}

    .weekend-page .page-links .justify-content-between,
    .weekend-page .page-links .justify-content-sm-between{justify-content: center !important;}
}

@media screen and (max-width: 575px) {
    .weekend-page .container{padding-left: 16px; padding-right: 16px;}
}