@charset "utf-8";
/*전체감싸기*/
.wrap-notice{position:relative;word-break:break-all;padding:90px 60px;background-color:rgba( 255,255,255,0.9 );box-sizing:border-box}
/*게시판*/
.wrap-notice > ul{position:relative}
.wrap-notice > ul > li{}
/*타이틀*/
.wrap-notice .title{position:absolute;left:0;filter:alpha(opacity=50);opacity:0.5}
.wrap-notice .title a{cursor:pointer;font-size:50px;font-weight:500;line-height:1;color:#222}
.wrap-notice > ul > li:nth-child(1) .title{top:0}
.wrap-notice > ul > li:nth-child(2) .title{top:90px}
/*목록*/
.wrap-notice .list{padding-left:300px}
.wrap-notice .list ul{font-size:0}
.wrap-notice .list ul li{color:#666;position:relative;display:inline-block;box-sizing:border-box;width:calc(33.33% - 60px);margin:0 30px;vertical-align:top;font-size:16px}
/*noData*/
.wrap-notice .list ul li.nodata{font-size:18px;text-align:center;padding:60px 0;width:100%}
/*썸네일*/
.wrap-notice .thumb{display:none}
.wrap-notice .thumb img{}
/*제목*/
.wrap-notice .con{line-height:1.5}
.wrap-notice .con a{display:block;font-size:20px;color:#666;font-weight:500;height:60px;overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;margin-bottom:30px}
.wrap-notice .con a:hover{text-decoration:underline}
/*날짜*/
.wrap-notice .con span{font-size:14px;position:absolute;right:0;bottom:0}
/*내용*/
.wrap-notice .content{line-height:1.5;font-size:16px;height:100px;overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;margin-bottom:50px}
/*더보기*/
.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}
@media only screen and (max-width:1024px){
	.wrap-notice{padding:30px}
	.wrap-notice .title a{font-size:25px}
	.wrap-notice > ul > li:nth-child(2) .title{top:0;left:110px}
	.wrap-notice .list{padding:60px 0 0 0}
	.wrap-notice .list ul li{width:calc(33.33% - 20px);margin:0 10px}
}
@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{padding-top:40px}
	.wrap-notice .list ul li{width:100%;margin:0;padding:20px 0 30px 0;border-bottom:1px solid #DDD;}
	.wrap-notice .list ul li:last-child{border:0}
	.wrap-notice .con a{font-size:16px;height:auto;margin-bottom:5px}
	.wrap-notice .con span{bottom:10px}
	.wrap-notice .content{font-size:15px;height:45px;margin-bottom:10px}
}