@charset "utf-8";
/* 
#atc01{display:flex;overflow:hidden;padding:0 5%;justify-content: space-between;}
#atc01 .left{width:calc(50% - 218px);padding-top:72px}
#atc01 .left .tit{margin-bottom:25px;font-size:60px;line-height:60px;letter-spacing:0;color:#222;font-family:'Outfit'}
#atc01 .left .tit span{color:#7e0000}
#atc01 .left .txt{font-size:16px;line-height:25px;letter-spacing:-.5px;word-break:keep-all;font-family:'Pretendard-Regular'}
#atc01 .right{display:flex;position:relative;z-index:1;width:calc(50% + 218px)}
#atc01 .right:before{content:'';position:absolute;left:0;top:0;z-index:-1;width:calc(100% + 100px);height:100%;background-color:#0c0c0c}
#atc01 .right li{width:calc(100% / 4);text-align:center}
#atc01 .right li a{display:block;height:100%;padding:102px 0 90px;transition:all .3s;border-right:1px solid rgba(255,255,255,.15);color:#fff}
#atc01 .right li a .icon{margin-bottom:20px}
#atc01 .right li a .icon img{opacity:.6;transition:all .3s}
#atc01 .right li a dl dt{margin-bottom:25px;font-size:16px;line-height:16px;letter-spacing:-.5px;font-family:'Pretendard-Medium'}
#atc01 .right li a dl dd{transition:all .3s;opacity:.4;font-size:16px;letter-spacing:0;font-weight:500;font-family:'Outfit'} */

#atc01{display:flex;overflow:hidden;padding:0 5%;justify-content: space-between;background-color:#f7f7f7}
#atc01 .left{width:calc(50% - 218px);padding-top:72px}
#atc01 .left .tit{margin-bottom:25px;font-size:60px;line-height:60px;letter-spacing:0;color:#222;font-family:'Outfit'}
#atc01 .left .tit span{color:var(--primary)}
#atc01 .left .txt{font-size:16px;line-height:25px;letter-spacing:-.5px;font-family:'Pretendard-Regular'}
#atc01 .right{display:flex;position:relative;z-index:1;width:calc(50% + 218px)}
#atc01 .right:before{content:'';position:absolute;left:0;top:0;z-index:-1;width:calc(100% + 100px);height:100%;background-color:none}
#atc01 .right li{width:calc(100% / 4);text-align:center}
#atc01 .right li:first-child{background-color:#fde3f5;}
#atc01 .right li:nth-child(2){background-color:#FFF7DF;}
#atc01 .right li:nth-child(3){background-color:#ddf9fb;}
#atc01 .right li:last-child{background-color:#EAF1FF;}
#atc01 .right li a{display:block;height:100%;padding:102px 0 90px;transition:all .3s;border-right:1px solid rgba(255,255,255,.15);color:#222}
#atc01 .right li a:hover{background-color:rgba(255,255,255,.05)}
#atc01 .right li a .icon{margin-bottom:20px}
#atc01 .right li a .icon img{opacity:.2;;filter: brightness(0.1);transition:all .3s}
#atc01 .right li a:hover .icon img{opacity:1}
#atc01 .right li a dl dt{margin-bottom:25px;font-size:16px;line-height:16px;letter-spacing:-.5px;font-family:'Pretendard-Medium'}
#atc01 .right li a dl dd{transition:all .3s;opacity:1;font-size:14px;letter-spacing:0;font-weight:500;font-family:'Outfit'}
#atc01 .right li a:hover dl dd{opacity:1}


/* 모바일 호버 X */
@media (hover: hover) {
#atc01 .right li a:hover{background-color:rgba(255,255,255,.05)}
#atc01 .right li a:hover dl dd{opacity:1;color:#222}
#atc01 .right li a:hover .icon img{opacity:1}
}

/* 반응형 [s] */
@media (max-width:1920px){
#atc01 .left{width: calc(50% - 100px);}
}
@media (max-width:1230px){
#atc01{padding-right:0}
#atc01 .left .txt{padding-right:20px;font-size:15px;line-height:25px}
#atc01 .right{width:calc(50% + 324px)}
#atc01 .right li:last-child a{border-right:none}
}

@media (max-width:1024px){
#atc01{display:block;padding:0}
#atc01 .left{width:100%;padding:60px 0 30px;text-align:center}
#atc01 .left .tit{margin-bottom:10px;font-size:40px;line-height:40px}
#atc01 .left .txt{padding:0 15px}
#atc01 .right{width:100%}
#atc01 .right li a{padding:55px 0}
#atc01 .right li a dl dt{margin-bottom:15px;font-size:15px;line-height:15px}
#atc01 .right li a dl dd{font-size:15px}
}

@media (max-width:768px){
#atc01{padding-bottom:15px}
#atc01 .left{padding-top:45px}
#atc01 .right{display:block;overflow:hidden;padding:0 15px}
#atc01 .right:before{display:none}
#atc01 .right li{float:left;width:50%;background:#0c0c0c}
#atc01 .right li:nth-child(1) a,#atc01 .right li:nth-child(2) a{border-bottom:1px solid rgba(255,255,255,.15)}
#atc01 .right li:nth-child(2n) a{border-right:none}
}

@media (max-width:480px){
#atc01 .left .tit{margin-bottom:7px;font-size:35px}
}

@media (max-width:380px){
#atc01 .right li{min-height:170px}
#atc01 .right li a{padding:30px}
#atc01 .right li:nth-child(3) a{border-bottom:1px solid rgba(255,255,255,.15)}
}
/* 반응형 [e] */