@charset "UTF-8";
/* HIVELAB Web Standard */
/* reset */
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
table,
th,
td,
form,
fieldset,
legend,
textarea,
input,
select,
textarea,
button,
pre {
    margin: 0;
    padding: 0;
}

html,
body {
    width: 100%;
    height: 100%;
}

body {
    -webkit-text-size-adjust: 100%;
}

body,
input,
select,
textarea,
button,
th,
td {
    color: #555; 
    font-size: 12px;
    font-family: 'Arial', sans-serif, 'Apple SD Gothic Neo';
}

fieldset,
img {
    border: 0 none;
}

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

li {
    vertical-align: top;
}

input,
select,
textarea,
button {
    vertical-align: top;
}

button,
input[type=button] {
    overflow: visible;
    background-color: transparent;
    cursor: pointer;
}

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

input[type="text"],
input[type="password"],
button {
    border: 0 none;
    border-radius: 0;
    background: none; 

    -webkit-appearance: none;
}

:placeholder-shown {
    color: #bebebe;
}

::-webkit-input-placeholder {
    color: #bebebe;
}

::-moz-placeholder {
    color: #bebebe;
    opacity: 1;
    -ms-filter: "alpha(opacity=100)";
}

:-ms-input-placeholder {
    color: #bebebe;
}

select::-ms-expand {
    display: none;
}

button span {
    position: relative;
}

address,
caption,
em {
    font-style: normal;
}

a {
    color: #555;
    cursor: pointer;
}

a,
a:active,
a:hover {
    text-decoration: none;
}

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

ins {
    text-decoration: none;
}

.sp {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top; 
    line-height: 999px;
}

.sp_sub {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat; 
    vertical-align: top;
    line-height: 999px;
}

.blind,
caption span {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    width: 1px;
    height: 1px;
    white-space: nowrap; 
    font-size: 0;
    line-height: 999px;
}

/* 컨텐츠 공통 */
.view_medium {
    display: none !important;
}

.btn {
    display: inline-block;
    height: 60px;
    background: #d98500;
    text-align: center;
    box-sizing: border-box;
}
.btn > span {
    height: 17px;
    vertical-align: middle;
}
.btn:hover {
    background: #c16400;
}
.btn:disabled {
    background: #999;
}

a.btn > span {
    background-size: 100%; 
    background-repeat: none;
    vertical-align: middle !important;
}

a.btn:after {
    display: inline-block;
    height: 100%;
    content: ''; 
    vertical-align: middle;
}

.btn2 {
    display: inline-block;
    height: 80px;
    padding: 30px 25px;
    background: #d98500;
    text-align: center;
    box-sizing: border-box;
}
.btn2 > span {
    display: block;
}
.btn2:hover {
    background: #c16400;
}

.link {
    display: inline-block;
    color: #1428a0;
    vertical-align: middle;
    text-decoration: underline; 
    font-size: 16px;
}
.link:hover {
    text-decoration: underline;
}

.input_wrap {
    font-size: 0;
}
.input_wrap:after {
    display: block;
    clear: both;
    content: '';
}
.input_wrap .input_box {
    position: relative;
    box-sizing: border-box;
}
.input_wrap .input_text {
    margin-left: 10px;
}
.input_wrap .input_text:first-child {
    margin-left: 0;
}

.required {
    z-index: 1;
}
.required .input_text,
.required .input_select,
.required .input_check label:before {
    border-color: #f00;
}
.required .err_txt {
    position: absolute;
    top: 100%;
    left: 0; 
    display: block;
}

.err_txt {
    display: none;
    margin-top: 8px;
    color: #f00; 
    font-size: 14px;
}

.input_text {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 60px;
    border: 1px solid #d3d3d3;
    background: #fff;
    box-sizing: border-box;
}
.input_text.error {
    border-color: #f00;
}
.input_text input {
    width: 100%;
    height: 58px;
    padding: 15px 19px;
    font-size: 14px;
    box-sizing: border-box;
}
.input_text label {
    position: absolute;
    top: 50%;
    left: 18px;
    color: #bebebe; 
    font-size: 14px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.input_textarea {
    position: relative;
    border: 1px solid #d3d3d3;
    box-sizing: border-box;
}
.input_textarea label {
    position: absolute;
    top: 21px;
    left: 18px;
    color: #bebebe; 
    font-size: 14px;
}
.input_textarea textarea {
    width: 100%;
    padding: 21px 19px;
    border: 0;
    font-size: 14px;
    resize: none; 
    box-sizing: border-box;
}

.input_select {
    position: relative;
    display: block;
    border: 1px solid #d3d3d3;
    box-sizing: border-box;
}
.input_select:before {
    position: absolute;
    top: 15px;
    right: 14px;
    width: 19px;
    height: 28px;
    background: #fff;
    content: '';
}
.input_select:after {
    position: absolute;
    top: 18px;
    right: 18px;
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 22px;
    height: 10px;
    height: 22px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    background-position: -431px -30px;
    content: ''; 
    vertical-align: top;
    line-height: 999px;
}
.input_select.active:after {
    background-position: -455px -30px;
}
.input_select select:-ms-expand {
    display: none;
}
.input_select select {
    width: 100%;
    height: 58px;
    padding: 15px 14px;
    border: 0;
    background: #fff;
    color: #999;
    font-size: 14px;
    box-sizing: border-box;

    -moz-appearance: none;
    -webkit-appearance: none;
}

.input_check {
    position: relative;
    display: inline-block;
    height: 48px;
    box-sizing: border-box;
}
.input_check input[type="checkbox"] {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
}
.input_check input:checked + label:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 48px;
    height: 48px;
    background: url(../../images/official/ico_check.png) no-repeat;
    content: '';
}
.input_check input:disabled + label:after {
    background: url(../../images/official/ico_check_disabled.png) no-repeat;
}
.input_check label {
    display: block;
    padding-left: 60px;
    color: #000;
    vertical-align: middle; 
    font-size: 16px;
    line-height: 48px;
}
.input_check label:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 46px;
    height: 46px;
    border: 1px solid #d3d3d3;
    background: #fff;
    content: '';
}

.input_check_box {
    display: inline-block;
    vertical-align: middle;
}

.input_radio {
    position: relative;
    display: inline-block;
    height: 48px;
    box-sizing: border-box;
}
.input_radio:first-child {
    margin-right: 50px;
}
.input_radio input[type="radio"] {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    opacity: 0;
    -ms-filter: "alpha(opacity=0)";
}
.input_radio input:checked + label:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 48px;
    height: 48px;
    background: url(../../images/official/ico_check2.png) no-repeat;
    content: '';
}
.input_radio input:disabled + label:after {
    background: url(../../images/official/ico_check_disabled.png) no-repeat;
}
.input_radio label {
    display: block;
    padding-left: 60px;
    color: #555;
    vertical-align: middle; 
    font-size: 14px;
    line-height: 48px;
}
.input_radio label:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 46px;
    height: 46px;
    border: 1px solid #d3d3d3;
    background: #fff;
    content: '';
}

.input_radio_box {
    padding: 5px 0;
}

.input_file {
    display: inline-block;
    padding: 8px 15px;
    background: #d98500;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
}
.input_file:hover {
    background: #c16400;
}
.input_file input[type="file"] {
    display: none;
}

.input_file_filename {
    padding-left: 20px;
}

.row {
    margin-left: -22px;
}
.row:after {
    display: block;
    clear: both;
    content: '';
}

/* 스킵네비게이션 */
#skip {
    height: 0;
}

#skip a {
    position: absolute;
    top: -100px;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #000;
    text-align: center;
}

#skip a:focus,
#skip a:active {
    position: absolute;
    top: 0;
    z-index: 120;
    height: 25px;
    padding: 10px 0;
    background: #fff;
    color: #000;
    text-decoration: none; 
    font-weight: bold;
    font-size: 20px;
}

/*  */
#wrap {
    position: relative;
    overflow: hidden;
    min-width: 1024px;
    min-height: 100%;
    margin: 0 auto;
    padding-top: 39px;
    background: #f1f1f1;
    box-sizing: border-box;
}

.inner {
    max-width: 1700px;
    margin: 0 auto;
    box-sizing: border-box;
}

.inner2 {
    max-width: 1700px;
    margin: 0 auto;
    padding: 0 30px;
}
.inner2:after {
    display: block;
    clear: both;
    content: '';
}
@media screen and (max-width: 1280px) {
    .inner2 {
        padding: 0 55px;
    }
}

.inner3 {
    max-width: 1700px;
    max-width: 1280px; 
    margin: 0 auto;
    padding: 0 30px;
}
.inner3:after {
    display: block;
    clear: both;
    content: '';
}
@media screen and (max-width: 1280px) {
    .inner3 {
        padding: 0 55px;
    }
}

/* 헤더 */
#header {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 50;
    min-width: 1024px;
    padding-top: 39px;
}
#header .top_wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: url(../../images/official/bg_header.gif) repeat-x;
}
#header .top_wrap .inner:after {
    display: block;
    clear: both;
    content: '';
}
#header .communication_area {
    float: left;
    border: solid #232323;
    border-width: 0 1px;
}
#header .communication_area:after {
    display: block;
    clear: both;
    content: '';
}
#header .communication_area a {
    float: left;
    width: 102px;
    height: 51px;
    padding: 19px 0 14px;
    border-right: 1px solid #060606;
    border-left: 1px solid #232323;
    background: url(../../images/official/bg_header2.gif) repeat-x;
    color: #a8a8a8;
    text-align: center;
    box-sizing: border-box;
}
#header .communication_area a:first-child {
    border-left-color: #060606;
}
#header .communication_area a:before {
    display: inline-block;
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 18px;
    height: 10px;
    height: 18px;
    margin: -1px 7px 1px 0;
    background: url(../../images/official/sp.png) no-repeat;
    content: ''; 
    vertical-align: top;
    vertical-align: middle;
    line-height: 999px;
}
#header .communication_area .forum:before {
    background-position: -208px -35px;
}
#header .communication_area .wiki:before {
    width: 16px;
    background-position: -228px -35px;
}
#header .communication_area .support:before {
    width: 8px;
    background-position: -246px -35px;
}
#header .etc_area {
    float: right;
}
#header .etc_area:after {
    display: block;
    clear: both;
    content: '';
}
#header .etc_area .socail_area {
    float: left;
    padding: 15px 0 13px;
    font-size: 0;
}
#header .etc_area .socail_area a {
    display: inline-block;
    float: left;
    overflow: hidden;
    width: 10px;
    height: 10px;
    height: 24px;
    margin-left: 20px; 
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
#header .etc_area .socail_area a:first-child {
    margin-left: 0;
}
#header .etc_area .socail_area:after {
    display: block;
    clear: both;
    content: '';
}
#header .etc_area .socail_area .baidu {
    width: 20px;
    background-position: 0 -312px;
}
#header .etc_area .socail_area .baidu:hover {
    background-position: 0 -338px;
}
#header .etc_area .socail_area .weibo {
    width: 27px;
    background-position: -22px -312px;
}
#header .etc_area .socail_area .weibo:hover {
    background-position: -22px -338px;
}
#header .etc_area .socail_area .yellow {
    width: 20px;
    background-position: -51px -312px;
}
#header .etc_area .socail_area .yellow:hover {
    background-position: -51px -338px;
}
#header .etc_area .socail_area .tieba {
    width: 19px;
    background-position: -73px -312px;
}
#header .etc_area .socail_area .tieba:hover {
    background-position: -73px -338px;
}
#header .etc_area .socail_area .youku {
    width: 39px;
    background-position: -94px -312px;
}
#header .etc_area .socail_area .youku:hover {
    background-position: -94px -338px;
}
#header .etc_area .socail_area .naver_cafe {
    width: 20px;
    background-position: -135px -312px;
}
#header .etc_area .socail_area .naver_cafe:hover {
    background-position: -135px -338px;
}
#header .etc_area .socail_area .vk {
    width: 27px;
    background-position: -157px -312px;
}
#header .etc_area .socail_area .vk:hover {
    background-position: -157px -338px;
}
#header .etc_area .socail_area .discord {
    width: 19px;
    background-position: -186px -312px;
}
#header .etc_area .socail_area .discord:hover {
    background-position: -186px -338px;
}
#header .etc_area .socail_area .twitter {
    width: 24px;
    background-position: -207px -312px;
}
#header .etc_area .socail_area .twitter:hover {
    background-position: -207px -338px;
}
#header .etc_area .socail_area .steam {
    width: 42px;
    background-position: -233px -312px;
}
#header .etc_area .socail_area .steam:hover {
    background-position: -233px -338px;
}
#header .etc_area .socail_area .twitch {
    width: 21px;
    background-position: -277px -312px;
}
#header .etc_area .socail_area .twitch:hover {
    background-position: -277px -338px;
}
#header .etc_area .socail_area .youtube {
    width: 27px;
    background-position: -300px -312px;
}
#header .etc_area .socail_area .youtube:hover {
    background-position: -300px -338px;
}
#header .etc_area .socail_area .facebook {
    width: 13px;
    background-position: -329px -312px;
}
#header .etc_area .socail_area .facebook:hover {
    background-position: -329px -338px;
}
#header .etc_area .language_selector_area {
    position: relative;
    float: left;
    min-width: 125px;
    height: 51px;
    margin-left: 20px;
    border: solid #232323;
    border-width: 0 1px;
    box-sizing: border-box;
}
#header .gnb_wrap {
    padding: 0 30px;
}
#header .gnb_wrap .inner {
    position: relative;
    height: 88px;
    padding: 0 210px 0 97px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
#header .gnb_wrap .logo {
    position: absolute;
    top: 21px;
    left: 14px;
}
#header .gnb_wrap .logo a {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 77px;
    height: 10px;
    height: 45px; 
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
#header .gnb_wrap .btn_area {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 0;
}
#header .gnb_wrap .btn_area a {
    display: inline-block;
    display: block;
    overflow: hidden;
    width: 10px;
    width: 201px;
    height: 10px;
    height: 87px; 
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
#header .gnb_wrap .btn_area .btn_buy {
    background-position: 0 -94px;
}
#header .gnb_wrap .btn_area .btn_buy:hover,
#header .gnb_wrap .btn_area .btn_buy:active {
    background-position: -202px -94px;
}

#gnb a {
    position: relative;
    float: left;
    overflow: hidden;
    height: 88px;
    margin-left: 38px;
    padding-top: 35px;
    box-sizing: border-box;
}
#gnb a span {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    height: 19px; 
    background: url(../../images/official/sp_japanese.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
#gnb a:first-child {
    margin-left: 36px;
}
#gnb a.on:after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: #f19f00;
    content: '';
}

#gnb:after {
    display: block;
    clear: both;
    content: '';
}

#gnb .news span {
    width: 54px;
    background-position: -3px -39px;
}

#gnb .news.on span,
#gnb .news:hover span {
    background-position: -3px -59px;
}

#gnb .about span {
    width: 72px;
    background-position: -62px -39px;
}

#gnb .about.on span,
#gnb .about:hover span {
    background-position: -62px -59px;
}

#gnb .gameguide span {
    width: 83px;
    background-position: -136px -39px;
}

#gnb .gameguide.on span,
#gnb .gameguide:hover span {
    background-position: -136px -59px;
}

#gnb .media span {
    width: 59px;
    background-position: -221px -39px;
}

#gnb .media.on span,
#gnb .media:hover span {
    background-position: -221px -59px;
}

#gnb .community span {
    width: 84px;
    background-position: -283px -39px;
}

#gnb .community.on span,
#gnb .community:hover span {
    background-position: -283px -59px;
}

#gnb .partners span {
    width: 84px;
    background-position: -371px -39px;
}

#gnb .partners.on span,
#gnb .partners:hover span {
    background-position: -371px -59px;
}

#gnb .faq span {
    width: 29px;
    background-position: -459px -39px;
}

#gnb .faq.on span,
#gnb .faq:hover span {
    background-position: -459px -59px;
}

#gnb .inquiry span {
    width: 93px;
    background-position: -492px -39px;
}

#gnb .inquiry.on span,
#gnb .inquiry:hover span {
    background-position: -492px -59px;
}

#header.sticky {
    position: fixed;
    top: -39px;
}
#header.sticky .inner {
    height: 60px;
    padding-left: 76px;
    border-bottom-color: #eee;
}
#header.sticky .gnb_wrap {
    background: #fff;
}
#header.sticky .gnb_wrap a:hover:after,
#header.sticky .gnb_wrap a.on:after {
    background: #d98500;
}
#header.sticky .gnb_wrap .logo {
    top: 15px;
}
#header.sticky .gnb_wrap .logo a {
    width: 56px;
    height: 33px;
    background-position: -208px 0;
}
#header.sticky .gnb_wrap .btn_area a {
    height: 60px;
}
#header.sticky .gnb_wrap .btn_area .btn_buy {
    background-position: -282px -184px;
}
#header.sticky .gnb_wrap .btn_area .btn_buy:hover {
    background-position: -286px -246px;
}
#header.sticky #gnb a {
    height: 60px;
    margin-left: 30px;
    padding-top: 24px;
}
#header.sticky #gnb a span {
    height: 17px;
}
#header.sticky #gnb a:first-child {
    margin-left: 17px;
}
#header.sticky #gnb .news span {
    width: 48px;
    background-position: -1px -2px;
}
#header.sticky #gnb .news.on span,
#header.sticky #gnb .news:hover span {
    background-position: -1px -20px;
}
#header.sticky #gnb .about span {
    width: 65px;
    background-position: -52px -2px;
}
#header.sticky #gnb .about.on span,
#header.sticky #gnb .about:hover span {
    background-position: -52px -20px;
}
#header.sticky #gnb .gameguide span {
    width: 73px;
    background-position: -121px -2px;
}
#header.sticky #gnb .gameguide.on span,
#header.sticky #gnb .gameguide:hover span {
    background-position: -121px -20px;
}
#header.sticky #gnb .media span {
    width: 51px;
    background-position: -196px -2px;
}
#header.sticky #gnb .media.on span,
#header.sticky #gnb .media:hover span {
    background-position: -196px -20px;
}
#header.sticky #gnb .community span {
    width: 73px;
    background-position: -250px -2px;
}
#header.sticky #gnb .community.on span,
#header.sticky #gnb .community:hover span {
    background-position: -250px -20px;
}
#header.sticky #gnb .partners span {
    width: 74px;
    background-position: -327px -2px;
}
#header.sticky #gnb .partners.on span,
#header.sticky #gnb .partners:hover span {
    background-position: -327px -20px;
}
#header.sticky #gnb .faq span {
    width: 27px;
    background-position: -405px -2px;
}
#header.sticky #gnb .faq.on span,
#header.sticky #gnb .faq:hover span {
    background-position: -405px -20px;
}
#header.sticky #gnb .inquiry span {
    width: 82px;
    background-position: -438px -2px;
}
#header.sticky #gnb .inquiry.on span,
#header.sticky #gnb .inquiry:hover span {
    background-position: -438px -20px;
}

#content {
    display: block;
    padding-bottom: 250px;
}

