﻿/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
 /* @font-face {
   font-family: 'NanumMyeongjo';
   font-style: normal;
   font-weight: 400;
   src: url('../fonts/NanumMyeongjo.otf') format('otf'),
        url('../fonts/NanumMyeongjo.ttf') format('truetype');

} */


/* ==========================================================================
 Base styles: opinionated defaults
 ========================================================================== */

html, button, input, select, textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #fcb3d4;
    text-shadow: none;
}

::selection {
    background: #fcb3d4;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
 Chrome Frame prompt
 ========================================================================== */

.chromeframe {
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    background: #ccc;
    color: #000;
    padding: 0.9em;
    margin: 0;
    width: 100%;
    min-width: 1200px;
    z-index: 1000;
}

/* ==========================================================================
 Author's custom styles
 ========================================================================== */
div, h1, h2, h3, h4, h5, ul, li, p, input, table, th, td {
    margin: 0;
    padding: 0;
}
img {
    border: 0;
    vertical-align: middle;
}
input {
    line-height: 130%;
    border: 0;
}
li {
    list-style: none;
}
::-webkit-input-placeholder {
    color: #999;
}
::-moz-placeholder, input:-moz-placeholder {
    color: #999;
}
.lt-ie8 caption {
    display: none;
}
body {
    font-family: "Microsoft JhengHei", Dotum, Gulim, AppleGothic, Arial, Sans-serif;
    font-size: 14px;
    line-height: 130%;
    color: #666;
    background-color: #e6e6e6;
}
h5 {
    font-size: 12px;
}
html, button, input, select, textarea {
    font-family: "Microsoft JhengHei", Dotum, Gulim, AppleGothic, Arial, Sans-serif;
}
a {
    color: #666;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
iframe {
    display: block;
}
/*130819:Ã¬Â¶â€ÃªÂ°â‚¬(Ã¬â€¹Å“Ã¬Å¾â€˜)*/
table{
    word-break:break-all;
}
/*130819:Ã¬Â¶â€ÃªÂ°â‚¬(Ã«ÂÂ)*/

/*ÃªÂ³ÂµÃ­â€ Âµ Ã¬Å Â¤Ã­Æ’â‚¬Ã¬ÂÂ¼*/
.d_eleven {
    font-size: 13px;
    /* letter-spacing: -1px; */
}
.bold {
    font-weight: bold;
}
.f_gray_9 {
    color: #7e7e7e;
}
.ir {
    text-indent: -5000px;
    overflow: hidden;
}
select {
    border: 1px solid #abadb3;
}
/*15.07.20 Ã¬Ë†ËœÃ¬Â â€¢*/
/* Ã¬â€šÂ­Ã¬Â Å“
body {
	position: relative;
    min-width: 1036px;
    padding-left: 233px;
}*/

/* #wrapper {min-width:1000px; margin:0 auto; background: url('../images/main_bg01.jpg') top center no-repeat;} */

/*nav*/

area:focus{
  border: none;
  outline:none;
  outline-style: none;
  -moz-outline-style:none;
}
img,
img a {
 outline: none !important;
 border: none !important;
}

/* 2019-02-19 Ã«Â¦Â¬Ã«â€°Â´ gnb Ã¬Ë†ËœÃ¬Â â€¢ Ã¬â€¹Å“Ã¬Å¾â€˜*/
#wrapper {
    min-width:1000px;
    margin:0 auto;
    background-color: #fff;
    /* background: url('../images/main_bg01.jpg') top center no-repeat; */
    /* width: 1920px; */
}
/*nav*/
header {
    overflow: hidden;
    position: absolute;
    height:93px;
    /* top: 55px; */
    left: 0;
    z-index: 100;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.9);
}


header h1 {
    float: left;
}
header h1 a img{
    position: relative;
    width: 149px;
    height: 95px;
    top: -8px;
}
#navigation {
    overflow: hidden;
    width: 960px;
    margin: 0 auto;
}

