@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanskr.css);


body {	margin:0; background-color: #636363;}

.container {
  display: flex;
  width: 120vh;
  padding: 4% 2%;
  box-sizing: border-box;
  height: 60vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
 }

.box {
	position: relative;
  flex: 1;
  overflow: hidden;
  transition: .5s;
  margin: 0 0.7%;
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.5);
  line-height: 0;
}

.box > img {
  width: 100%;
  height: calc(100% - 0vh);
  -o-object-fit: cover;
     object-fit: cover;
  transition: .5s;
}

.box > span {
  font-size: 3vh;
  display: block;
  text-align: center;
  height: 10vh;
  line-height: 0.6;
}

.box:hover {
  flex: 1 1 40%;
}

.box:hover > img {
  width: 100%;
  height: 100%;
}


.text {position:absolute;bottom:20px; margin:0 auto; width:100%; float:center; z-index:11;}
.text_s {position:absolute;top:15px; width:100%; z-index:11;}
.text_big {position:absolute;top:50%; left:50%; margin-left:-442px; margin-top:-260px; z-index:11;}

.text_button {position:absolute;bottom:-40px; width: 100%; margin:0 auto; width:93%; float:center; z-index:11;}

.big_logo {font-size:10vh; font-family:SangSangRock; line-height:160%; color:rgba(255, 255, 255, 255);}
.m4_big {font-size:2vh; font-family:DNFForgedBlade300; line-height:160%; color:rgba(255, 255, 255, 0.9);}
.m4_small {font-size:1.3vh; font-family:DNFForgedBlade300; line-height:160%; color:rgba(255, 255, 255, 0.7);}
.m4_small2 {font-size:1.2vh; font-family:DNFForgedBlade300; line-height:160%; color:rgba(255, 255, 255, 0.7);}


