@font-face {
  font-family: 'Nanum Square';
  font-style: normal;
  font-weight: 400;
  src: url(http://baram.nexon.com/Content/Fonts/NanumSquareR.eot);
  src: local('Nanum Square Regular'),
       local('NanumSquareR'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareR.eot?#iefix) format('embedded-opentype'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareR.woff2) format('woff2'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareR.woff) format('woff'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareR.ttf) format('truetype');
}
@font-face {
  font-family: 'Nanum Square';
  font-style: bold;
  font-weight: 700;
  src: url(http://baram.nexon.com/Content/Fonts/NanumSquareB.eot);
  src: local('Nanum Square Bold'),
       local('NanumSquareB'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareB.eot?#iefix) format('embedded-opentype'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareB.woff2) format('woff2'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareB.woff) format('woff'),
       url(http://baram.nexon.com/Content/Fonts/NanumSquareB.ttf) format('truetype');
}
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;	border: 0; font-size: 100%;	vertical-align: baseline; font-family: 'Nanum Square', sans-serif;}
a{text-decoration: none;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {	border-collapse: collapse;	border-spacing: 0;}
caption{visibility:hidden;width:0;height:0;font-size:0;line-height:0;}
legend {visibility:hidden;width:0;height:0;font-size:0;line-height:0;position:absolute;left:0;top:-999999px;}
button{border:none;padding:0;cursor:pointer;}

body{overflow:hidden;}
#wrap{width:100%; height:100%; float:left; position:relative;}
#header{position:absolute; top:0; left:0; width:100%; z-index:121;}
#header h1{float:left; margin-left: 44px; margin-top:36px;}
#header ul{float:right; }
#header ul li{float:left; margin-right:20px; padding-right:20px; margin-top:43px;}
#header ul li:first-child{background:url("https://ssl.nexon.com/s2/game/Baram/2016/event/full_1125/list_dot.png") right center no-repeat; margin-top:40px;}

#footer{position:fixed; bottom:0; left:0; width:100%; background:url("https://ssl.nexon.com/s2/game/Baram/2016/event/full_1125/footer.png") center top no-repeat; height:59px; z-index:1000;}
.first_section{width:100%; height:900px; position:relative; overflow:hidden;background:url("https://ssl.nexon.com/s2/game/Baram/2016/event/full_1125/section_bg.jpg") no-repeat center center/cover; background-color:#000;}
.befor_title{width:100%; text-align:center; position:absolute; left:0; top:35%; z-index:100;}
.after_title{width:100%; text-align:center; position:absolute; left:0; top:35%; z-index:112;display:none;}
.section_bg{width:100%; height:100%; background:url("") no-repeat center center/cover; z-index:111; position:fixed; top:0; left:0;}
.section_bg img{width:100%; height:100%;}
.scroll_mark{position:fixed; bottom:100px; width:100%; text-align:center; z-index:1000;}

.second_section{width:100%; min-height:100%; z-index:120; position:absolute; background-color:#000; top:100%; left:0;}
.bg_01{position:fixed; width:100%; height:100%; background:url("") no-repeat center center/cover; left:0; top:0px; z-index:80;}
.bg_01 img{width:100%;}
.bg_02{position:fixed; width:100%; height:100%; background:url("") no-repeat center center/cover; left:0; top:120px; z-index:90;}
.bg_02 img{width:100%;}
.bg_03{position:fixed; width:100%; height:100%; background:url("") no-repeat center center/cover; left:0; top:120px; z-index:100;}
.bg_03 img{width:100%;}
.effect{position:fixed; width:100%; height:558px; bottom:0; left:0; z-index:90;}
.effect02{position:absolute; width:100%; height:100%; bottom:0; left:0; z-index:90;}
.effect03{position:absolute; width:100%; height:100%; bottom:0; left:0; z-index:90;}

.cont_wrap{width:1236px; margin:0 auto; position:relative; z-index:91;}
.not_time{position:absolute; top:307px; }
.no_login{position:absolute; top:364px; }
.no_char{position:absolute; top:300px; }
.game_start_btn{position:absolute; left:426px; bottom:-90px;}
.join_layer{position:absolute; top:10px; width:1236px; left:0;}
.join_wrap{position:relative; width:100%; height:100%; float:left;}
.phone_change{position:absolute; right:391px; bottom:191px;}
.reload_btn{position:absolute; right:254px; bottom:191px;}
.join_btn{position:absolute; left:416px; bottom:0;}

.join_com{position:absolute; top:286px; width:1236px; left:0; }
.join_com_wrap{position:relative; width:100%; height:100%; float:left;}

.third_section{width:100%; min-height:100%; z-index:120; position:absolute; background:url("https://ssl.nexon.com/s2/game/Baram/2016/event/full_1125/section3_bg.jpg") #000 top center no-repeat; top:100%; left:0;}
.aside{position:absolute; left:0; top:170px; color:#fff; z-index:500; width:175px;}
.aside li{margin:28px 0; float:left; width:200%; margin-left:-100%; opacity:0;}

.phone_num1{position:absolute; left:319px; top:426px; font-size:30px; color:#846e79;}
.phone_num2{position:absolute; left:404px; top:432px; font-size:30px; color:#846e79;}
.phone_num3{position:absolute; left:490px; top:426px; font-size:30px; color:#846e79;}
.phone_num4{position:absolute; left:510px; top:273px; font-size:30px; color:#846e79;}
.phone_num5{position:absolute; left:595px; top:279px; font-size:30px; color:#846e79;}
.phone_num6{position:absolute; left:680px; top:273px; font-size:30px; color:#846e79;}
.no_phone_num{position:absolute; left:319px; top:425px;}
.phone_dot{position:absolute; top:447px;}

.agree_txt{position:absolute; left:430px; bottom:119px;}
.agree_txt input{position:absolute; left:-999999999999999999999px; top:0;}
.sel_server{width:275px; height:38px; background:url("https://ssl.nexon.com/s2/game/Baram/2016/event/full_1125/select_bg.png") no-repeat; position:absolute; left:295px; top:294px;}
.sel_char{width:275px; height:38px; background:url("https://ssl.nexon.com/s2/game/Baram/2016/event/full_1125/select_bg.png") no-repeat; position:absolute; left:669px; top:294px;}
.sel_txt{width:100%; height:100%; line-height:100%; float:left; position:relative;}
.select_wrap span{float:left; width:100%; text-align:center;line-height:34px; color:#fff; font-size:18px; cursor:pointer;}
.select_wrap select{position:absolute; left:-99999999999999px;}
.select_wrap ul{width:269px; position:absolute; left:0; top:35px; line-height:30px; font-size:18px; border:3px solid #000; z-index:100; display:none;}
.select_wrap ul li{width:100%; float:left; color:#987f7f; text-align:center; background-color:#2f161c;}
.select_wrap ul li a{display:inline-block; float:left; width:100%; text-align:center; color:#987f7f;}
.select_wrap ul li a:hover{color:#fff;}
.custom_select_rel{position:absolute; right:0; bottom:0}