* { margin: 0; padding: 0; list-style: none; font-family:맑은고딕;}
#slider-wrap { position: relative; overflow: hidden;}
#slider-wrap ul#slider { height: 100%; position: absolute; top: 0; left: 0;}
#slider-wrap ul#slider li { float: left; position: relative; }
#slider-wrap ul#slider li>div { position: absolute; bottom: 20px; left:40%; }
#slider-wrap ul#slider li>div h3 { font-size: 36px; color:white; text-transform: uppercase;}
#slider-wrap ul#slider li>div span { font-size: 21px; color:white; }
#slider-wrap ul#slider li img { display: block; height: 100%; background-size: cover;}
/*btns*/
.btns { position: absolute; width: 50px; height: 60px; top: 50%; margin-top: -25px; line-height: 57px; text-align: center; cursor: pointer; background: rgba(0, 0, 0, 0.1); z-index: 100; -webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select: none; -webkit-transition: all 0.1s ease; -o-transition: all 0.1s ease; transition: all 0.1s ease;}
.btns:hover { background: rgba(0, 0, 0, 0.3);}
#next { right: -50px; border-radius: 7px 0px 0px 7px; color: #eee;}
#previous { left: -50px; border-radius: 0px 7px 7px 7px; color: #eee;}
#slider-wrap.active #next { right: 0px;}
#slider-wrap.active #previous { left: 0px;}
/*bar*/
#slider-pagination-wrap { min-width: 20px; margin-top:270px; margin-left: auto; margin-right: auto; height: 15px; position: relative; text-align: center;}
#slider-pagination-wrap ul { height: 100%;}
#slider-pagination-wrap ul li { margin: 0 4px; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #fff; opacity: 0.5; position: relative; top: 0;}
#slider-pagination-wrap ul li.active { width: 12px; height: 12px; top: 3px; opacity: 1; -webkit-box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 0px; box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 0px;}
/*ANIMATION*/
#slider-wrap ul, #slider-pagination-wrap ul li {
    -webkit-transition: all 1.5s cubic-bezier(1,0,0,1);
    -moz-transition: all 1.5s cubic-bezier(1,0,0,1);
    -o-transition: all 1.5s cubic-bezier(1,0,0,1);
    -ms-transition: all 1.5s cubic-bezier(1,0,0,1);
    transition: all 1.5s cubic-bezier(1,0,0,1); 
}

.img-box { display: inline-block; width:100%; height: 200px; overflow: hidden; }
.main-img { background-size: 100%; background-position: left top; background-color: black; overflow: hidden; }
@-webkit-keyframes zooma { 0% { background-size: 100% auto; } 100% { background-size: 120% auto; }}
@-moz-keyframes zooma { 0% { background-size: 100% auto; } 100% { background-size: 120% auto; }}
@-o-keyframes zooma { 0% { background-size: 100% auto; } 100% { background-size: 120% auto; }}
@keyframes zooma { 0% { background-size: 100% auto; } 100% { background-size: 120% auto; }}
.zoom-io {
    -webkit-animation: zooma 10s linear infinite alternate; /* Safari 4+ */
    -moz-animation: zooma 10s linear infinite alternate; /* Fx 5+ */
    -o-animation: zooma 10s linear infinite alternate; /* Opera 12+ */
    animation: zooma 10s linear infinite alternate; /* IE 10+, Fx 29+ */
}