@charset "utf-8";
/* reset style [start] */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0} 
body,input,textarea,select,button,table{font-family: Malgun Gothic, Dotum, sans-serif;font-weight:300;}
img,fieldset{border:0;vertical-align: top;}
ul,ol{list-style:none}
table{border-collapse:collapse;border-spacing:0}
em,address{font-style:normal}
a{text-decoration:none}
a:hover,a:active,a:focus{text-decoration:none}
html {-webkit-text-size-adjust:none;}
.blind, legend, caption{position:absolute;left:-1000%; top:0; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden;text-indent:-10000px} /* 숨김 */
button{border:0;cursor:pointer;*overflow:visible;vertical-align:top;background:transparent;outline: none;}

/* common */
html, body {background-color:#fff;}
#wrap{position:relative;width:100%;min-width:1280px;max-width:2560px;margin:0 auto;overflow: hidden;opacity: 0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/bg_con1.png') center 1088px no-repeat}
.screen {position:fixed;left:0;top:0;width:100%;height:100%;z-index:100000;background-color:#fff;opacity: 0.5;transform: scale(1.5)}

.gnbWrapper{min-width: 1280px !important}
#header{position: absolute;top:0;width: 100%;z-index: 300;opacity: 0}
#header h1 {position: absolute;top:20px;left:25px;width:142px;height:69px;display: none}
#header h1 a{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/logo.png") no-repeat}
#header .util{position: absolute;top:26px;right: 16px;height: 21px}
#header .util li{width:24px;height:100%;float:left;}
#header .util li a,#header .util li button{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_util.png") no-repeat}
#header .util li.btn_game{width: 75px;margin-right: 21px}
#header .util li.btn_home{margin-right: 14px}
#header .util li.btn_fb{margin-right: 15px}
#header .util li.btn_tw{margin-right: 16px}
#header .util li.btn_home a{background-position-x: -96px}
#header .util li.btn_fb button{background-position-x: -135px}
#header .util li.btn_tw button{background-position-x: -175px}
#header .util li.btn_hide_today button{background-position-x: -216px}
#header .util li a:hover,#header .util li button:hover{background-position-y: -70px}

.quick{position: fixed;top:50%;right: -160px;height: 303px;width: 160px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_rnb.png") no-repeat;margin-top:-210px;z-index: 1;transition: right .5s ease}
.quick ul{position: absolute;width: 116px;left: 32px;top:48px;}
.quick li{width: 100px;height: 34px;margin-bottom: 10px}
.quick .q2{height:66px }
.quick .q3{margin-bottom:15px}
.quick li button{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_rnb.png") no-repeat}
.quick .q1 button{background-position: -212px -48px}
.quick .q2 button{background-position: -212px -92px}
.quick .q3 button{background-position: -212px -168px}
.quick .q4 button{background-position: -212px -217px}
.quick li button:hover{background-position-x: -414px}

.menu{position: fixed;top:0;left: 50%;height: 88px;width: 1369px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_menu.png") 0 -4px no-repeat;margin-left:-684px;z-index: 3;transform: scaleY(0);transform-origin: center 0;transition: transform .1s ease}
.menu ul{position: absolute;width: 1038px;left: 50%;top:0;height: 100%;margin-left:-519px;}
.menu li{height: 100%;margin-right: 1px;float: left}
.menu .m1{width:180px }
.menu .m2{width:198px }
.menu .m3{width:137px }
.menu .m4{width:161px }
.menu .m5{width:136px }
.menu .m6{width:220px }
.menu li a{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_menu.png") 0 -164px no-repeat}
.menu li.active a, .menu li a:hover{background-position-y:-284px }
.menu .m1 a{background-position-x: -165px}
.menu .m2 a{background-position-x: -346px}
.menu .m3 a{background-position-x: -545px}
.menu .m4 a{background-position-x: -683px}
.menu .m5 a{background-position-x: -845px}
.menu .m6 a{background-position-x: -982px}
.show .menu{transform: scaleY(1);}
.show .quick{right: 0;}

#footer{position: absolute;left:50%;bottom:52px;margin-left:-130px;width:261px;height:13px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/copy.png') no-repeat;text-indent: -100000px;}
.section{position:relative;width:100%;margin:0 auto}
.inner{position:relative;width:1140px;height: 100%;margin:0 auto}
.back span{position: absolute;left: 50%;}
.back .con{position: absolute;width:1780px;height: 6614px;top:1096px;left: 50%;margin-left:-890px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/contents_all_new.png') no-repeat; }
.back .wave1{width:2560px;height: 1935px;top:1881px;margin-left:-1280px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/bg_con2.png') no-repeat; }
.back .wave2{width:2560px;height: 1878px;top:3093px;margin-left:-1280px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/bg_con3.png') no-repeat; }
.back .wave3{width:2560px;height: 2231px;top:4434px;margin-left:-1280px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/bg_con4.png') no-repeat; }
.back .wave4{width:2251px;height: 1469px;top:6619px;margin-left:-1280px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/bg_con5.png') no-repeat; }
.back .obj1{width:530px;height: 459px;margin-left:494px;top:1260px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/obj1.png') no-repeat;}
.back .obj2{width:2560px;height: 781px;margin-left:-1280px;top:2991px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/obj2.png') no-repeat;}
.back .obj3{width:558px;height: 794px;margin-left:-1023px;top:5262px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/obj3.png') -394px 0 no-repeat;}
.back .obj4{width:512px;height: 614px;margin-left:407px;top:5340px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/obj3.png') -1042px 0 no-repeat;}
.balloons span{background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/obj4.png') no-repeat;}
.balloons .bl1{width:269px;height: 328px;bottom:20px;margin-left:-872px}
.balloons .bl2{width:344px;height: 298px;background-position-x:-364px;bottom:364px;margin-left:-935px}
.balloons .bl3{width:308px;height: 505px;background-position-x:-741px;bottom:450px;margin-left:-767px}
.balloons .bl4{width:265px;height: 238px;background-position-x:-1225px;bottom:108px;margin-left:597px}
.balloons .bl5{width:482px;height: 602px;background-position-x:-1721px;bottom:364px;margin-left:484px}
.items span{background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/obj3.png') no-repeat;}
.items .it1{width:172px;height: 167px;top:3829px;margin-left:-815px;background-position: -185px -24px}
.items .it2{width:193px;height: 192px;top:4059px;margin-left:-1007px;background-position: 0 -256px}
.items .it3{width:194px;height: 193px;top:4408px;margin-left:-834px;background-position: -169px -614px}
.items .it4{width:198px;height: 197px;top:3806px;margin-left:745px;background-position: -1745px 0}
.items .it5{width:156px;height: 153px;top:4101px;margin-left:615px;background-position: -1617px -293px}
.items .it6{width:151px;height: 147px;top:4366px;margin-left:887px;background-position: -1887px -565px}
.blossoms{position: absolute;top: 0;left: 50%;margin-left: -2560px;width:2560px;z-index: 2}
.blossoms span{background-size: 100% 100%;display: block;position: absolute;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_cherry.png") no-repeat}
.blossoms .g1{width:57px;height: 29px;background-position:-85px -55px}
.blossoms .g2{width:46px;height: 32px;background-position:-149px -94px}
.blossoms .g3{width:42px;height: 33px;background-position:-77px -116px}
.blossoms .g4{width:39px;height: 26px;background-position:-47px -9px}
.blossoms .g5{width:35px;height: 21px;background-position:-150px 0px}
.blossoms .g6{width:41px;height: 14px;background-position:0px -27px}
.blossoms .g7{width:44px;height: 38px;background-position:-222px -63px}

.btn_event{position: absolute;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_button.png") no-repeat;width:137px;height: 186px}
.btn_event:hover{background-position-x: -160px}
#section0{height:1088px;overflow: hidden; }
.bg span{position: absolute;left: 50%}
.bg .sky{width: 2560px;height: 1088px;margin-left: -1280px;top:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/sky.jpg') center bottom no-repeat;}

.bg .castle{width: 2117px;height: 964px;margin-left: -1043px;bottom:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/castle.png') no-repeat}
.bg .cherry{width: 2560px;height: 1088px;margin-left: -1280px;top:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/cherry.png') center bottom no-repeat}
.bg .cherry_{width: 990px;height: 1002px;margin-left: 139px;bottom:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/cherry_.png') no-repeat}
.bg .front{width: 2560px;height: 1080px;margin-left: -1280px;bottom:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/front.png') center bottom no-repeat}
.bg .center{width: 669px;height: 738px;margin-left: -315px;bottom:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/center.png') no-repeat}
.bg .balloon{width: 155px;height: 133px;margin-left: -642px;top:72px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/balloon.png') no-repeat}
.bg .flag{width: 1133px;height: 687px;margin-right: -1280px;left:auto;right:50%;top:0;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/flag.png') 0 -62px no-repeat}
.bg .char span{background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_char.png') no-repeat;bottom:0;}
.bg .char .c1{width:412px;height: 455px;background-position-x:-844px;margin-left:-577px;}
.bg .char .c2{width:362px;height: 493px;background-position-x:-1565px;margin-left:192px;}
.bg .char .c3{width:168px;height: 217px;background-position:-632px -518px;margin-left:-89px;}
.bg .char .c4{width:207px;height: 212px;background-position-x:-619px;margin-left:-760px;bottom:121px;}
.bg .char .c5{width:274px;height: 389px;background-position-x:-1273px;margin-left:114px;}
.bg .char .c6{width:576px;height: 735px;margin-left:-781px;}
.bg .char .c7{width:596px;height: 701px;background-position-x:-1945px;margin-left:398px;}

.title{position: absolute;width: 1236px;height: 648px;top:41px;left: 50%;margin-left:-622px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/bg_title.png') no-repeat;}
.title span{position: absolute;left: 50%;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_title.png') no-repeat; }
.title .t1{width:668px;height: 171px;margin-left: -334px;top:30px;z-index: 1 }
.title .t2{width:212px;height: 186px;margin-left: -100px;top:156px;background-position-y: -401px }
.title .t3{width:436px;height: 135px;margin-left: -472px;top:165px;background-position-y: -614px }
.title .t4{width:425px;height: 135px;margin-left: 47px;top:165px;background-position:-519px -614px }
.title .t5{width:781px;height: 172px;margin-left: -406px;top:313px;background-position-y: -200px }
.title .t6{width:556px;height: 46px;margin-left: -276px;top:519px;background-position-y: -778px }

.btn_area{position: absolute;width: 1176px;height: 380px;bottom: 0;left: 50%;margin-left: -577px;}
.btn_area li{position: absolute;}
.btn_area .m1{width:171px;height: 364px;left: 0;top: 0}
.btn_area .m2{width:187px;height: 335px;left: 137px;top: 132px;z-index: 1}
.btn_area .m3{width:178px;height: 339px;left: 313px;top: 149px}
.btn_area .m4{width:163px;height: 294px;left: 678px;top: 173px}
.btn_area .m5{width:189px;height: 322px;left: 831px;top: 135px}
.btn_area .m6{width:189px;height: 360px;right: 0;top: 22px}
.btn_area li a{display: block;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_quick.png') no-repeat;width: 100%;height: 100%;text-indent: -100000px;overflow: hidden;}
.btn_area li a:hover{background-position-y:-454px }
.btn_area .m2 a{background-position-x: -217px}
.btn_area .m3 a{background-position-x: -432px}
.btn_area .m4 a{background-position-x: -698px}
.btn_area .m4 a:hover{background-position-y:-455px}
.btn_area .m5 a{background-position-x: -881px}
.btn_area .m6 a{background-position-x: -1117px}

#section1{height:909px;}
#section1 .btn_event{width: 372px;height: 45px;left: 109px;top:479px;}
#section1 .btn_event:hover{background-position:0 -60px}

#section2{height:1487px;}
#section2 .btn_event{height: 186px;right: 60px;top:129px;background-position-y: -142px}


#section3{height:1630px;}
#section3 .btn_event{right: 60px;top:210px;background-position-y: -350px}

#section4{height:909px;}
#section4 .btn_event{width: 452px;height: 45px;left: 52px;top:368px;background-position-x:-415px }
#section4 .btn_event:hover{background-position:-415px -60px}

#section5{height:789px;}
#section5 .btn_event{height: 166px;right: 90px;top:129px;background-position-y: -559px}

#section6{height:996px;}
#section6 .btn_event{right: 88px;top:109px;background-position-y: -350px}

.gif1{position: absolute;width: 218px;height: 202px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/gif1.gif') no-repeat;left:843px;top: 627px}
.gif2{position: absolute;width: 218px;height: 203px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/gif2.gif') no-repeat;left:583px;top: 848px}
.gif3{position: absolute;width: 225px;height: 233px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/gif5.gif') no-repeat;left:576px;top: 568px}
.gif4{position: absolute;width: 225px;height: 233px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/gif3.gif') no-repeat;left:833px;top: 569px}

/* common */
.modal_pop button, .modal_pop a, .modal_pop .noti span{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_layer.png") no-repeat}
.modal_pop{display:none;z-index:99999;position:fixed;top:0;left:50%;width:100%;min-width:1280px;width:100%;height:100%;min-height:768px;margin:0 0 0 -50%}
.modal_pop .modal_wrap{z-index:99990;position:absolute;top:50%;left:50%;}
.modal_pop .modal_wrap .modal_btn {position: absolute;left:0;bottom:140px;width: 100%;text-align: center;}
.modal_pop .btn_close{position:absolute;right: 0px;top:-57px;width:92px;height: 42px;background-position: -188px 0 }
.modal_pop .btn_close:hover{background-position: -514px 0 }
#layerVod .modal_wrap{width: 1180px;height: 704px;}
#layerVod .btn_hide{position:absolute;right: 92px;top:-57px;width:188px;height: 42px;}
#layerVod .btn_hide:hover{background-position-x: -326px}
#layerVod .vod{position: absolute;width: 100%;height: 670px;left:0;top:0;background-color: #000}

#layerVod .noti{position: absolute;width: 100%;height: 15px;left:0;bottom:0;}
#layerVod .noti span{background-position-y:-126px;width:384px;height: 100%;display: inline-block; }
#layerVod .noti a{width: 140px;height: 100%;background-position: -384px -126px;display: inline-block;}
#layerVod .noti a:hover{background-position-y: -159px}
#layerMap .modal_wrap{width: 1140px;height: 900px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/layer_map.png') no-repeat}
#layerMap .btn_close{background-position-y:-57px }

.dim{display:none;z-index:99998;position:fixed;top:-50%;left:-50%;width:1000%;height:1000%;background:#000;opacity:0.85;filter:alpha(opacity=85);}
.pop .modal_pop{position: absolute;}

.npc span{position: absolute;width: 68px;height: 93px;}
.npc span:after{content: '';width:68px;height: 93px;display: block;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/ico_npc_over.png') no-repeat;transform: scale(0);transform-origin: center bottom;transition: transform .2s ease}
.npc span:hover:after,
.npc span.active:after{transform: scale(1);}
.npc span i{position: absolute;width: 32px;height: 42px;background: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/ico_npc.png') no-repeat;bottom:-1px;left: 19px;z-index: 2}
.npc .n1{left:545px;top:360px;}
.npc .n2{left:625px;top:362px}
.npc .n3{left:581px;top:374px;}
.npc .n4{left:701px;top:320px;}
.npc .n5{left:391px;top:499px;}
.npc .n6{left:863px;top:278px;}
.npc .n7{left:185px;top:309px;}
.npc .n8{left:303px;top:438px;}
.npc .n9{left:415px;top:278px;}
.npc .n10{left:675px;top:406px;}
.npc .n2 i{background-position-x:-32px }
.npc .n3 i{background-position-x:-64px}
.npc .n4 i{background-position-x:-95px}
.npc .n5 i{background-position-x:-128px}
.npc .n6 i{background-position-x:-160px}
.npc .n7 i{background-position-x:-192px}
.npc .n8 i{background-position-x:-224px}
.npc .n9 i{background-position-x:-256px}
.npc .n10 i{background-position-x:-256px}
.npc .n2:after{background-position-x:-68px }
.npc .n3:after{background-position-x:-136px}
.npc .n4:after{background-position-x:-204px}
.npc .n5:after{background-position-x:-272px}
.npc .n6:after{background-position-x:-340px}
.npc .n7:after{background-position-x:-408px}
.npc .n8:after{background-position-x:-476px}
.npc .n9:after{background-position-x:-544px}
.npc .n10:after{background-position-x:-612px}
.blue .n1{left:566px;top:114px;}
.blue .n2{left:675px;top:122px}
.blue .n3{left:372px;top:195px;}
.blue .n4{left:245px;top:408px;}
.green .n1{left:983px;top:245px;}
.green .n2{left:874px;top:189px}
.green .n3{left:1037px;top:293px;}
.green .n4{left:734px;top:467px;}
.green .n5{left:664px;top:501px;}
.green .n6{left:593px;top:534px;}
.green .n7{left:515px;top:569px;}
.blue span i{background-position-y:-43px }
.green span i{background-position-y:-84px }
.blue span:after{background-position-y:-93px }
.green span:after{background-position-y:-186px }
.location{position: absolute;width: 1061px;height: 154px;bottom: 0;left: 31px}
.location li{width: 100%;height: 25px;display: block;background-image: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/location.png');background-repeat:  no-repeat;}
.location li.active,
.location li:hover{background-image: url('https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/location_over.png');}
.location ul{position: absolute;top:0 }
.location .pink{left: 0;width:210px }
.location .pink._2{left: 224px }
.location .blue{left: 476px;width:110px }
.location .green{left: 777px;width:150px }
.location .green._2{left: 946px }
.location .pink._2 li{background-position-x:-224px }
.location .blue li{background-position-x:-476px }
.location .green li{background-position-x:-777px }
.location .green._2 li{background-position-x:-946px }
.location .n1,
.location .n6{background-position-y:5px }
.location .n2,
.location .n7{background-position-y:-21px }
.location .n3,
.location .n8{background-position-y:-46px }
.location .n4,
.location .n9{background-position-y:-71px }
.location .n5{background-position-y:-96px }


@media screen and (min-width: 2560px) {
.quick {right:50% !important;margin-right:-1280px;}
}

/* lnb */

.lnb {position: absolute;left:0;top:0;width: 120px;height:100%;z-index: 101;background-color:#5175bb;}
.lnb .inner {width:100%;height: 100%;}
.lnb ul {height: 600px;}
.lnb li {height: 136px;text-indent:-9999px;overflow:hidden}
.lnb .lnb1 {height: 157px}
.lnb li a,.lnb button{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0311_event_dgjlkfdjyg43/spr_lnb.png") no-repeat}
.lnb .lnb0 {height: 50px;margin:20px 0 40px 0;}
.lnb .lnb0 a,.lnb .lnb0 a:hover, .lnb .lnb0.active a {background-position: 0 0 !important;}
.lnb .lnb1 a {background-position-y: -158px;}
.lnb .lnb2 a {background-position-y: -315px;}
.lnb .lnb3 a {background-position-y: -451px;}

.lnb li a:hover, .lnb li.active a {background-position-x: -167px;}
.lnb button {position: absolute;right:-40px;top:0;width: 40px;height: 40px;}
.lnb .btn_lnb_close {background-position-y: -109px;}
.lnb .btn_lnb_open {display: none;background-position-y: -59px;}
.lnb .btn_lnb_close:hover,
.lnb .btn_lnb_open:hover {background-position-x: -70px}
.lnb_hide .btn_lnb_open {display: block;}
.lnb_hide .btn_lnb_close {display: none;} 
.sticky .lnb {position: fixed;}

