@import url("https://cdn.jsdelivr.net/npm/nanum-square@1.0.0/dist/style.min.css");

/** reset **/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong,
sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption,
footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; font-size:100%; vertical-align:baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
html, body { margin: 0; padding: 0; width: 100%; height:100%; font-family: "Gothic"; font-size: 13px;position:relative; color:#333}
body{position:relative;}
img{vertical-align:top;}
ol, ul, li, dl{list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
legend,caption{visibility:hidden;overflow:hidden;height:0;font-size:0;line-height:0}
a{text-decoration:none}
a:hover,a:active,a:focus{text-decoration:none;}
textarea, input[type="image"],  input[type="text"],  input[type="submit"],  input[type="password"] {-webkit-appearance:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}
a, input, button{outline:none;}
.txt_hidden, caption{display:inline; overflow: hidden; position:absolute; top:0; left:0; width:0; height:0; font-size:0; text-indent:-1000px;}

/** skipNav **/
#skipNav{position:relative; z-index:100;}
#skipNav a{display: block; overflow: hidden; position:absolute; top:-40px; left:0; width:150px; text-align:center;}
#skipNav a:hover, #skipNav a:active, #skipNav a:focus{top:0; padding:5px; background:#841200 none; font:bold 12px/18px dotum; color:#fff;  text-align:center;}



/** layout **/
#wrap {width:100%;}
.container {width:100%; }

/** header **/
header { width:100%;}
header h1 {position:relative; padding:15px; max-width:750px; margin:0 auto; }
header h1 img{width:116px; height:18px}
header h1 .business_btn {display:inline-block; position:absolute; right:15px; top:18px;font-weight:normal ;}
header h1 .business_btn:after{clear:both; display:block; content:""}
header h1 .business_btn a{position:relative; display:inline-block; text-align: center; color:#333; font-size:12px; float:left; margin-top:-11px;}
header h1 .business_btn a.on {color:#2c3e79}
header h1 .business_btn .game {padding-right:7px; margin-right:6px; }
/*header h1 .business_btn .game:after{display:inline-block; content:""; position:absolute; right:0; top:13px; width:1px; height:12px; background:url('../images/board_bar.gif') no-repeat; }*/
header .bx-wrapper { background:#f1f1f1; }
header .bx-viewport {max-width:613px; margin:0 auto;}
.menu_list li {display:inline-block;display:flex; width:auto !important; padding:0 15px;}
.menu_list li a {display:inline-block;   height:46px; line-height:48px; color:#333; font-size:15px; text-align: center;font-family: 'Gothic';}
.menu_list li a.on {position:relative;color:#2c3e79}

.menu_list li a.on:after{display:inline-block; content:""; position:absolute;left:0; bottom:0; height:3px; width:100%;background: #2c3e79}
/** main **/

.main .container h2 {font-size:18px;font-family: 'Nanum Square'; padding:19px 0 17px 0;}
.main .container h3 {position:relative; }
.more {position:absolute; display:inline-block; width:26px; height:26px;right:0; top:-5px;background:url('../images/btn_more.gif') no-repeat; background-size:100%; }
.visual {position:relative;}
.visual:after{clear:both; display:block; content:""}
.visual .banner_list img{width:100%}
.bx-controls {display:block;  margin-top:-30px; margin-bottom:20px;position:relative; z-index: 100; text-align: center; }
.bx-controls-auto   {display:inline-block;}
.bx-start{display:block; overflow:hidden;  width:12px; height:12px; background:url("../images/slider_pager_play.png") no-repeat 0 0; background-size:100% auto; font-size:0; text-indent:-9999px;  z-index: 2;  }
.bx-stop{display:block; overflow:hidden; width:12px; height:12px; background:url("../images/slider_pager_stop.png") no-repeat 0 0;background-size:100% auto; font-size:0; text-indent:-9999px;  z-index: 2; }
.bx-pager {height:12px; z-index: 50;  display:inline-block;}
.bx-pager-item {display:inline-block;}
.bx-pager .bx-pager-item a{display:inline-block; margin-right:6px; overflow:hidden; width:12px; height:12px;background:url(../images/slider_pager_off.png) no-repeat; background-size:100% auto; font-size:5px; color:#fef1d2; text-align:center; line-height:15px;text-indent:-9999px; }
.bx-pager .bx-pager-item a.active{background:url(../images/slider_pager_on.png) no-repeat;text-indent:-9999px;background-size:100% auto; }
.businessLineup {padding:0 4%; width:92%; padding-bottom:25px; border-bottom:9px solid #f2f2f2}
.businessLineup ul:after{clear:both; display:block; content:""}
.businessLineup ul li{width:22.3%;  float:left; margin-left:3.2% }
.businessLineup ul li:first-child,.businessLineup ul li.first{margin-left:0}
.businessLineup ul a {display:block; width:100%; height:100%; text-align: center;}
.businessLineup ul a strong{font-size:12px; color:#333; display:block; padding-top:9px; width:100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;
    word-wrap:break-word;  line-height: 1.4em;height: 2.8em; }

.businessLineup ul img{ width:100%; border:1px solid #d9d9d9;}
.businessLineup h3 {font-size:16px; font-weight:normal; padding-bottom:10px;}
.businessLineup .game_list {margin-bottom:0}

.neocyonNews {padding:0 4%; border-bottom:9px solid #f2f2f2}
.neocyonNews h2 {position:relative;}
.neocyonNews h2 .more{margin-top:-13px; top:50%;}
.neocyonNews ul li a{display:block}
.neocyonNews ul a {padding:16px 0; border-top:1px solid #f2f2f2}
.neocyonNews ul a p{text-align: left; overflow:hidden; text-overflow:ellipsis; text-overflow:hidden; white-space: nowrap; word-break: break-all; }
.neocyonNews ul a .tit {padding-bottom:6px; font-size:16px; color:#333; height:30px; line-height:30px}
.neocyonNews ul a .tit .ttxt {display:inline-block;max-width:88%; margin-right:5px;overflow:hidden; text-overflow:ellipsis; text-overflow:hidden; white-space: nowrap; word-break: break-all; line-height:30px; height:30px}
.neocyonNews ul a .tit .ico_new {display: inline-block; width: 13px; height: 30px; background: url(../images/ico_new.gif) no-repeat left center; background-size: 100% auto; vertical-align: top; margin-left:5px; }

.neocyonNews ul a .date {font-size:14px; color:#888 }
.neocyonNews ul a .date span {position:relative; display:inline-block; padding-right:9px; margin-right:9px;}
.neocyonNews ul a .date span:after{position:absolute; right:0; top:2px;content:""; display:inline-block; width:1px; height:12px;  background:url(../images/board_bar.gif) no-repeat; background-size:100% auto ; }
.neoProposal {width:100%;border-bottom:1px solid #f2f2f2 }
.neoProposal img{width:100%; }
.neoProposal div:after{display:block; content:""; clear:both;}
.neoProposal div {width:100%; max-width:750px; margin:0 auto;}
.neoProposal:after{clear:both; display:block; content:""}
.neoProposal a {display:block; width:100%; max-width:375px; box-sizing: border-box; margin:0 auto; float:none;text-align: center;}
.neoProposal a:after{clear:both; display:block; content:""}
.neoProposal label{display:block; padding:26px 0 25px 0;line-height:27px; font-size:16px; color:#333;box-sizing: border-box;vertical-align: middle; margin:0 auto;}

.neoProposal .game .ico {display:inline-block; width:28px; height:27px; background:url('../images/ico_gameProposal.gif') no-repeat left top; background-size:100% auto; vertical-align: middle; margin:-1px 11px 0 0;}
.neoProposal .sism {border-left:1px solid #f2f2f2}
.neoProposal .sism .ico {display:inline-block; width:28px; height:27px; background:url('../images/ico_siProposal.gif') no-repeat left top; background-size:100% auto; vertical-align: middle; margin:-3px 11px 0 0;}
.main .addr {text-align: center;padding-top:28px;}
.main .addr a {border-bottom:1px solid #0c00ff; color:#0c00ff; }
.main .addr p,.addr address,.addr a{font-size:14px;line-height:1.6em; font-style:normal}
.main .addr div ,.addr div img{width:100%;}
.main .addr div {margin-top:28px;}

.sub h2 {position:relative; font-size:19px; padding:30px 0 15px; max-width:750px; margin:0 auto; }
.sub h2:after{position:absolute; left:0; bottom:0; display:block; content:""; width:15px; height:1px ; background:#333;}
.sub .container {padding:0 4%; width:92%; max-width:750px; margin:0 auto 100px; }
.sub .contents {margin-top:20px; }

/** 게임리스트 **/
.sub .gameList{border-top:1px solid #f2f2f2;  min-height:340px}
.sub .gameList li {position:relative; padding:20px 0 19px 0;border-bottom:1px solid #f2f2f2;}
.gameList .clear:after{clear:both; display:block; content:""}
.gameList .thumb {float:left; display:inline-block; width:100px; height:100px;}
.gameList .thumb img{width:100%;}
.gameList .gameList_contents {float:left; width:65.7%; padding-left:3.7%;}
.gameList_contents h3 {vertical-align: middle; font-size:16px; margin-bottom:6px; padding-right:30px}
.gameList_contents h3 .home {display:inline-block; background:url(../images/ico_home.png) no-repeat 0 3px; width:14px; height:15px; margin-left:6px; background-size:100%; }

.game_info:after{clear:both; display:block; content:""}
.game_info {display:block; margin-bottom:7px}
.game_info span {position:relative; float:left; font-size:12px; display:inline-block; padding-left:9px; margin-right:8px; vertical-align: middle;}
.game_info span:after{position:absolute; left:0; top:2px; content:"";  display:inline-block; width:1px; height:12px; background:#e9e9e9}
.game_info span:first-child {padding-left:0}
.game_info span:first-child:after{display:none;}

.game_info2 {position:absolute; right:0; top:22px;}
.game_info2:after{clear:both; display:block; content:""}
.game_info2 span {float:left; margin-left:6px;}
.game_info2 .android_bi {display:inline-block; width:14px; height:17px; background:url('../images/ico_androidBi.png') no-repeat; background-size:100% auto}
.game_info2 .apple_bi {display:inline-block; width:13px; height:17px; background:url('../images/ico_appleBi_1114.png') no-repeat; background-size:100% auto}

.download_list {display:block; margin-bottom:8px }
.download_list a{display:inline-block; vertical-align: top; background:url(../images/ico_sprite_1115.png) no-repeat center; cursor:pointer;background-size:288px 72px; margin-right:3px}
.download_list a.ico_IOS-KR {width:32px; height:31px;  background-position:-30px 0; }
.download_list a.ico_IOS-EN {width:32px; height:31px;  background-position:-65px 0; }
.download_list a.ico_IOS-TW {width:32px; height:31px;  background-position:-102px 0; }
.download_list a.ico_IOS-TH {width:32px; height:31px;   background-position:-140px 0;}
.download_list a.ico_IOS-HK {width:32px; height:31px;   background-position:-177px 0;}
.download_list a.ico_ANDROID-KR {width:29px; height:30px; background-position:-36px -42px; }
.download_list a.ico_ANDROID-EN {width:29px; height:30px;  background-position:-69px -42px;}
.download_list a.ico_ANDROID-TW {width:29px; height:30px;  background-position:-106px -42px; }
.download_list a.ico_ANDROID-TH {width:29px; height:30px;  background-position:-143px -42px;}
.download_list a.ico_ANDROID-HK {width:29px; height:30px;  background-position:-181px -42px;}
.download_list a.ico_MYCARD {width:26px; height:30px; background-position:-222px -42px; }
.download_list a.ico_WEB {width:29px; height:30px; background-position:-259px -42px }
.download_list a.ico_ETC {width:29px; height:30px; background-position:-259px 0;}
.download_list a.ico_ONE {width:25px; height:30px; background-position:-222px 0;}
.screenshot_list {display:inline-block;}
.screenshot_list:after{clear:both; display:block; content:""}
.screenshot_list a {display:inline-block; float:left; vertical-align: top; margin-right:4px}
/* .screenshot_list a img {width:33px; height:23px;}
.screenshot_list a.btn_screenshot img {width:33px; height:23px; } */
.screenshot_list a.media { width:33px; height:23px; background:url(../images/ico_video.gif) no-repeat; background-size:100% auto;} 
.gameList_txt {font-size:13px; margin-top:15px; line-height:1.6em}
.gameList_txt * {font-size:13px}

/** 게임 사업문의 **/
.gameBusiness .txt{font-size:16px; margin-bottom:25px;}
.gameBusiness .txt .em {color:#da4d00}
.gameBusiness a {display:block; width:100%; border:1px solid #e8e8e8; padding:25px 0; margin-bottom:10px; text-align: center;   font-size:15px; color:#333}
.gameBusiness a .em{color:#0034c7}
.gameBusiness a:last-child {margin-bottom:35px}

/** 보도자료 **/
.board_style { border-top:1px solid #f2f2f2; min-height:340px}
.board_style li a{display:block; font-size:16px; padding:14px 0; color:#333;border-bottom:1px solid #f2f2f2; }
.board_style li .tit,.board_style li .date {display:block;}
.board_style li .tit {margin-bottom:7px;}
.board_style li .tit .ico_new {display:inline-block; width:13px; height:12px; background:url(../images/ico_new.gif) no-repeat; background-size:100% auto; vertical-align: middle}
.board_style li .date{ font-size:14px; color:#888}
.board_style li .date .bar {position:relative; display:inline-block; padding-left:9px; margin-left:9px;}
.board_style li .date .bar:after{ content:""; position:absolute; left:0; top:3px; display:inline-block; width:1px; height:12px; background:#e8e8e8; }

/** CEO 인사말/비전 **/
.ceo_txt {font-size:14px;}
.ceo_txt span {display:block; margin-bottom:23px;}
.ceo_txt .em {font-size:16px; color:#2c3e79}
.sign {margin-top:47px; margin-bottom:45px; text-align:center; }
.sign img{width:167px; height:34px;}
.sign span {display:block; margin-top:20px; font-size:14px}

/** 인재상 **/s
.talentTxt {margin-bottom:30px; line-height:1.7em;letter-spacing: -1px}
.talentTxt .em {display:block; font-size:16px; color:#2c3e79; margin-bottom:35px; }
.talentTxt h3 {position:relative;padding-left:14px; font-size:18px;color:#2c3e79; margin:27px 0 9px}
.talentTxt h3:after{position:absolute; left:0; top:6px; content:""; display:inline-block; width:8px; height:13px; background:url(../images/ico_titArrow.gif) no-repeat; background-size:100% auto; }
.talentTxt h3:first-child {margin-top:0}
.talentTxt p {font-size:16px;}
.talentTxt .tit {margin-bottom:4px;}
.talentTxt .tit > span {font-weight:bold; display:inline-block; }
.talentImg img{width:345px; }
p.talentImg {margin-bottom:10px;}

/** 오시는길 **/

.contactUs_txt {margin-bottom:30px; line-height:1.7em;letter-spacing: -1px}
.contactUs_txt .em {display:block; font-size:16px; color:#2c3e79; margin-bottom:35px; }
.contactUs_txt h3 {position:relative;padding-left:14px; font-size:18px;color:#2c3e79; margin:27px 0 9px}
.contactUs_txt h3:after{position:absolute; left:0; top:6px; content:""; display:inline-block; width:8px; height:13px; background:url(../images/ico_titArrow.gif) no-repeat; background-size:100% auto; }
.contactUs_txt h3:first-child {margin-top:0}
.contactUs_txt p {font-size:16px;}
.contactUs_txt .tit {margin-bottom:4px;}
.contactUs_txt .tit > span {font-weight:bold;}
.contactUs_map{display:block; width:100%;max-width:750px; margin:20px auto 30px}


/** popup **/
.modalbox .bx-wrapper {position:relative;}
.modalbox .bx-controls {position: absolute;left:0; top:50%; z-index: 100; text-align: center; width:100%; height:40px; margin-top:-20px;margin-bottom:0; }
.modalbox .bx-viewport .banner_list02 li img {width:100%; height:100%;} 
.modalbox .bx-wrapper .bx-controls-direction a {color:#fff; font-size:20px; font-weight:bold; text-align: center; line-height:40px;  display:inline-block; width:40px; height:40px; background:rgba(0,0,0,0.5);  font-family:"dotum";}
.modalbox .bx-wrapper .bx-controls-direction a.bx-prev {position:absolute; left:-40px; top:50%; margin-top:-20px;}
.modalbox .bx-wrapper .bx-controls-direction a.bx-next {position:absolute; right:-40px; top:50%; margin-top:-20px;}
.modalbox.media {display:none; position:absolute; top:50%; left:50%; width:100%; max-width:320px; height:210px; margin-top:-75px; margin-left:-160px;  z-index:150}
.modalbox.media iframe {width:320px !important; height:210px !important;position: relative;
}
.modalbox.row {display:none; position:absolute; top:50%; left:50%; width:100%; max-width:320px; height:210px; margin-top:-105px; margin-left:-160px; background:#fff; z-index:150}
.modalbox.row .bx-viewport {width:320px !important; height:210px !important; margin:0 auto; overflow:hidden;}
.modalbox.row .bx-viewport .banner_list02{overflow:hidden;}
.modalbox.row .bx-viewport .banner_list02 li {width:320px; height:210px !important}
.modalbox.col {display:none; position:absolute; top:50%; left:50%; width:100%; max-width:231px; height:385px; margin-top:-192px; margin-left:-115px; background:#fff; z-index:150}
.modalbox.col .bx-viewport {width:231px !important;height:385px !important; margin:0 auto; overflow:hidden;}
.modalbox.col .bx-viewport .banner_list02 li {width:231px;}
.modalbox.col .bx-wrapper .bx-controls-direction a.bx-prev {position:absolute; left:-50px; top:50%; margin-top:-20px;}
.modalbox.col .bx-wrapper .bx-controls-direction a.bx-next {position:absolute; right:-50px; top:50%; margin-top:-20px;}
.modalbox .close_popup {position:absolute; right:0; top:-35px; width:35px; cursor:pointer;}
.modalbox .close_popup img {width:100%; height:100%;}



/** blind **/
.blind{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background-color:black; opacity : 0.7; filter: alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; z-index:50; }

/** scrollTop **/
.scrollTop {width:100%;  border-bottom:9px solid #f2f2f2; margin-top:100px;}
.scrollTop:after{clear:both; display:block; content:""}
.scrollTop a{display:inline-block; width:50%; float:left; text-align: center;background:#f4f9fc; height:46px; line-height:46px; box-sizing:border-box;color:#333; font-size:15px;}
.scrollTop a:focus{color:#333;}
.scrollTop a#btn_top{border-left:1px solid #e9e9e9}
.scrollTop a span {display:inline-block; width:8px; height:12px; background:url(../images/down_arrow.png) no-repeat 0 2px; background-size:100% auto; margin-left:4px;}
.scrollTop a span.up_arrow {display:inline-block; width:8px; height:12px; background:url(../images/up_arrow.png) no-repeat 0 2px; background-size:100% auto;}
/** footer **/
footer {text-align: center;background:#f8f8f8; padding-bottom:20px}
.main footer {text-align: center;background:transparent}
footer p {text-align:center; font-size:12px; font-family: 'Calibri'; color:#999; }
.languageBlock {text-align: center; display:block; padding-top:10px; margin-bottom:15px; height:25px;}
.languageBlock a {display:inline-block; width:65px; height:25px; vertical-align: top}
.languageBlock a.ko {background:url(../images/bg_btn_languageKoOff.png) no-repeat left top; background-size:100% auto; margin-right:12px}
.languageBlock a.en {background:url(../images/bg_btn_languageEnOff.png) no-repeat left top; background-size:100% auto}
.languageBlock a.ko.on {background:url(../images/bg_btn_languageKoOn.png) no-repeat left top; background-size:100% auto}
.languageBlock a.en.on {background:url(../images/bg_btn_languageEnOn.png) no-repeat left top; background-size:100% auto}
.px320 {display:none;}
.px320 {display:none;}

@media (max-width:320px){
   .txt {font-size:13px} 
   .px320 {display:inline;}
   .talentImg img{width:290px; }
   .gameList .gameList_contents {width:63%; padding-left:3%}
   .game_info span {font-size:11px}

}

/* popupMain */
.popup_main{display:none; width: 90vw; height: auto; position: absolute; left:5vw; top: 10vw; z-index: 100; box-sizing: border-box;}
.popup_main .popup_contents, .popup_main .popup_contents img, .popup_main .popup_header .popup_btn_close img{ width: 100%; height: auto;}
.popup_main .popup_header .popup_btn_close{position: absolute; top:5vw; right:5vw; width:5vw}
