@charset "UTF-8";
/* reset style [start] */
html {min-width:1280px;}
html.noscroll{overflow:hidden}
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, em{font-family: '맑은 고딕", "Malgun gothic", "돋움", "dotum', sans-serif;font-weight:normal;font-size: 16px;;}
img,fieldset{border:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a{text-decoration:none}
a:focus, button:focus{outline: none}
.blind, legend{position:absolute; top:0; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden;text-indent:-9999px;}
button{border:0;cursor:pointer;*overflow:visible;vertical-align:middle;background:transparent}
::-webkit-input-placeholder {color:#bbbfc9;}
::-moz-placeholder {color:#bbbfc9;}
:-ms-input-placeholder {color:#bbbfc9;}
input:-moz-placeholder {color:#bbbfc9;}

/* common */
html, body {background-color: #2b073e;}
#wrap{position:relative;width:100%;min-width:1263px;max-width:2560px;margin:0 auto;overflow: hidden;opacity: 0;background-color: #2b073e;}
#header{position: absolute;top:0;width:100%;z-index: 100;}
#header h1 a, #header .util button, #header .util a, .btn, .menu, .menu li, .menu li a, .quick li a, .star1 span, .star2 span, .star_b, .star_b i {display:block;text-indent:-9999px;overflow:hidden;background:url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/spr_common.png") no-repeat}
#header h1{position:absolute;top:30px;margin-left:22px;z-index: 100;display:none;}
#header h1 a{width:181px;height:75px;display:block;}

#header .util{position:absolute;top:30px;right:30px;width: 296px; z-index: 102; background-color: #2b073e;}
#header .util .btn_game{width:141px;height:81px;float: left; background-position: -131px -324px;}
#header .util ul{width:141px;float: right;overflow: hidden;}
#header .util li{float:left;width:41px;height: 47px;margin:5px 9px 0 0}
#header .util li a, #header .util li button{width: 100%;height: 100%;}
#header .util .btn_today{width:141px;height: 15px; margin-top:6px; }
#header .util .btn_tw{margin-right: 0}
#header .util .btn_home a{background-position:-286px -328px}
#header .util .btn_fb a{background-position:-336px -328px}
#header .util .btn_tw a{background-position:-386px -328px}
#header .util .btn_today button{background-position:-292px -382px}
#header .util .btn_game:hover{background-position-x:-489px }
#header .util .btn_home a:hover{background-position-x:-644px}
#header .util .btn_fb a:hover{background-position-x:-694px}
#header .util .btn_tw a:hover{background-position-x:-744px}
.w_s #header .util {width: 141px;background-color:transparent}

#header .util .btn_event0 {width:322px; height:96px; background-position: 0 -444px; position: absolute; top:87px; left:-12px; }
#header .util .btn_event0:hover{background-position: -344px -444px;}
.w_s #header .util .btn_event0 {width:167px; height:112px;top:159px;background-position: -702px -444px;}
.w_s #header .util .btn_event0:hover {background-position: -900px -444px;}


/* lnb */
#lnb {
    position: absolute;
    top: 0;
    left: -120px;
    width: 120px;
    height: 100%;
    z-index: 100;
    transition: all 0.5s ease;
}

.fixed #lnb {
position: fixed;
}

#lnb{
background: rgba(0,0,0,0.65);
box-sizing: border-box;
}

#lnb a, #lnb button {
display: block;
width: 100%;
height: 100%;
display: block;
text-indent: -99999px;
overflow: hidden;
background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/spr_lnb.png") no-repeat;
}

#lnb .lnb_wrap {
position: relative;
height: 100%;
padding-top: 21px;
}

#lnb p a {
width: 112px;
height: 48px;
background-position: -10px -314px;
margin:0 0 32px 8px;
}


#lnb .lnb_wrap li {
height: 132px;
margin-bottom:24px;
}

#lnb .lnb_wrap .lnb1 a {
background-position: -10px -10px;
}

#lnb .lnb_wrap .lnb1.on a, #lnb .lnb_wrap .lnb1 a:hover {
background-position: -150px -10px;
}

#lnb .lnb_wrap .lnb2 a {
background-position: -290px -10px;
}