#navigation ul#parent {
    position: relative;
    left: 15px;
}
#navigation ul#parent li{
    font-family: 'Microsoft JhengHei';
    font-size: 19px;
    float: left;
    width: 114px;
    text-align: center;
    padding-top: 36px;
}
#navigation ul#parent li a{
    text-decoration: none;
    color: #b8b8b8;
    outline: none;
}
#navigation ul#parent span{
    position: absolute;
    background: url('../images/gnb_bar.png') no-repeat;
    width: 1px;
    height: 14px;
    top: 37px;
    margin-left: -2px;
}
#navigation #parent .child li a:hover {
    color: #f78d1b;
    /* font-weight: bold; */
}
#navigation #parent ul.child {
    display: none;
    width: 100%!important;
    /* height: 315px; */
    padding-top: 65px;
    color: #888888;
}
#navigation #parent ul.child li{
    padding-top: 13px;
    font-size: 15px;
}
#navigation #parent ul.child li a{
    color: #888888;
}
#navigation #parent ul.child li:nth-child(1){
    padding-top: 0;
}
#navigation #parent li ul.child li.gnb_1{
    height: 227px;
}
#navigation #parent li ul.child li.gnb_2{
    height: 227px;
}
#navigation #parent li ul.child li.gnb_3{
    height: 58px;
}
#navigation #parent li ul.child li.gnb_5{
    height: 143px;
}
#navigation #parent li ul.child li.gnb_6{
    height: 115px;
}
#navigation #parent li ul.child li.gnb_7{
    height: 170px;
}
#navigation #parent li.gnb_4 ul.child li{
    height: 282px;
}
#slide {
    position:absolute;
    /* width: 62px!important; */
    top: 92px;
    bottom:0;
    height:1px;
    background:#f77d1b;
    z-index:200;
    left: 20px;
}
#navigation .under_bg{
    position: absolute;
    left: 0;
    top: 92px;
    width: 100%;
    height: 1px;
    background-color: #202020;
}
/* 2019-02-19 Ã«Â¦Â¬Ã«â€°Â´ bng Ã¬Ë†ËœÃ¬Â â€¢ Ã«ÂÂ*/

/* 2019-02-19 Ã«Â¦Â¬Ã«â€°Â´ Ã«Â¯Â¸Ã«â€œÂ¤ Ã¬ËœÂÃ¬â€”Â­ Ã¬Ë†ËœÃ¬Â â€¢ Ã¬â€¹Å“Ã¬Å¾â€˜*/

#contents .con_top {
    position: relative;
    width: 960px;
    height: 325px;
    /* background: url('../images/con_top_bg.gif') 0 0 no-repeat; */
    z-index: 5;
}
/* ÃªÂ³ÂµÃ¬Â§â‚¬Ã¬â€šÂ¬Ã­â€¢Â­, Ã¬â€”â€¦Ã«ÂÂ°Ã¬ÂÂ´Ã­Å Â¸ Ã¬ËœÂÃ¬â€”Â­ */
#contents .con_top .board_box_wrap{
    position: relative;
    width: 708px;
    height: 330px;
    padding-left: 10px;
    font-family: 'Microsoft JhengHei';
}
#contents .con_top .board_box_wrap .board_list{
    position: relative;
    top: 40px;
}
#contents .con_top .board_box_wrap ul{
    float: left;
}
#contents .con_top .board_box_wrap ul.update{
    padding-left: 22px;
}
#contents .con_top .board_box_wrap ul li:first-child{
    font-size: 26px;
    font-family: '微软雅黑', Microsoft YaHei;
    color: #000;
    padding-left: 12px;
    width: 311px;
    font-weight: 600;
}
#contents .con_top .board_box_wrap ul li:first-child a{
    position: relative;
    left: 187px;
}
#contents .con_top .board_box_wrap ul li:first-child a span{
    display: inline-block;
    width: 13px;
    height: 13px;
    background: url('../images/board_more.png') no-repeat;
    text-indent: -99999px;
}
#contents .con_top .board_box_wrap ul li{
    width: 304px;
    padding: 15px 0 15px 19px;
    border-bottom: 1px solid #e5e5e5;
    /* width: 308px;
    padding: 15px 0 14px 15px;
    border-bottom: 1px solid #e5e5e5; */
}
#contents .con_top .board_box_wrap ul li a{
    font-family: 'Microsoft JhengHei';
    color: #666666;
    font-size: 15px;
    height: 16px;
    display: inline-block;
    max-width: 197px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    word-break: break-word;

}
#contents .con_top .board_box_wrap ul.notice li span.date{
    position: absolute;
    font-size: 14px;
    color: #999999;
    left: 255px;
}
#contents .con_top .board_box_wrap ul.notice li img.list_style{
    position: relative;
    top: -4px;
    left: -8px;
}
#contents .con_top .board_box_wrap ul.update li img.list_style{
    position: relative;
    top: -4px;
    left: -8px;
}

