@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");

body,
html {-webkit-text-size-adjust: none;}
body {font-family: "Pretendard Variable", "Malgun Gothic", "맑은 고딕", sans-serif;}
footer {margin-top:0;}

/* ========== global  ========== */
:root {
  --base-width:760;
  --unit:calc(100vw / var(--base-width));
}

.firstExam {position:relative; min-width:320px;}
.firstExam * {box-sizing:border-box;}
.firstExam section {position:relative; -webkit-text-size-adjust:none;}
.firstExam .evt_area {position:relative; width:100%;}
.firstExam .evt_inner {position:relative; padding:0 5.26vw; margin:0 auto;}
.firstExam .tit_wrap, 
.firstExam .img_wrap {position:relative; text-align:center; margin:0 auto;}
.firstExam .img_wrap img {display:block; max-width:100%;}


/* text */
.sr-only {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}

.nt_txt {margin-top:2.63vw; line-height:1; font-size:2.89vw; font-weight:500; color:rgba(0,0,0,.5); text-align:center;}


/* button */
.firstExam .btn_wrap {text-align:center; margin-top:6.58vw;}
.firstExam .btn_wrap a {display:inline-block;}
.firstExam .btn_wrap a + a {margin-top:2.63vw;}
.firstExam .btn_wrap a img {width:max(calc(320px * 0.6579), 65.79vw); height:max(calc(320px * 0.1053), 10.53vw);}