/* 신라문화체 */
@font-face {
    font-family: 'Shilla_CultureB-Bold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/Shilla_CultureB-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

/* 정묵바위체 */
@font-face {
    font-family: 'SangSangRock';
    src: url('https://gcore.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/SangSangRockOTF.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* 워헤이븐 */
@font-face {
    font-family: 'WarhavenB';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/WarhavenB.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

/* 던파 연단된칼날 */
@font-face{
font-family:'DNFForgedBlade300';font-style:normal;font-weight:300;
src:url('//cdn.df.nexon.com/img/common/font/DNFForgedBlade-Light.otf')format('opentype')}

@font-face{
font-family:'DNFForgedBlade500';font-style:normal;font-weight:500;
src:url('//cdn.df.nexon.com/img/common/font/DNFForgedBlade-Medium.otf')format('opentype')}

@font-face{
font-family:'DNFForgedBlade700';font-style:normal;font-weight:700;
src:url('//cdn.df.nexon.com/img/common/font/DNFForgedBlade-Bold.otf')format('opentype')}



/* 원스토어 모바일POP체 */
@font-face {
    font-family: 'ONE-Mobile-POP';
    src: url('//bomcdn.bomgames.com/web_font/ONE-Mobile-POP.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* 원스토어 모바일고딕 제목체 */
@font-face {
    font-family: 'ONE-Mobile-Title';
    src: url('//bomcdn.bomgames.com/web_font/ONE-Mobile-Title.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* 원스토어 모바일고딕 본문체 */
@font-face {
    font-family: 'ONE-Mobile-Regular';
    src: url('//bomcdn.bomgames.com/web_font/ONE-Mobile-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.top_text { position:absolute;  width:100%; top:40px;  z-index:100000;} /* 대한민국 No.1</font> 무료 온라인 웹 게임 포털 */

.one_pop12 {font-size:12px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop13 {font-size:13px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop14 {font-size:14px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop15 {font-size:15px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop16 {font-size:16px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop18 {font-size:18px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop20 {font-size:20px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop26 {font-size:26px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop30 {font-size:30px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop40 {font-size:40px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop50 {font-size:50px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop60 {font-size:60px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop70 {font-size:70px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop80 {font-size:80px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop90 {font-size:90px; font-family:ONE-Mobile-POP; line-height:100%;}
.one_pop100 {font-size:100px; font-family:ONE-Mobile-POP; line-height:100%;}

.one_big11 {font-size:11px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big12 {font-size:12px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big13 {font-size:13px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big14 {font-size:14px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big15 {font-size:15px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big16 {font-size:16px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big18 {font-size:18px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big20 {font-size:20px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big26 {font-size:26px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big30 {font-size:30px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big40 {font-size:40px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big50 {font-size:50px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big60 {font-size:60px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big70 {font-size:70px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big80 {font-size:80px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big90 {font-size:90px; font-family:ONE-Mobile-Title; line-height:140%;}
.one_big100 {font-size:100px; font-family:ONE-Mobile-Title; line-height:140%;}

.one_sub11 {font-size:11px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub12 {font-size:12px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub13 {font-size:13px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub14 {font-size:14px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub16 {font-size:16px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub18 {font-size:18px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub20 {font-size:20px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub26 {font-size:26px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub30 {font-size:30px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub40 {font-size:40px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub50 {font-size:50px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub60 {font-size:60px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub70 {font-size:70px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub80 {font-size:80px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub90 {font-size:90px; font-family:ONE-Mobile-Regular; line-height:140%;}
.one_sub100 {font-size:100px; font-family:ONE-Mobile-Regular; line-height:140%;}


/* CSS Reset
-------------------------------------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, img, strong, small, dl, dt, dd, ol, ul, li, fieldset, form, input, button, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure, figcaption{margin:0; padding:0; font-size:100%;}
img, fieldset, button{border:0;}
img {vertical-align: top;}
article, aside, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
body, input, button, textarea, select, table, kbd{font-family:'Noto Sans KR','Malgun Gothic','맑은 고딕','돋움',dotum, sans-serif;}
ol, ul{list-style:none;}
a{text-decoration:none; cursor: pointer;}
button, label{cursor:pointer;}
button::-moz-focus-inner, input::-moz-focus-inner{padding:0; border:0;}
table{border-collapse:collapse; border-spacing:0;}
caption, legend{width:0; height:0; font-size:0; line-height:0; text-indent:-9999px; visibility:hidden;}
/*input[type="checkbox"] {margin:0 4px 3px 2px;padding:0;width:13px;height:13px;vertical-align: middle;}*/
input[type="submit"] {cursor: pointer;font-weight: bold;font-size: 14px;color: #fff;border: none;}
i, em {font-style: normal;}
h1, h2, h3, h4, h5, b, strong {font-weight: normal;}


/* 빙글빙글 */
img.infinite_rotating_play{
    animation: rotate_image 5s linear infinite;
    transform-origin: 50% 50%;
}
 
@keyframes rotate_image{
	100% {
    	transform: rotate(360deg);
    }
}
.mtt { position:absolute; left:50%; margin-left:-440px; top:7%; z-index:10;} /*중앙의 내용/버튼*/




/* 영상 반으로 */
.wrap{width:100%;}
.ym_bg{position:absolute;left:50%;top:0;width:2560px;margin-left:-1280px; z-index:1}
.ym_bg div{height:1000px}
.ym_bg .ym_con{display:block;width:100%}
.ym_bg_left,.ym_bg_right,.yc{position:absolute;top:0;width:2560px;}
.ym_bg_left{left:0;z-index:2;width:960px; overflow:hidden;}
.ym_bg_right{right:0;z-index:1}
.ym_h1{background:url(//bomcdn.bomgames.com/gc/landing/bg_01.jpg) no-repeat;}
.ym_b1{background:url(//bomcdn.bomgames.com/gc/landing/bg_02.jpg) no-repeat;}
/* 영상 반으로 */

/*
.neirong{width:1200px; margin:0px auto; left:50%; margin-left:-600px; position:absolute; top:0px; z-index:4}
*/
.neirong{width:1200px; margin:0px auto; left:50%; margin-left:-600px; position:absolute; top:50%; margin-top:-480px; z-index:4}

.neirong .jrgw{width:215px; height:56px; position:absolute; top:50px; right:109px;}
.neirong .wdxz{width:260px; height:92px; position:absolute; top:678px; left:220px;}
.neirong .lqlb{width:260px; height:92px; position:absolute; top:676px; right:230px;}
.neirong .start{width:160px; height:160px; position:absolute; top:615px;  left:520px; overflow:hidden;}
.neirong .start li a{display:block; width:160px; height:160px; line-height:500px;}



/* Reserved Class
-------------------------------------------------------------- */
.irPm{display:block; overflow:hidden; font-size:0px; line-height:0; text-indent:-9999px;}
.irWa{display:block; overflow:hidden; position:relative; width:100%; height:100%; z-index:-1;}
.blind{width:1px !important; height:1px !important; font-size:0 !important; line-height:0 !important; position:absolute !important; top:0 !important; left:-1000% !important; overflow:hidden !important;}
.show{display:block;}
.hide{display:none;}
.fL{float:left;}
.fR{float:right;}
.clear {clear: both;}
.clearFix{zoom:1;}
.clearFix:after{clear:both; display:block; content:'';}
.ellipsis {display: inline-block !important;overflow: hidden;vertical-align: middle;white-space: nowrap;text-overflow: ellipsis;-o-text-overflow: ellipsis}

/* Styles
-------------------------------------------------------------- */
html, body {background: #000; width:100%;height:100%;}
button {outline: none;border: none;background: none;}
a, button, label, input {background-repeat: no-repeat;outline: none;-webkit-tap-highlight-color:rgba(0,0,0,0);}
input[type="radio"], input[type="checkbox"] {display:none;}
input[type="text"], input[type="tel"] {
    border:0;
    background: transparent;
}

.age {position:absolute; right:20px; top:20px; z-index:10;} /*등급*/
.gohome {position:absolute; right:200px; top:20px; z-index:10;} /*홈으로*/

.top_bottom {position:absolute; right:40px; bottom:20px; z-index:10;} /*타게임광고*/


.footer{width:453px; height:280px; background:url(../images/copy2.png) no-repeat; text-indent:-9999px; position:absolute; left:10px; bottom:12px; z-index:10;} /* 카피라이터 주소까지몽땅*/

/*.footer{width:453px; height:111px; background:url(../images/copy2.png) no-repeat; text-indent:-9999px; position:absolute; left:10px; bottom:12px; z-index:10;}  카피라이터 주소까지몽땅*/
/*.footer{width:455px; height:36px; background:url(//jk.bomgames.com/teaser/images/copy.png) no-repeat; text-indent:-9999px; position:absolute; right:10px; bottom:12px; z-index:10;} 카피라이터*/

.top_logo2 {position:absolute; left:0px; top:10px; z-index:10;} /*로고*/

.top_logo {position:absolute; left:0px; top:37px; z-index:10; }  
.menu_left {position:absolute; left:0px; top:340px; z-index:1;}  
.side_left {position:absolute; left:60px; top:410px; z-index:1;}  
.side_right {position:absolute; right:60px; top:410px; z-index:1;}  



/* 소개박스 */
	* {margin:0;padding:0;}
	.game_ban input[id*="slide"] {display:none;}
	.game_ban .slidewrap {max-width:1200px;margin:0 auto;}
	.game_ban .slidelist {white-space:nowrap;font-size:0;overflow:hidden;position:relative;}
	.game_ban .slidelist > li {display:inline-block;vertical-align:middle;width:100%;transition:all .5s;}
	.game_ban .slidelist > li > a {display:block;position:relative;}
	.game_ban .slidelist > li > a img {width:100%;}
	.game_ban .slidelist label {position:absolute;z-index:10;top:50%;transform:translateY(-50%);padding:50px;cursor:pointer;}
	.game_ban .slidelist .textbox {position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);line-height:1.6;text-align:center;}
	.game_ban .slidelist .textbox h3 {font-size:36px;color:#fff;;transform:translateY(30px);transition:all .5s;}
	.game_ban .slidelist .textbox p {font-size:16px;color:#fff;opacity:0;transform:translateY(30px);transition:all .5s;}
	
	/* input에 체크되면 슬라이드 효과 */
	.game_ban input[id="slide01"]:checked ~ .slidewrap .slidelist > li {transform:translateX(0%);}
	.game_ban input[id="slide02"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-100%);}
	.game_ban input[id="slide03"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-200%);}

	/* input에 체크되면 텍스트 효과 */
	.game_ban input[id="slide01"]:checked ~ .slidewrap li:nth-child(1) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
	.game_ban input[id="slide01"]:checked ~ .slidewrap li:nth-child(1) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}
	.game_ban input[id="slide02"]:checked ~ .slidewrap li:nth-child(2) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
	.game_ban input[id="slide02"]:checked ~ .slidewrap li:nth-child(2) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}
	.game_ban input[id="slide03"]:checked ~ .slidewrap li:nth-child(3) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
	.game_ban input[id="slide03"]:checked ~ .slidewrap li:nth-child(3) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}

	/* 좌,우 슬라이드 버튼 */
	.slide-control > div {display:none;}
	.game_ban .left {left:10px;background:url('//hero.bomgames.com/teaser/images/left.png') center center / 100% no-repeat;}
	.game_ban .right {right:10px;background:url('//hero.bomgames.com/teaser/images/right.png') center center / 100% no-repeat;}
	.game_ban input[id="slide01"]:checked ~ .slidewrap .slide-control > div:nth-child(1) {display:block;}
	.game_ban input[id="slide02"]:checked ~ .slidewrap .slide-control > div:nth-child(2) {display:block;}
	.game_ban input[id="slide03"]:checked ~ .slidewrap .slide-control > div:nth-child(3) {display:block;}

	/* 페이징 */
	.slide-pagelist {text-align:center;padding:5px;}
	.slide-pagelist > li {display:inline-block;vertical-align:middle;}
	.slide-pagelist > li > label {display:block;padding:8px 30px;border-radius:30px;background:#ccc;margin:20px 10px;cursor:pointer;}
	.game_ban input[id="slide01"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(1) > label {background:#ff0000;}
	.game_ban input[id="slide02"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(2) > label {background:#ff0000;}
	.game_ban input[id="slide03"]:checked ~ .slidewrap .slide-pagelist > li:nth-child(3) > label {background:#ff0000;}
/* 소개박스 */




.inputbox
	{ 
	font-size:16pt; color:#757575; 
	font-family:Nanum Gothic;  
	}




	

textarea {
    resize:none;
    border:0;
    font-size:16px;
    color:#745200;
    padding:10px;
    outline: none;
}
a:hover{
    opacity:0.8;
}
#wrap {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    min-height:850px;
}
.section {
    height:100%;
    min-height:800px;
    background-size: cover;
    background-position: top center;
}
.section .inner{
    /* border:1px solid red; */
    width:1200px;
    margin:0 auto;
    text-align: center;
}
h2, h3, h4, button, footer, label span {
    text-indent: -99999px;
    margin:0 auto;
    display: inline-block;
}
label, i, input, img {
    vertical-align: top;
}

#section0 { position:relative; min-width:1200px; height:100%; background-position: bottom center; background-image: url(../images/bg_01.jpg);}
#section1 { position:relative; min-width:1200px; height:100%; background-position: bottom center; background-image: url(../images/bg_02.jpg);}
#section2 { position:relative; min-width:1200px; height:100%; background-position: bottom center; background-image: url(../images/bg_03.jpg);}
#section3 { position:relative; min-width:1200px; height:100%; background-position: bottom center; background-image: url(../images/bg_04.jpg);}


#header {
    position:fixed;
    width:100%;
    height:50px;
    z-index:9;
}
#header .inner {
    position:relative;
    width:100%;
    height:100%;
    min-width:600px;
    margin:0 auto;
}
#header .inner ul.header-right {
    position:absolute;
    top:93px;
    left:93px;
    width:200px;
    height:38px;
}
#header .inner ul.header-right > li {
    float:left;
    width:34px;
    height:38px;
    margin-left:14px;
}
#header .inner ul.header-right button, #header .inner ul.header-right a {
    background-position: center center;
    text-indent: -99999px;
}
#header .inner ul.header-right > li.btn-s{
    margin-top:95px;
}
#header .inner ul.header-right > li.btn-s #audio {
    display:none;
}
#header .inner ul.header-right > li.btn-s button.sound {
    text-indent: 0;
    width:40px;
    height:40px;
}
#header .inner ul.header-right > li.btn-s button.sound span {
    position:relative;
    float:left;
    width:5px;
    height:40px;
    margin-left:3px;
}
#header .inner ul.header-right > li.btn-s button.sound span i {
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:100%;
    background-color: #ff0000;
}
#header .inner ul.header-right > li.btn-s button.sound span i.bar01 {
    height:100%;
}
#header .inner ul.header-right > li.btn-s button.sound span i.bar02 {
    height:70%;
}
#header .inner ul.header-right > li.btn-s button.sound span i.bar03 {
    height:40%;
}
#header .inner ul.header-right > li.btn-s button.sound span i.bar04 {
    height:80%;
}
#header .inner ul.header-right > li.btn-c a {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/icon-c.png);
}
#header .inner ul.header-right > li.btn-f-go a {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/icon-f-go.png);
}
#header .inner ul.header-right > li.btn-y-go a {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/icon-y-go.png);
}
#header .inner ul.header-right > li.btn-share {
    position:relative;
}
#header .inner ul.header-right > li.btn-share > button {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/icon-share.png);
}
#header .inner ul.header-right > li.btn-share.on > button {
    background-color: rgba(255, 255, 255, 0.4);
}
#header .inner ul.header-right > li.btn-share ul {opacity:0; }
#header .inner ul.header-right > li.btn-share.on ul {opacity:1; transition:opacity 0.25s;}
#header .inner ul.header-right li a, #header .inner ul.header-right li button {
    display:inline-block;
    width:100%;
    height:100%;
}
#header .inner ul.header-right > li.btn-share ul {
    position:absolute;
    top:38px;
    left:0;
    background-color: rgba(255, 255, 255, 0.2);
}
#header .inner ul.header-right > li.btn-share ul li  {
    width:34px;
    height:38px;
}
#header .inner ul.header-right > li.btn-share ul li button  {
    width:100%;
    height:100%;
}
#header .inner ul.header-right > li.btn-share ul li.btn-f button  {
    opacity:0.5;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/icon-f.png);
}
#header .inner ul.header-right > li.btn-share ul li.btn-t button  {
    opacity:0.5;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/icon-t.png);
	
	
	
	
	
	
}
#bg-video {overflow: hidden;position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
#bg-video video {position: absolute;left: 0;top: 0; width:auto;height: 115%;}
#bg-video .bg-video-cover {position: absolute;left: 0;top: 0;width: 100%;height: 100%; background-color: rgba(0,0,0,0.1);}
#section0 .inner {
    position:relative;
    /* margin-top:400px; */
    height:600px;
	z-index:999;
}
#section0 .inner h2.logo {
    opacity:0;
    position:absolute;
    top:-130px;
    left:50%;
    margin-left:-600px;
    width:450px;
    height:208px;
    background-image: url(//hero.bomgames.com/teaser/images/logo_big.png);
}
#section0 .inner button.btn-play {
    opacity:0;
    position:absolute;
    top:220px;
    left:50%;
    width:107px;
    height:115px;
    margin-left:-43px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-play.png);
}
#section0 .inner .desc-main {
    text-indent: -99999px;
    height:198px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-main.png);
    margin-top:50px;
    background-position: center center;
    background-repeat: no-repeat;
}
#section0 .inner .desc-teaser {
    opacity:0;
    position:absolute;
    top:330px;
    left:50%;
    margin-left:-116px;
    text-indent: -99999px;
    width:232px;
    height:72px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-teaser.png);
    margin-top:50px;
    background-position: center center;
    background-repeat: no-repeat;
}


/* 사전예약버튼 우측 
#section0 .inner .btn-go-showcase {
    opacity:0;
    position:absolute;
    bottom:-420px;
    left:50%;
    margin-left:200px;
    width:440px;
    height:107px;
    display: inline-block;
    text-indent: -99999px;
    background-image: url(//hero.bomgames.com/teaser/images/btn_big.png);
}
*/

/* 사전예약버튼 중앙 */
#section0 .inner .btn-go-showcase {
    opacity:0;
    position:absolute;
    top:680px;
    left:50%;
    margin-left:-220px;
    width:440px;
    height:95px;
    display: inline-block;
    text-indent: -99999px;
    background-image: url(//hero.bomgames.com/teaser/images/btn_big.png);
}


#section0 .inner .btn-main-details {
    opacity:0;
    position:absolute;
    top:260px;
    left:50%;
    margin-left:-600px;
    width:1200px;
    height:440px;
    display: inline-block;
    text-indent: -99999px;
    background-image: url(//hero.bomgames.com/teaser/images/title_big.png);
}




#section0 .scroll {
    opacity:0;
    text-indent: -99999px;
    position:absolute;
    bottom:-300px;
    left:50%;
    margin-left:-45px;
    width:90px;
    height:80px;
    background-image: url(//hero.bomgames.com/teaser/images/scroll.png);
}

#section1 .scroll {
    opacity:0;
    text-indent: -99999px;
    position:absolute;
    bottom:-160px;
    left:50%;
    margin-left:-45px;
    width:90px;
    height:80px;
    background-image: url(//hero.bomgames.com/teaser/images/scroll2.png);
}
#section2 .scroll {
    opacity:0;
    text-indent: -99999px;
    position:absolute;
    bottom:-360px;
    left:50%;
    margin-left:-45px;
    width:90px;
    height:80px;
    background-image: url(//hero.bomgames.com/teaser/images/scroll2.png);
}

#section3 .scroll {
    opacity:0;
    text-indent: -99999px;
    position:absolute;
    bottom:-190px;
    left:50%;
    margin-left:-65px;
    width:90px;
    height:80px;
    background-image: url(//hero.bomgames.com/teaser/images/scroll2.png);
}

.load #section0 h2.logo {
    opacity:1;
    transition:opacity 0.9s;
}
.load #section0 button.btn-play {
    opacity:1;
    transition:opacity 0.5s 0.1s;
}
.load #section0 .desc-teaser {
    opacity:1;
    transition:opacity 0.5s 0.1s;
}
.load #section0 .btn-go-showcase, .load #section0 .btn-main-details {
    opacity:1;
    transition:opacity 0.5s 0.1s;
}
.load #section0 .scroll {
    opacity:1;
    transition:opacity 0.5s 1.2s;
    animation:downBul 1.5s infinite ease-in-out;
}
.load #section1 .scroll {
    opacity:1;
    transition:opacity 0.5s 1.2s;
    animation:downBul 1.5s infinite ease-in-out;
}
.load #section2 .scroll {
    opacity:1;
    transition:opacity 0.5s 1.2s;
    animation:downBul 1.5s infinite ease-in-out;
}
.load #section3 .scroll {
    opacity:1;
    transition:opacity 0.5s 1.2s;
    animation:downBul 1.5s infinite ease-in-out;
}


#section1 .inner {
    height:880px;
}
#section2 .inner {
    height:880px;
}
#section3 .inner {
    height:880px;
}


#section1 .inner .txt-showcase {
    position:relative;
    width:1240px;
    height:512px;
    margin:100px auto 30px;
}
#section2 .inner .txt-showcase {
    position:relative;
    width:1103px;
    height:512px;
    margin:0 auto 0px;
    /* background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-info4.png); */
}

#section3 .inner .txt-showcase {
    position:relative;
    width:1180px;
    height:660px;
    margin:0 auto 0px;
    /* background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-info4.png); */
}

#section1 .inner .txt-showcase ul {
    display: none;
}
#section2 .inner .txt-showcase ul {
    display: none;
}
#section3 .inner .txt-showcase ul {
    display: none;
}
#section1 .inner .txt-showcase a.location {
    position:absolute;
    text-indent: -99999px;
    top:305px;
    left:600px;
    width:80px;
    height:20ox;
}
#section2 .inner .txt-showcase a.location {
    position:absolute;
    text-indent: -99999px;
    top:305px;
    left:600px;
    width:80px;
    height:20ox;
}
#section3 .inner .txt-showcase a.location {
    position:absolute;
    text-indent: -99999px;
    top:305px;
    left:600px;
    width:80px;
    height:20ox;
}
#section1 .inner p {
    margin-bottom:45px;
}
#section2 .inner p {
    margin-bottom:45px;
}
#section3 .inner p {
    margin-bottom:45px;
}
#section1 .inner p button {
    width:335px;
    height:119px;
    margin-bottom:10px;
}
#section2 .inner p button {
    width:335px;
    height:119px;
    margin-bottom:10px;
}
#section3 .inner p button {
    width:335px;
    height:119px;
    margin-bottom:10px;
}
#section1 .inner p button.btn-premium-regi {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-user.png);
}
#section2 .inner p button.btn-premium-regi {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-user.png);
}
#section3 .inner p button.btn-premium-regi {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-user.png);
}
#section1 .inner p button.btn-influencer-regi {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-influencer.png);
}
#section2 .inner p button.btn-influencer-regi {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-influencer.png);
}
#section3 .inner p button.btn-influencer-regi {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-influencer.png);
}
#section1 .inner a.btn-details {
    display:inline-block;
    text-indent: -99999px;
    width:99px;
    height:22px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-details.png);
}
#section2 .inner a.btn-details {
    display:inline-block;
    text-indent: -99999px;
    width:99px;
    height:22px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-details.png);
}
#section3 .inner a.btn-details {
    display:inline-block;
    text-indent: -99999px;
    width:99px;
    height:22px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-details.png);
}