#contents .con_top .board_box_wrap ul li img.new{
    position: absolute;
    padding-left: 5px;
}

#contents .con_top .board_box_wrap ul.update li span.date2{
    position: absolute;
    font-size: 14px;
    color: #999999;
    right: 48px;
}

/*Game Start*/
#contents .con_top .start {
    position: absolute;
    top: 39px;
    left: 697px;
    width: 245px;
    height: 127px;
}

/*Login Box*/
#contents .con_top .loginbox {
    position: absolute;
    top: 174px;
    left: 697px;
    width: 243px;
    height: 98px;
    border: 1px solid #e5e5e5;
}
/* Ã¬â€žÅ“Ã«Â¸Å’ Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã¬ËœÂÃ¬â€”Â­ */
#contents .con_top_sub {
    position: absolute;
    width: 958px;
    height: 72px;
    top: 453px;
    background-color: rgba(0, 0, 0, 0.9);
    border: 1px solid #272424;
    border-bottom: none;
    z-index: 5;
    /* opacity: 0.9; */
}
#contents .con_top_sub .start {
    position: absolute;
    top: 11px;
    right: 17px;
    width: 162px;
    height: 50px;
    z-index: 7;
}

/*Login Box*/
#contents .con_top_sub .loginbox {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 960px;
    height: 72px;
    z-index: 6;
}
#contents .con_top_sub .loginbox h2{
    display: none;
}
/*Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã¬Â â€ž*/
#contents .con_top_sub .login_befor .login_befor_btn a{
    display: block;
    position: absolute;
    top: 15px;
    left: 18px;
    width: 138px;
    height: 43px;
    background: url('../images/login_befor_btn.png') 0 0 no-repeat;
    border:none;
    cursor: pointer;
}
#contents .con_top_sub .loginbox ul {
    position: absolute;
    top: 28px;
    width: 340px;
    height: 39px;
    background-color: #050000;
    left: 158px;
    border: none;
}
/*130827:Ã¬Ë†ËœÃ¬Â â€¢(Ã¬â€¹Å“Ã¬Å¾â€˜)*/
#contents .con_top_sub .loginbox ul li{
    float: left;
    height: 15px;
    padding: 0 13px 0 13px;
    background: url('../images/loginbox_bar.png') right 2px no-repeat;
}
#contents .con_top_sub .loginbox ul li a{
    font-size: 15px;
    font-weight: 600;
    font-family: 'Microsoft JhengHei';
    color: #797979;
    text-decoration: none;
}
#contents .con_top_sub .loginbox ul li.firsts a:nth-child(1){
    padding-left: 13px;
    font-weight: 600;
    background: url('../images/loginbox_disc.png') left 7px no-repeat;
    color: #9d9d9d;
}
#contents .con_top_sub .loginbox ul li:last-child{
    background: none;
}

/* Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã­â€ºâ€ž */

#contents .con_top_sub .loginbox.login_after ul {
    position: absolute;
    top: 25px;
    width: 770px;
    height: 39px;
    background-color: #050000;
    left: 158px;
    border: none;
}
/*130827:Ã¬Ë†ËœÃ¬Â â€¢(Ã¬â€¹Å“Ã¬Å¾â€˜)*/
#contents .con_top_sub .loginbox.login_after ul li{
    float: left;
    height: 22px;
    padding: 3px 13px 0 13px;
    background: url('../images/loginbox_bar.png') right 5px no-repeat;
}
#contents .con_top_sub .loginbox ul li a{
    font-size: 15px;
    font-family: 'Microsoft JhengHei';
    color: #797979;
}
#contents .con_top_sub .loginbox.login_after ul li.firsts a span{
    color: #f34d0b;
    /* text-decoration: underline; */
}
#contents .con_top_sub .loginbox.login_after ul li.firsts a:nth-child(1){
    padding-left: 13px;
    font-weight: 600;
    background: url('../images/loginbox_disc.png') left 7px no-repeat;
    color: #9d9d9d;
}
#contents .con_top_sub .loginbox.login_after ul li:nth-child(4){
    background: url('../images/login_after_coin.png') left 11px top 4PX no-repeat;
    padding-left: 30px;
}
#contents .con_top_sub .loginbox.login_after ul li a.charg span{
    background: url('../images/login_after_charg.png') no-repeat;
    height: 26px;
}
#contents .con_top_sub .loginbox.login_after ul li:last-child{
    background: none;
    position: relative;
    /* top: -4px; */
    /* left: -16px; */
}


