@charset "UTF-8";

/* Notice */
.wrap-notice {margin: 0 0 50px 0;}
.wrap-notice .container {position: relative;}
.wrap-notice .title {position: absolute; left: 0; top: 0; width: 100%; font-family: 'Mont SemiBold'; font-size: 20px; color: #1b60c6;}
.wrap-notice .title::after {content: ''; position: absolute; left: 0; top: 13px; width: 100%; height: 1px; background: #c4c6c9;}
.wrap-notice .title span {position: relative; z-index: 10; padding: 0 28px 0 0; background: #f5f7fb; font-family: 'Montserrat';font-weight: 600;}
.wrap-notice .box-notice {position: relative; z-index: 10; min-height: 245px; text-align: right;}
.wrap-notice .box-notice ul {font-size: 0;}
.wrap-notice .list-notice {display: inline-block; background: #f5f7fb;}
.wrap-notice .list-notice .btn-tab {display: inline-block; margin: 0 0 0 40px; font-family: 'Noto Medium'; font-size: 20px; color: #6e6e6f;}
.wrap-notice .list-notice.on .btn-tab {position: relative; color: #1b60c6;}
.wrap-notice .list-notice.on .btn-tab::after {content: ''; position: absolute; left: -21px; top: 10px; width: 9px; height: 9px; background: #1b60c6; border-radius: 100%;}
.wrap-notice .list-notice:last-child .btn-tab {margin-right: 90px;}
.wrap-notice .list-notice .con-list {position: absolute; left: 0; top: 85px; display: none; width: 100%; text-align: left;}
.wrap-notice .list-notice.on .con-list {display: block;}
.wrap-notice .con-list li {float: left; width: 25%; padding: 0 70px 0 0;}
.wrap-notice .con-list a {display: block;}
.wrap-notice .con-list .subject {overflow: hidden; display: block; height: 65px; padding: 0 0 13px 0; font-family: 'Noto Bold'; font-size: 20px; line-height: 1.3; color: #000;}
.wrap-notice .con-list .subject span {background: linear-gradient(to bottom, transparent 60%, rgba(27,96,198,.3) 0) left center no-repeat; background-size: 0; transition: .4s;}
.wrap-notice .con-list a:hover .subject span {background-size: 100% auto;}
.wrap-notice .con-list .desc {padding: 0 0 20px 0; font-family: 'Noto Light'; font-size: 18px; color: #666;}
.wrap-notice .con-list .date {font-family: 'Mont Light'; font-size: 14px; color: #666;}
.wrap-notice .more {position: absolute; right: 0; top: -10px; width: 50px; height: 50px; background: url('../images/btn_notice_more.png') no-repeat center center; text-align: left; text-indent: -99999px;}

@media all and (max-width: 1400px) {
    .wrap-notice .title {left: 20px; width: auto;}
}

@media all and (max-width: 1300px) {
    .wrap-notice .con-list li {width: 33.333%; padding: 0 40px 0 0;}
    .wrap-notice .con-list li:nth-child(n+4) {display: none;}
}

@media all and (max-width: 1024px) {
    .wrap-notice .con-list .subject {overflow: hidden; height: auto; white-space: nowrap; text-overflow: ellipsis;}
}

@media all and (max-width: 920px) {
    .wrap-notice .con-list li {width: 50%;}
    .wrap-notice .con-list li:nth-child(n+3) {display: none;}
}

@media all and (max-width: 730px) {
    .wrap-notice .title {top: -50px;}
    .wrap-notice .box-notice {min-height: 200px; margin-top: 40px; text-align: left; }
    .wrap-notice .list-notice .btn-tab {margin: 0 0 0 20px;}
    .wrap-notice .list-notice .con-list {top: 55px;}
}

@media all and (max-width: 680px) {
    .wrap-notice {margin: 0 0 30px 0;}
    .wrap-notice .con-list li {width: 100%;}
    .wrap-notice .con-list li:nth-child(n+2) {display: none;}
}

@media all and (max-width: 440px) {
    .wrap-notice .list-notice .btn-tab {margin: 0 8px 0 12px; font-size: 15px;}
    .wrap-notice .list-notice.on .btn-tab::after {left: -12px; top: 6px;}
}