/* 푸터 */
#footer {
    position: relative;
    padding: 122px 0 98px;
    background: #131313;
}
#footer:before {
    position: absolute;
    top: -75px;
    left: 0;
    width: 100%;
    height: 78px;
    background: url(../../images/official/main_mask04.png) no-repeat 50% 0;
    background-size: 1920px auto; 
    content: "";
}
#footer .inner2 {
    position: relative;
    z-index: 2;
}
#footer .inner2:before {
    position: absolute;
    top: -435px;
    left: 50%;
    width: 808px;
    height: 617px;
    margin-left: 270px;
    background: url(../../images/official/bg_footer.png) no-repeat;
    content: '';
}
#footer .footerlink {
    position: relative;
    width: 768px;
    margin: 0 auto;
    text-align: center;
}
#footer .footerlink > li {
    position: relative;
    display: inline-block;
    margin-bottom: 7px;
    padding: 0 11px 0 15px;
    font-weight: bold;
}
#footer .footerlink > li:hover {
    color: #999;
    text-decoration: underline;
}
#footer .footerlink > li:before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 12px;
    margin-top: -6px;
    background: #3b3b3b;
    content: '';
}
#footer .footerlink > li:first-of-type {
    margin-left: -15px;
}
#footer .footerlink > li:first-of-type:before {
    display: none;
}
#footer .footerlink > li.footer_twitter {
    position: absolute;
    top: 0;
    left: -100px;
}
#footer .footerlink > li.footer_twitter:hover {
    opacity: 0.8;
    -ms-filter: "alpha(opacity=80)";
}
#footer .footerlink > li.footer_twitter:before {
    display: none;
}
#footer .copyright_area {
    position: relative;
    height: 61px;
    margin-top: 45px;
    color: #5e5e5e;
    text-align: center; 
    line-height: 18px;
}
#footer .copyright_area .footer_dmm {
    display: inline-block;
    margin-right: 40px;
}
#footer .copyright_area .copyright {
    position: relative;
    top: -27px;
    display: inline-block;
}
#footer .socail_area {
    font-size: 0;
}
#footer .socail_area a {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    height: 24px;
    margin-left: 20px; 
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
#footer .socail_area a:first-child {
    margin-left: 0;
}
#footer .socail_area .baidu {
    width: 19px;
    background-position: 0 -364px;
}
#footer .socail_area .baidu:hover {
    background-position: 0 -390px;
}
#footer .socail_area .weibo {
    width: 26px;
    background-position: -21px -364px;
}
#footer .socail_area .weibo:hover {
    background-position: -21px -390px;
}
#footer .socail_area .yellow {
    width: 19px;
    background-position: -49px -364px;
}
#footer .socail_area .yellow:hover {
    background-position: -49px -390px;
}
#footer .socail_area .tieba {
    width: 18px;
    background-position: -70px -364px;
}
#footer .socail_area .tieba:hover {
    background-position: -70px -390px;
}
#footer .socail_area .youku {
    width: 38px;
    background-position: -90px -364px;
}
#footer .socail_area .youku:hover {
    background-position: -90px -390px;
}
#footer .socail_area .naver_cafe {
    width: 19px;
    background-position: -130px -364px;
}
#footer .socail_area .naver_cafe:hover {
    background-position: -130px -390px;
}
#footer .socail_area .vk {
    width: 26px;
    background-position: -151px -364px;
}
#footer .socail_area .vk:hover {
    background-position: -151px -390px;
}
#footer .socail_area .discord {
    width: 19px;
    background-position: -179px -364px;
}
#footer .socail_area .discord:hover {
    background-position: -179px -390px;
}
#footer .socail_area .twitter {
    width: 23px;
    background-position: -200px -364px;
}
#footer .socail_area .twitter:hover {
    background-position: -200px -390px;
}
#footer .socail_area .steam {
    width: 41px;
    background-position: -225px -364px;
}
#footer .socail_area .steam:hover {
    background-position: -225px -390px;
}
#footer .socail_area .twitch {
    width: 20px;
    background-position: -268px -364px;
}
#footer .socail_area .twitch:hover {
    background-position: -268px -390px;
}
#footer .socail_area .youtube {
    width: 26px;
    background-position: -290px -364px;
}
#footer .socail_area .youtube:hover {
    background-position: -290px -390px;
}
#footer .socail_area .facebook {
    width: 12px;
    background-position: -318px -364px;
}
#footer .socail_area .facebook:hover {
    background-position: -318px -390px;
}

/* subscribe */
.member_wrap {
    position: relative;
    z-index: 2;
    padding: 80px 0 56px;
    background: #fff;
}
.member_wrap:before {
    position: absolute;
    bottom: -415px;
    left: 50%;
    width: 808px;
    height: 617px;
    margin-left: 221px;
    background: url(../../images/official/bg_footer.png) no-repeat;
    content: '';
}
.member_wrap .inner {
    position: relative;
}
.member_wrap section {
    position: relative;
    padding-right: 16%;
}
.member_wrap .section_title {
    display: inline-block;
    display: block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    height: 21px;
    margin-bottom: 19px; 
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
.member_wrap .btn > span {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    height: 17px; 
    background: url(../../images/official/sp.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
.member_wrap .stt {
    float: left;
    margin-right: 25px;
    color: #f19f00;
    letter-spacing: -0.025em; 
    font-size: 24px;
}
.member_wrap form {
    position: relative;
    top: -15px;
    overflow: hidden;
}

.subscribe_area:after {
    display: block;
    clear: both;
    content: '';
}

.subscribe_area .section_title {
    width: 230px;
    background-position: -344px -312px;
}

.subscribe_area .input_wrap {
    position: relative;
    padding: 0 27% 24px 0;
}
.subscribe_area .input_wrap .input_box {
    float: left;
    padding-right: 10px;
}
.subscribe_area .input_wrap .input_box.name {
    width: 39%;
}
.subscribe_area .input_wrap .input_box.email {
    width: 61%;
}
.subscribe_area .input_wrap .input_text {
    display: block;
}
.subscribe_area .input_wrap .required {
    z-index: 1;
}
.subscribe_area .input_wrap .required .input_text {
    border-color: #f00;
}
.subscribe_area .input_wrap .required .err_txt {
    position: absolute;
    position: absolute;
    top: 100%;
    top: 100%;
    left: 0;
    left: 0; 
    display: block;
}
.subscribe_area .input_wrap .btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 27%;
}
.subscribe_area .input_wrap .btn span {
    width: 89px;
    background-position: -404px -157px;
}

/* 커스텀 스크롤 */
.scrl_area {
    position: relative; 
    overflow: hidden;
}

.scroll-wrapper {
    position: relative; 
    overflow: hidden;
}

.scroll-wrapper > .scroll-content {
    top: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    max-height: 100% !important;
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.scroll-element {
    display: none;
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
    display: block;
}

.scrollbar-inner > .scroll-element,
.scrollbar-inner > .scroll-element div {
    position: absolute;
}

.scrollbar-inner > .scroll-element div {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #f0f0f0;
}

.scrollbar-inner > .scroll-element.scroll-y {
    top: 0;
    right: 5px;
    width: 8px;
    height: calc(100% - 8px);
}

.scrollbar-inner > .scroll-element .scroll-element_outer {
    overflow: hidden;
}

.scrollbar-inner > .scroll-element .scroll-bar {
    background-color: #cdcdcd;
}

/* 공통 팝업 */
.ly_alram {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;
    display: none;
    background: #000;
    background: rgba(0, 0, 0, 0.8);
}
.ly_alram .ly_inner {
    position: absolute;
    top: 50%;
    left: 50%;
    display: table;
    width: 420px;
    height: 270px;
    margin: -165px 0 0 -210px;
    padding: 4px;
    background: #d98500;
    box-sizing: border-box;
}
.ly_alram .cnt_area {
    display: table-cell;
    height: 246px;
    background: #fff;
    vertical-align: middle; 
    text-align: center;
}
.ly_alram .ico_txt {
    color: #000; 
    font-size: 24px;
}
.ly_alram .ico_txt:before {
    display: inline-block;
    display: block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    height: 55px;
    margin: 0 auto 14px;
    background: url(../../images/official/sp.png) no-repeat;
    content: ''; 
    vertical-align: top;
    line-height: 999px;
}
.ly_alram .txt_thanks:before {
    width: 59px;
    background-position: -491px -94px;
}
.ly_alram .txt_sorry:before {
    width: 14px;
    background-position: -552px -94px;
}
.ly_alram .btn {
    min-width: 110px;
    height: 50px;
    margin-top: 28px;
    padding: 16px 0;
}
.ly_alram .btn .txt_ok {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 22px;
    height: 10px;
    height: 17px;
    background: url(../../images/official/sp.png) no-repeat;
    background-position: -194px -66px; 
    vertical-align: top;
    line-height: 999px;
}

@media screen and (max-width: 1660px) {
    .member_wrap section {
        padding-right: 12%;
    }
}

@media screen and (max-width: 1550px) {
    .member_wrap section {
        padding-right: 10%;
    }
}

@media screen and (max-width: 1440px) {
    .member_wrap section {
        padding-right: 5%;
    }
    .btn2 {
        min-width: 308px;
        height: 70px;
        padding: 24px;
    }
}

@media screen and (max-width: 1300px) {
    .member_wrap section {
        padding-right: 2%;
    }
}

@media screen and (max-width: 1280px) {
    /* 헤더 */
    #header .gnb_wrap {
        padding: 0 22px;
    }
    #header .gnb_wrap .inner {
        height: 64px;
        padding: 0 150px 0 85px;
    }
    #header .gnb_wrap .logo {
        top: 15px;
    }
    #header .gnb_wrap .logo a {
        width: 60px;
        height: 35px;
        background-position: -79px 0;
    }
    #header .gnb_wrap .btn_area a {
        width: 141px;
        height: 64px;
    }
    #header .gnb_wrap .btn_area .btn_buy {
        background-position: 0 -184px;
    }
    #header .gnb_wrap .btn_area .btn_buy:hover,
    #header .gnb_wrap .btn_area .btn_buy:active {
        background-position: -141px -184px;
    }
    #gnb a {
        height: 64px;
        margin-left: 22px;
        padding-top: 27px;
    }
    #gnb a:first-child {
        margin-left: 22px;
    }
    #header.sticky .inner {
        height: 60px;
        padding-left: 76px;
        border-bottom-color: #eee;
    }
    #header.sticky .gnb_wrap .logo {
        left: 8px;
    }
    #header.sticky .gnb_wrap .btn_area .btn_buy {
        background-position: 0 -250px;
    }
    #header.sticky .gnb_wrap .btn_area .btn_buy:hover {
        background-position: -143px -250px;
    }
    /* subscribe, partner */
    .member_wrap {
        padding-bottom: 30px;
    }
    .member_wrap:before {
        bottom: -300px;
        width: 633px;
        height: 451px;
        margin-left: 0;
        background: url(../../images/official/bg_footer2.png) no-repeat;
    }
    .member_wrap section {
        padding-right: 30%;
    }
    .member_wrap .stt {
        display: block;
        float: none;
        margin-right: 0;
    }
    .member_wrap form {
        top: 0;
        margin-top: 15px;
    }
    /* 컨텐츠 공통 */
    .view_medium {
        display: block !important;
    }
    .btn2 {
        min-width: 288px;
        height: 60px;
        padding: 19px;
    }
}

/* CSS Document */
/* ========================= [ #dmm_ntgnavi ] */
#dmm_ntgnavi {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    background: url(../../images/dmm_olgnavi/bg_navimain.gif) center center repeat-x;
    font-size: 12px;
}

#dmm_ntgnavi ul {
    margin: 2px 0;
    padding: 0; 
    list-style: none;
}

#dmm_ntgnavi ul li {
    float: left;
    margin: 0 6px 0 0;
    line-height: 15px;
}

#dmm_ntgnavi ul.navi_left {
    float: left;
}

#dmm_ntgnavi ul.navi_left li > a {
    display: block;
    padding: 0 3px 0 8px;
    border: 1px solid #eee;
    border-radius: 3px; 
    text-decoration: none;
}

#dmm_ntgnavi ul.navi_left li > a:hover {
    border: 1px solid #666;
    border-radius: 3px; 
    background: #eee;
}

#dmm_ntgnavi ul.navi_left li > a span {
    display: block;
    padding: 9px 10px 7px 28px;
    color: #333;
    font-weight: bold;
}

#dmm_ntgnavi ul.navi_left li.dmm_top img {
    margin: 8px 5px 8px 0;
    vertical-align: top;
}

#dmm_ntgnavi ul.navi_left li.ntg_top span {
    background: url(../../images/dmm_olgnavi/bg_bt_olgtop.gif) 0 center no-repeat;
}

#dmm_ntgnavi ul.navi_left li.ntg_brw span {
    background: url(../../images/dmm_olgnavi/bg_bt_brows.gif) 0 center no-repeat;
}

#dmm_ntgnavi ul.navi_left li.ntg_min span {
    background: url(../../images/dmm_olgnavi/bg_bt_mini.gif) 0 center no-repeat;
}

#dmm_ntgnavi ul.navi_left li.ntg_poi span {
    background: url(../../images/dmm_olgnavi/bg_bt_point.gif) 0 center no-repeat;
}

#dmm_ntgnavi ul.navi_left li.ntg_chip span {
    background: url(../../images/dmm_olgnavi/bg_bt_chip.gif) 0 center no-repeat;
}

#dmm_ntgnavi ul.navi_right {
    float: right;
    font-size: 10px;
}

#dmm_ntgnavi ul.navi_right li {
    margin: 0 10px 0 0;
    padding: 8px 5px;
}

#dmm_ntgnavi .arrow {
    padding-left: 14px;
    background: url(../../images/dmm_olgnavi/arrow_common.gif) no-repeat left center;
}

#dmm_ntgnavi .tx-point {
    color: #ff4b4b !important; 
    font-weight: bold;
    font-size: 16px;
}

#dmm_ntgnavi p {
    margin: 0;
    line-height: 2.6em;
}

#dmm_ntgnavi .clear {
    clear: both;
}

#dmm_ntgnavi .mg-l12 {
    margin-left: 12px;
}

#dmm_ntgnavi .mg-r12 {
    margin-right: 12px;
}

#dmm_ntgnavi .pd-t12 {
    padding-top: 12px;
}

.share_area .sp_sub {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sns.png) no-repeat; 
    vertical-align: top;
    line-height: 999px;
}

.share_area {
    position: relative;
    font-size: 0;
}
.share_area button {
    display: inline-block;
}
.share_area button:first-child {
    margin-left: 0;
}
.share_area .sp_sub {
    height: 19px;
}
.share_area .google .sp_sub {
    width: 23px;
    background-position: 0 -142px;
}
.share_area .google:hover .sp_sub {
    background-position: 0 -163px;
}
.share_area .facebook {
    margin-left: 10px;
}
.share_area .facebook .sp_sub {
    width: 9px;
    background-position: -25px -142px;
}
.share_area .facebook:hover .sp_sub {
    background-position: -25px -163px;
}
.share_area .reddit {
    margin-left: 10px;
}
.share_area .reddit .sp_sub {
    width: 23px;
    background-position: -36px -142px;
}
.share_area .reddit:hover .sp_sub {
    background-position: -36px -163px;
}
.share_area .vk {
    margin-left: 10px;
}
.share_area .vk .sp_sub {
    width: 21px;
    background-position: -61px -142px;
}
.share_area .vk:hover .sp_sub {
    background-position: -61px -163px;
}
.share_area .twitter {
    margin-left: 12px;
}
.share_area .twitter .sp_sub {
    width: 18px;
    background-position: -84px -142px;
}
.share_area .twitter:hover .sp_sub {
    background-position: -84px -163px;
}
.share_area .add_share {
    position: relative;
    display: inline-block;
    margin-left: 28px;
}
.share_area .add_share .sp_sub {
    width: 15px;
    height: 19px;
    background-position: -104px -142px;
}
.share_area .add_share:hover .sp_sub {
    background-position: -104px -163px;
}
.share_area .add_share:before {
    position: absolute;
    top: 50%;
    left: -15px;
    width: 1px;
    height: 16px;
    margin-top: -8px;
    background: #e5e5e5;
    content: '';
}

.share_area.type2 button {
    margin-left: 18px;
}

.share_area.type2 .sp_sub {
    height: 30px;
}

.share_area.type2 .google .sp_sub {
    width: 41px;
    background-position: 0 0;
}

.share_area.type2 .google:hover .sp_sub {
    background-position: 0 -32px;
}

.share_area.type2 .facebook .sp_sub {
    width: 15px;
    background-position: -43px 0;
}

.share_area.type2 .facebook:hover .sp_sub {
    background-position: -43px -32px;
}

.share_area.type2 .reddit .sp_sub {
    width: 39px;
    background-position: -60px 0;
}

.share_area.type2 .reddit:hover .sp_sub {
    background-position: -60px -32px;
}

.share_area.type2 .vk .sp_sub {
    width: 35px;
    background-position: -101px 0;
}

.share_area.type2 .vk:hover .sp_sub {
    background-position: -101px -32px;
}

.share_area.type2 .twitter .sp_sub {
    width: 30px;
    background-position: -138px 0;
}

.share_area.type2 .twitter:hover .sp_sub {
    background-position: -138px -32px;
}

.stream_view_area .share_area {
    position: absolute;
    top: 0;
    right: 9px;
}
.stream_view_area .share_area .sp_sub {
    height: 37px;
}
.stream_view_area .share_area .google .sp_sub {
    width: 48px;
    background-position: 0 -64px;
}
.stream_view_area .share_area .google:hover .sp_sub {
    background-position: 0 -103px;
}
.stream_view_area .share_area .facebook {
    margin-left: 10px;
}
.stream_view_area .share_area .facebook .sp_sub {
    width: 19px;
    background-position: -50px -64px;
}
.stream_view_area .share_area .facebook:hover .sp_sub {
    background-position: -50px -103px;
}
.stream_view_area .share_area .reddit {
    margin-left: 12px;
}
.stream_view_area .share_area .reddit .sp_sub {
    width: 41px;
    background-position: -71px -64px;
}
.stream_view_area .share_area .reddit:hover .sp_sub {
    background-position: -71px -103px;
}
.stream_view_area .share_area .vk {
    margin-left: 10px;
}
.stream_view_area .share_area .vk .sp_sub {
    width: 39px;
    background-position: -114px -64px;
}
.stream_view_area .share_area .vk:hover .sp_sub {
    background-position: -114px -103px;
}
.stream_view_area .share_area .twitter {
    margin-left: 15px;
}
.stream_view_area .share_area .twitter .sp_sub {
    width: 33px;
    background-position: -155px -64px;
}
.stream_view_area .share_area .twitter:hover .sp_sub {
    background-position: -155px -103px;
}
.stream_view_area .share_area .add_share {
    margin-left: 27px;
}
.stream_view_area .share_area .add_share .sp_sub {
    width: 28px;
    height: 37px;
    background-position: -190px -64px;
}
.stream_view_area .share_area .add_share:hover .sp_sub {
    background-position: -190px -103px;
}
.stream_view_area .share_area .add_share:before {
    left: -12px;
    height: 26px;
    margin-top: -15px;
    background: rgba(153, 153, 153, 0.4);
    content: '';
}

.ly_media .share_area {
    position: absolute;
    right: 241px;
    bottom: -64px;
}
.ly_media .share_area button {
    margin-left: 20px;
}
.ly_media .share_area .sp_sub {
    height: 31px;
}
.ly_media .share_area .google .sp_sub {
    width: 42px;
    background-position: 0 -184px;
}
.ly_media .share_area .google:hover .sp_sub {
    background-position: 0 -217px;
}
.ly_media .share_area .facebook .sp_sub {
    width: 15px;
    background-position: -44px -184px;
}
.ly_media .share_area .facebook:hover .sp_sub {
    background-position: -44px -217px;
}
.ly_media .share_area .reddit .sp_sub {
    width: 39px;
    background-position: -61px -184px;
}
.ly_media .share_area .reddit:hover .sp_sub {
    background-position: -61px -217px;
}
.ly_media .share_area .vk .sp_sub {
    width: 35px;
    background-position: -102px -184px;
}
.ly_media .share_area .vk:hover .sp_sub {
    background-position: -102px -217px;
}
.ly_media .share_area .twitter .sp_sub {
    width: 30px;
    background-position: -139px -184px;
}
.ly_media .share_area .twitter:hover .sp_sub {
    background-position: -139px -217px;
}

/* 개발코드 대응 */
.share_area > span {
    display: inline-block;
}
.share_area > span > a {
    display: inline-block;
}

.share_area.type2 .google,
.share_area.type2 .facebook,
.share_area.type2 .reddit,
.share_area.type2 .vk,
.share_area.type2 .twitter {
    margin-left: 18px;
}

.ly_media .share_area .google,
.ly_media .share_area .facebook,
.ly_media .share_area .reddit,
.ly_media .share_area .vk,
.ly_media .share_area .twitter {
    margin-left: 20px;
}

