@font-face {
  font-family:"georgia.otf";
  src: url("../_css/georgia.ttf"), url("georgia.otf"), url("georgia.otf");
}

@font-face{
	src:url("../_css/georgia.ttf");
	font-family: "georgia"; 
}

/* @media only screen and (min-device-width : 1224px){
	.main_layer{
		position: relative;
		left: 0;
		margin-left: 0;
		width: 1920px;
		background: #000;
	}
}
@media only screen and (min-width : 1124px){
	body{ 
		overflow-x:scroll;
	}
} */
body {
	/* overflow-x: hidden; */
  min-width: 1530px;
}

body.on {
  overflow: hidden;
}
body, div, ul, li, img {
	margin: 0px;
	padding: 0px;
	font-family: "georgia"; 
	text-decoration:none;
}

#top_bar{z-index: 700;}
.main_layer{background:#070300;}
#header{
	width: 100%;
	min-width:1530px;
	position: fixed; 
	left: 0px;
	/*top: 0px;*/
	z-index: 500;
}
#header-inner {
	width: 100%;
	margin-top:60px;
}

#header-inner-nav {
	text-shadow:1px 1px 3px black;
	margin:23px 0 0 20px;
	float: left;
}
#header-inner-nav .main_nav li {float:left}
#header-inner-nav ul li a {
  margin:0 20px;
	text-align:center;
	font-size: 19px;
	color: #fcdc85;
	display: block;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
#header-inner-nav ul li a.newpage{
	position:relative;
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/common/icon_shortcut_off.png') right 3px no-repeat;
	padding-right:24px;
}

#header-inner-nav ul li a.newpage:after{
  position:absolute;
  content:"";
  display:block;
  right:0;
  top:0;
  width:25px;
  height:25px;
	opacity:0;
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/common/icon_shortcut_on.png') right 3px no-repeat;
}
#header-inner-nav ul li:hover a.newpage:after{
	opacity:1;	
}
#header-inner-nav ul.main_nav .sub_nav li a.newpage{
	position:relative;
	background:url('../img/share.png') right 3px no-repeat;
	padding-right:27px;
}
#header-inner-nav ul.main_nav .sub_nav li a.newpage:after{
	position:absolute;
    content:"";
    display:block;
    right:0;
    top:0;
    width:25px;
    height:25px;
	opacity:0;
	background:url('../img/share_over.png') right 3px no-repeat;
}
#header-inner-nav ul.main_nav .sub_nav li:hover a.newpage:after{
	opacity:1;
}
/* Sub Menu */

.main_nav .sub_nav {
	position: absolute;
	opacity: 0;
	background: #1b1b1b;
	margin-top:15px;
	-webkit-transition: opacity .25s ease .1s;
	-moz-transition: opacity .25s ease .1s;
	-o-transition: opacity .25s ease .1s;
	-ms-transition: opacity .25s ease .1s;
	transition: opacity .25s ease .1s;
}

.main_nav li:hover > .sub_nav { opacity: 1; }

.main_nav .sub_nav li {
	display:block;
	overflow: hidden;
	padding:0;
	float:left;
	height:35px;
	line-height:35px;border-right:1px solid #484540;
	-webkit-transition: height .25s ease .1s;
	-moz-transition: height .25s ease .1s;
	-o-transition: height .25s ease .1s;
	-ms-transition: height .25s ease .1s;
	transition: height .25s ease .1s;
}

.main_nav li:hover > .sub_nav li {
	padding:0;
	font-size:14px
}

.main_nav .sub_nav li a {
	height:35px;
	display:block;
	color:#fff;
	padding: 0;
	font-size:14px
}

.main_nav .sub_nav li:last-child { border: none; }


#header-inner-nav a:hover {
	color: #fff;
	cursor:pointer
}


#header-inner-nav_join {
	text-shadow:1px 1px 3px black;
	margin:23px 20px 0 0;
	float: right;
}
#header-inner-nav_join a {width:125px;
	text-align:center;
	font-size: 19px;
	color: #fcdc85;
	text-decoration: none;
	display: block;
	float: left;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}
#header-inner-nav_join a:hover {
	color: #fff;
	cursor:pointer;
}

/* sns-discord*/
#header-inner-nav_join a.sns {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/common/icon_discord.png') center no-repeat;
  display: block;
  width: 140px;
  height: 50px;
  text-indent: -99999em;
  margin-top: -15px;
}


/* PLAY BUTTON Styles */
.button {
	float: left;
	width: 214px;
	height: 61px;
	display: block;
	border: none;
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/common/bnt_playOff.png');
	position: relative;
	z-index: 1;
	-webkit-backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
	cursor:pointer;
}
.button:focus {
	outline: none;
}
.button--moema::before {
	content: '';
	position: absolute;
	top: -20px;
	left: -20px;
	bottom: -20px;
	right: -20px;
	z-index: -100;
	opacity: 0;
	background-color:#000000;
	-webkit-transform: scale3d(0.8, 0.5, 1);
	transform: scale3d(0.8, 0.5, 1);
}
.button--moema:hover {
	-webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
	transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
	background:url('http://web-files-cdn.masangsoft.com/_DKOnline/images/common/bnt_playOn.png');
	-webkit-animation: anim-moema-1 0.3s forwards;
	animation: anim-moema-1 0.3s forwards;
}
.button--moema:hover::before {
	-webkit-animation: anim-moema-2 0.3s 0.3s forwards;
	animation: anim-moema-2 0.3s 0.3s forwards;
}
@-webkit-keyframes anim-moema-1 {
	60% {
		-webkit-transform: scale3d(0.8, 0.8, 1);
		transform: scale3d(0.8, 0.8, 1);
	}
	85% {
		-webkit-transform: scale3d(1.1, 1.1, 1);
		transform: scale3d(1.1, 1.1, 1);
	}
	100% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}
