@charset "UTF-8";
@import url(fonts.css);
@import url(reset.css);
html, body {
    width:100%;
    background:#000;
    overflow-x: hidden;
    /* overflow-Y: hidden; */
    overflow-x: hidden;touch-action: manipulation;
}
.fix {
    overflow: hidden;
}
img {vertical-align: top;width:100%;}
#m_rom{
    position: relative;
    width:100%;
    height:100%;
    /* overflow: hidden; */
}
.container {
    height:100%;
	opacity:0;

}

.container.actived{
	opacity:1;
	transition:opacity 0.4s ease;
}
/* 배경 */
.container .bg{
    position: absolute;
    top:0;
    left:50%;
    transform: translateX(-50%);
    width:100%;
    height:100%;
    min-height:100vh;
}
.container .bg img{
    width:100%;
}
.content {
    position: relative;
    overflow: hidden;
    width:100%;
    height:100%;
}
.content article{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:100%;
}
.pop {
    display: none;
    overflow: hidden;
    transition: left 0s 0.15s ease;
}
.pop.actived{
    display: block;
    left: 0;
    transition-delay: 0s;
}
.pop_inner{
    left: 50%;
    transform: translateX(-50%);
}
/* 동영상 팝업 기본 레이아웃 */
.pop{
    position: fixed;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    z-index: 9999;
    overflow: hidden;
    transition: left 0s 0.15s ease;  
}
.pop.actived{
    display: block;
    left: 0;
    transition-delay: 0s;
    z-index: 200;
    background: rgba(0,0,0,0.6);
}
.pop .pop_container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    z-index: 10;
}
.pop .pop_container .pop_wrap {
    position: relative;
    display: table;
    width: 100%;
    height: 100%;
    z-index: 5;
    table-layout: fixed;
}
.pop .pop_container .pop_wrap .popup_inner {
    display: table-cell;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    text-align: center;
    padding: 6.944444444vw 1.388888889vw;
}
/* header */
header {
    width:100%;
    height:13.888888889vw;
    position:fixed;
    top:0;
    left:0;
    background:rgba(0, 0, 0, 0.7);
    z-index: 151;
}
.header_wrap {
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: flex-start;
    width:100%;
    height:13.888888889vw;
    transition: height 0.25s ease-in-out;
}
.header_wrap.open {
    height:100vh;
    transition: height 0.25s ease-in-out;
}
header h1 {
    position: absolute;
    top:50%;
    left:50%;
    width:25.000000000vw;
    height:13.888888889vw;
    margin:-6.944444444vw 0 0 -12.500000000vw;
    z-index: 100
}
header h1 a{
    display: block;
    width:20.833333333vw;
    height:8.055555556vw;
    margin:0 auto;
    padding:2.916666667vw 0;
}
header h1 a img{
    width:20.833333333vw;
    height:8.055555556vw;
}
#gnb {
    position: relative;
    overflow: hidden;
    height:9.722222222vw;
}

#btn_gnb {
    position: fixed;
    top:0;
    width:13.888888889vw;
    height:13.888888889vw;
    z-index:100;
}
#gnb{
    overflow: hidden;
    position: fixed;
    top:0;
    left:-100vw;
    width:100%;
    height:calc(100% - 27.777777778vw);
    padding:13.888888889vw 0 ;
    background:url(../../../static/mo/images/bg_gnb.jpg) no-repeat 0 0;
    background-size:cover;
    /* background-size:100.000000000vw 179.166666667vw; */
    z-index: 99;
    transition: all 0.2s;
}
.open#gnb {
    left:0;
    transition: all 0.2s;
    z-index: 99;
}
.gnb_wrap {
    overflow: auto;
    position: relative;
    width: 100%;
    height:100%;
    background:url(../../../static/mo/images/bg_gnb_line.png) no-repeat 0 0.138888889vw;
    background-size:100.000000000vw 0.138888889vw;
}
.menu_box {
    overflow: auto;
    position: relative;
    width:100%;
}
.gnb_wrap ul {
    padding:3.333333333vw 0 3.333333333vw 17.361111111vw;
    width:82.638888889vw;
}

.gnb_wrap ul li {
    width:76.388888889vw;
}
.gnb_wrap ul li a{
    display: block;
    padding:3.333333333vw 0 3.333333333vw 6.250000000vw;
    width:70.138888889vw;
    text-align: left;
    background:url(../../../static/mo/images/bg_gnb_li_blt.png) no-repeat 0 center;
    background-size:5.000000000vw 5.555555556vw;
}
.gnb_wrap ul li > a img{
    width:auto;
    height:5.555555556vw;
}
.gnb_wrap ul li a:hover{
    color:#e3dcd0;
    text-shadow: #8e1111 0.138888889vw 0 1.250000000vw;
}
.gnb_wrap ul ul {
    display: block;
    width:100%;
    padding:0.694444444vw 0 2.083333333vw;
}

.gnb_wrap ul ul li {
    padding:0 0 0 5.555555556vw;
    text-align: center;
}

.gnb_wrap ul ul li a{
    position: relative;
    display: block;
    height:6.944444444vw;
    line-height: 6.944444444vw;
    padding:0.694444444vw 0 0.694444444vw 5.555555556vw;
    font-size: 3.888888889vw;
    text-align: left;
    color:#c4bba9;
    letter-spacing: -0.040em;
    background:none;
}

.gnb_wrap ul ul li a::after{
    content: "";
    display: block;
    position: absolute;
    top: 3.472222222vw;
    left: 0.694444444vw;
    width: 1.527777778vw;
    height: 1.388888889vw;
    transform: rotate(-45deg);
    background: #92856c;
}
.gnb_wrap ul ul li a:hover,
.gnb_wrap ul ul li.active a{
    color:#e3dcd0;
}

.gnb_share_box {
    width:100%;
    height:15.972222222vw;
    background:url(../../../static/mo/images/bg_gnb_line.png) no-repeat 0 0;
    background-size:100.000000000vw 0.138888889vw;
    display: flex;
    justify-content: center;
}
.gnb_share_box button{
    display: block;
    width:16.666666667vw;
    height:15.972222222vw;
    background-size:40.833333333vw 4.583333333vw;
}
.gnb_share_box button.btn_share {
    background:url(../../../static/mo/images/bg_share.png) no-repeat 5.555555556vw 5.555555556vw;
    background-size:40.833333333vw 4.583333333vw;
}

.gnb_share_box button.btn_share_yt {
    background:url(../../../static/mo/images/bg_share.png) no-repeat -12.500000000vw 5.555555556vw;
    background-size:40.833333333vw 4.583333333vw;
}

.gnb_share_box button.btn_share_kakao {
    background:url(../../../static/mo/images/bg_share.png) no-repeat -29.861111111vw 5.555555556vw;
    background-size:40.833333333vw 4.583333333vw;
}
.header_wrap .language {
    position: absolute;
    top:2.083333333vw;
    right:5.555555556vw;
    z-index: 100;
}
.lang_fix .header_wrap .language {
    position: fixed;
    top:2.083333333vw;
    right:5.555555556vw;
}
.header_wrap .language p.tit {
    line-height: 4.166666667vw;;
    font-size: 2.916666667vw;
    font-weight: normal;
    color:#92856c;
    padding:2.083333333vw 0 2.083333333vw 5.555555556vw;
    background:url(../../../static/mo/images/icon_language.png) no-repeat 0 2.361111111vw;
    background-size:3.888888889vw 3.888888889vw;
}
.header_wrap .language p.tit.on {
    color:#e3dcd0;
    background:url(../../../static/mo/images/icon_language_on.png) no-repeat 0 2.361111111vw;
    background-size:3.888888889vw 3.888888889vw;
    transition: background 0.25s;
}
.header_wrap .language .lang_list{
    margin:2.777777778vw 0 0 0;
    padding:3.472222222vw 0 0 0;
    position: fixed;
    top:8.333333333vw;
    right:5.555555556vw;
    width:34.722222222vw;
}
.header_wrap .language .lang_list span{
    position: absolute;
    top:-0.555555556vw;
    right:6.388888889vw;
    width:3.472222222vw;
    height:3.333333333vw;
}
.header_wrap .language .lang_list {
    overflow: hidden;
    height:0;
    opacity: 0;
    transition: all .15s ease-in-out;
}

.header_wrap .language .lang_list.on{
    height:auto;
    opacity: 1;
    z-index: 1;
    background:url(../images/bg_lang_box.png) no-repeat 0 bottom;
    background-size:34.722222222vw 30.555555556vw;
    transition: all .15s ease-in-out;
}
.header_wrap .language .lang_list ul {
    width:34.722222222vw;
    padding:1.388888889vw 0;
    /* border:0.138888889vw solid #41392c;
    background:#12100c; */
    z-index: 5;
}
.header_wrap .language .lang_list ul li {
    width:100%;
    height:9.027777778vw;
    padding:0;
    background:url(../../../static/mo/images/bg_language_list_line.png) no-repeat center bottom;
    background-size:35.416666667vw 0.277777778vw;
}

.header_wrap .language .lang_list ul li:last-child {
    background:none;
}

.header_wrap .language .lang_list ul li a{
    width:13.194444444vw;
    padding:0 0 0 13.888888889vw;
    height:9.027777778vw;
    line-height: 9.027777778vw;
    text-align: left;
    font-size: 3.333333333vw;
    color:#bcab91;
    background:url(../../../static/mo/images/icon_language_list.png) no-repeat 6.250000000vw center;
    background-size:6.666666667vw 5.138888889vw;
}
.header_wrap .language .lang_list ul li:hover a,
.header_wrap .language .lang_list ul li.active a {
    color: #e3dcd0;
    text-shadow: #8e1111 0.000000000vw 0.138888889vw 2.777777778vw;
    background:url(../../../static/mo/images/icon_language_list_on.png) no-repeat 6.250000000vw center;
    background-size:6.666666667vw 5.138888889vw;
}

/* main */
#main{
    position: relative;
    width:100%;
    height:100%;
}
#main .bg video {
    position: absolute;
    top:0;
    left:50%;
    width:100%;
    height:100%;
    transform: translateX(-50%);
    object-fit: cover;
}
#main .bg img{
    width:100%;
}
#main .bg::after{
    content:"";
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.1)
}
#main .content {
    width:100%;
    height:100%;
}
#main .main_box {
    width:100%;
    text-align: center;
    transform: translate(-50%, -55%);
}
.main_box .btn_play_box {
    position: relative;
    margin:7.777777778vw auto 0.000000000vw;
    width:14.583333333vw;
    height:14.583333333vw;
}
.main_box .btn_play_box button{
    display: block;
    position: relative;
    width:100%;
    height:100%;
    background:url(../../../static/mo/images/btn_main_play.png) no-repeat center center;
    background-size:14.583333333vw 14.583333333vw;
}
#main .btn_box {
    width:48.611111111vw;
    margin:7.777777778vw auto 0;
    text-align: center;
    z-index: 3;
}
#main .btn_box a {
    display: block;
    width:48.611111111vw;
    margin:0 auto 2.777777778vw;
}
#main p.rom_txt_01 {
    line-height:1.7;
    margin:4.166666667vw 0 11.111111111vw 0;
    /* font-size: 3.055555556vw; */
    font-size: 2.9vw;
    color:#e3dcd0;
    text-align: center;
    text-shadow:#000000 0.138888889vw 0 0.555555556vw;
}
#main .float_banner {
    position: fixed;
    right:0;
    bottom:0;
}
#main .float_banner a{
    display: block;
    text-align: right;
}

/* 메인 동영상 */
#main_video_pop .video_box {
    position: relative;
    display: inline-block;
    width:98%;
    height:52.777777778vw;
    margin-top:-8.333333333vw;
    border:0.138888889vw solid #988a70;
}

#main_video_pop .video_box .video_inner {
    width:100%;
    height:52.777777778vw;
    overflow: hidden;
}
#main_video_pop .video_box .video_inner iframe {
    width:100%;
    height:100%;
}
#main_video_pop .btn_pop_close {
    position: absolute;
    top:-8.333333333vw;
    right:0;
    width:6.666666667vw;;
}

/* main float banner*/
#floatBanner {
    position: fixed;
    bottom:0;
    left:0;
    width:100%;
    height:26.805555556vw;
    z-index: 50;
    opacity: 1;
}
.floatSlide {
    position: relative;
    overflow: hidden;
    width:100%;
    height:26.805555556vw;
}
.floatSlide .swiper-slide {
    position: relative;
    width:100%;
    height:100%;
}

.floatSlide .float_button_prev{
    display: none;
}
.float_button_next {
    position: absolute;
    right:6.944444444vw;
    bottom:7.638888889vw;
    width:5.555555556vw;
    height:5.555555556vw;
    background:url(../../../static/mo/images/btn_next_floatSlide.png) no-repeat 0 0;
    background-size:cover;
    z-index: 10;
}
#floatBanner .floatSlide .float_paging {
    position: absolute;
    left:auto;
    right:1vw;
    top:0;
    width:80vw;
    height:3.333333333vw;
    text-align: right;
}

#floatBanner .floatSlide .float_paging span{
    width:1.944444444vw;
    height:1.944444444vw;
    margin:0 1.388888889vw;
    border-radius: 0;
    opacity: 2;
    background:#575041;
    transform: rotate(-45deg);
    border:none;
    outline: none;
}
#floatBanner .floatSlide .float_paging span.swiper-pagination-bullet-active {
    background:#beb6a6;
}

/* 쇼케이스 팝업 - 오늘하루 다시 보지 않기 */
.showcase_banner {
    position: fixed;
    left:0;
    top:0;
    z-index:250;
    width:100%;
    height:100%;
    background:rgb(0, 0, 0, 0.6);
}
.showcase_banner .banner-outer {
    position: relative;
    width:60.555555556vw;
    height:86.527777778vw;
    top:50%;
    left:50%;
    transform: translate(-50%, -55%);
}
.showcase_banner .banner-outer .banner-inner {
    position: relative;
    margin:0 auto;
}
.showcase_banner .btn-showcase {
    position: absolute;
    left:0;
    bottom:8.888888889vw;
    width:100%;
    height:11vw;
    overflow: hidden;
}
.showcase_banner .banner-outer .banner-foot {
    position: absolute;
    bottom:0;
    left:0;
    width:100%;
    height:6.944444444vw;
}
.showcase_banner .banner-outer .banner-foot .not_today{
    display: flex;
    padding:0 0 0 3.472222222vw;
    height:6.944444444vw;
    line-height: 6.944444444vw;
}
.showcase_banner .banner-outer .banner-foot .not_today label {
    position: relative;
    padding:0 4.166666667vw 0 0;
}
.showcase_banner .banner-outer .banner-foot .not_today label p.tit{
    font-size:2.500000000vw;
    color:#c4c4c4;
}
.showcase_banner .banner-outer .banner-foot .not_today label .icon {
    position: absolute;
    top:1.805555556vw;
    right:0;
    width:3.055555556vw;
    height:3.333333333vw;
    background:url(../../../static/mo/images/bg_agr_check_box.png) no-repeat 0 center;
    background-size:3.055555556vw 3.333333333vw;
    transition:background 0.15s ease, color 0.15s ease; 
}
.showcase_banner .banner-outer .banner-foot .not_today input:checked + label .icon{
    background:url(../../../static/mo/images/bg_agr_check_box_on.png) no-repeat 0 center;
    background-size:3.055555556vw 3.333333333vw;
    transition:background 0.15s ease, color 0.15s ease; 
}
.showcase_banner .banner-outer .btn_close_showcase{
    position: absolute;
    top:0;
    right:3.472222222vw;
    font-size:2.500000000vw;
    color:#c4c4c4;
}
.showcase_banner .banner-outer .btn_close_showcase span{
    font-size: 2.500000000vw;
    color:#c4c4c4;
    height:6.944444444vw;
    line-height: 6.944444444vw;
}
.showcase_banner .banner-outer .btn_close_showcase span span{
    margin-left:0.694444444vw;
}

