@charset "utf-8";

#atc04{position:relative;width:100%;padding-top:80px}
#atc04 .inner{position:relative;width:1200px;margin:0 auto}
#atc04 .tit_area{margin-bottom:40px;font-size:16px;color:#777;text-align:center}
#atc04 .tit_area h3{font-size:26px;font-weight:700;text-transform:uppercase;color:#222;font-family:'Montserrat'}
#atc04 .tit_area h3:after{content:"";display:block;width:30px;height:2px;margin:15px auto 20px;background-color:#1db8f5}
#atc04 .icon_area{text-align:center}
#atc04 .icon_area li{display:inline-block;margin:0 20px;font-family:'notokr-medium'}
#atc04 .icon_area li a{display:block}
#atc04 .icon_area li .icon{width:142px;height:142px;margin:0 auto 15px;border-radius:50%;background-color:#f2f2f2;background-repeat:no-repeat;background-position:top center;transition:all .4s}
#atc04 .icon_area li:nth-child(1) .icon{background-image:url(/sh_img/make24/include_04/img/icon01.png)}
#atc04 .icon_area li:nth-child(2) .icon{background-image:url(/sh_img/make24/include_04/img/icon02.png)}
#atc04 .icon_area li:nth-child(3) .icon{background-image:url(/sh_img/make24/include_04/img/icon03.png)}
#atc04 .icon_area li:nth-child(4) .icon{background-image:url(/sh_img/make24/include_04/img/icon04.png)}
#atc04 .icon_area li:hover .icon{background-position:bottom center}
#atc04 .bnr_area{overflow:hidden;width:100%;margin-top:90px}
#atc04 .bnr_area li{overflow:hidden; float:left;position:relative;width:50%;height:302px;vertical-align:middle;text-align:center;background-position:center;background-repeat:no-repeat;background-size:100% 100%}
#atc04 .bnr_area li a{display:block;height:100%;padding-top:100px;color:#fff}
#atc04 .bnr_area li a h4{margin-bottom:15px;font-size:23px;font-family:notokr-bold}
#atc04 .bnr_area li:before{content:"";position:absolute;left:0;top:0;z-index:-1;width:100%;height:100%;-webkit-transition:all 3s linear;transition:all 3s linear}
#atc04 .bnr_area li:nth-child(1):before{background:url(/sh_img/make24/include_04/img/bg01.jpg) 101%;center no-repeat}
#atc04 .bnr_area li:nth-child(2):before{background:url(/sh_img/make24/include_04/img/bg02.jpg) 101%;center no-repeat}
#atc04 .bnr_area li:hover:before{transform:scale(1.1,1.1)}

/* fadeInRight */
#atc04 .icon_area li:nth-child(1){-webkit-animation-delay:.2s;animation-delay:.2s}
#atc04 .icon_area li:nth-child(2){-webkit-animation-delay:.4s;animation-delay:.4s}
#atc04 .icon_area li:nth-child(3){-webkit-animation-delay:.6s;animation-delay:.6s}
#atc04 .icon_area li:nth-child(4){-webkit-animation-delay:.8s;animation-delay:.8s}
.animated{-webkit-animation-duration:1s;animation-duration:1s;-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, 30%, 0);transform:translate3d(0, 30%, 0)}to{opacity:1;webkit-transform:none;transform:none}}
@keyframes fadeInUp{from{opacity:0;webkit-transform:translate3d(0, 30%, 0);transform:translate3d(0, 30%, 0)}to{opacity:1;webkit-transform:none;transform:none}}

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