@charset "euc-kr"; /* evSection */
.evSection:not(.evtoggleWarning,.main) { padding: 160px 0; } 
.evSection .clamp-title { color: #000000; font-size: 46px; font-weight: bold; margin: 0 -30px 70px; } 
.evSection .clamp-title span { color:#ff0057 } 
.evSection .clamp-title.under { border-bottom: 2px solid #000; width: fit-content; margin: 0 auto 70px; } 


/* main */
.main { position: relative; background-image: url('https://img.megagong.net/m/2024/0806_sbbrief/main_bg.jpg'); background-repeat: no-repeat; background-position: center; background-size: cover; } 
.main .inner { width: 1600px; } 
.main .clamp-sub { color:#fff; font-size: 20px; font-weight: 700; padding: 26px 0; letter-spacing: 1rem; background: rgba(255,255,255,.2); } 
.main .clamp-sub i { font-style: normal; background: #ff0057; border-radius: 30px; letter-spacing: normal; padding: 6px 9px; font-size: 16px; } 
.main .clamp-sub span { color:#000 } 
.main ul.flex { align-items: flex-end; padding-top: 30px; justify-content: space-between; position: relative; } 
.main ul.flex li:nth-child(odd) { position: relative; } 
.main ul.flex li:nth-child(odd) a { position: absolute; bottom: 45px; left: 50%; margin-left: -20px; z-index: 2; transform: translateX(-50%); font-size: 18px; border-radius: 33px; font-weight: normal; } 
.main ul.flex li:first-child a::before { content: ''; display: block; position: absolute; width: 657px; height: 145px; z-index: -1; left: 50%; top: 50%; transform: translate(-50%, -50%); background-image: url('https://img.megagong.net/m/2024/0806_sbbrief/text_bg.png'); background-repeat: no-repeat; background-position: center; background-size: contain; } 
.main ul.flex li:last-child a { color: #ffffffb8; } 
.main ul.flex li:last-child { margin-right: -45px; } 
.main .con_tit { position: absolute; top: 140px; left: 50%; margin-left: -350px; z-index: 3; } 
.main .con_tit .clamp-sub { margin-bottom: 15px; color: #000000; font-size: 32px; font-weight: bold; } 
.main .con_tit .clamp-text { font-size: 46px; font-weight: 700; } 
.main .con_tit .clamp-title { font-size: 98px; font-weight: 900; margin: 40px auto 75px; color: #fff; } 
.main .con_tit .btn { color:#fff; background: #000; border-radius: 3px; font-size: 28px; width: 400px; display: block; line-height: 80px; margin: 0 auto; } 

/* evCon1 */
.evCon1 .box_wrap { display: flex; gap:20px } 
.evCon1 .box_wrap li { flex:1; font-size: 24px; background:#ffe2ec; gap:10px; height: 195px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 20px; } 

/* evCon2 */
.evCon2 { background-color: #f5f5f5; } 
.evCon2 .box_wrap { display: flex; align-items: center; justify-content: center; gap: 40px; } 
.evCon2 .box_wrap .box { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 310px; width: 310px; border-radius: 50%; background: #fff; border: 1px solid #ddd; } 
.evCon2 .box_wrap .box p { margin-top: 14px; line-height: 1.4; color: #000000; font-size: 24px; } 
.evCon2 .tiny_noti { display: block; width: 100%; margin-top: 10px; line-height: 1.3; color: #999999; font-size: 13px; font-weight: 300; text-align: right; } 


/* evCon3 */
.evCon3 { background-color: #ffe9e9; } 
.evCon3 .box { background: #fff; justify-content: flex-end; gap: 50px; padding: 50px; border-radius: 10px; align-items: flex-start; } 
.evCon3 .box .years li { position: relative; } 
.evCon3 .box .txt { text-align: left; font-size: 18px; display: flex; flex-direction: column; gap: 20px; margin-right: 50px; } 

.evCon3 {background: #eee url(https://image.megagong.net/m/2024/0806_sbbrief/240912/con3_bg.jpg) no-repeat; background-size: auto 100%;}

/* evCon4 */
.evCon4 { overflow-y: visible !important; overflow-x: clip !important; } 
.evCon4 .circle_txt { position: relative; margin-bottom: 25px; } 
.evCon4 .circle_txt::before { content: ''; display: block; width: 100%; height: 1%; background: #000; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } 
.evCon4 .circle_txt span { position: relative; padding: 6px 52px; background: linear-gradient(90deg, #ff377b, #ff9c1f); font-size: 24px; display: block; width: fit-content; margin: 0 auto; font-weight: 700; color: #fff; border-radius: 30px; } 

.evCon4 .box { background: #f5f5f5; font-size: 20px; padding: 43px 0; position: relative; margin-bottom: 40px; } 
.evCon4 .box a { font-size: 14px; color: #fff; background: black; padding: 3px 17px; border-radius: 3px; margin-left: 10px; } 
.evCon4 .box .circle_txt { margin: 0; position: absolute; left: 50%; transform: translateX(-50%); top: -30px; } 
.evCon4 .box .circle_txt::before { display: none; } 
.evCon4 .num_list ul { justify-content: space-between; gap: 20px; } 
.evCon4 .special_box { background: #f5f5f5; margin-top: 40px; display: flex; padding: 22px 0; align-items: center; justify-content: center; } 
.evCon4 .special_box > i { font-size: 14px; color: #fff; background: linear-gradient(90deg, #ff377b, #ff9c1f); width: 70px; line-height: 70px; border-radius: 50%; font-style: normal; } 
.evCon4 .special_box p { display: flex; flex-direction: column; align-items: flex-start; margin: 0 30px 0 15px; } 
.evCon4 .special_box p b { font-size: 24px; color: #ff0057; } 
.evCon4 .special_box p span { font-size: 12px; color: #666; } 
.evCon4 .special_box ul { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; justify-content: center; font-size: 16px; } 
.evCon4 .special_box ul li { display: flex; gap: 5px; align-items: center; } 

.evCon4 .btn_wrap { position: relative; display: flex; align-items: center; justify-content: center; gap: 20px; max-width: 780px; margin: 40px auto 0; } 
.evCon4 .btn_wrap .btn { display: flex; flex-direction: row; align-items: center; justify-content: center; flex: 1; height: 80px; font-size: 20px; font-weight: bold; border-radius: 5px; } 
.evCon4 .btn_wrap .btn_apply { color: #fff; background-color: #000; } 
.evCon4 .btn_wrap .btn_apply.done { color: #999999; background-color: #dddddd; } 
.evCon4 .btn_wrap .btn_noti { color: #000; border: 2px solid #000000; } 


#popupFadeInTerms { top: 120px; right: 0; width: 660px; z-index: 1; } 
#popupFadeInTerms .content_area { border: 1px solid #333; } 
#popupFadeInTerms .content_area p { position: relative; padding-left: 14px; color: #666666; font-size: 16px; font-weight: 400; text-align: left; } 
#popupFadeInTerms .content_area p::before { position: absolute; top: 0; left: 0; content: '-'; } 
#popupFadeInTerms .content_area p.red { color: #ff0057; } 

/* evCon5 */
.evCon5 { background-color: #ffc4d8; } 
.evCon5 .con_box { margin: 0 -10px; } 
.evCon5 .top { margin-top: -50px; } 
.evCon5 .top_next, .evCon5 .bottom,.evCon5 .bottom_next { display: flex; flex-direction: row; align-items: center; justify-content: space-between; } 
.evCon5 .top_next { gap: 85px; justify-content: center; } 
.evCon5 .bottom_next { margin-top: 40px; } 
.evCon5 .divider { display: flex; flex-direction: row; align-items: center; justify-content: center; max-width: 1080px; margin: 0 auto; margin-top: 48px; margin-bottom: 52px; } 
.evCon5 .divider .line { flex: 1; height: 1px; border-top: 1px dashed #999999; } 
.evCon5 .divider .img { margin: 0 14px; } 
.evCon5 .noti { display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 1080px; margin: 0 auto; margin-top: 80px; } 
.evCon5 .noti .noti_title { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 20px; width: 100%; margin-bottom: 35px; } 
.evCon5 .noti .noti_title h6 { color: #000000; font-size: 16px; font-weight: 500; } 
.evCon5 .noti .noti_title i { flex: 1; height: 1px; background-color: #000000; } 
.evCon5 .noti .noti_text { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 5px; width: 100%; } 
.evCon5 .noti .noti_text p { position: relative; /* padding-left: 12px; */color: #333; font-size: 13px; font-weight: 400; text-align: left; /* text-indent: -12px; */display: flex; gap: 6px; } 
/* .evCon5 .noti .noti_text p::before { position: absolute; top: 0; left: 0; content: '---'; } */


.event1 { background: #e9e9e9; } 
.event1 .con_tit .end::after { background: #f474a0; } 
.event1 .tag { width: min(348px,35%); display: block; margin: 0 auto 40px; } 
.event1 .gift { margin: 80px -95px; } 
.event1.evSection .event_step { align-items: stretch; } 
.event1.evSection .event_step .step { height: auto; justify-content: center; } 
.event1.evSection .event_step .step .btns li + li { margin-top: 10px; } 
.event1.evSection .event_step .step .btns li a { display: block; height: auto; line-height: normal; margin: 0; width: auto; } 
.event1.evSection .event_step .step p { font-size: 18px; font-weight: 500; } 
.event1.evSection .event_step .step span { color: #ff377b; margin-bottom: 15px; font-size: 20px; } 
.event1.evSection .event_step .step i.custom_option { font-size: 13px; color: #ff377b; margin-top: 20px !important; justify-content: center; } 
.event1.evSection .eventBoard { margin-top: 40px; } 
.event1.evSection .eventBoard .evtBoard_common { background: #ff377b; } 
.event1.evSection .eventBoard .evtBoard_common .info_wrap.with_tip button,
.event1.evSection .eventBoard .evtBoard_common .info_wrap .tip_list { color:#fff } 
.event1 .shareList.ver2 ul li dl.sns dt { background-color: #000; color:#ff377b } 
.event1 .shareList.ver2 ul li dl.naver dt { background-color: #000; color:#04c75b } 
.event1 .shareList.ver2 ul li dl.daum dt { background-color: #000; color:#fae100 } 
.event1 .shareList.ver2 ul li dl.etc dt { background-color: #000; color:#fff } 
.event1 .shareList.ver2 ul li dl.sns dd,.event1 .shareList.ver2 ul li dl.naver dd,
.event1 .shareList.ver2 ul li dl.daum dd,.event1 .shareList.ver2 ul li dl.etc dd { border:1px solid #dddd; color:#999; background: #f5f5f5; } 

.warningList li ul li a { font-size: 13px; color: #ff377b; padding: 0; border-bottom: 1px solid; } 

.admin_btn_wrap { display: flex; flex-direction: row; align-items: center; justify-content: center; margin-top: 50px; } 
.admin_btn { display: flex; flex-direction: row; align-items: center; justify-content: center; width: 490px; height: 60px; color: #000; font-size: 20px; font-weight: bold; font-family: 'NotoSans KR'; background-color: #fff; border: 3px solid #000; border-radius: 3px; } 

/* ´Ù½Ãº¸±â ¿µ¿ª & ÆË¾÷ */
.evCon4 {background: #ffe2ec;}
.evCon4 .agenda_list {justify-content: center; gap: 40px;}
.evCon4 .agenda_list li {background: #fff; border-radius: 15px; padding: 45px 0;}
.evCon4 .agenda_list li .btn a {display: block; font-weight: 700; font-size: 20px; color: #fff; background: #000; width: 260px; margin: 0 auto; border-radius: 3px; padding: 16px 0;}
.evCon4 .agenda_list li .btn a + a {margin-top: 10px;}

.replayPopup .content_inner {font-weight: 400; font-size: 16px; color: #666; font-family: var(--font); text-align: center; line-height: 1.5; background-color: #fff; border: 1px solid #333; padding: 40px 0;}
.replayPopup .content_inner b {color: #ff0057;}
.replayPopup .dim .mg_btn_base.sm {color: #fff; background: #333; border-color: #868484;}

@media screen and (max-width: 1600px){
 .main .inner { width: 100%; } 
 .main .clamp-sub { font-size: clamp(13px,2vmin,20px); letter-spacing: .5rem; padding: 2% 0; } 
 .main .clamp-sub i { padding: 2px 10px; font-size: clamp(11px,2vmin,16px); } 
 .main ul.flex li:nth-child(odd) img { width: 80%; } 
 .main ul.flex li:last-child { margin-right: -7%; } 
 .main ul.flex li:nth-child(odd) a { margin: 0; font-size: clamp(10px,2vmin,18px); bottom: 4%; left: 48%; min-width: 120px; width: fit-content; } 
 .main .con_tit { top: 50%; transform: translate(-52%, -50%); margin: 0; padding-top: 4%; width: 430px; } 
 .main .con_tit .clamp-text { font-size: clamp(15px,4.6vmin,46px); } 
 .main .con_tit .clamp-title { font-size: clamp(18px,8.5vmin,98px); margin: 0 auto 2%; text-shadow: 1px 3px 7px #0000009e; } 
 .main .con_tit .btn { font-size: clamp(13px,3vmin,28px); line-height: clamp(35px,8vmin,80px); width: clamp(150px,40vmin,400px); border-radius: clamp(5px,1vmin,10px); } 
 }
@media screen and (max-width: 1200px){
 .evSection:not(.evtoggleWarning,.main) { padding: 16% 0; } 
 .evSection .clamp-title { font-size: clamp(16px,4.5vmin,46px); margin: 0 auto 7%; } 
 .evSection .clamp-title.under { margin-bottom: 7%; } 
 .clamp-text { font-size: clamp(15px,2vmin,20px); } 

 .evCon1 .box_wrap li { font-size: clamp(15px,3vmin,24px); } 

 .evCon2 .box_wrap { gap: 10px; } 
 .evCon2 .box_wrap .box { height: 250px; width: 250px; } 
 .evCon2 .box_wrap .box p { margin-top: 5px; font-size: clamp(15px,2.4vmin,24px); } 
 .evCon2 .tiny_noti { font-size: clamp(11px,1.5vmin,13px); } 

 .evCon4 .tiny_noti { font-size: clamp(11px,1.5vmin,13px); } 
 .evCon4 .circle_txt span { font-size: clamp(15px,2.5vmin,24px); padding: 3px 20px; } 
 .evCon4 .box { font-size: clamp(15px,2vmin,20px); padding: 7% 0; } 
 .evCon4 .box .circle_txt { top: -15px; } 
 .evCon4 .special_box p b { font-size: clamp(15px,2.5vmin,24px); } 
 .evCon4 .special_box ul { font-size: clamp(14px,2vmin,16px); } 
 .evCon4 .btn_wrap { gap: 10px; margin-top: 8%; } 
 .evCon4 .btn_wrap .btn { height: clamp(40px,10vmin,80px); font-size: clamp(13px,2vmin,20px); } 
 .evCon4 .btn_wrap .btn_apply.done { color: #999999; background-color: #dddddd; } 
 .evCon4 .btn_wrap .btn_noti { color: #000; border: 2px solid #000000; } 

 .evCon5 .con_box { margin: 0 auto; } 
 .evCon5 .divider { margin: 7% auto; } 
 .evCon5 .top_next { gap: 5%; } 
 .evCon5 .top_next > img { width: 32%; } 
 .evCon5 .top_next > img + img { width: 60%; } 
 .evCon5 .bottom_next > img { width: 33%; } 
 .evCon5 .bottom_next > img:nth-child(3) { width: 22%; } 
 .evCon5 .bottom > img { width: 32%; } 

 .evCon5 .noti { margin-top: 10%; } 
 .evCon5 .noti .noti_title { margin-bottom: 5%; } 
 .evCon5 .noti .noti_title h6 { font-size: clamp(13px,2vmin,16px); } 
 .evCon5 .noti .noti_text p { font-size: clamp(11px,1.5vmin,12px); } 

 .event1 .tag { margin-bottom: 3%; } 
 .event1 .gift { margin: 10% -20%; overflow: hidden; } 
 .eventBoard .evtBoard_common .info_wrap .tip_list { font-size: clamp(11px,1.5vmin, 14px); } 
 .admin_btn { font-size: clamp(15px,2vmin,20px); height: clamp(50px,6vmin,60px); width: min(90%,490px); } 

 /* ´Ù½Ãº¸±â ¿µ¿ª & ÆË¾÷ */
 .evCon4 .agenda_list {gap: 2vmin;}
 .evCon4 .agenda_list li {padding: 4vmin 0;}
 .evCon4 .agenda_list li .btn a {font-size: clamp(14px, 2.4vmin, 20px); width: 90%; padding: 2vmin 0;}
.replayPopup .content_inner {font-size: clamp(12px, 2.6vmin, 16px); padding: 4vmin 0;}
 }

@media screen and (max-width: 768px){
 .main .clamp-sub { letter-spacing: normal; } 
 .main ul.flex { padding-top: 3%; margin: 0 -10%; } 
 .main .con_tit { width: min(430px,45%); } 
 .main + .btn {background: #000;color: #fff;font-size: clamp(15px,3vmin,28px);line-height: clamp(45px,8vmin,80px);} 
 .main + .btn.on {background: #ff0057;} 
 .main + .btn a {display: block;height: 100%;} 

 
 .evCon1 .box_wrap { flex-direction: column; gap: 10px; } 
 .evCon1 .box_wrap li { height: auto; padding: 3% 5% 5%; border-radius: 5px; width: min(600px,100%); margin: 0 auto; } 


 .evCon2 .box_wrap { flex-direction: column; } 
 .evCon2 .box_wrap .box { flex-direction: row; width: min(600px,100%); height: auto; border-radius: 5px; padding: 3% 0; gap: 10px; } 
 .evCon2 .box_wrap .box img { width: min(100px,20%); } 

 .evCon3 .box { padding: 8% 5%; gap: clamp(10px,2vmin,20px); } 
 .evCon3 .box .years { width: 30%; } 
 .evCon3 .box .txt { gap: 5px; font-size: clamp(12px,2vmin,18px); margin: 0; } 

 .evCon4 .tab_base { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 1px; } 
 .evCon4 .tab_base li { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; flex: 1; background-color: #f5f5f5; } 
 .evCon4 .tab_base li.on a { color: #000; font-weight: bold; } 
 .evCon4 .tab_base li::before { position: absolute; left: 0; bottom: 0; content: ''; width: 100%; height: 2px; background-color: #000; } 
 .evCon4 .tab_base li.on { background-color: #fff; border-top: 2px solid #000; border-left: 2px solid #000; border-right: 2px solid #000; } 
 .evCon4 .tab_base li.on::before { display: none; } 

 .evCon4 .box { display: flex; flex-direction: column; gap: 10px; } 
 .evCon4 .box a { width: fit-content; margin: 0 auto; font-size: clamp(11px,1.5vmin,14px); } 
 .evCon4 .box .circle_txt { top: clamp(-12px,-1.5vmin,-15px); } 
 .evCon4 .special_box { flex-wrap: wrap; gap: 15px 0; margin-top: 20px; } 
 .evCon4 .special_box > i { width: clamp(50px,7vmin,70px); line-height: clamp(50px,7vmin,70px); font-size: clamp(12px,1.5vmin,14px); } 
 .evCon4 .special_box ul { width: 300px; } 
 .evCon4 .tab_wrap .desc { padding: 5% 0; background: #ffe2ec; margin-top: 20px; } 
 .evCon4 .tab_wrap .desc dt { color: #ff0057; font-size: clamp(15px,4vmin,22px) !important; font-weight: 900; margin-bottom: 10px; } 
 .evCon4 .tab_wrap .desc dd { font-size: clamp(13px,2.8vmin,18px); } 


 .evCon4 .tab_base li a { line-height: clamp(40px,7vmin,70px); font-size: clamp(15px,3vmin,26px); color: #999; font-weight: 400; width: 100%; } 
 .evCon4 .tab_base li img { left: 20%; } 
 .evCon5 .top { margin-bottom: 30px; } 
 .evCon5 .top_next, .evCon5 .bottom, .evCon5 .bottom_next { flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 2%; max-width: 500px; margin: 0 auto; } 
 .evCon5 .top_next > img + img { width: 90%; } 
 .evCon5 .top_next > img, .evCon5 .bottom > img, .evCon5 .bottom_next > img { width: 49%; } 
 .evCon5 .top_next > img:first-child, .evCon5 .bottom > img:first-child { margin: 0 25% 5%; } 
 .evCon5 .bottom_next > img:first-child {/* margin: 0 25% 0; */width: 31%;} 
 .evCon5 .bottom_next > img:last-child { margin-top: 5%; } 
 .evCon5 .bottom_next { margin-top: 8%; } 
 
 .event1.evSection .event_step .step .btns li a { width: 200px; margin: 0 auto; } 
 .event1.evSection .event_step .step p { font-size: clamp(13px,2vmin,18px); } 
 .event1.evSection .event_step .step span { font-size: clamp(15px,2vmin,20px); margin-bottom: 10px; } 
 .event1.evSection .event_step .step i.custom_option { font-size: clamp(11px,1.5vmin,13px); } 


 [class*=mg_popup_wrap] .content_area .content_inner { padding: 5% 3%; } 
 #popupFadeInTerms { /* top: 185px; */width: 100%; top: 150%; } 
 #popupFadeInTerms .content_area p { font-size: 12px; } 

 .evCon4 .agenda_list {flex-direction: column;}
 .evCon4 .agenda_list li .content {width: 80%; margin: 0 auto;}
 }