/* 커뮤니티 */
#m_rom.comunity-container header {
    background:#000;
    position: relative;
}
#m_rom.comunity-container #btn_gnb {
    position: absolute;
    top: 0;
    width: 13.888888889vw;
    height: 13.888888889vw;
    z-index: 100;
}
#m_rom.comunity-container section.container {
    height:auto !important;
    min-height: 150.000000000vw;
}
.community {
    overflow: hidden;
    width:100%;
    height:100%;
    background:#000000;
}
.board {
    overflow: hidden;
    height:100%;
    min-height:150.000000000vw;
    background:url(../../../static/mo/images/bg_community.jpg) no-repeat center 0;
    background-size:cover;
}
.community .tab_container {
    position: relative;
    width:100%;
    height:100%;
    min-height:100%;
    margin:0 auto;
}
.community #tab {
    position: relative;
}

.community #tab .tab_list {
    /* position: fixed;
    top:13.888888889vw;
    left:0; */
    width:100%;
    display: flex;
    justify-content: flex-start;
    z-index: 10;
}
.community #tab .tab_list li{
    width:25%;
    height:13.888888889vw;
    line-height: 13.888888889vw;
    color:#504431;
    letter-spacing: -0.05em;
    font-size: 4.444444444vw;
    text-align: center;
    border-bottom:0.138888889vw solid #cec9be;
}
.community #tab .tab_list li a,
.community #tab .tab_list li a div{
    display: block;
    line-height: 13.888888889vw;
    color:#504431;
    letter-spacing: -0.05em;
    font-size: 4.444444444vw;
}
.community #tab .tab_list li.on {
    color:#e3dcd0;
    background:#650e0e;
    border:none;
}
.community #tab .tab_list li.on a,
.community #tab .tab_list li.on a div{
    color:#e3dcd0;
}
.community .tab_content {
    overflow: auto;
    position: relative;
    width:100%;
    padding: 0 0 2.777777778vw 0;
}
.community .tab_content .box{
    display: none;
    overflow: auto;
    position: relative;
    width:100%;
}
.community .tab_content .box.on{
    display: block;
}
.community .box ul.borad_list {
    overflow: auto;
}
.community .box ul.borad_list li{
    border-bottom:0.138888889vw solid #cbc3b2;
    background: #f5f1e5;
}
.community .box ul.borad_list li a{
    display: block;
    text-align: left;
    line-height: 1.4;
    padding:3.472222222vw 4.166666667vw;
    font-size: 3.611111111vw;
    font-weight: 400;
    color:#575041;
    letter-spacing: -0.030em;
    text-decoration: none;
}

.community .box ul.borad_list li .desc{
    display: flex;
    justify-content: flex-start;
    height:4.166666667vw;
    padding:1.388888889vw 0 0 0;
}

.community .box ul.borad_list li .desc span{
    display: inline-block;
    padding:0 3.333333333vw 0 0 ;
    text-align: left;
    font-size: 2.916666667vw;
    letter-spacing: -0,030em;
    color:#575041;
}

.community .box ul.borad_list li .desc span.writer {
    font-weight: bold;
}

.community .btn_box {
    width:100%;
    text-align: center;
}
.community .btn_tbl_more {
    margin:4.166666667vw auto;
    display: inline-block;
    padding:0 11.111111111vw;
    height:9.722222222vw;
    line-height: 9.722222222vw;;
    letter-spacing: -0.030em;
    background:#650e0e;
    transition: background 0.15s
}
.community .btn_tbl_more span{
    display: inline-block;
    margin:1.388888889vw 0;
    padding:0 5.555555556vw;
    height:5.555555556vw;
    line-height: 5.555555556vw;
    color:#e9e6e1;
    font-size: 2.777777778vw;
    background: transparent;
    transition: background 0.15s;
}

/* 커뮤니티 게시판 뷰*/
.board_view {
    position: fixed;
    left:0;
    position: relative;
    width:100%;
}
.board_view .view_page {
    height: 100%;
    /* height: calc(100vh - 25.000000000vw); */
    overflow: auto;
}
.board_view .page_tit {
    width:100%;
    height: 11.111111111vw;
    line-height: 11.111111111vw;
    color:#e3dcd0;
    font-size: 4.444444444vw;
    text-align: center;
    background:#650e0e;
}
.board_view .view_head {
    width:100%;
}
.board_view .view_head .tit {
    line-height: 4.166666667vw;
    padding:2.083333333vw 2.777777778vw;
    text-align: left;
    background:#f6f2ea;
}
.view_head .tit p{
    line-height:1.4;
    padding:2.083333333vw 0 0 0;
    font-size: 3.888888889vw;
    color: #1d1a15;
    font-weight: 500;
    letter-spacing: -0.020em;
}

.board_view .data_infor {
    display: flex;
    justify-content: flex-start;
    line-height: 4.166666667vw;
    padding:0 2.777777778vw 2.083333333vw 2.777777778vw;
    text-align: left;
    border-bottom:0.277777778vw solid #cec6b6;
    background:#f7f3eb;
}
.board_view .data_infor span{
    position: relative;
    line-height: 4.166666667vw;
    font-size: 2.916666667vw;
    color:#a1998d;
    padding:0 0 0 6.111111111vw;
}
.board_view .data_infor span::before{
    content:"";
    content: "";
    display: block;
    position: absolute;
    top: 1.111111111vw;
    left: 3.194444444vw;
    width: 0.138888889vw;
    height: 2.222222222vw;
    background: #e3dcd0;
}
.board_view .data_infor .writer {
    font-size: 2.222222222vw;
    color:#575041;
    font-weight: bold;
    text-align: left;
    padding:0;
}
.board_view .data_infor .writer::before {
    display: none;
}
.board_view .data_infor .day {
}
.board_view .view_content {
    position: relative;
    /* height: calc(100vh - 56.944444444vw); */
}
.board_view .view_area {
    overflow: auto;
    height:100%;
    padding:4.166666667vw;
}
.board_view .view_content img{
    width:100%;
    height:25.000000000vw;
    /* height:41.666666667vw; */
}
.board_view .view_content p {
    font-size: 3.611111111vw;
    color:#1d1a15;
    line-height: 1.4;
    font-weight: 300;
}
.board_view .btn_go_list {
    display: block;
    width:41.666666667vw;
    height:8.333333333vw;
    margin:8.333333333vw auto 8.333333333vw;
    background:#575041;
    transition: background 0.15s;
}
.board_view .btn_go_list span{
    display: block;
    width:100%;
    height:5.555555556vw;
    line-height: 5.555555556vw;
    margin:1.388888889vw 0;
    font-size: 2.777777778vw;
    color:#e9e6e1;
    background:transparent;
    transition: background 0.15s;
}
/* 사전예약 */
#preregistration  {
    position: relative;
    width:100%;
    /* height:244.305555556vw; */
    /* overflow: hidden; */
}
#preregistration .bg{
    width:100%;
    height:249.295774648vw;
    background:url(../../../static/mo/images/bg_preregistration.jpg) no-repeat center 0;
    background-size:cover;
}
#preregistration .content{
    overflow: auto;
    position: relative;
    width:100%;
    padding:24.305555556vw 0 5.633802817vw 0;
}
#preregistration .inner_box {
    position: relative;
    width:100%;
}
#preregistration .inner_box .tit{
    width:100%;
    text-align: center;
    padding:0 0 2.816901408vw 0;
}
.pre_present_box {
    position: relative;
    width:100%;
    height:182.253521127vw;
    margin:0 0 4.929577465vw 0;
    background:url(../../../static/mo/images/bg_pre_present_box.png) no-repeat center 0;
    background-size:93.239436620vw 182.253521127vw;
}

.pre_present_box .form_box {
    padding:19.718309859vw 0 0 0;
    text-align: center;
}
.pre_present_box .pre_txt01 {
    width:100%;
    height:5.000000000vw;
    text-align: center;
    background:url(../../../static/mo/images/bg_pre_day_grad.png) no-repeat center center;
    background-size:cover;
}
.pre_present_box .pre_txt01 span {
    display: inline-block;
    position: relative;
    padding:0 13.888888889vw;
    /* height:5.å000000000vw; */
    line-height:1.3;
    font-size: 3.333333333vw;
    color:#bcab91;
    min-width: 49vw;;
    text-align: center;
}
.pre_present_box .pre_txt01 span::before{
    left:0;
    background:url(../../../static/mo/images/icon_preregistration_arrow.png) no-repeat 0 0;
}

.pre_present_box .pre_txt01 span::after {
    right:0;
    background:url(../../../static/mo/images/icon_preregistration_arrow.png) no-repeat 0 0;
    transform:rotate(-180deg)
}
.pre_present_box .pre_txt01 span::before,
.pre_present_box .pre_txt01 span::after{
    content:"";
    display: block;
    width:12.638888889vw;
    height:2.083333333vw;
    position: absolute;
    top:1.666666667vw;
    background-size:12.638888889vw 2.083333333vw;
}
.pre_present_box .btn_reservation_kakao {
    position: absolute;
    bottom:6.250000000vw;
    left:50%;
    width:70.833333333vw;
    height:9.861111111vw;
    transform: translateX( -50%);
}
#preregistration .content p.notice_btm {
    text-align: center;
    font-size: 2.535211268vw;
    color:#a1998d;
    line-height: 1.4;
    letter-spacing: -0.040em;
}




