@charset "utf-8";


.wrap-notice {position:relative;word-break:break-all;background:#f1f1f1;padding: 80px 20px 80px;}
.wrap-notice h2 {display:none;}
.wrap-notice > ul {position:relative;max-width: 1500px;margin: 0px auto;display: flex;justify-content: space-between;background: #fff;border-radius: 10px;box-shadow: 0px 0px 10px #3d3d3d38;padding: 30px 23px 40px;width: 100%;}
.wrap-notice > ul > li {position: relative;min-width: 24%;max-width: 48%;width: 100%;padding: 0 15px;}
.wrap-notice .title {word-break: keep-all;border-bottom: 2px solid #797878;padding: 0 5px 5px;position: relative;}
.wrap-notice .title a {display:block;font-size: 23px;font-family: 'Noto Medium';cursor: default;}
.wrap-notice .list {padding: 10px 8px 13px;border-bottom: 1px solid #cfcfcf;padding-b]: 1;}
.wrap-notice .list ul {display: flex;flex-direction: column;}
.wrap-notice .list ul li {margin: 5px 0;position: relative;}
.wrap-notice .list ul li.nodata {font-size:18px;text-align:center;width:100%}

.wrap-notice a.subject {position: relative;display: flex;justify-content: space-between;}
.wrap-notice a.subject .subjectText {font-size: 16px;color:#333;line-height:1.5;text-overflow:ellipsis;word-wrap:break-word; text-wrap: nowrap;overflow: hidden;padding-left: 13px;position: relative;padding-right: 15px;}
.wrap-notice a.subject .subjectText:before {content:'';position:absolute;top: 12px;left:0;width: 3px;height: 3px;background: #4d4d4d;border-radius: 50px;}
.wrap-notice a.subject .date{line-height:1;font-size: 13px;color: #959595;min-width: 50px;position: relative;top: 6px;text-align: right;}
.wrap-notice a.more{display:block;position:absolute;top: 14px;right: 8px;border:1px solid transparent;text-indent:-9999px;width: 22px;height: 22px;background:url(../images/plus_3_b.png) center no-repeat;background-size: contain;cursor: pointer;}


@media only screen and (min-width:1024px){
	
	.wrap-notice .title a:hover {color:#222;border-color:#222;}
	.wrap-notice a.subject:hover .subjectText {text-decoration:underline;}
	.wrap-notice a.more:hover {border-color:#000}
	
} 
@media only screen and (max-width:1024px){
	
	.wrap-notice > ul {flex-wrap: wrap;padding: 20px 40px;}
	.wrap-notice > ul > li {padding: 0;margin: 20px 0;} 
	
}
@media only screen and (max-width:768px){

	.wrap-notice {padding: 20px 10px 15px;} 
	.wrap-notice > ul {padding: 10px 25px;}	
	.wrap-notice > ul > li {min-width:100%;margin: 10px 0;}
	.wrap-notice .list ul li {margin: 3px 0;} 
	.wrap-notice .title {padding: 0px 5px 3px;}
	.wrap-notice .title a {font-size: 19px;}

	.wrap-notice a.more {width: 18px; height: 18px; top: 10px; right: 5px;}
	
}
@media only screen and (max-width:768px){

	.wrap-notice > ul {padding: 10px 20px;}	
	
}