@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:"Noto Sans KR", "맑은 고딕","Malgun Gothic","돋움","dotum",sans-serif;font-size:13px;color:#876969;background:#000;line-height:1}
input,textarea,button,select{font-size:inherit;font-family:"Noto Sans KR", "맑은 고딕","Malgun Gothic","돋움","dotum",sans-serif;color:#876969}
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:#876969}
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}
button{border:0;cursor:pointer;outline:0} 

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

/* common */
#header button, #header a, .btn_top, #nav a span, .section .btn_more{display:block;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_btn.png");text-indent:-99999px;overflow:hidden}
.section .object_wrap{position:absolute;left:0;width:100%}
.section .object_wrap div, .section .object_wrap span{position:absolute}
.gnbWrapper{min-width:1280px !important}
.section .text_wrap span{opacity:0}
.section.active .text_wrap span{opacity:1}
.section .text_wrap .new{top:0;left:0;width:251px;height:30px}
.section.active .text_wrap .new span{transform:translateX(0);transition:opacity 300ms linear, transform 500ms ease;transition-delay:500ms}
.section .text_wrap .new .box{top:0;left:140px;width:111px;height:100%;background-position:-140px 0;transform:translateX(-50px)}
.section .text_wrap .new .txt{top:3px;left:0;width:134px;height:27px;background-position:0 -3px;transform:translateX(50px)}
.section .update{left:0;height:0;opacity:0;border-top:1px solid;border-bottom:1px solid;overflow:hidden}
.section.active .update{height:43px;opacity:1;transition:opacity 0ms linear, height 300ms ease}
.section .update span{top:11px;height:23px;transform:translateY(-23px)}
.section.active .update span{transform:translateY(0);transition:all 300ms ease}
.section .text_wrap .small span{left:0;height:19px}
.section .ribbon{position:absolute;top:0;left:0;width:100%}
.section .ribbon p{position:relative;max-width:1720px;height:341px;margin:0 auto;overflow:hidden}
.section .ribbon p span{position:absolute;top:0;right:0;width:341px;height:0;opacity:0}
.section.active .ribbon p span{opacity:1;height:341px;transition:opacity 300ms linear, height 500ms ease;transition-delay:800ms}
.content .subtitle, .content .headline{overflow:hidden}
.content .subtitle span, .content .headline span{top:0;height:100%}
.content .subtitle span{transform:translateY(87px)}
.content .headline span{transform:translateY(162px)}
.content.active .headline span{transform:translateY(0);transition:transform 500ms ease}
.content.active .subtitle span{transform:translateY(0);transition:transform 300ms ease}
.content.active .subtitle span:nth-child(1){transition-delay:750ms}
.content.active .subtitle span:nth-child(2){transition-delay:800ms}
.content.active .subtitle span:nth-child(3){transition-delay:850ms}
.content.active .subtitle span:nth-child(4){transition-delay:900ms}
.content.active .subtitle span:nth-child(5){transition-delay:950ms}
.content.active .subtitle span:nth-child(6){transition-delay:1000ms}
.content.active .subtitle span:nth-child(7){transition-delay:1050ms}
.content.active .subtitle span:nth-child(8){transition-delay:1100ms}
.section.active .headline span:nth-child(1){transition-delay:830ms}
.section.active .headline span:nth-child(2){transition-delay:930ms}
.section.active .headline span:nth-child(3){transition-delay:1030ms}
.section.active .headline span:nth-child(4){transition-delay:1130ms}
.content .bg_box{position:absolute;left:50%;width:1720px;height:0;margin-left:-860px}
.content.active .bg_box{transition:height 1s ease}
.content .bg_box span{position:absolute;bottom:0;left:0;width:100%;height:100%;transform:translateY(100px)}
.content.active .bg_box span{transform:translateY(0);transition:transform 1s ease}
.content .strong span{left:0;height:30px}
.content .descript span{transform:translateY(-15px)}
.content.active .descript span{transform:translateY(0);transition:opacity 300ms linear, transform 300ms ease}
.section .btn_more{position:absolute;left:430px;width:428px;height:134px;opacity:0}
.content2.active .btn_more, .event.active .btn_more{opacity:1;transform:translateY(0);transition:opacity 300ms linear, transform 500ms ease}

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