/* 사전예약 이벤트 */
#event {
    position: relative;
    width:100%;
    height:100vh;
}
#event .bg {
    background:url(../../../static/mo/images/bg_event.jpg)no-repeat center 0;
    background-size:cover;
}
#event .content {
    /* position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:100%;
    height:auto; */
}
#event .content .title {
    width:100%;
    margin:0 auto;
    text-align: center;
    padding:29.861111111vw 0 0 0;
}
#event .content .title h2 {
    position: relative;
    display: inline-block;
    height:4.166666667vw;
    line-height: 4.166666667vw;;
    padding:0 9.166666667vw;
    letter-spacing: -0.020em;
    font-size: 3.888888889vw;
    color:#e3dcd0
}
#event .content .title  h2::before,
#event .content .title  h2::after {
    content:"";
    display: block;
    position: absolute;
    width:7.222222222vw;
    height:2.083333333vw;
    top:1.250000000vw;
    background:url(../../../static/mo/images/icon_head_arrow.png) no-repeat center center;
    background-size:7.222222222vw 2.083333333vw;
}
#event .content .title  h2::before {
    left:0;
    transform: rotate(-180deg);
}
#event .content .title  h2::after {
    right:0;
}
#event .inner_box {
    position: relative;
    overflow: hidden;
    width:100%;
    padding:29.861111111vw 0 0 0;
}
#event .inner_box p{
    text-align: center;
}
#event .inner_box .tit{
    padding:1.111111111vw 0 0 0;
    text-align: center;
}
#event .inner_box .event_txt01 {
    width:100.000000000vw;
    margin:4.166666667vw auto 0;
    height:4.583333333vw;
    line-height: 4.444444444vw;
    font-size: 3.055555556vw;
    color: #beb6a6;
    text-align: center;
    background:url(../../../static/mo/images/bg_event_gra.png) no-repeat 0 0;
    background-size:100.000000000vw 4.583333333vw;
}
.event_present {
    position: relative;
    width:100.000000000vw;
    margin:10.000000000vw auto 6.944444444vw;
    overflow: hidden;
    overflow: auto;
}
.event_present {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}
.event_present::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}
.event_present .step {
    position: relative;
    width:176.388888889vw;
    height:46.250000000vw;
    background:url(../../../static/mo/images/img_event_step_00.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step img{
    width:158.611111111vw;
}
.event_present .step.step01 {
    background:url(../../../static/mo/images/img_event_step_01.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step.step02 {
    background:url(../../../static/mo/images/img_event_step_02.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step.step03 {
    background:url(../../../static/mo/images/img_event_step_03.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step.step04 {
    background:url(../../../static/mo/images/img_event_step_04.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step.step05 {
    background:url(../../../static/mo/images/img_event_step_05.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step.step06 {
    background:url(../images/img_event_step_06.png) no-repeat 1.388888889vw 0;
    background-size:158.611111111vw 46.250000000vw;
}
.event_present .step .progress_bar {
    position: absolute;
    left:6.666666667vw;
    top:0;
    width:147.638888889vw;
    height:4.305555556vw;
}
.event_present .step .progress_bar span{
    display: block;
    width:10%;
    height:4.305555556vw;
    background:url(../../../static/pc/images/event_bar_on.png) no-repeat 0 0;
    background-size:147.638888889vw 4.305555556vw;
}
.event_present .soon {
    position: absolute;
    top: 4.861111111vw;
    right: 6vw;
    width:25.277777778vw;
}
.event_present .soon img{
    width:100%;
}
.event_notice  p{
    line-height: 3.333333333vw;
    font-size: 2.500000000vw;
    text-align: center;
    font-weight: normal;
    color:#a6a6a6;
    letter-spacing: -0.040em;
}

#event .txt_infor_swipe {
    padding:12.500000000vw 0 0 0;
}

/* 캐릭터명 선점 - 메인 */

/* 캐릭터선점 이벤트클로즈*/
#closePop.pop .text_box {
    padding:1.111111111vw;
    width:86.111111111vw;
    border:0.138888889vw solid #92856c;
    background:#26221b
}
#closePop.pop .text_box .text_inner {
    padding:16.666666667vw 0 16.666666667vw 0;
    border:0.138888889vw solid #453d30;
}
#closePop.pop .text_box .text_inner p {
    font-size: 4.166666667vw;
    line-height:4.444444444vw;
    padding:2.083333333vw 0;
    color:#e3dcd0;
    letter-spacing: -0.020em;
}
#closePop.pop .text_box .text_inner .btn_box {
    margin:9.722222222vw auto 0;
}
#closePop.pop .text_box .text_inner .btn_box button {
    border: none;
    background: none;
    color: #c1aa86;
    font-size: 3.611111111vw;
    line-height: 4.166666667vw;
}

#eventChar {
    height:100%;
    min-height:100vh;
}
#eventChar .content{
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1;
}
.event_charactor {
    position: relative;
    width:100%;
    min-height:100vh;
    padding:23.611111111vw 0 17vw 0;
}
.event_charactor .inner_box{
    width:100%;
    height:100%;
    position: relative;
}
.event_charactor .tit{
    width:100%;
    margin:0 0 3.472222222vw 0;
}
.event_charactor .txt01 {
    width:100%;
    text-align: center;
    padding:0 0 4.861111111vw 0;
}
.event_charactor .txt01 p{
    position: relative;
    display: inline-block;
    padding:0 10.000000000vw;
    font-size: 3.055555556vw;
    line-height: 1.4;
    letter-spacing: -0.020em;
    color:#e0d6c6;
    text-shadow: #000 0.138888889vw 0 0.694444444vw;
}
.event_charactor .txt01 p::before{
    content:"";
    display: block;
    position: absolute;
    top:0.833333333vw;
    left:0;
    width:8.750000000vw;
    height:3.194444444vw;
    background:url(../images/icon_event_cha_arrow_left.png) no-repeat 0 center;
    background-size:cover;
}
.event_charactor .txt01 p::after{
    content:"";
    display: block;
    position: absolute;
    top:0.833333333vw;
    right:0;
    width:8.750000000vw;
    height:3.194444444vw;
    background:url(../images/icon_event_cha_arrow_right.png) no-repeat 100% center;
    background-size:cover;
}
.event_charactor .txt01 span{
    display: block;
    width:100%;
    text-align: center;
    font-size: 3.055555556vw;
    line-height: 1.4;
    letter-spacing: -0.020em;
    color:#e0d6c6;
    text-shadow: #000 0.138888889vw 0 0.694444444vw;
}
.charactor_cert_box {
    overflow: hidden;
    width:91.666666667vw;
    margin:0 auto;
    border-radius: 0.694444444vw;
    background:rgba(19, 16, 16, 0.4);
}
.event_charactor .form_box {
    width:100%;
    /* background:rgba(19, 16, 16, 0.3); */
    background:url(../images/bg_event_form_box.png) repeat;
    background-size:0.138888889vw 0.138888889vw;
}
.event_charactor .form_box .inner_form_box {
    overflow: hidden;
    width:100%;
}
.event_charactor .form_box .cert_tit {
    padding:4.166666667vw 0 2.083333333vw;
    text-align: center;
}
.cert_desc {
    font-size: 2.500000000vw;
    text-align: center;
    line-height: 3.055555556vw;
    letter-spacing: -0.020em;
    color:#e0d6c6;
    font-weight: 500;
    margin:0 0 2.777777778vw 0;
    text-shadow: #000 0.138888889vw 0 0.833333333vw;
}
.charactor_cert_box .inner_form_box .input_box{
    display: flex;
    justify-content: space-between;
    position: relative;
    width:80.972222222vw;
    height:5.694444444vw;
    margin:2.083333333vw auto 0;;
    background:url(../images/bg_input_box_line.png) no-repeat 0 100%;
    background-size:55.972222222vw 0.277777778vw;
}
.charactor_cert_box .inner_form_box .input_box input {
    width:55.972222222vw;
    height:5.694444444vw;
    text-align: center;
    font-size: 16px;
    letter-spacing: -0.040em;
    color:#c6b59b;
    background:transparent;
    border:none;
    outline:none;
}
.charactor_cert_box .inner_form_box .input_box input::placeholder {
    font-size: 2.222222222vw;
    letter-spacing: -0.040em;
    color:#c6b59b;
}
.charactor_cert_box .inner_form_box .input_box input::-moz-placeholder {
    font-size: 2.222222222vw;
    letter-spacing: -0.040em;
    color:#c6b59b;
}
.charactor_cert_box .inner_form_box .input_box input::-webkit-input-placeholder{
    font-size: 2.222222222vw;
    letter-spacing: -0.040em;
    color:#c6b59b;
}
.charactor_cert_box .inner_form_box .input_box .btn{
    width:24.027777778vw;
    height:5.694444444vw;
    text-align: center;
    color:#dacab2;
    background:url(../images/bg_cha_cert_check.png) no-repeat center center;
    background-size:cover;
}
.charactor_cert_box .inner_form_box .input_box .btn span{
    line-height: 5.694444444vw;
    font-size:2.500000000vw;
    letter-spacing: -0.040em;
    background: #620E0E;
    background: linear-gradient(to bottom, #efe8db 38%, #d4ba89 70%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.charactor_cert_box .inner_form_box .agree_wrap  {
    position: relative;
    width:80.555555556vw;
    padding:3.472222222vw 0 0 0;
    margin:0 auto;
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox {
    display: flex;
    padding:0.694444444vw 0;
    line-height: 3.333333333vw;
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox label{
    position: relative;
    display: flex;
    justify-content: flex-start;
    padding:0 0 0 4.166666667vw;
    line-height: 3.333333333vw;
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox label .icon {
    position: absolute;
    top:0.000000000vw;
    left:0;
    width:3.055555556vw;
    height:3.333333333vw;
    background:url(../images/bg_agr_check_box.png) no-repeat 0 0;
    background-size:3.055555556vw 3.333333333vw;
    transition:background 0.15s ease, color 0.15s ease; 
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox label .tit {
    display: inline-block;
    color:#beb6a6;
    font-size: 2.500000000vw;
    margin:0;
    letter-spacing: -0.020em;
    text-align: left !important;
    line-height: 3.333333333vw;
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox  input:checked + label .icon{
    position: absolute;
    top:0.000000000vw;
    left:0;
    width:3.055555556vw;
    height:3.333333333vw;
    background:url(../images/bg_agr_check_box_on.png) no-repeat 0 0;
    background-size:3.055555556vw 3.333333333vw;
    transition:background 0.15s ease, color 0.15s ease; 
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox  input:checked + label .tit{
    font-weight: 500;
    color: #e3dcd0;
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box .btn_more{
    display: block;
    min-width:13.888888889vw;
    font-size: 2.500000000vw;
    padding:0 0 0 0.694444444vw;
    line-height: 3.333333333vw;
    color:#beb6a6;
    letter-spacing: -0.020em;
}
.charactor_cert_box .inner_form_box .agree_wrap .agree_box.input_checkBox  input:checked + label .btn_more,
.charactor_cert_box .inner_form_box .agree_wrap .agree_box .btn_more:hover {
    font-weight: 500;
    color: #e3dcd0;
}
.charactor_cert_box .inner_form_box .btn_box{
    width:100%;
    display: flex;
    justify-content: center;
    padding:4.166666667vw 0;
}
.charactor_cert_box .inner_form_box .btn_box button{
    overflow: hidden;
    height:10.000000000vw;
}
.charactor_cert_box .inner_form_box .btn_box .btn_choice_char {
    width:41.111111111vw;
}
.charactor_cert_box .inner_form_box .btn_box .btn_check_char {
    width:41.111111111vw;
}
.event_charactor .notice_wrap {
    width:99.166666667vw;
    margin:5.555555556vw auto 0;
}
.event_charactor .notice_wrap p.tit{
    font-size:2.500000000vw;
    color:#ede7dc;
    line-height: 5.555555556vw;
    letter-spacing: -0.040em;
    padding:0.694444444vw 0 0.694444444vw 4.861111111vw;
    margin:0;
    text-align: left;
    text-shadow: #000 0.138888889vw 0 1.250000000vw;
}
.event_charactor .notice_wrap ul {
    margin-left:2.777777778vw;
}
.event_charactor .notice_wrap ul li{
    font-size: 2.500000000vw;
    line-height: 1.5;
    padding:0 0 0 2.777777778vw;
    text-indent:-1.527777778vw;
    letter-spacing: -0.045em;
    color:#cdc9c1;
    font-weight: 300;
    text-shadow: #000 0.138888889vw 0 1.250000000vw;
}
.event_charactor .notice_wrap ul li span{
    display: inline-block;
    font-size: 2.500000000vw;
    line-height: 1.5;
    padding:0 0 0 2.500000000vw;
    text-indent:-1.527777778vw;
    letter-spacing: -0.042em;
    color:#cdc9c1;
    font-weight: 500;
    text-shadow: #000 0.138888889vw 0 1.250000000vw;
}
.event_charactor .notice_wrap ul li a{
    display: inline-block;
    font-size: 2.500000000vw;
    line-height: 1.5;
    padding:0 0 0 2.500000000vw;
    text-indent:-1.527777778vw;
    letter-spacing: -0.042em;
    color:#cdc9c1;
    font-weight: 500;
    text-shadow: #000 0.138888889vw 0 1.250000000vw;
}
#event_agr01.pop .text_box {
    width:83.333333333vw;
    padding:4.166666667vw 2.638888889vw 4.166666667vw 2.638888889vw;
}
#event_agr01.pop .text_box .text_inner {
    padding:0;
}
#event_agr01.pop .text_box .text_inner .tit{
    font-size: 2.083333333vw;
    line-height: 3.888888889vw;
    color:#efebe4;
    padding:2.777777778vw 0 0 0;
}
#event_agr01.pop .text_box .text_inner p{
    display: block;
    font-size: 1.944444444vw;
    line-height: 3.055555556vw;
    color:#a1998d;
    text-align: left;
}
#event_agr01.pop .text_box .text_inner p a{
    display: inline-block;
    font-size: 1.944444444vw;
    line-height: 3.055555556vw;
    color:#a1998d;
    font-weight: 500;
}
#event_agr01.pop .text_box .text_inner ul li{
    display: block;
    font-size: 1.944444444vw;
    line-height: 3.055555556vw;
    color:#a1998d;
    text-align: left;
    padding:0 0 0 2.083333333vw;
    text-indent:-2.083333333vw;
}
.event_cha.pop .btn_pop_close img{
    width:3.750000000vw;
}
.event_cha.pop .text_box {
    position: relative;
    display: inline-block;
    margin-top: -6.944444444vw;
    border: 0.138888889vw solid #575041;
    background: #1d1a15;
}
.event_cha.pop .btn_pop_close {
    position: absolute;
    top: 0;
    right: 0;
    width: 8.333333333vw;
    height: 8.333333333vw;
}

/* 이벤트 캐릭터 선점 - 서버 및 클래스 선택 */
#eventCharChoice {
    position: relative;
    width:100%;
    min-height:100vh;
}
#eventCharChoice .content{
    position: relative;
    /* height:100vh; */
    /* overflow-y: auto;
    overflow-x: hidden; */
    z-index: 10;
    padding:28.472222222vw 0 13.888888889vw 0;
}
#eventCharChoice .bg{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}
#eventCharChoice .bg img{
    height:auto;
    min-height:100%;
}
.event_charactor_choice {
    width:100%;
    position: relative;
    padding:0 0 6.944444444vw;
}
.event_charactor_choice .tit {
    position: relative;
    display: inline-block;
    width:100%;
    text-align: center;
}

/* server_wrap */
.server_wrap {
    width:100%;
    text-align: center;
}
.server_wrap .txt01 {
    padding:4.166666667vw 0 3.472222222vw 0;
    font-size: 3.055555556vw;
    line-height: 4.166666667vw;
    letter-spacing:0;
    color:#433021;
    text-align: center;
    font-weight: 500;
}
.server_wrap .txt01 span.point{
    display: inline-block;
    font-size: 3.055555556vw;
    line-height: 4.166666667vw;
    letter-spacing:0;
    color:#700303;
    text-align: center;
    font-weight: 500;
}

.server_date_wrap {
    position:relative; 
    display:flex; 
    width:100%;
    margin-top:4.25vw;
}
.server_date_wrap .btn-dropdown-nav {
    overflow:hidden;
    position:relative; 
    display:inline-flex; 
    align-items:center; 
    width:81.111111111vw;
    height:7.083333333vw;
    line-height: 7.083333333vw;
    padding:0;
    margin:0 auto;
    font-size:3.055555556vw;
    text-align: center;
    white-space:nowrap; 
    color:#d0c8b8; 
    box-sizing:border-box; 
    transition:background 0.25s ease, border 0.25s ease, color 0.25s ease; 
}
.server_date_wrap .btn-dropdown-nav span{
    border-radius: 0.416666667vw;
    flex:1; 
    width:81.111111111vw;
    padding:0;
    margin:0;
}
.server_date_wrap .btn-dropdown-nav .txt {
    display:block; 
    overflow:hidden; 
    text-align: center;
    color:#333333;
    font-size:3.055555556vw;
    color:#d0c8b8;
    text-overflow: ellipsis; 
    background: linear-gradient(#5b5a53, #46453f);
}
.server_date_wrap .btn-dropdown-nav .tit {
    font-size: 3.333333333vw;
    text-align: center;
    color:#f8f5ef;
    background: linear-gradient(#91836b, #7a6d54);
}
.server_date_wrap .btn-dropdown-nav .state {
    display: none;
}
.server_date_wrap .btn-dropdown-nav .recom {
    display: none;
}
.server_date_wrap .server-data {
    position:fixed; 
    bottom:0;
    left:0; 
    min-width:100%; 
    width:100%;
    height:100%;
    visibility:hidden; 
    opacity:0;  
    border-radius: 1.388888889vw 1.388888889vw 0 0;
    transition:visibility 0s 0.25s ease, opacity 0.25s 0s ease;
    z-index:250; 
}
.server_date_wrap.actived .server-data {
    overflow: hidden;
    visibility:visible; 
    opacity:1; 
    z-index:99999; 
    background:rgba(0, 0, 0, 0.6);
    transition:visibility 0s 0s ease, opacity 0.25s 0s ease;
}
.server_date_wrap .server-data-inner {
    overflow: hidden;
    position:absolute; 
    bottom:0;
    left:0;
    margin:0;
    padding:6.944444444vw 5.555555556vw 1.388888889vw 5.555555556vw;
    border-radius: 3.5vw 3.5vw 0 0;
    background:#1d1a15;
    border:2px solid #92856c;
    box-sizing: content-box;
}
.server_date_wrap .server-data-inner::after {
    content:"";
    display: block;
    position: absolute;
    top:15px;
    left:50%;
    width:80px;
    height:4px;
    margin-left:-40px;
    border-radius: 8px;
    background:#5d5548;
}
.server_date_wrap .server_list {
    width:100%;
    max-height:68vw;
    overflow-y:auto;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.server_date_wrap .sv_conts  {
    position: relative;
    width:100%;
    height:9.444444444vw;
    line-height: 9.444444444vw;
    box-sizing: content-box;
}

.server_date_wrap .sv_conts.actived {
    background:#2d2923;
}
.server_date_wrap .btn-server-choice {
    position: relative;
    width:100%; 
    padding:0 17.361111111vw 0 11.111111111vw;
    height:9.444444444vw;
    line-height: 9.444444444vw; 
    color:#3F3F46; 
    box-sizing: border-box;
}
.server_date_wrap .sv_conts .recom {
    position: absolute;
    top:0;
    left:0;
    width:11.111111111vw;
    font-size: 2.916666667vw;
    line-height: 9.444444444vw;
    text-align: center;
    color:#d32d2d;
    font-weight: 500;
}
.server_date_wrap .sv_conts .tit{
    display: block;
    display: flex;
    align-items: center;
    line-height: 9.444444444vw;
    padding:0;
    font-size: 3.888888889vw;
    color:#efebe4;
    text-align: left;
    font-weight: 500;
}
.server_date_wrap .sv_conts .tit span{
    display: block;
    font-size: 100%;
}
.server_date_wrap .sv_conts .tit .contry {
    padding:0 1.388888889vw;
    line-height: 9.444444444vw;
    font-size: 2.500000000vw;
    color:#30f1f8;
}
.server_date_wrap .sv_conts .state {
    display: block;
    position: absolute;
    top:0;
    right:0;
    width:auto;
    min-width:auto;
    height:100%;
    line-height: 9.444444444vw;
    text-align: right;
    padding:0 2.083333333vw 0 4.166666667vw;
    font-size: 2.5vw;
    color:#5cff46;
    font-weight: 500;
}
.server_date_wrap .sv_conts .state span{
    font-size:100%;
}
.server_date_wrap .sv_conts .state{
    display: inline-block;
    background:url(../images/icon_server_state_ok.png) no-repeat 0 3.194444444vw;
    background-size:3.194444444vw 3.194444444vw;
}
.sv_conts.almost_full .state{
    color:#fdff46;
    background:url(../images/icon_server_state_almost.png) no-repeat 0 3.194444444vw;
    background-size:3.194444444vw 3.194444444vw;
}
.server_date_wrap .sv_conts.disabled  .tit {
    color:#838282;
}
.sv_conts.disabled .state{
    color:#838282;
    background:url(../images/icon_server_state_disabled.png) no-repeat 0 3.194444444vw;
    background-size:3.194444444vw 3.194444444vw;
}
.sv_conts:hover .list_inner,
.sv_conts.choice .list_inner{
    transition: background 0.3s;
    background:url(../images/bg_server_state_ok.png) no-repeat center center;
    background-size:27.777777778vw 11.111111111vw;
}
/* 서버 선택 불가*/
.sv_conts.disabled {
    pointer-events: none;
}
.sv_conts.disabled .list_inner,
.sv_conts.disabled:hover .list_inner{
    background:url(../images/bg_server_list_disabed.png) repeat-x center center;
}


/* 캐릭터(클래스) 선택 */
.class_choice_wrap {
    width:100%;
    text-align: center;
    margin:4.166666667vw 0 0 0;
}
.class-data-inner .class_list {
    width:81.666666667vw;
    margin:3.472222222vw auto 3.472222222vw;
    display: flex;
    justify-content: space-between;
}
.class-data-inner .cl_conts{
    width:25.833333333vw;
    height:41.944444444vw;
    margin:0 0.972222222vw;
    border-radius: 0.833333333vw;
    overflow: hidden;
}
.class-data-inner .cl_conts label  {
    display: block;
    width:25.833333333vw;
    height:41.944444444vw;
}
.class-data-inner .cl_conts:hover {
    box-shadow: 0.555555556vw 0.416666667vw 1.111111111vw #666;
}
.class-data-inner .cl_conts.choice_knight label .img {
    display: block;
    width:25.833333333vw;
    height:41.944444444vw;
    background:url(../images/img_char_choice_off.png) no-repeat 0 0;
    background-size:81.666666667vw 43.611111111vw;
}
.class-data-inner .cl_conts.choice_knight  input:checked + label .img {
    transition: background 0.3s;
    background:url(../images/img_char_choice_on.png) no-repeat  0 0;
    background-size:81.666666667vw 43.611111111vw;
}

.class-data-inner .cl_conts.choice_ranger label .img {
    display: block;
    width:25.833333333vw;
    height:41.944444444vw;
    background:url(../images/img_char_choice_off.png) no-repeat -27.916666667vw 0;
    background-size:81.666666667vw 43.611111111vw;
}
.class-data-inner .cl_conts.choice_ranger  input:checked + label .img {
    transition: background 0.3s;
    background:url(../images/img_char_choice_on.png) no-repeat -27.916666667vw 0;
    background-size:81.666666667vw 43.611111111vw;
}
.class-data-inner .cl_conts.choice_magician label .img {
    display: block;
    width:25.833333333vw;
    height:41.944444444vw;
    background:url(../images/img_char_choice_off.png) no-repeat -55.972222222vw 0;
    background-size:81.666666667vw 43.611111111vw;
}
.class-data-inner .cl_conts.choice_magician  input:checked + label .img {
    transition: background 0.3s;
    background:url(../images/img_char_choice_on.png) no-repeat -55.972222222vw 0;
    background-size:81.666666667vw 43.611111111vw;
}

.event_charactor_choice .class_choice_wrap .btn_box {
    width:52.777777778vw;
    margin:2.777777778vw auto 6.250000000vw;
}
.event_charactor_choice .class_choice_wrap .btn_box a.btn_cls_infor_detail {
    display: block;
    width:100%;
    line-height: 6.944444444vw;
    color:#fff5e7;
    font-size:2.777777778vw;
    font-weight: 500;
    border:0.138888889vw solid #968f7f;
    border-radius: 0.416666667vw;
    background:#968f7f;  
}
.event_charactor_choice .form_box {
    display: flex;
    justify-content: space-between;
    width:81.111111111vw;
    height:6.666666667vw;
    margin:2.083333333vw auto 2.083333333vw;
}
.event_charactor_choice .form_box .input_box{
    width:59.722222222vw;
    height:6.388888889vw;
    line-height: 6.388888889vw;
    border:0.138888889vw solid #988f80;
    background:#575041;
    border-radius: 0.416666667vw;
    box-shadow: 0.000000000vw 0.138888889vw 0.555555556vw #666;
    /* box-shadow: 0.000000000vw 0.138888889vw 0.555555556vw #666; */
}
.event_charactor_choice .form_box .input_box input{
    width:55.833333333vw;
    padding:0 1.388888889vw 0 2.777777778vw;
    height:6.666666667vw;
    line-height: 6.666666667vw;
    font-size:16px;
    color:#beb6a6;
    text-align: left;
    font-weight: 500;
    border:none;
    outline:none;
    background:none;
}
.event_charactor_choice .form_box .input_box input::placeholder {
    font-size:2.222222222vw;
    color:#beb6a6;
}
.event_charactor_choice .form_box .input_box input::-webkit-input-placeholder{
    font-size:2.222222222vw;
    color:#beb6a6;
}
.event_charactor_choice .form_box .input_box input::-moz-placeholder {
    font-size:2.222222222vw;
    color:#beb6a6;
}
.event_charactor_choice .form_box button.btn_char_name_check {
    width:19.583333333vw;
    font-size: 3.055555556vw;
    line-height: 6.666666667vw;
    height:6.666666667vw;
    color:#dacab2;
    background:url(../images/bg_btn_char_name_check.png) no-repeat center 0;
    background-size:cover;
    box-shadow: 0.000000000vw 0.138888889vw 0.555555556vw #666;
}
.event_charactor_choice .notice_wrap {
    width:81.111111111vw;
    margin: 0 auto 1.388888889vw;
    text-align: left;
}
.event_charactor_choice .notice_wrap li{
    font-size: 2.500000000vw;
    text-align: left;
    line-height: 3.888888889vw;
    letter-spacing: -0.040em;
    color:#575041;
    font-weight: 400;
    padding:0 0 0 1.388888889vw;
    text-indent:-1.388888889vw;
}
.event_charactor_choice .btn_get_char_tit {
    display: block;
    width:51.250000000vw;
    margin:0 auto;
    padding:2.777777778vw 0 0 0;
    text-align: center;
}
.event_charactor_choice .btn_box button{
    display: block;
    width:54.583333333vw;
    margin:0 auto;
}

.chr_choice.pop .pop_box {
    position: relative;
    display: inline-block;
    width:71.111111111vw;
    padding:5.75vw 0 0 0;
    background:url(../images/bg_pop_cha_choice.png) no-repeat center 0;
    background-size:72.361111111vw 124.444444444vw;
}
.chr_choice.pop .pop_box .choice_inner {
    width:60.000000000vw;
    padding:0 5.555555556vw 4.25vw 5.555555556vw;
    background:url(../images/bg_pop_cha_choice.png) no-repeat center 100%;
    background-size:72.361111111vw 124.444444444vw;
}
.chr_choice .choice_inner .tit {
    margin:0 0 2.777777778vw 0;
    width:60.138888889vw;
}
.chr_choice .choice_inner .tit p{
    line-height: 1.4;
    font-size: 3.750000000vw;
    text-align: center;
    letter-spacing:-0.030em;
    font-weight: 600;
    background: linear-gradient(to bottom, #efe8db 38%, #d4ba89 70%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.chr_choice .choice_inner .tit p span{
    line-height: 1.4;
    font-size: 3.750000000vw;
    text-align: center;
    letter-spacing:-0.030em;
    font-weight: 600;
    background: linear-gradient(to bottom, #efe8db 38%, #d4ba89 70%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.chr_choice .choice_inner dl {
    height:6.666666667vw;
    display: flex;
    margin:0 0 1.805555556vw 0;
}
.chr_choice .choice_inner dt,
.chr_choice .choice_inner dd {
    height:6.944444444vw;
    line-height: 6.944444444vw;
    font-size: 2.500000000vw;
    letter-spacing:-0.030em;
    text-align: center;
    font-weight: 500;
}
.chr_choice .choice_inner dt {
    width:18.055555556vw;
    color:#cec6b7;
    background:#6b6250;
}
.chr_choice .choice_inner dd {
    width:41.944444444vw;
    color:#e9e6e1;
    background:#3e392d;
}
.chr_choice .choice_inner dl.code_check dd {
    overflow: hidden;
    position: relative;
    width:29.166666667vw;
    text-align: right;
    padding:0 12.777777778vw 0 0;
}
.chr_choice .choice_inner dl.code_check dd span{
    height:6.944444444vw;
    line-height: 6.944444444vw;
    font-size: 2.500000000vw;
    letter-spacing:-0.030em;
    text-align: center;
    font-weight: 500;
    color:#e9e6e1;
    display: block;
    box-sizing: content-box;
    text-align: center;
    padding:0 0.694444444vw;
}
.chr_choice .choice_inner dl.code_check dd button{
    overflow: hidden;
    position: absolute;
    top:0;
    right:1.388888889vw;
    width:auto;
    min-width:7.500000000vw;
    height:6.666666667vw;
    line-height: 7.222222222vw;
    font-size: 2.222222222vw;
    margin:0;
    padding:0 0 0 1.388888889vw;
    color:#dbc6a5;
    letter-spacing:-0.030em;
    font-weight: 500;
    background:none;
    border:none;
    outline:none;
}
.chr_choice .choice_inner .img_char_choice_infor {
    margin:1.388888889vw auto 2.083333333vw;
    margin:1.388888889vw auto 0;
    width:59.722222222vw;
}
.chr_choice .choice_inner .img_char_choice_infor2 {
    margin:1.388888889vw auto 4.166666667vw;
    width:59.722222222vw;
}
.chr_choice .choice_inner .ad_infor_box {
    padding:0 0 2.25vw 0;
    text-align: center;
}
.chr_choice .choice_inner .ad_infor_box p {
    font-size: 1.944444444vw;
    color:#dacab2;
    text-align: center;
    line-height: 3.055555556vw;
}
.chr_choice .choice_inner .ad_infor_box p.today{
    padding:1.25vw 0 0 0;
}
.chr_choice .choice_inner .ad_infor_box p.ad_infr_desc{
    color:#8a8378;
    line-height: 3.333333333vw;
    padding:1.25vw 0 0 0;
}
.chr_choice .choice_inner .btn_box {
    width:100%;
    display: flex;
    justify-content: center;
}
.chr_choice .choice_inner button{
    width:25.000000000vw;
    line-height: 5.000000000vw;
    height:5.000000000vw;
    font-size: 2.500000000vw;
    margin:0 1.111111111vw;
    letter-spacing:-0.030em;
    color:#e3dcd0;
    text-align: center;
    font-weight: 500;
    text-shadow: #000 0 0.138888889vw 1.250000000vw;
    background:url(../images/bg_btn_cha_choice_pop.png) no-repeat center center;
    background-size:cover;
}

/* 게임소개*/
.game_information {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.game_information .infor_inner_box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    display: flex;
    z-index: 50;
    background: #000;
}
.game_information .infor_inner_box .game_bg {
    position: relative;
    height:100%;
    flex: 0 0 auto;
}
.game_information .infor_inner_box .game_bg img{
    height: 100%;
    width:auto;
    max-width:none;
}
.game_information .txt_swipe_info{
    position: absolute;
    bottom:23.611111111vw;
    left:0;
    width:100%;
    z-index: 50;
}
.game_information .btn {
	position:absolute;
	display:block;
	z-index:5;
	background:rgba(255,255,255,0);
}

.game_information .btn.btn_class {
	top:11.4%;
	left:9.8%;
	width:28.2%;
	height:48.3%;
}

.game_information .btn.btn_world {
	top:45.6%;
	left:44.0%;
	width:13.1%;
	height:19.2%;
}

.game_information .btn.btn_story {
	top:45.2%;
	left:58.6%;
	width:26.9%;
	height:38.8%;
}

/* story 세계관 */
#story {
    position: relative;
    width:100%;
    height:100%;
}
.world_story{
    position: relative;
    width:100%;
    height:100%;
    /* min-width:266.666666667vw;
    min-height:125.000000000vw;
    left:50%;
    transform: translateX(-50%); */
}
.storySwiper {
    width:100% !important;
    height:100%;
    overflow: hidden;
}
.storySwiper .swiper-slide {
    width:100.000000000vw !important;
    height:100%;
    margin:0 !important;
    padding:0 !important;
    overflow: hidden;
}
.storySwiper .swiper-slide.swiper-slide-active {
    position: relative;
    width:100.000000000vw !important;
    height:100%;
    z-index: 10;
}
.storySwiper .swiper-slide .inner_slider_content {
    overflow: hidden;
    position: relative;
    width:100.000000000vw !important;
    /* min-width:100% !important; */
    height:100%;
    left:50%;
    transform: translateX(-50%);
}
.storySwiper .swiper-slide .bg{
    width:100.000000000vw;
    height:100%;
    position: relative;
    overflow: hidden;
    top:0;
    left:50%;
    transform: translateX(-50%);
}

.storySwiper .swiper-slide .bg img{
    width:100.000000000vw;
    position: relative;
    transform: scale(1.4);
    transition: transform 3.5s 0.15s, opacity 0.25s;
}
.storySwiper .swiper-slide.swiper-slide-active .bg img{
    width:100%;
    transform: scale(1);
}
.storySwiper .swiper-slide .txt_area {
    position: absolute;
    top:76.388888889vw;
    left:0;
    width:100%;
    text-align: center;
    opacity: 0;
    transform: translateY(9.722222222vw);
    transition: opacity 1s,transform 2s 0.15s;
}
.storySwiper .swiper-slide.swiper-slide-active .txt_area {
    opacity: 1;
    transform: translateY(0.000000000vw);
}

.storySwiper .swiper-slide .txt_area .tit {
    margin:0 0 2.083333333vw 0;
}
.storySwiper .swiper-slide .txt_area p {
    line-height: 1.8;
    font-size: 2.222222222vw;
    color:#e3dcd0;
    text-align: center;
    text-shadow: #000000 0.138888889vw 0.694444444vw 0.972222222vw;
}

.storySwiper .swiper-slide .txt_area .term{
    padding:0 0 1.388888889vw 0;
}

.storySwiper .story_button_next ,
.storySwiper .story_button_prev {
    position: absolute;
    top:50%;
    width:8.333333333vw;
    height:8.333333333vw;
    margin-top:-1.388888889vw;
    z-index: 5;
} 
.storySwiper .story_button_next {
    right:4.166666667vw;
    background:url(../../../static/mo/images/btn_story_next_on.png) no-repeat center center;
    background-size:8.333333333vw 8.333333333vw;
    transition: background 0.5s;
} 
.storySwiper .story_button_prev {
    left:4.166666667vw;
    background:url(../../../static/mo/images/btn_story_prev_on.png) no-repeat center center;
    background-size:8.333333333vw 8.333333333vw;
    transition: background 0.5s;
}
/* .storySwiper .story_button_next.swiper-button-disabled ,
.storySwiper .story_button_prev.swiper-button-disabled {
    opacity: 0 !important;
} */

/* paging */
#story .storySwiper .story_paging {
    position: absolute;
    bottom:23.611111111vw;
    left:0;
    width:95.000000000vw;
    height:9.027777778vw;
    z-index: 5;
    padding-left:5vw;
    background:url(../../../static/mo/images/btn_story_line.png) no-repeat -2.5vw 3.75vw;
    background-size:100.000000000vw 4.027777778vw;
}
.storySwiper .story_paging span {
    position: relative;
    width:18.055555556vw;
    height:5.555555556vw;
    padding:3.472222222vw 0 0 0;
    margin: 0 !important;
    border:none;
    border-radius: 0;
    background: none;
    opacity: 1;
}
.storySwiper .story_paging span i.icon{
    position: absolute;
    top:0;
    right:-0.694444444vw;
    width:4.583333333vw;
    height:5.555555556vw;
    padding:3.472222222vw 0 0 0;
    background:url(../../../static/mo/images/btn_story_paging.png) no-repeat 100% 3.194444444vw;
    background-size:100%;
    transition: background 0.3s;
}
.storySwiper .story_paging span.swiper-pagination-bullet-active i.icon,
.storySwiper .story_paging span i.icon:hover{
    background:url(../../../static/mo/images/btn_story_paging_on.png) no-repeat 100% 3.194444444vw;
    background-size:100%;
    transition: background 0.3s;
}
.storySwiper .story_paging span.still i.icon{
    background:url(../../../static/mo/images/btn_story_paging_on.png) no-repeat 100% 3.194444444vw;
    background-size:100%;
    transition: background 0.3s;
}
.storySwiper .story_paging span .txt{
    display: block;
    position: absolute;
    top:0;
    padding:0;
    transition: background 0.1s;
}
.storySwiper .story_paging span.swiper-pagination-bullet-active b,
.storySwiper .story_paging span.still b {
    position: absolute;
    top:6.250000000vw;
    left:0;
    width:99%;
    height:0.138888889vw;
    background:#e5d2ad;
    opacity: 0.5;
}
.storySwiper .story_paging span.slide1 {
    width:11.111111111vw;
    margin-left:5.555555556vw;
}
.storySwiper .story_paging span.slide1 .txt{
    width:5.416666667vw;
    height:2.361111111vw;
    right:-0.416666667vw;
    background:url(../../../static/mo/images/tit_story_01.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide1.still .txt,
.storySwiper .story_paging span.slide1 i.icon .txt:hover,
.storySwiper .story_paging span.slide1 i.icon:hover .txt,
.storySwiper .story_paging span.slide1.swiper-pagination-bullet-active .txt{
    background:url(../../../static/mo/images/tit_story_01_on.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide1 b {
    left:0.694444444vw;
    width:10.277777778vw;
}
.storySwiper .story_paging span.slide1::after {
    content:"";
    display: block;
    width:2.777777778vw;
    height:2.777777778vw;
    position: absolute;
    top:4.861111111vw;
    left:-0.972222222vw;
    background:url(../../../static/mo/images/btn_story_line_blt.png) no-repeat 0 0;
    background-size:cover;
    z-index: 5;
}

.storySwiper .story_paging .slide2 {

}

.storySwiper .story_paging span.slide2 .txt{
    width:4.722222222vw;
    height:2.500000000vw;
    right:-0.138888889vw;
    background:url(../../../static/mo/images/tit_story_02.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide2.still .txt,
.storySwiper .story_paging span.slide2 i.icon .txt:hover,
.storySwiper .story_paging span.slide2 i.icon:hover .txt,
.storySwiper .story_paging span.slide2.swiper-pagination-bullet-active .txt{
    background:url(../../../static/mo/images/tit_story_02_on.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging .slide3 {

}

.storySwiper .story_paging span.slide3 .txt{
    width:4.583333333vw;
    height:2.500000000vw;
    right:0.000000000vw;
    background:url(../../../static/mo/images/tit_story_03.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide3.still .txt,
.storySwiper .story_paging span.slide3 i.icon .txt:hover,
.storySwiper .story_paging span.slide3 i.icon:hover .txt,
.storySwiper .story_paging span.slide3.swiper-pagination-bullet-active .txt {
    background:url(../../../static/mo/images/tit_story_03_on.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging .slide4{

}
.storySwiper .story_paging span.slide4 .txt{
    width:4.722222222vw;
    height:2.361111111vw;
    right:0.000000000vw;
    background:url(../../../static/mo/images/tit_story_04.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide4.still .txt,
.storySwiper .story_paging span.slide4 i.icon .txt:hover,
.storySwiper .story_paging span.slide4 i.icon:hover .txt,
.storySwiper .story_paging span.slide4.swiper-pagination-bullet-active .txt {
    background:url(../../../static/mo/images/tit_story_04_on.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging .slide5 {
    width:25.000000000vw;
}

.storySwiper .story_paging span.slide5 i{
    position: absolute;
    right:8.333333333vw;
}

.storySwiper .story_paging span.slide5 .txt{
    width:4.722222222vw;
    height:2.361111111vw;
    right:0.000000000vw;
    background:url(../../../static/mo/images/tit_story_05.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide5.still .txte,
.storySwiper .story_paging span.slide5 i.icon .txt:hover,
.storySwiper .story_paging span.slide5 i.icon:hover .txt,
.storySwiper .story_paging span.slide5.swiper-pagination-bullet-active .txt {
    background:url(../../../static/mo/images/tit_story_05_on.png) no-repeat center center;
    background-size:cover;
}
.storySwiper .story_paging span.slide5.still::after,
.storySwiper .story_paging span.slide5.swiper-pagination-bullet-active::after  {
    content:"";
    display: block;
    width:2.777777778vw;
    height:2.777777778vw;
    position: absolute;
    top:4.861111111vw;
    right:-0.972222222vw;
    background:url(../../../static/mo/images/btn_story_line_blt.png) no-repeat 0 0;
    background-size:cover;
    z-index: 5;
}

/* 월드 */
#world {
    position: relative;
    width:100%;
    height:100%;
}
.inner_container {
    position: relative;
    width:100%;
    height:100%;
    overflow: hidden;
}
.world_box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.world_box .map_box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    display: flex;
    z-index: 50;
    background: #000;
}
.world_box .map_box .map_bg {
    position: relative;
    height:100%;
}
.world_box .map_box .map_bg img{
    height: 100%;
    width:auto;
    max-width:none;
}

.world_box .map_box button{
    display: inline-block;
    width: 28vh;
    height:15.555555556vh;
    z-index: 10;
    position: absolute;
    z-index: 5;
	background:rgba(255,255,255,0);
}
.world_box .map_box .bg_piece  {
    position: absolute;
    top:0;
    left:0;
    width:100%;
    opacity: 0;
    transition: opacity .5s ease-in-out;
}
.world_box .map_box .bg_piece img{
    width:100%;
}
.world_box .map_box .btn_caldes{
    top: 35%;
    left:31%;
}
.world_box .map_box .btn_dracas{
    top: 15%;
    left: 43%;
    width: 31vh;
}
.world_box .map_box .btn_briden{
    top: 42%;;
    left: 54%;
    width:23.5vh;
    height: 22vh;
}
.world_box .map_box .btn_antaria{
    top: 47%;
    left: 9%;
    width: 32vh;
}
.world_box .map_box .btn_sealmor{
    top: 23%;
    left: 16%;
    width: 30vh;
    transform: rotate(-30deg);
}
.world_box .map_box .btn_atras{
    top: 59%;
    left: 34%;
    width: 27vh;
    height: 20vh;
}
.world_box .map_box .btn_amosia{
    top: 60%;
    left: 62%;
    width: 35vh;
    transform: rotate(-55deg);
}
#world  .txt_world_swipe {
    position: absolute;
    bottom:12vw;
    left:0;
    z-index: 50;
}

#world_pop{
    display: none;
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index: 10;
    background:#000000;
}

#world_pop.actived{
    display: block;
    z-index: 101;
}
#world_pop .pop_inner {
    position: relative;
    width: 100%;
    height:100%;
    left:0;
    transform: none;
}
#world_pop .worldSwiper {
    position: relative;
    overflow: hidden;
    width: 100%;
    height:100%;
}
.worldSwiper .swiper-slide{
    position: relative;
    width:100%;
    height:100%;
    overflow: hidden;
}
.worldSwiper .swiper-slide .world_slide_bg {
	position:relative;
    width:100%;
    height:100%;
	transform:scale(1.5);
}
/* 슬라이드 actived */
.worldSwiper.animation  .swiper-slide .world_slide_bg {
	transition:transform 4s linear;
}
.worldSwiper.animation .swiper-slide.swiper-slide-active .world_slide_bg{
    opacity: 1;
    transform: scale(1);

}
.worldSwiper .swiper-slide .inner_slider_content{
    width:100%;
    position: absolute;
    top:63.888888889vw;
    left:0;
    opacity: 0.35;
    transition: opacity 2s;
}
/* 슬라이드 actived */
.worldSwiper .swiper-slide.swiper-slide-active .inner_slider_content{
    opacity: 1;
    transition: opacity 2s;
}

.worldSwiper .swiper-slide .inner_slider_content p.txt{
    min-height:47.222222222vw;
    font-size: 3.333333333vw;
    line-height: 5.000000000vw;
    letter-spacing: -0.040em;
    padding:4.166666667vw 0 0 0;
    color:#e3dcd0;
    text-align: center;
    text-shadow: #000000 0.138888889vw 0 0.555555556vw;
}
.worldSwiper .rom_org_sound_track {
    overflow: hidden;
    width:100%;
    min-height:34.722222222vw;
}
.worldSwiper .rom_org_sound_track .tit{
    position: relative;
}
.worldSwiper .rom_org_sound_track .tit > img{
    width:58.055555556vw;
    margin-left:4.166666667vw;
}
.worldSwiper .rom_org_sound_track.ep_3 .tit > img{
    width:71.944444444vw;
    margin-left:4.166666667vw;
}
.worldSwiper .rom_org_sound_track.ep_4 .tit > img{
    width:71.944444444vw;
    margin-left:4.166666667vw;
}
.worldSwiper .playing {
    position: absolute;
    top:1.250000000vw;
    left: 9.305555556vw;
    width: 4.166666667vw;;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.worldSwiper .playing.now {
    top:1.527777778vw;
}
.worldSwiper .playing .bar {
    display: inline-block;
    position: relative;
    margin-right: 0.416666667vw;
    width: 0.277777778vw;
    height: 0.555555556vw;
    overflow: hidden;
    background: linear-gradient(to bottom, #e2d3b9, #a57d6c);
    color: transparent;
}
.worldSwiper .ep_3 .playing .bar {
    background: linear-gradient(to bottom, #eddec5, #ae9f81);
}
.worldSwiper .now.playing .bar {
    animation-name: pulse;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}
.worldSwiper .now.playing .bar.n1 {
    animation-delay: 0.1s;
}
.worldSwiper .playing .bar.n1{
    height: 1.111111111vw;
}
.worldSwiper .now.playing .bar.n2 {
    animation-delay: 0.5s;
}
.worldSwiper .playing .bar.n2{
    height: 1.944444444vw;
}
.worldSwiper .now.playing .bar.n3 {
    animation-delay: 1s;
}
.worldSwiper .playing .bar.n3{
    height: 2.777777778vw;
}
.worldSwiper .now.playing .bar.n4 {
    animation-delay: 1.2s;
}
.worldSwiper .playing .bar.n4{
    height: 1.388888889vw;
}
.worldSwiper .now.playing .bar.n5 {
    animation-delay: 0.5s;
}
.worldSwiper .playing .bar.n5{
    height: 1.944444444vw;
}
.worldSwiper .now.playing .bar.n6 {
    animation-delay: 0.75s;
}
.worldSwiper .playing .bar.n6{
    height: 0.694444444vw;
}
@keyframes pulse {
    0% {
        height: 1.250000000vw;
    }
    25% {
        height: 1.944444444vw;
    }
    5% {
        height: 2.500000000vw;
    }
    75% {
        height: 0.694444444vw;
    }
    100% {
        height: 0.138888889vw;
    }
}
.worldSwiper .rom_org_sound_track  .video_box {
    position: relative;
    overflow-x:auto;
    width:95.833333333vw;
    height:22.222222222vw;
    padding:0 0 0.5vw 0;
    margin:2.777777778vw 0 0 4.166666667vw;
}
.worldSwiper .rom_org_sound_track .video_box .video_inner_wrap {
    position: absolute;
    top:0;
    left:0;
    width:100%;
    overflow: auto;
    height:21.805555556vw;
    text-align: left;
}
.worldSwiper .rom_org_sound_track .video_box .video_inner_wrap.video_box_silmor {
    width:125%;
}
.worldSwiper .rom_org_sound_track  .video_box .play_world_video_list {
    float:left;
    position: relative;
    overflow: hidden;
    width:36.805555556vw;
    height:21.527777778vw;
    margin:0 2.083333333vw 0 0;
    border:0.138888889vw solid #ae9f81;
}

.worldSwiper .rom_org_sound_track  .video_box .play_world_video_list button{
    display: block;
    position: absolute;
    top:50%;
    left:50%;
    width:100%;
    height:100%;
    background:rgba(0, 0, 0, 0.5);
    transform: translate(-50%, -50%);
}

.worldSwiper .rom_org_sound_track  .video_box .play_world_video_list button span{
    display: block;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:url(../../../static/mo/images/btn_world_pop_org_track.png) no-repeat center center;
    background-size:6.666666667vw 6.666666667vw;
    transition: background 0.5s;
    
}
.worldSwiper .rom_org_sound_track  .video_box .play_world_video_list.on button span{
    background:url(../../../static/mo/images/btn_world_pop_org_track_stop.png) no-repeat center center;
    background-size:6.666666667vw 6.666666667vw;
    transition: background 0.5s;
}
.worldSwiper .rom_org_sound_track  .video_box .play_world_video_list .hover {
    opacity: 0;
    z-index: 0;
    transition: opacity 0.5s;
}
.worldSwiper .rom_org_sound_track  .video_box .play_world_video_list:hover .hover {
    opacity: 1;
    position: absolute;
    bottom:0;
    left:0;
    width:100%;
    z-index: 2;
    transition: opacity 0.5s;
}
.worldSwiper .world_button_next ,
.worldSwiper .world_button_prev {
    position: absolute;
    top:50%;
    width:8.333333333vw;
    height:8.333333333vw;
    margin-top:-9.722222222vw;
    z-index: 5;
} 
.worldSwiper .world_button_next {
    right:2.083333333vw;
    background:url(../../../static/mo/images/btn_story_next.png) no-repeat center center;
    background-size:cover;
} 
.worldSwiper .world_button_prev {
    left:2.083333333vw;
    background:url(../../../static/mo/images/btn_story_prev.png) no-repeat center center;
    background-size:cover;
}
.worldSwiper .world_button_next.swiper-button-disabled ,
.worldSwiper .world_button_prev.swiper-button-disabled {
    opacity: 0.5 !important;
}
#world_pop .pop_inner .btn_world_pop_close{
    position: absolute;
    top:22.222222222vw;
    right:4.166666667vw;
    width:12.5vw;
    height:12.5vw;
    z-index: 10;
}

#world_pop .pop_inner .btn_world_pop_close img{
    width:0;
    height:0;
    opacity: 0;
    transition: opacity 1s;
}

#world_pop.actived .pop_inner .btn_world_pop_close img{
    width:12.5vw;
    height:12.5vw;
    opacity: 1;
    transition: opacity 1s;
}
/**게임소개 - 클래스 **/
#class {
    overflow: hidden;
    position: relative;
    width: 100%;
    height:100vh;
}

#class .bg {
    background:url(../../../static/mo/images/bg_class.jpg) no-repeat center 0;
    background-size:cover;
}
.class_wrap {
    position: relative;
    width:100%;
    height:100%;
}
.class_inner {
    position: relative;
    width:100%;
    height:100%;
    overflow: hidden;
}
.charactorSwiper {
    overflow: hidden;
    width:100%;
    height:163.888888889vw;
    padding:13.888888889vw 0 0 0;
}

.charactorSwiper .swiper-wrapper{
	
}
.charactorSwiper .swiper-slide {
    width:80vw;
    height:100%;
    position: relative;
	transform-origin:50% 45%;
}
.charactorSwiper .swiper-slide.swiper-slide-active {
    z-index: 10;
}
.charactorSwiper .swiper-slide .cha{
    position: relative;
    left:50%;
    width:100.000000000vw;
    height:100%;
    margin-left:-50.000000000vw;
    display: flex;
    justify-content: center;
    transition: background 0.15s;
}
.charactorSwiper .swiper-slide.swiper-slide-active .cha{
    z-index: 10;
    transition: background 0.15s;
}
.charactorSwiper .cha_kinght .cha {
    background: url(../../../static/mo/images/img_charactor_01_off.png) no-repeat center 0;
    background-size:100.000000000vw 163.888888889vw;
}
.charactorSwiper .cha_kinght.swiper-slide-active .cha {
    background: url(../../../static/mo/images/img_charactor_01_on.png) no-repeat center 0;
    background-size:100.000000000vw 163.888888889vw;
}

.charactorSwiper .cha_magician .cha {
    background: url(../../../static/mo/images/img_charactor_02_off.png) no-repeat center 0;
    background-size:100.000000000vw 163.888888889vw;
}
.charactorSwiper .cha_magician.swiper-slide-active .cha {
    background: url(../../../static/mo/images/img_charactor_02_on.png) no-repeat center 0;
    background-size:100.000000000vw 163.888888889vw;
}

.charactorSwiper .cha_ranger .cha {
    background: url(../../../static/mo/images/img_charactor_03_off.png) no-repeat center 0;
    background-size:100.000000000vw 163.888888889vw;
}
.charactorSwiper .cha_ranger.swiper-slide-active .cha {
    background: url(../../../static/mo/images/img_charactor_03_on.png) no-repeat center 0;
    background-size:100.000000000vw 163.888888889vw;
}

.charactorSwiper .swiper-slide .cha .btn{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:0;
}
.charactorSwiper .swiper-slide .cha .btn:before{
	content:'';
    position: absolute;
	display:block;
    top:68.055555556vw;
    right:18.055555556vw;
    width:26.666666667vw;
    height:15.555555556vw;
}

.charactorSwiper .swiper-slide.swiper-slide-active .cha .btn{
    opacity: 1;
    transition: opacity 0.25s;
}

.charactorSwiper .cha_kinght .cha .btn:before{
    background:url(../../../static/mo/images/bg_class_knight_on.png) no-repeat 0 0;
    background-size:cover;
}


.charactorSwiper .cha_magician .cha .btn:before{
    background:url(../../../static/mo/images/bg_class_magician_on.png) no-repeat 0 0;
    background-size:cover;
}


.charactorSwiper .cha_ranger .cha .btn:before{
    background:url(../../../static/mo/images/bg_class_ranger_on.png) no-repeat 0 0;
    background-size:cover;
}

/* 클래스 - 캐릭터 안내 팝업 */
#class_pop {
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index: 105;
    overflow: hidden;
	background:#000;
}
#class_pop.actived{
    z-index: 100;
}
#class_pop .pop_inner {
    position: relative;
    width: 100%;
    height:100%;
    overflow: hidden;
}
#class_pop .pop_inner {
    position: relative;
    width: 100%;
    height:100vh;
}
.classSwiper {
    overflow: hidden;
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow: auto;
}
.classSwiper .swiper-wrapper {
}
.classSwiper .swiper-slide {
    position: relative;
    width:100% !important;
    height:100%;
    opacity: 0;
    overflow: hidden;
}
.actived .classSwiper .swiper-slide.swiper-slide-active {
    opacity: 1;
}
.classSwiper .swiper-slide .img{
    position: absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
}
.classSwiper .swiper-slide .img .cha {
    width:100%;
}
.classSwiper .swiper-slide .img .cha img{
    width:100%;
    transform: translateY(-10%);
    opacity: 0;
    /* height:100%; */
}
.actived .classSwiper .swiper-slide.swiper-slide-active .img .cha  img,
.classSwiper .swiper-slide.swiper-slide-active .img .cha img{
    transform: translateY(0);
    opacity:1;
    transition: opacity 0.25s,transform 0.25s;
    z-index: 5;
}
.classSwiper .swiper-slide .inner_slider_content {
    overflow: auto;
    position: relative;
    width:100%;
    height:100%;
    padding:0 0 41vw 0;
    background:url(../images/bg_pop_class.jpg) no-repeat center 0;
    background-size:100vw 100%;
    z-index: 100;
    opacity: 0;
    transition: opacity 0.5s;
}
.actived .classSwiper .swiper-slide.swiper-slide-active .inner_slider_content {
    opacity: 1;
    transition: opacity 1s;
}


.classSwiper .cha_tit {
    position: relative;
    width:100%;
    padding-top:127vw;
}
.classSwiper .cha_story {
    position: relative;
    width:100%;
}
.classSwiper .cha_story .tit {
    padding:1.388888889vw 0 0.972222222vw 0;
}
.classSwiper .cha_story p.desc {
    font-size: 3.333333333vw;
    line-height:1.5;
    text-align: center;
    color:#e3dcd0;
    text-shadow:#000000 0.138888889vw 0 0.416666667vw;
    padding:0 0 5.555555556vw 0;
    font-weight: 300;
    letter-spacing: -0.040em;
}
.classSwiper .skill {
    width:69.722222222vw;
    margin:0 auto;
    padding:0 0  14vw 0;
    overflow: hidden;
    position: relative;
    z-index: 10;
}
.classSwiper .skill ul{
    width:54.583333333vw;
    height:20.833333333vw;
    display: flex;
    margin:0 auto;
    justify-content: space-between;
    align-items: center;
}

.classSwiper .skill ul li {
    width:18.194444444vw;
    height:20.833333333vw;
    margin:0;
    background-repeat: no-repeat;
    background-size:55.138888889vw 20.833333333vw;
}
.classSwiper .skill li.skill01 {
    background-position:0 0;
}
.classSwiper .skill li.skill02 {
    background-position:-18.055555556vw 0;
}
.classSwiper .skill li.skill03 {
    background-position:-36.111111111vw 0;
    /* background-size:42.638888889vw 12.222222222vw; */
}

.classSwiper .skill li.skill01.active {
    background-position:0 0;
}
.classSwiper .skill li.skill02.active {
    background-position:-18.055555556vw 0;
}
.classSwiper .skill li.skill03.active {
    background-position:-36.111111111vw 0;
}

/*나이트*/
.classSwiper .knight_infor .skill li {
    background-image:url(../../../static/mo/images/bg_class_skill_01_off.png);
}
.classSwiper .knight_infor .skill li.active {
    background-image:url(../../../static/mo/images/bg_class_skill_01_on.png);
}
/* 매지션 */

.classSwiper .magician_infor .skill li {
    background-image:url(../../../static/mo/images/bg_class_skill_02_off.png);
}
.classSwiper .magician_infor .skill li.active {
    background-image:url(../../../static/mo/images/bg_class_skill_02_on.png);
}

/* ranger*/
.classSwiper .ranger_infor .skill li {
    background-image:url(../../../static/mo/images/bg_class_skill_03_off.png);
}
.classSwiper .ranger_infor .skill li.active {
    background-image:url(../../../static/mo/images/bg_class_skill_03_on.png);
}

.classSwiper .skill .skill_warp{
    width: 69.722222222vw;
    height:39.166666667vw;
    margin:0;
    padding:3.472222222vw 0 0 0;
}
.classSwiper .skill .skill_warp .skill_v_box {
    display: none;
    width: 69.444444444vw;
    height:38.888888889vw;
    overflow: hidden;
    border:0.138888889vw solid #aa874f;
}

.classSwiper .skill .skill_warp .skill_v_box.active{
    display: block;
}
.classSwiper .skill .skill_warp .skill_v_box .video_box {
    position: relative;
    width:100%;
    height:100%;
    overflow: hidden;
}
.classSwiper .skill .skill_warp .skill_v_box .video_box video{
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:69.444444444vw;
    height:38.888888889vw;
    box-shadow: #000000 0.138888889vw 0 0.833333333vw;
}
.classSwiper .skill .skill_warp .skill_v_box .video_box .charactor_video_button {
    position: absolute;
    top:50%;
    left:50%;
    width: 100%;
    height: 100%;
    background:url(../../../static/mo/images/btn_world_pop_org_track.png) no-repeat center center;
    background-size:6.666666667vw 6.666666667vw;
    transform: translate(-50%, -50%);
}
.classSwiper .skill .skill_warp .skill_v_box .video_box.play .charactor_video_button {
    background:url(../../../static/mo/images/btn_world_pop_org_track_stop.png) no-repeat center center;
    background-size:6.666666667vw 6.666666667vw;
    transition: background 0.5s;
}
.classSwiper .class_button_next ,
.classSwiper .class_button_prev {
    position: absolute;
    top:50%;
    width:8.333333333vw;
    height:9.722222222vw;
    margin-top:2.777777778vw;
    z-index: 5;
} 
.classSwiper .class_button_next {
    right:2.777777778vw;
    background:url(../../../static/mo/images/btn_story_next.png) no-repeat center center;
    background-size:7.916666667vw 9.583333333vw;
    transition: background 0.5s;
} 
.classSwiper .class_button_prev {
    left:2.777777778vw;
    background:url(../../../static/mo/images/btn_story_prev.png) no-repeat center center;
    background-size:7.916666667vw 9.583333333vw;
    transition: background 0.5s;
}
.classSwiper .class_button_next.swiper-button-disabled,
.classSwiper .class_button_prev.swiper-button-disabled {
    display: none;
    opacity: 0!important;
}

/* 클래스 전직 class change */
.change_container {
    overflow: auto;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0 0 41.666666667vw 0;
    background: url(../images/bg_pop_class.jpg) no-repeat center 0;
    background-size: 100.000000000vw 264.444444444vw;
    z-index: 100;
    transition: opacity 0.5s;
}
.swiper-slide-active .change_container  {
    opacity: 1;
    transition: opacity 0.5s;
}
.tab_change_class {
    position: absolute;
    top:77.222222222vw;
    left:50%;
    width:58.888888889vw;
    height:65.277777778vw;
    margin-left:-29.444444444vw;
    z-index: 100;
}
.tab_change_class li {
    display: inline-block;
    position: absolute;
    width:17.500000000vw;
    height:17.638888889vw;
    transition: background 0.2s ease;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:cover;
    /* clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); */
}
.change_container .tab_change_class li:nth-child(1) {
    width:26.388888889vw;
    height:26.388888889vw;
    top:8.333333333vw;
    left:50%;
    margin-left:-14.1666666vw;
}
.change_container .tab_change_class li:nth-child(2) {
    top:27.361111111vw;
    left:10vw;
}
.change_container .tab_change_class li:nth-child(3) {
    top:27.5vw;
    right:10vw;
}
.change_container .tab_change_class li:nth-child(4) {
    top:37.75vw;
    left:50%;
    margin-left:-8.75vw;
}
.change_container .tab_change_class li.active {
    transition: background 0.2s ease;
}
.change_container .tab_change_class li span{
    display: block;
    width:100%;
    height:100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size:cover;
    transition: opacity 0.2s ease-in-out;
    opacity: 1;
    z-index: 1;
    background-size:100% 100% !important;
}
.change_container .tab_change_class li.active span,
.change_container .tab_change_class li:hover span{
    background-repeat: no-repeat;
    background-position: center center;
    background-size:cover;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.change_container .tab_change_class li span,
.change_container .tab_change_class li::after {
    position: absolute;
    top:50%;
    left:50%;
    width:37.083333333vw;
    height:38.055555556vw;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.change_container .tab_change_class li::after {
    content:"";
    display: block;
    background-size:100% 100% !important;
}

.change_container .tab_change_class li:nth-child(1) span,
.change_container .tab_change_class li:nth-child(1)::after{
    width:40.555555556vw;
    height:42.916666667vw; 
}
/* 나이트 */
/* 나이트- 나이트 */
.change_container .tab_change_class li.change_knight::after{
    background-image: url(/common/mo/images/btn_change_class_knight_off.png);
}
.change_container .tab_change_class li.change_knight span,
.change_container .tab_change_class .change_knight:hover span{
    background-image: url(../images/txt_change_class_knight.png);
}
.change_container .tab_change_class li.change_knight.active::after ,
.change_container .tab_change_class li.change_knight:hover::after {
    background-image: url(/common/mo/images/btn_change_class_knight_on.png);
}
/* 나이트- berserker */
.change_container .tab_change_class li.change_berserker::after{
    background-image: url(/common/mo/images/btn_change_class_berserker_off.png);
}
.change_container .tab_change_class li.change_berserker span,
.change_container .tab_change_class .change_berserker:hover span{
    background-image: url(../images/txt_change_class_berserker.png);
}
.change_container .tab_change_class li.change_berserker.active::after ,
.change_container .tab_change_class li.change_berserker:hover::after {
    background-image: url(/common/mo/images/btn_change_class_berserker_on.png);
}

/* 나이트- defender */
.change_container .tab_change_class li.change_defender::after{
    background-image: url(/common/mo/images/btn_change_class_defender_off.png);
}
.change_container .tab_change_class li.change_defender span,
.change_container .tab_change_class .change_defender:hover span{
    background-image: url(../images/txt_change_class_defender.png);
}
.change_container .tab_change_class li.change_defender.active::after,
.change_container .tab_change_class li.change_defender:hover::after {
    background-image: url(/common/mo/images/btn_change_class_defender_on.png);
}

/* 나이트- 뱅가드 */
.change_container .tab_change_class li.change_vanguard::after{
    background-image: url(/common/mo/images/btn_change_class_vanguard_off.png);
}
.change_container .tab_change_class li.change_vanguard span,
.change_container .tab_change_class .change_vanguard:hover span{
    background-image: url(../images/txt_change_class_vanguard.png);
}
.change_container .tab_change_class li.change_vanguard.active::after,
.change_container .tab_change_class li.change_vanguard:hover::after {
    background-image: url(/common/mo/images/btn_change_class_vanguard_on.png);
}


/* 매지션 */
/* 매지션 - 매지션*/
.change_container .tab_change_class li.change_magician::after{
    background-image: url(/common/mo/images/btn_change_class_magician_off.png);
}
.change_container .tab_change_class li.change_magician span,
.change_container .tab_change_class .change_magician:hover span{
    background-image: url(../images/txt_change_class_magician.png);
}
.change_container .tab_change_class li.change_magician.active::after ,
.change_container .tab_change_class li.change_magician:hover::after {
    background-image: url(/common/mo/images/btn_change_class_magician_on.png);
}
/* 매지션 - 프리스트*/
.change_container .tab_change_class li.change_priest::after {
    background-image: url(/common/mo/images/btn_change_class_priest_off.png);
}
.change_container .tab_change_class li.change_priest span,
.change_container .tab_change_class .change_priest:hover span{
    background-image: url(../images/txt_change_class_priest.png);
}
.change_container .tab_change_class li.change_priest.active::after,
.change_container .tab_change_class li.change_priest:hover::after {
    background-image: url(/common/mo/images/btn_change_class_priest_on.png);
}
/* 매지션 - 위자드*/
.change_container .tab_change_class li.change_wizards::after {
    background-image: url(/common/mo/images/btn_change_class_wizards_off.png);
}
.change_container .tab_change_class li.change_wizards span,
.change_container .tab_change_class .change_wizards:hover span{
    background-image: url(../images/txt_change_class_wizards.png);
}
.change_container .tab_change_class li.change_wizards.active::after,
.change_container .tab_change_class li.change_wizards:hover::after {
    background-image: url(/common/mo/images/btn_change_class_wizards_on.png);
}
/* 매지션 - 배틀메이지*/
.change_container .tab_change_class li.change_mage::after {
    background-image: url(/common/mo/images/btn_change_class_mage_off.png);
}
.change_container .tab_change_class li.change_mage span,
.change_container .tab_change_class .change_mage:hover span{
    background-image: url(../images/txt_change_class_mage.png);
}
.change_container .tab_change_class li.change_mage.active::after,
.change_container .tab_change_class li.change_mage:hover::after {
    background-image: url(/common/mo/images/btn_change_class_mage_on.png);
}

/* 레인져 */
/* 레인져 -레인저 */
.change_container .tab_change_class li.change_ranger::after{
    background-image: url(/common/mo/images/btn_change_class_ranger_off.png);
}
.change_container .tab_change_class li.change_ranger span,
.change_container .tab_change_class .change_ranger:hover span{
    background-image: url(../images/txt_change_class_ranger.png);
}
.change_container .tab_change_class li.change_ranger.active::after ,
.change_container .tab_change_class li.change_ranger:hover::after {
    background-image: url(/common/mo/images/btn_change_class_ranger_on.png);
}
/* 레인져 -스카우트 */
.change_container .tab_change_class li.change_scout::after {
    background-image: url(/common/mo/images/btn_change_class_scout_off.png);
}
.change_container .tab_change_class li.change_scout span,
.change_container .tab_change_class .change_scout:hover span{
    background-image: url(../images/txt_change_class_scout.png);
}
.change_container .tab_change_class li.change_scout.active::after,
.change_container .tab_change_class li.change_scout:hover::after {
    background-image: url(/common/mo/images/btn_change_class_scout_on.png);
}
/* 레인져 - 헌터 */
.change_container .tab_change_class li.change_hunter::after {
    background-image: url(/common/mo/images/btn_change_class_hunter_off.png);
}
.change_container .tab_change_class li.change_hunter span,
.change_container .tab_change_class .change_hunter:hover span{
    background-image: url(../images/txt_change_class_hunter.png);
}
.change_container .tab_change_class li.change_hunter.active::after,
.change_container .tab_change_class li.change_hunter:hover::after {
    background-image: url(/common/mo/images/btn_change_class_hunter_on.png);
}
/* 레인져 - 슬레이어 */
.change_container .tab_change_class li.change_slayer::after {
    background-image: url(/common/mo/images/btn_change_class_slayer_off.png);
}
.change_container .tab_change_class li.change_slayer span,
.change_container .tab_change_class .change_change_slayerhunter:hover span{
    background-image: url(../images/txt_change_class_slayer.png);
}
.change_container .tab_change_class li.change_slayer.active::after,
.change_container .tab_change_class li.change_slayer:hover::after {
    background-image: url(/common/mo/images/btn_change_class_slayer_on.png);
}
.change_contents {
    position: relative;
    width:100%;
    height:100%;
    z-index: 10;
}
.class_infor_box {
    position: absolute;
    top:0;
    left:0;
    width:100%;
    opacity: 0;
    z-index: 10;
}
.class_infor_box.active{
    opacity: 1;
    transition: opacity 0.5s;
    z-index: 50;
}


/* slide active*/
#class_pop .pop_inner button.btn_class_pop_close {
    position: absolute;
    top:22.222222222vw;
    right:4.166666667vw;
    width:12.5vw;
    height:12.5vw;
    z-index: 9;
}

#class_pop .class_wrap .txt_world_swipe {
    position: absolute;
    bottom: 25.000000000vw;
    left: 0;
    width: 100%;
}



html.download_page header {
    background: #000;
}
html.download_page #content-section{
    height:auto !important;
    overflow: auto;
}
#download {
    position: relative;
    width:100%;
    height:100%;
    background:url(../../../static/mo/images/bg_cbt.jpg) no-repeat center 0;
    background-size: cover;
}       
#download .top_banner{
    width: 100%;
    height:11.111111111vw;
    padding:13.888888889vw 0 0 0;
    background:#000;
}
#download .top_banner .title h2{
    width: 100%;
    height:11.111111111vw;
    line-height:11.111111111vw;
    color: #e3dcd0;
    font-size: 4.444444444vw;
    letter-spacing: -0.030em;
    text-align: center;
    background: #650e0e;

}
#download .download_infor_box {
    padding:9vw 0;
}
.beta_test_infor_txt p{
    font-size: 3.611111111vw;
    line-height: 1.3;
    text-align: center;
    color: #1d1a15;
    font-weight: 500;
    padding: 0 0 2.777777778vw 0;
    letter-spacing: -0.040em;
}
#download .download_infor_box .beta_test_infor_txt .btn-red{
    display: block;
    width:50.000000000vw;
    height:8.333333333vw;
    margin:3.545vw auto 0;
    color: #e9e5da;
    font-size: 3.611111111vw;
    line-height: 8.333333333vw;
    letter-spacing: -0.040em;
    text-align: center;
    border:none;
    outline:none;
    background:#650e0e;
}

.download_conts .rom_client {
    position: relative;
    display: flex;
    align-items: center;
    width:100%;
    height:25.000000000vw;
    background:url(../images/bg_download_area.png) no-repeat 0 0;
    background-size: 91.666666667vw 25vw;
}
.download_conts .rom_client p {
    display: block;
    padding:11.111111111vw 0 0 4.166666667vw;
    font-size: 3.055555556vw;
    line-height: 4.444444444vw;
    letter-spacing: -0.030em;
    text-align: left;
    color:#d0c8b7;
    text-shadow: #000 0.138888889vw 0 0.972222222vw;
}
.download_conts .rom_client .btn_box{
    position: absolute;
    top:3.472222222vw;
    left:4.166666667vw;
    width:83.333333333vw;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}
.download_conts .rom_client .btn_box button {
    margin:0 1.388888889vw 0 0;
    width:25.277777778vw
}
.download_conts .rom_client .btn_box button.googleplay {
    width:24.861111111vw;
}
.download_conts .rom_client .btn_box button img{
    height:7.222222222vw;
}
#download .download_infor_box h3.tit {
    font-size: 3.611111111vw;
    color:#1d1a15;
    letter-spacing: -0.030em;
    font-weight: 500;
    padding:6.944444444vw 4.166666667vw 4.166666667vw 4.166666667vw;
}
#download .download_infor_box .download_conts{
    overflow: hidden;
    position: relative;
    padding:0 0 0 4.166666667vw;
    width:95.833333333vw;
}

.download_conts .download_conts_inner {
    overflow: auto;
    width:100%;
}
.download_conts .systerm {
    position: relative;
    width:172.500000000vw;
    padding:0 4.166666667vw 0.75vw 0;
    overflow:auto;
    display: flex;
    justify-content: space-between;
}
.download_conts .systerm ul {
    width:57.361111111vw;
    border-left:0.138888889vw solid #e1dcd1;
}
.download_conts .systerm ul.category {
    border-left:none;
}

.download_conts .systerm ul li {
    font-size: 2.777777778vw;
    line-height: 4.166666667vw;
    letter-spacing: -0.030em;
    padding:3.472222222vw 0;
    text-align: center;
    color:#504431;
    border-bottom:0.138888889vw solid #e1dcd1;
    background:#f7f3e8;
}
.download_conts .systerm ul li.head {
    background:#92856c;
    color:#f7f3e8;
    border-bottom:none;
}

/* notice_list */
.download_conts .notice_list {
    padding:2.777777778vw 0 0 0;
}
.download_conts .notice_list li {
    font-size: 2.916666667vw;
    text-align: left;
    line-height: 4.166666667vw;
    padding:0 0 0 1.666666667vw;
    text-indent:-1.666666667vw;
    letter-spacing: -0.030em;
    color:#92856c;
}
.download_conts .notice_list.number li {
    font-size: 2.916666667vw;
    text-align: left;
    line-height: 4.166666667vw;
    padding: 0.000000000vw 0 0.000000000vw 3.472222222vw;
    text-indent: -3.472222222vw;
    letter-spacing: -0.030em;
    color:#92856c;
}
/* media */
#media {
    position: relative;
    width:100%;
    height:100%;
}
#media {
    position: relative;
    width:100%;
    height:100%;
}
#media .bg {
    background: url(../../../static/mo/images/bg_media.jpg) no-repeat center 0;
    background-size:cover;
}
#media .title {
    width:100%;
    text-align: center;
}
#media .title h2{
    width:100%;
    padding:31.944444444vw 0 8.333333333vw 0;
}

