@charset "utf-8";

#atc05{overflow:hidden;position:relative;height:100vh}
#atc05:before{content:"";position:absolute;top:0;left:0;z-index:-1;width:50%;height:100%;margin-left:-525px;background-color:#f0f1f2}
#atc05 .inner{position:relative;top:55%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:1400px;margin:0 auto}

/* 컨텐츠 */
#atc05 .tit{margin-bottom:40px;color:#aaa}
#atc05 .tit span{vertical-align:sub;padding-right:30px;font-size:40px;font-weight:700;color:#222;font-family:'Play'}
#atc05 .latest_wrap{display:none}
#atc05 .latest{overflow:hidden;height:100%}
#atc05 .latest li{position:relative;float:left;width:420px;height:290px;border:1px solid #e1e1e1;background-color:#fff;transition:all .3s}
#atc05 .latest li:hover{border-color:#222e59}
#atc05 .latest li+li{margin-left:70px}
#atc05 .latest li a{display:block;padding:50px 60px;color:#777}
#atc05 .latest li p{margin-bottom:15px;font-size:18px;color:#222;line-height:1.6;font-family:'LotteMartDreamBold'}
#atc05 .latest li span{position:absolute;left:60px;bottom:45px;font-size:14px;font-weight:700;color:#222e59;font-family:'Play'}
#atc05 .latest li em{display:block;position:absolute;left:0;top:0;width:37px;height:37px;font-size:13px;font-weight:700;text-align:center;line-height:37px;font-style:normal;color:#fff;background-color:#222e59;f:'Play'}

/* 탭 */
#atc05 .tabs_wrap{position:absolute;right:0;top:0}
#atc05 .tabs_wrap .active{position:absolute;top:0;left:0;width:110px;height:48px;border:2px solid #222e59;border-radius:30px;-webkit-transition:all .3s;transition:all .3s}
#atc05 .tabs li{cursor:pointer;float:left;position:relative;width:110px;height:48px;font-size:17px;line-height:48px;text-align:center;color:#aaa;-webkit-transition:all .3s;transition:all .3s;font-family:'LotteMartDreamMedium'}
#atc05 .tabs li.on{color:#222e59}
#atc05 .tabs li:hover{color:#666}

/* 더보기 */
#atc05 .more{display:block;position:relative;width:140px;margin:8% auto 0;padding:10px;;border-bottom:2px solid #222e59;font-size:15px;color:#222e59;-webkit-transition:all .3s;transition:all .3s;font-family:'LotteMartDreamMedium'} 
#atc05 .more svg{position:absolute;top:13px;right:10px;width:22px;height:22px;-webkit-transition:all .3s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:all .3s cubic-bezier(0.25, 0.46, 0.45, 0.94)}
#atc05 .more svg.on{opacity:0;top:23px;right:20px}
#atc05 .more:hover{border-color:#1d5ec6;color:#1d5ec6}
#atc05 .more:hover svg.on{opacity:1;top:13px;right:10px}
#atc05 .more:hover svg.off{opacity:0;top:3px;right:0}