@charset "utf-8";

#atc01{padding:130px 0 140px;text-align:center}
#atc01 .inner{max-width:var(--mainsize);margin:0 auto}
#atc01 .inner span{color:var(--primary)}
#atc01 .inner .top p{font-size:90px;font-weight:700;color:rgb(0, 0, 0, 0.1);text-transform:uppercase}
#atc01 .inner .top .ko_tit{position:relative;margin-top:-70px;padding-bottom:90px;font-size:43px;font-weight:700;color:var(--black);line-height:1.3}
#atc01 .inner .top .ko_tit:after{position:absolute;content:'';left:50%;transform:translateX(-50%);top:160px;width:28px;height:1px;background:#e1e1e1}
#atc01 .inner .top .sub_tit{font-size:35px;font-weight:700;color:var(--black)}
#atc01 .inner ul{display:grid;grid-template-columns:repeat(3, 1fr);gap:30px;padding: 100px 0;}
#atc01 .inner ul li .img_box{position: relative;height: 270px;border-radius:20px}
#atc01 .inner ul li:nth-child(1) .img_box{background:url(./img/img01.jpg) no-repeat center/cover}
#atc01 .inner ul li:nth-child(2) .img_box{background:url(./img/img02.jpg) no-repeat center/cover}
#atc01 .inner ul li:nth-child(3) .img_box{background:url(./img/img03.jpg) no-repeat center/cover}
#atc01 .inner ul li .img_box .num{display:flex;align-items:center;justify-content:center;width:50px;height:50px;position:absolute;top:-26px;left:45px;font-weight:700;color:#fff;background:var(--primary);border-radius:50px}
#atc01 .inner ul li p{padding-top:40px;font-size:20px;font-weight:600;color:var(--black);line-height:1.5}
#atc01 .inner .bot .tit{padding-bottom: 33px;font-size:35px;font-weight:700;line-height:1.3;color:var(--black)}
#atc01 .inner .bot .small_txt{display:flex;align-items:center;gap:16px;width:max-content;position:relative;margin:0 auto;padding:19px 65px;font-weight:500;background:#f5f5f5;border-radius:50px}
#atc01 .inner .bot .small_txt:after{position:absolute;content:'';top:-10px;left:50%;width:25px;height:25px;border-radius:5px;background:#f5f5f5;transform:translateX(-50%)rotate(45deg)}

/* 반응형 [s] */
@media (hover:hover){
#atc01 .controls .arr:hover{opacity:1}
#atc01 ul li a:hover img{transform:scale(1.04)}
}
@media (max-width:1380px){
#atc01 {padding:130px 30px 140px}
}
@media (max-width:1024px){
#atc01 {padding:100px 20px 110px}
#atc01 .inner ul{padding:80px 0;gap:15px}
#atc01 .inner .top p{font-size:80px}
#atc01 .inner .top .ko_tit{font-size:32px}
#atc01 .inner .top .sub_tit{font-size:32px}
#atc01 .inner .top .ko_tit:after{top:130px}
#atc01 .inner ul li p{padding-top:20px;font-size:18px}
#atc01 .inner ul li .img_box .num{font-size:14px}
#atc01 .inner .bot .tit{font-size:30px}
#atc01 .inner .bot .tit br{display:none}
#atc01 .inner .bot .small_txt{width:100%;padding:20px;justify-content:center}
}
@media (max-width:768px){
#atc01{padding:80px 15px 100px}
#atc01 .inner .top p{font-size:67px}
#atc01 .inner .top .ko_tit{margin-top:-55px;font-size:27px}
#atc01 .inner .top .sub_tit{font-size:28px}
#atc01 .inner ul{padding:60px 0;gap:10px}
#atc01 .inner ul li p{font-size:15px}
#atc01 .inner ul li .img_box{height:200px}
#atc01 .inner ul li .img_box .num{left:50%;transform:translateX(-50%);font-size:13px}
#atc01 .inner .bot .tit{font-size:26px}
#atc01 .inner .bot .small_txt{flex-direction:column;font-size:14px;border-radius:200px;line-height:1.5}
}
@media (max-width:600px){
#atc01 .inner .top p{font-size:50px}
#atc01 .inner .top .ko_tit{margin-top:-38px}
#atc01 .inner ul{grid-template-columns:repeat(2, 1fr)}
#atc01 .inner ul li p{font-size:16px}
#atc01 .inner ul li:nth-child(1){margin-bottom:30px}
}
@media (max-width:480px){
#atc01{padding:50px 15px 60px}
#atc01 .inner .top .ko_tit{padding-bottom:50px;font-size:22px}
#atc01 .inner .top .sub_tit{font-size:23px}
#atc01 .inner .top .ko_tit:after{top:100px}
#atc01 .inner ul li p{font-size:15px}
#atc01 .inner .bot .small_txt{border-radius:0}
}
@media (max-width:450px){
#atc01 .inner .top p{font-size:40px}
#atc01 .inner .top .ko_tit{font-size:20px}
#atc01 .inner .top .sub_tit{font-size:21px}
#atc01 .inner .bot .tit{font-size:20px}
}
@media (max-width:400px){
#atc01 .inner .bot .tit{font-size:22px}
}
@media (max-width:380px){
#atc01 .inner .top .ko_tit{padding-bottom:40px}
#atc01 .inner ul{grid-template-columns:repeat(1, 1fr)}
#atc01 .inner ul li:nth-child(3){margin-top:30px}
}
@media (max-width:350px){
#atc01 .inner .top p{font-size:34px}
#atc01 .inner .top .ko_tit{margin-top:-26px}
#atc01 .inner .top .ko_tit:after{top:100px}
}
/* 반응형 [e] */