#media .tab_container {
    position: relative;
    width:100%;
    padding:0 0 25.000000000vw 0;
    margin:0 auto;
}

#media #tab {
    position: relative;
}

#media #tab ul {
    display: flex;
    justify-content: center;
}
#media #tab ul li{
    padding:3.055555556vw 5.833333333vw;
    color:#cec5b2;
    color:#cec5b2;
    letter-spacing: -0.02em;
    font-size: 3.888888889vw;
}
#media #tab ul li.on {
    color:#e6decc;
    text-shadow: #8e1111 0.000000000vw 0.000000000vw 1.111111111vw;
    font-weight: bold;
}

#media #tab ul li.first{
    position: relative;
}
#media #tab ul li.first::after {
    content:"";
    display: block;
    position: absolute;
    top:3.055555556vw;
    right:0;
    width:0.138888889vw;
    height:2.777777778vw;
    background:#575041;
}
#media .tab_content {
    position: relative;
    width:100%;
    width:100.000000000vw;
    padding:4.861111111vw 0 0 0;
}
#media .tab_content .box {
    display: none;
    position: relative;
    width:100.000000000vw;
    padding:0 0 25.000000000vw 0;
}
#media .tab_content .box.on {
    display: block;
    transition: all 0.25s;
}

/*양싱 미디어*/
.videoSwiper {
    position: relative;
    width:95.277777778vw;
    height:50.000000000vw;
    margin:0 2.361111111vw;
}
.videoSwiper .swiper-slide {
    overflow: hidden;
    position: relative;
    width:94.444444444vw !important;
    padding:0.138888889vw 0 0 0;
    margin:0 auto;
    height:50.000000000vw;
    background:url(../../../static/mo/images/bg_media_video.png) no-repeat center bottom;
    background-size:94.444444444vw 50.000000000vw;
    box-shadow: #00000020 0.138888889vw 0.000000000vw 1.388888889vw;
    opacity: 0;
}
.videoSwiper .swiper-slide.swiper-slide-duplicate-active {
    opacity: 1;
    pointer-events: visible;
}
.videoSwiper .swiper-slide .inner_slider_content{
    width:100%;
    height:100%;

}
.videoSwiper .swiper-slide .img{
    position: relative;
    width:100%;
    height:100%;
}

