@charset "utf-8";

/* wrap-notice */
.wrap-notice {position: relative; background:#f8f8f8; padding:68px 0 58px 0; height:100%;}
.wrap-notice::before {content:'notice'; text-transform: uppercase; color:#EBEBEB; font-family: 'SUITE Heavy'; font-size: 100px; line-height: 75px; max-width:860px; width:100%; text-align:right; position: absolute; top:0; left:0;}
.wrap-notice .frame {max-width:860px; width:100%; margin-right:auto;}
.wrap-notice .frame-inner {margin-left:50px; position: relative;}
.wrap-notice .tab-list {display: flex; gap:0 30px; margin-bottom: 28px;}
.wrap-notice .tab-btn {font-family: 'SUITE Bold'; font-size: 26px; line-height: 1; color:#91ADCF; position: relative; padding-bottom: 7px; transition:color .35s;}
.wrap-notice .tab-btn:hover {color:#0E51A1;}
.wrap-notice .tab-btn::before {content:''; width:0%; height:2px; background:#0E51A1; transition:width .35s; position: absolute; bottom:0; left:0;}
.wrap-notice .tab-btn.on {color:#0E51A1; font-family: 'SUITE ExtraBold';}
.wrap-notice .tab-btn.on::before {width:100%;}

.wrap-notice li .box{display: flex; justify-content: space-between; align-items: center;}
.wrap-notice li .cn {display: none; font-size: 18px; line-height: 35px; color:#666; font-family: 'SUITE Light';}
.wrap-notice li .sj {font-family: 'SUITE Regular'; font-size: 18px; line-height: 40px; color:#666; padding-left: 17px; position: relative;display: -webkit-inline-box; -webkit-box-orient:vertical; -webkit-line-clamp: 1; overflow:hidden; width:100%; }
.wrap-notice li .sj::before {content:''; width:6px; height:6px; background:#d2d2d2; border-radius:50%; position: absolute; left:0; top:18px;}
.wrap-notice li .sj span {background: linear-gradient(to bottom, transparent 95%, #666 0) left center no-repeat; background-size:0; transition: background-size .5s;}
.wrap-notice li .date {font-family: 'SUITE Regular'; font-size: 18px; color:#999; flex-shrink: 0;}
.wrap-notice a {display: block;}
.wrap-notice a:hover .sj span {background-size:100% auto;}

/* first-child */
.wrap-notice .first a {padding-bottom: 20px; border-bottom:1px solid #ddd; margin-bottom: 15px;}
.wrap-notice .first .sj {font-family: 'SUITE SemiBold'; font-size: 22px; line-height: 35px; color:#333; margin-bottom: 2px; padding-left: 0;}
.wrap-notice .first .sj::before {display: none;}
.wrap-notice .first .sj.new {position: relative;}
.wrap-notice .first .sj.new::after {content:'N'; width: 25px; height: 25px; background:#FFD300; color:#fff; font-family: 'SUITE Heavy'; font-size: 14px; line-height: 25px; text-align: center; border-radius: 50%; display: inline-block; position: relative; top:-3px; margin-left: 10px;}
.wrap-notice .first .date {display: none;}
.wrap-notice .first .box {display: block;}
.wrap-notice .first .cn {display: -webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp: 1; overflow:hidden; line-height: 1;}
.wrap-notice .first .cn span{background: linear-gradient(to bottom, transparent 96%, #666 0) left center no-repeat; background-size:0; transition: background-size .5s;}
.wrap-notice .first a:hover .cn {background-size:100% auto;}
.wrap-notice .more {width:18px; height:18px; text-indent: -99999px; background:url('../../images/cal/more.png') no-repeat center; transition: transform .35s; position: absolute; right:0; top:9px;}
.wrap-notice .more:hover {transform:rotate(180deg);}
.wrap-notice .row > li {display: none;}
.wrap-notice .row > li.active {display: block;}
.wrap-notice .nodata {text-align: center; font-family: 'HG Regular';}
.wrap-notice .more {width:18px; height:18px; text-indent: -99999px; background:url('../images/more.png') no-repeat center; transition: transform .35s; position: absolute; right:0; top:9px;}
.wrap-notice .more:hover {transform:rotate(180deg);}
@media screen and (max-width:1800px) {
    /* .wrap-notice {padding-right:20px;} */
    .wrap-notice .frame-inner {margin-right: 20px;}
}
@media screen and (max-width:1200px) {
    .wrap-notice {padding: 55px 0 35px 0; display: flex; }
    .wrap-notice::before  {font-size: 70px; line-height: 55px; left:unset; width:unset; right:40px;}
    .wrap-notice .frame {width:100%;}
    .wrap-notice .frame-inner {margin-right: 40px; margin-left: 20px;}
    .wrap-notice .tab-list {margin-bottom: 23px;}
    .wrap-notice .list li:last-child {display: none;}
    .wrap-notice .first a {padding-bottom:14px; margin-bottom: 8px;}
    .wrap-notice .first .cn {-webkit-line-clamp: 2; line-height: 28px;}
    .wrap-notice .first .sj {margin-bottom: 5px;}
    .wrap-notice .nodata {display: block !important;}
}
@media screen and (max-width:768px) {
    .wrap-notice {}
    .wrap-notice .frame-inner {margin:0 20px;}
    .wrap-notice::before {font-size: 40px; line-height: 30px; right:20px;}
    .wrap-notice .title h1 {font-size: 28px;}
    .wrap-notice .nodata {min-height:262px; display: flex !important; align-items: center; justify-content: center; }
}