/* #contents .con_top_sub .login_after .login_after_btn {
    display: block;
    position: absolute;
    top: 15px;
    left: 18px;
    width: 138px;
    height: 43px;
    background: url('../images/login_after_btn.png') 0 0 no-repeat;
    border:none;
    cursor: pointer;
} */

/* Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã¬Â â€ž Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã«Â²â€žÃ­Å Â¼ */
#contents .con_top_sub .login_befor .login_btn{
    position: absolute;
    top: 15px;
    left: 18px;
    width: 138px;
    height: 43px;
}

/* Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã­â€ºâ€ž Ã«Â¡Å“ÃªÂ·Â¸Ã¬â€¢â€žÃ¬â€ºÆ’ Ã«Â²â€žÃ­Å Â¼ */
#contents .con_top_sub .login_after .logout_btn{
    position: absolute;
    top: 15px;
    left: 18px;
    width: 138px;
    height: 43px;
}

/*Ã¬Â»Â¨Ã­â€¦ÂÃ¬Â¸Â  Ã¬ËœÂÃ¬â€”Â­*/
/*15.07.20 Ã¬Ë†ËœÃ¬Â â€¢*/
#contents {
    width: 960px;
	margin:0 auto;
}
/*15.07.20 Ã¬Ë†ËœÃ¬Â â€¢(Ã«ÂÂ)*/
#contents .con {
    position: relative;
    margin-top: 19px;
    margin-bottom: 0px;
}
/* Ã­â€¢ËœÃ«â€¹Â¨Ã¬Â â€¢Ã«Â³Â´ */
/* Ã­â€˜Â¸Ã­â€žÂ° Ã¬Ë†ËœÃ¬Â â€¢Ã¬â€¹Å“ Ã«Â¡Å“ÃªÂ·Â¸Ã¬ÂÂ¸ Ã­Å½ËœÃ¬ÂÂ´Ã¬Â§â‚¬ common.cssÃ«Ââ€ž Ã¬Ë†ËœÃ¬Â â€¢(membership-register-css)*/

footer {
    width: 100%;
    height: 200px;
    background-color: #2f2f2f;
}

footer .footer_wrap{
    position: relative;
	width:960px;
	margin:0 auto;
}
footer h3 {
    position: absolute;
    top: 53px;
	left: 34px;
}
footer .foot_menu {
    padding: 50px 0 6px 215px;
    /* height: 15px; */
}
footer .foot_menu li {
    float: left;
}
footer .foot_menu li {
    padding: 0 11px;
    background: url('../images/foot_bar.gif') right 2px no-repeat;
}
footer .foot_menu li:nth-child(4) a{
    color: #ffffff;
}
footer .foot_menu li:last-child {
    background: none;
}
footer .foot_menu li a {
    font-size: 14px;
    font-family: "Microsoft JhengHei";
    color: #8f8f8f;
    text-decoration: none;
}
footer .foot_add {
    width: 700px;     /* 2019-04-10 Ã¬Ë†ËœÃ¬Â â€¢ */
    padding: 25px 0 6px 215px;
    height: 25px;
}
footer .foot_add li {
    float: left;
}
footer .foot_add li {
    padding: 0 10px;
    background: url('../images/foot_bar.gif') right 2px no-repeat;
}
footer .foot_add li {
    font-size: 13px;
    color: #747474;
    padding-bottom: 6px;
}
footer .foot_add li:nth-child(3){
    background: none;
    padding-right: 20px;    /* 2019-04-10 Ã¬Â¶â€ÃªÂ°â‚¬ */
}
footer .foot_add li:nth-child(6){
    background: none;
}
footer .foot_add li:nth-child(7){
    color: #f68e56;
}
footer .foot_add li:nth-child(9){
    background: none;
}
footer .foot_add li:last-child{
    background: none;
}
.tooltip {
  text-decoration:none;
  position:relative;
}
.tooltip span {
  display:none;
}
.tooltip span img {
  float:left;
  margin:0px 8px 8px 0;
}
.tooltip:hover span {
    display: block;
    position: absolute;
    top: -99px;
    left: -331px;
}
footer .copy li {
    font-size: 13px;
    color: #747474;
    padding-left: 226px;
    /* padding-top: 20px; */
}



