@charset "utf-8";

#atc01 {position:relative;width:100%}

#atc01_wrap {position:relative;width:1200px;height:520px;margin:0 auto;background-color:#f4f4f4}
#atc01_wrap:before {display:block;content:"";position:absolute;left:-30%;width:30%;height:100%;background-color:#f2f2f2}
#atc01_wrap:after {display:block;content:"";position:absolute;top:0;right:0;width:200px;height:100%;background-color:#fff}

/* 내용 */
#atc01_wrap .cont_area {float:left;position:relative;padding:140px 0 0 80px}
#atc01_wrap .cont_area .num {position:absolute;left:0;top:80px;font-size:60px;font-weight:900;color:#d4d4d4;font-family:'Montserrat', sans-serif}
#atc01_wrap .cont_area .num:after {display:block;content:"";position:absolute;right:-15px;bottom:0;width:30px;height:52px;border-left:1px solid #ccc;-ms-transform:rotate(50deg);transform:rotate(50deg);background-color:#f2f2f2}
#atc01_wrap .cont_area h3 {position:relative;z-index:1;font-size:55px;font-weight:200;line-height:1;color:#222;text-transform:uppercase;font-family:'Montserrat', sans-serif}
#atc01_wrap .cont_area h3 span {font-weight:900}
#atc01_wrap .cont_area p {margin:25px 0}
#atc01_wrap .cont_area ul li {position:relative;padding-left:10px;margin-bottom:6px;color:#777}
#atc01_wrap .cont_area ul li:before {display:block;content:"";position:absolute;left:0;top:10px;width:2px;height:2px;background-color:#222}

/* 이미지 */
#atc01_wrap .img_area {float:right;position:relative;width:490px;padding-top:105px;margin-right:30px;z-index:1}
#atc01_wrap .img_area > div {float:left;position:relative;margin:0 0 20px 20px}
#atc01_wrap .img_area > div:after {position:absolute;left:0;bottom:-30px;z-index:-1;content:url(/sh_img/make24/include_01/img/shadow.png)}
#atc01_wrap .img_area > div.first {margin-left:0;animation-delay:.3s}
#atc01_wrap .img_area > div.last {float:right;animation-delay:.6s}
#atc01_wrap .img_area .more {width:235px;height:225px;font-size:13px;font-weight:300;text-align:center;letter-spacing:.5px;background-color:#121e28 ;font-family:'Montserrat', sans-serif}
#atc01_wrap .img_area .more a {overflow:hidden;display:block;position:relative;width:100%;height:100%;color:#d6d6d6;transition:color .5s ease-in-out}
#atc01_wrap .img_area .more a:before {content:"";position:absolute;left:-25%;top:-25%;width:0;height:0;border-radius:100%;background-color:#121e28;transition:all .5s ease-in-out}
#atc01_wrap .img_area .more span {display:inline-block;position:relative;z-index:1;padding-top:65px;transition:padding .5s ease-in-out}
#atc01_wrap .img_area .more span:before {display:block;margin-bottom:7px;content:url(/sh_img/make24/include_01/img/more.png);opacity:0;transition:all .5s ease-in-out}
#atc01_wrap .img_area .more:hover a {color:#fff}
#atc01_wrap .img_area .more:hover a:before {width:150%;height:150%;background-color:#b51e5f}
#atc01_wrap .img_area .more:hover span {padding-top:82px}
#atc01_wrap .img_area .more:hover span:before {transform:rotate(360deg);opacity:.7}
#atc01_wrap .img_area .deco {position:absolute;right:-138px;top:300px;font-weight:800;font-family:'Montserrat', sans-serif}
#atc01_wrap .img_area .deco .txt {display:block;-ms-transform:rotate(-90deg);transform:rotate(-90deg);letter-spacing:1px}
#atc01_wrap .img_area .deco:before {content:"01";position:absolute;top:65px;left:31px;font-size:12px;font-weight:800;letter-spacing:.5px;color:#b51e5f}
#atc01_wrap .img_area .deco:after {content:"";position:absolute;top:100px;left:-150%;width:185px;height:1px;background-color:#b51e5f}

/* fadeIn  */
.animated {-webkit-animation-duration:3s;animation-duration:3s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.fadeIn {-webkit-animation-name:fadeIn;animation-name:fadeIn}
@-webkit-keyframes fadeIn {from {opacity:0}to {opacity:1}}
@keyframes fadeIn {from {opacity:0}to {opacity:1}}

/* 익스 8 */
@media \0screen {
.animated  {filter:alpha(opacity=100}
}