@charset "UTF-8";
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

/* HTML5 display definitions for IE 9- ========================================================================== */
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; }

audio, canvas, progress, video { display: inline-block; }

audio:not([controls]) { display: none; height: 0; }

progress { vertical-align: baseline; }

template, [hidden] { display: none; }

/* Links ========================================================================== */
a { background-color: transparent; }

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

/* Text-level semantics ========================================================================== */
abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; }

b, strong { font-weight: inherit; }

b, strong { font-weight: bolder; }

dfn { font-style: italic; }

h1 { font-size: 2em; margin: 0.67em 0; }

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

small { font-size: 80%; }

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

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* Embedded content ========================================================================== */
img { border-style: none; }

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

/* Grouping content ========================================================================== */
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

figure { margin: 1em 40px; }

hr { box-sizing: content-box; height: 0; overflow: visible; }

/* Forms ========================================================================== */
button, input, select, textarea { font: inherit; }

optgroup { font-weight: bold; }

button, input, select { overflow: visible; }

button, input, select, textarea { margin: 0; }

button, select { text-transform: none; }

button, [type="button"], [type="reset"], [type="submit"] { cursor: pointer; }

[disabled] { cursor: default; }

button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }

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

button:-moz-focusring, input:-moz-focusring { outline: 1px dotted ButtonText; }

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

legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }

textarea { overflow: auto; }

[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; }

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

[type="search"] { -webkit-appearance: textfield; }

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

* { margin: 0; padding: 0; }

html, body { min-width: 1100px; }

