@charset "utf-8";

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 {padding:0;margin:0;font-size:100%;}
article, aside, figcaption, figure, video, audio, footer, header, hgroup, menu, nav, section {display:block;}
body, input, button, textarea, select, table {font-family:Noto Sans KR, Helvetica, sans-serif;font-size:14px;color:#333;}
img, fieldset, button {border:0;}
li {list-style:none;}
a {text-decoration:none;color:#333;}
a:hover, a:focus, a:active {text-decoration:none;}
img {vertical-align:middle;}
table {table-layout:fixed;border-collapse:collapse;border-spacing:0;}
caption, legend {width:0;height:0;font-size:0;line-height:0;text-indent:-9999px;visibility:hidden;}
input {padding:0;margin:0;line-height:100%;outline:0;border:0;box-sizing:border-box;}
input[type=text]::-ms-clear {display:none;}
button, label {cursor:pointer;}
button {position:relative;background-color:transparent;outline:0;}
a, button, label, input, select, textarea {outline:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
a:focus, a:hover {color:inherit;}
::-webkit-input-placeholder {font-size:14px;color:#999;}
:-moz-placeholder {font-size:14px;color:#999;opacity:1;}
::-moz-placeholder {font-size:14px;color:#999;opacity:1;}
:-ms-input-placeholder {font-size:14px !important;color:#999 !important;}

h1, h2, h3, h4, h5, h6, p {line-height:100%;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {font-weight:bold;}
dt {font-weight:normal;}
.blind {overflow:hidden;display:block;position:absolute;left:0;top:0;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999px;visibility:hidden;}
html {overflow-x:hidden;overflow-y:inherit;}
html.pop-open {overflow-y:hidden;}
.default-bg-color {background-color:#fff;}
body {overflow:hidden;width:100%;min-width:1300px;position:relative;background:#ffffff;}
.swiper-container-horizontal {overflow:hidden;}
.swiper-wrapper {width:2000%; /* for IE */width:max-content;height:100%;}
.swiper-wrapper:after {display:block;clear:both;content:"";}
.swiper-slide {overflow:hidden;position:relative;float:left;width:100%;height:100%;}
.swiper-button-disabled {opacity:0.5;}

@font-face{
	font-family:'NEXONGothic';
	src:url('https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/fonts/NEXON_Lv1_Gothic_Low.eot');
	src:url('https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/fonts/NEXON_Lv1_Gothic_Low.eot?#iefix') format('embedded-opentype'),
		url('https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/fonts/NEXON_Lv1_Gothic_Low.woff') format('woff');
	font-weight:normal;
	font-style:normal;
}
@font-face{
	font-family:'NEXONGothic';
	src:url('https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/fonts/NEXON_Lv1_Gothic_Low_Bold.eot');
	src:url('https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/fonts/NEXON_Lv1_Gothic_Low_Bold.eot?#iefix') format('embedded-opentype'),
		url('https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/fonts/NEXON_Lv1_Gothic_Low_Bold.woff') format('woff');
	font-weight:bold;
	font-style:normal;
}

html {background-color:#f8f9fa;}

/* pc */
body.pc {min-width:1000px;}
.pc #wrap {overflow:hidden;width:100%;background-color:#f8f9fa;font-family:'NEXONGothic', Helvetica, sans-serif;font-size:19px;line-height:1.1em;word-break:break-all;}
.pc #wrap img {max-width:100%;}
.pc #container {position:relative;}
.pc #container:after {display:block;clear:both;content:'';}
.pc #contents {position:relative;width:1000px;min-height:1240px;padding-top:74px;margin:0 auto;}

.pc .top {margin-bottom:74px;color:#222426;text-align:center;}
.pc .top .tit {display:inline-block;padding:12px 0 11px 90px;margin-bottom:15px;background:url(https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/main/icon_community.png) no-repeat;background-size:67px 61px;font-size:42px;}
.pc .top .tag {overflow:hidden;font-size:18px;text-align:center;}
.pc .top .tag li {display:inline-block;}

.pc .g-list {overflow:hidden;margin:0 25px;}
.pc .g-list li {float:left;width:160px;margin:0 15px 30px;background-color:#fff;}
.pc .g-list li a {display:block;}
.pc .g-list li .g-img {height:160px;}
.pc .g-list li .g-img img {width:100%;height:100%;}
.pc .g-list li dl {height:90px;padding:18px 10px 0 10px;box-sizing:border-box;}
.pc .g-list li dl .g-title {font-size:15px;font-weight:bold;color:#000;}
.pc .g-list li dl .g-type {font-size:12px;color:#9fa1a7;}

.pc .btn-fixed {position:fixed;right:20px;bottom:20px;z-index:1;}
.pc .btn-fixed .btn-top {display:block;width:110px;height:36px;background:url(https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/main/btn_top_off.jpg);text-indent:-9999px;transition:all .15s linear,bottom 0s;}
.pc .btn-fixed .btn-top:hover {background:url(https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/main/btn_top_on.jpg);}

.pc #footer {padding:50px 0;background-color:#fff;text-align:center;}
.pc #footer .tospp {margin:0 auto;color:#888888;font-size:13px;text-align:center;}
.pc #footer .tospp > i {margin:0 5px;font-style:normal;color: #d6d6d6;}
.pc #footer .tospp > .bold {font-weight:700;}
.pc #footer .logo-nexon {margin-top:21px;line-height: normal;}
.pc #footer .logo-nexon img {width:73px;height:26px;margin-right:5px;object-fit: contain;}
.pc #footer .logo-nexon span {display:inline-block;vertical-align:top;height:15px;font-size: 11px; color:#8b8b8b; text-align: left;margin-top:3px;font-weight: 300;}

/* mobile */
body.mobile {min-width:initial;word-break:break-all;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;}
.mobile #wrap {overflow:hidden;width:100%;min-width:320px;background-color:#f8f9fa;font-family:'NEXONGothic', Helvetica, sans-serif;line-height:1.1em;word-break:break-all;}
.mobile #wrap img {max-width:100%;}
.mobile #container {position:relative;}
.mobile #container:after {display:block;clear:both;content:'';}
.mobile #contents {position:relative;min-width:320px;max-width:750px;min-height:480px;padding-top:37px;margin:0 auto;}

.mobile .top {margin-bottom:37px;color:#222426;text-align:center;}
.mobile .top .tit {display:inline-block;padding:4px 0 5px 49px;margin-bottom:10px;background:url(https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/main/icon_community.png) no-repeat;background-size:37px 35px;font-size:26px;}
.mobile .top .tag {overflow:hidden;font-size:12px;text-align:center;}
.mobile .top .tag li {display:inline-block;}

.mobile .g-list {overflow:hidden;width:660px;margin:0 auto;}
.mobile .g-list li {display:inline-block;width:100px;margin:0 5px;}
.mobile .g-list li a {display:block;}
.mobile .g-list li .g-img {height:100px;}
.mobile .g-list li .g-img img {width:100%;height:100%;}
.mobile .g-list li dl {height:75px;padding-top:13px;box-sizing:border-box;}
.mobile .g-list li dl .g-title {overflow:hidden;font-size:13px;font-weight:bold;color:#000;white-space:nowrap;text-overflow:ellipsis;}
.mobile .g-list li dl .g-type {font-size:10px;color:#9fa1a7;}

.mobile .btn-fixed {position:fixed;right:4%;bottom:10px;z-index:1;}
.mobile .btn-fixed .btn-top {display:block;width:46px;height:46px;background:url(https://dszw1qtcnsa5e.cloudfront.net/bin/live/console-community-view/assets/main/icon-top.png);background-size:100% auto;text-indent:-9999px;}

.mobile #footer {padding:18px 0 14px;background-color:#f4f4f4;text-align:center;}
.mobile #footer ul {margin-bottom:6px;}
.mobile #footer ul li {display:inline-block;margin:0 0px 4px;}
.mobile #footer ul li a,
.mobile #footer ul li button {display:inline-block;padding:5px 11px 3px;background-color:#fff;border:1px solid #e1e1e1;font-size:12px;color:#666;}
.mobile #footer ul li .bold {font-weight:bold;}
.mobile #footer p {padding-top:8px;font-size:12px;color:rgba(0,0,0,0.5);}
.mobile #footer .logo-nexon {margin-top:20px;}
.mobile #footer .logo-nexon img {width:85px;height:30px;margin-right:5px;object-fit: contain;}
.mobile #footer .logo-nexon span {display:inline-block;vertical-align:top;font-size: 13px; color:#8b8b8b; text-align:left; margin-top:4px;font-weight: 300;}


@media(max-width:659px){
	.mobile .g-list {width:550px;}
}
@media(max-width:549px){
	.mobile .g-list {width:440px;}
}
@media(max-width:439px){
	.mobile .g-list {width:330px;}
}
@media(max-width:329px){
	.mobile .g-list {width:220px;}
}