@media screen and (max-width: 1440px) {
    .share_area .facebook {
        margin-left: 8px;
    }
    .share_area .reddit {
        margin-left: 8px;
    }
    .share_area .vk {
        margin-left: 8px;
    }
    .share_area .twitter {
        margin-left: 9px;
    }
    .share_area .add_share {
        margin-left: 25px;
    }
    .share_area.type2 .sp_sub {
        height: 28px;
    }
    .share_area.type2 .google .sp_sub {
        width: 38px;
        background-position: -170px 0;
    }
    .share_area.type2 .google:hover .sp_sub {
        background-position: -170px -30px;
    }
    .share_area.type2 .facebook .sp_sub {
        width: 13px;
        background-position: -210px 0;
    }
    .share_area.type2 .facebook:hover .sp_sub {
        background-position: -210px -30px;
    }
    .share_area.type2 .reddit .sp_sub {
        width: 35px;
        background-position: -225px 0;
    }
    .share_area.type2 .reddit:hover .sp_sub {
        background-position: -225px -30px;
    }
    .share_area.type2 .vk .sp_sub {
        width: 32px;
        background-position: -262px 0;
    }
    .share_area.type2 .vk:hover .sp_sub {
        background-position: -262px -30px;
    }
    .share_area.type2 .twitter .sp_sub {
        width: 27px;
        background-position: -296px 0;
    }
    .share_area.type2 .twitter:hover .sp_sub {
        background-position: -296px -30px;
    }
    .stream_view_area .share_area .sp_sub {
        height: 35px;
    }
    .stream_view_area .share_area .google .sp_sub {
        width: 44px;
        background-position: -220px -64px;
    }
    .stream_view_area .share_area .google:hover .sp_sub {
        background-position: -220px -101px;
    }
    .stream_view_area .share_area .facebook .sp_sub {
        width: 18px;
        background-position: -266px -64px;
    }
    .stream_view_area .share_area .facebook:hover .sp_sub {
        background-position: -266px -101px;
    }
    .stream_view_area .share_area .reddit {
        margin-left: 10px;
    }
    .stream_view_area .share_area .reddit .sp_sub {
        width: 38px;
        background-position: -286px -64px;
    }
    .stream_view_area .share_area .reddit:hover .sp_sub {
        background-position: -286px -101px;
    }
    .stream_view_area .share_area .vk {
        margin-left: 9px;
    }
    .stream_view_area .share_area .vk .sp_sub {
        width: 35px;
        background-position: -326px -64px;
    }
    .stream_view_area .share_area .vk:hover .sp_sub {
        background-position: -326px -101px;
    }
    .stream_view_area .share_area .twitter {
        margin-left: 14px;
    }
    .stream_view_area .share_area .twitter .sp_sub {
        width: 30px;
        background-position: -363px -64px;
    }
    .stream_view_area .share_area .twitter:hover .sp_sub {
        background-position: -363px -101px;
    }
    .stream_view_area .share_area .add_share {
        margin-left: 24px;
    }
    .stream_view_area .share_area .add_share .sp_sub {
        width: 27px;
        height: 35px;
        background-position: -395px -64px;
    }
    .stream_view_area .share_area .add_share:hover .sp_sub {
        background-position: -395px -101px;
    }
    .ly_media .share_area {
        position: absolute;
        right: 188px;
        bottom: -53px;
    }
    .ly_media .share_area button {
        margin-left: 18px;
    }
    .ly_media .share_area .sp_sub {
        height: 30px;
    }
    .ly_media .share_area .google .sp_sub {
        width: 39px;
        background-position: -171px -184px;
    }
    .ly_media .share_area .google:hover .sp_sub {
        background-position: -171px -216px;
    }
    .ly_media .share_area .facebook .sp_sub {
        width: 13px;
        background-position: -212px -184px;
    }
    .ly_media .share_area .facebook:hover .sp_sub {
        background-position: -212px -216px;
    }
    .ly_media .share_area .reddit .sp_sub {
        width: 35px;
        background-position: -227px -184px;
    }
    .ly_media .share_area .reddit:hover .sp_sub {
        background-position: -227px -216px;
    }
    .ly_media .share_area .vk .sp_sub {
        width: 32px;
        background-position: -264px -184px;
    }
    .ly_media .share_area .vk:hover .sp_sub {
        background-position: -264px -216px;
    }
    .ly_media .share_area .twitter .sp_sub {
        width: 27px;
        background-position: -298px -184px;
    }
    .ly_media .share_area .twitter:hover .sp_sub {
        background-position: -298px -216px;
    }
    /* 개발코드 대응 */
    .stream_view_area .share_area > span {
        display: inline-block;
    }
    .stream_view_area .share_area > span > a {
        display: inline-block;
    }
    .stream_view_area .share_area .reddit {
        margin-left: 12px;
    }
    .stream_view_area .share_area .vk {
        margin-left: 10px;
    }
    .stream_view_area .share_area .twitter {
        margin-left: 15px;
    }
    .ly_media .share_area .google,
    .ly_media .share_area .facebook,
    .ly_media .share_area .reddit,
    .ly_media .share_area .vk,
    .ly_media .share_area .twitter {
        margin-left: 18px;
    }
}

@media screen and (max-width: 1280px) {
    .share_area .sp_sub {
        height: 16px;
    }
    .share_area .google .sp_sub {
        width: 20px;
        background-position: -121px -142px;
    }
    .share_area .google:hover .sp_sub {
        background-position: -121px -160px;
    }
    .share_area .facebook .sp_sub {
        width: 8px;
        background-position: -143px -142px;
    }
    .share_area .facebook:hover .sp_sub {
        background-position: -143px -160px;
    }
    .share_area .reddit {
        margin-left: 9px;
    }
    .share_area .reddit .sp_sub {
        width: 20px;
        background-position: -153px -142px;
    }
    .share_area .reddit:hover .sp_sub {
        background-position: -153px -160px;
    }
    .share_area .vk {
        margin-left: 8px;
    }
    .share_area .vk .sp_sub {
        width: 18px;
        background-position: -174px -142px;
    }
    .share_area .vk:hover .sp_sub {
        background-position: -174px -160px;
    }
    .share_area .twitter {
        margin-left: 12px;
    }
    .share_area .twitter .sp_sub {
        width: 15px;
        background-position: -194px -142px;
    }
    .share_area .twitter:hover .sp_sub {
        background-position: -194px -160px;
    }
    .share_area .add_share {
        margin-left: 23px;
    }
    .share_area .add_share .sp_sub {
        width: 13px;
        height: 16px;
        background-position: -212px -142px;
    }
    .share_area .add_share:hover .sp_sub {
        background-position: -212px -160px;
    }
    .share_area .add_share:before {
        left: -11px;
    }
    .share_area.type2 .sp_sub {
        height: 24px;
    }
    .share_area.type2 .google .sp_sub {
        width: 34px;
        background-position: -325px 0;
    }
    .share_area.type2 .google:hover .sp_sub {
        background-position: -325px -26px;
    }
    .share_area.type2 .facebook .sp_sub {
        width: 12px;
        background-position: -361px 0;
    }
    .share_area.type2 .facebook:hover .sp_sub {
        background-position: -361px -26px;
    }
    .share_area.type2 .reddit .sp_sub {
        width: 31px;
        background-position: -375px 0;
    }
    .share_area.type2 .reddit:hover .sp_sub {
        background-position: -375px -26px;
    }
    .share_area.type2 .vk .sp_sub {
        width: 28px;
        background-position: -408px 0;
    }
    .share_area.type2 .vk:hover .sp_sub {
        background-position: -408px -26px;
    }
    .share_area.type2 .twitter .sp_sub {
        width: 24px;
        background-position: -438px 0;
    }
    .share_area.type2 .twitter:hover .sp_sub {
        background-position: -438px -26px;
    }
    .stream_view_area .share_area .sp_sub {
        height: 32px;
    }
    .stream_view_area .share_area .google .sp_sub {
        width: 39px;
        background-position: -424px -64px;
    }
    .stream_view_area .share_area .google:hover .sp_sub {
        background-position: -424px -98px;
    }
    .stream_view_area .share_area .facebook .sp_sub {
        width: 17px;
        background-position: -465px -64px;
    }
    .stream_view_area .share_area .facebook:hover .sp_sub {
        background-position: -465px -98px;
    }
    .stream_view_area .share_area .reddit {
        margin-left: 9px;
    }
    .stream_view_area .share_area .reddit .sp_sub {
        width: 34px;
        background-position: -484px -64px;
    }
    .stream_view_area .share_area .reddit:hover .sp_sub {
        background-position: -484px -98px;
    }
    .stream_view_area .share_area .vk {
        margin-left: 7px;
    }
    .stream_view_area .share_area .vk .sp_sub {
        width: 32px;
        background-position: -521px -64px;
    }
    .stream_view_area .share_area .vk:hover .sp_sub {
        background-position: -521px -98px;
    }
    .stream_view_area .share_area .twitter {
        margin-left: 13px;
    }
    .stream_view_area .share_area .twitter .sp_sub {
        width: 27px;
        background-position: -555px -64px;
    }
    .stream_view_area .share_area .twitter:hover .sp_sub {
        background-position: -555px -98px;
    }
    .stream_view_area .share_area .add_share {
        margin-left: 22px;
    }
    .stream_view_area .share_area .add_share .sp_sub {
        width: 24px;
        height: 32px;
        background-position: -585px -64px;
    }
    .stream_view_area .share_area .add_share:hover .sp_sub {
        background-position: -585px -98px;
    }
    .stream_list_area .share_area {
        margin-top: 5px;
    }
    .stream_list_area .share_area button:first-child {
        margin-left: 0;
    }
    .stream_list_area .share_area .add_share {
        margin-left: 18px;
    }
    .stream_list_area .share_area .facebook,
    .stream_list_area .share_area .twitter,
    .stream_list_area .share_area .reddit,
    .stream_list_area .share_area .vk {
        margin-left: 5px;
    }
    .ly_media .share_area {
        position: absolute;
        right: 148px;
        bottom: -39px;
    }
    .ly_media .share_area button {
        margin-left: 15px;
    }
    .ly_media .share_area .sp_sub {
        height: 23px;
    }
    .ly_media .share_area .google .sp_sub {
        width: 29px;
        background-position: -327px -184px;
    }
    .ly_media .share_area .google:hover .sp_sub {
        background-position: -327px -209px;
    }
    .ly_media .share_area .facebook .sp_sub {
        width: 11px;
        background-position: -358px -184px;
    }
    .ly_media .share_area .facebook:hover .sp_sub {
        background-position: -358px -209px;
    }
    .ly_media .share_area .reddit .sp_sub {
        width: 29px;
        background-position: -371px -184px;
    }
    .ly_media .share_area .reddit:hover .sp_sub {
        background-position: -371px -209px;
    }
    .ly_media .share_area .vk .sp_sub {
        width: 26px;
        background-position: -402px -184px;
    }
    .ly_media .share_area .vk:hover .sp_sub {
        background-position: -402px -209px;
    }
    .ly_media .share_area .twitter .sp_sub {
        width: 22px;
        background-position: -430px -184px;
    }
    .ly_media .share_area .twitter:hover .sp_sub {
        background-position: -430px -209px;
    }
    /* 개발코드 대응 */
    .ly_media .share_area .google,
    .ly_media .share_area .facebook,
    .ly_media .share_area .reddit,
    .ly_media .share_area .vk,
    .ly_media .share_area .twitter {
        margin-left: 15px;
    }
}

.sub_main_title {
    position: relative;
    z-index: 1;
    overflow: hidden;
    height: 260px;
    background-position: 50% 100%;
    background-repeat: no-repeat;
    line-height: 999px;
}
.sub_main_title:before {
    position: absolute;
    top: 145px;
    left: 50%;
    display: inline-block;
    overflow: hidden;
    width: 10px;
    height: 10px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    content: ''; 
    vertical-align: top;
    line-height: 999px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.sub_main_title.news {
    background-image: url(../../images/official/visual_news.png);
}
.sub_main_title.news:before {
    width: 90px;
    height: 29px;
    background-position: -742px -165px;
}
.sub_main_title.partner {
    background-color: #fff; 
    background-image: url(../../images/official/visual_partner.png);
}
.sub_main_title.partner:before {
    width: 155px;
    height: 29px;
    background: url(../../images/official/visual_partner_title.png) no-repeat;
}
.sub_main_title.overview {
    background-image: url(../../images/official/visual_overview.png);
}
.sub_main_title.overview:before {
    width: 157px;
    height: 29px;
    background-position: -834px -165px;
}
.sub_main_title.faq {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.faq:before {
    width: 57px;
    height: 35px;
    background: url(../../images/official/ttl_faq.png) 0 0 no-repeat;
}
.sub_main_title.inquiry {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.inquiry:before {
    width: 174px;
    height: 30px;
    background: url(../../images/official/ttl_inquiry.png) 0 0 no-repeat;
}
.sub_main_title.gameguide {
    height: 258px;
    background-image: url(../../images/official/visual_gameguide.png);
}
.sub_main_title.gameguide:before {
    width: 170px;
    height: 30px;
    background: url(../../images/official/ttl_gameguide.png) 0 0 no-repeat;
}
.sub_main_title.error {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.error:before {
    width: 92px;
    height: 30px;
    background: url(../../images/official/ttl_error.png) 0 0 no-repeat;
}
.sub_main_title.leaderboard {
    height: 285px;
    background-image: url(../../images/official/visual_leaderboard.png);
}
.sub_main_title.leaderboard:before {
    width: 554px;
    height: 70px;
    background: url(../../images/official/visual_leaderboard_title.png) no-repeat;
}
.sub_main_title.conduct {
    height: 258px;
    background-color: #fff; 
    background-image: url(../../images/official/visual_policy.png);
}
.sub_main_title.conduct:before {
    width: 288px;
    height: 29px;
    background-position: -208px -253px;
}
.sub_main_title.eula {
    height: 258px;
    background-color: #fff; 
    background-image: url(../../images/official/visual_policy.png);
}
.sub_main_title.eula:before {
    width: 75px;
    height: 29px;
    background-position: -453px -222px;
}
.sub_main_title.privacy {
    height: 258px;
    background-color: #fff; 
    background-image: url(../../images/official/visual_policy.png);
}
.sub_main_title.privacy:before {
    width: 243px;
    height: 29px;
    background-position: -208px -222px;
}
.sub_main_title.service {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.service:before {
    width: 117px;
    height: 30px;
    background: url(../../images/official/ttl_service.png) 0 0 no-repeat;
}
.sub_main_title.licence {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.licence:before {
    width: 76px;
    height: 30px;
    background: url(../../images/official/ttl_licence.png) 0 0 no-repeat;
}
.sub_main_title.player-created {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.player-created:before {
    width: 396px;
    height: 30px;
    background: url(../../images/official/ttl_player_created.png) 0 0 no-repeat;
}
.sub_main_title.rules-of-conduct {
    height: 257px;
    background-image: url(../../images/official/visual_faq.png);
}
.sub_main_title.rules-of-conduct:before {
    width: 277px;
    height: 30px;
    background: url(../../images/official/ttl_rules_of_conduct.png) 0 0 no-repeat;
}

@media screen and (max-width: 1280px) {
    .sub_main_title {
        height: 231px;
    }
    .sub_main_title:before {
        top: 119px;
    }
    .sub_main_title.leaderboard {
        height: 261px;
    }
    .sub_main_title.conduct,
    .sub_main_title.eula,
    .sub_main_title.privacy {
        height: 231px;
    }
}

.pager {
    margin: 40px 0;
    text-align: center;
}
.pager > li {
    display: inline-block;
    width: 54px;
    height: 54px;
    margin-left: 25px; 
    border: solid 2px #d98501;
}
.pager > li:first-child {
    margin-left: 0;
}
.pager > li.pager-prev,
.pager > li.pager-next {
    width: 126px;
}
.pager > li.pager-prev > a,
.pager > li.pager-prev > span,
.pager > li.pager-next > a,
.pager > li.pager-next > span {
    background-color: #d98501;
}
.pager > li.pager-prev > a > span,
.pager > li.pager-prev > span > span,
.pager > li.pager-next > a > span,
.pager > li.pager-next > span > span {
    display: inline-block;
    overflow: hidden; 
    width: 49px;
    height: 14px;
    line-height: 999px;
}
.pager > li.pager-prev.disabled,
.pager > li.pager-next.disabled {
    cursor: default;
}
.pager > li.pager-prev.disabled:hover > a,
.pager > li.pager-prev.disabled:hover > span,
.pager > li.pager-next.disabled:hover > a,
.pager > li.pager-next.disabled:hover > span {
    background-color: #d98501;
}
.pager > li.pager-prev > a > span,
.pager > li.pager-prev > span > span {
    background: url(../../images/official/sp_sub.png) -48px -34px no-repeat;
}
.pager > li.pager-next > a > span,
.pager > li.pager-next > span > span {
    background: url(../../images/official/sp_sub.png) -99px -34px no-repeat;
}
.pager > li.active > a,
.pager > li.active > span {
    background-color: #d98501;
    cursor: default;
}
.pager > li.active:hover > a,
.pager > li.active:hover > span {
    background-color: #d98501;
}
.pager > li > a,
.pager > li > span {
    display: block;
    background-color: #fff;
    color: #333;
    text-align: center; 
    font-size: 22px;
    line-height: 54px;
}
.pager > li > a:hover,
.pager > li > span:hover {
    background-color: #c16400;
}
.pager.is-small > li {
    width: 40px;
    height: 40px;
    margin-left: 10px;
}
.pager.is-small > li.pager-prev,
.pager.is-small > li.pager-next {
    width: 80px;
}
.pager.is-small > li > a,
.pager.is-small > li > span {
    font-size: 18px;
    line-height: 40px;
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box; 

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0); 

    webkit-transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0; 
    display: block;
}
.slick-track:after {
    display: block;
    clear: both;
    content: '';
}

.slick-current.slick-active {
    z-index: 11 !important;
}

.slick-slide {
    z-index: 10 !important;
    display: none;
    float: left;
    height: 100%;
    outline: none;
}
.slick-slide img {
    display: block;
    width: 100%;
}

.slick-dots {
    position: absolute;
    bottom: -25px;
    z-index: 15;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center; 
    font-size: 0;
}
.slick-dots li {
    position: relative;
    display: inline-block;
    margin-left: 10px;
    padding: 0;
    cursor: pointer;
}
.slick-dots li:first-child {
    margin-left: 0;
}
.slick-dots li button {
    display: block;
    width: 26px;
    height: 10px;
    border: 0;
    background: #fff;
    color: transparent;
    font-size: 0;
    line-height: 0;
    cursor: pointer;
}
.slick-dots li button:before {
    display: none;
}
.slick-dots .slick-active button {
    width: 56px;
    background: #d98500;
}

.slick-prev,
.slick-next {
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    background: transparent;
    color: transparent;
    font-size: 0;
    line-height: 0;
    cursor: pointer;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.slick-prev {
    left: -25px;
}

.slick-next {
    right: -25px;
}

#slideshow {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 100px auto;
}

#slideshow.fullscreen {
    width: 100%;
    margin: 0;
    padding-top: 56.3%;
}

.img-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 8;
    overflow: hidden;
    min-width: 100%;
    min-height: 100%;
    margin: auto;
    background-position: center center; 
    background-size: cover;
}

#slideshow .img-wrapper.active {
    z-index: 10;
}

#slideshow .img-wrapper.last-active {
    z-index: 9;
}

.thumbs-container {
    position: absolute;
    left: 0;
    z-index: 11; 
    max-height: 110px;
    width: 100%;
}

.thumbs-container.top {
    top: 0;
}

.thumbs-container.bottom {
    top: 100%;
}

.gallery .prev,
.gallery .next {
    display: none;
}

ul.thumbs {
    max-height: 110px;
    padding: 0;
    text-align: center; 
    white-space: nowrap;
    font-size: 0;
}

.thumbs-container .thumb {
    position: relative;
    display: inline-block;
    overflow: hidden;
    width: calc(12.5% - 9px);
    margin: 10px 0 0 10px;
    padding-top: 7.8%;
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat;
    cursor: pointer; 
    box-sizing: border-box;
}

.thumb:first-of-type {
    margin-left: 0;
}

.thumb.active:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 2px solid #d98500;
    content: '';
}

.visual_wrap {
    position: relative;
    background: #000;
}
.visual_wrap .inner {
    max-width: 1920px;
    padding: 0;
}

.main_visual_area {
    position: relative;
    padding-top: 56.5%;
    font-size: 0;
}
.main_visual_area .video_wrap {
    position: absolute;
    top: -2px;
    left: 0;
    overflow: hidden;
    max-height: 1075px; 
    width: 100%;
    height: 100%;
}
.main_visual_area .video_wrap:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
}
.main_visual_area .video_wrap #ytplayer,
.main_visual_area .video_wrap iframe {
    width: 100%;
    height: 100%;
}
.main_visual_area .main_visual {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1; 
    width: 100%;
    height: 100%;
}
.main_visual_area .visual_title {
    position: absolute;
    bottom: 33%;
    left: 50%;
    z-index: 2;
    width: 28.1%;
    height: 18%;
    background: url(../../images/official/visual_main_title.png) no-repeat;
    background-size: 100%; 
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.banner_area {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    padding: 0 19px;
}

.banner_lst {
    position: relative;
    max-width: 1700px;
    margin: 0 auto;
    padding: 29px 0 115px; 
    box-sizing: border-box;
}
.banner_lst:before {
    position: absolute;
    top: 0;
    right: 11px;
    left: 11px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    content: '';
}
.banner_lst li {
    float: left;
    width: 33.3%;
    padding: 0 11px; 
    padding-left: 22px;
    box-sizing: border-box;
}
.banner_lst li > a {
    display: block;
}
.banner_lst li:last-child {
    float: none; 
    overflow: hidden;
}
.banner_lst img {
    width: 100%;
}

.slide_banner_area {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2; 
    padding: 29px 0 115px;
}

.slide_banner_lst {
    position: relative;
    overflow: hidden; 
    padding: 0 90px;
}
.slide_banner_lst .slick-arrow {
    position: absolute;
    z-index: 1;
    width: 55px;
    height: 100%;
    outline: none;
    border: none;
    color: transparent;
    font-size: 0;
    line-height: 0;
    cursor: pointer;
}
.slide_banner_lst .slick-arrow.slick-prev {
    left: 30px;
    background: url(../../images/official/prev.png) 0 50% no-repeat;
}
.slide_banner_lst .slick-arrow.slick-prev:hover {
    background: url(../../images/official/prev_over.png) 0 50% no-repeat;
}
.slide_banner_lst .slick-arrow.slick-next {
    right: 30px;
    background: url(../../images/official/next.png) 0 50% no-repeat;
}
.slide_banner_lst .slick-arrow.slick-next:hover {
    background: url(../../images/official/next_over.png) 0 50% no-repeat;
}
@media screen and (max-width: 1280px) {
    .slide_banner_lst .slick-arrow.slick-prev,
    .slide_banner_lst .slick-arrow.slick-next,
    .slide_banner_lst .slick-arrow.slick-prev:hover,
    .slide_banner_lst .slick-arrow.slick-next:hover {
        background-size: contain;
    }
}

.slide_banner_item {
    float: left;
    width: 33.33%;
    padding: 0 24px;
    box-sizing: border-box;
}
.slide_banner_item a {
    display: block;
    background: #fff;
}
.slide_banner_item img {
    width: 100%;
    height: auto;
    vertical-align: top;
}
.slide_banner_item img:hover {
    opacity: 0.8;
    -ms-filter: "alpha(opacity=80)";
}

.section_title {
    display: block;
    overflow: hidden;
    background-size: 100% auto;
    background-repeat: no-repeat;
    line-height: 999px;
}
.section_title > a {
    display: block;
    height: 100%;
}

.lst_view_type .img_wrap {
    position: relative;
    overflow: hidden;
    height: 255px;
    background-position: 50%;
    background-size: cover; 
    background-repeat: no-repeat;
    font-size: 0;
}
.lst_view_type .img_wrap img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    height: 100%; 
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
@media screen and (max-width: 1280px) {
    .lst_view_type .img_wrap img {
        left: 0;
        width: 100%;
        -webkit-transform: none;
        -ms-transform: none; 
        transform: none;
    }
}
@media screen and (max-width: 1280px) {
    .lst_view_type .img_wrap {
        height: auto;
    }
}

.lst_view_type .img_caption {
    min-height: 79px;
    padding: 23px 30px 25px;
    background: #fff;
}
.lst_view_type .img_caption .title {
    display: block;
    overflow: hidden;
    color: #333;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: bold;
    font-size: 20px;
    line-height: 30px;
}
.lst_view_type .img_caption .description {
    overflow: hidden;
    height: 40px;
    margin-top: 9px;
    color: #333;
    font-size: 12px;
    line-height: 20px;
}

.lst_view_type:after {
    display: block;
    clear: both;
    content: '';
}

.lst_view_type li {
    float: left;
    width: 50%; 
    padding-left: 22px;
    box-sizing: border-box;
}
.lst_view_type li > a {
    display: block;
}

.lst_view_type .img_wrap:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-image: url(../../images/official/bg_main_news_cnt01.png);
    background-position: 0 100%;
    background-size: 100% auto;
    background-repeat: no-repeat;
    content: '';
}

