@charset "utf-8";

#atc03{position:relative;z-index:12;background-color:#fff}
#atc03 .inner{overflow:hidden;position:relative;width:1280px;height:795px;margin:0 auto}
#atc03 .box{float:left;position:relative;width:50%;height:100%;color:#111}
#atc03 .box.left{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}
#atc03 .box.right{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px);border-right:1px solid rgba(255,255,255,.1);color:#fff}

/* 사이드 텍스트 */
#atc03 .fix_txt{position:absolute;right:-25px;top:50%;z-index:11;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);margin-left:-20px;font-size:12px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:1px;font-family:'Philosopher'}
#atc03 .fix_txt.absol{position:absolute;bottom:77px}
#atc03 .fix_txt.hide{opacity:0!important}
#atc03 .fix_txt span{position:relative;padding-left:60px}
#atc03 .fix_txt span:before{content:"";position:absolute;left:8px;top:7px;width:40px;height:1px;background-color:#fff}

/* 링크 텍스트 */
#atc03 .link_txt{display:inline-block;margin-top:75px;text-decoration:underline!important;color:#111}
#atc03 .link_txt span{display:block;position:relative;width:9px;height:9px;margin-top:27px}
#atc03 .link_txt span:before{content:"";position:absolute;left:0;top:4px;width:9px;height:1px;background-color:#111;-webkit-transition:all .2s;transition:all .2s}
#atc03 .link_txt span:after{content:"";position:absolute;left:4px;top:0;width:1px;height:9px;background-color:#111;-webkit-transition:all .2s;transition:all .2s}
#atc03 .link_txt:hover span:before{left:1px;top:2px;width:7px;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}
#atc03 .link_txt:hover span:after{left:4px;top:3px;height:7px;-webkit-transform:rotate(-135deg);-ms-transform:rotate(-135deg);transform:rotate(-135deg)}

/* 이미지 */
#atc03 .txt_area{position:absolute;top:240px;left:175px;font-weight:600}
#atc03 .txt_area p{margin-bottom:10px;font-size:54px;font-weight:700}
#atc03 .box .img{overflow:hidden; position:absolute; left:50%; bottom:0;width:290px;height:345px;margin-left:-145px}
#atc03 .box .img a{display:block;height:100%}
#atc03 .box .img img{-webkit-transition:all .8s cubic-bezier(.35,.97,.22,1);transition:all .8s cubic-bezier(.35,.97,.22,1)}
#atc03 .box .img:hover img{transform:scale(1.15)}

/* 배경 이미지 */
#atc03 .box_bg{overflow:hidden;opacity:0;position:absolute;left:0;top:0;width:50%;height:100%}
#atc03 .box_bg img{opacity:0;filter:gray;-webkit-filter:grayscale(1);filter:grayscale(1);-webkit-transition:all 1s cubic-bezier(.35,.97,.22,1);transition:all 1s cubic-bezier(.35,.97,.22,1)}
#atc03 .box_bg.left{-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}
#atc03 .box_bg.right{-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px);left:50%;background-color:#4c524b}
#atc03 .box_bg.on img{opacity:.2;-webkit-transform:translateY(-50px);-ms-transform:translateY(-50px);transform:translateY(-50px)}