@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
.layout_wrap {
    position: relative;
    width: 100%;
    margin: 0 auto;
    height: 100%;
    display: flex;
    justify-content: space-between;
}

.layout_center{position: relative;width:100%; margin: 0 auto;height: 100%;}


/* header */
#header{position: fixed;left: 0;right: 0;top: 0;width: 100%;z-index: 9;height: 93px;overflow: hidden;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
#header.mypage_header {
    height: 82px;
    background-color: #111;
}
#header.ch_head ,#header.mypage_header.ch_head {
	height: 60px;
}
#header.scroll_active, #header.mypage_header.ch_head.scroll_active {
        height: 82px;
        background: #111;
}
#header.active, #header.mypage_header.active {
        height: 300px;
        background-color: #111;
}
#header .header_top{position: fixed;width: 100%;height: 82px;z-index:9;}
#header.mypage_header.ch_head .header_top {
	background:#111;
}
#header .header_top .layout_center{height: 100%;}

    #header .logo {
        margin-left: 15px;
        width: 155px;
        text-align: center;
        display: flex;
        align-items: center;
    }
/* �޴� */
#gnb{width: 740px;}
#gnb .gnb_list > li{float: left;width: 14.2587%;text-align: center;    margin-top: 26px;}
#gnb .gnb_list > li > a{display: inline-block;width: 70px;height: 25px;text-indent: -9999em;font-size:0;overflow: hidden;background-repeat: no-repeat;background-position: center top;}
#gnb .gnb_list > li.menu01 > a{background-image: url('/images/renewal_main/header/gnb_menu01.png');}
#gnb .gnb_list > li.menu02 > a{background-image: url('/images/renewal_main/header/gnb_menu02.png');}
#gnb .gnb_list > li.menu03 > a{background-image: url('/images/renewal_main/header/gnb_menu03.png');}
#gnb .gnb_list > li.menu04 > a{background-image: url('/images/renewal_main/header/gnb_menu04.png');}
#gnb .gnb_list > li.menu05 > a{background-image: url('/images/renewal_main/header/gnb_menu05.png');}
#gnb .gnb_list > li.menu06 > a{background-image: url('/images/renewal_main/header/gnb_menu06.png');}
#gnb .gnb_list > li.menu07 > a{background-image: url('/images/renewal_main/header/gnb_menu07.png');}
#gnb .gnb_list > li:hover > a{background-position: center -25px;}
#gnb .gnb_list > li .depth02{
    display:none;
    margin-top: 32px;
    padding-top: 10px;
}
#gnb .gnb_list > li .depth02 > li{padding: 5px 0; opacity:1;}
    #gnb .gnb_list > li .depth02 > li > a {
        font-size: 16px;
        color: #fff;
        text-decoration: none;
        font-family: 'Pretendard';
        font-weight:400;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
    }
#gnb .gnb_list > li .depth02 > li:hover > a{color: #ffd402;}

/*header right wrap css*/
.header_right_wrap {
    display: flex;
    align-items: center;
}

    .header_right_wrap .login, .header_right_wrap .log_out {
        font-family: 'twayair';
        height: 32px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #fff;
        background-color: #14408b;
        padding: 8px 16px;
        border-radius: 50px;
        transition: 0.4s;
        margin-right: 10px;
        font-size: 14px;
        flex-shrink: 0;
        box-sizing: border-box;
    }

        .header_right_wrap .login span, .header_right_wrap .log_out span {
            color: #fff;
            font-family: 'twayair';
            font-size: 14px;
        }

    .header_right_wrap .log_out {
        padding: 8px;
        background: #ccc;
    }

    .header_right_wrap .login_on {
        display: none;
    }

        .header_right_wrap .login_on.active {
            display: flex;
        }

    .header_right_wrap .login i {
        font-size: 25px;
    }

    .header_right_wrap .log_out i {
        font-size: 18px;
        font-weight: 500;
    }

.gamestart_gnb_wrap {
    transition: 0.4s;
    height: 82px;
    margin-right:-200px;
}

.gamestart_gnb_wrap .gamestart_gnb {
    position:absolute;
    width: 200px;
    height: 82px;
    overflow: hidden;
    background: url('https://movegames-cdn.gameking.com/movegames/604319/web/gamestart/header_game_start_btn.png');
    cursor: pointer;
}
.gamestart_gnb_wrap .gamestart_gnb.disabled {
    filter:grayscale(1);
}
.header_top.ch_header {
    top: 80px;
}
.header_top.ch_header.ch_hangame {
    top: 50px;
}
.header_top.ch_header.ch_mgame {
    top: 40px;
}
/* visual */
#top_visual.main {
    height:700px;
    position:relative;
}
#top_visual .main_video_wrap{position: relative;width: 100%;height: 700PX;margin-bottom: 14px;overflow: hidden;}
#top_visual video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#top_visual.sub{position: relative;width: 100%;height: 263px;background-repeat: repeat-x;background-position: center top;margin-bottom: 14px;overflow: hidden;}
#top_visual .layout_center {
    position: absolute;
    bottom: -55px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 1450px;
    width: 100%;
    height: 110px;
    background: #fff;
    padding: 10px 20px;
    box-sizing: border-box;
    border-radius: 50px;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
}
#top_visual .gamestart_main {
    width: 286px;
    height: 286px;
    position: absolute;
    left: 50%;
    top: 50%;
    background: none;
    cursor: pointer;
    transform: translate(-50%, -50%) scale(0.7);
    z-index: 20;
    background: url('https://movegames-cdn.gameking.com/movegames/604319/web/gamestart/main_game_start_btn.png');
    background-position: 0px 286px;
}
#top_visual .gamestart_main.disabled {
    filter:grayscale(1);
}
#top_visual .main_atag_wrap {
    display:flex;
    justify-content:space-between;
    width:95%;
    margin:0 auto;
}
#top_visual .main_atag_wrap .atag_left , #top_visual .main_atag_wrap .atag_right {
    display:flex;
    gap:130px;
}
#top_visual .main_atag_wrap a {
    display:flex;
    align-items:center;
    gap: 10px;
}
#top_visual .main_atag_wrap a .atag_text_wrap {
    text-decoration:none;    
}
#top_visual .main_atag_wrap a .atag_text_wrap p {
    font-family: 'LotteMartHappy';
    font-weight: 500;
    font-size: 14px;
}
#top_visual .main_atag_wrap a .atag_text_wrap h3 {
    margin-top:5px;
    font-family: 'twayair';
    font-weight: 500;
    font-size: 20px;
    color: #14408b;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
