@charset "utf-8";

#atc02{position:relative}
#atc02:after{display:block;visibility:hidden;clear:both;content:""}
#atc02 .inner{overflow:hidden}

#atc02 .tit_area{position:relative;float:left;width:25%;height:100%;padding-top:200px;font-size:20px;line-height:1.6;text-align:center}
#atc02 .tit_area p{margin-bottom:10px;font-size:59px;color:var(--primary);font-family:'Shrikhand'}
#atc02 .tit_area .cont{ white-space:pre-line}
#atc02 .menu_pager{position:relative;width:56px;height:34px;margin:40px auto 0;font-size:15px;font-weight:600;color:#222;font-family:'mulish'}
#atc02 .menu_pager .pager{position:absolute;left:0;top:0;opacity:0;transition:all .2s}
#atc02 .menu_pager .pager.on{position:absolute;left:0;top:0;opacity:1}
#atc02 .menu_pager:after{display:inline-block;padding-left:18px;content:'/ 03'}
#atc02 .menu_nav{position:relative;width:162px;height:35px;margin:-40px auto 0;overflow:hidden}
#atc02 .menu_nav>div{display:inline-block;position:absolute;top:0;cursor:pointer}
#atc02 .menu_nav .swiperNext{right:0}
#atc02 .menu_nav .swiperPrev{left:0}

#atc02 .menu_slider{float:left;width:75%}
#atc02 .menu_slider ul li{padding:120px 35px}
#atc02 .menu_slider ul li img{width:100%}
#atc02 .menu_slider ul li .txt{margin-top:10px;padding:0 20px;font-family:'mulish'}
#atc02 .menu_slider ul li .txt .menu{position:relative;padding-right:50px;font-size:21px;line-height:1.3;color:#222;overflow:hidden;text-transform:uppercase;font-family:'notokr-medium'}
#atc02 .menu_slider ul li .txt .menu .prc{position:absolute;right:0;top:0;font-size:19px}
#atc02 .menu_slider ul li .txt p{font-size:15px;line-height:1.2;font-weight:600;color:var(--primary)}
#atc02 .menu_slider ul li .txt p span{display:block;margin-top:5px;font-weight:normal;color:#888;font-family:'notokr-regular'}
#atc02 .menu_slider ul li .mask{clip-path:inset(10px 10px 10px 10px);transition:clip-path .4s cubic-bezier(0.4,0,0.2,1)}

#atc02 .h_line{position:absolute;top:0;width:1px;height:0;opacity:0;background-color:#222}
#atc02 .w_line{position:absolute;left:0;width:0;height:1px;opacity:0;background-color:#222}
#atc02 .line1{left:25%}
#atc02 .line2{position:absolute;top:0;left:50%;width:1px;height:0;opacity:0;background-color:#222}
#atc02 .line3{left:75%}
#atc02 .line4{top:0}
#atc02 .line5{bottom:0}

/* 반응형 [s] */
@media (hover:hover) {
#atc02 .menu_slider ul li .mask:hover{clip-path:inset(0 0 0 0)}
}
@media (max-width:1400px){
#atc02 .menu_slider ul li{padding:120px 15px}
}
@media (max-width:1200px){
#atc02 .tit_area{width:calc(100% / 3)}
#atc02 .menu_slider{width:calc(100% - (100% / 3))}
#atc02 .line1{left:33.33%}
#atc02 .line2{left:66.66%}
#atc02 .line3{display:none}
}
@media (max-width:1024px){
#atc02 .tit_area{font-size:17px}
#atc02 .tit_area p{font-size:45px}
#atc02 .menu_slider ul li .mask{clip-path:none}
}
@media (max-width:768px){
#atc02{padding:35px 0 55px}
#atc02 .tit_area{width:100%;padding:0}
#atc02 .tit_area .cont{display:block;white-space:normal;width:65%;margin:0 auto;word-break:keep-all}
#atc02 .h_line, #atc02 .line2{display:none}
#atc02 .menu_slider{width:100%}
#atc02 .menu_slider ul li{padding:24px 15px 0}
#atc02 .menu_pager{margin-top:20px}
}
@media (max-width:480px){
#atc02 .tit_area .cont{width:80%}
#atc02 .menu_slider ul li{padding:24px 5px 0}
}
@media (max-width:380px){
#atc02 .tit_area p{font-size:32px;margin-bottom:0}
}
/* 반응형 [e] */