#lnb .lnb_wrap .lnb2.on a, #lnb .lnb_wrap .lnb2 a:hover {
background-position: -10px -162px;
}

#lnb .lnb_wrap .lnb3 a {
background-position: -150px -162px;
}

#lnb .lnb_wrap .lnb3.on a, #lnb .lnb_wrap .lnb3 a:hover {
background-position: -290px -162px;
}

#lnb .btn_toggle {
position: absolute;
top: 0;
right: -50px;
display: block;
text-indent: -99999px;
overflow: hidden;
width: 50px;
height: 50px;
}

#lnb .close{
background-position: -430px -10px;
}

#lnb .close:hover {
background-position: -430px -80px;
}

#lnb .open{
background-position: -430px -150px;
}

#lnb .open:hover {
background-position: -430px -220px;
}

#lnb.show {
left: 0;
}

#footer {position: absolute;left:0;bottom:0;width: 100%;height: 42px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/copyright.png") no-repeat center top;z-index: 100;text-indent: -9999px;overflow: hidden;}
.menu{position: absolute;width: 1918px;height:92px;left: 50%; margin-left:-959px; top:30px;background-position: center -76px;}
.menu ul{margin:0 auto;width: 846px; height: 100%;}
.menu li{width:384px; height: 100%; }
.menu li a {display: block;width: 100%;height: 100%;}
.menu li.l1{float: left;}
.menu li.l2{float: right;}
.menu li.l1 {background: none;}
.menu li.l1 a {background-position:-537px -76px;}
.menu li.l1 a:hover {background-position-y:-202px;}
.menu li.l2{ background-position:-999px -202px}

.quick {position: fixed;right:40px;top:50%;margin-top:-60px;width: 118px;height:280px;z-index: 50;transition:margin .3s cubic-bezier(0.215, 0.610, 0.355, 1);box-sizing: border-box;}
.quick li {position: relative;width: 100%;height: 161px;margin-bottom:10px}
.quick li a {display: block;width: 100%;height: 100%;}
.quick li.q1 a {background-position:-514px -571px;}
.quick li.q1 a:hover, .quick li.q1.active a {background-position:-670px -571px;}
.quick li.top {display: none;}
.quick li.top a {background-position:-514px -742px;}
.quick li.top a:hover {background-position:-670px -742px;}
.sticky .quick {margin-top:-140px} 
.h_s .quick {top:60%;}

