@charset "utf-8";
/*전체감싸기*/
.wrap-notice{position:relative;word-break:break-all;padding:30px;height:100% !important;background:#FFF;box-sizing:border-box}
.wrap-notice:before{content:"";display:block;width:50%;height:100%;background:#f6f6f6;position:absolute;top:0;right:0;border-left:1px solid #cbcbcb}
/*게시판*/
.wrap-notice > ul{position:relative}
.wrap-notice > ul > li{}
/*타이틀*/
.wrap-notice .title{position:absolute;left:0;top:0;filter:alpha(opacity=50);opacity:0.5}
.wrap-notice .title a{cursor:pointer;font-size:22px;font-weight:500;line-height:1;color:#333}
.wrap-notice .title:after{content:"";display:block;width:100%;height:3px;background:#444;margin-top:10px;transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);transform:scale(0)}
.wrap-notice > ul > li:nth-child(1) .title{}
.wrap-notice > ul > li:nth-child(2) .title{left:100px}
/*목록*/
.wrap-notice .list{padding-top:50px}
.wrap-notice .list ul{}
.wrap-notice .list ul li{color:#333;width:45%;margin-left:55%}
/*noData*/
.wrap-notice .list ul li.nodata{font-size:18px;text-align:center;padding:60px 0}
/*썸네일*/
.wrap-notice .thumb{display:none}
.wrap-notice .thumb img{}
/*제목*/
.wrap-notice .list ul li .con{line-height:1.5;padding:2px 0}
.wrap-notice .list ul li .con a{display:inline-block;width:calc(100% - 100px);font-size:15px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wrap-notice .list ul li .con a:hover{text-decoration:underline}
/*날짜*/
.wrap-notice .list ul li .con span{color:rgba( 0,0,0,0.5 );float:right;font-size:13px}
/*내용*/
.wrap-notice .content{display:none;height:65px;overflow:hidden;text-overflow:ellipsis;word-wrap:break-word}
/*더보기*/
.wrap-notice a.more{display:block;position:absolute;top:0;right:0;text-indent:-9999px;width:25px;height:25px;background:url(/sites/guide/images/plus_5_g.png) center no-repeat}
/*활성화*/
.wrap-notice > ul > li .list,
.wrap-notice a.more{display:none}
.wrap-notice > ul > li.active .nodata,
.wrap-notice > ul > li.active .list,
.wrap-notice > ul > li.active a.more{display:block}
.wrap-notice > ul > li.active .title{filter:alpha(opacity=100);opacity:1}

.wrap-notice > ul > li:hover .title:after,
.wrap-notice > ul > li.active .title:after{transform:scale(1)}
/*첫글꾸미기*/
.wrap-notice .list ul li:first-child{margin-left:0;float:left}
.wrap-notice .list ul li:first-child .con{padding-top:30px}
.wrap-notice .list ul li:first-child .con a{font-size:28px;font-weight:500;width:100%}
.wrap-notice .list ul li:first-child .con span{float:none;padding:10px 0}
.wrap-notice .list ul li:first-child .con span,
.wrap-notice .list ul li:first-child .content{display:block;}
@media only screen and (max-width:1024px){
	.wrap-notice{padding:30px 20px}
	.wrap-notice:before{display:none}
	.wrap-notice .list ul li{width:100%;margin-left:0}
	.wrap-notice .list ul li:first-child{margin-top:0;float:none}
	.wrap-notice .list ul li:first-child .con a{font-size:15px;color:#333;height:auto;line-height:1.5;font-weight:normal}
	.wrap-notice .list ul li:first-child .con span,
	.wrap-notice .list ul li:first-child .content{display:none}
	.wrap-notice .list ul li:nth-child(n+6){display:none}
}
@media only screen and (max-width:768px){
	.wrap-notice .title a{font-size:20px}
	.wrap-notice > ul > li:nth-child(2) .title{left:90px}
	.wrap-notice .list ul li:first-child .con a{font-size:20px}
}