/* PC version */
.pc-more_btn {padding:1.3rem 1rem; background-color:#fff; text-align:center;}
.pc-more_btn a {display:block; padding:1rem 0; font-weight:bold; background:#f5f5f5;}
.pc-more_btn .btn_box1 {overflow:hidden; display:inline-block; background-color:#fff; min-width:6.1rem;
padding:0.5rem 0.8rem 0.4rem; border: 0.1rem solid #696e7a; color: #3f3f3f; text-align:center;  vertical-align:middle;}


/* ========== contents  ========== */
/* evt_title  */
.evt_title .group_gravity {position:absolute; left:0; right:0; bottom:max(calc(320px * 0.3645), 36.45vw); text-align:center;}
.evt_title .list_period {display:inline-grid; grid-template-columns:1fr max-content; column-gap:2.37vw; row-gap:2.37vw; align-items:center; text-align:left;}
.evt_title .list_period dt, 
.evt_title .list_period dd {line-height:5.26vw; font-size:max(calc(320px * 0.0408), 4.08vw); color:#fff; font-weight:600; vertical-align:middle; letter-spacing:-1px;}
.evt_title .list_period dt {height:5.26vw; padding:0 2.89vw; font-size:max(calc(320px * 0.0342), 3.42vw); text-align:center; letter-spacing:-0.125vw; background:#000; border-radius:19px;}

.evt_title .evt_link {display:inline-flex; gap:2.63vw; position:absolute; bottom:max(calc(320px * 0.1184), 11.84vw);  padding:0 2.63vw; margin:calc(52 * var(--unit)) 0 0;}


/* cont1 */
#cont1 {padding-bottom:13.16vw; background:#2B007F;}

.evt_scroll {padding-top:14.08vw;}
.evt_box {position:relative; padding:7.89vw 5.26vw 6.58vw; background:#fff; border-top:3px solid #FA6747; border-radius:0 0 3.42vw 3.42vw;}
.evt_box.t2 {padding:9.21vw;}


.evt_box .box_tit {position:absolute; top:-3.68vw; left:50%; transform:translateX(-50%); width:calc(312 * var(--unit)); height:calc(57 * var(--unit));}
.evt_box .box_tit img {width:max(calc(320px * 0.4105), 41.05vw); height:max(calc(320px * 0.0750), 7.50vw);}

.evt_box .evt_step {}
.evt_box .evt_step > li {position:relative; margin-top:calc(25 * var(--unit));}
.evt_box .evt_step > li:first-child {margin-top:0;}
.evt_box .evt_step.t1 > li::after {content:''; display:block; position:absolute; top:-2.63vw; left:0; right:0; width:3.95vw; height:2.37vw; margin:0 auto; background:url("https://next.megastudy.net/design_guide/unistudy/260428/firstExam/mo/images/con01_step_arrow.png") no-repeat 0 / cover;}
.evt_box .evt_step.t1 > li:first-child::after {display:none;}

.evt_box .evt_step .sub_tit_wrap {margin-bottom:calc(30 * var(--unit));}
.evt_box .evt_step .step_wrap .nt_txt {margin-top:calc(10 * var(--unit)); text-align:left;}
.evt_box .evt_step .step_wrap .nt_txt li {font-size:calc(16 * var(--unit)); color:rgba(0, 0, 0, 0.5);}
.evt_box .evt_step .step_wrap + .step_wrap {margin-top:calc(50 * var(--unit));}

.input_group {padding:2.63vw 6.05vw; margin-top:calc(30 * var(--unit)); background:rgba(243,243,243,.5);}
.input_group * {border-radius:0 !important;}
.input_group li {display:grid; grid-template-columns:11.58vw 1fr; margin-top:1.32vw; text-align:left;}
.input_group input {width:100%; height:5.92vw; padding:0 1.32vw; font-size:calc(22 * var(--unit)); border:1px solid #3F3F3F;}
.input_group input::placeholder {font-size:calc(22 * var(--unit));}
.input_group .item_name {line-height:5.92vw; font-size:calc(22 * var(--unit)); font-weight:500;}

.input_group .input-btn {font-size:0;}
.input_group .input-btn * {display:inline-block; vertical-align:top;}
.input_group .input-btn input {width:calc(100% - calc(83 * var(--unit)));}
.input_group .input-btn button {width:calc(83 * var(--unit)); height:calc(45 * var(--unit)); font-size:calc(18 * var(--unit)); font-weight:700; color:#fff; background:#743FE0;}

.textarea_group {position:relative; width:100%;}
.textarea_group .textarea {width:100%; height:16.05vw; padding:1.97vw 1.45vw; resize:none; font-size:calc(22 * var(--unit)); background:#fff; border:1px solid #3F3F3F;}
.textarea_group .placeholder {position:absolute; top:1.97vw; left:1.97vw; color:rgba(34,34,34,.4); font-size:calc(22 * var(--unit)); pointer-events:none;}
.textarea_group .placeholder .highlight {color:rgba(255,79,40,.4);}
.textarea_group.is-value .placeholder {display:none;}

.upload_item .upload_btn {display:block; width:100%; height:6.58vw; text-align:center; cursor:pointer; background:#743FE0;}
.upload_item.is_full .upload_btn {background:#bbb; cursor:default; pointer-events:none;}
.upload_item .upload_btn .file_input {display:none;}
.upload_item .upload_btn .file_input + span {line-height:6.58vw; font-size:2.37vw; font-weight:700; color:#fff;}
.upload_item .upload_btn .file_input + span i {display:inline-block; width:2.50vw; height:1.97vw; margin-left:1.05vw; background:url("https://next.megastudy.net/design_guide/unistudy/260428/firstExam/mo/images/ic_upload.png") no-repeat 0 / cover;}
.upload_item .upload_image {display:flex; justify-content:center; align-items:center; gap:2.63vw; position:relative; width:100%; height:36.84vw; background:#F3F3F3;}
.upload_item .upload_image .no_img {width:max(calc(320px * 0.1684), 16.84vw); height:max(calc(320px * 0.1645), 16.45vw);}
.upload_item .upload_image .image-box {position:relative;}
.upload_item .upload_image .image-box img {display:block; width:28.95vw; height:28.95vw; object-fit:cover;}
.upload_item .upload_image .btn_remove {position:absolute; top:0; right:0; width:4.87vw; height:4.87vw; text-indent:-9999px; background: url('https://next.megastudy.net/design_guide/unistudy/260428/firstExam/mo/images/btn_del.png') no-repeat center / cover; border-radius:0; cursor:pointer;}


/* cont2 */
#cont2 {padding-bottom:13.16vw; background:#E7FFDE;}
#cont2 .bnr_wrap {margin:11.84vw 0 10.53vw;}

#cont2 .evt_prize {position:relative;}
#cont2 .evt_prize .prize_box {position:absolute; left:0; right:0; bottom:max(calc(320px * 0.0658), 6.58vw); padding-bottom:max(calc(320px * 0.0658), 6.58vw); text-align:center;}
#cont2 .evt_prize .prize_box * {line-height:1.25;}
#cont2 .evt_prize .prize_box h4 {margin-bottom:max(calc(320px * 0.0461), 4.61vw); font-size:max(calc(320px * 0.0447), 4.47vw); font-weight:500;}
#cont2 .evt_prize .prize_box h4 strong {font-weight:700;}

#cont2 .evt_prize .prize_info {display:inline-block; position:relative;}
#cont2 .evt_prize .prize_info img {width:max(calc(320px * 0.4303), 43.03vw); height:max(calc(320px * 0.2684), 26.84vw);}
#cont2 .evt_prize .prize_info .num {display:flex; justify-content:center; align-items:center; position:absolute; top:max(calc(320px * -0.0263), -2.63vw); right:max(calc(320px * -0.0474), -4.74vw); width:max(calc(320px * 0.0987), 9.87vw); height:max(calc(320px * 0.0987), 9.87vw); border-radius:100%; background:#000;}
#cont2 .evt_prize .prize_info .num span {font-size:max(calc(320px * 0.0263), 2.63vw); font-weight:500; color:#fff;}
#cont2 .evt_prize .prize_name {margin-top:max(calc(320px * 0.0263), 2.63vw); font-size:max(calc(320px * 0.0316), 3.16vw); font-weight:500;}


.comment_box {padding:0 5.26vw 13.16vw; background:#fff;}
.comment_box .text_area {margin-bottom:5.26vw;}
.comment_box .text_area > p {margin-top:1.58vw; font-size:2.11vw; font-weight:400; color:#3F3F3F;}
.comment_box .txtarea_btn {display:flex; height:18.42vw;}
.comment_box .txtarea_btn textarea {flex:1; resize:none; height:100%; background:#FFF5D7; border:1px solid #585858; border-radius:0;}
.comment_box .txtarea_btn button {width:19.74vw; height:100%; line-height:4.47vw; font-size:3.68vw; font-weight:600; color:#fff; background:#3F3F3F;}

.comment_box .remark_txt {margin-top:2.63vw;}
.comment_box .remark_txt p {margin-left:1.32vw; text-indent:-1.32vw; font-size:calc(16 * var(--unit)); color:#3f3f3f; letter-spacing:-1px;}

.comment_box .board_pagination {margin-bottom:0;}

#templateMemoList p {font-size:calc(22 * var(--unit)) !important;}
#templateMemoList .cont p {text-align:left;}


/* noticeWrap */
/* .noticeWrap {width:auto; margin-top:57px; margin-top:7.5%;} */
.noticeWrap_title {display:block; margin:0 auto; padding:0.8rem 0 0.7rem; background:rgba(0, 0, 0, 0.3); font-size:4.2vw; font-weight:normal; text-align:center; cursor:pointer;}
.noticeWrap_title.sub {margin-bottom:0.5rem; padding:0; background:none; font-weight:bold; font-size:3.6vw; color:#3f3f3f; text-align:left;}
.noticeWrap_list + .noticeWrap_title {margin-top:5vw;}
.noticeWrap_txt {display:inline-block; position:relative; padding:0 1rem 0 0; font-weight:bold; color: #fff;}
.noticeWrap_txt:before {position:absolute; right:-2vw; top:50%; z-index:3; font-size:calc(100% - 1vw); content:"▼"; transform: translateY(-50%);}
.noticeWrap.on .noticeWrap_txt:before {content: "▲";}
.noticeWrap_inner {display:none; margin: 0; padding: 1rem; background: #fff;}
.noticeWrap_item {margin-top:2.63vw;}
.noticeWrap_item:first-child {margin-top:0;}
.noticeWrap_list {position: relative;}
.notice_item {position: relative; padding: 0 0 0 0.7rem; margin-bottom: 0.2rem; font-size:3.2vw; line-height: 1.4; letter-spacing: -0.5px; color: #3f3f3f; word-break: keep-all; word-wrap: break-word;}
.notice_item:before {position: absolute; left: 0; top: 0; z-index: 3; content: "-";}
.notice_link {display: inline-block; font-weight:bold; font-size:inherit; color:#2D65E8; text-decoration:underline;}
.notice_item .highlight {color:#ff8900;}


/* ========== popup  ========== */
/* winner-popup-overlay */
.winner-popup-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 0.5s, opacity 0.5s ease-out;
}
.winner-popup-overlay.active {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity 0.5s ease-out;
}
.winner-popup-mszie {
  width: 100%;
  max-width: 375px;
  margin: 0 auto;
}
.winner-popup-content {
  min-width: 80%;
  max-width: 90%;
  margin: 0 auto;
  padding: 2rem 0 0;
  background: #fff;
  border-radius: 25px;
  text-align: center;
  transform: scale(0.8);
  transition: transform 0.3s ease-out;
}
.winner-popup-overlay.active .winner-popup-content {
  transform: scale(1);
}
.winner-popup-content h2 {
  padding: 0 0 2rem;
  border-bottom: 1px dashed #598bf4;
}
.winner-popup-content h2 > img {
  width: 64%;
  margin: 0 auto;
}
.winner-popup-content .winning-prize h3 {
  margin: 1.5rem 0;
  font-weight: bold;
  font-size: 15px;
  letter-spacing: -0.5px;
  color: #333;
  text-align: center;
}
.winner-popup-content .item-img {
  display: flex;
  margin: 0 0 2rem;
  align-items: center;
  justify-content: center;
}
.winner-popup-content .item-img > img {
  display: block;
  width: auto;
  height: auto;
  max-width: 150px;
  max-height: 150px;
}
.close-popup-button {
  display: block;
  width: 100%;
  padding: 1.5rem 0;
  background: #307ef9;
  border-radius: 0 0 25px 25px;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  text-align: center;
  cursor: pointer;
}
@media screen and (orientation: landscape) {
  .winner-popup-overlay {
    position: absolute;
  }
}