/* nav */
#nav{position:absolute;top:1100px;left:0;width:100%;height:164px;z-index:101;transition:height 150ms ease, padding 150ms ease;padding-top:10px}
#nav .bg_nav{position:absolute;top:0;left:0;width:100%;height:100%;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_nav.png") center bottom no-repeat;padding-bottom:72px}
#nav a span{position:absolute}
#nav .nav_wrap{position:relative;height:100%}
#nav ul{width:1048px;height:100%;overflow:hidden;margin:0 auto;padding-right:235px}
#nav li{float:left;height:100%;margin:0 35px}
#nav li a{position:relative;display:block;height:100%}
#nav li .txt{top:40px;left:0;width:100%;height:85px}
#nav li .light{top:0;left:50%;width:308px;height:149px;background-position:-992px -467px;opacity:0;margin-left:-154px;transition:opacity 300ms ease}
#nav a:hover .light{opacity:1}
#nav .nav1{width:262px}
#nav .nav2{width:262px}
#nav .nav3{width:313px}
#nav .nav1 .txt{background-position:0 -709px}
#nav .nav2 .txt{background-position:-334px -709px}
#nav .nav3 .txt{background-position:-667px -709px}
#nav .btn_ost{position:absolute;left:50%;top:0;width:235px;height:100%;background:#45bcb6;background-color:rgba(69,188,182,1);margin-left:432px}
#nav .btn_ost .txt{top:25px;left:28px;width:188px;height:96px;background-position:-1112px -679px}
#nav .btn_ost:hover .txt{background-position:-1112px -806px}
#nav .btn_ost .bg{top:0;left:0;width:100%;height:100%;background-position:-1365px -381px;opacity:0;transition:opacity 300ms ease}
#nav .btn_ost:hover .bg{opacity:1}
.fixed #nav{position:fixed;top:0;height:94px;padding-top:0}
.fixed #nav li .light{display:none}
.fixed #nav li .txt{height:21px}
.fixed #nav .nav1{width:354px;margin:0 55px 0 5px}
.fixed #nav .nav2{width:193px;margin-right:54px}
.fixed #nav .nav3{width:120px}
.fixed #nav .nav1 .txt{background-position:-5px -836px}
.fixed #nav .nav2 .txt{background-position:-484px -836px}
.fixed #nav .nav3 .txt{background-position:-801px -836px}
.fixed #nav .nav1:hover .txt, .fixed #nav .on .nav1 .txt{background-position:-5px -887px}
.fixed #nav .nav2:hover .txt, .fixed #nav .on .nav2 .txt{background-position:-484px -887px}
.fixed #nav .nav3:hover .txt, .fixed #nav .on .nav3 .txt{background-position:-801px -887px}
.fixed #nav .btn_ost .txt{left:18px;width:205px;height:44px;background-position:-1355px -726px}
.fixed #nav .btn_ost:hover .txt{background-position:-1355px -851px}
.fixed #nav .btn_ost .bg{background-position:-1365px -580px}

/* header */
#header{position:absolute;top:0;left:0;width:100%;z-index:100}
#header h1{position:absolute;top:25px;left:30px}
#header h1 a{width:239px;height:102px}
#header .util{position:absolute;top:40px;right:38px;padding-left:217px}
#header .util ul{overflow:hidden}
#header .util li{float:left;margin-left:3px}
#header .util li a{width:41px;height:49px}
#header .util li .btn_home{background-position:-571px 0}
#header .util li .btn_fb{background-position:-615px 0}
#header .util li .btn_tw{background-position:-659px 0}
#header .util li .btn_home:hover{background-position:-571px -70px}
#header .util li .btn_fb:hover{background-position:-615px -70px}
#header .util li .btn_tw:hover{background-position:-659px -70px}
#header .util .btn_game{position:absolute;top:8px;left:0;width:213px;height:42px;background-position:-264px 0}
#header .util .btn_game:hover{background-position:-264px -60px}
#header .util .btn_today{width:142px;height:22px;background-position:-557px -147px;margin:5px 0 0 -6px}

