/*! normalize.css v1.1.3 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
 */
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {display: block;}
/**
 * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
 */

audio,canvas,video {display: inline-block; *display: inline; *zoom: 1;}
/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {display: none; height: 0;}
/**
 * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
 * Known issue: no IE 6 support.
 */

[hidden] {display: none;}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
 *    `em` units.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {font-size: 100%; /* 1 */    -ms-text-size-adjust: 100%; /* 2 */    -webkit-text-size-adjust: 100%; /* 2 */}
/**
 * Address `font-family` inconsistency between `textarea` and other form
 * elements.
 */

html,button,input,select,textarea {font-family: sans-serif;}
/**
 * Address margins handled incorrectly in IE 6/7.
 */

body {margin: 0;}

/* ==========================================================================
   Links
   ========================================================================== */

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */

a:focus {outline: thin dotted;}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,a:hover {outline: 0;}

/* ==========================================================================
   Typography
   ========================================================================== */

/**
 * Address font sizes and margins set differently in IE 6/7.
 * Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
 * and Chrome.
 */

h1 {font-size: 2em; margin: 0.67em 0;}
h2 {font-size: 1.5em; margin: 0.83em 0;}
h3 {font-size: 1.17em; margin: 1em 0 0.5em;}
h4 {font-size: 1em; margin: 1.33em 0 0.5em;}
h5 {font-size: 0.83em; margin: 1.67em 0;}
h6 {font-size: 0.67em; margin: 2.33em 0;}
/**
 * Address styling not present in IE 7/8/9, Safari 5, and Chrome.
 */

abbr[title] {border-bottom: 1px dotted;}

/**
 * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
 */

b,strong {font-weight: bold;}

blockquote {margin: 1em 40px;}

/**
 * Address styling not present in Safari 5 and Chrome.
 */

dfn {font-style: italic;}

/**
 * Address differences between Firefox and other browsers.
 * Known issue: no IE 6/7 normalization.
 */

hr {-moz-box-sizing: content-box; box-sizing: content-box; height: 0;}

/**
 * Address styling not present in IE 6/7/8/9.
 */