#container {position: relative;width: 100%;}
.section {position: relative;width: 100%;text-align: center;z-index: 5;}
.obj {position: absolute;left: 50%;display: block;z-index: 3;}
.cha {position: absolute;left: 50%;display: block;z-index: 3;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/spr_cha.png") no-repeat;}
.con {position: absolute;left: 50%;display: block;z-index: 5;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/spr_contents.png") no-repeat;}

#section0 {height: 835px;}
.tit_sec {position: absolute;left:50%;top:179px;display: block;margin-left:-448px; display: block; width: 892px;height: 350px;z-index: 7;}
.mtit span, .mtxt span, .t_dot span {display: block;position: absolute;background-image: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/spr_title.png");background-repeat: no-repeat;}
.mtt1 {top:0;left:54px;width: 245px;height: 250px;background-position: 0 0;}
.mtt2 {top:0;left:269px;width: 131px;height: 164px;background-position: -265px 0;}
.mtt3 {top:0;left:430px;width: 134px;height: 164px;background-position: -426px 0;}
.mtt4 {top:0;left:562px;width: 133px;height: 164px;background-position: -572px 0;}
.mtt5 {top:128px;left:692px;width: 25px;height: 35px;background-position: -722px -128px;}
.mtt6 {top:145px;left:305px;width: 101px;height: 124px;background-position: 0 -301px;}
.mtt7 {top:145px;left:404px;width: 99px;height: 124px;background-position: -110px -301px;}
.mtt8 {top:145px;left:504px;width: 99px;height: 124px;background-position: -214px -301px;}
.mtt9 {top:145px;left:625px;width: 102px;height: 124px;background-position: -335px -301px;}
.mtt10 {top:145px;left:728px;width: 99px;height: 124px;background-position: -451px -301px;}

.mtt11 {bottom:158px;right:0;width: 173px;height: 91px;background-position: 0 bottom;}

.mtt12 {top:64px;left:45px;width: 33px;height: 49px;background-position: -331px -577px;}
.mtt13 {top:107px;left:67px;width: 28px;height: 23px;background-position: -393px -577px;}
.mtt14 {top:73px;left:730px;width: 32px;height: 28px;background-position: -275px -577px;}

.t_dot {position: absolute;left:-30px;top:20px;width: 100px;height: 85px;display: block;}
.dot1 {top:14px;left:0;width: 6px;height: 5px;background-position: -433px -578px;}
.dot2 {top:66px;left:26px;width: 6px;height: 5px;background-position: -433px -578px;}
.dot3 {top:48px;left:70px;width: 6px;height: 5px;background-position: -433px -578px;}
.dot4 {top:32px;left:29px;width: 4px;height: 5px;background-position: -451px -578px;}
.dot5 {top:82px;left:29px;width: 4px;height: 5px;background-position: -451px -578px;}

.mtx1 {top:286px;left:275px;width: 46px;height: 24px;background-position: -1px -476px;}
.mtx2 {top:286px;left:333px;width: 72px;height: 24px;background-position: -59px -476px;}
.mtx3 {top:286px;left:416px;width: 122px;height: 24px;background-position: -142px -476px;}
.mtx4 {top:286px;left:550px;width: 72px;height: 24px;background-position: -276px -476px;}

.mtx5 {top:277px;left:201px;width: 59px;height: 53px;background-position: -490px -575px;}
.mtx6 {top:277px;left:636px;width: 59px;height: 53px;background-position: -578px -575px;}

.star2 span {position: absolute;left:50%;width: 6px;height: 6px;z-index: 10;background-position: -844px -585px;}
.st_s1 {top:486px;margin-left:-745px;}
.st_s2 {top:680px;margin-left:-918px;}
.st_s3 {top:1016px;margin-left:-1058px;}
.st_s4 {top:1158px;margin-left:-918px;}
.st_s5 {top:1640px;margin-left:-831px;}
.st_s6 {top:1852px;margin-left:-974px;}

.st_s7 {top:264px;margin-left:523px;}
.st_s8 {top:287px;margin-left:1189px;}
.st_s9 {top:484px;margin-left:795px;}
.st_s10 {top:744px;margin-left:523px;}
.st_s11 {top:893px;margin-left:881px;}
.st_s12 {top:767px;margin-left:1189px;}
.st_s13 {top:1391px;margin-left:1034px;}
.st_s14 {top:1802px;margin-left:764px;}

.star1 span {position: absolute;left:50%;width: 107px;height: 107px;z-index: 10;background-position: -895px -707px;}
.st1 {top:514px;margin-left:-926px;}
.st2 {top:1081px;margin-left:-860px;transform: scale(0.7);}
.st3 {top:1562px;margin-left:-1137px;}

.st4 {top:427px;margin-left:455px;transform: scale(0.7);}
.st5 {top:642px;margin-left:1038px;transform: scale(0.7);}
.st6 {top:819px;margin-left:719px;}
.st7 {top:1242px;margin-left:880px;transform: scale(0.7);}

.star_b {position: absolute;left:50%;width: 107px;height: 107px;z-index: 10;background-position: -895px -585px;}
.star_b i {position: absolute;left:0;top:0;width: 100%;height: 100%;background-position: -1019px -585px;}
.st_b1 {top:182px;margin-left:-690px;}
.st_b2 {top:196px;margin-left:706px;}

.bg0 {display: block;position: absolute;left:50%;top:0;margin-left:-1280px;width: 2560px;height: 2589px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/bg0.jpg") no-repeat center top;}
.light1 {display: block;position: absolute;left:50%;top:0;margin-left:-1280px;width: 2560px;height: 2589px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/light1.jpg") no-repeat center top;}
.ring {display: block;position: absolute;left:50%;top:0;margin-left:-1280px;width: 2560px;height: 2589px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/bg_ring.png") no-repeat center top;}
.ribbon1 {top:1261px;left:auto;right:50%;margin-right:543px;width: 605px;height: 254px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/ribbon1.png") no-repeat right top;}
.ribbon2 {top:529px;margin-left:230px;width: 733px;height: 307px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/ribbon2.png") no-repeat;}
.ribbon3 {top:1349px;margin-left:263px;width: 726px;height: 573px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/ribbon3.png") no-repeat;}
.ribbon4 {top:488px;left:auto;right:50%;margin-right:72px;width: 701px;height: 410px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/ribbon4.png") no-repeat right top;}
.box_t {top:487px;margin-left:-759px;width: 1498px;height: 827px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/box_top.png") no-repeat;}
.box_i {top:868px;margin-left:-730px;width: 1460px;height: 707px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/box_inner.png") no-repeat;}
.box_f {top:1156px;margin-left:-729px;width: 1458px;height: 1344px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/box_front.png") no-repeat;}
.box_sd {top:2074px;margin-left:-645px;width: 2024px;height: 893px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/box_shadow.png") no-repeat;}

.cha1 {top:652px;margin-left:191px;width: 506px;height: 462px;background-position: 0 0;}
.cha2_b {top:898px;margin-left:249px;width: 554px;height: 510px;background-position: -597px 0;}
.cha2_f {top:898px;margin-left:249px;width: 554px;height: 510px;background-position: -1195px 0;}
.cha3 {top:687px;margin-left:-705px;width: 423px;height: 527px;background-position: 0 -638px;}
.cha4_b {top:955px;margin-left:-660px;width: 306px;height: 480px;background-position: -597px -638px;}
.cha4_f {top:955px;margin-left:-660px;width: 306px;height: 480px;background-position: -1040px -638px;}
.cha5 {top:552px;margin-left:-202px;width: 369px;height: 471px;background-position: -1520px -638px;}
.cha6 {top:582px;margin-left:27px;width: 296px;height: 643px;background-position: 0 -1341px;}
.cha7 {top:578px;margin-left:-405px;width: 550px;height: 700px;background-position: -506px -1341px;}

.light2 {top:741px;margin-left:-367px;width: 734px;height: 384px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/light2.png") no-repeat;}

#section1 {height: 555px;z-index: 6;}
.stit1 {top:26px;margin-left:-167px;width: 339px;height: 40px;background-position: 0 -137px;}
.ribbon2_1 {top:0;margin-left:-345px;width: 690px;height: 92px;}
.rb_l {left:auto;right:50%;width: 345px;height: 92px;background-position: right top;}
.rb_r {left:50%;width: 345px;height: 92px;background-position: left top;}

.player {position: absolute;left:50%;top:82px;margin-left:-420px;z-index: 10; width: 840px;height: 509px;background: url("https://lwi.nexon.com/tales/2020/1119_thanks_5240CA7917018F75/bg_player.png") no-repeat;}
.player iframe {width: 840px;height: 473px;}

#section2 {height: 1199px;}
.cha2_1 {top:-152px;margin-left:-242px;width: 496px;height: 774px;background-position: -1151px -1341px;}
.cha2_2 {top:440px;margin-left:-721px;width: 223px;height: 219px;background-position: -1742px -1341px;z-index: 10;}
.cha2_3 {top:46px;margin-left:426px;width: 145px;height: 137px;background-position: -1742px -1672px;}
.box1 {top:322px;margin-left:-201px;width: 402px;height: 608px;background-position: -426px -263px;}
.box2 {top:210px;margin-left:-540px;width: 341px;height: 427px;background-position: 0 -263px;}
.box3 {top:210px;margin-left:199px;width: 341px;height: 427px;background-position: 0 -263px;}
.txt1 {top:322px;margin-left:-201px;width: 402px;height: 608px;background-position: -473px -900px;}
.txt2 {top:210px;margin-left:-540px;width: 341px;height: 427px;background-position: 0 -900px;}
.txt3 {top:210px;margin-left:199px;width: 341px;height: 427px;background-position: 0 -1347px;}
#section2 .btn {position: absolute;left:50%;width: 226px;height: 54px;background-position: 0 -571px;}
#section2 .btn:hover {background-position: -244px -571px;}
.btn_event1 {top:936px;margin-left:-112px;}
.btn_event2 {top:645px;margin-left:-482px}
.btn_event3 {top:645px;margin-left:257px}