html, body {padding: 0px; margin: 0px; font-family: 'NanumBarunpenRWeb','³ª´®¹Ù¸¥Ææ' ,'NanumGothic', '³ª´®°íµñ','NanumGothicWeb', '¸¼Àº °íµñ', 'Malgun Gothic';}

.eventWrap {position: relative; margin: 0 auto; width: 930px; background: #FFF;}
.eventWrap img {padding: 0px; margin: 0px; border: none;}
.eventWrap .container {position: absolute; top: 0px; left: 0px;}
.eventWrap .container .top {position: relative; top: 0px; left: 0px;}
.eventWrap .container .top img {display: block;}

.eventWrap .container .middle {position: relative; top: 0px; left: 0px;width: 100%; height: 645px; background: url('../images/middle.jpg') repeat-y left top;}
.eventWrap .container .middle .wrapper {position:absolute; top: 39px; left: 60px; width: 810px; height: 606px;}
.eventWrap .container .middle .wrapper .ready {position: relative; top: 0px; left: 0px; width: 100%; height: 100%;}
.eventWrap .container .middle .wrapper .ready a.btn {position: absolute; bottom: 47px; left: 306px;}

.eventWrap .container .middle .wrapper .step1 {position: relative; top: 0px; left: 0px; width: 100%; height: 100%; background: url('../images/step1_bg.png') no-repeat; display: none;}
.eventWrap .container .middle .wrapper .step1 .cover {position: absolute; top: 0px; left: 0px; width: 100%; height: 564px; background: url('../images/ready_cover.png') no-repeat;}
.eventWrap .container .middle .wrapper .step1 .cover a.btn {position: absolute; top: 253px; left: 296px;}
.eventWrap .container .middle .wrapper .step1 .item_list {position: relative; display: none;}
.eventWrap .container .middle .wrapper .step1 .item_list a.hat {position: absolute; top: 215px; left: 35px;}
.eventWrap .container .middle .wrapper .step1 .item_list a.sandle {position: absolute; top: 145px; left: 244px;}
.eventWrap .container .middle .wrapper .step1 .item_list a.bikini {position: absolute; top: 125px; left: 416px;}
.eventWrap .container .middle .wrapper .step1 .item_list a.sunglass {position: absolute; top: 148px; left: 625px;}

.eventWrap .container .middle .wrapper .step2 {position: relative; top: 0px; left: 0px; width: 100%; height: 100%; background: url('../images/step2_bg.png') no-repeat; display: none;}
.eventWrap .container .middle .wrapper .step2 .item_list {position: relative;}
.eventWrap .container .middle .wrapper .step2 .item_list a.tdisc_01 {position: absolute; top: 164px; left: 97px;}
.eventWrap .container .middle .wrapper .step2 .item_list a.tdisc_02 {position: absolute; top: 200px; left: 261px;}
.eventWrap .container .middle .wrapper .step2 .item_list a.tdisc_03 {position: absolute; top: 147px; left: 404px;}

.eventWrap .container .middle .wrapper .step3 {position: relative; top: 0px; left: 0px; width: 100%; height: 100%; background: url('../images/step3_bg.png') no-repeat; display: none;}
.eventWrap .container .middle .wrapper .step3 .input_box {position: absolute; top: 330px; left: 49px; width: 392px; height: 53px;}
.eventWrap .container .middle .wrapper .step3 .input_box input {width: 390px; height: 51px; font-size: 21px; border: none; line-height: 21px;}
.eventWrap .container .middle .wrapper .step3 a.btn {position: absolute; top: 442px; left: 154px;}

.eventWrap .container .middle .wrapper .final {position: relative; top: 0px; left: 0px; width: 100%; height: 100%; background: url('../images/final_bg.png') no-repeat; display: none;}
.eventWrap .container .middle .wrapper .final .txt_box {position: absolute; top: 45px; width: 100%;  text-align: center; color: #2aa9c3; font-size: 40px; font-weight: bold;}
.eventWrap .container .middle .wrapper .final .txt_box p {padding: 0px; margin: 0px;}
.eventWrap .container .middle .wrapper .final .select_item {position: relative;}
.eventWrap .container .middle .wrapper .final .select_item .item {position: absolute; top: 153px; left: 215px;}
.eventWrap .container .middle .wrapper .final .select_item .tdisc {position: absolute; top: 161px; left: 420px;}
.eventWrap .container .middle .wrapper .final .msg_box {position: absolute; top: 354px; left: 50px; width: 700px; margin: 13px 0 0 10px; font-size: 40px; font-weight: bold;}
.eventWrap .container .middle .wrapper .final a.btn_01 {position: absolute; bottom: 46px; left: 145px;}
.eventWrap .container .middle .wrapper .final a.btn_02 {position: absolute; bottom: 46px; left: 425px;}

.eventWrap .container .ranking {position: relative; width: 862px; height: 295px; background: url('../images/ranking_bg.jpg') no-repeat; padding: 91px 34px 69px 34px;}
.eventWrap .container .ranking table {width: 100%; margin: 0px; margin: 0px; border-collapse: collapse; border: 2px solid #afc537; font-family: 'dotum'; font-size: 13px;}
.eventWrap .container .ranking table th {height: 26px; line-height: 21px; border-bottom: 2px solid #afc537;}
.eventWrap .container .ranking table th.rank {width: 214px; background: #FFF;}
.eventWrap .container .ranking table th.uid {width: 214px; background: #eff3d8;}
.eventWrap .container .ranking table th.plan {width: 215px; background: #FFF;}
.eventWrap .container .ranking table th.date {width: 215px; background: #eff3d8;}
.eventWrap .container .ranking table td {height: 24px; line-height: 21px;}
.eventWrap .container .ranking table td.rank {width: 214px; background: #FFF; text-align: center;}
.eventWrap .container .ranking table td.uid {width: 214px; background: #eff3d8; text-align: center;}
.eventWrap .container .ranking table td.plan {width: 215px; background: #FFF; text-align: center; color: #a7c700; font-weight: bold;}
.eventWrap .container .ranking table td.date {width: 215px; background: #eff3d8; text-align: center;}

.eventWrap .container .ranking table td.no_data {height: 40px; text-align: center; font-weight: bold;}