@charset "utf-8";

#wrap, html, body {;margin:0;padding:0;}
.clear { content:"" ; display:block;  height:0px; line-height:0px; font-size:0px; clear:both; }
body { width: 1903px; min-height: 795px;background: #000; }

#smartPop_overlay { background: #000 !important; }
#smartPop_content { padding: 0px !important;  }
#smartPop_container {background-color:white; -webkit-box-shadow:none !important;}

.naver_login_btn { display: inline-block;*display: inline;*zoom: 1; font-size: 0pt;line-height:0pt; width: 70px;height: 31px;background: url(http://cdn-img.kingkongsoft.kr/www/common/channel/naver/btn_naver_login.png) 0 0 no-repeat;vertical-align: middle;margin-left: 5px;}
.naver_login_btn > img {display: none;}
.kakao_login_btn { display: inline-block;*display: inline;*zoom: 1; font-size: 0pt;line-height:0pt; width: 70px;height: 31px;background: url(http://cdn-img.kingkongsoft.kr/www/common/channel/kakao/btn_kakaol_login.png) 0 0 no-repeat;margin-left: 5px;vertical-align: middle;}
.kakao_login_btn > img {display: none;}


div.container {position: relative;}

div.section {position: relative; height: 931px;}
div.section.page01 {background: url(http://cdn-img.kingkongsoft.kr/tog/web/page01/bg_page01.jpg) 50% 0 no-repeat; }
div.section.page02 {background: url(http://cdn-img.kingkongsoft.kr/tog/web/page02/bg_page02.jpg) 50% 0 no-repeat;}
div.section.page03 {background: url(http://cdn-img.kingkongsoft.kr/tog/web/page03/bg_page03.jpg) 50% 0 no-repeat;}
div.section.page04 {background: url(http://cdn-img.kingkongsoft.kr/tog/web/page04/bg_page04.jpg) 50% 0 no-repeat;}
div.section.page05 {background: url(http://cdn-img.kingkongsoft.kr/tog/web/page05/bg_page05.jpg) 50% 0 no-repeat;}

div.social_media {position: fixed;right: 30px;top:90px;z-index: 999;}
div.social_media > a {display: block;margin-bottom: 5px;}
a.go_to_down {position: fixed;bottom:60px;left:50%; transform: translateX(-50%); z-index: 999; cursor:pointer;}

div.navigator { width: 350px; position: fixed; top:0px; bottom:0px; height:100%; z-index: 998;}

div.navigator {
    position: absolute;left:-350px; top:0px; bottom:0px; z-index: 998;
    width: 350px;
    -webkit-transition: left 0.4s;
    -o-transition: left 0.4s;
    transition: left 0.4s;
    background: rgba(0,0,0,0.3);
}
div.navigator.on {
    -webkit-transition: left 0.4s;
    -o-transition: left 0.4s;
    transition: left 0.4s;
    left:0px;
    background: rgba(0,0,0,0.3);
}

div.navigator > div.layer_btn {font-size: 0pt;line-height: 0pt;position: fixed;left:30px;top:30px;z-index: 999;}
div.navigator > div.layer_btn > span {display: inline-block;*display: inline;*zoom: 1;text-align: center;width: 30px;cursor:pointer;position:absolute;left:0px;}
div.navigator > div.layer_btn > span > img {width: 100%;}
div.navigator > div.layer_btn > span:first-child {display: none;}
div.navigator > div.layer_btn.on > span.on {display: inline;position: absolute;z-index: 2;}
div.navigator > div.layer_btn.on > span.off {display:none;}

div.navi_layer {width: 350px;position: fixed;z-index: 998;height: 100%; background: rgba(0,0,0,0.3);}
div.navi_layer > h1.logo {margin: 60px auto 30px auto;}

div.navi_layer > ul {top:150px;width: 350px;}
div.navi_layer > ul > li {  }
div.navi_layer > ul > li > a { display: block; position: relative; color: #fff; font-weight: 900; font-size: 24pt;line-height: 1.6; padding: 9px 0px 10px 50px;}
div.navi_layer > ul > li > a:hover { background: url(http://cdn-img.kingkongsoft.kr/tog/web/navi/bg_navi_menu_on.png) 0 0 no-repeat; }
div.navi_layer > ul > li > a.on { background: url(http://cdn-img.kingkongsoft.kr/tog/web/navi/bg_navi_menu_on.png) 0 0 no-repeat; }



div.page01 div.article {width: 1024px;margin: 0px auto; height: 100%;}
div.page01 div.article > h1.logo {position: absolute;right:0px;top:50%;transform: translateY(-60%);}
div.page01 div.article > a.play_btn {position: absolute;top:387px;left: 50%;transform: translateX(-50%);}
div.page01 div.article > a.goto_prev {position: absolute;top:591px;left: 50%;transform: translateX(-50%);}

div.page02 div.article {width: 1024px; position: relative; margin: 0px auto; height: 100%;}
div.page02 > img.logo  {position: absolute;top:60px; right:60px;}
div.page02 > img.prev_item  {position: absolute;top:220px; right:110px;}
div.page02 div.reg_box { top:460px;width: 707px;height: 281px;margin: 0px auto; position: relative;background: url(http://cdn-img.kingkongsoft.kr/tog/web/page02/bg_reg_box.png) 0 0 no-repeat;padding: 50px 30px 30px 30px;}

div.reg_box div.input_box { display: inline-block;*display: inline;*zoom: 1;width: 714px; margin-bottom: 15px; position: relative;}

div.reg_box  input.phone { width: 473px; font-size: 12pt; text-align: left; padding: 23px 0px 23px 15px; border: none; background: #fff; vertical-align: middle;}
div.reg_box  input.phone::placeholder {color: #999;font-weight: bold;}
div.reg_box div.input_box > a img {vertical-align: middle;}
div.reg_box div.os {display: inline-block;*display: inline;*zoom: 1;width: 503px; margin: 0px 0px 15px 0px; position: relative;}
div.reg_box div.os > label {display: inline-block;*display: inline;*zoom: 1;background: url(http://cdn-img.kingkongsoft.kr/tog/web/page02/icon_radio_off.png) 0 0 no-repeat;width: 18px;height: 18px;background-size: 100%;margin-right: 5px; vertical-align:middle;}
div.reg_box div.os > label.on { background: url(http://cdn-img.kingkongsoft.kr/tog/web/page02/icon_radio_on.png) 0 0 no-repeat; background-size: 100%;}
div.reg_box div.os > label > input {width: 0px;height: 0px;}
div.reg_box div.os > span.android {display: inline-block;*display: inline;*zoom: 1;margin-right: 69px;vertical-align:middle; color: #fff; font-weight: bold;font-size: 18pt;}
div.reg_box div.os > span.ios {display: inline-block;*display: inline;*zoom: 1;vertical-align:middle;color: #fff; font-weight: bold;font-size: 18pt;}
/*div.reg_box div.os > span > img {width: 100%;height: auto;}*/

div.reg_box div.agree_text { width: 503px; font-size: 1pt;line-height: 3;margin-bottom: 30px;}
div.reg_box div.agree_text > label {display: inline-block;*display: inline;*zoom: 1;width: 18px;height: 18px; background: url(http://cdn-img.kingkongsoft.kr/tog/web/page02/icon_checkbox_off.png) 0 0 no-repeat;background-size:100%;vertical-align:middle;margin-right: 10px;}
div.reg_box div.agree_text > label.on { background: url(http://cdn-img.kingkongsoft.kr/tog/web/page02/icon_checkbox_on.png) 0 0 no-repeat; background-size: 100%;}
div.reg_box div.agree_text > label > input {width: 0px;height: 0px;}
div.reg_box div.agree_text > span {display: inline-block;*display: inline;*zoom: 1;vertical-align:middle; font-size: 13pt;line-height: 0pt;margin-right: 10px;color: #fff;}
div.reg_box div.agree_text > a {display: inline-block;*display: inline;*zoom: 1;vertical-align:middle;}
div.reg_box div.agree_text > a.agree_more {position: absolute;right:24px;top:173px;}

div.page02 div.store {font-size: 0pt;line-height: 0pt;margin-top: 15px;}
div.page02 div.store > a:first-child {margin-left: 0px;}
div.page02 div.store > a {display: inline-block;*display: inline;*zoom: 1;width: 318px;height: 140px;margin-left: 21px;}



div.page03 div.article {width: 1024px; position: relative; margin: 0px auto; height: 100%;}
div.page03 > img.logo  {position: absolute;top:60px; right:60px;}
div.page03 div.article > img.title {position: absolute;left:50%;transform: translateX(-50%);top:200px;}
div.page03 div.article div.progress_box {width: 870px;height: 72px;position: absolute;left:50%;top:328px; transform: translateX(-50%); background: url(http://cdn-img.kingkongsoft.kr/tog/web/page03/img_page03_bar_off.png) 0 50% no-repeat;line-height: 0pt;}
div.page03 div.article div.progress_box > span.bar {position: absolute;left:0px;top:2px;bottom:0px;overflow-x: hidden;height: 71px;}
div.page03 div.article div.progress_box > span.bar:after {content: "";line-height: 0pt;font-size: 0pt;;
  height: 17px;
  background: #000 url(http://cdn-img.kingkongsoft.kr/tog/web/page03/img_page03_bar_on.png) 0 50% no-repeat;
  position: absolute;
  top:27px;
  left:0px;
  z-index: 9;
  width: 5px;
  -webkit-opacity: 0.6;
  -moz-opacity: 0.6;
  -ms-opacity: 0.6;
  -o-opacity: 0.6;
  opacity: 0.6;
}
div.page03 div.article div.progress_box > img.txt_prev_count {position: absolute;color: #fff;left:0px; top:-13px; }
div.page03 div.article div.progress_box > span.prev_count {position: absolute;font-size: 15pt;color: #fff;right:0px;letter-spacing: -1pt }
div.page03 div.article div.progress_box > span.bar > img {position: relative;left:-100%;}

div.page03 div.article ul.attendance_box {position: absolute;left:50%;top:458px;transform: translateX(-50%);width: 875px; font-size: 0pt;line-height: 0pt;}
div.page03 div.article ul.attendance_box > li {display: inline-block;*display: inline;*zoom: 1;margin-left: 0px;position: relative;margin-left: 10px;}
div.page03 div.article ul.attendance_box > li:first-child {margin-left: 0px;}
div.page03 div.article ul.attendance_box > li.off {
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  -ms-opacity: 0.5;
  -o-opacity: 0.5;
  opacity: 0.5;
}
div.page03 div.article ul.attendance_box > li.on {
  -webkit-opacity: 1;
  -moz-opacity: 1;
  -ms-opacity: 1;
  -o-opacity: 1;
  opacity: 1;
}
/*div.page03 div.article ul.attendance_box > li > img.stamp {position: absolute;left:15px; top:51px;}*/




div.page04 div.article {width: 1190px; position: relative; margin: 0px auto; height: 100%;}
div.page04 > img.logo  {position: absolute;top:60px; right:60px;}

div.page04 div.article > div.left { width:421px; height: 550px; position: absolute;background: url(http://cdn-img.kingkongsoft.kr/tog/web/page04/bg_page04_box1.png) 0 0 no-repeat; left:0px;top:150px;}
div.page04 div.article > div.left > a { position: absolute;top:431px;left:50%;transform: translateX(-50%); }
div.page04 div.article > div.right { width:421px; height: 550px; position: absolute;background: url(http://cdn-img.kingkongsoft.kr/tog/web/page04/bg_page04_box2_v1.png) 0 0 no-repeat;right: 0px;top: 150px;}
div.page04 div.article > div.right > a { position: absolute;top:431px;left:50%;transform: translateX(-50%); }


div.page05 div.article {width: 1290px; position: relative; left:50%; transform: translate(-50%); height: 100%;}
div.page05 > img.logo  {position: absolute;top:60px; right:60px;}
div.page05 div.article > div.character_box { font-size: 0pt;line-height: 0pt; position: relative; top:196px;left:50%;transform: translateX(-50%);  }
div.page05 div.article > div.character_box > a {display: inline-block;*display: inline;*zoom: 1;position: relative; cursor: default;}
div.page05 div.article > div.character_box > a > img.lock {position: absolute;left:50%; transform:translate(-50%, -100%); top:50%;}





div.pop_agree_text {width: 700px;height: 430px; background: url(http://cdn-img.kingkongsoft.kr/kingdom/pop/pop_bg.jpg) 0 0 no-repeat ;color: #fff;text-align: left;padding: 10px 15px; background-size:cover;}
div.pop_agree_text > h3 { font-size: 10pt; margin-bottom: 8px; }
div.pop_agree_text > p {font-size: 9pt;line-height: 1.2;margin-bottom: 5px;}
div.pop_agree_text > div.list {font-size: 9pt;line-height: 1.2;margin-bottom: 15px;}