@-webkit-keyframes anim-moema-2 {
	to {
		opacity: 0;
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}


/* MAIN VISUAL */
.jms-slideshow {
	position: relative;
	/* min-width: 1530px; */
	height: 977px;
	background:#0c0805;
}
.jms-wrapper {
	/* width: 1920px; */
	height: 977px;
	-webkit-background-clip: padding;
	-moz-background-clip: padding;     
	background-clip: padding-box;
	outline: none;
	-webkit-transition: background-color 1s linear;
	-moz-transition: background-color 1s linear;
	-o-transition: background-color 1s linear;
	-ms-transition: background-color 1s linear;
	transition: background-color 1s linear;
}
.step {	
	width: 1920px;
    height: 977px;
	display: block;
	margin-left:0px;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	-ms-transition: opacity 1s;
	-o-transition: opacity 1s;
	transition: opacity 1s;
}
.step:not(.active) {
	opacity: 0;
	z-index: -1;
	filter: alpha(opacity=0); /* internet explorer */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=0)"; /*IE8*/
}
.step:not(.active) .step{
	margin-left:100px;
}
.jms-content{
	position: absolute;
	width:1250px;
	z-index:9900;
	left:50%;
	margin-left:-625px;
	width:1000px;
	top:350px;
	opacity: 1;
	-webkit-transition: all 0.4s ease-in-out 1s;
	-moz-transition: all 0.4s ease-in-out 1s;
	-ms-transition: all 0.4s ease-in-out 1s;
	-o-transition: all 0.4s ease-in-out 1s;
	transition: all 0.4s ease-in-out 1s;
}
.step:not(.active) .jms-content{
	display:none;
	opacity: 0;
}
.jms-content h3{
	font-size:30px;
	font-weight:100;
	color:#fdd360;
	line-height: 1;
    letter-spacing: 2px;
	text-shadow:3px 2px 4px #000;
	padding:0 0 25px 5px;
}
.jms-content h1{
	font-size:90px;
	font-weight:100;
	line-height:90px;
	color:#fff;
	text-shadow:3px 3px 10px #000;
	padding-bottom:35px;
}
.jms-content p{
	font-size:25px;
	color:#fff;
	text-shadow:2px 3px 4px #000;
	padding-left: 5px;
}
a.jms-link{
	position: absolute;
	width:191px;
	height:66px;
	display:block;
	top:350px;
	background:url('../img/btn_learnmore.png') no-repeat;
	text-indent:-9999px;
}

