@charset "utf-8";

/* reset */
html,body,div,p,img,span,a,em,strong,pre,h1,h2,h3,h4,h4,h5,h6,ul,ol,li,dl,dt,dd,table,tbody,thead,tfoot,tr,th,td,form,fieldset,legend,caption,input,textarea,button,select,object,video,iframe{margin:0;padding:0}
html{overflow-y:scroll}
header,article,aside,details,figcaption,figure,footer,hgroup,menu,nav,section{display:block;margin:0;padding:0;vertical-align:baseline}
body{position:relative;width:100%;font-family:'맑은 고딕','Malgun gothic','돋움','dotum',sans-serif;font-size:15px;color:#1f2f5f;line-height:1;background:#fff}
input,textarea,button,select{font-size:inherit;font-family:'맑은 고딕','Malgun gothic','돋움','dotum',sans-serif;font-family:inherit}
img,fieldset,button{border:0}
table{border-collapse:collapse;border-spacing:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a,a:link{text-decoration:none;color:#000}
a,a:link, a:active{background-color:transparent}
a,img{vertical-align:top}
hr{display:none}
legend, .blind{overflow:hidden;visibility:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0}
.ir{text-indent:-9999px;overflow:hidden}
input, button, textarea{outline:0}
button{border:0;cursor:pointer}

/* layout */
#wrap{position:relative;width:100%;min-width:1280px;min-height:0;overflow:hidden;margin:0 auto}
#wrap.load{min-height:800px}
#wrap .section{position:relative;width:100%}
.section .container{position:relative;width:1280px;height:100%;margin:0 auto}
#wrap .bg_section{position:absolute;top:0;left:0;width:99.99%;height:100%;padding-left:0.01%}

/* common */
.section .object_wrap, .section .object_wrap div, .section .object_wrap span{position:absolute}
.section .object_wrap{left:0;width:100%}

/* header */
#header button span, #header a span{display:block;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event01_C827C06B15AEB463/spr_header.png") no-repeat;text-indent:-99999px;overflow:hidden}
#header{position:absolute;top:0;left:0;width:100%;z-index:100}
#header .util{position:absolute;top:20px;right:20px}
#header .util:after, #header .util ul:after{content:"";display:block;clear:both}
#header .util button, #header .util ul, #header .util li{float:left}
#header .util button, #header .util a{position:relative;display:block;height:46px}
#header .util span{position:absolute;top:-5px;left:-5px;height:57px;pointer-events:none}
#header .util li{margin-left:10px}
#header .util .btn_start{width:147px;background:none;overflow:visible}
#header .util .btn_start span{width:157px}
#header .util .btn_start:hover span{background-position:0 -70px}
#header .util li a{width:47px}
#header .util li span{width:57px}
#header .util .btn_h span{background-position:-186px 0}
#header .util .btn_h a:hover span{background-position: -186px -70px}
#header .util .btn_c span{background-position:-271px 0}
#header .util .btn_c a:hover span{background-position: -271px -70px}

/* lnb */
#lnb h1 a, #lnb li a .img span, #lnb .btn_toggle span{display:block;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event01_C827C06B15AEB463/spr_lnb.png") no-repeat;text-indent:-99999px;overflow:hidden}
#lnb{position:absolute;top:0;left:0;bottom:0;width:180px;background:#1d2025;background-color:rgba(29,32,37,0.7);z-index:100;transition:left 400ms ease}
#lnb.hide{left:-140px}
#wrap.fixed #lnb{position:fixed}
#lnb .lnb_wrap{position:relative;height:100%}
#lnb h1{position:absolute;top:34px;left:48px}
#lnb h1 a{width:84px;height:99px}
#lnb ul{padding-top:170px}
#lnb li a{position:relative;display:block;height:190px}
#lnb li .bg, #lnb li .hover{height:90px}
#lnb li .bg{margin-bottom:29px;transition:background-position 400ms ease}
#lnb li .hover{position:absolute;top:0;left:0;width:100%;filter:alpha(opacity=0);opacity:0}
#lnb .lnb1 .hover{background-position:-180px -192px}
#lnb .lnb2 .hover{background-position:-180px -360px}
#lnb li.on .hover, #lnb a:hover .hover{filter:alpha(opacity=100);opacity:1}
#lnb.hide li.on .hover, #lnb.hide a:hover .hover{filter:alpha(opacity=0);opacity:0}
#lnb .shape{position:absolute}
#lnb .shape span{position:absolute;background:#4E4947}
#lnb .shape .rhombus{width:5px;height:5px;transform:rotate(45deg);-ms-transform:rotate(45deg)}
#lnb .shape .line{top:0;left:0;width:100%;height:100%}
#lnb li .shape{top:104px;left:50%;width:72px;height:1px;margin-left:-36px}
#lnb li.on .shape, #lnb li a:hover .shape span{background:#F0E6D2}
#lnb li .shape .rhombus{top:-2px}
#lnb li .shape ._r1{left:0}
#lnb li .shape ._r2{right:0}
#lnb.hide li .shape{width:0;margin-left:0}
#lnb.hide li .shape ._r1{left:-2px}
#lnb.hide li .shape ._r2{right:-2px}
#lnb .shape.vertical{top:273px;right:20px;width:1px;height:72px;opacity:0;filter:alpha(opacity=0);transform:scaleY(0)}
#lnb.hide .shape.vertical{opacity:1;transform:scaleY(1);filter:alpha(opacity=100);transition:transform 300ms 300ms ease}
#lnb .shape.vertical .rhombus{left:-2px}
#lnb .shape.vertical ._r1{top:0}
#lnb .shape.vertical ._r2{bottom:0}
#lnb .lnb1 .bg{background-position:0 -192px}
#lnb .lnb2 .bg{background-position:0 -360px}
#lnb.hide .lnb1 a .bg{background-position:41px -192px}
#lnb.hide .lnb2 a .bg{background-position:57px -360px}
#lnb li .txt{width:100%;height:35px;transition:opacity 300ms ease}
#lnb.hide li .txt{opacity:0}
#lnb .lnb1 .txt{background-position:0 -311px}
#lnb .lnb2 .txt{background-position:0 -479px}
#lnb .lnb1.on .txt, #lnb .lnb1 a:hover .txt{background-position:-180px -311px}
#lnb .lnb2.on .txt, #lnb .lnb2 a:hover .txt{background-position:-180px -479px}
#lnb li .off{position:absolute;top:14px;right:11px;width:19px;height:61px;opacity:0;transform:translateX(-5px)}
#lnb.hide li .off{opacity:1;transform:translateX(0);transition:opacity 300ms ease, transform 300ms ease;transition-delay:300ms}
#lnb.hide .lnb1 .off{background-position:-309px 0}
#lnb.hide .lnb2 .off{background-position:-310px -80px}
#lnb .btn_toggle{position:absolute;top:54px;right:-27px;width:55px;height:55px;overflow:visible;background:none}
#lnb .btn_toggle span{position:absolute;top:-7px;left:-7px;width:67px;height:67px;pointer-events:none;background-position:-116px 0}
#lnb .btn_toggle:hover span{background-position:-203px 0}
#lnb.hide .btn_toggle span{background-position:-113px -85px}
#lnb.hide .btn_toggle:hover span{background-position:-200px -85px}

/* screen */
#screen{display:none;position:fixed;top:0;left:0;right:0;width:100%;height:100%;background:#fff;z-index:101}

/* intro */
.intro{height:1343px;border-bottom:4px #060013 solid}
.intro .bg_section{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/bg_intro.jpg") center top no-repeat}
.intro .title_wrap{top:0}
.intro .title_wrap span{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/spr_intro_89089351B3EA11D6.png") no-repeat;opacity:0}
.intro.load .title_wrap span{opacity:1}
.intro .title_wrap .subtitle{top:141px;left:230px;width:820px;height:25px;transform:perspective(150px);-ms-perspective:150px;transform-style:preserve-3d}
.intro .title_wrap .subtitle span{top:0;height:100%;transform:translateZ(130px);-ms-transform:translateZ(130px);transition:opacity 200ms linear, transform 400ms cubic-bezier(0, 0.1, 0, 1.1);-ms-transition:opacity 200ms linear, transform 400ms ease}
.intro.load .title_wrap .subtitle span{top:0;height:100%;transform:translateZ(0);-ms-transform:translateZ(0)}
.intro .title_wrap .subtitle ._t1{left:0;width:22px}
.intro .title_wrap .subtitle ._t2{left:80px;width:24px;background-position:-80px 0;transition-delay:50ms}
.intro .title_wrap .subtitle ._t3{left:163px;width:22px;background-position:-163px 0;transition-delay:100ms}
.intro .title_wrap .subtitle ._t4{left:244px;width:23px;background-position:-244px 0;transition-delay:150ms}
.intro .title_wrap .subtitle ._t5{left:325px;width:23px;background-position:-325px 0;transition-delay:200ms}
.intro .title_wrap .subtitle ._t6{left:406px;width:22px;background-position:-406px 0;transition-delay:250ms}
.intro .title_wrap .subtitle ._t7{left:487px;width:24px;background-position:-487px 0;transition-delay:300ms}
.intro .title_wrap .subtitle ._t8{left:568px;width:24px;background-position:-568px 0;transition-delay:350ms}
.intro .title_wrap .subtitle ._t9{left:651px;width:23px;background-position:-651px 0;transition-delay:400ms}
.intro .title_wrap .subtitle ._t10{left:732px;width:23px;background-position:-732px 0;transition-delay:450ms}
.intro .title_wrap .subtitle ._t11{left:815px;width:5px;background-position:-815px 0;transition-delay:500ms}
.intro .title_wrap .smile{top:116px;width:73px;height:71px;background-position:-1389px -460px;transform:scale(0);transition:opacity 100ms ease, transform 200ms ease;transition-delay:700ms}
.intro.load .title_wrap .smile{transform:scale(1)}
.intro .title_wrap .smile._s1{left:111px;animation:smiling 600ms 900ms steps(2, end) infinite}
.intro .title_wrap .smile._s2{left:1103px;animation:smiling 600ms 1500ms steps(2, end) infinite}
.intro .title_wrap .small{top:229px;left:381px;width:518px;height:59px}
.intro .title_wrap .small .txt{height:59px;transition:opacity 300ms 800ms ease, transform 300ms 900ms cubic-bezier(0, .3, 0, 1.5)}
.intro .title_wrap .small ._t1{left:42px;width:173px;background-position:-42px -74px;transform:translateX(45px)}
.intro .title_wrap .small ._t2{left:306px;width:170px;background-position:-306px -74px;transform:translateX(-45px)}
.intro.load .title_wrap .small .txt{transform:translateX(0)}
.intro .title_wrap .small .squirrel{top:-7px;left:226px;width:68px;height:64px;background-position:-226px -67px;transform:scale(0)}
.intro.load .title_wrap .small .squirrel{transform:scale(1);transition:opacity 100ms 800ms ease, transform 300ms 900ms cubic-bezier(0, 0.3, 0, 1.5)}
.intro .title_wrap .small .diamond{top:12px;width:29px;height:29px;background-position:0 -86px;transform:scale(0)}
.intro.load .title_wrap .small .diamond{transform:scale(1);transition:opacity 100ms 800ms ease, transform 300ms ease;transition-delay:900ms}
.intro .title_wrap .small ._d1{left:0}
.intro .title_wrap .small ._d2{right:0}
.intro .title_wrap .description{top:586px;left:360px;width:560px;height:80px;background-position:-902px 0;transition:opacity 500ms 1700ms linear}
.intro .title_wrap .showcase{top:738px;left:50%;width:1043px;height:375px;border:12px solid #17003E;background:#250066;overflow:hidden;margin-left:-534px;opacity:0;transform:scale(0.9);transition:opacity 300ms ease, transform 400ms ease}
.intro.load .title_wrap .showcase{transform:scale(1);opacity:1;transition-delay:1600ms}
.intro .title_wrap .showcase .light{top:0;width:436px;height:375px;background-position:-751px -430px}
.intro .title_wrap .showcase ._l1{left:-113px}
.intro .title_wrap .showcase ._l2{right:-6px}
.intro .title_wrap .showcase .dot{top:20px;width:18px;height:18px;border-radius:100%;background:#6400FF}
.intro .title_wrap .showcase ._d1{right:93px}
.intro .title_wrap .showcase ._d2{right:63px}
.intro .title_wrap .showcase ._d3{right:33px}
.intro .title_wrap .cost{top:709px;left:409px;width:462px;height:74px;background-position:-56px -411px;transform:translateY(-10px)}
.intro.load .title_wrap .cost{transform:translateY(0);transition:opacity 300ms linear, transform 400ms ease;transition-delay:1800ms}
.intro .title_wrap .duration{top:797px;left:352px;width:575px;height:20px;background-position:0 -511px;transform:translateY(-10px)}
.intro.load .title_wrap .duration{transform:translateY(0);transition:opacity 300ms linear, transform 400ms ease;transition-delay:1850ms}
.intro .title_wrap .keyboard{top:861px;left:233px;width:814px;height:347px;background-position:0 -1304px;transform:translateY(15px)}
.intro.load .title_wrap .keyboard{transform:translateY(0);transition:opacity 300ms linear, transform 400ms ease;transition-delay:2000ms}
.intro .title_wrap .delivery{top:1230px;left:421px;width:437px;height:20px;background-position:0 -578px;transition:opacity 300ms 2150ms linear}
.intro .title_wrap .shape{top:315px;left:382px;width:516px;height:16px}
.intro .title_wrap .shape .line{width:100%;height:2px;background:#7F44D0}
.intro .title_wrap .shape ._l1{top:0;transform:translateY(7px)}
.intro .title_wrap .shape ._l2{top:7px}
.intro .title_wrap .shape ._l3{bottom:0;transform:translateY(-7px)}
.intro.load .title_wrap .shape .line{transform:translateY(0);transition:opacity 100ms ease, transform 300ms ease;transition-delay:850ms}
.intro .title_wrap .shape .diamond{top:-2px;width:11px;height:11px;transform:rotate(45deg)}
.intro .title_wrap .shape ._d1{left:217px}
.intro .title_wrap .shape ._d2{left:251px}
.intro .title_wrap .shape ._d3{left:285px}
.intro .title_wrap .shape .diamond span{top:0;left:0;width:100%;height:100%;background:#320871;border:3px solid #fff;border-radius:1px;transform:scale(0);transition:opacity 300ms ease, transform 300ms ease;transition-delay:950ms}
.intro.load .title_wrap .shape .diamond span{transform:scale(1)}
.intro.load .title_wrap .shape ._d1 span{transition-delay:1000ms}
.intro.load .title_wrap .shape ._d2 span{transition-delay:900ms}
.intro.load .title_wrap .shape ._d3 span{transition-delay:1000ms}
.intro .title_wrap .char{top:934px;width:325px;height:334px}
.intro .title_wrap ._cleft{left:-51px}
.intro .title_wrap ._cright{left:1004px}
.intro .title_wrap .char .shadow{bottom:0;left:0;width:100%;height:60px;background-position:-1003px -1070px;transition:opacity 300ms linear}
.intro .title_wrap ._cleft .shadow{transition-delay:1500ms}
.intro .title_wrap ._cright .shadow{transition-delay:1550ms}
.intro .title_wrap .char .body{bottom:13px;transform:translateY(100px);transition:opacity 100ms ease, transform 300ms cubic-bezier(0, 0.9, 0.3, 1.5)}
.intro.load .title_wrap .char .body{transform:translateY(0)}
.intro .title_wrap .char ._c1{height:321px}
.intro .title_wrap ._cleft ._c1{left:82px;width:264px;background-position:-156px -830px;transition-delay:1500ms}
.intro .title_wrap ._cright ._c1{left:-20px;width:200px;background-position:-455px -827px;transition-delay:1600ms}
.intro .title_wrap ._cleft ._c2{left:34px;width:132px;height:190px;background-position:0 -961px;transition-delay:1550ms}
.intro .title_wrap ._cright ._c2{left:160px;width:156px;height:188px;background-position:-778px -952px;transition-delay:1650ms}
.intro .title_wrap .char .cloud{width:90px;height:60px;background-position:-259px -633px;transform:scale(0);transition:opacity 100ms ease, transform 150ms cubic-bezier(0, 0.1, 0, 1.2)}
.intro.load .title_wrap .char .cloud{transform:scale(1)}
.intro .title_wrap ._cleft .cloud{top:-87px;left:20px;transition-delay:1800ms;animation:floating1 3s 2000ms infinite linear}
.intro .title_wrap ._cright .cloud{top:24px;left:266px;transition-delay:1900ms;animation:floating2 3s 2100ms infinite linear}
.intro .title_wrap ._cright .bubble{top:-157px;left:103px;width:242px;height:160px;background-position:0 -633px;transform:translateY(50px)}
.intro.load .title_wrap ._cright .bubble{transform:translateY(0);transition:opacity 300ms ease, transform 300ms cubic-bezier(0, 0.1, 0, 1.5);transition-delay:2150ms}
.intro .title_wrap .big{top:375px;left:125px;width:1039px;height:156px}
.intro .title_wrap .big .txt{height:100%;transition:opacity 200ms linear, transform 350ms ease;transition-delay:1200ms}
.intro .title_wrap .big ._t1{top:0;left:0;width:473px;background-position:0 -191px;transform:translateX(40px) scale(0);transform-origin:100% 50%}
.intro .title_wrap .big ._t2{top:1px;right:0;width:482px;background-position:-854px -193px;transform:translateX(-40px) scale(0);transform-origin:0 50%}
.intro.load .title_wrap .big .txt{transform:translateX(0) scale(1)}
.intro .title_wrap .big .x{top:-37px;;left:405px;width:220px;height:228px;background-position:-536px -154px;transform:scale(2)}
.intro.load .title_wrap .big .x{transform:scale(1);transition:opacity 200ms linear, transform 300ms cubic-bezier(0, 0.1, 0, 1.2);-ms-transition:opacity 200ms linear, transform 300ms ease;transition-delay:1350ms}
.intro .diamond_wrap div:after{content:"";display:block;clear:both}
.intro .diamond_wrap span{position:relative;float:left;width:16px;height:16px;background:#8858DA;transform:rotate(45deg);margin-right:5px}
.intro .diamond_wrap ._d1{top:251px;left:255px;opacity:0.85}
.intro .diamond_wrap ._d2{top:251px;left:974px;opacity:0.8}
.intro .diamond_wrap ._d3{top:580px;left:-19px;opacity:0.47}
.intro .diamond_wrap ._d4{top:580px;left:1173px;width:161px;opacity:0.47}
.intro .diamond_wrap ._d5{top:620px;left:51px;opacity:0.47}
.intro .diamond_wrap ._d6{top:620px;left:1105px;width:161px;opacity:0.47}

/* content */
.content .content_wrap span{opacity:0}
.content .content_wrap.active span{opacity:1}
.content .content_wrap .squirrel{top:0;left:606px;width:68px;height:64px;transform:scale(0)}
.content .content_wrap.active .squirrel{transform:scale(1);transition:opacity 100ms ease, transform 300ms 100ms cubic-bezier(0, 0.3, 0, 1.5)}
.content .content_wrap .x{top:25px}
.content .content_wrap ._xleft{left:490px}
.content .content_wrap ._xright{left:690px}
.content .content_wrap .x span{position:relative;width:20px;height:20px;background-position:0 -83px}
.content .content_wrap ._xleft span{float:right;transform:translateX(45px)}
.content .content_wrap ._xright span{float:left;transform:translateX(-45px)}
.content .content_wrap.active .x span{transform:translateX(0);transition:opacity 100ms ease, transform 200ms cubic-bezier(0, .3, 0, 1.5)}
.content .content_wrap.active .x ._x1{transition-delay:100ms}
.content .content_wrap.active .x ._x2{transition-delay:150ms}
.content .content_wrap.active .x ._x3{transition-delay:200ms}
.content .content_wrap.active .x ._x4{transition-delay:250ms}
.content .content_wrap.active .x ._x5{transition-delay:300ms}
.content .content_wrap .h2{top:85px;transform:perspective(200px);-ms-perspective:200px;transform-style:preserve-3d}
.content .content_wrap .h2 span{transform:translateZ(80px);-ms-transform:translateZ(80px)}
.content .content_wrap.active .h2 span{transform:translateZ(0);-ms-transform:translateZ(0);transition:opacity 200ms linear, transform 300ms cubic-bezier(0, 0.1, 0, 1.1);-ms-transition:opacity 200ms linear, transform 300ms ease}
.content .content_wrap .h2 span{top:0;height:100%}
.content .content_wrap.active .h2 ._t1{transition-delay:500ms}
.content .content_wrap.active .h2 ._t2, .content2 .content_wrap.active .h2 ._t3{transition-delay:600ms}
.content1 .content_wrap.active .h2 ._t3, .content2 .content_wrap.active .h2 ._t4, .content2 .content_wrap.active .h2 ._t5{transition-delay:700ms}

/* content1 */
.content1{height:874px;border-bottom:4px solid #0a061e}
.content1 .bg_section{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/bg_content1.jpg") center top no-repeat}
.content1 .content_wrap{top:72px}
.content1 .content_wrap span{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/spr_content1.png") no-repeat}
.content1 .content_wrap .h2{left:427px;width:427px;height:70px}
.content1 .content_wrap .h2 ._t1{width:130px;background-position:-130px 0}
.content1 .content_wrap .h2 ._t2{left:145px;width:136px;background-position:-275px 0}
.content1 .content_wrap .h2 ._t3{left:290px;width:137px;background-position:-420px 0}
.content1 .content_wrap .box{top:195px;width:524px}
.content1 .content_wrap ._bleft{left:91px}
.content1 .content_wrap ._bright{left:665px}
.content1 .content_wrap .box .img{top:0;left:0;width:100%;height:401px}
.content1 .content_wrap .box .description{top:430px;left:0;width:100%;height:85px;transform:translateY(-15px)}
.content1 .content_wrap.active .box .description{transform:translateY(0);transition:opacity 300ms ease, transform 500ms ease;transition-delay:1150ms}
.content1 .content_wrap ._bleft .img{background-position:0 -186px;transform:translateX(25px) scale(0.9);transform-origin:100% 50%}
.content1 .content_wrap ._bright .img{background-position:-535px -186px;transform:translateX(-25px) scale(0.9);transform-origin:0 50%}
.content1 .content_wrap.active .box .img{transform:translateX(0) scale(1);transition:opacity 500ms linear, transform 800ms ease;transition-delay:850ms}
.content1 .content_wrap ._bleft .description{background-position:0 -615px}
.content1 .content_wrap ._bright .description{background-position:-535px -615px}
.content1 .content_wrap .caution{top:-53px;left:-125px;width:214px;height:92px}
.content1 .content_wrap .caution .txt{top:0;left:0;width:100%;height:100%;background-position:-845px -83px;transform:translateY(10px)}
.content1 .content_wrap.active .caution .txt{transform:translateY(0);transition:opacity 300ms linear, transform 300ms ease;transition-delay:1700ms}
.content1 .content_wrap .caution .line{top:100%;left:165px;width:40px;height:127px;background-position:-785px 0;transform:scale(0);transform-origin:100% 100%}
.content1 .content_wrap.active .caution .line{transform:scale(1);transition:transform 150ms 1550ms ease}
.content1 .content_wrap .caution .hexagon{top:218px;left:195px;width:21px;height:21px;background-position:-727px -105px;transform:scale(0)}
.content1 .content_wrap.active .caution .hexagon{transform:scale(1);transition:transform 100ms 1500ms ease}
.content1 .content_wrap .plus{top:363px;left:606px;width:69px;height:69px;background-position:-631px 0;transform:rotate(450deg)}
.content1 .content_wrap.active .plus{transform:rotate(0);transition:opacity 500ms linear, transform 800ms ease;transition-delay:950ms;animation:rotation 5s 2000ms infinite ease-out}

/* content2 */
.content2{height:1176px;border-bottom:4px solid #070418}
.content2 .bg_section{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/bg_content2.jpg") center top no-repeat}
.content2 .content_wrap{top:77px}
.content2 .content_wrap span, .content2 .content_wrap a{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/spr_content2.png") no-repeat}
.content2 .content_wrap .h2{left:254px;width:769px;height:63px}
.content2 .content_wrap .h2 ._t1{left:0;width:239px;background-position:-110px 0}
.content2 .content_wrap .h2 ._t2{left:252px;width:181px;background-position:-362px 0}
.content2 .content_wrap .h2 ._t3{left:446px;width:121px;background-position:-556px 0}
.content2 .content_wrap .h2 ._t4{left:578px;width:120px;background-position:-688px 0}
.content2 .content_wrap .h2 ._t5{left:707px;width:62px;background-position:-817px 0}
.content2 .content_wrap .h2 .small{top:81px;left:333px;height:44px}
.content2 .content_wrap .h2 ._t6{left:79px;width:435px;background-position:-189px -73px}
.content2 .content_wrap .h2 ._t7{left:520px;width:82px;background-position:-630px -73px}
.content2 .content_wrap .h2 ._t8{left:610px;width:83px;background-position:-720px -73px}
.content2 .content_wrap.active .h2 .small{transition-delay:800ms}
.content2 .content_wrap ._c2{top:243px;left:70px;width:255px;height:314px;background-position:0 -188px;transform:translate(420px, 150px) rotate(10deg)}
.content2 .content_wrap ._c1{top:241px;left:299px;width:232px;height:296px;background-position:-276px -186px;transform:translate(200px, 155px) rotate(-10deg)}
.content2 .content_wrap ._c3{top:241px;left:527px;width:232px;height:296px;background-position:-540px -186px;transform:translate(-28px, 155px) rotate(10deg)}
.content2 .content_wrap ._c4{top:241px;left:755px;width:232px;height:296px;background-position:-804px -186px;transform:translate(-256px, 155px) rotate(-10deg)}
.content2 .content_wrap ._c5{top:241px;left:983px;width:232px;height:296px;background-position:-1068px -186px;transform:translate(-484px, 155px) rotate(10deg)}
.content2 .content_wrap ._c6{top:532px;left:299px;width:232px;height:296px;background-position:0 -522px;transform:translate(200px, -136px) rotate(-10deg)}
.content2 .content_wrap ._c7{top:532px;left:527px;width:232px;height:296px;background-position:-293px -522px;transform:translate(-28px, -136px) rotate(10deg)}
.content2 .content_wrap ._c8{top:551px;left:714px;width:274px;height:327px;background-position:-564px -541px;transform:translate(-232px, -170px) rotate(-10deg)}
.content2 .content_wrap.active .card{transform:translate(0, 0) rotate(0);transition:opacity 300ms ease, transform 800ms ease}
.content2 .content_wrap.active ._c2{transition-delay:900ms}
.content2 .content_wrap.active ._c1{transition-delay:950ms}
.content2 .content_wrap.active ._c3{transition-delay:1000ms}
.content2 .content_wrap.active ._c4{transition-delay:1050ms}
.content2 .content_wrap.active ._c5{transition-delay:1100ms}
.content2 .content_wrap.active ._c6{transition-delay:980ms}
.content2 .content_wrap.active ._c7{transition-delay:1030ms}
.content2 .content_wrap.active ._c8{transition-delay:1080ms}
.content2 .content_wrap .plus{width:67px;height:67px;background-position:-1232px -617px;transform:scale(0)}
.content2 .content_wrap.active .plus{transform:scale(1);transition:all 300ms cubic-bezier(0, 0.1, 0, 1.2)}
.content2 .content_wrap .ptop{top:356px}
.content2 .content_wrap .pbtm{top:654px}
.content2 .content_wrap ._p1{left:268px}
.content2 .content_wrap ._p2{left:495px}
.content2 .content_wrap ._p3{left:724px}
.content2 .content_wrap ._p4{left:951px}
.content2 .content_wrap ._p5{left:495px}
.content2 .content_wrap ._p6{left:722px}
.content2 .content_wrap.active ._p1{transition-delay:1460ms}
.content2 .content_wrap.active ._p2{transition-delay:1510ms}
.content2 .content_wrap.active ._p3{transition-delay:1660ms}
.content2 .content_wrap.active ._p4{transition-delay:1720ms}
.content2 .content_wrap.active ._p5{transition-delay:1780ms}
.content2 .content_wrap.active ._p6{transition-delay:1840ms}
.content2 .content_wrap .heart{width:70px;height:59px;background-position:0 -860px}
.content2 .content_wrap ._h1{top:-27px;left:170px;transform:scale(0.8);animation:bounce1 400ms ease infinite alternate}
.content2 .content_wrap ._h2{top:512px;left:1259px;animation:bounce2 400ms ease infinite alternate}
.content2 .content_wrap .cloud{top:581px;left:10px;width:90px;height:60px;background-position:-101px -860px;animation:floating2 3s infinite linear}
.content2 .content_wrap ._d1{top:658px;left:86px;width:188px;height:210px;background-position:-226px -990px}
.content2 .content_wrap ._d2{top:694px;left:-15px;width:188px;height:210px;background-position:0 -990px}
.content2 .content_wrap ._d3{top:569px;left:1028px;width:330px;height:337px;background-position:-875px -692px}
.content2 .content_wrap .btn_detail{position:absolute;top:877px;left:400px;text-indent:-99999px;overflow:hidden;width:480px;height:82px;background-position:-820px -1036px;opacity:0;transform:translateY(20px)}
.content2 .content_wrap .btn_detail:hover{background-position:-820px -1118px}
.content2 .content_wrap.active .btn_detail{opacity:1;transform:translateY(0);transition:opacity 300ms ease, transform 400ms ease;transition-delay:1900ms}
.content2 .shape_wrap span{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/spr_shape_content2.png") no-repeat}
.content2 .shape_wrap .rec{width:28px;height:28px}
.content2 .shape_wrap ._r1{top:194px;left:56px}
.content2 .shape_wrap ._r2{top:96px;left:1349px}
.content2 .shape_wrap ._r3{top:838px;left:1400px}
.content2 .shape_wrap ._r4{top:1004px;left:290px}
.content2 .shape_wrap .blue{background-position:-43px 0}
.content2 .shape_wrap .wave{width:86px;height:23px}
.content2 .shape_wrap ._w1{top:486px;left:-89px;background-position:0 -67px}
.content2 .shape_wrap ._w2{top:435px;left:1357px;background-position:-94px -67px}
.content2 .shape_wrap .plus{width:36px;height:36px;background-position:-94px 0}
.content2 .shape_wrap ._p1{top:210px;left:1110px}
.content2 .shape_wrap ._p2{top:1071px;left:1005px}

/* footer */
.footer{height:417px;background:#16103d}
.footer .container{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/bg_footer.png") no-repeat}
.footer .copyright{position:absolute;bottom:0;left:0;width:100%;height:84px;background:#000 url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/copyright.png") center 35px no-repeat;text-indent:-9999px;overflow:hidden}

/* top button */
.btn_top{display:none;position:fixed;top:50%;right:32px;width:82px;height:120px;z-index:100;margin-top:-60px}
.btn_top span{position:absolute;left:-9px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/1205_event02_A013032234C5F90D/btn_top.png") no-repeat}
.btn_top .rhombus{left:22px;width:46px;height:46px}
.btn_top ._r2{top:-9px}
.btn_top ._r1{top:89px}
.btn_top:hover ._r2{animation:topHover1 500ms ease infinite alternate}
.btn_top:hover ._r1{animation:topHover2 500ms ease infinite alternate}
.btn_top .txt{top:8px;width:108px;height:108px;background-position:0 -56px;text-indent:-9999px;overflow:hidden}

@keyframes topHover1{
    90%{transform:translateY(-10px)}
    100%{transform:translateY(-10px)}
}

@keyframes topHover2{
    90%{transform:translateY(10px)}
    100%{transform:translateY(10px)}
}

@keyframes squirrel1{
    0%{transform:scale(0)}
    60%{transform:scale(1.1)}
    80%{transform:scale(0.8)}
    100%{transform:scale(1)}
}

@keyframes smiling{
    0%{background-position:-1389px -460px}
    100%{background-position:-1389px -602px}
}

@keyframes floating1{
    0%{transform:translateX(0)}
    25%{transform:translateX(20px)}
    50%{transform:translateX(0)}
    75%{transform:translateX(-20px)}
    100%{transform:translateX(0)}
}

@keyframes floating2{
    0%{transform:translateX(0)}
    25%{transform:translateX(-20px)}
    50%{transform:translateX(0)}
    75%{transform:translateX(20px)}
    100%{transform:translateX(0)}
}

@keyframes bounce1{
    0%{transform:scale(0.8)}
    100%{transform:scale(1)}
}

@keyframes bounce2{
    0%{transform:scale(1)}
    100%{transform:scale(0.8)}
}

@keyframes rotation{
    80%{transform:rotate(450deg)}
}
