@charset "utf-8";

.wrap-notice {position:relative; margin-top:1rem;}
.wrap-notice > ul {position: relative;height: 35rem;display: flex;gap: 1rem;}
.wrap-notice > ul > li {display: inline-block; vertical-align: middle;}

/* tab */
.wrap-notice > ul > li .list {position: absolute; display: none; width: 100%; left: 0; top: 9rem;}
.wrap-notice > ul > li.active .list {display: block;}
.wrap-notice > ul > li .title{position:relative;}
.wrap-notice > ul > li + li .title{padding-left: 2rem; margin-left: 0.5rem;}
.wrap-notice > ul > li + li .title:before{content:'';width: 0.1rem;height: 1.5rem;display:block;position:absolute;left: 0;top: 1rem;background: var(--krds-gray-60);}
.wrap-notice .title button{font-size:var(--krds-fz-xxxl); color: var(--krds-gray-80);}
.wrap-notice .active .title button{font-weight:700; color:var(--krds-secondary-41); position:relative;}
.wrap-notice .active .title button:before{content:'';width: 100%;height: 0.3rem;display: block;background: var(--krds-secondary-41);position: absolute;bottom: -2.5rem;}

/* list */
.wrap-notice .list{position:absolute;display:none;bo;border-top: 1px solid var(--krds-secondary-41);border-bottom: 1px solid var(--krds-gray-60);}
.wrap-notice .active .list{display:block;width: 100%;left: 0;top: 5.3rem;}
.wrap-notice .list ul li{border-bottom: 0.1rem solid var(--krds-gray-70);padding: 2rem 0;}
.wrap-notice .list ul li:last-child{border:none;}
.wrap-notice .list ul li a{display:block;}
.wrap-notice .list ul li a .con{display: grid;grid-template-columns: 8rem 1fr;align-items: center;height:7.5rem;}
.wrap-notice .list ul li a .con .txt{width:100%; overflow:hidden;}
.wrap-notice .list ul li a .date{text-align: center;color: var(--krds-gray-65);line-height: 1.1;}
.wrap-notice .list ul li a .date strong{display: block;font-size: var(--krds-fz-xxxxl);}
.wrap-notice .list ul li a .date span{display: block;font-size: var(--krds-fz-sm);}
.wrap-notice .list ul li a .con .subjectText{font-size: var(--krds-fz-xl);text-overflow: ellipsis;overflow: hidden;white-space: nowrap;color: var(--krds-gray-80);}
.wrap-notice .list ul li a:hover .con .subjectText{color:var(--krds-secondary-41);}
.wrap-notice .list ul li a .con .content{font-size: var(--krds-fz-md); color:var(--krds-gray-65); text-overflow: ellipsis;overflow: hidden;line-height: 1.4;white-space: nowrap;}
.wrap-notice .list .more{position: absolute;right: 0;top: -6rem;width: 4rem;height: 4rem;text-indent: -9999px;background:url(./../images/arrow-plus.svg) center no-repeat;}

@media only screen and (max-width:1280px){
	
}

@media only screen and (max-width:1024px){
	.wrap-notice .list ul li{padding: 1.5rem 0;}
}