@charset "utf-8";

#atc02 .pl{white-space:pre-line}
#atc02 .txt_area{position:relative;z-index:1}
#atc02 .txt_area ul li{display:flex}
#atc02 .txt_area ul li .info{font-size:17px;flex-shrink:0}
#atc02 .txt_area ul li:nth-child(1) .info{padding:70px 0 0 140px}
#atc02 .txt_area ul li:nth-child(1) img{max-width:1155px;width:60%}
#atc02 .txt_area ul li:nth-child(2){margin-top:90px;flex-direction:row-reverse}
#atc02 .txt_area ul li:nth-child(2) img{max-width:1250px;width:65%}
#atc02 .txt_area ul li:nth-child(2) .info{padding:80px 175px 0 0}
#atc02 .txt_area ul li .info p{font-size:27px;color:#111;font-family:'notokr-bold'}
#atc02 .txt_area ul li .info div{margin:5px 0 60px}
#atc02 .txt_area a{position:relative;display:inline-block;font-size:13px;font-weight:700;line-height:2;font-family:'Poppins'}
#atc02 .txt_area a:before,#atc02 .txt_area a:after{content:'';display:block;position:absolute;bottom:0;width:100%;height:2px;-webkit-transition:width .3s;transition:width .3s;-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 .txt_area a:before{width:100%;right:0;background:#222;-webkit-transition-delay:.2s;transition-delay:.2s}
#atc02 .txt_area a:after{width:0;left:0;background:#222;-webkit-transition-delay:0s;transition-delay:0s}
#atc02 .txt_area a:hover{color:#222}
#atc02 .txt_area a:hover:before{width:0;transition-delay:0s}
#atc02 .txt_area a:hover:after{width:100%;-webkit-transition-delay:.2s;transition-delay:.2s}

@media (max-width:1520px){
#atc02 .txt_area ul li:nth-child(1) .info{padding:70px}
#atc02 .txt_area ul li:nth-child(2) .info{padding:50px}
}
@media(max-width:1300px){
#atc02 .txt_area ul li .info{width:35%}
}
@media(max-width:1024px){
#atc02 .txt_area ul li:nth-child(1) img,#atc02 .txt_area ul li:nth-child(2) img{width:50%}
#atc02 .txt_area ul li .info{width:50%}
#atc02 .txt_area ul li:nth-child(1) .info,#atc02 .txt_area ul li:nth-child(2) .info{padding:5%}
}
@media(max-width:768px){
#atc02 .txt_area ul li:nth-child(1) .info, #atc02 .txt_area ul li:nth-child(2) .info{padding:30px 4%}
#atc02 .txt_area ul li:nth-child(2){margin-top:50px}
#atc02 .txt_area ul li .info{font-size:14px}
#atc02 .txt_area ul li .info p{font-size:20px}
#atc02 .txt_area ul li .info div{margin-bottom:20px}
}
@media(max-width:480px){
#atc02 .txt_area ul li{flex-wrap:wrap}
#atc02 .txt_area ul li:nth-child(1) img, #atc02 .txt_area ul li:nth-child(2) img{width:100%}
#atc02 .txt_area ul li .info{width:100%;text-align:center}
}