.videoSwiper .swiper-slide .img img{
    width:100%;
    height:100%;
}
.videoSwiper .swiper-slide .f_frame {
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:100%;
    height:100%;
    background:url(../../../static/mo/images/bg_media_video_frame.png) no-repeat center center;
    background-size:cover;
    pointer-events: none;
}
.videoSwiper .swiper-slide .btn_box {
    position: absolute;
    top:50%;
    left:50%;
    width:100%;
    height:100%;
    transform: translate(-50%, -50%);
}
.videoSwiper .swiper-slide .btn_box button{
    display: block;
    position: absolute;
    top:50%;
    left:50%;
    width:11.250000000vw;
    height:11.250000000vw;
    margin:-5.555555556vw 0 0 -5.555555556vw;
    background:url(../../../static/mo/images/btn_media_video_inner_play.png) no-repeat center center;
    background-size:cover;
}
#media .videoSwiper .video_paging{
    position: absolute;
    top:70.833333333vw;
    width:94.444444444vw;
    height:0.277777778vw;
    background:#76726b;
    z-index: 10;
}
#media .videoSwiper .video_paging span{
    display: inline-block;
    height:0.833333333vw;
    margin-top:-0.277777778vw;
    background:#700303;
}

#media .box .videoThumbs{
    position: absolute;
    bottom:2.777777778vw;
    left:1.666666667vw;
    width:96%;
    height:19.722222222vw;
    margin:0 auto;
    padding:0;
}
#media .box .videoThumbs .swiper-slide {
    position: relative;
    width:34.027777778vw !important;
    height:19.722222222vw;
    padding:0;
    margin:0 -0.972222222vw !important;
}
#media .box .videoThumbs .swiper-slide .img{
    overflow: hidden;
    margin:0 auto;
    width:30.555555556vw;
    height:16.250000000vw;
    background: url(../../../static/mo/images/img_media_comming_soon.png) no-repeat center center;
    background-size:30.555555556vw 16.250000000vw;;
}
#media .box .videoThumbs .swiper-slide .img img{
    width: 100%;height:100%;object-fit: cover;
}
#media .box .videoThumbs .swiper-slide.swiper-slide-thumb-active::after {
    content:"";
    display: block;
    width:34.027777778vw;
    height:19.722222222vw;
    position: absolute;
    top:-1.527777778vw;
    left:-0.138888889vw;
    z-index: 100;
    background: url(../../../static/mo/images/bg_media_paging_frame.png) no-repeat center center;
    background-size:34.027777778vw 19.722222222vw;;
}