footer .foot_menu .first {
    padding-left: 0;
}
footer .foot_menu .last {
    padding-right: 0;
    background: none;
}
footer address {
    padding:0 0 8px 215px;
}
/*15.07.21 Ã¬Ë†ËœÃ¬Â â€¢*/
footer .fcopy {
    padding: 0 0 60px 215px;
}
/*15.07.21 Ã¬Ë†ËœÃ¬Â â€¢*/
footer .grade {
    display: block;
    width: 409px;
    height: 43px;
    margin:0 0 1px 215px;
    border:none;
}
footer .grade caption {
    position: absolute;
    top: 73px;
    left: 215px;
    width: 410px;
    height: 43px;
    text-indent: -1000px;
    overflow: hidden;
    background: url('../images/footer_grade.gif') 0 0 no-repeat;

}
/*15.07.20 Ã¬Ë†ËœÃ¬Â â€¢(Ã«ÂÂ)*/
.lt-ie8 footer .grade th, .lt-ie8 footer .grade td {
    display: none;
}
.lt-ie8 footer .grade {
    background: url('../images/footer_grade.gif') 0 0 no-repeat;
}
footer .grade th, footer .grade td {
    font-size: 11px;
    letter-spacing: -1px;
    line-height: 110%;
    background: #2d98de;
    color: #fff;
    border: 1px solid #55abe5;
    text-align: left;
    text-indent: 5px;
}
footer .grade th {
    font-weight: normal;
}
footer .grade td {
    font-weight: bold;
}
footer .grade .col_01 {
    width: 79px;
}
footer .grade .col_02 {
    width: 79px;
}
footer .grade .col_03 {
    width: 99px;
}
footer .grade .col_04 {
    width: 151px;
}

footer .family {
    position: absolute;
    top: -1px;
    left: 751px;
}
footer .family select {
    border: 1px solid #c7c7c7;
}
/*130719:Ã¬Â¶â€ÃªÂ°â‚¬ - Ã¬Â¶â€Ã¬Â²Å“Ã­â€¢ËœÃªÂ¸Â°Ã«Â²â€žÃ­Å Â¼ background*/
.view tbody tr{
	background:#fcfcfc;
}

/*130808:Ã¬Â¶â€ÃªÂ°â‚¬*/
.check_box{
	border:1px solid red;
}


/*131129:Ã¬Â¶â€ÃªÂ°â‚¬*/
/*Ã¬â€¢â€žÃ¬ÂÂ´Ã­â€¦Å“Ã«ÂªÂ° ÃªÂ²Â°Ã¬Â Å“ Ã«Â¬Â¸Ã¬ÂËœ*/
header .itemmal_tel {
    position: absolute;
    /*top: 1148px;*/
    bottom:145px;
    right: 10px;
}

/* 2016-02-05 Ã¬Â¶â€ÃªÂ°â‚¬ L&K Ã­â€ ÂµÃ­â€¢Â© Ã«Â°â€ Ã¬â€¹Å“Ã¬Å¾â€˜ */
.clearfix{*zoom: 1;}
.clearfix:after{content: '';display: block;clear: both;}
.blind{position:absolute;left:-10000px;top:auto;height:1px;overflow:hidden;}
.last_p{padding-right: 0 !important;}

#lnk_gnb{background-color: #fff;height: 53px;border-top: 2px solid #ff6419;}
.lnk_center{width: 962px;margin: 0 auto;}
.company_logo{float: left; padding-top: 14px; padding-left: 6px; }
.top_gnb{float: right;height: 38px; padding-right: 32px;}
.top_gnb li{background: url(../images/gb_line.png) left center no-repeat;}
.top_gnb li:first-child{background: none;}
.top_gnb a{display: block;padding: 17px 10px;height: 100%;}
.lnk_center>ul li{float: left;}
/* 2016-02-04 Ã¬Â¶â€ÃªÂ°â‚¬ L&K Ã­â€ ÂµÃ­â€¢Â© Ã«Â°â€ Ã«ÂÂ */


