@charset "euc-kr";

/* ±¤Å¬ */
.click_wrap{position: relative;margin: 0 auto 40px;background: url('https://img.megagong.net/m/2021/0716_megaggoarimy/evt2_click_bg.png') no-repeat center 0; background-size: cover; padding: 100px 40px; box-sizing: border-box; }
.click_wrap::after{content: "";display: block;clear: both;}
.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; padding: 0 10px; width:100%; margin:auto;  }
.click_wrap .count_wrap > p.today{font-size: 54px;text-align: center;font-weight: bold; width:100%; }
.click_wrap .count_wrap > .count_box { position: relative; text-align: center; margin: 35px auto; }
.click_wrap .count_wrap > .count_box .cspan { color:#222; font-size:65px; font-weight:700; }
.click_wrap .count_wrap > .count_box span{text-align: center; position: relative; display: inline-block; font-weight: 900; color: #232323; width: 135px; font-size: 120px; height: 162px; line-height: 162px; border: 2px solid #aeaeae; background:#fff; }
.click_wrap .count_wrap > .count_box span::before{left:0;width:100%;height:4px;background:#222;}
.click_wrap .count_wrap > .count_box span+span{margin-left: 7px;}
.click_wrap .count_wrap > .sold{position:absolute;right: 0;top: -10%;z-index: 2;}
.click_wrap .count_wrap > .count_box .evt_end{position:absolute;right: -38px;bottom: -110px;}
.click_wrap .count_wrap .clickEvtBtn{ text-align:center; }
.click_wrap .count_wrap .clickEvtBtn a{max-width:498px; width:70%; display: block; margin:auto; }
.click_wrap .count_wrap .textEvt { text-align:center; margin-top:10px; color:#000; }
.click_wrap .count_wrap .textEvt a { display:block; margin:5px auto 0; border:1px solid #7b7c7c; color:#7b7c7c; font-size:11px; text-align:center; width:104px; padding:0 10px; line-height:25px; height:25px; }
.click_wrap .soon{ display:block; width: 100%; height: 100%; background: rgba(0,0,0,0.7); position:absolute; left: 0; top: 0; z-index:2; }
.click_wrap .soon img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
}
.click_wrap .soon span{font-size: 30px;line-height:30px; position:absolute;left:0;top:50%;width:100%;color: #fff;}
.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-bottom: 20px; border:1px solid #ccc; }
.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 > li{position: relative;float: left;width: 20%;text-align: center; border-left: 1px solid #666666;box-sizing: border-box;}
.book_check .book_check--ul > li:last-child{margin: 0;}
.book_check .book_check--ul > li:first-child { border:none; }
.book_check .book_check--ul > li > p > span{display:block;font-size: 18px;font-weight: bold;background: #000;padding: 15px 0;color: #fff;}
.book_check .book_check--ul > li:first-child > p > span{border-left:none}
.book_check .book_check--ul > li > p > span+span{background:#fff;padding: 25px 0;color: #000;font-size: 24px;}
.book_check .book_check--ul > li .end{display:none}
.book_check .book_check--ul > li.end .end{display:block;width: 100%;height: 100%;background: rgba(0,0,0,0.7);position:absolute;left:0;top: 0;font-size: 0;padding: 0;border-left: 0;}
.book_check .book_check--ul > li.end .end::before{display:block;content:"";position:absolute;top: -41%;left: 20%;width:100%;height:100%;background: url('http://img.megagong.net/m/2021/0716_megaggoarimy/end.png') center center no-repeat;}

.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){
    .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:768px){
    .click_wrap .count_wrap > p.today{font-size: 25px;}
    .book_check .book_check--ul > li > p > span{font-size: 16px;}
    .book_check .book_check--ul > li > p > span+span{padding: 15px 0;font-size: 18px;}
    .book_check .book_check--ul > li.end .end::before{top: -40%;}
    .click_wrap .soon{height:100%;top: 0;}
}

@media screen and (max-width:640px){
    .click_wrap .book_img{width: 70%;float:none;margin:0 auto;}
    .click_wrap .count_wrap{ width: 100%; margin: 5% auto 0; float:none; background-size: 110% 100%; }    
    .click_wrap .count_wrap > .count_box span { font-size:50px; width: 16%; height: 60px; line-height: 50px; }
    .click_wrap .count_wrap .clickEvtBtn a{padding:0;}
    .click_wrap .soon img{max-width: 80%;}
    #my_result.clickPop{width: 80%;padding: 15px 0 20px;}
    #my_result.clickPop.no{padding: 35px 0 20px;}
}

@media screen and (max-width:576px){
    .book_check .book_check--ul > li > p > span{font-size:14px}
    .book_check .book_check--ul > li > p > span+span{padding: 10px 0;font-size: 16px;}
    .click_wrap .count_wrap > .count_box{margin: 15px auto 15px;}
    #my_result.clickPop .gift{margin: 20px auto 15px;}
	#my_result.clickPop .gift img{max-width:50%}
	#my_result.clickPop .date{font-size: 18px;}
	#my_result.clickPop ul{padding: 0 15px;margin: 15px auto 15px;}
    #my_result.clickPop.no .tit{font-size: 22px;}
	#my_result.clickPop.no .gift img{max-width: 50%;}
}

@media (max-width: 460px){
    .click_wrap .count_wrap > .count_box span{font-size:40px;height: 50px;line-height: 40px;}
    .click_wrap .count_wrap > .count_box .cspan{font-size: 20px}
	#my_result.clickPop .tit{font-size: 22px;}
	#my_result.clickPop .date{font-size: 16px;}
	#my_result.clickPop ul li{font-size:11px}
}