/* ost */

.ostSwiper {
    position: relative;
    width:95.277777778vw;
    height:50.000000000vw;
    margin:0 2.361111111vw;
}
.ostSwiper .swiper-slide {
    overflow: hidden;
    position: relative;
    width:94.444444444vw !important;
    padding:0.138888889vw 0 0 0;
    margin:0 auto;
    height:50.000000000vw;
    background:url(../../../static/mo/images/bg_media_video.png) no-repeat center bottom;
    background-size:94.444444444vw 50.000000000vw;
    box-shadow: #00000020 0.138888889vw 0.000000000vw 1.388888889vw;
    opacity: 0;
}
.ostSwiper .swiper-slide.swiper-slide-duplicate-active {
    opacity: 1;
    pointer-events: visible;
}
.ostSwiper .swiper-slide .inner_slider_content{
    width:100%;
    height:100%;

}
.ostSwiper .swiper-slide .img{
    position: relative;
    width:100%;
    height:100%;
}

.ostSwiper .swiper-slide .img img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.ostSwiper .swiper-slide .f_frame {
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:100%;
    height:100%;
    background:url(../../../static/mo/images/bg_media_video_frame.png) no-repeat center center;
    background-size:cover;
    pointer-events: none;
}
.ostSwiper .swiper-slide .btn_box {
    position: absolute;
    top:50%;
    left:50%;
    width:100%;
    height:100%;
    transform: translate(-50%, -50%);
}
.ostSwiper .swiper-slide .btn_box button{
    display: block;
    position: absolute;
    top:50%;
    left:50%;
    width:11.250000000vw;
    height:11.250000000vw;
    margin:-5.555555556vw 0 0 -5.555555556vw;
    background:url(../../../static/mo/images/btn_media_video_inner_play.png) no-repeat center center;
    background-size:cover;
}