/* 2018-10-05 Ã«â€žÂ¤Ã¬ÂÂ´Ã«Â²â€ž ÃªÂ²â‚¬Ã¬Æ’â€° Ã¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ */
.pop_wrap1 {position: fixed;left: 0;top: 0;width: 100%;height: 2793px;background: url(../images/bg_pop.png) 0 0;z-index: 99999;display: none;}
.pop1{position: absolute;width: 700px;height: 724px;left: 44%;top: 18%;margin-left: -226.5px;margin-top: -309px;}
.pop_close {position: absolute;right: 22px;top: 20px;cursor: pointer;}
.btn_pop {position: absolute; left: 256px; top: 381px;}

/* 2019-10-21 Ã­â€¢Â Ã«Â¡Å“Ã¬Å“Ë† Ã¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ */
.pop_wrap3 {position: fixed;left: 0;top: 0;width: 100%;height: 2793px;background: url(../images/bg_pop.png) 0 0;z-index: 99999;display: none;}
.pop3{position: absolute;width: 912px;height: 809px;left: 36%;top: 13%;margin-left: -226.5px;margin-top: -309px;}
/* .pop_close3 {position: absolute;right: 76px;top: 3px;cursor: pointer;} */
.btn_pop3 {position: absolute; left: 300px; top: 600px;}


.pop_close3 {position: absolute; right: 0; top: 0; width: 56px; height: 56px;}
.pop_close3 button{z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 56px; height: 56px;
    background: #000;
    text-indent: 0;
    opacity: 1;
}
.pop_close3 button:after {
        z-index: 2;
        position: absolute;
        left: 16px;
        top: 16px;
        content: '';
        display: block;
        width: 25px;
        height: 22px;
        background: url(../images/pop_close3_x.png) no-repeat;
    }

.pop_close3 button:hover {background:#530e84;}
.pop_close3 button:hover:after {animation: spin 0.2s linear;}

@keyframes spin{
  from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(90deg); }
}

