
/* .notice-container .back-img{background-color: aqua; width: 100%; position: absolute; top: 0; height: 400px; z-index: -1;} */
.notice-container .notice-wrap {  width: 100%; background-color: #fff; display: flex; justify-content: center; }
.notice-container .notice-wrap .inner { padding:var(--Spacing-M)  40px; width: 1200px; }
.notice-container .notice-wrap .inner .top-select-box {display: flex; justify-content: center; margin-bottom: var(--Spacing-M);}
.notice-container .notice-wrap .inner .top-select-box a{height: 60px; width: 157px; display: flex; justify-content: center; align-items: center; color: var(--text-unselected); font-weight: 400; font-size: var(--Font-Size-Title);}
.notice-container .notice-wrap .inner .top-select-box a.on{color: var(--main-002); border-bottom: 2px solid var(--main-002); font-weight: 700;}

.notice-container .notice-wrap .inner .notice-list{display: flex; justify-content:space-between; width: 100%;}
.notice-container .notice-wrap .inner .notice-list ul{width: 100%;}
.notice-container .notice-wrap .inner .notice-list li{width: 100%;}
.notice-container .notice-wrap .inner .notice-list a{display: flex; justify-content:space-between; width: 100%;  padding: var(--Spacing-M) 0; box-sizing: border-box;}
.notice-container .notice-wrap .inner .notice-list li{border-bottom: 1px solid var(--border-default);}

.notice-container .notice-wrap .inner .notice-list .notice-title{font-size: var(--Font-Size-Body_Long); font-weight: 400; color: var(--text-primary);}
.notice-container .notice-wrap .inner .notice-list .reg-date{font-size: var(--Font-Size-Body_Long); font-weight: 400; color: var(--text-secondary);}

.notice-container .notice-wrap .inner .paginate{text-align: center;}
.notice-container .notice-wrap .inner .paginate .page-navi.num{font-size: var(--Font-Size-Label); font-weight: 500; color: var(--text-unselected); margin-right: var(--Spacing-L);}
.notice-container .notice-wrap .inner .paginate .page-navi.num:last-child{margin-right:unset !important;}
.notice-container .notice-wrap .inner .paginate .active.num{color: var(--main-001); }


.notice-container .notice-wrap .inner .notice-list{margin-bottom: var(--Spacing-M);}
.notice-container .notice-wrap .inner .event-list {margin-bottom: var(--Spacing-M);}

.paginate > a { padding: 0 0.3rem; display: inline-block; opacity: .3; color: #000;}
.fa-angle-right:before { content: "\f105"; }
.fa-angle-double-right:before { content: "\f101"; }
.fa-angle-left:before { content: "\f104"; }
.fa-angle-double-left:before { content: "\f100"; }

.notice-container .notice-wrap .inner .paginate .page-navi.last     { margin-left: var(--Spacing-S);}
.notice-container .notice-wrap .inner .paginate .page-navi.next     { margin-left: var(--Spacing-L);}
.notice-container .notice-wrap .inner .paginate .page-navi.first    { margin-right: var(--Spacing-S);}
.notice-container .notice-wrap .inner .paginate .page-navi.previous { margin-right: var(--Spacing-L);}

.notice-container .notice-wrap .inner .event-list img{width: 248px; border-radius: var(--Radius-S); margin-bottom: var(--Spacing-S);}
.notice-container .notice-wrap .inner .event-list .notice-title{margin-bottom: var(--Spacing-XS); font-size: var(--Font-Size-Body_Short); color: var(--text-primary); }
.notice-container .notice-wrap .inner .event-list .reg-date{font-size: var(--Font-Size-Label-L); font-weight: 400; color: var(--text-secondary); }
.notice-container .notice-wrap .inner.event {width: auto;}
.notice-container .notice-wrap .inner.event .event-list ul{ display: grid !important; grid-template-columns: 248px 248px 248px; gap: var(--Spacing-L); }



/* 1개 또는 2개일 때만 가운데 정렬 */
.notice-container .notice-wrap .inner.event .event-list ul:has(:first-child:nth-last-child(-n+2)) { display: flex; justify-content: center; }

/* 태블릿 */
@media (max-width: 1199px) {
.notice-container .notice-wrap .inner{width: 100%; padding:var(--Spacing-M)  24px;}
.notice-container .notice-wrap .inner.event .event-list ul{  grid-template-columns: 248px 248px; }
.notice-container .notice-wrap .inner .top-select-box a{height: 44px;}
}

/* 모바일 */
@media (max-width: 767px) {
.notice-container .notice-wrap .inner.event .event-list ul{  grid-template-columns: 248px; }
.notice-container .notice-wrap .inner .event-list img{width: 100%;}
.notice-container .notice-wrap .inner{width: 100%; padding:var(--Spacing-M)  18px;}
.notice-container .notice-wrap .inner .top-select-box a{height: 38px; width: 100%;}

}