@charset "UTF-8";

.wrap-notice > ul > li::after{content:""; display: table; clear: both;}
.wrap-notice {position:relative; overflow:hidden;}
.wrap-notice .title {position:relative; float: left;}
.wrap-notice .title a{position: relative; width: 100%; height: 100%; font-size: 20px; color: #222; font-family: 'Noto Medium';}
.wrap-notice .title a:hover{text-decoration: underline;}
.wrap-notice .more {position:absolute; left :0; top:33px; text-indent:-99999px; width: 29px; height: 29px; border:1px solid #c5c5c5; opacity: 0.6;}
.wrap-notice .more span{width: 13px; height: 13px; position: absolute; left: 50%; top: 50%; margin: -7px 0 0 -6px; background: url(../images/board_morebtn.png) no-repeat center 50%; transition: all 0.5s ease;}
.wrap-notice .more:hover{opacity: 1;}
.wrap-notice .more:hover span{transform: rotate(180deg);}
.wrap-notice .list{float: right; width: calc(100% - 100px); margin-top: 5px;}
.wrap-notice .list li{margin-bottom: 10px; position: relative; font-family: 'Noto Regular';}
.wrap-notice .list li a{position: relative; display: block; width: 100%; font-size: 15px; line-height: 17px; color: #363636; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-left: 9px;}
.wrap-notice .list li a::before{position: absolute; left: 0; top: 6px; display: inline-block; width: 4px; height: 4px; content:""; background-color: #bbb;}
.wrap-notice .list li .date{display: none;}
.wrap-notice .list li:first-child a span::after{width: 15px; height: 15px; background: url(../images/board_new.gif) no-repeat; background-size: cover; content:""; display: inline-block; margin-left: 5px; position: relative; top: 1px;}
.wrap-notice .list li a:hover span{text-decoration: underline;}

@media all and (max-width: 1023px) {
	.wrap-notice{padding: 0 20px;}
.wrap-notice .list li .date{display: block; position: absolute; right: 0; top: 0; font-size: 15px; line-height: 17px; color: #7d7d7d; letter-spacing: -1px;}
.wrap-notice .more{left: 20px;}
.wrap-notice .list li a{width: 70%;}
}