#media .ostSwiper .ost_paging{
    position: absolute;
    top:70.833333333vw;
    width:94.444444444vw;
    height:0.277777778vw;
    background:#76726b;
    z-index: 10;
}
#media .ostSwiper .ost_paging span{
    display: inline-block;
    height:0.833333333vw;
    margin-top:-0.277777778vw;
    background:#700303;
}

#media .box .ostThumbs{
    position: absolute;
    bottom:2.777777778vw;
    left:1.666666667vw;
    width:96%;
    height:19.722222222vw;
    margin:0 auto;
    padding:0;
}
#media .box .ostThumbs .swiper-slide {
    position: relative;
    width:34.027777778vw !important;
    height:19.722222222vw;
    padding:0;
    margin:0 -0.972222222vw !important;
}
#media .box .ostThumbs .swiper-slide .img{
    overflow: hidden;
    margin:0 auto;
    width:30.555555556vw;
    height:16.250000000vw;
    background: url(../../../static/mo/images/img_media_comming_soon.png) no-repeat center center;
    background-size:30.555555556vw 16.250000000vw;;
}

#media .box .ostThumbs .swiper-slide .img img{
    width: 100%;height:100%;object-fit: cover;
}
#media .box .ostThumbs .swiper-slide.swiper-slide-thumb-active::after {
    content:"";
    display: block;
    width:34.027777778vw;
    height:19.722222222vw;
    position: absolute;
    top:-1.527777778vw;
    left:-0.138888889vw;
    z-index: 100;
    background: url(../../../static/mo/images/bg_media_paging_frame.png) no-repeat center center;
    background-size:34.027777778vw 19.722222222vw;;
}
/* 미디어 동영상 팝업 */