body { background: #1d2935; color: #5c79a2; margin: 0; padding: 0;font: 12px/1.5 tahoma, '\5FAE\8F6F\96C5\9ED1', sans-serif; line-height: 1; }

button { outline: 0; background: none; border: 0; cursor: pointer; }

img { border: 0; }

ul, ol { list-style: none; }

table { border-spacing: 0; }

caption { height: 0; overflow: hidden; font-size: 0; }

a { color: #6096e3; }

a:hover { color: #6096e3; }

.gnbContainer { width: 1100px; }

/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-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; -webkit-tap-highlight-color: transparent; }

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

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

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

.slick-track { position: relative; top: 0; left: 0; display: block; }

.slick-track:before, .slick-track:after { display: table; content: ''; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }

[dir='rtl'] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

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

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

* { margin: 0; padding: 0; }

html, body { min-width: 1100px; }

body { background: #102137; color: #5c79a2; margin: 0; padding: 0;font: 12px/1.5 tahoma, '\5FAE\8F6F\96C5\9ED1', sans-serif; font-size: 12px; line-height: 1; }

button { outline: 0; background: none; border: 0; cursor: pointer; }

img { border: 0; }

ul, ol { list-style: none; }

table { border-spacing: 0; }

caption { height: 0; overflow: hidden; font-size: 0; }

a { color: #6096e3; }

a:hover { color: #6096e3; }

.gnbContainer { width: 1100px; }

/* notice */
.toggle-caution { background: #191919; }

.toggle-caution .disc-wrap { margin: 0 auto 0; padding-bottom: 80px; width: 1100px; }

.toggle-caution .disc-wrap h2 { margin-left: 20px; }

.toggle-caution .disc-wrap .disc { margin: 30px auto 0; width: 1050px; color: #7c7c7c; font-family: Dotum, "돋움"; text-indent: 0; }

.toggle-caution .disc-wrap .disc h3 { margin: 35px 0 12px 0; font-size: 12px; }

.toggle-caution .disc-wrap .disc h3:first-child { margin-top: 0; }

.toggle-caution .disc-wrap .disc ol:first-child { margin-top: 0; }

.toggle-caution .disc-wrap .disc ol > li { margin: 10px 0 0 10px; line-height: 17px; list-style: decimal; }

.toggle-caution .disc-wrap .disc ol > li:first-child { margin-top: 0; }

.toggle-caution .disc-wrap .disc ol > li > ul { position: relative; }

.toggle-caution .disc-wrap .disc ol > li > ul::before { content: ">"; display: block; position: absolute; left: 0; top: 0; }

.toggle-caution .disc-wrap .disc ol > li > ul li { margin: 4px 0 0 12px; }

.toggle-caution .disc-wrap .disc ol a { font-weight: bold; color: #7c7c7c; }

.toggle-caution .disc-wrap .disc ol strong { color: #ffde00; font-weight: normal; }

/* footer */
#footer { text-align: left; text-indent: -9999em; white-space: nowrap; overflow: hidden; position: relative; overflow: visible; background: url("https://wstatic-cdn.plaync.com/promokit/v1.1/img/bg-footer.gif") no-repeat center top; background-color: #191919; }

#footer .share { position: absolute; top: 32px; left: 50%; width: 32px; margin-left: -16px; margin-left: 104px; text-indent: 0; }

#container strong { font-size: 0; }

#container table { font-size: 0; }

.promokit-remote { display: none; }

/* header */
#section-header { position: relative; text-align: left; text-indent: -9999em; white-space: nowrap; overflow: hidden; height: 100vh; }

#section-header .player { width: 100%; height: 100%; display: block; }

#section-header .title-area { position: absolute; top: 50%; left: 50%; width: 695px; height: 400px; margin-top: -200px; margin-left: -347.5px; }

#section-header .title-area .tit-1 { opacity: 0; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec1-con-tit1.png") no-repeat 50% 0; position: absolute; top: 50%; left: 50%; width: 700px; height: 50px; margin-top: -25px; margin-left: -350px; margin-top: -308px; }

#section-header .title-area .tit-2 { opacity: 0; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec1-con-tit2.png") no-repeat 50% 0; position: absolute; top: 50%; left: 50%; width: 880px; height: 135px; margin-top: -67.5px; margin-left: -440px; margin-top: -250px; }

#section-header .title-area .tit-3 { opacity: 0; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec1-con-tit3.png") no-repeat 50% 0; position: absolute; top: 50%; left: 50%; width: 302px; height: 95px; margin-top: -47.5px; margin-left: -151px; margin-top: -75px; }

#section-header .title-area button { opacity: 0; text-align: left; text-indent: -9999em; white-space: nowrap; overflow: hidden; box-sizing: border-box; border: 1px solid #ffe0c2; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/bg-arrow.png") repeat-x -93px 50%; position: absolute; top: 322px; left: 50%; width: 76px; height: 76px; margin-left: -38px; border-radius: 76px; transition: all 0.3s; }

#section-header .title-area button:hover { -ms-transform: scale(1.1, 1.1) !important; transform: scale(1.1, 1.1) !important; background-position-x: -7px; }

#section-header .btn-scroll { opacity: 0; text-align: left; text-indent: -9999em; white-space: nowrap; overflow: hidden; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec1-con-scroll.png") no-repeat 50% 0; position: absolute; bottom: 204px; left: 50%; width: 54px; height: 118px; margin-left: -27px; }


.other { text-indent: 0; font-size: 0; position: absolute; left: 50%; bottom: 137px; -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; }

.other__list { margin-left: 10px; width: 213px; height: 43px; display: inline-block; position: relative; }

.other__list:before, .other__list:after { content: ""; width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec1-footer_btns.png") no-repeat 0 0; z-index: 1; transition: 0.4s; }

.other__list:after { opacity: 0; }

.other__list--download:before, .other__list--download:after { background-position-x: 0; }

.other__list--password:before, .other__list--password:after { background-position-x: -223px; }

.other__list--signup:before, .other__list--signup:after { background-position-x: -446px; }

.other__list--board:before, .other__list--board:after { background-position-x: -669px; }

.other__list:first-child { margin-left: 0; }

.other__list:hover:after { opacity: 1; }

@media (max-height: 700px) { #section-header .btn-scroll { top: 570px; bottom: auto; } }

/* contents */
#section-1 { position: relative; display: block; overflow: hidden; height: 1080px; text-indent: -999em; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-con-bg.jpg") no-repeat 50% 0; }

#section-1 .tab { width: 1110px; height: 586px; position: absolute; top: 332px; left: 50%; margin-left: -550px; text-indent: 0; }

#section-1 .tab .tab_cont0 { position: relative; display: block; overflow: hidden; width: 1110px; height: 586px; text-indent: 0; padding-left: 150px; box-sizing: border-box; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-tab1_cont.png") no-repeat 50% 0; }

#section-1 .tab .tab_cont0 button { text-indent: -9999em; white-space: nowrap; overflow: hidden; position: relative; display: block; float: left; width: 234px; height: 112px; margin-left: 51px; }

#section-1 .tab .tab_cont0 button:first-child { margin-left: 0; }

#section-1 .tab .tab_cont1 { position: relative; display: block; overflow: hidden; width: 1110px; height: 586px; text-indent: 0; padding-left: 90px; box-sizing: border-box; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-tab2_cont.png") no-repeat 50% 0; }

#section-1 .tab .tab_cont1 button { text-indent: -9999em; white-space: nowrap; overflow: hidden; position: relative; display: block; float: left; width: 164px; height: 112px; margin-left: 31px; }

#section-1 .tab .tab_cont1 button:first-child { margin-left: 0; }

#section-1 .tab .tab_cont1 .cont1_box { position: absolute; left: 50%; margin-left: 21px; }

#section-1 .tab .tab_cont1 .cont1_box button { margin-left: 10px; }

#section-1 .tab .tab_cont1 .cont1_box button:first-child { margin-left: 0; }

#section-1 .promokit-tab__link-list { text-align: center; }

#section-1 .promokit-tab__link { width: 376px; height: 66px; background: #929292; }

#section-1 .promokit-tab__link.promokit-tab__link--0 { background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-con-tab1_off.png") no-repeat 50% 0; }

#section-1 .promokit-tab__link.promokit-tab__link--0.promokit-tab__link--active { background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-con-tab1_on.png") no-repeat 50% 0; }

#section-1 .promokit-tab__link.promokit-tab__link--1 { background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-con-tab2_off.png") no-repeat 50% 0; }

#section-1 .promokit-tab__link.promokit-tab__link--1.promokit-tab__link--active { background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec2-con-tab2_on.png") no-repeat 50% 0; }

#section-2 { position: relative; display: block; overflow: hidden; height: 1080px; text-indent: -999em; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec3-con-bg.jpg") no-repeat 50% 0; }

#section-3 { position: relative; display: block; overflow: hidden; height: 1080px; text-indent: -999em; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec4-con-bg.jpg") no-repeat 50% 0; }

#section-3 button { text-indent: -9999em; white-space: nowrap; overflow: hidden; position: absolute; display: block; width: 497px; height: 390px; top: 50%; left: 50%; margin-top: -104px; margin-left: -520px; }

#section-4 { position: relative; display: block; overflow: hidden; height: 1080px; text-indent: -999em; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec5-con-bg.jpg") no-repeat 50% 0; }

#section-5 { position: relative; display: block; overflow: hidden; height: 1080px; text-indent: -999em; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec6-con-bg.jpg") no-repeat 50% 0; }

#slide { position: absolute; left: 50%; top: 50%; margin-top: -149px; margin-left: -496px; width: 990px; height: 544px; }

#slide::before { content: ''; display: block; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/slide_deco.png") no-repeat 50% 0; position: absolute; top: -11px; left: 50%; width: 88px; height: 26px; margin-left: -44px; margin-left: -49px; z-index: 99; }

#slide::after { content: ''; display: block; background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/slide_deco.png") no-repeat 50% 0; position: absolute; bottom: 37px; left: 50%; width: 88px; height: 26px; margin-left: -44px; margin-left: -49px; z-index: 99; }

#slide .promokit-slide__area { height: 492px; border: 1px solid #fff9e9; }

#slide .li { position: relative; width: 990px; height: 492px; }

#slide .li img { width: 990px; height: 492px; display: block; border: 1px solid #fff9e9; }

#slide .promokit-slide__button--prev { background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/btn_prev_on.png") no-repeat 50% 0; width: 51px; height: 85px; left: -61px; margin-top: -30px; }

#slide .promokit-slide__button--prev:disabled { opacity: 0.5 !important; }

#slide .promokit-slide__button--next { background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/btn_next_on.png") no-repeat 50% 0; width: 51px; height: 85px; right: -61px; margin-top: -30px; }

#slide .promokit-slide__button--next:disabled { opacity: 0.5 !important; }

#slide .promokit-slide__pagination { text-indent: 0; bottom: 0; }

#slide .promokit-slide__pagination-bullet { height: 12px; border-radius: 0; width: 70px; background: #3e4b6d; }

#slide .promokit-slide__pagination-bullet--active { background: #f1eab2; }

.promokit-remote__scroll a.promokit-remote__start-link { font-size: 20px; font-weight: 300; }

.videobox {
    position: absolute;
}
.videobox video{
    display: block;
}
#header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 54px;
    z-index: 999;
    background: rgba(0, 0, 0, 0.5);
}

#header .btn-link-home {
    position: absolute;
    top: 9px;
    left: 48px;
    width: 105px;
    height: 39px;
    background: url("https://static.web.sdo.com/aion/pic/project/Classic1.5/logo-aion.png") no-repeat 50% 0;
    display: block;
    text-indent: -999em;
}
.sec5-btn{ background: url("https://static.web.sdo.com/aion/pic/project/Classic1.7/sec5-btn.png") no-repeat 50% 0; position: absolute; display: block; top: 50%; left: 50%; width: 228px; height: 68px; margin-top: -34px; margin-left: -17px; margin-top: 377px; }