@charset "utf-8";

#atc01 .group-cont{display:flex;justify-content:space-between;gap:22px}

#atc01 .type-area{max-width:428px;width:100%}
#atc01 .type-area h3{font-size:20px;color:#777;font-family:var(--B-font);word-break:keep-all}
#atc01 .type-area li{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #e1e1e1;cursor:pointer}
#atc01 .type-area li:last-child{margin-bottom:0}
#atc01 .type-area li div p{display:none;word-break:keep-all}
#atc01 .type-area li svg{display:none;color:#111}
#atc01 .type-area li.on h3{color:var(--primary)}
#atc01 .type-area li.on div{height:auto}
#atc01 .type-area li.on svg{display:block}

#atc01 .tab-page{max-width:648px;width:100%}
#atc01 .tab-page .tab-cont{display:none;height:383px;border-radius:5px}
#atc01 .tab-page .tab-cont1{background:url('./img/cont01-bg.jpg')}
#atc01 .tab-page .tab-cont2{background:url('./img/cont02-bg.jpg')}
#atc01 .tab-page .tab-cont3{background:url('./img/cont03-bg.jpg')}
#atc01 .tab-page .tab-cont4{background:url('./img/cont04-bg.jpg')}
#atc01 .tab-page .tab-cont5{background:url('./img/cont05-bg.jpg')}

#atc01 .tab-page ul{margin-top:10px;font-size:13px;font-weight:500;text-align:right;color:#aaa;word-break:keep-all}
#atc01 .tab-page a:hover .more span{background:var(--primary)}
#atc01 .tab-page a{display:flex;flex-direction:column;width:100%;height:100%;padding:60px 40px 30px}

#atc01 .tab-page .cont-tit h3{font-size:23px;color:#111;font-family:var(--B-font);word-break:keep-all}
#atc01 .tab-page .cont-tit p{font-weight:500;color:#777;word-break:keep-all}

#atc01 .tab-page .info{margin-top:25px}
#atc01 .tab-page .info p{margin-bottom:5px;font-size:16px;color:#111;font-family:var(--B-font);word-break:keep-all}
#atc01 .tab-page .info dl{display:flex;gap:15px;font-size:14px;font-family:var(--M-font)}
#atc01 .tab-page .info dl dt{flex-shrink:0;width:70px;word-break:keep-all}
#atc01 .tab-page .info dl dt:before{display:inline-block;content:'';width:3px;height:3px;margin-right:10px;vertical-align:3px;background:#111}
#atc01 .tab-page .info dl dd{color:#777;white-space:pre-line;word-break:keep-all}

#atc01 .tab-page .more{display:flex;align-items:center;justify-content:space-between;margin-top:35px;padding-top:15px;border-top:1px solid rgba(0,0,0,.1)}
#atc01 .tab-page .more p{font-weight:700;color:#777}
#atc01 .tab-page .more span{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50px;color:#fff;background:rgba(0,0,0,.2);transition:all .3s}
#atc01 .tab-page .more span svg{width:18px}

/* 반응형 [s] */
@media screen and (max-width:1600px) {
  [data-aos="fade-left"], [data-aos="fade-right"] {transform:translate3d(0, 100px, 0) !important}
  [data-aos="fade-left"].aos-animate, [data-aos="fade-right"].aos-animate {transform:translate3d(0, 0, 0) !important}
}

@media (max-width:1600px){
#atc01 .group-cont{flex-direction:column;gap:20px}
#atc01 .tab-page{max-width:none}
#atc01 .tab-page .tab-cont{height:auto;background-repeat:no-repeat;background-size:contain;background-position:right center}
#atc01 .tab-page .tab-cont a{padding:30px}
#atc01 .tab-page .tab-cont1{background-color:#eeeeef}
#atc01 .tab-page .tab-cont2{background-color:#d4d6e2}
#atc01 .tab-page .tab-cont3{background-color:#c7c0b6}
#atc01 .tab-page .tab-cont4{background-color:#e2edff}
#atc01 .tab-page .tab-cont5{background-color:#e4e9ed}
#atc01 .type-area{max-width:none}
}
@media (max-width:1300px){
#atc01 .group-tit{flex-direction:column;align-items:center !important;text-align:center}
#atc01 .type-area h3{font-size:18px}
#atc01 .type-area li{margin-bottom:16px;padding-bottom:16px}
#atc01 .type-area li div p{font-size:14px}
#atc01 .tab-page .cont-tit h3{font-size:20px}
#atc01 .common-btn{margin-top:20px}
}
@media (max-width:1024px){
#atc01 .tab-page .info{margin-top:18px}
#atc01 .tab-page .more{margin-top:25px}
#atc01 .common-btn{margin-top:12px}
}
@media (max-width:768px){
#atc01 .type-area h3{font-size:16px}
#atc01 .type-area li{margin-bottom:12px;padding-bottom:12px}
#atc01 .tab-page .cont-tit h3{font-size:18px}
}
@media (max-width:600px){
#atc01 .tab-page .tab-cont{background-image:none}
}
@media (max-width:480px){
#atc01 .type-area h3{font-size:15px}
#atc01 .tab-page ul{text-align:left;font-size:12px}
#atc01 .tab-page .cont-tit h3{font-size:16px}
#atc01 .tab-page .cont-tit p{font-size:13px}
#atc01 .tab-page .tab-cont a{padding:20px 24px}
#atc01 .tab-page .info{margin-top:10px}
#atc01 .tab-page .info p{margin-bottom:2px;font-size:14px}
#atc01 .tab-page .info dl{gap:8px;font-size:13px}
#atc01 .tab-page .more{margin-top:15px;padding-top:10px}
#atc01 .tab-page .more p{font-size:13px}
}
/* 반응형 [e] */