#top_visual .main_atag_wrap .atag_img_wrap {
    display: flex;
    justify-content: center;
    width: 67px;
    height: 67px;
    border-radius: 100%;
    overflow: hidden;
}

#top_visual .gamestart_main span {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    z-index: 1;
}
#top_visual .gamestart_main img {
    display: none;
}
/*탑 비주얼*/
#top_visual .login_rumble{position: absolute;right: 0px;bottom: 0px;background: none; cursor: pointer;z-index: 20;}
#top_visual .login_rumble span{position:absolute; left:0; bottom:0; right:0; top:0; z-index:1;}
#top_visual .login_rumble img{display: block;}

.vg_text{position: absolute;right: 46px;top: 171px;width: 241px;text-align: right;}
.vg_text span{display: none;margin-bottom: 5px;}
.vg_text span.txt01{
	display: inline-block;
	-webkit-animation: txt_right01 1.2s ease-in 0s 1 normal ;
	animation: txt_right01 1.2s ease-in 0s 1 normal ;
}
.vg_text span.txt02{
	display: inline-block;
	-webkit-animation: txt_right02 1.5s ease-in 0s 1 normal ;
	animation: txt_right02 1.5s ease-in 0s 1 normal ;
}

.main_video_bg {
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    background:rgba(0,0,0,0.4);
}
.mo_menu_top {
    display: none;
}
.mo_menu_trigger {
    display:none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left:10px;
}
.mo_menu_trigger i {
    color: #fff;
    font-size: 30px;
}
@media (max-width:1400px) and (min-width:1001px) {
    #header .logo {
        width:100px;
    }
    #header .logo a img {
        max-width:100px !important;
    }
    .header_right_wrap .login_on.active a.login {
        padding: 8px 4px;
    }
    .header_right_wrap .login_on.active a span {
        display: none;
    }
}
@media (max-width:1400px) {
    .header_right_wrap .login_on.active a.login {
        padding: 8px 4px;
    }

    .header_right_wrap .login_on.active a span {
        display: none;
    }
}
@media(max-width:1000px) {
    #header {
        height: 82px !important;
        box-sizing: border-box;
    }
    .mo_menu_trigger {
        display:block;
    }
    .header_right_wrap {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
    }
    .layout_wrap {
        justify-content:center;
        background: #111;
    }
    #header .logo {
        margin-left:0;
    }
    .gnb_mo_bg {
        z-index:2;
        position: fixed;
        display: block;
        background: rgba(0,0,0,0.7);
        width: 100%;
        height: 100vh;
        display: none;
    }

    #gnb {
        z-index:3;
        left: -300px;
        position: fixed;
        width: 200px;
        background: #333;
        height: 100vh;
        padding: 0;
        box-sizing: border-box;
        overflow-y: scroll;
    }
    #gnb .mo_menu_top {
        display:block;
        width:200px;
        padding:20px 10px;
        box-sizing:border-box;
        display:flex;
        justify-content:space-between;
        height: 70.39px;
        position:fixed;
        background:#2a2a2a;
    }
    #gnb .mo_menu_top .mo_gnb_close i {
        font-size:30px;
        color: #c5c5c5;
    }
    #gnb .gnb_list {
        padding-top:70.39px;
        display: flex;
        flex-direction: column;
        padding-bottom:200px;
    }
    .user_login {
        display: none;
    }

    .footer_wrap .conpany_info_wrap ul li ul {
        flex-direction: column;
        align-items: center;
        gap: 0;
    }

    #gnb .gnb_list > li {
        width: 100%;
        text-align: left;
        margin-top: 0;
    }

    #gnb .gnb_list > li > a {
        display: block;
        width: 100%;
        height: auto;
        padding: 10px 20px;
        background: #222;
        text-indent: 0;
        font-size: 16px;
        box-sizing: border-box;
        font-family: 'Pretendard';
        font-weight: 500;
        font-size: 18px;
        color: #fff;
        background-image: none !important;
    }

    #gnb .gnb_list > li .depth02 {
        display: block;
        margin-top: 0;
    }

    #gnb .gnb_list > li .depth02 > li {
        padding:0;
        box-sizing: border-box;
    }

    #gnb .gnb_list > li .depth02 > li > a {
        color: #c5c5c5;
        display:inline-block;
        width:100%;
        padding: 10px 20px;
        box-sizing: border-box;
    }
}
@media(max-width:600px) {
    .footer_wrap .policy_wrap ul {
        padding:0;
        padding-top:40px;
        gap:25px;
    }
    .footer_wrap .policy_wrap ul span {
        font-size:13px;
    }
    .footer_wrap .policy_wrap ul li:after {
        right: -12.5px;
    }
    .header_right_wrap .login, .header_right_wrap .log_out {
        padding: 8px 5px;
    }
    .header_right_wrap .login span, .header_right_wrap .log_out span {
        display: none;
    }
    .header_right_wrap .log_out {
        display:none;
    }
    .mo_none {
        display:none !important;
    }
}