#media_pop .video_box {
    position: relative;
    display: inline-block;
    width: 98%;
    height: 52.777777778vw;
    margin-top:0;
    border:0.138888889vw solid #988a70;
}

#media_pop .video_box .video_inner {
    width: 100%;
    height: 52.777777778vw;
    overflow: hidden;
}
#media_pop .video_box .video_inner iframe {
    width:100%;
    height:100%;
}
#media_pop .btn_pop_close {
    display: block;
    position: absolute;
    top: -9.333333333vw;
    right: 0;
    width: 6.666666667vw;
}

#media_pop .btn_pop_close  img{
    width: 6.666666667vw;
}


/* 쿠키 설정 안내 팝업 */
#cookie_setting_information .text_box {
    position: relative;
    display: inline-block;
    width:93.055555556vw;
    padding:0;
    margin:0;
    border:none;
    background:url(/common/images/bg_cookie_row.png) no-repeat center 0;
    background-size:97.083333333vw 65.833333333vw;
}
#cookie_setting_information .text_inner {
    padding:4.444444444vw 1.388888889vw 1.388888889vw 4.166666667vw;
}
#cookie_setting_information .text_box .cookie_title  {
    width:100%;
    height:9.722222222vw;
    background: url(/common/images/bg_cookie_title.png) no-repeat center 100%;
    background-size:58.194444444vw 5.000000000vw;
}
#cookie_setting_information .cookie_title > p {
    font-size: 3.888888889vw;
    line-height: 4.861111111vw;
    color:#1d1a15;
    font-weight: 500;
    padding:0 0 4.861111111vw 0;
    text-align: center;
}
#cookie_setting_information .cookie_title > p::before{
    display: none;
}

#cookie_setting_information  .text_inner > p{
    display: block;
    position: relative;
    font-size: 1.944444444vw;
    color:#504431;
    text-align: left;
    line-height: 3.333333333vw;
    padding:0 0 0 1.805555556vw;
    letter-spacing:-0.040em;
}
#cookie_setting_information  .text_inner > p::before {
    content: "";
    display: block;
    position: absolute;
    top: 1.527777778vw;
    left: 0;
    width: 0.416666667vw;
    height: 0.416666667vw;
    background: #504431;
    transform: rotate(45deg);
    /* border-radius: 0.138888889vw; */
}
#cookie_setting_information  .text_inner p.point{
    margin:2.222222222vw 0;
    font-size: 2.222222222vw;
    color:#1d1a15;
    font-weight: 600;
    letter-spacing:-0.040em;
}
#cookie_setting_information  .text_inner p.point::before {
    content: "";
    display: block;
    position: absolute;
    top: 1.527777778vw;
    left: 0;
    width: 0.416666667vw;
    height: 0.416666667vw;
    background: #1d1a15;
    transform: rotate(45deg);
    /* border-radius: 0.138888889vw; */
}
#cookie_setting_information .btn_box {
    display: flex;
    width: 100%;
    justify-content: center;
    height:6.250000000vw;
    padding:5.000000000vw 0;
    margin:0;
}
#cookie_setting_information .btn_box .btn {
    display: block;
    min-width:25.000000000vw;
    height:6.250000000vw;
    line-height: 6.250000000vw;
    font-size: 2.500000000vw;
    letter-spacing:-0.040em;
    text-align: center;
    margin:0 1.388888889vw;
    border:none;
}
#cookie_setting_information .btn_box .btn_red {
    color:#e3dcd0;
    background:#650e0e;
}
#cookie_setting_information .btn_box .btn_grey{
    color:#e3dcd0;
    background:#575041;
}
#cookie_setting_information .btn_pop_close {
    position: absolute;
    top:0.277777778vw;
    right:2.777777778vw;
    width:8.333333333vw;
    height:8.333333333vw;
}


/* 쿠키 설정 팝업 */
#cookie_setting .text_box {
    position: relative;
    display: inline-block;
    width:75.555555556vw;
    padding:0;
    margin:0;
    border:none;
    background:url(/common/images/bg_cookie_long.png) no-repeat center 0;
    background-size:75.277777778vw 112.777777778vw;
}
#cookie_setting .text_inner {
    padding:9.027777778vw 2.777777778vw 15vw 3.888888889vw;
    background:url(/common/images/bg_cookie_line.png) no-repeat center 8.750000000vw;
    background-size:68.055555556vw 0.277777778vw;
}
#cookie_setting .text_inner p{
    display: block;
    position: relative;
    font-size: 1.805555556vw;
    color:#504431;
    line-height: 2.777777778vw;
    text-align: left;
    letter-spacing:-0.045em;
    padding:0 0 0 1.527777778vw;
}
#cookie_setting .text_inner p::before {
    content:"";
    display: block;
    position: absolute;
    top:1.250000000vw;
    left:0;
    width:0.277777778vw;
    height:0.277777778vw;
    background:#1d1a15;
    /* border-radius: 0.138888889vw; */
}

#cookie_setting .text_inner p.cookie_tit{
    margin:2.083333333vw 0 1.111111111vw;
    line-height:3.611111111vw;
    color:#1d1a15;
    font-size: 2.222222222vw;
    font-weight: 400;
    text-align: left;
    padding:0;
}
#cookie_setting .text_inner p.cookie_tit::before {
    display: none;
    /* border-radius: 0.138888889vw; */
}
#cookie_setting .cookie_wrap{
    position: relative
}
#cookie_setting .cookie_wrap .check_box{
    position: absolute;
    top:0.555555556vw;
    right:2.777777778vw;
    width:6.111111111vw;
    height:2.638888889vw;
}
#cookie_setting .cookie_wrap .check_box label{
    display: block;
    position: relative;
    width:6.111111111vw;
    height:2.638888889vw;
    background:#beb6a6;
    border-radius: 1.805555556vw;
    transition: background 0.2s;
}
#cookie_setting .cookie_wrap .check_box label .icon{
    display: inline-block;
    position: absolute;
    top:0.416666667vw;
    right:3.750000000vw;
    width:1.805555556vw;
    height:1.805555556vw;
    background:#fffffe;
    border-radius: 1.805555556vw;
    transition: all 0.15s;
    /* width:6.111111111vw;
    height:2.638888889vw;
    background:url(../common/images/bg_cookie_check_box.png) no-repeat center center; */
}
#cookie_setting .cookie_wrap .check_box  input:checked + label {
    background:#907a57;
    transition: background 0.2s;
}
#cookie_setting .cookie_wrap .check_box  input:checked + label .icon {
    right:0.416666667vw;
    /* background:url(../common/images/bg_cookie_check_box_on.png) no-repeat center center; */
    transition: all 0.15s;
}
#cookie_setting .btn_pop_close {
    position: absolute;
    top:1.388888889vw;
    right:3.472222222vw;
    width:8.333333333vw;
    height:8.333333333vw;
}

/* footer */
footer {
    position: relative;
    width: 100%;
    text-align: center;
    background-color: #000;
    z-index: 100;
}
.foot_wrap {
    table-layout: fixed;
    display: table;
    position: relative;
    width: 100%;
}
.inner_footer {
    display: table-cell;
    vertical-align: top;
}
footer .info_foot {
    margin: 0 auto 0;
    padding:3.472222222vw 0;
}
.info_foot .list_csmenu{
    display: flex;
    justify-content: center;
    line-height: 100%;
    padding:0.416666667vw 0;
    color: #e7e7e7;
}
.info_foot .list_csmenu .link_csmenu {
    display: inline-block;
    position: relative;
    line-height: 100%;
    padding:1.388888889vw 2.361111111vw;
    font-size:2.222222222vw;
    color: #e7e7e7;
    font-weight: 300;
    line-height: 100%;
}

footer .list_csmenu li:first-child .link_csmenu::before ,
footer .list_csmenu li:first-child .link_csmenu::after {
    content: none;
}
footer .list_csmenu li .link_csmenu::after {
    content: "";
    display: block;
    position: absolute;
    top:2.500000000vw;
    left:0;
    width: 0.416666667vw;
    height: 0.416666667vw;
    background: #e7e7e7;
    border-radius: 0.277777778vw;
}
#footer_personal_policy {
    color:#bc9f72;
}

footer .list_csmenu li #footer_pcgame_policy,
footer .list_csmenu li #footer_age_policy {
    padding-right:4.166666667vw;
    background:url(../../../static/mo/images/img_footer_arrow_bottom.png) no-repeat 95% 2.083333333vw;
    background-size:1.666666667vw 1.388888889vw;
}
.info_address {
    display: block;
    font-size:1.944444444vw;
    line-height: 1.3;
    color: #7e7e7e;
    font-style: normal;
    font-weight: 300;
    margin:3.472222222vw 0 0 0;
}
.info_address a {
    font-size:1.944444444vw;
    line-height: 1.2;
    color: #7e7e7e;
    font-style: normal;
    font-weight: 300;
}
footer .logo_foot {
    padding-top: 3.472222222vw;
}
footer .logo_foot .link_foot#footer_kg_ci{
    width:16.805555556vw;
    top:0.833333333vw;
    margin-right:2.083333333vw;
}
footer .logo_foot .link_foot#footer_xl_ci{
    width:13.750000000vw;
}
footer .logo_foot .link_foot {
    position: relative;
    display: inline-block;
    vertical-align: bottom;
}
footer .info_foot .info_copyright {
    display: block;
    font-size: 1.805555556vw;
    line-height: 2.500000000vw;
    color: #ffffff;
    letter-spacing: -0.025em;
    padding:1.944444444vw 0;
    font-style: normal;
    opacity: 0.5;
}

/* PC환경 이용 정책 팝업 */
#pcgame_policy_pop .txt_policy {
    position: relative;
    display: inline-block;
    width: 86.111111111vw;
    height: 73.611111111vw;
    padding:1.388888889vw 4.166666667vw;
    background:#e9e6e1;
}
#pcgame_policy_pop .txt_policy p.title{
    font-size:3.888888889vw;
    line-height: 9.305555556vw;
    padding:0;
    margin:0 0 5.277777778vw 0;
    text-align: center;
    border-bottom:0.277777778vw solid #504431
}
#pcgame_policy_pop .txt_policy p{
    font-size: 2.5vw;
    line-height: 1.5;
    letter-spacing: -0.040em;
    text-align: left;
    color:#1d1a15;
    padding:0 4vw 3.25vw 4vw;
}
#pcgame_policy_pop .txt_policy p a{
    display: inline-block;
    font-size: 2.5vw;
    line-height: 1.5;
    letter-spacing: -0.040em;
    color:#1d1a15;
    font-weight: bold;
}
#pcgame_policy_pop .txt_policy .btn_pop_close {
    position: static;
    text-align: center;
    font-size:3vw;
    letter-spacing: -0.040em;
    width:auto;
    height:4.166666667vw;
    margin:1vw 0 0 0;
    color:#000000
}
/* 게임이용등급 */
#age_policy_pop.pop .pop_container .pop_wrap .popup_inner {
    vertical-align: bottom;
    padding:6.944444444vw 4.166666667vw;
}
#age_policy_pop .txt_policy {
    position: relative;
    display: inline-block;
    width:82.722222222vw;
    height:27.777777778vw;
    padding:4.166666667vw;
    border:0.138888889vw solid #575041;
    background:#000000;
}
#age_policy_pop .info_txt {
    padding:4.861111111vw 0 0 0;
    font-size: 2.777777778vw;
    color:#e7e7e7;
    line-height: 3.055555556vw;
    letter-spacing: -0.020em;
    text-align: left;
}
#age_policy_pop .info_txt .point{
    display: inline-block;
    font-size: 2.777777778vw;
    color:#c34d4b;
    line-height: 3.055555556vw;
    letter-spacing: -0.020em;
    text-align: left;
    font-weight: 500;
}
#age_policy_pop .age_infor_box {
    border:0.138888889vw solid #786d57;
    /* width:69.444444444vw; */
    background:#504431;
    margin:4.166666667vw 0 0 0;
}
#age_policy_pop .age_infor_box dl {
    width:100%;
    height:3.888888889vw;
    display: flex;
    border-bottom:0.138888889vw solid #786d57;
}
#age_policy_pop .age_infor_box dl:last-child{
    border-bottom:none;
}
#age_policy_pop .age_infor_box dt,
#age_policy_pop .age_infor_box dd {
    font-size: 1.944444444vw;
    height:3.888888889vw;
    line-height: 3.888888889vw;
    letter-spacing: -0.020em;
    text-align: left;
    padding:0 0 0 1.388888889vw;
}
#age_policy_pop .age_infor_box dt {
    position: relative;
    color:#a1998d;
    width:20.138888889vw;
}

#age_policy_pop .age_infor_box dt::after {
    content:"";
    width:0.138888889vw;
    height:2.083333333vw;
    background: #786d57;
    position: absolute;
    top:0.972222222vw;
    right:0.694444444vw;
}
#age_policy_pop .age_infor_box dd {
    color:#e3dcd0;
    width:20.833333333vw;
}

#age_policy_pop .age_infor_box dt.left {
    width:14.166666667vw;
}
#age_policy_pop .age_infor_box dd.left {
    width:24.305555556vw;
    border-right:0.138888889vw solid #786d57;
}

#age_policy_pop .txt_policy .foot_age_label {
    position: absolute;
    top:6.250000000vw;
    right:4.166666667vw;
    width:30.000000000vw;
}
#age_policy_pop .txt_policy .btn_pop_close {
    position: absolute;
    top:0;
    right:0;
    width:5.555555556vw;
    height:5.555555556vw;
    text-align: center;
}
#age_policy_pop .txt_policy .btn_pop_close img{
    width:2.916666667vw;
    height:2.916666667vw;
}


/* 레이어 팝업 (알럿팝업)*/
.pop .text_box{
    position: relative;
    display: inline-block;
    width:58.333333333vw;
    padding:4.166666667vw;
    margin-top: -6.944444444vw;
    border:0.138888889vw solid #575041;
    background:#1d1a15;
}
.pop .text_box .text_inner {
    position: relative;
    padding:4.166666667vw 0 0 0;
    min-height:15.833333333vw;
}
.pop .text_box .text_inner p{
    width:100%;
    line-height: 3.333333333vw;
    font-size:2.500000000vw;
    text-align: center;
    color:#dbc6a5;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}

.pop .text_box .text_inner .btn_box {
    width:100%;
    margin:4.166666667vw auto 0;
    padding:4.166666667vw 0 1.388888889vw 0;
}
.pop .text_box .text_inner .btn_box  button{
    display: inline-block;
    height:6.250000000vw;
    line-height: 6.250000000vw;
    padding:0 4.166666667vw;
    font-size: 2.500000000vw;
    text-align: center;
    color:#1d1a15;
    background:#92856c;
}
.pop .btn_pop_close {
    position: absolute;
    top:0;
    right:0;
    width:10.000000000vw;
    height:10.000000000vw;
}
.pop .btn_pop_close img{
    width:3.750000000vw;
}