.step img {
	position: absolute;
}
.step video {
	position: absolute;
}
.jms-dots{
	width: 100%;
	position: absolute;
	text-align: center;
	left: 0px;
	bottom: 13%;
	z-index: 200;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.jms-dots span{
	display: inline-block;
	position: relative;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #fcdc85;
	margin: 8px;
	cursor: pointer;
	box-shadow: 
		1px 1px 1px rgba(0,0,0,0.1) inset, 
		1px 1px 1px rgba(255,255,255,0.3);
}
.jms-dots span.jms-dots-current:after{
	content: '';
	width: 15px;
	height: 15px;
	left:0;
	top:0;
	position: absolute;
	border-radius: 50%;
	background: #ffffff;
}


/* CONTENT1 */
.latestnews {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/cont_1.jpg') center 0 no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:980px;
  overflow:hidden}
.latestnews .news_cont {
		width:1150px;
		margin:0 auto;
		margin-top:350px;
}
.latestnews .news_cont ul {
	width:306px;
	float:left;
	font-size: 19px;
	font-weight: 300;
	color:#fff;
	text-align:center;
	margin-left:116px;
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	transition: all 0.2s;
}
.latestnews .news_cont ul:first-child{
	margin:0px;
}
.latestnews .news_cont ul .News_Evnet {width:306px;height:247px;background:url('../img/news_visual.png')}

.latestnews .news_cont ul .News_Event {width:306px;height:247px;color:#fff;}
.latestnews .news_cont ul .News_Announcement {width:306px;height:247px;background:url('../img/news_visual.png')}
.latestnews .news_cont ul .News_Update {width:306px;height:247px;background:url('../img/news_visual.png')}
.latestnews .news_cont ul .News_text {font-size:34px;text-shadow:0px 0px 20px black;line-height:245px}

.latestnews .news_cont ul .tit {
  margin-top:25px;line-height:25px;
  color:#fff;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  height: 55px;
}
.latestnews .news_cont ul .date {font-size:16px;padding:0 30px;text-align:center;color:#c3c2c2;vertical-align:bottom}
.latestnews .news_cont ul .date a{color:#c3c2c2;}

.latestnews .news_cont ul li:nth-child(3) {margin-top:25px;line-height:25px}
.latestnews .news_cont ul li:nth-child(4) {font-size:16px;padding:30px;text-align:left;color:#c3c2c2;vertical-align:bottom}
.latestnews .news_cont ul li span {float:right;margin-top:-5px}
.latestnews .news_cont ul:hover {
	/*box-shadow:0px 0px 20px #e2c577;*/
	-webkit-box-shadow: 0px 0px 8px 4px rgba(219,189,112,0.72);
	-moz-box-shadow: 0px 0px 8px 4px rgba(219,189,112,0.72);
	box-shadow: 0px 0px 8px 4px rgba(219,189,112,0.72);
}

.latestnews .viewmore {display:block;width:478px;height:53px;margin:0 auto;margin-top:810px;clear:both}
.latestnews .viewmore:hover {box-shadow:0px 0px 10px #e2c577;}


/* CONTENT2 */
.tendency {
  position:relative;
  width:100%;
  /* min-width:1530px; */
  max-width: 1920px;
  height:1325px;
  margin:auto;
  overflow:hidden;
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/cont_2.jpg');}
.tendency ul{position:absolute;overflow:hidden;top:658px;margin-left:-620px;left:50%;}
.tendency ul li{float:left;}
.tendency ul li.tend_01{margin-right:71px;}
.tendency ul li a{position:relative;display:block;height:174px;text-indent:-9999px;}
.tendency ul li a:after{
	position: absolute;
	display:block;
	content: "";
	top:0;
	left:0;
	height:174px;
	opacity:0;
	-webkit-transition: opacity 300ms linear;
	-moz-transition: opacity 300ms linear;
	-o-transition: opacity 300ms linear;
	-ms-transition: opacity 300ms linear;
	transition: opacity 300ms linear;
}
.tendency ul li:hover a:after{opacity:1;}
.tendency ul li.tend_01 a{width:580px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_tend_01.png');}
.tendency ul li.tend_01 a:after{width:580px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_tend_01_on.png');}
.tendency ul li.tend_02 a{width:589px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_tend_02.png');}
.tendency ul li.tend_02 a:after{width:589px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_tend_02_on.png');}
.slider{
	width:100%;
	/* min-width:1530px; */
	position: relative;
	margin:0 auto;
    text-align: center;
	
	/*Lets add a shadow*/
	box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.75);
}

/*Last thing remaining is to add transitions*/
.slider>img{
	width:100%;
	position: absolute;
	left: 0; top: 0;
	transition: all 0.5s;
}

.slider input[name='slide_switch'] {
	display: none;
}

.slider label {
	/*Lets add some spacing for the thumbnails*/
	display: inline-block;
	width: 17%;
	max-width: 234px;
    height: auto;
	position: relative;
	z-index:10;
	margin: 39% 8px 0;
	cursor: pointer;
	transition: all 0.5s;	
	opacity: 0.4;
}
.slider label img{
	width:100%;
	display: block;
}

/*Time to add the click effects*/
.slider input[name='slide_switch']:checked+label {
	opacity: 1;box-shadow:0px 0px 20px #aaa;
}
/*Clicking any thumbnail now should change its opacity(style)*/
/*Time to work on the main images*/
.slider input[name='slide_switch'] ~ img {
	opacity: 0;
	transform: scale(1.1);
}
/*That hides all main images at a 110% size
On click the images will be displayed at normal size to complete the effect
*/
.slider input[name='slide_switch']:checked+label+img {
	opacity: 1;
	transform: scale(1);
}

/* CONTENT3 */
.media {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/cont_31.jpg') center 0 no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:866px;
  overflow:hidden}

.swiper-width {
	width: 1237px;
	height:445px;
	margin:0 auto;
	margin-top:300px;
	overflow: hidden;
	text-align: center;
	z-index:90;
}
.swiper-width .swiper-area {
margin:0 auto;
}
.swiper-width .swiper-area .swiper-container {
	position: relative;
}
.swiper-width .swiper-area .swiper-container .swiper-button-next {
right:127px;width:56px;height:100px;margin-top:-40px;background:url('../img/arrow_right2.png');
}
.swiper-width .swiper-area .swiper-container .swiper-button-prev {
left:155px;width:56px;height:100px;margin-top:-40px;background:url('../img/arrow_left2.png');
}
.swiper-width .swiper-area .swiper-container .swiper-slide {
	box-shadow:0px 0px 300px black;
	position: relative;
}
.swiper-width .swiper-area .swiper-container .swiper-slide img {
	width:646px;
	height:443px;
}
.swiper-width .swiper-area .swiper-container .swiper-slide img a {
	display: block;
}
.swiper-width .swiper-area .swiper-container .swiper-slide img a img {
	width: 100%;
}

/* CONTENT4 */
.newsletter {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/cont_4.jpg') center 0 no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:681px;
  overflow:hidden;
  position: relative;
}
.newsletter .section {
  width: 821px;
  height: 372px;
  position: absolute;
  margin: auto;
  top: 132px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.newsletter .section .tit {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/cont_4_img01.png') center no-repeat;
  width: 475px;
  height: 129px;
  text-indent: -9999em;
  position: absolute;
  top: 44px;
}
.newsletter .section .text {
  color: #e4e3df;
  font-size: 18px;
  position: absolute;
  top: 175px;
  text-align: center;
}
.newsletter .section .btn-subscribe {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_subscribe.png') no-repeat;
  background-position: 0 0;
  width: 244px;
  height: 78px;
  text-indent: -9999em;
  position: absolute;
  bottom: 40px;
}
.btn-subscribe a {
  display: block;
  width: 230px;
  height: 55px;
  position: absolute;
  top: 5px;
  left: 5px;
}
.newsletter .section .btn-subscribe:hover {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_subscribe.png') no-repeat;
  background-position-x: -244px;
}


/* SUB START */

/* NEWS */
.News {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/sub_news_bg.jpg') center 0;
  background-repeat:no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:830px;
  overflow:hidden}
.News .News_title {
		width:1240px;
		margin:0 auto;
		margin-top:350px;
}
.News .News_title ul {
	background:url('../img/news_title_bg.png');
	width:392px; /*393px */
	height:318px;
	float:left;
	font-size: 34px;
	font-weight: 300;
	color:#fff;
	text-align:center;
	margin:0;
	margin-right:21px; /*30*/
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.News .News_title ul:hover {box-shadow:0px 0px 10px #fff;}
.News .News_title ul li {color:#fff}
.News .News_title ul li:nth-child(1) {font-size:19px;margin-top:100px}
.News .News_title ul li:nth-child(2) {margin-top:15px;padding: 0 20px;font-size: 28px;}
.News .News_title ul li:nth-child(3) {margin-top:20px}

.News_list {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/sub_news_bg2.jpg') center 0;
  background-repeat:no-repeat;
  width:100%;
  /* min-width:1530px; */
  /*height:1905px;*/ 
  overflow:hidden
}
.News_list_cont {width:1240px;margin:0 auto;color:#fff}
.News_list_cont h1 {float:left;color:#fff;font-size:21px;font-weight:100}

.News_Tab {overflow:hidden}
.sTabB5 {float:left}
.sTabB5 li {float:left;margin:7px 0 0 25px}
.sTabB5 li a {
	background:url('../img/news_listby_check.png');background-position:left center;background-repeat:no-repeat;
	padding-left:35px;display:inline-block;overflow:hidden;color:#f7f7f7;font-size:18px
}
.sTabB5 li a:hover, .sTabB5 li.on a {background:url('../img/news_listby_check_on.png');background-position:left center;background-repeat:no-repeat}


.list_ALL {
	width:1240px;height:287px;border:1px solid #fff;margin-top:40px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.list_ALL .list_timg img {float:left;opacity:0.5}

.list_ALL ul {width:745px; height:240px; float:left; padding:45px 45px 0 60px}
.list_ALL ul .cate {font-size:20px;color:#fff}
.list_ALL ul .tit {font-size:30px;margin-top:15px;color:#fff; overflow: hidden;
  text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.list_ALL ul .cnt {font-size:20px;margin-top:15px;color:#717171;  overflow: hidden; text-overflow: ellipsis; max-height:72px;}
.list_ALL ul .date {font-size:17px;margin-top:15px;color:#918d8d}
.list_ALL .list_btn {position:relative;top:215px;right:30px;}

.mt40 {margin-top:40px}
.mt3 {margin-top:3px}
.list_ALL:hover {background:#fff;border:1px solid #000;box-shadow:0px 0px 30px #ddd}
.list_ALL:hover .list_timg img {float:left;opacity:1}
.list_ALL:hover ul .cate {font-size:20px;color:#000}
.list_ALL:hover ul .tit {font-size:30px;margin-top:15px;color:#000; overflow: hidden;
  text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.list_ALL:hover ul .cnt {font-size:20px;margin-top:15px;color:#717171;overflow: hidden; text-overflow: ellipsis; max-height:72px}
.list_ALL:hover ul .date {font-size:17px;margin-top:15px;color:#918d8d}
.list_ALL:hover > div > .ribbon_v > .list_timg > .no_img{opacity:1}

.pazing {width:515px;margin:0 auto;color:#fff;margin-top:70px;overflow:hidden}
.pazing a {display:block;font-size:20px;color:#ccc;float:left;margin-right:50px;text-align:center;vertical-align:middle}
.pazing a:hover {color:#fff}
.pazing a.on {color:#fff}

/*.News_view {background:url('../img/News_view_bg.jpg');background-repeat:no-repeat;width:100%;min-width:1530px;overflow:hidden}*/
.News_view ul {/*width:1240px;*/margin:0 auto;color:#fff;margin-top:200px;margin-bottom:90px;text-align:center;}
.News_view ul .x {text-align:right}
.News_view ul .cate {font-size:30px}
.News_view ul .tit {font-size:60px;margin-top:50px}
.News_view ul .date {font-size:30px;margin-top:40px;color:#b4afac}
.News_view ul .cont {text-align:center}
/*
.News_view ul {margin-top:90px;line-height:30px}
.News_view ul li:nth-child(1) {text-align:right}
.News_view ul li:nth-child(2) {font-size:30px}
.News_view ul li:nth-child(3) {font-size:60px;margin-top:50px}
.News_view ul li:nth-child(4) {font-size:30px;margin-top:40px;color:#b4afac}
.News_view ul li:nth-child(5) {width:1240px;overflow:hidden;margin-top:50px}
.News_view ul li:nth-child(5) img {}
.News_view ul li:nth-child(6) {margin-top:90px;line-height:30px}
*/

/* The Game Class_Race */
.sub_slider {
	width:100%;
	/* min-width:1530px; */
	margin: 0 auto;
}
.slide_viewer {
  height: 980px;
  overflow: hidden;
  position: relative;
}
.slide_group {
  height: 100%;
  position: relative;
  width: 100%;
}
.slide {
  display: none;
  height: 100%;
  position: absolute;
  width: 100%;
}
.slide:first-child {
  display: block;
}
.slide:nth-of-type(1) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Class_visual_1.jpg') center 0;
}
.slide:nth-of-type(2) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Class_visual_2.jpg') center 0;
}
.slide:nth-of-type(3) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Class_visual_3.jpg') center 0;
}
.slide:nth-of-type(4) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Class_visual_4.jpg') center 0;
}
.slide:nth-of-type(5) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Class_visual_5.jpg') center 0;
}
a.slide_btn {border:1px solid red;
  color: #474544;
  font-size: 42px;
  margin: 0 10px;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
/*nav��ư*/
.slide_btn.active, .slide_btn:hover {
  color: #428CC6;
  cursor: pointer;
}
.directional_nav {
  width: 1400px;
  margin: 0 auto;
  position: relative;
  top: -480px;
}
.previous_btn {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_left3.png');
  bottom: 0;
  left: 0px;
  margin: auto;
  position: absolute;
  top: 0;
}
.next_btn {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_right3.png');
  bottom: 0;
  margin: auto;
  position: absolute;
  right: 0px;
  top: 0;
}
.previous_btn:hover {
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_left3_on.png');
}
.next_btn:hover {
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_right3_on.png');
}
.previous_btn, .next_btn {
  cursor: pointer;
  width: 87px;
  height: 168px;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -ms-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .previous_btn {
    left: 50px;
  }
  .next_btn {
    right: 50px;
  }
}

/* 2page */
.sub_slider2 {
	width:100%;
	/* min-width:1530px; */
	margin: 0 auto;
}
.slide_viewer2 {
  height: 980px;
  overflow: hidden;
  position: relative;
}
.slide_group2 {
  height: 100%;
  position: relative;
  width: 100%;
}
.slide2 {
  display: none;
  height: 100%;
  position: absolute;
  width: 100%;
}
.slide2:first-child {
  display: block;
}
.slide2:nth-of-type(1) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Race_visual_1.jpg') center 0;
}
.slide2:nth-of-type(2) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Race_visual_2.jpg') center 0;
}
.slide2:nth-of-type(3) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Race_visual_3.jpg') center 0;
}
.slide2:nth-of-type(4) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Race_visual_4.jpg') center 0;
}
.slide2:nth-of-type(5) {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Race_visual_5.jpg') center 0;
}

a.slide_btn2 {border:1px solid red;
  color: #474544;
  font-size: 42px;
  margin: 0 10px;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
/*nav��ư*/
.slide_btn2.active, .slide_btn2:hover {
  color: #428CC6;
  cursor: pointer;
}
.directional_nav2 {
  max-width: 1400px;
  margin: 0 auto;
  position: relative;
  top: -480px;
}
.previous_btn2 {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_left3.png');
  bottom: 0;
  left: 0px;
  margin: auto;
  position: absolute;
  top: 0;
}
.next_btn2 {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_right3.png');
  bottom: 0;
  margin: auto;
  position: absolute;
  right: 0px;
  top: 0;
}
.previous_btn2:hover {
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_left3_on.png');
}
.next_btn2:hover {
	background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/arrows_right3_on.png');
}
.previous_btn2, .next_btn2 {
  cursor: pointer;
  width: 87px;
  height: 168px;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -ms-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .previous_btn2 {
    left: 0px;
  }
  .next_btn2 {
    right: 0px;
  }
}

/* STORY */
.tendency_02{
  width:100%;
  /* min-width:1530px; */
  max-width:1920px;
  height:1383px;
  overflow:hidden;
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/TheGame_01.jpg') center no-repeat;
  margin: auto;
}
.TheGame {
	/* background:url('../img/copylight.jpg');
	background-position:center bottom; */
	position: relative;
	width:100%;
  /* min-width:1530px; */
  min-height: 978px;
  overflow:hidden;
}
.TheGame img{display:block;}
.slider.game_slider label {left:6%;}
.prologue-title:hover,
.episode-title:hover,
.back-prologue:hover,
.back-episode:hover {
  cursor: pointer;
}
.prologue-title,
.episode-title {
  width: 50%;
  min-width:765px;
  height:978px;
  position: absolute;overflow:hidden;
}
.prologue-title {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue.jpg');
  background-position:center top;
  left: 0;
}
.episode-title {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Episode.jpg');
  background-position:center top;
  right: 0; 
}
.story_title:after{
  position: absolute;
  display:inline-block;
  content: "";
  height:100%;
  width: 100%;
  opacity:0;
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
}
.story_title:hover:after{
  opacity: 1;
}

.prologue-title:after{	
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_on.jpg');
  background-position:center top;
}
.episode-title:after{	
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Episode_on.jpg');
  background-position:center 978px;
}
.back-prologue {
  background:url('../img/X.png');
  display: none;
  position: absolute;
  width: 69px;
  height: 69px;
  z-index: 999;
  top:120px;
  right:250px;
}
.back-episode {
  background:url('../img/X.png');
  display: none;
  position: absolute;
  width: 69px;
  height: 69px;
  z-index: 999;
  top:120px;
  right:200px;
}
/*
.back-prologue {
  background:url('../img/X.png');
  display: none;
  position: absolute;
  width: 69px;
  height: 69px;
  z-index: 9999;
  top: 2180px;
  right:255px
}
.back-episode {
  background:url('../img/X.png');
  display: none;
  position: absolute;
  width: 69px;
  height: 69px;
  z-index: 9999;
  top: 2180px;
  right:255px
}
*/
/* CONTENT BLOCKS */
.prologue-content,
.episode-content {
  display: none;
  z-index: -5;
  width: 100%;
}
.prologue-content {
  width:100%;
  /* min-width:1530px; */
  height:5000px;
}
.episode-content {
  background:url('../img/Episode_cont_bg.jpg');
  color: #fff;
}
#episode1{height:2612px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Episode_cont_3.jpg') center 0;background-repeat:no-repeat;}/*ELEMENTAL TOWER*/
#episode2{height:3501px;background:url('../img/Episode_cont_5.jpg?ver=20190725') center 0;background-repeat:no-repeat;}/*NADKATH ISLAND*/

/*#episode1{height:2963px;background:url('../img/Episode_cont_1.jpg') center 0;background-repeat:no-repeat;}*/ /*LACKSHTOOM*/
/*#episode2{height:2483px;background:url('../img/Episode_cont_2.jpg') center 0;background-repeat:no-repeat;}*/ /*LUMEN'S TOWER*/
/*#episode4{height:1245px;background:url('../img/Episode_cont_4.jpg') center 0;background-repeat:no-repeat;}*/ /*LAZIO*/

.story_cont {
  width:100%;
  /* min-width:1530px; */
  margin: 0 auto;
  font-size: 19px;
  text-align: justify;
  text-align:center;
  line-height:31px
}
.prologueImg{
  width:100%;
  /* min-width:1530px; */
}
#Prologue_img1{height:691px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_img1.jpg') center 0;background-repeat:no-repeat;}
#Prologue_img2{height:971px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_img2.jpg') center 0;background-repeat:no-repeat;}
#Prologue_img3{height:749px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_img3.jpg') center 0;background-repeat:no-repeat;}
#Prologue_img4{height:1013px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_img4.jpg') center 0;background-repeat:no-repeat;}
#Prologue_img5{height:726px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_img5.jpg') center 0;background-repeat:no-repeat;}
#Prologue_img6{height:852px;background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/Prologue_img6.jpg') center 0;background-repeat:no-repeat;}
@media only screen and (max-width: 1700px) {
	.previous_btn {
	left: 16%;
	}
}
@media only screen and (max-width: 1530px) {
	.back-prologue{top:120px;right:260px;}
	.back-episode{right:60px;}
}
/* Download Start */
.Download_bg1 {
  background:url('../img/Download_bg.jpg') center 0;
  background-repeat:no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:1004px;
  overflow:hidden
}
.download_cont {
  width:1240px;
  margin:0 auto;
  margin-top:450px;
  text-align:center
}
.download_cont li:nth-child(2) {margin-top:50px}
.Download_bg2 {
  background:url('../img/Download_bg2.jpg') center 0;
  background-repeat:no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:1400px;
  overflow:hidden
}
.download_cont2 {width:1240px;margin:0 auto;text-align:center}
table {width:1065px;margin:0 auto;border-top:4px solid #808080;border-bottom:4px solid #535353}
table th {height:60px;color:#fff;font-size:25px;text-align:center;border-bottom:2px solid #4d4d4d;border-right:2px solid #808080}
table td {border-bottom:2px solid #4d4d4d;border-right:2px solid #808080}
.table_last {border-right:none}
.down_icon {width:773px;margin:0 auto;margin-top:90px;overflow:hidden}
.down_icon li {float:left;margin-right:80px}
.down_icon li a {margin-top:90px;display:block}
.down_icon li a.bnt_down{width:133px;height:40px;background:url('../img/Download_btn2.png') no-repeat;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.down_icon li a.bnt_down:hover{background:url('../img/Download_btn2_on.png') no-repeat;}
/* Media Start */
.Media_bg {position: relative;background:url('../img/Madia_bg.jpg') center 0;background-repeat:no-repeat;width:100%;min-width:1530px;overflow:hidden}
.Media_bg1 {/*position: relative;background:url('../img/Madia_bg.jpg') center 0;*/background-repeat:no-repeat;width:100%;min-width:1530px;height:1200px;overflow:hidden}
.Media_bg1 img.Media_title{position:absolute;top:380px;left:50%;margin-left:-242px;}
.Media_cont {width:1240px;margin:0 auto;margin-top:480px;text-align:center}

.Media_bg2 {/*background:url('../img/Madia_bg2.jpg')center 0;*/background-repeat:no-repeat;width:100%;min-width:1530px;height:1400px;overflow:hidden}
.Media_bg2 img.Media_title{display:block;margin:0 auto 40px;}
.sTabB3 {position:absolute;z-index:10;left:50%;margin-left:-620px;margin-top:1223px;width:1240px}
.sTabB3 li {position:relative;width:390px;height:218px;float:left;margin-right:35px;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.sTabB3 li a{position:absolute;display:block;width:390px;height:218px;overflow:hidden;opacity: 0.7;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.sTabB3 li:hover a{box-shadow:0px 0px 8px #000;opacity: 1;
	-webkit-transform: scale(1.07);
	-moz-transition: scale(1.07);
	-o-transition: scale(1.07);
	transition: scale(1.07);
}
.sTabB3 li img {width:100%;height:100%;}


.screenshot {width:1240px;margin:0 auto;margin-top:150px}
.screenshot ul li {position:relative;width:286px;height:159px;float:left;margin:25px 32px 0 0;}
.screenshot ul li a{position:absolute;display:block;width:286px;height:159px;overflow:hidden;opacity: 0.7;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.screenshot ul li:hover a{box-shadow:0px 0px 8px #000;opacity: 1;
	-webkit-transform: scale(1.1);
	-moz-transition: scale(1.1);
	-o-transition: scale(1.1);
	transition: scale(1.1);
}
.screenshot ul li img {width:100%;height:100%}
.screenshot ul li:nth-child(4) {margin-right:0}

.wallpaper {width:1240px;margin:600px auto 0;}
.wallpaper ul li {position:relative;width:286px;height:159px;float:left;margin:25px 32px 0 0;}
.wallpaper ul li a{position:absolute;display:block;width:286px;height:159px;overflow:hidden;opacity: 0.7;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.wallpaper ul li:hover a{box-shadow:0px 0px 8px #000;opacity: 1;
	-webkit-transform: scale(1.1);
	-moz-transition: scale(1.1);
	-o-transition: scale(1.1);
	transition: scale(1.1);
}
.wallpaper ul li img {width:100%;height:100%}
.wallpaper ul li:nth-child(4) {margin-right:0}

.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
}
.modalWindow {
	width:1240px;
	text-align:center;
	display: none;
    position: fixed;
    top: 27%;
    left: 50%;
    z-index: 999 !important;
    margin-left: -620px;
    cursor: default;
}
.modal.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 997;
    cursor: pointer;
}
.modalWindow .modalWrapper {
}
.modalWindow .modalWrapper img{max-width:1000px;}

.closeBtn {
    position: absolute;
    right: -100px;
    top: -100px;
    cursor: pointer;
}


/* newsletter input */
.newsletter-form {
  background:url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/newsletter_bg.webp') center 0 no-repeat;
  width:100%;
  /* min-width: 1530px; */
  min-height:1000px;
  overflow:hidden;
  position: relative;
}

.newsletter-form .section {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/newsletter_img01.webp') center no-repeat;
  width: 1109px;
  height: 584px;
  position: absolute;
  margin: auto;
  left: 0;
  right: 0;
  top: 274px;
}
.newsletter-form #inputForm.hide {
  display: none;
}

.newsletter-form #inputForm {
  display: block;
}


.newsletter-form .newsletter-wrap {
  width: 958px;
  height: 432px;
  position: absolute;
  margin: auto;
  top: 76px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.newsletter-form .newsletter-wrap .newsletter-tit {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/newsletter_img02.png') center no-repeat;
  width: 464px;
  height: 133px;
  text-indent: -9999em;
  position: absolute;
  top: 18px;
}
.newsletter-form .newsletter-wrap .newsletter-text {
  color: #e4e3df; 
  font-size: 20px;
  line-height: 1.3em;
  position: absolute;
  top: 180px;
  text-align: center;
}


#emailAddress {
  position: absolute;
  width: 500px;
  height: 56px;
  padding: 10px 30px;
  font-size: 20px;
  background: rgb(255, 255, 255);
  box-sizing: border-box;
  border: none;
  top: 280px;
  left: 97px;
  outline: none;
}

input::placeholder {
  color:#a8a8a8;
}

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 30px rgba(0,0,0,0) inset ; -webkit-text-fill-color: #000;
}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {
  transition: background-color 5000s ease-in-out 0s;
}

.newsletter-wrap .agreement {
  position: absolute;
  top: 360px;
  width: 100%;
  display: inline-block;
  font-size: 14px;
  color:#a6a6a6;
  line-height: 16px;
  margin-left: -50%;
  text-align: center;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  letter-spacing: -0.2px;
}

.newsletter-wrap .agreement input[id="chkbox"]{
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  background-color: #fff;
  vertical-align: bottom;
  border: none;
  box-shadow: none !important;
}


.newsletter-form .newsletter-wrap #btnSubmit2 {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_subscribe.png') no-repeat;
  background-position: 0 0;
  width: 244px;
  height: 78px;
  text-indent: -9999em;
  position: absolute;
  top: 274px;
  left: 614px;
  border: none;
  cursor: pointer;
}

.newsletter-form .newsletter-wrap #btnSubmit2:hover {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_subscribe.png') no-repeat;
  background-position-x: -244px;
}




/* Shop Start */
.shop {background:url('../img/shop_bg.jpg');background-repeat:no-repeat;width:1920px;overflow:hidden}
.shop_item {width:241px;height:530px;background:url('../img/shop_item_bg.png');float:left;margin:0 8px 150px 0;}
.shop_item ul {text-align:center;margin-top:75px}
.shop_item ul li:nth-child(1) {font-size:45px}
.shop_item ul li:nth-child(2) {font-size:30px}
.shop_item ul li:nth-child(3) {font-size:60px;margin-top:50px}
.shop_item ul li:nth-child(4) {margin-top:50px;}

/* Login Start */
.login {background:url('../img/Login_bg.jpg');background-repeat:no-repeat;width:1920px;height:1000px;overflow:hidden}
.login_top {width:1140px;margin:0 auto;border-bottom:1px solid #919291;overflow:hidden;margin-top:200px;padding:0 50px 25px 50px}
.login_top ul li:nth-child(1) {float:left}
.login_top ul li:nth-child(2) {float:right;margin-top:10px}
.login_cont {width:1050px;margin:0 auto;overflow:hidden;margin-top:50px;color:#fff;font-size:20px}
.login_cont ul {overflow:hidden}
.login_cont ul li {margin-bottom:30px;font-family: 'Nanum Gothic', sans-serif;text-align:left;}
.login_cont ul li:nth-child(6) a {float:left;text-align:center;display:block;width:48%;color:#aaa;font-size:17px;}
.login_cont ul li:nth-child(6) a:hover {color:#fff}
.login_cont ul.login_sns li a{display:block;width:426px;height:58px;text-indent:-9999px;
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
}
.login_cont ul.login_sns li:nth-child(2) a{background:url('../img/google_login.png');}
.login_cont ul.login_sns li:nth-child(2) a:hover{background:url('../img/google_login_over.png');}
.login_cont ul.login_sns li:nth-child(3) a{background:url('../img/facebook_login.png');}
.login_cont ul.login_sns li:nth-child(3) a:hover{background:url('../img/facebook_login_over.png');}
.login_cont ul.login_sns li:last-child a{background:url('../img/steam_login.png');}
.login_cont ul.login_sns li:last-child a:hover{background:url('../img/steam_login_over.png');}

.login2 {background:url('../img/Login_bg.jpg');background-repeat:no-repeat;width:1920px;height:1000px;overflow:hidden}
.login_top2 {width:1140px;margin:0 auto;border-bottom:1px solid #919291;overflow:hidden;margin-top:200px;padding-bottom:25px;text-align:center}
.login_cont2 {width:427px;margin:0 auto;overflow:hidden;margin-top:50px;color:#fff;font-size:20px;text-align:center}
.login_cont2 ul li {margin-bottom:30px;font-family: 'Nanum Gothic', sans-serif}
.login_cont2 ul li:nth-child(5) a {text-align:center;display:block;color:#aaa;font-size:17px;}
.login_cont2 ul li:nth-child(5) a:hover {color:#fff}



#errorBar{position: fixed;left: 0px;top: 99px;width:100%;height:50px;background:#981b1b;z-index: 9999;}
#errorBar span{color:#fff;background:url('../img/icon_error.png') no-repeat 0 center;line-height:50px;font-family: 'Nanum Gothic', sans-serif;font-weight:bold;padding: 5px 60px;}


/* SUB AND */


/* Copylight */
.copyright2 {position:absolute;/* top: 2883px; */z-index:-10;background:url('../img/copylight.jpg') center 0 no-repeat;width:1920px;height:144px;overflow:hidden;clear:both;}

.copyright {
  background:#181818 url('../img/copylight.jpg') center 0 no-repeat;
  width:100%;
  /* min-width:1530px; */
  height:144px;
  overflow:hidden;
  clear:both;}
.copy_cont {width:1240px;margin:0 auto;overflow:hidden}
.copy_content {width:1025px;margin:0 auto;margin-top:45px;float:right}
.copy_content ul li {float:left;color:#fff;font-size:12px}
.copy_content .footer li {margin-right:30px;}
.copy_content .footer li a {color:#fff; cursor:pointer}
.copy_content .follow {float:right;}
.copy_content .follow li {margin-left:30px;color:#8c8c8c}
.copy_content .follow map area{outline:none;}
.fixed-side-navbar {
	background:url('../img/quick_line.png');background-position:left middle;background-repeat:no-repeat;
	height:338px;position:fixed;left:70px;top:50%;margin-top:-169px;z-index:9999
}
.fixed-side-navbar .nav > li a {
	background:url('../img/quick_nav.png');background-position:left middle;background-repeat:no-repeat;
	width:100px;height:50px;line-height:43px;margin:18px 0 0 -21px;padding-left:55px;font-size:14px;display:block;color:#fdf4ea
}
.fixed-side-navbar .nav > li a:hover {}
.fixed-side-navbar .nav > li.active a {
	background:url('../img/quick_nav_on.png');background-position:left middle;background-repeat:no-repeat;
	font-size:15px;
}

.fixed-side-navbar2 {
	background:url('../img/quick_sub_line.png');background-position:left middle;background-repeat:no-repeat;
	height:409px;position:absolute;right:60px;top:8%;margin-top:-204px;z-index:9999
}
.fixed-side-navbar2 .nav2 > li a {
	background:url('../img/quick_nav_sub.png');background-position:left middle;background-repeat:no-repeat;
	width:160px;height:38px;line-height:40px;margin:22px 0 0 -18px;padding-left:50px;font-size:12px;display:block;color:#666;text-align:left;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.fixed-side-navbar2 .nav2 > li a:hover {background:url('../img/quick_nav_sub_on.png');background-position:left middle;background-repeat:no-repeat;}
.fixed-side-navbar2 .nav2 > li a.active {
	background:url('../img/quick_nav_sub_on.png');background-position:left middle;background-repeat:no-repeat;color:#ddd
}


.sTab_menu {position:absolute;z-index:10;margin-top:130px;width:1530px;overflow:hidden}
.sTabB2 {float:right;}
.sTabB2 li {float:left;margin-left:10px;}
.sTabB2 li a {display:inline-block;width:102px;height:39px;text-align:center;overflow:hidden;background:url('../img/Tab.png');color:#fdf4ea;line-height:40px;}
.sTabB2 li a img {}
.sTabB2 li a:hover, .sTabB2 li.on a {background:#ff0000;text-decoration:none;background:url('../img/Tab_on.png');color:#fae58f;text-shadow:0px 0px 5px #fae58f}

/*2019.04.01 Elemental Tower�� ǥ��, ���Ŀ� ������ ����Ʈ �����϶� ��ü*/
.episode_tab {position:absolute;z-index:10;left:50%;margin-top:80px;margin-left:-620px;width:1240px;overflow:hidden}
.sTabB4 {}
.sTabB4 li {float:left;margin-right:14px}
.sTabB4 li a {display:inline-block;width:295px;height:63px;text-align:center;overflow:hidden;color:#f7f7f7;line-height:65px;border:2px solid white;font-size:18px}
.sTabB4 li a:hover, .sTabB4 li.on a {background:#ff0000;text-decoration:none;background:#fff;color:#000}

@media only screen and (max-width: 1530px) {
	.sTab_menu {width:1300px;}
}




/* MODAL-newsletter */
.inner {
  width: 100%;
  margin: 0 auto;
  position: relative;
}

#errorModal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height:100%;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1000;
}

#errorModal.on {
  display: block;
}

/* AlerPopup */
.popup .inner {
  display: flex; 
  flex-direction: column;
  justify-content: center; 
  align-items: center; 
  width: 100%;
  height: 100%;
  font-weight: 400;
}
.popup {
  position: fixed;
  background-color: #ffffff;
  width: 580px;
  height: 255px;
  padding: 20px;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
}

.popup #popupMessage  {
  padding: 26px;
  font-size: 20px;
  color: #1f1f1f;
  letter-spacing: -0.5px;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  white-space: pre-wrap;
}


#alertPopup {
  display: none;
}

#alertPopup.show {
  display: block;
}

#errorModal .popup #popupCloseBtn {
  min-width: 160px;
  height: 50px;
  background-color: #150202;
  color: #fffcf2;
  border: none;
  font-size: 17px;
  cursor: pointer;
  padding: 10px;
  letter-spacing: 1px;
}

.newsletter-form .section2 {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/newsletter_img02.webp') no-repeat center;
  width: 1092px;
  height: 588px;
  position: absolute;
  margin: auto;
  left: 50%;
  right: 50%;
  top: 266px;
  margin-left: -557px;
}

/* .newsletter-form #submitSuccess {
  display: none;
}
.newsletter-form #submitSuccess.show {
  display: block;
} */

.newsletter-form .section2 .newsletter-wrap {
  width: 958px;
  height: 432px;
  position: absolute;
  margin: auto;
  top: 76px;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.newsletter-form .section2 .newsletter-wrap .newsletter-tit {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/newsletter_img03.png') no-repeat center;
  width: 464px;
  height: 133px;
  text-indent: -9999em;
  position: absolute;
  top: 53px;
}
.newsletter-form .section2 .newsletter-wrap .newsletter-text {
  color: #e4e3df; 
  font-size: 20px;
  line-height: 1.3em;
  position: absolute;
  top: 204px;
  text-align: center;
}

.gohome {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_gohome.png') no-repeat center;
  width: 210px;
  height: 48px;
  text-indent: -9999px;
  cursor: pointer;
  border: none;
  position: absolute;
  bottom:40px;
  display: block;
}


/* 플로팅 배너 */
.popup_link {
	display: none;
	position: fixed;
	bottom: 50px;
	left: 50%;
	margin-left: -700px;
	z-index: 3000;
	width: 1400px;
	height: 120px;
	background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/floating_bg.png') no-repeat;
}

.popup_link.show {
  display: block;
}


.popup_link p.ttl {
	position: absolute;
	top: 23px;
	left: 96px;
  width: 392px;
  height: 50px;
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/floating_tit.png') no-repeat;
  text-indent: -9999em;
}

.popup_link p.text {
	position: absolute;
	top: 65px;
	left: 105px;
	font-size: 16px;
	font-family: 'Lato', sans-serif;
	color: #e4e3df;
}

.popup_link a.btn_link { 
	position: absolute;
	top:0;
  bottom: 0;
  margin: auto;
	right: 150px;
	display: block;
	width: 216px;
	height: 56px;
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/btn_subscribe2.jpg') no-repeat;
  text-indent: -9999em;
}

.popup_link p.btn_close {
	position: absolute;
	top: 15px;
	right: 70px;
	width: 24px;
	height: 24px;
	cursor: pointer;
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/bnt_close.png') no-repeat;
  text-indent: -9999em;
}


/* Rank 2024-12*/
.rank {
  position:relative;
  width:100%;
  /* min-width:1530px; */
  max-width: 1920px;
  margin:auto;
  overflow:hidden;
}
.rank .rank_tit {
  height: 363px;
  font-size: 56px;
  text-align: center;
  margin: 0 auto;
  left: 0;
  right: 0;
  padding-top: 182px;
  color: #efefef;
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/rank_headerBg.webp') no-repeat center;
  box-sizing: border-box;
}
.rank .rank_tab {
  background-color: #000000;
}
.rank .rank_tab ul,li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.rank .rank_tab ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: center;
}
.rank .rank_tab ul li {
  width: 276px;
  height: 62px;
  text-align: center;
  line-height: 62px;
  color: #929191;
  font-size: 18px;
  cursor: pointer;
}
.rank .rank_tab ul li.on {
  background: linear-gradient(180deg, #572f00, #794100);
  color: #ffffff;
}
.rank .rank_tab ul li:hover  {
  background: linear-gradient(180deg, #572f00, #794100);
  color: #ffffff;
}
.rank .select_wrap .tab-content {
  display: none;
  padding: 40px auto;
  width: 1240px;
  margin: 0 auto;
}
.rank .select_wrap .tab-content.active {
  display: block;
}
.rank .select_wrap {
  background: #121212 url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/rank_contBg.webp') no-repeat top center;
  margin: 0 auto;
  padding-bottom: 90px;
}
.update_total, .update_weekly, .update_monthly  {
  font-size: 15px;
  color: #bfbebe;
  font-family: 'Lato', Arial, Helvetica, sans-serif;
  text-align: center;
  display: none;
  letter-spacing: normal;
}
.update_total.active, .update_weekly.active, .update_monthly.active {
  display: block;
}

.select_wrap .rank_info {
  padding-top: 40px;
}

.select_box {
  width: auto;
  height: 100px;
  font-size: 15px;
  box-sizing: border-box;
  padding-top: 36px;
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.select_wrapper {
  position: relative;
  margin: 0 10px;
  width: 180px;
}
.select_box_header {
  display: flex;
  align-items: center;
  background-color: #181818;
  color: #ffffff;
  padding: 0 20px;
  height: 40px;
  box-sizing: border-box;
  border: 1px solid #ffffff;
  cursor: pointer;
}
.selected_text {
  flex: 1;
}
.arrow {
  font-size: 12px;
  margin-left: 10px;
  color: #868686;
}

.rank_info .option {
  cursor: pointer;
  line-height: 40px;
  text-align: left;
  padding: 0;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.rank_info li.selected{
  display: block;
}
.select_wrapper.active .list {
  display: block; 
}
.select_wrapper.active .select_box_header .arrow {
  transform: rotate(180deg);
}
.rank_info .option:hover {
  background-color: #333333; /* 옵션 호버 시 색상 */
}

/* 기본적으로 숨겨진 메뉴 스타일 */
.select_wrapper .list {
  display: none;
  position: absolute;
  top: 39px; /* 셀렉트 박스 아래 위치 */
  left: 0px;
  width: 100%;
  background-color: #181818;
  color: white;
  box-sizing: border-box;
  padding: 0;
  list-style: none;
  z-index: 10;
  border: 1px solid #ffffff;
}

.select_wrapper .option {
  line-height: 40px;
  padding: 0 20px;
  cursor: pointer;
}

.select_wrapper .option.selected {
  display: block;
}

.select_wrapper .option:hover {
  background-color: #333333;
}

.select_wrapper.active .list {
  display: block;
}

.select_wrapper.active .select_box_header .arrow {
  transform: rotate(180deg);
}



.character_tab, .guild_tab {
  background-color: #000;
  padding: 40px 46px;
  box-sizing: border-box;
}
.character_tab .c_tab {
  width: 100%;
  height: 144px;
  margin-bottom: 20px;
}
.character_tab .c_tab ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.character_tab .c_tab ul li {
  background-color: yellow;
  height: 144px;
  width: 228px;
  text-indent: -99999em;
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/character_tab.webp');
  cursor: pointer;
}
.character_tab .c_tab ul li:nth-child(1) {
  background-position: 0 0;
}
.character_tab .c_tab ul li:nth-child(2) {
  background-position: 912px 0;
}
.character_tab .c_tab ul li:nth-child(3) {
  background-position: 684px 0;
}
.character_tab .c_tab ul li:nth-child(4) {
  background-position: 456px 0;
}
.character_tab .c_tab ul li:nth-child(5) {
  background-position: 228px 0;
}


.character_tab .c_tab ul li.on:nth-child(1), .character_tab .c_tab ul li:nth-child(1):hover {
  background-position: 0 144px;
}
.character_tab .c_tab ul li.on:nth-child(2), .character_tab .c_tab ul li:nth-child(2):hover {
  background-position: 912px 144px;
}
.character_tab .c_tab ul li.on:nth-child(3), .character_tab .c_tab ul li:nth-child(3):hover {
  background-position: 684px 144px;
}
.character_tab .c_tab ul li.on:nth-child(4), .character_tab .c_tab ul li:nth-child(4):hover {
  background-position: 456px 144px;
}
.character_tab .c_tab ul li.on:nth-child(5), .character_tab .c_tab ul li:nth-child(5):hover {
  background-position: 228px 144px;
}

.character_tab .tab_section {
  display: none;
}
.character_tab .tab_section.active {
  display: block;
}
.character_tab .tab_section table, .guild_tab .tab_section table  {
  border-collapse: collapse;
  border-spacing: 0;
  border: 0;
  width: 100%;
}

.tab_section table th, .tab_section table td {
  border: 0;
  color: #cacaca;
  font-size: 15px;
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-weight: 400;
  padding: 0 5px;
}

.tab_section thead {
  background-color: #402300;
  height: 44px;
}
.tab_section thead th {
  color: #b6afa9;
  text-align: left;
  font-size: 16px;
}
.tab_section .align_textC {
  text-align: center;
}
/* .character_Tab .tab_section .tb_padding {
  padding-left: 60px;
} */
.tab_section tr {
  border-bottom: 1px solid #3b2000;
  height: 52px;
}
.tab_section tbody tr:nth-child(even) {
  background-color: #0f0f0f;
}
.tab_section .text_color1 td {
  color : #d4b16c;
}

.tab_section td.ranking_1st {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/icon_rank1st.png') no-repeat center;
  text-indent: -9999em;
}
.tab_section td.ranking_2nd {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/icon_rank2nd.png') no-repeat center;
  text-indent: -9999em;
}
.tab_section td.ranking_3rd {
  background: url('https://web-files-cdn.masangsoft.com/_DKOnline/images/sub/icon_rank3rd.png') no-repeat center;
  text-indent: -9999em;
}

.rankUp_arr {
  color:#fc7451;
  font-size: 12px;
  display: inline-block;
  padding-left: 5px;
}
.rankDown_arr {
  color:#54b8fc;
  font-size: 12px;
  display: inline-block;
  padding-left: 5px;
}

img.rank_heraldry{
  vertical-align: middle;
  width: 20px;
  height: 14px;
}
