@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:#000;}
#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/0408_event_dfgj43j823th/back.jpg") center 0 no-repeat}
.screen {position:fixed;left:0;top:0;width:100%;height:100%;z-index:100000;background-color:#000;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:20px;right: 20px;height: 74px}
#header .util li{width:41px;height:50px;float:left;margin-right: 4px}
#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/0408_event_dfgj43j823th/spr_util.png") no-repeat}
#header .util li.btn_game{width: 121px;height:74px;margin-right: 12px}
#header .util li.btn_tw{margin-right: 0}
#header .util li.btn_hide_today{position: absolute;bottom: 0;right: 0;width: 131px;height: 22px;margin-right: 0}
#header .util li.btn_home a{background-position-x: -133px}
#header .util li.btn_fb button{background-position-x: -178px}
#header .util li.btn_tw button{background-position-x: -223px}
#header .util li.btn_hide_today button,
#header .util li.btn_hide_today button:hover{background-position:-133px -52px}
#header .util li a:hover,#header .util li button:hover{background-position-y: -110px}
.quick{position: fixed;top:50%;right: 0;height: 164px;width: 118px;margin-top:-140px;display: none;z-index: 100}
.quick ul{position: absolute;width: 100%;left: 0;top:0;}
.quick li{width: 100%;height: 80px;margin-bottom: 2px} 
.quick button,
.quick a{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/spr_quick.png") no-repeat}
.quick .q2 a{background-position-y:-82px}
.quick li a:hover,
.quick li.active a{background-position-x: -138px}
.quick .btn_top{position: fixed;bottom:31px;right:24px;width:70px;height: 70px;background-position:-24px -224px  }
.quick .btn_top:hover{background-position-x: -162px}
.show .quick{display: block;}

#footer{position: absolute;left:50%;bottom:91px;margin-left:-170px;width:340px;height:15px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/copy.png') no-repeat;text-indent: -100000px;z-index: 3}
.section{position:relative;width:100%;margin:0 auto}
.inner{position:relative;width:1280px;height:100%;margin:0 auto}
.back{position: absolute;width: 100%;height:4842px;bottom: 0;left: 0;z-index: 1}
.back .img{position: relative;width:100%;height:100%;display:block;background:url("https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/back.png") center 0 no-repeat;}

#section0{height:1101px;}
#section0 .bg span{position: absolute;left: 50%;}
#section0 .bg .fog{background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/back2.jpg') center top no-repeat;width:2560px;height: 1374px;top:0;margin-left:-1280px }
#section0 .bg .char1{background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/char1.png') no-repeat;width:1568px;height: 1191px;top:134px;margin-left:-1032px }
#section0 .bg .char2{background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/char2.png') no-repeat;width:1194px;height: 1098px;top:0;margin-left:-6px }
#section0 .bg .stone i{position: absolute;left: 50%;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/spr_stone.png') no-repeat}
#section0 .bg .stone .s1{width: 103px;height: 118px;background-position: 0  -58px;top:671px;margin-left:-945px;}
#section0 .bg .stone .s2{width: 54px;height: 37px;background-position: -151px  -281px;top:894px;margin-left:-794px;}
#section0 .bg .stone .s3{width: 34px;height: 25px;background-position: -152px  -331px;top:944px;margin-left:-793px;}
#section0 .bg .stone .s4{width: 37px;height: 28px;background-position: -229px  -360px;top:973px;margin-left:-716px;}
#section0 .bg .stone .s5{width: 125px;height: 74px;background-position: -320px  -312px;top:925px;margin-left:-625px;}

#section0 .bg .stone .s6{width: 70px;height: 44px;background-position: -321px  -550px;top:956px;margin-left:579px;}
#section0 .bg .stone .s7{width: 42px;height: 34px;background-position: -577px  -471px;top:877px;margin-left:835px;}
#section0 .bg .stone .s8{width: 43px;height: 37px;background-position: -608px  -387px;top:793px;margin-left:866px;}
#section0 .bg .stone .s9{width: 69px;height: 54px;background-position: -548px  -308px;top:714px;margin-left:805px;}
#section0 .bg .stone .s10{width: 47px;height: 39px;background-position: -719px  -322px;top:728px;margin-left:977px;}
#section0 .bg .stone .s11{width: 91px;height: 59px;background-position: -734px  -241px;top:647px;margin-left:992px;}
#section0 .bg .stone .s12{width: 221px;height: 167px;background-position: -405px 0;top:384px;margin-left:1121px;}


.menu{position: absolute;bottom: 187px;width: 492px;height: 73px;margin-left: -246px;left:50%;}
.menu li{width:237px;height: 100%;float: left;}
.menu li a{display: block;width: 100%;height: 100%;text-indent: -100000px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/spr_button.png') no-repeat}
.menu .q1{margin-right: 18px}
.menu .q2 a{background-position-x:-255px }
.menu li a:hover{background-position-y:-100px }
.title{position: absolute;width: 803px;height: 795px;top:0;left: 50%;margin-left:-397px;}
.title span{position: absolute;left: 50%;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/spr_title.png') no-repeat; }
.title .t1{width:596px;height: 57px;top:0;background-position-x:-99px;margin-left: -298px  }
.title .t2{width:685px;height: 28px;top:174px;background-position:-55px -174px;margin-left: -342px  }
.title .t3{width:490px;height: 171px;top:238px;background-position:-154px -238px;margin-left: -245px  }
.title .t4{width:803px;height: 170px;top:409px;background-position-y:-409px;margin-left: -401px  }
.title .txt{width:524px;height: 264px;bottom: 0;background:transparent;margin-left: -137px}
.title .txt i{position: absolute;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/spr_txt.png') no-repeat;overflow: hidden;}
.title .txt .tt1{width:135px;height: 157px;left:0;top:86px;}
.title .txt .tt2{width:69px;height: 49px;background-position-x:-230px;left:20px;top:195px; }
.title .txt .tt3{width:69px;height: 39px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/no6.png') right 0 no-repeat;right:434px;top:156px; }
.title .txt .tt4{width:31px;height: 60px;background-position-x:-557px;left:152px;top:57px; }
.title .txt .tt5{width:99px;height: 62px;background-position-x:-682px;left:108px;top:94px; }
.title .txt .tt6{width:123px;height: 146px;background-position-x:-876px;left:83px;top:103px; }
.title .txt .tt7{width:70px;height: 23px;background-position-x:-1093px;left:145px;top:164px; }
.title .txt .tt8{width:46px;height: 264px;background-position-x:-1258px;left:208px;top:0; }
.title .txt .tt9{width:306px;height: 84px;background-position-x:-1398px;left:218px;top:65px; }
#section1{height:2314px;z-index: 2}
#section1 .bg span,
#section1 h2,
#section1 h3,
#section1 p{position: absolute;left: 50%;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/con1.png') no-repeat;}
#section1 .bg .name_en{width: 890px;height: 207px;background-position-x:-107px;margin-left:-546px;top:303px;z-index: 1}
#section1 .bg .name_ko{width: 268px;height: 88px;background-position:-120px -218px;margin-left:-533px;top:521px; }
#section1 .bg .char{width: 2418px;height: 1399px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/char3.png') no-repeat;margin-left:-406px;top:33px; }
#section1 i{position: absolute;left: 50%}
#section1 .line1{width: 507px;height: 494px;margin-left:-320px;top:50px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/line1.png') no-repeat}
#section1 .line2{width: 869px;height: 891px;margin-left:-996px;top:167px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/line2.png') no-repeat}
#section1 .line3{width: 579px;height: 639px;margin-left:-900px;top:837px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/line3.png') no-repeat}
#section1 .line4{width: 507px;height: 494px;margin-left:-1280px;top:185px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/line4.png') no-repeat}
#section1 .line5{width: 217px;height: 234px;margin-left:-1280px;top:953px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/line5.png') no-repeat}
#section1 .bg .light{width: 310px;height:298px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/dot_blue.png') no-repeat;top:626px;margin-left: -1060px}

#section1 h2{width: 100%;height: 164px;top:715px;background-position-y:-412px;left: 0;text-indent: -1000000px  }
#section1 h3{width: 639px;height: 460px;top:930px;background-position:-641px -627px;left: auto;right: 0;text-indent: -1000000px   }
.inner p{width: 639px;height: 460px;}
#section1 .gif1{left:0;top:930px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/lucian_skill_01.gif') no-repeat}
#section1 .gif2{left:0;top:1392px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/lucian_skill_02.gif') no-repeat}
#section1 .gif3{left:auto;right: 0;top:1392px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/lucian_skill_03.gif') no-repeat}
#section1 .gif4{left:0;bottom:0;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/lucian_skill_04.gif') no-repeat}
#section1 .gif5{left:auto;right: 0;bottom:0;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/lucian_skill_05.gif') no-repeat}

#section2{height:2528px;z-index: 2}
#section2 .bg span,
#section2 h2,
#section2 h3,
#section2 p{position: absolute;left: 50%;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/con2.png') no-repeat;}
#section2 .bg .name_en{width: 924px;height: 207px;background-position-x:-381px;margin-left:-256px;top:325px; }
#section2 .bg .name_ko{width: 259px;height: 87px;background-position:-1024px -216px;margin-left:383px;top:541px; }
#section2 .bg .char{width: 1800px;height: 1661px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/char4.png') no-repeat;margin-left:-1344px;top:-290px; }
#section2 h2{width: 100%;height: 164px;top:735px;background-position-y:-410px;left: 0;text-indent: -1000000px  }
#section2 h3{width: 639px;height: 460px;top:950px;background-position:-641px -625px;left: auto;right: 0 ;text-indent: -1000000px  }
#section2 .gif1{left:0;top:950px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/sivelin_skill_01.gif') no-repeat}
#section2 .gif2{left:0;top:1412px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/sivelin_skill_02.gif') no-repeat}
#section2 .gif3{left:auto;right: 0;top:1412px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/sivelin_skill_03.gif') no-repeat}
#section2 .gif4{left:0;top:1874px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/sivelin_skill_04.gif') no-repeat}
#section2 .gif5{left:auto;right: 0;top:1874px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/gif/sivelin_skill_05.gif') no-repeat}
#section2 .bg .fire1{width: 2555px;height: 862px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/fire1.png') no-repeat;left:auto;top:auto;bottom: 0;right: 50%;margin-right: -1280px }
#section2 .bg .fire2{width: 2376px;height: 1464px;background: url('https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/fire2.png') no-repeat;left:auto;top:auto;bottom: 0;right: 50%;margin-right: -1280px }
#section2 .bg .spark{width:2560px;top:auto;bottom:0;height: 2090px;margin-left: -1280px;background:transparent;}
#section2 .bg .spark .ptc {width:132px;height:120px;position:absolute;display: block;background:url("https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/ptc.png") no-repeat;background-size: 100% 100%;transform: rotate(0.01deg);left:auto;}

@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:rgba(42,42,45,.9);}
.lnb .inner {width:100%;height: 100%;}
.lnb ul {height: 550px;}
.lnb li {height: 143px;text-indent:-9999px;overflow:hidden}
.lnb li a,.lnb button{display: block;width: 100%;height: 100%;text-indent: -1000000px;background:url("https://lwi.nexon.com/tales/2021/0408_event_dfgj43j823th/spr_lnb.png") no-repeat}
.lnb .lnb0 {height: 50px;margin:20px 0 38px 0;}
.lnb .lnb1 {height: 160px;}
.lnb .lnb0 a,.lnb .lnb0 a:hover, .lnb .lnb0.active a {background-position: 0 -532px !important;}
.lnb .lnb2 a {background-position-y: -160px;}
.lnb .lnb3 a {background-position-y: -303px;}

.lnb li a:hover, .lnb li.active a {background-position-x: -202px;}
.lnb button {position: absolute;right:-40px;top:0;width: 40px;height: 40px;}
.lnb .btn_lnb_close {background-position:-130px -513px;}
.lnb .btn_lnb_open {display: none;background-position:-130px -463px;}

.lnb_hide .btn_lnb_open {display: block;}
.lnb_hide .btn_lnb_close {display: none;} 
.sticky .lnb {position: fixed;}