@charset "euc-kr"; :root { --color-green: #08A200; --color-blue: #4C64FF; } 
/*°øÅë*/
.eventWrap .evSection { padding: 140px 0; } 
.con_tit .end::after { background: #000; } 
.con_tit .point { color: var(--color-green); } 
.btn_wrap { display: flex; align-items: center; justify-content: center; gap: 30px; } 
.btn_wrap .btn { width: 420px; height: 90px; border-radius: 90px; color: #fff; } 
.btn_wrap .btn a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; } 
.btn_wrap .btn.black { background: #000; } 
.btn_wrap .btn.gry { background: #666666; } 
.btn_wrap .btn.green { background: var(--color-green); } 
.btn_wrap .btn.blue { background: var(--color-blue); } 


/*evCon1*/
.eventWrap .evSection.evCon1 { padding: 50px 0 68px; position: relative; background-image: url("https://image.megagong.net/m/2025/0422_oxgong/evCon1_bg.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; } 
.evCon1 .con_tit { position: relative; margin:0 auto; width: fit-content; } 
.evCon1 .tit2 { position: absolute; bottom:0; left: 50%; transform: translateX(-50%); } 
.evCon1 .tit3 { position: absolute; top: -4%; right: 18%; animation:bounce 0.45s ease infinite alternate;} 
.evCon1 .tit4 { position: absolute; top: 21%; left: 18%; animation:bounce 0.45s ease infinite alternate;} 
.evCon1 .mini_tit { margin: -10px 0 0; } 
.evCon1 .btn-base { display:block; margin: 40px auto 25px; } 
.evCon1 .btn-base.mo { display:none; } 
.evCon1 .btn-base > * { border-radius: 80px; background-color: #4C64FF; color:#fff; padding: 28px 130px; } 

@-webkit-keyframes bounce { 
    100%{
        transform: translate(0, -8px);
    }
}

/*stepCon1*/
.eventWrap .evSection.stepCon1 { background-color: #C8EA5D; padding: 80px 0 140px; } 
.stepCon1 .con_tit { margin: 0 0 60px; } 
.stepCon1 .con_box { padding: 50px 105px 60px; border-radius: 80px; background: #FFF; } 
.stepCon1 .chk_list_wrap { margin: 0 auto 50px; padding: 20px 0; border-radius: 100px; background: #F3F3F3; } 
.stepCon1 .chk_list li { margin:5px 0; display: flex; align-items: center; justify-content: center; gap: 10px; } 
.stepCon1 .chk_list li::before { content: ""; display: block; width: 19px; height: 13px; background-image: url("https://image.megagong.net/m/2025/0422_oxgong/s_chk.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; } 
.stepCon1 .progressbar_wrap { margin: 0 0 80px; background: #F3F4FF; border-radius: 10px; overflow: hidden; height: 15px; } 
.stepCon1 .progressbar { height: 100%; background: var(--color-green); transition: width 0.3s ease; } 
.stepCon1 .question { margin: 0 auto 50px; padding: 24px 0; width: 100%; border-radius: 100px; background: #F3F3F3; display: flex; align-items: center; justify-content: center; text-align: center; font-weight: bold; } 
.stepCon1 .choice_wrap { margin:0 0 50px; display: flex; justify-content: center; gap: 97px; } 
.stepCon1 .choice { position: relative; width: 352px; height: 352px; overflow: hidden; cursor: pointer; } 
.stepCon1 .choice label { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border: 4px solid #000; border-radius: 43px; } 
.stepCon1 .choice img { object-fit: contain; pointer-events: none; } 
.stepCon1 .choice input[type="radio"] { position: absolute; opacity: 0; cursor: pointer; width: 100%; height: 100%; top: 0; left: 0; margin: 0; z-index: 2; border:none; } 
.stepCon1 .choice:hover label { border-color: var(--color-green); } 
.stepCon1 .toggle { height: 102px; } 
.stepCon1 .toggle.on img { display: none; } 
.stepCon1 .toggle img { margin:0 auto; display: block; height: 100%; } 

/*stepCon2*/
.stepCon2 { background: linear-gradient(180deg, #FCFFE6 25.88%, #F6FFBA 100%); } 
.stepCon2 .con_tit { margin: 0 0 70px; } 
.stepCon2 .cat_wrap { display: flex; align-items: center; justify-content: center; } 
.stepCon2 .cat_wrap .cat { display: flex; flex-direction: column; align-items: center; } 
.stepCon2 .cat .after { position: relative; } 
.stepCon2 .cat .fin { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.stepCon2 .btn_wrap { gap: 58px; } 


/*ox ÄûÁî ·¹À̾îÆ˾÷*/
.stepClearPop_wrap { position: fixed; top:0; left:0; width: 100vw; height: 100vh; overflow: hidden; z-index:1045; } 
.stepClearPop_wrap .stepClearPop { position: absolute; top:50%; left: 50%; transform:translate(-50%, -50%); border-radius: 15px; width: 500px; padding: 40px 0; background-color: #fff; text-align: center; z-index:11; } 
.stepClearPop p { margin:20px 0; } 
.stepClearPop .btn a { margin: 0 auto; width:160px; height: 60px; display: flex; justify-content: center; align-items: center; border-radius: 8px; background: #111; color: #fff; } 
.stepClearPop .close { position: absolute; z-index: 12; top:-17%; right: 0%; } 


/*´ç÷ Æ˾÷*/
.mg_popup_wrap .img_wrap { margin: 27px auto 20px; display: flex; align-items: center; justify-content: center; } 
[class*=mg_popup_wrap] .tit_area { background-color: var(--color-green); color:#fff; } 


/*event1*/
#event1 { background-image: url("https://image.megagong.net/m/2025/0424_oxsobang/event_bg.png"); background-position: center center; background-repeat: no-repeat; background-size: cover; } 
.event1 .con_tit .point { color: var(--color-blue); } 
.event1 .form_wrap { margin: 60px 0 0; border-radius: 30px; border: 2px solid var(--color-blue); background: #FFF; overflow: hidden; } 
.event1 .regist_form_area { background-color: var(--color-blue); border-radius: 0; } 
.event1 .regist_form_area .check_area .info { color: #e1e1e1; opacity: 1; } 
.event1 .btn-base.xl>* { border-radius: 60px; } 
.step_base_wrap { border-radius: 30px; border: 2px solid var(--color-blue); background: #FFF; } 
.step_base_wrap .step_list li .box_area .label,
.step_base_wrap .hashtag { color: var(--color-blue); } 
.eventWrap .evSection.evtoggleWarning { padding: 0; } 
.warningList li ul li a { color:var(--color-blue); } 


@media screen and (max-width: 1200px){
 .eventWrap .evSection { padding: 14% 0; } 
 .con_tit { font-size:clamp(23px,4.9vmin,44px); } 
 .btn_wrap .btn { height: auto; padding: 2.5vmin 0; } 

 .eventWrap .evSection.evCon1 { padding: 8% 0; } 
 .eventWrap .evSection.stepCon1 { padding: 9% 0 12%; } 
 .stepCon1 .con_tit { margin: 0 0 8%; } 
 .stepCon1 .con_box { padding: 6% 5%; border-radius: 40px; } 
 .stepCon1 .chk_list_wrap { margin: 0 auto 8%; } 
 .stepCon1 .progressbar_wrap { margin: 0 0 8%; } 
 .stepCon1 .question { margin: 0 auto 6%; } 
 .stepCon1 .choice_wrap { gap: 4vmin; justify-content: space-between; margin: 0 0 8%; } 
 .stepCon1 .choice { width: calc(50% - 2vmin); height: auto; } 
 .stepCon1 .choice label { padding: 8% 0; } 
 .stepCon2 .con_tit { margin: 0 0 10%; } 
 .stepCon2 .btn_wrap { gap: 30px; } 
 .stepCon2 .cat .tit { display: block; margin: 0 0 10px; width: 30vmin; } 

 .evCon1 .con_tit .tit3 { right: 13%; top: -4%; width: 17%; } 
 .evCon1 .tit4 { top: 9%; left: 6%; width: 12%; } 
 }

@media screen and (max-width: 1024px){
 .evCon1 .con_tit .tit1 { width: 111vw; margin-left: -9.5vw; max-width: unset; } 
 .evCon1 .con_tit .tit2 { bottom: -10%; } 
 /* .evCon1 .con_tit .tit3 { right: 17%; top: -14%; } */
 /* .evCon1 .con_tit .tit3 { right: 13%; top: -4%; width: 17%; } */
 .evCon1 .mini_tit { margin: 4% 0; } 
 .stepCon1 .chk_list_wrap { border-radius: 10px; } 
 }

@media screen and (max-width: 768px){
 .btn_wrap { gap: 10px; } 
 .btn_wrap .btn { width: max-content; min-width: 36vmin; height: auto; padding: 3vmin; } 

 .evCon1 .con_tit .tit2 { bottom: -12%; width: 87%; } 
 /* .evCon1 .con_tit .tit3 { right: 10%; width: 26%; } */
 .evCon1 .btn-base { margin: 0 auto 8%; } 
 .evCon1 .btn-base > * { padding: 4vmin 8vmin; width: 92%; } 
 .evCon1 .btn-base.pc { display:none; } 
 .evCon1 .btn-base.mo { display:block; } 


 .stepCon1 .con_box { border-radius: 10px; } 
 .stepCon1 .chk_list_wrap { padding: 3% 20px; } 
 .stepCon1 .chk_list { width: max-content; margin: 0 auto; } 
 .stepCon1 .chk_list li { display:block; } 
 .stepCon1 .chk_list li::before { display:inline-block; margin-right: 10px; width: 10px; height: 8px; } 
 .stepCon1 .chk_list li p { width: calc(100% - 20px); } 
 .stepCon1 .choice label { border-radius: 10px; } 
 .stepCon1 .choice label img { width: 65%; } 
 .stepCon1 .toggle { height: 12vmin; } 

 .stepCon2 .cat .fin { width: 17vmin; } 

 [class*=mg_popup_wrap] .tit_area { font-size: 16px; } 
 .stepClearPop_wrap .stepClearPop { width: 350px; height: auto; padding: 8% 0; } 
 .stepClearPop h4 img { height: 30px; } 

 .step_base_wrap { border-radius: 10px; } 
 .event1 .form_wrap { border-radius: 10px; } 

 
 .share_base_wrap .share_list li dl dd, .share_base_wrap .share_list.col4 li dl dd { width: calc(25% - 6px); font-size: 12px } 
 .share_base_wrap .share_list li dl dd.small { font-size: 11px; } 
 .share_base_wrap .share_list li dl dd a { padding: 9px 0; } 
 .share_base_wrap { padding: 20px 10px; } 

 .evCon1 .con_tit .tit3 { right: 6%; top: 4%; width: 20%; } 
 .evCon1 .tit4 { top: 9%; left: 3%; width: 15%; } 
 }

@media screen and (max-width: 576px){
 .btn_wrap .btn { min-width: calc(50% - 5px); padding: 4vmin 2vmin; } 

 .stepCon1 .chk_list_wrap { padding: 3% 10px; } 
 .stepCon1 .con_box { padding: 6% 4%; } 
 .stepCon2 .btn_wrap { gap: 10px; } 
 .stepCon2 .btn_wrap .btn { padding: 3vmin 2vmin; } 
 .container_info.ver_circle.horizon { justify-content: flex-start; } 
 .stepCon1 .btn_wrap .btn a { font-size: 14px; } 
 }