@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:'돋움','dotum',sans-serif;font-size:14px;color:#262626;line-height:1;background:#000}
input,textarea,button,select{font-size:inherit;font-family:'돋움','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;overflow:hidden}
#wrap .section{position:relative;width:100%}
.section .container{position:relative;width:1200px;height:100%;margin:0 auto}
.section .bg_section{position:absolute;top:0;left:0;width:99.99%;height:100%;padding-left:0.01%}
.gnbWrapper{min-width:1280px !important}

/* common */
.object_wrap{position:absolute;top:0;left:0;width:100%}
.object_wrap div, .object_wrap span{position:absolute}
.parallax span, .content_wrap .btn_detail, .content_wrap .copyright{opacity:0}
.parallax.active span, .content_wrap.active .btn_detail, .content_wrap.active .copyright{opacity:1}

/* header */
#header h1 a, #header .btn_start, #header .util li a span{display:block;text-indent:-99999px;overflow:hidden;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_event06_B027853E806624CC/spr_header.png") no-repeat}
#header{position:absolute;top:0;left:0;right:0;z-index:100}
#header .bi{position:absolute;top:15px;left:50%;width:252px;height:17px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_event02_ADC50F7412CBF032/bi.png") no-repeat;text-indent:-99999px;overflow:hidden;margin-left:-124px}
#header .util{position:absolute;top:135px;right:0;margin-right:26px}
#header .btn_start{position:absolute;top:-116px;right:2px;width:283px;height:91px;background-position:-121px 0}
#header .btn_start:hover{background-position:-121px -123px}
#header .util li a{position:relative;display:block;width:68px;height:68px}
#header .util li .btn{position:relative;width:100%;height:100%}
#header .util li .bubble{position:absolute;top:25px;right:73px;width:112px;height:19px;text-indent:0;text-align:center;line-height:17px;font-size:11px;font-family:'맑은 고딕', 'malgun gothic', sans-serif;color:#e5e5e5;padding-right:5px;opacity:0;filter:alpha(opacity=0);transform:translateX(10px);transition:all 300ms ease}
#header .util li a:hover .bubble{opacity:1;filter:alpha(opacity=100);transform:translateX(0)}
#header .util .btn_h{margin-bottom:5px}
#header .util .btn_h .btn{background-position:-509px 0}
#header .util .btn_c .btn{background-position:-509px -73px}
#header .util .btn_h a:hover .btn{background-position:-710px 0}
#header .util .btn_c a:hover .btn{background-position:-710px -73px}
#header .util .btn_h .bubble{background-position:-588px -22px}
#header .util .btn_c .bubble{background-position:-589px -98px}

/* lnb */
#lnb{position:absolute;top:0;left:0;width:181px;height:100%;background:#fff;z-index:100;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0725_intro_435F728674B478EC/bg_lnb.jpg") 0 top repeat-y;transition:left 300ms ease}
.fixed #lnb{position:fixed}
#lnb.hide{left:-162px}
#lnb .lnb_wrap{position:relative;height:100%}
#lnb .lnb_wrap li, #lnb .lnb_wrap a, #lnb .btn_toggle, #lnb .lnb_wrap li .new{display:block;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/spr_lnb_ADC7468E6B0841F2.png") no-repeat}
#lnb .lnb_wrap a, #lnb .btn_toggle{text-indent:-99999px;overflow:hidden}
#lnb h1 a{width:162px;height:152px}
#lnb .lnb_wrap ul{padding-bottom:122px}
#lnb .lnb0{height:108px}
#lnb .lnb0.v3{height:128px}
#lnb .lnb_wrap li{position:relative;width:162px;background-position:-462px 100%;padding-bottom:8px}
#lnb .lnb_wrap li .new{position:absolute;top:50%;right:-19px;width:36px;height:36px;background-position:-256px 0;margin-top:-22px;transition:opacity 300ms ease}
#lnb .lnb_wrap .lnb0.v3 .new{margin-top:2px}
#lnb.hide .lnb_wrap li .new{opacity:0;filter:alpha(opacity=0)}
#lnb .lnb_wrap .lnb4{background:none;padding-bottom:0}
#lnb .lnb0 a{position:absolute;left:0;width:100%}
#lnb .lnb0 .lnb_intro{top:29px;height:27px;background-position:0 -1026px}
#lnb .lnb0 .lnb_video{top:56px;height:30px;background-position:0 -1053px}
#lnb .lnb0.v2 .lnb_intro{background-position:0 -192px}
#lnb .lnb0.v2 .lnb_video{background-position:0 -219px}
#lnb .lnb0.v3 .lnb_intro{top:68px;height:40px;background-position:0 -1202px}
#lnb .lnb0.v3 .lnb_video{top:19px;height:27px;background-position:0 -1153px}
#lnb .lnb1 a{height:85px;background-position:0 -279px}
#lnb .lnb2 a{height:108px;background-position:0 -872px}
#lnb .lnb2.v2 a{background-position:0 -372px}
#lnb .lnb2.v3 a{background-position:0 -1355px}
#lnb .lnb3 a{height:125px;background-position:0 -488px}
#lnb .lnb4 a{height:143px;background-position:0 -621px}
#lnb .lnb5 a{height:85px;background-position:0 -774px}
#lnb .lnb6 a{height:85px;background-position:0 -1259px}
#lnb .lnb0.on .lnb_intro, #lnb .lnb0 .lnb_intro:hover{background-position:-190px -1026px}
#lnb .lnb0.on .lnb_video, #lnb .lnb0 .lnb_video:hover{background-position:-190px -1053px}
#lnb .lnb0.v2.on .lnb_intro, #lnb .lnb0.v2 .lnb_intro:hover{background-position:-190px -192px}
#lnb .lnb0.v2.on .lnb_video, #lnb .lnb0.v2 .lnb_video:hover{background-position:-190px -219px}
#lnb .lnb0.v3.on .lnb_intro, #lnb .lnb0.v3 .lnb_intro:hover{background-position:-190px -1202px}
#lnb .lnb0.v3.on .lnb_video, #lnb .lnb0.v3 .lnb_video:hover{background-position:-190px -1153px}
#lnb .lnb1.on a, #lnb .lnb1 a:hover{background-position:-190px -279px}
#lnb .lnb2.on a, #lnb .lnb2 a:hover{background-position:-190px -872px}
#lnb .lnb2.v2.on a, #lnb .lnb2.v2 a:hover{background-position:-190px -372px}
#lnb .lnb2.v3.on a, #lnb .lnb2.v3 a:hover{background-position:-190px -1355px}
#lnb .lnb3.on a, #lnb .lnb3 a:hover{background-position:-190px -488px}
#lnb .lnb4.on a, #lnb .lnb4 a:hover{background-position:-190px -621px}
#lnb .lnb5.on a, #lnb .lnb5 a:hover{background-position:-190px -774px}
#lnb .lnb6.on a, #lnb .lnb6 a:hover{background-position:-190px -1259px}
#lnb .btn_toggle{position:absolute;top:0;left:162px;width:50px;height:50px;background-position:-180px -65px}
#lnb.hide .btn_toggle{background-position:-180px 0}
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{right:19px}


/* nav */
#nav .nav_wrap, #nav .btn_toggle, #nav .nav_wrap li a{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0704_intro_F51A1BF194149854/spr_nav_v2.png") no-repeat}
#nav .btn_toggle, #nav .nav_wrap{position:fixed;z-index:100}
#nav .nav_wrap{bottom:28px;left:50%;width:1575px;height:129px;background-position:0 -356px;margin-left:-775px}
#nav.toggle .nav_wrap{display:none}
#nav .nav_wrap ul{overflow:hidden;padding:12px 0 0 173px}
#nav .nav_wrap li{position:relative;float:left;height:105px}
#nav .nav_wrap li a{display:block;height:100%;text-indent:-99999px;overflow:hidden}
#nav .nav_wrap li .cover{position:absolute;top:0;left:0;width:100%;height:100%}
#nav .nav_wrap .nav1{width:296px}
#nav .nav_wrap .nav2{width:217px}
#nav .nav_wrap .nav3{width:329px}
#nav .nav_wrap .nav4{width:364px}
#nav .nav_wrap .nav1 a{background-position:0 13px}
#nav .nav_wrap .nav2 a{background-position:-296px 13px}
#nav .nav_wrap .nav3 a{background-position:-513px 13px}
#nav .nav_wrap .nav4 a{background-position:-842px 13px}
#nav .nav_wrap .nav1 a:hover, #nav .nav_wrap .nav1.on a{background-position:0 -97px}
#nav .nav_wrap .nav2 a:hover, #nav .nav_wrap .nav2.on a{background-position:-296px -97px}
#nav .nav_wrap .nav3 a:hover, #nav .nav_wrap .nav3.on a{background-position:-513px -97px}
#nav .nav_wrap .nav4 a:hover, #nav .nav_wrap .nav4.on a{background-position:-842px -97px}
#nav .btn_toggle{bottom:50px;left:45px;width:72px;height:72px;background-position:0 -215px}
#nav .btn_toggle span{position:absolute;left:31px;width:10px;height:6px;background:#F0E3D7;border-radius:6px;transition:all 300ms ease}
#nav .btn_toggle ._b1{top:22px}
#nav .btn_toggle ._b2{top:33px}
#nav .btn_toggle ._b3{top:44px}
#nav.toggle .btn_toggle span{left:19px;width:34px}

/* screen */
#screen{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:100;background:#000}

/* intro */
.intro{height:1803px}
.intro .bg_intro{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_intro.jpg") center top no-repeat}
.intro .bg_cover{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_cover.png") center top no-repeat}
.intro .bg_char{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char.png") center top no-repeat;opacity:0}
.intro.load .bg_char{opacity:1;transition:opacity 1s linear}
.intro .char_wrap{position:absolute;top:0;left:50%;width:1920px;height:100%;overflow:hidden;margin-left:-960px}
.intro .char_wrap span{position:absolute;opacity:0;transition:opacity 500ms linear, transform 1s cubic-bezier(0, 0.8, 1, 1)}
.intro.load .char_wrap span{opacity:1;transform:translate(0,0)}
.intro .char_wrap ._c1{top:-103px;left:0;width:553px;height:1416px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char1_intro.png") no-repeat;transform:translate(-100px, -100px);transition-delay:1000ms}
.intro .char_wrap ._c2{top:560px;left:0;width:788px;height:1145px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char2_intro.png") no-repeat;transform:translate(-100px, 0);transition-delay:1300ms}
.intro .char_wrap ._c3{top:692px;left:0;width:1095px;height:1406px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char3_intro.png") no-repeat;transform:translate(-100px, 100px);transition-delay:1500ms}
.intro .char_wrap ._c4{top:83px;right:0;width:546px;height:1492px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char4_intro.png") no-repeat;transform:translate(100px, -100px);transition-delay:1200ms}
.intro .char_wrap ._c5{top:405px;right:0;width:820px;height:1450px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char5_intro.png") no-repeat;transform:translate(100px, 0);transition-delay:1400ms}
.intro .char_wrap ._c6{top:545px;right:0;width:610px;height:1926px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_char6_intro.png") no-repeat;transform:translate(100px, 100px);transition-delay:1600ms}
.intro .object_wrap span{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/spr_title.png") no-repeat}
.intro .object_wrap .line{width:14px}
.intro .title_wrap span{opacity:0}
.intro.load .title_wrap span{opacity:1}
.intro .title_wrap .box{top:363px;left:-14px;width:1270px;height:280px}
.intro .title_wrap .box span{transition:opacity 300ms ease, transform 800ms cubic-bezier(0, 1, 1, 1)}
.intro .title_wrap .box .horizontal{left:0;width:100%;height:30px}
.intro .title_wrap .box ._h1{transform:scaleX(0.5) translateY(70px)}
.intro .title_wrap .box ._h2{bottom:0;background-position:0 -250px;transform:scaleX(0.5) translateY(-70px)}
.intro .title_wrap .box .vertical{top:30px;width:30px;height:220px}
.intro .title_wrap .box ._v1{background-position:0 -30px;transform:scaleY(0.36) translateX(317.5px)}
.intro .title_wrap .box ._v2{right:0;background-position:-1240px -30px;transform:scaleY(0.36) translateX(-317.5px)}
.intro.load .title_wrap .box .horizontal{transform:scaleX(1) translateY(0)}
.intro.load .title_wrap .box .vertical{transform:scaleY(1) translateX(0)}
.intro .title_wrap .headline{top:251px;left:51px;width:552px;height:474px}
.intro .title_wrap .headline .txt{transform:scale(1.1);transition:opacity 500ms linear, transform 500ms linear}
.intro.load .title_wrap .headline .txt{transform:scale(1)}
.intro .title_wrap .headline ._h1{top:0;left:0;width:237px;height:351px;background-position:-660px -311px;transition-delay:200ms}
.intro .title_wrap .headline ._h2{top:5px;left:231px;width:169px;height:276px;background-position:-932px -311px;transition-delay:300ms}
.intro .title_wrap .headline ._h3{top:64px;left:356px;width:184px;height:178px;background-position:-687px -988px;transition-delay:400ms}
.intro .title_wrap .headline ._h4{top:290px;left:56px;width:217px;height:184px;background-position:-680px -728px;transition-delay:500ms}
.intro .title_wrap .headline ._h5{top:224px;left:252px;width:300px;height:250px;background-position:-970px -695px;transition-delay:600ms}
.intro .title_wrap .headline .stain{top:188px;left:260px;width:288px;height:255px;background-position:-234px -700px}
.intro.load .title_wrap .headline .stain{transition:all 100ms ease;transition-delay:1020ms}
.intro .title_wrap .descript{top:412px;left:769px;width:376px;height:177px}
.intro .title_wrap .descript .txt{transition:opacity 500ms linear}
.intro .title_wrap .descript ._d1{top:0;left:88px;width:255px;height:36px;background-position:-322px -316px;transition-delay:900ms}
.intro .title_wrap .descript ._d2{top:48px;left:0;width:341px;height:67px;background-position:-234px -401px;transition-delay:1s}
.intro .title_wrap .descript ._d3{top:128px;left:4px;width:338px;height:49px;background-position:-238px -520px;transition-delay:1.1s}
.intro .title_wrap .descript .line{top:50%;right:0;height:0;overflow:hidden;margin-top:0}
.intro .title_wrap .descript .line span{top:50%;left:0;width:100%;height:175px;margin-top:-89px;background-position:-635px -311px}
.intro.load .title_wrap .descript .line{height:175px;margin-top:-85px;transition:opacity 300ms ease, height 400ms ease, margin 400ms ease;transition-delay:700ms}
.intro .title_wrap .scroll{top:769px;left:568px;width:64px;height:31px}
.intro .title_wrap .scroll .line{left:25px}
.intro .title_wrap .scroll .arrow, .intro .title_wrap .scroll .txt{transform:translateY(-10px);transition:opacity 300ms linear, transform 300ms ease}
.intro.load .title_wrap .scroll .arrow, .intro.load .title_wrap .scroll .txt{transform:translateY(0)}
.intro .title_wrap .scroll .arrow{top:22px;left:23px;width:18px;height:9px;background-position:-60px -338px;transition-delay:750ms}
.intro .title_wrap .scroll .txt{top:0;left:0;width:64px;height:12px;background-position:-37px -316px;transition-delay:650ms}
.intro .title_wrap .scroll ._l1{top:-102px;height:0;background-position:0 -316px;transition:height 250ms linear;transition-delay:400ms}
.intro.load .title_wrap .scroll ._l1{height:85px}
.intro .title_wrap .scroll ._l2{top:46px;height:0;background-position:-109px -316px;transition:height 850ms ease-out;transition-delay:750ms}
.intro.load .title_wrap .scroll ._l2{height:341px}
.intro .hexagon_wrap{top:1069px}
.intro .hexagon_wrap .line{left:593px;height:0}
.intro .hexagon_wrap ._l1{top:87px;background-position:-109px -657px}
.intro .hexagon_wrap.active ._l1{height:174px;transition:height 300ms linear;transition-delay:150ms}
.intro .hexagon_wrap ._l2{top:504px;background-position:0 -567px}
.intro .hexagon_wrap.active ._l2{height:64px;transition:height 200ms ease-out;transition-delay:900ms}
.intro .hexagon_wrap ._l3{top:665px;background-position:0 -728px}
.intro .hexagon_wrap.active ._l3{height:102px;transition:height 400ms ease-out;transition-delay:1250ms}
.intro .hexagon_wrap .h3{top:0;left:431px;width:335px;height:135px}
.intro .hexagon_wrap .h3 ._h1{width:100%;height:60px;background-position:0 -1041px;transform:translateY(10px)}
.intro .hexagon_wrap .h3 ._h2{top:73px;left:30px;width:273px;height:62px;background-position:-30px -1114px;transform:translateY(-10px)}
.intro .hexagon_wrap.active .h3 span{transform:translateY(0);transition:opacity 300ms linear, transform 500ms ease}
.intro .hexagon_wrap .hexagon{top:114px;left:-15px}
.intro .hexagon_wrap .hexagon span{width:223px;height:338px}
.intro .hexagon_wrap .hexagon ._h1{top:0;left:0;background-position:0 -1211px}
.intro .hexagon_wrap .hexagon ._h2{top:35px;left:252px;background-position:-252px -1246px}
.intro .hexagon_wrap .hexagon ._h3{top:64px;left:504px;background-position:-504px -1275px}
.intro .hexagon_wrap .hexagon ._h4{top:35px;left:752px;background-position:-752px -1246px}
.intro .hexagon_wrap .hexagon ._h5{top:0;left:1008px;background-position:-1008px -1211px}
.intro .hexagon_wrap .hexagon span:nth-child(2n+1){transform:translateY(-30px)}
.intro .hexagon_wrap .hexagon span:nth-child(2n){transform:translateY(30px)}
.intro .hexagon_wrap.active .hexagon span{transform:translateY(0);transition:opacity 300ms linear, transform 600ms ease}
.intro .hexagon_wrap.active .hexagon span:first-child, .intro .hexagon_wrap.active .hexagon span:last-child{transition-delay:850ms}
.intro .hexagon_wrap.active .hexagon span:nth-child(2n){transition-delay:700ms}
.intro .hexagon_wrap.active .hexagon ._h3{transition-delay:550ms}
.intro .hexagon_wrap .next{top:577px;left:591px;width:18px;height:81px}
.intro .hexagon_wrap .next span{transform:translateY(-10px)}
.intro .hexagon_wrap .next .txt{top:0;left:1px;width:15px;height:63px;background-position:-406px -1044px}
.intro .hexagon_wrap .next .arrow{bottom:0;left:0;width:100%;height:9px;background-position:-404px -1116px}
.intro .hexagon_wrap.active .next span{transform:translateY(0);transition:opacity 300ms linear, transform 300ms ease}
.intro .hexagon_wrap.active .next .txt{transition-delay:1050ms}
.intro .hexagon_wrap.active .next .arrow{transition-delay:1150ms}

/* content */
.content{height:916px;border-top:3px solid #FF7600}
.content .bg_section{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/bg_content.jpg") center top no-repeat}
.content .content_wrap span, .content .content_wrap .btn_detail{background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/spr_content_v2.png") no-repeat}
.content .content_wrap .h3, .content .content_wrap .descript{transform:translateY(-30px)}
.content .content_wrap.active .h3, .content .content_wrap.active .descript{transform:translateY(0);transition:opacity 300ms linear, transform 500ms ease-out}
.content .content_wrap.active .descript{transition-delay:200ms}
.content .content_wrap .h3{top:82px;left:438px;width:308px;height:69px;background-position:-155px 0}
.content .content_wrap .descript{top:167px;left:283px;width:610px;height:20px;background-position:0 -85px}
.content .content_wrap .list{width:315px;height:96px}
.content .content_wrap ._l1, .content .content_wrap ._l5{left:14px}
.content .content_wrap ._l2, .content .content_wrap ._l6{left:281px}
.content .content_wrap ._l3, .content .content_wrap ._l7{left:554px}
.content .content_wrap ._l4, .content .content_wrap ._l8{left:823px}
.content .content_wrap ._l1, .content .content_wrap ._l2, .content .content_wrap ._l3, .content .content_wrap ._l4{top:284px}
.content .content_wrap ._l5, .content .content_wrap ._l6, .content .content_wrap ._l7, .content .content_wrap ._l8{top:490px}
.content .content_wrap .list .shadow{width:0}
.content .content_wrap .list ._s1{top:0;left:0;height:96px}
.content .content_wrap .list ._s2{top:0;left:227px;height:85px;background-position:-659px 0}
.content .content_wrap ._l1 ._s1, .content .content_wrap ._l5 ._s1{background-position:0 -129px}
.content .content_wrap ._l2 ._s1, .content .content_wrap ._l6 ._s1{background-position:-267px -129px}
.content .content_wrap ._l3 ._s1, .content .content_wrap ._l7 ._s1{background-position:-540px -129px}
.content .content_wrap ._l4 ._s1, .content .content_wrap ._l8 ._s1{background-position:-809px -129px}
.content .content_wrap .list .ribbon{top:50px;right:0;width:0;height:96px;background-position:100% 0;z-index:1}
.content .content_wrap.active .list ._s1{width:227px;transition:width 200ms linear}
.content .content_wrap.active .list ._s2{width:88px;transition:width 60ms linear}
.content .content_wrap.active .list .ribbon{width:228px;transition:width 500ms ease-out}
.content .content_wrap .list .txt{top:57px;right:8px;z-index:1;transform:translate(10px, -3px)}
.content .content_wrap ._l1 .txt{width:159px;height:65px;background-position:0 -283px}
.content .content_wrap ._l2 .txt{width:185px;height:74px;background-position:-242px -283px}
.content .content_wrap ._l3 .txt{width:159px;height:66px;background-position:-538px -283px}
.content .content_wrap ._l4 .txt{width:160px;height:66px;background-position:-804px -285px}
.content .content_wrap ._l5 .txt{width:159px;height:65px;background-position:0 -383px}
.content .content_wrap ._l6 .txt{width:160px;height:66px;background-position:-262px -385px}
.content .content_wrap ._l7 .txt{width:159px;height:65px;background-position:-534px -385px}
.content .content_wrap ._l8 .txt{top:60px;right:20px;width:105px;height:53px;background-position:-850px -385px}
.content .content_wrap.active .list .txt{transform:translate(0,0);transition:opacity 300ms linear, transform 300ms ease}
.content .content_wrap .list .item{transform:translateY(30px) scale(0)}
.content .content_wrap ._l1 .item{top:-37px;left:134px;width:67px;height:66px;background-position:0 -481px}
.content .content_wrap ._l2 .item{top:-24px;left:136px;width:59px;height:60px;background-position:-271px -494px}
.content .content_wrap ._l3 .item{top:-29px;left:134px;width:65px;height:58px;background-position:-542px -489px}
.content .content_wrap ._l4 .item{top:-31px;left:131px;width:72px;height:61px;background-position:-808px -487px}
.content .content_wrap ._l5 .item{top:-12px;left:132px;width:67px;height:59px;background-position:0 -592px}
.content .content_wrap ._l6 .item{top:-14px;left:135px;width:69px;height:61px;background-position:-270px -589px}
.content .content_wrap ._l7 .item{top:-17px;left:143px;width:52px;height:62px;background-position:-551px -586px}
.content .content_wrap ._l8 .item{top:-28px;left:163px;width:29px;height:84px;background-position:-840px -575px}
.content .content_wrap.active .list .item{transform:translateY(0) scale(1);transition:opacity 300ms linear, transform 500ms ease}
.content .content_wrap.active ._l1 ._s1, .content .content_wrap.active ._l5 ._s1{transition-delay:400ms}
.content .content_wrap.active ._l1 ._s2, .content .content_wrap.active ._l5 ._s2{transition-delay:600ms}
.content .content_wrap.active ._l2 ._s1, .content .content_wrap.active ._l6 ._s1{transition-delay:660ms}
.content .content_wrap.active ._l2 ._s2, .content .content_wrap.active ._l6 ._s2{transition-delay:860ms}
.content .content_wrap.active ._l3 ._s1, .content .content_wrap.active ._l7 ._s1{transition-delay:920ms}
.content .content_wrap.active ._l3 ._s2, .content .content_wrap.active ._l7 ._s2{transition-delay:1120ms}
.content .content_wrap.active ._l4 ._s1, .content .content_wrap.active ._l8 ._s1{transition-delay:1180ms}
.content .content_wrap.active ._l4 ._s2, .content .content_wrap.active ._l8 ._s2{transition-delay:1380ms}
.content .content_wrap.active ._l1 .ribbon, .content .content_wrap.active ._l5 .ribbon{transition-delay:500ms}
.content .content_wrap.active ._l2 .ribbon, .content .content_wrap.active ._l6 .ribbon{transition-delay:760ms}
.content .content_wrap.active ._l3 .ribbon, .content .content_wrap.active ._l7 .ribbon{transition-delay:1020ms}
.content .content_wrap.active ._l4 .ribbon, .content .content_wrap.active ._l8 .ribbon{transition-delay:1280ms}
.content .content_wrap.active ._l1 .txt, .content .content_wrap.active ._l5 .txt{transition-delay:700ms}
.content .content_wrap.active ._l2 .txt, .content .content_wrap.active ._l6 .txt{transition-delay:960ms}
.content .content_wrap.active ._l3 .txt, .content .content_wrap.active ._l7 .txt{transition-delay:1220ms}
.content .content_wrap.active ._l4 .txt, .content .content_wrap.active ._l8 .txt{transition-delay:1480ms}
.content .content_wrap.active ._l1 .item, .content .content_wrap.active ._l5 .item{transition-delay:450ms}
.content .content_wrap.active ._l2 .item, .content .content_wrap.active ._l6 .item{transition-delay:710ms}
.content .content_wrap.active ._l3 .item, .content .content_wrap.active ._l7 .item{transition-delay:970ms}
.content .content_wrap.active ._l4 .item, .content .content_wrap.active ._l8 .item{transition-delay:1230ms}
.content .content_wrap .btn_detail{position:absolute;top:696px;left:-105px;width:1466px;height:68px;background-position:0 -707px}
.content .content_wrap .btn_detail:hover{background-position:0 -792px}
.copyright{position:absolute;top:826px;left:50%;width:517px;height:44px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0725_intro_435F728674B478EC/bg_copyright.png") no-repeat;text-indent:-999999px;overflow:hidden;margin-left:-258px}
.content .content_wrap .btn_detail, .content .content_wrap .copyright{transform:translateY(30px)}
.content .content_wrap.active .btn_detail, .content .content_wrap.active .copyright{transform:translateY(0);transition:opacity 300ms linear, transform 500ms ease-out}
.content .content_wrap.active .btn_detail{transition-delay:1.5s}
.content .content_wrap.active .copyright{transition-delay:1.6s}

/* top button */
.btn_top{position:absolute;bottom:347px;right:-76px;width:131px;height:268px;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0822_intro_BFDF103BC5C93CA9/btn_top.png") no-repeat;transition:right 100ms ease}
.btn_top:hover{right:-66px}

/* modal popup */
.modal-popup{display:none;position:fixed;top:0;left:0;right:0;bottom:0;height:100%;z-index:9999999;overflow:hidden;overflow-y:scroll}
.modal-popup.show{display:block;filter:alpha(opacity=0);opacity:0} 
.modal-popup .dim{position:absolute;top:0;left:0;right:0;width:100%;min-height:100%;background:#000;filter:alpha(opacity=80);opacity:0.8}
.modal-popup .modal-wrap{position:absolute;top:50%;left:50%;width:853px;height:480px;padding:60px 0 52px;margin:-296px 0 0 -427px}
.modal-popup.scrollpop .modal-wrap{top:20px;margin-top:0 !important;margin-bottom:20px}
.modal-popup.scrollpop .dim{padding-bottom:40px}

/* video layer */
.pop_video button, .pop_video .msg{position:absolute;display:block;background:url("https://ssl.nexon.com/s2/game/baram/2019/event/0725_intro_435F728674B478EC/spr_layer_video.png") no-repeat;text-indent:-9999px;overflow:hidden}
.pop_video .btn_close{top:0;right:0;width:45px;height:44px;background-position:-155px 0}
.pop_video .btn_hide_video{top:31px;right:77px;width:127px;height:16px}
.pop_video .msg{bottom:0;left:50%;width:401px;height:32px;background-position:0 -48px;margin-left:-200px}
.modal-wrap .frame_wrap{position:relative;width:100%;height:100%;background:#000}
.modal-wrap .frame_wrap iframe{width:100%;height:100%}

/* chanelling */
.naver #nav .btn_toggle, .naver #nav .nav_wrap{position:absolute;bottom:auto}
.naver #nav .nav_wrap{top:781px}
.naver #nav .btn_toggle{top:816px}
.naver .modal-popup{height:995px;overflow:hidden}