/* intro */
.intro{height:1454px}
.intro .bg_section{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_intro.jpg") center top no-repeat}
.intro .object_wrap{top:0}
.intro .object_wrap span{opacity:0}
.intro.load .object_wrap span{opacity:1}
.intro .text_wrap span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_text_intro.png") no-repeat}
.intro .headline{width:606px}
.intro .headline span{width:100%;height:100%;transition:opacity 300ms linear, transform 500ms ease}
.intro .headline .thin span{transition-delay:800ms}
.intro .headline .normal span{transition-delay:1000ms}
.intro .headline .thick span{transition:opacity 300ms linear, transform 700ms ease;transition-delay:1100ms}
.intro .headline div{overflow:hidden}
.intro.load .headline div span{transform:translateY(0)}
.intro ._hleft{top:235px;left:-15px;height:350px}
.intro ._hleft .thin{top:0;left:18px;width:346px;height:67px}
.intro ._hleft .thin span{transform:translateY(67px);background-position:-18px 0}
.intro ._hleft .normal{top:78px;left:0;width:579px;height:94px}
.intro ._hleft .normal span{transform:translateY(94px);background-position:0 -78px}
.intro ._hleft .thick{top:172px;left:2px;width:601px;height:176px}
.intro ._hleft .thick span{transform:translateY(176px);background-position:-2px -174px}
.intro ._hright{top:679px;left:664px;height:241px}
.intro ._hright span{transform:translateY(-83px);transition:opacity 300ms linear, transform 500ms ease}
.intro ._hright .thin{top:0;left:257px;width:346px;height:67px}
.intro ._hright .thin span{background-position:-257px -449px;transform:translateY(-67px)}
.intro ._hright .normal{top:160px;left:0;width:266px;height:64px}
.intro ._hright .normal span{background-position:0 -609px;transform:translateY(-64px)}
.intro ._hright .thick{top:86px;left:292px;width:314px;height:155px}
.intro ._hright .thick span{background-position:-292px -535px;transform:translateY(-155px)}
.intro .center{top:233px;left:624px;width:257px;height:491px;z-index:1000}
.intro .center .box{top:0;left:0;width:100%;height:100%;background-position:-682px -259px;transform:scale(0)}
.intro.load .center .box{transform:scale(1);transition:transform 500ms ease}
.intro .center .txt{left:29px;width:202px;height:50px;transform:translateY(53px);transition:transform 500ms ease, opacity 300ms linear}
.intro.load .center .txt{transform:translateY(0)}
.intro .center ._t1{top:32px;background-position:-737px 0;transition-delay:300ms}
.intro .center ._t2{top:85px;background-position:-737px -53px;transition-delay:380ms}
.intro .center ._t3{top:140px;background-position:-737px -108px;transition-delay:460ms}
.intro .center ._t4{top:192px;background-position:-737px -160px;transition-delay:540ms}
.intro .center .calligraphy{top:236px;left:-331px;width:0;height:483px;background-position:0 -767px;transition:opacity 300ms linear, width 300ms ease;transition-delay:600ms}
.intro.load .center .calligraphy{width:885px}
.intro .char_wrap span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_char_intro.png") no-repeat;transition:opacity 500ms linear, transform 800ms cubic-bezier(0, 1, 1, 1)}
.intro .char_wrap ._c1{top:678px;left:-229px;width:740px;height:564px;background-position:-1062px -599px;transform:translateX(-100px);transition-delay:1.35s}
.intro .char_wrap ._c2{top:291px;left:-320px;width:872px;height:1163px;transform:translateX(-100px);transition-delay:1.5s}
.intro .char_wrap ._c3{top:391px;left:1259px;width:510px;height:766px;background-position:-1874px -397px;transform:translateX(100px);transition-delay:1.2s}
.intro.load .char_wrap span{transform:translateX(0)}

/* content1 */
.content1{height:1253px}
.content1 .bg_section{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_content1.jpg") center top no-repeat}
.content1 .char{position:absolute;top:-55px;left:-791px;width:1442px;height:1395px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_char_content1.png") no-repeat;z-index:1;opacity:0;transform:translateX(150px)}
.content1.active .char{transform:translateX(0);opacity:1;transition:opacity 300ms linear, transform 800ms cubic-bezier(0, 1, 1, 1);transition-delay:1.55s}
.content1 .text_wrap{top:203px;left:536px;width:700px;height:632px;z-index:1}
.content1 .text_wrap span, .content1 .ribbon span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_text_content1.png") no-repeat}
.content1 .text_wrap .subtitle{top:83px;left:1px;width:694px;height:87px}
.content1 .subtitle ._s1{left:0;width:88px;background-position:-1px -83px}
.content1 .subtitle ._s2{left:88px;width:90px;background-position:-89px -83px}
.content1 .subtitle ._s3{left:201px;width:84px;background-position:-202px -83px}
.content1 .subtitle ._s4{left:289px;width:85px;background-position:-290px -83px}
.content1 .subtitle ._s5{left:375px;width:87px;background-position:-376px -83px}
.content1 .subtitle ._s6{left:488px;width:85px;background-position:-489px -83px}
.content1 .subtitle ._s7{left:576px;width:85px;background-position:-577px -83px}
.content1 .subtitle ._s8{left:675px;width:19px;background-position:-676px -83px}
.content1 .text_wrap .headline{top:182px;left:0;width:700px;height:162px}
.content1 .headline ._h1{left:0;width:170px;background-position:0 -182px}
.content1 .headline ._h2{left:179px;width:165px;background-position:-179px -182px}
.content1 .headline ._h3{left:355px;width:165px;background-position:-355px -182px}
.content1 .headline ._h4{left:530px;width:170px;background-position:-530px -182px}
.content1 .text_wrap .update{top:344px;width:100%;border-color:#4CEDE5}
.content1.active .update{transition-delay:1250ms}
.content1 .update span{left:30px;width:641px;background-position:-32px -356px}
.content1.active .update span{transition-delay:1450ms}
.content1 .text_wrap .strong{top:462px;left:2px;width:655px}
.content1 .strong ._s1{top:0;width:290px;background-position:-2px -462px}
.content1 .strong ._s2{top:41px;width:655px;background-position:-2px -503px}
.content1.active .strong ._s1{transition-delay:1700ms}
.content1.active .strong ._s2{transition-delay:1750ms}
.content1 .text_wrap .small{top:557px;left:1px;width:635px}
.content1 .small ._s1{top:0;width:523px;background-position:-1px -557px}
.content1 .small ._s2{top:28px;width:251px;background-position:-1px -585px}
.content1 .small ._s3{top:56px;width:635px;background-position:-1px -613px}
.content1.active .small ._s1{transition-delay:1950ms}
.content1.active .small ._s2{transition-delay:2000ms}
.content1.active .small ._s3{transition-delay:2050ms}
.content1 .ribbon span{background-position:-759px 0}
.content1 .bg_box{bottom:60px}
.content1.active .bg_box{height:1193px}
.content1 .bg_box span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_box_content1.png") 0 100% no-repeat}

/* content2 */
.content2{height:1345px}
.content2 .bg_section{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_content2_v2.jpg") center top no-repeat}
.content2 .text_wrap{top:173px;left:-2px;width:537px;height:608px}
.content2 .text_wrap span, .content2 .ribbon span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_text_content2.png") no-repeat}
.content2 .text_wrap .subtitle{top:73px;left:6px;width:350px;height:85px}
.content2 .subtitle ._s1{width:85px;left:0;background-position:-6px -73px}
.content2 .subtitle ._s2{width:87px;left:86px;background-position:-92px -73px}
.content2 .subtitle ._s3{width:84px;left:177px;background-position:-183px -73px}
.content2 .subtitle ._s4{width:87px;left:263px;background-position:-269px -73px}
.content2 .text_wrap .headline{left:3px;top:182px;width:351px;height:162px}
.content2 .headline ._h1{left:0;width:168px;background-position:-3px -182px}
.content2 .headline ._h2{left:178px;width:173px;background-position:-181px -182px}
.content2 .update{top:344px;width:349px;border-color:#CA3C19}
.content2.active .update{transition-delay:1050ms}
.content2 .update span{left:17px;width:324px;background-position:-17px -356px}
.content2.active .update span{transition-delay:1250ms}
.content2 .text_wrap .strong{top:462px;left:5px;width:532px;height:30px}
.content2 .text_wrap .strong span{top:0;left:0;width:100%;height:100%;background-position:-5px -462px}
.content2.active .text_wrap .strong ._s1{transition-delay:1550ms}
.content2 .text_wrap .small{top:516px;left:4px;width:491px;height:92px}
.content2 .text_wrap .small ._s1{top:0;width:363px;background-position:-4px -516px}
.content2 .text_wrap .small ._s2{top:28px;width:443px;background-position:-4px -544px}
.content2 .text_wrap .small ._s3{top:73px;width:491px;background-position:-4px -589px}
.content2.active .text_wrap .small ._s1{transition-delay:1700ms}
.content2.active .text_wrap .small ._s2{transition-delay:1750ms}
.content2.active .text_wrap .small ._s3{transition-delay:1800ms}
.content2 .ribbon span{background-position:-659px 0}
.content2 .char_wrap span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_char_content2.png") no-repeat;opacity:0}
.content2 .char_wrap ._c1{top:118px;left:437px;width:716px;height:731px;transform:translate(100px, 0)}
.content2 .char_wrap ._c2{top:366px;left:982px;width:901px;height:642px;background-position:-1258px -758px;transform:translate(-100px, 0)}
.content2 .char_wrap ._c3{top:-30px;left:706px;width:575px;height:520px;background-position:-1584px 0;transform:translate(0, 100px)}
.content2 .char_wrap ._c4{top:705px;left:58px;width:996px;height:585px;background-position:0 -815px;transform:translate(0, -100px)}
.content2.active .char_wrap span{transform:translate(0,0);opacity:1;transition:opacity 300ms linear, transform 800ms cubic-bezier(0, 1, 1, 1)}
.content2.active .char_wrap ._c1{transition-delay:1.25s}
.content2.active .char_wrap ._c2{transition-delay:1.35s}
.content2.active .char_wrap ._c3{transition-delay:1.45s}
.content2.active .char_wrap ._c4{transition-delay:1.55s}
.content2 .bg_box{bottom:284px}
.content2.active .bg_box{height:1061px}
.content2 .bg_box span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_box_content2.png") 0 100% no-repeat}
.content2 .btn_more{top:1126px;background-position:0 -221px;transform:translateY(-30px)}
.content2 .btn_more:hover{background-position:-482px -221px}
.content2.active .btn_more{transition-delay:1.85s}

/* content3 */
.content3{height:3498px;background:#161B2F}
.content3 .container{height:420px}
.content3 .bg_content3{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_content3.jpg") center top no-repeat}
.content3 .title_wrap{top:95px}
.content3 .title_wrap span{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_title_content3.png") no-repeat;opacity:0}
.content3 .title_wrap .subtitle{top:0;left:261px;width:766px;height:54px;background-position:-167px 0;transform:translateY(20px)}
.content3 .title_wrap .h3{top:37px;left:94px;width:1107px;height:161px;background-position:0 -89px;transform:translateY(-20px)}
.content3.active .title_wrap span{opacity:1;transform:translateY(0);transition:opacity 300ms linear, transform 500ms ease}
.content3.active .title_wrap .h3{transition-delay:100ms}

/* event */
.event .bg_section{top:auto;height:0;bottom:0}
.event.active .bg_section{height:100%;transition:height 800ms ease}
.event .bg_cnt{position:absolute;left:0;width:100%;transform:translateY(50px);opacity:0}
.event.active .bg_cnt{transform:translateY(0);opacity:1;transition:opacity 400ms linear, transform 600ms ease;transition-delay:900ms}
.event .num{position:absolute;top:-119px;left:521px;width:238px;height:239px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/spr_number_event.png") no-repeat;transform:scale(0)}
.event.active .num{transform:scale(1);transition:transform 350ms ease;transition-delay:600ms}
.event .btn_more{transform:translateY(30px)}
.event.active .btn_more{transition-delay:1.15s}

/* event1 */
.event1{height:920px}
.event1 .bg_event1{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_event1.png") center bottom no-repeat}
.event1 .bg_cnt{top:84px;height:522px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_cnt_event1.png") no-repeat}
.event1 .btn_more{top:624px;background-position:0 -385px}
.event1 .btn_more:hover{background-position:-482px -385px}

/* event2 */
.event2{height:1009px}
.event2 .bg_event2{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_event2.png") center bottom no-repeat}
.event2 .bg_cnt{top:113px;height:586px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_cnt_event2.png") no-repeat}
.event2 .num{background-position:-281px 0}
.event2 .btn_more{top:712px;background-position:-927px 0}
.event2 .btn_more:hover{background-position:-927px -221px}

/* event3 */
.event3{height:1150px;z-index:1}
.event3 .bg_event3{background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_event3.png") center bottom no-repeat}
.event3 .bg_cnt{top:113px;height:667px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_cnt_event3.png") no-repeat}
.event3 .num{background-position:-562px 0}
.event3 .btn_more{top:785px;background-position:-1px -568px}
.event3 .btn_more:hover{background-position:-483px -568px}
.event3 .char{position:absolute;top:125px;left:799px;width:821px;height:926px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_char_event3.png") no-repeat}
.event3 .bg_footer{position:absolute;bottom:0;right:50%;width:0;height:547px;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/bg_footer.png") right top no-repeat;margin-right:-960px}
.event3.active .bg_footer{width:1920px;transition:width 700ms ease;transition-delay:500ms}
.event3 .copyright{position:absolute;bottom:65px;left:50%;width:459px;height:18px;text-indent:-9999px;overflow:hidden;background:url("https://ssl.nexon.com/s2/game/tales/event/2019/0919_event_21792F642A9505E8/copyright.png") no-repeat;margin-left:-230px}

/* top btn */
.btn_top{display:none;position:fixed;bottom:32px;right:8px;width:76px;height:77px;background-position:-1px -120px;z-index:99}
.btn_top:hover{background-position:-104px -120px}

@keyframes boxText1{
    0%{transform:translateY(212px)}
    20%{transform:translateY(160px)}
    25%{transform:translateY(160px)}
    45%{transform:translateY(108px)}
    50%{transform:translateY(108px)}
    55%{transform:translateY(53px)}
    75%{transform:translateY(53px)}
    95%{transform:translateY(0)}
    100%{transform:translateY(0)}
}