@charset "euc-kr";


/* ±¤Å¬ */
.top_wrapper { 
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
} 
.top_wrapper .soon { display:block; width: 100%; height: calc(100% + 20px); background: rgba(0,0,0,0.7); position:absolute; left: 0; top: 0; z-index:2; } 
.top_wrapper .soon::before {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); content: '6¿ù 14ÀÏ 18½Ã COMING SOON'; width: 265px; height: 83px; color: #fff; font-size: 34px; font-weight: bold; } 

.click_wrap {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 529px;
    height: 591px; 
    padding: 45px 40px 0 40px;;
    box-sizing: border-box;
    background-color: #fff;
} 
.click_wrap::after { content: ""; display: block; clear: both; } 
.click_wrap .tiny_noti{
    position: absolute;
    right: 0;
    bottom: -28px;
    color: #999999;
    font-size: 12px;
    font-weight: 300;
}
.click_wrap .book_img,
.click_wrap .count_wrap { float:none; } 
.click_wrap .book_img { margin: 35px 0 0; } 
.click_wrap .count_wrap { position: relative; float: none; width:100%; height: 100%; } 
.click_wrap .count_wrap > p.today {
    position: relative;
    width: 100%;
    height: 43px;
    line-height: 41px;
    color: #fff;
    font-size: 22px;
    font-weight: bold;
    background-color: #232323;
} 
.click_wrap .count_wrap > p.today::before{
    position: absolute;
    left: 50%;
    bottom: -6px;
    transform: translate(-50%,0);
    content: '';
    width: 11px;
    height: 6px;
    background-image: url('https://image.megagong.net/m/2023/0602_allawyer/click_deco.png'); background-repeat: no-repeat; background-position: center; background-size: contain; 
}
.click_wrap .count_wrap .notice{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 38px;
}
.click_wrap .count_wrap .notice .notice_title{
    color: #743cd9;
    font-size: 18px;
    font-weight: bold;
}
.click_wrap .count_wrap .notice > p{
    color: #000000;
    font-size: 17px;
    font-weight: 300;
}
.click_wrap .count_wrap .notice > p span{
    text-decoration: underline;
    text-underline-offset: 6px;
}
.click_wrap .count_wrap > .count_box {
    position: relative; text-align: center;
    margin-top: 16px;
} 
.click_wrap .count_wrap > .count_box .cspan {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color:#232323;
    font-size:50px; font-weight:900;
} 
.click_wrap .count_wrap > .count_box span {
    text-align: center;
    position: relative;
    display: inline-block;
    flex: 1;
    height: 130px;
    line-height: 117px;
    color: #232323;
    font-size: 110px;
    font-weight: 900;
    border: 2px solid #232323;
} 
.click_wrap .count_wrap > .count_box span::before { left:0; width:100%; height:4px; background:#232323; } 
.click_wrap .count_wrap > .count_box span+span { border-left: 0; } 
.click_wrap .count_wrap > .sold { position:absolute; right: -32px;
    bottom: 14%; z-index: 2; } 
.click_wrap .count_wrap > .count_box .evt_end { position:absolute; right: -38px; bottom: -110px; } 
/* .click_wrap .count_wrap .clickEvtBtn { margin-bottom: 122px; }  */
.click_wrap .count_wrap .clickEvtBtn a {
    display: block; margin-top: 36px; } 
.click_wrap .count_wrap .textEvt { margin-top:10px; color:#e45c6c; font-size: 13px; text-align:center; } 
.click_wrap .count_wrap > a { position: absolute; right: 0; bottom: 55px; display: inline-block; color:#232323; font-size: 17px; text-align:center; font-weight: bold; text-decoration: underline; text-underline-offset: 6px; } 
.click_wrap .tiny_txt { margin: 0 auto; display: block; font-size: 13px; color: #ababab; text-align: center; line-height: 1.2; } 
.click_wrap .tiny_txt strong { color: #3c4dde; } 

.book_check { margin-top: 77px; } 
.book_check h3 { color: #9e9e9e; font-size: 16px; padding: 5% 0; } 
.book_check h3 > strong { color: #feffa7; } 
.book_check h3 .mo_view { display:none } 
.book_check .book_check--ul::after { content: ""; display: block; clear: both; } 
.book_check .book_check--ul { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; } 
.book_check .book_check--ul > li { position: relative; width: 20%; text-align: center; border-left: 1px solid #232323; box-sizing: border-box; } 
.book_check .book_check--ul > li:last-child { margin: 0; } 
.book_check .book_check--ul > li:first-child,
.book_check .book_check--ul > li:nth-of-type(6) { border:none; } 
.book_check .book_check--ul > li > p > span { display:block; padding: 25px 0; color: #fff; font-size: 17px; font-weight: 300; background-color: #cf48ac; } 
.book_check .book_check--ul > li > p > span+span { position: relative; padding: 25px 0; color: #362832; font-size: 23px; font-weight: bold; background-color:#fff; } 
.book_check .book_check--ul > li > p > span+span b { font-size: 33px; } 
.book_check .book_check--ul > li .end { display:none } 
.book_check .book_check--ul > li.end > p > span+span::after { position:absolute; top: 0; left:0; content: ''; display:block; width: 100%; height: 100%; background: rgba(0,0,0,0.7); z-index: 1; } 
.book_check .book_check--ul > li.end > p > span+span::before { display:block; content:""; position:absolute; left: 50%; bottom: 7px; transform: translate(-50%, 0); width: 82px; height: 83px; background-image: url('https://image.megagong.net/m/2023/0519_allawyer/click_date_fin.png'); background-repeat: no-repeat; background-position: center; background-size: contain; z-index: 2; } 

.clickPop { width: 420px; background: #fff; padding: 40px 0 30px; position: fixed; left:50%; top: 50% !important; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 99; } 
#my_result.clickPop { display:block; } 
#my_result.clickPop .tit { font-size: 32px; text-align:center; color: #e73629; font-weight:bold; } 
#my_result.clickPop .gift { text-align:center; margin: 30px auto 30px; } 
#my_result.clickPop .date { position: relative; text-align:center; padding: 13px 0; font-size: 20px; color:#000000; background: #efefef; } 
#my_result.clickPop .date span { color: #ff0000; font-weight: bold; margin-right: 5px; } 

#my_result.clickPop .btnClose a { position:absolute; right: 10px; top: 10px; width: 16px; height: 15px; } 
#my_result.clickPop .btnConfirm { text-align:center; } 
#my_result.clickPop.no { background: #fff; padding: 65px 0 40px; } 
#my_result.clickPop.no .tit { margin: 0 auto; } 
#my_result.clickPop.no .gift { margin: 30px auto 40px; } 
#my_result.clickPop.no .btnConfirm { margin:0; } 

.dim_popup .dimPop { text-align:center; margin-top:10px } 
.dim_popup .dimPop dl { background:#efefef; padding:20px 0; color:#333; font-size:20px; line-height:120%; } 
.dim_popup .dimPop dt { font-weight:700; } 
.dim_popup .text { color:#b5b5b6; padding:15px 30px; } 
.dim_popup .text li { margin-bottom:3px; } 
.dim_popup .text li:before { content:""; padding-left:10px; background:url(https://img.megagong.net/m/2022/0712_plower3362/bullet_text.png) no-repeat left center; } 

@media screen and (max-width:1200px){
    .top_wrapper > img{
        width: 50%;
    }
    .click_wrap { margin: 27px 0 23px 0; } 
    .book_check .book_check--ul > li { width:20% } 
    .book_check .book_check--ul > li.end .end::before { background-size: 60%; } 

    #my_result.clickPop .tit { font-size: 32px; } 
    #my_result.clickPop .gift { text-align:center; } 
    #my_result.clickPop.no .tit { font-size: 32px; } 
    #my_result.clickPop.no .gift { margin: 30px auto 40px; } 
    #my_result.clickPop.no .gift img { max-width: 45%; } 
    
    .clickPop .btnConfirm img { max-width: 30%; } 
}

@media screen and (max-width: 992px){
    .top_wrapper {
        flex-direction: column;
    }
    .click_wrap { margin: 0 auto;  } 
}

@media screen and (max-width:768px){
    .click_wrap {
        width: 529px;
        height: 591px;
        padding: 45px 40px 0 40px;
    }
    .book_check { margin-top: 0; } 
}

@media screen and (max-width:576px){
    .click_wrap {
        width: 80%;
        height: 410px;
        padding: 25px 10px 0 10px;
    }
    .click_wrap .count_wrap .notice{
        margin-bottom: 20px;
    }
    .click_wrap .count_wrap .notice .notice_title{
        margin-bottom: 7px;
    }
    .click_wrap .count_wrap .notice > p{
        font-size: 11px;
    }
    .click_wrap .count_wrap > .sold{
        bottom: 11%;
        width: 30vw;
    }
    .click_wrap .count_wrap > p.today { font-size: 20px; } 
    .click_wrap .count_wrap > .count_box { } 
    .click_wrap .count_wrap > .count_box span { width: 79px; height: 100px; line-height: 90px; font-size: 80px; } 
    .click_wrap .count_wrap .clickEvtBtn { margin-bottom: 0; } 
    .click_wrap .count_wrap .clickEvtBtn a { width: 100%;     margin-top: 0;} 
    .click_wrap .count_wrap > a { right: 0; bottom: 32px; font-size: 14px; } 
    .book_check .book_check--ul > li > p > span { padding: 17px 0; font-size: 14px; } 
    .book_check .book_check--ul > li.end > p > span+span::before { width: 100%; bottom: 0; } 
    .book_check .book_check--ul > li > p > span+span { padding: 18px 0; font-size: 14px; } 
    .book_check .book_check--ul > li > p > span+span b { font-size: 22px; } 
    .click_wrap .tiny_noti{
        bottom: -20px;
        font-size: 9px;
    }
}

@media (max-width: 460px){
    .book_check .book_check--ul > li.end > p > span+span::before { bottom: -7px; } 
}