@charset "utf-8";
/* 
NHN Web Standardization Team (http://html.nhndesign.com/)
Author : Pearl. Cho 080801
*/ 

/* Type Selector */
*{margin:0; padding:0; font-style:normal; font-family:, Dotum, , Gulim, AppleGothic, Sans-serif;}
body{text-align:center; background:#57b4de url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_body.gif) repeat-x left 36px;}
img {vertical-align:top;}
img, fieldset{border:none;}
hr, legend{display:none;}
table{border-collapse:collapse;}
li{list-style:none;}
a{text-decoration:none;}
a:hover{text-decoration:underline;}
html:first-child select{padding-right:6px; height:20px;} /* Opera Fix */ 
option, x:-moz-any-link{padding-right:4px;} /* Firefox Fix */ 
option, x:-moz-any-link, x:default{padding-right:0;} /* Firefox Fix */
.input_check, .input_radio {width:13px; height:13px; margin-top:-1px; margin-right:3px;}
.nojs {clear:both; width:100%; font-size:12px; text-align:cetner;}
.nojs .depth1 {clear:both; height:188px; margin-top:21px;}
.nojs .depth1 li {float:left; width:150px; text-align:left;}
.nojs .depth1 li a {color:#0071a2;}
.nojs .depth2 {margin-top:10px;}
.nojs .depth2 li {clear:both; margin-bottom:5px;}
.nojs .txt {width:100%; padding-top:50px; color:#fff; text-align:center; line-height:1.3;}

.rollover {border:0;}
.rollover img{display:inline;}
.rollover .over {display:none;}
.rollover:hover img {display:none;}
.rollover:hover .over {display:inline;}

/* Layout Selector */
#wrap {position:relative; width:100%; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_wrap.jpg) no-repeat center 36px;}
#gnb{height:36px; margin:0 auto; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_gnb.gif) repeat-x;}
#container_tet {position:relative; width:100%; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_container.jpg) no-repeat center 0;}
#footer{clear:both; width:960px; margin:0 auto; padding:40px 0; text-align:left;} 

/* Class Selector */
.fl{float:left;}
.fr{float:right;}
.clear{clear:both;}
.tx_l{text-align:left;}
.tx_c{text-align:center;}
.tx_r{text-align:right;}
.none{display:none;}


.top_nav {width:960px; margin:0 auto;}
.ico_grade {vertical-align:middle; margin-top:-1px;}

/* Horizon Box Default Style */
.horizon_box {position:relative; clear:both; width:960px; margin:0 auto; text-align:left;}
.horizon_box h3.normal {padding:15px 0 11px 14px; zoom:1;}
.horizon_box h3.normal img {display:block;}
.horizon_box .more {position:absolute; top:11px; right:10px;}
.horizon_box .basic { margin:12px 0 0 14px;}
.horizon_box .basic li {clear:both; overflow:hidden; margin-bottom:9px; padding-left:5px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bu_list.gif) no-repeat left 3px;}
.horizon_box .basic li span {display:block; float:left; letter-spacing:-1px;}
.horizon_box .basic li span.tit a {color:#5d91b6; font-size:11px;}
.horizon_box .basic li span.date {width:43px; color:#559ed7; font-family:verdana; font-size:10px;}

/* Row1 */
.login {position:relative; float:left; width:200px; height:208px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_login.gif) no-repeat;}
.login h3 {padding:10px 0 8px 11px;}
.login fieldset {position:relative; width:177px; height:93px; margin-left:12px;}
.login fieldset .in {margin-bottom:2px;}
.login fieldset .in_tx {width:93px; margin:-1px 0 0 9px; padding:4px 3px 2px 3px; background:#ff7a76; border:none; color:#fff;}
.login fieldset .btn_login {position:absolute; top:0; right:0;}
.login fieldset .others {margin-top:5px; padding:0 0 0 24px; color:#ffc1b3; font-size:11px; letter-spacing:-1px;}
.login fieldset .others label {margin-top:-10px;}
.login fieldset .others a, .login fieldset .others a:hover {color:#ffc1b3;}
.login fieldset .others .join {margin-left:-2px;}
.login .con_banner {margin-left:3px; padding-top:3px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_con_banner.gif) no-repeat left top;}

.after_login {position:relative; float:left; width:206px; height:212px; margin:-4px 0 0 -6px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_after_login.gif) no-repeat; font-size:11px; letter-spacing:-1px;}
.after_login .my_name {display:block; margin:13px 0 8px 13px; color:#fff; font-family:dotum; font-size:12px;}
.after_login .my_btns {clear:both; overflow:hidden; width:183px; margin-left:9px;}
.after_login .my_btns a {display:block; float:left;}
.after_login .my_btns a:hover {text-decoration:none;}
.after_login .my_btns .note {float:left; height:20px; text-align:center; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_note.gif) no-repeat;}
.after_login .my_btns .note .num {font-family:verdana; font-size:9px;}
.after_login .my_btns .note a {display:block; width:80px; padding:4px 0 4px 0; color:#ffded1; }
.after_login .my_grade {padding:6px 0 2px 13px; color:#ffc4b2;}
.after_login .my_grade .num {font-family:verdana;}
.after_login .my_match {height:36px; padding-left:13px; color:#ff9182;}
.after_login .my_match em {color:#ffc4b2; font-family:verdana; font-style:normal;}
.after_login .my_coupon {position:absolute; top:95px; left:14px; font-size:11px; letter-spacing:-1px; }
.after_login .my_coupon th {color:#ff997a;  font-weight:normal;}
.after_login .my_coupon td {color:#ffc4b2;}
.after_login .my_coupon td.coupon_num {padding:0 4px;}
.after_login .after_obt th {width:61px;}
.after_login .after_obt td.coupon_num {width:71px; padding:0;}
.after_login .my_bill {position:absolute; top:113px; left:10px; width:181px; font-size:11px; letter-spacing:-1px;}
.after_login .my_bill th {height:15px; padding-left:5px; color:#ff997a;  font-weight:normal;}
.after_login .my_bill td {color:#ffc4b2;}
.after_login .my_bill .top th, .after_login .my_bill .top td {padding-top:8px; padding-bottom:3px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_line_2color.gif) repeat-x left top;}
.after_login .con_banner {position:absolute; top:101px; left:3px; padding-top:3px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_con_banner.gif) no-repeat left top;}

.present {position:absolute; top:161px; left:0; overflow:hidden;}
.present_top {width:206px; height:42px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_present_top.gif) no-repeat;}
.present_top a:hover {text-decoration:none;}
.present_top a {display:block; width:186px; height:33px; padding:9px 0 0 14px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_present_open.gif) no-repeat 164px 16px; color:#ffe0c5; font-size:11px; font-weight:normal; letter-spacing:-1px; line-height:1.3; text-decoration:none;}
.present_top a span {color:#ffb590;}
.present .bottom_bg {width:206px; height:6px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_present_bottom.gif) no-repeat;}
.present .calendar {width:206px; overflow:hidden; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_present_middle.gif) repeat-y;}
.present .calendar .nav {clear:both; width:100px; margin-left:63px;}
.present .calendar .nav a {display:block; float:left;}
.present .calendar .nav .month {display:block; float:left; width:52px; margin-top:-2px; color:#ffe062; font-family:verdana; font-size:10px; font-weight:bold; letter-spacing:-1px; text-align:center;}
.present .calendar table {width:169px; margin:3px 0 0 15px; font-family:verdana; font-size:11px; text-align:center}
.present .calendar table th { height:16px; color:#ffe062; font-weight:normal;}
.present .calendar table td { height:18px; color:#ffa36f;}
.present .calendar table td.check {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/ico_present.gif) no-repeat center center;}
.present .calendar table td.check span {display:none;}
.step1 .calendar {height:0px;}
.step2 .calendar {height:75px;}
.step2 .present_top a, .step3 .present_top a {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_present_close.gif) no-repeat 164px 16px;}
.step1 .nav, .step1 table, .step2 .nav, .step2 table {display:none;}
.step3 .calendar {height:145px;}

.game_start {float:left; width:555px; height:208px;}
.game_event {float:left; width:205px;}

/* Row2 */
.family_menu {position:relative; float:left; width:200px; height:205px; margin-top:12px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_menu.gif) no-repeat;}
.family_menu .menu_list {position:relative; clear:both; overflow:hidden; width:205px; margin-left:-5px;}
.family_menu .menu_list li {line-height:0; float:left;}
.family_menu .menu_list li a {display:block; width:205px; height:64px;}
.family_menu .menu_list li a img {display:none;}
.family_menu .menu_list li a.on img {display:block;}
.family_menu .menu_list li.menu1 {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/tab_family01.gif) no-repeat;}
.family_menu .menu_list li.menu2 {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/tab_family02.gif) no-repeat;}
.family_menu h4 {width:200px; height:30px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_history_open.gif) no-repeat;}
.family_menu h4.on {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_history_close.gif) no-repeat;}
.family_menu h4 a {display:block; width:187px; height:20px; padding:10px 0 0 13px; color:#9fe7ff; font-size:11px; letter-spacing:-1px; font-weight:normal;}
.family_menu h4 a:hover {text-decoration:none;}
.family_history {position:absolute; top:205px; width:200px; height:193px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_history.gif) no-repeat; font-size:11px; letter-spacing:-1px;}
.family_history p {height:17px; padding:4px 0 0 13px; color:#61d4ff;}
.family_history ul {margin:0 0 0 13px;}
.family_history li {position:relative; width:174px; padding:7px 0 0 0; color:#61d4ff; line-height:1.3;}
.family_history li span {position:absolute; bottom:0; right:0; letter-spacing:0;}
.family_history .paging{clear:both; width:100%; padding:15px 0; text-align:center ;}
.family_history .paging a img{vertical-align:top; border:0;}
.family_history .paging a,
.family_history .paging strong{position:relative; display:inline-block; padding:0 3px; color:#00c3f4; text-decoration:none; line-height:normal; font:9px verdana; vertical-align:middle; font-weight:normal; }
.family_history .paging a:hover{text-decoration:underline;}
.family_history .paging a strong{margin:0 -1px; padding-bottom:0; color:#61d4ff !important; font-weight:bold;}
.family_history .paging .arw {margin-top:3px;}
.family_history .paging .arw {margin-top:3px;}
.family_cont {position:relative; float:left; width:556px;  margin-top:12px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_cont.gif) no-repeat;}
.family_regist {float:left; padding:13px 0 12px 10px;}
.family_regist .btn {display:block; float:left;}
.frd_add {float:right; padding:13px 10px 12px 0;}
.frd_add  .btn {margin-top:2px;}
.family_list {clear:both;  background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_list.gif) repeat-x}
.family_list li {position:relative; float:left; width:139px; height:128px; font-size:11px;}
.family_list li.f_is {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_is.gif) no-repeat; color:#007db4;}
.family_list li.over {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_is_on.gif) no-repeat; cursor:move;}
.family_list li.f_is dl {height:98px; margin:7px 0 0 9px;}
.family_list li.f_is dt {padding-bottom:3px; line-height:1.3;  letter-spacing:-1px;}
.family_list li.f_is dt input{width:105px; padding-top:2px; background:none; border:0; color:#007db4; font-size:11px; letter-spacing:-1px;}
.family_list li.f_is dt input.relation_over {background:#59d9ff;}
.family_list li.f_is dt a, .family_list li.f_is dd .ing {color:#0071a2;}
.family_list li.f_is dt a {font-weight:bold;}
.family_list li.f_is dd {padding-bottom:3px;}
.family_list li.f_is dd.grade {padding:6px 0 4px 0;}
.family_list li.f_is dd .num {font:9px tahoma;}
.family_list li.f_is dd .per {color:#0097d3; font:9px tahoma;}
.family_list li.f_is dd img {vertical-align:middle;}
.family_list li.f_is .btns {padding-left:4px;}
.family_list li.f_is .layer_join {position:absolute; top:124px; left:4px; border:1px solid #45d4fa; border-top:none; background:none;}
.family_list li.f_is .layer_join li {width:46px; height:15px; font-size:0; clear:both;}
.family_list li.f_none {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_none.gif) no-repeat; color:#007db4;}
.family_list li.f_none p {width:100%; padding-top:8px; line-height:1.3; text-align:center;}
.family_hide {clear:both; font-size:11px; letter-spacing:-1px;}
.family_hide h4 {width:556px; height:30px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_hide_open.gif) no-repeat; font-size:11px;}
.family_hide h4.on {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_hide_close.gif) no-repeat;}
.family_hide h4 a {display:block; width:540px; height:20px; padding:10px 0 0 16px; color:#61d4ff;  font-weight:normal;}
.family_hide h4 a:hover { text-decoration:none;}
.family_hide h4 a em {color:#baecff;}
.family_hide_list {position:absolute; top:205px; width:556px; height:193px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_family_hide_list.gif) no-repeat;}
.family_hide_list .guide {height:37px; margin:0 16px; color:#61d4ff; line-height:1.3;}
.family_hide_list .guide em {color:#baecff;}
.family_hide_list ul {clear:both; width:541px; height:126px; overflow-y:scroll; margin:0 0 0 6px; padding:11px 0;}
.family_hide_list li {float:left; width:257px; margin-bottom:5px;}
.family_hide_list li span {display:block; float:left;}
.family_hide_list li span.grade {width:40px; margin:0 4px 0 10px; color:#00c3f4;}
.family_hide_list li span.name {width:101px; padding-top:2px;}
.family_hide_list li span.name a {color:#61d4ff;}

.external_ad {float:left; width:200px; height:200px; margin-top:12px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_ad.gif) no-repeat;padding:2px 2px 3px 2px; }

/* Row3 */
.notice {position:relative; float:left; width:200px; height:181px; margin-top:11px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_notice.gif) no-repeat; z-index:10;}
.notice .basic {width:176px;}
.notice .basic li span.tit {width:125px;}
.article {position:relative; float:left; width:278px; height:181px; margin-top:11px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_bottom_cont.gif) no-repeat; z-index:10;}
.article .basic {width:254px;}
.article .basic li span.tit {width:203px;}
.ranking {position:relative; float:left; width:278px; height:181px; margin-top:11px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_bottom_cont.gif) no-repeat; z-index:10;}
.ranking table {width:259px; margin:-2px 0 0 9px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_ranking_subtit.gif) no-repeat;}
.ranking th {height:27px; color:#5d91b6; font-size:11px; font-weight:normal; background:none;}
.ranking td {padding-top:10px; color:#559ed7; font-size:11px; background:none;}
.ranking td a {color:#5d91b6;}
.ranking td.exp {padding-right:6px; font-family:verdana; font-size:10px; letter-spacing:-1px;}
.ranking td .ico_grade {margin-left:2px;}
.poll {position:relative; float:left; width:278px; height:181px; margin-top:11px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_bottom_cont.gif) no-repeat; z-index:10;}
.poll .poll_cont {width:254px; margin:3px 0 0 11px; padding-top:2px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_poll_banner.gif) no-repeat; text-align:center;}
.poll .poll_cont img {display:block; margin:0 auto 8px auto;}
.ost {position:relative; float:left; width:204px; height:181px; margin-top:11px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_ost.gif) no-repeat;}
.ost h3 {padding:17px 0 0 15px; zoom:1; z-index:10;}
.ost h3 img {display:block;}
.ost .more {position:absolute; top:12px; right:8px;}
.ost .playlist {width:190px; margin:0 0 0 7px;}
.ost ul {width:185px; margin:7px 0 0 13px;}
.ost ul li {width:100%; clear:both; overflow:hidden; margin-bottom:5px;}
.ost ul li span {display:block; float:left;}
.ost ul li .tit {width:153px;}
.ost ul li .tit a {color:#5d91b6; font-family:verdana; font-size:11px;}
.ost ul li .length {width:30px; color:#559ed7; font-family:verdana; font-size:11px;}

/* Aside */
.aside_cont {position:absolute; top:0; left:50%; margin-left:-480px; width:960px;}
.aside_cont .inbox {position:absolute; top:218px; right:-97px; width:88px;}
.aside_cont .inbox .spc {margin-top:23px;}

/* Layer Popup (Design Alert) */
.pop_layer {z-index:30; position:absolute; top:453px; left:50%; width:251px; margin-left:-125px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_layerpop.gif) no-repeat left top; border-right:1px solid #005995; border-bottom:1px solid #005995; font-size:11px; letter-spacing:-1px;}
.pop_layer .main_cont {min-height:49px; margin:10px 5px 10px 10px; padding-left:36px; text-align:left; line-height:1.3;}
.pop_layer .bg1 {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_layer_1.gif) no-repeat;}
.pop_layer .bg2 {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_layer_o.gif) no-repeat;}
.pop_layer .bg3 {background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_layer_x.gif) no-repeat;}
.pop_layer .bg_sms {height:59px; margin:0; padding:10px 0 0 13px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_layer_sms.gif) no-repeat;}
.pop_layer .if {padding:0 0 5px 10px; text-align:left;}
.pop_layer .if_list {margin:0 0 17px 10px; }
.pop_layer .if_list li {padding-left:6px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bu_if_list.gif) no-repeat left 5px; text-align:left; line-height:1.3;}
.pop_layer .btn {width:100%; padding-top:6px; padding-bottom:13px;}
.pop_layer .btn .second {margin-left:5px;}
.pop_layer .tx1 {color:#83ccff;}
.pop_layer .tx2 {color:#4ea6e3;}
.pop_layer em {color:#c4f0ff;}
.pop_layer h1 {padding-bottom:7px; font-size:11px; color:#a1e3ff;}
.pop_layer fieldset  {clear:both; width:248px; margin:0; padding:5px 0 0 14px; color:#83ccff; text-align:left; line-height:1.3;} 
.pop_layer fieldset label {display:block; float:left; width:61px;  padding-top:5px; }
.pop_layer fieldset p {float:left; width:166px; height:33px; margin-bottom:7px; padding:6px 0 0 8px; background:#00508e;}
.pop_layer fieldset .sms_input {display:block; float:left; width:166px; margin-bottom:3px; background:#00508e; border:none; color:#83ccff; padding:4px 0 4px 8px;}
.pop_layer .close {position:absolute; top:0; right:12px;}

/* Footer */
#footer .links{float:left; padding:15px 60px 0 70px;}
#footer .links li{float:left;}
#footer .contact{float:left; text-align:left;}
#footer .contact .corporation{overflow:hidden;}
#footer .contact .corporation li{float:left; margin-left:-1px; padding-left:1px; background:url(http://images.hangame.co.kr/hangame/tetris/beta/img/main/bg_bar_footer.gif) no-repeat left 5px;}
#footer .contact .corporation li a{display:block; padding:2px 10px;}
#footer .contact .nhn_info{clear:both; margin-top:7px; margin-left:10px;}
#footer .contact .nhn_info img{display:block;}
#footer .contact address{margin:7px 0 30px 10px;}
#footer .contact address img{display:block;}
#footer .cp_info{float:left; margin:2px 0 0 56px;}
#footer .license {clear:both; width:100%; padding-top:30px; text-align:left;}
#footer .license img {margin-left:212px;}


.scroll {scrollbar-face-color:#00a5e4; scrollbar-track-color:#008ec4; scrollbar-3dlight-color:#0daeec; scrollbar-arrow-color:#6ddafe; scrollbar-shadow-color:#00a5e4; scrollbar-highlight-color:#00a5e4; scrollbar-darkshadow-color:#0daeec}

/* SELECTBOX STYLE */
.selectbox-naked *{display:none;}
.selectbox-naked input{display:inline;}
.selectbox-naked select{display:inline;}
.selectbox-naked select *{display:block;}
.selectbox-applied select{display:none;}
.selectbox-applied .selectbox-box{width:78px; height:20px; border:1px solid #1396cf; background:#37c1ff url(http://images.hangame.co.kr/hangame/tetris/beta/img/sub/btn_select_default.gif) right 50% no-repeat; color:#0c6a93; cursor:pointer;letter-spacing:-1px; font-size:11px;} /* 080602 */
.selectbox-focused .selectbox-box{border-color:#1396cf;}
.selectbox-applied .selectbox-label{overflow:hidden; margin:5px 0 0 4px;}
.selectbox-applied .selectbox-layer{position:absolute; z-index:99999; width:78px; margin-top:-1px; border:1px solid #1396cf;}
.selectbox-applied .selectbox-layer-above{}
.selectbox-applied .selectbox-list{overflow-y:auto; list-style:none; margin:0; padding:0; color:#0c6a93; letter-spacing:-1px; font-size:11px; scrollbar-face-color:#37c1ff; scrollbar-track-color:#2cb2f3; scrollbar-3dlight-color:#00a5e4; scrollbar-arrow-color:#0082ba; scrollbar-shadow-color:#37c1ff; scrollbar-highlight-color:#37c1ff; scrollbar-darkshadow-color:#00a5e4;}
.selectbox-applied .selectbox-list li{padding:3px 5px; background:#37c1ff; text-align:left;cursor: pointer;}
.selectbox-applied .selectbox-list li.selectbox-item-selected{}
.selectbox-applied .selectbox-list li.selectbox-item-hovered{background-color:#2cb2f3; color:#0c6a93; }
/* //SELECTBOX STYLE  */