.lst_view_type .texture_type2:after {
    background-image: url(../../images/official/bg_main_news_cnt02.png);
}

.lst_view_type .texture_type3:after {
    background-image: url(../../images/official/bg_main_news_cnt03.png);
}

.lst_view_type .texture_type4:after {
    background-image: url(../../images/official/bg_main_news_cnt04.png);
}

.lst_view_type.col-3 li {
    float: left;
    width: 33.3%; 
    padding-left: 22px;
    box-sizing: border-box;
}
.lst_view_type.col-3 li > a {
    display: block;
}
.lst_view_type.col-3 li:last-child {
    float: none; 
    overflow: hidden;
}

.lst {
    position: relative;
    overflow: hidden;
    font-size: 0;
}
.lst .img_caption {
    display: table-cell;
    padding-left: 20px;
    vertical-align: middle;
}
.lst .img_caption .title {
    overflow: hidden;
    max-height: 40px;
    color: #333; 
    font-size: 16px;
    line-height: 20px;
}
.lst .img_caption .descrption {
    overflow: hidden;
    margin-top: 11px;
    color: #333;
    font-size: 12px;
    line-height: 18px;
}
.lst .img_caption .in {
    position: relative;
}
.lst .img_wrap {
    display: table-cell;
    overflow: hidden;
    width: 168px;
    height: 124px;
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    vertical-align: middle;
}
.lst .img_wrap img {
    position: relative;
    left: 50%;
    height: 100%; 
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.lst li:last-child a {
    padding: 24px 22px;
    border-bottom: 0;
}
.lst a {
    position: relative;
    display: table;
    width: 100%;
    padding: 23px 22px 22px 22px;
    border-bottom: 1px solid #e7e7e7;
    background: #fff;
    table-layout: fixed; 
    box-sizing: border-box;
}
.lst a:hover {
    background: #d98500;
}
.lst a:hover .img_caption .title {
    color: #fff;
}
.lst a:hover .img_caption .descrption {
    color: #f9edd5;
}
@media screen and (max-width: 1280px) {
    .lst li:last-child a {
        padding: 23px 22px 22px 22px;
        border-bottom: 0;
    }
}
.lst li .descrption {
    height: 55px;
}
.lst.type2 {
    margin: 0 -11px;
}
.lst.type2 li {
    float: left;
    width: 50%;
    padding: 0 11px;
    box-sizing: border-box;
}
.lst.type2 a {
    border-bottom: 2px solid #fff;
    background: #f7f7f7;
}
.lst.type2 a:hover {
    background: #d98500;
}

.news_wrap {
    position: relative;
    z-index: 2;
    margin-top: -88px;
    padding: 130px 0 60px;
    background: url(../../images/official/main_mask01.png) no-repeat 50% 0;
    background-size: 1920px auto;
}
.news_wrap:after {
    display: block;
    clear: both;
    content: '';
}
.news_wrap .section_title {
    height: 33px;
    margin-bottom: 17px;
}

.patch_note_area {
    float: left;
    width: 66.2%;
}
.patch_note_area a:hover .title {
    color: #d98500;
}
.patch_note_area .section_title {
    width: 233px;
    background-image: url(../../images/official/title/main_title01.png);
}
.patch_note_area .section_title:hover,
.patch_note_area .section_title:active {
    background-image: url(../../images/official/title/main_title01_over.png);
}

.dev_blog_area {
    float: left;
    width: 66.2%;
    margin-top: 38px;
}
.dev_blog_area a:hover .title {
    color: #d98500;
}
.dev_blog_area .section_title {
    width: 189px;
    background-image: url(../../images/official/title/main_title03.png);
}
.dev_blog_area .section_title:hover,
.dev_blog_area .section_title:active {
    background-image: url(../../images/official/title/main_title03_over.png);
}

.announcement_area {
    overflow: hidden;
    padding-left: 22px;
    box-sizing: border-box;
}
.announcement_area .section_title {
    width: 303px;
    background-image: url(../../images/official/title/main_title02.png);
}
.announcement_area .section_title:hover,
.announcement_area .section_title:active {
    background-image: url(../../images/official/title/main_title02_over.png);
}
.announcement_area .lst a:hover {
    background: #d98500 url(../../images/official/bg_main_news_cnt05.png) no-repeat 100% 0;
}

.featured_wrap {
    max-width: 1920px;
    max-height: 956px;
    margin: 0 auto;
    background: url(../../images/official/bg_featured_main.jpg) no-repeat 50%;
    background-size: 100%;
}
.featured_wrap .slick-prev,
.featured_wrap .slick-next {
    display: none !important;
}
.featured_wrap .type1,
.featured_wrap .type2,
.featured_wrap .type3,
.featured_wrap .type4 {
    position: relative;
    max-height: 956px;
}
.featured_wrap .content_area {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 50%;
    padding: 165px 0 130px;
    font-size: 0;
}
.featured_wrap .content_area:after {
    display: inline-block;
    height: 100%;
    content: ''; 
    vertical-align: middle;
}
.featured_wrap .content_area .in {
    position: relative;
    display: inline-block;
    max-width: 836px;
    margin-top: 8px;
    padding-right: 30px;
    vertical-align: middle;
    box-sizing: border-box;
}
.featured_wrap .content_area .btn_more {
    display: inline-block;
    display: block;
    overflow: hidden;
    width: 10px;
    width: 95px;
    height: 10px;
    height: 14px;
    margin: 23px 0 0 25.3%;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    background-position: -127px -117px; 
    vertical-align: top;
    line-height: 999px;
}
.featured_wrap .slider {
    position: relative;
    height: 100%;
}
.featured_wrap .slider .slick-list {
    height: 100%;
}
.featured_wrap .slider .slick-track {
    height: 100%;
}
.featured_wrap .slider .slick-slide {
    font-size: 0;
}
.featured_wrap .slider .slick-slide:after {
    display: inline-block;
    height: 100%;
    content: '';
    vertical-align: middle;
    vertical-align: bottom;
}
.featured_wrap .slider .slick-slide > img {
    display: inline-block;
    max-height: 100%;
    vertical-align: bottom;
}
.featured_wrap .slider .slick-dots {
    top: calc(59.8% + 90px);
    right: 0;
    bottom: auto;
    left: 50%;
    max-width: 836px;
    width: auto;
    padding-right: 30px;
    text-align: left;
    box-sizing: border-box;
}
.featured_wrap .slider .slick-dots li:first-child {
    margin-left: 25.3%;
}

.twitter_wrap {
    padding: 70px 0;
}
.twitter_wrap:after {
    display: block;
    clear: both;
    content: '';
}
.twitter_wrap .inner2 {
    max-width: 1370px;
}
.twitter_wrap section {
    float: left;
    float: left; 
    width: 33.3%;
    padding-left: 22px;
    box-sizing: border-box;
}
.twitter_wrap section > a {
    display: block;
}
.twitter_wrap section:last-child {
    float: none; 
    overflow: hidden;
}
.twitter_wrap section:last-child {
    float: none;
    overflow: hidden;
    width: auto;
}
.twitter_wrap .section_title {
    display: block;
    overflow: hidden;
    height: 56px;
    margin-bottom: 9px;
    background-size: 100% auto; 
    background-repeat: no-repeat;
    line-height: 999px;
}

.widget_area {
    height: 783px;
    background: #fff;
}

.official_area .section_title {
    width: 283px;
    background-image: url(../../images/official/title/sns_title_official.png);
}

.battlegrounds_area .section_title {
    width: 329px;
    background-image: url(../../images/official/title/sns_title_battleroyale.png);
}

.official_partner_area .section_title {
    width: 226px;
    background-image: url(../../images/official/title/sns_title_pubgpartners.png);
}

/*메인에만 적용*/
.main .member_wrap {
    position: relative;
    padding-top: 200px;
    background: #fff url(../../images/official/main_mask02.jpg) no-repeat 50% 0;
}

@media screen and (max-width: 1530px) {
    .banner_lst {
        padding-bottom: 105px;
    }
}

@media screen and (max-width: 1440px) {
    .news_wrap .section_title {
        height: 28px;
    }
    .main_visual_area .visual_title {
        bottom: 38%;
    }
    .patch_note_area .section_title {
        width: 218px;
    }
    .dev_blog_area {
        margin-top: 42px;
    }
    .dev_blog_area .section_title {
        width: 171px;
    }
    .announcement_area .section_title {
        width: 274px;
    }
    .featured_wrap .content_area {
        left: 45%;
        padding: 75px 0 120px;
    }
    .featured_wrap .content_area .in {
        padding-right: 55px;
    }
    .featured_wrap .slider .slick-dots {
        top: calc(55.8% + 90px);
        left: 45%;
    }
    .featured_wrap .slider .slick-dots li:first-child {
        margin-left: 24.5%;
    }
    .banner_lst {
        padding-bottom: 100px;
    }
}

@media screen and (max-width: 1360px) {
    .banner_lst {
        padding-bottom: 95px;
    }
}

@media screen and (max-width: 1280px) {
    .banner_area {
        padding: 0 44px;
    }
    .news_wrap {
        padding: 130px 0 35px;
    }
    .news_wrap .section_title {
        height: 24px;
    }
    .news_wrap .lst_view_type .img_wrap {
        padding-top: 45.6%;
    }
    .patch_note_area {
        float: none;
        width: auto;
    }
    .patch_note_area .section_title {
        width: 183px;
    }
    .dev_blog_area {
        float: none;
        width: auto;
        margin-top: 60px;
    }
    .dev_blog_area .section_title {
        width: 145px;
    }
    .announcement_area {
        margin-top: 60px;
        padding: 0;
    }
    .announcement_area .section_title {
        width: 238px;
    }
    .announcement_area .lst {
        margin: 0 -11px;
    }
    .announcement_area .lst li {
        float: left;
        width: 50%;
        padding: 0 11px;
        box-sizing: border-box;
    }
    .featured_wrap {
        max-height: 693px;
        margin: 35px 0 23px;
        padding: 53px 0 2px;
        background: url(../../images/official/bg_featured_main2.jpg) no-repeat 50%;
        background-size: 100%;
    }
    .featured_wrap .slider .slick-dots {
        top: calc(53.5% + 90px);
    }
    .featured_wrap .slider .slick-dots li:first-child {
        margin-left: 24%;
    }
    .twitter_wrap {
        padding: 35px 0;
    }
    .twitter_wrap .inner2 {
        max-width: 906px;
    }
    .twitter_wrap section {
        float: left;
        width: 50%; 
        padding-left: 22px;
        box-sizing: border-box;
    }
    .twitter_wrap section > a {
        display: block;
    }
    .twitter_wrap .section_title {
        height: 46px;
    }
    .official_area .section_title {
        width: 232px;
    }
    .official_partner_area .section_title {
        width: 186px;
    }
    .battlegrounds_area {
        clear: both;
        max-width: none;
    }
    .battlegrounds_area .btn {
        width: 275px;
        margin: 28px auto 0;
        padding: 16px 0;
    }
    .battlegrounds_area .btn > span {
        display: inline-block;
        overflow: hidden;
        width: 10px;
        width: 190px;
        height: 10px;
        height: 25px;
        background: url(../../images/official/sp.png) no-repeat;
        background: url(../../images/official/sp_sub.png) no-repeat;
        background-position: -736px -103px; 
        vertical-align: top;
        line-height: 999px;
    }
    .battlegrounds_area .widget_area,
    .battlegrounds_area .section_title {
        display: none;
    }
}

@media screen and (max-width: 1200px) {
    .main .member_wrap {
        padding-top: 175px;
    }
    .banner_lst {
        padding-bottom: 90px;
    }
}

#content.page-community {
    background: #0b0b0b url(../../images/official/visual_community_bg.png) no-repeat 50% 0;
    background-size: 100% auto;
}

.page-community .under-construction {
    padding: 280px 0;
    color: #fff;
    text-align: center; 
    font-weight: bold;
    font-size: 18px;
}

.page-community .stream_view_area .share_area .twitter .sp_sub {
    width: 27px;
    height: 21px;
    background: url(../../images/official/ico_twitter_community.png) no-repeat 0 0;
}
.page-community .stream_view_area .share_area .twitter .sp_sub:hover {
    opacity: 0.8;
    -ms-filter: "alpha(opacity=80)";
}

.page-community .stream_view_area .share_area .add_share .sp_sub {
    width: 22px;
    height: 22px;
    background: url(../../images/official/ico_twitch_community.png) no-repeat 0 0;
}
.page-community .stream_view_area .share_area .add_share .sp_sub:hover {
    opacity: 0.8;
    -ms-filter: "alpha(opacity=80)";
}

.page-community .share_area .twitter .sp_sub {
    width: 19px;
    height: 19px;
    background: url(../../images/official/ico_twitter_news.png) 0 3px no-repeat;
}
.page-community .share_area .twitter .sp_sub:hover {
    opacity: 0.8;
    -ms-filter: "alpha(opacity=80)";
}

.stream_area {
    position: relative;
    max-height: 1106px;
    padding: 140px 0 103px;
    box-sizing: border-box;
}
.stream_area .section_title {
    width: 220px;
    height: 49px;
    margin-bottom: 17px;
    background-image: url(../../images/official/title/community_title01.png);
}

