.wrap-notice {height: 100%;padding: 10rem 0 63rem 0; background: url('../images/bg-notice.jpg') no-repeat center top / cover;}
.wrap-notice > .inner {width: 100%;;max-width: 160rem;margin: 0 auto;}
.wrap-notice .head {position: relative;}
.wrap-notice .head .title {transform: translateY(-.8rem);text-align: center;}
.wrap-notice .head .title strong {font-family: ppe; font-size: 6rem; line-height: 1; color: #fff;}
#recentBbsArtcl8 {display: flex;justify-content: center;}
#recentBbsArtcl8 .title {position: relative; display: none; margin-right: 3.5rem; padding-right: 4.5rem;}
#recentBbsArtcl8 .title::after {content: '/'; position: absolute; right: 0; top: .6rem; font-family: ppl; font-size: 3.5rem; line-height: 1.2; color: #91b4e2;}
#recentBbsArtcl8 > li:last-child .title {margin-right: 0; padding-right: 0;}
#recentBbsArtcl8 > li:last-child .title::after {display: none;}
#recentBbsArtcl8 .title > a {font-family: ppr; font-size: 3.5rem; color: #91b4e2;}
#recentBbsArtcl8 .title > a:hover,
#recentBbsArtcl8 > li.active .title a {font-family: ppe; color: #fff;}
#recentBbsArtcl8 .title > a {position: relative;}
#recentBbsArtcl8 .title > a:hover::after,
#recentBbsArtcl8 > li.active .title a::after {content: ''; position: absolute; left: -2.4rem; top: -.7rem; width: 1.6rem; height: 1.7rem; background: url('../images/ic-notice-tab.png') no-repeat center / cover;}
.wrap-notice .head .more {position: absolute; right: 0; top: 1rem; width: 3rem; height: 3rem; background: url('../images/btn-notice-more.png') no-repeat center / cover; text-indent: -9999rem; transition: transform .35s;}
.wrap-notice .head .more:hover {transform: rotate(270deg);}
.wrap-notice .head .more > a {display: block;width: 100%;height: 100%;}
.wrap-notice .slider {overflow: hidden !important;position:absolute;top:4rem;left:0;width:100%;margin-top: 8rem;}
.wrap-notice .swiper-wrapper {display: flex; flex-wrap: wrap; width: calc(100% + 4rem);}
.wrap-notice .slider .swiper-slide {width: 25%; padding-right: 4rem; padding-bottom: 4rem;}
.wrap-notice .slider .box {position: relative; display: block; height: 21rem; padding: 3.3rem 4rem; background: #fff; transition: .35s;}
.wrap-notice .slider .notice .box::after {content: ''; position: absolute; right: 2rem; bottom: 2rem; display: block; width: 4.8rem; height: 4.8rem; background: #0a356f url('../images/ic-notice.png') no-repeat center; border-radius: 100%;}
.wrap-notice .slider .box:hover {background: #00aae5; border-radius: 0 5rem 0 0;}
.wrap-notice .subjectText {display: block;font-family: pm; font-size: 2.2rem; color: #000000;white-space: nowrap;overflow: hidden;text-overflow: ellipsis; }
.wrap-notice .slider .box:hover .subjectText {font-family: pb; color: #fff;}
.wrap-notice .subjectText span {position: relative;}
.wrap-notice .subjectText span::before {content: ''; position: absolute; bottom: 0; left: 0; height: 2px; width: 0; background: #fff;transition: .8s;}
.wrap-notice .slider .box:hover .subjectText span::before {width: 100%;}
.wrap-notice .content {display: -webkit-box; margin-top: 2rem; font-family: pr; font-size: 1.6rem; color: #6b6b6b;  overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.wrap-notice .slider .box:hover .content {color: #fff;}
.wrap-notice .slider .box .date {display: block; margin-top: 2rem; font-family: pr; font-size: 1.3rem; color: #aaaaaa;}
.wrap-notice .slider .box:hover .date {color: #fff;}
.wrap-notice .swiper-pagination  {display: none;}
.wrap-notice .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {margin-left: 0 !important;}

.nodata-container {padding: 10rem 0 40rem 0}
.nodata-container .swiper-pagination {display: none !important;}

/*noData*/
.wrap-notice .slider .nodata{width:100%;padding:50px 0;margin-top: 4rem;font-size:18px;color:#fff;text-align:center;}

/*썸네일*/
.wrap-notice .thumb{display:none;}

/*더보기*/
.wrap-notice .more span{display:none;}

/*꾸미기*/
.wrap-notice .readMore{display:none;}

/*활성화*/
.wrap-notice .slider,
.wrap-notice .more{display:none}
.wrap-notice > .inner > .head > ul > li.active .slider,
.wrap-notice > .inner > .head > ul > li.active .more{display:block}

/*CONTROL*/
.wrap-notice .control{display:none;}


@media screen and (max-width: 1740px) {
	.wrap-notice > .inner {padding: 0 2rem;}
}

@media screen and (max-width:1600px) {
  	.wrap-notice {background-position: right;}
	.wrap-notice .slider {overflow: visible !important;}
  	.wrap-notice .slider .swiper-slide {padding-right: 0;padding-bottom: 0;}
  	.wrap-notice .swiper-pagination {display: block;left: 50% !important;bottom: -6rem !important;transform: translateX(-50%) !important;}
	.wrap-notice .swiper-pagination > span {margin-right: 1rem !important;opacity: 1 !important;background: #90a3bd !important;}
	.wrap-notice .swiper-pagination > span:last-child {margin-right: 0 !important;}
	.wrap-notice .swiper-pagination > .swiper-pagination-bullet-active {width: 4rem !important;background: #00aae5 !important;border-radius: 0.5rem !important;}
	.wrap-notice .head .more {top: .5rem;}
}

@media screen and (max-width:1100px) {
	.wrap-notice {padding: 8.5rem 0 64rem 0;}
	.wrap-notice > .inner {padding: 0 2rem;}
	.wrap-notice .head .tab ul {margin-right: 3rem;}
	.wrap-notice .head .tab li {margin-right: 2.5rem;}
	.wrap-notice .head .title strong {font-size: 4.8rem;}
	#recentBbsArtcl8 {margin-left: 10rem;}
	#recentBbsArtcl8 .title {margin-right: 1.5rem;}
	#recentBbsArtcl8 .title > a {font-size: 2.8rem;}
	#recentBbsArtcl8 .title::after {right: 1.2rem;top: .4rem;;font-size: 2.8rem;}
	#recentBbsArtcl8 .title > a:hover::after,
	#recentBbsArtcl8 > li.active .title a::after {background-size: 1.3rem;top: -.6rem;left: -2.2rem;}
	.wrap-notice .slider {margin-top: 5.2rem;}
	.wrap-notice .slider .swiper-slide {padding-bottom: 0;}
	.wrap-notice .head .more {width: 2.4rem;height: 2.4rem;;top: 0;}
  	.wrap-notice .swiper-pagination {bottom: -5.5rem !important;}
	.nodata-container {padding: 8.5rem 0 35rem 0;}
}

@media screen and (max-width: 768px) {
	.wrap-notice {padding: 10rem 0 92.5rem 0;background-position: right -34rem top;}
  	.wrap-notice > .inner {padding: 0 2rem;}
	.wrap-notice .head .title {top: -4rem;}
	.wrap-notice .head .title strong {font-size: 4rem;}
	.wrap-notice .head .tab ul {transform: translate(2rem, 2.7rem);justify-content: flex-start;}
  	.wrap-notice .slider .box {height: auto;padding: 2.8rem 10rem 2.8rem 2rem;}
	.wrap-notice .content {margin-top: 1rem;}
	.wrap-notice .slider .box .date {margin-top: 1rem;}
	#recentBbsArtcl8 {margin-left: 0;justify-content: flex-start;}
	#recentBbsArtcl8 .title {transform: translate(2rem, 6.5rem);}
	.nodata-container {padding: 10rem 0 31rem 0;}
}