@charset "utf-8";



/* 공지사항 */ 
.wrap-notice{position:relative;word-break:break-all;margin:0 auto;padding: 0 20px;height: 460px !important;}
.wrap-notice h2{position: absolute;font-size: 30px;line-height: 1;top: 18px;left: 23px;font-family: 'Gmarket Bold';}
.wrap-notice .title a{display:block;transition:0.3s;cursor:pointer;font-size: 21px;font-weight: 600;padding: 18px 15px;line-height: 1;opacity: 0.8;color: #333;}
.wrap-notice .title a span {padding: 0 3px;position:relative;font-family: 'Gmarket Light';}
.wrap-notice .title a span:before {content:'';position:absolute;bottom: -10px;left: 0;border-top: 10px solid #5e87c5;width: 100%;z-index: -1;opacity: 0;transition: 0.3s;}
.wrap-notice .title:hover a {opacity:1; transition:0.3s}
.wrap-notice > ul{position:relative;height:100%;display: flex;justify-content: flex-end;}
.wrap-notice > ul > li:last-child {margin-right: 50px;}
.wrap-notice > ul > li{}
.wrap-notice > ul > li + li{}
.wrap-notice > ul > li .title {position: relative;}
.wrap-notice > ul > li .title:before {content:'/';position: absolute;top: 17px;left: -3px;color: #ccc;}
.wrap-notice > ul > li:first-child .title:before {display:none}
.wrap-notice > ul > li:last-child .title a{}

.wrap-notice .active .title a {opacity:1}
.wrap-notice .active .title a span {color: #1e5ab0;}
.wrap-notice .active .title a span:before{opacity:1;transition: 0.3s;}


.wrap-notice .list {position:absolute;left:0;text-align:left;width:100%;top: 80px;}
.wrap-notice .list ul {display: flex;width: 100%;justify-content: space-between;}
.wrap-notice .list ul li {border-radius: 25px;box-shadow: 0px 0px 8px #33323236;transition: 0.3s;min-width: 1px;position: relative;width: 48%;}
.wrap-notice .list ul li.nodata {font-size:18px;text-align:center;padding:30px 0;width:100%;height: 240px;vertical-align: middle;display: flex;flex-direction: column;justify-content: center;max-width: 100%;}

.wrap-notice .list .con {height:100%}
.wrap-notice .list .subject{position:relative;padding: 40px 33px 28px;height: 100%;display: flex;flex-direction: column;justify-content: space-between;padding-bottom: 45px;}
.wrap-notice .list .subject:before {content:'';position:absolute;bottom:0;right:0;width: 70px;height: 70px;border-radius: 10px;background: #2059b0 url(../images/plus-w.png)center no-repeat;}
.wrap-notice .list .subject .cate span {display: inline-block;line-height: 1;padding: 13px 20px 8px;border-radius: 50px;margin-bottom: 33px;color: #fff;font-weight: bold;font-size: 19px;}
.wrap-notice .list .subject .subjectText{font-size: 22px;display: -webkit-box;overflow: hidden;line-height: 1.35;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 2;font-weight: bold;margin-bottom: 30px;height: 55px;}
.wrap-notice .list .subject .date {padding-left: 21px;position: relative;font-weight: bold;}
.wrap-notice .list .subject .date:before {position:absolute;content:'';background: url(../images/cal.png) center no-repeat;width: 14px;aspect-ratio: 1/1;left: 0;top: 4px;background-size: contain;opacity: 0.5;}
.wrap-notice .list .subject .date span {font-size: 14px;color: #747373;font-family: 'Gmarket Light';} 
.wrap-notice .list .subject .content{font-size: 18px;color: #646464;width:100%;word-break: keep-all;display: -webkit-box;overflow: hidden;line-height: 1.4;text-overflow: ellipsis;-webkit-box-orient: vertical;-webkit-line-clamp: 3;height: 70px;margin-bottom: 35px;font-family: 'Gmarket Light';font-weight: bold;}
.wrap-notice > ul > li:nth-of-type(1) .cate span {background: #ff9000; }
.wrap-notice > ul > li:nth-of-type(2) .cate span {background: #f13278; }
.wrap-notice > ul > li:nth-of-type(3) .cate span {background: #10a07f; }

.wrap-notice .more{position:absolute;top: 10px;right: 8px;text-indent: -9999px;border-radius: 50px;width: 36px;height: 36px;background: url(../images/plus.png)center no-repeat;background-size: contain;transition: 0.3s;/*border: 3px dashed #4d4d4d;*/}
.wrap-notice .more:hover {transition: 0.3s;transform: rotate(90deg);}

.wrap-notice .list, .wrap-notice .more{display:none}

/* slick on*/
.wrap-notice .slick-list {overflow: visible;}
.wrap-notice .list ul.slick-slider {display:block}
.wrap-notice .list ul.slick-slider li {opacity: 0.5; max-width: 100%; min-width: inherit}
.wrap-notice .list ul.slick-slider li.slick-active {opacity: 1; transition: 0.3s;}
.wrap-notice .list ul.slick-slider .slick-arrow {top: 50%;transform: translateY(-50%);width: 70px;background-color: #004da7 !important;border-radius: 50px;box-shadow: 0px 0px 15px #33303070;}
.wrap-notice .list ul.slick-slider .slick-next {background: url(../images/chevron-right-w.png) center no-repeat; right: 255px;}
.wrap-notice .list ul.slick-slider .slick-prev {background: url(../images/chevron-left-w.png) center no-repeat; left: 255px;}
 
.wrap-notice > ul > li.active .list, .wrap-notice > ul > li.active .more{display:block} 
 
@media all and (max-width:1200px){

    [id*="_obj228"] {width:100% !important;} 
	.wrap-notice {margin-bottom:30px;margin-top: 50px;}
	.wrap-notice > ul {}
    .wrap-notice > ul > li {min-width: auto;}
	.wrap-notice .list {top: 80px;}
    .wrap-notice .list ul li {margin: 0 10px;} 	 

} 
@media all and (max-width:1024px){
	
    .wrap-notice .title a{font-size: 18px;} 

}
@media all and (max-width:768px){

	.wrap-notice {height: 840px !important;}
	.wrap-notice h2 {position: initial;width: 100%;text-align: center;margin-bottom: 50px;}
	.wrap-notice > ul {justify-content:center}
	.wrap-notice > ul > li:last-child{margin-right:0}
	.wrap-notice .list ul{flex-direction:column; }
	.wrap-notice .list ul li {width:100%;margin: 0;margin-bottom: 20px;border-radius: 20px;}
	.wrap-notice .list ul li:last-child {margin-bottom:0}
	.wrap-notice .list .con {}
	.wrap-notice .list .subject{padding: 27px;}
	.wrap-notice .list .subject:before {width: 60px;height: 60px;}
	.wrap-notice .list .subject .cate span {font-size: 17px;padding: 10px 18px 7px;font-weight: normal;margin-bottom: 23px;}
	.wrap-notice .list .subject .subjectText{font-size: 19px;font-weight: normal;height: 47px;margin-bottom: 20px;}
	.wrap-notice .list .subject .content{font-size: 16px;height: 65px;margin-bottom: 20px;}

	.wrap-notice .more {right: auto; left: 50%; transform: translateX(-50%); bottom: 100px; top: auto;}
	
	
}


@media all and (max-width:550px){
	
	.wrap-notice {height: 700px !important;}
	.wrap-notice h2 {margin-bottom: 15px;} 
	.wrap-notice .title a span:before {bottom: -4px; border-width: 5px;}
	.wrap-notice .list {top: 65px;} 
	.wrap-notice .list ul li {width:100%;margin: 0;margin-bottom: 20px;border-radius: 20px;} 
	.wrap-notice .list .subject{padding: 22px;}
	.wrap-notice .list .subject:before {width: 50px;height: 50px;}
	.wrap-notice .list .subject .cate span {font-size: 16px;padding: 8px 15px 5px;font-weight: normal;margin-bottom: 15px;}
	.wrap-notice .list .subject .subjectText{font-size: 17px;height: 43px;margin-bottom: 15px;}
	.wrap-notice .list .subject .content{font-size: 15px;height: 63px;margin-bottom: 15px;}
	.wrap-notice .more {bottom: 60px;}
}
 
