@charset "utf-8";

.awards .awardsWrap {background: url(/images/company/awardsBg.jpg) no-repeat center bottom;}
.awards .awardsWrap .awardsImg {width: 100%; display: flex; justify-content: center; gap: 40px;}
.awards .awardsWrap .awardsImg img {height: auto; box-shadow: 30px 30px 30px 0 rgba(0, 0, 0, 0.15);}

.awards .awardsWrap .kciaWrap {display:flex; gap: 40px;}

.awards .awardsWrap h3 {font-size: var(--fs40); color: #fff; text-align: center; margin-top: 40px;}
.awards .awardsWrap p {font-size: var(--fs24); font-weight: 300; color: #fff; text-align: center; padding-bottom: 150px;}
.awards .awardsWrap p span {border-bottom:1px solid #fff;}



.awards .news {padding-top: 85px;}
.awards .news li {display: flex;}
.awards .news li a {display: flex; padding: 50px 0; border-top: 1px solid #E5E5E5;}
.awards .news li:first-child a {border: 0; padding-top: 0;}
.awards .news li:last-child a {padding-bottom: 0;}
.awards .news li a .txtWrap {display: flex; align-items: flex-start; width: calc(100% - 70px); gap: 30px;}
.awards .news li a .txtWrap .img {width: 300px; height: 165px; overflow: hidden; display: flex; justify-content: center; align-items: center; background: #F5F5F5;}
.awards .news li a .txtWrap .img img {width: auto; height: auto; transition: .5s;}
.awards .news li a:hover .txtWrap .img img {transform: scale(1.1);}
.awards .news li a .txtWrap .txt {width: calc(100% - 300px);}
.awards .news li a .txtWrap .txt h3 {margin: 20px 0; font-size: var(--fs30); color: #000; line-height: 1.2;}
.awards .news li a .txtWrap .txt span {color: #666; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; }
.awards .news li a .more {width: 70px; height: 70px; background: url(/images/company/arrowBtn.svg) no-repeat center; border: 1px solid #E5E5E5; transition: 1s;}
.awards .news li a:hover .more {background: var(--base2) url(/images/company/arrowBtn-w.svg) no-repeat center; border-radius: 100px; border:1px solid var(--base2)}
.awards .news li p { padding:12px 15px; color: #fff; font-size: var(--fs16); background: #666; display: inline-block; line-height: 1;}
.awards .news li:nth-child(odd) p {background: var(--base2);}


/* ************************ 태블릿 (~1249) ************************ */
@media screen and (max-width:1249px) {

    .awards .awardsWrap {position: relative; width: 100vw; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw;}
    .awards .awardsWrap p {padding-bottom: 100px;}
    .awards .awardsWrap .awardsImg {padding: 0 70px;}
    .awards .news {padding-top: 75px;}
    .awards .news li a {padding: 40px 0;}


}




/* ************************ 태블릿 (~991) ************************ */
@media screen and (max-width:991px) {

    .awards .news {padding-top: 45px;}
    .awards .awardsWrap {background: url(/images/company/awardsBg.jpg) no-repeat center bottom -140px;}
    .awards .awardsWrap p {padding-bottom: 70px;}
    .awards .awardsWrap .awardsImg {padding: 0 30px;}
    .awards .news li a .txtWrap {flex-direction: column;}
    .awards .news li a .txtWrap .txt {width: 100%;}
    

}



/* ************************ 모바일 (~767) ************************ */
@media screen and (max-width:767px) { 


    .awards .awardsWrap .awardsImg {gap: 5px; flex-direction: column;}
    .awards .awardsWrap {background: url(/images/company/awardsBg.jpg) no-repeat center bottom -300px;}
    .awards .news li a {display: block; position: relative;}
    .awards .news li a .txtWrap {width: 100%;}
    .awards .news li a .txtWrap .txt h3 {margin: 15px 0;}
    .awards .news li a .more {position: absolute; right: 0; top: 40px;}
    .awards .news li:first-child a .more {top: 0;}
	
	.awards .awardsWrap .kciaWrap {gap:20px;}
	.awards .awardsWrap .kciaCon h3, .awards .awardsWrap .kciaCon p, .awards .awardsWrap .kciaCon span {color:#000; border-color:#000;}
	.awards .awardsWrap .kciaCon p {padding-bottom:30px;}


}


/* ************************ 모바일 (~500) ************************ */
@media screen and (max-width:500px) {

    .awards .news li a .more {position: static; width: 100%; height: 60px; margin-top: 20px;}

}