.pop3 {
    animation: fadeInDown 1s;
    -moz-animation: fadeInDown 1s; /* Firefox */
    -webkit-animation: fadeInDown 1s; /* Safari and Chrome */
    -o-animation: fadeInDown 1s; /* Opera */
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

.day_off3 {position: absolute; right: 218px; bottom: 27px;}
.day_off3 .text {position: absolute; right: -198px; bottom: -8px;}
input.popup_chack_2[type=checkbox] {display:none;}
input.popup_chack_2[type=checkbox] + label {cursor: pointer;height: 23px;position: absolute;top: -12px;padding-left: 40px;background: url('../images/check_off_2.png') left/23px no-repeat;}
input.popup_chack_2[type=checkbox]:checked + label { background-image: url('../images/check_on_2.png'); }
/* 2019-10-21  Ã­â€¢Â Ã«Â¡Å“Ã¬Å“Ë† Ã¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ Ã«ÂÂ */

/* 2019-12-17 Ã­ÂÂ¬Ã«Â¦Â¬Ã¬Å Â¤Ã«Â§Ë†Ã¬Å Â¤ gmÃ¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ */
.pop_wrap4 {position: fixed;left: 0;top: 0;width: 100%;height: 2793px;background: url(../images/bg_pop.png) 0 0;z-index: 99999;display: none;}
.pop4{position: absolute;width: 912px;height: 809px;left: 36%;top: 13%;margin-left: -226.5px;margin-top: -309px;}
/* .pop_close3 {position: absolute;right: 76px;top: 3px;cursor: pointer;} */
.btn_pop4 {position: absolute; left: 315px; top: 580px;}

.pop_close4 {position: absolute; right: 0; top: 0; width: 56px; height: 56px;}
.pop_close4 button{z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 56px; height: 56px;
    background: #000;
    text-indent: 0;
    opacity: 1;
}
.pop_close4 button:after {
        z-index: 2;
        position: absolute;
        left: 16px;
        top: 16px;
        content: '';
        display: block;
        width: 25px;
        height: 22px;
        background: url(../images/pop_close3_x.png) no-repeat;
    }

.pop_close4 button:hover {background:#530e84;}
.pop_close4 button:hover:after {animation: spin 0.2s linear;}

@keyframes spin{
  from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(90deg); }
}

.pop4 {
    animation: fadeInDown 1s;
    -moz-animation: fadeInDown 1s; /* Firefox */
    -webkit-animation: fadeInDown 1s; /* Safari and Chrome */
    -o-animation: fadeInDown 1s; /* Opera */
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

.day_off4 {position: absolute; right: 218px; bottom: 27px;}
.day_off4 .text {position: absolute; right: -198px; bottom: -8px;}
input.popup_chack_3[type=checkbox] {display:none;}
input.popup_chack_3[type=checkbox] + label {cursor: pointer;height: 22px;position: absolute;top: -12px;padding-left: 40px;background: url('../images/check_off4.png') left/22px no-repeat;}
input.popup_chack_3[type=checkbox]:checked + label { background-image: url('../images/check_on4.png'); }
/* 2019-12-17  Ã­ÂÂ¬Ã«Â¦Â¬Ã¬Å Â¤Ã«Â§Ë†Ã¬Å Â¤ gmÃ¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ Ã«ÂÂ */

/* 2019-12-27 Ã¬Æ’Ë†Ã­â€¢Â´ Ã¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ */
.pop_wrap5 {position: fixed;left: 0;top: 0;width: 100%;height: 2793px;background: url(../images/bg_pop.png) 0 0;z-index: 99999;display: none;}
.pop5{position: absolute;width: 999px;height: 809px;left: 36%;top: 13%;margin-left: -226.5px;margin-top: -309px;}

.pop_close5 {position: absolute; right: 0; top: 0; width: 56px; height: 56px;}
.pop_close5 button{z-index: 1;
    position: absolute;
    left: 0;
    top: 0;
    width: 56px; height: 56px;
    background: #000;
    text-indent: 0;
    opacity: 1;
}
.pop_close5 button:after {
        z-index: 2;
        position: absolute;
        left: 16px;
        top: 16px;
        content: '';
        display: block;
        width: 25px;
        height: 22px;
        background: url(../images/pop_close3_x.png) no-repeat;
    }

.pop_close5 button:hover {background:#530e84;}
.pop_close5 button:hover:after {animation: spin 0.2s linear;}

@keyframes spin{
  from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(90deg); }
}

.pop5 {
    animation: fadeInDown 1s;
    -moz-animation: fadeInDown 1s; /* Firefox */
    -webkit-animation: fadeInDown 1s; /* Safari and Chrome */
    -o-animation: fadeInDown 1s; /* Opera */
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

.day_off5 {position: absolute; right: 218px; bottom: 27px;}
.day_off5 .text {position: absolute; right: -198px; bottom: -8px;}
input.popup_chack_4[type=checkbox] {display:none;}
input.popup_chack_4[type=checkbox] + label {cursor: pointer;height: 22px;position: absolute;top: -12px;padding-left: 40px;background: url('../images/check_off4.png') left/22px no-repeat;}
input.popup_chack_4[type=checkbox]:checked + label { background-image: url('../images/check_on4.png'); }
/* 2019-12-27  Ã¬Æ’Ë†Ã­â€¢Â´ Ã¬ÂÂ´Ã«Â²Â¤Ã­Å Â¸ Ã¬Â¶â€ÃªÂ°â‚¬ Ã«ÂÂ */

/* Ã«â€žÂ¤Ã¬ÂÂ´Ã«Â²â€ž Ã¬Â±â€žÃ«â€žÂÃ«Â§Â */
header.naver {
    overflow: hidden;
    position: absolute;
    height: 93px;
    top: 0px;
    left: 0;
    z-index: 100;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.9);
}
#contents .con_top_sub.naver {
    position: absolute;
    width: 958px;
    height: 72px;
    top: 453px;
    background-color: rgba(0, 0, 0, 0.9);
    border: 1px solid #272424;
    border-bottom: none;
    z-index: 5;
}

#contents .con_top_sub.naver .login_after{

}
#contents .con_top_sub.naver .login_after .login_after_btn{
    display: block;
    position: absolute;
    top: 15px;
    left: 18px;
    width: 167px;
    height: 43px;
    background: url(../images/login_after_btn_naver.png) 0 0 no-repeat;
    border: none;
    cursor: pointer;
}
#contents .con_top_sub.naver .login_after ul{
    position: absolute;
    top: 25px;
    width: 585px;
    height: 39px;
    background-color: #050000;
    left: 189px;
    border: none;
}
#contents .con_top_sub.naver .loginbox.login_after ul li:nth-child(3) {
    background: url(../images/login_after_coin.png) left 11px top 3px no-repeat;
    padding-left: 30px;
}
/* #contents .con_top_sub.naver .login_befor .login_befor_btn {
    display: block;
    position: absolute;
    top: 15px;
    left: 18px;
    width: 167px;
    height: 43px;
    background: url(../images/login_befor_btn_naver.png) 0 0 no-repeat;
    border: none;
    cursor: pointer;
} */
#contents .con_top_sub.naver .login_befor ul {
    position: absolute;
    top: 28px;
    width: 340px;
    height: 39px;
    background-color: #050000;
    left: 189px;
    border: none;
}
/* ÃªÂ°â‚¬Ã¬Å¾â€¦ Ã¬Â â€ž Ã¬â€¢Â½ÃªÂ´â‚¬Ã«Ââ„¢Ã¬ÂËœ */
#contents .con_top_sub.naver .naver_p ul{
    position: absolute;
    width: 580px;
    height: 72px;
    top: 0;
    left: 0;
}
#contents .con_top_sub.naver .naver_p ul li{
    float: left;
    height: 15px;
    font-family: 'Microsoft JhengHei';
    font-size: 15px;
    color: #797979;
    padding: 0;
    background: none;
}
#contents .con_top_sub.naver .naver_p ul li:first-child{
    padding: 27px 13px 0 32px;
    font-weight: 600;
}
#contents .con_top_sub.naver .naver_p ul li:last-child{
    padding-top: 17px;
}
/* ÃªÂ²Å’Ã¬Å¾â€ž Ã­â€¢Â´Ã¬Â§â‚¬ Ã¬Â²Â Ã­Å¡Å’ */
#contents .con_top_sub.naver .naver_c ul{
    position: absolute;
    width: 580px;
    height: 72px;
    top: 0;
    left: 0;
}
#contents .con_top_sub.naver .naver_c ul li{
    float: left;
    height: 15px;
    font-family: 'Microsoft JhengHei';
    font-size: 15px;
    color: #797979;
    padding: 0;
    background: none;
}
#contents .con_top_sub.naver .naver_c ul li:first-child{
    padding: 27px 13px 0 32px;
    font-weight: 600;
}
#contents .con_top_sub.naver .naver_c ul li:last-child{
    padding-top: 17px;
}

