@charset "utf-8";

/* ----------------------------------------------
 * HanbitSoft Infra Development Team
 * 2019 황금돼지의 기원 Stylesheet
 * Author - moran679@hanbitsoft.co.kr 190124
 ------------------------------------------------- */

/* CSS Reset
-------------------------------------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, img, strong, small, dl, dt, dd, ol, ul, li, fieldset, form, select, input, button, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure, figcaption {margin:0;padding:0;font-size:100%;}
img, fieldset, button {border:0;}
article, aside, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
body, input, button, textarea, select, table, kbd {line-height:1.2;font-family:Malgun Gothic,'맑은고딕','돋움', dotum, Helvetica,sans-serif;font-size:12px;color:#000;}
img {vertical-align:middle;}
ol, ul {list-style:none;}
a {text-decoration:none;color:#000;}
a:hover, a:focus, a:active {text-decoration:underline;color:#0000ff;}
button, label {cursor:pointer;}
button::-moz-focus-inner, input::-moz-focus-inner {padding:0;border:0;}
table {border-collapse:collapse;border-spacing:0;}
caption, legend {width:0;height:0;font-size:0;line-height:0;text-indent:-9999px;visibility:hidden;}

/* Reserved Class
-------------------------------------------------------------- */
.irPm {display:block;overflow:hidden;font-size:0;line-height:0;text-indent:-9999px;}
.irWa {position:relative;display:block;overflow:hidden;width:100%;height:100%;z-index:-1;}
.blind {position:absolute;top:0;left:-1000%;width:1px;height:1px;line-height:0;overflow:hidden;}
.show {display:block;}
.hide {display:none;}
.fL {float:left;}
.fR {float:right;}
.clearFix {zoom:1;}
.clearFix:after {content:'';display:block;clear:both;}
.opc {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";opacity:0;}

/* Common
-------------------------------------------------------------- */
body {background:#333;} 
#wrap{position:relative;width:100%;min-width:1200px;background:#fff;overflow:hidden;}
#wrap .inner{position:relative;width:1100px;height:100%;margin:0 auto;}
#wrap .sp_txt {background:url(../images/sp_txt.png) no-repeat;}
#wrap .sp {background:url(../images/sp_btn.png) no-repeat;}
/* header */
#header {background:url(../images/bg_top.jpg) no-repeat 50% 0;height:770px;}
#header .evtLoginArea {font-size:0;height:0;}
#header .evtLoginArea {position:absolute;top:472px;left:74px;}
#header .evtLoginArea span {display:inline-block;vertical-align:middle;}
#header .evtLoginArea .txt00 {background-position:-101px 0;width:90px;height:31px;margin-top:16px;}
#header .evtLoginArea .txt01 {background-position:-192px 0;width:16px;height:31px;margin-top:16px;}
#header .evtLoginArea .txt02 {background-position:0 -32px;width:105px;height:19px;}
#header .evtLoginArea .accrueAttend {width:100px;height:50px;line-height:50px;background:#000;margin:0 10px;font-family:'돋움', dotum;font-size:16px;color:#fff;text-align:center;}
#header .evtLoginArea .beforeBox {margin-left:170px;}
#header .evtLoginArea .afterBox {margin-left:58px;}
#header .evtLoginArea .beforeBox span,  #header .evtLoginArea .afterBox .familyName {display:inline-block;vertical-align:top;width:220px;height:50px;line-height:50px;background:#000;font-family:'돋움', dotum;font-size:15px;color:#fff;text-align:center;letter-spacing:-1px;}/* 2019-01-23 수정 */
#header .evtLoginArea .afterBox .familyName {margin:0 2px 0 9px;}
#header .evtLoginArea .beforeBox .btnLogin {display:inline-block;vertical-align:middle;width:222px;height:51px;background-position:0 0;margin-left:2px;}
#header .evtLoginArea .afterBox a {display:inline-block;vertical-align:middle;width:110px;height:51px;margin-right:2px;}
#header .evtLoginArea .afterBox .btnChange {background-position:-223px 0;}
#header .evtLoginArea .afterBox .btnHistory {background-position:-334px 0;}
#header .evtLoginArea .afterBox .btnMyGame {background-position:-445px 0;}

/* container */
#container {position:relative;}
#container .tab00 {background:url(../images/tab00.jpg) no-repeat 50% 0;height:2605px;}
#container .tab01 {background:url(../images/tab01.jpg) no-repeat 50% 0;height:1271px;}
#container .tab02 {background:url(../images/tab02.jpg) no-repeat 50% 0;height:1271px;}
#container .tab03 {background:url(../images/tab03.jpg) no-repeat 50% 0;height:1951px;}
#container .tab {display:none;}
#container .tab.active {display:block;}
#container .firstGoldPigGift {position:absolute;top:457px;bottom:355px;left:0;right:0;}
#container .secondGoldPigGift, #container .thirdGoldPigGift {position:absolute;top:428px;bottom:356px;left:0;right:0;}
#container .fourGoldPigGift {position:absolute;top:465px;bottom:70px;left:0;right:0;}
#container table th, #container table td {font-size:0;height:0;}
#container table td.goLink {position:relative;;left:609px;height:80px;}
#container table .goLink a {display:block;position:absolute;width:90px;height:26px;background-position:-354px -52px;}
#container table .reward {position:relative;top:10px;left:965px;height:81px;}

#container .firstGoldPigGift table .reward .default, #container .secondGoldPigGift table .reward .default, #container .thirdGoldPigGift table .reward .default {position:absolute;top:10px;width:117px;height:63px;background-position:0 -52px;cursor:default;}
#container .secondGoldPigGift table .reward,  #container .thirdGoldPigGift table .reward {position:relative;top:2px;left:965px;height:81px;}
#container .tab table .reward .take {background-position:-118px -52px;cursor:pointer;}
#container .tab table .reward .comp {background-position:-236px -52px;cursor:default;}

#container .fourGoldPigGift table td {width:157px;height:161px;}
/* S : 2019-01-22 수정 */
#container .fourGoldPigGift table .reward {position:relative;top:0;left:0;width:157px;height:161px;line-height:161px;text-align:center;background:url(../images/img_transparent.png) repeat;}
/* E : 2019-01-22 수정 */
#container .fourGoldPigGift table .reward .default {vertical-align:middle;}
#container .fourGoldPigGift table .reward .default {width:117px;height:63px;background-position:0 -52px;cursor:default;}
#container .fourGoldPigGift table .reward .take {background-position:-118px -52px;cursor:pointer;}
#container .fourGoldPigGift table .reward .comp {background-position:-236px -116px;} 
#container .fourGoldPigGift table .reward .ing {background-position:-354px -116px;} 
#container .fourGoldPigGift table .reward .doNot {background-position:-472px -116px;} 

/* nav */
#nav {position:absolute;top:0;left:0;right:0;margin:0 auto;z-index:2;text-align:center;background:url(../images/tab_bg.png) no-repeat;width:1122px;height:117px;}
#nav.fixed {position:fixed;top:0;width:100%;height:100px;background:#554a21;box-shadow:0px 10px 25px #333;}
#nav ul {}
#nav li {display:inline-block;vertical-align:middle;background:url(../images/sp_tab00.png) no-repeat;width:275px;height:100px;cursor:pointer;margin-left:-4px;}
#nav li:first-child {}
#nav li.tabNav00 {background-position:0 0;}
#nav li.tabNav01 {background-position:-275px 0;}
#nav li.tabNav02 {background-position:-550px 0;}
#nav li.tabNav03 {background-position:-825px 0;}
#nav li.tabNav00.active {background-position:0 -118px;}
#nav li.tabNav01.active {background-position:-275px -118px;}
#nav li.tabNav02.active {background-position:-550px -118px;}
#nav li.tabNav03.active {background-position:-825px -118px;}

/* footer */
#footer {position:relative;}
#footer .inner {position:absolute;right:0;bottom:286px;left:0;margin:0 auto;}
#footer h3 {background-position:0 0;width:100px;height:31px;font-size:0;margin:0 auto 22px;}
#footer ol {color:#3d3721;font-size:12px;font-family:'돋움', dotum;padding-left:227px;line-height:24px;}
#footer li {counter-increment:item;}
#footer li:before {padding-right:7px;content:counter(item) "."}
.copyright {background:url(../images/copyright.jpg) no-repeat 50% 0;height:91px;}



/* popup */
/* S: 내 게임 현황 확인 */
#popup_wrap{position:relative;width:1020px;height:637px;background:url(../images/my_game_chk_bg.jpg) no-repeat 0 0;font-family:'돋움', dotum;}
#popup_wrap .p_info_tbl_wrap p {position:absolute;top:80px;left:0;right:0;margin:0 auto;font-weight:bold;color:#c5a42d;font-size:12px;text-align:center;}
#popup_wrap .p_quest_tbl_wrap{width:920px;padding-top:117px;margin:0 auto;}
#popup_wrap .p_quest_tbl_wrap .p_quest_title{width:100%;height:33px;text-align:center;line-height:33px;color:#fff;background:#8a752d;}
#popup_wrap .p_quest_tbl_wrap table{width:100%;border-bottom:4px solid #8a752d;}
#popup_wrap .p_quest_tbl_wrap table tr {border-left:4px solid #8a752d;border-right:4px solid #8a752d;}
#popup_wrap .p_quest_tbl_wrap table thead tr th{height:40px;background-color:#cb3945;color:#fff;border-left:1px solid #c66069;}
#popup_wrap .p_quest_tbl_wrap table thead tr{border-right:1px solid #cb3945;}
#popup_wrap .p_quest_tbl_wrap table tbody tr td{position:relative;height:33px;background:#fff;color:#333;font-size:12px;font-weight:bold;border-right:1px solid #eaeaea;border-bottom:1px solid #eaeaea;}
#popup_wrap .p_quest_tbl_wrap table tbody tr td .txt{display:inline-block;padding-left:10px;}
#popup_wrap .p_quest_tbl_wrap table tbody tr td .stat{position: absolute;right:0;top:0;display:inline-block;width:78px;height:33px;border-left:1px solid #eaeaea;border-right:1px solid #eaeaea;}
#popup_wrap .p_quest_tbl_wrap table tbody tr td .stat .comp{display:inline-block;width:86px;height:33px;line-height:33px;color:#333;font-size:12px;font-weight:bold;text-align:center}
#popup_wrap .p_quest_tbl_wrap table tbody tr td .stat .yet{display:inline-block;width:86px;height:33px;line-height:33px;color:#333;font-size:12px;font-weight:bold;text-align:center}
#popup_wrap .p_quest_tbl_wrap table tbody tr td:first-child{border-left:1px solid #eaeaea;}
#popup_wrap .ok_btn_area{text-align: center;margin-top:26px;}
#popup_wrap .ok_btn_area .all_stat_btn{background:url(../images/confirm_btn.jpg) no-repeat;width:113px;height:48px;}

/*팝업*/
#popup_wrap2{position:relative;width:560px;height:617px;background:url(../images/pop_bg.jpg) no-repeat 0 0}
#popup_wrap2 .table_area{position:relative;padding-top:97px;text-align: center;}
#popup_wrap2 .table_area .table_border{width:461px;height:380px;margin:0 auto;}
#popup_wrap2 .table_area table{margin:0 auto;width:100%;font-family:'돋움', dotum;border-left:4px solid #8a752d;border-right:4px solid #8a752d;border-bottom:4px solid #8a752d;}
#popup_wrap2 .table_area table thead tr th{height:35px;color:#fff;background:#8a752d;color:#fff;}
#popup_wrap2 .table_area table tr td{height:34px;color:#333;font-size:12px;background:#fff;border:1px solid #eaeaea;}
#popup_wrap2 .table_area table tr td.bold{font-weight:bold;}
#popup_wrap2 .page_number{float:left;margin-top:21px;font-size:15px;color:#000000;margin-left:37px;letter-spacing:-1px}
#popup_wrap2 .page_number .current_num{color:#d8d7d6;}

#popup_wrap2 .paging {margin-right:37px;margin-top:20px;text-align:center;font-size:11px}
#popup_wrap2 .paging a {display:inline-block; width:22px; height:21px;line-height:21px;font-size:13px;color:#8b762e;vertical-align:top;text-decoration:none;}
#popup_wrap2 .paging a.dir {font-size:0;vertical-align:top;}
#popup_wrap2 .paging strong {display:inline-block; width:22px; height:21px; line-height:21px;vertical-align:top;}
#popup_wrap2 .paging a:hover,.paging strong {background:#8a752d;color:#000;font-weight:bold}
#popup_wrap2 .nolist {padding:153px 0;font-size:16px;color:#000;font-weight:bold;text-align:center}

#popup_wrap2 .ok_btn_area{text-align: center;margin-top:32px;}
#popup_wrap2 .ok_btn_area .all_stat_btn{background:url(../images/confirm_btn.jpg) no-repeat;width:113px;height:48px;}
