@charset "utf-8";
/* reset */
body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p {margin:0;padding:0;}
body,h1,h2,h3,h4,h5,h6,input,textarea,select,button {color:#000;font-size:14px;line-height:1.2;font-family: Malgun Gothic, '맑은 고딕', Arial, '돋움', Dotum, AppleGothic, sans-serif;font-weight:400;}
body  {word-break:break-all;word-wrap:break-word;}
*:first-child+html body {word-wrap:normal;}/* ie break-word bug(float box) */
table {border-collapse:collapse;border-spacing:0;}
ol,ul {list-style:none;}
img,fieldset {border:0 none;}
img,input,select {vertical-align:middle;}
input,select,textarea {color:#000;}
a:link,a:visited,a:hover,a:active {color:#000;text-decoration:none;} 
a:hover {text-decoration:none;}
h1 img,h2 img,h3 img,h4 img,h5 img,h6 img,div img,li img,dl img,p img {vertical-align:top;}
legend {display:block;position:absolute;left:-9999px;top:-9999px;width:0;height:0;overflow:hidden;font-size:0;line-height:0;}
caption {display:none;}
hr#null {display:block;} /* 에디터 선긋기 */
input.checkbox {vertical-align:middle;}
.button, label {cursor:pointer;font-weight:normal;}
textarea:focus {outline:none;background:none;background-color:#231812;}
textarea {resize:vertical;}
.hidden {display:block;position:absolute;left:-9999em;top:auto;overflow:hidden;width:1px;height:1px;}
.clear_both {clear:both !important;}
figcaption {color:#959595;font-size:13px;}
::-webkit-input-placeholder {color:#584333;}
::-moz-placeholder {color:#584333;}
:-ms-input-placeholder {color:#584333;}
input:-moz-placeholder {color:#584333;}
input.button {-webkit-appearance:none;}
button{-webkit-appearance:none;background-color:transparent;border:0;vertical-align:top;cursor:pointer;padding:0}
input.text {border-radius:0;-webkit-appearance:none;border:0;background-color:none;color:#fff;}
a {outline: none;}
/* html5 */
article, aside, details, figcaption, figure, footer, header,  menu, nav, section, summary {display:block;margin:0;padding:0;}
time {display:inline;}
html, body {height:100%;}

body {min-width:1280px;background-color:#0e1214;}
#wrapper{position:relative;width:100%;}

#header{position:absolute;width:100%;height:111px;left:0;top:0;right:0;min-width:1280px;z-index:2;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/bar_BG.png) center 0 no-repeat}
#header h1{position:absolute;left:53px;top:22px;width:106px;height:73px;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_jumong/logo.png) no-repeat;}
#header h1 a{width:100%;height:100%;display:block;text-indent:-1000000px}
#header .btn_start{position:absolute;right:42px;top:34px;width:286px;height:43px;text-indent:-100000px;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_jumong/util.png) -124px 0 no-repeat;}
#header .btn_start:hover{background-position:-124px -45px}
#header .btn_jump{position:absolute;right:0;top:134px;width:361px;height:143px;}
#header .btn_jump a{display:block;width:100%;height:100%;text-indent:-100000px;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_battlefield/btn_jump.png) no-repeat;}
#header .btn_jump a:hover{background-position:0 -150px;height:200px}

#header .util{position:absolute;right:366px;top:37px;width:auto;height:38px;}
#header .util li{width:38px;height:100%;margin-left:10px;float:left}
#header .util li a,
#header .util li button{display:block;width:100%;height:100%;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_jumong/util.png) no-repeat;text-indent:-100000px;}
#header .util li.btn_h a{background-position:0 -3px}
#header .util li.btn_c button{background-position:-48px -3px}
#header .util li.btn_h a:hover{background-position:0 -47px}
#header .util li.btn_c button:hover{background-position:-48px -47px}

#footer{position:absolute;bottom:39px;height:12px;width:100%;left:0;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_jumong/copy.png) center 0 no-repeat;text-indent:-100000px;}
.btn_top{position:fixed;right:82px;bottom:122px;width:72px;height:72px;text-indent:-100000px;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_jumong/btn_top.png) no-repeat;z-index:2;display:none;}
.btn_top:hover{background-position:0 -74px}
.sticky .btn_top{display:block;}

.sticky #header{position:fixed;}
.naver #lnb{display:block !important}
#lnb{position:fixed;left:52px;width:220px;height:345px;top:50%;margin-top:-172px;z-index:2;}
#lnb li{position:relative;width:100%;height:69px}
#lnb li a{position:absolute;left:0;top:0;width:100%;height:100%;text-indent:-100000px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/lnb_title.png) no-repeat;z-index:1}
#lnb li.m1 a{background-position:0 26px}
#lnb li.m2 a{background-position:0 -43px}
#lnb li.m3 a{background-position:0 -112px}
#lnb li.m4 a{background-position:0 -181px}
#lnb li.m5 a{background-position:0 -250px}

#lnb li.m1 a:hover,
#lnb li.m1.active a{background-position:-220px 26px}
#lnb li.m2 a:hover,
#lnb li.m2.active a{background-position:-220px -43px}
#lnb li.m3 a:hover,
#lnb li.m3.active a{background-position:-220px -112px}
#lnb li.m4 a:hover,
#lnb li.m4.active a{background-position:-220px -181px}
#lnb li.m5 a:hover,
#lnb li.m5.active a{background-position:-220px -250px}


#lnb li span{position:absolute;left:-52px;top:0;width:0;height:77px;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_battlefield/lnb_over.png) 0 bottom no-repeat;-webkit-transition: all .1s ease-out;transition: all .1s ease-out}
#lnb li:hover span,
#lnb li.active span{width:284px;}

.btn_banner{position:fixed;bottom:40px;left:52px;width:191px;height:auto;z-index:2;}
.btn_banner a{display:block;width:100%;height:100%;margin-bottom:5px}
.btn_banner a:hover{box-shadow:0px 0px 20px #1b0505;}

#container{position:relative;width: 100%;height:100%;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/bg_top.jpg) center top no-repeat;overflow:hidden;}
#container .video{position:absolute;top:0;left:0;width:100%;height:1800px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/bg_top.jpg) center 0 no-repeat;}
#container .video video {position: absolute;left:50%;top:0;width:1920px;margin-left:-960px;height:100%}
#container .video .cover {position:relative;width:100%;height:100%;background-color:#0c1313}
#container.loaded .video .cover{opacity:0;transition-duration:3s;}
#container .section{position:relative;width:100%;}

#container .inner{position:relative;width:1280px;height:100%;margin:0 auto}
#container .section#top{height:3324px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/bg_mid.png) center bottom no-repeat;}
#container .section#bottom{height:4206px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/bg_btm.jpg) center top no-repeat;}

#container #title.inner{height:638px;}
#container #weapon.inner{width:1398px;height:593px;}
#container #con1.inner{height:1169px}
#container #con2.inner{height:675px}
#container #con2-2.inner{height:250px;}
#container #con3.inner{height:643px}
#container #con4.inner{width:1431px;height:498px}
#container #con5.inner{width:1920px;height:1900px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/chain.png) center 200px no-repeat;}
#container #con6.inner{height:872px;}

#title h1{position:fixed;top:50%;margin-top:-275px;left:50%;margin-left:-525px;width:1051px;height:531px;overflow:hidden;z-index:1;background: url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/title.png) no-repeat;text-indent:-100000px;opacity:0;
  transform-origin: 50% 50%;
  transform: scale(1.2);
  transition: all 1s ease;
}
.loaded #title h1{opacity:1;transform:scale(1)}
.sticky #title h1,
.naver #title h1{position:absolute}
#weapon span{position:absolute;width:240px;height:296px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/weapon.png) no-repeat;opacity:0;transition:all 1s ease}
#weapon span.w1{background-position:0 0;top:0;left:0;transform:translate(-100px, 100px)}
#weapon span.w2{background-position:-285px 0;top:0;left:285px;transform:translate(-50px, 100px)}
#weapon span.w3{background-position:-592px 0;top:0;left:592px;transform:translate(0, 100px)}
#weapon span.w4{background-position:-888px 0;top:0;left:888px;transform:translate(50px, 100px)}
#weapon span.w5{background-position:-1158px 0;top:0;left:1158px;transform:translate(100px, 100px)}
#weapon span.w6{background-position:0 -296px;bottom:0;left:0;transform:translate(-100px, 100px)}
#weapon span.w7{background-position:-285px -296px;bottom:0;left:285px;transform:translate(-50px, 100px)}
#weapon span.w8{background-position:-592px -296px;bottom:0;left:592px;transform:translate(0, 100px)}
#weapon span.w9{background-position:-888px -296px;bottom:0;left:888px;transform:translate(50px, 100px)}
#weapon span.w10{background-position:-1158px -296px;bottom:0;left:1158px;transform:translate(100px, 100px)}
.sticky #weapon span{transform:translate(0, 0);opacity:1;animation:float 5s 2s infinite linear}
.sticky #weapon span.w1{transition-delay:.1s}
.sticky #weapon span.w2{transition-delay:.2s}
.sticky #weapon span.w3{transition-delay:.3s}
.sticky #weapon span.w4{transition-delay:.4s}
.sticky #weapon span.w5{transition-delay:.5s}
.sticky #weapon span.w6{transition-delay:.6s}
.sticky #weapon span.w7{transition-delay:.7s}
.sticky #weapon span.w8{transition-delay:.8s}
.sticky #weapon span.w9{transition-delay:.9s}
.sticky #weapon span.w10{transition-delay:1s}

.naver #weapon span{transform:translate(0, 0);opacity:1;animation:float 5s 2s infinite linear}
.naver #weapon span.w1{transition-delay:.1s}
.naver #weapon span.w2{transition-delay:.2s}
.naver #weapon span.w3{transition-delay:.3s}
.naver #weapon span.w4{transition-delay:.4s}
.naver #weapon span.w5{transition-delay:.5s}
.naver #weapon span.w6{transition-delay:.6s}
.naver #weapon span.w7{transition-delay:.7s}
.naver #weapon span.w8{transition-delay:.8s}
.naver #weapon span.w9{transition-delay:.9s}
.naver #weapon span.w10{transition-delay:1s}
@keyframes float{
    0%,50%,100%{transform:translateY(0)}
    25%{transform:translateY(10px)}
    75%{transform:translateY(-10px)}
}
#con1 span{position:absolute;width:987px;height:1219px;top:-50px;left:150px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_01.png) no-repeat;transform:translate(0, 100px);transition:all 1s ease;opacity:0}
#con1 span.show,
.naver #con1 span{transform:translate(0, 0);opacity:1}
#con1 .btn1{position:absolute;width:264px;height:41px;text-indent:-100000px;left:515px;top:308px;}

#con2 span{position:absolute;width:1197px;height:750px;top:-105px;left:75px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_02.png) no-repeat;transform:translate(0, 100px);transition:all 1s ease;opacity:0}
#con2 span.show,
.naver #con2 span{transform:translate(0, 0);opacity:1;z-index:1}

#con2-2 span{position:absolute;width:1121px;height:281px;top:-105px;left:75px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_02-2.png) no-repeat;}

#con3 span{position:absolute;width:959px;height:753px;top:-110px;left:0;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_03.png) no-repeat;transform:translate(0, 100px);transition:all 1s ease;opacity:0}
#con3 span.dragon{width:817px;height:964px;top:-165px;right:0;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/dragon_black.png) no-repeat;transform:translate(300%, 0);transition:all .5s linear;opacity:0}
#con3 span.show,
.naver #con3 span{transform:translate(0, 0);opacity:1}
#con3 span.dragon.show,
.naver #con3 span.dragon{transform:translate(100%, 0);}

#con4 span{position:absolute;width:1431px;height:498px;top:0;left:0;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_04.png) no-repeat;transform:translate(0, 100px);transition:all 1s ease;opacity:0}
#con4 span.show,
.naver #con4 span{transform:translate(0, 0);opacity:1}

#con5 span{position:absolute;width:1287px;height:2047px;top:-130px;left:50%;;margin-left:-620px;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_05.png) no-repeat;transform:translate(0, 100px);transition:all .3s cubic-bezier(0, 0.5, 0, 1.5);opacity:0}
#con5 span.show,
.naver #con5 span{transform:translate(0, 0);opacity:1}
#con5 div{position:absolute;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/rock.png) no-repeat;transition:all 1s ease}
#con5 div.r1{background-position:0 0;top:950px;left:50%;width:174px;height:224px;margin-left:-800px;}
#con5 div.r2{background-position:-277px -275px;top:1250px;left:50%;width:73px;height:113px;margin-left:-500px;}
#con5 div.r3{background-position:0 -388px;top:1370px;left:50%;width:174px;height:409px;margin-left:-800px;}
#con5 div.r4{background-position:-1338px -53px;top:1220px;right:50%;width:137px;height:286px;margin-right:-700px;}
#con5 div.r5{background-position:-1475px -394px;top:1570px;right:50%;width:131px;height:207px;margin-right:-800px;}
#con5 a{position:absolute;width:200px;height:57px;text-indent:-100000px;}
#con5 .btn1{left:535px;top:718px;}
#con5 .btn2{right:535px;top:718px;}
#con5 .btn3{left:845px;top:1248px;}
#con5 .btn4{left:545px;bottom:53px;z-index:100}
#con5 .btn5{right:515px;bottom:53px;z-index:100}

#con6 span{position:absolute;width:1121px;height:972px;top:-100px;left:0;background:url(https://ssl.nexon.com/s2/game/baram/2019/event/0131_immortal/contents_06.png) no-repeat;transform:translate(0, 100px);transition:all 1s ease;opacity:0}
#con6 span.show,
.naver #con6 span{transform:translate(0, 0);opacity:1}
#con6 .btn1{position:absolute;width:264px;height:41px;text-indent:-100000px;left:455px;top:258px;}

/* 영상 팝업*/
#dim{position:fixed;left:0;top:0;height:100%;width:100%;background:#000;z-index:102;display:none;opacity:0.85;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";}
#layer_vod{position:fixed;width:853px;top:50%;left:50%;margin:-400px 0 0 -430px;z-index:103;height:738px;display:none;-webkit-transition: all .5s ease-out;transition: all .5s ease-out;background:url(https://ssl.nexon.com/s2/game/baram/2018/event/1220_battlefield/layer_title.png) center 0 no-repeat}
#layer_vod #video{position:absolute;width:100%;height:480px;bottom:45px;left:0;background-color:#000;}
.ie9 #layer_vod{background:url(https://ssl.nexon.com/s2/game/baram/2018/event/0628_2run2run/movie_alert.jpg) center 0 no-repeat;}
#layer_vod .v_close{position:absolute;bottom:477px;right:-53px;}
#layer_vod .v_today{position:absolute;bottom:0;left:332px;}