@charset "utf-8";

.in_02{position:relative;width:1200px;padding:28px 0 140px;margin: 0 auto;}
.in02_wrap {position:relative;width:1140px;margin:0 auto}

/* 이미지 */
.in02_wrap .cont_area {position:relative;text-align:left}
.in02_wrap .cont_area:after {display:block;content:"";visibility:hidden;clear:both}
.in02_wrap .cont_area li {float:left;position:relative;width:354px}
.in02_wrap .cont_area li a {display:block;position:relative}
.in02_wrap .cont_area li a:after {display:block;content:"";position:absolute;left:0;top:0;z-index:1;width:100%;height:126%;border:4px solid #562c2a;opacity:0;transition:all .5s }
.in02_wrap .cont_area li:nth-child(2) {margin:0 39px}
.in02_wrap .cont_area li .img {overflow:hidden}
.in02_wrap .cont_area li .img img {transition:all .5s}
.in02_wrap .cont_area li .txt {position:relative;color:#777;transition:padding .5s}
.in02_wrap .cont_area li .txt h4 {margin-top:20px;font-size:19px;color:#222;letter-spacing:-0.1px;line-height:20px;text-transform:uppercase;font-family:'notokr-black', sans-serif;}
.in02_wrap .cont_area li .txt .plus {position:absolute;right:0;top:0;width:27px;height:27px;background:url(/sh_img/make24/include/include_02/img/plus.png) no-repeat;transition:all .5s}
.in02_wrap .cont_area li .txt p {position:absolute;top: 35px;left:0;opacity:0;transition:all .5s;font-size:15px;color:#777;letter-spacing:-0.3px;line-height:24px}
.in02_wrap .cont_area li a:hover:after {left:-20px;top:20px;opacity:1}
.in02_wrap .cont_area li a:hover img {transform:scale(1.05,1.05)}
.in02_wrap .cont_area li a:hover .txt {padding-left:15px}
.in02_wrap .cont_area li a:hover .txt p {top:40px;left:15px;opacity:1}
.in02_wrap .cont_area li a:hover .txt .plus {right:50px}

/* fadeInUp  */
.cont_area li:first-child {animation-delay:.2s}
.cont_area li:nth-child(2) {animation-delay:.4s}
.cont_area li:last-child {animation-delay:.6s}
.animated {-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.fadeInUp {-webkit-animation-name:fadeInUp;animation-name:fadeInUp}
@-webkit-keyframes fadeInUp {from {opacity:0;webkit-transform:translate3d(0, 25%, 0);transform:translate3d(0, 25%, 0)}to {opacity:1;webkit-transform:none;transform:none}}
@keyframes fadeInUp {from {opacity:0;webkit-transform:translate3d(0, 25%, 0);transform:translate3d(0, 25%, 0)}to {opacity:1;webkit-transform:none;transform:none}}

/* 익스 8 */
@media \0screen {
.cont_area li {filter:alpha(opacity=100}
}
