@charset "utf-8";

#atc01{position:relative;height:801px;padding:102px 0;color:#fff;overflow:hidden;background-color:var(--primary)}
#atc01 .tit_area{padding:25px 0 0 35px;font-size:20px;line-height:1.6}
#atc01 .tit_area p{margin-bottom:10px;font-size:59px;font-family:'Shrikhand'}
#atc01 .tit_area p span{padding-left:20px;font-size:16px;font-family:'notokr-regular'}
#atc01 .tit_area a{color:#fff}
#atc01 .tit_area .cont{ white-space:pre-line}

#atc01 .img_l{position:relative;float:left;width:50%}
#atc01 .img1{display:inline-block;position:absolute;left:0;bottom:110px;width:28%;overflow:hidden}
#atc01 .inner{position:relative;max-width:1578px;height:100%;margin:0 auto}
#atc01 .r_cont{position:relative;float:right;width:50%;height:100%}
#atc01 .r_cont .click_img{position:absolute;right:0;bottom:-18px}
#atc01 .r_cont .click_img a{display:block;height:100%}
#atc01 .r_cont .click_img p{position:absolute;left:-138px;bottom:30px;font-size:18px;white-space:pre-line;text-align:center;font-family:'notokr-regular'}
#atc01 .r_cont .click_img p:before{position:absolute;left:33px;bottom:63px;content:url('/sh_img/include/inc01/img/arr.png')}
#atc01 .r_cont .click_img .mask{clip-path:inset(10px 10px 10px 10px);transition:clip-path .4s cubic-bezier(0.4,0,0.2,1)}

#atc01 .l_img{position:relative;float:left;width:50%;font-size:16px;text-align:right;font-family:'mulish'}
#atc01 .l_img img{border:solid 20px var(--primary)}
#atc01 .l_img span{display:inline-block;position:absolute;right:423px;top:-18px;text-transform:uppercase}
#atc01 .l_img p{display:inline-block;position:absolute;right:20px;bottom:-50px;line-height:1.3;text-align:right; white-space:pre-line}
#atc01 .l_img p.arrow{position:absolute;right:-117px;bottom:-20px;font-size:18px;line-height:1.7;text-align:center;font-family:'notokr-regular'}
#atc01 .l_img p.arrow:before{position:absolute;left:-44px;bottom:63px;content:url('/sh_img/include/inc01/img/arr2.png')}


/* 반응형 [s] */
@media (hover:hover) {
#atc01 .r_cont .click_img .mask:hover{clip-path:inset(0 0 0 0)}
}
@media (max-width:1400px){
#atc01 .img1{display:none}
#atc01 .l_img span{right:auto;left:20px}
#atc01 .l_img img{width:100%}
#atc01 .r_cont .click_img{width:300px;bottom:0}
#atc01 .r_cont .click_img img{width:100%}
}
@media (max-width:1024px){
#atc01{height:760px;padding:90px 0}
#atc01 .tit_area{font-size:17px}
#atc01 .tit_area p{font-size:45px}
}
@media (max-width:768px){
#atc01{height:auto;padding:35px 20px 45px}
#atc01 .tit_area{padding:0}
#atc01 .l_img{float:none;width:70%;margin-top:41px;text-align:left}
#atc01 .l_img p{bottom:auto;position:relative;right:auto;text-align:left;margin-top:10px;font-size:14px}
#atc01 .r_cont{float:none;width:100%;padding-:0 0;overflow:hidden}
#atc01 .r_cont .click_img{position:relative;float:right;width:300px;bottom:auto;right:auto;margin:25px 0 50px}
#atc01 .r_cont .click_img .mask{ clip-path:none}
#atc01 .l_img img{border:none}
#atc01 .l_img span{right:auto;left:0;top:-30px}
#atc01 .l_img p.arrow{right:-133px}
}
@media (max-width:480px){
#atc01 .tit_area p span{font-size:14px}
#atc01 .tit_area .cont{ white-space:normal; word-break:keep-all}
#atc01 .r_cont .click_img{    width:62%}
#atc01 .r_cont .click_img p{left:-128px;font-size:16px}
#atc01 .r_cont .click_img p:before{left:25px}
#atc01 .l_img{width:70%}
#atc01 .l_img p{ white-space:normal; word-break:keep-all}
#atc01 .l_img p.arrow{white-space:pre-line;font-size:16px}
#atc01 .l_img p.arrow:before{left:-39px}
}
@media (max-width:380px){
#atc01 .tit_area p{font-size:32px;margin-bottom:0}
#atc01 .r_cont .click_img p{position:initial;margin-top:8px;white-space:normal}
#atc01 .r_cont .click_img p:before{display:none}
#atc01 .r_cont .click_img{width:100%;margin-bottom:12px}
#atc01 .l_img{width:100%;margin-top:0}
#atc01 .l_img span{display:none}
#atc01 .l_img p{display:none}
#atc01 .l_img p.arrow{display:block;position:initial;white-space:normal}
}
/* 반응형 [e] */