mark {background: #ff0; color: #000;}

/**
 * Address margins set differently in IE 6/7.
 */

p,
pre {
    margin: 1em 0;
}
.library p {
    margin: 1.5em 0;
}

h1 + p,
h2 + p,
h3 + p,
h4 + p,
h5 + p,
h6 + p {margin:0.5em 0 1em}

/**
 * Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
 */

code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/**
 * Address CSS quotes not supported in IE 6/7.
 */

q {
    quotes: none;
}

/**
 * Address `quotes` property not supported in Safari 4.
 */

q:before,
q:after {
    content: '';
    content: none;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* ==========================================================================
   Lists
   ========================================================================== */

/**
 * Address margins set differently in IE 6/7.
 */

dl,
menu,
ol,
ul {
    list-style: none;
    list-style-image: none;
}

dd {
    margin: 0 0 0 40px;
}

/**
 * Address paddings set differently in IE 6/7.
 */

menu,
ol,
ul {
    padding: 0 0 0 40px;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */

/**
 * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 2. Improve image quality when scaled in IE 7.
 */

img {
    border: 0; /* 1 */
    -ms-interpolation-mode: bicubic; /* 2 */
}

/**
 * Correct overflow displayed oddly in IE 9.
 */

svg:not(:root) {
    overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */

/**
 * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
 */

figure {
    margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

/**
 * Correct margin displayed oddly in IE 6/7.
 */

form {
    margin: 0;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct color not being inherited in IE 6/7/8/9.
 * 2. Correct text not wrapping in Firefox 3.
 * 3. Correct alignment displayed oddly in IE 6/7.
 */

legend {
    border: 0; /* 1 */
    padding: 0;
    white-space: normal; /* 2 */
    *margin-left: -7px; /* 3 */
}

/**
 * 1. Correct font size not being inherited in all browsers.
 * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
 *    and Chrome.
 * 3. Improve appearance and consistency in all browsers.
 */

button,
input,
select,
textarea {
    font-size: 100%; /* 1 */
    margin: 0; /* 2 */
    vertical-align: baseline; /* 3 */
    *vertical-align: middle; /* 3 */
}

/**
 * Address Firefox 3+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */

button,
select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. Remove inner spacing in IE 7 without affecting normal text inputs.
 *    Known issue: inner spacing remains in IE 6.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
    *overflow: visible;  /* 4 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
    cursor: default;
}

/**
 * 1. Address box sizing set to content-box in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 * 3. Remove excess padding in IE 7.
 *    Known issue: excess padding remains in IE 6.
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
    *height: 13px; /* 3 */
    *width: 13px; /* 3 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 3+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 6/7/8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
    border-collapse: collapse;
    border-spacing: 0;
}






/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles ★☆★ここから★☆★
   ========================================================================== */
h1 {margin:0}
h2 {font-size:120%; font-weight:bold;}
h3 {font-size:120%; font-weight:bold;}
h2:first-child, h3:first-child {margin-top:0;}
p:first-child {margin-top:0}
p:last-child {margin-bottom:0}
.contentElement li {margin-left:1.5em;}
.s {font-size:90%; color:#888;}
.text-happy {color:#FE7E0A;}
.text-nowrap {white-space: nowrap}
.text-center {text-align: center !important;}
.text-left {text-align: left !important;}
.text-right {text-align: right !important;}
.font-size-sm, .font-size-sm * {font-size: 12px;}

.mt-auto {margin-top: auto !important;}
.mr-auto {margin-right: auto !important;}
.mb-auto {margin-bottom: auto !important;}
.ml-auto {margin-left: auto !important;}

.mt-1 {margin-top: 0.25rem !important;}
.mr-1 {margin-right: 0.25rem !important;}
.mb-1 {margin-bottom: 0.25rem !important;}
.ml-1 {margin-left: 0.25rem !important;}
.mx-1 {margin-left: 0.25rem !important; margin-right: 0.25rem !important;}
.my-1 {margin-top: 0.25rem !important; margin-bottom: 0.25rem !important;}
.m-1 {margin: 0.25rem !important;}

.mt-2 {margin-top: 0.5rem !important;}
.mr-2 {margin-right: 0.5rem !important;}
.mb-2 {margin-bottom: 0.5rem !important;}
.ml-2 {margin-left: 0.5rem !important;}
.mx-2 {margin-left: 0.5rem !important; margin-right: 0.5rem !important;}
.my-2 {margin-top: 0.5rem !important; margin-bottom: 0.5rem !important;}
.m-2 {margin: 0.5rem !important;}

.mt-3 {margin-top: 1rem !important;}
.mr-3 {margin-right: 1rem !important;}
.mb-3 {margin-bottom: 1rem !important;}
.ml-3 {margin-left: 1rem !important;}
.mx-3 {margin-left: 1rem !important; margin-right: 1rem !important;}
.my-3 {margin-top: 1rem !important; margin-bottom: 1rem !important;}
.m-3 {margin: 1rem !important;}

.mt-4 {margin-top: 1.5rem !important;}
.mr-4 {margin-right: 1.5rem !important;}
.mb-4 {margin-bottom: 1.5rem !important;}
.ml-4 {margin-left: 1.5rem !important;}
.mx-4 {margin-left: 1.5rem !important; margin-right: 1.5rem !important;}
.my-4 {margin-top: 1.5rem !important; margin-bottom: 1.5rem !important;}
.m-4 {margin: 1.5rem !important;}

.mt-5 {margin-top: 3rem !important;}
.mr-5 {margin-right: 3rem !important;}
.mb-5 {margin-bottom: 3rem !important;}
.ml-5 {margin-left: 3rem !important;}
.mx-5 {margin-left: 3rem !important; margin-right: 3rem !important;}
.my-5 {margin-top: 3rem !important; margin-bottom: 3rem !important;}
.m-5 {margin: 3rem !important;}

.mt-n1 {margin-top: -0.25rem !important;}
.mr-n1 {margin-right: -0.25rem !important;}
.mb-n1 {margin-bottom: -0.25rem !important;}
.ml-n1 {margin-left: -0.25rem !important;}
.mx-n1 {margin-left: -0.25rem !important; margin-right: -0.25rem !important;}
.my-n1 {margin-top: -0.25rem !important; margin-bottom: -0.25rem !important;}
.m-n1 {margin: -0.25rem !important;}

.mt-n2 {margin-top: -0.5rem !important;}
.mr-n2 {margin-right: -0.5rem !important;}
.mb-n2 {margin-bottom: -0.5rem !important;}
.ml-n2 {margin-left: -0.5rem !important;}
.mx-n2 {margin-left: -0.5rem !important; margin-right: -0.5rem !important;}
.my-n2 {margin-top: -0.5rem !important; margin-bottom: -0.5rem !important;}
.m-n2 {margin: -0.5rem !important;}

.mt-n3 {margin-top: -1rem !important;}
.mr-n3 {margin-right: -1rem !important;}
.mb-n3 {margin-bottom: -1rem !important;}
.ml-n3 {margin-left: -1rem !important;}
.mx-n3 {margin-left: -1rem !important; margin-right: -1rem !important;}
.my-n3 {margin-top: -1rem !important; margin-bottom: -1rem !important;}
.m-n3 {margin: -1rem !important;}

.mt-n4 {margin-top: -1.5rem !important;}
.mr-n4 {margin-right: -1.5rem !important;}
.mb-n4 {margin-bottom: -1.5rem !important;}
.ml-n4 {margin-left: -1.5rem !important;}
.mx-n4 {margin-left: -1.5rem !important; margin-right: -1.5rem !important;}
.my-n4 {margin-top: -1.5rem !important; margin-bottom: -1.5rem !important;}
.m-n4 {margin: -1.5rem !important;}

.mt-n5 {margin-top: -3rem !important;}
.mr-n5 {margin-right: -3rem !important;}
.mb-n5 {margin-bottom: -3rem !important;}
.ml-n5 {margin-left: -3rem !important;}
.mx-n5 {margin-left: -3rem !important; margin-right: -3rem !important;}
.my-n5 {margin-top: -3rem !important; margin-bottom: -3rem !important;}
.m-n5 {margin: -3rem !important;}

.pt-1 {padding-top: 0.25rem !important;}
.pr-1 {padding-right: 0.25rem !important;}
.pb-1 {padding-bottom: 0.25rem !important;}
.pl-1 {padding-left: 0.25rem !important;}
.px-1 {padding-left: 0.25rem !important; padding-right: 0.25rem !important;}
.py-1 {padding-top: 0.25rem !important; padding-bottom: 0.25rem !important;}
.p-1 {padding: 0.25rem !important;}

.pt-2 {padding-top: 0.5rem !important;}
.pr-2 {padding-right: 0.5rem !important;}
.pb-2 {padding-bottom: 0.5rem !important;}
.pl-2 {padding-left: 0.5rem !important;}
.px-2 {padding-left: 0.5rem !important; padding-right: 0.5rem !important;}
.py-2 {padding-top: 0.5rem !important; padding-bottom: 0.5rem !important;}
.p-2 {padding: 0.5rem !important;}

.pt-3 {padding-top: 1rem !important;}
.pr-3 {padding-right: 1rem !important;}
.pb-3 {padding-bottom: 1rem !important;}
.pl-3 {padding-left: 1rem !important;}
.px-3 {padding-left: 1rem !important; padding-right: 1rem !important;}
.py-3 {padding-top: 1rem !important; padding-bottom: 1rem !important;}
.p-3 {padding: 1rem !important;}

.pt-4 {padding-top: 1.5rem !important;}
.pr-4 {padding-right: 1.5rem !important;}
.pb-4 {padding-bottom: 1.5rem !important;}
.pl-4 {padding-left: 1.5rem !important;}
.px-4 {padding-left: 1.5rem !important; padding-right: 1.5rem !important;}
.py-4 {padding-top: 1.5rem !important; padding-bottom: 1.5rem !important;}
.p-4 {padding: 1.5rem !important;}

.pt-5 {padding-top: 3rem !important;}
.pr-5 {padding-right: 3rem !important;}
.pb-5 {padding-bottom: 3rem !important;}
.pl-5 {padding-left: 3rem !important;}
.px-5 {padding-left: 3rem !important; padding-right: 3rem !important;}
.py-5 {padding-top: 3rem !important; padding-bottom: 3rem !important;}
.p-5 {padding: 3rem !important;}

.d-none {display: none !important;}
.d-inline {display: inline !important;}
.d-inline-block {display: inline-block !important;}
.d-block {display: block !important;}
.d-table {display: table !important;}
.d-table-row {display: table-row !important;}
.d-table-cell {display: table-cell !important;}
.d-flex {display:-webkit-box !important; display:-ms-flexbox !important; display:flex !important;}
.flex-wrap {-ms-flex-wrap: wrap !important; flex-wrap: wrap !important;}
.flex-nowrap {-ms-flex-wrap: wrap !important; flex-wrap: wrap !important;}
.flex-wrap {-ms-flex-wrap: nowrap !important; flex-wrap: nowrap !important;}
.flex-wrap-reverse {-ms-flex-wrap: wrap-reverse !important; flex-wrap: wrap-reverse !important;}
.justify-content-start {-webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important;}
.justify-content-end {-webkit-box-pack: end !important; -ms-flex-pack: end !important; justify-content: flex-end !important;}
.justify-content-center {-webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important;}
.justify-content-between {-webkit-box-pack: justify !important; -ms-flex-pack: justify !important; justify-content: space-between !important;}
.justify-content-around {-ms-flex-pack: distribute !important; justify-content: space-around !important;}
.align-items-stretch {-webkit-box-align: stretch !important; -ms-flex-align: stretch !important; align-items: stretch !important;}
.align-items-start {-webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important;}
.align-items-end {-webkit-box-align: end !important; -ms-flex-align: end !important; align-items: flex-end !important;}
.align-items-center {-webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important;}
.align-items-baseline {-webkit-box-align: baseline !important; -ms-flex-align: baseline !important; align-items: baseline !important;}
.align-content-stretch {-ms-flex-line-pack: stretch !important; align-content: stretch !important;}
.align-content-start {-ms-flex-line-pack: start !important; align-content: flex-start !important;}
.align-content-end {-ms-flex-line-pack: end !important; align-content: flex-end !important;}
.align-content-center {-ms-flex-line-pack: center !important; align-content: center !important;}
.align-content-between {-ms-flex-line-pack: justify !important; align-content: space-between !important;}
.align-content-around {-ms-flex-line-pack: distribute !important; align-content: space-around !important;}

/* GNB */
#header #gnbArea {overflow:hidden;}
#header #gnbArea.small {height:0px !important; }
#header #gnbArea {
  transition: height 0.2s ease-out 0s;
  -moz-transition: height 0.2s ease-out 0s;
  -webkit-transition: height 0.2s ease-out 0s;
  -o-transition: height 0.2s ease-out 0s;
  -ms-transition: height 0.2s ease-out 0s;
}

#header #gnbArea .ncsoftGnbWrapper { margin:0 !important;padding:0 !important;position:relative !important; z-index:9999999 !important; min-width:1170px !important; height:37px !important;width:100% !important; background:url(https://static.ncsoft.jp/images/bns/common/gnbBg.png) repeat !important; }
#header #gnbArea .ncsoftGnbWrapper *{margin:0 !important;padding:0 !important}
#header #gnbArea .ncsoftGnbWrapper img {border:0 !important;}
#header #gnbArea .ncsoftGnbWrapper ul {margin:0 !important; padding:0 !important; position: relative; z-index: 999999999;}
#header #gnbArea .ncsoftGnbWrapper ul li {list-style:none !important; border-right:none !important;}
#header #gnbArea .ncsoftGnbWrapper ul li a{border-right:none !important;}
#header #gnbArea .ncsoftGnbWrapper ul+ul{float:right !important;}
#header #gnbArea .ncsoftGnbWrapper ul+ul li{border-right:none !important; border-left:none !important;}
#header #gnbArea .ncsoftGnbWrapper ul+ul li a{border-right:none !important;border-left:none !important;}
#header #gnbArea .ncsoftGnbWrapper li{float:left !important;height:36px !important}
#header #gnbArea .ncsoftGnbWrapper a{display:block !important;height:36px !important;color:#fff !important; text-decoration:none !important;}
#header #gnbArea .ncsoftGnbWrapper ul li.gnbNcsoft a {background-image:url(https://static.ncsoft.jp/images/ncLogo_2020_white.svg) !important; width: 53px !important; background-size: 32px !important; background-repeat: no-repeat; background-position: center; }
#header #gnbArea .ncsoftGnbWrapper ul li.gnbNcsoft a:hover {background-image:url(https://static.ncsoft.jp/images/ncLogo_2020_gold.svg) !important;}
#header #gnbArea .ncsoftGnbWrapper ul li.gnbGameMain {display:none; }
#header #gnbArea .ncsoftGnbWrapper ul li.gnbMyPage {display:block !important; }
#header #gnbArea .ncsoftGnbWrapper > ul + ul li a {position: relative; float:left; background:none !important; text-indent:0 !important; width:auto !important; line-height:37px; font-size:12px !important; color:#9E9E9E !important;  }
#header #gnbArea .ncsoftGnbWrapper > ul + ul li a:after {position: absolute; top: 0; left: 0; width: 100%; text-align: center; }
#header #gnbArea .ncsoftGnbWrapper > ul + ul li.gnbLogin a:after {content: "ログイン"; }
#header #gnbArea .ncsoftGnbWrapper > ul + ul li.gnbLogout a:after {content: "ログアウト"; }
#header #gnbArea .ncsoftGnbWrapper > ul + ul li.gnbSignup a:after {content: "会員登録"; }
#header #gnbArea .ncsoftGnbWrapper > ul + ul li.gnbSupport a:after {content: "サポート"; }

#header #gnbArea .ncsoftGnbWrapper > ul + ul li.gnbMyPage a {padding: 0 15px !important; }

#header #gnbArea .ncsoftGnbWrapper > ul + ul li a:hover {color:#fc0 !important; }
#header #gnbArea .ncsoftGnbWrapper ul li a .alertArea {display:none; width:10px; height:10px; margin-left:5px !important; background:url(https://static.ncsoft.jp/images/bns/common/new2.png); vertical-align:middle; }
#header #gnbArea .ncsoftGnbWrapper ul li a .alertArea.show {display:inline-block;}

input[type="text"] {height:20px; padding:5px 7px 6px;  font-size:13px; border:1px solid #e2e2e2} /*line-height:13px;*/
input[type="text"].big {font-size:20px; padding:10px;}


.tab.type1 ul {clear:both;}
.tab.type1 ul li {float:left; margin:0; padding:0 7px; background:url(https://static.ncsoft.jp/images/bns/common/separater.gif) left center no-repeat; }
.tab.type1 ul li:first-child {padding-left:0; background:none;}
.tab.type1 ul li a {display:block; padding:7px;}
.tab.type1 ul li.current a {background:#222; color:#fff;}

header {position:fixed; top:0; left:0; width:100%; min-width:1170px; z-index:1000}
header * {margin:0; padding:0;}
header a {color:#fff;}
header #gnbArea {height:36px; overflow:hidden;}
/* header #mainMenuArea {min-width:1170px; height:88px; background:url(https://static.ncsoft.jp/images/bns/common/menuBg.png) center repeat-x} */
header #mainMenuArea {min-width:1170px; height:88px; background:url(https://static.ncsoft.jp/images/bns/home/menuMain.png) center repeat-x}
header #mainMenuArea.small {height:48px !important;}
 .lt-ie9 header #mainMenuArea.small ul.main > li {height:48px;}
header #mainMenuArea {
  transition: height 0.2s ease-out 0s;
  -moz-transition: height 0.2s ease-out 0s;
  -webkit-transition: height 0.2s ease-out 0s;
  -o-transition: height 0.2s ease-out 0s;
  -ms-transition: height 0.2s ease-out 0s;
}

header #mainMenuArea > .inner:after{content:url(https://static.ncsoft.jp/images/common/spacer.gif);display:block;clear:both;height:0;} /* clearFix */
header #mainMenuArea > .inner{display: flex; align-items: center; width:1170px; margin:0 auto; height:100%;}

header #mainMenuArea p.logo,
header #mainMenuArea ul {display: flex; justify-content: space-between; align-items: center;}

header #mainMenuArea p.logo {height:100%; overflow:hidden;}
header #mainMenuArea p.logo a {display:block; height:100%; text-indent:-9999px; overflow:hidden; }
header #mainMenuArea p.logo a.home {width:190px; background:url(https://static.ncsoft.jp/images/bns/common/logo.png); }
header #mainMenuArea p.logo a.logoSideBnr {width:170px; height:100%; background:url(https://static.ncsoft.jp/images/bns/common/free.png); text-indent:-9999px; overflow:hidden; }
  .lt-ie9 header #mainMenuArea p.logo a {height:88px;}
header #mainMenuArea p.logo.mini a.home {width:100px; background-position:0 -100px;}
header #mainMenuArea p.logo.mini a.logoSideBnr {width:260px; background-position:0 -100px;}

header #mainMenuArea ul li {list-style:none;}
header #mainMenuArea ul.main {width: calc(100% - 360px); height:100%; margin-left: auto;}
header #mainMenuArea ul.main > li { display: inline-block; height:100%; float: none; padding: 0 10px;}
 .lt-ie9 header #mainMenuArea ul.main > li {height:88px;}
header #mainMenuArea ul.main > li > a {position: relative; display: -webkit-flex; display: flex; align-items: center; -webkit-align-items: center; height:100%; padding: 0 10px; color: #BBB; text-decoration: none;}
header #mainMenuArea ul.main > li > a:hover,
header #mainMenuArea ul.main > li.current > a {color: #FC0;}

header #mainMenuArea ul.main > li.new > a:before {
   content: 'NEW';
   width: 3em;
   color: #BF2222;
   font-size: 12px;
   line-height: 1.5em;
   background-color: #feb604;
   position: absolute;
   top: 50%;
   left: 50%;
   margin-left: -1.5em;
   margin-top: -2.5em;
   text-align: center;
   -webkit-border-radius: 20px;
           border-radius: 20px;
 }
/*
header #mainMenuArea ul.main > li.eSports > a {width:107px; background-image:url(https://static.ncsoft.jp/images/bns/common/menueSports.png)}
header #mainMenuArea ul.main > li.home > a {width:82px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuHome.png)}
header #mainMenuArea ul.main > li.news > a {width:92px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuNews.png)}
header #mainMenuArea ul.main > li.intro > a {width:112px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuIntro.png)}
header #mainMenuArea ul.main > li.beginner > a {width:122px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuBeginner.png)}
header #mainMenuArea ul.main > li.guide > a {width:122px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuGameGuide.png)}
header #mainMenuArea ul.main > li.community > a {width:122px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuCommunity.png)}
header #mainMenuArea ul.main > li.shop > a {width:92px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuShop.png?1408)}
header #mainMenuArea ul.main > li.shop.alert > a {width:112px; background-position:-390px center;}
header #mainMenuArea ul.main > li.shop.alert > a:hover {background-position:-590px center;}
header #mainMenuArea ul.main > li.download > a {width:127px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuDownload.png)}
/* cbt
header #mainMenuArea ul.main > li.gameGuide > a {width:102px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuGameGuide.png)}
header #mainMenuArea ul.main > li.coupon > a {width:102px; background-image:url(https://static.ncsoft.jp/images/bns/common/menuCoupon.png)}
*/



header #mainMenuArea .subMenuArea {display:none; position:absolute; min-width:1170px;  left:0; width:100%; height:43px; background:url(https://static.ncsoft.jp/images/bns/common/subMenuBg.png) center repeat-x; z-index:100;} /*bottom:-43px;*/
header #mainMenuArea ul.main > li.current .subMenuArea {display:block;}
header #mainMenuArea ul.main > li.current.hide .subMenuArea {display:none;}
header #mainMenuArea ul.main > li:hover .subMenuArea {display:block;}
header #mainMenuArea ul.main > li.current.hide:hover .subMenuArea {display:block;}


header #mainMenuArea .subMenuArea > .inner {height:100%; background:url(https://static.ncsoft.jp/images/bns/common/dddddd.gif) center bottom repeat-x; }
header #mainMenuArea .subMenuArea > .inner > .inner2 {height:100%; width:1170px; margin:0 auto; overflow:hidden;}
header #mainMenuArea .subMenuArea > .inner > .inner2 .breadcrumbs {float:left; margin-left:30px; color:#808080; font-size:85%; line-height:43px;}
header #mainMenuArea .subMenuArea > .inner > .inner2 .breadcrumbs a {color:#808080;}
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub {padding-left: 380px; margin-right: 20px; line-height:43px; font-size:85%; justify-content: flex-end; align-items: flex-start;}
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li + li {margin-left:40px;}
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li a {display:block; color:#252525; text-decoration:none; height:40px;  }
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li a:hover,
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li.current {border-bottom:3px solid #FE7E0A;}
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li a span.num {color:#818181;}

header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li.new a {
  position: relative;
}
header #mainMenuArea .subMenuArea > .inner > .inner2 ul.sub li.new a:before {
  content: 'N';
  width: 1em;
  height: 1em;
  line-height: 1em;
  font-weight: bold;
  color: #BF2222;
  position: absolute;
  right: -1.5em;
  top: 50%;
  margin-top: -0.3em;
}
header #mainMenuArea .beginner .subMenuArea > .inner > .inner2 ul.sub {justify-content: flex-start;}
header #mainMenuArea .news .subMenuArea > .inner > .inner2 ul.sub {justify-content: flex-start; margin-left: 40px;}
header #mainMenuArea .guide .subMenuArea > .inner > .inner2 ul.sub {justify-content: flex-start;}
header #mainMenuArea .ranking .subMenuArea > .inner > .inner2 ul.sub {justify-content: flex-start; margin-left: 45px;}
header #mainMenuArea .community .subMenuArea > .inner > .inner2 ul.sub {justify-content: flex-end;}

header #mainMenuArea .iconGroup {display: flex; margin-left: 12px;}
header #mainMenuArea .iconGroup a {display: block;}
header #mainMenuArea .iconGroup .discord {width: 37px; height: 37px; padding: 2px;}
header #mainMenuArea .iconGroup .twitter {width: 40px; height: 40px;}

header .smoothScrollPos {position: absolute; top: 0; height: 89px; display: none;}
/*e-sport var.
header #mainMenuArea .intro .subMenuArea > .inner > .inner2 ul.sub {justify-content: flex-start; margin-left:460px;}*/

footer {clear:both; background:#fff}
footer .footerBlockNull1 {width:1110px; padding:0 30px; margin:0 auto;}
footer .footerBlock {min-width:1170px;}
footer a {text-decoration:none;}
#footerBlock1 {border-top:1px solid #ddd;}
#footerBlock2 {height:52px; border-top:1px solid #ddd; line-height:52px;}
#footerBlock3 {border-top:1px solid #ddd;}
#footerBlock1 table {width:100%; table-layout: fixed; border-collapse:collapse; }
#footerBlock1 table td {text-align:center; border:1px solid #ddd; border-width: 0 1px}
#footerBlock1 table td a {display:block; padding:10px; color:#666; background:center top no-repeat; text-indent:-9999px; overflow:hidden}
#footerBlock1 table td a:hover {background-position:center -100px;}
#footerBlock1 table td a.kaimoCharge {background-image:url(https://static.ncsoft.jp/images/bns/common/footer_kaimoCharge.png)}
#footerBlock1 table td a.gameTicket {background-image:url(https://static.ncsoft.jp/images/bns/common/footer_gameTicket.png)}
#footerBlock1 table td a.coupon {background-image:url(https://static.ncsoft.jp/images/bns/common/footer_coupon.png)}
#footerBlock1 table td a.gameDownload {background-image:url(https://static.ncsoft.jp/images/bns/common/footer_gameDownload.png)}
#footerBlock1 table td a.member {background-image:url(https://static.ncsoft.jp/images/bns/common/footer_member.png)}

#footerBlock2 {overflow:hidden; font-size:85%;}
#footerBlock2 ul li {float:left; list-style:none; }
#footerBlock2 ul li a {padding:0 15px; border-right:1px solid #ccc; }
#footerBlock2 .block1 {float:left; }
#footerBlock2 .block1 ul li:first-child a {padding-left:0;}
#footerBlock2 .block1 ul li:last-child a {border-right:0;}
#footerBlock2 .block2 {float:right;}
#footerBlock2 .block2 ul li:last-child a {border-right:none; padding-right:0;}
#footerBlock2 a {color:#808080}
#footerBlock3:after{content:url(https://static.ncsoft.jp/images/common/spacer.gif);display:block;clear:both;height:0;}
#footerBlock3 {display:inline-block;}
#footerBlock3 {display:block;}
#footerBlock3 {padding-top:35px; height:70px;}
#footerBlock3 .block1 {display: flex; }
#footerBlock3 .block1 .logo {margin: 0 28px 0 0;}
#footerBlock3 .block2 {float:right;}
#footerBlock3 .copyright {display: flex; align-items: flex-end; margin-top: 0; font-size:75%; font-family: 'Source Sans Pro', 'sans-serif'; color:#818181; line-height:1; }
#footerBlock3 .block2 .language {position:relative;}
#footerBlock3 .block2 .language .selected {padding:8px 45px 8px 15px; cursor:pointer; background:url(https://static.ncsoft.jp/images/bns/common/iconTri.gif) right center no-repeat #FBFBFB; color:#888; }
#footerBlock3 .block2 .language:hover .selected {color:#fff; background-color:#FECB16;}
#footerBlock3 .block2 .language .langList { display:none; position:absolute; bottom:100%; left:0;} /*  */
#footerBlock3 .block2 .language:hover .langList {display:block; }
#footerBlock3 .block2 .language .langList li {list-style:none; }
#footerBlock3 .block2 .language .langList li a {display:block; padding:8px 45px 8px 15px; background:#FECB16; color:#fff; }
#footerBlock3 .block2 .language .langList li.kr a {background:#FE7E0A; }

#content {background:#fff; min-width:1170px; min-height:500px; padding-bottom:50px;}
.contentElement {min-width:1170px; clear:both; }
.contentElement .contentElementNull1 {width:1110px; padding:0 30px; margin:0 auto;}
.contentElement .contentElementHead {padding-top:210px; margin-bottom:45px;}
.contentElement .contentElementHead h1 {margin-left:-5px;}
.contentElement .contentElementBody {clear:both; margin:30px 0; border-top:2px solid #2e2e2e;}

.list_header {clear:both; overflow:hidden;}
.list_header_r,
.list_header.fr {clear:none; margin-top:-90px;}
.list_header.wide {margin-top:-30px;}
.list_header.wide:before {content:url(https://static.ncsoft.jp/images/common/spacer.gif);display:block;clear:both;height:0;}
.list_header.fr .tab {padding-top:20px;}

/* HOME */
.homePage #introArea {position:relative; min-width:1170px; z-index:10; border-bottom:1px solid #d3d3d3;}
.homePage #introAreaNull1 {position:relative;}
.homePage #introArea .bg {min-width:1170px; background:center top no-repeat;}
.homePage #introArea .bg1 {height:1000px; background-image:url(https://static.ncsoft.jp/images/bns/home/bg1.jpg)}
.homePage #introArea .bg2 {height:1398px; background-image:url(https://static.ncsoft.jp/images/bns/home/bg2.jpg)}
.homePage #introArea .bg3 {height:902px; background-image:url(https://static.ncsoft.jp/images/bns/home/bg3.jpg)}
.homePage #introArea .bg4 {background-image:url(https://static.ncsoft.jp/images/bns/home/bg4.jpg); background-color:#000;} /* min-height:753px; */
.homePage #introArea .elements {position:absolute; top:0; left:0; width:100%;}
.homePage #introArea .elementsNull1 {position:relative; width:1170px; margin:0 auto;}

.homePage .spacer {height:124px;}
.homePage .bannerArea .spacer {height:124px; background:#000;}
.homePage .bannerArea .banner {position:relative; overflow:hidden; min-width:1170px;}
.homePage .bannerArea .banner p {float:left; position:relative; left:50%; margin:0; }
.homePage .bannerArea .banner p img {float:left; position:relative; left:-50%; }
/* .homePage .bannerArea .banner p a {position:absolute; top:0; left:0} */

.homePage .contentElement {padding: 50px 0 30px;}
.homePage .blockSeparate .block:nth-of-type(1) {width:540px;}
.homePage .blockSeparate .block:nth-of-type(2) {width: 540px;}

.homePage .bbsList {overflow:hidden; }
.homePage .newsBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/home/headNews.png);}
.homePage .twitterArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/home/headTwitter.png);}
.homePage .communityBbsArea {float:right;}
.homePage .communityBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/home/headCommunity.png);}
.homePage .head {overflow:hidden; border-bottom:2px solid #2e2e2e;}
.homePage .head h2 {float:left; height:40px; width:200px; text-indent:-9999px; background-repeat:no-repeat}
.homePage .head .link {float:right; margin:5px 0 0 0;}

.homePage .bbsList ul li {margin:0; padding:15px 20px; list-style:none; overflow:hidden; border-bottom:1px solid #d3d3d3;}
.homePage .bbsList ul li a {float:left; text-decoration:none; }
.homePage .bbsList ul li .cmt {float:left; color:#a7a7a7; }
.homePage .bbsList ul li .date {float:right; color:#9D9D9D;}

.homePage .imageBbsArea {clear:both; width:100%; padding-top:40px; } /*border-bottom:1px solid #d3d3d3;*/
.homePage .imageBbsArea > ul > li {float:left; width:140px; padding:20px 23px 20px 22px; border-bottom:none;}
.homePage .imageBbsArea ul li .block em a {font-weight:bold; font-size:120%; color:#2D2D2D; display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.homePage .imageBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/home/headImageBbs.png);}
.homePage .imageBbsArea ul li .block ul {border:0;}
.homePage .imageBbsArea ul li .block ul li {padding:0; border:0;}
.homePage .imageBbsArea ul li .block ul.react li {display:inline;}
.homePage .imageBbsArea ul li .thumb {margin-bottom:3px;}
.homePage .imageBbsArea ul li a {float:none;}
.homePage .imageBbsArea ul li .thumb img {width:138px; height:138px; border:1px solid #d9d9d9; }
.homePage .imageBbsArea ul li .en {color:#9C9C9C;}
.homePage .bottomNavi {margin-top: 40px; position:relative;}
.homePage .bottomNavi * {margin:0;}
.homePage .bottomNavi ul li {list-style:none}
.homePage .bottomNavi ul li ~ li {margin-top:20px;}
.homePage .bottomNavi ul li a {display:block; height:72px; text-indent:-9999px; overflow:hidden;}
.homePage .bottomNavi ul li a:hover {background-position:0 -100px;}
.homePage .bottomNavi ul li.li1 a {background-image:url(https://static.ncsoft.jp/images/bns/home/bottomBtn1.png)}
.homePage .bottomNavi ul li.li2 a {background-image:url(https://static.ncsoft.jp/images/bns/home/bottomBtn2.png)}
.homePage .bottomNavi ul li.li3 a {background-image:url(https://static.ncsoft.jp/images/bns/home/bottomBtn3.png?v=190525)}
.homePage .bottomNavi ul li.li4 a {background-image:url(https://static.ncsoft.jp/images/bns/home/bottomBtn4.png)}
.homePage .bottomNavi .kazari {position:absolute; top:0; left:-40px;}
.homePage #maintenanceInfo {margin-top: 40px; padding:15px; clear:both; font-size:85%; color:#808080; border:1px solid #eee}

.homePage .twitterArea {height: 100%;}
.homePage .twitterArea .twitterList {height: calc(100% - 55px); border-left: solid 1px rgba(15,70,100,.12);}
.homePage .twitterArea .twitterList iframe {vertical-align: top !important;}

.homePage h1 {position:absolute; top:-100px; }
.homePage #ss {position:absolute; top:1070px; left:28px; width:1112px; text-align:center; }
.homePage #ss .txtArea {float:left; width:430px; height:300px; margin-right:140px; background:url(https://static.ncsoft.jp/images/bns/home/txt2.png); text-indent:-9999px;}
.homePage #ss .galery {float:left;}
.homePage #ss .galery li {list-style:none;}
.homePage #ss .galery .imgs li {display:none;}
.homePage #ss .galery .imgs li.current {display:block;}
.homePage #ss .galery .nav {float:right; margin-top:10px;}
.homePage #ss .galery .nav li {float:left; width:29px; height:29px; margin-left:8px; text-indent:-9999px; overflow:hidden; cursor:pointer; }
.homePage #ss .galery .nav li.prev {background:url(https://static.ncsoft.jp/images/bns/common/paging2L.gif);}
.homePage #ss .galery .nav li.next {background:url(https://static.ncsoft.jp/images/bns/common/paging2R.gif);}

.homePage #movies {position:absolute; top:1530px; left:590px; width:560px; text-align:center; }
.homePage #movies .txtArea {width:420px; height:130px; background:url(https://static.ncsoft.jp/images/bns/home/txt3.png); text-indent:-9999px; }
.homePage #movies li {list-style:none;}
.homePage #movies .galery {margin-top:70px; }
.homePage #movies .galery .tabs {overflow:hidden;}
.homePage #movies .galery .tabs li {float:left; margin-right:9px; width:60px; height:60px; text-indent:-9999px; cursor:pointer; }
.homePage #movies .galery .tabs li.current {background-position:0 -100px;}
.homePage #movies .galery .tabs .li1 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab1.png)}
.homePage #movies .galery .tabs .li2 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab2.png)}
.homePage #movies .galery .tabs .li3 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab3.png)}
.homePage #movies .galery .tabs .li4 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab4.png)}
.homePage #movies .galery .tabs .li5 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab5.png)}
.homePage #movies .galery .tabs .li6 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab6.png)}
.homePage #movies .galery .tabs .li7 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab7.png)}
.homePage #movies .galery .tabs .li8 {background-image:url(https://static.ncsoft.jp/images/bns/home/movieTab8.png)}
.homePage #movies .galery .movie {width:540px; height:303px; margin-top:37px; text-align:left; background:#DAE2E6}

.homePage #txt {position:absolute; top:3025px; left:400px; width:384px; height:178px; text-indent:-9999px; background:url(https://static.ncsoft.jp/images/bns/home/txt4.png)}

.homePage .bg4 #movie {margin:0 auto; text-align:center;}
.homePage .bg4 .linkArea {margin:0; padding:0; height:100px; }
.homePage .bg4 .linkArea a {display:block; height:100px; background:url(https://static.ncsoft.jp/images/bns/home/link.png) center no-repeat #C92D2C; text-indent:-9999px; overflow:hidden; }
.homePage .bg4 .linkArea a:hover {background-color:#DE9B00}

.homePage #sideNavi {position:fixed; right:-20px; top:45%; z-index:100; padding:5px; background:#fff; border-radius:10px;}
.homePage #sideNavi.appear {right:15px;}
.homePage #sideNavi ul li {margin:10px 0; list-style:none;}
.homePage #sideNavi ul li a {display:block; width:10px; height:10px; border-radius:5px; background:#dedede;}
.homePage #sideNavi ul li a.current {background:#FE7E0A;}

.homePage #sideNavi {
  transition: right 0.5s ease-out 0s;
  -moz-transition: right 0.5s ease-out 0s;
  -webkit-transition: right 0.5s ease-out 0s;
  -o-transition: right 0.5s ease-out 0s;
  -ms-transition: right 0.5s ease-out 0s;
}

.homePage .para {position:absolute; display:none;}
.homePage .para.appear {display:block;}

.homePage #headArea {top:144px; left:301px; width:620px; height:320px; background:url(https://static.ncsoft.jp/images/bns/home/logo.png); text-indent:-9999px;}
.homePage #btns {top:485px; left:0; width:100%; text-align:center; }
.homePage #chara1 {top:410px; left:119px; width:680px; height:580px; background:url(https://static.ncsoft.jp/images/bns/home/chara1.png)}
.homePage #chara2 {top:236px; right:140px; width:185px; height:240px; background:url(https://static.ncsoft.jp/images/bns/home/chara2.png)}


/* 1407追加 */
.homePage {overflow:hidden;}
.homePage #spBnrSection {min-width:1170px; height:500px; -moz-user-select: none;-khtml-user-select: none;user-select: none;}
.homePage #spBnrSection ul li {margin:0; list-style:none; }
.homePage #spBnrSectionNull1 {position:relative/*ie7*/; min-width:1170px; height:500px; overflow:hidden; background:#000;
    transition:           height 0.2s ease-in-out 0s;
    -moz-transition:      height 0.2s ease-in-out 0s;
    -webkit-transition:   height 0.2s ease-in-out 0s;
    -o-transition:        height 0.2s ease-in-out 0s;
    -ms-transition:       height 0.2s ease-in-out 0s;
}
.homePage #spBnrSectionNull2 {position:relative; width:1170px; margin:0 auto; height:100%;}
.homePage #spBnrSection .listWrap {position:absolute; width:100%; height:100%;}
.homePage #spBnrSectionNull1.expand {height:650px;}
.homePage #spBnrSection .bgImg {position:absolute; left:50%; top:0; height:100%;
    transition:           top 1s ease-in-out 0s;
    -moz-transition:      top 1s ease-in-out 0s;
    -webkit-transition:   top 1s ease-in-out 0s;
    -o-transition:        top 1s ease-in-out 0s;
    -ms-transition:       top 1s ease-in-out 0s;
}
.homePage #spBnrSection .bgImg li {position:absolute; left:-50%; text-align:center;}
.homePage #spBnrSection .charaImg {position:absolute; top:0; right:0;
    transition:           right 1s ease-in-out 0s;
    -moz-transition:      right 1s ease-in-out 0s;
    -webkit-transition:   right 1s ease-in-out 0s;
    -o-transition:        right 1s ease-in-out 0s;
    -ms-transition:       right 1s ease-in-out 0s;
}
.homePage #spBnrSection .charaImg li {position:absolute; top:0;}
.homePage #spBnrSection .txtImg {position:absolute; top:0; left:0;
    transition:           left 1s ease-in-out 0s;
    -moz-transition:      left 1s ease-in-out 0s;
    -webkit-transition:   left 1s ease-in-out 0s;
    -o-transition:        left 1s ease-in-out 0s;
    -ms-transition:       left 1s ease-in-out 0s;
}
.homePage #spBnrSection .txtImg li {position:absolute; top:0; left:115px; height:650px;}
.homePage #spBnrSection .txtImg li .txt {position:relative; } /* z-index:1 */
/* .homePage #spBnrSection .txtImg li .expandTxt {height:0; overflow:hidden;
    transition:           height 0.2s ease-in-out 0s;
    -moz-transition:      height 0.2s ease-in-out 0s;
    -webkit-transition:   height 0.2s ease-in-out 0s;
    -o-transition:        height 0.2s ease-in-out 0s;
    -ms-transition:       height 0.2s ease-in-out 0s;
} */
.homePage #spBnrSection .txtImg li .expandTxt .expandTxtImg {position:relative; display:block;}
.homePage #spBnrSection .txtImg li .expandTxt .expandBgWrap {position:absolute; bottom:0; height:0; overflow:hidden;
    transition:           height 0.2s ease-in-out 0s;
    -moz-transition:      height 0.2s ease-in-out 0s;
    -webkit-transition:   height 0.2s ease-in-out 0s;
    -o-transition:        height 0.2s ease-in-out 0s;
    -ms-transition:       height 0.2s ease-in-out 0s;
}
.homePage #spBnrSectionNull1.expand .txtImg li .expandTxt .expandBgWrap {height:650px;}
.homePage #spBnrSection .txtImg li .expandTxt .expandBg {position:absolute; bottom:0;}
.homePage #spBnrSection .txtImg li .expandTxt .expandBgWrapType1 {left:-115px; width:1130px;} /* left:-1030px; width:1930px; */
.homePage #spBnrSection .txtImg li .expandTxt .expandBgWrapType2 {left:-115px; width:800px;}
.homePage #spBnrSection .txtImg li .expandTxt .expandBgWrapType3 {left:-115px; width:740px;}
.homePage #spBnrSectionNull1.expand .txtImg li .expandTxt {height:200px}
/* #spBnrSection .bgImg li.prevBg {top:-650px;}
#spBnrSection .bgImg li.nextBg {top:100%;} */
.homePage #spBnrSection .clickArea {position:relative; height:500px; overflow:hidden;}
.homePage #spBnrSection .clickArea li a {display:block; width:1170px; height:500px; z-index:2; background:url(https://static.ncsoft.jp/images/common/spacer.gif); overflow:hidden; text-indent:-9999px; } /**/
.homePage #spBnrSection ul.nav li {position:absolute; top:195px; width:100px; height:100px; text-indent:-9999px; overflow:hidden; cursor:pointer; z-index:10; }
.homePage #spBnrSection ul.nav li.prev {left:6px; background:url(https://static.ncsoft.jp/images/bns/home/navL.png);}
.homePage #spBnrSection ul.nav li.next {right:6px; background:url(https://static.ncsoft.jp/images/bns/home/navR.png)}

#spBnrThumbnails {position:relative/*ie7*/; clear:both; height:130px; background:#ededed; overflow:hidden; box-shadow:0 5px 5px rgba(0,0,0,.3); -moz-user-select: none;-khtml-user-select: none;user-select: none;
    transition:           height 0.2s ease-in-out 0s;
    -moz-transition:      height 0.2s ease-in-out 0s;
    -webkit-transition:   height 0.2s ease-in-out 0s;
    -o-transition:        height 0.2s ease-in-out 0s;
    -ms-transition:       height 0.2s ease-in-out 0s;
}
#spBnrThumbnails.expand {height:130px;}
#spBnrThumbnailsNull1 {position:relative; height:130px;  /* overflow:hidden; margin:0 auto; width:1170px; */}
#spBnrThumbnails .ulWraper {position:absolute; top:0; left:1170px;
    transition:           left 0.5s ease-out 0s;
    -moz-transition:      left 0.5s ease-out 0s;
    -webkit-transition:   left 0.5s ease-out 0s;
    -o-transition:        left 0.5s ease-out 0s;
    -ms-transition:       left 0.5s ease-out 0s;
}
#spBnrThumbnails.expand .ulWraper {left:0;}
#spBnrThumbnails ul {position:absolute; top:0; left:0; padding:0;} /* 30px */
#spBnrThumbnails ul li {float:left; list-style:none;}
#spBnrThumbnails ul li a {display:block; background:right top no-repeat;
    transition:           background-position 0.2s ease-in-out 0s;
    -moz-transition:      background-position 0.2s ease-in-out 0s;
    -webkit-transition:   background-position 0.2s ease-in-out 0s;
    -o-transition:        background-position 0.2s ease-in-out 0s;
    -ms-transition:       background-position 0.2s ease-in-out 0s;
}
#spBnrThumbnails ul li a span {display:block; height:130px; width:245px; background:left top no-repeat; text-indent:-9999px; overflow:hidden;} /*272*/
#spBnrThumbnails ul li a:hover {background-position:right -3px;}
#spBnrThumbnails ul li:nth-child(even) {background-color:#E4E4E4}
#spBnrThumbnails .cover {position:absolute; top:0; width:60px; height:100%;}
#spBnrThumbnails .cover.active {cursor:pointer; }
#spBnrThumbnails .coverL {left:0; background-image:url(https://static.ncsoft.jp/images/bns/home/thumbCoverL.png)}
#spBnrThumbnails .coverR {right:0; background-image:url(https://static.ncsoft.jp/images/bns/home/thumbCoverR.png)}
#spBnrThumbnails .slider {position:absolute; top:110px; left:0;}
#spBnrThumbnails .slider .sliderHandle {position:absolute; top:0; left:0; height:20px; width:100px; cursor:ew-resize; }
#spBnrThumbnails .slider .sliderHandle.animate { /* mousedownしたらclass削除される */
    transition:           left 1s ease-in-out 0s;
    -moz-transition:      left 1s ease-in-out 0s;
    -webkit-transition:   left 1s ease-in-out 0s;
    -o-transition:        left 1s ease-in-out 0s;
    -ms-transition:       left 1s ease-in-out 0s;
}
#spBnrThumbnails .slider .sliderHandle span {position:absolute; left:0; bottom:0; height:5px; width:100%; background:rgba(255,3,2,.8); }
.lt-ie9 #spBnrThumbnails .slider .sliderHandle span {background-color:#ff0302;}

#bnrList {background:url(https://static.ncsoft.jp/images/bns/home/menuBg1.jpg) center top; }
#bnrListNull1 {position:relative; margin:0 auto; width:1170px;}
#bnrListNull1:after {content:""; position:absolute; top:130px; left:95px; width:980px; height:20px; background:url(https://static.ncsoft.jp/images/bns/home/menuShadow.png)}
#bnrListNull2 {position:relative; margin:0 95px; width:980px; height:130px; overflow:hidden; }
#bnrList ul li {float:left; list-style:none; background:url(https://static.ncsoft.jp/images/bns/home/menuBgEven.jpg) #F2F2F2; }
#bnrList ul li:nth-child(odd) {background:url(https://static.ncsoft.jp/images/bns/home/menuBgOdd.jpg) #FBFBFB}
#bnrList ul li a {display:block; background:right top no-repeat;
    transition:           background-position 0.2s ease-in-out 0s;
    -moz-transition:      background-position 0.2s ease-in-out 0s;
    -webkit-transition:   background-position 0.2s ease-in-out 0s;
    -o-transition:        background-position 0.2s ease-in-out 0s;
    -ms-transition:       background-position 0.2s ease-in-out 0s;
}
#bnrList ul li a span {display:block; height:130px; width:245px; background:left top no-repeat; text-indent:-9999px; overflow:hidden;} /*272*/
#bnrList ul li a:hover {background-position:right -3px;}
#bnrList .bnrListNav {cursor:pointer; top:30px; width:70px; height:70px; text-indent:-9999px; overflow:hidden;  }
#bnrList .bnrListNav:hover {background-position:0 -100px;}
#bnrList .bnrListNav.swiper-button-disabled {opacity:.3; cursor:default; }
#bnrList .bnrListNav.swiper-button-disabled:hover {background-position:0 0;}
#bnrListNavL {position:absolute; left:10px; background:url(https://static.ncsoft.jp/images/bns/home/menuL.png); }
#bnrListNavR {position:absolute; right:10px; background:url(https://static.ncsoft.jp/images/bns/home/menuR.png); }
#bnrList .swiper-pagination {bottom:-25px; }
#bnrList .swiper-pagination-bullet {background-color:#798189; }

.homePage .fixedBannerArea {margin-top: 40px;}
.homePage .fixedBannerArea ul li {margin:0; list-style:none; }
.homePage .fixedBannerArea ul li img {border:1px solid #ddd; }


  /* 掲示板 */
table.bbs {width:100%; table-layout: fixed;}
table.bbs th,
table.bbs td {padding:20px 15px; border-bottom:1px solid #D3D3D3; text-align:center; font-weight:normal; word-wrap: break-word;}
table.bbs .cmt {font-weight:normal; color:#a8a8a8}
table.bbs .ico {vertical-align:middle; }
table.bbs td a {/* display:block; float:left; width:400px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; */ text-decoration:none}
table.bbs td a:hover {text-decoration:underline; }
table.bbs td.nameCell {text-align:left; }
table.bbs td.nameCell .nobr {float:left; width:auto; max-width:80%; padding-right:4px; }
table.bbs + .nodata {padding:20px; text-align:center; }
table.bbs.ranking th {padding:15px 10px; white-space:nowrap; }
table.bbs.ranking td {padding:10px;}

.doAgree .btn {margin-right:15px;}
.doAgree a.nickname {text-decoration:none}
.doAgree a.nickname:hover {text-decoration:underline; }

.bottomBbs {margin-top:40px; border-top:2px solid #2e2e2e; }
.bottomBbs table.bbs th {padding-top:10px; padding-bottom:10px;}
.bottomBbs table.bbs td.nameCell {font-weight:normal; }
.bottomBbs table.bbs tr.current td {background:#f5f5f5}

.bbsFunctionArea:after {content:url(https://static.ncsoft.jp/images/common/spacer.gif);display:block;clear:both;height:0;} /* clearFix */
.bbsFunctionArea {display:inline-block;} /* clearFix */
.bbsFunctionArea {display:block;} /* clearFix */
.bbsFunctionArea {padding:20px; border-bottom:2px solid #d4d4d4;}

/* イベント一覧 */
ul.eventList li {margin:0; padding:20px; list-style:none; overflow:hidden; border-bottom:1px solid #d3d3d3; }
ul.eventList li a {text-decoration:none;}
ul.eventList li .banner {float:left; display: block; margin-right:20px; width:350px;}
ul.eventList li .banner img {max-width: 100%;}
ul.eventList li .title {display:block; font-size:120%; font-weight:bold; }
ul.eventList li .date {display:block; font-size:85%; color:#9c9c9c; }
ul.eventList li .exp {display:block; margin-top:1em; font-size:85%; color:#999;}

/* ニュースメイン */
.newsMain .contentElementBody {border-top:none; overflow:hidden; }
.newsMain #block1 {float:left; width:635px;}
.newsMain ul.eventList {border-top:2px solid #2e2e2e; }
.newsMain ul.eventList li .banner img {width:272px; height:93px;}
.newsMain #block2 {float:right; width:445px;}
.newsMain .newsList ul {border-top:2px solid #2e2e2e; }
.newsMain .newsList ul li {margin:0; padding:15px 20px; list-style:none; border-bottom:1px solid #d3d3d3;}
.newsMain .newsList ul li a {text-decoration:none; }
.newsMain .newsList ul li .cmt {color:#a7a7a7; }
.newsMain .block .head {overflow:hidden;}
.newsMain .block .head h2 {float:left; height:40px; width:200px; background-repeat:no-repeat; text-indent:-9999px;}
.newsMain .block .eventListArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/news/mainHeadEvent.png)}
.newsMain .block .newsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/news/mainHeadNews_v2.png)}
.newsMain .block .maintenanceArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/news/mainHeadMaintenance.png)}
.newsMain .block .head .link {float:right; padding-top:5px; margin:0;}
.newsMain .block .head .link a.btn {}
.newsMain .block .newsList + .newsList {margin-top:40px; }

/* コミュニティメイン */
.communityMain .contentElementBody {border-top:none; overflow:hidden;}
.communityMain .blockHorizontal {margin-bottom: 45px;}
.communityMain .blockSeparate > .block .imageBbsArea {}
.communityMain .blockSeparate > .block .imageBbsArea > ul {display: flex; flex-wrap: wrap; padding-top: 15px; border-top:2px solid #2e2e2e;}
.communityMain .blockSeparate > .block .imageBbsArea > ul li {margin:0; padding:0; list-style:none; border-bottom: none;}
.communityMain .blockSeparate > .block .imageBbsArea > ul li:nth-of-type(n+4) {margin-top: 17px;}
.communityMain .blockSeparate > .block .imageBbsArea > ul li {padding: 0 28px;}
.communityMain .blockSeparate > .block .imageBbsArea > ul li:nth-of-type(3n+3) {border-right: none;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li {overflow:hidden; width: 123px; border-right: solid 1px #d3d3d3;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li:last-child {border-right: none;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li .block {overflow:hidden; color:#bbb}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li .block em {margin-top: 10px; display: block;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li .block em a {font-weight:bold; font-size:120%; color:#2D2D2D; display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li .thumb {text-align: center;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li .thumb img {width:120px; height:120px; border:1px solid #d9d9d9;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li a {text-decoration:none;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li ul {margin-top: -3px; border: none;}
.communityMain .blockSeparate > .block .imageBbsArea > ul > li ul li {padding: 0;}
.communityMain .blockSeparate > .block .imageBbsArea ul.react li {display:inline;}
.communityMain .blockSeparate::after {content: ""; display: block; clear: both;}
.communityMain .blockSeparate + .blockSeparate {margin-top: 45px;}
.communityMain .blockSeparate > .block {float:left; width:540px;}
.communityMain .blockSeparate > .block ul {border-top:2px solid #2e2e2e; }
.communityMain .blockSeparate > .block ul li {margin:0; padding:15px 20px; list-style:none; border-bottom:1px solid #d3d3d3;}
.communityMain .blockSeparate > .block ul li a {text-decoration:none; }
.communityMain .blockSeparate > .block ul li .cmt {color:#a7a7a7; }
.communityMain .blockSeparate > #block1 {margin-right: 30px;}

.communityMain .block .head {overflow:hidden;}
.communityMain .block .head h2 {float:left; height:40px; width:200px; background-repeat:no-repeat; text-indent:-9999px;}
.communityMain .block .researchBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/community/mainHeadResearch.png)}
.communityMain .block .kouryakuBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/community/mainHeadKouryaku.png)}
.communityMain .block .kouryuuBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/community/mainHeadKouryu.png)}
.communityMain .block .imageBbsArea .head h2 {background-image:url(https://static.ncsoft.jp/images/bns/community/mainHeadImage.png)}
.communityMain .block .head .link {float:right; padding-top:5px; margin:0}
.communityMain .block .head .link a.btn {}
.communityMain .block .bbsList + .bbsList {margin-top:40px; }

/* ショップリスト */
.shopList {position:relative/*ie7*/; overflow:hidden; }
.shopList .mainImgArea {position:relative; float:left; left:50%;margin:0;}
.shopList .mainImgArea img {float:left; position:relative; left:-50%; }
.shopList .blockSet {overflow:hidden; padding-top:15px; }
.shopList .block {width:540px; font-size:85%; color:#999; }
.shopList #block1 {float:left;  }
.shopList .block .body {padding-top:30px; padding-left:190px;}
.shopList .block .body a.btn {width:322px; margin-bottom:10px; }
.shopList #block1 .body {background:url(https://static.ncsoft.jp/images/bns/shop/imgKaimo.jpg) left 30px no-repeat;}
.shopList #block2 .body {background:url(https://static.ncsoft.jp/images/bns/shop/imgCoupon.jpg) left 30px no-repeat;}
.shopList #block2 {float:right;}
.shopList .block h2 {float:left; height:40px; width:200px; background:left top no-repeat; text-indent:-9999px; }
.shopList #block1 h2 {background-image:url(https://static.ncsoft.jp/images/bns/shop/mainHeadKaimo.png)}
.shopList #block2 h2 {background-image:url(https://static.ncsoft.jp/images/bns/shop/mainHeadCoupon.png)}
.shopList .block .head {border-bottom:1px solid #919191; overflow:hidden; }
.shopList .block .head .link {padding-top:5px; margin:0;}
.shopList .block .head .link a.btn {float:right;}

/* ショップ詳細 */
.shopDetail {overflow:hidden; }
.shopDetail .mainImgArea {position:relative; float:left; left:50%;margin:0;}
.shopDetail .mainImgArea img {float:left; position:relative; left:-50%; }
.shopDetail .expArea {position:relative; width:1110px; background:#fafafa; border-radius:15px;}
.shopDetail .expArea .expSummary img {border-radius:15px;}
.shopDetail .expArea .expAreaBody .itemList {padding:10px 20px 30px;}
.shopDetail .itemList .lr {padding:20px 20px 30px; overflow:hidden; border-bottom:1px solid #dfdfdf; }
.shopDetail .itemList .lr:last-child {border-bottom:none; padding-bottom:0; }
.shopDetail .itemList .itemSet {width: 500px; }
.shopDetail .itemList .itemSet .imgArea {float:left; margin-right:40px;}
.shopDetail .itemList .itemSet .imgArea img {} /*border:1px solid #d8d8d8;*/
.shopDetail .itemList .itemSet p {margin:0;}
.shopDetail .itemList .itemSet .name {margin-bottom:10px; font-size:130%; font-weight:bold; }
.shopDetail .itemList .itemSet .itemExp {font-size:85%; color:#888;}
.shopDetail .itemList a {cursor:pointer; text-decoration:none; }
.shopDetail .itemList a:hover p {text-decoration:underline; }
.shopDetail .childItems p img {margin-left:10px;}
.shopDetail .childItemsExp {clear:both; margin-left:155px; padding:20px; background:#F1F1F1; overflow:hidden; color:#444}
.shopDetail .childItemsExp * {margin:0; padding:0; }
.shopDetail .childItemsExp .childLr {padding:15px 0 ; border-bottom:1px solid #ddd; overflow:hidden;}
.shopDetail .childItemsExp .childLr:first-child {padding-top:0; }
.shopDetail .childItemsExp .childLr:last-child {border:none; padding-bottom:0; }
.shopDetail .childItemsExp .childSet {width:400px; padding-right:10px;}
.shopDetail .childItemsExp .childName {font-weight:bold; }
.shopDetail .childItemsExp .childExp {font-size:85%; color:#888}
.shopDetail .recommendArea {margin-top:30px; padding:30px 20px; border:1px solid #dcdcdc; border-radius:15px;}
.shopDetail .recommendArea h2 {margin:0; height:40px; background:url(https://static.ncsoft.jp/images/bns/shop/headRecommend.png) left top no-repeat; text-indent:-9999px;}
/* ゲームガイド */
.gameGuide .multiColumn {overflow:hidden;}
.gameGuide .multiColumn .column {float:left;}
.gameGuide .multiColumn3 .column {width:29.8%; margin-right:4%;}
.gameGuide .multiColumn3 .column:last-child {margin-right:0;}
.gameGuide .gameGuideHead {padding:40px 0; overflow:hidden;}
.gameGuide .gameGuideHead h1 {color:#000; width:205px; padding-left:20px; float:left;}
.gameGuide .gameGuideHead h1 + * {float:right; width:805px; padding-right:20px; margin:0; padding-top:5px;}
.gameGuide .slideArea {position:relative; }
.gameGuide .slideArea * {margin:0; padding:0;}
.gameGuide .slideArea ul li {list-style:none}
.gameGuide .slideArea ul.images li {display:none;}
.gameGuide .slideArea ul.images li.show {display:block;}
.gameGuide .slideArea .texts li {display:none;}
.gameGuide .slideArea .texts li.show {display:block;}
.gameGuide .slideArea .texts p {margin:0 60px; text-align:center;}
.gameGuide .slideArea .texts .title {margin:20px 60px; font-weight:bold; font-size:160%;}
.gameGuide .slideArea ul.nav li {cursor:pointer; width:29px; height:29px; overflow:hidden; text-indent:-9999px;}
.gameGuide .slideArea ul.nav li.prev {float:left; background:url(https://static.ncsoft.jp/images/bns/common/paging2L.gif);}
.gameGuide .slideArea ul.nav li.next {float:right; background:url(https://static.ncsoft.jp/images/bns/common/paging2R.gif);}
.gameGuide .slideArea ul.nav {position:absolute; top:500px; width:100%; }

/* 汎用エレメント */
.cage:after {content:url(https://static.ncsoft.jp/images/common/spacer.gif);display:block;clear:both;height:0;} /* clearFix */
.cage {display:inline-block;} /* clearFix */
.cage {display:block;} /* clearFix */
.cage {padding:20px; border:1px solid #E4E3E1; background:#FCFBF9; color:#888;}
.cage h2,
.cage h3,
.cage h4,
.cage h5 {color:#2d2d2d;}
.cage.cageTp2 {background:#F4F4F4; border-color:#e9e9e9;}
.contentElementBody > .cage:first-child {border-top:none;}
.cage + .cage {margin-top:30px;}

.section {margin:40px 0}
.section:first-child {margin-top:0}
.section:last-child {margin-bottom:0}

table.type1 {margin:0.5em 0; width:100%;}
table.type1 th,
table.type1 td {border:1px solid #d2d2d2; }
table.type1 th:first-child,
table.type1 td:first-child {border-left:none}
table.type1 th:last-child,
table.type1 td:last-child {border-right:none}
table.type1 tbody th {text-align:left;}

.tableWrap-bordered {position: relative; margin-bottom: 1em;}
.tableWrap-bordered::after {content: ""; display: block; position: absolute; bottom: -1px; right: 0; width: 100%; height: 2px; background: #d3d3d3;}
.table-bordered {border-collapse: collapse; margin-bottom: -1px; border: solid 1px #d3d3d3;}
.table-bordered tr > * {padding: 10px 15px; vertical-align: middle; border: solid 1px #d3d3d3;}
.table-bordered thead th {text-align: center; color: #fff; background: #b361a1; border-top: solid 1px #b361a1;}
.table-bordered tbody tr > * {background: #f5f5f5;}
.table-bordered tr.border-bottom-2 > *,
.table-bordered tr > *.border-bottom-2 {border-bottom-width: 2px;}
.table tr.bg-clear td {background: #fff;}
.table-colorRed thead th {background: #d61554; border-top: solid 1px #d61554;}
.table-colorRed tbody tr > * {background: #ffecec;}
.table-colorRed tr.bg-clear td {background: #fff8f8;}
.table-sm tr > * {padding: 5px 10px;}
.table .itemName {display: flex; align-items: center;}
.table .itemName em {margin-left: 10px; white-space: nowrap;}

.topicArea {margin:30px 0; padding:20px 20px 20px 200px; background:url(https://static.ncsoft.jp/images/bns/common/topic.png) 50px center no-repeat #fbfbfb; font-size:90%; color:#888;}
.topicArea .title {font-size:140%; color:#FE7E0A; }

dl.type1:after{content:url(https://static.ncsoft.jp/images/common/spacer.gif);display:block;clear:both;height:0;} /* clearFix */
dl.type1{display:inline-block;} /* clearFix */
dl.type1{display:block;} /* clearFix */
dl.type1 > dt {position:relative; float:left; clear:left; padding:40px 0 40px 20px; width:235px; border-top:2px solid #9a9a9a; }
dl.type1 h2 {font-size:180%; color:#000; }
dl.type1 > dd {margin-left:285px; padding:40px 20px 40px 0; width:805px; border-top:2px solid #9a9a9a; color:#000;}
dl.type1 > dt.dt1,
dl.type1 > dd.dd1 {border-color:#2e2e2e;}
dl.type1 > dt .kazari {position:absolute; top:100px; right:0;}
dl.type1 .cyuu {font-size:90%; color:#FE7E0A}
dl.type1 table.type1 th,
dl.type1 table.type1 td {padding:10px;}

.sort {display:inline-block;}
.lt-ie8 .sort {display:inline;}
.sort li {padding-right:15px; background:url(https://static.ncsoft.jp/images/bns/common/sort.gif) right 3px no-repeat; cursor:pointer; font-size:12px;}
.sort li.selected {background-position:right -97px;}
.sort.disabled li {color:#ccc; cursor:auto;}
.sort.disabled li.selected {background-position:right 3px;}
.sort li {display:inline-block;}
.lt-ie8 .sort li {display:inline;}


/* youtube貼り付け */
.youtubeMovieWaku {position:relative; background:#000; width:100%; height:100%; line-height:0; }
.youtubeMovieWaku .youtubeCtrl {position:absolute; top:0; left:0; width:100%; height:100%; cursor:pointer; background:url(https://static.ncsoft.jp/images/bns/common/moviePlay.png) center no-repeat; }
.youtubeMovieWaku .youtubeCtrl:hover {background-image:url(https://static.ncsoft.jp/images/bns/common/moviePlayOn.png)}
.youtubeMovieWaku img {filter:alpha(opacity=90);-moz-opacity:0.9;opacity:0.9; width:100%; height:100%;}
.youtubeMovieWaku.youtubeCurrent img,
.youtubeMovieWaku.youtubeCurrent .youtubeCtrl {display:none;}

/* ヘッダーバナー */
.headerBanner {position: relative; top: 167px; margin-left: -645px;}


.classIcon {background-image: url(https://static.ncsoft.jp/images/bns/common/classIcon_v200916.png); background-repeat: no-repeat;display: inline-block; vertical-align:middle; }
    .lt-ie8 .classIcon {display:block;}
.classIcon-class1,
.classIcon-class2,
.classIcon-class3,
.classIcon-class4,
.classIcon-class5,
.classIcon-class6,
.classIcon-class7,
.classIcon-class8,
.classIcon-class9,
.classIcon-class10,
.classIcon-class11,
.classIcon-class12,
.classIcon-class13,
.classIcon-class14 {width: 40px;height: 40px;}
.classIcon-class1 {background-position: -5px -5px;}
.classIcon-class2 {background-position: -55px -5px;}
.classIcon-class3 {background-position: -105px -5px;}
.classIcon-class4 {background-position: -5px -55px;}
.classIcon-class5 {background-position: -55px -55px;}
.classIcon-class6 {background-position: -105px -55px;}
.classIcon-class7 {background-position: -5px -105px;}
.classIcon-class8 {background-position: -5px -155px;}
.classIcon-class9 {background-position: -5px -200px;}
.classIcon-class10 {background-position: -55px -155px;}
.classIcon-class11 {background-position: -55px -200px;}
.classIcon-class12 {background-position: -105px -200px;}
.classIcon-class14 {background-position: -5px -245px;}

.classIcon-place1, .classIcon-place2, .classIcon-place3 {width: 30px;height: 40px;}
.classIcon-place1 {background-position: -55px -105px;}
.classIcon-place2 {background-position: -95px -105px;}
.classIcon-place3 {background-position: -155px -5px;}
.classIcon-down, .classIcon-in, .classIcon-up {width: 16px;height: 16px;}
.classIcon-down {background-position: -155px -55px;}
.classIcon-in {background-position: -155px -81px;}
.classIcon-up {background-position: -135px -107px;}

/* Bujindan */
.classWrapper {display: inline-block; width: calc(40px + 6em); text-align-last: left;}

.btn[disabled] {opacity: .3; pointer-events: none;}
.table--bujindan {
    width: 100%;
}

.table--bujindan th {
    padding: 15px 10px;
    white-space: nowrap;
}
.table--bujindan th[rowspan] {
    border-bottom-width: 2px;
}
.table--bujindan th[colspan] {
    border-bottom-width: 2px;
    padding: 5px 0;
}
.table--bujindan thead th:not([rowspan]):not([colspan]) {
    border-left: solid #D3D3D3 2px;
    padding-top: 5px;
    padding-bottom: 5px;
}
.table--bujindan thead th:not([rowspan]) + th:not([rowspan]) {
    border-left: none;
    border-right: solid #D3D3D3 2px;
}

.table--bujindan td {
    padding: 10px;
    border-bottom: 1px solid #D3D3D3;
    text-align: center;
    font-weight: normal;
}

.table--bujindan th, .table--bujindan td {
    padding: 20px 15px;
    border-bottom: 1px solid #D3D3D3;
    text-align: center;
    font-weight: normal;
}

.panuzu > * + * {
    margin-left: 5px;
}
.panuzu > * + *::before {
    content: ">";
    margin-right: 5px;
}

.bujindanItemList + .bujindanItemList {
    margin-top: 20px;
}
.bujindanItemListWrapper {
    padding-top: 10px;
}
.bujindanItemListWrapper h2 {
    font-size: 180%;
    text-align: center;
    margin-bottom: 10px;
}
.bujindanItemListWrapper + .bujindanItemListWrapper {
    margin-top: 20px;
}
.bujindanItemTable {
    width: 100%;
    table-layout: fixed;}
.bujindanItemTable + .bujindanItemTable {
    margin-top: 1em;}
.bujindanItemTable tr:first-child td {
    border-top: 2px solid #D3D3D3;}
.bujindanItemTable td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
}
.bujindanItemTable tr:last-child td {
    border-bottom: 2px solid #D3D3D3;
}
.bujindanItemTable__itemWrapper {
    display: flex;
}
.bujindanItemTable__icon {
    width: 40px;
    min-width: 40px;
}
.bujindanItemTable__icon img {
    width: 100%;
}
.bujindanItemTable__name {
    display: flex;
    align-items: center;
    margin-left: 0.5em;
}
.bujindanSlab {
    position: relative;
    width: 608px;
    height: 504px;
    margin: 0 auto;
    background: url(https://static.ncsoft.jp/images/bns/ranking/equipinfo/slab.jpg) no-repeat;
}
.bujindanSlab__potential,
.bujindanSlab__kesseki {
    position: absolute;
    transform: translateY(-50%);
    display: block;
}
.bujindanSlab__potential[disabled],
.bujindanSlab__kesseki[disabled] {
    display: none !important;
}
.bujindanSlab__potential {
    height: 60px;
}
.bujindanSlab__kesseki {
    height: 48px;
}
.bujindanSlab__potential_1 {
    top: 73px;
    left: 50%;
}
.bujindanSlab__potential_2 {
    top: 229px; left: 50%; z-index: 3;
}
.bujindanSlab__potential_3, .bujindanSlab__potential_4 {
    top: 362px; z-index: 2;
}
.bujindanSlab__potential_3 {
    left: 223px;
}
.bujindanSlab__potential_4 {
    right: 223px;
}
.bujindanSlab__potential_5, .bujindanSlab__potential_6 {
    top: 430px;
}
.bujindanSlab__potential_5 {
    left: 76px;
}
.bujindanSlab__potential_6 {
    right: 76px;
}

.bujindanSlab__kesseki_1 {
    top: 150px; left: 50%;
}
.bujindanSlab__kesseki_2, .bujindanSlab__kesseki_3 {
    top: 252px; z-index: 3;
}
.bujindanSlab__kesseki_2 {
    left: 196px;
}
.bujindanSlab__kesseki_3 {
    right: 196px;
}
.bujindanSlab__kesseki_4, .bujindanSlab__kesseki_5 {
    top: 292px;
}
.bujindanSlab__kesseki_4:hover, .bujindanSlab__kesseki_5:hover {
    z-index: 4;
}
.bujindanSlab__kesseki_4 {
    left: 263px;
}
.bujindanSlab__kesseki_5 {
    right: 263px;
}
.bujindanSlab__kesseki_6 {
    top: 363px; left: 50%; z-index: 3;
}
.bujindanSlab__kesseki_7, .bujindanSlab__kesseki_8 {
    top: 393px; z-index: 1;
}
.bujindanSlab__kesseki_7:hover, .bujindanSlab__kesseki_8:hover {
    z-index: 3;
}
.bujindanSlab__kesseki_7 {
    left: 153px;
}
.bujindanSlab__kesseki_8 {
    right: 153px;
}
.bujindanSlab__kesseki_9 {
    top: 423px; left: 50%;
}
.bujindanSlab__potential em,
.bujindanSlab__kesseki em {
    position: absolute;
    left: 50%;
    bottom: -1.2em;
    display: block;
    white-space: nowrap;
    transform: translateX(-50%);
    color: #000;
    line-height: 1.3;
    padding: 0 2px;
    box-shadow: 0 1px 2px rgba(0,0,0,.5);
}
.bujindanSlab__potential em {
    background: #eae1ad;
}
.bujindanSlab__kesseki em {
    display: none;
}
.bujindanSlab__kesseki:hover em {
    display: inline-block;
    bottom: -1.5em;
    background: #78baff;
}
.bujindanSlab__potential img,
.bujindanSlab__kesseki img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.bujindanSlab__potential img {
    width: 52px;
    border-radius: 2px;
}
.bujindanSlab__kesseki img {
    width: 40px;
}

.favoriteStyle .btn {
    border: solid 4px #feb604;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

.blockSeparate {
    display: flex;
}

.blockSeparate.jc-between {
    justify-content: space-between;
}

ul.kome li::before {
    content: "※";
}

:not(ul).kome::before {
    content: "※";
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}


/* eventBoard */
.contentElement.eventBoard {
  position: relative;
  overflow: hidden;
}
.contentElement.eventBoard:before {
  content: '';
  width: 100vw;
  height: 300px;
  background: #070516 url(https://static.ncsoft.jp/images/event/bns/1808boast/board_header_pc.jpg) no-repeat center;
  position: absolute;
  top: 167px;
  left: 0;
}
.contentElement.eventBoard .contentElementHead {
  padding-top: 480px;
}

/* Beginning Sale */
.contentElement .contentElementHead_beginning {padding-top:210px; margin-bottom:45px;}
.contentElement .contentElementHead_beginning_tit {margin-bottom:45px;}
.contentElement .contentElementHead_beginning_tit h1 {margin-left:-10px;}