@charset "utf-8";

#atc02{overflow:hidden;position:relative;width:100%;margin-bottom:25px}

/* 배경 */
#atc02 .bg{position:absolute;background-color:#222}
#atc02 .bg img{opacity:1;-webkit-transition:all 1.2s;transition:all 1.2s}
#atc02 .bg.active img{opacity:.6}

/* 타이틀 */
#atc02 .tit_area{opacity:0;position:relative;padding:160px 0 110px;font-size:18px; text-align:center;color:rgba(255,255,255,.8);-webkit-transition:all 1s .4s;transition:all 1s .4s}
#atc02 .tit_area.active{opacity:1}
#atc02 .tit_area .tit{margin-bottom:35px;font-size:42px;letter-spacing:-1px;color:#fff;line-height:60px; font-family:'GmarketSansLight'}
#atc02 .tit_area .tit p{font-family:'GmarketSansBold'}
#atc02 .tit_area .tit p span{position:relative}
#atc02 .tit_area .tit p span:before{display:block;content:"";position:absolute;left:0;bottom:-3px;width:100%;height:4px;background-color:#fec000}

/* 바로가기 */
#atc02 .link_area{position:relative;width:1260px;margin:0 auto;padding:60px;border-radius:8px;background-color:#fff}
#atc02 .link_area ul{overflow:hidden} 
#atc02 .link_area ul li{opacity:0;float:left;width:360px;text-align:center;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}
#atc02 .link_area ul li:nth-child(1){-webkit-animation-delay:.2s;animation-delay:.2s}
#atc02 .link_area ul li:nth-child(2){-webkit-animation-delay:.4s;animation-delay:.4s;margin:0 30px}
#atc02 .link_area ul li:nth-child(3){-webkit-animation-delay:.6s;animation-delay:.6s}
#atc02 .link_area ul li a{color:#a3a4a6}
#atc02 .link_area ul li .img{overflow:hidden;height:200px;border-radius:8px}
#atc02 .link_area ul li .img img{-webkit-transition:all .3s;transition:all .3s}
#atc02 .link_area ul li:hover .img img{-webkit-transform:scale(1.05);transform:scale(1.05)}
#atc02 .link_area ul li .tit{padding:25px 0 8px;font-size:19px;color:#242c34;font-family:'GmarketSansMedium'}
#atc02 .link_area ul li .view_btn{display:inline-block;position:relative;margin-top:20px;font-size:13px;line-height:2.2;color:#242c34;-webkit-transition:all .2s;transition:all .2s;font-family:'GmarketSansBold'}
#atc02 .link_area ul li .view_btn:before,#atc02 .link_area ul li .view_btn:after{content:'';display:block;position:absolute;bottom:0;width:100%;height:2px;-webkit-transition:width .2s;transition:width .2s;-webkit-transition-timing-function:cubic-bezier(0.165, 0.840, 0.440, 1.000);transition-timing-function:cubic-bezier(0.165, 0.840, 0.440, 1.000)}
#atc02 .link_area ul li .view_btn:before{width:100%;right:0;background:#222;-webkit-transition-delay:.2s;transition-delay:.2s}
#atc02 .link_area ul li .view_btn:after{width:0;left:0;background:#0469d1;-webkit-transition-delay:0s;transition-delay:0s}
#atc02 .link_area ul li:hover .view_btn{color:#0469d1}
#atc02 .link_area ul li:hover .view_btn:before{width:0;transition-delay:0s}
#atc02 .link_area ul li:hover .view_btn:after{width:100%;-webkit-transition-delay:.2s;transition-delay:.2s}  

/* fade  */
.animated{-webkit-animation-duration:.6s;animation-duration:.6s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp;-webkit-animation-delay:.2s;animation-delay:.2s}
@-webkit-keyframes fadeInUp{from{opacity:0}to{opacity:1;-webkit-transform:translateY(0)}}
@keyframes fadeInUp{from{opacity:0}to{opacity:1;transform:translateY(0)}}