/* my page */
header.mypage {
    overflow: hidden;
    position: absolute;
    height:93px;
    top: 55px;
    left: 0;
    z-index: 100;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.9);

}

header.mypage h1 {
    float: left;
}
/* header.mypage span{
    position: relative;
    top: -8px;
} */
header.mypage #navigation {
    overflow: hidden;
    width: 960px;
    margin: 0 auto;
}

header.mypage #navigation ul#parent {
    position: relative;
    left: 15px;
}
header.mypage #navigation ul#parent li{
    font-family: 'Microsoft JhengHei';
    font-size: 19px;
    float: left;
    width: 133px;
    text-align: center;
    padding-top: 36px;
}
header.mypage #navigation ul#parent li a{
    text-decoration: none;
    color: #b8b8b8;
}
header.mypage #navigation ul#parent span{
    position: absolute;
    background: url('../images/gnb_bar.png') no-repeat;
    width: 1px;
    height: 14px;
    top: 37px;
    margin-left: -2px;
}
header.mypage #navigation #parent li a:hover {
    color: #f78d1b;
}

header.mypage #navigation #slide{    /* 2019-04-17 Ã¬Â¶â€ÃªÂ°â‚¬ */
    display: none!important;
}

/* .active {
    color: #f78d1b!important;
} */

/* header.mypage #navigation ul#parent li.gnb_06{
    width: 91px;
} */

@media only screen and (max-device-width: 980px) and (min-device-width: 320px){

  body{width: 1000px;}
  header{width: 1000px;}
  header.naver{width: 1000px;}

  .quick_facebook { display: none; }
  .pop2 {left: 23%; top: 17%;}
  .pop3 {left: 27%; top: 17%;}
  .pop4 {left: 27%; top: 17%;}
}
