@charset "utf-8";
/*전체감싸기*/
.wrap-notice{position:relative;word-break:break-all;padding:0;box-sizing:border-box}
/*게시판*/
.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:#222}
.wrap-notice > ul > li:nth-child(1) .title{}
.wrap-notice > ul > li:nth-child(2) .title{left:100px}
/*목록*/
.wrap-notice .list{padding:50px 0}
.wrap-notice .list ul{overflow:hidden}
.wrap-notice .list ul li{color:#222;width:45%;margin-left:55%}
/*noData*/
.wrap-notice .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 .list ul li:first-child{margin-left:0;float:left}
.wrap-notice .list ul li:first-child .con{}
.wrap-notice .list ul li:first-child .con a{font-size:28px;color:#000;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:768px){
	.wrap-notice{padding:30px 0}
	.wrap-notice .title a{font-size:20px}
	.wrap-notice > ul > li:nth-child(2) .title{left:90px}
	.wrap-notice .list ul li{width:100%;margin-left:0}
	.wrap-notice .list ul li:first-child{float:none;margin-bottom:30px}
	.wrap-notice .list ul li:first-child .con a{font-size:20px}
}