.pop {
    display:none;
    opacity:0;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color: rgba(0,0,0,0.65);
    z-index:999;
    transition:opacity 0.3s;
}
.pop.pop-open {
    opacity:1;
}
.pop .pop-inner {
    position:absolute;
    top:50%;
    left:50%;
}
.pop .pop-inner .pop-contents {
    width:100%;
    height:100%;
}
.pop .pop-inner button.btn-close {
    position:absolute;
    top:-60px;
    left:50%;
    width:50px;
    height:46px;
    margin-left:-23px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-close2.png);
}
.pop.pop-regi .pop-inner button.btn-close, .pop.pop-confirm .pop-inner button.btn-close {
    position:absolute;
    top:19px;
    left:auto;
    right:24px;
    width:34px;
    height:30px;
    margin-left:0;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-close.png);
}
.pop-regi .pop-inner {
    width:542px;
    height:660px;
    margin-left:-400px;
    margin-top:-370px;
    padding:40px 130px;
    background-color: #ececec;
    text-align: center;
}
.pop-regi .pop-inner h4 {
    width:264px;
    height:34px;
    margin-bottom:10px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/tit-regi1.png);
}
.pop-regi .pop-inner p ,.pop-confirm .pop-inner p {
    text-indent: -99999px;
    margin:10px 0;
}
.pop-regi .pop-inner p.txt-regi1-info1 {
    width:420px;
    height:24px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-regi1-info1.png);
}
.pop-regi .pop-inner p.txt-regi1-info2 {
    width:412px;
    height:71px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-regi1-info2-1.png);
}
.pop-regi .pop-inner p.txt-regi1-info3 {
    width:362px;
    height:16px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-regi1-info3.png);
}
.pop-inner input {
    width:456px;
    height:48px;
    padding-left:80px;
    margin-bottom:10px;
}
.pop-inner input[type="text"], .pop-inner input[type="tel"], textarea {
    background-position: 0 100%;
}
.pop-inner input.inp-bg-on{
    background-position: 0 0;
}
.pop-inner .half {
    width:196px;
    height:48px;
    padding-left:70px;
}
.pop-inner .half-left {
    margin-left:1px;
    margin-right:5px;
}
.pop-inner input#inputName {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-name.png);
}
.pop-inner input#inputAge {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-age.png);
}
.pop-inner input#inputTel {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-tel.png);
}
.pop-inner input#inputGame {
    width:166px;
    padding-left:100px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-game.png);
}
.pop-inner input#inputChar {
    width:166px;
    padding-left:100px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-charname.png);
}
.pop-inner textarea#inputChar {
    width:166px;
    height:28px;
    padding-left:100px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-charname.png);
}
.pop-inner input#inputGamename {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-gamename.png);
}
.pop-inner textarea#inputGamename {
    width:460px;
    height:28px;
    padding-left:80px;
    margin-bottom:10px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-gamename.png);
}
.pop-inner input#inputNickname {
    width:186px;
    padding-left:80px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-nickname.png);
}
.pop-inner input#inputPart {
    width:186px;
    padding-left:80px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-part.png);
}
.pop-inner textarea#inputPart {
    width:186px;
    height:28px;
    padding-left:80px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-part.png);
}
.pop-inner input#inputChannel {
    width:436px;
    padding-left:100px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-channel.png);
}
.pop-inner textarea#inputChannel {
    width:440px;
    height:28px;
    padding-left:100px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/input-channel.png);
}
ul.check-agree {
    width:320px;
    margin:10px auto;
}
ul.check-agree li {
    text-align: left;
}
ul.check-agree li input + label i {
    display:inline-block;
    width:12px;
    height:12px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/check.png);
    margin-top:2px;
}
ul.check-agree li input:checked + label i {
    background-position: 0 100%;
}
ul.check-agree li input + label {
    display:inline-block;
    height:16px;
    background-position: 22px 0;
}
ul.check-agree li input#agree-all + label {
    width:270px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/agree-all.png);
}
ul.check-agree li input#agree1 + label {
    width:206px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/agree1.png);
}
ul.check-agree li input#agree2 + label {
    width: 206px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/agree2.png);
}
ul.check-agree li input#agree3 + label {
    width:246px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/agree3.png);
}
ul.check-agree li input#agree4 + label {
    width:170px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/agree4.png);
}
ul.check-agree li input#agree5 + label {
    width:210px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/agree5.png);
}
ul.check-agree li button.btn-details {
    width:56px;
    height:14px;
    margin-top:1px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-details2.png);
}
button.btn-regi {
    text-indent: 0;
    width:372px;
    height:72px;
    background-color: #98886a;
    color:#fff;
    font-size:20px;
}
button.btn-caution {
    position:absolute;
    bottom:30px;
    left:50%;
    margin-left:-25px;
    width:50px;
    height:16px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-caution.png);
}
.pop-regi .pop-inner h4.tit-regi2 {
    width:410px;
    height:34px;
    margin-bottom:10px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/tit-regi2.png);
}
.pop-regi .pop-inner p.txt-regi2-info1 {
    width:420px;
    height:24px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-regi2-info1.png);
}
.custom-select, .custom-select2 {
    position:relative;
    display: inline-block;
}
select {
	position:absolute;
	top:0;
	right:0;
	width: 100%;
	height: 100%;
	padding:0 25px;
    border: 0;
    font-size:18px;
    font-weight:bold;
	background:url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/custom-select.png) 0 0 no-repeat;
	-webkit-appearance: none;
	appearance: none;
}
select::-ms-expand {
	display: none;
}
.custom-select2 select {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/custom-select2.png);
}
.pop-caution .pop-inner {
    width:530px;
    height:730px;
    margin-left:-265px;
    margin-top:-365px;
}
.pop-caution .pop-contents {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/pop-caution.jpg);
}
.pop-policy1 .pop-inner {
    width:530px;
    height:716px;
    margin-left:-265px;
    margin-top:-358px;
}
.pop-policy1 .pop-contents {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/pop-policy1.jpg);
}
.pop-policy2 .pop-inner {
    width:530px;
    height:558px;
    margin-left:-265px;
    margin-top:-279px;
}
.pop-policy2 .pop-contents {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/pop-policy2.jpg);
}
.pop-policy3 .pop-inner {
    width:500px;
    height:240px;
    margin-left:-250px;
    margin-top:-120px;
}
.pop-policy3 .pop-contents {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/pop-policy3.jpg);
}
.pop-confirm .pop-inner {
    width:580px;
    height:450px;
    margin-left:-310px;
    margin-top:-275px;
    padding:60px 20px;
    background-color: #ececec;
    text-align: center;
}
.pop-confirm .pop-inner h4 {
    width:472px;
    height:106px;
    margin-bottom:35px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-confirm1-info1.png);
}
.pop-confirm .pop-inner button {
    width:266px;
    height:60px;
    margin-top:20px;
}
.pop-confirm .pop-inner input:read-only {
    color:#745200;
}
.btn-edit {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-edit.png);
}
.btn-complete {
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-complete.png);
}
.pop-confirm .pop-inner .half-left {
    margin-left:1px;
    margin-right:10px;
}
.pop-confirm .pop-inner h4.tit-comfirm2 {
    width:502px;
    height:106px;
    margin-bottom:35px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/txt-confirm2-info1.png);
}
.pop-complete .pop-inner {
    width:500px;
    height:524px;
    margin-left:-250px;
    margin-top:-262px;
}
.pop-complete .pop-contents {
    text-align: center;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/pop-complete.jpg);
}
.pop-complete .pop-contents p.txt {
    text-align: center;
    line-height: 160%;
    margin-bottom:20px;
}
.pop-complete .pop-contents p.txt strong {
    display:block;
    padding:70px 0 20px;
    font-size:24px;
    font-weight:bold;
    line-height: 120%;
}
.pop-complete .pop-contents p.txt .pop_regi {
    padding-top:18px;
    font-size:17px;
    color:#6b6b6b;
    line-height: 120%;
}
.pop-complete .pop-contents button.btn-confirm {
    width:200px;
    height:60px;
    margin:0 auto;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-confirm.png);
}
.pop-complete .pop-contents a.go-now {
    position:absolute;
    text-indent: -99999px;
    bottom:25px;
    right:120px;
    width:110px;
    height:25px;
}
.pop-alert .pop-inner {
    width:500px;
    height:312px;
    margin-left:-250px;
    margin-top:-156px;
    background-color: #e3e3e3;
    text-align: center;
    font-size:22px;
}
.pop-alert .pop-inner p {
    padding:80px 20px 50px;
}
.pop-alert .pop-inner .pop-contents button.btn-confirm {
    width:200px;
    height:60px;
    background-image: url(https://nxm-mt.akamaized.net/Contents/v4.nexon.com/teaser/images/btn-confirm.png);
}
.pop-movie .pop-inner {
    width:1000px;
    height:562px;
    margin-left:-500px;
    margin-top:-281px;
}
.pop-movie .pop-inner .pop-contents .player {
    height:562px;
}
@keyframes downBul {
    0%  { transform: translateY(0); } 
    50% { transform: translateY(15px); } 
    100% { transform: translateY(0);}
}