.stream_view_area {
    float: left;
    width: 72%;
    margin-right: 22px;
    box-sizing: border-box;
}
.stream_view_area .vedio_area {
    position: relative;
    padding-top: 56.3%;
    border: 1px solid #666;
    box-sizing: border-box;
}
.stream_view_area .vedio_area iframe,
.stream_view_area .vedio_area .bg_default {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.stream_info {
    position: relative;
    margin-top: 19px;
    padding-right: 375px;
}
.stream_info:after {
    display: block;
    clear: both;
    content: '';
}
.stream_info .img_wrap {
    float: left;
    width: 70px;
    height: 70px;
    margin-top: 2px;
}
.stream_info .img_wrap img {
    width: 100%;
    height: 100%;
}
.stream_info .img_caption {
    overflow: hidden;
    padding-left: 20px;
    color: #fff;
    word-break: break-all; 
    font-size: 14px;
}
.stream_info .img_caption .stream_title {
    display: block;
    overflow: hidden;
    max-height: 50px;
    color: #e8a026;
    font-size: 24px;
    line-height: 1em;
}
.stream_info .img_caption .etc_area {
    margin-top: 8px;
}
.stream_info .img_caption .etc_area:after {
    display: block;
    clear: both;
    content: '';
}
.stream_info .img_caption .etc_area p {
    float: left;
    line-height: 16px;
}
.stream_info .img_caption .channel_name {
    font-weight: bold;
}
.stream_info .img_caption .view {
    margin-top: -1px;
}
.stream_info .img_caption .view:before {
    display: inline-block;
    height: 12px;
    margin: 0 12px;
    border-left: 1px solid #828282;
    content: ''; 
    vertical-align: middle;
}
.stream_info .img_caption .view .sp_sub {
    width: 22px;
    height: 14px;
    margin-right: 6px;
    background-position: -664px -259px;
    vertical-align: middle;
}

.stream_list_area {
    position: relative;
    overflow: hidden;
    padding-top: 40.6%;
    background: #fff;
    box-sizing: border-box;
}
.stream_list_area .share_area {
    margin-top: 9px;
}
.stream_list_area .tab_area {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 67px;
    padding: 20px 19px 0;
    box-sizing: border-box;
}
.stream_list_area .tab_area button {
    margin-left: 6px;
    padding: 5px;
}
.stream_list_area .tab_area button:first-child {
    margin-left: 0;
}
.stream_list_area .tab_area .sp_sub {
    height: 14px;
}
.stream_list_area .tab_area .on {
    position: relative;
}
.stream_list_area .tab_area .on:after {
    position: absolute;
    right: 1px;
    bottom: 0;
    left: 1px;
    height: 2px;
    background: #e69800;
    content: '';
}
.stream_list_area .tab_area .partners .sp_sub {
    width: 73px;
    background-position: 0 -264px;
}
.stream_list_area .tab_area .partners.on .sp_sub {
    background-position: -75px -264px;
}
.stream_list_area .tab_area .streamers .sp_sub {
    width: 86px;
    background-position: 0 -280px;
}
.stream_list_area .tab_area .streamers.on .sp_sub {
    background-position: -88px -280px;
}
.stream_list_area .active .img_wrap:before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background: #d98500;
    background: rgba(217, 133, 0, 0.65);
    content: ''; 
    line-height: 999px;
}
.stream_list_area .active .img_wrap:after {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 17px;
    height: 10px;
    height: 19px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    background-position: -723px -163px;
    content: ''; 
    vertical-align: top;
    line-height: 999px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.btn_live_view {
    position: absolute;
    top: 14px;
    right: 25px;
    max-width: 130px;
    height: 38px;
    padding: 11px 10px 0;
    background: #bf0000;
    text-align: center;
    box-sizing: border-box;
}
.btn_live_view .count {
    display: inline-block;
    margin-top: -1px;
    color: #fff;
    vertical-align: middle; 
    font-size: 20px;
    line-height: 20px;
}
.btn_live_view .sp_sub {
    width: 18px;
    height: 18px;
    margin: -1px 5px 0 0;
    background: url(../../images/official/btn_live.png) no-repeat;
    background-size: 100%;
    vertical-align: middle;
}

.stream_list {
    position: absolute;
    top: 67px;
    right: 0;
    bottom: 0;
    left: 0;
}
.stream_list li {
    overflow: hidden;
    padding: 10px 30px 10px 22px;
    border-top: 1px solid #e7e7e7;
}
.stream_list li:first-child {
    padding-top: 2px;
    border-top: 0;
}
.stream_list li:after {
    display: block;
    clear: both;
    content: '';
}
.stream_list .img_wrap {
    position: relative;
    float: left;
    max-width: 132px;
    max-height: 98px;
    width: 32.9%;
    margin-right: 10px;
    padding-top: 24.3%;
}
.stream_list .img_wrap img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.stream_list .img_wrap .label {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 56px;
    height: 27px;
    background-position: -558px -163px;
}
.stream_list .img_caption {
    overflow: hidden;
    padding-top: 1%;
}
.stream_list .img_caption .stream_title {
    overflow: hidden;
    color: #333;
    word-break: break-all; 
    font-size: 16px;
    line-height: 20px;
}
.stream_list .img_caption .stream_title a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.stream_list .img_caption .stream_title a:hover {
    color: #e69800;
}
.stream_list .img_caption p {
    color: #686868; 
    font-size: 12px;
}
.stream_list .img_caption .channel_name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.stream_list .img_caption .view_area {
    margin-top: 6px;
}
.stream_list .img_caption .view_area:after {
    display: block;
    clear: both;
    content: '';
}
.stream_list .img_caption .view_area p {
    float: left;
    margin-left: 11px;
}
.stream_list .img_caption .view_area p:first-child {
    margin-left: 0;
}
.stream_list .img_caption .view_area span {
    line-height: 14px;
}
.stream_list .img_caption .view_area .sp_sub {
    height: 13px;
}
.stream_list .img_caption .view_area .view span {
    color: #bf0000;
}
.stream_list .img_caption .view_area .view .sp_sub {
    width: 12px;
    margin-right: 6px;
    background-position: -524px -177px;
}
.stream_list .img_caption .view_area .view2 .sp_sub {
    width: 18px;
    margin-right: 4px;
    background-position: -538px -177px;
}

.featured_contents_area {
    position: relative;
    margin-top: -33px;
    padding: 100px 0 200px;
    background: #1e1e1e url(../../images/official/bg_featured_community.jpg) no-repeat 50% 0;
    background-size: 100% auto;
}
.featured_contents_area.single {
    padding-bottom: 100px;
}
.featured_contents_area.single .featured_lst {
    padding: 0;
    border: 0;
}
.featured_contents_area .section_title {
    width: 318px;
    height: 29px;
    margin-bottom: 15px;
    background-image: url(../../images/official/title/community_title02.png);
}
.featured_contents_area .slick-arrow {
    top: auto;
    bottom: -88px;
    width: 133px;
    height: 60px;
    background: #d98500;
    -webkit-transform: none;
    -ms-transform: none; 
    transform: none;
}
.featured_contents_area .slick-arrow:after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 66px;
    height: 20px;
    background-size: 100%;
    background-repeat: no-repeat;
    content: ''; 
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.featured_contents_area .slick-arrow:hover {
    background: #c16400;
}
.featured_contents_area .slick-prev {
    margin-left: 27px;
}
.featured_contents_area .slick-prev:after {
    background-image: url(../../images/official/btn_prev.png);
}
.featured_contents_area .slick-next {
    margin-right: 27px;
}
.featured_contents_area .slick-next:after {
    background-image: url(../../images/official/btn_next.png);
}

.featured_lst_wrap {
    position: relative;
}
.featured_lst_wrap:before {
    position: absolute;
    top: -9px;
    left: 17px;
    z-index: 2;
    width: 100%;
    height: 23px;
    margin-left: -10px;
    background: url(../../images/official/mask_community02.png) no-repeat;
    content: '';
}
.featured_lst_wrap .slick-list {
    overflow: visible;
}

.featured_lst {
    position: relative;
    padding-bottom: 10px;
    border-bottom: 1px solid #363636;
}
.featured_lst:after {
    display: block;
    clear: both;
    content: '';
}
.featured_lst.slider > .box {
    display: none;
}
.featured_lst.slider > .box:first-child {
    display: block;
}
.featured_lst.slider > .box:after {
    display: block;
    clear: both;
    content: '';
}
.featured_lst .lstbx {
    float: left;
    width: 50%;
}
.featured_lst .lstbx .in {
    position: relative;
    display: block;
    margin: 0 0 0 10px;
    -webkit-transform: skew(-2deg, 0deg);
    -moz-transform: skew(-2deg, 0deg); 
    -ms-transform: skew(-2deg, 0deg);
    transform: skew(-2deg, 0deg);
}
.featured_lst .lstbx .in:after {
    position: absolute;
    top: 0;
    left: -10px;
    z-index: 2;
    max-height: 602px;
    width: 20px;
    height: 100%;
    background: url(../../images/official/mask_community01.png) no-repeat;
    background-size: 100% auto;
    content: ''; 
    -webkit-transform: skew(0deg, 0deg);
    -moz-transform: skew(0deg, 0deg);
    -ms-transform: skew(0deg, 0deg);
    transform: skew(0deg, 0deg);
}
.featured_lst .lstbx .in:before {
    position: absolute;
    right: -5px;
    bottom: -5px;
    left: -5px;
    z-index: 2;
    max-width: 1686px;
    height: 20px;
    background: url(../../images/official/mask_community03.png) no-repeat;
    content: '';
}
.featured_lst .lstbx:first-child .in:after {
    right: -10px;
    left: auto;
}
.featured_lst .lstbx:nth-child(2n) .in {
    margin: 0 10px 0 0;
}
.featured_lst .lstbx:hover .img_caption .label {
    background: #c16400;
}
.featured_lst .lstbx:hover .img_caption .title {
    color: #d98500;
}
.featured_lst .lstbx:hover .img_wrap .label {
    background: #c16400;
}
.featured_lst .img_caption {
    position: relative;
    z-index: 1;
    display: block;
    padding: 22px 70px 22px 0;
    word-break: break-word;
}
.featured_lst .img_caption .title {
    color: #fff;
    font-size: 20px;
    line-height: 26px;
}
.featured_lst .img_caption .description {
    margin-top: 6px;
    color: #fff;
    font-size: 14px;
    line-height: 18px;
}
.featured_lst .img_wrap {
    position: relative;
    z-index: 1;
    display: block;
    overflow: hidden;
    padding-top: 68%;
    background-position: 50% 0;
    background-size: cover;
    font-size: 0;
}
.featured_lst .img_wrap .label {
    position: absolute;
    top: 50%;
    left: 50%;
    overflow: hidden;
    width: 87px;
    height: 87px;
    background: #d98500; 
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.featured_lst .img_wrap .label img {
    width: 100%;
    height: auto;
}

.trending_videos_area {
    position: relative;
    margin-top: -52px;
    padding: 100px 0 85px;
    background: url(../../images/official/community_mask01.jpg) no-repeat 50% 0;
}
.trending_videos_area .section_title {
    width: 263px;
    height: 29px;
    margin-bottom: 20px;
    background-image: url(../../images/official/title/community_title03.png);
}
.trending_videos_area .btn2 {
    min-width: 0;
    max-width: 413px;
    width: calc(25% - 12px);
    margin-top: 12px;
    padding-right: 0;
    padding-left: 0;
}
.trending_videos_area .btn2 .sp_sub {
    width: 185px;
    height: 21px;
    background-position: -558px -140px;
    vertical-align: middle;
}
.trending_videos_area .btn2 .count {
    display: inline-block;
    margin: -2px 0 0 7px;
    color: #fff;
    vertical-align: middle; 
    font-size: 21px;
    line-height: 24px;
}

.video_list {
    margin: 0 -8px;
}
.video_list:after {
    display: block;
    clear: both;
    content: '';
}
.video_list .title {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.video_list li {
    float: left;
    width: 25%;
    padding: 8px;
    box-sizing: border-box;
}
.video_list .in {
    position: relative;
    display: block;
    overflow: hidden;
    max-height: 324px;
    padding-top: 56.2%;
    font-size: 0;
}
.video_list .in .title {
    line-height: 999px;
}
.video_list .in:hover .title {
    z-index: 1;
    padding: 5px;
    border: 2px solid #d98500;
    background: rgba(189, 116, 0, 0.7);
    text-align: center;
    font-size: 0;
    line-height: normal;
    box-sizing: border-box;
}
.video_list .in:hover .title > span {
    display: inline-block;
    color: #fff;
    vertical-align: middle; 
    font-size: 28px;
    line-height: 30px;
}
.video_list .in:hover .title:after {
    display: inline-block;
    height: 100%;
    content: ''; 
    vertical-align: middle;
}
.video_list img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 100%;
    max-height: 100%; 
    width: auto;
    height: auto;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

@media screen and (max-width: 1440px) {
    .featured_lst .img_caption {
        padding: 16px 60px 16px 0;
    }
    .featured_lst .img_caption .title {
        font-size: 16px;
        line-height: 22px;
    }
    .featured_lst .img_caption .description {
        margin-top: 4px;
        font-size: 12px;
        line-height: 16px;
    }
    .featured_lst .img_wrap .label {
        width: 70px;
        height: 70px;
    }
    .featured_contents_area {
        padding: 80px 0 175px;
    }
    .featured_contents_area .slick-arrow {
        bottom: -83px;
        width: 115px;
        height: 55px;
    }
    .featured_contents_area .slick-arrow:after {
        width: 60px;
        height: 18px;
    }
    .trending_videos_area .btn2 .sp_sub {
        width: 172px;
        height: 18px;
        background-position: 0 -56px;
    }
    .trending_videos_area .btn2 .count {
        margin: -1px 0 0 7px;
        line-height: 23px;
    }
    .video_list .in:hover .title > span {
        font-size: 24px;
        line-height: 28px;
    }
    .stream_area .section_title {
        width: 197px;
        height: 45px;
    }
    .featured_contents_area .section_title {
        width: 287px;
        height: 26px;
    }
    .trending_videos_area .section_title {
        width: 238px;
        height: 26px;
    }
    .stream_info {
        padding-right: 310px;
    }
    .stream_info .img_caption .stream_title {
        max-height: 42px;
        font-size: 18px;
        line-height: 1.2em;
    }
    .stream_info .img_caption .viewer {
        margin-top: 2px;
    }
    .stream_list_area .share_area {
        margin-top: 5px;
    }
    .btn_live_view {
        position: absolute;
        top: 13px;
        right: 20px;
        max-width: 84px;
        height: 35px;
        padding: 10px 7px 0;
    }
    .btn_live_view .count {
        font-size: 16px;
        line-height: 18px;
    }
    .btn_live_view .sp_sub {
        width: 16px;
        height: 16px;
    }
    .stream_list {
        top: 67px;
    }
    .stream_list li {
        padding: 10px 28px 10px 20px;
    }
    .stream_list li:first-child {
        padding-top: 1px;
    }
    .stream_list .img_wrap {
        margin-right: 11px;
    }
    .stream_list .img_wrap .label {
        width: 41px;
        height: 24px;
        background-position: -616px -163px;
    }
    .stream_list .img_caption {
        padding: 0;
    }
    .stream_list .img_caption .stream_title {
        font-size: 14px;
        line-height: 16px;
    }
    .stream_list .img_caption .channel_name {
        margin-top: 5px;
    }
}

@media screen and (max-width: 1280px) {
    .stream_view_area {
        width: 66%;
    }
    .stream_area {
        padding: 100px 0 80px;
    }
    .featured_lst .img_caption {
        padding: 12px 50px 12px 0;
    }
    .featured_lst .img_caption .title {
        font-size: 14px;
        line-height: 18px;
    }
    .featured_lst .img_wrap .label {
        width: 60px;
        height: 60px;
    }
    .featured_contents_area .slick-arrow {
        bottom: -78px;
        width: 98px;
        height: 50px;
    }
    .featured_contents_area .slick-arrow:after {
        width: 54px;
        height: 16px;
    }
    .trending_videos_area {
        padding: 90px 0 75px;
    }
    .trending_videos_area .btn2 {
        width: calc(33.3% - 12px);
    }
    .trending_videos_area .btn2 .sp_sub {
        width: 158px;
        height: 17px;
        background-position: -228px -115px;
    }
    .trending_videos_area .btn2 .count {
        margin: -1px 0 0 7px;
        font-size: 19px;
        line-height: 21px;
    }
    .video_list li {
        width: 33.3%;
    }
    .video_list .in:hover .title > span {
        font-size: 20px;
        line-height: 24px;
    }
    .stream_area .section_title {
        width: 176px;
        height: 41px;
    }
    .featured_contents_area .section_title {
        width: 257px;
        height: 24px;
    }
    .trending_videos_area .section_title {
        width: 213px;
        height: 24px;
    }
    .stream_info {
        padding-right: 280px;
    }
    .stream_info .img_caption .stream_title {
        max-height: 32px;
        font-size: 14px;
    }
    .stream_info .img_caption .etc_area p {
        float: none;
        font-size: 12px;
    }
    .stream_info .img_caption .view {
        margin-top: 2px;
    }
    .stream_info .img_caption .view:before {
        display: none;
    }
    .stream_info .img_caption .view .sp_sub {
        width: 18px;
        height: 12px;
        margin-top: -1px;
        background-position: -665px -245px;
    }
    .stream_list_area {
        padding-top: 37.3%;
    }
    .stream_list_area .tab_area {
        height: 62px;
        padding: 21px 18px 0;
    }
    .stream_list_area .tab_area button {
        margin-left: 3px;
        padding: 5px;
    }
    .stream_list_area .tab_area .sp_sub {
        height: 13px;
    }
    .stream_list_area .tab_area .on:after {
        position: absolute;
        right: 3px;
        bottom: 1px;
        left: 3px;
        height: 2px;
        content: '';
    }
    .stream_list_area .tab_area .partners .sp_sub {
        width: 67px;
        background-position: 0 -296px;
    }
    .stream_list_area .tab_area .partners.on .sp_sub {
        background-position: -69px -296px;
    }
    .stream_list_area .tab_area .streamers .sp_sub {
        width: 77px;
        background-position: 0 -311px;
    }
    .stream_list_area .tab_area .streamers.on .sp_sub {
        background-position: -79px -311px;
    }
    .btn_live_view {
        top: 15px;
        right: 18px;
        max-width: 80px;
        height: 30px;
        padding: 8px 7px 0;
    }
    .btn_live_view .count {
        font-size: 14px;
        line-height: 14px;
    }
    .btn_live_view .sp_sub {
        width: 15px;
        height: 15px;
    }
    .stream_list {
        top: 62px;
    }
    .stream_list li {
        padding: 16px 26px 16px 18px;
    }
}

.tab {
    margin-left: -20px;
}
.tab:after {
    display: block;
    clear: both;
    content: '';
}
.tab li {
    position: relative;
    float: left;
    padding: 0 10px;
}
.tab li:before {
    position: absolute;
    top: 50%;
    left: -1px;
    width: 1px;
    height: 24px;
    margin-top: -12px;
    background: #d8d8d8;
    content: '';
}
.tab li:first-child:before {
    display: none;
}
.tab button {
    position: relative;
    padding: 8px 10px;
    cursor: default;
}
.tab button:focus {
    outline: none;
}
.tab .tab_link {
    position: relative;
    display: block;
    padding: 8px 10px;
}
.tab .tab_link:focus {
    outline: none;
}
.tab .sp_sub {
    height: 18px;
}
.tab .all .sp_sub {
    width: 35px;
    background-position: 0 -182px;
}
.tab .video .sp_sub {
    width: 64px;
    background-position: -436px -284px;
}
.tab .image .sp_sub {
    width: 82px;
    background-position: -352px -284px;
}
.tab .patch_note .sp_sub {
    width: 123px;
    background-position: -91px -182px;
}
.tab .dev_blog .sp_sub {
    width: 88px;
    background-position: -216px -182px;
}
.tab .announcement .sp_sub {
    width: 165px;
    background-position: -306px -182px;
}
.tab .all.active .sp_sub {
    background-position: 0 -202px;
}
.tab .video.active .sp_sub {
    background-position: -436px -304px;
}
.tab .image.active .sp_sub {
    background-position: -352px -304px;
}
.tab .patch_note.active .sp_sub {
    background-position: -91px -202px;
}
.tab .dev_blog.active .sp_sub {
    background-position: -216px -202px;
}
.tab .announcement.active .sp_sub {
    background-position: -306px -202px;
}
.tab .active:after {
    position: absolute;
    right: 10px;
    bottom: 0;
    left: 10px;
    height: 2px;
    background: #d98500;
    content: '';
}

.play_video:before {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 132px;
    height: 132px;
    background: #d98500;
    content: ''; 
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.play_video:hover:before {
    background: #c16400;
}

.play_video:after {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 43px;
    height: 10px;
    height: 49px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    background-position: -662px -275px;
    content: ''; 
    vertical-align: top;
    line-height: 999px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.featured_media_area {
    overflow: hidden;
    max-height: 1111px;
    padding: 160px 0 78px;
    background: url(../../images/official/visual_media.jpg) no-repeat 50% 100%;
    background-size: 1920px auto;
}
.featured_media_area .title_area {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px 0 17px;
}
.featured_media_area .title_area .sp_sub {
    width: 111px;
    height: 13px;
    margin-bottom: 5px;
    background-position: -58px -19px;
}
.featured_media_area .title_area .title {
    color: #fff;
    font-weight: bold;
    font-size: 20px;
    line-height: 25px;
}
.featured_media_area .content_area {
    position: relative;
    padding-top: 56.2%;
}
.featured_media_area .content_area a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.featured_media_area .content_area a img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 100%;
    max-height: 100%; 
    width: auto;
    height: auto;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.featured_media_area .slider_area {
    position: relative;
    overflow: hidden;
    width: 69.4%;
    margin: 0 auto;
    padding: 39% 165px 104px;
}
.featured_media_area .slider {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    overflow: hidden;
    max-width: 1649px;
    max-height: 821px;
    padding: 0 165px;
}
.featured_media_area .slider .in {
    position: relative;
    margin-bottom: 24px;
    padding-bottom: 80px;
}
.featured_media_area .slick-slider {
    max-height: 845px;
    margin-bottom: 0;
}
.featured_media_area .slick-dots {
    position: absolute;
    bottom: 0; 
    left: 0;
}
.featured_media_area .slick-prev,
.featured_media_area .slick-next {
    width: 55px;
    height: 91px;
    margin-top: -54px;
    background-size: 100%; 
    background-repeat: no-repeat;
}
.featured_media_area .slick-prev {
    left: 30px;
    background-image: url(../../images/official/prev.png);
}
.featured_media_area .slick-prev:hover {
    background-image: url(../../images/official/prev_over.png);
}
.featured_media_area .slick-next {
    right: 30px;
    background-image: url(../../images/official/next.png);
}
.featured_media_area .slick-next:hover {
    background-image: url(../../images/official/next_over.png);
}

.media_list_area {
    padding: 70px 0 65px;
}
.media_list_area .video_list {
    margin-top: 24px;
}
.media_list_area .play_video:before {
    width: 70px;
    height: 70px;
    content: '';
}
.media_list_area .play_video:after {
    width: 24px;
    height: 27px;
    background-position: -610px -192px;
    content: '';
}

@media screen and (max-width: 1440px) {
    .featured_media_area {
        padding-top: 150px;
    }
    .featured_media_area .play_video:before {
        width: 110px;
        height: 110px;
    }
    .featured_media_area .play_video:after {
        width: 36px;
        height: 41px;
        background-position: -624px -283px;
    }
    .featured_media_area .slider_area {
        padding: 39% 155px 104px;
    }
    .featured_media_area .slider {
        padding: 0 155px;
    }
    .featured_media_area .slick-prev,
    .featured_media_area .slick-next {
        width: 46px;
        height: 76px;
    }
    .media_list_area .play_video:before {
        width: 60px;
        height: 60px;
    }
    .media_list_area .play_video:after {
        width: 20px;
        height: 23px;
        background-position: -610px -237px;
        content: '';
    }
}

@media screen and (max-width: 1280px) {
    .featured_media_area {
        padding-top: 125px;
    }
    .featured_media_area .title_area .title {
        font-size: 18px;
    }
    .featured_media_area .play_video:before {
        width: 94px;
        height: 94px;
    }
    .featured_media_area .play_video:after {
        width: 31px;
        height: 35px;
        background-position: -591px -289px;
    }
    .featured_media_area .slick-prev,
    .featured_media_area .slick-next {
        width: 40px;
        height: 66px;
    }
    .featured_media_area .slick-prev {
        left: 55px;
    }
    .featured_media_area .slick-next {
        right: 55px;
    }
    .media_list_area .play_video:before {
        width: 50px;
        height: 50px;
    }
    .media_list_area .play_video:after {
        width: 17px;
        height: 19px;
        background-position: -723px -163px;
        content: '';
    }
}

.main_news_area {
    padding: 50px 0 80px;
}
.main_news_area .lst_view_type .title {
    color: #000; 
    font-size: 24px;
}
.main_news_area .lst_view_type .img_caption {
    min-height: 64px;
    padding: 22px 30px;
    font-size: 0;
}
.main_news_area .lst_view_type .label {
    display: inline-block;
    margin-bottom: 6px;
    padding: 5px;
    background: #d98500;
    font-size: 0;
}
.main_news_area .lst_view_type .sp_sub {
    height: 14px;
}
.main_news_area .lst_view_type .patch_note .sp_sub {
    width: 91px;
    background-position: -300px 0;
}
.main_news_area .lst_view_type .announcement .sp_sub {
    width: 121px;
    background-position: -300px -16px;
}
.main_news_area .lst_view_type .dev_blog .sp_sub {
    width: 68px;
    background-position: -300px -32px;
}

.main_news {
    display: table;
    width: 100%;
    margin-bottom: 18px;
}
.main_news > a {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.main_news .img_wrap {
    position: relative;
    display: table-cell;
    overflow: hidden;
    width: 66.2%;
    vertical-align: top; 
    font-size: 0;
}
.main_news .img_wrap img {
    width: 100%;
}
.main_news .img_caption {
    display: table-cell;
    padding: 62px 60px;
    background: #fff;
    vertical-align: top;
}
.main_news .img_caption .label {
    display: inline-block;
    padding: 17px 20px 16px;
    background: #d98500;
    font-size: 0;
}
.main_news .img_caption .label .sp_sub {
    height: 22px;
}
.main_news .img_caption .label .patch_note {
    width: 153px;
    background-position: -707px -196px;
}
.main_news .img_caption .label .announcement {
    width: 190px;
    background-position: -707px -255px;
}
.main_news .img_caption .label .dev_blog {
    width: 108px;
    background-position: -707px -279px;
}
.main_news .img_caption .title {
    max-height: 108px;
    margin-top: 28px;
    color: #000;
    font-size: 36px;
    line-height: 36px;
}
.main_news .img_caption .descrption {
    max-height: 72px;
    margin-top: 27px;
    color: #000;
    font-size: 16px;
    line-height: 24px;
}

.sub_news .lst_view_type .img_wrap {
    height: auto;
    padding-top: 46.3%;
}

.news_list_area {
    padding: 70px 0 30px;
    background: #fff;
}
.news_list_area .btn2 {
    width: 412px;
    margin-top: 20px;
}
.news_list_area .btn2 .sp_sub {
    width: 129px;
    height: 20px;
    margin: 0 auto;
    background-position: 0 -76px;
}
.news_list_area .lst {
    margin-top: 32px;
}
.news_list_area .lst .img_caption {
    padding-left: 20px;
}
.news_list_area .lst .img_caption .title {
    font-size: 20px;
}
.news_list_area .lst .img_caption .descrption {
    height: 36px;
    margin-top: 13px;
    font-size: 14px;
}
.news_list_area .lst .img_caption .date {
    position: absolute;
    top: 0;
    right: 0;
    color: #666; 
    font-weight: bold;
    font-size: 12px;
}
.news_list_area .lst .sp_sub {
    height: 13px;
    margin-bottom: 7px;
}
.news_list_area .lst .patch_note {
    width: 78px;
    background-position: -530px -192px;
}
.news_list_area .lst .dev_blog {
    width: 58px;
    background-position: -530px -207px;
}
.news_list_area .lst .announcement {
    width: 102px;
    background-position: -530px -222px;
}
.news_list_area .lst a:hover .date {
    color: #fff;
}
.news_list_area .lst a:hover .patch_note {
    background-position: -530px -237px;
}
.news_list_area .lst a:hover .dev_blog {
    background-position: -530px -252px;
}
.news_list_area .lst a:hover .announcement {
    background-position: -530px -267px;
}

.main_news_area.detail {
    margin-top: -20px;
    padding-top: 0;
}
.main_news_area.detail .video {
    position: relative;
    padding-top: 56.6%;
}
.main_news_area.detail iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.detail .main_news {
    margin-bottom: 80px;
    padding: 62px 0 100px;
    background: #fff;
}
.detail .main_news .news_tag {
    display: inline-block;
    vertical-align: bottom;
}
.detail .main_news .news_tag li {
    display: inline-block;
    margin-left: 18px;
}
.detail .main_news .news_tag li:before {
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-right: 3px;
    background: url(../../images/official/ico_tag_title.png) 0 0 no-repeat; 
    content: "";
    vertical-align: text-top;
}
.detail .main_news .news_tag li a {
    color: #d98500;
}
.detail .main_news .inner2 {
    max-width: 1280px;
}
.detail .main_news .img_wrap {
    display: block;
    width: auto;
}
.detail .main_news .img_caption {
    display: block;
    margin-bottom: 25px;
    padding: 0;
}
.detail .main_news .img_caption .title {
    max-height: 81px;
    margin-top: 18px;
    line-height: 40px;
}
.detail .main_news .img_caption .box {
    margin-top: 15px;
    font-size: 0;
}
.detail .main_news .img_caption .date {
    display: inline-block;
    color: #000;
    vertical-align: middle; 
    font-size: 16px;
}
.detail .main_news .img_caption .share_area {
    display: inline-block;
    margin-left: 11px;
    padding-left: 15px;
    vertical-align: middle;
}
.detail .main_news .img_caption .share_area:before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 16px;
    margin-top: -8px;
    background: #d6d6d6;
    content: '';
}
.detail .main_news .img_caption .share_area .twitter {
    margin-left: 0;
}
.detail .main_news .img_caption .share_area .twitter .sp_sub {
    width: 19px;
    height: 15px;
    background: url(../../images/official/ico_twitter_news.png) 0 0 no-repeat;
}
.detail .main_news .img_caption .share_area .twitter .sp_sub:hover {
    opacity: 0.8;
    -ms-filter: "alpha(opacity=80)";
}
.detail .main_news .img_caption .label {
    padding: 11px 13px 12px;
}
.detail .main_news .img_caption .label:hover {
    background: #c16400;
}
.detail .main_news .img_caption .label .sp_sub {
    height: 17px;
}
.detail .main_news .img_caption .label .patch_note {
    width: 114px;
    background-position: -707px -220px;
}
.detail .main_news .img_caption .label .announcement {
    width: 152px;
    background-position: -707px -303px;
}
.detail .main_news .img_caption .label .dev_blog {
    width: 87px;
    background-position: -823px -220px;
}
.detail .main_news .etc_area {
    margin-top: 80px;
    padding-bottom: 28px;
    border-bottom: 1px solid #e5e5e5;
}
.detail .main_news .etc_area:after {
    display: block;
    clear: both;
    content: '';
}
.detail .main_news .etc_area .share_area {
    float: right;
}

.edit_area {
    padding: 47px 46px 0;
}
.edit_area p {
    color: #000;
    font-size: 18px;
    line-height: 28px;
}

.pagenation_area {
    margin-top: 37px;
}
.pagenation_area:after {
    display: block;
    clear: both;
    content: '';
}
.pagenation_area button {
    width: 88px;
    height: 60px;
    background: #d98500;
}
.pagenation_area button:hover {
    background: #c16400;
}
.pagenation_area button .sp_sub {
    width: 49px;
    height: 14px;
}
.pagenation_area .descrption {
    overflow: hidden;
    padding: 11px 15px;
    font-weight: bold;
    font-size: 15px;
    line-height: 20px;
}
.pagenation_area .label {
    color: #d98500;
}
.pagenation_area .title {
    color: #999;
}
.pagenation_area .prev_area {
    float: left;
}
.pagenation_area .prev_area .prev {
    float: left;
}
.pagenation_area .prev_area .sp_sub {
    background-position: -48px -34px;
}
.pagenation_area .next_area {
    float: right;
}
.pagenation_area .next_area .next {
    float: right;
}
.pagenation_area .next_area .sp_sub {
    background-position: -99px -34px;
}
.pagenation_area .next_area .descrption {
    text-align: right;
}

@media screen and (max-width: 1440px) {
    .main_news_area .lst_view_type .title {
        font-size: 20px;
    }
    .main_news_area .lst_view_type .img_caption {
        padding: 24px 25px 16px;
    }
    .main_news .img_caption {
        padding: 50px 48px;
    }
    .main_news .img_caption .label {
        padding: 11px 13px 12px;
    }
    .main_news .img_caption .label .sp_sub {
        height: 17px;
    }
    .main_news .img_caption .label .patch_note {
        width: 114px;
        background-position: -707px -220px;
    }
    .main_news .img_caption .label .announcement {
        width: 152px;
        background-position: -707px -303px;
    }
    .main_news .img_caption .label .dev_blog {
        width: 87px;
        background-position: -823px -220px;
    }
    .main_news .img_caption .title {
        max-height: 96px;
        margin-top: 14px;
        font-size: 30px;
        line-height: 32px;
    }
    .main_news .img_caption .descrption {
        max-height: 57px;
        margin-top: 14px;
        font-size: 14px;
        line-height: 19px;
    }
    .news_list_area .btn2 {
        width: 360px;
    }
    .news_list_area .btn2 .sp_sub {
        width: 120px;
        height: 18px;
        background-position: 0 -98px;
    }
    .news_list_area .lst .img_caption .title {
        font-size: 18px;
    }
    .news_list_area .lst .img_caption .descrption {
        font-size: 14px;
    }
    .detail .main_news .img_caption .title {
        max-height: 68px;
        line-height: 34px;
    }
    .share_area.type2 .twitter .sp_sub {
        width: 30px;
        height: 24px;
        background: url(../../images/official/ico_twitter_news_large.png) 0 0 no-repeat;
    }
    .share_area.type2 .twitter .sp_sub:hover {
        background: url(../../images/official/ico_twitter_news_large.png) 0 0 no-repeat;
        opacity: 0.8;
        -ms-filter: "alpha(opacity=80)";
    }
}

@media screen and (max-width: 1280px) {
    .main_news_area .lst_view_type .title {
        font-size: 16px;
    }
    .main_news_area .lst_view_type .img_caption {
        min-height: 62px;
        padding: 17px 20px 12px;
    }
    .main_news_area .lst_view_type .sp_sub {
        height: 12px;
    }
    .main_news_area .lst_view_type .patch_note .sp_sub {
        width: 79px;
        background-position: -393px 0;
    }
    .main_news_area .lst_view_type .announcement .sp_sub {
        width: 102px;
        background-position: -196px -19px;
    }
    .main_news_area .lst_view_type .dev_blog .sp_sub {
        width: 59px;
        background-position: -370px -32px;
    }
    .main_news .img_caption {
        padding: 42px 41px;
    }
    .main_news .img_caption .label {
        padding: 10px 11px;
    }
    .main_news .img_caption .label .sp_sub {
        height: 14px;
    }
    .main_news .img_caption .label .patch_note {
        width: 95px;
        background-position: -707px -239px;
    }
    .main_news .img_caption .label .announcement {
        width: 127px;
        background-position: -804px -239px;
    }
    .main_news .img_caption .label .dev_blog {
        width: 72px;
        background-position: -817px -279px;
    }
    .main_news .img_caption .title {
        max-height: 78px;
        margin-top: 14px;
        font-size: 24px;
        line-height: 26px;
    }
    .main_news .img_caption .descrption {
        max-height: 54px;
        margin-top: 14px;
        font-size: 12px;
        line-height: 18px;
    }
    .news_list_area .btn2 {
        width: 310px;
    }
    .news_list_area .btn2 .sp_sub {
        width: 110px;
        height: 17px;
        background-position: 0 -118px;
    }
    .news_list_area .lst .img_caption .title {
        font-size: 16px;
    }
    .news_list_area .lst .img_caption .descrption {
        font-size: 12px;
    }
    .main_news_area.detail {
        padding-bottom: 48px;
    }
    .detail .main_news {
        margin-bottom: 48px;
        padding-bottom: 60px;
    }
    .detail .main_news .img_caption .title {
        max-height: 56px;
        line-height: 28px;
    }
    .detail .main_news .img_caption .date {
        font-size: 15px;
    }
    .detail .main_news .img_caption .label {
        padding: 10px 11px;
    }
    .detail .main_news .img_caption .label .sp_sub {
        height: 14px;
    }
    .detail .main_news .img_caption .label .patch_note {
        width: 95px;
        background-position: -707px -239px;
    }
    .detail .main_news .img_caption .label .announcement {
        width: 127px;
        background-position: -804px -239px;
    }
    .detail .main_news .img_caption .label .dev_blog {
        width: 72px;
        background-position: -817px -279px;
    }
    .detail .main_news .news_tag {
        display: block;
        margin-top: 10px;
    }
    .detail .main_news .news_tag li:first-child {
        margin-left: 0;
    }
    .edit_area p {
        font-size: 16px;
        line-height: 25px;
    }
    .share_area.type2 .twitter .sp_sub {
        width: 30px;
        height: 24px;
        background: url(../../images/official/ico_twitter_news_large.png) 0 0 no-repeat;
    }
    .share_area.type2 .twitter .sp_sub:hover {
        background: url(../../images/official/ico_twitter_news_large.png) 0 0 no-repeat;
        opacity: 0.8;
        -ms-filter: "alpha(opacity=80)";
    }
}

#content.page-partners {
    background-color: #fff;
}

.bg_img {
    width: 100%;
}

.quick_menu {
    position: absolute;
    top: 500px;
    right: 5px;
    z-index: 10;
    padding: 62px 2px 2px;
    background: #000;
}
.quick_menu .quick_list {
    padding: 13px 0 9px;
    background: url(../../images/official/bg_quick_menu.jpg) no-repeat;
    background-size: cover;
}
.quick_menu .quick_list a {
    display: block;
    padding: 12px 11px 11px 16px;
}
.quick_menu .quick_list .sp_sub {
    height: 17px;
}
.quick_menu .quick_list .btn_top {
    position: absolute;
    top: 2px;
    left: 2px;
    padding: 0;
}
.quick_menu .quick_list .btn_top .sp_sub {
    display: block;
    width: 157px;
    height: 60px;
    background-position: -418px -76px;
}
.quick_menu .quick_list .btn_top:hover .sp_sub,
.quick_menu .quick_list .btn_top:active .sp_sub,
.quick_menu .quick_list .btn_top.active .sp_sub {
    background-position: -577px -76px;
}
.quick_menu .quick_list .requirements .sp_sub {
    width: 130px;
    background-position: -512px 0;
}
.quick_menu .quick_list .requirements.active .sp_sub,
.quick_menu .quick_list .requirements.active:hover .sp_sub,
.quick_menu .quick_list .requirements.active:active .sp_sub {
    background-position: -512px -19px;
}
.quick_menu .quick_list .requirements:hover .sp_sub,
.quick_menu .quick_list .requirements:active .sp_sub {
    background-position: -512px -38px;
}
.quick_menu .quick_list .benefits .sp_sub {
    width: 90px;
    background-position: -644px 0;
}
.quick_menu .quick_list .benefits.active .sp_sub,
.quick_menu .quick_list .benefits.active:hover .sp_sub,
.quick_menu .quick_list .benefits.active:active .sp_sub {
    background-position: -644px -19px;
}
.quick_menu .quick_list .benefits:hover .sp_sub,
.quick_menu .quick_list .benefits:active .sp_sub {
    background-position: -644px -38px;
}
.quick_menu .quick_list .apply .sp_sub {
    width: 70px;
    background-position: -736px 0;
}
.quick_menu .quick_list .apply.active .sp_sub,
.quick_menu .quick_list .apply.active:hover .sp_sub,
.quick_menu .quick_list .apply.active:active .sp_sub {
    background-position: -736px -19px;
}
.quick_menu .quick_list .apply:hover .sp_sub,
.quick_menu .quick_list .apply:active .sp_sub {
    background-position: -736px -38px;
}

.requirements_area .section_title,
.benefit_area .section_title,
.application_area .section_title,
.contact_area .section_title {
    height: 29px;
}

.requirements_area {
    padding: 77px 0 80px;
    background: #fff;
}
.requirements_area .section_title {
    width: 218px;
    height: 34px;
    margin-bottom: 43px;
    background-image: url(../../images/official/title/partner_title02.png);
}

.requirements_content {
    position: relative;
}
.requirements_content:after {
    position: absolute;
    top: 0;
    left: 50%;
    background-size: 100%;
    background-repeat: no-repeat;
    content: '';
}
.requirements_content .requirements_title {
    margin: 0 auto;
}
.requirements_content .requirements_title img {
    width: 100%;
}
.requirements_content .sub_text {
    margin-top: 10px;
    padding-left: 85px;
    color: #999; 
    font-size: 14px;
}
.requirements_content.creator .requirements_title {
    max-width: 1104px;
}
.requirements_content.creator:after {
    top: 72px;
    width: 165px;
    height: 572px;
    margin-left: 500px;
    background-image: url(../../images/official/bg_requirements_creator.png);
}

.requirements_list {
    display: table;
    max-width: 860px;
    width: 100%;
    margin: 52px auto 0;
    table-layout: fixed;
}
.requirements_list li {
    display: table-cell;
    text-align: center;
}
.requirements_list li p {
    margin-top: 20px;
    color: #666;
    font-size: 14px;
    line-height: 20px;
}
.requirements_list li em {
    color: #d98500;
}

.basic_info {
    max-width: 1103px;
    margin: 70px auto 0;
    padding: 35px;
    background: #f8f8f8;
    box-sizing: border-box;
}
.basic_info .info_title {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 298px;
    height: 10px;
    height: 17px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    background-position: 0 0; 
    vertical-align: top;
    line-height: 999px;
}
.basic_info .info_list {
    margin-top: 18px;
}
.basic_info .info_list li {
    position: relative;
    padding-left: 17px;
    color: #666;
    font-size: 14px;
    line-height: 20px;
}
.basic_info .info_list li:before {
    position: absolute;
    top: 9px;
    left: 4px;
    width: 3px;
    height: 3px;
    background: #d1d1d1;
    content: '';
}

.benefit_area {
    padding: 77px 0 79px;
    background: url(../../images/official/bg_benefit.jpg) no-repeat 50% 100%;
}
.benefit_area .section_title {
    width: 134px;
    margin-bottom: 25px;
    background-image: url(../../images/official/title/partner_title03.png);
}
.benefit_area .benefit_list {
    margin: -22px 0 0 -22px;
}
.benefit_area .benefit_list:after {
    display: block;
    clear: both;
    content: '';
}
.benefit_area .benefit_list li {
    float: left;
    width: 33.3%;
    padding: 22px 0 0 22px;
    font-size: 0;
    box-sizing: border-box;
}
.benefit_area .benefit_list img {
    width: 100%;
}

.application_area {
    padding: 160px 0 130px;
    background: #fff;
}
.application_area .section_title {
    width: 699px;
    margin-bottom: 13px;
    background-image: url(../../images/official/title/partner_title04.png);
}
.application_area .sub_text {
    color: #666;
    font-size: 18px;
    line-height: 22px;
}
.application_area .btn-partner {
    text-align: center;
}
.application_area .btn-partner > a,
.application_area .btn-partner > span {
    width: 350px;
    height: 88px;
}
.application_area .btn-partner > a > span,
.application_area .btn-partner > span > span {
    display: inline-block;
    overflow: hidden;
    width: 209px;
    height: 21px;
    background: url(../../images/official/tx_partner.png) no-repeat;
    vertical-align: middle;
    line-height: 999px;
}
.application_area .btn-partner > a:after,
.application_area .btn-partner > span:after {
    display: inline-block;
    height: 100%;
    content: '';
    vertical-align: middle;
}
.application_area .btn-partner.disabled > a,
.application_area .btn-partner.disabled > span {
    background-color: #9b9b9b;
}
.application_area .tx-partner-disabled {
    margin-top: 10px;
    text-align: center; 
    font-size: 14px;
}

.application_form {
    margin-top: 40px;
    padding: 28px 50px 83px;
    background: #f8f8f8;
}
.application_form.disabled .box,
.application_form.disabled .btn_area {
    position: relative;
    opacity: 0.5;
    -ms-filter: "alpha(opacity=50)";
}
.application_form.disabled .box:before,
.application_form.disabled .btn_area:before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    content: '';
}
.application_form .link {
    margin-left: 6px;
}
.application_form .box {
    margin-top: -1px;
    padding: 40px 0 30px;
    border: solid #bababa;
    border-width: 1px 0;
}
.application_form .form_title {
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 285px;
    height: 10px;
    height: 37px;
    margin-bottom: 30px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    background-position: -131px -76px; 
    vertical-align: top;
    line-height: 999px;
}
.application_form .input_wrap_title {
    display: block;
    margin: 0 5px 4px;
    color: #000; 
    font-weight: normal;
    font-size: 16px;
}
.application_form label {
    color: #999; 
    font-size: 16px;
}
.application_form label span {
    font-size: 14px;
}
.application_form .input_wrap {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.application_form .input_wrap:after {
    display: none;
}
.application_form .input_box {
    display: table-cell;
    padding: 10px 5px;
}
.application_form .input_box .link {
    position: absolute;
    top: 100%;
    left: 0;
    font-size: 14px;
}
.application_form .input_textarea {
    margin-top: 10px;
}
.application_form .required .err_txt {
    position: static;
}
.application_form .btn_area {
    padding-top: 27px;
}
.application_form .btn_area:after {
    display: block;
    clear: both;
    content: '';
}
.application_form .btn_area label {
    color: #000;
}
.application_form .btn_area .btn {
    float: right;
    width: 260px;
}
.application_form .btn_area .btn:after {
    display: inline-block;
    height: 100%;
    content: ''; 
    vertical-align: middle;
}
.application_form .btn_area .sp_sub {
    width: 61px;
    height: 17px;
    background-image: url(../../images/official/btn_submit.png);
}

.contact_area {
    padding: 80px 0 70px;
    background: #f1f1f1;
}
.contact_area .section_title {
    width: 176px;
    margin-bottom: 26px;
    background-image: url(../../images/official/title/partner_title05.png);
}
.contact_area .text {
    margin-bottom: 37px;
    color: #000;
    font-size: 20px;
    line-height: 26px;
}
.contact_area .text a {
    color: #d98500;
}
.contact_area .btn {
    margin-left: 10px;
}
.contact_area .btn:first-of-type {
    margin-left: 0;
}
.contact_area .twitter {
    width: 260px;
}
.contact_area .twitter .sp_sub {
    width: 167px;
    height: 25px;
    background: url(../../images/official/sp_sub.png) no-repeat -736px -76px;
}

@media screen and (max-width: 1440px) {
    .requirements_area .section_title,
    .benefit_area .section_title,
    .application_area .section_title,
    .contact_area .section_title {
        height: 26px;
    }
    .requirements_area .section_title {
        width: 197px;
        height: 31px;
    }
    .benefit_area .section_title {
        width: 122px;
    }
    .application_area .section_title {
        width: 626px;
    }
    .contact_area .section_title {
        width: 160px;
    }
}

@media screen and (max-width: 1280px) {
    .quick_menu {
        padding-top: 39px;
    }
    .quick_menu .quick_list {
        padding: 3px 0 1px;
    }
    .quick_menu .quick_list a {
        padding: 7px 5px 6px 5px;
    }
    .quick_menu .quick_list .sp_sub {
        height: 13px;
    }
    .quick_menu .quick_list .btn_top .sp_sub {
        width: 80px;
        height: 37px;
        background-position: -476px -138px;
    }
    .quick_menu .quick_list .btn_top:hover .sp_sub,
    .quick_menu .quick_list .btn_top:active .sp_sub,
    .quick_menu .quick_list .btn_top.active .sp_sub {
        background-position: -394px -138px;
    }
    .quick_menu .quick_list .requirements .sp_sub {
        width: 70px;
        height: 27px;
        background-position: -167px -137px;
    }
    .quick_menu .quick_list .requirements.active .sp_sub,
    .quick_menu .quick_list .requirements.active:hover .sp_sub,
    .quick_menu .quick_list .requirements.active:active .sp_sub {
        background-position: -239px -137px;
    }
    .quick_menu .quick_list .requirements:hover .sp_sub,
    .quick_menu .quick_list .requirements:active .sp_sub {
        background-position: -311px -137px;
    }
    .quick_menu .quick_list .benefits .sp_sub {
        width: 69px;
        background-position: 0 -137px;
    }
    .quick_menu .quick_list .benefits.active .sp_sub,
    .quick_menu .quick_list .benefits.active:hover .sp_sub,
    .quick_menu .quick_list .benefits.active:active .sp_sub {
        background-position: 0 -152px;
    }
    .quick_menu .quick_list .benefits:hover .sp_sub,
    .quick_menu .quick_list .benefits:active .sp_sub {
        background-position: 0 -167px;
    }
    .quick_menu .quick_list .apply .sp_sub {
        width: 53px;
        background-position: -71px -137px;
    }
    .quick_menu .quick_list .apply.active .sp_sub,
    .quick_menu .quick_list .apply.active:hover .sp_sub,
    .quick_menu .quick_list .apply.active:active .sp_sub {
        background-position: -71px -152px;
    }
    .quick_menu .quick_list .apply:hover .sp_sub,
    .quick_menu .quick_list .apply:active .sp_sub {
        background-position: -71px -167px;
    }
    .requirements_area .section_title,
    .benefit_area .section_title,
    .application_area .section_title,
    .contact_area .section_title {
        height: 24px;
    }
    .requirements_area .section_title {
        width: 176px;
        height: 28px;
    }
    .requirements_content .requirements_title {
        margin: 0;
    }
    .requirements_content .sub_text {
        padding-left: 0;
        text-align: left;
    }
    .requirements_content.creator .requirements_title {
        max-width: 1104px;
    }
    .requirements_content.creator:after {
        top: 78px;
        width: 160px;
        height: 553px;
        margin-left: 37%;
    }
    .requirements_list {
        max-width: none;
        width: 82.3%;
        margin: 52px 0 0;
    }
    .requirements_list li {
        display: table-cell;
        padding: 0 10px; 
        text-align: center;
    }
    .requirements_list li p {
        margin-top: 20px;
        color: #666;
        font-size: 15px;
        line-height: 20px;
    }
    .requirements_list li em {
        color: #d98500;
    }
    .requirements_list img {
        width: 25%;
    }
    .benefit_area .section_title {
        width: 113px;
    }
    .application_area .section_title {
        width: 600px;
    }
    .application_form {
        padding: 28px 30px 83px;
    }
    .contact_area .section_title {
        width: 143px;
    }
    .contact_area .text {
        font-size: 18px;
    }
    .basic_info .info_list li {
        padding-right: 80px;
    }
}

#content.page-overview {
    padding-bottom: 0;
    background-color: #35201f;
}

.gallery_area,
.who_is_area,
.development_area,
.custom_games_area,
.modding_area,
.leaderboard_area,
.statistics_area,
.replay_area {
    height: 700px;
    background-position: 50% 0;
    background-repeat: no-repeat;
    box-sizing: border-box;
}
.gallery_area .section_title,
.who_is_area .section_title,
.development_area .section_title,
.custom_games_area .section_title,
.modding_area .section_title,
.leaderboard_area .section_title,
.statistics_area .section_title,
.replay_area .section_title {
    position: relative;
    margin-bottom: 35px;
    padding-bottom: 35px;
}
.gallery_area .section_title:after,
.who_is_area .section_title:after,
.development_area .section_title:after,
.custom_games_area .section_title:after,
.modding_area .section_title:after,
.leaderboard_area .section_title:after,
.statistics_area .section_title:after,
.replay_area .section_title:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 1px;
    background: #d98500;
    content: '';
}
.gallery_area .text,
.who_is_area .text,
.development_area .text,
.custom_games_area .text,
.modding_area .text,
.leaderboard_area .text,
.statistics_area .text,
.replay_area .text {
    margin-top: 28px;
    color: #fff;
    font-size: 16px;
    line-height: 26px;
}
.gallery_area .text em,
.who_is_area .text em,
.development_area .text em,
.custom_games_area .text em,
.modding_area .text em,
.leaderboard_area .text em,
.statistics_area .text em,
.replay_area .text em {
    color: #d98500; 
    font-weight: bold;
}
.gallery_area .text:first-of-type,
.who_is_area .text:first-of-type,
.development_area .text:first-of-type,
.custom_games_area .text:first-of-type,
.modding_area .text:first-of-type,
.leaderboard_area .text:first-of-type,
.statistics_area .text:first-of-type,
.replay_area .text:first-of-type {
    margin-top: 0;
}
.gallery_area .inner3,
.who_is_area .inner3,
.development_area .inner3,
.custom_games_area .inner3,
.modding_area .inner3,
.leaderboard_area .inner3,
.statistics_area .inner3,
.replay_area .inner3 {
    overflow: hidden;
}
.gallery_area .box,
.who_is_area .box,
.development_area .box,
.custom_games_area .box,
.modding_area .box,
.leaderboard_area .box,
.statistics_area .box,
.replay_area .box {
    overflow: hidden;
}

.gallery_area {
    height: auto;
    margin-top: -20px;
    padding: 87px 0 93px;
    background: #fff;
}
.gallery_area .section_title {
    width: 647px;
    height: 153px;
    margin: 0 auto 28px;
    padding-bottom: 21px;
    background-image: url(../../images/official/title/overview_title01.png);
}
.gallery_area .section_title:after {
    left: 50%;
    margin-left: -40px;
}
.gallery_area .text {
    color: #333;
    text-align: center;
}

.who_is_area {
    height: auto;
    padding: 430px 0 110px;
    background-color: #000; 
    background-image: url(../../images/official/bg_overview01.jpg);
}
.who_is_area .section_title {
    width: 443px;
    height: 106px;
    margin: 0 auto;
    padding-bottom: 30px;
    background-image: url(../../images/official/title/overview_title02.png);
}
.who_is_area .section_title:after {
    display: none;
}
.who_is_area .text {
    text-align: center;
}

.development_area {
    height: 735px;
    margin-top: -35px;
    padding-top: 185px;
    background-image: url(../../images/official/bg_overview02.png);
}
.development_area .section_title {
    width: 465px;
    height: 108px;
    background-image: url(../../images/official/title/overview_title03.png);
}

.custom_games_area {
    padding-top: 118px;
    background-image: url(../../images/official/bg_overview03.jpg);
}
.custom_games_area .section_title {
    width: 362px;
    height: 46px;
    background-image: url(../../images/official/title/overview_title04.png);
}
.custom_games_area .box {
    float: right;
}
.custom_games_area .text {
    color: #333;
}

.modding_area {
    height: 865px;
    padding-top: 166px;
    background-image: url(../../images/official/bg_overview04.png);
}
.modding_area .section_title {
    width: 202px;
    height: 46px;
    background-image: url(../../images/official/title/overview_title05.png);
}

.gallery {
    margin-top: 67px;
    padding-bottom: 9%;
}
.gallery .caption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    padding: 16px;
    background: #e69800;
    background: rgba(230, 152, 0, 0.8);
    color: #fff;
    text-align: center; 
    font-weight: bold;
    font-size: 20px;
    line-height: 24px;
}

@media screen and (max-width: 1280px) {
    .gallery_area .text,
    .who_is_area .text,
    .development_area .text,
    .custom_games_area .text,
    .modding_area .text {
        font-size: 16px;
        line-height: 24px;
    }
    .gallery_area {
        padding-bottom: 80px;
    }
    .custom_games_area {
        background-position: 70% 100%;
    }
    .modding_area {
        background-position: 46% 100%;
    }
    .gallery {
        margin-top: 55px;
    }
    .gallery .caption {
        font-size: 16px;
        line-height: 20px;
    }
}

.page-faq .inner-faq {
    max-width: 1280px;
    margin: 0 auto;
    padding: 80px 30px 150px;
}

.page-faq .tab {
    margin-left: -10px;
}
.page-faq .tab li {
    padding: 0 13px;
}
.page-faq .tab a {
    font-weight: bold; 
    font-size: 20px;
}
.page-faq .tab a.active {
    color: #d98500;
}

.page-faq .faq-input-area {
    margin: 30px 0;
}
.page-faq .faq-input-area .input_wrap {
    overflow: hidden;
    max-width: 1090px; 
    width: 100%;
}
.page-faq .faq-input-area .input_select:before {
    display: none;
}
.page-faq .faq-input-area .input_select:after {
    background: url(../../images/official/ico_select_arrow.png) 50% 50% no-repeat;
    pointer-events: none;
}
.ie9 .page-faq .faq-input-area .input_select:after,
.ie10 .page-faq .faq-input-area .input_select:after {
    display: none;
}
.page-faq .faq-input-area .input_select select {
    color: #555;
}
.ie10 .page-faq .faq-input-area .input_select select {
    background: #fff url(../../images/official/ico_select_arrow.png) 90% 50% no-repeat;
}

.page-faq .faq-cat {
    float: left;
    width: 21.1%;
    margin-right: 1.83%;
}

.page-faq .faq-word {
    float: left;
    width: 55%;
    margin-right: 1.83%;
}

.page-faq .faq-btn {
    float: left;
    width: 20.2%;
}
.page-faq .faq-btn span {
    display: inline-block;
    overflow: hidden;
    width: 46px;
    height: 20px;
    background: url(../../images/official/tx_search.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

.page-faq .tx-search-result {
    font-weight: bold; 
    font-size: 19px;
}
.page-faq .tx-search-result span {
    margin-left: 10px;
    font-weight: normal; 
    font-size: 14px;
}

.page-faq .list-faq {
    padding: 17px 0 40px;
    border-top: solid 2px #d9d9d9;
}
.page-faq .list-faq > li {
    position: relative;
    margin-top: 23px;
    padding-left: 42px;
}
.page-faq .list-faq > li:first-child {
    margin-top: 0;
}
.page-faq .list-faq > li img {
    position: absolute;
    top: 0;
    left: 0;
}
.page-faq .list-faq > li a {
    white-space: nowrap; 
    font-size: 15px;
    line-height: 28px;
}
.page-faq .list-faq > li a:hover {
    color: #d98500;
}

.page-faq .tx-search-result-none {
    padding: 17px 0 200px;
    border-top: solid 2px #d9d9d9;
    font-size: 16px;
}

.page-faq .dl-faq {
    margin-bottom: 120px;
}
.page-faq .dl-faq dt {
    position: relative;
    min-height: 38px;
    margin-bottom: 15px;
    padding: 0 0 3px 42px;
    border-bottom: solid 2px #d9d9d9;
    color: #333;
    font-weight: bold;
    font-size: 20px;
    box-sizing: border-box;
}
.page-faq .dl-faq dt img {
    position: absolute;
    top: 0;
    left: 0;
}
.page-faq .dl-faq dd {
    position: relative;
    min-height: 38px;
    padding: 4px 0 10px 42px;
    color: #333;
    font-size: 14px;
    box-sizing: border-box;
}
.page-faq .dl-faq dd img {
    position: absolute;
    top: 0;
    left: 0;
}

.page-faq .support-faq {
    margin-bottom: 90px;
    padding: 35px 0;
    border-bottom: solid 2px #d9d9d9;
    text-align: center;
}
.page-faq .support-faq a {
    color: #d98500; 
    font-size: 16px;
}
.page-faq .support-faq a:hover {
    text-decoration: underline;
}

.page-faq .btn-faq-back {
    text-align: center;
}
.page-faq .btn-faq-back a {
    width: 350px;
}
.page-faq .btn-faq-back span {
    display: inline-block;
    overflow: hidden;
    width: 110px;
    height: 21px;
    background: url(../../images/official/tx_back.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

.page-inquiry .inner-inquiry {
    max-width: 1280px;
    margin: 0 auto;
    padding: 80px 30px 150px;
}

.page-inquiry .capt-inquiry {
    margin-bottom: 15px;
    padding-bottom: 3px;
    border-bottom: solid 2px #d9d9d9;
    color: #333; 
    font-weight: bold;
    font-size: 20px;
}

.page-inquiry .tx-login {
    font-size: 14px;
}
.page-inquiry .tx-login a {
    color: #d98500;
}
.page-inquiry .tx-login a:hover {
    text-decoration: underline;
}

.page-inquiry .tx-finish {
    padding: 10px 0 190px;
    border-bottom: solid 2px #d9d9d9;
    font-size: 14px;
}

.page-inquiry .lead-inquiry {
    margin-bottom: 24px;
    padding-bottom: 1em;
    border-bottom: solid 2px #d9d9d9;
    font-size: 14px;
}
.page-inquiry .lead-inquiry .highlight {
    color: #cd0e0e;
}
.page-inquiry .lead-inquiry a {
    color: #d98500;
}
.page-inquiry .lead-inquiry a:hover {
    text-decoration: underline;
}

.page-inquiry .list-input-error {
    margin-bottom: 24px;
    padding-bottom: 1.8em;
    border-bottom: solid 2px #d9d9d9;
    color: #cd0e0e; 
    font-size: 14px;
}
.page-inquiry .list-input-error > li {
    margin-top: 7px;
}
.page-inquiry .list-input-error > li:first-child {
    margin-top: 0;
}

.page-inquiry .inquiry-input-area .input_select:before {
    display: none;
}

.page-inquiry .inquiry-input-area .input_select:after {
    background: url(../../images/official/ico_select_arrow.png) 50% 50% no-repeat;
    pointer-events: none;
}
.ie9 .page-inquiry .inquiry-input-area .input_select:after,
.ie10 .page-inquiry .inquiry-input-area .input_select:after {
    display: none;
}

.page-inquiry .inquiry-input-area .input_select select {
    color: #555;
}
.ie10 .page-inquiry .inquiry-input-area .input_select select {
    background: #fff url(../../images/official/ico_select_arrow.png) 98% 50% no-repeat;
}

.page-inquiry .inquiry-input-area .inquiry-changer-opts .opt-grp.out {
    display: none;
}

.page-inquiry .tbl-inquiry-input {
    width: 100%;
    margin-top: -15px; 
    table-layout: fixed;
}
.page-inquiry .tbl-inquiry-input th {
    width: 195px;
    padding: 30px 45px 10px 20px;
    vertical-align: top;
    text-align: right;
    white-space: nowrap; 
    font-weight: normal;
    font-size: 14px;
}
.page-inquiry .tbl-inquiry-input th .input-required {
    color: #cd0e0e;
}
.page-inquiry .tbl-inquiry-input td {
    padding: 10px 20px 10px 0;
    vertical-align: top;
    font-size: 14px;
}
.page-inquiry .tbl-inquiry-input td .inquiry-uploadfile {
    height: 58px;
    padding: 10px 19px;
    border: solid 1px #d3d3d3;
    background-color: #fff;
    box-sizing: border-box;
}
.page-inquiry .tbl-inquiry-input td .inquiry-input-note {
    margin-top: 8px;
}
.page-inquiry .tbl-inquiry-input td .inquiry-input-note a {
    color: #d98500;
}
.page-inquiry .tbl-inquiry-input td .inquiry-input-note a:hover {
    text-decoration: underline;
}

.page-inquiry .tbl-inquiry-confirm {
    width: 100%;
    margin-top: -15px; 
    table-layout: fixed;
}
.page-inquiry .tbl-inquiry-confirm th {
    width: 195px;
    padding: 20px 45px 20px 20px;
    vertical-align: top;
    text-align: right;
    font-weight: normal; 
    font-size: 14px;
}
.page-inquiry .tbl-inquiry-confirm td {
    padding: 20px 20px 20px 0;
    vertical-align: top;
    font-size: 14px;
}

.page-inquiry .pic-inquiry-confirm img {
    max-width: 350px;
    max-height: 350px; 
    width: auto;
    height: auto;
}

.page-inquiry .btn-inquiry-login {
    margin-top: 120px;
    text-align: center;
}
.page-inquiry .btn-inquiry-login .btn {
    width: 350px;
    height: 88px;
}
.page-inquiry .btn-inquiry-login .btn span {
    display: inline-block;
    overflow: hidden;
    width: 86px;
    height: 20px;
    background: url(../../images/official/tx_login.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

.page-inquiry .btn-inquiry-input {
    margin-top: 100px;
    text-align: center;
}
.page-inquiry .btn-inquiry-input .btn {
    width: 350px;
    height: 88px;
}
.page-inquiry .btn-inquiry-input .btn span {
    display: inline-block;
    overflow: hidden;
    width: 113px;
    height: 21px;
    background: url(../../images/official/tx_confirm.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

.page-inquiry .btn-inquiry-top {
    margin-top: 80px;
    text-align: center;
}
.page-inquiry .btn-inquiry-top .btn {
    width: 350px;
    height: 88px;
}
.page-inquiry .btn-inquiry-top .btn span {
    display: inline-block;
    overflow: hidden;
    width: 187px;
    height: 22px;
    background: url(../../images/official/tx_top.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

.page-inquiry .btn-inquiry-confirm {
    margin-top: 30px;
    padding-top: 80px;
    border-top: solid 2px #d9d9d9;
    text-align: center;
}
.page-inquiry .btn-inquiry-confirm .btn {
    width: 350px;
    height: 88px;
}
.page-inquiry .btn-inquiry-confirm .btn.is-back {
    margin-right: 35px;
    background-color: #848484;
}
.page-inquiry .btn-inquiry-confirm .btn.is-back:hover {
    background-color: #555;
}
.page-inquiry .btn-inquiry-confirm .btn.is-back span {
    display: inline-block;
    overflow: hidden;
    width: 42px;
    height: 20px;
    background: url(../../images/official/tx_back2.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
.page-inquiry .btn-inquiry-confirm .btn.is-send span {
    display: inline-block;
    overflow: hidden;
    width: 88px;
    height: 21px;
    background: url(../../images/official/tx_send.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

#content.page-gameguide {
    padding-bottom: 0;
}

.page-gameguide .wrap-gameguide {
    padding: 100px 0 0;
    color: #333;
}
.page-gameguide .wrap-gameguide.is-bg {
    background: url(../../images/official/bg_gamestart02.png) 50% 100% no-repeat;
}

.page-gameguide .inner-gameguide {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 30px;
}
.page-gameguide .inner-gameguide.is-price {
    padding-bottom: 420px;
}

.page-gameguide .capt-gameguide {
    padding: 80px 0 100px;
    text-align: center;
}
.page-gameguide .capt-gameguide img {
    vertical-align: top;
}

.page-gameguide .capt-gameguide-sub {
    position: relative;
    margin-bottom: 15px;
    padding-bottom: 5px;
    font-size: 20px;
}
.page-gameguide .capt-gameguide-sub:after {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: 90px;
    height: 1px;
    background-color: #d98500; 
    content: "";
}

.page-gameguide .tbl-gameguide {
    width: 100%;
}
.page-gameguide .tbl-gameguide th,
.page-gameguide .tbl-gameguide td {
    padding: 15px 30px;
    border: solid 1px #bcbcbc;
    background: #fff;
    text-align: left; 
    font-weight: normal;
    font-size: 16px;
}
.page-gameguide .tbl-gameguide th {
    color: #333;
}
.page-gameguide .tbl-gameguide td {
    color: #d98500;
    font-weight: bold;
}
.page-gameguide .tbl-gameguide.is-manual th {
    width: 52%;
    box-sizing: border-box;
}
.page-gameguide .tbl-gameguide.is-spec th {
    width: 350px;
    box-sizing: border-box;
}

.page-gameguide .tab {
    margin-left: -10px;
}
.page-gameguide .tab li {
    padding: 0 13px;
}
.page-gameguide .tab a {
    font-weight: bold; 
    font-size: 20px;
}
.page-gameguide .tab a.active {
    color: #d98500;
}

.page-gameguide .sect-gamestart01 {
    background: url(../../images/official/bg_gamestart01.png) 50% 0 no-repeat;
    background-size: cover;
}
.page-gameguide .sect-gamestart01 .inner-gameguide {
    overflow: hidden; 
    padding-top: 173px;
    padding-bottom: 220px;
}
.page-gameguide .sect-gamestart01 .area-capt {
    float: left;
    width: 58.59%;
}
.page-gameguide .sect-gamestart01 .area-capt h3 img {
    width: 100%;
    height: auto;
}
.page-gameguide .sect-gamestart01 .area-capt p {
    margin: 5.5% 0;
    color: #fff; 
    font-size: 16px;
}
.page-gameguide .sect-gamestart01 .area-capt p a {
    color: #d98500;
}
.page-gameguide .sect-gamestart01 .area-capt p a:hover {
    text-decoration: underline;
}
.page-gameguide .sect-gamestart01 .area-capt .btn-install {
    width: 415px;
    height: 60px;
}
.page-gameguide .sect-gamestart01 .area-capt .btn-install span {
    display: inline-block;
    overflow: hidden;
    width: 370px;
    height: 25px;
    background: url(../../images/official/tx_install.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}
.page-gameguide .sect-gamestart01 .pic-gamestart01 {
    float: right;
    width: 39.22%;
    height: auto;
    margin-top: 2.625%;
}

.page-gameguide .sect-gamestart02 {
    background: url(../../images/official/bg_gamestart02.png) 50% 0 no-repeat;
    background-size: cover;
}
.page-gameguide .sect-gamestart02 .inner-gameguide {
    padding-top: 60px;
    padding-bottom: 100px;
}
.page-gameguide .sect-gamestart02 h3 {
    width: 29.06%;
}
.page-gameguide .sect-gamestart02 h3 img {
    width: 100%;
    height: auto;
}
.page-gameguide .sect-gamestart02 p {
    margin: 3.2% 0 2.8%;
    font-size: 16px;
}
.page-gameguide .sect-gamestart02 p a {
    color: #d98500;
}
.page-gameguide .sect-gamestart02 p a:hover {
    text-decoration: underline;
}
.page-gameguide .sect-gamestart02 .gamestart02-detail {
    overflow: hidden; 
    margin-top: 40px;
    padding: 35px 55px;
    background-color: rgba(255, 255, 255, 0.8);
}
.page-gameguide .sect-gamestart02 .gamestart02-detail:first-child {
    margin-top: 0;
}
.page-gameguide .sect-gamestart02 .gamestart02-detail figure {
    margin: 0;
}
.page-gameguide .sect-gamestart02 .gamestart02-detail figure img {
    width: 100%;
    height: auto;
}
.page-gameguide .sect-gamestart02 .gamestart02-detail figure figcaption {
    margin-top: 3px;
    font-size: 14px;
}
.page-gameguide .sect-gamestart02 .gamestart02-detail .step-first {
    position: relative;
    float: left;
    width: 42.9%;
}
.page-gameguide .sect-gamestart02 .gamestart02-detail .step-first:after {
    position: absolute;
    top: 0;
    right: -32%;
    display: block;
    width: 32%;
    height: 100%;
    background: url(../../images/official/img_tri.png) 50% 47% no-repeat; 
    content: "";
}
.page-gameguide .sect-gamestart02 .gamestart02-detail .step-second {
    float: right;
    width: 42.9%;
}

.page-gameguide .sect-gamestart03 {
    background: url(../../images/official/bg_gamestart03.png) 50% 0 no-repeat;
    background-size: cover;
}
.page-gameguide .sect-gamestart03 .inner-gameguide {
    overflow: hidden; 
    padding-top: 145px;
    padding-bottom: 290px;
}
.page-gameguide .sect-gamestart03 .area-capt {
    float: left;
    width: 51%;
}
.page-gameguide .sect-gamestart03 .area-capt h3 img {
    width: 100%;
    height: auto;
}
.page-gameguide .sect-gamestart03 .area-capt p {
    margin: 6.3% 0;
    color: #fff; 
    font-size: 16px;
}
.page-gameguide .sect-gamestart03 .pic-gamestart03 {
    float: right;
    width: 42.1%;
    height: auto;
    margin-top: 2.625%;
}
.page-gameguide .sect-gamestart03 .btn-gamestart {
    clear: both;
    padding-top: 50px;
    text-align: center;
}
.page-gameguide .sect-gamestart03 .btn-gamestart a {
    display: inline-block;
    overflow: hidden; 
    width: 482px;
    height: 118px;
    background: url(../../images/official/btn_gamestart.png) no-repeat;
    line-height: 999px;
}
.page-gameguide .sect-gamestart03 .btn-gamestart a:hover {
    background: url(../../images/official/btn_gamestart_on.png) no-repeat;
}

.page-gameguide .sect-manual {
    padding-bottom: 350px;
}
.page-gameguide .sect-manual p {
    font-size: 16px;
}
.page-gameguide .sect-manual .pic-manual01 {
    margin: 47px 0 87px;
    text-align: center;
}
.page-gameguide .sect-manual .pic-manual01 img {
    max-width: 100%;
    height: auto;
}
.page-gameguide .sect-manual .wrap-manual-list {
    overflow: hidden;
}
.page-gameguide .sect-manual .wrap-manual-list > div {
    float: left;
    width: 50%;
    padding-left: 8px;
    box-sizing: border-box;
}
.page-gameguide .sect-manual .wrap-manual-list > div:first-child {
    padding-right: 8px;
    padding-left: 0;
}
.page-gameguide .sect-manual .wrap-spec-list {
    padding: 10px 0 100px;
}

.page-gameguide .sect-price {
    position: relative;
    margin-top: 200px;
    padding: 0 60px 60px;
    background-color: rgba(255, 255, 255, 0.8);
}
.page-gameguide .sect-price:first-child {
    margin-top: 20px;
}
.page-gameguide .sect-price:before {
    position: absolute;
    top: -50px;
    left: 0;
    display: block;
    width: 100%;
    height: 50px;
    background: url(../../images/official/bg_gameguide_price01.png) 50% 100% no-repeat;
    background-size: 100% auto; 
    content: "";
}
.page-gameguide .sect-price:after {
    position: absolute;
    bottom: -50px;
    left: 0;
    display: block;
    width: 100%;
    height: 50px;
    background: url(../../images/official/bg_gameguide_price02.png) 50% 0 no-repeat;
    background-size: 100% auto; 
    content: "";
}
.page-gameguide .sect-price h3 {
    margin-bottom: 40px; 
    padding-bottom: 15px;
    border-bottom: solid 1px #bdbdbd;
}
.page-gameguide .sect-price .area-price {
    overflow: hidden;
}
.page-gameguide .sect-price .pic-price01 {
    float: left;
    width: 43.28%;
}
.page-gameguide .sect-price .pic-price02 {
    float: left;
    width: 43.28%;
}
.page-gameguide .sect-price .tx-price01 {
    float: right;
    width: 45%;
    padding-right: 5%;
    font-size: 16px;
}
.page-gameguide .sect-price .tx-price02 {
    float: left;
    width: 42%;
    padding-right: 8%;
    font-size: 16px;
}
.page-gameguide .sect-price .text-highlight {
    background-color: #fecb9a;
}
.page-gameguide .sect-price .note-price {
    display: block;
    margin-top: 20px;
    padding-left: 1em;
    text-indent: -1em; 
    font-size: 12px;
}

.page-error .inner-error {
    max-width: 1280px;
    margin: 0 auto;
    padding: 80px 30px 150px;
}

.page-error .capt-error {
    margin-bottom: 15px;
    padding-bottom: 3px;
    border-bottom: solid 2px #d9d9d9;
    color: #333; 
    font-weight: bold;
    font-size: 20px;
}

.page-error .tx-error {
    padding: 10px 0 190px;
    border-bottom: solid 2px #d9d9d9;
    font-size: 14px;
}

.page-error .btn-error-top {
    margin-top: 80px;
    text-align: center;
}
.page-error .btn-error-top .btn {
    width: 350px;
    height: 88px;
}
.page-error .btn-error-top .btn span {
    display: inline-block;
    overflow: hidden;
    width: 187px;
    height: 22px;
    background: url(../../images/official/tx_top.png) no-repeat;
    vertical-align: top;
    line-height: 999px;
}

.page-support .inner-support {
    max-width: 1280px;
    margin: 0 auto;
    padding: 80px 30px 30px;
}
.page-support .inner-support.wrap-language {
    display: none;
}
.page-support .inner-support.wrap-language:first-child {
    display: block;
}

.page-support .capt-support {
    margin-bottom: 15px;
    padding-bottom: 3px;
    border-bottom: solid 2px #d9d9d9;
    color: #333; 
    font-weight: bold;
    font-size: 20px;
}

.page-support .lead-support {
    margin-bottom: 2.5em;
    padding: 1.5em 0 2.5em;
    border-bottom: solid 1px #ccc;
    color: #333; 
    font-size: 14px;
}
.page-support .lead-support p {
    margin-top: 1em;
}
.page-support .lead-support p:first-child {
    margin-top: 0;
}

.page-support .tab {
    margin-bottom: 30px;
    margin-left: -10px;
}
.page-support .tab li {
    padding: 0 13px;
}
.page-support .tab a {
    font-weight: bold; 
    font-size: 18px;
}
.page-support .tab a.active {
    color: #d98500;
}
.page-support .tab.is-mb0 {
    margin-bottom: 0;
}

.page-support section {
    margin-bottom: 2.5em;
    color: #333; 
    font-size: 14px;
}
.page-support section h3 {
    margin-bottom: 0.8em;
    font-weight: bold; 
    font-size: 20px;
}
.page-support section p {
    margin-top: 1em;
    font-size: 14px;
    line-height: 1.6;
}
.page-support section p a {
    color: #d98500;
}
.page-support section p a:hover {
    text-decoration: underline;
}

.leaderboard_area,
.statistics_area,
.replay_area {
    position: relative;
    height: 676px;
    padding-top: 155px;
}
.leaderboard_area .box,
.statistics_area .box,
.replay_area .box {
    position: relative;
    margin-right: 50%;
    padding: 50px 90px 0 0;
}
.leaderboard_area .inner3:before,
.statistics_area .inner3:before,
.replay_area .inner3:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    max-width: 635px;
    width: 49.6%;
    margin-left: -30px;
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat;
    content: '';
}

.leaderboard_area {
    margin-top: -16px;
    padding-top: 160px;
    background-image: url(../../images/official/bg_leaderboard01.jpg);
}
.leaderboard_area .section_title {
    width: 311px;
    height: 46px;
    background: url(../../images/official/title/leaderboard_title01.png) no-repeat;
}
.leaderboard_area .inner3:before {
    background-image: url(../../images/official/item_leaderboard01.png);
}

.statistics_area {
    background-image: url(../../images/official/bg_leaderboard02.jpg);
}
.statistics_area .section_title {
    width: 238px;
    height: 46px;
    background: url(../../images/official/title/leaderboard_title02.png) no-repeat;
}
.statistics_area .text {
    color: #000;
}
.statistics_area .box {
    margin: 0 0 0 50%;
    padding: 50px 0 0 100px;
}
.statistics_area .inner3:before {
    right: 50%;
    left: auto;
    margin: 0 -30px 0 0;
    background-image: url(../../images/official/item_leaderboard02.png);
}

.replay_area {
    padding-top: 138px;
    background-image: url(../../images/official/bg_leaderboard03.jpg);
}
.replay_area .section_title {
    width: 165px;
    height: 46px;
    background: url(../../images/official/title/leaderboard_title03.png) no-repeat;
}
.replay_area .inner3:before {
    background-image: url(../../images/official/item_leaderboard03.png);
}

@media screen and (max-width: 1280px) {
    .leaderboard_area .box,
    .statistics_area .box,
    .replay_area .box {
        padding-right: 50px;
    }
    .leaderboard_area {
        padding-top: 130px;
    }
}

.policy_area {
    position: relative;
    z-index: 2; 
    padding: 64px 0 200px;
    background: #fff;
    color: #000;
    font-size: 14px;
    line-height: 20px;
}
.policy_area:before {
    position: absolute;
    bottom: -424px;
    left: 50%;
    width: 808px;
    height: 617px;
    margin-left: 143px;
    background: url(../../images/official/bg_footer.png) no-repeat;
    content: '';
}
.policy_area .inner3 {
    max-width: 1126px;
}
.policy_area .title {
    color: #e69800; 
    font-size: 16px;
}
.policy_area .dsc {
    margin-top: 20px;
    font-weight: bold;
}

.policy_lst {
    margin-top: 44px;
    padding-top: 44px; 
    border-top: 1px solid #ccc;
}
.policy_lst li {
    margin-top: 35px;
}
.policy_lst li:first-child {
    margin-top: 0;
}
.policy_lst li strong {
    display: block;
    margin-bottom: 18px;
    font-size: 16px;
}
.policy_lst li strong.sub_tit {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 14px;
}

.ly_pop_wrap {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;
    min-width: 1024px; 
    background: #000;
    background: rgba(0, 0, 0, 0.8);
}

.ly_pop {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 1700px;
    max-height: 1052px;
    width: 73%;
    margin-top: 30px;
    padding-top: 46%;
    border: 1px solid #000;
    background: #000; 
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.ly_header {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 97px;
    padding: 37px 33px 36px;
    background: #000;
    box-sizing: border-box;
}
.ly_header .ly_title {
    display: block;
    overflow: hidden;
    color: #fff;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 24px;
    line-height: 1em;
}

.btn_ly_close {
    position: absolute;
    top: -72px;
    right: 0;
    z-index: 3;
    width: 50px;
    height: 50px;
    background: #d98500;
}
.btn_ly_close .sp_sub {
    width: 29px;
    height: 29px;
    background-position: -634px -227px;
}
.btn_ly_close:hover {
    background: #c16400;
}

.ly_content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 97px;
    left: 0;
}
.ly_content iframe {
    width: 100%;
    height: 100%;
}

/* 미디어 팝업 */
.ly_media .ly_header {
    right: 460px;
    bottom: -97px;
}

.ly_media .slick-slider,
.ly_media .slick-list,
.ly_media .slick-track {
    height: 100%;
}

.ly_media .slick-list {
    overflow: visible;
}

.ly_media .slick-slide img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 100%;
    max-height: 100%; 
    width: auto;
    height: auto;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.ly_media .slick-prev,
.ly_media .slick-next {
    top: auto;
    bottom: -97px;
    left: auto;
    z-index: 1;
    width: 98px;
    height: 97px;
    border-left: 1px solid #333;
    background: #000; 
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
}
.ly_media .slick-prev:after,
.ly_media .slick-next:after {
    position: absolute;
    top: 50%;
    left: 50%;
    display: inline-block;
    overflow: hidden;
    width: 10px;
    width: 22px;
    height: 10px;
    height: 35px;
    background: url(../../images/official/sp.png) no-repeat;
    background: url(../../images/official/sp_sub.png) no-repeat;
    content: ''; 
    vertical-align: top;
    line-height: 999px;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.ly_media .slick-prev {
    right: 98px;
}
.ly_media .slick-prev:after {
    background-position: -256px -284px;
}
.ly_media .slick-prev:hover:after {
    background-position: -304px -284px;
}

.ly_media .slick-next {
    right: 0;
}
.ly_media .slick-next:after {
    background-position: -280px -284px;
}
.ly_media .slick-next:hover:after {
    background-position: -328px -284px;
}

@media screen and (max-width: 1440px) {
    .ly_header {
        height: 80px;
        padding: 30px 33px;
    }
    .ly_header .ly_title {
        font-size: 20px;
    }
    .btn_ly_close {
        top: -61px;
        width: 38px;
        height: 39px;
    }
    .btn_ly_close .sp_sub {
        width: 22px;
        height: 22px;
        background-position: -634px -258px;
    }
    .ly_content {
        bottom: 80px;
    }
    .ly_media .ly_header {
        right: 385px;
        bottom: -80px;
    }
    .ly_media .slick-prev,
    .ly_media .slick-next {
        bottom: -80px;
        width: 80px;
        height: 80px;
    }
    .ly_media .slick-prev:after,
    .ly_media .slick-next:after {
        width: 18px;
        height: 29px;
    }
    .ly_media .slick-prev {
        right: 80px;
    }
    .ly_media .slick-prev:after {
        background-position: -176px -290px;
    }
    .ly_media .slick-prev:hover:after {
        background-position: -216px -290px;
    }
    .ly_media .slick-next:after {
        background-position: -196px -290px;
    }
    .ly_media .slick-next:hover:after {
        background-position: -236px -290px;
    }
}

@media screen and (max-width: 1280px) {
    .ly_header {
        height: 60px;
        padding: 22px 30px;
    }
    .ly_header .ly_title {
        font-size: 16px;
    }
    .btn_ly_close {
        top: -53px;
        width: 30px;
        height: 31px;
    }
    .btn_ly_close .sp_sub {
        width: 17px;
        height: 17px;
        background-position: -688px -256px;
    }
    .ly_content {
        bottom: 60px;
    }
    .ly_media .ly_header {
        right: 310px;
        bottom: -60px;
    }
    .ly_media .slick-prev,
    .ly_media .slick-next {
        bottom: -60px;
        width: 60px;
        height: 60px;
    }
    .ly_media .slick-prev:after,
    .ly_media .slick-next:after {
        width: 14px;
        height: 23px;
    }
    .ly_media .slick-prev {
        right: 60px;
    }
    .ly_media .slick-prev:after {
        background-position: -659px -163px;
    }
    .ly_media .slick-prev:hover:after {
        background-position: -691px -163px;
    }
    .ly_media .slick-next:after {
        background-position: -675px -163px;
    }
    .ly_media .slick-next:hover:after {
        background-position: -707px -163px;
    }
}