@charset "UTF-8";
/*/////////////////////////////

// scroll effect by 슬기

//////////////////////////////*/


/* default */
.scr-el, .scr-el-one { opacity:0; transition-duration:var(--scr-duration); --scr-duration:1.7s; }
.scr-el.active, .scr-el-one.active { opacity:1; }


/* effect */
.scr-txt { letter-spacing:5px; }
.scr-txt.active { letter-spacing:normal; }


.scr-fadeinup { transform:translateY(50px); }
.scr-fadeinup.active, .scrs.active .scr-fadeinup { transform:translateY(0); }

.scr-fadeindown { transform:translateY(-50px); }
.scr-fadeindown.active, .scrs.active .scr-fadeindown { transform:translateY(0); }

.scr-fadeinleft { transform:translateX(50px); }
.scr-fadeinleft.active, .scrs.active .scr-fadeinleft { transform:translateX(0); }

.scr-fadeinright { transform:translateX(-50px); }
.scr-fadeinright.active, .scrs.active .scr-fadeinright { transform:translateX(0); }



.scr-widercenter,
.scr-widerleft,
.scr-widerright { position:relative; }

.scr-widercenter:before,
.scr-widercenter:after { content:""; position:absolute; top:0; bottom:0; background:#fff; transition-duration:1.8s; z-index:9; }
.scr-widercenter:before { left:0; right:50%; }
.scr-widercenter:after { right:0; left:50%; }
.scr-widercenter.active:before { right:100%; }
.scr-widercenter.active:after { left:100%; }

.scr-widerright:before,
.scr-widerright:after { content:""; position:absolute; left:0; top:0; right:0; bottom:0; transition-duration:1.8s; }
.scr-widerright:before { background:#fff; z-index:9; }
.scr-widerright:after { z-index:10; }
.scr-widerright.active:before,
.scrs.active .scr-widerright:before,
.scr-widerright.active:after,
.scrs.active .scr-widerright:after { left:100%; }

.scr-widerleft:before,
.scr-widerleft:after { content:""; position:absolute; left:0; top:0; right:0; bottom:0; transition-duration:1.8s; }
.scr-widerleft:before { background:#fff; z-index:9; }
.scr-widerleft:after { z-index:10; }
.scr-widerleft.active:before,
.scrs.active .scr-widerleft:before,
.scr-widerleft.active:after,
.scrs.active .scr-widerleft:after { right:100%; }


.scrs .scr-delay { opacity:0; transition-duration:var(--scr-duration); --scr-duration:1s; }
.scrs.active .scr-delay { opacity:1; }
